:root{--night:#10272c;--ink:#123039;--acid:#e8f46e;--orange:#f87742;--paper:#e9e7da;--line:#b0bab1}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:Arial,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;line-height:1.65}a{color:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--orange);outline-offset:3px}.skip{position:absolute;top:-80px;left:10px;background:white;padding:8px;z-index:20}.skip:focus{top:8px}
.fiction{background:var(--acid);padding:7px 18px;text-align:center;font-size:10px;font-weight:800;letter-spacing:.07em}.bar{display:flex;align-items:center;justify-content:space-between;gap:20px;background:var(--night);color:white;padding:12px clamp(18px,4vw,70px)}.logo{display:flex;align-items:center;gap:13px;color:white;text-decoration:none;font-size:25px;font-weight:900;line-height:1;letter-spacing:-.08em}.logo-mark{display:grid;place-items:center;width:54px;height:54px;background:var(--orange);color:var(--night);font-size:20px;border-radius:7px}.logo small{display:block;font-size:8px;letter-spacing:.22em;font-weight:700;margin-top:7px}.bar nav{display:flex;gap:30px;align-items:center;font-size:12px;font-weight:700}.bar nav a{text-decoration:none}.bar nav a:hover{text-decoration:underline}.bar .all{background:var(--acid);color:var(--night);padding:10px 15px}
.hero{position:relative;min-height:min(830px,78vw);height:calc(100svh - 100px);max-height:900px;background:#24404a;color:white;overflow:hidden}.hero-picture{position:absolute;inset:0}.hero-picture img{width:110%;height:110%;object-fit:cover;object-position:center 60%;display:block;filter:contrast(1.1) saturate(.9) brightness(.72);animation:window-drift 22s ease-in-out infinite alternate}.hero-glass{position:absolute;inset:0;background:linear-gradient(90deg,#071a25c9 0,#081c2b44 50%,#081b2188 100%),linear-gradient(0deg,#0b1d27ed,transparent 55%)}.horizon{position:absolute;inset:24% 0 auto;border-top:1px solid #ffffff55}.road{position:absolute;bottom:-20%;left:52%;width:30%;height:60%;clip-path:polygon(48% 0,52% 0,100% 100%,0 100%);background:#061b23af;opacity:.65}.road-line{position:absolute;left:49%;top:0;width:2%;height:100%;background:repeating-linear-gradient(0deg,transparent 0 60px,#e9f5b1 60px 95px,transparent 95px 170px);animation:road-move 3s linear infinite}.hero-over{position:relative;z-index:2;padding:clamp(45px,8vw,115px) clamp(25px,5vw,85px) 35px;height:100%;display:flex;flex-direction:column}.hero-over>p{margin:0;font:800 12px/1.5 Arial,sans-serif;letter-spacing:.25em;color:var(--acid)}.hero h1{margin:auto 0 0;font-size:clamp(80px,13vw,210px);line-height:.94;letter-spacing:-.12em;font-weight:900;white-space:nowrap;text-shadow:0 5px 15px #0007}.hero h1 span,.hero h1 strong{display:block}.hero h1 strong{margin-left:20%;font-weight:900;color:var(--acid)}.hero-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-top:auto}.hero-bottom p{max-width:400px;font-size:15px;font-weight:700;line-height:1.9}.hero-bottom a{display:flex;align-items:center;justify-content:space-between;gap:35px;min-width:220px;border:1px solid var(--acid);padding:14px 17px;background:var(--acid);color:var(--night);font-size:15px;font-weight:900;text-decoration:none}.hero-bottom b{font-size:23px}.hero-counter{position:absolute;right:2vw;top:-.2em;font:900 clamp(200px,30vw,500px)/1 Arial,sans-serif;letter-spacing:-.12em;opacity:.16}.hero-counter span{color:var(--acid)}
.road-sign{display:flex;align-items:center;gap:0;background:var(--orange);color:var(--night);font-size:12px;font-weight:900;letter-spacing:.12em;white-space:nowrap;overflow:hidden}.road-sign span{padding:10px 25px;border-right:2px solid #183239;flex:1;text-align:center}
.routes{background:var(--night);color:white;padding:95px clamp(20px,5vw,90px) 80px}.route-head{display:grid;grid-template-columns:120px 1.2fr .8fr;gap:30px;align-items:end;margin-bottom:45px}.route-head>span,.compare-headline>span,.closing>span{font-size:11px;font-weight:900;letter-spacing:.16em;color:var(--acid);align-self:start;padding-top:15px}.route-head h2,.compare h2,.closing h2{font-size:clamp(50px,7vw,112px);letter-spacing:-.09em;line-height:1.05;margin:0;font-weight:900}.route-head>p{font-size:14px;max-width:300px}.windshield{position:relative;height:clamp(470px,56vw,720px);border:10px solid #617578;border-radius:20px 20px 80px 80px;overflow:hidden;background:#77959a;box-shadow:inset 0 0 0 3px #d5e8e0,0 25px 0 #071a20}.windshield img{display:block;width:110%;height:110%;object-fit:cover;object-position:center;filter:brightness(.78) saturate(.8);animation:window-drift 18s ease-in-out infinite alternate;transition:filter .6s,object-position .6s}.windshield[data-scene=hills] img{filter:hue-rotate(35deg) saturate(.75) brightness(.6);object-position:left center}.windshield[data-scene=town] img{filter:hue-rotate(150deg) saturate(.5) brightness(.57);object-position:right center}.windshield-shade{position:absolute;inset:0;background:linear-gradient(90deg,#091d24dd 0,#0b202856 58%,#0c222855 100%),linear-gradient(0deg,#0a2025db,transparent 55%)}.view-caption{position:absolute;top:25px;left:30px;right:30px;display:flex;align-items:start;justify-content:space-between;gap:30px;font-size:11px;font-weight:900;letter-spacing:.14em}.view-caption small{font-size:10px;color:var(--acid)}.view-caption span{font-size:clamp(32px,5vw,70px);line-height:1;letter-spacing:-.09em}.route-panel{position:absolute;bottom:35px;left:45px;right:45px;max-width:700px}.route-panel>p:first-child{color:var(--acid);font-size:13px;font-weight:800}.route-panel h3{font-size:clamp(52px,8vw,125px);letter-spacing:-.11em;line-height:1;margin:10px 0;font-weight:900}.route-panel>p:nth-child(3){max-width:430px;font-size:14px;font-weight:600}.stops{display:flex;align-items:center;flex-wrap:wrap;gap:10px;border-top:1px solid #ffffff72;padding-top:15px;font-size:12px;font-weight:700}.stops b{color:var(--acid);font-size:20px}.route-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:40px;border-top:1px solid #617579;border-bottom:1px solid #617579}.route-tabs button{border:0;border-right:1px solid #617579;background:transparent;color:white;padding:18px 20px;text-align:left;cursor:pointer;display:grid;grid-template-columns:1fr auto}.route-tabs button:first-child{border-left:1px solid #617579}.route-tabs button span{grid-column:1/-1;font:800 10px Arial,sans-serif;letter-spacing:.15em;color:#a9c0bc}.route-tabs button b{font-size:clamp(15px,2vw,27px);margin-top:6px}.route-tabs button i{font-style:normal;font-size:26px}.route-tabs button[aria-pressed=true]{background:var(--acid);color:var(--night)}.route-tabs button[aria-pressed=true] span{color:var(--night)}.routes .small-note{font-size:11px;color:#bfd1cf;margin-top:22px}
.dashboard{position:relative;display:grid;grid-template-columns:55% 45%;min-height:470px;background:var(--orange);color:var(--night);overflow:hidden}.dashboard-visual{min-width:0}.dashboard-visual img{display:block;width:100%;height:100%;object-fit:cover;filter:contrast(1.1) saturate(.5)}.dashboard-copy{padding:clamp(45px,6vw,100px);align-self:center}.dashboard-copy span{font-size:11px;font-weight:900;letter-spacing:.2em}.dashboard-copy h2{font-size:clamp(55px,7vw,110px);line-height:1.06;letter-spacing:-.1em;margin:23px 0}.dashboard-copy p{max-width:360px;font-size:15px;font-weight:700}.dashboard-arrow{position:absolute;right:20px;bottom:-120px;font-size:400px;line-height:1;color:#edb38e;pointer-events:none}
.compare{padding:100px clamp(20px,5vw,90px);background:var(--paper)}.compare-headline{display:grid;grid-template-columns:135px 1.2fr .8fr;gap:30px;align-items:end;margin-bottom:55px}.compare-headline>span{color:#bf572c}.compare-headline p{font-size:14px;max-width:310px}.filter-board{display:grid;grid-template-columns:1fr 1fr;gap:25px;padding:25px;background:#d3d9ce;border-top:8px solid var(--night)}.filter-board>div>p{font-size:12px;font-weight:900;margin:0 0 10px}.choice-group{display:flex;flex-wrap:wrap;gap:5px}.choice-group button{border:1px solid var(--night);padding:9px 13px;background:transparent;color:var(--night);font:800 12px Arial,sans-serif;cursor:pointer}.choice-group button[aria-pressed=true]{background:var(--night);color:var(--acid)}.recommendation{grid-column:1/-1;font-size:13px;font-weight:700;border-top:1px solid #9eafa6;padding-top:14px;margin:0}.vehicle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px}.vehicle{position:relative;display:flex;flex-direction:column;min-height:400px;padding:28px;background:#f7f7ed;border:2px solid var(--night);clip-path:polygon(0 0,calc(100% - 35px) 0,100% 35px,100% 100%,0 100%)}.vehicle:before{content:"";position:absolute;right:0;top:0;border-top:35px solid var(--paper);border-left:35px solid transparent}.vehicle.recommended{background:var(--acid)}.vehicle-top{display:flex;justify-content:space-between;gap:15px;font-size:11px;font-weight:900;letter-spacing:.12em}.vehicle-icon{font-size:35px;line-height:1}.vehicle h3{font-size:clamp(35px,4vw,62px);line-height:1.07;letter-spacing:-.09em;margin:35px 0 15px}.vehicle>p{font-size:13px;max-width:270px}.vehicle dl{margin:auto 0 24px}.vehicle dl div{display:flex;gap:10px;border-top:1px solid #a9b9ad;padding:7px 0;font-size:11px}.vehicle dt{width:80px;flex:none;font-weight:900}.vehicle dd{margin:0}.vehicle button{border:0;background:var(--night);color:white;padding:12px 15px;font:800 13px Arial,sans-serif;cursor:pointer;text-align:left}.vehicle button[aria-pressed=true]{background:var(--orange);color:var(--night)}.vehicle button:disabled{opacity:.35;cursor:not-allowed}
.comparison{background:var(--night);color:white;padding:clamp(25px,4vw,55px);margin-top:20px}.comparison-title{display:flex;align-items:end;justify-content:space-between;gap:20px;border-bottom:1px solid #7f9895;padding-bottom:20px}.comparison-title small{font-size:10px;letter-spacing:.16em;color:var(--acid)}.comparison-title h3{font-size:clamp(26px,3vw,45px);letter-spacing:-.06em;line-height:1.2;margin:8px 0 0}.comparison-title button{background:transparent;color:white;border:0;border-bottom:1px solid currentColor;font-size:12px;cursor:pointer;white-space:nowrap}.comparison-title button:disabled{opacity:.4;cursor:not-allowed}.comparison #empty{font-size:14px;margin:30px 0}.comparison-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin:20px 0}.comparison-grid article{background:#2b474c;padding:24px}.comparison-grid h4{font-size:25px;margin:0 0 15px}.comparison-grid p{border-top:1px solid #739093;padding-top:7px;font-size:13px}.comparison .small-note{font-size:11px;color:#b2c9c4;border-top:1px solid #678181;padding-top:15px}
.closing{display:grid;grid-template-columns:150px 1.2fr .8fr;gap:30px;padding:90px clamp(20px,5vw,90px);background:#d2dbd1}.closing>span{color:#b74b2d}.closing p{font-size:14px;max-width:340px;margin:0}.closing a{grid-column:3;justify-self:start;align-self:end;font-size:13px;font-weight:900;text-decoration:none;border-bottom:2px solid}footer{display:flex;justify-content:space-between;gap:20px;background:var(--night);color:white;padding:28px clamp(20px,5vw,90px);font-size:12px}footer a{text-decoration:none;border-bottom:1px solid}
@keyframes window-drift{from{transform:translateX(-3%) scale(1.03)}to{transform:translateX(2%) scale(1.08)}}@keyframes road-move{to{transform:translateY(170px)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-picture img,.windshield img,.road-line{animation:none}.windshield img{transition:none}}
@media(max-width:1050px){.hero h1{font-size:clamp(66px,12vw,125px)}.route-head,.compare-headline,.closing{grid-template-columns:1fr 1fr}.route-head>span,.compare-headline>span,.closing>span{grid-column:1/-1}.vehicle{padding:18px;min-height:420px}.vehicle h3{font-size:35px}}
@media(max-width:700px){.bar nav a:not(.all){display:none}.bar nav{gap:0}.bar .all{font-size:10px}.hero{height:680px;min-height:0}.hero-over{padding:30px 20px}.hero-over>p{font-size:9px}.hero h1{font-size:clamp(56px,14vw,93px);white-space:normal}.hero h1 strong{margin-left:0}.hero-bottom{display:block}.hero-bottom p{font-size:12px;max-width:300px}.hero-bottom a{max-width:220px;margin-top:17px}.hero-counter{font-size:240px;top:8%}.road-sign{font-size:10px}.road-sign span{padding:9px 15px}.road-sign span:nth-child(4),.road-sign span:nth-child(5){display:none}.routes{padding:70px 18px}.route-head,.compare-headline{display:block;margin-bottom:30px}.route-head h2,.compare h2{font-size:clamp(50px,11vw,78px);margin:15px 0}.route-head>p,.compare-headline p{font-size:12px}.windshield{height:570px;border-width:6px;border-radius:15px 15px 40px 40px}.view-caption{top:18px;left:18px;right:18px}.view-caption small{max-width:125px;font-size:8px}.view-caption span{font-size:34px}.route-panel{left:20px;right:20px;bottom:20px}.route-panel h3{font-size:clamp(48px,10vw,70px)}.route-panel>p:nth-child(3){font-size:12px}.stops{font-size:10px;gap:6px}.route-tabs button{padding:12px 6px}.route-tabs button span{font-size:8px}.route-tabs button b{font-size:12px}.route-tabs button i{display:none}.dashboard{display:block}.dashboard-visual{height:250px}.dashboard-copy{padding:40px 23px}.dashboard-copy h2{font-size:65px}.dashboard-arrow{font-size:280px;bottom:-90px}.compare{padding:70px 18px}.filter-board{display:block}.filter-board>div+div{margin-top:20px}.recommendation{margin-top:20px}.vehicle-grid{grid-template-columns:1fr}.vehicle{min-height:330px;padding:25px}.vehicle h3{font-size:47px;margin:20px 0 10px}.vehicle dl{margin:10px 0 20px}.comparison-grid{grid-template-columns:1fr}.closing{display:block;padding:70px 20px}.closing h2{font-size:60px;margin:20px 0}.closing a{display:inline-block;margin-top:22px}footer{display:block}footer a{display:inline-block;margin-top:10px}}
@media(max-width:390px){.logo{font-size:18px}.logo-mark{height:43px;width:43px;font-size:16px}.logo small{font-size:7px}.hero{height:620px}.hero h1{font-size:54px}.route-tabs button b{font-size:11px}.windshield{height:600px}.route-panel h3{font-size:47px}}

/* Japanese prose: balance short final lines while respecting punctuation. */
h1,h2,h3,p{line-break:strict}
p:not(.overline):not(.hero-side):not(.eyebrow){text-wrap:pretty}

/* 2026-10-31: roadside sign title over the real-looking vehicle scene. */
.hero-picture img{width:100%;height:100%;filter:contrast(1.04) saturate(.98) brightness(.91);animation:none}.hero-glass{background:linear-gradient(90deg,#071a254d 0,#081c2b0d 53%,#081b213d 100%),linear-gradient(0deg,#0b1d27ef,transparent 48%)}.hero .horizon,.hero .road,.hero-counter{display:none}.hero-over{align-items:stretch}.hero h1{align-self:flex-end;margin:clamp(35px,6vw,80px) 0 auto auto;padding:clamp(15px,2vw,28px) clamp(18px,3vw,45px);background:var(--acid);color:var(--night);font-size:clamp(66px,7vw,112px);line-height:1.05;letter-spacing:-.105em;text-shadow:none;white-space:normal;box-shadow:12px 12px 0 #10272cbb}.hero h1 span{display:block}.hero h1 strong{display:block;margin:12px 0 0;font-size:clamp(21px,2.2vw,34px);line-height:1.35;letter-spacing:-.05em;color:var(--night);font-weight:900}.hero-bottom{margin-top:auto}.hero-bottom p{max-width:445px}.road-sign{border-top:4px solid var(--night)}
@media(max-width:700px){.hero{height:630px}.hero-over{padding:25px 20px 28px}.hero h1{align-self:flex-end;margin:50px 0 auto auto;padding:13px 14px;font-size:clamp(43px,11.5vw,70px);max-width:100%;box-shadow:7px 7px 0 #10272cbb}.hero h1 strong{font-size:clamp(16px,4.2vw,23px);margin-top:8px}.hero-bottom p{max-width:315px}.hero-picture img{object-position:57% center}.hero-bottom a{max-width:260px}}
@media(max-width:390px){.hero{height:600px}.hero h1{font-size:43px}}
