*{box-sizing:border-box}body{margin:0;background:#f7f7f4;color:#152b3d;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,"Noto Sans JP",sans-serif}a{color:inherit;text-decoration:none}.top{position:sticky;top:0;z-index:10;background:#fffffff2;backdrop-filter:blur(12px);border-bottom:1px solid #e3e7e7}.bar{max-width:1160px;margin:auto;padding:20px 28px;display:flex;justify-content:space-between;align-items:center;gap:20px}.logo{font-size:22px;font-weight:700;letter-spacing:.08em}.nav{display:flex;gap:20px;align-items:center;flex-wrap:wrap;font-size:13px}.nav a:hover{color:#477f80}.lang{border:1px solid #cad5d5;background:white;border-radius:6px;padding:6px 10px;cursor:pointer}.hero{background:#e7eeeb;padding:85px 28px}.wrap{max-width:1160px;margin:auto}.eyebrow{font-size:12px;letter-spacing:.19em;text-transform:uppercase;color:#507777}.hero h1{font-size:clamp(38px,5vw,68px);line-height:1.1;max-width:850px;letter-spacing:-.04em;margin:18px 0}.hero p{max-width:680px;color:#49606a;line-height:1.8}.section{padding:70px 28px}.section h2{font-size:clamp(28px,3vw,42px);letter-spacing:-.03em}.muted{color:#62727a;line-height:1.75}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.card{background:#fff;border:1px solid #e4e8e7;border-radius:10px;overflow:hidden}.card .content{padding:22px}.card h3{margin:4px 0 10px}.art{height:205px;background:linear-gradient(135deg,#e0e9e6,#bacfc9);display:flex;align-items:center;justify-content:center;color:#54756d;font-size:50px}.art.alt{background:linear-gradient(135deg,#e7e1d7,#c4c7bb)}.art.dark{background:linear-gradient(135deg,#b8cbc8,#759b98);color:white}.tag{font-size:11px;letter-spacing:.1em;color:#54807a;text-transform:uppercase}.btn{display:inline-block;background:#193c49;color:white;padding:13px 22px;border-radius:5px;border:0;cursor:pointer;font:inherit}.btn.secondary{background:transparent;color:#193c49;border:1px solid #193c49}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.footer{padding:35px 28px;background:#112b39;color:#d8e2e4;font-size:13px}.footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.filters{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}.filters button{padding:9px 15px;background:white;border:1px solid #cbd5d3;border-radius:20px;cursor:pointer}.filters button.active{background:#193c49;color:white}.search{width:100%;max-width:450px;padding:12px;border:1px solid #cbd5d3;border-radius:6px;font:inherit}.form{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:800px}.form label{font-size:13px;display:flex;flex-direction:column;gap:8px}.form input,.form select,.form textarea{font:inherit;padding:12px;border:1px solid #cbd5d3;border-radius:5px;background:white}.wide{grid-column:1/-1}.notice{padding:14px;background:#e7eeeb;border-radius:6px;color:#365b5b}.compare{position:relative;max-width:800px;height:350px;background:#e4e0d8;overflow:hidden;border-radius:12px}.compare .before,.compare .after{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px}.compare .before{background:#e4e0d8}.compare .after{background:#9ab9b1;color:#143a36;clip-path:inset(0 50% 0 0)}.bottle{width:130px;height:185px;border:4px solid currentColor;border-radius:20px 20px 12px 12px;display:flex;align-items:center;justify-content:center;font-size:17px}.compare input{position:absolute;bottom:15px;left:10%;width:80%;z-index:2}.steps{display:flex;gap:12px;flex-wrap:wrap}.step{flex:1;min-width:140px;background:#fff;border:1px solid #e4e8e7;border-radius:8px;padding:18px}.small{font-size:12px}@media(max-width:780px){.grid{grid-template-columns:1fr 1fr}.nav{gap:9px;font-size:11px}.bar{padding:14px}.section{padding:48px 18px}.hero{padding:65px 18px}}@media(max-width:540px){.grid,.form{grid-template-columns:1fr}.nav a:nth-child(3),.nav a:nth-child(4),.nav a:nth-child(5){display:none}.art{height:170px}.compare{height:280px}}
.shade{background:#eef2ef}.nav{max-width:100%;gap:13px}.nav a{white-space:nowrap}.bar{max-width:1320px}.nav a:hover{text-decoration:underline}@media(max-width:780px){.nav{overflow-x:auto;flex-wrap:nowrap;max-width:calc(100vw - 130px);scrollbar-width:thin}.nav a:nth-child(n){display:inline-block;flex-shrink:0}.nav button{flex-shrink:0}}
/* V3 home visual system: original draft imagery reused as concepts */
body{background:#fafaf8;color:#182d35}.hero-visual{position:relative;min-height:620px;display:flex;align-items:center;background:#e9e9e4 url("assets/original-00.png") center center/cover no-repeat}.hero-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,248,246,.96) 0%,rgba(247,248,246,.86) 34%,rgba(247,248,246,.18) 75%)}.hero-visual>.wrap{width:100%;position:relative}.hero-panel{max-width:620px;padding:36px 0}.hero-panel h1{max-width:650px;line-height:1.18}.hero-panel p{max-width:550px}.photo-art{height:245px;overflow:hidden;background:#f1eee8}.photo-art img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.card:hover .photo-art img{transform:scale(1.035)}.card{border-radius:4px;transition:box-shadow .25s ease}.card:hover{box-shadow:0 14px 35px rgba(20,40,40,.08)}.concept-note{font-size:12px;color:#73807c;line-height:1.7}.section h2{font-weight:600}.eyebrow{font-weight:600}.section{padding-top:88px;padding-bottom:88px}.footer{margin-top:0}@media(max-width:780px){.hero-visual{min-height:570px;background-position:60% center}.hero-visual:before{background:linear-gradient(90deg,rgba(247,248,246,.96),rgba(247,248,246,.65))}.hero-panel{padding:20px 0}.photo-art{height:220px}.section{padding-top:55px;padding-bottom:55px}}@media(max-width:540px){.hero-visual{min-height:560px;background-position:65% center}.hero-visual:before{background:rgba(247,248,246,.80)}.photo-art{height:230px}}

/* V4 visual consistency */
.industry-photo{margin:30px 0 0;max-width:820px}.industry-photo img{display:block;width:100%;max-height:410px;object-fit:cover;border-radius:18px}.industry-photo figcaption{font-size:12px;color:#65706d;margin-top:9px}.card .art img{display:block;width:100%;height:100%;min-height:170px;object-fit:cover}.preview-warning{padding:12px 16px;border-left:3px solid #8b997c;background:#f2f4ed;font-size:14px}.nav a[aria-current=page]{text-decoration:underline;text-underline-offset:6px}.card{overflow:hidden}.card .art{overflow:hidden}.card .art img{transition:transform .3s}.card:hover .art img{transform:scale(1.025)}@media(max-width:700px){.industry-photo{margin-top:24px}.industry-photo img{max-height:280px}}

/* V5 catalogue and responsive navigation */
.material-row{display:flex;align-items:center;gap:12px;margin:15px 0 24px;font-size:14px}.material-row select{border:1px solid #cbd2ce;border-radius:5px;background:#fff;padding:10px 14px;max-width:260px}.nav a:focus-visible,.nav button:focus-visible,.btn:focus-visible{outline:3px solid #269d8c;outline-offset:4px}.card a{color:inherit}.card .content>a{color:#137c73;font-weight:600}.preview-warning{margin:16px 0 22px}.photo-art img{object-fit:cover}.lang{white-space:nowrap}@media(max-width:900px){.bar{gap:12px}.nav{overflow-x:auto;scrollbar-width:thin}.nav a{flex-shrink:0}}@media(max-width:600px){.material-row{align-items:stretch;flex-direction:column}.material-row select{max-width:none}}

/* V6 content architecture */
.detail-section:nth-of-type(even){background:#f5f7f4}.detail-grid{grid-template-columns:repeat(auto-fit,minmax(235px,1fr));margin-top:26px}.detail-card{min-height:165px}.detail-card .content{padding:26px}.detail-card h3{line-height:1.45}.detail-card p{line-height:1.85}.detail-section .eyebrow{letter-spacing:.14em}@media(max-width:700px){.detail-card{min-height:auto}.detail-card .content{padding:20px}}

/* V7 mobile and accessibility */
html{scroll-behavior:smooth}body{overflow-x:hidden}img{max-width:100%}a,button,input,select,textarea{touch-action:manipulation}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #138579;outline-offset:3px} .form input,.form select,.form textarea{max-width:100%;box-sizing:border-box} .form label{min-width:0} .card h3{overflow-wrap:anywhere} @media(max-width:760px){.bar{padding-left:14px;padding-right:14px}.logo{flex-shrink:0}.nav{gap:14px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin}.nav a,.nav button{min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}.hero h1{overflow-wrap:anywhere}.grid{grid-template-columns:1fr}.steps{display:flex;flex-wrap:wrap}.step{flex:1 1 135px}.section{padding-top:46px;padding-bottom:46px}} @media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* V8 review improvements */
@media(max-width:960px){.nav{overflow-x:auto;flex-wrap:nowrap;max-width:calc(100vw - 140px)}.nav a{white-space:nowrap;flex-shrink:0}.nav button{flex-shrink:0}}
img{height:auto} .card img{display:block} .wrap{max-width:min(1180px,calc(100% - 32px))} 

/* Keep spam-trap field outside visible layout, without hiding it from simple bots. */
.honeypot-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
#submission-status{min-height:1.5em}

/* V10G: mobile form legibility and tap target improvements */
@media(max-width:760px){.form input,.form select,.form textarea{font-size:16px;min-height:44px}.form textarea{min-height:140px}.form .btn{min-height:44px}.nav{scroll-padding-inline:12px}}
#submission-status:empty{display:block}