/* A spacious English menu drawn from the supplied reference, with NERA's own destinations. */
body.navigation-open{overflow:hidden}
body .header{z-index:50}
body .header nav,body .header nav.is-open{display:block;position:fixed;inset:0;width:100%;height:100svh;max-height:none;padding:clamp(110px,14vh,160px) 13% 45px;border:0;background:#f8f2e9;color:#59453d;box-shadow:none;overflow:auto;visibility:hidden;opacity:0;transform:translateY(-12px);transition:opacity .4s ease,transform .55s cubic-bezier(.2,.65,.25,1),visibility .55s}
body .header nav.is-open{visibility:visible;opacity:1;transform:none}
.menu-layout{display:grid;grid-template-columns:1fr 1fr;gap:12%;width:100%;max-width:1050px;margin:auto}
.menu-main{display:flex;flex-direction:column;gap:22px}
body .header nav .menu-main>a{border:0;font:400 clamp(20px,2.2vw,30px)/1.4 var(--english);letter-spacing:.045em;padding:5px 0;min-height:44px;width:fit-content}
.menu-store{padding-top:5px}
body .header nav .menu-store>button{display:flex;align-items:center;gap:28px;font:400 clamp(20px,2.2vw,30px)/1.4 var(--english);letter-spacing:.035em;text-align:left;min-height:44px}
body .header nav .menu-store>.menu-store-sub{font-size:16px;margin-top:17px;letter-spacing:.065em}
body .header nav .menu-brand{display:block;width:clamp(160px,20vw,260px);min-height:0;padding:0;border:0;margin:clamp(65px,12vh,140px) auto 0 0}
body .header nav .menu-brand img{height:auto;object-fit:contain}
body .header nav .menu-layout>*{opacity:0;transform:translateY(12px);transition:opacity .35s ease,transform .5s ease}
body .header nav.is-open .menu-layout>*{opacity:1;transform:none;transition-delay:.12s}
body .header nav.is-open .menu-layout>*:nth-child(2){transition-delay:.2s}
body .header .brand{position:relative;z-index:2}
body .header.menu-open .brand{visibility:hidden}
body .menu-toggle{z-index:3;width:52px;min-height:52px}
body .menu-toggle>span,body .menu-toggle[aria-expanded=true]>span{width:32px;height:20px;position:relative;border:0;transform:none}
body .menu-toggle>span:before,body .menu-toggle>span:after{content:'';position:absolute;left:0;top:5px;width:32px;height:1px;background:currentColor;transition:transform .45s ease,top .45s ease}
body .menu-toggle>span:after{top:15px}
body .menu-toggle[aria-expanded=true]>span:before{top:10px;transform:rotate(29deg)}
body .menu-toggle[aria-expanded=true]>span:after{top:10px;transform:rotate(-29deg)}
body .header.menu-open,body.brand-home .header.menu-open{background:transparent;color:#59453d;border:0}
body .header.menu-open button.menu-toggle:hover{color:var(--accent);opacity:1}
/* Transparent subpage header with the supplied white logo. */
body.about-page .header{position:fixed;top:0;left:0;width:100%;background:transparent;border:0;color:white;transition:background .4s,color .4s}
body.about-page .header.is-scrolled{background:#fffffff2;color:var(--ink);border-bottom:1px solid #d8d1cb66}
body.about-page .header.menu-open{background:transparent;color:#59453d;border:0}
body.about-page .header-logo-dark{visibility:hidden}
body.about-page .header-logo-white{position:absolute;inset:0;width:100%;height:auto;object-fit:contain}
body.about-page .header.is-scrolled .header-logo-dark{visibility:visible}
body.about-page .header.is-scrolled .header-logo-white{visibility:hidden}
body.about-page .about-hero{height:82svh;min-height:570px;max-height:1000px;display:flex;align-items:end;justify-content:start;padding:160px 9% 95px}
body.about-page .about-hero-title{position:relative;color:white;text-align:left;animation:about-title-reveal 1.1s ease .65s both}
body.about-page .about-hero-title h1{font:300 clamp(48px,6.8vw,100px)/1.12 var(--english);letter-spacing:.015em;overflow-wrap:normal}
body.about-page .about-hero-title p{font:400 16px/1.8 var(--mincho);letter-spacing:.1em;margin-top:22px}
.about-hero-visual{animation:about-photo-reveal 1.6s cubic-bezier(.22,.61,.36,1) .15s both}
.about-hero-visual:after{background:linear-gradient(0deg,#231c196b,#231c1933 65%,#231c1950)}
/* A common scale follows Japanese line length, rather than section size. */
body :is(.story-copy h2,.section-heading h2,.guide-heading h2,.about-story-heading,.adapt-layout h2,.about-return h2){font-size:clamp(28px,2.8vw,42px);line-height:1.8;font-weight:400;letter-spacing:.065em}
body .product-copy h3{font-size:clamp(23px,2.05vw,29px);line-height:1.75;letter-spacing:.04em}
body .business h2{font-size:clamp(25px,2.3vw,33px);line-height:1.8}
body .shop-section h2{font-size:clamp(25px,2.45vw,36px);line-height:1.8}
body dialog h2{font-size:22px;line-height:1.7}
body .product-photo{display:block;overflow:hidden;background:#e6dfd6}
body .product-photo>img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
/* Product guide: material images and concrete reading points. */
body.brand-home .quality{padding:100px 9% 115px;background:#f4f0ec}
.guide-heading{display:flex;justify-content:space-between;align-items:end;gap:45px;margin-bottom:65px}
.guide-heading>p{font-size:15px;line-height:2.1;max-width:29em}
.guide-layout{display:grid;grid-template-columns:1fr 1fr;gap:11%;align-items:center}
.guide-visual{position:relative;padding:0 17% 65px 0}
.guide-photo-main{aspect-ratio:.85;overflow:hidden}
.guide-photo-main img{object-fit:cover}
.guide-photo-detail{position:absolute;right:0;bottom:85px;width:45%;aspect-ratio:1;overflow:hidden;border:6px solid #f4f0ec}
.guide-visual>p{font:400 15px/2 var(--mincho);letter-spacing:.08em;margin:25px 0 0 6%}
.guide-content{min-width:0}
.guide-item{border-top:1px solid #cdc3ba;padding:0}
.guide-item:last-of-type{border-bottom:1px solid #cdc3ba}
.guide-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:23px 0}
.guide-item summary::-webkit-details-marker{display:none}
.guide-item summary small{display:block;font:400 10px/1.5 var(--english);letter-spacing:.15em;color:var(--accent);margin-bottom:9px}
.guide-item summary strong{display:block;font:400 clamp(18px,1.6vw,23px)/1.7 var(--mincho);letter-spacing:.025em}
.guide-item summary i{width:17px;height:17px;position:relative;flex-shrink:0}
.guide-item summary i:before,.guide-item summary i:after{content:'';position:absolute;left:0;top:8px;width:17px;height:1px;background:var(--accent)}
.guide-item summary i:after{transform:rotate(90deg);transition:transform .3s}
.guide-item[open] summary i:after{transform:none}
.guide-answer{padding:0 28px 25px 0}
.guide-answer p{font-size:14px;line-height:2.05}
.guide-status{font-size:11px;line-height:1.9;margin-top:20px}
.guide-content>.text-link{margin-top:25px}
body .footer-nav{display:flex;flex-direction:column;gap:12px}
body .footer-bottom{justify-content:flex-start;padding-top:24px}
/* Independent viewport triggers: visual, heading, copy, then action. */
.motion-ready [data-motion]:not(.is-visible){opacity:0;transform:translateY(16px)}
.motion-ready [data-motion]{transition:opacity .85s ease var(--motion-delay,0ms),transform .95s cubic-bezier(.2,.65,.25,1) var(--motion-delay,0ms)}
@media(min-width:1700px){body.brand-home .quality{padding-left:max(9%,calc((100% - 1400px)/2));padding-right:max(9%,calc((100% - 1400px)/2))}}
@media(max-width:1000px){.menu-layout{gap:8%}.guide-layout{gap:7%}.guide-heading{gap:28px}.guide-heading>p{font-size:14px}}
@media(max-width:700px){
 body .header nav,body .header nav.is-open{padding:105px 9% 40px}
 .menu-layout{grid-template-columns:1fr;gap:35px}.menu-main{gap:14px}
 body .header nav .menu-main>a,body .header nav .menu-store>button{font-size:23px;line-height:1.4;padding:3px 0}
 body .header nav .menu-store>.menu-store-sub{font-size:15px;margin-top:12px}
 body .header nav .menu-brand{margin-top:48px;width:170px}
 body.about-page .about-hero{height:76svh;min-height:490px;padding:130px 8% 65px}
 body.about-page .about-hero-title h1{font-size:clamp(40px,9.8vw,64px);line-height:1.2;letter-spacing:0}
 body.about-page .about-hero-title p{font-size:14px;margin-top:17px}
 body :is(.story-copy h2,.section-heading h2,.guide-heading h2,.about-story-heading,.adapt-layout h2,.about-return h2){font-size:clamp(26px,6.9vw,31px);line-height:1.85;letter-spacing:.045em}
 body .product-copy h3{font-size:clamp(22px,5.9vw,26px)}
 body .business h2,body .shop-section h2{font-size:clamp(23px,6.1vw,28px)}
 body.brand-home .quality{padding:70px 8% 80px}
 .guide-heading{display:block;margin-bottom:35px}.guide-heading>p{font-size:15px;margin-top:23px}
 .guide-layout{grid-template-columns:1fr;gap:30px}
 .guide-visual{padding-bottom:30px;margin-right:7%}.guide-photo-main{aspect-ratio:1.2}
 .guide-photo-detail{bottom:70px}.guide-visual>p{font-size:14px;margin-top:22px}
 .guide-item summary{padding:20px 0}.guide-item summary strong{font-size:19px}
 .guide-answer p{font-size:16px}.guide-status{font-size:11px}.guide-content>.text-link{width:100%}
}
@media(prefers-reduced-motion:reduce){
 body .header nav,body .header nav .menu-layout>*,body .menu-toggle>span:before,body .menu-toggle>span:after{transition:none;transform:none}
 body.about-page .about-hero-title,.about-hero-visual{animation:none}
 .motion-ready [data-motion]:not(.is-visible){opacity:1;transform:none}.motion-ready [data-motion]{transition:none}
}

body .header.menu-open #navigation a:hover,body .header.menu-open #navigation button:hover{color:var(--accent);opacity:1}
body.about-page .about-hero-title p{animation:about-title-reveal .9s ease .95s both}
@media(prefers-reduced-motion:reduce){body.about-page .about-hero-title p{animation:none}}

/* Final ADAPT. CTA: red primary; both actions turn white on hover. */
body .about-return .return-links .primary-action{background:#6D2936;border-color:#6D2936;color:#fff}
body .about-return .return-links .primary-action:hover{background:#fff;border-color:#fff;color:#6D2936}
body .about-return .return-links .outline-link:hover{background:#fff;border-color:#fff;color:#6D2936}

/* Footer navigation follows the header menu; policy remains a separate utility. */
body .footer-nav{display:grid;grid-template-columns:1fr 1fr;column-gap:55px;row-gap:5px;font-family:var(--english);font-size:14px;letter-spacing:.055em}body .footer-nav>a,body .footer-nav>button{display:flex;align-items:center;gap:15px;min-height:44px;text-align:left}body .footer-nav .link-icon{width:14px;height:14px}body .footer-bottom{justify-content:space-between;align-items:center}body .footer-bottom>button{font-family:var(--sans);font-size:11px;min-height:44px;letter-spacing:.03em}@media(max-width:700px){body .footer-nav{column-gap:24px;font-size:13px}body .footer-bottom{gap:10px}}

/* Keep the header transparent after scrolling on both pages. */
body.brand-home .header.is-scrolled,body.about-page .header.is-scrolled{background:transparent;border-bottom:0}
