@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;1,500&display=swap");

:root {
  --forest:#1f3a2e; --forest-light:#2c4a3d; --white:#fff; --pink:#ff2a8c;
  --blue:#5e89a6; --cream:#efe6d5; --peach:#e8b5a0; --coral:#c5705a;
  --line:rgba(255,255,255,.22); --serif:"Playfair Display",Georgia,serif; --sans:"Inter",Arial,sans-serif;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--white); background:var(--forest); font-family:var(--sans); }
button,a { color:inherit; }
button { font:inherit; }
img { display:block; max-width:100%; height:auto; }
::selection { color:var(--white); background:var(--pink); }

.skip-link { position:fixed; z-index:100; top:1rem; left:1rem; padding:.75rem 1rem; color:var(--forest); background:var(--cream); transform:translateY(-180%); transition:transform 180ms ease; }
.skip-link:focus { transform:translateY(0); }
.site-shell { overflow:clip; }
.timeline-node { touch-action:manipulation; }
.hero { position:relative; min-height:100svh; isolation:isolate; display:grid; grid-template-columns:minmax(1rem,.8fr) minmax(19rem,4fr) minmax(13rem,1.5fr) minmax(1rem,.6fr); grid-template-rows:auto 1fr auto; padding:1.5rem clamp(1rem,3vw,3rem) 2rem; }
.hero-media { position:absolute; z-index:-3; inset:0; overflow:hidden; background:var(--forest); }
.hero-image { width:100%; height:100%; object-fit:cover; filter:saturate(.78) contrast(.94) brightness(.75); transform:scale(1.02); }
.hero-wash { position:absolute; inset:0; background:radial-gradient(circle at 33% 48%,rgba(0,0,0,.08),transparent 28%),linear-gradient(90deg,rgba(14,38,28,.78),rgba(31,58,46,.2) 55%,rgba(31,58,46,.52)); }
.blueprint-grid { position:absolute; inset:0; opacity:.78; background-image:linear-gradient(to right,transparent calc(25% - .5px),var(--line) 25%,transparent calc(25% + .5px)),linear-gradient(to right,transparent calc(50% - .5px),var(--line) 50%,transparent calc(50% + .5px)),linear-gradient(to right,transparent calc(75% - .5px),var(--line) 75%,transparent calc(75% + .5px)),linear-gradient(to bottom,transparent calc(33.333% - .5px),var(--line) 33.333%,transparent calc(33.333% + .5px)),linear-gradient(to bottom,transparent calc(66.666% - .5px),var(--line) 66.666%,transparent calc(66.666% + .5px)); }
.site-header { grid-column:1/-1; display:flex; align-items:flex-start; justify-content:space-between; gap:2rem; padding-bottom:1.25rem; border-bottom:1px solid var(--line); }
.wordmark { font-family:var(--serif); font-size:1.55rem; text-decoration:none; }
.header-nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.75rem 1.6rem; }
.nav-link { position:relative; font-size:.72rem; font-weight:600; letter-spacing:.09em; text-decoration:none; text-transform:uppercase; }
.nav-link::after { position:absolute; right:0; bottom:-.35rem; left:0; height:1px; content:""; background:var(--pink); transform:scaleX(0); transform-origin:right; transition:transform 180ms ease; }
.nav-link:hover::after,.nav-link:focus-visible::after { transform:scaleX(1); transform-origin:left; }
.hero-copy { grid-column:2; align-self:center; max-width:55rem; padding:5rem 0 3rem; }
.hero-kicker { max-width:27rem; margin:0 0 1.25rem; font-size:clamp(.9rem,1.4vw,1.2rem); }
.hero-title { margin:0; font-family:var(--serif); font-size:clamp(4rem,8.2vw,9rem); font-weight:500; letter-spacing:-.055em; line-height:.76; text-shadow:0 2px 20px rgba(0,0,0,.18); }
.hero-title-italic { display:inline-block; margin-left:clamp(0rem,5vw,5rem); color:var(--cream); font-weight:500; white-space:nowrap; }
.hero-manifest { max-width:36rem; margin:3rem 0 2rem clamp(0rem,8vw,8rem); font-family:var(--serif); font-size:clamp(1.2rem,2vw,1.8rem); line-height:1.35; }
.hero-action { display:inline-flex; align-items:center; gap:.9rem; margin-left:clamp(0rem,8vw,8rem); padding:.75rem 1.1rem; color:var(--forest); background:var(--cream); border-radius:999px; font-size:.78rem; font-weight:700; letter-spacing:.08em; text-decoration:none; text-transform:uppercase; transition:color 180ms ease,background 180ms ease,transform 180ms ease; }
.hero-action:hover,.hero-action:focus-visible { color:var(--white); background:var(--pink); transform:translateY(-3px); }
.arrow-mark { font-size:1rem; }
.chapter-index { grid-column:3; align-self:center; padding:1.5rem 0 1.5rem 2rem; border-left:1px solid var(--line); }
.chapter-label { margin:0 0 1.1rem; color:var(--cream); font-family:var(--serif); font-size:.9rem; font-style:italic; }
.chapter-items { display:grid; gap:0; margin:0; padding:0; list-style:none; }
.chapter-items li { border-top:1px solid var(--line); }
.chapter-items li:last-child { border-bottom:1px solid var(--line); }
.chapter-link { display:block; padding:.72rem 0; font-size:.78rem; font-weight:600; text-decoration:none; transition:color 180ms ease,padding-left 180ms ease; }
.chapter-link:hover,.chapter-link:focus-visible { padding-left:.6rem; color:var(--pink); }
.utility-rail { position:absolute; z-index:4; right:clamp(1rem,3vw,3rem); bottom:1.6rem; display:flex; align-items:center; gap:.5rem; }
.share-pill,.settings-pill { min-height:2.5rem; border:1px solid rgba(255,255,255,.55); color:var(--white); background:rgba(31,58,46,.26); backdrop-filter:blur(12px); cursor:pointer; transition:border-color 180ms ease,background 180ms ease,transform 180ms ease; }
.share-pill { padding:.65rem 1rem; border-radius:999px; font-size:.68rem; letter-spacing:.06em; text-transform:uppercase; }
.settings-pill { display:grid; width:2.5rem; padding:0; border-radius:50%; place-items:center; }
.settings-icon { width:1rem; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.2; }
.share-pill:hover,.share-pill:focus-visible,.settings-pill:hover,.settings-pill:focus-visible { border-color:var(--pink); background:rgba(255,42,140,.2); transform:translateY(-2px); }
.scroll-cue { grid-column:1/3; align-self:end; width:max-content; padding-top:1rem; border-top:1px solid var(--pink); font-family:var(--serif); font-size:.82rem; text-decoration:none; }

.content { background:var(--cream); }
.taxonomy { position:relative; padding:clamp(5rem,9vw,9rem) clamp(1rem,4vw,4rem); color:var(--forest); background:linear-gradient(rgba(31,58,46,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(31,58,46,.08) 1px,transparent 1px),var(--cream); background-size:25% 100%,25% 100%,auto; }
.section-intro { display:grid; grid-template-columns:1fr 2fr 1fr; align-items:end; gap:2rem; margin-bottom:4rem; }
.section-kicker { margin:0; font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.section-title { margin:0; font-family:var(--serif); font-size:clamp(4.5rem,10vw,10rem); font-weight:500; letter-spacing:-.06em; line-height:.77; }
.section-copy { margin:0; font-family:var(--serif); font-size:1.05rem; line-height:1.5; }
.size-gallery { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1px; margin:0; padding:1px; background:rgba(31,58,46,.28); list-style:none; }
.subject-item { min-width:0; background:var(--cream); }
.subject-card { position:relative; display:grid; width:100%; min-height:34rem; grid-template-rows:auto 1fr auto; padding:1rem; overflow:hidden; border:0; color:var(--forest); background:var(--cream); text-align:left; cursor:pointer; isolation:isolate; }
.subject-card::before { position:absolute; z-index:-1; right:8%; bottom:27%; left:8%; height:4.5rem; content:""; background:var(--item-glow,var(--pink)); border-radius:50%; filter:blur(28px); opacity:.2; transform:scale(.6); transition:opacity 260ms ease,transform 260ms ease; }
.subject-item:nth-child(1) { --item-glow:var(--pink); }
.subject-item:nth-child(2) { --item-glow:var(--blue); }
.subject-item:nth-child(3) { --item-glow:var(--coral); }
.subject-item:nth-child(4) { --item-glow:var(--peach); }
.subject-item:nth-child(5) { --item-glow:var(--forest-light); }
.subject-card:hover::before,.subject-card:focus-visible::before,.subject-card.is-active::before { opacity:.62; transform:scale(1); }
.subject-card:hover,.subject-card:focus-visible,.subject-card.is-active { z-index:2; outline:2px solid var(--item-glow); outline-offset:-2px; }
.subject-index { font-family:var(--serif); font-size:.8rem; }
.subject-figure { display:grid; align-items:end; min-height:17rem; margin:1rem -1rem 0; overflow:hidden; }
.subject-image { width:100%; height:17rem; object-fit:cover; mix-blend-mode:multiply; filter:saturate(.78) contrast(1.04); transition:filter 300ms ease,transform 400ms cubic-bezier(.2,.7,.2,1); }
.subject-card:hover .subject-image,.subject-card:focus-visible .subject-image { filter:saturate(1) contrast(1.08); transform:scale(1.045); }
.subject-copy { display:grid; grid-template-columns:1fr auto; align-items:baseline; gap:.45rem .6rem; padding-top:1rem; border-top:1px solid rgba(31,58,46,.28); }
.subject-line { font-family:var(--serif); font-size:clamp(1.25rem,2vw,1.8rem); font-weight:500; }
.subject-size { font-size:.74rem; font-weight:700; }
.subject-compare,.subject-delivery { color:var(--forest-light); font-size:.66rem; }
.subject-tooltip { grid-column:1/-1; width:max-content; max-width:100%; padding:.38rem .55rem; border:1px solid var(--item-glow); border-radius:999px; font-size:.6rem; transition:color 180ms ease,background 180ms ease; }
.subject-card:hover .subject-tooltip,.subject-card:focus-visible .subject-tooltip { color:var(--white); background:var(--item-glow); }
.subject-price { font-family:var(--serif); font-size:.9rem; }

.production { display:grid; grid-template-columns:1fr 1fr; min-height:52rem; color:var(--cream); background:var(--forest-light); }
.production-image { min-height:42rem; overflow:hidden; }
.production-image img { width:100%; height:100%; object-fit:cover; filter:sepia(.22) saturate(.75) contrast(1.05); }
.production-panel { display:flex; flex-direction:column; justify-content:space-between; padding:clamp(3rem,7vw,7rem); }
.production-title { max-width:11ch; margin:2rem 0 4rem; font-family:var(--serif); font-size:clamp(3.5rem,6vw,6.5rem); font-weight:500; letter-spacing:-.055em; line-height:.9; }
.fact-list { margin:0; padding:0; list-style:none; }
.fact-item { display:grid; grid-template-columns:3rem 1fr; gap:1rem; padding:1.25rem 0; border-top:1px solid rgba(239,230,213,.28); }
.fact-item:last-child { border-bottom:1px solid rgba(239,230,213,.28); }
.fact-number { color:var(--pink); font-family:var(--serif); }
.fact-copy { max-width:37rem; margin:0; font-family:var(--serif); font-size:1.05rem; line-height:1.45; }

.b2b { display:grid; grid-template-columns:1.35fr .65fr; gap:clamp(3rem,7vw,8rem); padding:clamp(5rem,10vw,10rem) clamp(1rem,6vw,7rem); color:var(--forest); background:var(--peach); }
.b2b-copy { max-width:57rem; }
.b2b-title { margin:1.6rem 0; font-family:var(--serif); font-size:clamp(3.5rem,6vw,7rem); font-weight:500; letter-spacing:-.055em; line-height:.94; }
.b2b-lead { max-width:38rem; margin:0 0 2.5rem; font-family:var(--serif); font-size:1.2rem; line-height:1.5; }
.b2b-cta { display:inline-block; padding:.9rem 1.35rem; color:var(--white); background:var(--forest); border-radius:999px; font-size:.75rem; font-weight:700; letter-spacing:.1em; text-decoration:none; text-transform:uppercase; transition:background 180ms ease,transform 180ms ease; }
.b2b-cta:hover,.b2b-cta:focus-visible { background:var(--pink); transform:translateY(-3px); }
.b2b-details { margin:0; align-self:end; }
.b2b-detail { display:flex; justify-content:space-between; gap:1rem; padding:1.2rem 0; border-top:1px solid rgba(31,58,46,.35); }
.b2b-detail:last-child { border-bottom:1px solid rgba(31,58,46,.35); }
.b2b-detail dt,.b2b-detail dd { margin:0; font-size:.72rem; }
.b2b-detail dd { font-weight:700; text-align:right; }

.site-footer { display:grid; grid-template-columns:1fr auto; gap:3rem; padding:3rem clamp(1rem,4vw,4rem); color:var(--cream); background:var(--forest); }
.footer-wordmark { font-family:var(--serif); font-size:clamp(3rem,8vw,8rem); letter-spacing:-.06em; text-decoration:none; }
.footer-links { display:grid; align-content:start; gap:.6rem; }
.footer-link { font-size:.75rem; text-decoration:none; }
.footer-link:hover,.footer-link:focus-visible { color:var(--pink); }
.footer-meta { grid-column:1/-1; margin:0; padding-top:1rem; border-top:1px solid var(--line); font-size:.66rem; letter-spacing:.08em; text-transform:uppercase; }

.product-modal { width:min(72rem,calc(100% - 2rem)); max-height:calc(100svh - 2rem); padding:0; overflow:auto; border:0; color:var(--forest); background:var(--cream); box-shadow:0 30px 100px rgba(0,0,0,.45); }
.product-modal::backdrop { background:rgba(10,27,20,.78); backdrop-filter:blur(8px); }
.modal-shell { position:relative; display:grid; grid-template-columns:1.05fr .95fr; min-height:38rem; }
.modal-close { position:absolute; z-index:3; top:1rem; right:1rem; display:grid; width:2.6rem; height:2.6rem; padding:0; border:1px solid var(--forest); color:var(--forest); background:var(--cream); border-radius:50%; font-size:1.5rem; cursor:pointer; place-items:center; }
.modal-close:hover,.modal-close:focus-visible { color:var(--white); background:var(--pink); border-color:var(--pink); }
.modal-visual { min-height:38rem; background:var(--blue); }
.modal-image { width:100%; height:100%; object-fit:cover; mix-blend-mode:multiply; }
.modal-content { display:flex; flex-direction:column; padding:clamp(3rem,6vw,6rem); }
.modal-line { margin:0 0 auto; color:var(--pink); font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.modal-title { margin:3rem 0 1rem; font-family:var(--serif); font-size:clamp(4rem,8vw,8rem); font-weight:500; letter-spacing:-.06em; line-height:.85; }
.modal-description { max-width:30rem; margin:0 0 2.5rem; font-family:var(--serif); font-size:1.2rem; line-height:1.45; }
.modal-meta { display:grid; grid-template-columns:1fr 1fr; gap:1rem; border-top:1px solid rgba(31,58,46,.3); border-bottom:1px solid rgba(31,58,46,.3); }
.modal-size-block,.modal-price-block { display:grid; align-content:start; gap:.35rem; padding:1.2rem 0; }
.modal-label { font-size:.65rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.modal-size,.modal-price { font-family:var(--serif); font-size:1.75rem; font-weight:500; }
.modal-price-note { font-size:.64rem; }
.modal-delivery { margin:1.2rem 0 0; font-weight:700; }
.modal-compliance { margin:.4rem 0 0; font-size:.68rem; line-height:1.45; }
.site-shell.is-quiet .blueprint-grid,.site-shell.is-quiet .subject-card::before { opacity:0; }

a:focus-visible,button:focus-visible { outline:2px solid var(--pink); outline-offset:4px; }
@media (hover:hover) {
  .subject-card { will-change:transform; }
  .hero-image { will-change:transform; }
  .b2b-cta,.hero-action { will-change:transform; }
}
@supports (backdrop-filter:blur(1px)) {
  .share-pill,.settings-pill { backdrop-filter:blur(12px); }
  .product-modal::backdrop { backdrop-filter:blur(8px); }
}

@media (max-width:960px) {
  .hero { grid-template-columns:1fr 17rem; }
  .hero-copy { grid-column:1; }
  .chapter-index { grid-column:2; }
  .section-intro { grid-template-columns:1fr 2fr; }
  .section-copy { grid-column:2; }
  .size-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .subject-item:last-child { grid-column:1/-1; }
}

@media (max-width:720px) {
  .hero { min-height:54rem; display:block; padding:1rem; }
  .site-header { align-items:center; }
  .header-nav { display:none; }
  .hero-copy { padding:8rem 0 2rem; }
  .hero-title { font-size:clamp(3.8rem,18vw,6rem); line-height:.88; }
  .hero-title-italic { margin-left:0; white-space:normal; }
  .hero-manifest,.hero-action { margin-left:0; }
  .chapter-index { width:min(100%,22rem); margin-top:2rem; padding-left:1rem; }
  .scroll-cue { display:none; }
  .utility-rail { right:1rem; bottom:1rem; }
  .section-intro { display:block; margin-bottom:2.5rem; }
  .section-title { margin:1rem 0 2rem; }
  .size-gallery { grid-template-columns:1fr; }
  .subject-item:last-child { grid-column:auto; }
  .subject-card { min-height:30rem; }
  .production { grid-template-columns:1fr; }
  .production-image { min-height:28rem; }
  .production-panel { padding:3.5rem 1rem; }
  .b2b { grid-template-columns:1fr; }
  .site-footer { grid-template-columns:1fr; }
  .footer-meta { grid-column:auto; }
  .modal-shell { grid-template-columns:1fr; }
  .modal-visual { min-height:18rem; }
  .modal-content { padding:2.5rem 1rem; }
}

@media (forced-colors:active) {
  .subject-card,
  .modal-close,
  .share-pill,
  .settings-pill {
    border:1px solid CanvasText;
  }

  .hero-action,
  .b2b-cta {
    forced-color-adjust:none;
  }
}

@media (min-width:1200px) {
  .chapter-index {
    max-width:19rem;
  }

  .section-copy {
    max-width:28rem;
  }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; }
}