/* Fusion layer v1 (2026-11-05): brings the Japanese site's design language into the English section.
   Loaded after en.css. Only brand colours; no new decoration.
   1 Type: same Helvetica Neue stack and ultra-light headings as rikuwave.com (Hanken Grotesk stays as the fallback for Windows).
   2 Labels: numbered section labels "01 / ..." in the Japanese site's thin, wide-tracked style.
   3 Lockup: RIKU WAVE with 陸可浪潮 underneath, as in the Japanese header.
   4 Links: the Japanese site's ↗ arrow.
   5 Closing: the Japanese hero scene (coastal observatory) behind the contact band.
   coast.webp = the Japanese site's coastal-observatory.webp, copied unchanged into /en/assets/img/ at release. */

:root{
  --sans:"Helvetica Neue","Hanken Grotesk",Helvetica,Arial,"Hiragino Kaku Gothic ProN",sans-serif;
  --w-display:250;
}

/* 1 type */
.display,.contact-title,.ai-head h2,h1,h2{font-weight:var(--w-display)}
.display{letter-spacing:-.04em}
.case-text h3,.trust h3,.flow h3,.stat strong{font-weight:250}

/* 2 labels */
.eyebrow,.case-text .client{font-size:11px;font-weight:400;letter-spacing:.24em}
.eyebrow .idx{font-variant-numeric:tabular-nums}

/* 3 lockup */
.brand .word{display:grid;gap:3px;line-height:1}
.brand .word b{font-size:13px;font-weight:500;letter-spacing:.2em}
.brand .word small{font-size:9px;font-weight:400;letter-spacing:.42em;color:var(--ink-60)}
@media (max-width:440px){.brand .word{display:none}}

/* 4 links */
.more::after{content:"↗"}
.more:hover::after{transform:translate(2px,-2px)}

/* 5 closing scene */
#contact.coast{position:relative;isolation:isolate;overflow:hidden;background:var(--navy) url("/en/assets/img/coast.webp") 62% 46%/cover no-repeat;padding-block:clamp(120px,15vw,216px) clamp(80px,9vw,120px)}
#contact.coast::before{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(0,6,44,.88) 0%,rgba(0,6,44,.66) 52%,rgba(0,6,44,.34) 100%),
  linear-gradient(0deg,rgba(0,6,44,.96) 0%,rgba(0,6,44,0) 46%)}
#contact.coast .eyebrow{color:rgba(247,245,242,.78)}
#contact.coast .motto{margin-top:14px;font-size:15px;font-weight:300;letter-spacing:.08em;color:var(--iv-72)}
#contact.coast .contact-title{margin-top:clamp(40px,5vw,64px)}
footer.site{border-top:0}

/* home order v1: process + safeguards share one section */
.safeguards{margin-top:clamp(72px,8vw,120px);padding-top:clamp(48px,5vw,72px);border-top:1px solid var(--rule)}
.safeguards > .eyebrow{margin-bottom:clamp(28px,3vw,40px)}
.clients .eyebrow{margin-bottom:0}
footer.site .credit{flex:1 0 100%;font-size:11px;letter-spacing:.04em;color:rgba(247,245,242,.42)}
#ai .ai-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:1040px}
@media (max-width:900px){#ai .ai-grid{grid-template-columns:minmax(0,1fr)}}
.work-clients{margin-top:14px;font-size:15px;color:var(--ink-60)}
.hero .proof{grid-template-columns:repeat(3,minmax(0,1fr))}
