/* ===== Homepage-specific styles ===== */

/* TRANSPARENT NAV OVER COVER (homepage only) */
body[data-screen-label="Homepage"] .site-header{
  position:fixed;left:0;right:0;top:0;
  background:transparent;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  border-bottom-color:transparent;
}
/* Solid background only kicks in once the entire cover has scrolled past — by
   then a white section sits under the nav, so the swap is invisible. */
body[data-screen-label="Homepage"] .site-header.scrolled{
  background:#fff;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  border-bottom-color:var(--line-soft);
}
/* Shop mega menu takes priority over both transparent and scrolled states —
   same translucent blurred look as the scrolled header, so the panel below
   it reads as a seamless continuation rather than a hard white block. */
body[data-screen-label="Homepage"] .site-header.mega-open{
  background:#fff;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  border-bottom-color:var(--line-soft);
}
@media (max-width:980px){
  body[data-screen-label="Homepage"] .site-header.mega-open{background:transparent;border-bottom-color:transparent;}
  body[data-screen-label="Homepage"] .site-header.mega-open.scrolled{background:#fff;border-bottom-color:var(--line-soft);}
}

/* COVER */
.cover{
  position:relative;
  height:100vh;min-height:560px;
  overflow:hidden;
}
.cover-img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;
}
.cover-cta{
  position:absolute;left:0;right:0;bottom:4%;
  display:flex;flex-direction:column;align-items:center;gap:22px;padding:0 var(--pad);
}
.cover-title{
  font-family:var(--serif);color:#fff;text-align:center;font-weight:400;
  font-size:34px;line-height:1.15;
  max-width:800px;
}
.cover-btn{
  box-shadow:0 14px 34px rgba(0,0,0,.20);
}
.cover-btn{transition:background .2s;}
body[data-screen-label="Homepage"] .site-header:not(.scrolled):not(.mega-open) .nav a,
body[data-screen-label="Homepage"] .site-header:not(.scrolled):not(.mega-open) .hicon,
body[data-screen-label="Homepage"] .site-header:not(.scrolled):not(.mega-open) .brand-word-name,
body[data-screen-label="Homepage"] .site-header:not(.scrolled):not(.mega-open) .brand-word-sub{color:#fff;}
body[data-screen-label="Homepage"] .site-header:not(.scrolled):not(.mega-open) .nav a:hover,
body[data-screen-label="Homepage"] .site-header:not(.scrolled):not(.mega-open) .nav a.active{color:#fff;}
body[data-screen-label="Homepage"] .site-header:not(.scrolled):not(.mega-open) .nav a::after{background:#fff;}
body[data-screen-label="Homepage"] .site-header:not(.scrolled):not(.mega-open) .nav-toggle span{background:#fff;}
@media (max-width:980px){
  .cover{height:100svh;min-height:560px;}
  .cover-cta{bottom:7%;}
}

/* HERO */
.hero{padding:56px 0 0;}
.overline-row{padding-bottom:40px;border-bottom:1px solid var(--line);}
.hero-grid{
  display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:stretch;
  padding:56px 0 80px;
}
.hero-title{font-size:30px;}
.hero-title .accent{color:var(--green);}
.hero-foot{margin-top:auto;padding-top:48px;}
.hero-copy{display:flex;flex-direction:column;}
.hero-foot .lead{max-width:480px;}
.hero-actions{display:flex;align-items:center;gap:28px;margin-top:30px;flex-wrap:wrap;}
.hero-figure{position:relative;margin:0;background:var(--paper-2);overflow:hidden;min-height:520px;}
.hero-figure img{width:100%;height:100%;object-fit:cover;}
.hero-figure figcaption{
  position:absolute;left:0;bottom:0;right:0;padding:16px 20px;
  background:linear-gradient(to top,rgba(22,41,30,.72),transparent);
  color:var(--paper);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
}

/* FULL-BLEED */
.bleed{position:relative;overflow:hidden;}
.bleed > img{width:100%;height:auto;display:block;}
.bleed-cap{position:absolute;left:0;bottom:0;padding:22px 48px;}
.bleed.concept{background:#f0f0f0;}
.concept-cap{position:absolute;inset:0;display:flex;align-items:flex-end;}
.concept-cap p{
  max-width:560px;margin:0 0 7% 6%;font-size:clamp(24px,2.6vw,38px);line-height:1.25;color:var(--ink);
}

/* STATEMENT */
.statement-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:start;}
.statement-grid h2{font-size:30px;line-height:1.15;}
.statement-grid .accent{color:var(--green);}
.statement-body{display:flex;flex-direction:column;gap:22px;}
.statement-body p{font-size:16px;line-height:1.75;color:var(--ink-soft);}

/* CATALOGUE INDEX */
.index{border-top:1px solid var(--line);}
.idx-row{
  display:grid;
  grid-template-columns:60px 1.1fr 90px 1.4fr 130px 110px;
  align-items:center;gap:16px;
  padding:26px 0;border-bottom:1px solid var(--line);
  transition:padding-left .3s,background .3s;
}
.idx-row:hover{padding-left:14px;background:linear-gradient(to right,var(--green-soft),transparent 70%);}
.idx-n{font-size:13px;color:var(--green);letter-spacing:.05em;}
.idx-name{font-family:var(--serif);font-size:30px;}
.idx-type{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.idx-desc{font-size:14.5px;color:var(--ink-soft);}
.idx-price{font-size:16px;color:var(--ink);}
.idx-cta{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);text-align:right;font-weight:600;}
.catalogue-foot{margin-top:44px;}

/* MATERIALS */
.materials{background:var(--paper-2);}
.wood-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px 22px;}
.wood{margin:0;}
.wood .imgframe{aspect-ratio:1/1;border-radius:2px;}
.wood img{transition:transform .6s cubic-bezier(.16,1,.3,1);}
.wood:hover img{transform:scale(1.05);}
.wood figcaption{margin-top:14px;display:flex;flex-direction:column;gap:3px;}
.wood figcaption span{font-family:var(--serif);font-size:19px;}
.wood figcaption em{font-style:normal;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}

/* PROCESS TEASER */
.pt-grid{display:grid;grid-template-columns:1fr .9fr;gap:64px;align-items:center;}
.pt-steps{display:flex;flex-direction:column;gap:4px;margin-top:36px;}
.pt-step{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:20px 0;border-top:1px solid var(--line);}
.pt-step span{font-family:var(--serif);font-size:18px;color:var(--green);}
.pt-step strong{font-family:var(--serif);font-weight:400;font-size:21px;display:block;margin-bottom:4px;}
.pt-step p{font-size:14.5px;color:var(--ink-soft);line-height:1.6;}
.pt-shapes{margin:0;}
.pt-shapes .shapes{background:var(--paper);border:1px solid var(--line-soft);padding:56px 40px;border-radius:2px;}
.pt-shapes .shapes img{width:100%;height:auto;object-fit:contain;}
.pt-shapes figcaption{margin-top:16px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-align:center;}

/* SOUND FEATURE (concept entrypoint) — text left, image right */
.sf-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center;}
.sf-copy{display:flex;flex-direction:column;align-items:center;text-align:center;}
.sf-title{font-size:34px;line-height:1.15;margin-top:18px;}
.sf-title .accent{color:var(--ink);}
.sf-lead{max-width:480px;margin-top:22px;font-size:15px;}
.sf-actions{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:36px;flex-wrap:wrap;}
.sf-figure{margin:0;overflow:hidden;background:var(--paper-2);border-radius:2px;}
.sf-figure img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5;}

/* LIFESTYLE */
.ls-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center;}
.ls-copy{display:flex;flex-direction:column;align-items:center;text-align:center;}
.ls-figure{margin:0;overflow:hidden;background:var(--paper-2);border-radius:2px;}
.ls-figure img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5;}
.ls-meta{display:flex;justify-content:center;gap:40px;margin-top:40px;padding-top:32px;border-top:1px solid var(--line);}
.ls-meta div{display:flex;flex-direction:column;align-items:center;gap:4px;}
.ls-meta strong{font-size:30px;color:var(--green);font-weight:400;}
.ls-meta span{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}

/* HOMEPAGE RHYTHM — tighter spacing so modules feel connected */
body[data-screen-label="Homepage"] .home-rail{padding:40px 0 8px;}
body[data-screen-label="Homepage"] .sound-feature{padding:56px 0 48px;}
body[data-screen-label="Homepage"] .lifestyle{padding:48px 0 60px;}

/* CTA BAND */
.cta-band{background:var(--green);color:var(--paper);}
/* Image variant (homepage) — pattern-barrels behind, light wash + dark ink text (Option D) */
.cta-band--image{position:relative;background:var(--paper-2) url('assets/pattern-barrels.png') center/cover no-repeat;color:var(--ink);}
.cta-band--image::before{content:"";position:absolute;inset:0;background:rgba(246,246,245,.82);}
.cta-band--image .cta-inner{position:relative;z-index:1;}
.cta-band--image h2{color:var(--ink)!important;}
.cta-band--image .kicker{color:var(--green)!important;}
.cta-inner{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:22px;padding:56px 48px;}
.cta-inner h2{font-size:30px;color:var(--paper);margin-top:0;}

/* responsive */
@media (max-width:980px){
  .hero-grid,.statement-grid,.pt-grid,.ls-grid,.sf-grid{grid-template-columns:1fr;gap:36px;}
  .sf-lead-br{display:none;}
  .hero-figure{min-height:420px;order:-1;}
  .sf-figure{order:-1;}
  .wood-grid{grid-template-columns:repeat(2,1fr);}
  .idx-row{grid-template-columns:40px 1fr auto;gap:10px 14px;}
  .idx-type,.idx-desc{display:none;}
  .ls-meta{flex-wrap:wrap;gap:24px;}
  .cta-inner{flex-direction:column;align-items:center;text-align:center;padding:44px 28px;}
}
@media (max-width:620px){
  .wood-grid{grid-template-columns:1fr 1fr;gap:16px;}
  .concept-cap p{margin:0 6% 8%;}
  .cta-inner .btn-pale{white-space:normal;max-width:100%;}
}