/* Flexible Washing LLC — the site's styles. One owner for index.html and commercial/. */
:root{
/* PALETTE, 2026-09-17. ONE OWNER of every colour on this site.
   ref: her business card (photo-inbox/pressure-washing/1788392597832-37iazq.jpg).
   Sampled off the card: the wordmark and the shield quadrants are both #002460,
   the stars and "WASHING LLC" are #F3B33C. Those two are her identity and are
   not up for redesign.
   Alec 2026-09-17, relaying the client: the blue was too dark, they want a happy
   "sunshine" feel, use the blue from the logo. Those two pull apart - the logo
   blue is DARKER than what the site was already using (#002460 is L19%, the old
   --green #2B57A3 was L40%). So: her logo navy becomes the INK and the dark
   bands (replacing a murky near-black #0F1D33, which is what actually read as
   "too dark"), and the accent blue is her logo's own hue 217 lifted in
   lightness and saturation - the same blue, brighter. The sunshine is her gold,
   used more, plus paler and cooler grounds. Every pair below is WCAG-checked;
   ratios are in the comments. */
--logo-navy:#002460;           /* sampled from the card. do not "improve" */
--ink:#0A2148;                 /* body + headings. 13.3:1 on white */
--ink-soft:rgba(10,33,72,.78);
--muted:rgba(10,33,72,.62);    /* 6.1:1 on white */
--green:#115CD4;               /* PRIMARY. hue 217 like the logo, S85 L45.
                                  5.99:1 on white AND white 5.99:1 on it, so it
                                  works as link colour and as button fill */
--green-2:#0A4DB8;             /* pressed/hover. 7.6:1 on white */
--green-lt:#E3EDFC;            /* pale plate. navy on it 12.4:1 */
--brass:#F3B33C;               /* her gold. 7.97:1 on --dark. NEVER as text on
                                  white: it is 1.85:1 there. Use --gold-ink. */
--gold-ink:#8A5C06;            /* the gold when it must be small text on white */
--dark:#002460;                /* dark bands are now HER navy, not #0F1D33 */
--paper:#F4F8FF;
--paper2:#E6EEFA;
--paper3:#FFFFFF;
--line:rgba(10,33,72,.14);
--mono:'Spline Sans Mono',ui-monospace,monospace;
--display:'Manrope',system-ui,sans-serif;
--body:'Plus Jakarta Sans',system-ui,sans-serif;
--ease:cubic-bezier(.22,1,.36,1);
--ease-out:cubic-bezier(.23,1,.32,1);   /* emil: strong ease-out */
--rad:12px;--rad-sm:6px;--wrap:1200px;
}
/* ---- hero (heroes #1) ---- */
.vxs-hero *{box-sizing:border-box;margin:0;padding:0;}.vxs-hero body{font-family:var(--body);background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}.vxs-hero img{display:block;max-width:100%;}.vxs-hero a{color:inherit;text-decoration:none;}.vxs-hero .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}@media(max-width:560px){.vxs-hero .wrap{padding:0 20px;}}.vxs-hero .cat-bar{background:var(--dark);color:#fff;padding:14px 0;position:sticky;top:0;z-index:300;}.vxs-hero .cat-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}.vxs-hero .cat-bar b{font-family:var(--display);font-weight:700;font-size:15px;}.vxs-hero .cat-bar span{font-size:12.5px;color:rgba(255,255,255,.62);}.vxs-hero .hero-block{position:relative;border-bottom:6px solid var(--paper2);}.vxs-hero .hero-label{position:absolute;top:0;left:0;z-index:120;background:var(--dark);color:#fff;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:9px 16px;border-bottom-right-radius:12px;max-width:90%;}.vxs-hero .hero-label b{color:var(--brass);font-weight:700;}.vxs-hero .hero-label em{font-style:normal;color:rgba(255,255,255,.55);font-weight:500;}.vxs-hero .eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--body);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--green);}.vxs-hero .eyebrow::before{content:"";width:26px;height:1.5px;background:var(--green);}.vxs-hero .eyebrow.on-dark{color:#fff;opacity:.9;}.vxs-hero .eyebrow.on-dark::before{background:var(--brass);}.vxs-hero .title{font-family:var(--display);font-weight:600;letter-spacing:-.022em;line-height:1.04;text-wrap:balance;}.vxs-hero .title .accent{color:var(--green);}.vxs-hero .title.on-dark .accent{color:var(--brass);}.vxs-hero .lede{font-size:1.16rem;line-height:1.6;color:var(--ink-soft);}.vxs-hero .btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--display);font-weight:600;font-size:15.5px;padding:14px 28px;border-radius:var(--rad-sm);border:1.5px solid transparent;transition:transform .2s var(--ease),background .2s var(--ease);cursor:pointer;}.vxs-hero .btn:active{transform:scale(.98);}.vxs-hero .btn-primary{background:var(--green);color:#fff;border-color:var(--green);}.vxs-hero .btn-primary:hover{background:var(--green-2);transform:translateY(-1px);}.vxs-hero .btn-glass{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.5);backdrop-filter:blur(8px);}.vxs-hero .btn-glass:hover{background:rgba(255,255,255,.22);border-color:#fff;}.vxs-hero :focus-visible{outline:2px solid var(--green);outline-offset:3px;}.vxs-hero .hjg :focus-visible,.vxs-hero .hsgv :focus-visible,.vxs-hero .hmn :focus-visible,.vxs-hero .hoa :focus-visible,.vxs-hero .hba :focus-visible{outline-color:var(--brass);}.vxs-hero .hjg .btn-primary,.vxs-hero .hmn .btn-primary,.vxs-hero .hoa .btn-primary,.vxs-hero .hba .btn-primary{box-shadow:0 10px 28px -10px rgba(0,0,0,.55);}.vxs-hero .hjg .btn-primary:hover,.vxs-hero .hmn .btn-primary:hover,.vxs-hero .hoa .btn-primary:hover,.vxs-hero .hba .btn-primary:hover{box-shadow:0 14px 32px -12px rgba(0,0,0,.55);}.vxs-hero .ctarow{display:flex;flex-wrap:wrap;gap:14px;align-items:center;}.vxs-hero .stars{color:var(--brass);letter-spacing:1px;}.vxs-hero .revs{display:flex;flex-wrap:wrap;gap:12px;}.vxs-hero .rev{display:inline-flex;align-items:center;gap:9px;background:var(--paper3);border:1px solid var(--line);border-radius:999px;padding:9px 16px;box-shadow:0 2px 10px -5px rgba(10,34,44,.2);}.vxs-hero .rev b{font-family:var(--display);font-weight:700;font-size:15px;color:var(--ink);}.vxs-hero .rev .rs{color:var(--brass);font-size:13px;}.vxs-hero .rev .rc{font-size:12.5px;color:var(--muted);}.vxs-hero .rev.on-dark{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);}.vxs-hero .rev.on-dark b{color:#fff;}.vxs-hero .rev.on-dark .rc{color:rgba(255,255,255,.6);}.vxs-hero .chips{display:flex;flex-wrap:wrap;gap:10px 22px;}.vxs-hero .chip{display:inline-flex;align-items:center;gap:9px;font-family:var(--display);font-weight:500;font-size:14px;}.vxs-hero .chip .ic{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;background:var(--green-lt);color:var(--green);font-size:12px;font-weight:700;}.vxs-hero .chip.on-dark{color:#fff;}.vxs-hero .chip.on-dark .ic{background:rgba(191,160,90,.22);color:var(--brass);}.vxs-hero /* 01 JG centered */
.hjg{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;background:var(--dark);overflow:hidden;}.vxs-hero .hjg .bg{position:absolute;inset:0;}.vxs-hero .hjg .bg img{width:100%;height:100%;object-fit:cover;}.vxs-hero .hjg .scrim{position:absolute;inset:0;background-color:rgba(10,34,44,.14);background-image:radial-gradient(120% 100% at 50% 42%,rgba(10,34,44,.44),rgba(10,34,44,.84));}.vxs-hero .hjg .inner{position:relative;z-index:2;padding:90px 0;}.vxs-hero .hjg .pre{font-family:var(--display);font-weight:500;font-size:1.05rem;color:rgba(255,255,255,.85);margin-bottom:18px;text-shadow:0 2px 28px rgba(10,34,44,.45);}.vxs-hero .hjg .title{color:#fff;font-weight:700;font-size:clamp(2.8rem,5.6vw,4.8rem);max-width:15ch;margin:0 auto 36px;text-shadow:0 2px 28px rgba(10,34,44,.45);}.vxs-hero .hjg .ctarow{justify-content:center;}.vxs-hero .hjg .btn{padding:16px 34px;font-size:16px;}.vxs-hero /* 02 SGV dense,.vxs-hero no person */
.hsgv{position:relative;min-height:100vh;display:flex;flex-direction:column;background:var(--dark);overflow:hidden;}.vxs-hero .hsgv .bg{position:absolute;inset:0;}.vxs-hero .hsgv .bg img{width:100%;height:100%;object-fit:cover;}.vxs-hero .hsgv .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,34,44,.7),transparent 120px),linear-gradient(95deg,rgba(10,34,44,.95)0%,rgba(10,34,44,.78)45%,rgba(10,34,44,.4)75%,rgba(10,34,44,.2)100%);}.vxs-hero .hsgv .body{position:relative;z-index:3;flex:1;display:flex;align-items:center;}.vxs-hero .hsgv .copy{max-width:620px;padding:40px 0;}.vxs-hero .hsgv .title{color:#fff;font-size:clamp(2.4rem,4.4vw,3.9rem);margin:16px 0 18px;}.vxs-hero .hsgv .lede{color:rgba(255,255,255,.88);max-width:500px;margin-bottom:22px;}.vxs-hero .hsgv .chips{margin-bottom:26px;}.vxs-hero .hsgv .ctarow{margin-bottom:26px;}.vxs-hero /* 04 full-bleed + credentials bar */
.hoa{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:center;background:var(--dark);overflow:hidden;}.vxs-hero .hoa .bg{position:absolute;inset:0;}.vxs-hero .hoa .bg img{width:100%;height:100%;object-fit:cover;}.vxs-hero .hoa .scrim{position:absolute;inset:0;background:linear-gradient(100deg,rgba(10,34,44,.92)0%,rgba(10,34,44,.6)46%,rgba(10,34,44,.18)80%,transparent);}.vxs-hero .hoa .inner{position:relative;z-index:2;flex:1;display:flex;align-items:center;padding:90px 0 50px;}.vxs-hero .hoa .copy{max-width:660px;}.vxs-hero .hoa .title{color:#fff;font-weight:700;font-size:clamp(2.6rem,5vw,4.3rem);margin:18px 0 22px;}.vxs-hero .hoa .lede{color:rgba(255,255,255,.9);max-width:560px;margin-bottom:30px;}.vxs-hero .hoa .bar{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.18);background:rgba(10,34,44,.42);backdrop-filter:blur(6px);}.vxs-hero .hoa .bar .wrap{display:flex;flex-wrap:wrap;align-items:center;min-height:60px;}.vxs-hero .hoa .bar .it{display:inline-flex;align-items:center;gap:9px;font-family:var(--display);font-weight:500;font-size:13.5px;color:rgba(255,255,255,.92);padding:16px 28px;border-right:1px solid rgba(255,255,255,.16);}.vxs-hero .hoa .bar .it:first-child{padding-left:0;}.vxs-hero .hoa .bar .it:last-child{border-right:0;padding-right:0;}.vxs-hero .hoa .bar .it .stars{font-size:13px;}@media(max-width:760px){.vxs-hero .hoa .bar .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:0 24px;padding-top:8px;padding-bottom:8px;}.vxs-hero .hoa .bar .it{border-right:0;padding:8px 0;}}.vxs-hero /* 05 NEW: full-screen bottom-anchored */
.hba{position:relative;min-height:100vh;display:flex;align-items:flex-end;background:var(--dark);overflow:hidden;}.vxs-hero .hba .bg{position:absolute;inset:0;}.vxs-hero .hba .bg img{width:100%;height:100%;object-fit:cover;}.vxs-hero .hba .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,34,44,.62)0%,rgba(10,34,44,.25)16%,rgba(10,34,44,.15)35%,rgba(10,34,44,.92)100%);}.vxs-hero .hba .inner{position:relative;z-index:2;width:100%;padding:0 0 84px;}.vxs-hero .hba .copy{max-width:760px;}.vxs-hero .hba .title{color:#fff;font-weight:700;font-size:clamp(2.8rem,5.4vw,4.6rem);margin:16px 0 22px;}.vxs-hero .hba .lede{color:rgba(255,255,255,.9);max-width:560px;margin-bottom:30px;}.vxs-hero /* 03 monument — full-bleed photo,.vxs-hero massive left headline,.vxs-hero nothing else */
.hmn{position:relative;min-height:92vh;display:flex;align-items:center;background:var(--dark);overflow:hidden;}.vxs-hero .hmn-bg{position:absolute;inset:0;}.vxs-hero .hmn-bg img{width:100%;height:100%;object-fit:cover;}.vxs-hero .hmn-scrim{position:absolute;inset:0;background:linear-gradient(78deg,rgba(10,34,44,.92) 0%,rgba(10,34,44,.72) 40%,rgba(10,34,44,.28) 72%,rgba(10,34,44,.12) 100%);}.vxs-hero .hmn-copy{position:relative;z-index:2;max-width:var(--wrap);margin:0 auto;width:100%;padding:110px 32px;}.vxs-hero .hmn-kick{font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.75);margin-bottom:22px;}.vxs-hero .hmn-title{font-family:var(--display);font-weight:800;font-size:clamp(3rem,6.4vw,5.6rem);letter-spacing:-.028em;line-height:.98;color:#fff;max-width:14ch;margin:0 0 26px;text-wrap:balance;}.vxs-hero .hmn-lede{font-size:1.12rem;color:rgba(255,255,255,.85);max-width:46ch;margin-bottom:36px;}.vxs-hero .hmn .btn{padding:16px 32px;font-size:16px;}@media(max-width:560px){.vxs-hero .hmn{min-height:78vh;}.vxs-hero .hmn-copy{padding:80px 20px;}}
/* ---- services (services #3) ---- */
.vxs-services *{box-sizing:border-box;margin:0;padding:0;}.vxs-services body{font-family:var(--body);background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}.vxs-services img{display:block;max-width:100%;}.vxs-services a{color:inherit;text-decoration:none;}.vxs-services :focus-visible{outline:2px solid var(--green);outline-offset:3px;}.vxs-services .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}@media(max-width:560px){.vxs-services .wrap{padding:0 20px;}}.vxs-services .cat-bar{background:var(--dark);color:#fff;padding:14px 0;position:sticky;top:0;z-index:300;}.vxs-services .cat-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}.vxs-services .cat-bar b{font-family:var(--display);font-weight:700;font-size:15px;}.vxs-services .cat-bar a{font-size:12.5px;color:#7fd4a6;}.vxs-services .cat-bar span{font-size:12.5px;color:rgba(255,255,255,.6);}.vxs-services .sec{position:relative;border-bottom:6px solid var(--paper2);padding:96px 0;}.vxs-services .sec:nth-child(even){background:var(--paper);}.vxs-services .lab{position:absolute;top:0;left:0;z-index:30;background:var(--dark);color:#fff;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:9px 16px;border-bottom-right-radius:12px;max-width:92%;}.vxs-services .lab b{color:var(--brass);font-weight:700;}.vxs-services .lab em{font-style:normal;color:rgba(255,255,255,.55);font-weight:500;text-transform:none;letter-spacing:0;}.vxs-services .h2{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.2vw,2.5rem);letter-spacing:-.02em;line-height:1.1;margin:0 0 14px;}.vxs-services .lede{font-size:1.05rem;color:var(--ink-soft);max-width:60ch;}.vxs-services .head{max-width:680px;margin-bottom:50px;}.vxs-services .ic{stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px;}.vxs-services /* scroll-triggered reveal (TASTE CORE 4: tied to scroll entry,.vxs-services never on-appear) */
.rv{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--d,0ms);}.vxs-services .rv.in{opacity:1;transform:none;}@media(prefers-reduced-motion:reduce){.vxs-services .rv{opacity:1;transform:none;transition:none;}}.vxs-services .golink{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-weight:600;font-size:13.5px;color:var(--green-2);}.vxs-services .golink .ar{display:inline-block;width:18px;height:1.5px;background:var(--green-2);position:relative;transition:width .25s var(--ease);}.vxs-services .golink .ar::after{content:"";position:absolute;right:-1px;top:-3px;border:solid var(--green-2);border-width:0 1.5px 1.5px 0;padding:2.6px;transform:rotate(-45deg);}.vxs-services .golink:hover{color:var(--green-2);}.vxs-services .golink:hover .ar{width:30px;}.vxs-services .iplate{width:46px;height:46px;border-radius:10px;background:var(--green-lt);color:var(--green-2);display:grid;place-items:center;flex:none;transition:background .25s var(--ease),color .25s var(--ease);}.vxs-services /* 01 ledger rows */
.s1-row{display:grid;grid-template-columns:70px 46px 1fr auto;gap:26px;align-items:center;padding:26px 10px;border-top:1px solid var(--line);transition:background .25s var(--ease);}.vxs-services .s1-row:last-child{border-bottom:1px solid var(--line);}.vxs-services .s1-row:hover{background:rgba(255,255,255,.55);}.vxs-services .s1-n{font-family:var(--display);font-weight:700;font-size:1.5rem;color:rgba(18,32,54,.18);letter-spacing:.04em;font-variant-numeric:tabular-nums;}.vxs-services .s1-bd h3{font-family:var(--display);font-weight:600;font-size:1.22rem;line-height:1.25;}.vxs-services .s1-bd p{font-size:13.5px;color:var(--ink-soft);max-width:56ch;}.vxs-services .s1-row:hover .iplate{background:var(--green);color:#fff;}.vxs-services .s1-row:hover .golink .ar{width:30px;}@media(max-width:680px){.vxs-services .s1-row{grid-template-columns:46px 1fr;gap:16px;}.vxs-services .s1-n,.vxs-services .s1-row .golink{display:none;}}.vxs-services /* 02 photo dossier split */
.s2{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:stretch;}.vxs-services .s2-photo{position:relative;border-radius:var(--rad);overflow:hidden;min-height:520px;}.vxs-services .s2-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s var(--ease);}.vxs-services .s2-photo img.on{opacity:1;}.vxs-services .s2-capline{font-family:var(--display);font-weight:600;font-size:12.5px;color:var(--muted);margin-top:10px;letter-spacing:.02em;}.vxs-services .s2-list{display:flex;flex-direction:column;}.vxs-services .s2-it{display:flex;align-items:center;gap:18px;padding:19px 12px;border-top:1px solid var(--line);cursor:pointer;transition:background .25s var(--ease);}.vxs-services .s2-it:last-child{border-bottom:1px solid var(--line);}.vxs-services .s2-it h3{font-family:var(--display);font-weight:600;font-size:1.12rem;flex:1;}.vxs-services .s2-it.on{background:rgba(255,255,255,.6);}.vxs-services .s2-it.on .iplate{background:var(--green);color:#fff;}@media(max-width:860px){.vxs-services .s2{grid-template-columns:1fr;}.vxs-services .s2-photo{min-height:300px;}}.vxs-services /* 03 alternating feature bands (TASTE CORE 5) */
.s3-feat{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;margin-bottom:64px;}.vxs-services .s3-feat.flip .s3-img{order:2;}.vxs-services .s3-img{position:relative;border-radius:var(--rad);overflow:hidden;aspect-ratio:16/11;}.vxs-services .s3-img img{width:100%;height:100%;object-fit:cover;}.vxs-services .s3-bd h3{font-family:var(--display);font-weight:600;font-size:1.55rem;letter-spacing:-.01em;margin-bottom:10px;}.vxs-services .s3-bd p{font-size:14.5px;color:var(--ink-soft);max-width:52ch;margin-bottom:18px;}.vxs-services .s3-rest{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);}.vxs-services .s3-mini{display:flex;flex-direction:column;gap:10px;padding:24px 22px 4px 0;border-left:1px solid var(--line);padding-left:22px;}.vxs-services .s3-mini:first-child{border-left:0;padding-left:0;}.vxs-services .s3-mini h4{font-family:var(--display);font-weight:600;font-size:1rem;}.vxs-services .s3-mini p{font-size:13.5px;line-height:1.55;color:var(--ink-soft);}@media(max-width:860px){.vxs-services .s3-feat{grid-template-columns:1fr;gap:26px;}.vxs-services .s3-feat.flip .s3-img{order:0;}.vxs-services .s3-rest{grid-template-columns:1fr 1fr;}.vxs-services .s3-mini{border-left:0;padding-left:0;border-top:1px solid var(--line);}}.vxs-services /* 04 anchor bento */
.s4{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;}.vxs-services .s4-photo{grid-column:span 6;position:relative;border-radius:var(--rad);overflow:hidden;min-height:330px;display:flex;align-items:flex-end;color:#fff;}.vxs-services .s4-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}.vxs-services .s4-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.72) 100%);}.vxs-services .s4-photo:hover img{transform:scale(1.04);}.vxs-services .s4-photo .bd{position:relative;z-index:2;padding:24px 26px;}.vxs-services .s4-photo h3{font-family:var(--display);font-weight:700;font-size:1.35rem;margin-bottom:4px;}.vxs-services .s4-photo p{font-size:13px;color:rgba(255,255,255,.85);max-width:44ch;margin-bottom:10px;}.vxs-services .s4-photo .golink{color:#fff;}.vxs-services .s4-photo .golink .ar{background:#fff;}.vxs-services .s4-photo .golink .ar::after{border-color:#fff;}.vxs-services .s4-tile{grid-column:span 3;background:var(--paper3);border:1px solid var(--line);border-radius:var(--rad);padding:24px;display:flex;flex-direction:column;gap:12px;transition:transform .3s var(--ease),box-shadow .3s var(--ease);}.vxs-services .s4-tile:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(0,0,0,.25);}.vxs-services .s4-tile:hover .iplate{background:var(--green);color:#fff;}.vxs-services .s4-tile h3{font-family:var(--display);font-weight:600;font-size:1.05rem;}.vxs-services .s4-tile p{font-size:13.5px;line-height:1.55;color:var(--ink-soft);flex:1;}@media(max-width:860px){.vxs-services .s4-photo{grid-column:span 12;min-height:240px;}.vxs-services .s4-tile{grid-column:span 6;}}@media(max-width:520px){.vxs-services .s4-tile{grid-column:span 12;}}.vxs-services /* 06 emergency-first split */
.s6{display:grid;grid-template-columns:1fr 1.5fr;gap:18px;align-items:stretch;}.vxs-services .s6-em{background:var(--dark);border-radius:var(--rad);color:#fff;padding:38px 34px;display:flex;flex-direction:column;position:relative;overflow:hidden;}.vxs-services .s6-em::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(0,0,0,0) 55%);pointer-events:none;}.vxs-services .s6-em .s5-ic{color:var(--brass);margin-bottom:16px;}.vxs-services .s6-em h3{font-family:var(--display);font-weight:700;font-size:1.5rem;line-height:1.15;margin-bottom:8px;}.vxs-services .s6-em p{font-size:13.5px;color:rgba(255,255,255,.72);margin-bottom:22px;max-width:34ch;}.vxs-services .s6-num{font-family:var(--display);font-weight:700;font-size:clamp(1.5rem,2.4vw,1.9rem);color:var(--brass);letter-spacing:-.01em;}.vxs-services .s6-em .sub{margin-top:6px;font-size:12px;color:rgba(255,255,255,.5);}.vxs-services .s6-list{display:flex;flex-direction:column;justify-content:center;}.vxs-services .s6-it{display:grid;grid-template-columns:46px 1fr auto;gap:18px;align-items:center;padding:17px 14px;border-top:1px solid var(--line);transition:background .25s var(--ease);}.vxs-services .s6-it:first-child{border-top:0;}.vxs-services .s6-it:hover{background:rgba(255,255,255,.55);}.vxs-services .s6-it:hover .iplate{background:var(--green);color:#fff;}.vxs-services .s6-it:hover .golink .ar{width:30px;}.vxs-services .s6-it h3{font-family:var(--display);font-weight:600;font-size:1.08rem;}.vxs-services .s6-it p{font-size:13.5px;line-height:1.55;color:var(--ink-soft);}@media(max-width:820px){.vxs-services .s6{grid-template-columns:1fr;}}
/* ---- process (process #4) ---- */
.vxs-process *{box-sizing:border-box;margin:0;padding:0;}.vxs-process body{font-family:var(--body);overflow-x:hidden;background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}.vxs-process img{display:block;max-width:100%;}.vxs-process a{color:inherit;text-decoration:none;}.vxs-process :focus-visible{outline:2px solid var(--green);outline-offset:3px;}.vxs-process .p7 :focus-visible{outline-color:var(--brass);}.vxs-process .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}@media(max-width:560px){.vxs-process .wrap{padding:0 20px;}}.vxs-process .cat-bar{background:var(--dark);color:#fff;padding:14px 0;position:sticky;top:0;z-index:300;}.vxs-process .cat-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}.vxs-process .cat-bar b{font-family:var(--display);font-weight:700;font-size:15px;}.vxs-process .cat-bar a{font-size:12.5px;color:#7fd4a6;}.vxs-process .cat-bar span{font-size:12.5px;color:rgba(255,255,255,.6);}.vxs-process .sec{position:relative;border-bottom:6px solid var(--paper2);padding:96px 0;}.vxs-process .sec:nth-child(even){background:var(--paper);}.vxs-process .lab{position:absolute;top:0;left:0;z-index:30;background:var(--dark);color:#fff;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:9px 16px;border-bottom-right-radius:12px;max-width:92%;}.vxs-process .lab b{color:var(--brass);font-weight:700;}.vxs-process .lab em{font-style:normal;color:rgba(255,255,255,.55);font-weight:500;text-transform:none;letter-spacing:0;}.vxs-process .h2{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.2vw,2.5rem);letter-spacing:-.02em;line-height:1.1;margin:0 0 14px;}.vxs-process .lede{font-size:1.05rem;color:var(--ink-soft);max-width:60ch;}.vxs-process .head{max-width:680px;margin-bottom:50px;}.vxs-process .ic{stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;width:24px;height:24px;}.vxs-process .rv{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--d,0ms);}.vxs-process .rv.in{opacity:1;transform:none;}@media(prefers-reduced-motion:reduce){.vxs-process .rv{opacity:1;transform:none;transition:none;}}.vxs-process .iplate{width:36px;height:36px;border-radius:10px;background:transparent;border:1px solid var(--line);color:var(--green-2);display:grid;place-items:center;flex:none;}.vxs-process /* 03 split sticky */
.p4{display:grid;grid-template-columns:1fr 1.35fr;gap:60px;align-items:start;}.vxs-process .p4-side{position:sticky;top:96px;}.vxs-process .p4-side .lede{margin-bottom:22px;}.vxs-process .p4-call{font-family:var(--display);font-weight:700;font-size:1.05rem;color:var(--green-2);}.vxs-process .p4-st{display:grid;grid-template-columns:36px 1fr;gap:20px;padding:24px 0;border-top:1px solid var(--line);}.vxs-process .p4-k{font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.1em;color:var(--muted);display:block;margin-bottom:4px;}.vxs-process .p4-st:last-child{border-bottom:1px solid var(--line);}.vxs-process .p4-st h3{font-family:var(--display);font-weight:600;font-size:1.18rem;margin-bottom:5px;}.vxs-process .p4-st p{font-size:14px;color:var(--ink-soft);max-width:52ch;}@media(max-width:820px){.vxs-process .p4{grid-template-columns:1fr;gap:30px;}.vxs-process .p4-side{position:static;}}.vxs-process /* 04 photo-anchored */
.p5{display:grid;grid-template-columns:1fr 1.15fr;gap:54px;align-items:center;}.vxs-process .p5-img{position:relative;border-radius:var(--rad);overflow:hidden;aspect-ratio:4/5;}.vxs-process .p5-img img{width:100%;height:100%;object-fit:cover;}.vxs-process .p5-capline{font-family:var(--display);font-weight:600;font-size:12.5px;color:var(--muted);margin-top:10px;}.vxs-process .p5-st{display:grid;grid-template-columns:34px 1fr;gap:16px;padding:17px 0;border-top:1px solid var(--line);align-items:baseline;}.vxs-process .p5-st:last-child{border-bottom:1px solid var(--line);}.vxs-process .p5-n{font-family:var(--display);font-weight:700;font-size:1rem;color:var(--green);}.vxs-process .p5-st h3{font-family:var(--display);font-weight:600;font-size:1.1rem;margin-bottom:3px;}.vxs-process .p5-st p{font-size:13.5px;color:var(--ink-soft);}@media(max-width:820px){.vxs-process .p5{grid-template-columns:1fr;gap:28px;}.vxs-process .p5-img{aspect-ratio:16/10;}}.vxs-process /* 05 stepper board */
.p6{border:1px solid var(--line);border-radius:14px;background:var(--paper3);overflow:hidden;display:grid;grid-template-columns:repeat(4,1fr);}.vxs-process .p6-st{padding:26px 26px 28px;border-left:1px solid var(--line);position:relative;transition:background .3s var(--ease);}.vxs-process .p6-st:first-child{border-left:0;}.vxs-process .p6-st::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease);}.vxs-process .p6-st:hover{background:var(--paper);}.vxs-process .p6-st:hover::after{transform:scaleX(1);}.vxs-process .p6-k{font-family:var(--display);font-weight:700;font-size:11.5px;letter-spacing:.09em;color:var(--muted);}.vxs-process .p6-st h3{font-family:var(--display);font-weight:600;font-size:1.08rem;margin:6px 0 4px;}.vxs-process .p6-st p{font-size:13.5px;color:var(--ink-soft);}@media(max-width:820px){.vxs-process .p6{grid-template-columns:1fr 1fr;}.vxs-process .p6-st{border-top:1px solid var(--line);}.vxs-process .p6-st:nth-child(-n+2){border-top:0;}}@media(max-width:520px){.vxs-process .p6{grid-template-columns:1fr;}.vxs-process .p6-st{border-top:1px solid var(--line);border-left:0;}.vxs-process .p6-st:first-child{border-top:0;}}.vxs-process /* 02 dark rail — edge-to-edge band,.vxs-process ghost numerals,.vxs-process no inner containers */
.p7{background:var(--dark);margin-inline:calc(50% - 50vw);padding:66px calc(50vw - 50%) 72px;color:#fff;}.vxs-process .p7-top{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-bottom:1px solid rgba(255,255,255,.16);padding-bottom:22px;}.vxs-process .p7 .h2{color:#fff;margin:0;}.vxs-process .p7-call{font-family:var(--display);font-weight:700;font-size:1rem;color:var(--brass);white-space:nowrap;}.vxs-process .p7-row{display:grid;grid-template-columns:repeat(4,1fr);}.vxs-process .p7-st{padding:34px 30px 0 0;position:relative;}.vxs-process .p7-st+.p7-st{border-left:1px solid rgba(255,255,255,.12);padding-left:30px;}.vxs-process .p7-n{font-family:var(--display);font-weight:800;font-size:3.4rem;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.28);display:block;margin-bottom:14px;}.vxs-process .p7-st:last-child .p7-n{-webkit-text-stroke-color:var(--brass);}.vxs-process .p7-st h3{font-family:var(--display);font-weight:600;font-size:1.08rem;margin-bottom:5px;}.vxs-process .p7-st p{font-size:13.5px;color:rgba(255,255,255,.6);max-width:26ch;}@media(max-width:820px){.vxs-process .p7-row{grid-template-columns:1fr;}.vxs-process .p7-st+.p7-st{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.12);margin-top:26px;padding-top:26px;}.vxs-process .p7-top{flex-direction:column;align-items:flex-start;gap:8px;}}.vxs-process /* 01 four verbs — editorial steps,.vxs-process no nodes,.vxs-process no track */
.p8{display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--ink);}.vxs-process .p8-st{padding:30px 26px 6px 26px;border-left:1px solid var(--line);}.vxs-process .p8-st:first-child{border-left:0;padding-left:0;}.vxs-process .p8-n{font-family:var(--display);font-weight:700;font-size:12px;color:var(--muted);letter-spacing:.1em;display:block;margin-bottom:12px;}.vxs-process .p8-st h3{font-family:var(--display);font-weight:800;font-size:clamp(1.7rem,3vw,2.7rem);letter-spacing:-.02em;line-height:1;margin-bottom:10px;}.vxs-process .p8-st:last-child h3{color:var(--green-2);}.vxs-process .p8-st:last-child .p8-n{color:var(--brass);}.vxs-process .p8-st p{font-size:13.5px;color:var(--ink-soft);max-width:26ch;}@media(max-width:820px){.vxs-process .p8{grid-template-columns:1fr;}.vxs-process .p8-st{border-left:0;padding:22px 0 4px 0;border-top:1px solid var(--line);}.vxs-process .p8-st:first-child{border-top:0;}}
/* ---- form (form #5) ---- */
.vxs-form *{box-sizing:border-box;margin:0;padding:0;}.vxs-form body{font-family:var(--body);overflow-x:hidden;background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}.vxs-form img{display:block;max-width:100%;}.vxs-form a{color:inherit;text-decoration:none;}.vxs-form .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}@media(max-width:560px){.vxs-form .wrap{padding:0 20px;}}.vxs-form .cat-bar{background:var(--dark);color:#fff;padding:14px 0;position:sticky;top:0;z-index:300;}.vxs-form .cat-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}.vxs-form .cat-bar b{font-family:var(--display);font-weight:700;font-size:15px;}.vxs-form .cat-bar a{font-size:12.5px;color:#7fd4a6;}.vxs-form .cat-bar span{font-size:12.5px;color:rgba(255,255,255,.6);}.vxs-form .sec{position:relative;border-bottom:6px solid var(--paper2);padding:92px 0;}.vxs-form .sec:nth-child(even){background:var(--paper);}.vxs-form .lab{position:absolute;top:0;left:0;z-index:30;background:var(--dark);color:#fff;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:9px 16px;border-bottom-right-radius:12px;max-width:92%;}.vxs-form .lab b{color:var(--brass);font-weight:700;}.vxs-form .lab em{font-style:normal;color:rgba(255,255,255,.55);font-weight:500;text-transform:none;letter-spacing:0;}.vxs-form .h2{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.2vw,2.5rem);letter-spacing:-.02em;line-height:1.1;margin:0 0 14px;}.vxs-form .lede{font-size:1.05rem;color:var(--ink-soft);max-width:56ch;}.vxs-form .head{max-width:680px;margin-bottom:50px;}.vxs-form .head.ctr{margin-left:auto;margin-right:auto;text-align:center;}.vxs-form .ic{stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px;}.vxs-form .rv{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease);}.vxs-form .rv.in{opacity:1;transform:none;}@media(prefers-reduced-motion:reduce){.vxs-form .rv{opacity:1;transform:none;transition:none;}}.vxs-form .fm{display:flex;flex-direction:column;gap:14px;}.vxs-form .fm-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}@media(max-width:560px){.vxs-form .fm-row{grid-template-columns:1fr;}}.vxs-form .fd{display:flex;flex-direction:column;gap:6px;}.vxs-form .fd span{font-family:var(--display);font-weight:600;font-size:12.5px;}.vxs-form .fd input,.vxs-form .fd textarea,.vxs-form .fd select{font-family:var(--body);font-size:14px;color:var(--ink);background:var(--paper);border:1px solid rgba(18,32,54,.20);border-radius:9px;padding:14px 14px;outline:none;transition:border-color .2s,box-shadow .2s;resize:vertical;appearance:none;}.vxs-form .fd input:focus,.vxs-form .fd textarea:focus,.vxs-form .fd select:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(14,116,144,.12);}.vxs-form .fd select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='rgba(18,32,54,0.55)' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;}.vxs-form .fm-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--green);color:#fff;border:none;border-radius:9px;padding:15px 26px;font-family:var(--display);font-weight:700;font-size:14.5px;cursor:pointer;width:100%;transition:background .25s var(--ease),transform .25s var(--ease);}.vxs-form .fm-btn:hover{background:var(--green-2);transform:translateY(-1px);}.vxs-form .fm-note{font-size:13.5px;color:var(--muted);text-align:center;}.vxs-form .contact-line{display:inline-flex;align-items:center;gap:11px;font-size:14px;font-weight:600;padding:7px 0;border-bottom:1px solid var(--line);transition:color .2s;}.vxs-form .contact-line:hover{color:var(--green-2);}.vxs-form .contact-line .ic{color:var(--green);}.vxs-form /* 01 split: pitch + framed form */
.f1{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start;}.vxs-form .f1-copy .lede{margin-bottom:26px;}.vxs-form .f1-lines{display:flex;flex-direction:column;gap:10px;align-items:flex-start;}.vxs-form .f1-form{background:var(--paper3);border:1.5px solid var(--green);border-radius:14px;padding:32px 30px;box-shadow:0 20px 55px -32px rgba(18,32,54,.4);}@media(max-width:820px){.vxs-form .f1{grid-template-columns:1fr;gap:36px;}}.vxs-form /* 03 centered compact */
.f3{max-width:520px;margin:0 auto;text-align:center;}.vxs-form .f3-form{background:var(--paper3);border:1px solid var(--line);border-radius:16px;padding:32px 30px;margin-top:30px;text-align:left;box-shadow:0 14px 40px rgba(18,32,54,.07);}.vxs-form .f3 .alt{margin-top:16px;font-size:13.5px;color:var(--ink-soft);}.vxs-form .f3 .alt a{color:var(--green-2);font-weight:700;text-decoration:underline;text-underline-offset:3px;}.vxs-form /* 05 hairline inline band — flat strip,.vxs-form underline fields (mid-page,.vxs-form low height) */
.f5b{border-top:2px solid var(--ink);border-bottom:1px solid var(--line);padding:38px 0 42px;display:grid;grid-template-columns:auto 1fr;gap:44px;align-items:end;}.vxs-form .f5b-ask{font-family:var(--display);font-weight:600;font-size:clamp(1.25rem,2.2vw,1.6rem);letter-spacing:-.01em;max-width:13ch;line-height:1.2;}.vxs-form .f5b-sub{display:block;font-family:var(--body);font-weight:400;font-size:13.5px;color:var(--ink-soft);letter-spacing:0;line-height:1.5;margin-top:8px;}.vxs-form .f5b-fields{display:grid;grid-template-columns:1fr 1fr 1.3fr auto;gap:26px;align-items:end;}.vxs-form .f5b-fields input{font:inherit;font-size:14.5px;color:var(--ink);background:none;border:0;border-bottom:1.5px solid var(--line);padding:9px 2px;outline:none;transition:border-color .2s;}.vxs-form .f5b-fields input:focus{border-color:var(--green);box-shadow:0 1.5px 0 var(--green);}.vxs-form .f5b-btn{font-family:var(--display);font-weight:700;font-size:14.5px;color:#fff;background:var(--green);border:none;padding:14px 26px;cursor:pointer;transition:background .2s;}.vxs-form .f5b-btn:hover{background:var(--green-2);}@media(max-width:860px){.vxs-form .f5b{grid-template-columns:1fr;gap:22px;}.vxs-form .f5b-fields{grid-template-columns:1fr;gap:16px;}}.vxs-form /* 06 checklist + compact form — open two-column,.vxs-form square ticks */
.f6b{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}.vxs-form .f6b-it{display:flex;gap:13px;padding:16px 0;border-top:1px solid var(--line);}.vxs-form .f6b-it:first-of-type{border-top:2px solid var(--ink);}.vxs-form .f6b-it i{width:10px;height:10px;background:var(--green);flex:none;margin-top:7px;}.vxs-form .f6b-it h3{font-family:var(--display);font-weight:600;font-size:1.04rem;}.vxs-form .f6b-it p{font-size:13.5px;color:var(--ink-soft);}.vxs-form .f6b-fm{display:flex;flex-direction:column;gap:14px;}.vxs-form .f6b-fm input{font:inherit;font-size:14.5px;color:var(--ink);background:var(--paper3);border:1px solid var(--line);border-radius:0;padding:13px 14px;outline:none;transition:border-color .2s;}.vxs-form .f6b-fm input:focus{border-color:var(--green);}.vxs-form .f6b-btn{font-family:var(--display);font-weight:700;font-size:15px;color:#fff;background:var(--green);border:none;padding:15px;cursor:pointer;transition:background .2s;}.vxs-form .f6b-btn:hover{background:var(--green-2);}.vxs-form .f6b-note{font-size:13.5px;color:var(--muted);text-align:center;}@media(max-width:820px){.vxs-form .f6b{grid-template-columns:1fr;gap:30px;}}.vxs-form /* 07 two ways — phone path | form path,.vxs-form vertical hairline */
.f7b{display:grid;grid-template-columns:1fr 1px 1fr;gap:0;max-width:880px;margin:0 auto;align-items:stretch;}.vxs-form .f7b-div{background:var(--line);}.vxs-form .f7b-side{padding:10px 48px;display:flex;flex-direction:column;justify-content:center;}.vxs-form .f7b-side:first-child{padding-left:0;}.vxs-form .f7b-side:last-child{padding-right:0;}.vxs-form .f7b-k{font-family:var(--display);font-weight:600;font-size:12.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:12px;}.vxs-form .f7b-tel{font-family:var(--display);font-weight:700;font-size:clamp(1.4rem,2.4vw,1.9rem);color:var(--green-2);letter-spacing:-.01em;}.vxs-form .f7b-side p{font-size:13.5px;color:var(--ink-soft);margin-top:8px;max-width:30ch;}.vxs-form .f7b-fm{display:flex;flex-direction:column;gap:12px;}.vxs-form .f7b-fm input{font:inherit;font-size:14.5px;color:var(--ink);background:var(--paper3);border:1px solid var(--line);border-radius:0;padding:12px 13px;outline:none;transition:border-color .2s;}.vxs-form .f7b-fm input:focus{border-color:var(--green);}.vxs-form .f7b-btn{font-family:var(--display);font-weight:700;font-size:14.5px;color:#fff;background:var(--green);border:none;padding:14px;cursor:pointer;transition:background .2s;}.vxs-form .f7b-btn:hover{background:var(--green-2);}@media(max-width:720px){.vxs-form .f7b{grid-template-columns:1fr;}.vxs-form .f7b-div{height:1px;margin:26px 0;}.vxs-form .f7b-side{padding:0;}}.vxs-form /* 02 tint band ask — contained tint block inside the wrap,.vxs-form ink top rule,.vxs-form underline fields on the tint */
.f9b{background:var(--green-lt);border-top:2px solid var(--ink);padding:54px 56px 58px;display:grid;grid-template-columns:1fr 1.3fr;gap:56px;align-items:center;}.vxs-form .f9b-ask h2{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,2.6vw,2rem);letter-spacing:-.015em;line-height:1.15;color:var(--green-2);margin-bottom:10px;}.vxs-form .f9b-ask p{font-size:14px;color:var(--ink-soft);max-width:38ch;}.vxs-form .f9b-fm{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:end;}.vxs-form .f9b-fm input{font:inherit;font-size:14.5px;color:var(--ink);background:none;border:0;border-bottom:1.5px solid rgba(24,86,57,.35);padding:9px 2px;outline:none;transition:border-color .2s;}.vxs-form .f9b-fm input::placeholder{color:rgba(18,32,54,.45);}.vxs-form .f9b-fm input:focus{border-color:var(--green-2);box-shadow:0 1.5px 0 var(--green-2);}.vxs-form .f9b-btn{grid-column:1/-1;font-family:var(--display);font-weight:700;font-size:15px;color:#fff;background:var(--green-2);border:none;padding:15px;cursor:pointer;transition:background .2s;}.vxs-form .f9b-btn:hover{background:var(--green);}@media(max-width:820px){.vxs-form .f9b{grid-template-columns:1fr;gap:26px;padding:36px 26px 40px;}}.vxs-form /* 04 photo beside ask — open split,.vxs-form hands photo,.vxs-form hairline top rule */
.f8b{display:grid;grid-template-columns:1fr 1.25fr;gap:56px;align-items:center;}.vxs-form .f8b-img{position:relative;border-radius:var(--rad);overflow:hidden;aspect-ratio:16/11;}.vxs-form .f8b-img img{width:100%;height:100%;object-fit:cover;}.vxs-form .f8b-bd{border-top:2px solid var(--ink);padding-top:26px;}.vxs-form .f8b-bd h2{font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,2.4vw,1.8rem);letter-spacing:-.01em;margin-bottom:6px;}.vxs-form .f8b-bd>p{font-size:14px;color:var(--ink-soft);margin-bottom:22px;max-width:44ch;}.vxs-form .f8b-fm{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:end;}.vxs-form .f8b-fm input{font:inherit;font-size:14.5px;color:var(--ink);background:none;border:0;border-bottom:1.5px solid var(--line);padding:9px 2px;outline:none;transition:border-color .2s;}.vxs-form .f8b-fm input:focus{border-color:var(--green);box-shadow:0 1.5px 0 var(--green);}.vxs-form .f8b-btn{font-family:var(--display);font-weight:700;font-size:14.5px;color:#fff;background:var(--green);border:none;padding:14px 24px;cursor:pointer;transition:background .2s;}.vxs-form .f8b-btn:hover{background:var(--green-2);}@media(max-width:860px){.vxs-form .f8b{grid-template-columns:1fr;gap:28px;}.vxs-form .f8b-fm{grid-template-columns:1fr;gap:16px;}}.vxs-form /* 08 when works — day chips (controls,.vxs-form pill-exempt) + phone,.vxs-form open on paper */
.f10b{display:grid;grid-template-columns:1fr 1.2fr;gap:60px;align-items:center;}.vxs-form .f10b-bd h2{font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,2.4vw,1.8rem);letter-spacing:-.01em;margin-bottom:8px;}.vxs-form .f10b-bd p{font-size:14px;color:var(--ink-soft);max-width:40ch;}.vxs-form .f10b-chips{display:flex;gap:10px;margin-bottom:24px;}.vxs-form .f10b-chips button{font-family:var(--display);font-weight:600;font-size:14px;color:var(--ink-soft);background:var(--paper3);border:1.5px solid var(--line);border-radius:999px;padding:10px 20px;cursor:pointer;transition:all .15s;}.vxs-form .f10b-chips button.on{background:var(--green);border-color:var(--green);color:#fff;}.vxs-form .f10b-fm{display:flex;flex-direction:column;gap:18px;align-items:stretch;}.vxs-form .f10b-fm .f10b-btn{align-self:flex-start;}.vxs-form .f10b-fm input{font:inherit;font-size:14.5px;color:var(--ink);background:none;border:0;border-bottom:1.5px solid var(--line);padding:9px 2px;outline:none;transition:border-color .2s;}.vxs-form .f10b-fm input:focus{border-color:var(--green);box-shadow:0 1.5px 0 var(--green);}.vxs-form .f10b-btn{font-family:var(--display);font-weight:700;font-size:14.5px;color:#fff;background:var(--green);border:none;padding:14px 26px;cursor:pointer;transition:background .2s;}.vxs-form .f10b-btn:hover{background:var(--green-2);}.vxs-form .f10b-alt{font-size:13.5px;color:var(--ink-soft);}.vxs-form .f10b-alt a{font-weight:700;color:var(--green-2);}@media(max-width:820px){.vxs-form .f10b{grid-template-columns:1fr;gap:26px;}.vxs-form .f10b-fm{gap:16px;}}.vxs-form /* 09 one question — a single conversational field */
.f11b{max-width:640px;margin:0 auto;text-align:center;}.vxs-form .f11b h2{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,2.6vw,2rem);letter-spacing:-.015em;margin-bottom:26px;}.vxs-form .f11b-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:left;grid-column:1/-1;}.vxs-form .f11b-row input{font:inherit;font-size:15px;color:var(--ink);background:var(--paper3);border:1px solid var(--line);border-radius:10px;padding:14px 16px;outline:none;transition:border-color .2s;}.vxs-form .f11b-row input:focus{border-color:var(--green);}.vxs-form .f11b-fm{display:grid;grid-template-columns:1fr auto;gap:12px;text-align:left;}.vxs-form .f11b-fm input{font:inherit;font-size:15px;color:var(--ink);background:var(--paper3);border:1px solid var(--line);border-radius:10px;padding:14px 16px;outline:none;transition:border-color .2s;}.vxs-form .f11b-fm input:focus{border-color:var(--green);}.vxs-form .f11b-btn{font-family:var(--display);font-weight:700;font-size:14.5px;color:#fff;background:var(--green);border:none;border-radius:10px;padding:14px 24px;cursor:pointer;transition:background .2s;}.vxs-form .f11b-btn:hover{background:var(--green-2);}.vxs-form .f11b-sub{margin-top:14px;font-size:13.5px;color:var(--muted);}@media(max-width:560px){.vxs-form .f11b-fm{grid-template-columns:1fr;}}.vxs-form /* shared focus + validation (kept last so it wins ties with variant base rules) */
:focus-visible{outline:2px solid var(--green);outline-offset:3px;}.vxs-form button:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(14,116,144,.28);}.vxs-form ::placeholder{color:var(--muted);}.vxs-form /* Validation: browsers flag touched-invalid fields via :user-invalid; pair a .fd-err line under the field. Success pattern: swap the submit button for a confirmation line in place (composer wires the handler). */
input:user-invalid,.vxs-form textarea:user-invalid,.vxs-form select:user-invalid{border-color:#B4543A;}.vxs-form .f5b-fields input:user-invalid,.vxs-form .f8b-fm input:user-invalid,.vxs-form .f9b-fm input:user-invalid,.vxs-form .f10b-fm input:user-invalid{border-bottom-color:#B4543A;}.vxs-form .fd-err{font-size:12.5px;color:#9A452F;margin-top:4px;}.vxs-form /* ---- lead-form wiring (shared; runtime in showcase/_lead-form.js) ----
   Success is an IN-PLACE swap: the fields hide and .vx-ok takes their spot
   so no layout moves and nothing navigates away. .vx-hp is the honeypot:
   off screen but never display:none (some bots skip what is display:none).
   Keep this block comma-free — the composer's CSS scoper splits selector
   preludes on commas and would rewrite comment text into selectors. */
.vx-hp{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none;}.vxs-form /* grid-column is inert in a flex/block form and stops the note taking a
   single cell in the two-column ones. Same line either way with nothing
   to re-tune. */
.vx-route{font-size:12.5px;color:var(--muted);grid-column:1/-1;}.vxs-form .vx-err{font-size:12.5px;color:#9A452F;grid-column:1/-1;}.vxs-form .vx-err a{font-weight:700;text-decoration:underline;text-underline-offset:3px;}.vxs-form .vx-ok{display:none;font-family:var(--display);font-weight:600;font-size:15px;color:var(--green-2);}.vxs-form form.vx-sending{opacity:.7;}.vxs-form form.vx-sent>*:not(.vx-ok){display:none!important;}.vxs-form form.vx-sent .vx-ok{display:block;grid-column:1/-1;}
/* ---- why (why #2) ---- */
.vxs-why *{box-sizing:border-box;margin:0;padding:0;}.vxs-why body{font-family:var(--body);background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}.vxs-why img{display:block;max-width:100%;}.vxs-why a{color:inherit;text-decoration:none;}.vxs-why :focus-visible{outline:2px solid var(--green);outline-offset:3px;}.vxs-why .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}@media(max-width:560px){.vxs-why .wrap{padding:0 20px;}}.vxs-why .cat-bar{background:var(--dark);color:#fff;padding:14px 0;position:sticky;top:0;z-index:300;}.vxs-why .cat-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}.vxs-why .cat-bar b{font-family:var(--display);font-weight:700;font-size:15px;}.vxs-why .cat-bar a{font-size:12.5px;color:#7fd4a6;}.vxs-why .cat-bar span{font-size:12.5px;color:rgba(255,255,255,.6);}.vxs-why .sec{position:relative;border-bottom:6px solid var(--paper2);padding:96px 0;}.vxs-why .sec:nth-child(even){background:var(--paper);}.vxs-why .lab{position:absolute;top:0;left:0;z-index:30;background:var(--dark);color:#fff;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:9px 16px;border-bottom-right-radius:12px;max-width:92%;}.vxs-why .lab b{color:var(--brass);font-weight:700;}.vxs-why .lab em{font-style:normal;color:rgba(255,255,255,.55);font-weight:500;text-transform:none;letter-spacing:0;}.vxs-why .h2{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.2vw,2.5rem);letter-spacing:-.02em;line-height:1.1;margin:0 0 14px;}.vxs-why .lede{font-size:1.05rem;color:var(--ink-soft);max-width:60ch;}.vxs-why .head{max-width:680px;margin-bottom:50px;}.vxs-why .head.ctr{margin-left:auto;margin-right:auto;text-align:center;}.vxs-why .head.ctr .lede{margin-left:auto;margin-right:auto;}.vxs-why .ic{stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;width:23px;height:23px;}.vxs-why .rv{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--d,0ms);}.vxs-why .rv.in{opacity:1;transform:none;}@media(prefers-reduced-motion:reduce){.vxs-why .rv{opacity:1;transform:none;transition:none;}}.vxs-why .iplate{width:44px;height:44px;border-radius:10px;background:var(--green-lt);color:var(--green-2);display:grid;place-items:center;flex:none;transition:background .25s var(--ease),color .25s var(--ease);}.vxs-why .tkbox{width:26px;height:26px;border-radius:7px;background:var(--green);color:#fff;display:grid;place-items:center;flex:none;}.vxs-why .tkbox .ic{width:14px;height:14px;stroke-width:2.4;}.vxs-why /* 02 image + checklist split */
.w2{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;}.vxs-why .w2-img{position:relative;border-radius:var(--rad);overflow:hidden;aspect-ratio:4/5;}.vxs-why .w2-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.92);}.vxs-why .w2-img::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(18,32,54,.10);pointer-events:none;}.vxs-why .w2-list{list-style:none;display:flex;flex-direction:column;gap:18px;margin-top:6px;}.vxs-why .w2-list li{display:flex;gap:14px;}.vxs-why .w2-list h3{font-family:var(--display);font-weight:600;font-size:1.06rem;}.vxs-why .w2-list p{font-size:13.5px;color:var(--ink-soft);}@media(max-width:820px){.vxs-why .w2{grid-template-columns:1fr;gap:30px;}.vxs-why .w2-img{aspect-ratio:16/10;}}.vxs-why /* 04 statement + inline points */
.w4-statement{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,2.8vw,2.1rem);line-height:1.24;letter-spacing:-.015em;max-width:24em;}.vxs-why .w4-statement b{color:var(--green-2);font-weight:700;}.vxs-why .w4-points{display:grid;grid-template-columns:repeat(3,1fr);margin-top:44px;border-top:1px solid var(--line);}.vxs-why .w4-pt{padding:24px 26px 0 26px;border-left:1px solid var(--line);}.vxs-why .w4-pt:first-child{border-left:0;padding-left:0;}.vxs-why .w4-pt h3{font-family:var(--display);font-weight:600;font-size:1.04rem;margin-bottom:6px;}.vxs-why .w4-pt p{font-size:13.5px;color:var(--ink-soft);}@media(max-width:780px){.vxs-why .w4-points{grid-template-columns:1fr;}.vxs-why .w4-pt{border-left:0;padding:20px 0 0;border-top:1px solid var(--line);}.vxs-why .w4-pt:first-child{border-top:0;}}.vxs-why /* 05 us vs them board */
.w5{max-width:880px;margin:0 auto;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper3);}.vxs-why .w5-head{display:grid;grid-template-columns:1.4fr 1fr 1fr;background:var(--dark);color:#fff;}.vxs-why .w5-head div{padding:17px 22px;font-family:var(--display);font-weight:600;font-size:14px;}.vxs-why .w5-head .them{color:rgba(255,255,255,.55);text-align:center;}.vxs-why .w5-head .us{color:#fff;text-align:center;background:rgba(14,116,144,.45);box-shadow:inset 0 3px 0 0 var(--green);}.vxs-why .w5-row{display:grid;grid-template-columns:1.4fr 1fr 1fr;border-top:1px solid var(--line);}.vxs-why .w5-row div{padding:15px 22px;display:flex;align-items:center;font-size:14px;}.vxs-why .w5-row .lbl{font-weight:500;}.vxs-why .w5-row .c{justify-content:center;text-align:center;font-family:var(--display);font-weight:700;}.vxs-why .w5-row .us-c{background:rgba(14,116,144,.09);color:var(--green-2);}.vxs-why .w5-row .them-c{color:var(--muted);}@media(max-width:560px){.vxs-why .w5-head div,.vxs-why .w5-row div{padding:12px 12px;font-size:12.5px;}}.vxs-why /* 04 editorial manifesto — flat band,.vxs-why zero containers (post circle-rule) */
.w7{border-top:2px solid var(--ink);border-bottom:1px solid var(--line);padding:54px 0 44px;}.vxs-why .w7-st{font-family:var(--display);font-weight:600;font-size:clamp(1.7rem,3.4vw,2.6rem);line-height:1.18;letter-spacing:-.018em;max-width:24em;}.vxs-why .w7-st em{font-style:normal;box-shadow:inset 0 -0.36em var(--green-lt);}.vxs-why .w7-proof{display:flex;flex-wrap:wrap;gap:0;margin-top:38px;border-top:1px solid var(--line);}.vxs-why .w7-p{display:flex;align-items:center;gap:11px;padding:20px 34px 0 0;margin-right:34px;border-right:1px solid var(--line);padding-right:34px;font-family:var(--display);font-weight:600;font-size:14.5px;}.vxs-why .w7-p:last-child{border-right:0;margin-right:0;padding-right:0;}.vxs-why .w7-p i{width:9px;height:9px;background:var(--green);flex:none;}@media(max-width:680px){.vxs-why .w7-p{border-right:0;padding:14px 0 0;margin:0;width:100%;}}.vxs-why /* 05 photo + margin notes — image right (alternation diversity vs 01) */
.w8{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center;}.vxs-why .w8-img{position:relative;border-radius:var(--rad);overflow:hidden;aspect-ratio:4/5;}.vxs-why .w8-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.92);}.vxs-why .w8-img::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(18,32,54,.10);pointer-events:none;}.vxs-why .w8-note{border-top:1px solid var(--line);padding:20px 0 24px;display:grid;grid-template-columns:56px 1fr;gap:18px;}.vxs-why .w8-note:first-of-type{border-top:2px solid var(--ink);}.vxs-why .w8-n{font-family:var(--display);font-weight:700;font-size:13px;color:var(--muted);letter-spacing:.08em;padding-top:3px;}.vxs-why .w8-note h3{font-family:var(--display);font-weight:600;font-size:1.08rem;margin-bottom:4px;}.vxs-why .w8-note h3 em{font-style:normal;box-shadow:inset 0 -0.32em var(--green-lt);}.vxs-why .w8-note p{font-size:13.5px;color:var(--ink-soft);max-width:46ch;}@media(max-width:860px){.vxs-why .w8{grid-template-columns:1fr;gap:30px;}.vxs-why .w8-img{order:-1;aspect-ratio:16/10;}}.vxs-why /* 06 tally columns — flat verticals,.vxs-why square ticks */
.w9{display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--ink);border-bottom:1px solid var(--line);}.vxs-why .w9-col{padding:30px 26px 34px 26px;border-left:1px solid var(--line);position:relative;}.vxs-why .w9-col:first-child{border-left:0;padding-left:0;}.vxs-why .w9-col i{display:block;width:10px;height:10px;background:var(--green);margin-bottom:16px;}.vxs-why .w9-col h3{font-family:var(--display);font-weight:600;font-size:1.08rem;line-height:1.3;margin-bottom:7px;}.vxs-why .w9-col p{font-size:13.5px;color:var(--ink-soft);}@media(max-width:820px){.vxs-why .w9{grid-template-columns:1fr 1fr;}.vxs-why .w9-col{padding:22px 18px 24px 18px;}.vxs-why .w9-col:nth-child(odd){border-left:0;padding-left:0;}.vxs-why .w9-col:nth-child(n+3){border-top:1px solid var(--line);padding-top:22px;}}
/* ---- founder (founder #1) ---- */
.vxs-founder *{box-sizing:border-box;margin:0;padding:0;}.vxs-founder body{font-family:var(--body);background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}.vxs-founder img{display:block;max-width:100%;}.vxs-founder a{color:inherit;text-decoration:none;}.vxs-founder :focus-visible{outline:2px solid var(--green);outline-offset:3px;}.vxs-founder .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}@media(max-width:560px){.vxs-founder .wrap{padding:0 20px;}}.vxs-founder .cat-bar{background:var(--dark);color:#fff;padding:14px 0;position:sticky;top:0;z-index:300;}.vxs-founder .cat-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}.vxs-founder .cat-bar b{font-family:var(--display);font-weight:700;font-size:15px;}.vxs-founder .cat-bar a{font-size:12.5px;color:#7fd4a6;}.vxs-founder .cat-bar span{font-size:12.5px;color:rgba(255,255,255,.6);}.vxs-founder .sec{position:relative;border-bottom:6px solid var(--paper2);padding:96px 0;}.vxs-founder .sec:nth-child(even){background:var(--paper);}.vxs-founder .lab{position:absolute;top:0;left:0;z-index:30;background:var(--dark);color:#fff;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:9px 16px;border-bottom-right-radius:12px;max-width:92%;}.vxs-founder .lab b{color:var(--brass);font-weight:700;}.vxs-founder .lab em{font-style:normal;color:rgba(255,255,255,.55);font-weight:500;text-transform:none;letter-spacing:0;}.vxs-founder .h2{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.2vw,2.5rem);letter-spacing:-.02em;line-height:1.1;margin:0 0 14px;}.vxs-founder .lede{font-size:1.05rem;color:var(--ink-soft);max-width:60ch;}.vxs-founder .head{max-width:680px;margin-bottom:50px;}.vxs-founder .head.ctr{margin-left:auto;margin-right:auto;text-align:center;}.vxs-founder .head.ctr .lede{margin-left:auto;margin-right:auto;}.vxs-founder .ic{stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;width:16px;height:16px;}.vxs-founder .rv{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--d,0ms);}.vxs-founder .rv.in{opacity:1;transform:none;}@media(prefers-reduced-motion:reduce){.vxs-founder .rv{opacity:1;transform:none;transition:none;}}.vxs-founder .chip{display:inline-flex;align-items:center;gap:8px;background:var(--green-lt);color:var(--green-2);border-radius:8px;padding:7px 13px;font-family:var(--display);font-weight:600;font-size:12.5px;}.vxs-founder .chip .ic{color:var(--green);}.vxs-founder .pcap{position:absolute;left:14px;bottom:14px;right:14px;background:rgba(10,34,44,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;border-radius:9px;padding:9px 13px;font-family:var(--display);font-weight:600;font-size:12px;}.vxs-founder /* 01 portrait + story split */
.f1{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:center;}.vxs-founder .f1-img{position:relative;border-radius:var(--rad);overflow:hidden;aspect-ratio:4/5;}.vxs-founder .f1-img img{width:100%;height:100%;object-fit:cover;}.vxs-founder .f1-bd p{color:var(--ink-soft);font-size:15px;margin-bottom:14px;max-width:54ch;}.vxs-founder .f1-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;}@media(max-width:860px){.vxs-founder .f1{grid-template-columns:1fr;gap:32px;}}.vxs-founder /* 04 duo cards (jgfscpa) */
.f4{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:980px;margin:0 auto;}.vxs-founder .f4-card{background:var(--paper3);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .3s var(--ease);}.vxs-founder .f4-card:hover{box-shadow:0 18px 40px -24px rgba(0,0,0,.3);}.vxs-founder .f4-card .ph{position:relative;aspect-ratio:5/4;}.vxs-founder .f4-card .ph img{width:100%;height:100%;object-fit:cover;}.vxs-founder .f4-bd{padding:26px 28px 28px;display:flex;flex-direction:column;flex:1;}.vxs-founder .f4-name{font-family:var(--display);font-weight:700;font-size:1.35rem;}.vxs-founder .f4-cred{font-family:var(--display);font-weight:600;font-size:12px;color:var(--green-2);letter-spacing:.05em;text-transform:uppercase;margin:3px 0 14px;}.vxs-founder .f4-bd>p{color:var(--ink-soft);font-size:14px;margin-bottom:14px;}.vxs-founder .f4-hob{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);font-size:13px;color:var(--muted);}.vxs-founder .f4-hob b{font-family:var(--display);color:var(--green-2);font-weight:700;}@media(max-width:780px){.vxs-founder .f4{grid-template-columns:1fr;}}.vxs-founder /* 05 pull-quote + values — square portrait per circle rule */
.f5-q{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,2.8vw,2.1rem);line-height:1.24;letter-spacing:-.015em;max-width:26em;}.vxs-founder .f5-q b{color:var(--green-2);font-weight:700;}.vxs-founder .f5-who{display:flex;align-items:center;gap:16px;margin-top:28px;}.vxs-founder .f5-ava{width:80px;height:80px;border-radius:12px;overflow:hidden;flex:none;box-shadow:0 0 0 1.5px var(--line);}.vxs-founder .f5-ava img{width:100%;height:100%;object-fit:cover;}.vxs-founder .f5-name{font-family:var(--display);font-weight:700;font-size:1.02rem;}.vxs-founder .f5-role{font-size:12.5px;color:var(--muted);}.vxs-founder .f5-points{display:grid;grid-template-columns:repeat(3,1fr);margin-top:44px;border-top:1px solid var(--line);}.vxs-founder .f5-pt{padding:24px 26px 0 26px;border-left:1px solid var(--line);}.vxs-founder .f5-pt:first-child{border-left:0;padding-left:0;}.vxs-founder .f5-pt h3{font-family:var(--display);font-weight:600;font-size:1.02rem;margin-bottom:5px;}.vxs-founder .f5-pt p{font-size:14.5px;color:var(--ink-soft);}@media(max-width:780px){.vxs-founder .f5-points{grid-template-columns:1fr;}.vxs-founder .f5-pt{border-left:0;padding:20px 0 0;border-top:1px solid var(--line);}.vxs-founder .f5-pt:first-child{border-top:0;}}.vxs-founder /* 06 intro + stacked profiles */
.f6{display:grid;grid-template-columns:1fr 1.15fr;gap:60px;align-items:center;}.vxs-founder .f6-int .lede{margin-bottom:26px;}.vxs-founder .f6-btn{display:inline-flex;align-items:center;gap:9px;background:var(--green);color:#fff;border-radius:9px;padding:13px 26px;font-family:var(--display);font-weight:700;font-size:14.5px;transition:background .25s var(--ease),transform .25s var(--ease);}.vxs-founder .f6-btn:hover{background:var(--green-2);transform:translateY(-1px);}.vxs-founder .f6-stack{display:flex;flex-direction:column;gap:18px;}.vxs-founder .f6-p{display:grid;grid-template-columns:108px 1fr;gap:22px;background:var(--paper3);border:1px solid var(--line);border-radius:14px;padding:22px;transition:box-shadow .3s var(--ease);}.vxs-founder .f6-p:hover{box-shadow:0 14px 30px -20px rgba(0,0,0,.28);}.vxs-founder .f6-p img{width:108px;height:108px;border-radius:11px;object-fit:cover;}.vxs-founder .f6-name{font-family:var(--display);font-weight:700;font-size:1.08rem;}.vxs-founder .f6-cred{font-family:var(--display);font-weight:600;font-size:11.5px;color:var(--green-2);letter-spacing:.05em;text-transform:uppercase;margin:2px 0 8px;}.vxs-founder .f6-p p{font-size:14.5px;color:var(--ink-soft);}.vxs-founder .f6-hob{font-size:12.5px;color:var(--muted);margin-top:8px;}.vxs-founder .f6-hob b{color:var(--green-2);}@media(max-width:860px){.vxs-founder .f6{grid-template-columns:1fr;gap:32px;}}@media(max-width:520px){.vxs-founder .f6-p{grid-template-columns:1fr;}.vxs-founder .f6-p img{width:100%;height:auto;aspect-ratio:16/10;object-position:center 30%;}}
/* ---- faq (faq #4) ---- */
.vxs-faq *{box-sizing:border-box;margin:0;padding:0;}.vxs-faq body{font-family:var(--body);background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}.vxs-faq a{color:inherit;text-decoration:none;}.vxs-faq :focus-visible{outline:2px solid var(--green);outline-offset:3px;}.vxs-faq .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}@media(max-width:560px){.vxs-faq .wrap{padding:0 20px;}}.vxs-faq .cat-bar{background:var(--dark);color:#fff;padding:14px 0;position:sticky;top:0;z-index:300;}.vxs-faq .cat-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}.vxs-faq .cat-bar b{font-family:var(--display);font-weight:700;font-size:15px;}.vxs-faq .cat-bar a{font-size:12.5px;color:#7fd4a6;}.vxs-faq .cat-bar span{font-size:12.5px;color:rgba(255,255,255,.6);}.vxs-faq .sec{position:relative;border-bottom:6px solid var(--paper2);padding:100px 0;}.vxs-faq .sec:nth-child(even){background:var(--paper);}.vxs-faq .lab{position:absolute;top:0;left:0;z-index:30;background:var(--dark);color:#fff;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:9px 16px;border-bottom-right-radius:12px;}.vxs-faq .lab b{color:var(--brass);font-weight:700;}.vxs-faq .lab em{font-style:normal;color:rgba(255,255,255,.55);font-weight:500;}.vxs-faq .h2{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.2vw,2.5rem);letter-spacing:-.02em;line-height:1.1;margin:0 0 14px;}.vxs-faq .lede{font-size:1.05rem;color:var(--ink-soft);}.vxs-faq .lede a{text-decoration:underline;text-underline-offset:3px;color:var(--green);font-weight:600;}.vxs-faq .head{max-width:640px;margin:0 auto 46px;text-align:center;}.vxs-faq .col{max-width:760px;margin:0 auto;}.vxs-faq .rv{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:var(--d,0ms);}.vxs-faq .rv.in{opacity:1;transform:none;}@media(prefers-reduced-motion:reduce){.vxs-faq .rv{opacity:1;transform:none;transition:none;}}.vxs-faq .faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;background:transparent;border:none;text-align:left;cursor:pointer;font-family:var(--display);font-weight:600;font-size:1.1rem;line-height:1.3;letter-spacing:-.005em;color:var(--ink);transition:color 200ms var(--ease);}.vxs-faq .faq-q:hover{color:var(--green-2);}.vxs-faq .faq-q:hover .faq-q-icon{border-color:var(--green);background:var(--green-lt);}.vxs-faq .faq-q:focus-visible{outline:none;background:var(--green-lt);}.vxs-faq .faq-q-text{flex:1;min-width:0;}.vxs-faq .faq-q-icon{flex-shrink:0;display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--line);border-radius:50%;color:var(--green-2);position:relative;transition:background 220ms var(--ease),border-color 220ms var(--ease),color 220ms var(--ease);}.vxs-faq .faq-q-icon::before,.vxs-faq .faq-q-icon::after{content:"";position:absolute;background:currentColor;border-radius:1px;transition:transform 220ms var(--ease);}.vxs-faq .faq-q-icon::before{width:13px;height:1.5px;}.vxs-faq .faq-q-icon::after{width:1.5px;height:13px;}.vxs-faq .faq-item.is-open .faq-q-icon{background:var(--green);border-color:var(--green);color:var(--paper);}.vxs-faq .faq-item.is-open .faq-q-icon::after{transform:scaleY(0);}.vxs-faq .faq-a-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows 320ms var(--ease);}.vxs-faq .faq-item.is-open .faq-a-wrap{grid-template-rows:1fr;}.vxs-faq .faq-a{min-height:0;overflow:hidden;margin:0;font-size:15px;line-height:1.65;color:var(--ink-soft);transition:padding-bottom 320ms var(--ease);}.vxs-faq /* 01 hairline rows (DSP boxes) */
.v1 .faq-list{list-style:none;}.vxs-faq .v1 .faq-item{border-top:1px solid var(--line);}.vxs-faq .v1 .faq-item:last-child{border-bottom:1px solid var(--line);}.vxs-faq .v1 .faq-q{padding:22px 4px;}.vxs-faq .v1 .faq-a{padding:0 64px 0 4px;}.vxs-faq .v1 .faq-item.is-open .faq-a{padding-bottom:22px;}.vxs-faq /* 02 outlined cards */
.v2 .faq-list{list-style:none;display:flex;flex-direction:column;gap:12px;}.vxs-faq .v2 .faq-item{background:var(--paper3);border:1.5px solid var(--line);border-radius:14px;transition:border-color 220ms var(--ease),box-shadow 220ms var(--ease);}.vxs-faq .v2 .faq-item.is-open{border-color:var(--green);box-shadow:0 10px 28px rgba(18,32,54,.07);}.vxs-faq .v2 .faq-q{padding:20px 22px;}.vxs-faq .v2 .faq-a{padding:0 66px 0 22px;}.vxs-faq .v2 .faq-item.is-open .faq-a{padding-bottom:20px;}.vxs-faq /* 03 filled boxes — open turns dark */
.v3 .faq-list{list-style:none;display:flex;flex-direction:column;gap:10px;}.vxs-faq .v3 .faq-item{background:var(--green-lt);border-radius:12px;transition:background 260ms var(--ease);}.vxs-faq .v3 .faq-item.is-open{background:var(--dark);}.vxs-faq .v3 .faq-q{padding:20px 22px;}.vxs-faq .v3 .faq-item.is-open .faq-q{color:#fff;}.vxs-faq .v3 .faq-item.is-open .faq-q-icon{background:var(--brass);border-color:var(--brass);color:var(--dark);}.vxs-faq .v3 .faq-a{padding:0 66px 0 22px;}.vxs-faq .v3 .faq-item.is-open .faq-a{padding-bottom:20px;color:rgba(255,255,255,.72);}.vxs-faq /* 04 bordered rows */
.v4 .faq-list{list-style:none;display:flex;flex-direction:column;gap:8px;}.vxs-faq .v4 .faq-item{background:var(--paper3);border-radius:8px;border:1px solid var(--line);box-shadow:0 1px 3px rgba(18,32,54,.05);transition:border-color 240ms var(--ease);}.vxs-faq .v4 .faq-item.is-open{border-color:var(--green);}.vxs-faq .v4 .faq-q{padding:19px 22px;transition:color 200ms var(--ease),background 240ms var(--ease);}.vxs-faq .v4 .faq-item.is-open .faq-q{background:var(--green-lt);border-radius:7px 7px 0 0;}.vxs-faq .v4 .faq-a{padding:0 66px 0 22px;}.vxs-faq .v4 .faq-item.is-open .faq-a{padding-bottom:19px;}.vxs-faq /* 05 numbered rows */
.v5 .faq-list{list-style:none;counter-reset:q;}.vxs-faq .v5 .faq-item{border-top:1px solid var(--line);counter-increment:q;}.vxs-faq .v5 .faq-item:last-child{border-bottom:1px solid var(--line);}.vxs-faq .v5 .faq-q{padding:24px 4px;gap:20px;}.vxs-faq .v5 .faq-q::before{content:counter(q,decimal-leading-zero);font-family:var(--display);font-weight:700;font-size:1.15rem;color:var(--green);opacity:.28;flex:none;width:38px;transition:opacity 220ms var(--ease);}.vxs-faq .v5 .faq-item.is-open .faq-q::before{opacity:1;}.vxs-faq .v5 .faq-a{padding:0 64px 0 62px;}.vxs-faq .v5 .faq-item.is-open .faq-a{padding-bottom:24px;}.vxs-faq /* 06 grouped panel */
.v6 .faq-panel{background:var(--paper3);border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 40px rgba(18,32,54,.06);overflow:hidden;}.vxs-faq .v6 .faq-list{list-style:none;}.vxs-faq .v6 .faq-item{border-top:1px solid var(--line);transition:background 240ms var(--ease);}.vxs-faq .v6 .faq-item:first-child{border-top:0;}.vxs-faq .v6 .faq-item.is-open{background:var(--green-lt);}.vxs-faq .v6 .faq-q{padding:21px 26px;}.vxs-faq .v6 .faq-a{padding:0 70px 0 26px;}.vxs-faq .v6 .faq-item.is-open .faq-a{padding-bottom:21px;}
/* ---- closing (closing #3) ---- */
.vxs-closing *{box-sizing:border-box;margin:0;padding:0;}.vxs-closing body{font-family:var(--body);overflow-x:hidden;background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;}.vxs-closing img{display:block;max-width:100%;}.vxs-closing a{color:inherit;text-decoration:none;}.vxs-closing :focus-visible{outline:2px solid var(--green);outline-offset:3px;}.vxs-closing .wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}@media(max-width:560px){.vxs-closing .wrap{padding:0 20px;}}.vxs-closing .cat-bar{background:var(--dark);color:#fff;padding:14px 0;position:sticky;top:0;z-index:300;}.vxs-closing .cat-bar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}.vxs-closing .cat-bar b{font-family:var(--display);font-weight:700;font-size:15px;}.vxs-closing .cat-bar a{font-size:12.5px;color:#7fd4a6;}.vxs-closing .cat-bar span{font-size:12.5px;color:rgba(255,255,255,.6);}.vxs-closing .sec{position:relative;border-bottom:6px solid var(--paper2);padding:96px 0;}.vxs-closing .sec:nth-child(even){background:var(--paper);}.vxs-closing .lab{position:absolute;top:0;left:0;z-index:30;background:var(--dark);color:#fff;font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.07em;text-transform:uppercase;padding:9px 16px;border-bottom-right-radius:12px;max-width:92%;}.vxs-closing .lab b{color:var(--brass);font-weight:700;}.vxs-closing .lab em{font-style:normal;color:rgba(255,255,255,.55);font-weight:500;text-transform:none;letter-spacing:0;}.vxs-closing .h2{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.2vw,2.5rem);letter-spacing:-.02em;line-height:1.1;margin:0 0 14px;}.vxs-closing .c1 .h2,.vxs-closing .c3 .h2,.vxs-closing .c4 .h2,.vxs-closing .c12 .h2,.vxs-closing .c13 .h2,.vxs-closing .c14 .h2{font-size:clamp(2.1rem,3.8vw,2.9rem);font-weight:700;letter-spacing:-.025em;}.vxs-closing .lede{font-size:1.05rem;color:var(--ink-soft);max-width:52ch;}.vxs-closing .ic{stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px;}.vxs-closing .rv{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease);}.vxs-closing .rv.in{opacity:1;transform:none;}@media(prefers-reduced-motion:reduce){.vxs-closing .rv{opacity:1;transform:none;transition:none;}}.vxs-closing .fm{display:flex;flex-direction:column;gap:14px;}.vxs-closing .fm-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}@media(max-width:560px){.vxs-closing .fm-row{grid-template-columns:1fr;}}.vxs-closing .fd{display:flex;flex-direction:column;gap:6px;}.vxs-closing .fd span{font-family:var(--display);font-weight:600;font-size:12.5px;}.vxs-closing .fd input,.vxs-closing .fd textarea{font-family:var(--body);font-size:14px;color:var(--ink);background:var(--paper3);border:1px solid var(--line);border-radius:9px;padding:12px 14px;outline:none;transition:border-color .2s,box-shadow .2s;resize:vertical;}.vxs-closing .fd input:focus,.vxs-closing .fd textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(14,116,144,.12);}.vxs-closing .fm-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--green);color:#fff;border:none;border-radius:9px;padding:15px 26px;font-family:var(--display);font-weight:700;font-size:14.5px;cursor:pointer;width:100%;transition:background .25s var(--ease),transform .25s var(--ease);}.vxs-closing .fm-btn:hover{background:var(--green-2);transform:translateY(-1px);}.vxs-closing .fm-note{font-size:12px;color:var(--muted);text-align:center;}.vxs-closing .contact-line{display:inline-flex;align-items:center;gap:11px;font-size:14px;font-weight:600;padding:7px 0;border-bottom:1px solid var(--line);transition:color .2s;}.vxs-closing .contact-line:hover{color:var(--green-2);}.vxs-closing .contact-line .ic{color:var(--green);}.vxs-closing /* 01 DSP split (kept) */
.c1{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start;}.vxs-closing .c1-lines{display:flex;flex-direction:column;gap:12px;margin-top:34px;align-items:flex-start;}.vxs-closing .c1-form{background:var(--paper3);border:1.5px solid var(--green);border-radius:8px;padding:32px 30px;box-shadow:0 24px 60px -28px rgba(18,32,54,.38);}.vxs-closing .c1-tel{display:inline-flex;align-items:center;gap:12px;font-family:var(--display);font-weight:700;font-size:1.6rem;letter-spacing:-.02em;color:var(--green-2);transition:color .25s var(--ease);}.vxs-closing .c1-tel:hover{color:var(--green);}.vxs-closing .c1-tel .ic{width:22px;height:22px;color:var(--green);}@media(max-width:900px){.vxs-closing .c1{grid-template-columns:1fr;gap:44px;}}.vxs-closing /* 03 centered stack */
.c3{max-width:620px;margin:0 auto;text-align:center;}.vxs-closing .c3-form{background:var(--paper3);border:1px solid var(--line);border-radius:16px;padding:34px 32px;margin-top:34px;text-align:left;box-shadow:0 14px 40px rgba(18,32,54,.07);}.vxs-closing .c3-alt{margin-top:18px;font-size:14px;color:var(--ink-soft);}.vxs-closing .c3-alt a{color:var(--green-2);font-weight:700;text-decoration:underline;text-underline-offset:3px;}.vxs-closing .c3-form .fm-btn{padding:16px 32px;}.vxs-closing /* 04 phone-first + callback */
.c4{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center;}.vxs-closing .c4-num{font-family:var(--display);font-weight:700;font-size:clamp(2rem,4.2vw,3.2rem);letter-spacing:-.02em;color:var(--green-2);display:block;margin:14px 0 10px;transition:color .25s var(--ease);}.vxs-closing .c4-num:hover{color:var(--green);}.vxs-closing .c4-hours{font-size:14px;color:var(--muted);}.vxs-closing .c4-mini{background:var(--paper3);border:1px solid var(--line);border-radius:14px;padding:26px 26px 22px;}.vxs-closing .c4-mini h3{font-family:var(--display);font-weight:600;font-size:1.1rem;margin-bottom:16px;}@media(max-width:860px){.vxs-closing .c4{grid-template-columns:1fr;gap:36px;}}.vxs-closing /* 04 soft split — open fields on paper,.vxs-closing no card,.vxs-closing no dark,.vxs-closing generous air */
.c12{display:grid;grid-template-columns:1fr 1.05fr;gap:76px;align-items:center;}.vxs-closing .c12-bd .lede{margin-bottom:30px;}.vxs-closing .c12-lines{display:flex;flex-direction:column;gap:12px;align-items:flex-start;}@media(max-width:860px){.vxs-closing .c12{grid-template-columns:1fr;gap:40px;}}.vxs-closing /* 05 quiet column — narrow,.vxs-closing left-aligned,.vxs-closing labeled fields,.vxs-closing whitespace does the work */
.c13{max-width:520px;margin:0 auto;}.vxs-closing .c13 .lede{margin-bottom:34px;}.vxs-closing .c13 .fm-btn{width:auto;padding:15px 36px;}.vxs-closing .c13-after{margin-top:18px;font-size:13.5px;color:var(--muted);}.vxs-closing .c13-after a{font-family:var(--display);font-weight:700;color:var(--green-2);}.vxs-closing /* 06 one field — the least a customer can do,.vxs-closing centered and small */
.c14{max-width:560px;margin:0 auto;text-align:center;}.vxs-closing .c14 .lede{margin-left:auto;margin-right:auto;}.vxs-closing .c14-stack{display:flex;flex-direction:column;gap:12px;margin-top:30px;text-align:left;}.vxs-closing .c14-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;}.vxs-closing .c14-stack input{font:inherit;font-size:15px;color:var(--ink);background:var(--paper3);border:1px solid var(--line);border-radius:10px;padding:14px 16px;outline:none;transition:border-color .2s,box-shadow .2s;}.vxs-closing .c14-stack input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(14,116,144,.12);}.vxs-closing .c14-stack .fm-btn{width:auto;padding:16px 32px;align-self:center;}.vxs-closing .c14-sub{margin-top:16px;font-size:13.5px;color:var(--muted);}.vxs-closing .c14-sub a{font-family:var(--display);font-weight:700;color:var(--green-2);}@media(max-width:560px){.vxs-closing .c14-pair{grid-template-columns:1fr;}}.vxs-closing /* ---- lead-form wiring (shared; runtime in showcase/_lead-form.js) ----
   Success is an IN-PLACE swap: the fields hide and .vx-ok takes their spot
   so no layout moves and nothing navigates away. .vx-hp is the honeypot:
   off screen but never display:none (some bots skip what is display:none).
   Keep this block comma-free — the composer's CSS scoper splits selector
   preludes on commas and would rewrite comment text into selectors. */
.vx-hp{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none;}.vxs-closing /* grid-column is inert in a flex/block form and stops the note taking a
   single cell in the two-column ones. Same line either way with nothing
   to re-tune. */
.vx-route{font-size:12.5px;color:var(--muted);grid-column:1/-1;}.vxs-closing .vx-err{font-size:12.5px;color:#9A452F;grid-column:1/-1;}.vxs-closing .vx-err a{font-weight:700;text-decoration:underline;text-underline-offset:3px;}.vxs-closing .vx-ok{display:none;font-family:var(--display);font-weight:600;font-size:15px;color:var(--green-2);}.vxs-closing form.vx-sending{opacity:.7;}.vxs-closing form.vx-sent>*:not(.vx-ok){display:none!important;}.vxs-closing form.vx-sent .vx-ok{display:block;grid-column:1/-1;}
/* ---- entrance (#3) ---- */

.vx-ent{position:fixed;inset:0;z-index:900;pointer-events:none;display:grid;place-items:center;}
.vx-ent .jmk{width:56px;height:56px;flex:none;border-radius:12px;background:var(--green);color:#fff;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:21px;letter-spacing:.03em;}
.vx-ent b{font-family:var(--display);font-weight:700;color:#fff;letter-spacing:-.012em;font-size:clamp(1.4rem,3vw,2rem);line-height:1.1;text-wrap:balance;}
.vx-ent i{font-style:normal;font-family:var(--mono);font-weight:500;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55);}
html.vx-seen .vx-ent{display:none;}
@media(prefers-reduced-motion:reduce){.vx-ent{display:none;}}
@keyframes vxEntIn{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:none;}}
@keyframes vxEntFade{to{opacity:0;visibility:hidden;}}
@keyframes vxEntUp{to{transform:translateY(-102%);visibility:hidden;}}


/* Wordmark wipe — the name reveals behind a brass rail, card exits upward. */
.vx-e3{background:var(--dark);animation:vxEntUp .62s cubic-bezier(.7,0,.3,1) 1.95s both;}
.vx-e3 .in{text-align:center;padding:0 24px;}
.vx-e3 .wm{position:relative;display:inline-block;padding:4px 6px;}
.vx-e3 b{display:block;font-size:clamp(2rem,5.6vw,4.2rem);letter-spacing:-.02em;clip-path:inset(-5% 100% -5% 0);animation:vxE3wipe .95s cubic-bezier(.65,0,.35,1) .25s both;}
@keyframes vxE3wipe{to{clip-path:inset(-5% -2% -5% 0);}}
.vx-e3 .rail{position:absolute;top:6%;bottom:6%;left:0;width:2px;background:var(--brass);opacity:0;animation:vxE3rail .95s cubic-bezier(.65,0,.35,1) .25s both;}
@keyframes vxE3rail{0%{left:0;opacity:1;}96%{opacity:1;}100%{left:100%;opacity:0;}}
.vx-e3 i{display:block;margin-top:14px;animation:vxEntIn .5s var(--ease) 1.2s both;}



*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--body);background:var(--paper2);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{display:block;max-width:100%;}a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px;width:100%;}
@media(max-width:560px){.wrap{padding:0 20px;}}
.sec{background:var(--paper2) !important;padding:96px 0;}.sec.alt{background:var(--paper) !important;}
/* image-side flip: reverse a two-column split without touching its markup */
.vx-flip .s2{direction:rtl;}.vx-flip .s2>*{direction:ltr;}
.vx-flip .p5{direction:rtl;}.vx-flip .p5>*{direction:ltr;}
.vx-flip .f8b{direction:rtl;}.vx-flip .f8b>*{direction:ltr;}
.vx-flip .w2{direction:rtl;}.vx-flip .w2>*{direction:ltr;}
.vx-flip .w8{direction:rtl;}.vx-flip .w8>*{direction:ltr;}
.vx-flip .f1{direction:rtl;}.vx-flip .f1>*{direction:ltr;}
.vx-flip .f6{direction:rtl;}.vx-flip .f6>*{direction:ltr;}
/* Rotating hero slides must be STACKED, not in normal flow. Each hero's own
   CSS sets its bg img to width/height:100% with no positioning, which is
   correct for one image but lays five of them out vertically — slides 2..5
   end up below the fold and the crossfade reveals the empty hero background.
   These declarations are !important on purpose: they outrank whatever the
   individual catalog hero defines for its background image. */
.vxs-hero img.vx-slide{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;opacity:0;transition:opacity 1.4s var(--ease);}
.vxs-hero img.vx-slide.on{opacity:1;}
@media(prefers-reduced-motion:reduce){.vxs-hero img.vx-slide{transition:none;}}
/* header: license micro-strip (TASTE: license top-strip, phone top-of-fold) + sticky brand bar */
.jlic{background:var(--dark);color:rgba(255,255,255,.78);font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.09em;}
.jlic .wrap{display:flex;justify-content:space-between;gap:14px;height:32px;align-items:center;}
.jlic b{color:var(--brass);font-weight:700;}
/* jgfscpa-style header: transparent over the hero, solid once scrolled past
   it. The first section pulls up under the header (margin-top:-66px) so
   there is zero gap between chrome and hero image. */
.jh{position:sticky;top:0;z-index:400;background:transparent;border-bottom:1px solid transparent;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;
  /* viewport-fit=cover (2026-09-19, Alec: "above the header there's white space
     where the camera is"): the page paints under the status bar, this keeps the
     logo and buttons below it. On a desktop the inset is 0. */
  padding-top:env(safe-area-inset-top,0px);}
.jh.scrolled,.jh.menu-open{background:var(--paper3);border-bottom-color:var(--line);}
.jh.scrolled{box-shadow:0 8px 28px -16px rgba(0,0,0,.25);}
.jh .wrap{display:flex;align-items:center;justify-content:space-between;height:66px;gap:18px;}
.jh .jb{display:inline-flex;align-items:center;gap:11px;font-family:var(--display);font-weight:700;font-size:17.5px;letter-spacing:-.01em;color:#fff;transition:color .15s ease;}
.jh.scrolled .jb,.jh.menu-open .jb{color:var(--ink);}
.jh .jmk{width:34px;height:34px;flex:none;border-radius:8px;background:var(--green);color:#fff;display:inline-grid;place-items:center;font-weight:800;font-size:13.5px;letter-spacing:.03em;}
.vxs-hero{margin-top:calc(-66px - env(safe-area-inset-top,0px));}   /* under the header AND the status bar */
.vxs-svc section.svhero{margin-top:calc(-66px - env(safe-area-inset-top,0px));padding:0;}
.jh .jr{display:flex;align-items:center;gap:22px;}
.jh .jn{display:flex;align-items:center;gap:24px;font-family:var(--display);font-weight:600;font-size:14.5px;color:rgba(255,255,255,.88);transition:color .15s ease;}
.jh.scrolled .jn,.jh.menu-open .jn{color:var(--ink-soft);}
.jh .jn>a{transition:color .2s;}
.jh .jn>a:hover{color:#fff;}
.jh.scrolled .jn>a:hover,.jh.menu-open .jn>a:hover{color:var(--green-2);}
.jh .jn-svc{position:relative;}
.jh .jn-svcbtn{font:inherit;font-family:var(--display);font-weight:600;font-size:14.5px;color:inherit;background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:22px 0;transition:color .2s;}
.jh .jn-svcbtn:hover{color:#fff;}
.jh.scrolled .jn-svcbtn:hover,.jh.menu-open .jn-svcbtn:hover{color:var(--green-2);}
.jh .jn-svcbtn i{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s;}
.jh .jn-svc.open .jn-svcbtn i{transform:rotate(225deg) translateY(-2px);}
.jh .jn-dd{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);min-width:230px;background:var(--paper3);border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 44px -20px rgba(0,0,0,.3);padding:8px;opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease;z-index:500;}
.jh .jn-svc:hover .jn-dd,.jh .jn-svc:focus-within .jn-dd,.jh .jn-svc.open .jn-dd{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.jh .jn-dd a{display:block;padding:10px 14px;border-radius:7px;font-size:14px;color:var(--ink);transition:background .15s,color .15s;}
.jh .jn-dd a:hover{background:var(--green-lt);color:var(--green-2);}
.jh .jcta{display:inline-flex;align-items:center;background:var(--green);color:#fff;border-radius:9px;padding:12px 24px;font-family:var(--display);font-weight:700;font-size:14px;transition:background .25s ease,transform .25s ease;}
.jh .jcta:hover{background:var(--green-2);transform:translateY(-1px);}
.jh .jburger{display:none;font:inherit;background:none;border:0;cursor:pointer;padding:10px 2px;flex-direction:column;gap:5px;}
.jh .jburger b{display:block;width:22px;height:2px;background:#fff;transition:transform .2s,opacity .2s,background .3s ease;}
.jh.scrolled .jburger b,.jh.menu-open .jburger b{background:var(--ink);}
@media(max-width:880px){
.jh .jn{display:none;}
.jh .jburger{display:inline-flex;}
.jh.menu-open .jn{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;top:100%;left:0;right:0;background:var(--paper3);border-bottom:1px solid var(--line);box-shadow:0 22px 44px -22px rgba(0,0,0,.35);padding:8px 20px 18px;}
.jh.menu-open .jn>a{padding:13px 4px;border-top:1px solid var(--line-soft,rgba(0,0,0,.06));}
.jh.menu-open .jn-svcbtn{padding:13px 4px;width:100%;justify-content:space-between;}
.jh.menu-open .jn-dd{position:static;transform:none;opacity:1;visibility:hidden;display:none;box-shadow:none;border:0;padding:0 0 6px 14px;min-width:0;}
.jh.menu-open .jn-svc.open .jn-dd{visibility:visible;display:block;}
.jh.menu-open .jburger b:nth-child(1){transform:translateY(7px) rotate(45deg);}
.jh.menu-open .jburger b:nth-child(2){opacity:0;}
.jh.menu-open .jburger b:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
}
/* footer: brand / services / contact + credit bar */
.jf{background:var(--dark);color:rgba(255,255,255,.68);font-size:13.5px;}
.jf .cols{display:grid;grid-template-columns:1.3fr 1fr 1.1fr;gap:44px;padding:72px 0 44px;}
.jf h5{font-family:var(--display);font-weight:700;color:#fff;font-size:15px;margin-bottom:12px;}
.jf .ftag{max-width:32ch;line-height:1.65;}
.jf ul{list-style:none;display:flex;flex-direction:column;gap:8px;}
.jf a{transition:color .2s ease;}
.jf a:hover{color:var(--brass);}
.jf .ct{display:flex;flex-direction:column;gap:8px;}
.jf .ct b{color:#fff;font-family:var(--display);}
.jf .lic{font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.07em;color:rgba(255,255,255,.45);margin-top:8px;}
.jf .bar{border-top:1px solid rgba(255,255,255,.12);padding:16px 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:rgba(255,255,255,.45);}
@media(max-width:760px){.jf .cols{grid-template-columns:1fr;gap:30px;}}
/* ---- polish pack (2026-08-01): shared quality signals, theme-derived ---- */
::selection{background:var(--green-lt);color:var(--ink);}
:focus-visible{outline:2px solid var(--green);outline-offset:3px;}
.jh a:focus-visible,.jh button:focus-visible{outline-color:var(--brass);}
html{scroll-behavior:smooth;scroll-padding-top:82px;}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
h1,h2,h3,.h2{text-wrap:balance;}
p{text-wrap:pretty;}
a[href^="tel:"]{font-variant-numeric:lining-nums tabular-nums;}
/* The transparent header floats over ARBITRARY rotation frames, so it
   carries its own protection instead of trusting each hero's scrim: a
   150px top gradient under the chrome plus a soft text-shadow that both
   vanish once the header goes solid. Literal 10,34,44 is rewritten to the
   theme's --dark RGB at compose time. */
.vxs-hero{position:relative;}
.vxs-hero::before{content:"";position:absolute;inset:0 0 auto 0;height:150px;background:linear-gradient(to bottom,rgba(10,34,44,.5),rgba(10,34,44,.26) 55%,rgba(10,34,44,0));z-index:5;pointer-events:none;}
.jh:not(.scrolled):not(.menu-open) .jb,.jh:not(.scrolled):not(.menu-open) .jn,.jh:not(.scrolled):not(.menu-open) .jn-svcbtn{text-shadow:0 1px 14px rgba(0,0,0,.28);}
/* ---- the living hero (2026-08-01): one orchestrated load moment ---- */
/* Copy block rises once on load; hero 04's credentials bar follows as a
   second beat. The photo stack drifts on a slow container-level Ken Burns
   (animating the CONTAINER, not the .on slide, so crossfades never snap). */
@keyframes vxHeroIn{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}
@keyframes vxKen{from{transform:scale(1);}to{transform:scale(1.045);}}
.vxs-hero .hjg .wrap,.vxs-hero .copy,.vxs-hero .hmn-copy{animation:vxHeroIn .9s var(--ease) .18s both;}
.vxs-hero .hoa .bar{animation:vxHeroIn .8s var(--ease) .6s both;}
.vxs-hero .hjg,.vxs-hero .hsgv,.vxs-hero .hmn,.vxs-hero .hoa,.vxs-hero .hba{overflow:hidden;}
.vxs-hero .bg,.vxs-hero .hmn-bg{animation:vxKen 36s linear infinite alternate;will-change:transform;}
/* one grade across every hero frame so rotating photos read as one shoot */
.vxs-hero .bg img,.vxs-hero .hmn-bg img{filter:saturate(.9) contrast(1.05) brightness(.98);}
.sec img{filter:saturate(.94);}
/* ---- lead-form wiring (unscoped twin of the catalogs' own block, so a
   future slot that carries a form is covered without remembering to add it) */
.vx-hp{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none;}
.vx-route{font-size:12.5px;color:var(--muted);grid-column:1/-1;}
.vx-err{font-size:12.5px;color:#9A452F;grid-column:1/-1;}
.vx-err a{font-weight:700;text-decoration:underline;text-underline-offset:3px;}
.vx-ok{display:none;font-family:var(--display);font-weight:600;font-size:15px;color:var(--green-2);}
form.vx-sending{opacity:.7;}
form.vx-sent>*:not(.vx-ok){display:none!important;}
form.vx-sent .vx-ok{display:block;grid-column:1/-1;}
/* press feedback — the cheapest "this site responds" signal there is */
.vxs-hero .btn:active,.jcta:active,.fm-btn:active,button[class*="-btn"]:active{transform:scale(.98);}
@media(prefers-reduced-motion:reduce){.vxs-hero .hjg .wrap,.vxs-hero .copy,.vxs-hero .hmn-copy,.vxs-hero .hoa .bar{animation:none;}.vxs-hero .bg,.vxs-hero .hmn-bg{animation:none;}}
/* (brand title card moved to the ENTRANCE CATALOG, slot 0 — showcase/entrance/) */
/* ---- fwllc additions ---- */

/* crests, drawn by fw-mark.js (one owner). Header: her full crest at 32px. Footer: centred over the brand text (Alec 2026-09-08). */
.jh .jmk .fw-crest-full{display:block;width:32px;height:auto;}
.jf .cols>div:first-child{text-align:center;}
.jf .jf-crest{display:block;width:84px;margin:0 auto 16px;}
.jf .jf-crest svg{display:block;width:100%;height:auto;}
.jf .ftag{margin-left:auto;margin-right:auto;}
/* Alec 2026-09-09: the centred brand column is desktop only; on a phone every footer column is left-aligned. */
@media(max-width:760px){.jf .cols>div:first-child{text-align:left;}.jf .jf-crest{margin:0 0 16px;}.jf .ftag{margin-left:0;margin-right:0;}}

/* ---- before / after: the slider moving on its own (fw-ba.js). First wipe 1s after the card is on screen, then 2s a side on a phone, 3s on desktop.
   The wipe duration is --ba-wipe, SET BY fw-ba.js (one owner); the 1.5s here is only the no-JS fallback and never runs.
   ref: emil-design-eng (clip-path wipe, transform/opacity/clip only; reduced motion = crossfade) ---- */
.ba{position:relative;overflow:hidden;background:var(--dark);}
.ba picture{display:contents;}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
/* Same layout as the drag slider we had: BEFORE on the left of the line, AFTER on the right. The line starts at the right
   edge and travels left uncovering AFTER behind it (left inset 100% -> 0), then travels back right covering it again.
   Same curve and duration on the clip and the line, so the reveal edge and the line are the same pixel. */
.ba .after{clip-path:inset(0 0 0 100%);transition:clip-path var(--ba-wipe,1.5s) cubic-bezier(.45,0,.55,1);}
.ba.show .after{clip-path:inset(0 0 0 0);}
.ba.no-t .after,.ba.no-t .hd{transition:none !important;}
.ba .hd{position:absolute;top:0;bottom:0;left:100%;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px rgba(15,29,51,.18);opacity:0;transition:left var(--ba-wipe,1.5s) cubic-bezier(.45,0,.55,1),opacity .25s ease;pointer-events:none;}
.ba.show .hd{left:0;opacity:1;}
.ba.settled .hd{opacity:0;}
.ba.back .hd{opacity:1;}   /* the line stays visible on the way back */
.lb{font-family:var(--display);font-weight:700;font-size:11px;line-height:1;letter-spacing:.1em;text-transform:uppercase;color:#fff;background:rgba(15,29,51,.6);padding:8px 11px;border-radius:999px;opacity:.55;transition:opacity .3s ease,background .3s ease;pointer-events:none;}
.lb.on{opacity:1;background:var(--green-2);}
.ba .lb{position:absolute;bottom:14px;}
.ba .lb.l{left:14px;}.ba .lb.r{right:14px;}
@media(prefers-reduced-motion:reduce){.ba .after{clip-path:none;opacity:0;transition:opacity .5s ease;}.ba.show .after{opacity:1;}.ba .hd{display:none;}}
.vxs-services .s3-img.ba{aspect-ratio:16/11;}
/* Alec 2026-09-09: on a phone the commercial card read "way too wide". Her canopy photos are portrait (800x1067); a 3/4 box shows the whole frame instead of a wide sliver. */
@media(max-width:560px){.vxs-services .s3-feat:not(.flip) .s3-img.ba{aspect-ratio:3/4;}}
.ba-fig{margin:0;}
.ba-fig .ba{aspect-ratio:4/5;border-radius:var(--rad);}
.ba-fig figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:12px;font-family:var(--display);font-weight:700;font-size:15px;color:var(--ink);}
.ba-fig figcaption span{font-family:var(--mono);font-weight:500;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);white-space:nowrap;}
/* ---- hero: her best pairs, full-bleed behind the copy (image behind the text, scrim for contrast) ---- */
.vxs-hero .hero-ba .ba.slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;background:var(--dark);}
.vxs-hero .hero-ba .ba.slide.on{opacity:1;}
.vxs-hero .hero-ba .ba.slide img{object-position:50% 46%;}
.vxs-hero .hero-lbs{position:absolute;z-index:3;top:94px;left:max(20px,calc((100% - var(--wrap)) / 2 + 32px));display:flex;gap:8px;}  /* lines up with the copy's left edge */  /* the header sits over the top ~70px of the hero */
.vxs-hero .hba .pre{font-family:var(--display);font-weight:500;font-size:1.05rem;color:rgba(255,255,255,.9);margin:0;}
.vxs-hero .hba .ctarow{display:flex;gap:12px;flex-wrap:wrap;}
@media(max-width:560px){.vxs-hero .hero-lbs{top:92px;}.vxs-hero .hba .inner{padding:0 0 48px;}.vxs-hero .hba .title{margin:12px 0 18px;}}
/* hero image (home): Alec's dusk driveway render; keep the wand and the clean edge in frame on a tall phone crop */
.vxs-hero .hjg .bg .hero-img{object-position:62% 50%;}
@media(max-width:560px){.vxs-hero .hjg .bg .hero-img{object-position:66% 56%;}.vxs-hero .hjg .scrim{background-image:radial-gradient(120% 100% at 50% 42%,rgba(10,34,44,.36),rgba(10,34,44,.74));}}
/* ---- commercial page ---- */
.ci{display:grid;grid-template-columns:1fr 1.2fr;gap:56px;align-items:start;}
.ci-list{list-style:none;margin:0;padding:0;counter-reset:ci;}
.ci-list li{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:20px 0;border-top:1px solid var(--line);counter-increment:ci;}
.ci-list li::before{content:counter(ci,decimal-leading-zero);font-family:var(--display);font-weight:700;font-size:13px;color:var(--green);letter-spacing:.06em;padding-top:4px;}
.ci-list li:last-child{border-bottom:1px solid var(--line);}
.ci-list b{display:block;font-family:var(--display);font-weight:600;font-size:1.1rem;margin-bottom:4px;}
.ci-list span{grid-column:2;font-size:14.5px;line-height:1.5;color:var(--ink-soft);}
.cw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:44px;}
.cp{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center;}
.cp-quote{margin:0;background:var(--dark);color:#fff;border-radius:var(--rad);padding:40px 36px;}
.cp-quote p{font-family:var(--display);font-weight:600;font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.35;text-wrap:balance;margin:0 0 18px;}
.cp-quote footer{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);}
@media(max-width:820px){.ci,.cp{grid-template-columns:1fr;gap:36px;}.cw-grid{grid-template-columns:1fr;gap:26px;}}
@media(min-width:821px) and (max-width:1000px){.cw-grid{grid-template-columns:repeat(2,1fr);}}

/* ---- page-level rules lifted from index.html (header nowrap, 375px header, photo crops) ---- */
.jcta{white-space:nowrap;}.jb{white-space:nowrap;}.jb .llc{display:none;}@media(min-width:560px){.jb .llc{display:inline;}}@media(max-width:559px){.jb{font-size:14.5px;letter-spacing:0;}.jcta{font-size:13.5px;padding:9px 13px;}}
/* 375px pass: the small-screen header rules below were authored as .jb/.jcta
   and lost to .jh .jb on specificity, so the wordmark never shrank and spilled
   out of the sticky bar. Re-stated at matching specificity, plus the eyebrow
   strip is no longer a fixed 32px box its own text cannot fit inside. */
@media(max-width:559px){
 .jh .wrap{gap:10px;}
 /* .jb was collapsing to the 34px width of its shield and letting the
    wordmark spill out of the bar; it must not shrink below its content. */
 .jh .jb{font-size:14.5px;letter-spacing:0;gap:8px;flex:0 0 auto;white-space:nowrap;}
 .jh .jr{flex:0 0 auto;}
 .jh .jcta{font-size:13.5px;padding:9px 13px;}
 .jh .llc{display:none;}
 .jlic{font-size:10px;}
 .jlic .wrap{height:auto;min-height:30px;padding-top:6px;padding-bottom:6px;gap:10px;}
 .jlic-mid{display:none;}
}
@media(max-width:359px){ .jh .jb{font-size:0;gap:0;} .jh .jb .jmk{font-size:13.5px;} }
/* p5652626 and p35153375 are PORTRAIT (3:4). Dropped into a landscape box a
   centre crop lands on a shoulder - the 'wash in progress' panel was a strip
   of yellow jacket. Bias the crop to the spray and the siding. */
img[src$="p5652626.jpg"]{object-position:55% 22%;}
img[src$="p35153375.jpg"]{object-position:50% 38%;}
/* Her photos are 3:4 off a phone. In a tall 375px hero that is ideal; in a
   wide desktop box a centre crop cuts the house off at the knees, so the
   client photos hold the upper-middle of the frame where the subject is. */
img[src*="img/client/"]{object-position:50% 38%;}

/* ---- the rest of the services: centred (Alec 2026-09-08) ---- */
.vxs-services .s3-rest{display:flex;flex-wrap:wrap;justify-content:center;gap:0 56px;border-top:1px solid var(--line);}
.vxs-services .s3-mini,.vxs-services .s3-mini:first-child{flex:0 1 250px;border-left:0;padding:28px 0 4px;align-items:center;text-align:center;}
.vxs-services .s3-mini .iplate{margin-left:auto;margin-right:auto;}
@media(max-width:860px){.vxs-services .s3-rest{gap:0;}.vxs-services .s3-mini,.vxs-services .s3-mini:first-child{flex:0 1 100%;padding:22px 0 10px;border-top:1px solid var(--line);}.vxs-services .s3-mini:first-child{border-top:0;}}

/* about: the owner-by-the-van photo is portrait; a tall box keeps his head and the lettering (Alec 2026-09-09) */
/* THE OWNERS LIVE ON THE PORTRAIT (Alec 2026-09-19: "the owners part I need you
   to make it belong. It's in there as an afterthought"). It was a name-and-role
   signature under a hairline at the end of the copy: two grey lines with no name
   in them, floating. Now the photo card is a labelled plate: the picture, and
   under it on her navy, who this is. One object, one idea. The chips that said
   the same thing in the copy column are gone with the signature. */
.vxs-founder .f1-img{aspect-ratio:auto;display:flex;flex-direction:column;}
.vxs-founder .f1-img picture{display:block;aspect-ratio:4/5;overflow:hidden;}
.vxs-founder .f1-img img{object-position:50% 40%;}
.vxs-founder .f1-who{background:var(--dark);color:#fff;padding:18px 22px 20px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;}
.vxs-founder .f1-who b{font-family:var(--display);font-weight:700;font-size:1.05rem;letter-spacing:-.01em;}
.vxs-founder .f1-who span{font-size:14px;color:rgba(255,255,255,.74);}
.vxs-founder .f1-who .f1-since{flex-basis:100%;margin-top:6px;font-family:var(--display);font-weight:600;font-size:13px;color:var(--brass);}
@media(max-width:860px){.vxs-founder .f1-who{padding:16px 18px 18px;}}

/* header (Alec 2026-09-09): links sit beside the Quote button, the name is one piece, no bar above */
.jh .jn{margin-left:auto;}
.jh .jr{margin-left:6px;}
.jh .jb .jbt{white-space:nowrap;}
.jh .jb .llc{display:none;}

/* ================================================================
   HERO: her three job clips.  2026-09-17
   ref: house hero variant .hba (bottom-anchored copy, image BEHIND the
        text, scrim for contrast) + her three clips from 2026-09-17.
   phone   : EVENT - one clip edge to edge, nearly the whole 9:16 frame,
             copy bottom-anchored in a scrim, full viewport height.
   desktop : the SAME one clip, cropped wide. Alec 2026-09-17: "we want
             to crop it for the desktop, not stack 3 by each others."

   THE CROP.  Source is portrait phone video, so a ~1440x828 desktop hero
   shows a band of only ~32% of the source height and upscales it 2.5-3.1x.
   WHICH band decides whether it works: a centred crop takes the worker's
   head off in two of the three clips. The band is therefore per-clip, set
   as --hv-y by fw-hero-video.js from the values in tools/fw_hero.py, each
   one chosen by rendering it across TEN frames of the full clip and
   looking at every frame, because all three pan AND tilt while playing.
   A phone crops only ~10%, so there it stays centred.

   CALM, NOT TIKTOK.  Alec 2026-09-17: "This needs to have a calming
   effect, not capture you attention tiktok affect." So: clips run FULL
   length (8.90 / 7.10 / 4.73s, a 20.7s cycle), the dissolve is 1.2s of
   plain opacity on `ease` - no blur, no scale - and there is no progress
   bar or counter of any kind. An earlier build cut every clip to 4.60s
   and drew three filling bars along the bottom; both are gone and neither
   comes back.
   NOTHING LOOPS: every clip pans, so its own loop point snaps (measured
   first-vs-last RMS 16 / 35 / 43 of 255). The carousel is the loop, and
   every transition goes to a DIFFERENT clip.
   ONE OWNER: fw-hero-video.js drives it, this file styles it, and the clip
   list lives in the markup so the deploy gate can see the filenames. */
.vxs-hero .hvid{position:relative;display:flex;align-items:flex-end;
  /* THE WHOLE FIRST SCREEN, phone and desktop. Alec 2026-09-19: "I want the
     hero to go down to the bottom of the page, I don't like that little tab of
     white stuff, same with mobile and desktop."
     Desktop had min(92vh,860px), which left the next section showing under it.
     The phone had 100svh: the height with Safari's toolbar SHOWING, so the page
     behind and under the toolbar was the pale next section. lvh is the height
     with the toolbar gone, so the hero runs to the bottom edge of the glass
     either way. The copy below adds the same difference to its padding, so the
     buttons still clear the toolbar on first load. Desktop has no toolbar that
     comes and goes, so there lvh = svh = vh and the extra padding is 0. */
  min-height:100vh;min-height:100lvh;background:var(--dark);overflow:hidden;}

.vxs-hero .hv-stage{position:absolute;inset:0;overflow:hidden;background:var(--dark);}

.vxs-hero .hv-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:50% 50%;                       /* phone: barely cropped, centred */
  display:block;                                /* no filter: it cost a GPU pass per frame on phones (09-19) */
  transition:opacity 1.2s ease;}                 /* slow, plain, no blur */
/* THE STILL under the videos. Phone: the first clip's poster, so the frame
   under the video is the video's own first frame. Desktop: the picture IS the
   hero (Alec 2026-09-19: "I don't like how blurry it is on the desktop, we're
   gonna make it a static image ... Keep the videos for mobile"), the videos
   are display:none and, with no matching <source>, never download. */
.vxs-hero .hv-still{position:absolute;inset:0;display:block;}
.vxs-hero .hv-still img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block;}
@media(min-width:900px){
  .vxs-hero .hv-v{display:none;}
  .vxs-hero .hv-still img{object-position:50% var(--hs-y,50%);}
}
.vxs-hero .hv-v.hv-off{opacity:0;}            /* rest state, no JS needed */

/* scrim: bright at the top, reads as sunshine; dense only where the copy is */
.vxs-hero .hv-scrim{position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(to top,rgba(0,18,48,.90) 0%,rgba(0,18,48,.78) 18%,rgba(0,18,48,.50) 36%,rgba(0,18,48,.26) 56%,rgba(0,18,48,.06) 76%,rgba(0,18,48,0) 100%),
    linear-gradient(to bottom,rgba(0,18,48,.34) 0%,rgba(0,18,48,0) 26%);}
/* DESKTOP ONLY: a third scrim layer anchored under the copy, so the copy has a
   dark ground whichever clip is behind it - including the monument clip, whose
   own carved lettering otherwise competes with the 63px headline. */
@media(min-width:900px){
  .vxs-hero .hv-scrim{background:
    radial-gradient(125% 88% at 6% 104%,rgba(0,18,48,.74) 0%,rgba(0,18,48,.46) 40%,rgba(0,18,48,.12) 62%,rgba(0,18,48,0) 76%),
    linear-gradient(to top,rgba(0,18,48,.90) 0%,rgba(0,18,48,.70) 18%,rgba(0,18,48,.40) 36%,rgba(0,18,48,.18) 56%,rgba(0,18,48,.04) 76%,rgba(0,18,48,0) 100%),
    linear-gradient(to bottom,rgba(0,18,48,.30) 0%,rgba(0,18,48,0) 26%);}
}

.vxs-hero .hv-copy{position:relative;z-index:3;width:100%;padding:0 0 40px;
  /* see .hvid: clears a showing Safari toolbar, or the home indicator when the
     page runs under it (viewport-fit=cover, 2026-09-19) */
  padding-bottom:calc(40px + max(100lvh - 100svh, env(safe-area-inset-bottom, 0px)));}
@media(min-width:900px){.vxs-hero .hv-copy{padding-bottom:62px;padding-bottom:calc(62px + max(100lvh - 100svh, env(safe-area-inset-bottom, 0px)));}}
.vxs-hero .hv-copy .pre{color:rgba(255,255,255,.92);font-size:15px;font-weight:600;
  max-width:30ch;margin-bottom:12px;text-shadow:0 1px 14px rgba(0,16,42,.55);}
.vxs-hero .hv-copy .title{color:#fff;font-family:var(--display);font-weight:800;
  letter-spacing:-.022em;line-height:1.04;font-size:clamp(2.35rem,8.2vw,3.1rem);
  max-width:15ch;text-wrap:balance;text-shadow:0 2px 26px rgba(0,16,42,.42);}
@media(min-width:900px){
  .vxs-hero .hv-copy .pre{font-size:16.5px;max-width:42ch;}
  .vxs-hero .hv-copy .title{font-size:clamp(3.1rem,4.4vw,4.1rem);max-width:19ch;}
}
/* her headline's second sentence (2026-09-28). One step above .pre (15px -> 19px, 1.27x) so
   the two small lines never read as the same size; weight 500 keeps it under the title. */
.vxs-hero .hv-copy .sub{color:rgba(255,255,255,.93);font-size:19px;font-weight:500;line-height:1.35;
  max-width:26ch;margin-top:14px;text-wrap:balance;text-shadow:0 1px 14px rgba(0,16,42,.55);}
@media(min-width:900px){.vxs-hero .hv-copy .sub{font-size:21px;max-width:40ch;margin-top:16px;}}
/* PHONE: a backing that FOLLOWS the copy block (2026-09-28). The hero scrim is fixed percentages of
   the hero, so when her two-line headline made the copy ~26px taller, the top line rose onto the
   bright wall in the first clip: worst pixel 2.35:1, 95th pct 2.92:1 with the shadow off (live had
   95th pct 5.7-8:1). Anchored to .hv-copy, it grows with whatever copy sits there. .52 (not .42)
   so the top line also clears 4.5:1 on a 320px phone, where the copy starts higher. */
/* Built as the block's OWN background, extended upward by padding (the copy is bottom-anchored, so
   nothing moves). NOT a z-index:-1 ::before: that version blanked the frosted Call button at
   320x568 (label and border gone; backdrop-filter over a negative-z layer), found by looking. */
@media(max-width:899px){.vxs-hero .hv-copy{padding-top:64px;
  background:linear-gradient(to bottom,rgba(0,18,48,0) 0,rgba(0,18,48,.52) 64px,rgba(0,18,48,.52) 100%);}}
.vxs-hero .hv-copy .ctarow{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px;}
@media(min-width:900px){.vxs-hero .hv-copy .ctarow{margin-top:28px;}}
/* THE PROOF ROW under the buttons (2026-09-29, ref: library heroes catalog, SGV Pool .revs).
   A link down to the live review band, not a rating: the number stays with Google (see apply-hero.py).
   PHONE: a hairline-topped line that belongs to the copy block (one-move: proof lives inside the copy,
   never floating), the mark on its own line so the sentence never breaks mid-phrase at 375.
   DESKTOP: the library's pill, one line. Her gold on the navy backing is 7.97:1. */
.vxs-hero .hv-proof{display:flex;flex-direction:column;align-items:flex-start;gap:8px;
  margin-top:22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.22);
  color:rgba(255,255,255,.94);text-decoration:none;-webkit-tap-highlight-color:transparent;}
.vxs-hero .hv-proof-mk{display:inline-flex;align-items:center;gap:9px;}
.vxs-hero .hv-g{display:block;flex:none;}
.vxs-hero .hv-stars{display:block;color:var(--brass);}
.vxs-hero .hv-proof-t{font-size:15px;font-weight:600;line-height:1.35;
  text-decoration:underline;text-decoration-color:rgba(255,255,255,.4);text-underline-offset:4px;
  text-decoration-thickness:1px;text-shadow:0 1px 14px rgba(0,16,42,.55);transition:text-decoration-color .2s var(--ease);}
.vxs-hero .hv-proof-ar{display:inline-block;vertical-align:-2px;margin-left:6px;}
.vxs-hero .hv-nw{white-space:nowrap;}   /* the arrow never sits alone on a line */
@media(max-width:899px){.vxs-hero .hv-proof-t{font-size:14.5px;}}   /* one line at 375 */
/* SHORT PHONES (320x568): the stacked row pushed her first line up under the header. Here the mark
   flows inline in front of the sentence, one line shorter, and the row sits closer to the buttons. */
@media(max-width:899px) and (max-height:640px){
  .vxs-hero .hv-proof{display:block;margin-top:16px;padding-top:12px;}
  .vxs-hero .hv-proof-mk{display:inline-flex;vertical-align:-2px;margin-right:9px;}
  /* and the rest of the copy tightens a step, so the block still fits under the header. The backing
     ramp shrinks WITH the padding (both 32px), so the first line still sits on the full .52 backing. */
  .vxs-hero .hv-copy{padding-top:32px;padding-bottom:calc(24px + max(100lvh - 100svh, env(safe-area-inset-bottom, 0px)));
    background:linear-gradient(to bottom,rgba(0,18,48,0) 0,rgba(0,18,48,.52) 32px,rgba(0,18,48,.52) 100%);}
  .vxs-hero .hv-copy .pre{margin-bottom:8px;}
  .vxs-hero .hv-copy .sub{margin-top:10px;}
  .vxs-hero .hv-copy .ctarow{margin-top:16px;gap:10px;}
}
.vxs-hero .hv-proof:hover .hv-proof-t,.vxs-hero .hv-proof:focus-visible .hv-proof-t{text-decoration-color:var(--brass);}
.vxs-hero .hv-proof:focus-visible{outline:2px solid #fff;outline-offset:4px;border-radius:4px;}
@media(min-width:900px){
  .vxs-hero .hv-proof{display:inline-flex;flex-direction:row;align-items:center;gap:12px;margin-top:22px;
    padding:10px 18px 10px 14px;border:1px solid rgba(255,255,255,.22);border-radius:999px;
    background:rgba(255,255,255,.1);transition:background .2s var(--ease),border-color .2s var(--ease);}
  .vxs-hero .hv-proof:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.4);}
  .vxs-hero .hv-proof-t{font-size:15px;text-decoration-color:transparent;}
  .vxs-hero .hv-proof:focus-visible{border-radius:999px;}
}

@media(prefers-reduced-motion:reduce){
  .vxs-hero .hv-v{transition:none;}
}

/* ================================================================
   FOOTER ON WHITE.  Alec 2026-09-17: "notice how you made the background
   blue and then the logo. Make the background white."  So the crest sits
   on white, the way it does on her business card, and the type is her
   navy instead of washed-out white-on-navy.  These rules come AFTER the
   .jf block above and deliberately override it; the old navy footer is
   not reachable any more.
   Her gold is 1.85:1 on white, so the link hover cannot be --brass here:
   it uses --green (5.99:1). That is the one place this footer departs
   from the navy one. */
.vxs-footer .jf,.jf{background:var(--paper3);color:var(--ink-soft);
  border-top:1px solid var(--line);}
.jf h5{color:var(--ink);}
.jf .ct b{color:var(--ink);}
.jf a:hover{color:var(--green);}
.jf .lic{color:var(--muted);}
.jf .bar{border-top:1px solid var(--line);color:var(--muted);}

/* ================================================================
   OWNERS BLOCK AS ONE CARD, ON PHONES.  2026-09-17
   ref: the same "one object per screen" move as the Amino Club phone
        notes (memory: amino-club-phone-notes) - a section should read as
        a single thing, not an arrangement of loose pieces.
   Alec 2026-09-17: "on mobile where it says the owners, make it in a
   bubble, basically make it look like it belongs there, it kinda of
   sits there akwardly on the mobile."
   What was wrong, measured at 375: the .f1 grid had a transparent
   background, 0 radius and 0 border, so the photo rendered as a floating
   rounded rectangle with a glass caption and the story rendered as bare
   page copy 32px below it. Two unrelated objects on one ground.
   The move: the photo becomes the top of a white card and the story its
   body, so they are one object. Photo flush to the card's edges (the
   card clips it), gap 0, padding on the body only.
   DESKTOP IS UNTOUCHED - he asked about the phone, and the two-column
   split already reads as one composition there.
   NOTE the real ancestor is .vxs-founder.vx-flip (NOT .vxs-why - the nearest
   PRECEDING wrapper in the source is vxs-why, but it closes before this block).
   .vx-flip sets direction:rtl on .f1 to swap the desktop columns; at one column
   that is invisible, so it is left alone. */
@media(max-width:899px){
  .vxs-founder .f1{
    background:var(--paper3);           /* white on the section's --paper ground */
    border:1px solid var(--line);
    border-radius:18px;
    overflow:hidden;                    /* clips the photo into the corners */
    gap:0;
    box-shadow:0 18px 40px -28px rgba(0,36,96,.30);
  }
  /* the photo is the card's lid: flush, square-cornered, no inset ring */
  .vxs-founder .f1 .f1-img{border-radius:0;aspect-ratio:4/5;}
  .vxs-founder .f1 .f1-img::after{display:none;}
  /* the caption sat as a floating glass bar; inside a card it reads better
     hugging the photo's bottom edge with the corners gone */
  .vxs-founder .f1 .pcap{left:0;right:0;bottom:0;border-radius:0;padding:14px 20px;}
  .vxs-founder .f1 .f1-bd{padding:24px 20px 26px;}
  /* the heading was taking three lines of a 335px column and dominating the
     card; inside the padding it gets a slightly tighter scale */
  .vxs-founder .f1 .f1-bd .h2{font-size:1.62rem;line-height:1.16;}
  .vxs-founder .f1 .f1-bd p{font-size:14.5px;}
  .vxs-founder .f1 .f1-chips{margin-top:18px;}
}

/* ================================================================
   MID-PAGE CTA: A NUMBER TO CALL, NOT JUST A FORM.  2026-09-17
   ref: ui-ux-pro-max local-service pattern - a visible tap-to-call is a
        conversion essential for a trade, not a nicety.
   Alec 2026-09-17: "For the mid page CTA it's just a contact form, I want
   there to be a number people can call as well."
   Before this the ONLY phone number in that section lived inside the
   hidden .vx-err message, so somebody who would rather ring had nothing
   to tap. The form's submit stays the primary action; this is a clear
   secondary under a hairline, full-width and 48px tall on a phone so it
   is a real tap target. */
.vxs-form .f5b-call{grid-column:1/-1;margin-top:4px;padding-top:16px;
  border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;
  flex-wrap:wrap;font-size:13.5px;color:var(--muted);}
.vxs-form .f5b-call a{display:inline-flex;align-items:center;gap:8px;
  font-family:var(--display);font-weight:700;font-size:15px;color:var(--green);
  transition:color .2s ease,transform .16s var(--ease-out);}
.vxs-form .f5b-call a .ic{width:17px;height:17px;}
@media(hover:hover) and (pointer:fine){
  .vxs-form .f5b-call a:hover{color:var(--green-2);}
}
.vxs-form .f5b-call a:active{transform:scale(.97);}
@media(max-width:899px){
  /* a phone is where someone actually calls: make it a real button-sized
     target rather than an inline link */
  .vxs-form .f5b-call{flex-direction:column;align-items:stretch;gap:8px;text-align:center;}
  .vxs-form .f5b-call a{justify-content:center;min-height:48px;
    border:1.5px solid var(--green);border-radius:10px;font-size:16px;}
}

/* ================================================================
   COMMERCIAL: THE VAN ON SITE.  2026-09-17
   ref: her own photo of the branded van at a commercial property.
   Alec 2026-09-17: "this one shows him working on commercial and he
   wants the social proof."
   phone   : EVENT - the photo edge to edge (it breaks the wrap), 4:3,
             one caption line under it. Neither neighbour uses this
             shape: before/after cards above, process rows below.
   desktop : contained split, photo left at 58%, her sentence right.
             CONTAINED, not full-bleed: at the wrap width the photo sits
             near its native resolution instead of being upscaled, which
             is the mistake the hero video cannot avoid. */
.vxs-rig .rig{display:grid;grid-template-columns:1fr;gap:20px;}
.vxs-rig .rig-img{position:relative;margin:0;}
/* phone: out of the wrap, edge to edge */
.vxs-rig .rig-img{margin-inline:calc(50% - 50vw);}
.vxs-rig .rig-img img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;display:block;}
/* The caption is OVERLAID on the photo, not set under it. Under it, sitting
   directly above the h2, it read as an eyebrow/kicker label - which is a
   standing no - and at 375 it landed 15px from the heading's cap height and
   the two collided. On the photo it belongs to the photo, which is what a
   caption is for. Same treatment as .pcap elsewhere on the site. */
.vxs-rig .rig-img figcaption{position:absolute;left:0;right:0;bottom:0;
  background:linear-gradient(to top,rgba(0,18,48,.78),rgba(0,18,48,.42) 60%,rgba(0,18,48,0));
  color:rgba(255,255,255,.95);font-size:13px;padding:26px 20px 12px;}
.vxs-rig .rig-bd .h2{font-size:1.5rem;line-height:1.18;margin-bottom:10px;}
.vxs-rig .rig-bd p{font-size:14.5px;color:var(--ink-soft);max-width:46ch;}
@media(min-width:900px){
  .vxs-rig .rig{grid-template-columns:1.38fr 1fr;gap:52px;align-items:center;}
  .vxs-rig .rig-img{margin-inline:0;border-radius:var(--rad);overflow:hidden;}
  .vxs-rig .rig-img img{aspect-ratio:4/3;}
  .vxs-rig .rig-img figcaption{padding:30px 22px 14px;}
  .vxs-rig .rig-bd .h2{font-size:clamp(1.8rem,2.6vw,2.2rem);}
  .vxs-rig .rig-bd p{font-size:15px;}
}

/* ---- REVIEWS, live from Google (2026-09-28). Engine: fw-reviews.js ----
   ref: our house review carousel (Pure Primary v2 reviews rows, 2026-08-25): a row that
   drifts on its own, cloned once, held still by hover, focus or a finger, a swipe row under
   reduced motion. ONE row, because Google gives a website five reviews. Ground: her logo navy,
   the site's approved dark-band surface; stars in her card gold (#F3B33C on the card: 7.9:1).
   ui-ux-pro-max: social proof directly before the ask, 3-5 reviews, photo + name. */
/* !important because a site-wide `.sec{background:var(--paper2)!important}` paints every band light blue;
   without it this band rendered light blue under white type (found by looking, 2026-09-28). */
.vxs-reviews .sec{background:var(--dark)!important;color:#fff;padding:96px 0 88px;overflow:hidden;}
/* the hero's "See what our customers are saying" link lands here: html scroll-padding-top (82px) left a
   15px strip of the section above showing under the 67px header, so the band pulls up to meet it */
.vxs-reviews{scroll-margin-top:-16px;}
.vxs-reviews .head{max-width:680px;margin-bottom:34px;}
.vxs-reviews .h2{font-family:var(--display);font-weight:600;font-size:clamp(1.8rem,3.2vw,2.5rem);
  letter-spacing:-.02em;line-height:1.1;margin:0;color:#fff;}
.vxs-reviews .rv-sum{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;margin:16px 0 0;
  font-size:15.5px;color:rgba(255,255,255,.88);}
.vxs-reviews .rv-sum[hidden]{display:none;}
.vxs-reviews .rv-stars{display:inline-flex;gap:3px;color:var(--brass);}
.vxs-reviews .rv-stars svg{width:15px;height:15px;fill:currentColor;display:block;}
/* the rail: full-bleed, edges fade into the band instead of cutting cards off hard */
.vxs-reviews .rv-rail{--rv-gap:14px;position:relative;overflow:hidden;opacity:0;transition:opacity .5s var(--ease-out);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);}
.vxs-reviews.rv-loading .rv-rail{min-height:292px;}   /* holds the space while the call is out: no jump */
.vxs-reviews.rv-live .rv-rail{opacity:1;}
/* ARRIVAL, once (fw-reviews.js owns the classes). It must come AFTER the rail's own .rv-live fade just
   above, or that rule (same weight, later) shows the cards before the band is on screen (found 09-29): .rv-anim = the script will reveal, .rv-in = the band
   is on screen, .rv-got = Google's reviews are in. Heading 0 / rating 80 / cards 160 / link 240ms. */
.vxs-reviews.rv-anim .head h2,.vxs-reviews.rv-anim .rv-sum,.vxs-reviews.rv-anim .rv-rail,.vxs-reviews.rv-anim .foot{
  opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);}
.vxs-reviews.rv-anim.rv-in .head h2{opacity:1;transform:none;}
.vxs-reviews.rv-anim.rv-in.rv-got .rv-sum{opacity:1;transform:none;transition-delay:80ms;}
.vxs-reviews.rv-anim.rv-in.rv-got .rv-rail{opacity:1;transform:none;transition-delay:160ms;}
.vxs-reviews.rv-anim.rv-in .foot{opacity:1;transform:none;transition-delay:240ms;}
@media(prefers-reduced-motion:reduce){
  .vxs-reviews.rv-anim .head h2,.vxs-reviews.rv-anim .rv-sum,.vxs-reviews.rv-anim .rv-rail,.vxs-reviews.rv-anim .foot{
    transform:none;transition:opacity .4s ease;}
}
/* track = [set][clone]; fw-reviews.js moves it (transform only) and wraps after one set plus one
   gap, where the clone stands exactly where the set began. The drift is NOT a CSS animation any
   more: a finger has to be able to stop it, and iPhone Safari ignores :active for that (Alec,
   2026-09-28: "I wasn't able to hold it on my phone"). */
.vxs-reviews .rv-track{display:flex;gap:var(--rv-gap);width:max-content;}
.vxs-reviews .rv-set{display:flex;gap:var(--rv-gap);}
/* driven: sideways gestures belong to the row, up and down still scroll the page; a held finger
   must not start a text selection or the press-and-hold menu, or it would stop reading as a hold */
.vxs-reviews.rv-driven .rv-rail{touch-action:pan-y;-webkit-user-select:none;user-select:none;
  -webkit-touch-callout:none;}
/* no grab cursor: on desktop only hover stops it (Alec, 2026-09-29), a mouse cannot drag it */
.vxs-reviews.rv-driven .rv-track{will-change:transform;}
.vxs-reviews .rv-rail img,.vxs-reviews .rv-rail a{-webkit-user-drag:none;}
.vxs-reviews .rv-card{flex:0 0 auto;width:min(80vw,300px);margin:0;padding:22px 22px 20px;border-radius:var(--rad);
  background:#0C2F6A;border:1px solid rgba(255,255,255,.09);display:flex;flex-direction:column;gap:14px;}
.vxs-reviews .rv-text{margin:0;flex:1;}
.vxs-reviews .rv-text p{margin:0;font-size:15.5px;line-height:1.55;color:rgba(255,255,255,.92);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7;line-clamp:7;overflow:hidden;}
.vxs-reviews .rv-who{display:flex;align-items:center;gap:12px;}
.vxs-reviews .rv-ph{flex:0 0 40px;width:40px;height:40px;border-radius:50%;overflow:hidden;display:grid;place-items:center;
  background:rgba(243,179,60,.16);color:var(--brass);font:700 16px var(--display);}
.vxs-reviews .rv-ph img{width:100%;height:100%;object-fit:cover;display:block;}
.vxs-reviews .rv-nm{display:flex;flex-direction:column;min-width:0;}
.vxs-reviews .rv-name{color:#fff;font-weight:600;font-size:15px;text-decoration:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.vxs-reviews a.rv-name:hover{text-decoration:underline;text-underline-offset:3px;}
.vxs-reviews .rv-nm small{font-size:13px;color:rgba(255,255,255,.64);}
.vxs-reviews .foot{margin-top:30px;}
.vxs-reviews .rv-all{color:#fff;font-weight:600;font-size:15.5px;text-decoration:underline;
  text-underline-offset:5px;text-decoration-color:rgba(243,179,60,.75);}
.vxs-reviews .rv-all:hover{text-decoration-color:var(--brass);}
@media(min-width:900px){
  .vxs-reviews .sec{padding:112px 0 100px;}
  .vxs-reviews .head{margin-bottom:42px;}
  .vxs-reviews .rv-rail{--rv-gap:22px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
            mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);}
  .vxs-reviews.rv-loading .rv-rail{min-height:300px;}
  .vxs-reviews .rv-card{width:380px;padding:28px 28px 24px;}
  .vxs-reviews .rv-text p{font-size:16px;-webkit-line-clamp:6;line-clamp:6;}
  .vxs-reviews .foot{margin-top:38px;}
}
@media(prefers-reduced-motion:reduce){
  .vxs-reviews .rv-rail{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-mask-image:none;mask-image:none;transition:none;}
  .vxs-reviews .rv-track{animation:none;padding:0 20px;}
  .vxs-reviews .rv-card{scroll-snap-align:center;}
  .vxs-reviews .rv-clone{display:none;}
}

/* ---- COMMERCIAL: a client case card (2026-09-29). Markup: tools/compose-commercial.py ----
   ref: the Janney Roofing move (REFERENCE-SITES.md): the client's words large, attribution quiet,
   with her own job photo beside it (Stan washing the Calvary sign, her clip IMG_5723). The page's one
   white band, between the pale-blue work and process bands. Stars: her card gold with a gold-ink edge,
   so they hold 3:1 on white without turning brown. The whole review sits in a native <details>. */
.vxs-client-review .sec{background:var(--paper3)!important;padding:96px 0;}
.vxs-client-review .cr{display:grid;gap:30px;}
.vxs-client-review .cr-ph{margin:0;}
.vxs-client-review .cr-ph img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;
  object-position:50% 40%;border-radius:var(--rad);background:var(--paper2);}
.vxs-client-review .cr-ph figcaption{margin-top:10px;font-size:13.5px;color:var(--muted);}
.vxs-client-review .cr-stars{display:inline-flex;gap:4px;}
.vxs-client-review .cr-stars svg{width:19px;height:19px;display:block;fill:var(--brass);stroke:var(--gold-ink);stroke-width:1.1;
  stroke-linejoin:round;}
.vxs-client-review .cr-q{margin:16px 0 0;}
.vxs-client-review .cr-q p{margin:0;font-family:var(--display);font-weight:600;color:var(--ink);letter-spacing:-.02em;
  line-height:1.2;font-size:clamp(1.65rem,6.4vw,2.7rem);text-wrap:balance;}
.vxs-client-review .cr-who{margin:20px 0 0;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;}
.vxs-client-review .cr-who b{font-size:16.5px;font-weight:700;color:var(--ink);}
.vxs-client-review .cr-who span{font-size:14px;color:var(--muted);}
.vxs-client-review .cr-more{margin-top:26px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.vxs-client-review .cr-more summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;
  gap:12px;min-height:52px;padding:14px 0;font-weight:600;font-size:15.5px;color:var(--ink);}
.vxs-client-review .cr-more summary::-webkit-details-marker{display:none;}
.vxs-client-review .cr-more summary svg{flex:0 0 18px;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--ease-out);}
.vxs-client-review .cr-more[open] summary svg{transform:rotate(180deg);}
.vxs-client-review .cr-full{margin:2px 0 8px;}
.vxs-client-review .cr-full p{margin:0 0 14px;font-size:16px;line-height:1.7;color:var(--ink-soft);max-width:62ch;}
.vxs-client-review .cr-all{display:inline-block;margin-top:22px;font-weight:600;font-size:15.5px;color:var(--green);
  text-decoration:underline;text-underline-offset:5px;}
@media(min-width:900px){
  .vxs-client-review .sec{padding:120px 0;}
  .vxs-client-review .cr{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:72px;align-items:center;}
  .vxs-client-review .cr-ph img{aspect-ratio:4/5;object-position:50% 50%;}
}
@media(prefers-reduced-motion:reduce){.vxs-client-review .cr-more summary svg{transition:none;}}
