/* ============================================================================
   ASTROVE — SITE PAGES
   /shop  /the-house  /hospitality  /corporate-gifting  /business-enquiries
   ----------------------------------------------------------------------------
   Shared primitives first (hero, kicker, section head, ledger, specimen), then
   one authored composition per page. The shell -- masthead, index, house
   record, CTA -- is static-shell.css. The enquiry form is trade.css, loaded
   unchanged on the three trade pages.

   Each page sets its own field: the Shop sits on the neutral void, The House on
   the nebula violet the loader uses, Hospitality on indigo, Gifting on the
   Alphonso ember, Business on plain void. No gradients beyond the one fade from
   field to floor that every generated page already uses.
   ========================================================================== */

.sp-body--shop { --shell-field: var(--void); --sp-field: var(--void); }
.sp-body--the-house { --shell-field: var(--field-nebula); --sp-field: var(--field-nebula); }
.sp-body--hospitality { --shell-field: var(--field-indigo); --sp-field: var(--field-indigo); }
.sp-body--corporate-gifting { --shell-field: var(--field-ember); --sp-field: var(--field-ember); }
.sp-body--business-enquiries { --shell-field: var(--void); --sp-field: var(--void); }

[data-sku="jamun"] { --sku-accent: var(--sku-jamun-bright); }
[data-sku="mango"] { --sku-accent: var(--nectar); }
[data-sku="pineapple"] { --sku-accent: var(--chlorophyll); }

.sp-main { overflow-x: clip; }

/* ---- small type ------------------------------------------------------------ */
.sp-index,
.sp-kicker,
.sp-ledger dt,
.sp-record dt,
.sp-specimen__index,
.sp-specimen__spec dt,
.sp-chapter__label,
.sp-letter figcaption {
  font-size: 0.7rem;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* ---- hero ------------------------------------------------------------------- */
.sp-hero {
  padding: clamp(1.2rem, 3vw, 2rem) var(--gutter-right) clamp(2.6rem, 6vw, 4.6rem) var(--gutter-left);
  background: linear-gradient(to bottom, var(--sp-field) 0%, var(--sp-field) 55%, var(--void-deep) 100%);
}
.sp-crumbs ol {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 clamp(1.4rem, 4vw, 2.4rem);
  padding: 0;
  list-style: none;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  color: var(--moon-dim);
}
.sp-crumbs li + li::before { content: "/"; margin: 0 0.6em; color: var(--line-strong); }
.sp-crumbs a { text-decoration: none; color: var(--moon-soft); }
.sp-index { display: flex; align-items: center; gap: 0.7rem; margin: 0; color: var(--moon-soft); }
.sp-index::before { content: ""; width: 1.6rem; height: 1px; background: var(--shell-accent); }
.sp-title {
  max-width: 18ch;
  margin: 0.5em 0 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(2.45rem, 7.4vw, 4.1rem);
  line-height: 1;
  letter-spacing: -0.02em;
  text-wrap: balance;
}
.sp-lede {
  max-width: 46ch;
  margin: 1.2rem 0 0;
  font-size: clamp(1.02rem, 1.4vw, 1.2rem);
  line-height: 1.5;
  color: var(--moon-soft);
}
.sp-hero__cta { margin: 1.8rem 0 0; }

.sp-kicker { margin: 0 0 0.7rem; color: var(--shell-accent); }
.sp-section-head { margin-bottom: clamp(1.4rem, 3vw, 2.2rem); }
.sp-section-head h2,
.sp-trio__body h2,
.sp-object__body h2,
.sp-learn h2,
.sp-enquiry__head h2,
.sp-chapter__body > h2,
.sp-closing h2 {
  max-width: 24ch;
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.85rem, 4vw, 2.9rem);
  line-height: 1.06;
  letter-spacing: -0.012em;
  text-wrap: balance;
}

/* Every top-level block is a ruled record with the same gutters. */
.sp > section,
.sp > .sp-chapters,
.sp > .sp-honesty,
.sp > .sp-manifesto {
  margin: 0 var(--gutter-right) 0 var(--gutter-left);
  padding-block: clamp(2.6rem, 6vw, 4.8rem);
  border-top: 1px solid var(--line);
}

.sp-ledger { display: grid; margin: 1.4rem 0 0; max-width: 44rem; }
.sp-ledger div {
  display: grid;
  grid-template-columns: minmax(7rem, 1fr) minmax(0, 2fr);
  gap: 1rem;
  padding: 0.8rem 0;
  border-top: 1px solid var(--line);
}
.sp-ledger div:last-child { border-bottom: 1px solid var(--line); }
.sp-ledger dt { color: var(--moon-dim); padding-top: 0.15rem; }
.sp-ledger dd { margin: 0; color: var(--moon); }

.sp-honesty {
  max-width: none;
  font-size: 0.9rem;
  color: var(--moon-soft);
}
.sp > .sp-honesty { padding-block: 1.6rem; }

/* ---- specimen (shared by Shop and Hospitality) ------------------------------ */
.sp-specimens { display: grid; gap: 0; border-top: 1px solid var(--line-strong); }
.sp-specimen {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  gap: 1.2rem;
  padding: 1.4rem 0;
  border-bottom: 1px solid var(--line);
}
.sp-specimen__media { display: block; }
.sp-specimen__media img { width: 100%; }
.sp-specimen__index { margin: 0 0 0.4rem; color: var(--sku-accent); }
.sp-specimen h3 { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(1.35rem, 2.4vw, 1.7rem); line-height: 1.12; }
.sp-specimen h3 a { text-decoration: none; }
.sp-specimen h3 a:hover { text-decoration: underline; text-decoration-color: var(--sku-accent); text-underline-offset: 0.2em; }
.sp-specimen__profile { margin: 0.5rem 0 0; color: var(--moon); }
.sp-specimen__note { margin: 0.2rem 0 0; font-size: 0.9rem; color: var(--moon-dim); }
.sp-specimen__spec { display: grid; margin: 0.9rem 0 0; }
.sp-specimen__spec div { display: grid; grid-template-columns: 6.2rem minmax(0, 1fr); gap: 0.6rem; padding: 0.4rem 0; border-top: 1px solid var(--line); }
.sp-specimen__spec dt { color: var(--moon-dim); padding-top: 0.12rem; }
.sp-specimen__spec dd { margin: 0; font-size: 0.92rem; }
.sp-specimen__more { display: inline-flex; align-items: center; min-height: 2.75rem; margin-top: 0.4rem; font-size: 0.92rem; --shell-accent: var(--sku-accent); }

/* ---- SHOP: trio -------------------------------------------------------------- */
.sp-trio { display: grid; gap: clamp(1.6rem, 4vw, 3rem); }
.sp-trio__media { margin: 0; }
.sp-trio__media img { width: 100%; }
.sp-trio__body > p { max-width: 44ch; color: var(--moon-soft); }
.sp-trio__meta { display: flex; align-items: baseline; gap: 1rem; margin: 1.2rem 0 0; }
.sp-trio__meta strong { font-family: var(--font-display); font-weight: 400; font-size: clamp(2rem, 4vw, 2.8rem); line-height: 1; color: var(--moon); }
.sp-trio__meta span { font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--moon-dim); }
.sp-assurance { margin: 1rem 0 0; font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--moon) !important; }
.sp-assurance span { text-transform: none; letter-spacing: 0; color: var(--moon-dim); }
.sp-availability { margin-top: 1.6rem; padding-top: 1.3rem; border-top: 1px solid var(--line); }
.sp-availability__state { margin: 0; font-family: var(--font-display); font-size: clamp(1.3rem, 2.2vw, 1.6rem); line-height: 1.2; }
.sp-availability__detail { max-width: 42ch; margin: 0.4rem 0 1.2rem; color: var(--moon-soft); }
.sp-aside { margin: 1.2rem 0 0; font-size: 0.9rem; }

.sp-learn__links { display: grid; gap: 0; margin: 1.6rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.sp-learn__links li { padding: 1rem 0; border-bottom: 1px solid var(--line); }
.sp-learn__links a { font-family: var(--font-display); font-size: 1.4rem; line-height: 1.2; text-decoration: underline; text-decoration-color: var(--shell-accent); text-underline-offset: 0.25em; }
.sp-learn__links p { margin: 0.3rem 0 0; font-size: 0.9rem; color: var(--moon-dim); }

/* ---- THE HOUSE ---------------------------------------------------------------- */
.sp-manifesto {
  display: grid;
  margin-block: 0;
  font-family: var(--font-display);
  font-size: clamp(2.3rem, 8.2vw, 6.4rem);
  line-height: 0.95;
  letter-spacing: -0.03em;
  color: var(--moon);
}
.sp-manifesto em { font-style: italic; color: var(--nectar); }

.sp-chapters { padding-block: 0 !important; border-top: 0 !important; }
.sp-chapter {
  display: grid;
  gap: 0.9rem;
  padding-block: clamp(2.6rem, 6vw, 4.8rem);
  border-top: 1px solid var(--line);
}
.sp-chapter__label { display: flex; gap: 0.8rem; margin: 0; color: var(--shell-accent); }
.sp-chapter__label span { color: var(--moon-dim); }
.sp-chapter__body { max-width: 62rem; }
.sp-chapter__body > h2 { margin-bottom: 1.3rem; }
.sp-chapter__body > p { max-width: 60ch; margin: 0 0 1rem; color: var(--moon-soft); font-size: 1.05rem; }
.sp-links { display: flex; flex-wrap: wrap; gap: 0.2rem 1.8rem; margin: 1.2rem 0 0; padding: 0; list-style: none; }
.sp-links a { display: inline-flex; align-items: center; min-height: 2.75rem; }

.sp-refusals { display: grid; gap: 0; margin: 0.4rem 0 0; padding: 0; list-style: none; counter-reset: refusal; }
.sp-refusals li { padding: 1.2rem 0; border-top: 1px solid var(--line); counter-increment: refusal; }
.sp-refusals li:last-child { border-bottom: 1px solid var(--line); }
.sp-refusals h3 { display: flex; gap: 0.8rem; margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 1.5rem; line-height: 1.15; }
.sp-refusals h3::before { content: counter(refusal, decimal-leading-zero); font-family: var(--font-ui); font-size: 0.7rem; letter-spacing: 0.14em; line-height: 2.4; color: var(--shell-accent); }
.sp-refusals p { max-width: 58ch; margin: 0.5rem 0 0.3rem; color: var(--moon-soft); }
.sp-refusals a { display: inline-flex; align-items: center; min-height: 2.75rem; font-size: 0.9rem; }

.sp-letter { margin: 0.4rem 0 1.4rem; padding: clamp(1.4rem, 4vw, 2.6rem) 0; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.sp-letter blockquote { margin: 0; }
.sp-letter blockquote p { max-width: 26ch; margin: 0; font-family: var(--font-display); font-style: italic; font-size: clamp(1.8rem, 4.6vw, 3.2rem); line-height: 1.12; color: var(--moon); }
.sp-letter figcaption { margin-top: 1.2rem; color: var(--moon-dim); }

.sp-record { display: grid; margin: 1.4rem 0 0; max-width: 46rem; }
.sp-record div { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.25rem; padding: 0.85rem 0; border-top: 1px solid var(--line); }
.sp-record div:last-child { border-bottom: 1px solid var(--line); }
.sp-record dt { color: var(--moon-dim); }
.sp-record dd { margin: 0; color: var(--moon); line-height: 1.5; }

.sp-closing { text-align: left; }
.sp-closing p { max-width: 44ch; margin: 1rem 0 1.4rem; color: var(--moon-soft); }

/* ---- HOSPITALITY -------------------------------------------------------------- */
.sp-settings__list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line-strong); }
.sp-settings__list li { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); column-gap: 0.6rem; padding: 1.3rem 0; border-bottom: 1px solid var(--line); }
.sp-settings__n { grid-row: span 2; font-family: var(--font-display); font-size: 1.5rem; line-height: 1; color: var(--shell-accent); }
.sp-settings__list h3 { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 1.45rem; line-height: 1.15; }
.sp-settings__list p { max-width: 54ch; margin: 0.45rem 0 0; color: var(--moon-soft); }
.sp-ledger--wide { max-width: 52rem; }

/* ---- CORPORATE GIFTING -------------------------------------------------------- */
.sp-object { display: grid; gap: clamp(1.6rem, 4vw, 3rem); }
.sp-object__media { margin: 0; }
.sp-object__media img { width: 100%; }
.sp-object__body > p { max-width: 44ch; color: var(--moon-soft); }
.sp-discovery__list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; counter-reset: gift; border-top: 1px solid var(--line-strong); }
.sp-discovery__list li { padding: 1.3rem 0 1.3rem 3rem; border-bottom: 1px solid var(--line); counter-increment: gift; position: relative; }
.sp-discovery__list li::before { content: counter(gift, decimal-leading-zero); position: absolute; left: 0; top: 1.45rem; font-size: 0.7rem; letter-spacing: 0.14em; color: var(--sku-accent); }
.sp-discovery__name { margin: 0; font-family: var(--font-display); font-size: clamp(1.7rem, 4vw, 2.4rem); line-height: 1.05; }
.sp-discovery__name a { text-decoration: none; }
.sp-discovery__name a:hover { text-decoration: underline; text-decoration-color: var(--sku-accent); text-underline-offset: 0.2em; }
.sp-discovery__profile { margin: 0.4rem 0 0; color: var(--moon); }
.sp-discovery__note { margin: 0.2rem 0 0; font-size: 0.9rem; color: var(--moon-dim); }
.sp-occasions__list { display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.sp-occasions__list li { flex: 1 1 50%; padding: 1rem 0; border-bottom: 1px solid var(--line); font-family: var(--font-display); font-size: 1.3rem; line-height: 1.2; }

/* ---- BUSINESS ENQUIRIES ------------------------------------------------------- */
.sp-elsewhere h2 { margin: 0 0 1rem; }
.sp-elsewhere ul { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.sp-elsewhere a { display: grid; gap: 0.2rem; padding: 1rem 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.sp-elsewhere strong { font-family: var(--font-display); font-weight: 400; font-size: 1.4rem; line-height: 1.15; color: var(--moon); }
.sp-elsewhere span { font-size: 0.9rem; color: var(--moon-dim); }
.sp-elsewhere a:hover strong { text-decoration: underline; text-decoration-color: var(--shell-accent); text-underline-offset: 0.2em; }

/* ---- ENQUIRY (form styling is trade.css) --------------------------------------- */
.sp-enquiry__head p:not(.sp-kicker) { max-width: 52ch; margin: 1rem 0 0; font-size: 0.92rem; color: var(--moon-soft); }
.sp-enquiry .trade-form { max-width: 62rem; }
.sp-enquiry .trade-intent { margin-top: clamp(2rem, 5vw, 3rem); }

/* ---- wider ---------------------------------------------------------------------- */
@media (min-width: 640px) {
  .sp-specimens { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.6rem; border-top: 0; }
  .sp-specimen { grid-template-columns: minmax(0, 1fr); align-content: start; padding-top: 1.2rem; border-top: 1px solid var(--line-strong); border-bottom: 0; }
  .sp-specimen__media { width: 62%; }
  .sp-record div { grid-template-columns: minmax(10rem, 1fr) minmax(0, 2.4fr); gap: 1.2rem; }
  .sp-elsewhere ul { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 1.6rem; border-top: 0; }
  .sp-elsewhere a { border-top: 1px solid var(--line-strong); border-bottom: 0; }
  .sp-occasions__list li { flex-basis: 33.333%; }
  .sp-learn__links { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.6rem; border-top: 0; }
  .sp-learn__links li { border-top: 1px solid var(--line-strong); border-bottom: 0; }
}

@media (min-width: 960px) {
  .sp-trio { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; column-gap: clamp(2.5rem, 5vw, 5rem); }
  .sp-object { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; column-gap: clamp(2.5rem, 5vw, 5rem); }
  .sp-chapter { grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); column-gap: clamp(2rem, 4vw, 4rem); }
  .sp-chapter__label { padding-top: 0.9rem; }
  .sp-settings__list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2rem; }
  .sp-discovery__list { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 1.6rem; border-top: 0; }
  .sp-discovery__list li { border-top: 1px solid var(--line-strong); border-bottom: 0; }
  .sp-hero { padding-top: clamp(1rem, 1.6vw, 1.5rem); }
}