/* ==========================================================================
   Contractor template — design tokens and components.
   Values are lifted from the Claude Design handoff (desktop + mobile files).
   One responsive build: ≥640px follows the desktop file, <640px follows the
   mobile file (authored at 402px).
   ========================================================================== */

@font-face {
  font-family: 'Google Sans Flex';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/google-sans-flex-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Google Sans Flex';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 100%;
  font-display: swap;
  src: url(/fonts/google-sans-flex-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --brand: #C2410C;
  --brand-soft: color-mix(in oklch, var(--brand) 55%, white);
  --band: #F1F3F4; --band-fg: #141414; --band-muted: #5F6368; --band-line: rgba(0,0,0,.1); --band-accent: var(--brand);
  --ink: #141414;
  --muted: #5F6368;
  --faint: #80868B;
  --fainter: #9AA0A6;
  --line: rgba(0,0,0,.1);
  --ph: #E8EAED;
  --ph2: #E4E6E9;
  --star: #F5B400;
  --font: 'Google Sans Flex', 'Google Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --gutter: clamp(20px, 5vw, 72px);
  --sec: clamp(96px, 10vw, 160px);
  --ease: cubic-bezier(.2,.7,.2,1);
  --brand-grad: linear-gradient(170deg, color-mix(in oklch, var(--brand) 86%, white), var(--brand) 46%, color-mix(in oklch, var(--brand) 93%, black));
  --brand-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.18), inset 1px 0 0 rgba(255,255,255,.22), inset -1px 0 0 rgba(255,255,255,.22), inset 0 10px 18px -12px rgba(255,255,255,.55), inset 0 -10px 16px -12px rgba(0,0,0,.28), 0 1px 2px rgba(0,0,0,.18), 0 8px 20px -10px color-mix(in oklch, var(--brand) 70%, transparent), 0 24px 48px -20px color-mix(in oklch, var(--brand) 55%, transparent);
  --soft-grad: linear-gradient(170deg, #FAFBFB, #F1F3F4 45%, #EAECEE);
  --soft-shadow: inset 0 1px 0 rgba(255,255,255,.9), inset 0 -1px 0 rgba(0,0,0,.05), inset 0 8px 14px -10px rgba(255,255,255,.9), 0 1px 2px rgba(0,0,0,.05), 0 6px 14px -8px rgba(0,0,0,.12);
  --frost-grad: linear-gradient(170deg, rgba(255,255,255,.88), rgba(255,255,255,.58) 44%, rgba(255,255,255,.72));
  --frost-shadow: inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(0,0,0,.035), 0 1px 2px rgba(0,0,0,.05), 0 8px 20px -10px rgba(0,0,0,.18);
  --dark-card: linear-gradient(168deg, #1F2123, #151617 46%, #0E0F10);
}
@media (max-width: 639px) {
  :root { --gutter: 18px; --sec: 54px; }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
body {
  margin: 0;
  font-family: var(--font);
  color: var(--ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { cursor: pointer; font: inherit; }
input, select, button, textarea { font-family: var(--font); }
input:focus, select:focus, textarea:focus { outline: none; box-shadow: 0 0 0 3px color-mix(in oklch, var(--brand) 45%, transparent); border-color: var(--brand) !important; }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
h1, h2, h3 { font-feature-settings: 'liga', 'kern'; text-rendering: optimizeLegibility; margin: 0; font-weight: 500; }
p { margin: 0; }
::placeholder { color: rgba(20,20,20,.45); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (min-width: 640px) { .m-only { display: none !important; } }
@media (max-width: 639px) { .d-only { display: none !important; } }

/* page surface: white with the fine dot grid */
.page {
  position: relative;
  background: #fff radial-gradient(rgba(20,20,20,.085) 1px, transparent 1.2px) 0 0 / 28px 28px;
}
@media (max-width: 639px) {
  .page { background-size: 26px 26px; background-image: radial-gradient(rgba(20,20,20,.075) 1px, transparent 1.2px); }
}

.wrap { max-width: 1200px; margin: 0 auto; }
.sec { padding: var(--sec) var(--gutter) 0; }
@media (max-width: 639px) { .sec.tight-m { padding-left: 14px; padding-right: 14px; } }

/* ---------- type ---------- */
.eyebrow { font: 500 clamp(18px,1.6vw,22px)/1 var(--font); letter-spacing: -.015em; color: var(--brand); }
.h1-page { margin-top: 16px; font: 500 clamp(40px,5.4vw,72px)/1 var(--font); letter-spacing: -.04em; text-wrap: balance; }
.h2 { margin-top: 16px; font: 500 clamp(30px,3.6vw,48px)/1.06 var(--font); letter-spacing: -.03em; text-wrap: balance; }
.lead { font: 400 clamp(16px,1.3vw,19px)/1.55 var(--font); color: var(--muted); text-wrap: pretty; max-width: 46ch; }
.intro { margin-top: 20px; max-width: 52ch; font: 400 17px/1.55 var(--font); color: var(--muted); }
@media (max-width: 639px) {
  .eyebrow { font-size: 16px; }
  .h1-page { margin-top: 12px; font-size: 38px; line-height: 1.03; letter-spacing: -.042em; }
  .h2 { margin-top: 12px; font-size: 31px; line-height: 1.08; letter-spacing: -.037em; }
  .h2.in-band, .h2.sm-m { font-size: 29px; line-height: 1.1; }
  .lead { margin-top: 14px; font-size: 15.5px; }
  .intro { margin-top: 12px; font-size: 15.5px; }
}

/* ---------- reveals (fail-visible: content is visible until JS opts in) ---------- */
.js [data-rise] { opacity: 0; transform: translateY(18px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.js [data-rise].in { opacity: 1; transform: none; }
@media (max-width: 639px) { .js [data-rise] { transform: translateY(18px); transition-duration: .55s; } }
[data-reveal] { display: inline-flex; align-items: baseline; white-space: nowrap; overflow: hidden; line-height: 1.3 !important; padding-bottom: 2px; }
.js [data-reveal].split > span { display: inline-block; white-space: pre; opacity: 0; max-width: 0; }
.js [data-reveal].split.in > span { animation: unfold .28s cubic-bezier(.3,.8,.3,1) both; }
@keyframes unfold { from { opacity: 0; max-width: 0; transform: translateX(-6px); filter: blur(4px); } to { opacity: 1; max-width: 1.2em; transform: none; filter: none; } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes cardIn { from { opacity: 0; transform: translateY(28px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes wordUp { from { transform: translateY(105%); } to { transform: none; } }
@keyframes statusHalo { 0% { box-shadow: 0 0 0 0 rgba(52,199,89,.55), 0 0 6px rgba(52,199,89,.9); } 70% { box-shadow: 0 0 0 7px rgba(52,199,89,0), 0 0 8px rgba(52,199,89,.9); } 100% { box-shadow: 0 0 0 0 rgba(52,199,89,0), 0 0 6px rgba(52,199,89,.9); } }
@keyframes menuIn { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
/* word reveal on the hero H1: text is painted immediately (LCP), only the
   words slide — they never start invisible */
.js [data-words].split > span { display: inline-block; overflow: hidden; vertical-align: bottom; padding: 0 .06em .08em 0; margin-right: -.06em; }
.js [data-words].split > span > span { display: inline-block; animation: wordUp .85s cubic-bezier(.2,.8,.2,1) both; }
@media (prefers-reduced-motion: reduce) {
  .js [data-rise] { opacity: 1; transform: none; transition: none; }
  .js [data-reveal].split > span { opacity: 1; max-width: none; animation: none !important; }
  .js [data-words].split > span > span { animation: none !important; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* ---------- buttons ---------- */
.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; height: 50px; padding: 0 24px; border-radius: 999px; font: 500 15px/1 var(--font); white-space: nowrap; border: 0; transition: transform .18s var(--ease), filter .18s, background .18s, box-shadow .18s; }
.btn:active { transform: scale(.985); }
.btn-brand { background: var(--brand-grad); color: #fff; box-shadow: var(--brand-shadow); }
.btn-brand:hover { filter: brightness(1.07) saturate(1.04); transform: translateY(-1px); }
.btn-soft { height: 46px; padding: 0 22px; font-size: 14px; color: var(--ink); background: var(--soft-grad); box-shadow: var(--soft-shadow); }
.btn-soft:hover { background: linear-gradient(170deg,#FFFFFF,#EDEFF1 45%,#E4E6E8); transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 2px 4px rgba(0,0,0,.06), 0 12px 24px -10px rgba(0,0,0,.18); }
.btn-dark { background: linear-gradient(170deg,#3A3D40,#1A1C1E 46%,#0D0E0F); color: #fff; }
.btn-block { display: flex; width: 100%; }
@media (max-width: 639px) {
  .btn { height: 54px; font-size: 16px; }
  .btn-frost-m { display: flex; width: 100%; height: 50px; font-size: 15px; color: var(--ink); background: var(--frost-grad); -webkit-backdrop-filter: blur(18px) saturate(180%) brightness(1.04); backdrop-filter: blur(18px) saturate(180%) brightness(1.04); border: .5px solid rgba(255,255,255,.85); box-shadow: var(--frost-shadow); }
  .btn-frost-m:active { transform: scale(.99); }
}

/* ---------- placeholders (labelled boxes until the client's photo arrives) ---------- */
.ph { position: relative; overflow: hidden; background: var(--ph); border-radius: 20px; }
.ph > .ph-label { position: absolute; left: 16px; top: 14px; font: 500 11px/1 var(--font); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.ph > .ph-center { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); padding: 0 18px; text-align: center; font: 500 11.5px/1.5 var(--font); letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.ph > img { width: 100%; height: 100%; object-fit: cover; }
.r-4-3 { aspect-ratio: 4/3; }
.r-16-10 { aspect-ratio: 16/10; }
.r-4-5 { aspect-ratio: 4/5; }
.r-21-9 { aspect-ratio: 21/9; min-height: 220px; }

.stars { color: var(--star); letter-spacing: 2px; font-size: 13px; }
.gmark { flex-shrink: 0; display: inline-block; vertical-align: -3px; }

/* ==========================================================================
   HEADER
   ========================================================================== */
.hdr { position: fixed; top: 0; left: 0; right: 0; z-index: 60; padding: 24px clamp(12px,3vw,32px) 12px; pointer-events: none; }
.hdr-pill {
  pointer-events: auto; max-width: 1200px; margin: 0 auto; height: 60px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 8px 0 18px;
  border-radius: 999px; color: #fff; border: .5px solid var(--g-line);
  --lg-tint: var(--g-fill);
  --lg-inset: inset 0 1px 0 rgba(255,255,255,.72), inset 0 -1px 0 rgba(255,238,226,.26), inset 1px 0 0 rgba(226,238,255,.20), inset -1px 0 0 rgba(255,241,232,.20), inset 0 12px 26px -16px rgba(255,255,255,.55), inset 0 -16px 28px -20px rgba(0,0,0,.30);
  --lg-outer: 0 0 0 .5px rgba(0,0,0,.18), 0 1px 2px rgba(0,0,0,.14), 0 10px 22px -10px rgba(0,0,0,.26), 0 30px 60px -24px rgba(0,0,0,.42);
  --lg-sheen: radial-gradient(130% 90% at 16% -14%, rgba(255,255,255,.5), rgba(255,255,255,.1) 46%, transparent 66%), radial-gradient(120% 70% at 88% 112%, rgba(255,255,255,.2), transparent 62%);
  --lg-frost: blur(22px) saturate(200%) contrast(1.06) brightness(1.04);
  transition: border-color .35s;
}
:root { --g-fill: linear-gradient(170deg,rgba(255,255,255,.22),rgba(255,255,255,.10) 42%,rgba(255,255,255,.14)); --g-line: rgba(255,255,255,.26); --sel-fill: linear-gradient(170deg,rgba(255,255,255,.34),rgba(255,255,255,.16) 44%,rgba(255,255,255,.24)); --sel-line: rgba(255,255,255,.42); }
html.nav-light-bg { --g-fill: linear-gradient(170deg,rgba(22,22,24,.74),rgba(22,22,24,.58) 42%,rgba(22,22,24,.66)); --g-line: rgba(255,255,255,.18); --sel-fill: linear-gradient(170deg,rgba(255,255,255,.20),rgba(255,255,255,.08) 44%,rgba(255,255,255,.14)); --sel-line: rgba(255,255,255,.28); }
.lg-on .hdr-pill .lg-tint, .hdr-pill.lg-native { transition: background .35s, border-color .35s; }
.hdr-progress { position: absolute; left: 20px; right: 20px; bottom: 4px; height: 1.5px; border-radius: 999px; overflow: hidden; pointer-events: none; opacity: .5; }
.hdr-progress > i { display: block; height: 100%; width: 100%; border-radius: 999px; background: currentColor; transform: scaleX(0); transform-origin: left center; }
.brand-link { position: relative; display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand-mark { width: 28px; height: 28px; border-radius: 8px; background: var(--brand); display: flex; align-items: center; justify-content: center; font: 500 13px/1 var(--font); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.35); flex-shrink: 0; }
.brand-name { font: 500 15px/1 var(--font); letter-spacing: -.02em; white-space: nowrap; }
.hdr-nav { position: relative; display: flex; align-items: center; font: 500 14px/1 var(--font); white-space: nowrap; }
.hdr-nav a { position: relative; padding: 9px 13px; border-radius: 999px; transition: background .15s; }
.hdr-nav a:hover { background: rgba(255,255,255,.12); }
.hdr-nav a[aria-current="page"]::before {
  content: ''; position: absolute; inset: 0; border-radius: 999px; pointer-events: none;
  background: var(--sel-fill); border: .5px solid var(--sel-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), inset 0 -1px 0 rgba(255,238,226,.3), inset 1px 0 0 rgba(226,238,255,.24), inset -1px 0 0 rgba(255,241,232,.24), inset 0 8px 16px -10px rgba(255,255,255,.6), inset 0 -8px 14px -10px rgba(0,0,0,.22), 0 1px 2px rgba(0,0,0,.14), 0 6px 16px -8px rgba(0,0,0,.3);
}
.hdr-nav a > span { position: relative; }
.hdr-right { position: relative; display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.hdr-phone { padding: 10px 14px; border-radius: 999px; font: 500 14px/1 var(--font); white-space: nowrap; }
.hdr-phone:hover { background: rgba(255,255,255,.16); }
.hdr-cta { height: 42px; padding: 0 20px; font-size: 14px; }
.hdr-narrow { display: none; position: relative; align-items: center; gap: 6px; }
.hdr-call { height: 42px; padding: 0 14px; border-radius: 999px; display: flex; align-items: center; font: 500 13px/1 var(--font); border: 1px solid rgba(255,255,255,.3); }
.hdr-menu-btn { height: 42px; padding: 0 16px; background: var(--brand); color: #fff; border: 0; border-radius: 999px; font: 500 13px/1 var(--font); box-shadow: inset 0 1px 0 rgba(255,255,255,.35); }
@media (max-width: 1079px) { .hdr-phone { display: none; } }
@media (max-width: 859px) {
  .hdr-nav, .hdr-right { display: none; }
  .hdr-narrow { display: flex; }
}
.hdr-drop {
  pointer-events: auto; position: relative; max-width: 1200px; margin: 10px auto 0; padding: 12px; border-radius: 28px;
  display: none; flex-direction: column; color: #fff; border: .5px solid rgba(255,255,255,.2);
  animation: menuIn .3s cubic-bezier(.2,.8,.2,1) both;
  --lg-tint: linear-gradient(170deg,rgba(22,22,24,.78),rgba(22,22,24,.68));
  --lg-inset: inset 0 1px 0 rgba(255,255,255,.42), inset 0 -1px 0 rgba(255,238,226,.14), inset 1px 0 0 rgba(226,238,255,.14), inset -1px 0 0 rgba(255,241,232,.14), inset 0 14px 30px -18px rgba(255,255,255,.3);
  --lg-outer: 0 0 0 .5px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.3), 0 30px 70px -24px rgba(0,0,0,.6);
  --lg-sheen: radial-gradient(130% 90% at 16% -14%, rgba(255,255,255,.26), rgba(255,255,255,.08) 46%, transparent 66%), radial-gradient(120% 70% at 88% 112%, rgba(255,255,255,.10), transparent 62%);
  --lg-frost: blur(26px) saturate(180%) contrast(1.04);
}
html.menu-open .hdr-drop { display: flex; }
@media (min-width: 860px), (max-width: 639px) { html.menu-open .hdr-drop { display: none; } }
.hdr-drop a.row { position: relative; padding: 15px 12px; border-radius: 14px; font: 500 19px/1 var(--font); letter-spacing: -.02em; }
.hdr-drop a.row:hover { background: rgba(255,255,255,.12); }
.hdr-drop .btn { margin-top: 10px; height: 52px; }

/* mobile header: sticky glass pill, content scrolls underneath */
.hdr-m {
  display: none;
  pointer-events: auto; position: relative; height: 56px; align-items: center; gap: 8px; padding: 0 6px 0 12px; border-radius: 999px; color: var(--ink);
  border: .5px solid rgba(255,255,255,.7);
  --lg-tint: linear-gradient(170deg,rgba(255,255,255,.46),rgba(255,255,255,.18) 42%,rgba(255,255,255,.3));
  --lg-inset: inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(255,238,226,.5), inset 1px 0 0 rgba(226,238,255,.42), inset -1px 0 0 rgba(255,241,232,.42), inset 0 12px 26px -16px rgba(255,255,255,.85), inset 0 -16px 28px -20px rgba(0,0,0,.14);
  --lg-outer: 0 0 0 .5px rgba(0,0,0,.14), 0 1px 2px rgba(0,0,0,.08), 0 10px 22px -10px rgba(0,0,0,.16), 0 28px 56px -24px rgba(0,0,0,.24);
  --lg-sheen: radial-gradient(130% 90% at 16% -14%, rgba(255,255,255,.95), rgba(255,255,255,.26) 46%, transparent 66%), radial-gradient(120% 70% at 88% 112%, rgba(255,255,255,.45), transparent 62%), linear-gradient(118deg, rgba(255,255,255,.62) 0%, rgba(255,255,255,.12) 24%, transparent 44%, transparent 62%, rgba(255,255,255,.32) 100%);
  --lg-frost: blur(26px) saturate(200%) contrast(1.06) brightness(1.06);
}
@media (max-width: 639px) {
  .hdr { position: sticky; padding: 10px 10px 8px; margin-bottom: -74px; z-index: 70; }
  .hdr-pill, .hdr-drop { display: none !important; }
  .hdr-m { display: flex; }
}
.hdr-m .hdr-progress { left: 22px; right: 22px; bottom: 5px; opacity: .6; }
.hdr-m .hdr-progress > i { background: var(--brand); }
.hdr-m .brand-link { gap: 8px; min-width: 0; flex: 1; }
.hdr-m .brand-mark { width: 26px; height: 26px; font-size: 12.5px; }
.hdr-m .brand-name { font-size: 13.5px; letter-spacing: -.032em; }
.hdr-m-right { position: relative; display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.circ {
  position: relative; width: 44px; height: 44px; flex-shrink: 0; border-radius: 999px; display: flex; align-items: center; justify-content: center; color: var(--ink);
  background: linear-gradient(170deg,rgba(255,255,255,.52),rgba(255,255,255,.24) 44%,rgba(255,255,255,.36));
  border: .5px solid rgba(255,255,255,.8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.06);
  transition: transform .15s;
}
.circ:active { transform: scale(.94); }
.est-pill { position: relative; height: 44px; padding: 0 11px; border-radius: 999px; display: flex; align-items: center; justify-content: center; background: var(--brand-grad); color: #fff; font: 500 13.5px/1 var(--font); white-space: nowrap; box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.18), 0 6px 14px -8px color-mix(in oklch, var(--brand) 70%, transparent); }
.burger { flex-direction: column; gap: 4px; border: .5px solid rgba(255,255,255,.8); }
.burger i { display: block; width: 15px; height: 1.8px; border-radius: 2px; background: var(--ink); }

/* full-screen menu (mobile) */
.mmenu { position: fixed; inset: 0; z-index: 95; display: none; justify-content: center; background: rgba(10,10,11,.5); }
html.menu-open .mmenu { display: flex; }
@media (min-width: 640px) { html.menu-open .mmenu { display: none; } }
.mmenu-panel {
  width: 100%; max-width: 402px; height: 100%; display: flex; flex-direction: column; color: #fff; border-radius: 0;
  animation: menuIn .3s cubic-bezier(.2,.8,.2,1) both; overflow-y: auto;
  --lg-tint: linear-gradient(172deg,rgba(26,28,30,.7),rgba(16,17,18,.76) 52%,rgba(11,12,13,.82));
  --lg-inset: inset 0 1px 0 rgba(255,255,255,.2);
  --lg-outer: 0 0 0 0 transparent;
  --lg-sheen: radial-gradient(120% 60% at 10% -10%, rgba(255,255,255,.12), transparent 60%);
  --lg-frost: blur(30px) saturate(190%) brightness(.92);
}
.mmenu-head { flex-shrink: 0; height: 60px; display: flex; align-items: center; justify-content: space-between; padding: 0 10px 0 12px; border-bottom: 1px solid rgba(255,255,255,.1); }
.mmenu-head .brand-mark { width: 27px; height: 27px; }
.mmenu-head .brand-name { font-size: 14.5px; letter-spacing: -.028em; }
.x-btn { width: 44px; height: 44px; border: .5px solid rgba(255,255,255,.26); border-radius: 999px; background: linear-gradient(170deg,rgba(255,255,255,.26),rgba(255,255,255,.1) 44%,rgba(255,255,255,.16)); color: #fff; display: flex; align-items: center; justify-content: center; font: 400 16px/1 var(--font); }
.mmenu nav { display: flex; flex-direction: column; padding: 12px 16px 0; }
.mmenu nav a { display: flex; align-items: center; justify-content: space-between; min-height: 58px; padding: 6px 2px; border-bottom: 1px solid rgba(255,255,255,.09); font: 500 26px/1.1 var(--font); letter-spacing: -.03em; }
.mmenu nav a:last-child { border-bottom: 0; }
.mmenu nav a small { font-size: 14px; color: rgba(255,255,255,.35); }
.mmenu nav a small.rt { font: 500 13px/1 var(--font); color: var(--star); }
.mmenu-actions { display: grid; gap: 10px; padding: 20px 16px 10px; }
.mmenu-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.glass-dark-btn { display: flex; align-items: center; justify-content: center; height: 50px; border-radius: 999px; border: .5px solid rgba(255,255,255,.3); background: linear-gradient(170deg,rgba(255,255,255,.26),rgba(255,255,255,.1) 44%,rgba(255,255,255,.16)); color: #fff; font: 500 15px/1 var(--font); box-shadow: inset 0 1px 0 rgba(255,255,255,.5); }
.mmenu-foot { margin-top: auto; padding: 22px 16px 30px; border-top: 1px solid rgba(255,255,255,.09); font: 400 13px/1.7 var(--font); color: rgba(255,255,255,.55); }
.mmenu-foot strong { display: block; font: 500 17px/1 var(--font); color: #fff; letter-spacing: -.02em; }
.mmenu-foot div + div { margin-top: 8px; }

/* ==========================================================================
   HOME — hero
   ========================================================================== */
.hero { position: relative; min-height: 100svh; display: flex; align-items: center; color: #fff; padding: clamp(110px,13vw,150px) var(--gutter) clamp(150px,16vw,220px); overflow: hidden; isolation: isolate; }
.hero-bg { position: absolute; inset: 0; z-index: -2; background: linear-gradient(170deg,#4A4F55,#33383D 46%,#23272B); }
.hero-bg > img { width: 100%; height: 100%; object-fit: cover; }
.hero-scrim { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,.28) 45%,rgba(0,0,0,.66) 100%), linear-gradient(90deg,rgba(0,0,0,.35),transparent 60%); }
.hero-grid { max-width: 1200px; width: 100%; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,320px),1fr)); gap: clamp(40px,6vw,96px); align-items: center; }
.hero-copy { animation: fadeUp .9s .1s cubic-bezier(.2,.8,.2,1) both; }
.glass-light {
  border: .5px solid rgba(255,255,255,.26);
  --lg-tint: linear-gradient(170deg,rgba(255,255,255,.16),rgba(255,255,255,.05) 42%,rgba(255,255,255,.10));
  --lg-inset: inset 0 1px 0 rgba(255,255,255,.72), inset 0 -1px 0 rgba(255,238,226,.26), inset 1px 0 0 rgba(226,238,255,.20), inset -1px 0 0 rgba(255,241,232,.20), inset 0 12px 26px -16px rgba(255,255,255,.55), inset 0 -16px 28px -20px rgba(0,0,0,.30);
  --lg-outer: 0 0 0 .5px rgba(0,0,0,.2), 0 1px 2px rgba(0,0,0,.14), 0 10px 22px -10px rgba(0,0,0,.26), 0 30px 60px -24px rgba(0,0,0,.42);
  --lg-sheen: linear-gradient(120deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.08) 28%,transparent 46%,transparent 62%,rgba(255,255,255,.14) 100%);
  --lg-frost: blur(22px) saturate(200%) contrast(1.06) brightness(1.04);
}
.hero-badge { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; font: 500 13px/1 var(--font); white-space: nowrap; }
.hero-badge strong { font-weight: 600; }
.hero-badge .stars { font-size: 13px; letter-spacing: 1px; }
.hero-h1 { margin: 24px 0 0; max-width: 14ch; font: 500 clamp(42px,6vw,84px)/1 var(--font); letter-spacing: -.04em; text-wrap: balance; }
.hero-line { max-width: 46ch; margin: 24px 0 0; font: 400 clamp(16px,1.3vw,19px)/1.5 var(--font); color: rgba(255,255,255,.8); text-wrap: pretty; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 10px; margin: 32px 0 0; }
.hero-call { color: #fff; }
.hero-call:hover { transform: translateY(-1px); }
.hero-trust { margin-top: 20px; font: 400 14px/1.5 var(--font); color: rgba(255,255,255,.6); }
.photo-tag { display: inline-flex; align-items: center; margin-top: 16px; padding: 8px 13px; border: 1px dashed rgba(255,255,255,.5); border-radius: 999px; font: 500 10.5px/1 var(--font); letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; color: rgba(255,255,255,.82); }
.quote-wrap { justify-self: end; width: 100%; max-width: 400px; animation: cardIn 1.1s .45s cubic-bezier(.2,.8,.2,1) both; }
.quote-card {
  border-radius: 26px; padding: clamp(20px,2vw,26px); border: .5px solid rgba(255,255,255,.22);
  --lg-tint: linear-gradient(168deg,rgba(20,20,22,.58),rgba(16,16,18,.44) 45%,rgba(20,20,22,.52));
  --lg-inset: inset 0 1px 0 rgba(255,255,255,.50), inset 0 -1px 0 rgba(255,238,226,.16), inset 1px 0 0 rgba(226,238,255,.16), inset -1px 0 0 rgba(255,241,232,.16), inset 0 16px 34px -20px rgba(255,255,255,.34), inset 0 -20px 34px -24px rgba(0,0,0,.5);
  --lg-outer: 0 0 0 .5px rgba(0,0,0,.25), 0 1px 2px rgba(0,0,0,.3), 0 14px 30px -14px rgba(0,0,0,.4), 0 40px 80px -28px rgba(0,0,0,.6);
  --lg-sheen: radial-gradient(130% 90% at 16% -14%,rgba(255,255,255,.34),rgba(255,255,255,.07) 46%,transparent 66%), radial-gradient(120% 70% at 88% 112%,rgba(255,255,255,.12),transparent 62%);
  --lg-frost: blur(26px) saturate(190%) contrast(1.05) brightness(.94);
}
.qc-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.qc-title { font: 500 25px/1.15 var(--font); letter-spacing: -.025em; }
.fast { display: flex; align-items: center; gap: 7px; font: 500 15px/1 var(--font); color: #fff; white-space: nowrap; }
.dot-live { width: 9px; height: 9px; flex-shrink: 0; border-radius: 999px; background: linear-gradient(170deg,#6EE7A0,#34C759 55%,#17A94A); animation: statusHalo 2.2s ease-out infinite; }
.qc-intro { margin: 8px 0 0; font: 400 13.5px/1.45 var(--font); color: rgba(255,255,255,.88); }
.qc-fields { display: grid; gap: 8px; margin-top: 16px; }
.in-light { width: 100%; height: 48px; padding: 0 16px; background: rgba(255,255,255,.92); border: 1px solid rgba(255,255,255,.7); border-radius: 14px; font: 400 16px/1 var(--font); color: var(--ink); box-shadow: inset 0 1px 2px rgba(0,0,0,.06); }
textarea.in-light { min-height: 72px; padding: 13px 16px; line-height: 1.45; resize: none; }
.in-light:focus { background: #fff; box-shadow: 0 0 0 3px rgba(255,255,255,.4); }
.qc-fields .btn { margin-top: 4px; width: 100%; }
.qc-foot { margin: 18px 0 0; text-align: center; font: 400 11.5px/1.45 var(--font); color: rgba(255,255,255,.78); }

/* mobile hero */
.hero-stats {
  position: absolute; left: 14px; right: 14px; bottom: 16px; z-index: 2; display: none; grid-template-columns: repeat(4, 1fr);
  border-radius: 20px; padding: 14px 2px; color: #fff; border: .5px solid rgba(255,255,255,.3);
  animation: fadeUp .9s .3s cubic-bezier(.2,.8,.2,1) both;
  --lg-tint: linear-gradient(170deg,rgba(255,255,255,.16),rgba(255,255,255,.04) 44%,rgba(255,255,255,.10));
  --lg-inset: inset 0 1px 0 rgba(255,255,255,.62), inset 0 -1px 0 rgba(255,238,226,.2), inset 1px 0 0 rgba(226,238,255,.18), inset -1px 0 0 rgba(255,241,232,.18), inset 0 12px 24px -16px rgba(255,255,255,.55), inset 0 -14px 24px -18px rgba(0,0,0,.3);
  --lg-outer: 0 0 0 .5px rgba(0,0,0,.22), 0 1px 2px rgba(0,0,0,.18), 0 12px 28px -14px rgba(0,0,0,.42);
  --lg-sheen: radial-gradient(120% 90% at 14% -18%,rgba(255,255,255,.7),rgba(255,255,255,.16) 44%,transparent 66%), linear-gradient(112deg,rgba(255,255,255,.4) 0%,rgba(255,255,255,.08) 20%,transparent 38%,transparent 62%,rgba(255,255,255,.26) 100%);
  --lg-frost: blur(22px) saturate(190%) brightness(.95);
}
.hs { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 0 5px; }
.hs + .hs { border-left: 1px solid rgba(255,255,255,.22); }
.hs b { display: flex; align-items: center; gap: 4px; font: 500 18px/1 var(--font); letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.hs b small { font-size: 13px; }
.hs span { font: 400 10px/1.2 var(--font); color: rgba(255,255,255,.84); text-align: center; white-space: nowrap; }
@media (max-width: 639px) {
  .hero { flex-direction: column; justify-content: center; align-items: stretch; min-height: 100svh; max-height: 874px; padding: 92px 18px 124px; }
  .hero-scrim { background: linear-gradient(180deg,rgba(0,0,0,.44) 0%,rgba(0,0,0,.26) 36%,rgba(0,0,0,.8) 100%); }
  .hero-grid { display: block; }
  .hero-badge { gap: 7px; padding: 8px 12px; font-size: 12px; }
  .hero-h1 { margin-top: 16px; max-width: none; font-size: 35px; line-height: 1.05; }
  .hero-line { margin-top: 13px; max-width: 32ch; font-size: 15px; color: rgba(255,255,255,.86); }
  .hero-ctas { margin-top: 20px; }
  .hero-ctas .btn-brand { width: 100%; }
  .hero-trust { margin-top: 13px; font-size: 12.5px; line-height: 1.55; color: rgba(255,255,255,.66); }
  .photo-tag { font-size: 10px; }
  .hero-stats { display: grid; }
  .quote-wrap { display: none; }
}

/* ==========================================================================
   HOME — owner story + stats card
   ========================================================================== */
.story { position: relative; z-index: 2; padding: 0 var(--gutter); }
.story-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,320px),1fr)); gap: clamp(32px,5vw,80px); align-items: end; }
.story-photo { margin-top: clamp(-170px,-11vw,-110px); max-width: 520px; }
.portrait { border-radius: 28px; background: var(--ph2); box-shadow: 0 30px 60px -30px rgba(0,0,0,.35); }
.badge-brand { position: absolute; left: 18px; bottom: 18px; padding: 10px 14px; border-radius: 999px; background: var(--brand); color: #fff; font: 500 13px/1 var(--font); box-shadow: inset 0 1px 0 rgba(255,255,255,.3); }
.story-copy { padding: clamp(32px,4vw,56px) 0 0; }
.pull { margin: 18px 0 0; max-width: 30ch; font: 500 clamp(24px,2.4vw,34px)/1.25 var(--font); letter-spacing: -.03em; text-wrap: balance; }
.owner-row { display: flex; align-items: center; gap: 14px; margin-top: 26px; }
.headshot { width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%; background: var(--ph2); border: 1px dashed rgba(0,0,0,.28); overflow: hidden; }
.headshot img { width: 100%; height: 100%; object-fit: cover; }
.owner-name { font: 500 15px/1.2 var(--font); }
.owner-title { margin-top: 4px; font: 400 13.5px/1.2 var(--font); color: var(--muted); }
.story-copy .btn-soft { margin-top: 28px; }
.stats-card {
  max-width: 1200px; margin: clamp(48px,5vw,72px) auto 0; background: var(--brand-grad); color: #fff; border-radius: 24px;
  padding: clamp(24px,2.6vw,34px) clamp(16px,2vw,28px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,150px),1fr)); gap: 28px 0; align-items: start;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -1px 0 rgba(0,0,0,.16), inset 0 14px 26px -16px rgba(255,255,255,.4), 0 1px 2px rgba(0,0,0,.14), 0 24px 60px -28px color-mix(in oklch, var(--brand) 60%, transparent);
}
.sc { padding: 0 clamp(12px,1.6vw,24px); text-align: center; transition: transform .3s var(--ease); }
.sc:hover { transform: translateY(-3px); }
.sc + .sc { border-left: 1px solid rgba(255,255,255,.28); }
.sc-num { font: 500 clamp(34px,3.4vw,46px)/1 var(--font); letter-spacing: -.04em; font-variant-numeric: tabular-nums; display: flex; align-items: center; justify-content: center; gap: 9px; }
.sc-num small { font: 500 24px/1 var(--font); letter-spacing: -.02em; color: var(--ink); }
.sc-label { margin: 10px auto 0; max-width: 22ch; font: 400 13.5px/1.4 var(--font); color: rgba(255,255,255,.85); }
@media (max-width: 639px) {
  .story { padding: var(--sec) 18px 0; }
  .story-grid { display: block; }
  .story-photo { margin-top: 18px; max-width: none; }
  .portrait { border-radius: 24px; box-shadow: none; }
  .badge-brand { left: 15px; bottom: 15px; padding: 9px 13px; font-size: 12.5px; }
  .story-copy { padding: 0; }
  .pull { margin-top: 22px; max-width: none; font-size: 23px; line-height: 1.28; letter-spacing: -.032em; text-wrap: pretty; }
  .owner-row { gap: 12px; margin-top: 20px; }
  .headshot { width: 42px; height: 42px; }
  .owner-name { font-size: 14.5px; }
  .owner-title { font-size: 13px; }
  .story-copy .btn-soft { margin-top: 20px; }
  .stats-card { display: none; }
  .story .eyebrow-m { display: block; }
}
.eyebrow-m { display: none; }

/* ==========================================================================
   Services
   ========================================================================== */
.svc-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,280px),1fr)); gap: clamp(24px,3vw,40px); margin-top: clamp(40px,4vw,64px); }
.svc-card { display: flex; flex-direction: column; color: var(--ink); transition: opacity .7s var(--ease), transform .7s var(--ease), color .2s; }
.svc-card:hover { transform: translateY(-6px); color: var(--brand); }
.svc-card .ph { transition: filter .5s; }
.svc-card:hover .ph { filter: brightness(.96); }
.svc-idx { display: flex; align-items: center; justify-content: space-between; margin-top: 22px; font: 500 13px/1 var(--font); color: var(--faint); }
.svc-card h3 { margin: 12px 0 0; font: 500 22px/1.15 var(--font); letter-spacing: -.025em; }
.svc-card p { margin: 8px 0 0; font: 400 15px/1.5 var(--font); color: var(--muted); }
.svc-rows { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,320px),1fr)); gap: 0 clamp(32px,5vw,80px); margin-top: clamp(56px,6vw,88px); }
.svc-rows.tight { margin-top: clamp(32px,3vw,44px); }
.svc-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 0; border-top: 1px solid var(--line); color: var(--ink); transition: color .18s, padding-left .25s var(--ease); }
.svc-row:hover { color: var(--brand); padding-left: 10px; }
.svc-row b { font: 500 16px/1.3 var(--font); letter-spacing: -.01em; }
.svc-row span { font: 400 14px/1.3 var(--font); color: var(--faint); text-align: right; }
@media (max-width: 639px) {
  .svc-cards { gap: 26px; margin-top: 26px; }
  .svc-card .ph { border-radius: 18px; aspect-ratio: 16/10; }
  .svc-card .ph-label { left: 13px; top: 12px; }
  .svc-idx { margin-top: 14px; font-size: 12px; }
  .svc-card h3 { margin-top: 9px; font-size: 21px; line-height: 1.14; letter-spacing: -.028em; }
  .svc-card p { margin-top: 7px; font-size: 14.5px; }
  .svc-rows, .svc-rows.tight { display: block; margin-top: 20px; border-bottom: 1px solid var(--line); }
  .svc-row { flex-direction: column; align-items: flex-start; justify-content: center; gap: 5px; min-height: 64px; padding: 15px 0; }
  .svc-row b { font-size: 15.5px; }
  .svc-row span { font-size: 13px; line-height: 1.4; text-align: left; }
  .home-svc-rows { display: none !important; }
}
.see-all-m { margin-top: 26px; }

/* ==========================================================================
   Work
   ========================================================================== */
.work-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 20px; }
.work-head > div { max-width: 720px; }
.work-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,240px),1fr)); gap: clamp(16px,2vw,24px); margin-top: clamp(40px,4vw,56px); }
.work-grid.big { grid-template-columns: repeat(auto-fit, minmax(min(100%,300px),1fr)); gap: clamp(20px,3vw,40px) clamp(16px,2vw,24px); margin-top: 0; }
.work-card { display: block; color: var(--ink); transition: opacity .7s var(--ease), transform .7s var(--ease), color .2s; }
.work-card:hover { transform: translateY(-6px); color: var(--brand); }
.work-card .pic { position: relative; }
.tag { position: absolute; right: 12px; top: 12px; padding: 7px 11px; border-radius: 999px; background: #fff; color: var(--ink); font: 500 12px/1 var(--font); }
.work-card h3, .work-card .t { margin-top: 14px; font: 500 16px/1.3 var(--font); letter-spacing: -.015em; }
.work-card .m { margin-top: 4px; font: 400 13.5px/1.4 var(--font); color: var(--muted); }
.work-rows { display: grid; gap: 14px; margin-top: 22px; }
.work-row { display: flex; align-items: center; gap: 14px; color: var(--ink); }
.work-row .thumb { flex: 0 0 128px; aspect-ratio: 4/3; border-radius: 14px; background: var(--ph); overflow: hidden; }
.work-row .cat { font: 500 10.5px/1 var(--font); letter-spacing: .07em; text-transform: uppercase; color: var(--brand); }
.work-row .t { margin-top: 8px; font: 500 15px/1.3 var(--font); letter-spacing: -.018em; text-wrap: pretty; }
.work-row .m { margin-top: 4px; font: 400 12.5px/1.45 var(--font); color: var(--muted); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { height: 40px; padding: 0 16px; border-radius: 999px; border: 0; font: 500 14px/1 var(--font); white-space: nowrap; color: var(--ink); background: var(--soft-grad); box-shadow: var(--soft-shadow); transition: background .15s, color .15s; }
.chip[aria-pressed="true"] { background: linear-gradient(170deg,#2A2C2E,#141414 46%,#0D0E0F); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 8px 18px -10px rgba(0,0,0,.5); }
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap: clamp(20px,3vw,40px); }
.stat { padding: 24px 0 0; border-top: 1px solid var(--line); }
.stat .n { display: flex; align-items: baseline; gap: 3px; font-variant-numeric: tabular-nums; }
.stat .n b { font: 500 40px/1 var(--font); letter-spacing: -.04em; }
.stat .n small { font: 500 22px/1 var(--font); color: var(--brand); }
.stat .l { margin-top: 10px; font: 400 14px/1.45 var(--font); color: var(--muted); }
.stat .l span { display: inline-flex; align-items: center; gap: 5px; }
@media (max-width: 639px) {
  .work-grid.big { grid-template-columns: 1fr; gap: 26px; }
  .work-grid.big .ph { border-radius: 18px; }
  .work-grid.big .tag { right: 10px; top: 10px; font-size: 11.5px; background: linear-gradient(170deg,rgba(255,255,255,.9),rgba(255,255,255,.64) 44%,rgba(255,255,255,.78)); -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%); border: .5px solid rgba(255,255,255,.85); }
  .work-grid.big .t { margin-top: 12px; font-size: 15.5px; letter-spacing: -.018em; }
  .work-grid.big .m { font-size: 13px; line-height: 1.45; }
  .chips { gap: 8px; margin-top: 20px; }
  .chip { height: 42px; padding: 0 15px; font-size: 13.5px; background: linear-gradient(170deg,rgba(255,255,255,.9),rgba(255,255,255,.62) 44%,rgba(255,255,255,.76)); -webkit-backdrop-filter: blur(16px) saturate(180%) brightness(1.04); backdrop-filter: blur(16px) saturate(180%) brightness(1.04); border: .5px solid rgba(255,255,255,.85); box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 1px 2px rgba(0,0,0,.05), 0 6px 14px -8px rgba(0,0,0,.16); }
  .stat-row { grid-template-columns: 1fr 1fr; gap: 22px 18px; }
  .stat { padding-top: 18px; }
  .stat .n b { font-size: 30px; }
  .stat .n small { font-size: 18px; }
  .stat .l { margin-top: 8px; font-size: 13px; }
}

/* ==========================================================================
   Band (process, send-a-photo)
   ========================================================================== */
.band { max-width: 1200px; margin: 0 auto; background: var(--band); color: var(--band-fg); border-radius: 32px; padding: clamp(40px,5vw,72px) clamp(24px,4vw,64px); }
.band .eyebrow { color: var(--band-accent); }
.steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,220px),1fr)); gap: clamp(24px,3vw,40px); margin-top: clamp(40px,4vw,56px); }
.step { padding-top: 22px; border-top: 1px solid var(--band-line); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.step:hover { transform: translateY(-4px); }
.step .k { font: 500 14px/1 var(--font); color: var(--band-accent); }
.step h3 { margin: 36px 0 0; font: 500 21px/1.15 var(--font); letter-spacing: -.025em; }
.step p { margin: 10px 0 0; font: 400 15px/1.55 var(--font); color: var(--band-muted); }
.band-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: clamp(40px,4vw,56px); padding-top: 28px; border-top: 1px solid var(--band-line); }
.band-foot p { max-width: 56ch; font: 400 16px/1.5 var(--font); color: var(--band-fg); }
.band-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,300px),1fr)); gap: clamp(24px,4vw,64px); align-items: center; }
.band-split p { max-width: 46ch; font: 400 16px/1.55 var(--font); color: var(--band-muted); }
@media (max-width: 639px) {
  .band { border-radius: 24px; padding: 28px 18px; }
  .steps { gap: 20px; margin-top: 24px; }
  .step { padding-top: 16px; }
  .step .k { font-size: 12.5px; }
  .step h3 { margin-top: 12px; font-size: 18.5px; line-height: 1.2; }
  .step p { margin-top: 7px; font-size: 14.5px; }
  .band-foot { display: block; margin-top: 24px; padding-top: 18px; }
  .band-foot p { font-size: 14.5px; line-height: 1.55; }
  .band-foot .btn { display: none; }
  .band-split { display: block; }
  .band-split p { margin-top: 14px; font-size: 15px; }
  .band-split .btn { margin-top: 18px; width: 100%; height: 52px; font-size: 15.5px; }
}

/* ==========================================================================
   Reviews
   ========================================================================== */
.rev-sum { display: inline-flex; align-items: center; gap: 12px; padding: 10px 18px 10px 14px; border-radius: 999px; background: var(--soft-grad); box-shadow: var(--soft-shadow); color: var(--ink); font: 500 14px/1 var(--font); white-space: nowrap; }
.rev-sum:hover { background: #E4E6E8; }
.rev-sum b { font: 500 22px/1 var(--font); letter-spacing: -.03em; }
.rev-sum .stars { font-size: 13px; letter-spacing: 1px; }
.rev-sum span.c { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); }
.rev-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,280px),1fr)); gap: clamp(24px,3vw,40px); margin-top: clamp(40px,4vw,56px); }
.rev { margin: 0; padding-top: 24px; border-top: 1px solid var(--line); display: flex; flex-direction: column; }
.rev p { margin: 18px 0 0; font: 400 clamp(18px,1.5vw,22px)/1.4 var(--font); letter-spacing: -.015em; text-wrap: pretty; }
.rev footer { margin-top: auto; padding-top: 24px; font: 500 14px/1.4 var(--font); }
.rev footer span { display: inline-flex; align-items: center; gap: 5px; color: var(--faint); font-weight: 400; }
.frost-card { background: linear-gradient(170deg,rgba(255,255,255,.86),rgba(255,255,255,.56) 44%,rgba(255,255,255,.7)); -webkit-backdrop-filter: blur(22px) saturate(185%) brightness(1.04); backdrop-filter: blur(22px) saturate(185%) brightness(1.04); border: .5px solid rgba(255,255,255,.9); box-shadow: inset 0 1px 0 rgba(255,255,255,.95), inset 0 -1px 0 rgba(0,0,0,.03), 0 1px 2px rgba(0,0,0,.05), 0 10px 24px -12px rgba(0,0,0,.16); }
.rev-big { display: flex; align-items: center; gap: 14px; margin-top: 20px; padding: 18px; border-radius: 20px; }
.rev-big b { font: 500 42px/1 var(--font); letter-spacing: -.045em; }
.rev-big .c { display: flex; align-items: center; gap: 6px; margin-top: 6px; font: 400 12.5px/1.4 var(--font); color: var(--muted); }
@media (max-width: 639px) {
  .rev-grid { gap: 12px; margin-top: 22px; }
  .rev { padding: 20px; border-top: 0; border-radius: 20px; background: linear-gradient(170deg,rgba(255,255,255,.86),rgba(255,255,255,.56) 44%,rgba(255,255,255,.7)); -webkit-backdrop-filter: blur(22px) saturate(185%) brightness(1.04); backdrop-filter: blur(22px) saturate(185%) brightness(1.04); border: .5px solid rgba(255,255,255,.9); box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 1px 2px rgba(0,0,0,.05), 0 10px 24px -12px rgba(0,0,0,.16); }
  .rev .stars { font-size: 12px; }
  .rev p { margin-top: 12px; font-size: 16.5px; line-height: 1.45; }
  .rev footer { margin-top: 16px; padding-top: 0; font-size: 13px; }
  .rev-sum.m-btn { display: flex; justify-content: center; gap: 9px; height: 50px; margin-top: 20px; padding: 0; font-size: 14px; background: var(--frost-grad); -webkit-backdrop-filter: blur(18px) saturate(180%); backdrop-filter: blur(18px) saturate(180%); border: .5px solid rgba(255,255,255,.85); box-shadow: var(--frost-shadow); }
  .rev-sum.m-btn b { font-size: 19px; }
  .rev-sum.m-btn .stars { font-size: 11px; }
}

/* ==========================================================================
   FAQ (native <details>: works without JS, answers are in the HTML)
   ========================================================================== */
.faq-wrap { max-width: 760px; margin: 0 auto; }
.faq-list { margin-top: clamp(32px,3vw,44px); border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 0; cursor: pointer; font: 500 17px/1.35 var(--font); letter-spacing: -.015em; color: var(--ink); transition: color .18s; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--brand); }
.faq-sign { flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: #F1F3F4; display: flex; align-items: center; justify-content: center; font: 400 18px/1 var(--font); color: var(--ink); }
.faq-sign::before { content: '+'; }
.faq-item[open] .faq-sign::before { content: '–'; }
.faq-item .a { padding: 0 48px 22px 0; max-width: 62ch; font: 400 15.5px/1.6 var(--font); color: var(--muted); }
.faq-note { margin: 24px 0 0; font: 400 14.5px/1.5 var(--font); color: var(--muted); }
.faq-note a { color: var(--ink); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 639px) {
  .faq-list { margin-top: 22px; }
  .faq-item summary { min-height: 58px; gap: 14px; padding: 15px 0; font-size: 15.5px; line-height: 1.38; }
  .faq-sign { width: 30px; height: 30px; font-size: 17px; background: linear-gradient(170deg,rgba(255,255,255,.9),rgba(255,255,255,.6) 44%,rgba(255,255,255,.74)); -webkit-backdrop-filter: blur(14px) saturate(180%); backdrop-filter: blur(14px) saturate(180%); border: .5px solid rgba(255,255,255,.85); box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 1px 2px rgba(0,0,0,.06), 0 4px 10px -6px rgba(0,0,0,.18); }
  .faq-item .a { padding: 0 34px 16px 0; font-size: 14.5px; }
  .faq-note { display: none; }
}

/* ==========================================================================
   Service area
   ========================================================================== */
.areas-row { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding-top: 28px; border-top: 1px solid var(--line); }
.areas-row > p { max-width: 44ch; font: 400 16px/1.5 var(--font); color: var(--muted); }
.pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pill { padding: 11px 16px; border-radius: 999px; background: var(--soft-grad); box-shadow: var(--soft-shadow); color: var(--ink); font: 500 14px/1 var(--font); white-space: nowrap; transition: background .18s, color .18s, transform .18s; }
.pill:hover { background: var(--brand); color: #fff; transform: translateY(-1px); }
@media (min-width: 640px) { .pill.extra { display: none; } }
@media (max-width: 639px) {
  .areas-sec { padding-top: 50px; }
  .areas-row { display: block; padding-top: 0; border-top: 0; }
  .areas-row > p { margin-top: 12px; font-size: 15.5px; line-height: 1.55; }
  .pills { margin-top: 16px; }
  .pill { padding: 10px 14px; font-size: 13.5px; background: var(--frost-grad); -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%); border: .5px solid rgba(255,255,255,.85); box-shadow: var(--frost-shadow); }
}

/* ==========================================================================
   Closing CTA
   ========================================================================== */
.cta-card { max-width: 1200px; margin: 0 auto; background: #141414; color: #fff; border-radius: 32px; padding: clamp(40px,5vw,72px) clamp(24px,4vw,64px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,300px),1fr)); gap: clamp(32px,4vw,64px); align-items: center; }
.cta-eyebrow { font: 500 22px/1 var(--font); color: var(--brand-soft); }
.cta-card .h2 { color: #fff; }
.cta-line { margin: 20px 0 0; max-width: 46ch; font: 400 16px/1.55 var(--font); color: rgba(255,255,255,.7); }
.cta-proof { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 24px; font: 400 14px/1 var(--font); color: rgba(255,255,255,.8); }
.cta-status { display: none; }
.cta-form { width: 100%; max-width: 440px; justify-self: end; background: #fff; color: var(--ink); border-radius: 24px; padding: clamp(22px,2.2vw,30px); }
.cta-form-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cta-form-head b { font: 500 19px/1.15 var(--font); letter-spacing: -.02em; }
.cta-form-head span { padding: 7px 11px; border-radius: 999px; background: #F1F3F4; font: 500 12px/1 var(--font); color: var(--muted); white-space: nowrap; }
.cta-fields { display: grid; gap: 10px; margin-top: 18px; }
.in-grey { width: 100%; height: 52px; padding: 0 16px; background: #F1F3F4; border: 1px solid transparent; border-radius: 14px; font: 400 16px/1 var(--font); color: var(--ink); }
textarea.in-grey { min-height: 82px; padding: 14px 16px; line-height: 1.45; resize: none; }
.cta-fields .btn { height: 52px; }
.cta-fields .btn-soft { height: 48px; display: flex; }
.small-note { text-align: center; font: 400 12.5px/1.5 var(--font); color: var(--faint); }
@media (max-width: 639px) {
  .cta-sec { padding-left: 14px; padding-right: 14px; }
  .cta-card { display: block; border-radius: 26px; padding: 28px 18px 26px; background: var(--dark-card); }
  .cta-eyebrow { font-size: 16px; }
  .cta-card .h2 { font-size: 29px; line-height: 1.1; }
  .cta-line { display: none; }
  .cta-status { display: flex; align-items: center; gap: 7px; margin-top: 14px; font: 500 13px/1 var(--font); }
  .cta-status .dot-live { width: 8px; height: 8px; }
  .cta-proof { gap: 8px 14px; margin-top: 14px; font-size: 12.5px; color: rgba(255,255,255,.7); }
  .cta-form { max-width: none; margin-top: 20px; padding: 0; background: transparent; color: #fff; }
  .cta-form-head, .cta-form textarea, .cta-form .btn-soft { display: none !important; }
  .cta-fields { gap: 9px; margin-top: 0; }
  .in-grey { height: 54px; padding: 0 15px; background: rgba(255,255,255,.95); border: 1px solid rgba(255,255,255,.7); }
  .cta-fields .btn { height: 56px; font-size: 16px; }
  .cta-form .small-note { font-size: 11.5px; color: rgba(255,255,255,.62); }
}

/* ==========================================================================
   Footer
   ========================================================================== */
.foot { padding: clamp(72px,8vw,120px) var(--gutter) 0; }
.foot-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); gap: clamp(32px,4vw,56px); padding: 48px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.foot .brand-mark { width: 32px; height: 32px; border-radius: 9px; font-size: 14px; box-shadow: none; }
.foot .brand-name { font-size: 17px; }
.foot-addr { margin: 20px 0 0; font: 400 15px/1.6 var(--font); color: var(--muted); }
.foot-phone { display: inline-block; margin-top: 14px; font: 500 18px/1 var(--font); letter-spacing: -.02em; }
.foot-lic { margin: 14px 0 0; font: 500 12px/1.6 var(--font); color: var(--faint); }
.foot-col h2 { margin: 0 0 16px; font: 500 13px/1 var(--font); color: var(--faint); }
.foot-col div { display: flex; flex-direction: column; gap: 10px; font: 500 15px/1.3 var(--font); align-items: flex-start; }
.foot-col a:hover { color: var(--brand); }
.foot-legal { display: flex; flex-wrap: wrap; gap: 10px 28px; justify-content: space-between; padding: 22px 0 28px; font: 500 12px/1.6 var(--font); color: var(--faint); }
.foot-legal nav { display: flex; gap: 22px; }
@media (max-width: 639px) {
  .foot { padding: 50px 18px 0; }
  .foot-grid { grid-template-columns: 1fr 1fr; gap: 24px 18px; padding: 0; border: 0; }
  .foot-brand { grid-column: 1 / -1; padding: 26px 0; border-top: 1px solid var(--line); }
  .foot .brand-mark { width: 30px; height: 30px; }
  .foot .brand-name { font-size: 16.5px; letter-spacing: -.025em; }
  .foot-addr { margin-top: 16px; font-size: 14.5px; }
  .foot-phone { margin-top: 10px; font-size: 17.5px; letter-spacing: -.025em; }
  .foot-lic { margin-top: 12px; font-size: 11.5px; }
  .foot-col { padding: 24px 0 0; border-top: 1px solid var(--line); }
  .foot-col.areas-col { display: none; }
  .foot-col-wrap { border-top: 1px solid var(--line); }
  .foot-col h2 { margin-bottom: 12px; font-size: 12px; }
  .foot-col div { gap: 11px; font-size: 14px; }
  .foot-legal { display: block; padding: 0; margin-top: 24px; border-top: 1px solid var(--line); }
  .foot-legal nav { gap: 0 22px; padding-top: 6px; font-size: 13px; }
  .foot-legal nav a { display: inline-flex; align-items: center; min-height: 46px; padding: 0 2px; }
  .foot-legal .copy { display: block; padding: 16px 0 34px; font-size: 11px; line-height: 1.7; }
}

/* ==========================================================================
   Inner pages
   ========================================================================== */
.phead { padding: clamp(130px,15vw,180px) var(--gutter) 0; }
.phead-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,320px),1fr)); gap: clamp(24px,4vw,64px); align-items: end; }
@media (max-width: 639px) {
  .phead { padding: 104px 18px 0; }
  .phead-grid { display: block; }
}
.rows { border-bottom: 1px solid var(--line); }
.kv { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 24px; padding: 22px 0; border-top: 1px solid var(--line); }
.kv > div:first-child { font: 500 17px/1.3 var(--font); letter-spacing: -.015em; }
.kv > div:last-child { font: 400 15.5px/1.55 var(--font); color: var(--muted); }
.kv a { color: var(--ink); font-weight: 500; }
@media (max-width: 639px) {
  .kv { display: block; padding: 16px 0; }
  .kv > div:first-child { font-size: 16px; }
  .kv > div:last-child { margin-top: 6px; font-size: 14.5px; }
  .kv.label-m > div:first-child { font: 500 12.5px/1 var(--font); color: var(--faint); }
  .kv.label-m > div:last-child { margin-top: 8px; font-size: 15px; }
}
.split-2 { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,320px),1fr)); gap: clamp(40px,6vw,96px); align-items: start; }
.prose { font: 400 17px/1.6 var(--font); color: var(--muted); display: grid; gap: 18px; }
@media (max-width: 639px) {
  .split-2 { display: block; }
  .prose { margin-top: 16px; font-size: 15.5px; line-height: 1.62; gap: 14px; }
}
.lic-line { margin: 22px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font: 500 12.5px/1.6 var(--font); color: var(--faint); }

/* contact */
.contact-cards { display: grid; gap: 10px; margin-top: 20px; }
.act { display: flex; align-items: center; justify-content: space-between; min-height: 70px; padding: 0 20px; border-radius: 20px; }
.act.call { background: var(--brand-grad); color: #fff; box-shadow: var(--brand-shadow); }
.act.text { color: var(--ink); }
.act b { display: block; font: 500 16.5px/1 var(--font); }
.act small { display: block; margin-top: 4px; font: 400 12.5px/1.3 var(--font); color: rgba(255,255,255,.85); }
.act.text small { color: var(--muted); }
.form-band { background: var(--band); border-radius: 28px; padding: clamp(24px,2.6vw,36px); }
.form-band h2 { font: 500 21px/1.15 var(--font); letter-spacing: -.025em; }
.form-band p { margin: 8px 0 0; font: 400 14.5px/1.5 var(--font); color: var(--muted); }
.form-band .fields { display: grid; gap: 10px; margin-top: 20px; }
.form-band .two { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px,1fr)); gap: 10px; }
.in-white { width: 100%; height: 52px; padding: 0 16px; background: #fff; border: 1px solid var(--line); border-radius: 14px; font: 400 16px/1 var(--font); color: var(--ink); }
textarea.in-white { min-height: 110px; padding: 14px 16px; line-height: 1.5; resize: vertical; }
.form-band .btn { width: 100%; height: 52px; }

/* quote page (dark card) */
.qp-card { max-width: 560px; border-radius: 24px; padding: 22px 18px 24px; background: var(--dark-card); color: #fff; animation: cardIn .5s cubic-bezier(.2,.8,.2,1) both; }
@media (min-width: 640px) { .qp-card { padding: 32px; border-radius: 28px; } }
.qp-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.qp-head h2 { font: 500 19.5px/1.15 var(--font); letter-spacing: -.028em; }
.qp-head .fast { font-size: 12.5px; gap: 6px; }
.qp-head .dot-live { width: 8px; height: 8px; }
.qp-label { margin-top: 20px; font: 500 11.5px/1 var(--font); letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.5); }
.intent { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.intent button { height: 42px; padding: 0 15px; border-radius: 999px; white-space: nowrap; font: 500 13.5px/1 var(--font); color: #fff; background: linear-gradient(170deg,rgba(255,255,255,.24),rgba(255,255,255,.09) 44%,rgba(255,255,255,.14)); border: .5px solid rgba(255,255,255,.28); box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.12); transition: background .15s, color .15s; }
.intent button[aria-pressed="true"] { background: #fff; color: var(--ink); border-color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 6px 16px -8px rgba(0,0,0,.5); }
.in-dark { width: 100%; height: 54px; padding: 0 15px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); border-radius: 15px; font: 400 16px/1 var(--font); color: #fff; }
.in-dark::placeholder { color: rgba(255,255,255,.5); }
textarea.in-dark { min-height: 92px; padding: 14px 15px; line-height: 1.5; resize: none; }
.qp-fields { display: grid; gap: 10px; margin-top: 18px; }
.qp-fields .btn { height: 56px; font-size: 16px; }
.qp-note { text-align: center; font: 400 11.5px/1.5 var(--font); color: rgba(255,255,255,.55); }
.reassure { display: flex; align-items: center; gap: 12px; }
.reassure p { font: 400 13.5px/1.5 var(--font); color: var(--muted); }

/* service detail */
.crumbs { max-width: 1200px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 8px; font: 500 13px/1 var(--font); color: var(--faint); }
.crumbs a:hover { color: var(--brand); }
.crumbs [aria-current] { color: var(--ink); }
.sd-top { padding: 130px var(--gutter) 0; }
.sd-head { max-width: 1200px; margin: clamp(28px,3vw,44px) auto clamp(36px,4vw,48px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,320px),1fr)); gap: clamp(28px,4vw,64px); align-items: end; }
.sd-h1 { font: 500 clamp(36px,5vw,68px)/1.02 var(--font); letter-spacing: -.03em; text-wrap: balance; }
.sd-intro { max-width: 46ch; font: 400 clamp(16px,1.2vw,18px)/1.55 var(--font); color: var(--muted); }
.sd-ctas { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.sd-ctas .btn { height: 52px; padding: 0 26px; }
.sd-photo { max-width: 1200px; margin: 0 auto; }
.sd-photo .ph { border-radius: 28px; }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 16px; margin-top: 16px; }
.fact { padding: 22px 0 0; border-top: 1px solid var(--line); }
.fact b { display: block; font: 500 clamp(24px,2.2vw,32px)/1 var(--font); letter-spacing: -.04em; }
.fact span { display: block; margin-top: 8px; font: 500 13px/1.3 var(--font); color: var(--muted); }
.sd-body { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: minmax(0,2fr) minmax(300px,1fr); gap: clamp(32px,4vw,64px); align-items: start; }
.sd-label { font: 500 clamp(17px,1.5vw,21px)/1 var(--font); letter-spacing: -.015em; color: var(--brand); }
.sd-label + .sd-h2 { margin-top: 14px; }
.sd-h2 { margin-bottom: 30px; font: 500 clamp(26px,3vw,40px)/1.1 var(--font); letter-spacing: -.03em; text-wrap: balance; }
.sd-block + .sd-block { margin-top: clamp(48px,5vw,80px); }
.incl { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); gap: 12px; }
.incl > div { padding: 22px 0 0; border-top: 1px solid var(--line); }
.incl .ok { font: 500 13px/1 var(--font); color: var(--brand); }
.incl h3 { margin: 16px 0 0; font: 500 17px/1.1 var(--font); letter-spacing: -.03em; }
.incl p { margin: 8px 0 0; font: 400 14.5px/1.5 var(--font); color: var(--muted); }
.opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 16px; }
.opt { border-radius: 24px; padding: 30px 28px 24px; background: #F6F7F8; }
.opt.featured { background: #141414; color: #fff; }
.opt .bdg { display: inline-block; padding: 8px 12px; border-radius: 999px; background: #E8EAED; font: 500 11px/1 var(--font); letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.opt.featured .bdg { background: var(--brand); color: #fff; }
.opt h3 { margin: 22px 0 0; font: 500 32px/1.02 var(--font); letter-spacing: -.03em; }
.opt p { margin: 12px 0 22px; font: 400 15px/1.5 var(--font); color: var(--muted); }
.opt.featured p { color: rgba(255,255,255,.66); }
.opt .r { display: flex; justify-content: space-between; gap: 12px; padding: 14px 0; border-top: 1px solid rgba(20,20,20,.1); font: 500 14px/1 var(--font); }
.opt.featured .r { border-top-color: rgba(255,255,255,.12); }
.opt .r span:first-child { color: var(--faint); }
.opt.featured .r span:first-child { color: rgba(255,255,255,.6); }
.opt .r.price span:last-child { color: var(--brand); }
.opt.featured .r.price span:last-child { color: var(--brand-soft); }
.day { border-bottom: 1px solid var(--line); }
.day > div { display: grid; grid-template-columns: 72px 1fr; gap: 18px; padding: 22px 0; border-top: 1px solid var(--line); }
.day .tm { font: 500 16px/1.3 var(--font); color: var(--brand); }
.day h3 { font: 500 17px/1.1 var(--font); letter-spacing: -.03em; }
.day p { margin: 6px 0 0; font: 400 15px/1.5 var(--font); color: var(--muted); }
.sd-faq { margin-top: 20px; border-bottom: 1px solid var(--line); }
.sd-faq .faq-item { border-bottom: 0; border-top: 1px solid var(--line); }
.sd-faq .faq-sign { width: 32px; height: 32px; }
.sd-aside { position: sticky; top: 96px; min-width: 0; }
.aside-card { background: #141414; color: #fff; border-radius: 28px; padding: clamp(26px,2.4vw,34px); }
.aside-card h2 { font: 500 clamp(24px,2vw,30px)/1.1 var(--font); letter-spacing: -.03em; }
.aside-card > p { margin: 10px 0 24px; font: 400 14.5px/1.5 var(--font); color: rgba(255,255,255,.62); }
.in-ghost { width: 100%; height: 54px; padding: 0 18px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); border-radius: 16px; font: 500 16px/1 var(--font); color: #fff; }
.in-ghost::placeholder { color: rgba(255,255,255,.5); }
.aside-card .fields { display: grid; gap: 10px; }
.aside-card .btn { margin-top: 8px; width: 100%; height: 56px; background: var(--brand); box-shadow: none; }
.aside-card .fine { margin: 4px 0 0; font: 400 11.5px/1.5 var(--font); color: rgba(255,255,255,.5); }
.aside-rating { display: flex; align-items: center; gap: 14px; margin-top: 14px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); font: 500 13px/1.4 var(--font); color: rgba(255,255,255,.62); }
.aside-rating b { font: 500 28px/1 var(--font); color: #fff; letter-spacing: -.04em; }
.aside-rating span span { display: inline-flex; align-items: center; gap: 5px; }
.related { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 16px; }
.related a { display: block; color: var(--ink); }
.related a:hover { color: var(--brand); }
.related .ph { aspect-ratio: 16/10; }
.related .nm { display: flex; align-items: center; justify-content: space-between; padding: 16px 0 0; font: 500 18px/1.2 var(--font); letter-spacing: -.025em; }
.related .nm span { color: var(--faint); }
@media (max-width: 959px) {
  .sd-body { grid-template-columns: 1fr; }
  .sd-aside { position: static; }
}
@media (max-width: 639px) {
  .sd-top { padding: 100px 18px 0; }
  .crumbs { gap: 6px; font-size: 12.5px; line-height: 1.4; align-items: center; }
  .sd-head { display: block; margin: 16px 0 0; }
  .sd-h1 { font-size: 34px; line-height: 1.05; letter-spacing: -.038em; }
  .sd-intro { margin-top: 14px; font-size: 15.5px; }
  .sd-ctas { margin-top: 20px; }
  .sd-ctas .btn-brand { width: 100%; height: 54px; }
  .sd-ctas .btn-soft { display: none; }
  .sd-photo { padding: 24px 14px 0; margin: 0 -18px; }
  .sd-photo .ph { border-radius: 20px; aspect-ratio: 16/10; min-height: 0; }
  .facts { display: none; }
  .sd-label { font-size: 16px; }
  .sd-h2 { margin-bottom: 20px; font-size: 29px; }
  .incl { display: block; border-bottom: 1px solid var(--line); }
  .incl > div { padding: 15px 0; }
  .incl .ok { display: none; }
  .incl h3 { margin: 0; font-size: 15.5px; line-height: 1.3; letter-spacing: -.015em; }
  .incl p { margin-top: 6px; font-size: 14px; line-height: 1.55; }
  .opts, .day-block, .sd-aside { display: none; }
  .sd-block + .sd-block { margin-top: 48px; }
  .sd-faq .faq-sign { width: 30px; height: 30px; }
  .related-sec { display: none; }
}

/* legal + sitemap */
.legal { max-width: 860px; margin: 0 auto; border-bottom: 1px solid var(--line); }
.legal > div { display: grid; grid-template-columns: minmax(0,44px) minmax(0,1fr); gap: clamp(16px,2vw,28px); padding: 26px 0; border-top: 1px solid var(--line); }
.legal .no { font: 500 14px/1.5 var(--font); color: var(--brand); font-variant-numeric: tabular-nums; }
.legal h2 { font: 500 clamp(20px,1.9vw,24px)/1.25 var(--font); letter-spacing: -.025em; }
.legal p { margin: 10px 0 0; max-width: 68ch; font: 400 16px/1.65 var(--font); color: var(--muted); text-wrap: pretty; }
.effective { margin-top: 14px; font: 400 13px/1.5 var(--font); color: var(--faint); }
@media (max-width: 639px) {
  .legal > div { grid-template-columns: 34px minmax(0,1fr); gap: 12px; padding: 20px 0; }
  .legal .no { font-size: 13px; }
  .legal h2 { font-size: 18.5px; }
  .legal p { margin-top: 8px; font-size: 14.5px; line-height: 1.62; }
}
.smap { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,300px),1fr)); gap: clamp(28px,3vw,44px); }
.smap > div { padding-top: 24px; border-top: 1px solid var(--line); }
.smap .top { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--ink); transition: color .18s; }
.smap a.top:hover { color: var(--brand); }
.smap .top b { font: 500 clamp(21px,2vw,26px)/1.15 var(--font); letter-spacing: -.028em; }
.smap .top span { font: 400 15px/1 var(--font); color: var(--fainter); }
.smap .subs { display: flex; flex-direction: column; gap: 9px; margin-top: 16px; align-items: flex-start; }
.smap .subs a, .smap .subs span { font: 400 14.5px/1.4 var(--font); color: var(--muted); }
.smap .subs a:hover { color: var(--brand); }
@media (max-width: 639px) {
  .smap .top { min-height: 46px; }
  .smap .subs { flex-direction: row; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
  .smap .subs a, .smap .subs span { padding: 8px 12px; border-radius: 999px; font-size: 13px; background: var(--frost-grad); border: .5px solid rgba(255,255,255,.85); box-shadow: var(--frost-shadow); }
}

/* 404 */
.nf { min-height: 70vh; }

/* sent-state for mock forms */
form[data-sent] .btn-brand { pointer-events: none; }

.skip:focus { position: fixed; left: 12px; top: 12px; z-index: 200; width: auto; height: auto; clip: auto; margin: 0; padding: 10px 14px; border-radius: 10px; background: #141414; color: #fff; }
html.menu-open, html.menu-open body { overflow: hidden; }
@media (min-width: 640px) { html.menu-open, html.menu-open body { overflow: visible; } }
.head { max-width: 720px; }
.sec-foot-m { margin-top: 22px; }
@media (max-width: 639px) {
  .home-flow { display: flex; flex-direction: column; }
  .home-flow > .story { order: 2; }
  .home-flow > .late { order: 3; }
}
.sc-num small.sfx { font-size: 30px; }
.sc-num .ib { display: inline-flex; align-items: baseline; }
.qp-fields .qp-label { margin-top: 2px; }
.qp-fields .intent { margin: 0 0 8px; }
@media (max-width: 639px) { .reassure { margin-top: 22px; } }
.ph { min-width: 0; }
@media (max-width: 639px) {
  .r-21-9 { aspect-ratio: 16/10; min-height: 0; }
  .opts-block { display: none; }
}

/* page-to-page navigation: a quick cross-fade instead of a white flash
   (browsers without support simply load the next page as usual).
   Never give the header a view-transition-name: that makes it a "backdrop
   root", and the glass would stop seeing the page behind it. */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .18s; }

/* glass speed add-on (see glass-still.js): the hero paints on its own layer */
.lg-still .hero-bg, .lg-still .hero-copy { will-change: transform; }