:root{--ink:#111416;--paper:#f4f0e8;--gold:#b78c3b;--line:#d7cfbf;--muted:#6f706e}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif}
img{max-width:100%;display:block}
a{color:inherit}
.concept-bar{background:var(--ink);color:#fff;padding:9px 20px;text-align:center;font-size:13px;letter-spacing:.04em}
.site-header{height:86px;padding:0 max(24px,5vw);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#f9f6f0;position:sticky;top:0;z-index:10}
.brand{font:700 20px/0.8 Manrope;text-decoration:none;letter-spacing:-.08em}
nav{display:flex;gap:30px;align-items:center}nav a{text-decoration:none;font-size:14px;font-weight:600}
.contact-trigger,.contact-close,.primary-button{border:1px solid var(--gold);background:transparent;padding:12px 18px;font:700 13px Manrope;letter-spacing:.04em;cursor:pointer}
.hero{min-height:660px;display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
.hero>div{padding:100px max(32px,7vw);display:grid;align-content:center}
.hero>img{width:100%;height:100%;object-fit:cover}
.eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:.15em;color:var(--gold);font-weight:700}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif;margin:0}
h1{font-size:clamp(52px,6vw,86px);line-height:1.02}
h1 em{color:var(--gold);font-weight:600}
h2{font-size:clamp(38px,4vw,58px)}
h3{font-size:26px}
.hero p:not(.eyebrow),.intro,.product-lead{font-size:20px;line-height:1.6;color:var(--muted);max-width:690px}
.primary-link,.primary-button{display:inline-block;width:max-content;margin-top:20px;background:var(--ink);color:white;text-decoration:none;padding:15px 22px;border-color:var(--ink)}
.section{padding:95px max(28px,7vw)}
.collection-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:38px}
.collection-card{background:#fbf9f4;border:1px solid var(--line);display:grid;grid-template-columns:220px 1fr;min-height:220px;text-decoration:none;transition:transform .2s ease}
.collection-card:hover,.collection-card:focus-within{transform:translateY(-3px)}
.collection-card img{width:100%;height:100%;object-fit:cover}
.collection-card div{padding:28px;display:grid;align-content:center}
.collection-card small{color:var(--gold);text-transform:uppercase;letter-spacing:.1em}
.collection-card p{color:var(--muted);line-height:1.5}
.collection-card.featured{grid-column:1/-1;grid-template-columns:1fr 1fr;min-height:360px}
.contrast{background:var(--ink);color:white}
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:34px}
.compare-grid figure{margin:0}.compare-grid img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#222}
figcaption{font-size:13px;color:#bbb;margin-top:9px}
.matrix{margin-top:30px;border:1px solid var(--line)}
.matrix>div{display:grid;grid-template-columns:.7fr 1.3fr 1.3fr .7fr;gap:15px;padding:16px;border-bottom:1px solid var(--line);font-size:14px}
.matrix-head{background:#e7dfd0}.matrix b{color:#84641f}
.contact-note{position:fixed;inset:auto 24px 24px auto;max-width:430px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 60px #0004;padding:25px;z-index:50}
.contact-note h2{font-size:30px}.contact-note p{line-height:1.6;color:var(--muted)}
.site-footer{background:#e7dfd0;padding:35px max(28px,7vw);display:flex;justify-content:space-between;gap:20px;font-size:14px}
.product-main{min-height:70vh}
.product-hero{display:grid;grid-template-columns:1.05fr .95fr;min-height:660px}
.product-visual{background:white;display:grid;place-items:center;position:relative;padding:50px}
.product-visual img{width:min(600px,90%);transition:filter .25s ease}
.concept-tag{position:absolute;left:24px;bottom:24px;background:var(--paper);padding:8px 12px;font-size:12px}
.product-copy{padding:80px max(34px,7vw);display:grid;align-content:center}
.product-copy h1,.hinomi-hero h1{font-size:78px}
.info-strip{display:grid;gap:8px;margin:20px 0;color:var(--muted)}
.swatch-field{border:0;padding:0;margin:22px 0}
.swatch-field legend{font-size:15px;margin-bottom:14px}
.swatches{display:flex;gap:12px}
.swatch{width:38px;height:38px;border-radius:50%;border:3px solid var(--paper);outline:1px solid var(--line);background:var(--swatch);cursor:pointer}
.swatch.active{outline:3px solid var(--gold)}
.swatch:focus-visible{outline:4px solid #244b89;outline-offset:3px}
.keyboard-hint{font-size:12px!important;color:var(--muted)}
.product-detail{border-top:1px solid var(--line)}
.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px}
.detail-grid article{padding:28px;background:#fbf9f4;border-top:4px solid var(--gold)}
.detail-grid article>b{font:700 34px "Playfair Display";color:var(--gold)}
.detail-grid p{line-height:1.6;color:var(--muted)}
.hinomi-hero{display:grid;grid-template-columns:1.2fr .8fr;min-height:670px;align-items:center;background:#eceff1}
.hinomi-hero img{width:100%;height:100%;object-fit:cover}
.hinomi-hero>div{padding:70px max(34px,7vw)}
@media(max-width:850px){
  .site-header{height:auto;padding:18px 24px;flex-wrap:wrap;gap:15px}nav{order:3;width:100%;overflow:auto;gap:20px}
  .hero,.product-hero,.hinomi-hero{grid-template-columns:1fr}.hero{min-height:auto}.hero>div{padding:75px 28px}.hero>img{max-height:520px}
  .collection-grid,.compare-grid,.detail-grid{grid-template-columns:1fr}.collection-card,.collection-card.featured{grid-column:auto;grid-template-columns:150px 1fr;min-height:190px}
  .matrix{overflow:auto}.matrix>div{min-width:780px}.product-copy{padding:65px 28px}
}
@media(max-width:520px){
  .concept-bar{font-size:11px}.site-header .contact-trigger{display:none}h1{font-size:48px}.product-copy h1,.hinomi-hero h1{font-size:56px}
  .section{padding:70px 20px}.collection-card,.collection-card.featured{grid-template-columns:1fr}.collection-card img{height:220px}
  .site-footer{flex-direction:column}.contact-note{inset:auto 12px 12px}
}