/* ==========================================================================
   Hire Limited — hirelimited.com
   Palette and type carried over from the existing brand:
     #E9891A  orange, sampled from the logo swoosh
     #E9A825  amber, sampled from the live site's top bar
     #6C6D6F  grey, sampled from the logo wordmark
     #D6AD5A / #E8CB90 / #785510  the gold button gradient from the old site
   Type: Antic Slab + PT Sans — the pair the existing site already loads.
   ========================================================================== */

:root{
  --orange:#E9891A;
  --orange-lift:#FFA43A;
  --orange-deep:#C46F0C;
  --amber:#E9A825;
  --gold-1:#D6AD5A;
  --gold-2:#E8CB90;
  --brown:#785510;
  --grey:#6C6D6F;

  --create-green:#79B949;      /* CREATE brand green, for the footer credit */
  --ease:cubic-bezier(.22,.61,.36,1);

  --ink:#17181A;
  --ink-2:#212327;
  --ink-3:#2C2F34;
  --sand:#FAF6F0;
  --sand-2:#F2EBE1;
  --paper:#FFFFFF;

  --text:#23252A;
  --text-soft:#5A5D64;
  --text-invert:#F6F3EE;
  --text-invert-soft:#B9B5AF;

  --line:#E2DACE;
  --line-dark:rgba(255,255,255,.14);

  --radius:14px;
  --radius-lg:22px;
  --shadow-sm:0 2px 10px rgba(23,24,26,.07);
  --shadow:0 14px 40px rgba(23,24,26,.13);
  --shadow-lg:0 30px 70px rgba(23,24,26,.22);

  --display:"Antic Slab",Georgia,"Times New Roman",serif;
  --body:"PT Sans","Helvetica Neue",Helvetica,Arial,sans-serif;

  --wrap:1180px;
  --gut:clamp(18px,4vw,44px);
  --bar:0px; /* mobile call bar height, set in the media query */
}

*,*::before,*::after{box-sizing:border-box}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:96px;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

body{
  margin:0;
  background:var(--sand);
  color:var(--text);
  font:400 17px/1.65 var(--body);
  letter-spacing:.005em;
  /* No overflow-x here. On <body> it makes the element a scroll container,
     which detaches position:sticky from the viewport and drops the header
     mid-page. Sections clip their own bleed instead. */
  padding-bottom:var(--bar);
}

img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:400;
  line-height:1.1;
  letter-spacing:-.005em;
  margin:0 0 .5em;
  /* No max-width on headings anywhere in this file. Titles run the full measure. */
}
h1{font-size:clamp(2.5rem,6.4vw,4.6rem)}
h2{font-size:clamp(2rem,4.4vw,3.3rem)}
h3{font-size:clamp(1.3rem,2vw,1.7rem)}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}

.wrap{
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--gut);
}

section{padding-block:clamp(64px,9vw,120px)}

.eyebrow{
  font-family:var(--body);
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.19em;
  text-transform:uppercase;
  color:var(--orange-deep);
  margin:0 0 1rem;
  display:flex;
  align-items:center;
  gap:.7rem;
}
.eyebrow::after{content:"";flex:1;height:1px;background:var(--line)}
.on-dark .eyebrow{color:var(--amber)}
.on-dark .eyebrow::after{background:var(--line-dark)}

.lede{font-size:clamp(1.06rem,1.5vw,1.28rem);color:var(--text-soft)}
.on-dark{color:var(--text-invert)}
.on-dark .lede{color:var(--text-invert-soft)}

/* ---------- buttons ---------------------------------------------------- */

.btn{
  --btn-bg:var(--orange);
  --btn-fg:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  min-height:52px;
  padding:0 1.65rem;
  border:1px solid transparent;
  border-radius:999px;
  background:var(--btn-bg);
  color:var(--btn-fg);
  font-family:var(--body);
  font-weight:700;
  font-size:1rem;
  letter-spacing:.02em;
  text-decoration:none;
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;
  box-shadow:0 8px 22px rgba(233,137,26,.28);
}
.btn:hover,.btn:focus-visible{transform:translateY(-2px);box-shadow:0 14px 30px rgba(233,137,26,.34)}
.btn:active{transform:translateY(0)}

.btn--gold{
  /* the old site's button gradient, kept */
  background:linear-gradient(to top,var(--gold-1),var(--gold-2));
  color:var(--brown);
  border-color:rgba(120,85,16,.35);
  box-shadow:0 8px 22px rgba(214,173,90,.3);
}
.btn--gold:hover,.btn--gold:focus-visible{
  background:linear-gradient(to top,var(--gold-2),var(--gold-1));
  box-shadow:0 14px 30px rgba(214,173,90,.36);
}

.btn--ghost{
  background:transparent;
  color:var(--text);
  border-color:var(--line);
  box-shadow:none;
}
.btn--ghost:hover,.btn--ghost:focus-visible{border-color:var(--orange);color:var(--orange-deep);box-shadow:none}
.on-dark .btn--ghost{color:var(--text-invert);border-color:var(--line-dark)}
.on-dark .btn--ghost:hover,.on-dark .btn--ghost:focus-visible{border-color:var(--amber);color:var(--amber)}

.btn--sm{min-height:42px;padding:0 1.1rem;font-size:.9rem}

:where(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid var(--amber);
  outline-offset:3px;
  border-radius:6px;
}

/* ---------- header ----------------------------------------------------- */

.topline{
  background:var(--ink);
  color:var(--text-invert-soft);
  font-size:.85rem;
}
.topline .wrap{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.4rem 1.4rem;
  min-height:42px;
  padding-block:.4rem;
}
.topline a{color:var(--text-invert);text-decoration:none;font-weight:700}
.topline a:hover{color:var(--amber)}
.topline .sep{color:rgba(255,255,255,.22)}
.topline .push{margin-left:auto;color:var(--text-invert-soft);font-weight:400}

.site-head{
  position:sticky;
  top:0;
  z-index:60;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .2s ease;
}
.site-head.is-stuck{box-shadow:0 6px 24px rgba(23,24,26,.09)}
.site-head .wrap{
  display:flex;
  align-items:center;
  gap:1rem;
  min-height:78px;
}
.brand{display:flex;align-items:center;text-decoration:none;flex:0 0 auto}
.brand img{width:clamp(132px,17vw,176px)}

.nav{margin-left:auto;display:flex;align-items:center;gap:.35rem}
.nav a{
  padding:.55rem .8rem;
  border-radius:8px;
  text-decoration:none;
  font-weight:700;
  font-size:.95rem;
  color:var(--text);
  position:relative;
  transition:color .16s ease,background .16s ease;
}
.nav a::after{
  content:"";
  position:absolute;
  left:.8rem;right:.8rem;bottom:.34rem;
  height:2px;
  background:var(--orange);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .22s ease;
}
.nav a:hover,.nav a.is-active{color:var(--orange-deep)}
.nav a:hover::after,.nav a.is-active::after{transform:scaleX(1)}
.head-cta{margin-left:.5rem}

.burger{
  display:none;
  margin-left:auto;
  width:46px;height:46px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  align-items:center;
  justify-content:center;
}
.burger span{
  display:block;width:20px;height:2px;background:var(--text);
  position:relative;transition:transform .2s ease,background .2s ease;
}
.burger span::before,.burger span::after{
  content:"";position:absolute;left:0;width:20px;height:2px;background:var(--text);
  transition:transform .2s ease,top .2s ease;
}
.burger span::before{top:-6px}
.burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

/* ---------- hero ------------------------------------------------------- */

.hero{
  position:relative;
  background:var(--ink);
  color:var(--text-invert);
  padding-block:clamp(72px,11vw,132px) clamp(150px,17vw,210px);
  overflow:hidden;
  isolation:isolate;
}
.hero__media{
  position:absolute;
  inset:0;
  z-index:-2;
}
.hero__media img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:66% 52%;
  transform:scale(1.06);
  will-change:transform;
}
.hero::after{
  content:"";
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(180deg,rgba(17,18,20,.62) 0%,rgba(17,18,20,.22) 28%,rgba(17,18,20,.62) 74%,rgba(23,24,26,.99) 100%),
    linear-gradient(95deg,rgba(17,18,20,.88) 0%,rgba(17,18,20,.62) 34%,rgba(17,18,20,.12) 72%,rgba(17,18,20,0) 100%);
}
.hero .wrap{position:relative;z-index:1}

.hero h1{
  color:#fff;
  margin-bottom:.35em;
  text-shadow:0 2px 24px rgba(0,0,0,.35);
}
.hero h1 em{font-style:normal;color:var(--amber)}
.hero__sub{
  font-size:clamp(1.1rem,1.9vw,1.45rem);
  color:#EDE8E1;
  max-width:none;
  margin-bottom:1.8rem;
}
.hero__actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-bottom:2.4rem}

.hero__points{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem .5rem;
  list-style:none;
  margin:0;padding:0;
}
.hero__points li{
  display:flex;align-items:center;gap:.5rem;
  padding:.45rem .95rem .45rem .75rem;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(4px);
  font-size:.9rem;
  font-weight:700;
  color:#F2EEE8;
}
.hero__points svg{width:15px;height:15px;flex:0 0 auto;color:var(--amber)}

/* ---------- the quote engine ------------------------------------------- */

.quote{
  padding-top:0;
  padding-bottom:clamp(40px,6vw,72px);
  margin-top:clamp(-140px,-14vw,-110px);
  position:relative;
  z-index:5;
}
.quote__card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
  overflow:hidden;
}
.quote__head{
  padding:clamp(22px,3.4vw,34px) clamp(20px,3.4vw,38px) 0;
}
.quote__head h2{margin-bottom:.3em;font-size:clamp(1.7rem,3.2vw,2.5rem)}
.quote__head p{color:var(--text-soft);margin-bottom:0}

.quote__grid{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  gap:0;
  align-items:stretch;
}
.quote__controls{
  padding:clamp(20px,3.4vw,34px) clamp(20px,3.4vw,38px);
  min-width:0;
}
.field{margin-bottom:1.5rem}
.field:last-child{margin-bottom:0}
.field > .label{
  display:block;
  font-weight:700;
  font-size:.8rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--text-soft);
  margin-bottom:.7rem;
}

.classes{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));  /* 3x2 — six items never orphan one */
  gap:.5rem;
}
.class-chip{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:.15rem;
  padding:.7rem .6rem;
  border:1.5px solid var(--line);
  border-radius:12px;
  background:#fff;
  cursor:pointer;
  text-align:left;
  transition:border-color .16s ease,background .16s ease,transform .16s ease;
}
.class-chip:hover{border-color:var(--gold-1);transform:translateY(-1px)}
.class-chip b{font-size:.95rem;font-weight:700;line-height:1.2}
.class-chip span{font-size:.78rem;color:var(--text-soft)}
.class-chip[aria-pressed="true"]{
  border-color:var(--orange);
  background:linear-gradient(180deg,#FFF8EE,#FFF3E0);
  box-shadow:inset 0 0 0 1px rgba(233,137,26,.28);
}
.class-chip[aria-pressed="true"] span{color:var(--orange-deep)}

.duration{
  display:flex;
  align-items:center;
  gap:.65rem;
  flex-wrap:wrap;
}
.step{
  width:46px;height:46px;
  flex:0 0 auto;
  border:1.5px solid var(--line);
  border-radius:12px;
  background:#fff;
  font-size:1.35rem;
  line-height:1;
  cursor:pointer;
  transition:border-color .16s ease,color .16s ease;
}
.step:hover{border-color:var(--orange);color:var(--orange-deep)}
.step:disabled{opacity:.35;cursor:not-allowed}
.days-read{
  flex:1 1 120px;
  min-width:0;
  text-align:center;
  font-family:var(--display);
  font-size:1.5rem;
  line-height:1.2;
}
.days-read small{display:block;font-family:var(--body);font-size:.78rem;letter-spacing:.13em;text-transform:uppercase;color:var(--text-soft)}

input[type="range"]{
  width:100%;
  margin:1rem 0 .2rem;
  accent-color:var(--orange);
  height:26px;
}
.range-ticks{
  display:flex;
  justify-content:space-between;
  font-size:.74rem;
  color:var(--text-soft);
  letter-spacing:.06em;
}

.presets{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.9rem}
.preset{
  padding:.35rem .8rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  font-size:.82rem;
  font-weight:700;
  cursor:pointer;
  transition:border-color .16s ease,color .16s ease,background .16s ease;
}
.preset:hover{border-color:var(--orange);color:var(--orange-deep)}
.preset[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}

/* result panel */
.quote__out{
  background:var(--ink);
  color:var(--text-invert);
  padding:clamp(22px,3.4vw,34px) clamp(20px,3.4vw,34px);
  display:flex;
  flex-direction:column;
  min-width:0;
  position:relative;
  overflow:hidden;
}
.quote__out::before{
  content:"";
  position:absolute;
  top:-40%;right:-30%;
  width:70%;aspect-ratio:1;
  background:radial-gradient(circle,rgba(233,168,37,.22),transparent 68%);
  pointer-events:none;
}
.out-label{
  font-size:.76rem;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--text-invert-soft);
  margin:0 0 .3rem;
}
.out-class{
  font-family:var(--display);
  font-size:1.25rem;
  color:var(--amber);
  margin:0 0 1rem;
}
.out-price{
  font-family:var(--display);
  font-size:clamp(3rem,7vw,4.3rem);
  line-height:.95;
  color:#fff;
  margin:0;
  font-variant-numeric:tabular-nums;
}
.out-price sup{font-size:.4em;top:-.34em;position:relative;margin-right:.04em;font-family:var(--body)}
.out-per{color:var(--text-invert-soft);font-size:.95rem;margin:.55rem 0 1.2rem}

.out-break{
  list-style:none;
  margin:0 0 1.2rem;
  padding:1rem 0 0;
  border-top:1px solid var(--line-dark);
  font-size:.92rem;
}
.out-break li{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:.3rem 0;
  color:var(--text-invert-soft);
}
.out-break li b{color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}

.out-save{
  display:flex;
  align-items:flex-start;
  gap:.6rem;
  padding:.8rem .9rem;
  border-radius:12px;
  background:rgba(233,168,37,.14);
  border:1px solid rgba(233,168,37,.3);
  font-size:.9rem;
  color:#FBEFD8;
  margin-bottom:1.2rem;
}
.out-save svg{width:17px;height:17px;flex:0 0 auto;margin-top:.15rem;color:var(--amber)}
.out-save[hidden]{display:none}

.out-actions{margin-top:auto;display:flex;flex-direction:column;gap:.6rem}
.out-note{font-size:.78rem;color:var(--text-invert-soft);margin:0}

/* the long-hire takeover state */
.quote__out.is-long .out-price{font-size:clamp(1.7rem,3.4vw,2.3rem);line-height:1.15}
.quote__out.is-long .out-price sup{display:none}

/* ---------- fleet ------------------------------------------------------ */

.fleet{background:var(--paper)}
.fleet-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));
  gap:clamp(16px,2.2vw,26px);
  margin-top:2.6rem;
}
.veh{
  min-width:0;
  display:flex;
  flex-direction:column;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--sand);
  overflow:hidden;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.veh:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--gold-1)}
.veh__pic{background:var(--sand-2);aspect-ratio:4/3;overflow:hidden}
.veh__pic img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.veh:hover .veh__pic img{transform:scale(1.05)}
.veh__body{padding:1.1rem 1.2rem 1.3rem;display:flex;flex-direction:column;flex:1}
.veh__body h3{margin-bottom:.25rem}
.veh__seats{font-size:.85rem;color:var(--text-soft);margin:0 0 .9rem}
.veh__rates{
  list-style:none;margin:0 0 1.1rem;padding:0;
  border-top:1px solid var(--line);
}
.veh__rates li{
  display:flex;justify-content:space-between;gap:1rem;
  padding:.42rem 0;
  border-bottom:1px solid var(--line);
  font-size:.92rem;
  color:var(--text-soft);
}
.veh__rates li b{color:var(--text);font-variant-numeric:tabular-nums}
.veh__body .btn{margin-top:auto;align-self:flex-start}

/* ---------- reasons ---------------------------------------------------- */

.reasons{background:var(--sand)}
.reason-list{list-style:none;margin:2.6rem 0 0;padding:0;counter-reset:r}
.reason-list li{
  counter-increment:r;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:clamp(16px,3vw,34px);
  align-items:start;
  padding:clamp(20px,3vw,30px) 0;
  border-top:1px solid var(--line);
}
.reason-list li:last-child{border-bottom:1px solid var(--line)}
.reason-list li::before{
  content:"0" counter(r);
  font-family:var(--display);
  font-size:clamp(1.6rem,3.4vw,2.5rem);
  line-height:1;
  color:var(--gold-1);
}
.reason-list h3{margin-bottom:.3rem}
.reason-list p{color:var(--text-soft);margin:0}

/* ---------- rates ------------------------------------------------------ */

.rates{background:var(--paper)}
.table-scroll{
  overflow-x:auto;
  margin-top:2.4rem;
  border:1px solid var(--line);
  border-radius:var(--radius);
  -webkit-overflow-scrolling:touch;
}
table.rates-table{
  width:100%;
  border-collapse:collapse;
  min-width:600px;
  font-variant-numeric:tabular-nums;
}
.rates-table caption{
  caption-side:bottom;
  text-align:left;
  padding:.9rem 1.1rem;
  font-size:.84rem;
  color:var(--text-soft);
  border-top:1px solid var(--line);
}
.rates-table th,.rates-table td{
  padding:.85rem 1.1rem;
  text-align:right;
  border-bottom:1px solid var(--line);
}
.rates-table th:first-child,.rates-table td:first-child{text-align:left}
.rates-table thead th{
  background:var(--ink);
  color:#fff;
  font-family:var(--body);
  font-weight:700;
  font-size:.8rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  border-bottom:none;
}
.rates-table tbody tr:last-child td{border-bottom:none}
.rates-table tbody tr:hover{background:var(--sand)}
.rates-table td.cell-name{font-weight:700}
.rates-table .poa{color:var(--text-soft)}

.offers{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));
  gap:clamp(14px,2vw,20px);
  margin-top:clamp(24px,3.4vw,36px);
}
.offer{
  min-width:0;
  display:flex;
  gap:.85rem;
  padding:1.15rem 1.25rem;
  border-radius:var(--radius);
  background:linear-gradient(180deg,#FFFBF3,#FDF4E4);
  border:1px solid var(--gold-2);
}
.offer svg{width:24px;height:24px;flex:0 0 auto;color:var(--orange-deep)}
.offer h3{font-size:1.08rem;margin-bottom:.2rem}
.offer p{font-size:.9rem;color:var(--text-soft);margin:0}

/* ---------- business band ---------------------------------------------- */

.business{
  position:relative;
  background:var(--ink-2);
  color:var(--text-invert);
  isolation:isolate;
  overflow:hidden;
}
.business__media{position:absolute;inset:0;z-index:-2}
.business__media img{width:100%;height:100%;object-fit:cover}
.business::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(18,19,21,.96) 0%,rgba(18,19,21,.9) 45%,rgba(18,19,21,.66) 100%);
}
.business .wrap{position:relative;z-index:1}
.biz-points{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));
  gap:clamp(16px,2.4vw,26px);
  margin:2.4rem 0;
  list-style:none;
  padding:0;
}
.biz-points li{
  min-width:0;
  padding:1.15rem 1.25rem;
  border:1px solid rgba(255,255,255,.17);
  border-radius:var(--radius);
  background:rgba(16,17,19,.66);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.biz-points b{display:block;font-family:var(--display);font-size:1.15rem;color:var(--amber);margin-bottom:.25rem}
.biz-points span{font-size:.92rem;color:var(--text-invert-soft)}

/* ---------- about ------------------------------------------------------ */

.about{background:var(--sand)}
.about__grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(26px,4.5vw,64px);
  align-items:stretch;
  margin-top:2.2rem;
}
.about__grid > *{min-width:0}
.about__pic{
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow:var(--shadow);
  background:var(--sand-2);
  height:100%;
  min-height:340px;
}
.about__pic img{width:100%;height:100%;min-height:340px;object-fit:cover}
.stat-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(140px,100%),1fr));
  gap:1.2rem;
  margin-top:2rem;
  padding-top:1.6rem;
  border-top:1px solid var(--line);
}
.stat{min-width:0}
.stat b{
  display:block;
  font-family:var(--display);
  font-size:clamp(1.7rem,3.4vw,2.4rem);
  line-height:1;
  color:var(--orange-deep);
}
.stat span{font-size:.86rem;color:var(--text-soft)}

/* ---------- contact ---------------------------------------------------- */

.contact{background:var(--paper)}
.contact__grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:clamp(26px,4vw,56px);
  align-items:start;
  margin-top:2.4rem;
}
.contact__grid > *{min-width:0}

form.enquiry{display:grid;gap:1rem}
.row2{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));
  gap:1rem;
}
.row2 > *{min-width:0}
label.fld{display:block}
label.fld > span{
  display:block;
  font-weight:700;
  font-size:.8rem;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--text-soft);
  margin-bottom:.4rem;
}
.inp{
  width:100%;
  min-height:52px;
  padding:.75rem .95rem;
  border:1.5px solid var(--line);
  border-radius:12px;
  background:var(--sand);
  transition:border-color .16s ease,background .16s ease;
}
textarea.inp{min-height:130px;resize:vertical}
.inp:focus{border-color:var(--orange);background:#fff;outline:none}
select.inp{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%235A5D64' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-size:12px;padding-right:2.6rem}

.consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.86rem;color:var(--text-soft)}
.consent input{margin-top:.28rem;width:18px;height:18px;accent-color:var(--orange);flex:0 0 auto}
.form-note{font-size:.8rem;color:var(--text-soft);margin:0}

.contact-card{
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--sand);
}
.contact-card__body{padding:1.4rem 1.5rem}
.contact-card dl{margin:0;display:grid;gap:1rem}
.contact-card dt{
  font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--text-soft);margin-bottom:.15rem;
}
.contact-card dd{margin:0;font-size:1.02rem}
.contact-card dd a{color:var(--orange-deep);font-weight:700;text-decoration:none}
.contact-card dd a:hover{text-decoration:underline}
.contact-card iframe{display:block;width:100%;height:260px;border:0;background:var(--sand-2)}

/* ---------- terms ------------------------------------------------------ */

.terms{background:var(--sand)}
.terms__list{margin-top:2.2rem;border-top:1px solid var(--line)}
.terms details{border-bottom:1px solid var(--line)}
.terms summary{
  display:flex;
  align-items:center;
  gap:1rem;
  padding:1.1rem .2rem;
  cursor:pointer;
  list-style:none;
  font-family:var(--display);
  font-size:clamp(1.05rem,1.7vw,1.25rem);
}
.terms summary::-webkit-details-marker{display:none}
.terms summary::after{
  content:"";
  margin-left:auto;
  width:11px;height:11px;
  border-right:2px solid var(--grey);
  border-bottom:2px solid var(--grey);
  transform:rotate(45deg) translateY(-3px);
  transition:transform .2s ease;
  flex:0 0 auto;
}
.terms details[open] summary::after{transform:rotate(-135deg) translateY(-3px)}
.terms summary .num{
  font-family:var(--body);
  font-weight:700;
  font-size:.8rem;
  color:var(--orange-deep);
  min-width:2.2rem;
}
.terms .term-body{padding:0 .2rem 1.4rem 3.2rem;color:var(--text-soft);font-size:.96rem}
.terms .term-body ul{margin:.5rem 0 0;padding-left:1.2rem}
.terms .term-body li{margin-bottom:.35rem}

/* ---------- footer ----------------------------------------------------- */

.site-foot{
  background:var(--ink);
  color:var(--text-invert-soft);
  padding-block:clamp(46px,6vw,72px) 0;
  font-size:.94rem;
}
.foot-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));
  gap:clamp(24px,3.4vw,48px);
  padding-bottom:2.6rem;
}
.foot-grid > *{min-width:0}
.site-foot img.foot-logo{width:170px;margin-bottom:1.1rem}
.site-foot h4{
  font-family:var(--body);
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#fff;
  margin:0 0 .9rem;
}
.site-foot ul{list-style:none;margin:0;padding:0}
.site-foot li{margin-bottom:.45rem}
.site-foot a{color:var(--text-invert-soft);text-decoration:none}
.site-foot a:hover{color:var(--amber)}
.site-foot address{font-style:normal;line-height:1.7}
.foot-bar{
  border-top:1px solid var(--line-dark);
  padding-block:1.3rem;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1.4rem;
  align-items:center;
  font-size:.84rem;
}
.foot-bar .push{margin-left:auto}
.legal-nums{color:#8C8981}

/* ---------- mobile call bar -------------------------------------------- */

.callbar{
  display:none;
  position:fixed;
  left:0;right:0;bottom:0;
  z-index:70;
  background:var(--ink);
  border-top:1px solid var(--line-dark);
  padding:.55rem .6rem calc(.55rem + env(safe-area-inset-bottom));
  gap:.5rem;
}
.callbar a{
  flex:1 1 0;
  min-width:0;
  min-height:48px;
  display:flex;align-items:center;justify-content:center;gap:.45rem;
  border-radius:10px;
  text-decoration:none;
  font-weight:700;
  font-size:.95rem;
}
.callbar .c-call{background:var(--orange);color:#fff}
.callbar .c-quote{background:rgba(255,255,255,.1);color:#fff;border:1px solid var(--line-dark)}
.callbar svg{width:17px;height:17px}

/* ---------- reveal ------------------------------------------------------ */

.rv{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}

/* ---------- responsive -------------------------------------------------- */

@media (max-width:1000px){
  .quote__grid{grid-template-columns:minmax(0,1fr)}
  .about__grid,.contact__grid{grid-template-columns:minmax(0,1fr)}
  .about__pic{order:-1}
}

@media (max-width:860px){
  .nav{
    position:fixed;
    inset:0 0 auto;
    top:var(--head-h,78px);
    flex-direction:column;
    align-items:stretch;
    gap:0;
    background:#fff;
    border-bottom:1px solid var(--line);
    padding:.6rem var(--gut) 1.1rem;
    box-shadow:0 18px 40px rgba(23,24,26,.14);
    transform:translateY(-8px);
    opacity:0;
    visibility:hidden;
    transition:opacity .2s ease,transform .2s ease,visibility .2s;
    max-height:calc(100dvh - var(--head-h,78px));
    overflow-y:auto;
  }
  .nav.is-open{opacity:1;transform:none;visibility:visible}
  .nav a{padding:.85rem .2rem;border-bottom:1px solid var(--line);font-size:1.05rem}
  .nav a::after{display:none}
  .head-cta{margin:.9rem 0 0}
  .burger{display:flex}
  .topline .push{display:none}
  .callbar{display:flex}
  body{--bar:64px}
  html{scroll-padding-top:86px}
}

@media (max-width:600px){
  :root{--gut:16px}
  body{font-size:16px}
  .hero{padding-block:56px 130px}
  .quote{margin-top:-100px}
  .reason-list li{grid-template-columns:minmax(0,1fr);gap:.4rem}
  .reason-list li::before{font-size:1.5rem}
  .terms .term-body{padding-left:.2rem}
  .out-price{font-size:clamp(2.6rem,14vw,3.4rem)}
}

@media (max-width:400px){
  :root{--gut:10px}   /* 10px minimum gutter on small phones */
}

/* ---------- print -------------------------------------------------------- */

@media print{
  .site-head,.topline,.callbar,.hero__media,.quote__controls,.burger{display:none!important}
  body{background:#fff;padding-bottom:0}
  .hero,.business,.site-foot,.quote__out{background:#fff!important;color:#000!important}
  .out-price,.out-class{color:#000!important}
}

/* six chips: two-up once three no longer fit */
@media (max-width:520px){
  .classes{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- touch targets and small-screen tidying ---------------------- */

@media (max-width:860px){
  /* utility bar links were 22px tall */
  .topline .wrap{padding-block:.15rem}
  .topline a{display:inline-block;padding-block:.62rem}

  .brand{padding-block:.35rem}

  /* five presets never divide tidily into rows: run them as one rail */
  .presets{
    flex-wrap:nowrap;
    overflow-x:auto;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:.35rem;
    margin-inline:calc(var(--gut) * -1);
    padding-inline:var(--gut);
  }
  .presets::-webkit-scrollbar{display:none}
  .preset{flex:0 0 auto;scroll-snap-align:start;min-height:42px;padding-inline:1rem}

  /* the slider needs a thumb you can actually hit */
  input[type="range"]{height:44px;margin-block:.6rem .2rem}

  .consent input{width:22px;height:22px;margin-top:.2rem}

  /* footer navigation is a list, not prose: give it real rows */
  .site-foot li{margin-bottom:0}
  .site-foot li a{display:inline-block;padding-block:.55rem}
  .site-foot address a{padding-block:.4rem}
}

/* the fleet cards read better two-up on a wide phone / small tablet */
@media (min-width:560px) and (max-width:860px){
  .fleet-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* the selected class, shown beside its price */
.class-preview{
  margin:1.6rem 0 0;
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--sand-2);
  border:1px solid var(--line);
  position:relative;
}
.class-preview img{
  width:100%;
  aspect-ratio:16/7;
  object-fit:cover;
  object-position:center 58%;
  transition:opacity .28s ease;
}
.class-preview.is-swapping img{opacity:0}
.class-preview figcaption{
  position:absolute;
  left:0;right:0;bottom:0;
  padding:1.6rem .95rem .7rem;
  background:linear-gradient(180deg,rgba(23,24,26,0),rgba(23,24,26,.78));
  color:#fff;
  font-family:var(--display);
  font-size:1.15rem;
}
@media (max-width:1000px){
  .class-preview{display:none}   /* stacked layout has no gap to fill */
}

/* ---------- "Site by CREATE" — CANONICAL, do not redesign ---------------
   Copied verbatim from _brain/reference/create-footer-credit.md, scoped to this
   site's footer bottom bar (.foot-bar plays the role of .ftr-bot).
   Dark footer, so the default colouring applies: mark and wordmark both
   --create-green, "Site by" at rgba(255,255,255,.38).
   Placed AFTER .site-foot a:hover on purpose — at equal specificity source order
   decides, and the generic footer hover would otherwise turn the credit amber. */

.ftr-credit{
  display:inline-flex;align-items:baseline;gap:10px;
  color:rgba(255,255,255,.38);
}
.foot-bar .ftr-credit a{
  display:inline-flex;align-items:baseline;gap:8px;
  min-height:40px;                    /* canonical .ftr-bot a touch minimum */
  color:var(--create-green);
  text-decoration:none;
  transition:opacity .3s var(--ease);
}
.foot-bar .ftr-credit a:hover{color:var(--create-green);opacity:.72}
.ftr-credit .create-mark{
  height:23px;width:auto;flex:none;
  color:var(--create-green);          /* paths are fill="currentColor" */
}
.ftr-credit b{
  font-family:"Barlow Condensed","Inter",sans-serif;
  font-weight:800;font-size:1.28rem;line-height:1;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--create-green);
}