/* Service template — Redline Dial.  Loads after site.css + components.css.
   One component per content SHAPE (lists, factor cards, price cards, steps, cards, FAQ), so
   consecutive sections have genuinely different silhouettes; grounds are planned in PHP. */

/* ===================== HERO ===================== */
.sv-hero{position:relative;padding:clamp(28px,5vh,56px) 0 clamp(64px,9vh,104px);overflow-x:clip}
.sv-hero-in{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(32px,4.5vw,72px);align-items:start}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:22px;font:600 10.5px/1 var(--f-mono);font-stretch:112%;letter-spacing:.04em;color:var(--ink-mute)}
.crumbs a{color:var(--ink-soft);text-decoration:none}
.crumbs a:hover{color:var(--red)}
.crumbs span[aria-current]{color:var(--ink)}
.sv-h1{font-family:var(--f-disp);font-size:clamp(34px,3.9vw,52px);line-height:1.02;letter-spacing:-.04em;margin:0 0 24px;text-wrap:balance}
.sv-h1 .m{font-weight:580}
.sv-h1 .x{font-weight:300;color:var(--red)}
.sv-hero-intro{font-size:clamp(16px,1.25vw,17.5px);line-height:1.68;color:var(--ink-soft);max-width:58ch;margin-bottom:16px}
.sv-hero-intro:last-of-type{margin-bottom:26px}
.sv-hero .cluster{margin-bottom:24px}
.sv-tells.odd .tell:last-child{grid-column:1 / -1}
.sv-tells .tell::before,.sv-tells .tell::after{content:none!important}
.sv-tells .tell{box-shadow:inset 0 -1px 0 rgba(242,242,238,.08)}
.sv-tells .tell:nth-child(odd):not(:last-child){box-shadow:inset 0 -1px 0 rgba(242,242,238,.08),inset -1px 0 0 rgba(242,242,238,.08)}
.sv-tells .tell-lamp{width:30px;height:30px}
.sv-tells .tell-lamp svg{width:15px;height:15px;stroke-width:2.2}
.sv-tells .tell{padding:13px 16px;font-size:14px}
.sv-call{display:flex;align-items:center;gap:14px;margin:0 0 22px}
.sv-call p{font-size:16px;line-height:1.5;color:var(--ink-soft);margin:0}
.sv-tel{font-family:var(--f-disp);font-weight:560;font-stretch:112%;letter-spacing:-.015em;font-variant-numeric:tabular-nums;color:var(--ink);text-decoration:none;box-shadow:inset 0 -2px 0 var(--red);white-space:nowrap}
.js .sv-hero-copy>*{opacity:0;animation:fadeUp .9s var(--ease) forwards}
.js .sv-hero-copy>:nth-child(2){animation-delay:.08s}.js .sv-hero-copy>:nth-child(3){animation-delay:.16s}
.js .sv-hero-copy>:nth-child(4){animation-delay:.24s}.js .sv-hero-copy>:nth-child(n+5){animation-delay:.32s}
.sv-hero-vis{position:relative}
.sv-photo{position:relative;margin:0;border-radius:8px;overflow:hidden;aspect-ratio:4/4.3;background:var(--paper-2);box-shadow:0 40px 70px -45px rgba(0,0,0,.45)}
.sv-photo img{width:100%;height:100%;object-fit:cover}
.sv-photo::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);background:linear-gradient(200deg,transparent 55%,rgba(20,21,23,.3))}
.js .sv-photo img{animation:settle 1.6s var(--ease) both}
@keyframes settle{from{transform:scale(1.06)}to{transform:none}}
.svc-read{position:absolute;left:14px;right:14px;bottom:14px;display:flex;flex-direction:column;gap:8px;padding:14px 16px 15px;border-radius:5px;background:rgba(20,21,23,.95);color:var(--on-dark);z-index:2}
.sv-read{left:auto;right:18px;bottom:-24px;width:min(300px,78%);box-shadow:0 24px 40px -20px rgba(0,0,0,.5)}
.svc-read-top{display:flex;justify-content:space-between;align-items:center}
.svc-read .mono{color:var(--on-dark-soft);font-size:10px}
.svc-read-c{font:400 12px/1 var(--f-disp);font-stretch:125%;font-variant-numeric:tabular-nums;color:var(--on-dark-soft);letter-spacing:.02em}
.svc-read-c b{font-weight:600;color:var(--red-hot)}
.svc-read-n{font:540 20px/1.15 var(--f-disp);letter-spacing:-.022em}
.svc-segs{display:grid;grid-template-columns:repeat(11,1fr);gap:3px;margin-top:2px}
.svc-segs i{height:4px;border-radius:1px;background:#3a3d42}
.svc-segs i.on{background:var(--red-hot)}

/* ===================== SECTIONS + GROUNDS ===================== */
.sv-sec{padding:var(--sec-pad) 0;position:relative}
.sv-paper{background:var(--paper)}
.sv-tint{background:var(--paper-2)}
.sv-dark{background:radial-gradient(900px 420px at 80% 30%,rgba(255,90,76,.06),transparent 70%),repeating-linear-gradient(-45deg,rgba(242,242,238,.022) 0 1px,transparent 1px 10px),var(--carbon)}
.split-head.solo{grid-template-columns:minmax(0,1fr)}
.split-head.solo .h2{max-width:24ch}
.sv-body>*+*{margin-top:clamp(28px,4vh,44px)}
.sv-il{color:inherit;text-decoration-color:var(--red);text-underline-offset:3px}
.inv .sv-il{text-decoration-color:var(--red-hot)}
.inv .sv-tel{color:var(--on-dark);box-shadow:inset 0 -2px 0 var(--red-hot)}
.sv-fig{font-family:var(--f-disp);font-weight:520;font-stretch:112%;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--ink);white-space:nowrap}
.inv .sv-fig{color:var(--on-dark)}

/* prose */
.sv-prose{max-width:74ch}
.sv-prose p{color:var(--ink-soft);font-size:16px;line-height:1.72}
.sv-prose p+p{margin-top:14px}
.sv-prose-cols{max-width:none;columns:2;column-gap:clamp(32px,4vw,64px)}
.sv-prose-cols p{break-inside:avoid}
.inv .sv-prose p{color:var(--on-dark-soft)}
.sv-figline{font:300 clamp(22px,2.2vw,30px)/1.35 var(--f-disp);letter-spacing:-.025em;color:var(--ink);max-width:40ch}
.sv-figline .sv-fig{font-weight:560;color:var(--red)}
.inv .sv-figline{color:var(--on-dark)}
.inv .sv-figline .sv-fig{color:var(--red-hot)}
.split-head .lede .sv-fig{color:var(--red)}
.inv .split-head .lede .sv-fig{color:var(--red-hot)}

.sv-subhead{font:580 clamp(18px,1.5vw,21px)/1.2 var(--f-disp);letter-spacing:-.022em;color:var(--ink);padding-top:clamp(20px,3vh,32px);border-top:1px solid var(--line);max-width:74ch}
.sv-subhead+.sv-prose{margin-top:10px!important}
.inv .sv-subhead{color:var(--on-dark);border-color:var(--line-dark)}
.sv-duo{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,5vw,80px);align-items:start}
.sv-duo-l .h2{margin-top:18px}
.sv-duo-r .lede{margin-bottom:18px;color:var(--ink)}
.inv .sv-duo-r .lede{color:var(--on-dark)}
.sv-duo-r .sv-prose{max-width:none}

/* checklist */
.sv-list-intro{font:600 11.5px/1.35 var(--f-mono);font-stretch:112%;letter-spacing:.05em;color:var(--ink-mute);margin-bottom:14px}
.inv .sv-list-intro{color:var(--on-dark-soft)}
.sv-tint .sv-list-intro{color:var(--ink-soft)}   /* ink-mute on tint is 4.27:1 — below AA for 11px */
.sv-checks{display:grid;gap:10px}
.sv-checks.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sv-checks.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sv-checks li{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--white);border:1px solid var(--line);border-radius:6px;font-weight:520;font-size:15px;line-height:1.35;letter-spacing:-.008em}
.sv-tint .sv-checks li{background:var(--white)}
.sv-ck{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(196,0,0,.08)}
.sv-ck svg{width:14px;height:14px;fill:none;stroke:var(--red);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.inv .sv-checks li{background:var(--carbon-2);border-color:var(--line-dark);color:var(--on-dark)}
.inv .sv-ck{background:rgba(255,90,76,.12)}
.inv .sv-ck svg{stroke:var(--red-hot)}

/* places */
.sv-places{display:flex;flex-wrap:wrap;gap:8px}
.sv-places a,.sv-places span{display:inline-flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid var(--line);border-radius:100px;background:var(--white);font-weight:520;font-size:14.5px;text-decoration:none;color:var(--ink)}
.sv-places i{width:6px;height:6px;border-radius:50%;background:var(--ink);opacity:.3}
.sv-places a i{background:var(--red);opacity:1}
@media(hover:hover){.sv-places a:hover{border-color:var(--red);color:var(--red)}}
.inv .sv-places a,.inv .sv-places span{background:var(--carbon-2);border-color:var(--line-dark);color:var(--on-dark)}

/* factor cards (Term: explanation) */
.sv-defs{display:grid;gap:14px;counter-reset:d}
.sv-defs.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sv-defs.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sv-def{position:relative;padding:22px 22px 24px;background:var(--white);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.sv-def::before{content:"";position:absolute;left:0;top:0;height:3px;width:44px;background:var(--red)}
.sv-def-n{display:block;font:400 12px/1 var(--f-disp);font-stretch:125%;font-variant-numeric:tabular-nums;color:var(--ink-mute);margin-bottom:14px;letter-spacing:.04em}
.sv-def p{font-size:15px;line-height:1.6;color:var(--ink-soft)}
.sv-def-t{display:block;font:580 clamp(18px,1.45vw,20px)/1.2 var(--f-disp);letter-spacing:-.02em;color:var(--ink);margin-bottom:8px}
.inv .sv-def{background:var(--carbon-2);border-color:var(--line-dark)}
.inv .sv-def::before{background:var(--red-hot)}
.inv .sv-def-n{color:var(--on-dark-soft)}
.inv .sv-def p{color:var(--on-dark-soft)}
.inv .sv-def-t{color:var(--on-dark)}
/* "why us" factors read as a proof list: horizontal records, not cards */
.sv-defs-why{grid-template-columns:1fr!important;gap:0;border-top:1px solid var(--line)}
.sv-defs-why .sv-def{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:baseline;padding:22px 0;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0}
.sv-defs-why .sv-def::before{content:none}
.sv-defs-why .sv-def-n{font-size:26px;color:var(--red);margin:0;letter-spacing:-.02em}
.sv-defs-why .sv-def p{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:8px clamp(20px,3vw,48px);align-items:baseline}
.sv-defs-why .sv-def-t{margin:0}
.inv .sv-defs-why{border-color:var(--line-dark)}
.inv .sv-defs-why .sv-def{border-color:var(--line-dark);background:transparent}
.inv .sv-defs-why .sv-def-n{color:var(--red-hot)}

/* price cards */
.sv-prices{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.sv-price{position:relative;display:flex;flex-direction:column;padding:24px 22px;border-radius:8px;background:var(--white);border:1px solid var(--line);overflow:hidden}
.sv-price::after{content:"";position:absolute;left:22px;right:22px;top:0;height:3px;background:linear-gradient(90deg,var(--red),transparent)}
.sv-price-l{font:600 11.5px/1.4 var(--f-mono);font-stretch:112%;letter-spacing:.04em;color:var(--ink-mute)}
.sv-price-v{font:420 clamp(26px,2.4vw,34px)/1.05 var(--f-disp);font-stretch:125%;font-variant-numeric:tabular-nums;letter-spacing:-.035em;color:var(--ink);margin:14px 0 12px}
.sv-price-b{font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin-top:auto}
.inv .sv-price{background:linear-gradient(180deg,#1d1f23,#17181b);border-color:rgba(242,242,238,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.inv .sv-price::after{background:linear-gradient(90deg,var(--red-hot),transparent)}
.inv .sv-price-l{color:var(--on-dark-soft)}
.inv .sv-price-v{color:var(--on-dark)}
.inv .sv-price-b{color:var(--on-dark-soft)}

/* process steps (reuse the approved booking gears) */
.sv-steps{gap:clamp(18px,2.4vw,36px)}
.sv-steps.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sv-steps.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
.sv-steps.n5,.sv-steps.n6{grid-template-columns:repeat(5,minmax(0,1fr))}
.sv-steps.drawn::after{animation:svLine calc(var(--n) * .8s + .1s) linear .15s both}
@keyframes svLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.sv-steps .gear h3,.sv-steps .gear .sv-step-t{font-size:clamp(17px,1.4vw,20px)}
.sv-steps .gear .sv-step-t{font-family:var(--f-disp);font-weight:580;line-height:1.18;letter-spacing:-.025em;margin-bottom:12px;color:inherit}
.sv-steps .gear p{font-size:15px}
.sv-sec:not(.sv-dark) .sv-steps::before{background:var(--line)}
.sv-sec:not(.sv-dark) .gr-track{stroke:var(--line)}
.sv-sec:not(.sv-dark) .gear p{color:var(--ink-soft)}
.sv-sec:not(.sv-dark) .gear-n{background:var(--paper)}
.sv-sec:not(.sv-dark) .gear-n b{color:var(--ink)}
.sv-tint .gear-n{background:var(--paper-2)!important}

/* H3 cards */
.sv-cards{display:grid;gap:14px}
.sv-cards.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sv-cards.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sv-card{padding:26px 24px;background:var(--white);border:1px solid var(--line);border-radius:6px}
.sv-card h3{font:580 clamp(18px,1.5vw,21px)/1.2 var(--f-disp);letter-spacing:-.022em;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--line-soft)}
.sv-card p{font-size:15px;line-height:1.62;color:var(--ink-soft)}
.sv-card p+p,.sv-card p+ul,.sv-card ul+p{margin-top:10px}
.sv-mini-def strong{color:var(--ink);font-weight:580}
.inv .sv-card{background:var(--carbon-2);border-color:var(--line-dark)}
.inv .sv-card h3{color:var(--on-dark);border-color:var(--line-dark)}
.inv .sv-card p{color:var(--on-dark-soft)}
.inv .sv-mini-def strong{color:var(--on-dark)}

/* table */
.sv-table-wrap{overflow-x:auto;border-radius:8px;border:1px solid var(--line)}
.sv-table{width:100%;border-collapse:collapse;min-width:560px;font-size:15px}
.sv-table th,.sv-table td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line)}
.sv-table thead th{font:600 11px/1.35 var(--f-mono);font-stretch:112%;letter-spacing:.04em;color:var(--ink-soft);background:var(--paper-2)}
.sv-table tbody th{font-weight:560}
.sv-table tbody tr:last-child>*{border-bottom:0}
.sv-table td:last-child{font-family:var(--f-disp);font-stretch:112%;font-variant-numeric:tabular-nums;white-space:nowrap}
.inv .sv-table-wrap{border-color:var(--line-dark)}
.inv .sv-table th,.inv .sv-table td{border-color:var(--line-dark);color:var(--on-dark)}
.inv .sv-table thead th{background:var(--carbon-2);color:var(--on-dark-soft)}
.inv .sv-table td{color:var(--on-dark-soft)}

/* FAQ (homepage layout) */
.faq-in{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(32px,5vw,90px);align-items:start}
.faq-side{position:sticky;top:calc(var(--bar-h) + 32px)}
.faq-side .h2{margin:18px 0 22px}
.faq-side .lede{margin-bottom:24px}
.faq-call{display:inline-flex;flex-direction:column;gap:6px;text-decoration:none;padding:16px 20px;border:1px solid var(--line);border-radius:6px;background:var(--white);font:420 24px/1 var(--f-disp);font-stretch:125%;font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--ink)}
.faq-call .mono{color:var(--ink-mute);font-size:10px}
@media(hover:hover){.faq-call:hover{border-color:var(--red);color:var(--red)}}
.faq-list{border-top:2px solid var(--ink)}

/* close */
.sv-close{padding:var(--sec-pad) 0;background:radial-gradient(800px 400px at 15% 20%,rgba(255,90,76,.08),transparent 70%),var(--carbon)}
.sv-close-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,90px);align-items:center}
.sv-close .h2{margin-top:18px}
.sv-close-body>*+*{margin-top:22px}
.sv-close-body .sv-prose p{color:var(--on-dark-soft);font-size:17px}
.sv-close-hours{color:var(--on-dark-soft)}
.sv-close .sv-call p{color:var(--on-dark-soft)}
.sv-close .sv-call{margin:0}

/* ===================== RESPONSIVE ===================== */
@media(max-width:1100px){
  .sv-steps.n5,.sv-steps.n6{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sv-steps.n5::before,.sv-steps.n5::after,.sv-steps.n6::before,.sv-steps.n6::after{display:none}
}
@media(max-width:980px){
  .sv-hero-in{grid-template-columns:1fr}
  .sv-hero-vis{max-width:640px}
  .sv-photo{aspect-ratio:4/3}
  .sv-read{right:12px;bottom:-26px}
  .split-head,.sv-duo{grid-template-columns:1fr;align-items:start;gap:18px}
  .sv-checks.c3,.sv-defs.c3,.sv-cards.c3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sv-defs-why .sv-def p{grid-template-columns:1fr}
  .faq-in{grid-template-columns:1fr}
  .faq-side{position:static}
  .sv-steps,.sv-steps.n2,.sv-steps.n4,.sv-steps.n5,.sv-steps.n6{grid-template-columns:1fr;gap:30px}
  .sv-steps::before,.sv-steps::after{display:block!important;left:31px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .sv-steps::after{transform-origin:top;transform:scaleY(0)}
  .sv-steps.drawn::after{animation:svLineY calc(var(--n) * .8s + .1s) linear .15s both}
  .sv-steps .gear{padding-left:92px;min-height:64px}
  .sv-steps .gear-n{position:absolute;left:0;top:0}
  .sv-close-in{grid-template-columns:1fr}
}
@keyframes svLineY{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media(max-width:640px){
  .sv-checks.c2,.sv-checks.c3,.sv-defs.c2,.sv-defs.c3,.sv-cards.c2,.sv-cards.c3,.sv-prices{grid-template-columns:1fr}
  .sv-tells{grid-template-columns:1fr!important}
  .sv-tells .tell{box-shadow:inset 0 -1px 0 rgba(242,242,238,.08)!important}
  .sv-prose-cols{columns:1}
  .sv-defs-why .sv-def{grid-template-columns:48px minmax(0,1fr)}
  .sv-defs-why .sv-def-n{font-size:20px}
}
@media(prefers-reduced-motion:reduce){.js .sv-hero-copy>*{opacity:1!important;animation:none!important}}