:root{--ink:#080908;--paper:#f1f0ea;--blue:#72c8e3;--pad:clamp(22px,4.5vw,72px)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:78px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"Helvetica Neue","Yu Gothic",sans-serif}a{color:inherit;text-decoration:none}.d-head{position:fixed;z-index:50;top:0;left:0;width:100%;padding:20px var(--pad);display:flex;align-items:center;justify-content:space-between;mix-blend-mode:difference;color:#fff}.d-logo{width:clamp(112px,10vw,158px)}.d-logo img{display:block;width:100%;filter:brightness(0) invert(1)}.d-head nav{display:flex;gap:28px;font-size:10px;letter-spacing:.16em}.d-head .is-current{color:var(--blue)}.d-menu{display:none;border:0;background:none;color:inherit;font:inherit;letter-spacing:.16em}.d-hero{min-height:88svh;padding:clamp(120px,15vh,180px) var(--pad) 8vh;background:#07110f;color:#fff;display:grid;grid-template-columns:1fr 1.5fr;align-content:space-between}.d-hero>p{font-size:11px;letter-spacing:.2em}.d-hero h1{grid-column:1/-1;margin:8vh 0 6vh;font-size:clamp(4.5rem,11vw,11rem);line-height:.76;letter-spacing:-.085em}.d-hero h1 span{display:block}.d-hero h1 span:last-child{margin-left:11vw;color:var(--blue);font-style:italic}.d-hero>div{grid-column:2;border-top:1px solid #ffffff55;padding-top:20px;display:grid;grid-template-columns:1fr 1.4fr;gap:24px}.d-hero strong{font-size:11px;letter-spacing:.14em}.d-hero div p{margin:0;font-size:12px;line-height:1.9}.d-regions{position:sticky;z-index:20;top:0;display:grid;grid-template-columns:repeat(8,1fr);background:var(--paper);border-bottom:1px solid #0003}.d-regions a{padding:19px 8px;text-align:center;font-size:11px;letter-spacing:.1em;border-right:1px solid #0002}.d-regions a:hover{background:var(--ink);color:#fff}.d-list{padding:0 var(--pad)}.d-region{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1.8fr);column-gap:clamp(32px,7vw,110px);padding:11vh 0;border-bottom:1px solid #0003}.d-region>header{grid-row:1/span 20;position:sticky;top:92px;align-self:start}.d-region>header span{font-size:10px;letter-spacing:.16em;color:#666}.d-region h2{font-size:clamp(2.8rem,5.8vw,6.5rem);line-height:.85;letter-spacing:-.07em;margin:24px 0 12px}.d-region>header p{font-size:12px;letter-spacing:.18em}.d-pref{grid-column:2;display:grid;grid-template-columns:130px 1fr 1fr;gap:0 18px;border-top:1px solid #0004}.d-pref+.d-pref{margin-top:62px}.d-pref h3{grid-row:1/span 20;margin:0;padding:20px 0;font-size:13px;letter-spacing:.12em}.d-pref article{min-width:0;padding:20px 0 24px;border-bottom:1px solid #0002}.d-pref h4{margin:0 0 15px;font-size:15px;line-height:1.5}.d-pref address{min-height:3.8em;font-style:normal;font-size:12px;line-height:1.75;color:#555}.d-pref article>a{display:inline-block;margin-top:14px;font-size:12px;letter-spacing:.08em;border-bottom:1px solid #000}.d-note{padding:13vh var(--pad);background:#0a0b0b;color:#fff;display:grid;grid-template-columns:.7fr 1.3fr;gap:4vw}.d-note>p{font-size:10px;letter-spacing:.2em}.d-note h2{grid-column:1/-1;font-size:clamp(3.5rem,7vw,7rem);line-height:.82;letter-spacing:-.07em;margin:7vh 0}.d-note>div{grid-column:2;border-top:1px solid #ffffff44;padding-top:20px;display:grid;grid-template-columns:1fr 1.6fr;gap:24px}.d-note strong{font-size:11px;letter-spacing:.14em}.d-note div p{margin:0;font-size:13px;line-height:2}footer{padding:24px var(--pad);display:flex;justify-content:space-between;font-size:10px;letter-spacing:.14em;border-top:1px solid #0003}
@media(max-width:900px){.d-pref{grid-template-columns:100px 1fr}.d-pref article{grid-column:2}}
@media(max-width:760px){html{scroll-padding-top:64px}.d-head nav{display:none}.d-menu{display:block;min-height:44px}.d-hero{min-height:78svh;display:block;padding:110px 22px 54px}.d-hero h1{font-size:clamp(3.45rem,16vw,5.8rem);margin:13vh 0 8vh}.d-hero h1 span:last-child{margin-left:0}.d-hero>div{display:block}.d-hero div p{margin-top:18px}.d-regions{top:0;grid-template-columns:repeat(4,1fr)}.d-regions a{padding:12px 5px;font-size:10px}.d-list{padding:0 22px}.d-region{display:block;padding:72px 0}.d-region>header{position:static;margin-bottom:44px}.d-region h2{font-size:clamp(2.35rem,10.8vw,3rem)}.d-pref{display:block}.d-pref+.d-pref{margin-top:48px}.d-pref h3{border-bottom:1px solid #0002}.d-pref article{padding-left:0}.d-pref address{min-height:0}.d-note{display:block;padding:72px 22px}.d-note h2{font-size:clamp(2.35rem,10.8vw,3rem);margin:48px 0}.d-note>div{display:block}.d-note div p{margin-top:18px}footer{gap:10px;flex-wrap:wrap}.site-menu-dialog nav{display:block}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Make prefectures the primary wayfinding level. */
.d-region h2{font-size:clamp(2.6rem,4.5vw,5rem)}
.d-pref{grid-template-columns:1fr 1fr}
.d-pref h3{grid-column:1/-1;grid-row:auto;margin:0;padding:20px 0 17px;font-size:clamp(1.25rem,2vw,1.7rem);line-height:1.2;letter-spacing:.08em;border-bottom:2px solid var(--ink);display:flex;align-items:baseline;justify-content:space-between}
.d-pref h3::after{content:"PREFECTURE";font-size:9px;font-weight:400;letter-spacing:.18em;color:#666}
@media(max-width:900px){.d-pref{grid-template-columns:1fr}.d-pref article{grid-column:auto}}
@media(max-width:760px){.d-region>header{margin-bottom:38px}.d-region h2{font-size:clamp(2.1rem,9.5vw,2.7rem)}.d-pref h3{font-size:20px;border-bottom:2px solid var(--ink)}}

/* Region = chapter, prefecture = primary wayfinding, dealer = content. */
.d-list{padding:0}
.d-region{display:block;padding:0 0 11vh;border:0}
.d-region>header{position:static;width:100%;padding:24px var(--pad);background:var(--ink);color:#fff;display:flex;align-items:baseline;gap:clamp(16px,2.5vw,36px)}
.d-region>header span{order:3;margin-left:auto;color:#888}
.d-region>header h2{order:2;margin:0;font-size:clamp(1.15rem,2.1vw,1.8rem);line-height:1;letter-spacing:-.03em;font-style:italic;color:var(--blue)}
.d-region>header p{order:1;margin:0;font-size:clamp(1.15rem,2vw,1.65rem);font-weight:700;letter-spacing:.12em}
.d-pref{width:calc(100% - (var(--pad) * 2));margin-left:auto;margin-right:auto;padding-top:clamp(42px,6vw,76px);border-top:0}
.d-pref+.d-pref{margin-top:0}
.d-pref h3{padding:0 0 18px;font-size:clamp(1.45rem,2.4vw,2rem)}
.d-pref h4{font-size:clamp(15px,1.25vw,18px)}
.d-pref article{padding:25px 0 30px}
@media(max-width:760px){.d-region{padding-bottom:72px}.d-region>header{margin:0;padding:19px 22px;gap:12px;flex-wrap:wrap}.d-region>header h2{font-size:14px}.d-region>header p{font-size:19px}.d-region>header span{font-size:9px}.d-pref{width:calc(100% - 44px);padding-top:42px}.d-pref h3{font-size:22px}.d-pref h3::after{font-size:8px}.d-pref article{padding:24px 0 27px}}

/* Keep the global site header and dealer-area navigation as separate bars. */
.d-head{min-height:76px;background:#07110f;mix-blend-mode:normal}
.d-regions{top:76px}
@media(max-width:760px){
  html{scroll-padding-top:184px}
  .d-head{height:88px;min-height:88px;padding:18px 22px;background:#07110f;mix-blend-mode:normal}
  .d-logo{width:138px}
  .d-regions{top:88px}
}

/* Dedicated dealer-network hero image. */
.d-hero{position:relative;isolation:isolate;overflow:hidden;background:#07110f}
.d-hero::before{content:"";position:absolute;z-index:-2;inset:0;background:url("./media/dealers/dealers-hero.png") center center/cover no-repeat}
.d-hero::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(3,8,8,.9) 0%,rgba(3,8,8,.7) 48%,rgba(3,8,8,.38) 100%),linear-gradient(0deg,rgba(0,0,0,.62),transparent 62%)}
@media(max-width:760px){.d-hero::before{background-position:62% center}.d-hero::after{background:linear-gradient(180deg,rgba(3,8,8,.78),rgba(3,8,8,.5) 55%,rgba(3,8,8,.82))}}

/* The Japanese page title carries equal importance to the English statement. */
.d-hero>div h2{margin:0;font-size:clamp(1.55rem,2.7vw,2.8rem);line-height:1.18;letter-spacing:-.035em}
@media(max-width:760px){.d-hero>div h2{margin:0 0 24px;font-size:clamp(1.65rem,7.5vw,2.15rem);line-height:1.2}}

/* Lock the English and Japanese hero titles into one visual group. */
.d-hero h1{margin-bottom:24px}
.d-hero>div{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #ffffff55;padding-top:18px}
.d-hero>div h2{grid-column:1/-1;white-space:nowrap;font-size:clamp(1.45rem,2.25vw,2.35rem)}
.d-hero>div p{grid-column:2;margin-top:24px}
@media(max-width:760px){.d-hero h1{margin-bottom:20px}.d-hero>div{display:block;padding-top:16px}.d-hero>div h2{margin:0;white-space:nowrap;font-size:clamp(1.2rem,5.7vw,1.65rem)}.d-hero>div p{margin-top:22px}}

/* Balance the hero metadata on one shared baseline. */
.d-hero>div{align-items:start;column-gap:clamp(32px,7vw,110px)}
.d-hero>div h2{grid-column:1;margin:0}
.d-hero>div p{grid-column:2;margin:0;text-align:left;justify-self:end;max-width:44em}
@media(max-width:760px){.d-hero>div h2{margin:0}.d-hero>div p{margin-top:22px;text-align:left}}

/* Restrained motion: supports wayfinding without competing with store data. */
.d-hero::before{animation:d-hero-drift 18s ease-in-out infinite alternate;will-change:transform}
.d-hero>p{animation:d-hero-rise .7s .12s both}
.d-hero h1 span{animation:d-title-in .95s cubic-bezier(.16,1,.3,1) both}
.d-hero h1 span:last-child{animation-delay:.14s}
.d-hero>div{animation:d-hero-rise .8s .34s both}
@keyframes d-hero-drift{from{transform:scale(1.01)}to{transform:scale(1.07) translate3d(-1%,0,0)}}
@keyframes d-title-in{from{opacity:0;transform:translateY(30px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0)}}
@keyframes d-hero-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.d-motion{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .9s cubic-bezier(.16,1,.3,1)}
.d-motion.is-visible{opacity:1;transform:none}
.d-pref article{transition:background-color .3s,padding-left .4s cubic-bezier(.16,1,.3,1)}
.d-pref article:hover{background:#fff;padding-left:14px}
.d-pref article>a{transition:color .25s,border-color .25s}.d-pref article>a:hover{color:#2f7f9e;border-color:#2f7f9e}
@media(max-width:760px){.d-pref article:hover{padding-left:0;background:transparent}}
@media(prefers-reduced-motion:reduce){.d-hero::before,.d-hero>p,.d-hero h1 span,.d-hero>div{animation:none}.d-motion{opacity:1;transform:none;transition:none}.d-pref article,.d-pref article>a{transition:none}}

/* Persistent depth layer: visible only through the dark chapter bands and ending. */
html{background:var(--paper)}body{position:relative;isolation:isolate;background:transparent}
body::before{content:"";position:fixed;z-index:-2;inset:0;background:url("./media/dealers/dealers-hero.png") center center/cover no-repeat;transform:translateZ(0);pointer-events:none}
.d-hero{background:transparent}
.d-hero::before{display:none;animation:none}
.d-list{background:transparent}
.d-region{background:linear-gradient(to bottom,transparent 0 76px,var(--paper) 76px 100%)}
.d-region>header{min-height:76px;background:rgba(3,8,8,.84);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.d-note{position:relative;isolation:isolate;background:rgba(3,8,8,.79);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);box-shadow:inset 0 1px rgba(255,255,255,.08)}
.d-note::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.36),rgba(0,0,0,.08) 55%,rgba(0,0,0,.3))}
footer{background:var(--paper)}
@media(max-width:760px){.d-region{background:linear-gradient(to bottom,transparent 0 64px,var(--paper) 64px 100%)}.d-region>header{min-height:64px;background:rgba(3,8,8,.86)}.d-note{background:rgba(3,8,8,.82)}}
.d-region{scroll-margin-top:170px}
@media(max-width:760px){.d-region{scroll-margin-top:184px}}