/* Nexo Auto Glass: premium layer (2026-10-30). Loaded after style.css.
   Warm white, charcoal, soft grey, and the logo's own blues used sparingly. Two families only:
   Cormorant Garamond (headlines) + Source Sans 3 (text, labels, buttons). */

:root{
  --ink:#16181c;--text:#2a2d33;--muted:#5d6168;--brand:#1c2872;--blue:#1d74b4;--blue-d:#283888;
  --sky:#eeebe6;--mist:#f4f1ec;--line:#e2ded7;--paper:#faf8f5;--charcoal:#17191d;--charcoal-2:#202328;--soft:#e9e6e0;
  --serif:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
  --head:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
  --r:4px;
}
body{background:var(--paper);color:var(--text)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:600;letter-spacing:-.022em;line-height:1.07;color:var(--ink)}
h1{font-size:clamp(2.9rem,6vw,5.2rem)}h2{font-size:clamp(2.2rem,4vw,3.4rem)}h3{font-size:1.7rem;line-height:1.1}h4{font-size:1.25rem}
.eyebrow{font:600 .78rem/1 var(--head);letter-spacing:.2em;color:var(--blue-d)}
.lead{font-size:1.2rem;color:var(--muted)}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:2px}

/* buttons */
.btn{border-radius:3px;min-height:52px;font:600 1rem/1 var(--head);letter-spacing:.06em;text-transform:uppercase;padding:.7rem 1.6rem}
.btn-blue{background:var(--blue-d);color:#fff}.btn-blue:hover{background:var(--brand);color:#fff}
.btn-line{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}.btn-line:hover{background:var(--ink);color:#fff}
.btn-lg{min-height:58px;font-size:1.02rem}
.link-arrow{font:600 .95rem var(--head);letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}.link-arrow:hover{color:var(--blue-d)}

/* header: warm white, hairline, compact */
.hdr{background:rgba(250,248,245,.97);border-bottom:1px solid var(--line)}
.hdr-in{min-height:76px;gap:24px}.brand img{width:158px}
.nav a.l{font:600 .92rem var(--head);letter-spacing:.1em;text-transform:uppercase;padding:.8rem .8rem;border-radius:2px;color:var(--ink)}
.nav a.l:hover,.nav a.l[aria-current=page]{background:transparent;color:var(--blue-d);box-shadow:inset 0 -2px 0 var(--blue-d)}
.has-sub .sub{border-radius:3px;border-color:var(--line);box-shadow:0 18px 40px rgba(22,24,28,.12);padding:8px;background:#fff}
.sub a{border-radius:2px;font-weight:600;font-size:.98rem}.sub a:hover{background:var(--mist);color:var(--blue-d)}.sub a svg{color:var(--muted)}
.hdr-phone{font:600 1.02rem var(--head);letter-spacing:.02em}.hdr-phone svg{color:var(--blue-d)}
.hdr-cta .btn{min-height:46px;padding:.55rem 1.25rem;font-size:.9rem}
.burger{border-radius:3px;border-color:var(--ink)}
.drawer .panel{background:var(--paper)}.drawer a.d{font:500 1.9rem var(--serif);border-bottom-color:var(--line)}.drawer .x{border-radius:3px}

/* inner pages inherit the calmer look: no slanted frames, hairline cards */
.pic::before{display:none}.pic .frame,.split .pic .frame{clip-path:none;border-radius:2px;background:var(--soft)}
.phead{background:var(--mist);border-bottom:1px solid var(--line)}
.card,.pcard,.qcard{border-radius:3px;border-color:var(--line);box-shadow:none}
.card:hover,.pcard:hover{box-shadow:0 12px 28px rgba(22,24,28,.08);border-color:#cfc9bf}
.sec-mist{background:var(--mist)}
.cta{background:var(--charcoal)}.cta h2,.cta p{color:#fff}.cta .tel{color:#fff}

/* ---------- homepage ---------- */
.hx{position:relative;isolation:isolate;overflow:hidden;background:var(--charcoal);color:#fff}
.hx-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 40%;z-index:-2}
.hx::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(16,18,22,.82) 0%,rgba(16,18,22,.62) 34%,rgba(16,18,22,.12) 66%,rgba(16,18,22,0) 100%),linear-gradient(0deg,rgba(16,18,22,.5) 0%,rgba(16,18,22,0) 38%)}
.hx-in{padding-top:clamp(7rem,15vw,11.5rem);padding-bottom:clamp(4.5rem,8vw,7rem)}
.hx-eyebrow{font:600 .78rem/1.4 var(--head);letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.82);margin:0 0 1.4rem;display:flex;align-items:center;gap:.9rem}
.hx-eyebrow::before{content:"";width:2.4rem;height:1px;background:rgba(255,255,255,.7)}
.hx h1{color:#fff;font-weight:600;font-size:clamp(3.1rem,7.4vw,6.4rem);line-height:.98;letter-spacing:-.02em;max-width:9.5em;margin:0}
.hx-lead{max-width:34rem;font-size:1.2rem;line-height:1.6;color:rgba(255,255,255,.9);margin:1.6rem 0 2.1rem}
.hx-actions{display:flex;flex-wrap:wrap;gap:12px}
.hx .btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.85)}.hx .btn-ghost:hover{background:#fff;color:var(--ink)}
.hx .btn-blue{background:#fff;color:var(--ink)}.hx .btn-blue:hover{background:var(--soft);color:var(--ink)}
.hx :focus-visible{outline-color:#fff}

.tr{background:var(--paper);border-bottom:1px solid var(--line)}
.tr ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr)}
.tr li{padding:1.35rem 1.4rem;border-left:1px solid var(--line);font:600 .84rem/1.4 var(--head);letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.tr li:first-child{border-left:0;padding-left:0}.tr li span{display:block;font:400 .98rem/1.45 var(--body);letter-spacing:0;text-transform:none;color:var(--muted);margin-top:.25rem}

.hs{padding:clamp(4.5rem,9vw,8rem) 0}
.hs-head{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,6vw,96px);align-items:end;margin-bottom:clamp(2.2rem,4vw,3.6rem)}
.hs-head p{margin:0;color:var(--muted);font-size:1.12rem}
.sv-grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(18px,2.4vw,32px)}
.sv-feat{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--line);border-radius:2px}
.sv-feat .ph{overflow:hidden;background:var(--soft)}.sv-feat img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.sv-feat:hover img{transform:scale(1.025)}
.sv-feat .tx{padding:clamp(1.3rem,2.4vw,2rem)}.sv-feat h3{font-size:clamp(1.9rem,3vw,2.5rem);margin-bottom:.6rem}.sv-feat p{color:var(--muted);margin:0 0 1.1rem;max-width:34rem}
.sv-side{display:grid;grid-template-rows:auto 1fr;gap:clamp(18px,2.4vw,32px)}
.sv-feat.small img{aspect-ratio:3/2}.sv-feat.small h3{font-size:clamp(1.7rem,2.4vw,2.1rem)}
.sv-note{background:var(--charcoal);color:#fff;padding:clamp(1.4rem,2.4vw,2rem);border-radius:2px;display:flex;flex-direction:column;justify-content:space-between;gap:1rem}
.sv-note p{color:rgba(255,255,255,.86);margin:0;font-size:1.05rem}.sv-note strong{display:block;font:600 1.6rem/1.15 var(--serif);color:#fff;margin-bottom:.5rem}
.sv-note a{color:#fff;font:600 .95rem var(--head);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.5);align-self:flex-start;padding-bottom:3px}.sv-note a:hover{border-color:#fff}
.sv-list{list-style:none;margin:clamp(2rem,4vw,3.2rem) 0 0;padding:0;border-top:1px solid var(--ink)}
.sv-list a{display:grid;grid-template-columns:132px 1fr 1.5fr 40px;gap:clamp(14px,2.4vw,32px);align-items:center;padding:1rem 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit;transition:background .2s}
.sv-list a:hover{background:rgba(255,255,255,.7)}
.sv-list img{width:132px;height:88px;object-fit:cover;border-radius:2px;background:var(--soft)}
.sv-list h3{font-size:1.7rem;margin:0}.sv-list p{margin:0;color:var(--muted);font-size:1.02rem}
.sv-list .go{justify-self:end;width:40px;height:40px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:var(--ink);transition:background .2s,color .2s,border-color .2s}
.sv-list .go svg{width:18px;height:18px}.sv-list a:hover .go{background:var(--ink);color:#fff;border-color:var(--ink)}

.cr{background:var(--soft)}
.cr-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,96px);align-items:center}
.cr-media{position:relative;background:var(--charcoal);border-radius:2px;overflow:hidden;aspect-ratio:1.08/1}
.cr-media img,.cr-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.cr-cap{position:absolute;left:0;right:0;bottom:0;padding:1.6rem 1.2rem .9rem;background:linear-gradient(0deg,rgba(16,18,22,.7),rgba(16,18,22,0));color:#fff;font:600 .74rem/1.3 var(--head);letter-spacing:.18em;text-transform:uppercase}
.cr h2{margin:.2rem 0 1.1rem}.cr p.lead{margin-bottom:1.6rem}
.cr-steps{list-style:none;margin:0 0 1.8rem;padding:0;border-top:1px solid var(--ink);counter-reset:s}
.cr-steps li{counter-increment:s;display:grid;grid-template-columns:2.6rem 1fr;gap:.4rem;padding:.95rem 0;border-bottom:1px solid #cbc6bd;font-size:1.04rem;color:var(--text)}
.cr-steps li::before{content:counter(s,decimal-leading-zero);font:600 1.25rem/1.3 var(--serif);color:var(--blue-d)}

.pr{padding:clamp(4.5rem,9vw,8rem) 0}
.pr-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,64px)}
.pr-steps li{border-top:1px solid var(--ink);padding-top:1.4rem}
.pr-steps .n{font:600 3.6rem/1 var(--serif);color:var(--blue-d);display:block;margin-bottom:1rem}
.pr-steps h3{font-size:1.8rem;margin:0 0 .6rem}.pr-steps p{margin:0;color:var(--muted)}

.ar{background:var(--mist);padding:clamp(4rem,8vw,6.5rem) 0}
.ar-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,6vw,96px);align-items:start}
.ar p{color:var(--muted);font-size:1.08rem}
.ar-list{list-style:none;margin:0;padding:0;columns:3;column-gap:2rem;border-top:1px solid var(--ink)}
.ar-list li{break-inside:avoid}.ar-list a{display:flex;justify-content:space-between;align-items:center;padding:.85rem 0;border-bottom:1px solid #d5d0c7;text-decoration:none;color:var(--ink);font:500 1.45rem var(--serif)}
.ar-list a:hover{color:var(--blue-d)}.ar-list svg{width:16px;height:16px;opacity:.5}

.fq{background:var(--charcoal);color:#fff;padding:clamp(4rem,8vw,7rem) 0}
.fq-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,96px);align-items:start}
.fq h2{color:#fff;font-size:clamp(2.4rem,4.6vw,4rem)}.fq .eyebrow{color:rgba(255,255,255,.75)}
.fq p{color:rgba(255,255,255,.82);font-size:1.12rem;max-width:30rem}
.fq .tel{display:inline-block;font:500 clamp(2rem,3.4vw,2.8rem)/1.1 var(--serif);color:#fff;text-decoration:none;margin-top:.6rem;border-bottom:1px solid rgba(255,255,255,.4)}
.fq .tel:hover{border-color:#fff}
.fq .fine{font-size:.95rem;color:rgba(255,255,255,.65);margin-top:1.4rem}
.fq .panel{background:#fff;color:var(--text);border-radius:3px;padding:clamp(1.3rem,2.4vw,2rem)}
.fq .panel :focus-visible{outline-color:var(--blue)}
.fq .qf label{color:var(--ink)}
.formerr{background:#fbeaea;border:1px solid #e3b4b4;color:#7a1f1f;padding:.9rem 1.1rem;border-radius:3px;margin:0 0 1.2rem;font-weight:600}

/* footer */
.ftr{background:var(--charcoal);color:rgba(255,255,255,.78)}.ftr h4{font:600 .78rem var(--head);letter-spacing:.2em;text-transform:uppercase;color:#fff}
.ftr a{color:rgba(255,255,255,.82)}.ftr a:hover{color:#fff}.ftr-bot{border-top:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.6)}
.ftr .logo img{width:190px;height:auto;filter:none}
.mbar{background:var(--paper);border-top:1px solid var(--line)}

@media(max-width:1000px){
  .hs-head,.cr-grid,.ar-grid,.fq-grid{grid-template-columns:1fr}.sv-grid{grid-template-columns:1fr}.sv-side{grid-template-rows:none;grid-template-columns:1fr 1fr}
  .tr ul{grid-template-columns:1fr 1fr}.tr li:nth-child(3){border-left:0;padding-left:0}.tr li{border-top:0}.tr li:nth-child(n+3){border-top:1px solid var(--line)}
  .sv-list a{grid-template-columns:104px 1fr 40px}.sv-list p{display:none}.sv-list img{width:104px;height:72px}
  .pr-steps{grid-template-columns:1fr}.ar-list{columns:2}
}
@media(max-width:700px){
  .hx-in{padding-top:6.2rem;padding-bottom:3.6rem}.hx::after{background:linear-gradient(0deg,rgba(16,18,22,.86) 0%,rgba(16,18,22,.55) 48%,rgba(16,18,22,.12) 100%)}
  .hx-img{object-position:50% 30%}.hx h1{font-size:clamp(3rem,15vw,4.2rem)}.hx-actions .btn{flex:1 1 100%}
  .sv-side{grid-template-columns:1fr}.tr ul{grid-template-columns:1fr}.tr li{border-left:0;padding-left:0;border-top:1px solid var(--line)}.tr li:first-child{border-top:0}
  .sv-list a{grid-template-columns:84px 1fr 36px;gap:14px}.sv-list img{width:84px;height:62px}.sv-list h3{font-size:1.45rem}
  .ar-list{columns:1}.cr-media{aspect-ratio:1/1}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}.cr-media video{display:none}}

/* refinements */
.hs-head .eyebrow,.pr .eyebrow,.ar .eyebrow,.cr .eyebrow{color:var(--blue-d);margin-bottom:1.1rem}
.sv-grid{align-items:stretch}.sv-feat:not(.small){height:100%}.sv-feat:not(.small) .ph{flex:1;min-height:0}.sv-feat:not(.small) .ph img{height:100%;aspect-ratio:auto;min-height:300px}
.cr-steps li::before,.pr-steps .n{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.cr h2{font-size:clamp(2rem,3.3vw,2.9rem);text-wrap:balance}.hs-head h2,.pr h2,.ar h2,.fq h2{text-wrap:balance}
.hx h1{text-wrap:balance}
.ar h2,.fq h2{margin-bottom:1.1rem}.hs-head h2,.pr h2{margin:0}
.fq .tel{font-family:var(--head);font-weight:600;font-size:clamp(1.7rem,3vw,2.3rem);letter-spacing:.01em}
.fq .panel p,.fq .panel .fnote{color:var(--muted);font-size:.95rem}.fq .panel a{color:var(--blue-d)}
.ar-list a{font-size:1.32rem}
@media(max-width:700px){.hx h1{font-size:clamp(2.6rem,12.4vw,3.6rem)}.hx-eyebrow{font-size:.7rem;letter-spacing:.16em}}

/* Apple-style type: system font everywhere, semibold headlines, tight tracking */
body{font-family:var(--head);-webkit-font-smoothing:antialiased;letter-spacing:-.003em}
.hx h1{font-weight:600;letter-spacing:-.035em;line-height:1.02}
.hs-head h2,.pr h2,.ar h2,.fq h2,.cr h2{font-weight:600;letter-spacing:-.03em}
.sv-feat h3,.sv-list h3,.pr-steps h3{font-weight:600;letter-spacing:-.02em}
.pr-steps .n,.cr-steps li::before{font-family:var(--head);font-weight:600;letter-spacing:-.02em}
.sv-note strong,.drawer a.d{font-family:var(--head);font-weight:600;letter-spacing:-.02em}
.ar-list a{font-family:var(--head);font-weight:500;font-size:1.15rem;letter-spacing:-.01em}
.fq .tel{font-family:var(--head);font-weight:600;letter-spacing:-.02em}
.btn,.nav a.l,.eyebrow,.link-arrow,.hx-eyebrow,.tr li,.ftr h4{font-family:var(--head)}
/* footer social icons: visible on the dark footer */
.ftr .social{display:flex;gap:12px;margin-top:1.2rem}
.ftr .social a{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:transparent!important;border:1px solid rgba(255,255,255,.45);color:#fff!important;transition:background .2s,color .2s,border-color .2s}
.ftr .social a svg{width:21px;height:21px}
.ftr .social a:hover{background:#fff!important;color:var(--ink)!important;border-color:#fff}
.social a{background:var(--mist);color:var(--brand)}.social a:hover{background:var(--brand);color:#fff}
.hx h1{letter-spacing:-.025em}.hs-head h2,.pr h2,.ar h2,.fq h2,.cr h2{letter-spacing:-.022em}

/* inner-page hero: full-width photo, same look as the home page, shorter */
.ph{position:relative;isolation:isolate;overflow:hidden;background:var(--charcoal);color:#fff;min-height:clamp(340px,42vw,470px);display:flex;align-items:flex-end}
.ph-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;z-index:-2}
.ph::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(16,18,22,.86) 0%,rgba(16,18,22,.62) 42%,rgba(16,18,22,.18) 78%,rgba(16,18,22,.05) 100%),linear-gradient(0deg,rgba(16,18,22,.55) 0%,rgba(16,18,22,0) 45%)}
.ph-in{width:100%;padding-top:clamp(4rem,9vw,6.5rem);padding-bottom:clamp(2.2rem,4.5vw,3.6rem)}
.ph .crumbs{font:500 .82rem var(--head);letter-spacing:.06em;color:rgba(255,255,255,.78);margin:0 0 1rem}.ph .crumbs a{color:rgba(255,255,255,.92);text-decoration-color:rgba(255,255,255,.4)}.ph .crumbs span{margin:0 .5rem;opacity:.6}
.ph h1{color:#fff;font-size:clamp(2.2rem,4.8vw,4rem);line-height:1.04;letter-spacing:-.028em;max-width:17ch;text-wrap:balance;margin:0}
.ph-lead{max-width:36rem;font-size:1.12rem;line-height:1.55;color:rgba(255,255,255,.9);margin:1rem 0 1.5rem}
.ph-actions{display:flex;flex-wrap:wrap;gap:12px}
.ph .btn-blue{background:#fff;color:var(--ink)}.ph .btn-blue:hover{background:var(--soft);color:var(--ink)}
.ph .btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.85)}.ph .btn-ghost:hover{background:#fff;color:var(--ink)}
.ph :focus-visible{outline-color:#fff}
@media(max-width:700px){.ph{min-height:420px}.ph::after{background:linear-gradient(0deg,rgba(16,18,22,.88) 0%,rgba(16,18,22,.6) 55%,rgba(16,18,22,.2) 100%)}.ph-actions .btn{flex:1 1 100%}.ph h1{font-size:clamp(2rem,9vw,2.7rem)}}

/* video hero */
.hx-vid{object-position:62% 50%}
@media(prefers-reduced-motion:reduce){.hx-vid{display:none}}
@media(max-width:700px){.hx-img{object-position:60% 50%}.hx-vid{object-position:60% 50%}}
/* social icons: brand colours at all times (footer + contact page) */
.social a,.ftr .social a{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff!important;border:0!important;transition:transform .2s,filter .2s}
.social a svg,.ftr .social a svg{width:21px;height:21px}
.social a[aria-label*="Facebook"]{background:#1877F2!important}
.social a[aria-label*="Instagram"]{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%)!important}
.social a:hover,.ftr .social a:hover{color:#fff!important;transform:translateY(-2px);filter:brightness(1.08)}
.social a[aria-label*="Facebook"]:hover{background:#1877F2!important}
.social a[aria-label*="Instagram"]:hover{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%)!important}

/* services: editorial list with a photo that follows the pointer (replaces the card grid) */
.svx{padding:clamp(4.5rem,9vw,8rem) 0}
.svx-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,104px);align-items:start}
.svx-left{position:sticky;top:104px}
.svx-intro{color:var(--muted);font-size:1.1rem;max-width:30rem;margin:1.2rem 0 2rem}
.svx-view{position:relative;margin:0;aspect-ratio:5/4;background:var(--soft);overflow:hidden;border-radius:2px}
.svx-view img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .45s ease}
.svx-view img.on{opacity:1}
.svx-help{margin:1.1rem 0 0;font-size:.98rem;color:var(--muted)}.svx-help a{color:var(--ink);text-underline-offset:3px}
.svx-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.svx-list a{display:grid;grid-template-columns:3.2rem 1fr 40px;gap:clamp(10px,2vw,24px);align-items:center;padding:clamp(1.2rem,2.2vw,1.75rem) 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit;transition:padding .25s ease}
.svx-list .n{font:500 .95rem var(--head);letter-spacing:.08em;color:var(--muted)}
.svx-list h3{font-size:clamp(1.55rem,2.6vw,2.1rem);margin:0 0 .25rem;letter-spacing:-.02em}
.svx-list p{margin:0;color:var(--muted);font-size:1rem;max-width:34rem}
.svx-list .go{justify-self:end;width:40px;height:40px;display:grid;place-items:center;color:var(--ink);transition:transform .25s ease}
.svx-list .go svg{width:20px;height:20px}
.svx-list a:hover,.svx-list a:focus-visible,.svx-list a.on{padding-left:.6rem}
.svx-list a:hover .go,.svx-list a.on .go{transform:translateX(4px)}
.svx-list a:hover h3,.svx-list a.on h3{color:var(--blue-d)}
.svx-list .th{display:none}
@media(max-width:1000px){
  .svx-grid{grid-template-columns:1fr}.svx-left{position:static}.svx-view,.svx-help{display:none}.svx-intro{margin-bottom:1.6rem}
  .svx-list a{grid-template-columns:96px 1fr 28px;grid-template-areas:"th t go"}.svx-list .n{display:none}
  .svx-list .th{display:block;grid-area:th;width:96px;height:72px;object-fit:cover;border-radius:2px}.svx-list .t{grid-area:t}.svx-list .go{grid-area:go;width:28px}
  .svx-list p{font-size:.95rem}.svx-list h3{font-size:1.4rem}.svx-list a:hover,.svx-list a.on{padding-left:0}
}
@media(prefers-reduced-motion:reduce){.svx-view img{transition:none}}

/* per-page hero photos (16:9 originals): keep the subject (lower right) in view on wide, short heroes and on phones */
.ph-img{object-position:68% 62%}
.ph-plain{min-height:260px;background:var(--charcoal)}.ph-plain::after{display:none}.ph-plain .ph-actions{display:none}
@media(max-width:700px){.ph-img{object-position:76% 60%}.ph-plain{min-height:240px}}

/* dark quote bands: a soft, dimmed photo behind (kept quiet so text and form stay clear) */
.fq,.cta{position:relative;isolation:isolate;background:var(--charcoal)}
.fq::before,.cta::before{content:"";position:absolute;inset:0;z-index:-2;background:url(/assets/img/cta-bg.webp) center/cover no-repeat;opacity:.5}
.fq::after,.cta::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(23,25,29,.94) 0%,rgba(23,25,29,.78) 45%,rgba(23,25,29,.6) 100%)}
.fq .panel{box-shadow:0 24px 60px rgba(0,0,0,.35)}
.cta .wrap{position:relative}
.qcard,.side-card{box-shadow:0 14px 40px rgba(22,24,28,.08)}
.cta .btn-blue{background:#fff;color:var(--ink)}.cta .btn-blue:hover{background:var(--soft);color:var(--ink)}

/* about page */
.ab{padding:clamp(4rem,8vw,7rem) 0}.ab-alt{background:var(--soft)}
.ab-intro{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,6vw,100px);align-items:start}
.ab-intro h2,.ab-split h2{font-size:clamp(2.1rem,3.8vw,3.2rem);letter-spacing:-.022em;text-wrap:balance}
.ab-text .lead{font-size:1.3rem;line-height:1.5;color:var(--ink);margin:0 0 1.2rem}.ab-text p{color:var(--muted);font-size:1.08rem;margin:0 0 1rem}
.ab-split{display:grid;grid-template-columns:5fr 6fr;gap:clamp(28px,6vw,100px);align-items:center}
.ab-photo{margin:0;border-radius:2px;overflow:hidden;background:var(--soft)}.ab-photo img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.ab-list{list-style:none;margin:1.8rem 0 1.6rem;padding:0;border-top:1px solid var(--ink)}
.ab-list li{display:grid;grid-template-columns:3rem 1fr;gap:.6rem;padding:1.15rem 0;border-bottom:1px solid #cbc6bd}
.ab-list .n{font:500 .95rem var(--head);letter-spacing:.08em;color:var(--muted);padding-top:.35rem}
.ab-list h3{font-size:1.6rem;margin:0 0 .3rem;letter-spacing:-.02em}.ab-list p{margin:0;color:var(--muted)}
.ab-note{color:var(--text);font-size:1.08rem;margin:0 0 1.6rem;max-width:34rem}
.ab-actions{display:flex;flex-wrap:wrap;gap:12px}
.ab-badge{padding:2.2rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}
.ab-badge .wrap{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}.ab-badge img{height:56px;width:auto;border-radius:3px}.ab-badge p{margin:0;color:var(--muted)}
@media(max-width:900px){.ab-intro,.ab-split{grid-template-columns:1fr}.ab-photo{max-width:520px}.ab-actions .btn{flex:1 1 100%}}
