@font-face { font-family: "Instrument Sans"; src: url("assets/fonts/instrument-sans-latin.woff2") format("woff2"); font-style: normal; font-weight: 400 700; font-display: swap; }
/* Light liquid glass: a native web material approximation with solid fallbacks. */
html.story-root { color-scheme: light; background: #f4f7fb; scroll-padding-top: 0; }
.story { --paper:#f4f7fb; --ink:#192c43; --muted:#52647b; --line:#d5dfeb; --accent:#2455b2; margin:0; color:var(--ink); background:var(--paper); font-family:"Instrument Sans","Segoe UI",sans-serif; font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased; }
.story *, .story *::before, .story *::after { box-sizing:border-box; }
.story :is(h1,h2,h3,h4,p,figure) { margin:0; }
.story :is(h1,h2,h3,h4) { font-family:inherit; font-weight:450; }
.story a { color:inherit; }
.story :is(button,input) { font:inherit; }
.story button { cursor:pointer; }
.story [hidden] { display:none!important; }
.story section[id] { scroll-margin-top:0; }
.story :focus-visible { outline:2px solid #2455b2; outline-offset:5px; }
.story .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; }
.story .skip-link { position:fixed; z-index:100; left:20px; top:20px; transform:translateY(-150%); padding:12px 20px; background:#192c43; color:white; }
.story .skip-link:focus { transform:none; }

.page-progress { position:fixed; top:0; left:0; right:0; height:2px; z-index:50; pointer-events:none; }
.page-progress span { display:block; height:100%; background:#2455b2; transform:scaleX(0); transform-origin:left; }
.story { --glass:linear-gradient(145deg,rgba(255,255,255,.9),rgba(245,250,255,.66) 55%,rgba(225,236,250,.74)); --glass-shadow:inset 0 1px 0 #fff,inset 0 -2px 3px rgba(133,164,203,.12),0 12px 35px rgba(65,98,144,.09); }
.story-header { position:fixed; z-index:40; top:18px; left:4vw; right:4vw; min-height:70px; display:flex; justify-content:space-between; align-items:center; gap:20px; padding:10px 12px 10px 24px; border:1px solid #fff; border-radius:40px; background:rgba(247,251,255,.84); box-shadow:inset 0 -1px 2px rgba(114,148,190,.15),0 6px 26px rgba(65,98,144,.1),0 0 0 1px rgba(149,173,203,.22); backdrop-filter:blur(20px) saturate(1.3); -webkit-backdrop-filter:blur(20px) saturate(1.3); }
.story-header .brand { display:flex; align-items:center; gap:10px; color:#192c43; text-decoration:none; font-size:21px; font-weight:650; letter-spacing:-.04em; white-space:nowrap; }
.story-header .brand-mark { display:flex; gap:3px; align-items:center; width:23px; height:25px; background:none; }
.story-header .brand-mark i { display:block; width:5px; height:18px; border-radius:9px; background:linear-gradient(100deg,#fff,#a7c3e8 45%,#f5faff 65%,#8ca9cf); border:1px solid #a7bfdc; box-shadow:1px 2px 3px #c9d6e5; transform:rotate(18deg); }
.story-header .brand-mark i:nth-child(2) { height:22px; }.story-header .brand-mark i:last-child { height:25px; }
.story-header .brand-muted { color:#52647b; font-size:10px; font-weight:450; letter-spacing:.09em; margin-left:3px; }
.chapter-dock { display:flex; gap:6px; align-items:center; padding:3px; border-radius:30px; background:rgba(220,231,245,.42); box-shadow:inset 0 1px 3px rgba(73,100,136,.08); }
.chapter-dock a { min-height:38px; padding:9px 17px; border-radius:24px; display:inline-flex; align-items:center; position:relative; text-decoration:none; font-size:12px; }
.chapter-dock a[aria-current="step"] { background:#fff; color:#234f9d; box-shadow:0 2px 5px rgba(50,85,130,.08); }
.story-tools { display:flex; align-items:center; gap:14px; }
.story .motion-toggle { min-height:44px; background:none; border:0; color:#52647b; font-size:10px; padding:0 4px; }
.story .contact-link,.story .primary-link { display:inline-flex; justify-content:space-between; align-items:center; gap:25px; min-height:48px; padding:13px 21px; border:1px solid rgba(255,255,255,.6); border-radius:30px; text-decoration:none; color:#fff; background:#2455b2 linear-gradient(155deg,#3267c1,#2455b2 75%); box-shadow:inset 0 1px 1px rgba(255,255,255,.45),inset 0 -2px 2px rgba(18,55,119,.2),0 6px 16px rgba(36,85,178,.18); font-size:13px; font-weight:500; }
.story .contact-link { min-height:46px; padding:11px 18px; font-size:12px; }
.story .primary-link span,.story .contact-link span { display:inline-grid; place-items:center; width:24px; height:24px; border-radius:50%; background:rgba(255,255,255,.12); }
.story .text-link { font-size:13px; text-underline-offset:5px; padding:12px 0; }
.intro-scene { position:relative; isolation:isolate; padding:145px 5.6vw 36px; overflow:clip; background:radial-gradient(ellipse at 93% 10%,#d5e6f9 0,transparent 48%),radial-gradient(ellipse at 5% 90%,#e7f1ff,transparent 48%),#f5f8fc; }
.intro-scene::before { content:""; position:absolute; z-index:-2; left:-12%; bottom:14%; width:120%; height:42%; border:1px solid rgba(160,188,224,.3); border-radius:50%; transform:rotate(-13deg); box-shadow:0 20px 0 -19px rgba(255,255,255,.9),0 42px 0 -41px rgba(160,188,224,.3),0 64px 0 -63px rgba(160,188,224,.2); pointer-events:none; }
.liquid-sculpture { position:absolute; z-index:-1; width:min(790px,61vw); right:20%; top:15px; pointer-events:none; }
.liquid-sculpture img { width:100%; height:auto; display:block; opacity:.86; }
.liquid-highlight { position:absolute; inset:18% 15%; border-radius:45%; background:radial-gradient(ellipse at 70% 25%,rgba(255,255,255,.8),transparent 60%); pointer-events:none; }
.hero-layout { display:grid; grid-template-columns:1fr 1.03fr; align-items:center; gap:5vw; max-width:1420px; width:100%; margin:auto; position:relative; }
.intro-copy { padding-bottom:20px; position:relative; z-index:2; }
.intro-label { display:flex; align-items:center; gap:9px; font-size:12px; color:#405773; margin-bottom:24px!important; }
.studio-signal { width:8px; height:8px; border-radius:50%; background:#6487bc; box-shadow:0 0 0 5px rgba(152,181,220,.16),inset 0 1px 2px #e6f2ff; }
.intro-copy h1 { font-size:clamp(55px,5.2vw,83px); line-height:1.05; letter-spacing:-.055em; max-width:13ch; font-weight:500; }
.intro-lede { color:#52647b; font-size:15px; line-height:1.7; max-width:37ch; margin-top:25px!important; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:27px; }
.hero-detail { font-size:11px; color:#52647b; margin-top:24px!important; }
.featured-work { min-width:0; position:relative; padding:0 18px 0 25px; }
.showroom-label { display:flex; justify-content:space-between; align-items:center; padding:0 10px 16px; font-size:10px; color:#405773; }
.showroom-label > span:first-child { font-weight:600; text-transform:uppercase; letter-spacing:.12em; }
.glass-project { display:block; text-decoration:none; position:relative; z-index:2; padding:15px; border:1px solid #fff; border-radius:27px; background:var(--glass); box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),inset 0 -3px 5px rgba(158,185,219,.16),0 18px 42px rgba(63,96,143,.15),0 0 0 1px rgba(155,179,208,.17); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); color:#192c43; transform-origin:center; }
.feature-window { aspect-ratio:3/2; background:#edf3fa; overflow:hidden; border:1px solid rgba(255,255,255,.9); border-radius:15px; box-shadow:0 2px 6px rgba(38,72,115,.06); }
.feature-window img { display:block; width:100%; height:100%; object-fit:cover; }
.feature-caption { display:flex; justify-content:space-between; align-items:center; padding:16px 6px 3px; }
.feature-caption p { color:#52647b; font-size:10px; }
.feature-caption h2 { margin-top:3px; font-size:21px; letter-spacing:-.025em; }
.feature-arrow { display:grid; place-items:center; font-size:21px; border:1px solid #fff; border-radius:50%; width:39px; height:39px; background:rgba(255,255,255,.65); box-shadow:var(--glass-shadow); }
.feature-echo { position:absolute; z-index:1; width:40%; left:-23px; top:47%; padding:9px; border:1px solid #fff; border-radius:18px; background:rgba(244,250,255,.72); box-shadow:0 13px 32px rgba(72,104,147,.12); pointer-events:none; }
.feature-echo img { display:block; width:100%; height:auto; border-radius:9px; transform:rotate(-9deg); }
.feature-echo span { display:block; font-size:9px; color:#405773; padding:10px 6px 2px; }
.feature-selector { position:relative; z-index:3; display:flex; width:fit-content; margin:18px auto 0; gap:3px; padding:5px; border:1px solid #fff; border-radius:28px; background:rgba(240,247,255,.86); box-shadow:inset 0 1px 2px #fff,0 3px 9px rgba(78,108,147,.09); }
.feature-selector button { position:relative; min-width:75px; min-height:44px; padding:8px 16px; border:0; border-radius:23px; background:none; color:#405773; font-size:11px; }
.feature-selector button[aria-pressed="true"] { background:#fff; color:#2455b2; box-shadow:0 2px 6px rgba(56,91,138,.13),inset 0 -1px 1px #e2eaf6; }
.display-note { position:relative; z-index:2; text-align:center; color:#52647b; font-size:9px; margin-top:12px!important; line-height:1.6; }
.studio-service-rail { display:grid; grid-template-columns:repeat(3,1fr); max-width:1420px; margin:42px auto 0; border:1px solid #fff; border-radius:24px; background:rgba(247,251,255,.73); box-shadow:var(--glass-shadow),0 0 0 1px rgba(162,186,215,.17); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.studio-service-rail a { min-width:0; display:grid; grid-template-columns:44px 1fr 15px; align-items:center; gap:14px; padding:21px 25px; text-decoration:none; }
.studio-service-rail a + a { border-left:1px solid rgba(157,179,208,.3); }
.studio-service-rail b { display:block; font-size:13px; font-weight:550; }
.studio-service-rail small { display:block; margin-top:4px; font-size:11px; color:#52647b; }
.service-rail-arrow { color:#52647b; font-size:17px; }
.service-rail-icon { position:relative; display:block; width:42px; height:42px; border-radius:13px; background:linear-gradient(135deg,#fff,rgba(213,229,249,.75)); border:1px solid #fff; box-shadow:inset 0 -2px 3px #d0dff1,0 3px 5px rgba(95,126,165,.09); }
.service-rail-icon i { display:block; position:absolute; width:19px; height:22px; left:9px; top:7px; border:1px solid #7c9bc5; border-radius:4px; background:rgba(231,240,255,.6); transform:rotate(-14deg); box-shadow:inset 0 1px 2px #fff; }
.service-rail-icon i + i { transform:translate(5px,4px) rotate(12deg); background:rgba(255,255,255,.6); }
.service-rail-build i { height:13px; top:8px; transform:rotate(-10deg); }.service-rail-build i + i { transform:translate(0,11px) rotate(-10deg); }
.service-rail-care i { width:20px; height:20px; border-radius:50%; top:10px; left:7px; transform:none; }.service-rail-care i + i { transform:translateX(8px); }

.chapter { padding:116px 5.6vw 80px; position:relative; border-top:1px solid #d5dfeb; }
.chapter-heading { max-width:1420px; margin:0 auto 38px; }
.chapter-heading h2 { font-size:clamp(36px,3.8vw,55px); line-height:1.12; letter-spacing:-.035em; }
.chapter-heading > p:last-child { font-size:15px; line-height:1.7; color:#52647b; max-width:48ch; margin-top:20px; }
.gallery-chapter { background:#f4f7fb; }
.showroom { max-width:1420px; margin:auto; }
.story .chips { display:flex; flex-wrap:wrap; gap:6px 30px; padding:0 0 22px; }
.story .chip { min-height:44px; padding:7px 0; background:none; color:#52647b; border:0; border-radius:0; font-size:13px; font-weight:450; position:relative; }
.story .chip[aria-checked="true"] { color:#192c43; background:none; box-shadow:none; }
.story .chip[aria-checked="true"]::after { content:""; position:absolute; bottom:0; left:0; right:0; height:1px; background:#2455b2; }
.showroom-stage { position:relative; padding:0 16px 14px; border:1px solid #d5dfeb; border-radius:3px; background:#e8f0fa; }
.gallery-meta { min-height:78px; display:flex; flex-direction:column; justify-content:center; padding:15px 5px; }
.gallery-title { font-size:18px; letter-spacing:-.02em; }
.gallery-meta > span { color:#52647b; font-size:11px; }
.story .onboarding-preview { margin:0; background:none; border:0; border-radius:0; box-shadow:none; overflow:visible; }
.preview-heading { display:none; }
.preview-toolbar { position:absolute; right:20px; top:18px; display:flex; align-items:center; gap:26px; font-size:12px; }
.preview-devices { display:flex; border:1px solid #bacde3; border-radius:3px; padding:2px; }
.preview-devices button { min-height:36px; padding:7px 14px; background:none; color:#405773; border:0; border-radius:2px; font-size:11px; }
.preview-devices button[aria-pressed="true"] { background:#2455b2; color:#fff; }
.preview-open-mobile { padding:10px 0; text-underline-offset:4px; }
#preview-scroll-hint { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
.preview-canvas { display:flex; justify-content:center; overflow:hidden; background:#e2ecf7; }
.preview-scroll { width:100%; height:min(680px,72svh); overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#8aa4c4 #e8f0fa; background:#eee; }
.preview-scroll img { display:block; width:100%; height:auto; }
.onboarding-preview[data-preview-device="mobile"] .preview-scroll { max-width:390px; }
.story .onboarding-preview figcaption { padding:14px 5px 0; font-size:11px; color:#52647b; background:none; border:0; }
.onboarding-preview figcaption strong { font-weight:450; }
.onboarding-preview figcaption a { margin-left:10px; text-underline-offset:3px; }
.project-context { max-width:1420px; margin:36px auto 0; display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.project-context h3 { font-size:16px; margin-bottom:14px; }
.story .ticks { display:grid; gap:8px; margin:0; padding:0; list-style:none; color:#52647b; font-size:13px; }
.story .ticks li::before { content:"·"; margin-right:10px; }
.context-label { color:#52647b; font-size:11px; }
.context-quote > p { margin:4px 0; font-size:20px; }
.context-quote > strong { font-size:24px; font-weight:450; }
.context-quote .context-note { margin:12px 0; font-size:12px; color:#52647b; }
.context-quote > a { display:inline-block; padding:10px 0; font-size:12px; text-underline-offset:4px; }
.research-notes { max-width:1420px; margin:35px auto 0; border-top:1px solid #d5dfeb; }
.story summary { cursor:pointer; list-style:none; }
.story summary::-webkit-details-marker { display:none; }
.research-notes > summary, .process-details > summary { display:flex; justify-content:space-between; align-items:center; min-height:62px; padding:20px 0; font-size:13px; }
.evidence { display:grid; grid-template-columns:repeat(3,1fr); gap:45px; padding:20px 0; }
.micro-label,.source-link,.chapter-note { color:#52647b; font-size:12px; }
.evidence-figure { display:block; margin:14px 0; font-size:50px; letter-spacing:-.04em; font-weight:450; }
.evidence-figure span { font-size:24px; }
.evidence-item h2 { font-size:17px; line-height:1.5; }
.evidence-item > p:not(.micro-label) { margin:15px 0; color:#52647b; font-size:13px; }
.chapter-note { padding:20px 0; }
.process-chapter { background:#edf3fa; }
.process-workbench { max-width:1420px; margin:auto; }
.phase-tabs { display:flex; gap:40px; border-bottom:1px solid #cedbe9; }
.phase-tabs button { display:flex; gap:12px; min-height:60px; padding:18px 0; color:#52647b; border:0; border-bottom:2px solid transparent; background:none; font-size:11px; }
.phase-tabs button span { font-size:15px; }
.phase-tabs button[aria-selected="true"] { color:#192c43; border-bottom-color:#2455b2; }
.phase-panel { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:7vw; padding:42px 0 25px; }
.phase-art { padding:34px; min-height:415px; background:#f8fbff; border:1px solid #d5dfeb; border-radius:2px; color:#192c43; box-shadow:0 10px 25px rgba(50,57,45,.035); }
.art-eyebrow { font-size:11px; color:#52647b; }
.phase-art .art-title { font-size:37px; line-height:1.15; letter-spacing:-.035em; margin:23px 0; }
.brief-art dl { margin:0; }
.brief-art dl > div { border-top:1px solid #d5dfeb; padding:12px 0; }
.brief-art dt { font-size:13px; font-weight:550; }
.brief-art dd { margin:3px 0 0; color:#52647b; font-size:12px; }
.art-signature { display:block; margin-top:20px; font-size:10px; color:#52647b; }
.design-art { padding:22px; }
.design-art img { display:block; width:100%; height:auto; margin-top:20px; }
.art-caption { margin-top:17px!important; color:#52647b; font-size:12px; }
.launch-art ul { display:grid; gap:18px; padding:0; margin:25px 0 0; list-style:none; font-size:14px; }
.launch-art li span { margin-right:10px; color:#2455b2; }
.phase-count { color:#52647b; font-size:11px; }
.phase-copy h3 { font-size:clamp(28px,2.8vw,40px); line-height:1.17; letter-spacing:-.03em; max-width:19ch; margin:16px 0; }
.phase-copy > p { color:#52647b; font-size:15px; line-height:1.7; max-width:46ch; }
.phase-copy ul { display:grid; gap:12px; padding:0; margin:25px 0; list-style:none; font-size:13px; }
.phase-copy li::before { content:"✓"; margin-right:10px; color:#2455b2; }
.phase-copy .decision-note { border-top:1px solid #d5dfeb; padding-top:20px; font-size:12px; }
.phase-pagination { display:flex; justify-content:flex-end; align-items:center; gap:22px; font-size:12px; }
.phase-pagination button { width:44px; height:44px; background:none; border:1px solid #bacde3; border-radius:3px; color:#192c43; }
.timing-line { display:grid; grid-template-columns:repeat(4,1fr); gap:25px; max-width:1420px; margin:40px auto 0; padding:26px 0; border-top:1px solid #cedbe9; }
.timing-line span { display:grid; gap:5px; color:#52647b; font-size:12px; }
.timing-line b { color:#192c43; font-size:14px; font-weight:550; }
.process-details { max-width:1420px; margin:auto; border-top:1px solid #cedbe9; }
.route-map { display:grid; grid-template-columns:1fr 1fr; gap:30px 60px; margin:0; padding:20px 0; list-style:none; }
.rm { display:grid; grid-template-columns:120px 1fr; gap:20px; border-top:1px solid #cedbe9; padding-top:20px; }
.rm-when,.rm-who { color:#52647b; font-size:11px; }
.rm h3 { font-size:17px; }
.rm p { margin:8px 0; color:#52647b; font-size:13px; }
.rm-who { font-weight:600; }
.process-details > p { padding:20px 0; font-size:12px; color:#52647b; }
.investment-chapter { background:#f4f7fb; }
.investment-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:80px; max-width:1420px; margin:auto; }
.scope-selector > h3 { margin-bottom:14px; font-size:16px; }
.route-list { margin:0; padding:0; list-style:none; }
.route-list li { display:grid; grid-template-columns:22px 1fr auto; gap:5px 10px; border-bottom:1px solid #d5dfeb; padding:20px 0; }
.route-n { padding-top:3px; font-size:10px; color:#52647b; }
.route-list b { font-size:15px; font-weight:450; }
.route-price { font-size:17px; }
.route-list small { grid-column:2/-1; font-size:11px; color:#52647b; }
.scope-shortcuts { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.scope-shortcuts button { min-height:40px; padding:7px 12px; color:#2455b2; background:none; border:1px solid #bacde3; border-radius:3px; font-size:11px; }
.scope-shortcuts button[aria-pressed="true"] { background:#2455b2; color:#fff; }
.own-terms { display:grid; gap:12px; margin:25px 0 0; font-size:12px; }
.own-terms > div { display:grid; grid-template-columns:95px 1fr; gap:16px; }
.own-terms dt { color:#52647b; }
.own-terms dd { margin:0; }
.quote-workbench { background:#e8f0fa; border-radius:3px; padding:38px; align-self:start; }
.deposit-label { display:flex; flex-direction:column; gap:23px; }
.step-label { color:#52647b; font-size:12px; }
.step-label > span { display:none; }
.deposit-value { font-size:clamp(58px,5.5vw,80px); line-height:1.15; letter-spacing:-.04em; }
.deposit-range { display:block; width:100%; height:25px; margin:25px 0 18px; accent-color:#2455b2; cursor:ew-resize; }
.deposit-route { color:#52647b; font-size:13px; }
.deposit-split { display:grid; grid-template-columns:1fr 1fr; gap:25px; border-top:1px solid #cedbe9; padding-top:23px; margin:30px 0; }
.deposit-split dt { color:#52647b; font-size:11px; }
.deposit-split dd { margin:6px 0 0; font-size:30px; }
.deposit-note { color:#52647b; font-size:12px; line-height:1.7; }
.ownership { display:grid; grid-template-columns:1fr 1fr; gap:80px; max-width:1420px; margin:65px auto 0; border-top:1px solid #d5dfeb; padding-top:35px; }
.ownership-heading h3 { font-size:25px; letter-spacing:-.025em; }
.ownership-heading p { color:#52647b; font-size:13px; margin-top:12px; }
.ownership-files details { border-bottom:1px solid #d5dfeb; }
.ownership-files summary { display:flex; justify-content:space-between; align-items:center; min-height:52px; padding:10px 0; font-size:13px; }
.ownership-files summary b { font-size:18px; font-weight:400; }
.ownership-files details p { padding:0 25px 18px 0; color:#52647b; font-size:12px; }
.contact-chapter { display:grid; grid-template-columns:1.1fr 1fr; align-items:start; gap:8vw; background:#edf3fa; padding-block:110px; }
.contact-copy h2 { font-size:clamp(40px,4.8vw,68px); line-height:1.12; letter-spacing:-.04em; }
.contact-copy > p:last-child { color:#52647b; font-size:16px; line-height:1.75; max-width:40ch; margin-top:28px; }
.contact-glass { padding:0 0 0 40px; border-left:1px solid #cedbe9; }
.contact-intro { font-size:12px; color:#52647b; }
.contact-glass h3 { font-size:27px; letter-spacing:-.025em; margin:20px 0 16px; }
.contact-glass > p:not(.contact-intro):not(.contact-small) { font-size:14px; color:#52647b; max-width:35ch; }
.contact-glass .primary-link { display:flex; width:fit-content; margin:25px 0 18px; }
.email-link { display:inline-block; font-size:13px; text-underline-offset:4px; overflow-wrap:anywhere; padding:5px 0; }
.contact-small { margin-top:22px!important; color:#52647b; font-size:12px; line-height:1.8; }
.story-footer { display:flex; justify-content:space-between; flex-wrap:wrap; align-items:center; gap:20px; padding:25px 5.6vw; background:#edf3fa; border-top:1px solid #d5dfeb; color:#52647b; font-size:12px; }
.story-footer nav { display:flex; flex-wrap:wrap; gap:25px; }
.story-footer a { text-decoration:none; padding:10px 0; }

/* Shared light-transmitting material. Text sits over a legible milky fill. */
.chapter { padding:112px 5.6vw 72px; border-top:1px solid #d7e2ef; overflow:clip; }
.chapter-heading { display:grid; grid-template-columns:1.2fr .8fr; gap:12px 70px; margin-bottom:30px; }
.chapter-kicker { grid-column:1/-1; display:flex; align-items:center; gap:16px; margin-bottom:10px!important; font-size:10px; color:#52647b; letter-spacing:.06em; }
.chapter-kicker span:first-child { display:inline-block; border:1px solid #bfcfe3; border-radius:20px; padding:5px 11px; color:#2455b2; background:rgba(255,255,255,.65); }
.chapter-heading h2 { font-size:clamp(35px,3.5vw,52px); letter-spacing:-.045em; line-height:1.1; }
.chapter-heading > p:last-child { align-self:end; max-width:39ch; margin:0 0 4px; font-size:14px; }
.gallery-chapter { background:radial-gradient(ellipse at 0 45%,#e9f2ff,transparent 55%),#f4f7fb; }
.story .chips { gap:7px; padding:0 0 20px; }
.story .chip { border:1px solid rgba(172,192,219,.6); border-radius:24px; padding:10px 16px; background:rgba(255,255,255,.6); min-height:42px; font-size:12px; }
.story .chip[aria-checked="true"] { color:#234f9d; background:linear-gradient(150deg,#fff,#e8f1ff); border-color:#a5bfdf; box-shadow:inset 0 1px 2px #fff,0 3px 7px rgba(69,103,147,.09); }
.story .chip[aria-checked="true"]::after { display:none; }
.showroom-stage { border:1px solid #fff; border-radius:29px; padding:0 18px 15px; background:var(--glass); box-shadow:var(--glass-shadow),0 0 0 1px rgba(166,187,214,.28); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.gallery-meta { min-height:80px; padding:16px 10px; }
.gallery-title { font-size:21px; }
.preview-toolbar { top:19px; right:27px; gap:25px; }
.preview-devices { border:1px solid #d0deef; border-radius:24px; padding:4px; background:rgba(211,225,245,.45); box-shadow:inset 0 1px 2px rgba(74,109,156,.08); }
.preview-devices button { min-height:32px; border-radius:20px; padding:7px 15px; }
.preview-devices button[aria-pressed="true"] { color:#2455b2; background:white; box-shadow:0 2px 5px rgba(55,95,150,.12); }
.preview-canvas { border-radius:16px; border:1px solid #d5dfeb; box-shadow:0 3px 12px rgba(71,102,145,.05); }
.story .onboarding-preview figcaption { padding:14px 9px 0; }
.project-context { margin-top:28px; gap:50px; }
.context-quote { padding-left:35px; border-left:1px solid #d5dfeb; }
.research-notes { margin-top:25px; }
.process-chapter { background:radial-gradient(ellipse at 88% 60%,#d9e9fc,transparent 60%),#edf3fa; }
.process-workbench { padding:22px 34px 20px; border:1px solid #fff; border-radius:30px; background:var(--glass); box-shadow:var(--glass-shadow),0 0 0 1px rgba(167,189,217,.2); }
.phase-tabs { justify-content:space-between; gap:12px; border:0; padding:5px; background:rgba(217,231,247,.65); border-radius:30px; }
.phase-tabs button { flex:1; align-items:center; justify-content:center; border:0; padding:12px 15px; min-height:46px; border-radius:24px; font-size:10px; }
.phase-tabs button span { font-size:13px; }
.phase-tabs button[aria-selected="true"] { background:#fff; box-shadow:0 3px 8px rgba(72,107,153,.1); color:#2455b2; }
.phase-panel { gap:6vw; padding-top:30px; }
.phase-art { border:1px solid #fff; border-radius:20px; background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(238,246,255,.8)); box-shadow:0 7px 25px rgba(75,106,148,.08),inset 0 -2px 2px rgba(165,187,217,.15); min-height:360px; }
.phase-art .art-title { font-size:34px; }.design-art img { border-radius:11px; }
.phase-pagination button { border-radius:50%; background:var(--glass); border-color:#fff; box-shadow:var(--glass-shadow); }
.timing-line { margin-top:28px; padding:23px 0; }.timing-line b { color:#2455b2; }
.investment-chapter { background:radial-gradient(ellipse at 90% 35%,#e0edff,transparent 50%),#f4f7fb; }
.investment-grid { gap:70px; }
.scope-selector { padding-top:10px; }
.route-list li { padding:18px 0; }
.scope-shortcuts button { border-radius:24px; padding:9px 15px; background:rgba(255,255,255,.7); border-color:#bbcee7; }
.scope-shortcuts button[aria-pressed="true"] { background:#2455b2 linear-gradient(150deg,#3267c1,#2455b2); box-shadow:inset 0 1px 1px #91ade0,0 3px 10px rgba(38,84,170,.14); }
.quote-workbench { padding:35px; border:1px solid #fff; border-radius:30px; background:var(--glass); box-shadow:var(--glass-shadow),0 0 0 1px rgba(166,187,214,.25); position:relative; overflow:hidden; }
.quote-workbench::after { content:""; width:175px; height:175px; position:absolute; top:-95px; right:-40px; border:1px solid #fff; border-radius:50%; box-shadow:0 0 0 17px rgba(255,255,255,.2),0 0 0 18px rgba(255,255,255,.7),0 0 0 35px rgba(221,235,255,.25); pointer-events:none; }
.deposit-value { font-size:76px; color:#213b60; }.deposit-range { accent-color:#2455b2; }
.deposit-split dd { color:#2455b2; }.deposit-note { max-width:44ch; }
.ownership { margin-top:45px; gap:70px; }
.ownership-files details { padding-inline:16px; background:rgba(255,255,255,.45); border-radius:15px; margin-bottom:6px; border:1px solid #dde6f1; }
.contact-chapter { position:relative; isolation:isolate; grid-template-columns:1.05fr .95fr; gap:9vw; padding-block:110px 80px; background:radial-gradient(ellipse at 20% 90%,#d9e9fd,transparent 60%),#edf3fa; }
.contact-sculpture { position:absolute; width:550px; left:27%; top:25px; opacity:.22; z-index:-1; pointer-events:none; }.contact-sculpture img { width:100%; height:auto; }
.contact-copy { position:relative; padding-top:10px; }.contact-copy h2 { font-size:clamp(43px,4.8vw,70px); }.contact-copy > p:last-child { max-width:37ch; font-size:15px; }
.contact-glass { padding:32px; border:1px solid #fff; border-radius:28px; background:rgba(250,253,255,.8); box-shadow:var(--glass-shadow),0 0 0 1px rgba(168,190,219,.2); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.contact-glass h3 { margin-top:15px; }.contact-glass .primary-link { margin-top:24px; }
.story-footer { background:#edf3fa; }
@media (hover:hover) and (pointer:fine) {
 .chapter-dock a:hover,.feature-selector button:hover,.story .chip:hover { background:rgba(255,255,255,.9); }
 .studio-service-rail a:hover { background:rgba(255,255,255,.3); }.studio-service-rail a:first-child { border-radius:24px 0 0 24px; }.studio-service-rail a:last-child { border-radius:0 24px 24px 0; }
 .story .primary-link:hover,.story .contact-link:hover { background:#1c499c linear-gradient(155deg,#3266bd,#1c499c); }
}
@media (min-width:1700px) { .story-header { left:max(4vw,calc((100vw - 1480px)/2)); right:max(4vw,calc((100vw - 1480px)/2)); }.intro-scene { padding-top:155px; }.liquid-sculpture { right:calc(50% - 440px); } }
@media (max-width:1100px) {
 .story-header .brand-muted { display:none; }.chapter-dock a { padding-inline:13px; }.story-tools { gap:8px; }
 .hero-layout { gap:30px; }.intro-copy h1 { font-size:58px; }.featured-work { padding:0 8px 0 12px; }.glass-project { padding:12px; }
 .hero-actions { gap:18px; }.hero-actions .primary-link { padding-inline:17px; gap:14px; }.studio-service-rail a { padding:18px; gap:11px; }.studio-service-rail small { font-size:10px; }
 .investment-grid,.ownership { gap:35px; }.route-list li { grid-template-columns:18px 1fr; }.route-price { grid-column:2; }.quote-workbench { padding:30px; }
}
@media (min-width:901px) and (max-width:1300px) { .liquid-sculpture { right:10%; opacity:.75; } }
@media (max-width:900px) {
 .story-header { left:20px; right:20px; }.intro-scene { padding:135px 6vw 40px; }.hero-layout { grid-template-columns:1fr; gap:28px; max-width:650px; }.intro-copy { padding:0; }
 .intro-copy h1 { font-size:clamp(53px,8vw,68px); max-width:15ch; }.intro-lede { max-width:46ch; }.hero-detail { display:none; }.intro-label { margin-bottom:18px!important; }
 .liquid-sculpture { width:650px; right:-180px; top:20px; opacity:.65; }.featured-work { padding:0 25px; }.feature-echo { left:0; top:32%; }.showroom-label { padding-bottom:12px; }
 .studio-service-rail { max-width:650px; margin-top:27px; }.studio-service-rail a { grid-template-columns:1fr 16px; gap:10px; padding:18px 16px; }.service-rail-icon { display:none; }.studio-service-rail b { font-size:12px; }.studio-service-rail small { line-height:1.5; }
 .chapter { padding:110px 6vw 60px; }.chapter-heading { gap:14px 30px; }.chapter-heading h2 { font-size:38px; }.chapter-heading > p:last-child { font-size:13px; }
 .phase-panel { gap:30px; }.phase-art { padding:25px; min-height:360px; }.phase-art .art-title { font-size:30px; }.phase-copy h3 { font-size:29px; }.phase-copy > p { font-size:14px; }.process-workbench { padding:20px; }
 .project-context { gap:30px; }.evidence { grid-template-columns:1fr; gap:25px; }.route-map { grid-template-columns:1fr; }
 .investment-grid,.ownership { grid-template-columns:1fr; max-width:650px; gap:30px; }.route-list li { grid-template-columns:22px 1fr auto; }.route-price { grid-column:auto; }
 .contact-chapter { gap:35px; }.contact-copy h2 { font-size:44px; }.contact-glass { padding:25px; }.contact-sculpture { left:0; }
}
@media (max-width:680px) {
 .story-header { display:grid; grid-template-columns:1fr auto; gap:0 8px; top:10px; left:12px; right:12px; padding:7px 10px 7px 15px; border-radius:25px; }
 .story-header .brand { font-size:19px; gap:8px; }.story-header .brand-mark { width:20px; }.story-header .brand-muted { display:none; }.story-tools { grid-column:2; grid-row:1; gap:5px; }
 .story .motion-toggle { max-width:53px; font-size:9px; line-height:1.3; padding:0 2px; }.story .contact-link { min-height:39px; padding:8px 12px; gap:8px; font-size:11px; }.story .contact-link span { width:19px; height:19px; }
 .chapter-dock { grid-column:1/-1; justify-content:space-between; gap:0; padding:0 5px; margin-top:6px; border-radius:20px; }.chapter-dock a { min-height:32px; padding:6px 12px; font-size:11px; }
 .intro-scene { padding:143px 6vw 30px; }.intro-label { font-size:10px; margin-bottom:17px!important; }.intro-copy h1 { font-size:clamp(40px,11.6vw,61px); line-height:1.07; max-width:14ch; }
 .intro-lede { margin-top:19px!important; font-size:13px; line-height:1.65; max-width:36ch; }.hero-actions { margin-top:21px; gap:18px; }.hero-actions .primary-link { min-height:44px; font-size:11px; padding:10px 14px; gap:12px; }.hero-actions .text-link { font-size:11px; }
 .hero-layout { gap:25px; }.liquid-sculpture { width:510px; right:-255px; top:65px; opacity:.28; }.liquid-sculpture img { opacity:.7; }
 .featured-work { padding:0 2px; }.showroom-label { padding:0 8px 10px; font-size:9px; }.showroom-label > span:first-child { letter-spacing:.08em; }.feature-echo { display:none; }
 .glass-project { padding:10px; border-radius:21px; }.feature-window { border-radius:12px; }.feature-caption { padding:12px 5px 3px; }.feature-caption h2 { font-size:19px; }.feature-caption p { font-size:9px; }.feature-arrow { width:33px; height:33px; font-size:18px; }
 .feature-selector { margin-top:13px; padding:4px; }.feature-selector button { font-size:10px; min-width:70px; min-height:44px; padding:7px 14px; }.display-note { margin-top:9px!important; font-size:9px; }
 .studio-service-rail { grid-template-columns:1fr; margin-top:24px; border-radius:21px; }.studio-service-rail a { grid-template-columns:36px 1fr 16px; padding:14px 17px; gap:12px; }.studio-service-rail a+a { border-left:0; border-top:1px solid rgba(157,179,208,.3); }.studio-service-rail b { font-size:12px; }.studio-service-rail small { font-size:10px; margin-top:2px; }.service-rail-icon { display:block; width:35px; height:35px; border-radius:11px; }.service-rail-icon i { left:6px; top:5px; }.service-rail-build i { top:4px; }.service-rail-care i { left:4px; top:7px; }
 .chapter { padding:130px 6vw 50px; }.chapter-heading { grid-template-columns:1fr; gap:0; margin-bottom:21px; }.chapter-kicker { margin-bottom:15px!important; gap:12px; font-size:9px; }.chapter-kicker span:first-child { padding:4px 9px; }
 .chapter-heading h2 { font-size:33px; }.chapter-heading > p:last-child { font-size:13px; margin-top:15px; max-width:38ch; }
 .story .chips { gap:6px; padding-bottom:17px; }.story .chip { font-size:10px; padding:7px 11px; min-height:35px; }
 .showroom-stage { padding:0 9px 10px; border-radius:23px; }.gallery-meta { min-height:0; padding:14px 8px 9px; }.gallery-title { font-size:18px; }.gallery-meta > span { font-size:10px; }
 .preview-toolbar { position:static; justify-content:space-between; gap:8px; padding:0 6px 12px; font-size:10px; }.preview-devices { padding:3px; }.preview-devices button { min-height:30px; padding:6px 10px; font-size:10px; }.preview-open-mobile { padding:10px 0; }
 .preview-canvas { border-radius:11px; }.preview-scroll { height:470px; max-height:62svh; }.onboarding-preview[data-preview-device="desktop"] .preview-scroll img { min-width:650px; }.onboarding-preview[data-preview-device="mobile"] .preview-scroll img { min-width:0; }
 .story .onboarding-preview figcaption { font-size:10px; line-height:1.6; padding:11px 5px 0; }.onboarding-preview figcaption a { display:inline-block; margin-left:0; }
 .project-context { grid-template-columns:1fr; gap:23px; margin-top:25px; }.context-quote { padding:22px 0 0; border-left:0; border-top:1px solid #d5dfeb; }
 .process-workbench { padding:10px 15px 15px; border-radius:23px; }.phase-tabs { gap:2px; margin:0 -5px; padding:4px; border-radius:22px; }.phase-tabs button { flex-direction:column; gap:3px; padding:8px 3px; min-height:53px; font-size:9px; border-radius:17px; }.phase-tabs button span { font-size:10px; }
 .phase-panel { grid-template-columns:1fr; padding-top:25px; gap:24px; }.phase-copy { order:-1; }.phase-copy h3 { font-size:28px; }.phase-copy > p { font-size:13px; }.phase-copy ul { font-size:12px; gap:10px; }.phase-art { min-height:0; padding:22px; }.phase-pagination { justify-content:space-between; margin-top:10px; }.phase-pagination button { width:38px; height:38px; }
 .timing-line { grid-template-columns:1fr 1fr; gap:22px 16px; margin-top:25px; }.timing-line span { font-size:11px; }.rm { grid-template-columns:1fr; gap:8px; }
 .route-list li { grid-template-columns:18px 1fr; }.route-price { grid-column:2; }.own-terms > div { grid-template-columns:80px 1fr; gap:10px; }.scope-shortcuts { gap:6px; }.scope-shortcuts button { font-size:10px; padding:8px 11px; }
 .quote-workbench { padding:25px; border-radius:25px; }.deposit-value { font-size:63px; }.deposit-split { gap:12px; }.deposit-split dd { font-size:27px; }.ownership { margin-top:35px; padding-top:25px; }.ownership-heading h3 { font-size:23px; }
 .contact-chapter { grid-template-columns:1fr; gap:28px; }.contact-copy h2 { font-size:43px; }.contact-copy > p:last-child { font-size:13px; margin-top:20px; }.contact-glass { padding:25px; border-radius:24px; }.contact-glass h3 { font-size:25px; }.contact-sculpture { width:400px; left:28%; top:75px; opacity:.13; }.story-footer { font-size:11px; gap:10px; padding:23px 6vw; }.story-footer nav { gap:18px; }
}
@media (max-width:360px) { .story-header .brand-mark { display:none; }.story-header { padding-left:13px; }.intro-copy h1 { font-size:39px; }.hero-actions { gap:13px; }.hero-actions .primary-link { padding-inline:12px; gap:7px; }.hero-actions .text-link { font-size:10px; }.showroom-label { font-size:8px; }.chapter-heading h2 { font-size:30px; }.story .chip { padding-inline:9px; }.phase-tabs button span { font-size:9px; }.phase-copy h3 { font-size:26px; } }
@media (prefers-reduced-transparency:reduce) { .story :is(.story-header,.glass-project,.studio-service-rail,.showroom-stage,.process-workbench,.quote-workbench,.contact-glass,.feature-selector) { background:#f7faff; backdrop-filter:none; -webkit-backdrop-filter:none; }.liquid-sculpture,.contact-sculpture { opacity:.3; } }
@supports not (backdrop-filter:blur(1px)) { .story-header,.glass-project,.studio-service-rail,.contact-glass { background:#f4f8fe; } }
html:not(.js) .story :is(.motion-toggle,.feature-selector,.scope-shortcuts,.deposit-range,.deposit-label .step-label,.phase-tabs,.phase-pagination,.showroom .chips,.preview-toolbar) { display:none; }
html:not(.js) .story .preview-heading { display:flex; justify-content:space-between; gap:15px; padding:12px 7px 20px; font-size:12px; }
html:not(.js) .story .phase-panel { display:grid!important; }
html:not(.js) .story .phase-panel + .phase-panel { border-top:1px solid #cedbe9; }
html:not(.js) .story .deposit-label::before { content:"Illustrative project total"; font-size:12px; }
@media print { .story-header,.page-progress,.feature-selector,.liquid-sculpture,.feature-echo,.contact-sculpture { display:none!important; }.story .chapter,.intro-scene { padding:25px; background:white; color:black; }.story .phase-panel[hidden] { display:grid!important; }.preview-scroll { height:auto; overflow:visible; } }

/* ══════════════════════════════════════════════════════════════════════
   THE CARE REQUEST FORM (service.html)
   ══════════════════════════════════════════════════════════════════════
   Carried over unchanged from the form this file used to style, minus the
   pieces that belonged to the retired 3D intake, and scoped so that none
   of it reaches the story above. The header is sticky rather than fixed:
   the fixed version, written for the old dark intake, sat on top of the
   first lines of the form. */
html:not(.story-root) { color-scheme: light; --paper: #f7f9fb; --paper-2: #edf2f6; --ink: #15202d; --ink-2: #223144; --muted: #647181; --line: rgba(21, 32, 45, 0.17); --line-soft: rgba(21, 32, 45, 0.09); --accent: #c9e1f5; --accent-dark: #4f82ad; --accent-deep: #2f5f85; --white: #ffffff; --danger: #9f3f35; --ok: #2f7d52; --font-sans: "Instrument Sans", "Segoe UI", sans-serif; --font-mono: "DM Mono", Consolas, monospace; --radius-sm: 0.4rem; --radius-md: 0.85rem; --radius-lg: 1.4rem; --ease: cubic-bezier(0.22, 1, 0.36, 1); --shadow-1: 0 1px 2px rgba(21, 32, 45, 0.05); --shadow-2: 0 2px 8px rgba(21, 32, 45, 0.06), 0 14px 34px rgba(21, 32, 45, 0.07); --shadow-3: 0 4px 12px rgba(21, 32, 45, 0.07), 0 26px 60px rgba(21, 32, 45, 0.13); }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html:not(.story-root) body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-sans); font-size: 1rem; line-height: 1.55; -webkit-font-smoothing: antialiased; }
html:not(.story-root) .intake-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem clamp(1.1rem, 3vw, 2.4rem); border-bottom: 1px solid var(--line-soft); background: var(--white); position: sticky; top: 0; z-index: 30; }
html:not(.story-root) .brand { display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none; color: var(--ink); font-weight: 700; letter-spacing: -0.02em; font-size: 1.1rem; }
html:not(.story-root) .brand-mark { width: 1.5rem; height: 1.5rem; border-radius: 0.45rem; background: linear-gradient(150deg, var(--accent-dark), var(--accent-deep)); }
html:not(.story-root) .header-right { display: flex; align-items: center; gap: 1rem; }
html:not(.story-root) .ghost-link { color: var(--muted); text-decoration: none; font-size: 0.9rem; }
html:not(.story-root) .ghost-link:hover { color: var(--ink); }
@media (max-width: 640px) {
  html:not(.story-root) .intake-header { gap: 0.65rem; }
  html:not(.story-root) .header-right { gap: 0.65rem; }
  html:not(.story-root) .ghost-link { font-size: 0; }
  html:not(.story-root) .ghost-link::after { content: "Back"; font-size: 0.76rem; }
}
html:not(.story-root) form { padding: clamp(1.4rem, 3.4vw, 2.2rem); }
html:not(.story-root) .q { display: grid; gap: 0.55rem; }
html:not(.story-root) .q-label { font-weight: 600; font-size: 1rem; }
html:not(.story-root) .q-hint { color: var(--muted); font-size: 0.86rem; margin: -0.2rem 0 0; }
html:not(.story-root) input[type="text"], html:not(.story-root) input[type="email"], html:not(.story-root) input[type="tel"], html:not(.story-root) input[type="url"], html:not(.story-root) textarea, html:not(.story-root) select { width: 100%; font-family: inherit; font-size: 1rem; color: var(--ink); padding: 0.85rem 0.95rem; border-radius: var(--radius-sm); border: 1.5px solid var(--line); background: var(--paper); transition: border-color 0.18s, box-shadow 0.18s, background 0.18s; }
html:not(.story-root) textarea { resize: vertical; min-height: 6.5rem; line-height: 1.55; }
html:not(.story-root) input:focus, html:not(.story-root) textarea:focus, html:not(.story-root) select:focus { outline: none; border-color: var(--accent-deep); background: var(--white); box-shadow: 0 0 0 4px rgba(79, 130, 173, 0.16); }
html:not(.story-root) ::placeholder { color: #9aa5b1; }
html:not(.story-root) .tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(13.5rem, 1fr)); gap: 0.6rem; }
html:not(.story-root) .tile { position: relative; display: grid; gap: 0.2rem; cursor: pointer; padding: 0.9rem 1rem 0.9rem 2.75rem; border: 1.5px solid var(--line); border-radius: var(--radius-md); background: var(--white); min-height: 3.4rem; align-content: center; transition: border-color 0.18s, box-shadow 0.18s, background 0.18s, transform 0.18s var(--ease); }
html:not(.story-root) .tile:hover { border-color: var(--accent-dark); transform: translateY(-1px); }
html:not(.story-root) .tile input { position: absolute; opacity: 0; pointer-events: none; }
html:not(.story-root) .tile .box { position: absolute; left: 0.95rem; top: 50%; transform: translateY(-50%); width: 1.2rem; height: 1.2rem; border: 1.5px solid var(--line); border-radius: 0.32rem; background: var(--white); display: grid; place-items: center; transition: background 0.18s, border-color 0.18s; }
html:not(.story-root) .tile input[type="radio"] ~ .box { border-radius: 50%; }
html:not(.story-root) .tile .box::after { content: ""; width: 0.62rem; height: 0.33rem; margin-top: -2px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) scale(0.4); opacity: 0; transition: opacity 0.16s, transform 0.2s var(--ease); }
html:not(.story-root) .tile:has(input:checked) { border-color: var(--accent-deep); background: #f4f9fd; box-shadow: 0 0 0 3px rgba(79, 130, 173, 0.13); }
html:not(.story-root) .tile:has(input:checked) .box { background: var(--accent-deep); border-color: var(--accent-deep); }
html:not(.story-root) .tile:has(input:checked) .box::after { opacity: 1; transform: rotate(-45deg) scale(1); }
html:not(.story-root) .tile:has(input:focus-visible) { outline: 2px solid var(--accent-deep); outline-offset: 2px; }
html:not(.story-root) .tile b { font-weight: 600; font-size: 0.96rem; }
html:not(.story-root) .tile small { color: var(--muted); font-size: 0.81rem; line-height: 1.45; }
html:not(.story-root) .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; }
@media (max-width: 620px) {
  html:not(.story-root) .grid-2 { grid-template-columns: 1fr; }
}
html:not(.story-root) .field-error { color: var(--danger); font-size: 0.83rem; min-height: 1rem; display: block; }
html:not(.story-root) .step-actions { display: flex; align-items: center; gap: 0.7rem; margin-top: 2rem; padding-top: 1.4rem; border-top: 1px solid var(--line-soft); }
html:not(.story-root) .spacer { flex: 1; }
html:not(.story-root) .btn { font-family: inherit; font-size: 1rem; font-weight: 600; cursor: pointer; padding: 0.85rem 1.6rem; border-radius: 999px; min-height: 3rem; border: 1.5px solid transparent; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; transition: background 0.18s, border-color 0.18s, transform 0.14s, box-shadow 0.22s; }
html:not(.story-root) .btn:active { transform: scale(0.985); }
html:not(.story-root) .btn-primary { background: var(--accent-deep); color: #fff; box-shadow: 0 6px 18px rgba(47, 95, 133, 0.24); }
html:not(.story-root) .btn-primary:hover { background: #24506f; box-shadow: 0 10px 26px rgba(47, 95, 133, 0.3); }
html:not(.story-root) .btn-primary[disabled] { opacity: 0.55; cursor: default; }
html:not(.story-root) .btn:focus-visible { outline: 3px solid var(--accent-dark); outline-offset: 3px; }
html:not(.story-root) .form-status { margin: 1.2rem 0 0; font-size: 0.93rem; color: var(--danger); min-height: 1.2rem; }
html:not(.story-root) .form-status.is-success { color: var(--ok); }
html:not(.story-root) .form-status.is-error { font-weight: 600; padding-left: 0.7rem; border-left: 3px solid var(--danger); }
html:not(.story-root) .done-panel { padding: clamp(2rem, 5vw, 3.5rem); text-align: center; display: grid; justify-items: center; gap: 0.7rem; }
html:not(.story-root) .done-mark { width: 3.6rem; height: 3.6rem; border-radius: 50%; background: #e8f4ed; display: grid; place-items: center; margin-bottom: 0.4rem; }
html:not(.story-root) .done-mark::after { content: ""; width: 1.15rem; height: 0.58rem; margin-top: -5px; border-left: 2.6px solid var(--ok); border-bottom: 2.6px solid var(--ok); transform: rotate(-45deg); }
html:not(.story-root) .done-panel h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); letter-spacing: -0.025em; margin: 0; }
html:not(.story-root) .done-panel p { color: var(--muted); max-width: 46ch; margin: 0; }
html:not(.story-root) .done-actions { display: flex; gap: 0.7rem; flex-wrap: wrap; justify-content: center; margin-top: 1rem; }
html:not(.story-root) .hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
html:not(.story-root) .service-shell { display: grid; grid-template-columns: 20rem 1fr; gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; max-width: 68rem; margin: 0 auto; padding: clamp(1.5rem, 4vw, 3.5rem) clamp(1.1rem, 3vw, 2.4rem) 5rem; }
@media (max-width: 880px) {
  html:not(.story-root) .service-shell { grid-template-columns: 1fr; gap: 1.5rem; }
}
html:not(.story-root) .service-intro h1 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); line-height: 1.08; letter-spacing: -0.03em; margin: 0 0 0.7rem; }
html:not(.story-root) .service-lede { color: var(--muted); font-size: 0.97rem; margin: 0 0 1.6rem; }
html:not(.story-root) .service-times { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.7rem; }
html:not(.story-root) .service-times li { display: grid; gap: 0.1rem; padding: 0.7rem 0.85rem; background: var(--white); border: 1px solid var(--line-soft); border-radius: var(--radius-md); }
html:not(.story-root) .service-times b { font-size: 0.88rem; }
html:not(.story-root) .service-times span { font-size: 0.8rem; color: var(--muted); }
html:not(.story-root) #service-form { display: grid; gap: 1.4rem; }
html:not(.story-root) .pane { background: var(--white); border: 1px solid var(--line-soft); border-radius: var(--radius-lg); box-shadow: var(--shadow-2); overflow: hidden; }
html:not(.story-root) .rail-kicker { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent-deep); margin: 0 0 0.7rem; }
html:not(.story-root) .skip-link { position: fixed; top: 0.75rem; left: 0.75rem; z-index: 100; padding: 0.75rem 1rem; color: #fff; background: #0c1520; border-radius: 0.4rem; font-size: 0.9rem; text-decoration: none; transform: translateY(-200%); }
html:not(.story-root) .skip-link:focus { transform: translateY(0); outline: 2px solid #fff; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  html:not(.story-root) *, html:not(.story-root) *::before, html:not(.story-root) *::after { animation: none !important; transition: none !important; }
}