/* ═══════════════════════════════════════════════════════════════
   FARM DIAMOND — "THE LIVING CARTON"  ·  Bespoke homepage (v3)
   A tactile, editorial, scroll-driven build. Everything below is
   net-new (fd-sp- namespace); it depends only on the design tokens
   from global.css. Loaded last on the front page.
   ═══════════════════════════════════════════════════════════════ */

.home .fd-site-main, body.page-template-template-home { background: var(--fd-cream); }

/* ── Shared atoms ─────────────────────────────────────────────── */
.fd-sp-grain {
  position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background-image: var(--paper-grain); opacity: .5; mix-blend-mode: multiply;
}
.fd-sp-eyebrow {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: 'Lora', serif; font-size: 12px; font-weight: 600;
  letter-spacing: .32em; text-transform: uppercase; color: var(--fd-terra);
  margin-bottom: 22px;
}
.fd-sp-eyebrow.center { justify-content: center; }
.fd-sp-eyebrow.light { color: var(--fd-gold); }
.fd-sp-rule { width: 40px; height: 1px; background: linear-gradient(90deg, transparent, var(--fd-gold)); }
.fd-sp-eyebrow.center .fd-sp-rule:last-child { background: linear-gradient(90deg, var(--fd-gold), transparent); }
.fd-sp-rule.gold { background: linear-gradient(90deg, transparent, var(--fd-gold)); }

.fd-sp-h2 {
  font-family: 'Cormorant Garamond', serif; font-weight: 600;
  font-size: clamp(40px, 6vw, 78px); line-height: 1.02;
  letter-spacing: .005em; color: var(--fd-green-deep); margin: 0 0 18px;
}
.fd-sp-h2.light { color: var(--fd-cream); }
.fd-sp-script {
  font-family: 'Caveat', cursive; font-weight: 700; color: var(--fd-terra);
  font-size: 1.18em; line-height: .8; display: inline-block; transform: rotate(-3deg);
}
.fd-sp-script.gold, .fd-sp-script.light { color: var(--fd-gold); }
.fd-sp-lede {
  font-family: 'Lora', serif; font-size: clamp(16px, 1.6vw, 19px);
  line-height: 1.85; color: var(--fd-charcoal-mid); max-width: 620px;
}
.fd-sp-lede.light { color: rgba(245,239,222,.82); }
.fd-sp-head { text-align: center; max-width: 760px; margin: 0 auto clamp(48px,7vw,84px); }

/* ── Buttons ─────────────────────────────────────────────────── */
.fd-sp-btn {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: 'Lora', serif; font-size: 13px; font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; padding: 15px 30px;
  border-radius: 2px; border: 1px solid transparent; cursor: pointer;
  transition: transform .4s var(--ease-luxe), box-shadow .4s var(--ease-luxe), background .4s ease, color .3s ease;
}
.fd-sp-btn-fill { background: var(--fd-terra); color: var(--fd-cream); border-color: var(--fd-terra-dark); box-shadow: var(--shadow-terra); }
.fd-sp-btn-fill:hover { background: var(--fd-terra-dark); color: var(--fd-cream); transform: translateY(-3px); box-shadow: 0 18px 44px rgba(181,73,27,.4); }
.fd-sp-btn-line { background: transparent; color: var(--fd-green-deep); border-color: var(--fd-green); }
.fd-sp-btn-line:hover { background: var(--fd-green); color: var(--fd-cream); transform: translateY(-3px); }
.fd-sp-btn-ghost { background: transparent; color: var(--fd-cream); border-color: rgba(245,239,222,.5); }
.fd-sp-btn-ghost:hover { background: var(--fd-cream); color: var(--fd-green-deep); transform: translateY(-3px); }
.fd-sp-btn-cream { background: var(--fd-cream); color: var(--fd-terra); border-color: var(--fd-gold); }
.fd-sp-btn-cream:hover { background: var(--fd-paper); transform: translateY(-3px); box-shadow: 0 16px 40px rgba(0,0,0,.25); }
.fd-sp-btn-line-light { background: transparent; color: var(--fd-cream); border-color: rgba(245,239,222,.45); }
.fd-sp-btn-line-light:hover { background: rgba(245,239,222,.12); transform: translateY(-3px); }

/* ═══════════════════════════════════════════════════════════════
   1 · HERO
   ═══════════════════════════════════════════════════════════════ */
.fd-sp-hero {
  position: relative; overflow: hidden;
  min-height: 100vh; display: flex; flex-direction: column; justify-content: center;
  padding: clamp(120px,14vh,180px) clamp(28px,6vw,96px) clamp(80px,10vh,120px);
  background:
    radial-gradient(ellipse 70% 60% at 78% 30%, rgba(201,162,39,.14), transparent 60%),
    radial-gradient(ellipse 60% 60% at 12% 80%, rgba(30,75,44,.08), transparent 60%),
    var(--grad-canvas);
}
/* engraved gold double-rule frame around the whole hero */
.fd-sp-hero-frame {
  position: absolute; inset: clamp(16px,2.4vw,30px); z-index: 2; pointer-events: none;
  border: 1px solid rgba(201,162,39,.5);
  box-shadow: inset 0 0 0 4px var(--fd-cream), inset 0 0 0 5px rgba(201,162,39,.25);
}
.fd-sp-spine {
  position: absolute; top: 50%; z-index: 3; pointer-events: none;
  font-family: 'Lora', serif; font-size: 11px; letter-spacing: .42em;
  text-transform: uppercase; color: var(--fd-muted); white-space: nowrap;
}
.fd-sp-spine-l { left: clamp(26px,3vw,42px); transform: translateY(-50%) rotate(180deg); writing-mode: vertical-rl; }
.fd-sp-spine-r { right: clamp(26px,3vw,42px); transform: translateY(-50%); writing-mode: vertical-rl; }

.fd-sp-hero-grid {
  position: relative; z-index: 4;
  max-width: 1240px; margin: 0 auto; width: 100%;
  display: grid; grid-template-columns: 1.02fr 0.98fr; align-items: center;
  gap: clamp(32px,5vw,72px);
}
.fd-sp-hero-title {
  font-family: 'Cormorant Garamond', serif; font-weight: 600;
  font-size: clamp(56px, 9vw, 128px); line-height: .92; letter-spacing: .002em;
  color: var(--fd-green-deep); margin: 0 0 26px;
}
.fd-sp-hero-title .fd-sp-script { display: block; font-size: 1.05em; color: var(--fd-terra); margin: -.06em 0; }
.fd-sp-hero-sub { font-family: 'Lora', serif; font-size: clamp(17px,1.6vw,21px); line-height: 1.8; color: var(--fd-charcoal-mid); max-width: 480px; margin: 0 0 38px; }
.fd-sp-hero-cta { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }
.fd-sp-hero-cta.center { justify-content: center; }
.fd-sp-hero-meta { display: flex; align-items: center; gap: 12px; margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--fd-border); font-family: 'Lora', serif; font-size: 14px; color: var(--fd-muted); }
.fd-sp-hero-meta strong { font-family: 'Cormorant Garamond', serif; font-size: 19px; color: var(--fd-green-deep); }
.fd-sp-stars, .fd-sp-letter-stars { color: var(--fd-gold); letter-spacing: 2px; }

/* — the carton stage — */
.fd-sp-hero-stage { position: relative; display: flex; align-items: center; justify-content: center; perspective: 1400px; }
.fd-sp-tilt {
  position: relative; width: min(100%, 460px); aspect-ratio: 1/1;
  display: flex; align-items: center; justify-content: center;
  transform-style: preserve-3d; transition: transform .25s ease-out; will-change: transform;
}
.fd-sp-seal {
  position: absolute; top: -6%; right: -2%; z-index: 6; color: var(--fd-gold);
  transform: translateZ(70px); animation: fd-sp-spin 36s linear infinite;
  filter: drop-shadow(0 6px 14px rgba(120,90,10,.3));
}
@keyframes fd-sp-spin { to { transform: translateZ(70px) rotate(360deg); } }

/* carton body */
.fd-sp-carton {
  position: relative; width: 100%; transform: translateZ(0);
  border-radius: 10px 10px 14px 14px; padding: 0;
  filter: drop-shadow(0 40px 60px rgba(40,30,10,.34));
}
.fd-sp-carton-lid {
  background: linear-gradient(160deg, #2a5e3a 0%, var(--fd-green) 60%, var(--fd-green-deep) 100%);
  border: 1px solid var(--fd-green-ink); border-bottom: none;
  border-radius: 10px 10px 0 0; padding: 22px 26px 18px; text-align: center;
  position: relative; overflow: hidden;
}
.fd-sp-carton-lid::after { content:""; position:absolute; inset:6px; border:1px solid rgba(201,162,39,.4); border-radius:6px; pointer-events:none; }
.fd-sp-carton-brand { display: block; font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: clamp(22px,3vw,32px); color: var(--fd-cream); letter-spacing: .01em; line-height: 1; }
.fd-sp-carton-sub { display: block; font-family: 'Lora', serif; font-size: 10.5px; letter-spacing: .26em; text-transform: uppercase; color: var(--fd-gold); margin-top: 7px; }
.fd-sp-carton-tray {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 7px;
  padding: 18px 16px 22px;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.04) 0 2px, transparent 2px 5px),
    linear-gradient(180deg, #e9ddc0 0%, #ddcfa9 100%);
  border: 1px solid #c9b78e; border-top: none; border-radius: 0 0 14px 14px;
  box-shadow: inset 0 8px 18px rgba(120,90,40,.28);
}
.fd-sp-cell {
  position: relative; aspect-ratio: 1/1.15; display: flex; align-items: center; justify-content: center;
  border-radius: 50% 50% 48% 48% / 56% 56% 44% 44%;
  background: radial-gradient(ellipse at 50% 35%, #c5b288 0%, #a9966c 70%, #8e7b54 100%);
  box-shadow: inset 0 -3px 6px rgba(0,0,0,.25), inset 0 4px 8px rgba(255,255,255,.15);
}
.fd-sp-egg {
  width: 74%; aspect-ratio: 1/1.28; border-radius: 50% 50% 49% 49% / 60% 60% 40% 40%;
  background: radial-gradient(ellipse at 38% 30%, #fffdf6 0%, #f3e6cc 65%, #e0caa0 100%);
  box-shadow: inset -3px -5px 9px rgba(170,130,70,.4), inset 2px 3px 6px rgba(255,255,255,.7), 0 3px 6px rgba(80,55,20,.3);
  transition: transform .5s var(--ease-spring);
}
.fd-sp-tilt:hover .fd-sp-egg { transform: translateY(-3px); }
/* the cracked cell */
.fd-sp-cell.is-cracked { background: radial-gradient(ellipse at 50% 40%, #8e7b54 0%, #6f5e3c 100%); overflow: visible; }
.fd-sp-albumen {
  position: absolute; width: 150%; height: 150%; z-index: 1;
  background: radial-gradient(ellipse at 50% 50%, rgba(255,250,235,.95) 0%, rgba(250,240,215,.6) 45%, transparent 72%);
  border-radius: 50%; filter: blur(.4px);
}
.fd-sp-yolk {
  position: relative; z-index: 2; width: 64%; aspect-ratio: 1; border-radius: 50%;
  background: var(--grad-yolk);
  box-shadow: 0 4px 16px rgba(200,110,10,.55), inset 5px 7px 14px rgba(255,235,150,.6), inset -5px -8px 16px rgba(170,80,0,.45);
  animation: fd-sp-yolk-glow 3.6s ease-in-out infinite;
}
.fd-sp-yolk-shine { position: absolute; top: 18%; left: 22%; width: 30%; height: 22%; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.92), transparent 70%); filter: blur(1px); }
@keyframes fd-sp-yolk-glow {
  0%,100% { box-shadow: 0 4px 16px rgba(200,110,10,.5), inset 5px 7px 14px rgba(255,235,150,.6), inset -5px -8px 16px rgba(170,80,0,.45); }
  50%     { box-shadow: 0 8px 30px rgba(232,146,10,.8), inset 5px 7px 14px rgba(255,235,150,.6), inset -5px -8px 16px rgba(170,80,0,.45); }
}

/* floating chips */
.fd-sp-chip {
  position: absolute; z-index: 6; transform: translateZ(50px);
  display: inline-flex; align-items: baseline; gap: 6px;
  background: rgba(250,247,236,.94); border: 1px solid var(--fd-gold);
  padding: 9px 15px; border-radius: 2px; box-shadow: var(--shadow-card);
  font-family: 'Lora', serif; font-size: 12px; letter-spacing: .04em; color: var(--fd-charcoal-mid);
  animation: fd-sp-float 7s ease-in-out infinite;
}
.fd-sp-chip b { font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 17px; color: var(--fd-terra); }
.fd-sp-chip-1 { top: 8%; left: -10%; animation-delay: 0s; }
.fd-sp-chip-2 { top: 46%; right: -14%; animation-delay: .9s; }
.fd-sp-chip-3 { bottom: 6%; left: -6%; animation-delay: 1.8s; }
@keyframes fd-sp-float { 0%,100% { transform: translateZ(50px) translateY(0); } 50% { transform: translateZ(50px) translateY(-12px); } }

.fd-sp-scroll {
  position: absolute; left: 50%; bottom: clamp(26px,4vh,44px); z-index: 5;
  transform: translateX(-50%); display: inline-flex; flex-direction: column; align-items: center; gap: 10px;
  font-family: 'Lora', serif; font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--fd-muted);
}
.fd-sp-scroll svg { color: var(--fd-terra); animation: fd-sp-bob 1.8s ease-in-out infinite; }
@keyframes fd-sp-bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(6px); } }

/* ═══════════════════════════════════════════════════════════════
   2 · ANATOMY
   ═══════════════════════════════════════════════════════════════ */
.fd-sp-anatomy {
  position: relative; padding: clamp(90px,12vw,150px) clamp(28px,6vw,96px);
  background: linear-gradient(180deg, var(--fd-cream) 0%, var(--fd-paper) 100%);
}
.fd-sp-diagram { display: flex; justify-content: center; margin: 0 auto clamp(56px,7vw,90px); }
.fd-sp-specimen {
  position: relative; width: min(560px, 92vw); aspect-ratio: 1/1; margin: 0;
  display: flex; align-items: center; justify-content: center;
}
.fd-sp-spec-ring {
  position: absolute; width: 70%; aspect-ratio: 1; border-radius: 50%;
  border: 1px dashed rgba(201,162,39,.5); animation: fd-sp-spin2 40s linear infinite;
}
.fd-sp-spec-ring::before { content:""; position:absolute; inset:24px; border-radius:50%; border:1px solid rgba(30,75,44,.12); }
@keyframes fd-sp-spin2 { to { transform: rotate(360deg); } }
.fd-sp-spec-egg {
  position: relative; z-index: 2; width: 38%; aspect-ratio: 1/1.3;
  border-radius: 50% 50% 49% 49% / 60% 60% 40% 40%;
  background: radial-gradient(ellipse at 38% 30%, #fffdf6 0%, #f3e6cc 62%, #e0caa0 100%);
  box-shadow: inset -8px -12px 26px rgba(170,130,70,.4), inset 6px 8px 18px rgba(255,255,255,.7), 0 26px 50px rgba(80,55,20,.28);
  display: flex; align-items: center; justify-content: center;
}
.fd-sp-spec-yolk {
  width: 52%; aspect-ratio: 1; border-radius: 50%; background: var(--grad-yolk);
  box-shadow: 0 6px 22px rgba(200,110,10,.5), inset 6px 9px 18px rgba(255,235,150,.55), inset -7px -10px 20px rgba(170,80,0,.45);
  animation: fd-sp-yolk-glow 3.6s ease-in-out infinite;
}
/* annotations */
.fd-sp-anno {
  position: absolute; width: 220px; max-width: 42vw; z-index: 3;
  opacity: 0; transition: opacity .7s ease, transform .7s var(--ease-luxe);
}
.fd-sp-reveal.is-in .fd-sp-anno { opacity: 1; transform: none; }
.fd-sp-anno-tl { top: 4%; left: -4%; text-align: right; transform: translate(20px,10px); }
.fd-sp-anno-tr { top: 8%; right: -4%; transform: translate(-20px,10px); }
.fd-sp-anno-bl { bottom: 8%; left: -2%; text-align: right; transform: translate(20px,-10px); }
.fd-sp-anno-br { bottom: 4%; right: -2%; transform: translate(-20px,-10px); }
.fd-sp-anno-num { font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 26px; color: var(--fd-gold-deep); display: block; line-height: 1; }
.fd-sp-anno-label { font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: 21px; color: var(--fd-green-deep); display: block; margin: 2px 0 6px; }
.fd-sp-anno-text { font-family: 'Lora', serif; font-size: 13.5px; line-height: 1.65; color: var(--fd-muted); display: block; }
.fd-sp-anno-dot { display: none; }

.fd-sp-tape {
  display: grid; grid-template-columns: repeat(4,1fr); max-width: 960px; margin: 0 auto;
  border: 1px solid var(--fd-border); border-radius: 3px; background: var(--fd-white); overflow: hidden;
}
.fd-sp-tape-item { text-align: center; padding: 28px 16px; border-right: 1px solid var(--fd-border); }
.fd-sp-tape-item:last-child { border-right: none; }
.fd-sp-tape-n { display: block; font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: clamp(38px,5vw,60px); color: var(--fd-terra); line-height: 1; font-variant-numeric: tabular-nums; }
.fd-sp-tape-l { display: block; font-family: 'Lora', serif; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--fd-muted); margin-top: 8px; }

/* ═══════════════════════════════════════════════════════════════
   3 · PROVENANCE (image band)
   ═══════════════════════════════════════════════════════════════ */
.fd-sp-prov {
  position: relative; overflow: hidden;
  padding: clamp(100px,14vw,180px) clamp(28px,6vw,96px);
  background-image: var(--prov-img); background-size: cover; background-position: center; background-attachment: fixed;
}
.fd-sp-prov-veil { position: absolute; inset: 0; background: linear-gradient(105deg, rgba(15,42,24,.92) 0%, rgba(20,54,31,.78) 45%, rgba(15,42,24,.35) 100%); }
.fd-sp-prov-inner { position: relative; z-index: 2; max-width: 720px; }
.fd-sp-prov-stats { display: flex; flex-wrap: wrap; gap: clamp(28px,5vw,64px); margin: 38px 0; }
.fd-sp-prov-n { display: block; font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: clamp(44px,6vw,72px); color: var(--fd-gold); line-height: 1; font-variant-numeric: tabular-nums; }
.fd-sp-prov-l { display: block; font-family: 'Lora', serif; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: rgba(245,239,222,.7); margin-top: 8px; }

/* ═══════════════════════════════════════════════════════════════
   4 · COLLECTION CHAPTERS
   ═══════════════════════════════════════════════════════════════ */
.fd-sp-coll { padding: clamp(90px,12vw,150px) clamp(28px,6vw,96px); background: var(--fd-paper); }
.fd-sp-chapter {
  display: grid; grid-template-columns: 1fr 1fr; align-items: center;
  gap: clamp(40px,6vw,96px); max-width: 1180px; margin: 0 auto clamp(64px,9vw,120px);
}
.fd-sp-chapter:last-child { margin-bottom: 0; }
.fd-sp-chapter:nth-child(even) .fd-sp-chapter-visual { order: 2; }
.fd-sp-chapter[data-accent="terra"] { --ca: var(--fd-terra); --ca-soft: var(--fd-terra-soft); }
.fd-sp-chapter[data-accent="green"] { --ca: var(--fd-green); --ca-soft: var(--fd-green-soft); }
.fd-sp-chapter[data-accent="gold"]  { --ca: var(--fd-gold-deep); --ca-soft: var(--fd-gold-soft); }

.fd-sp-chapter-visual { position: relative; display: flex; align-items: center; justify-content: center; min-height: 360px; }
.fd-sp-chapter-num {
  position: absolute; z-index: 1; font-family: 'Cormorant Garamond', serif; font-weight: 700;
  font-size: clamp(180px,26vw,300px); line-height: .8; color: var(--ca); opacity: .1; letter-spacing: -.04em;
}
.fd-sp-chapter-disc {
  position: absolute; z-index: 0; width: 78%; aspect-ratio: 1; border-radius: 50%;
  background: var(--ca-soft); border: 1px solid color-mix(in srgb, var(--ca) 30%, transparent);
}
.fd-sp-chapter-visual img {
  position: relative; z-index: 2; width: 78%; height: auto; object-fit: contain;
  filter: drop-shadow(0 26px 40px rgba(60,40,15,.3)); transition: transform .7s var(--ease-luxe);
}
.fd-sp-chapter:hover .fd-sp-chapter-visual img { transform: translateY(-10px) rotate(-2deg); }
.fd-sp-chapter-tagline { font-family: 'Caveat', cursive; font-weight: 700; font-size: 26px; color: var(--ca); display: block; margin-bottom: 4px; }
.fd-sp-chapter-name { font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: clamp(32px,4vw,52px); line-height: 1.04; color: var(--fd-green-deep); margin: 0 0 18px; }
.fd-sp-chapter-desc { font-family: 'Lora', serif; font-size: 16px; line-height: 1.85; color: var(--fd-charcoal-mid); max-width: 460px; margin: 0 0 26px; }
.fd-sp-chapter-meta { display: flex; gap: 0; border-top: 1px solid var(--fd-border); border-bottom: 1px solid var(--fd-border); margin-bottom: 30px; }
.fd-sp-chapter-meta span { flex: 1; padding: 16px 8px 16px 0; display: flex; flex-direction: column; gap: 3px; font-family: 'Lora', serif; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--fd-muted); border-right: 1px solid var(--fd-border); }
.fd-sp-chapter-meta span:last-child { border-right: none; padding-left: 18px; }
.fd-sp-chapter-meta span:not(:first-child) { padding-left: 18px; }
.fd-sp-chapter-meta strong { font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 28px; letter-spacing: 0; color: var(--ca); text-transform: none; }

/* ═══════════════════════════════════════════════════════════════
   5 · YOLK PROMISE
   ═══════════════════════════════════════════════════════════════ */
.fd-sp-yolk-promise { padding: clamp(90px,12vw,150px) clamp(28px,6vw,96px); background: linear-gradient(180deg, var(--fd-paper), var(--fd-cream)); }
.fd-sp-compare { display: flex; align-items: center; justify-content: center; gap: clamp(24px,5vw,80px); max-width: 900px; margin: 0 auto; flex-wrap: wrap; }
.fd-sp-compare-side { margin: 0; text-align: center; flex: 1; min-width: 240px; }
.fd-sp-compare-egg {
  width: clamp(160px,22vw,240px); aspect-ratio: 1/1.18; margin: 0 auto 26px;
  border-radius: 50% 50% 49% 49% / 60% 60% 40% 40%; display: flex; align-items: center; justify-content: center;
  position: relative;
}
.fd-sp-egg-fd { background: radial-gradient(ellipse at 38% 30%, #fffdf6 0%, #f3e6cc 62%, #e0caa0 100%); box-shadow: inset -8px -12px 26px rgba(170,130,70,.4), inset 6px 8px 18px rgba(255,255,255,.7), 0 28px 50px rgba(80,55,20,.3); }
.fd-sp-egg-pale { background: radial-gradient(ellipse at 38% 30%, #fefefe 0%, #f0f0ec 62%, #ddddd6 100%); box-shadow: inset -8px -12px 26px rgba(160,160,150,.3), inset 6px 8px 18px rgba(255,255,255,.8), 0 18px 36px rgba(80,80,70,.18); }
.fd-sp-compare-yolk { width: 50%; aspect-ratio: 1; border-radius: 50%; }
.fd-sp-yolk-fd { background: var(--grad-yolk); box-shadow: 0 6px 22px rgba(200,110,10,.55), inset 6px 9px 18px rgba(255,235,150,.55), inset -7px -10px 20px rgba(170,80,0,.45); animation: fd-sp-yolk-glow 3.6s ease-in-out infinite; }
.fd-sp-yolk-pale { background: radial-gradient(circle at 36% 32%, #f5dc80 0%, #e6cf6a 55%, #cdb94e 100%); box-shadow: inset 4px 6px 12px rgba(255,250,200,.4), inset -4px -6px 12px rgba(150,135,50,.3); }
.fd-sp-compare-vs { font-family: 'Caveat', cursive; font-weight: 700; font-size: 38px; color: var(--fd-gold-deep); }
.fd-sp-compare-tag { display: block; font-family: 'Lora', serif; font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--fd-terra); margin-bottom: 8px; }
.fd-sp-compare-tag.muted, .fd-sp-compare-name.muted, .fd-sp-compare-note.muted { color: var(--fd-muted); }
.fd-sp-compare-name { display: block; font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: 26px; color: var(--fd-green-deep); }
.fd-sp-compare-note { display: block; font-family: 'Lora', serif; font-size: 13px; color: var(--fd-muted); margin-top: 5px; }
.is-other .fd-sp-compare-egg { opacity: .92; filter: saturate(.85); }

/* ═══════════════════════════════════════════════════════════════
   6 · LETTERS (stamped postcards)
   ═══════════════════════════════════════════════════════════════ */
.fd-sp-letters { padding: clamp(90px,12vw,150px) clamp(28px,6vw,96px); background: var(--fd-green-soft); }
.fd-sp-letter-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; max-width: 1180px; margin: 0 auto; }
.fd-sp-letter {
  position: relative; background: var(--fd-paper); border: 1px solid var(--fd-border);
  border-radius: 3px; padding: 38px 32px 30px; margin: 0; transform: rotate(var(--r));
  box-shadow: var(--shadow-card); transition: transform .5s var(--ease-luxe), box-shadow .5s var(--ease-luxe);
  background-image: var(--paper-grain), none;
}
.fd-sp-letter:hover { transform: rotate(0deg) translateY(-6px); box-shadow: var(--shadow-hover); }
.fd-sp-stamp {
  position: absolute; top: 18px; right: 18px; width: 58px; height: 66px;
  background: var(--fd-terra-soft); border: 1px dashed var(--fd-terra);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  transform: rotate(6deg);
}
.fd-sp-stamp-yolk { width: 20px; height: 20px; border-radius: 50%; background: var(--grad-yolk); box-shadow: 0 1px 4px rgba(200,110,10,.5); }
.fd-sp-stamp-txt { font-family: 'Lora', serif; font-size: 7px; font-weight: 700; letter-spacing: .12em; color: var(--fd-terra); text-align: center; line-height: 1.2; }
.fd-sp-letter-stars { display: block; margin-bottom: 14px; font-size: 15px; }
.fd-sp-letter blockquote {
  font-family: 'Cormorant Garamond', serif; font-size: 22px; line-height: 1.4; font-style: italic;
  color: var(--fd-green-deep); margin: 0 0 24px; border: none; padding: 0;
}
.fd-sp-letter blockquote::before { content: "\201C"; color: var(--fd-gold); font-size: 1.4em; line-height: 0; vertical-align: -.3em; margin-right: 2px; }
.fd-sp-letter figcaption { display: flex; align-items: center; gap: 13px; }
.fd-sp-letter-init { width: 44px; height: 44px; border-radius: 50%; background: var(--fd-green); color: var(--fd-cream); border: 1px solid var(--fd-gold); display: flex; align-items: center; justify-content: center; font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 16px; flex-shrink: 0; }
.fd-sp-letter-name { display: block; font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 18px; color: var(--fd-green-deep); }
.fd-sp-letter-loc { display: block; font-family: 'Lora', serif; font-size: 12px; color: var(--fd-muted); }

/* ═══════════════════════════════════════════════════════════════
   7 · CTA wax-seal block
   ═══════════════════════════════════════════════════════════════ */
.fd-sp-cta {
  position: relative; overflow: hidden; text-align: center;
  padding: clamp(100px,14vw,170px) clamp(28px,6vw,96px);
  background:
    radial-gradient(ellipse 60% 80% at 50% 0%, rgba(201,162,39,.16), transparent 60%),
    var(--grad-terra);
}
.fd-sp-cta-inner { position: relative; z-index: 2; max-width: 720px; margin: 0 auto; }
.fd-sp-cta-mark { color: var(--fd-gold); font-size: 22px; }
.fd-sp-cta-h { font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: clamp(42px,6.5vw,86px); line-height: 1; color: var(--fd-cream); margin: 14px 0 18px; }
.fd-sp-cta-h .fd-sp-script.light { color: var(--fd-gold); display: inline-block; }
.fd-sp-cta p { font-family: 'Lora', serif; font-size: clamp(16px,1.6vw,19px); line-height: 1.8; color: rgba(245,239,222,.88); max-width: 480px; margin: 0 auto 36px; }

/* ═══════════════════════════════════════════════════════════════
   REVEAL SYSTEM
   ═══════════════════════════════════════════════════════════════ */
.fd-sp-reveal { opacity: 0; transform: translateY(34px); transition: opacity .9s var(--ease-luxe), transform .9s var(--ease-luxe); }
.fd-sp-reveal.is-in { opacity: 1; transform: none; }

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 980px) {
  .fd-sp-hero-grid { grid-template-columns: 1fr; gap: 56px; text-align: center; }
  .fd-sp-hero-sub { margin-left: auto; margin-right: auto; }
  .fd-sp-hero-cta, .fd-sp-hero-meta { justify-content: center; }
  .fd-sp-hero-meta { border-top: none; }
  .fd-sp-hero-stage { order: -1; }
  .fd-sp-tilt { width: min(86%, 380px); }
  .fd-sp-spine { display: none; }
  .fd-sp-chapter { grid-template-columns: 1fr; gap: 32px; text-align: center; }
  .fd-sp-chapter:nth-child(even) .fd-sp-chapter-visual { order: 0; }
  .fd-sp-chapter-visual { min-height: 280px; }
  .fd-sp-chapter-desc { margin-left: auto; margin-right: auto; }
  .fd-sp-chapter-meta { max-width: 420px; margin-left: auto; margin-right: auto; }
  .fd-sp-letter-row { grid-template-columns: 1fr; max-width: 480px; }
  .fd-sp-letter { transform: rotate(0deg); }
  /* annotations stack below the egg on small screens */
  .fd-sp-specimen { flex-direction: column; aspect-ratio: auto; gap: 28px; }
  .fd-sp-spec-ring { position: relative; width: 220px; height: 220px; }
  .fd-sp-spec-egg { position: absolute; }
  .fd-sp-anno { position: static; width: 100%; max-width: 420px; text-align: center !important; transform: none !important; }
  .fd-sp-anno-tl, .fd-sp-anno-bl { text-align: center; }
}
@media (max-width: 600px) {
  .fd-sp-hero { padding-top: 130px; min-height: auto; }
  .fd-sp-tape { grid-template-columns: 1fr 1fr; }
  .fd-sp-tape-item:nth-child(2) { border-right: none; }
  .fd-sp-tape-item:nth-child(1), .fd-sp-tape-item:nth-child(2) { border-bottom: 1px solid var(--fd-border); }
  .fd-sp-prov { background-attachment: scroll; }
  .fd-sp-prov-stats { gap: 24px 40px; }
  .fd-sp-compare { gap: 18px; }
  .fd-sp-chip-1 { left: -2%; }
  .fd-sp-chip-2 { right: -2%; }
}

/* ═══════════════════════════════════════════════════════════════
   REDUCED MOTION
   ═══════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .fd-sp-seal, .fd-sp-yolk, .fd-sp-spec-yolk, .fd-sp-yolk-fd, .fd-sp-chip,
  .fd-sp-spec-ring, .fd-sp-scroll svg { animation: none !important; }
  .fd-sp-reveal, .fd-sp-anno { opacity: 1 !important; transform: none !important; transition: none !important; }
  .fd-sp-tilt { transform: none !important; }
}