/* ══════════════════════════════════════════════════════════════
   THE QUANTUM HARVEST — deck stylesheet
   Brand: navy #0A0E18 · copper #A85336 · cream #FFF6E0 · slate #8C8175
   Type:  Playfair Display (display + body) · Manrope (caps labels)
   Responsive scrolling deck · desktop ≥769 / mobile ≤768 / print landscape
   ══════════════════════════════════════════════════════════════ */
:root{
  --navy:#0A0E18; --copper:#A85336; --copper-light:#C57A52; --cream:#FFF6E0; --cream-light:#FFFCF2; --cream-text:#F6EEE0; --slate:#8C8175;
  /* --copper: accent on LIGHT grounds (4.9:1 on cream, AA). --copper-light: accent on DARK/navy grounds (5.8:1, AA). */
  --serif:'Playfair Display', Georgia, serif;
  --sans:'Manrope', system-ui, sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-snap-type:y proximity;scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{background:var(--navy);font-family:var(--sans);color:var(--cream-text);}
img{display:block;}

/* ── Slide shell ─────────────────────────────────────────── */
.slide{position:relative;min-height:100vh;width:100%;overflow:visible;scroll-snap-align:start;}
/* clip only where art bleeds off the frame */
.threshold,.s-full{overflow:hidden;}

/* ── Shared type ─────────────────────────────────────────── */
.eyebrow{font-family:var(--sans);font-weight:500;font-size:clamp(12px,1.05vw,14px);
  letter-spacing:0.3em;text-transform:uppercase;color:var(--copper-light);}
.display{font-family:var(--serif);font-weight:500;color:var(--cream-text);
  letter-spacing:0.005em;line-height:1.04;text-wrap:balance;}
.meta-line{font-family:var(--sans);font-weight:500;font-size:clamp(12px,1.05vw,14px);
  letter-spacing:0.16em;text-transform:uppercase;line-height:1.75;}
.meta-line.cream{color:var(--cream-text);}
.meta-line.slate{color:var(--slate);}

/* ── Threshold (cover · close · divider) ─────────────────── */
.threshold{background:var(--navy);display:flex;align-items:center;}
.threshold .t-text{position:relative;z-index:2;margin-left:40%;padding-right:6%;max-width:1000px;}
.s-cover .display{font-size:clamp(48px,4.9vw,66px);}
.s-close .display{font-size:clamp(44px,4.4vw,60px);}
.s-divider .display{font-size:clamp(48px,4.7vw,62px);}
/* greedy wrap keeps "The Quantum Harvest" intact, sending "Gathering" to its own line when it must wrap */
.s-cover .display,.s-close .display{text-wrap:normal;}
.s-cover .meta,.s-close .meta{margin-top:clamp(44px,8vh,90px);}
.s-close .url{margin-top:26px;font-family:var(--sans);font-weight:500;
  font-size:clamp(12px,1.05vw,14px);letter-spacing:0.16em;text-transform:uppercase;color:var(--copper-light);}

/* arch drawn with a uniform CSS border (open at the bottom); copper-light to match the eyebrow */
.arch{position:absolute;z-index:1;pointer-events:none;left:8%;top:20.5%;width:27%;height:82%;
  border:2px solid var(--copper-light);border-bottom:0;
  border-top-left-radius:50% 30%;border-top-right-radius:50% 30%;}
.arch .dot{position:absolute;left:50%;top:32%;transform:translate(-50%,-50%);
  width:clamp(15px,1.3vw,18px);aspect-ratio:1;border-radius:50%;background:var(--copper-light);}

/* ── Quote (copper ground) ───────────────────────────────── */
.s-quote{background:var(--copper);display:flex;flex-direction:column;align-items:center;
  justify-content:center;padding:0 9vw;text-align:center;}
.s-quote .q-text{font-family:var(--serif);font-weight:500;
  font-size:clamp(26px,3.15vw,41px);line-height:1.34;color:var(--cream);max-width:900px;}
.s-quote .q-trans{font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(18px,1.85vw,24px);line-height:1.4;color:rgba(255,246,224,0.78);
  max-width:760px;margin-top:22px;}
.s-quote .q-dot{width:9px;height:9px;border-radius:50%;background:var(--cream);
  margin:clamp(26px,3.2vw,38px) 0 clamp(18px,2.2vw,24px);}
.s-quote .q-attr{font-family:var(--sans);font-weight:500;font-size:clamp(11.5px,1vw,13px);
  letter-spacing:0.26em;text-transform:uppercase;color:var(--cream);}

/* ── Statement (cream ground) ────────────────────────────── */
.s-statement{background:var(--cream);display:flex;align-items:center;padding:0 7vw 0 11vw;}
.s-statement .s-text{font-family:var(--serif);font-weight:500;
  font-size:clamp(38px,4.95vw,64px);line-height:1.14;color:var(--navy);max-width:18ch;}

/* ── Full image ──────────────────────────────────────────── */
.s-full{background:#05070c;display:block;}
.s-full figure{position:absolute;inset:0;}
.s-full img{width:100%;height:100%;object-fit:cover;}
.s-full picture,.s-split .media picture,.s-gallery .g-cell picture{display:block;width:100%;height:100%;}

/* ── Split (text panel + 1–2 images) — content & hybrid ──── */
.s-split{display:flex;background:var(--cream-light);}
.s-split .panel{background:var(--cream-light);color:var(--navy);
  display:flex;flex-direction:column;justify-content:center;padding:6vh 5% 6vh 7%;}
.s-split .kicker{font-family:var(--sans);font-weight:600;font-size:clamp(12px,1.05vw,13.5px);
  letter-spacing:0.26em;text-transform:uppercase;color:var(--copper);margin-bottom:20px;}
.s-split .heading{font-family:var(--serif);font-weight:500;color:var(--navy);
  font-size:clamp(28px,2.6vw,38px);line-height:1.1;margin-bottom:22px;}
.s-split p{font-family:var(--serif);font-weight:400;
  font-size:clamp(17px,1.55vw,21px);line-height:1.5;color:var(--navy);max-width:46ch;}
.s-split p + p{margin-top:18px;}
.s-split .media{position:relative;overflow:hidden;}
.s-split .media img{width:100%;height:100%;object-fit:cover;}
.s-split .media + .media{border-left:2px solid var(--cream);}
.s-split .list{list-style:none;margin-top:6px;}
.s-split .list li{font-family:var(--serif);font-weight:400;
  font-size:clamp(16px,1.45vw,20px);line-height:1.46;color:var(--navy);
  padding-left:1.3em;text-indent:-1.3em;max-width:46ch;}
.s-split .list li + li{margin-top:10px;}
/* one image: exact 50 / 50 so alternating images meet corner-to-corner, no overlap */
.split-1 .panel{width:50%;}
.split-1 .media{width:50%;}
/* two images: panel 50 / image section 50 (25 + 25) — image block stays exactly half */
.split-2 .panel{width:50%;}
.split-2 .media{width:25%;}
/* image on the left variant (desktop) */
.split-1.img-left{flex-direction:row-reverse;}
.split-2.img-left{flex-direction:row-reverse;}
.split-1.img-left .media + .panel,
.split-1.img-left .panel{}

/* ── Prose (text-only content) — navy ground ─────────────── */
.s-prose{background:var(--navy);display:flex;align-items:center;padding:9vh 7vw;}
.s-prose .col{position:relative;z-index:2;max-width:62ch;}
.s-prose .kicker{font-family:var(--sans);font-weight:600;font-size:clamp(12px,1.05vw,13.5px);
  letter-spacing:0.26em;text-transform:uppercase;color:var(--copper-light);margin-bottom:22px;}
.s-prose .heading{font-family:var(--serif);font-weight:500;color:var(--cream-text);
  font-size:clamp(30px,3vw,44px);line-height:1.08;margin-bottom:26px;}
.s-prose p{font-family:var(--serif);font-weight:400;
  font-size:clamp(18px,1.65vw,22px);line-height:1.52;color:var(--cream-text);max-width:54ch;}
.s-prose p + p{margin-top:18px;}
.s-prose .list{list-style:none;margin-top:8px;}
.s-prose .list li{font-family:var(--serif);font-weight:400;
  font-size:clamp(17px,1.55vw,21px);line-height:1.5;color:var(--cream-text);
  padding-left:1.4em;text-indent:-1.4em;max-width:60ch;}
.s-prose .list li + li{margin-top:12px;}
/* Inclusions — labeled, two columns on desktop */
.s-prose.has-incl .col{max-width:1000px;width:100%;}
.s-prose .incl{margin-top:32px;column-count:2;column-gap:56px;}
.s-prose .incl-row{break-inside:avoid;-webkit-column-break-inside:avoid;margin:0 0 20px;}
.s-prose .incl-label{display:block;font-family:var(--sans);font-weight:600;font-size:12px;
  letter-spacing:0.22em;text-transform:uppercase;color:var(--copper-light);margin-bottom:5px;}
.s-prose .incl-text{display:block;font-family:var(--serif);font-weight:400;
  font-size:clamp(16px,1.4vw,19px);line-height:1.46;color:var(--cream-text);max-width:42ch;}
.s-prose .incl-note{margin-top:16px;font-family:var(--sans);font-weight:400;font-size:13px;
  line-height:1.55;letter-spacing:0.01em;color:var(--slate);}

/* ── Letter (founder's note — redesigned: cream sheet on navy) ──────
   100% token-driven. Drop cap is opt-in via .has-dropcap (data: dropcap).
   Scroll-reveal armed by founders-letter.reveal.js (data: reveal). ── */
.s-letter{background:var(--navy);display:flex;align-items:center;justify-content:center;
  padding:clamp(44px,7vw,110px) clamp(16px,4vw,52px);}
.letter-sheet{background:var(--cream);width:100%;max-width:724px;box-sizing:border-box;
  padding:clamp(44px,5.5vw,82px) clamp(30px,6vw,90px) clamp(50px,6vw,86px);
  box-shadow:0 30px 80px rgba(0,0,0,.45),0 2px 0 rgba(168,83,54,.18);}
.letter-arch{width:clamp(64px,8vw,84px);height:clamp(80px,10vw,104px);
  margin:0 auto clamp(26px,3.4vw,36px);border:1.5px solid var(--copper);border-bottom:none;
  border-radius:9999px 9999px 0 0;position:relative;}
.letter-arch-dot{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:9px;height:9px;border-radius:50%;background:var(--copper);}
.letter-kicker{text-align:center;font-family:var(--sans);font-weight:700;
  font-size:clamp(11px,1.3vw,13px);letter-spacing:.22em;text-transform:uppercase;
  color:var(--copper);margin:0 0 clamp(14px,1.8vw,18px);}
.letter-salutation{text-align:center;font-family:var(--serif);font-weight:600;
  font-size:clamp(38px,5.6vw,52px);line-height:1.04;color:var(--navy);
  margin:0 0 clamp(30px,4.4vw,42px);}
.letter-lead,.letter-para{font-family:var(--serif);font-weight:400;
  font-size:clamp(17px,1.45vw,20px);line-height:1.75;color:var(--navy);
  margin:0 0 clamp(20px,2.5vw,26px);}
.letter-lead.has-dropcap::first-letter{float:left;font-weight:700;color:var(--copper);
  font-size:clamp(58px,9vw,82px);line-height:.72;margin:8px 12px -4px 0;}
.letter-pull{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--copper);
  font-size:clamp(21px,2.7vw,26px);line-height:1.42;margin:clamp(28px,4vw,38px) 0;
  border-left:2px solid var(--copper);padding:6px 0 6px clamp(18px,2.4vw,26px);}
.letter-signoff-block{display:flex;align-items:center;gap:clamp(16px,2.6vw,24px);
  margin-top:clamp(36px,5vw,46px);}
.letter-portrait{flex:none;width:clamp(76px,9vw,100px);height:clamp(92px,11vw,120px);
  border:1.5px solid var(--copper);border-radius:9999px 9999px 8px 8px;overflow:hidden;
  background:var(--cream-light);}
.letter-portrait img{width:100%;height:100%;object-fit:cover;display:block;}
.letter-signoff-text{flex:1 1 auto;}
.letter-signoff{font-family:var(--serif);font-style:italic;font-weight:500;
  font-size:clamp(16px,1.5vw,19px);color:var(--slate);margin:0 0 clamp(8px,1vw,10px);}
.letter-signature{font-family:var(--serif);font-weight:600;font-size:clamp(36px,5.2vw,48px);
  line-height:1;color:var(--copper);margin:0;}
.s-letter.reveal-ready .letter-sheet > *{opacity:0;transform:translateY(20px);
  transition:opacity .85s cubic-bezier(.22,.61,.36,1),transform .85s cubic-bezier(.22,.61,.36,1);}
.s-letter.reveal-ready .letter-sheet > *.is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  .s-letter.reveal-ready .letter-sheet > *{opacity:1;transform:none;transition:none;}}

/* ── Gallery ─────────────────────────────────────────────── */
.s-gallery{background:var(--navy);display:flex;align-items:center;padding:6vh 5vw;}
.s-gallery .g-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;}
.s-gallery .g-cell{position:relative;overflow:hidden;aspect-ratio:4/3;}
.s-gallery .g-cell img{width:100%;height:100%;object-fit:cover;}

/* ── Button ──────────────────────────────────────────────── */
.btn{display:inline-block;margin-top:34px;align-self:flex-start;
  font-family:var(--sans);font-weight:600;font-size:clamp(13px,1.1vw,15px);
  letter-spacing:0.04em;color:var(--cream);background:var(--copper);
  padding:18px 30px;border:0;border-radius:2px;text-decoration:none;cursor:pointer;
  white-space:nowrap;transition:background .2s ease;}
.btn:hover{background:#96492f;}
button.btn{cursor:pointer;border:0;}

/* ── Inquiry form (expands from the button, navy ground) ──── */
.qh-form-wrap{display:none;margin-top:30px;width:100%;max-width:30rem;}
.qh-form-wrap.open{display:block;}
.qh-form .f-row{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;}
.qh-form .f-label{font-family:var(--sans);font-weight:500;font-size:12px;
  letter-spacing:0.12em;text-transform:uppercase;color:var(--cream-text);}
.qh-form .f-input{font-family:var(--sans);font-size:15px;color:var(--cream-text);
  background:rgba(255,246,224,0.06);border:1px solid rgba(255,246,224,0.25);
  border-radius:3px;padding:11px 12px;width:100%;}
.qh-form .f-input:focus{outline:none;border-color:var(--copper);background:rgba(255,246,224,0.10);}
.qh-form textarea.f-input{resize:vertical;min-height:84px;}
.qh-form .f-submit{margin-top:6px;}
.f-status{margin-top:14px;font-family:var(--sans);font-size:14px;line-height:1.5;}
.f-status.f-ok{color:var(--cream-text);}
.f-status.f-err{color:#E08A6B;}

/* ═══════════════════════ MOBILE ≤768 ═══════════════════════ */
@media (max-width:768px){
  /* free, natural touch scrolling on mobile — snap felt jerky */
  html{scroll-snap-type:none;}
  .slide{scroll-snap-align:none;}
  .threshold{flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:9vh 7vw 0;}
  .threshold .t-text{margin-left:0;padding-right:0;max-width:none;}
  .s-cover .display,.s-close .display,.s-divider .display{font-size:clamp(48px,14vw,68px);}
  .s-cover .meta,.s-close .meta{margin-top:5vh;}
  /* arch anchored to the bottom-center; text stacks top-left above it (no overlap) */
  .arch{left:50%;transform:translateX(-50%);top:auto;bottom:0;width:60%;height:46%;}
  .arch .dot{top:26%;width:16px;}
  /* on mobile the arch crowds the title/contact text — keep it only on section-break dividers */
  .s-cover .arch,.s-close .arch{display:none;}
  /* with the arch gone, center the cover/close content in the viewport for balance */
  .s-cover,.s-close{justify-content:center;padding:0 7vw;}

  .s-quote{padding:0 9vw;}
  .s-quote .q-text{font-size:clamp(25px,6vw,33px);}
  .s-statement{padding:0 8vw;}
  .s-statement .s-text{font-size:clamp(34px,9.4vw,48px);max-width:none;}

  /* split → single column, image(s) at natural ratio */
  .s-split{flex-direction:column;}
  .s-split.img-left{flex-direction:column;}
  .s-split .panel,.s-split .media{width:100%!important;}
  /* image fills the top ~40% of the screen; text begins below and overflows as needed */
  .s-split .media{height:40vh;}
  .s-split .media img{height:100%;width:100%;object-fit:cover;}
  .s-split .media + .media{border-left:0;border-top:2px solid var(--cream);}
  .s-split .panel{padding:6vh 8vw 9vh;}
  .s-split p,.split-2 .panel p{max-width:none;}
  /* one image → image before text */
  .split-1 .media{order:-1;}
  /* two images → image · text · image */
  .split-2 .media-a{order:1;}
  .split-2 .panel{order:2;}
  .split-2 .media-b{order:3;}

  .s-prose{padding:9vh 8vw;}
  .s-prose p,.s-prose .list li{max-width:none;}
  .s-prose .incl{column-count:1;}
  .s-prose .incl-text{max-width:none;}
  .s-full{min-height:100vh;}
  .s-gallery .g-grid{grid-template-columns:repeat(2,1fr);}
}

/* ═══════════════════════ NAVIGATION ═══════════════════════ */
/* Desktop: right-edge dot rail (jump + progress). Mobile elements hidden by default. */
.qh-progress, .qh-menu-btn, .qh-overlay{ display:none; }

.qh-rail{ position:fixed; right:20px; top:50%; transform:translateY(-50%);
  z-index:50; display:flex; flex-direction:column; align-items:flex-end; gap:18px; }
.qh-dot{ position:relative; display:block; width:12px; height:12px; }
.qh-dot::after{ content:""; position:absolute; right:0; top:50%; transform:translateY(-50%);
  width:9px; height:9px; border-radius:50%; border:1.5px solid var(--slate);
  background:transparent; transition:background .25s ease, border-color .25s ease, width .2s ease, height .2s ease; }
.qh-dot:hover::after{ background:var(--copper); border-color:var(--copper); }
.qh-dot.active::after{ background:var(--copper); border-color:var(--copper); width:12px; height:12px; }
.qh-dot-label{ position:absolute; right:24px; top:50%; transform:translateY(-50%); white-space:nowrap;
  font-family:var(--sans); font-weight:600; font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--cream-text); background:rgba(10,14,24,0.72); padding:5px 9px; border-radius:3px;
  opacity:0; pointer-events:none; transition:opacity .2s ease; }
.qh-dot:hover .qh-dot-label, .qh-dot.active .qh-dot-label{ opacity:1; }

/* ═══════════════════════ MOBILE NAV ≤768 ═══════════════════════ */
@media (max-width:768px){
  .qh-rail{ display:none; }

  .qh-progress{ display:block; position:fixed; top:0; left:0; right:0; height:3px;
    background:rgba(255,246,224,0.12); z-index:60; }
  .qh-progress-bar{ height:100%; width:0; background:var(--copper); transition:width .1s linear; }

  .qh-menu-btn{ display:block; position:fixed; top:13px; right:13px; z-index:62; cursor:pointer;
    font-family:var(--sans); font-weight:600; font-size:11.5px; letter-spacing:0.18em; text-transform:uppercase;
    color:var(--cream-text); background:rgba(10,14,24,0.6); border:1px solid rgba(255,246,224,0.28);
    border-radius:3px; padding:9px 13px; -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }

  .qh-overlay{ display:flex; position:fixed; inset:0; z-index:61; background:var(--navy);
    flex-direction:column; align-items:center; justify-content:center;
    opacity:0; pointer-events:none; transition:opacity .25s ease; }
  .qh-overlay.open{ opacity:1; pointer-events:auto; }
  .qh-overlay-list{ list-style:none; display:flex; flex-direction:column; gap:22px; text-align:center; }
  .qh-overlay-link{ font-family:var(--serif); font-weight:500; font-size:25px; color:var(--cream-text); text-decoration:none; }
  .qh-overlay-link.active{ color:var(--copper); }
  .qh-overlay-close{ position:absolute; top:10px; right:16px; cursor:pointer;
    background:none; border:0; color:var(--cream-text); font-size:36px; line-height:1; }
}

/* ═══════════════════════ PRINT / PDF ═══════════════════════ */
@media print{ .qh-rail, .qh-progress, .qh-menu-btn, .qh-overlay{ display:none !important; } }

@page{size:1280px 720px;margin:0;}
@media print{
  html{scroll-snap-type:none;}
  body{background:#fff;}
  .slide{min-height:0;width:1280px;height:720px;page-break-after:always;break-after:page;}
  .slide:last-child{page-break-after:auto;break-after:auto;}
}
