/* ==========================================================================
   J & R Landis Enterprises
   Visual identity: ink-dark plant rooms, bone-light interiors, emerald airflow.
   Signature shapes — the round-duct arch and the asymmetric vent-slot corner.
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
  --main-color:      #10B981;
  --primary-color:   #111827;
  --secondary-color: #F2EFEA;
  --text-color:      #666666;
  --white-color:     #FFFFFF;
  --error-color:     rgb(230, 87, 87);
  --accent-color:    #8F0177;

  --default-font: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --heading-font: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* derived surfaces */
  --ink-raise:   #18202F;
  --ink-lift:    #202B3D;
  --ink-hair:    rgba(255,255,255,.11);
  --bone-deep:   #E7E1D6;
  --bone-hair:   rgba(17,24,39,.12);
  --emerald-dim: #0B8F63;
  --emerald-haze:rgba(16,185,129,.13);

  /* signature geometry */
  --arch:   999px 999px 26px 26px;      /* round-duct opening */
  --slot:   26px 26px 26px 5px;         /* vent-slot corner    */
  --slot-l: 5px 26px 26px 26px;
  --plate:  18px;
  --pill:   999px;

  /* tinted depth, never flat grey */
  --lift-1: 0 2px 4px -2px rgba(17,24,39,.10), 0 10px 26px -18px rgba(17,24,39,.42);
  --lift-2: 0 4px 10px -6px rgba(17,24,39,.16), 0 26px 56px -30px rgba(17,24,39,.50);
  --lift-em:0 12px 30px -14px rgba(16,185,129,.58);

  --spill:   clamp(60px, 8vw, 110px);   /* how far the form card drops past the hero */
  --shell-w: 1240px;
  --gutter:  clamp(18px, 4.2vw, 44px);
  --rhythm:  clamp(68px, 8.4vw, 124px);
}

/* ---------- 2. Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  font-family:var(--default-font);
  font-size:clamp(15px,.42vw + 14px,16.5px);
  line-height:1.62;
  color:var(--text-color);
  background:var(--white-color);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.vx-locked{ overflow:hidden; }

img,svg{ display:block; max-width:100%; }
img{ height:auto; }
a{ color:inherit; text-decoration:none; }
button,input,select,textarea{ font:inherit; color:inherit; }
button{ background:none; border:0; cursor:pointer; }
ul,ol{ margin:0; padding:0; list-style:none; }
figure{ margin:0; }
h1,h2,h3,h4{ margin:0; font-family:var(--heading-font); color:var(--primary-color); font-weight:800; line-height:1.08; letter-spacing:-.025em; }
p{ margin:0; }
sup{ font-size:.5em; vertical-align:super; line-height:0; }

:focus-visible{ outline:3px solid var(--main-color); outline-offset:3px; border-radius:4px; }

.vx-skiplink{
  position:fixed; top:-100px; left:16px; z-index:200;
  background:var(--main-color); color:#04231A; font-weight:700;
  padding:12px 22px; border-radius:var(--pill); transition:top .18s ease;
}
.vx-skiplink:focus{ top:14px; }

/* ---------- 3. Layout atoms ---------- */
.vx-shell{ width:100%; max-width:var(--shell-w); margin-inline:auto; padding-inline:var(--gutter); }

em{ font-style:normal; color:var(--main-color); }

/* — label pill — */
.vx-tagpill{
  display:inline-flex; align-items:center; gap:9px;
  padding:7px 16px 7px 13px; border-radius:var(--pill);
  font-size:13.5px; font-weight:600; letter-spacing:.005em;
  background:rgba(16,185,129,.14); color:var(--main-color);
  border:1px solid rgba(16,185,129,.28);
}
.vx-tagpill svg{ flex:none; }
.vx-tagpill__mark{ width:21px; height:18px; flex:none; object-fit:contain; }
.vx-tagpill--dark{ background:rgba(17,24,39,.055); color:var(--primary-color); border-color:var(--bone-hair); }
.vx-tagpill--dark svg{ color:var(--main-color); }

/* — pill buttons: a pill body with a detached arrow disc beside it — */
.vx-pillbtn{
  --disc:52px;                      /* body height and disc diameter stay locked together */
  display:inline-flex; align-items:center; gap:7px;
  background:none; border:0; padding:0; border-radius:0;
  font-family:var(--heading-font); font-weight:700; font-size:15px; letter-spacing:-.008em;
  cursor:pointer; white-space:nowrap;
  transition:transform .18s ease;
}
.vx-pillbtn:active{ transform:translateY(1px); }

.vx-pillbtn__body{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  min-height:var(--disc); padding:0 28px; border-radius:var(--pill);
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.vx-pillbtn__disc{
  display:grid; place-items:center; flex:none;
  width:var(--disc); height:var(--disc); border-radius:50%;
  transition:background-color .2s ease, transform .3s cubic-bezier(.3,1.3,.5,1);
}
.vx-pillbtn:hover .vx-pillbtn__disc{ transform:rotate(45deg); }

.vx-pillbtn--emerald .vx-pillbtn__body,
.vx-pillbtn--emerald .vx-pillbtn__disc{
  background:var(--main-color); color:var(--white-color); box-shadow:var(--lift-em);
}
.vx-pillbtn--emerald:hover .vx-pillbtn__body,
.vx-pillbtn--emerald:hover .vx-pillbtn__disc{ background:#0CCB8B; }

.vx-pillbtn--dark .vx-pillbtn__body,
.vx-pillbtn--dark .vx-pillbtn__disc{ background:var(--primary-color); color:var(--white-color); }
.vx-pillbtn--dark:hover .vx-pillbtn__body,
.vx-pillbtn--dark:hover .vx-pillbtn__disc{ background:var(--ink-lift); }

.vx-pillbtn--outline{ --disc:48px; }
.vx-pillbtn--outline .vx-pillbtn__body{
  background:transparent; color:var(--primary-color);
  border:1.5px solid var(--bone-hair); padding:0 26px;
}
.vx-pillbtn--outline:hover .vx-pillbtn__body{ border-color:var(--primary-color); background:rgba(17,24,39,.04); }

.vx-pillbtn--lg{ --disc:60px; font-size:16px; }
.vx-pillbtn--lg .vx-pillbtn__body{ padding:0 34px; }
.vx-pillbtn--wide{ width:100%; }
.vx-pillbtn--wide .vx-pillbtn__body{ flex:1; }
.vx-pillbtn[disabled]{ opacity:.62; pointer-events:none; }

/* — round icon button — */
.vx-roundbtn{
  display:grid; place-items:center; width:52px; height:52px; border-radius:50%;
  border:1.5px solid var(--ink-hair); color:var(--white-color);
  transition:background-color .2s ease, border-color .2s ease, color .2s ease;
}
.vx-roundbtn:hover{ background:var(--main-color); border-color:var(--main-color); color:#03251B; }
.vx-roundbtn[disabled]{ opacity:.3; pointer-events:none; }

/* — check marks — */
.vx-tick{
  display:grid; place-items:center; flex:none;
  width:22px; height:22px; border-radius:50%;
  background:var(--main-color); color:#03251B;
}
.vx-tickrow{ display:flex; flex-wrap:wrap; gap:12px 30px; }
.vx-tickrow li{ display:flex; align-items:center; gap:10px; font-size:14.5px; font-weight:500; }
.vx-ticklist{ display:grid; gap:11px; }
.vx-ticklist li{ display:flex; align-items:flex-start; gap:11px; font-size:14.5px; line-height:1.5; }
.vx-ticklist--sm li{ font-size:13.5px; gap:9px; }
.vx-ticklist--sm .vx-tick{ width:19px; height:19px; margin-top:1px; }

/* — face pile — */
.vx-facepile{ display:inline-flex; }
.vx-facepile img{
  width:38px; height:38px; border-radius:50%; object-fit:cover;
  border:2.5px solid var(--white-color); margin-left:-12px;
}
.vx-facepile img:first-child{ margin-left:0; }
.vx-facepile--lg img{ width:50px; height:50px; margin-left:-16px; border-width:3px; }

.vx-stars{ display:inline-flex; gap:2px; color:#F5A524; }

/* — hand-off strip (avatar + line + link) — */
.vx-handoff{
  display:flex; align-items:center; gap:clamp(14px,2.4vw,26px); flex-wrap:wrap;
  margin-top:clamp(36px,4.6vw,58px);
  padding:16px 22px 16px 16px;
  background:var(--white-color); border:1px solid var(--bone-hair);
  border-radius:var(--pill); box-shadow:var(--lift-1);
}
.vx-handoff__face{ position:relative; flex:none; }
.vx-handoff__face img{ width:50px; height:50px; border-radius:50%; object-fit:cover; }
.vx-handoff__dial{
  position:absolute; right:-5px; bottom:-3px;
  display:grid; place-items:center; width:25px; height:25px; border-radius:50%;
  background:var(--main-color); color:#03251B; border:2.5px solid var(--white-color);
}
.vx-handoff__text{ flex:1 1 300px; font-size:15px; color:var(--primary-color); font-weight:500; }
.vx-handoff__link{
  display:inline-flex; align-items:center; gap:7px; flex:none;
  font-family:var(--heading-font); font-weight:700; font-size:14.5px; color:var(--main-color);
  padding-bottom:2px; border-bottom:1.5px solid rgba(16,185,129,.4);
  transition:border-color .2s ease, gap .2s ease;
}
.vx-handoff__link:hover{ border-color:var(--main-color); gap:11px; }

/* — generic panel used across sections — */
.vx-slab{
  --pad:clamp(24px,2.8vw,34px);
  position:relative;
  background:var(--white-color);
  border:1px solid var(--bone-hair);
  border-radius:var(--slot);
  padding:var(--pad);
  box-shadow:var(--lift-1);
}
.vx-slab__figure{
  font-family:var(--heading-font); font-weight:800; letter-spacing:-.05em;
  font-size:clamp(46px,5.6vw,68px); line-height:1; color:var(--primary-color);
}
.vx-slab__figure sup{ color:var(--main-color); }
/* — designed section marks (/images) — */
.vx-mark{ flex:none; display:block; width:56px; height:56px; object-fit:contain; }
.vx-mark--slab,
.vx-mark--edge,
.vx-mark--point{ width:56px; height:56px; }
.vx-mark--work{ position:absolute; top:18px; left:18px; z-index:2; width:52px; height:52px; }
.vx-mark--strip{ width:34px; height:34px; }            /* bare white art on dark */
.vx-mark--fall{                                         /* matches the disc icons */
  display:grid; place-items:center; border-radius:50%;
  background:var(--main-color);
}
.vx-mark--fall svg{ width:56%; height:56%; }
.vx-slab__title{ font-size:clamp(18px,1.5vw,21px); line-height:1.25; }
.vx-slab__text{ font-size:14.5px; }

/* ==========================================================================
   4. Masthead
   ========================================================================== */
.vx-mast{
  position:sticky; top:0; z-index:90;
  background:rgba(17,24,39,.92);
  backdrop-filter:saturate(1.5) blur(14px);
  -webkit-backdrop-filter:saturate(1.5) blur(14px);
  border-bottom:1px solid transparent;
  transition:background-color .3s ease, border-color .3s ease;
}
.vx-mast.is-stuck{ background:rgba(17,24,39,.98); border-bottom-color:var(--ink-hair); }
.vx-mast__inner{ display:flex; align-items:center; gap:clamp(16px,2.4vw,38px); min-height:80px; }

.vx-brandmark{ display:inline-flex; align-items:center; gap:11px; flex:none; color:var(--main-color); }
.vx-brandmark__glyph{ flex:none; object-fit:contain; }
.vx-brandmark__words{ display:flex; flex-direction:column; line-height:1.02; }
.vx-brandmark__lead{
  font-family:var(--heading-font); font-weight:800; font-size:18px; letter-spacing:.02em;
  color:var(--white-color);
}
.vx-brandmark__trail{
  font-size:11.5px; font-weight:600; letter-spacing:.17em; text-transform:uppercase;
  color:var(--main-color);
}

.vx-nav{ margin-inline:auto; }
.vx-nav__list{ display:flex; align-items:center; gap:clamp(8px,1.6vw,26px); }
.vx-nav__link{
  position:relative; display:block; padding:9px 4px;
  font-size:14.5px; font-weight:500; color:rgba(255,255,255,.76);
  transition:color .2s ease;
}
.vx-nav__link::after{
  content:""; position:absolute; left:0; right:100%; bottom:2px; height:2px;
  background:var(--main-color); border-radius:2px; transition:right .25s ease;
}
.vx-nav__link:hover,.vx-nav__link.is-here{ color:var(--white-color); }
.vx-nav__link:hover::after,.vx-nav__link.is-here::after{ right:0; }

.vx-mast__tail{ display:flex; align-items:center; gap:14px; flex:none; margin-left:auto; }
.vx-mast__dial{
  display:inline-flex; align-items:center; gap:9px;
  font-size:14.5px; font-weight:600; color:rgba(255,255,255,.88);
  transition:color .2s ease;
}
.vx-mast__dial svg{ color:var(--main-color); }
.vx-mast__dial:hover{ color:var(--main-color); }

.vx-burger{ display:none; width:46px; height:46px; border-radius:14px; border:1px solid var(--ink-hair); padding:13px 12px; }
.vx-burger__bar{ display:block; height:2px; border-radius:2px; background:var(--white-color); transition:transform .25s ease, opacity .2s ease; }
.vx-burger__bar + .vx-burger__bar{ margin-top:5px; }
.vx-burger[aria-expanded="true"] .vx-burger__bar:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.vx-burger[aria-expanded="true"] .vx-burger__bar:nth-child(2){ opacity:0; }
.vx-burger[aria-expanded="true"] .vx-burger__bar:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* — mobile drawer — */
.vx-drawer{ position:fixed; inset:0; z-index:85; background:rgba(9,13,21,.6); }
.vx-drawer[hidden]{ display:none; }
.vx-drawer__sheet{
  position:absolute; inset:80px 0 auto 0;
  background:var(--primary-color); border-top:1px solid var(--ink-hair);
  padding:22px var(--gutter) 30px;
  max-height:calc(100dvh - 80px); overflow-y:auto;
  animation:vx-dropin .26s ease;
}
@keyframes vx-dropin{ from{ opacity:0; transform:translateY(-14px);} to{ opacity:1; transform:none;} }
.vx-drawer__list li + li{ border-top:1px solid var(--ink-hair); }
.vx-drawer__list a{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 2px; font-family:var(--heading-font); font-weight:700; font-size:19px;
  color:var(--white-color);
}
.vx-drawer__list svg{ color:var(--main-color); }
.vx-drawer__foot{ margin-top:24px; display:grid; gap:16px; justify-items:center; }
.vx-drawer__dial{ display:inline-flex; align-items:center; gap:9px; color:var(--white-color); font-weight:600; }
.vx-drawer__dial svg{ color:var(--main-color); }
.vx-drawer__note{ font-size:13px; color:rgba(255,255,255,.55); }

/* ==========================================================================
   5. Hero — full-bleed plant-room photo, cut-out technician, form card
   ========================================================================== */
.vx-stage{ position:relative; overflow-x:clip; background:var(--primary-color); color:rgba(255,255,255,.74); }

.vx-stage__scene{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.vx-stage__scene img{ width:100%; height:100%; object-fit:cover; object-position:50% 42%; }
.vx-stage__veil{
  position:absolute; inset:0;
  background:
    linear-gradient(100deg, rgba(17,24,39,.97) 0%, rgba(17,24,39,.94) 40%, rgba(17,24,39,.72) 70%, rgba(17,24,39,.58) 100%),
    radial-gradient(62% 56% at 6% 2%, rgba(16,185,129,.20), transparent 62%),
    radial-gradient(46% 44% at 98% 92%, rgba(143,1,119,.20), transparent 68%);
}

.vx-stage__inner{ position:relative; z-index:3; padding-block:clamp(44px,5.6vw,78px) 0; }
.vx-stage__say{ max-width:700px; padding-bottom:clamp(28px,3.6vw,46px); }

.vx-stage__title{
  margin:22px 0 20px;
  color:var(--white-color);
  font-size:clamp(35px,4.4vw,56px);
  letter-spacing:-.034em;
  text-wrap:balance;
}
.vx-stage__lede{ max-width:54ch; font-size:clamp(15px,.5vw + 14px,17px); }

.vx-stage__acts{ display:flex; flex-wrap:wrap; align-items:center; gap:18px 26px; margin:32px 0 28px; }
.vx-stage__call{ display:inline-flex; align-items:center; gap:13px; }
.vx-stage__callIcon{
  display:grid; place-items:center; width:46px; height:46px; border-radius:50%;
  border:1.5px solid var(--ink-hair); color:var(--main-color);
  transition:border-color .2s ease, background-color .2s ease;
}
.vx-stage__call:hover .vx-stage__callIcon{ border-color:var(--main-color); background:rgba(16,185,129,.14); }
.vx-stage__callText{ display:flex; flex-direction:column; line-height:1.3; }
.vx-stage__callText span{ font-size:12.5px; color:rgba(255,255,255,.55); }
.vx-stage__callText strong{ font-family:var(--heading-font); font-size:16px; color:var(--white-color); }
.vx-stage .vx-tickrow{ color:rgba(255,255,255,.84); }

/* trust strip under the calls to action */
.vx-stage__proof{
  display:flex; align-items:center; flex-wrap:wrap; gap:16px clamp(20px,3vw,44px);
  margin-top:clamp(26px,3vw,36px); padding-top:clamp(20px,2.4vw,28px);
  border-top:1px solid var(--ink-hair);
}
.vx-stage__stat{ display:flex; align-items:center; gap:13px; }
.vx-stage__stat strong{
  font-family:var(--heading-font); font-weight:800; line-height:1;
  font-size:clamp(30px,3.1vw,40px); letter-spacing:-.045em; color:var(--white-color);
}
.vx-stage__stat sup{ color:var(--main-color); }
.vx-stage__stat > span{ max-width:13ch; font-size:13.5px; line-height:1.28; }
.vx-stage__score{
  display:flex; flex-direction:column; gap:4px;
  padding-left:clamp(0px,2.2vw,30px); border-left:1px solid var(--ink-hair);
}
.vx-stage__scoreLabel{ font-size:13.5px; font-weight:500; color:rgba(255,255,255,.84); }

/* cut-out technician stands on the card and rises above its top edge */
.vx-stage__worker{
  position:absolute; z-index:2;
  /* sits on the card, crops at the screen edge, head well above the card top */
  right:calc(-1 * (100vw - 100%) / 2 - clamp(70px,7.5vw,115px)); bottom:0;
  height:calc(100% + clamp(110px,11vw,180px)); width:auto; max-width:none;
  filter:drop-shadow(0 22px 40px rgba(17,24,39,.34));
  pointer-events:none; user-select:none;
}

/* ==========================================================================
   6. Intake form
   ========================================================================== */
.vx-intake__card{
  position:relative; z-index:1;
  width:100%;
  color:var(--text-color);          /* the hero sets white text — undo it on the card */
  background:var(--white-color);
  border-radius:clamp(24px,3vw,38px) clamp(24px,3vw,38px) clamp(24px,3vw,38px) 8px;
  padding:clamp(26px,3.4vw,46px);
  box-shadow:var(--lift-2);
  border:1px solid rgba(255,255,255,.7);
}
/* content stays in the left half so the technician can occupy the right */

.vx-intake__title{ font-size:clamp(25px,2.7vw,34px); max-width:560px; }
.vx-intake__lede{ margin-top:12px; max-width:560px; font-size:15px; }
.vx-intake__assure{ display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:18px; }
.vx-intake__assure li{ display:flex; align-items:center; gap:9px; font-size:13.5px; font-weight:500; color:var(--primary-color); }
.vx-intake__assure .vx-tick{ width:19px; height:19px; }

.vx-intake__form{ margin-top:clamp(20px,2.2vw,28px); max-width:560px; }
.vx-intake__trap{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.vx-intake__rows{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px clamp(14px,1.7vw,22px); }

.vx-field{ display:flex; flex-direction:column; gap:7px; min-width:0; }
.vx-field--wide{ grid-column:1 / -1; }
.vx-field__label{ font-size:13px; font-weight:600; color:var(--primary-color); letter-spacing:.005em; }
.vx-field__label span[aria-hidden]{ color:var(--main-color); }
.vx-field__opt{ color:var(--text-color); font-weight:400; }
.vx-field__input{
  width:100%; padding:14px 16px;
  background:var(--secondary-color);
  border:1.5px solid transparent; border-radius:14px 14px 14px 4px;
  font-size:15px; color:var(--primary-color);
  transition:border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
  appearance:none;
}
.vx-field__input::placeholder{ color:#9AA0A6; }
.vx-field__input:hover{ background:var(--bone-deep); }
.vx-field__input:focus{
  outline:none; background:var(--white-color);
  border-color:var(--main-color); box-shadow:0 0 0 4px rgba(16,185,129,.16);
}
.vx-field__area{ resize:vertical; min-height:92px; line-height:1.55; font-family:var(--default-font); }
.vx-field__selectWrap{ position:relative; display:block; }
.vx-field__select{ padding-right:44px; cursor:pointer; }
.vx-field__chev{ position:absolute; right:14px; top:50%; transform:translateY(-50%); color:var(--primary-color); pointer-events:none; }

.vx-field.is-bad .vx-field__input{ border-color:var(--error-color); background:rgba(230,87,87,.06); }
.vx-field__flag{ display:none; font-size:12.5px; font-weight:500; color:var(--error-color); }
.vx-field__flag.is-on{ display:block; }
.vx-field__flag--consent{ margin-top:6px; }

.vx-consent{
  display:flex; align-items:flex-start; gap:12px; margin-top:20px; cursor:pointer;
  padding:15px 17px; border-radius:var(--slot);
  background:var(--secondary-color);
}
.vx-consent input{ position:absolute; opacity:0; width:0; height:0; }
.vx-consent__box{
  display:grid; place-items:center; flex:none; width:22px; height:22px; margin-top:1px;
  border:1.5px solid rgba(17,24,39,.3); border-radius:7px;
  background:var(--white-color); color:transparent;
  transition:background-color .16s ease, border-color .16s ease, color .16s ease;
}
.vx-consent input:checked + .vx-consent__box{ background:var(--main-color); border-color:var(--main-color); color:#03251B; }
.vx-consent input:focus-visible + .vx-consent__box{ outline:3px solid var(--main-color); outline-offset:2px; }
.vx-consent__text{ font-size:12.8px; line-height:1.5; }
.vx-consent__text a{ color:var(--primary-color); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.vx-consent.is-bad{ background:rgba(230,87,87,.07); }
.vx-consent.is-bad .vx-consent__box{ border-color:var(--error-color); }

.vx-intake__send{ display:flex; align-items:center; flex-wrap:wrap; gap:16px 22px; margin-top:22px; }
.vx-intake__micro{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; }
.vx-intake__micro svg{ color:var(--main-color); flex:none; }

/* spinner inside the submit button */
.vx-spinner{
  display:none; flex:none; width:19px; height:19px; border-radius:50%;
  border:2.4px solid rgba(3,37,27,.28); border-top-color:#03251B;
  animation:vx-spin .68s linear infinite;
}
@keyframes vx-spin{ to{ transform:rotate(360deg); } }
.vx-pillbtn.is-busy{ pointer-events:none; }
.vx-pillbtn.is-busy .vx-spinner{ display:block; }
.vx-pillbtn.is-busy .vx-pillbtn__disc{ opacity:.5; }

.vx-intake__reply{
  margin-top:20px; padding:17px 20px; border-radius:var(--slot);
  font-size:14.5px; line-height:1.55;
  display:flex; align-items:flex-start; gap:12px;
}
.vx-intake__reply[hidden]{ display:none; }
.vx-intake__reply.is-good{ background:rgba(16,185,129,.12); color:#07543C; border:1px solid rgba(16,185,129,.35); }
.vx-intake__reply.is-bad{ background:rgba(230,87,87,.09); color:#8A2B2B; border:1px solid rgba(230,87,87,.32); }
.vx-intake__reply strong{ display:block; font-family:var(--heading-font); font-size:16px; margin-bottom:3px; }
.vx-intake__reply svg{ flex:none; margin-top:2px; }

/* ==========================================================================
   7. About
   ========================================================================== */
.vx-orgstory{
  position:relative; z-index:1;
  margin-top:calc(-1 * var(--spill));
  background:var(--secondary-color);
  padding-block:calc(var(--rhythm) + var(--spill)) var(--rhythm);
}
.vx-orgstory__head{
  display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(24px,3.6vw,56px); align-items:end;
}
.vx-orgstory__title{ margin-top:20px; font-size:clamp(28px,3.5vw,44px); }
.vx-orgstory__aside{ display:grid; gap:22px; justify-items:start; }
.vx-orgstory__aside p{ font-size:15px; }

.vx-orgstory__trio{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,1.9vw,24px); margin-top:clamp(34px,4.4vw,56px);
}
.vx-slab--stat{ display:grid; gap:14px; align-content:start; }
.vx-slab--stat .vx-slab__mark{ margin-top:2px; }
.vx-slab--list{ display:grid; gap:14px; align-content:start; }

.vx-slab--shot{ padding:0; overflow:hidden; border-radius:var(--slot); position:relative; min-height:340px; }
.vx-slab--shot > img{ width:100%; height:100%; position:absolute; inset:0; object-fit:cover; }
.vx-slab__plate{
  position:absolute; left:14px; right:14px; bottom:14px;
  display:flex; align-items:center; gap:13px;
  padding:11px 16px 11px 13px; border-radius:var(--pill);
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  box-shadow:var(--lift-1);
}
.vx-slab__plateText{ display:flex; flex-direction:column; line-height:1.24; }
.vx-slab__plateText strong{ font-family:var(--heading-font); font-size:16px; color:var(--primary-color); }
.vx-slab__plateText span{ font-size:12px; }

/* ==========================================================================
   8. Services carousel
   ========================================================================== */
.vx-worklist{ position:relative; background:var(--primary-color); color:rgba(255,255,255,.72); padding-block:var(--rhythm); overflow:hidden; }
.vx-worklist::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(52% 40% at 50% -6%, rgba(16,185,129,.17), transparent 68%);
}
.vx-worklist .vx-shell{ position:relative; }
.vx-worklist__head{ max-width:760px; margin-inline:auto; text-align:center; display:grid; justify-items:center; gap:20px; }
.vx-worklist__title{ color:var(--white-color); font-size:clamp(27px,3.4vw,43px); }

.vx-worklist__rail{ margin-top:clamp(34px,4.4vw,54px); overflow:hidden; }
.vx-worklist__track{
  display:flex; gap:clamp(16px,1.8vw,24px);
  transition:transform .55s cubic-bezier(.4,.02,.2,1);
  will-change:transform;
}
.vx-worklist__track.is-dragging{ transition:none; cursor:grabbing; }

.vx-workcard{
  position:relative; flex:0 0 calc((100% - 2 * clamp(16px,1.8vw,24px)) / 3);
  min-height:clamp(430px,44vw,520px);
  border-radius:var(--slot); overflow:hidden;
  background:var(--ink-raise);
  display:flex; align-items:flex-end;
  isolation:isolate;
}
.vx-workcard__shot{ position:absolute; inset:0; z-index:-2; }
.vx-workcard__shot > img{ width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.6,.2,1); }
.vx-workcard:hover .vx-workcard__shot > img{ transform:scale(1.055); }
.vx-workcard::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(to top, rgba(10,14,22,.96) 8%, rgba(10,14,22,.88) 44%, rgba(10,14,22,.22) 78%, rgba(10,14,22,.38) 100%);
}
.vx-workcard__body{ padding:clamp(20px,2.2vw,28px); width:100%; }
.vx-workcard__rate{ display:flex; align-items:baseline; gap:7px; margin-bottom:12px; }
.vx-workcard__from{ font-size:12px; color:rgba(255,255,255,.6); }
.vx-workcard__sum{
  font-family:var(--heading-font); font-weight:800; font-size:26px;
  letter-spacing:-.03em; color:var(--main-color);
}
.vx-workcard__unit{ font-size:12px; color:rgba(255,255,255,.55); }
.vx-workcard__name{ color:var(--white-color); font-size:clamp(19px,1.6vw,23px); line-height:1.2; }
.vx-workcard__text{ margin-top:10px; font-size:14px; line-height:1.55; color:rgba(255,255,255,.75); }
.vx-workcard__go{
  display:inline-flex; align-items:center; gap:8px; margin-top:16px;
  font-family:var(--heading-font); font-weight:700; font-size:14px; color:var(--main-color);
  transition:gap .2s ease;
}
.vx-workcard__go:hover{ gap:12px; }

.vx-worklist__helm{
  display:flex; align-items:center; flex-wrap:wrap; gap:18px 26px;
  margin-top:clamp(26px,3vw,36px);
}
.vx-worklist__dots{ display:flex; gap:8px; }
.vx-worklist__dot{
  width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.26);
  transition:background-color .2s ease, width .25s ease;
}
.vx-worklist__dot.is-on{ width:30px; border-radius:var(--pill); background:var(--main-color); }
.vx-worklist__arrows{ display:flex; gap:10px; }
.vx-worklist__note{ flex:1 1 320px; font-size:12.8px; color:rgba(255,255,255,.5); text-align:right; }

/* ==========================================================================
   9. Why us
   ========================================================================== */
.vx-trustcase{ background:var(--secondary-color); padding-block:var(--rhythm); }
.vx-trustcase__head{
  display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(24px,3.6vw,56px); align-items:end;
}
.vx-trustcase__title{ margin-top:20px; font-size:clamp(28px,3.5vw,44px); }
.vx-trustcase__aside{ display:grid; gap:20px; }
.vx-trustcase__aside p{ font-size:15px; }

.vx-banderole{
  position:relative; margin:clamp(30px,4vw,48px) 0 0;
  border-radius:clamp(20px,2.6vw,32px); overflow:hidden;
  aspect-ratio:16/7.6; min-height:280px;
}
.vx-banderole > img{ width:100%; height:100%; object-fit:cover; object-position:50% 46%; }
.vx-banderole__strip{
  position:absolute; left:0; right:0; bottom:0;
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(8px,1.4vw,18px);
  padding:clamp(18px,2.4vw,30px) clamp(16px,2.4vw,32px);
  background:linear-gradient(to top, rgba(10,14,22,.93), rgba(10,14,22,.62) 58%, transparent);
}
.vx-banderole__item{
  display:flex; align-items:center; gap:13px;
  color:var(--white-color); font-family:var(--heading-font); font-weight:600;
  font-size:clamp(13px,1.05vw,15.5px); line-height:1.3;
}
.vx-banderole__strip .vx-mark--strip{ filter:drop-shadow(0 2px 6px rgba(0,0,0,.6)); }

.vx-trustcase__trio{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,1.9vw,24px); margin-top:clamp(16px,1.9vw,24px);
  align-items:stretch;
}
/* the two outer cards share one structure so the row reads symmetrically */
.vx-slab--stack{ display:flex; flex-direction:column; gap:16px; padding-bottom:0; overflow:hidden; }
.vx-slab__head{ display:grid; gap:7px; align-content:start; }
.vx-slab--stack .vx-slab__title{ font-size:17px; margin-top:3px; }
.vx-slab__tail{
  width:calc(100% + var(--pad) * 2); max-width:none;   /* bleed past the panel padding */
  margin:auto calc(-1 * var(--pad)) 0;
  height:clamp(150px,15vw,200px); object-fit:cover;
  border-radius:var(--plate) var(--plate) 0 0;
}

.vx-slab--photo{ padding:0; overflow:hidden; min-height:270px; position:relative; }
.vx-slab--photo > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* ==========================================================================
   10. Trust band
   ========================================================================== */
.vx-voiceband{ background:var(--secondary-color); }
.vx-voiceband__inner{
  display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center;
  padding:clamp(28px,3.4vw,44px) var(--gutter);
  border-top:1px solid var(--bone-hair);
}
.vx-voiceband__score{ display:inline-flex; align-items:center; gap:9px; }
.vx-voiceband__score strong{ font-family:var(--heading-font); font-weight:800; font-size:26px; color:var(--primary-color); letter-spacing:-.03em; }
.vx-voiceband__scoreLabel{ font-size:14.5px; }
.vx-voiceband__claim{ font-family:var(--heading-font); font-weight:600; font-size:clamp(16px,1.5vw,20px); color:var(--primary-color); }

/* ==========================================================================
   11. What sets us apart
   ========================================================================== */
.vx-edgegrid{ position:relative; background:var(--primary-color); color:rgba(255,255,255,.72); padding-block:var(--rhythm); overflow:hidden; }
.vx-edgegrid::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(44% 44% at 50% 104%, rgba(143,1,119,.26), transparent 70%);
}
.vx-edgegrid .vx-shell{ position:relative; }
.vx-edgegrid__head{ max-width:800px; margin-inline:auto; text-align:center; display:grid; justify-items:center; gap:18px; }
.vx-edgegrid__title{ color:var(--white-color); font-size:clamp(27px,3.4vw,43px); }
.vx-edgegrid__lede{ font-size:15.5px; max-width:64ch; }

.vx-edgegrid__frame{
  display:grid; grid-template-columns:1fr minmax(240px,.86fr) 1fr;
  gap:clamp(16px,2.2vw,30px); align-items:center;
  margin-top:clamp(36px,4.4vw,58px);
}
.vx-edgegrid__column{ display:grid; gap:clamp(16px,2vw,24px); }
.vx-edgeblock{
  padding:clamp(20px,2.2vw,26px);
  background:rgba(255,255,255,.045);
  border:1px solid var(--ink-hair);
  border-radius:var(--slot);
  display:grid; gap:12px; align-content:start;
  transition:background-color .25s ease, border-color .25s ease;
}
.vx-edgeblock:hover{ background:rgba(255,255,255,.075); border-color:rgba(16,185,129,.36); }
.vx-edgegrid__column:last-child .vx-edgeblock{ border-radius:var(--slot-l); }
.vx-edgeblock__title{ color:var(--white-color); font-size:18px; line-height:1.25; }
.vx-edgeblock__text{ font-size:14px; line-height:1.56; }

.vx-edgegrid__portrait{
  position:relative; margin:0; align-self:stretch;
  min-height:420px;
  border-radius:20px; overflow:hidden;
  box-shadow:0 40px 80px -44px rgba(0,0,0,.9);
}
.vx-edgegrid__portrait > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 22%; }
.vx-edgegrid__portrait figcaption{
  position:absolute; left:14px; right:14px; bottom:14px;
  display:grid; gap:2px; padding:13px 18px; border-radius:var(--plate);
  background:rgba(17,24,39,.78);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.14);
}
.vx-edgegrid__portrait strong{ font-family:var(--heading-font); font-size:15px; color:var(--white-color); }
.vx-edgegrid__portrait span{ font-size:12.5px; color:var(--main-color); }

/* ==========================================================================
   12. Divider
   ========================================================================== */
.vx-airbreak{
  display:grid; place-items:center;
  background:linear-gradient(to bottom, var(--primary-color) 0 38%, var(--secondary-color) 38% 100%);
  padding-block:clamp(26px,4vw,48px) clamp(20px,3.4vw,40px);
}
.vx-airbreak__art{ width:min(430px,78vw); height:auto; }

/* ==========================================================================
   13. How we work
   ========================================================================== */
.vx-routemap{ background:var(--secondary-color); padding-block:clamp(20px,3vw,36px) var(--rhythm); }
.vx-routemap__head{ max-width:760px; margin-inline:auto; text-align:center; display:grid; justify-items:center; gap:18px; }
.vx-routemap__title{ font-size:clamp(27px,3.4vw,43px); }
.vx-routemap__lede{ font-size:15.5px; max-width:58ch; }

.vx-routemap__chain{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(30px,3.1vw,40px);
  margin-top:clamp(36px,4.4vw,58px);
}
.vx-stepcard{
  position:relative;
  background:var(--white-color); border:1px solid var(--bone-hair);
  border-radius:var(--slot); padding:clamp(22px,2.4vw,28px);
  padding-bottom:clamp(56px,5.2vw,68px);   /* room for the step ordinal */
  box-shadow:var(--lift-1);
  display:grid; gap:12px; align-content:start;
}
/* connecting arrow between steps */
.vx-stepcard + .vx-stepcard::before{
  content:""; position:absolute; top:50%; left:calc(-1 * clamp(30px,3.1vw,40px));
  width:clamp(30px,3.1vw,40px); height:2px; transform:translateY(-50%);
  background:linear-gradient(to right, rgba(16,185,129,.25), var(--main-color));
}
.vx-stepcard + .vx-stepcard::after{
  content:""; position:absolute; top:50%; left:-9px;
  width:9px; height:9px; transform:translateY(-50%) rotate(45deg);
  border-top:2px solid var(--main-color); border-right:2px solid var(--main-color);
}
.vx-stepcard__mark{
  display:grid; place-items:center; width:56px; height:56px; border-radius:50%;
  background:var(--main-color);
}
.vx-stepcard__mark .vx-mark{ width:34px; height:30px; }
.vx-stepcard__title{ font-size:19px; }
.vx-stepcard__text{ font-size:14px; }
.vx-stepcard__ord{
  position:absolute; right:clamp(16px,1.9vw,22px); bottom:clamp(12px,1.5vw,16px);
  font-family:var(--heading-font); font-weight:800; font-size:clamp(28px,3vw,38px);
  letter-spacing:-.05em; color:rgba(17,24,39,.08); line-height:1; pointer-events:none;
}

/* ==========================================================================
   14. Closing CTA
   ========================================================================== */
.vx-summon{ position:relative; background:var(--primary-color); color:rgba(255,255,255,.74); overflow:hidden; }
.vx-summon__inner{
  position:relative;
  display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(30px,4.4vw,64px); align-items:center;
  padding-block:var(--rhythm);
}
.vx-summon__title{ margin:20px 0 16px; color:var(--white-color); font-size:clamp(27px,3.5vw,44px); }
.vx-summon__lede{ max-width:50ch; font-size:15.5px; }
.vx-summon__point{
  display:flex; align-items:flex-start; gap:16px;
  margin:30px 0 32px; padding:18px 20px;
  background:rgba(255,255,255,.055); border:1px solid var(--ink-hair);
  border-radius:var(--slot);
}
.vx-summon__point h3{ color:var(--white-color); font-size:17px; }
.vx-summon__point p{ margin-top:5px; font-size:14px; }
.vx-summon__shot{
  margin:0; border-radius:clamp(20px,2.6vw,32px) 8px clamp(20px,2.6vw,32px) clamp(20px,2.6vw,32px);
  overflow:hidden; aspect-ratio:4/3.1;
  box-shadow:0 40px 80px -44px rgba(0,0,0,.9);
}
.vx-summon__shot > img{ width:100%; height:100%; object-fit:cover; }

/* ==========================================================================
   15. Footer
   ========================================================================== */
.vx-baseboard{ background:#0C121C; color:rgba(255,255,255,.62); padding-block:clamp(48px,6vw,80px) 30px; }
.vx-baseboard__grid{
  display:grid; grid-template-columns:1.5fr 1fr 1.35fr 1fr;
  gap:clamp(28px,3.4vw,48px);
}
.vx-brandmark--light .vx-brandmark__lead{ color:var(--white-color); }
.vx-baseboard__pitch{ margin:18px 0 22px; font-size:14px; max-width:38ch; }
.vx-baseboard__hours{ display:grid; gap:9px; margin-top:20px; }
.vx-baseboard__hours li{ display:flex; align-items:center; gap:10px; font-size:13.5px; }
.vx-baseboard__hours svg{ color:rgba(255,255,255,.4); flex:none; }
.vx-baseboard__hours .is-accent{ color:var(--main-color); font-weight:600; }
.vx-baseboard__hours .is-accent svg{ color:var(--main-color); }

.vx-baseboard__head{
  font-size:13px; font-weight:700; letter-spacing:.04em;
  color:var(--white-color); margin-bottom:18px;
}
.vx-baseboard__links{ display:grid; gap:11px; }
.vx-baseboard__links a{ font-size:14px; transition:color .18s ease, padding-left .18s ease; }
.vx-baseboard__links a:hover{ color:var(--main-color); padding-left:5px; }
.vx-baseboard__areas{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px 14px; }
.vx-baseboard__areas li{ font-size:13.5px; }

.vx-baseboard__contact{
  display:flex; flex-wrap:wrap; gap:14px clamp(20px,3vw,44px);
  margin-top:clamp(34px,4vw,52px); padding:20px 24px;
  background:rgba(255,255,255,.04); border:1px solid var(--ink-hair);
  border-radius:var(--slot); font-style:normal;
}
.vx-baseboard__contact > *{ display:inline-flex; align-items:center; gap:10px; font-size:14px; }
.vx-baseboard__contact svg{ color:var(--main-color); flex:none; }
.vx-baseboard__contact a{ transition:color .18s ease; }
.vx-baseboard__contact a:hover{ color:var(--white-color); }
.vx-baseboard__entity{ color:rgba(255,255,255,.5); }

.vx-baseboard__rule{ height:1px; background:var(--ink-hair); margin-block:clamp(26px,3vw,38px) 22px; }
.vx-baseboard__base{ display:flex; flex-wrap:wrap; align-items:center; gap:16px 28px; }
.vx-baseboard__copy{ font-size:13px; }
.vx-baseboard__legal{ display:flex; flex-wrap:wrap; gap:8px 20px; margin-inline:auto; }
.vx-baseboard__legal a,.vx-baseboard__prefs{
  font-size:13px; color:rgba(255,255,255,.62); transition:color .18s ease;
  border-bottom:1px solid transparent; padding-bottom:1px;
}
.vx-baseboard__legal a:hover,.vx-baseboard__prefs:hover{ color:var(--main-color); border-bottom-color:var(--main-color); }

/* ==========================================================================
   16. Cookie dock
   ========================================================================== */
.vx-cookiedock{
  position:fixed; left:0; right:0; bottom:0; z-index:95;
  padding:clamp(12px,2vw,22px);
  display:grid; justify-items:center;
  pointer-events:none;
}
.vx-cookiedock[hidden]{ display:none; }
.vx-cookiedock__panel{
  pointer-events:auto;
  width:min(100%,720px);
  background:var(--white-color);
  border:1px solid var(--bone-hair);
  border-radius:clamp(18px,2.4vw,26px) clamp(18px,2.4vw,26px) clamp(18px,2.4vw,26px) 8px;
  box-shadow:0 28px 70px -26px rgba(17,24,39,.55);
  padding:clamp(18px,2.2vw,26px);
  animation:vx-dockup .35s cubic-bezier(.2,.8,.3,1);
}
@keyframes vx-dockup{ from{ opacity:0; transform:translateY(22px);} to{ opacity:1; transform:none;} }
@media (prefers-reduced-motion: reduce){ .vx-cookiedock__panel{ animation:none; } }

.vx-cookiedock__top{ display:flex; gap:14px; align-items:flex-start; }
.vx-cookiedock__mark{
  display:grid; place-items:center; flex:none; width:44px; height:44px;
  border-radius:14px 14px 14px 4px; background:var(--emerald-haze); color:var(--emerald-dim);
}
.vx-cookiedock__title{ font-size:19px; }
.vx-cookiedock__body{ margin-top:6px; font-size:13.5px; line-height:1.55; }
.vx-cookiedock__body a{ color:var(--primary-color); font-weight:600; text-decoration:underline; text-underline-offset:2px; }

.vx-cookiedock__choices{ display:grid; gap:10px; margin-top:18px; }
.vx-cookiedock__choices[hidden]{ display:none; }
.vx-cookiedock__opt{
  display:flex; align-items:flex-start; gap:13px; cursor:pointer;
  padding:13px 15px; border-radius:var(--slot); background:var(--secondary-color);
}
.vx-cookiedock__opt.is-locked{ cursor:default; opacity:.85; }
.vx-cookiedock__opt input{ position:absolute; opacity:0; width:0; height:0; }
.vx-cookiedock__switch{
  position:relative; flex:none; width:42px; height:24px; margin-top:1px;
  border-radius:var(--pill); background:rgba(17,24,39,.22);
  transition:background-color .2s ease;
}
.vx-cookiedock__switch::after{
  content:""; position:absolute; top:3px; left:3px; width:18px; height:18px;
  border-radius:50%; background:var(--white-color);
  transition:transform .22s cubic-bezier(.3,1.2,.5,1);
}
.vx-cookiedock__opt input:checked + .vx-cookiedock__switch{ background:var(--main-color); }
.vx-cookiedock__opt input:checked + .vx-cookiedock__switch::after{ transform:translateX(18px); }
.vx-cookiedock__opt input:focus-visible + .vx-cookiedock__switch{ outline:3px solid var(--main-color); outline-offset:2px; }
.vx-cookiedock__optText{ font-size:12.8px; line-height:1.5; }
.vx-cookiedock__optText strong{ display:block; font-family:var(--heading-font); font-size:14px; color:var(--primary-color); }

.vx-cookiedock__acts{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:18px; }
.vx-cookiedock__acts .vx-pillbtn__body{ padding-inline:26px; }
.vx-cookiedock__acts .vx-pillbtn[hidden]{ display:none; }
.vx-cookiedock__toggle{
  margin-left:auto; font-size:13.5px; font-weight:600; color:var(--primary-color);
  border-bottom:1.5px solid var(--bone-hair); padding-bottom:2px;
  transition:border-color .2s ease;
}
.vx-cookiedock__toggle:hover{ border-color:var(--primary-color); }

/* ==========================================================================
   17. Legal pages
   ========================================================================== */
.vx-lawhead{ background:var(--primary-color); color:rgba(255,255,255,.7); padding-block:clamp(48px,6vw,78px); }
.vx-lawhead__title{ margin:18px 0 12px; color:var(--white-color); font-size:clamp(30px,4vw,50px); }
.vx-lawhead__meta{ font-size:14px; }
.vx-lawhead__meta strong{ color:var(--main-color); }

.vx-lawbody{ background:var(--secondary-color); padding-block:clamp(40px,5vw,72px); }
.vx-lawbody__wrap{ display:grid; grid-template-columns:minmax(0,250px) minmax(0,1fr); gap:clamp(24px,3.4vw,52px); align-items:start; }

.vx-lawnav{
  position:sticky; top:104px;
  background:var(--white-color); border:1px solid var(--bone-hair);
  border-radius:var(--slot); padding:20px; box-shadow:var(--lift-1);
}
.vx-lawnav__head{ font-size:12.5px; font-weight:700; letter-spacing:.04em; color:var(--primary-color); margin-bottom:14px; }
.vx-lawnav__list{ display:grid; gap:9px; }
.vx-lawnav__list a{ font-size:13.5px; transition:color .18s ease, padding-left .18s ease; }
.vx-lawnav__list a:hover{ color:var(--main-color); padding-left:4px; }
.vx-lawnav__list .is-here{ color:var(--main-color); font-weight:600; }

.vx-lawdoc{
  background:var(--white-color); border:1px solid var(--bone-hair);
  border-radius:var(--slot); padding:clamp(24px,3.4vw,52px); box-shadow:var(--lift-1);
}
.vx-lawdoc > * + *{ margin-top:16px; }
.vx-lawdoc h2{
  margin-top:clamp(30px,3.4vw,44px); font-size:clamp(20px,1.8vw,25px);
  padding-top:18px; border-top:1px solid var(--bone-hair);
}
.vx-lawdoc h2:first-child{ margin-top:0; padding-top:0; border-top:0; }
.vx-lawdoc h3{ margin-top:24px; font-size:17px; }
.vx-lawdoc p,.vx-lawdoc li{ font-size:15px; line-height:1.68; }
.vx-lawdoc ul,.vx-lawdoc ol{ display:grid; gap:9px; padding-left:22px; }
.vx-lawdoc ul li{ list-style:disc; }
.vx-lawdoc ol li{ list-style:decimal; }
.vx-lawdoc a{ color:var(--emerald-dim); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.vx-lawdoc strong{ color:var(--primary-color); }
.vx-lawdoc__note{
  padding:18px 20px; border-radius:var(--slot);
  background:var(--emerald-haze); border:1px solid rgba(16,185,129,.28);
}
.vx-lawdoc__note p{ font-size:14px; }
.vx-lawdoc__card{
  padding:18px 20px; border-radius:var(--slot);
  background:var(--secondary-color); display:grid; gap:7px;
}
.vx-lawdoc__card p{ font-size:14.5px; }

/* ==========================================================================
   18. Responsive
   ========================================================================== */
@media (max-width:1180px){
  .vx-mast__dial{ display:none; }
  .vx-workcard{ flex-basis:calc((100% - clamp(16px,1.8vw,24px)) / 2); }
  .vx-baseboard__grid{ grid-template-columns:1.4fr 1fr 1.3fr; }
  .vx-baseboard__cell--brand{ grid-column:1 / -1; }
  .vx-stage__say{ max-width:56%; }
}

/* below this the card is too narrow to hold the form and the figure side by side */
@media (max-width:1280px){
  .vx-stage__worker{
    position:static; height:auto; width:min(300px,50%);
    margin:0 0 6px auto; display:block;
    filter:drop-shadow(0 14px 26px rgba(17,24,39,.28));
  }
  .vx-intake__form,.vx-intake__title,.vx-intake__lede{ max-width:none; }
}

@media (max-width:1024px){
  .vx-nav{ display:none; }
  .vx-burger{ display:block; }

  /* technician drops into the flow between the copy and the form */
  .vx-stage__say{ max-width:none; padding-bottom:0; }

  .vx-orgstory__head,.vx-trustcase__head{ grid-template-columns:1fr; align-items:start; }
  .vx-orgstory__trio{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .vx-slab--list{ grid-column:1 / -1; }
  .vx-trustcase__trio{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .vx-slab--photo{ grid-column:1 / -1; min-height:240px; }
  .vx-edgegrid__frame{ grid-template-columns:1fr 1fr; }
  .vx-edgegrid__portrait{ grid-column:1 / -1; grid-row:1; min-height:340px; border-radius:clamp(160px,26vw,240px) clamp(160px,26vw,240px) 26px 26px; }
  .vx-routemap__chain{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .vx-stepcard:nth-child(3)::before,.vx-stepcard:nth-child(3)::after{ display:none; }
  .vx-summon__inner{ grid-template-columns:1fr; }
  .vx-summon__shot{ aspect-ratio:16/9; order:-1; }
}

@media (max-width:860px){
  .vx-worklist__note{ text-align:left; flex-basis:100%; order:3; }
  .vx-banderole{ aspect-ratio:auto; min-height:0; }
  .vx-banderole > img{ height:230px; }
  .vx-banderole__strip{ position:static; grid-template-columns:1fr; gap:12px; background:var(--primary-color); }
  .vx-baseboard__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .vx-baseboard__contact{ gap:12px; flex-direction:column; align-items:flex-start; }
  .vx-baseboard__base{ flex-direction:column; align-items:flex-start; }
  .vx-baseboard__legal{ margin-inline:0; }
}

@media (max-width:680px){
  :root{ --rhythm:clamp(54px,11vw,76px); --spill:44px; }
  .vx-mast__inner{ min-height:70px; }
  .vx-mast__tail .vx-pillbtn{ display:none; }
  .vx-drawer__sheet{ inset:70px 0 auto 0; max-height:calc(100dvh - 70px); }
  .vx-stage__acts{ gap:16px; }
  .vx-stage__acts .vx-pillbtn{ width:100%; }
  .vx-stage__acts .vx-pillbtn__body{ flex:1; }
  .vx-stage__worker{ width:min(230px,58%); }
  .vx-stage__proof{ gap:14px 20px; }
  .vx-stage__score{ padding-left:0; border-left:0; }
  .vx-workcard{ flex-basis:100%; min-height:400px; }
  .vx-orgstory__trio{ grid-template-columns:1fr; }
  .vx-trustcase__trio{ grid-template-columns:1fr; }
  .vx-slab--photo{ min-height:220px; }
  .vx-edgegrid__frame{ grid-template-columns:1fr; }
  .vx-routemap__chain{ grid-template-columns:1fr; gap:34px; }
  .vx-stepcard + .vx-stepcard::before{
    display:block;                       /* re-show: the 2-column rule hid step 3 */
    top:-34px; left:50%; width:2px; height:34px; transform:translateX(-50%);
    background:linear-gradient(to bottom, rgba(16,185,129,.25), var(--main-color));
  }
  .vx-stepcard + .vx-stepcard::after{
    top:-11px; left:50%; transform:translateX(-50%) rotate(135deg); display:block;
  }
  .vx-handoff{ border-radius:var(--slot); padding:18px; }
  .vx-intake__rows{ grid-template-columns:1fr; }
  .vx-lawbody__wrap{ grid-template-columns:1fr; }
  .vx-lawnav{ position:static; }
  .vx-cookiedock__acts{ flex-direction:column; align-items:stretch; }
  .vx-cookiedock__acts .vx-pillbtn{ width:100%; }
  .vx-cookiedock__toggle{ margin:4px auto 0; }
}

@media (max-width:480px){
  .vx-brandmark__trail{ letter-spacing:.12em; font-size:10.5px; }
  .vx-stage__title{ font-size:clamp(28px,8.4vw,38px); }

  .vx-facepile--lg img{ width:42px; height:42px; }
  .vx-baseboard__grid{ grid-template-columns:1fr; }
}