@charset "UTF-8";
:root { --ink:#192827; --muted:#62706a; --paper:#f7f8f4; --surface:#eef1e9; --line:#d9dfd4; --accent:#b9d47b; --radius:24px; font-family:"Segoe UI",Arial,sans-serif; color:var(--ink); background:var(--paper); font-synthesis:none; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:32px; }
body { margin:0; overflow-x:clip; }
button,input { font:inherit; }
button { cursor:pointer; }
button:focus-visible,summary:focus-visible { outline:3px solid #6a8c32; outline-offset:6px; }
button { -webkit-tap-highlight-color:transparent; }
img { display:block; max-width:100%; height:auto; }
figure,h1,h2,h3,p { margin:0; }
.wrap { max-width:1376px; margin-inline:auto; padding-inline:48px; }
.header { min-height:108px; display:flex; align-items:center; justify-content:space-between; gap:32px; border-bottom:1px solid var(--line); }
.wordmark { border:0; background:none; padding:0; text-align:left; display:flex; align-items:center; gap:11px; color:var(--ink); font-size:14px; line-height:1.18; letter-spacing:-.25px; }
.wordmark strong { font-weight:650; }
.brand-mark { width:42px; height:42px; stroke:var(--ink); fill:none; stroke-width:2; }
nav { display:flex; align-items:center; gap:26px; }
nav button { background:none; border:0; padding:12px 0; color:#52625c; font-size:14px; }
nav button:hover { color:var(--ink); }
.city-tag { display:flex; align-items:center; gap:9px; font-size:13px; border:1px solid #cbd4c4; border-radius:50px; padding:11px 17px; white-space:nowrap; }
.city-tag>span { width:6px; height:6px; border-radius:50%; background:#749744; }
.hero { display:grid; grid-template-columns:1.08fr 1fr; align-items:center; gap:50px; padding-top:66px; padding-bottom:52px; }
.eyebrow { font-size:11px; text-transform:uppercase; letter-spacing:1.8px; font-weight:600; display:flex; align-items:center; gap:9px; }
.tiny-line { width:25px; height:1px; background:var(--ink); }
h1 { font-weight:450; font-size:clamp(46px,4.75vw,72px); letter-spacing:-3.4px; line-height:1.04; margin:27px 0 27px; }
h1 em { font-weight:400; font-style:normal; color:#79836f; }
h1,h2 { overflow-wrap:anywhere; }
.hero-lead { color:#607068; font-size:15px; line-height:1.85; max-width:485px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:13px; margin-top:30px; align-items:center; }
.button { border-radius:100px; padding:16px 23px; border:0; display:inline-flex; align-items:center; justify-content:space-between; gap:21px; font-size:12px; line-height:1.25; font-weight:600; }
.primary { color:#f8faf5; background:var(--ink); }
.primary:hover { background:#2e4540; }
.text-button { background:transparent; color:var(--ink); padding-inline:12px; }
.hero-note { margin-top:28px; color:#778278; font-size:10px; display:flex; gap:9px; flex-wrap:wrap; }
.hero-note span { color:#a3b094; }
.hero-visual { position:relative; background:#e9ede5; border-radius:26px; padding:24px; align-self:stretch; min-height:525px; display:flex; flex-direction:column; justify-content:space-between; }
.visual-topline { display:flex; justify-content:space-between; align-items:center; font-size:10px; color:#6d776a; gap:20px; }
.visual-index { font:10px Consolas,monospace; color:#98a18f; }
.hero-visual>img { mix-blend-mode:multiply; margin:22px -20px 5px; max-width:calc(100% + 40px); width:calc(100% + 40px); aspect-ratio:1.3; object-fit:contain; }
.visual-bottom { display:flex; align-items:center; gap:9px; font-size:9px; color:#4b5b4e; }
.visual-dot { flex:none; width:5px; height:5px; background:#789e45; border-radius:50%; }
.visual-bottom svg { margin-left:auto; width:58px; height:22px; stroke:#789e45; fill:none; stroke-width:1.3; }
figcaption { font-size:9px; color:#7f897c; line-height:1.55; margin-top:18px; }
.principles { display:grid; grid-template-columns:repeat(4,1fr); padding-block:26px; border-block:1px solid var(--line); gap:20px; }
.principles p { font-size:11px; display:flex; align-items:center; gap:16px; color:#4d5b52; }
.principles p+ p { border-left:1px solid var(--line); padding-left:24px; }
.principles span { font:10px Consolas,monospace; color:#8b9a7e; }
.section { padding-top:100px; padding-bottom:100px; }
.section-heading { display:grid; grid-template-columns:1fr 2fr; gap:46px; margin-bottom:45px; }
.section-heading>.eyebrow { align-self:start; margin-top:11px; }
h2 { font-weight:450; font-size:clamp(32px,3.2vw,46px); letter-spacing:-1.8px; line-height:1.12; }
h2 em { font-style:normal; color:#819074; }
.section-intro { max-width:640px; font-size:14px; line-height:1.8; color:var(--muted); margin-top:23px; }
.case-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.case-card { border:1px solid var(--line); border-radius:19px; padding:30px; min-height:290px; display:flex; flex-direction:column; }
.case-card:nth-child(2) { background:#eaf0df; border-color:#eaf0df; }
.case-number { font:11px Consolas,monospace; color:#819173; margin-bottom:42px; }
h3 { font-size:19px; line-height:1.25; letter-spacing:-.5px; font-weight:500; }
.case-card p { color:var(--muted); font-size:13px; line-height:1.85; margin-top:18px; }
.situation-visual { display:grid; grid-template-columns:1.5fr 1fr; margin-top:30px; background:#eaf0df; border:1px solid var(--line); border-radius:22px; overflow:hidden; }
.situation-visual>img { width:100%; height:100%; aspect-ratio:1.5; object-fit:cover; min-width:0; }
.situation-visual>figcaption { margin:0; padding:36px; display:flex; flex-direction:column; justify-content:center; gap:18px; min-width:0; }
.situation-kicker { color:#66785a; font-size:9px; text-transform:uppercase; letter-spacing:1.5px; }
.situation-title { display:block; font-size:27px; font-weight:450; line-height:1.2; letter-spacing:-.8px; color:var(--ink); overflow-wrap:anywhere; }
.situation-visual p { font-size:13px; line-height:1.85; color:#5d6f55; }
.process-band { background:#23332e; color:#f4f6ef; }
.process-band .section-intro { color:#a5b4a9; }
.process-band .eyebrow { color:#bbcbaf; }
.steps { padding:0; margin:55px 0 0; display:grid; grid-template-columns:repeat(4,1fr); list-style:none; gap:28px; }
.steps li { border-top:1px solid #53634f; padding-top:25px; }
.step-number { font:11px Consolas,monospace; color:#a8c780; display:inline-block; margin-bottom:30px; }
.steps h3 { font-size:17px; min-height:44px; }
.steps p { color:#adbaaf; font-size:12px; line-height:1.9; margin-top:15px; }
.equipment-section { display:grid; grid-template-columns:1fr 1fr; gap:85px; align-items:center; }
.equipment-photo { padding:30px; border-radius:24px; background:#fff; border:1px solid #e5e9e0; }
.equipment-photo img { width:100%; aspect-ratio:1.2; object-fit:contain; }
.equipment-copy h2 { margin-block:25px; }
.equipment-copy>p:not(.eyebrow):not(.small-note) { color:var(--muted); font-size:14px; line-height:1.85; }
.clean-list { margin:26px 0; list-style:none; padding:0; }
.clean-list li { display:flex; align-items:center; gap:12px; font-size:12px; padding:11px 0; border-bottom:1px solid var(--line); }
.clean-list li span { width:6px; height:6px; border-radius:50%; background:#9bbd67; }
.small-note { color:#7b8779; font-size:10px; line-height:1.8; }
.device-gallery { padding-top:0; }
.device-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.device-card { min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:22px; background:#fff; }
.device-card>img { width:100%; aspect-ratio:1.5; object-fit:contain; }
.device-card>figcaption { display:grid; grid-template-columns:25px 1fr; align-items:center; gap:7px 15px; margin:0; padding:23px 26px; border-top:1px solid #e5e9e0; }
.device-number { color:#718265; font:10px Consolas,monospace; }
.device-name { color:var(--ink); font-size:19px; font-weight:500; letter-spacing:-.4px; }
.device-kind { grid-column:2; font-size:10px; color:#65725d; }
.city-guide { border-bottom:1px solid var(--line); padding-top:74px; }
.guide-heading { display:grid; grid-template-columns:1fr 1fr; gap:60px; margin:24px 0 36px; align-items:start; }
.guide-heading>p { font-size:14px; line-height:1.85; color:var(--muted); }
.guide-items { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; padding:0; margin:0; list-style:none; }
.guide-items>article,.guide-items>li { min-width:0; padding:28px; border:1px solid var(--line); border-radius:18px; background:#fff; }
.guide-items h3 { font-size:18px; line-height:1.4; }
.guide-items p { margin-top:15px; font-size:13px; line-height:1.85; color:var(--muted); }
.guide-cards .guide-items>article:nth-child(2) { background:#edf2e5; }
.guide-steps .guide-items { counter-reset:preparation; }
.guide-steps .guide-items>li { counter-increment:preparation; border:0; border-top:1px solid #b9c8aa; border-radius:0; background:none; padding:25px 14px 0 0; }
.guide-steps .guide-items>li::before { content:"0" counter(preparation); display:block; font:11px Consolas,monospace; color:#718265; margin-bottom:22px; }
.guide-table-wrap { border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#fff; }
.guide-table { width:100%; border-collapse:collapse; table-layout:fixed; font-size:13px; line-height:1.85; }
.guide-table caption { text-align:left; padding:20px 25px; background:#edf2e5; font-size:12px; font-weight:600; color:#52644b; }
.guide-table th,.guide-table td { text-align:left; vertical-align:top; padding:20px 25px; overflow-wrap:anywhere; }
.guide-table th:first-child { width:31%; }
.guide-table thead { font-size:11px; color:#718265; }
.guide-table tbody tr { border-top:1px solid var(--line); }
.guide-table tbody th { font-weight:500; color:var(--ink); }
.guide-table td { color:var(--muted); }
.faq-count { display:inline-block; margin-top:22px; padding:10px 13px; border:1px solid var(--line); border-radius:100px; color:#657653; font-size:10px; line-height:1.6; }
.questions-section>div:first-child { position:sticky; top:26px; align-self:start; }
.local-band { background:#eaf0df; }
.local-layout { padding-block:76px; display:grid; grid-template-columns:1.2fr 1fr; gap:100px; }
.local-layout h2 { margin:24px 0; }
.local-layout>div>p:last-child { font-size:14px; line-height:1.9; color:#5c6d57; max-width:630px; }
.preparation { border-left:1px solid #c4d3b5; padding-left:40px; align-self:center; }
.aside-label { font-size:9px; letter-spacing:1.5px; text-transform:uppercase; color:#6c7d63; }
.preparation h3 { margin:20px 0; font-size:24px; }
.preparation ul { list-style:none; padding:0; margin:0; counter-reset:items; }
.preparation li { position:relative; padding:10px 0 10px 27px; font-size:12px; line-height:1.75; color:#5a6b53; counter-increment:items; }
.preparation li::before { content:"0" counter(items); position:absolute; left:0; top:11px; color:#8b9b7d; font:9px Consolas,monospace; }
.price-section { display:grid; grid-template-columns:1fr 2fr; gap:46px; border-bottom:1px solid var(--line); }
.price-section>.eyebrow { align-self:start; margin-top:10px; }
.price-section>div>p { margin-top:23px; max-width:670px; font-size:14px; line-height:1.9; color:var(--muted); }
.price-factors { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.price-factors span { border:1px solid #d5dec9; padding:9px 13px; border-radius:100px; font-size:9px; color:#738169; }
.questions-section { display:grid; grid-template-columns:1fr 1.4fr; gap:90px; }
.questions-section h2 { margin-top:24px; }
.faq-aside { max-width:260px; font-size:12px; line-height:1.85; color:var(--muted); margin-top:23px; }
.faqs details { border-bottom:1px solid var(--line); padding:23px 0; }
.faqs details:first-child { border-top:1px solid var(--line); }
summary { cursor:pointer; list-style:none; display:flex; align-items:center; gap:20px; justify-content:space-between; font-size:14px; line-height:1.5; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+"; flex:none; font-size:22px; font-weight:300; color:#7d906b; }
details[open] summary::after { content:"−"; }
.faqs details p { margin-top:18px; font-size:12px; color:var(--muted); line-height:1.95; padding-right:20px; }
.closing { padding-block:47px; border-radius:24px; background:#dce8cc; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.closing>p { font-size:clamp(28px,3vw,42px); line-height:1.18; letter-spacing:-1.5px; }
.closing em { font-style:normal; color:#718364; }
.light-button { background:var(--paper); color:var(--ink); }
.footer { min-height:110px; display:flex; justify-content:space-between; align-items:center; gap:20px; color:#8a9384; font-size:9px; }
.consent { position:fixed; z-index:20; right:24px; bottom:24px; max-width:440px; background:#fff; border:1px solid var(--line); border-radius:18px; padding:25px; box-shadow:0 18px 70px #19282726; }
.consent[hidden] { display:none; }
.consent p { font-size:13px; color:var(--muted); line-height:1.7; }
.consent>div { display:flex; gap:10px; margin-top:18px; }
.secondary { background:#eef2e9; color:var(--ink); }
@media(min-width:1500px) { .hero { gap:70px; } }
@media(max-width:1100px) { .wrap { padding-inline:30px; } .hero { gap:30px; } h1 { font-size:58px; } nav { gap:15px; } nav button { font-size:12px; } .hero-visual { min-height:500px; padding:20px; } .hero-lead { font-size:14px; } .hero-note { font-size:9px; } .equipment-section { gap:45px; } .local-layout { gap:50px; } .case-card { padding:24px; } }
@media(max-width:820px) { .header { min-height:90px; } nav { display:none; } .hero { grid-template-columns:1fr; padding-top:40px; gap:35px; } h1 { font-size:65px; letter-spacing:-3px; } .hero-lead { max-width:610px; } .hero-visual { min-height:0; } .hero-visual>img { aspect-ratio:1.7; max-height:430px; } .principles { grid-template-columns:repeat(2,1fr); row-gap:20px; } .principles p:nth-child(3) { border-left:0; padding-left:0; } .section { padding-block:70px; } .section-heading { grid-template-columns:1fr; gap:22px; } .case-grid { grid-template-columns:1fr; } .case-card { min-height:0; } .case-number { margin-bottom:24px; } .steps { grid-template-columns:repeat(2,1fr); row-gap:35px; } .equipment-section { grid-template-columns:1fr; gap:35px; } .equipment-photo img { aspect-ratio:1.6; max-height:410px; } .local-layout { grid-template-columns:1fr; padding-block:60px; gap:35px; } .preparation { padding:25px; border:1px solid #c4d3b5; border-radius:18px; } .price-section { grid-template-columns:1fr; gap:24px; } .questions-section { grid-template-columns:1fr; gap:30px; } .faq-aside { max-width:500px; } .closing { margin-inline:20px; padding-inline:30px; } .footer { flex-wrap:wrap; padding-block:30px; min-height:100px; } }
@media(max-width:480px) { .wrap { padding-inline:22px; } .header { min-height:84px; gap:16px; } .wordmark { font-size:12px; gap:7px; } .brand-mark { width:32px; height:32px; } .city-tag { font-size:10px; padding:9px 12px; gap:6px; } .hero { padding-top:34px; padding-bottom:35px; } .eyebrow { font-size:9px; letter-spacing:1.45px; } h1 { font-size:49px; letter-spacing:-2.1px; margin-block:23px; } .hero-lead { font-size:13px; line-height:1.85; } .hero-actions { gap:10px; margin-top:24px; } .button { font-size:11px; padding:15px 18px; gap:15px; } .text-button { padding-inline:7px; } .hero-note { font-size:9px; gap:5px; line-height:1.8; margin-top:22px; } .hero-visual { padding:18px; border-radius:18px; } .visual-topline { font-size:8px; } .hero-visual>img { margin-block:15px 5px; aspect-ratio:1.45; } .visual-bottom { font-size:8px; gap:6px; } .visual-bottom svg { width:35px; } figcaption { font-size:8px; } .principles { padding-block:21px; gap:18px 10px; } .principles p { gap:10px; font-size:9px; } .principles p+p { padding-left:12px; } .principles p:nth-child(3) { padding-left:0; } h2 { font-size:33px; letter-spacing:-1.3px; } .section-intro { font-size:13px; line-height:1.9; } .section { padding-block:56px; } .case-card { padding:24px; border-radius:16px; } .case-card p { font-size:12px; } .steps { gap:28px 20px; margin-top:35px; } .steps h3 { font-size:16px; min-height:38px; } .steps p { font-size:11px; } .step-number { margin-bottom:22px; } .equipment-photo { padding:20px; } .equipment-photo img { aspect-ratio:1.2; } .equipment-copy>p:not(.eyebrow):not(.small-note) { font-size:13px; } .local-layout { padding-block:52px; } .local-layout>div>p:last-child { font-size:13px; } .price-section>div>p { font-size:13px; } .closing { flex-direction:column; align-items:flex-start; margin-inline:15px; padding:30px 25px; gap:25px; border-radius:20px; } .footer { font-size:8px; } summary { font-size:13px; } .consent { right:12px; bottom:12px; left:12px; max-width:none; padding:20px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }
@media(max-width:380px) { h1 { font-size:44px; letter-spacing:-1.8px; } .city-tag { white-space:normal; max-width:48%; line-height:1.3; } .city-tag>span { flex:none; } }
@media(max-width:480px) { h1 em { display:block; margin-top:5px; font-size:clamp(29px,8.8vw,43px); letter-spacing:-1.3px; overflow-wrap:normal; } }
@media(max-width:820px) { .device-gallery { padding-top:0; } .device-grid { gap:18px; } .device-card>figcaption { padding:18px; gap:5px 8px; grid-template-columns:20px 1fr; } .device-name { font-size:17px; } .device-kind { font-size:9px; } }
@media(max-width:600px) { .device-grid { grid-template-columns:1fr; } .device-card { border-radius:18px; } .device-card>figcaption { padding:20px; } .device-name { font-size:19px; } .device-kind { font-size:10px; } }
@media(max-width:820px) { .guide-heading { grid-template-columns:1fr; gap:22px; margin-bottom:28px; } .guide-items { grid-template-columns:1fr; gap:16px; } .guide-items>article,.guide-items>li { padding:24px; } .guide-steps .guide-items>li { padding:22px 0; } .questions-section>div:first-child { position:static; } }
@media(max-width:480px) { .guide-heading>p,.guide-items p { font-size:13px; } .guide-table { font-size:12px; line-height:1.8; } .guide-table th,.guide-table td { padding:15px 13px; } .guide-table th:first-child { width:34%; } .guide-table caption { padding:18px 13px; } .guide-items h3 { font-size:17px; } .faq-count { font-size:9px; margin-top:18px; } }
@media(max-width:820px) { .situation-visual { grid-template-columns:1fr; } .situation-visual>img { height:auto; } .situation-visual>figcaption { padding:30px; gap:15px; } .situation-title { font-size:26px; } }
@media(max-width:480px) { .situation-visual { border-radius:17px; margin-top:22px; } .situation-visual>figcaption { padding:24px; } .situation-title { font-size:23px; } .situation-visual p { font-size:12px; } .situation-kicker { font-size:8px; } }

/* Regional profiles share accessible components, with a deliberate composition per city. */
body[data-palette="navy"] { --ink:#192b42; --muted:#4c6075; --paper:#f5f7fa; --surface:#e8eef6; --line:#cbd5e2; --accent:#b7ccea; }
body[data-palette="sage"] { --ink:#233b2e; --muted:#4e6654; --paper:#f7f8f2; --surface:#e7eddf; --line:#cdd7c2; --accent:#bcd196; }
body[data-palette="clay"] { --ink:#49372e; --muted:#6e594b; --paper:#fbf7f0; --surface:#f1e5d5; --line:#ddcbb9; --accent:#d8ba94; }
body[data-palette="teal"] { --ink:#193e3e; --muted:#466766; --paper:#f3f8f6; --surface:#e0eeea; --line:#c1d8d1; --accent:#9ec8bb; }
body[data-palette="plum"] { --ink:#3a2e45; --muted:#66576e; --paper:#f9f6fa; --surface:#ece3ef; --line:#d6c8dd; --accent:#cab2d7; }
body[data-palette="slate"] { --ink:#293340; --muted:#53616f; --paper:#f6f7f9; --surface:#e7ebf0; --line:#cbd3dc; --accent:#afbfce; }
html { scroll-behavior:auto; }
body { color:var(--ink); background:var(--paper); }
.hero-copy,.hero-visual,.case-card,.method-copy { min-width:0; }
button:focus-visible,summary:focus-visible { outline-color:var(--ink); }
section[tabindex="-1"]:focus-visible { outline:2px solid var(--ink); outline-offset:4px; }
nav button,.city-tag,.hero-lead,.hero-note,.visual-topline,.visual-index,figcaption,
.principles p,.principles span,.case-number,.situation-kicker,.situation-visual p,
.small-note,.device-number,.device-kind,.faq-count,.local-layout>div>p:last-child,
.aside-label,.preparation li,.preparation li::before,.price-factors span,.footer,
.guide-table thead,.guide-table caption,.visual-bottom { color:var(--muted); }
h1 em,h2 em,.closing em,summary::after { color:var(--muted); }
.city-tag,.preparation,.price-factors span { border-color:var(--line); }
.city-tag>span,.visual-dot,.clean-list li span { background:var(--ink); }
.visual-bottom svg { stroke:var(--ink); }
.case-card:nth-child(2),.situation-visual,.hero-visual,.local-band,.closing,
.guide-cards .guide-items>article:nth-child(2),.guide-table caption { background:var(--surface); border-color:var(--line); }
.primary:hover { background:var(--ink); box-shadow:0 0 0 3px var(--accent); }
.hero { padding-top:58px; padding-bottom:54px; gap:52px; grid-template-columns:1.05fr 1fr; }
h1 { font-size:clamp(46px,4.7vw,68px); letter-spacing:-2.9px; }
.hero-lead { font-size:15px; max-width:560px; }
.hero>.situation-visual { display:grid; grid-template-columns:1fr; margin:0; align-self:center; border-radius:24px; box-shadow:0 18px 48px #172b3410; }
.hero>.situation-visual>img { width:100%; height:auto; aspect-ratio:1.5; object-fit:cover; }
.hero>.situation-visual>figcaption { padding:24px 28px; gap:12px; }
.hero .situation-title { font-size:23px; line-height:1.25; }
.hero .situation-visual p { font-size:12px; line-height:1.8; }
.situation-kicker { font-size:9px; line-height:1.7; }
body[data-hero="reverse"] .hero { grid-template-columns:1fr 1.05fr; }
body[data-hero="reverse"] .hero-copy { order:2; }
body[data-hero="reverse"] .hero>.situation-visual { order:1; }
body[data-hero="wide"] .hero { grid-template-columns:1fr; gap:34px; }
body[data-hero="wide"] .hero-copy { display:grid; grid-template-columns:1.15fr 1fr; column-gap:64px; }
body[data-hero="wide"] .hero-copy>.eyebrow { grid-column:1/-1; }
body[data-hero="wide"] h1 { grid-column:1; grid-row:2/5; margin:24px 0 0; }
body[data-hero="wide"] .hero-lead { grid-column:2; margin-top:28px; }
body[data-hero="wide"] .hero-actions,body[data-hero="wide"] .hero-note { grid-column:2; }
body[data-hero="wide"] .hero>.situation-visual { grid-template-columns:1.6fr 1fr; }
body[data-hero="wide"] .hero .situation-title { font-size:30px; }
body[data-hero="wide"] .hero>.situation-visual>figcaption { padding:40px; }
.principles p { line-height:1.7; }
.method-overview { display:grid; grid-template-columns:.7fr 1.3fr; gap:70px; align-items:center; padding-top:64px; padding-bottom:64px; border-bottom:1px solid var(--line); }
.method-overview .hero-visual { min-height:0; padding:20px; border-radius:18px; max-width:350px; }
.method-overview .hero-visual>img { aspect-ratio:1.5; max-height:190px; width:100%; max-width:100%; margin:14px 0; }
.method-overview figcaption { font-size:10px; line-height:1.7; }
.method-overview .visual-topline { font-size:9px; }
.method-overview .visual-bottom { font-size:9px; }
.method-copy h2 { font-size:clamp(28px,2.7vw,38px); margin:20px 0; letter-spacing:-1.1px; }
.method-intro { font-size:14px; line-height:1.85; color:var(--muted); }
.method-points { list-style:none; padding:0; margin:20px 0 0; display:grid; gap:10px; }
.method-points li { display:flex; gap:12px; font-size:12px; line-height:1.8; color:var(--muted); }
.method-points li::before { content:"↗"; color:var(--ink); flex:none; }
.process-band { background:var(--ink); }
.process-band .section-intro,.steps p { color:#e1e6e9; }
.process-band .eyebrow,.step-number { color:#ecf1f3; }
.steps li { border-color:#ffffff55; }
body[data-cards="rows"] .case-grid { grid-template-columns:1fr; gap:14px; }
body[data-cards="rows"] .case-card { min-height:0; display:grid; grid-template-columns:36px .8fr 1.8fr; align-items:start; gap:24px; border-radius:14px; }
body[data-cards="rows"] .case-number { margin:3px 0 0; }
body[data-cards="rows"] .case-card p { margin:0; }
body[data-cards="split"] .case-grid { grid-template-columns:1fr 1fr; }
body[data-cards="split"] .case-card:first-child { grid-row:1/3; justify-content:center; background:var(--surface); }
body[data-cards="split"] .case-card:not(:first-child) { min-height:0; background:transparent; }
body[data-cards="split"] .case-card:not(:first-child) .case-number { margin-bottom:20px; }
body[data-steps="list"] .steps { grid-template-columns:1fr 1fr; gap:30px 50px; }
body[data-steps="list"] .steps li { display:grid; grid-template-columns:30px 1fr; gap:12px 20px; }
body[data-steps="list"] .steps h3 { min-height:0; }
body[data-steps="list"] .step-number { margin:0; padding-top:4px; }
body[data-steps="list"] .steps p { grid-column:2; margin:0; }
body[data-faq="boxed"] .faqs details { background:#fff; border:1px solid var(--line); border-radius:14px; padding:24px; margin-bottom:12px; }
.guide-steps .guide-items>li,.device-card>figcaption { border-color:var(--line); }
.guide-steps .guide-items>li::before { color:var(--muted); }
.guide-table caption { font-size:13px; }
.faq-count,.price-factors span { font-size:11px; }
.small-note { font-size:12px; }
.footer { font-size:11px; }
@media(max-width:1100px) {
  .header { gap:20px; } nav { gap:13px; }
  .hero { gap:32px; } .hero .situation-title { font-size:21px; }
  .hero>.situation-visual>figcaption { padding:23px; }
  .method-overview { gap:38px; }
  body[data-hero="wide"] .hero-copy { column-gap:38px; }
  body[data-hero="wide"] .hero .situation-title { font-size:26px; }
}
@media(max-width:820px) {
  .header { flex-wrap:wrap; gap:20px; padding-top:22px; padding-bottom:14px; }
  .header .wordmark { order:1; } .header .city-tag { order:2; margin-left:auto; }
  .header nav { order:3; display:flex; width:100%; max-width:100%; overflow-x:auto; gap:22px; scrollbar-width:thin; }
  .header nav button { flex:none; font-size:12px; white-space:nowrap; padding:10px 0; }
  .hero,body[data-hero="reverse"] .hero,body[data-hero="wide"] .hero { grid-template-columns:1fr; padding-top:36px; gap:30px; }
  body[data-hero="reverse"] .hero-copy,body[data-hero="reverse"] .hero>.situation-visual { order:initial; }
  body[data-hero="wide"] .hero-copy { display:block; }
  body[data-hero="wide"] h1 { margin:24px 0; }
  body[data-hero="wide"] .hero-lead { margin:0; }
  h1 { font-size:60px; letter-spacing:-2.6px; }
  .hero>.situation-visual,body[data-hero="wide"] .hero>.situation-visual { grid-template-columns:1fr; }
  .hero .situation-title,body[data-hero="wide"] .hero .situation-title { font-size:25px; }
  .hero>.situation-visual>figcaption,body[data-hero="wide"] .hero>.situation-visual>figcaption { padding:28px; }
  .method-overview { grid-template-columns:1fr; padding-block:50px; gap:30px; }
  .method-copy { grid-row:1; } .method-overview .hero-visual { max-width:100%; }
  .method-overview .hero-visual>img { max-height:230px; }
  .method-overview .visual-topline { font-size:10px; }
  .method-copy h2 { font-size:32px; }
  body[data-cards="split"] .case-grid,body[data-cards="rows"] .case-grid { grid-template-columns:1fr; }
  body[data-cards="split"] .case-card:first-child { grid-row:auto; }
  body[data-cards="rows"] .case-card { display:flex; gap:0; }
  body[data-cards="rows"] .case-number { margin:0 0 24px; }
  body[data-cards="rows"] .case-card p { margin-top:18px; }
  body[data-steps="list"] .steps { grid-template-columns:1fr; gap:28px; }
}
@media(max-width:480px) {
  .header { padding-top:20px; gap:15px; }
  .header nav { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:7px; overflow:visible; }
  .header nav button { grid-column:span 2; font-size:11px; padding:9px 4px; border:1px solid var(--line); border-radius:8px; background:var(--surface); }
  .header nav button:nth-child(n+4) { grid-column:span 3; }
  h1 { font-size:49px; letter-spacing:-2.1px; }
  h1 em { overflow-wrap:normal; }
  .hero { padding-bottom:32px; }
  .hero-lead { font-size:14px; line-height:1.85; }
  .hero>.situation-visual { border-radius:18px; }
  .hero .situation-title,body[data-hero="wide"] .hero .situation-title { font-size:23px; }
  .hero>.situation-visual>figcaption,body[data-hero="wide"] .hero>.situation-visual>figcaption { padding:24px; }
  .hero .situation-visual p { font-size:13px; }
  .method-overview { padding-block:40px; }
  .method-copy h2 { font-size:30px; }
  .method-intro { font-size:13px; }
  .method-points li { font-size:12px; }
  .method-overview .hero-visual>img { max-height:190px; }
  .case-card p,.steps p,.faqs details p { font-size:13px; }
  .steps { grid-template-columns:1fr; }
  .steps h3 { min-height:0; font-size:18px; }
  .step-number { margin-bottom:18px; }
  body[data-faq="boxed"] .faqs details { padding:20px; }
  .footer { font-size:10px; }
}
@media(max-width:380px) { h1 { font-size:44px; } }

.contact-section { border-top:1px solid var(--line); }
.contact-heading { display:grid; grid-template-columns:1.2fr 1fr; gap:60px; align-items:end; margin-bottom:34px; }
.contact-heading h2 { margin-top:22px; }
.contact-heading>p { color:var(--muted); font-size:14px; line-height:1.85; }
.contact-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.contact-option { display:flex; flex-direction:column; gap:14px; padding:25px 22px; min-width:0; border:1px solid var(--line); border-radius:18px; background:#fff; text-decoration:none; color:var(--ink); }
.contact-option:hover { background:var(--surface); }
.contact-option:focus-visible,.max-dialog a:focus-visible { outline:3px solid var(--ink); outline-offset:4px; }
.contact-kind { font-size:10px; text-transform:uppercase; letter-spacing:1px; color:var(--muted); }
.contact-option strong { font-size:23px; font-weight:500; line-height:1.4; overflow-wrap:anywhere; }
.contact-phone strong { font-size:clamp(14px,1.55vw,21px); white-space:nowrap; }
.contact-hint { color:var(--muted); font-size:11px; line-height:1.7; }
.contact-draft-box { display:flex; flex-wrap:wrap; gap:24px; align-items:center; justify-content:space-between; padding:26px 28px; background:var(--surface); border:1px solid var(--line); border-radius:18px; margin-top:20px; }
.contact-draft-box>div { flex:1 1 450px; min-width:0; }
.contact-draft-label { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:1px; }
#contact-draft { font-size:15px; line-height:1.85; margin-top:12px; }
.contact-section .secondary { background:var(--paper); color:var(--ink); border:1px solid var(--line); }
.contact-status { color:var(--muted); font-size:12px; line-height:1.8; }
.contact-draft-box>.contact-status { flex:1 1 100%; }
.contact-status:empty { display:none; }
.contact-nav-button { font-weight:650; color:var(--ink); }
.max-dialog { width:min(600px,calc(100% - 32px)); max-height:calc(100vh - 40px); overflow:auto; border:1px solid var(--line); border-radius:22px; padding:30px; background:var(--paper); color:var(--ink); box-shadow:0 25px 90px #15263340; }
.max-dialog::backdrop { background:#14242bc9; }
.max-dialog-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.max-dialog h3 { font-size:25px; }
.dialog-close { border:1px solid var(--line); color:var(--ink); background:var(--surface); width:38px; height:38px; border-radius:50%; font-size:25px; line-height:1; flex:none; }
.max-dialog>p { font-size:14px; line-height:1.85; margin-top:20px; color:var(--muted); }
.max-dialog label { display:block; margin:22px 0 10px; font-size:12px; color:var(--muted); }
.max-dialog textarea { width:100%; min-height:128px; resize:vertical; font:14px/1.8 "Segoe UI",Arial,sans-serif; padding:16px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:12px; }
.max-dialog-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; }
.max-dialog-actions a { text-decoration:none; }
.max-dialog-actions .secondary { background:var(--surface); color:var(--ink); }
@media(max-width:1100px) { .header nav { gap:11px; } .header nav button { font-size:11px; } .contact-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .contact-phone strong { font-size:21px; } }
@media(max-width:820px) { .contact-heading { grid-template-columns:1fr; gap:22px; } .contact-draft-box { padding:24px; } }
@media(max-width:480px) { .header nav button:nth-child(n+4) { grid-column:span 2; } .header nav .contact-nav-button { background:var(--ink); color:#fff; border-color:var(--ink); } .contact-grid { grid-template-columns:1fr; gap:12px; } .contact-option { padding:22px; gap:10px; } .contact-option strong { font-size:23px; } .contact-phone strong { font-size:21px; } .contact-heading>p,#contact-draft { font-size:13px; } .contact-draft-box { padding:22px; } .max-dialog { padding:22px; } .max-dialog h3 { font-size:22px; } .max-dialog-actions { flex-direction:column; } }