/**
 * Quoin — Retail Design System token layer
 * -----------------------------------------
 * Generated from /quoin/quoin.md (v2, June 2026). That spec is canonical;
 * change it first, then regenerate these tokens.
 *
 * Rules:
 * - Tokens only. No component styles, no layout, no Flatsome overrides.
 * - Blocks and patterns consume var(--quoin-*) exclusively — a hardcoded
 *   hex in a block is a bug.
 * - This file is enqueued standalone (frontend + editor style) via
 *   inc/quoin.php. It is deliberately NOT part of the style.css @import
 *   chain or the production min bundle.
 * - Never shares values with Forme (the internal-app design system).
 */

:root {
  /* ---------------------------------------------------------------
     Brand-core anchors — stable cross-seasonal identity colors
     (Allison's 2026 ASE data)
     --------------------------------------------------------------- */
  --quoin-coral: #FF9E81;  /* Warm coral — Everyday 1 & 2, Valentine's. Primary warmth signature. */
  --quoin-cream: #FFEBD9;  /* Soft cream — Valentine's, Spring/Summer, Fall. Primary light surface. */
  --quoin-ink:   #2D2926;  /* Warm near-black. Body text and deep accents. Never pure black. Approved by Allison, June 2026. */

  /* ---------------------------------------------------------------
     Cross-palette recurring colors — semi-core
     (blush + ochre promoted by the June 2026 consolidation pass)
     --------------------------------------------------------------- */
  --quoin-red:   #EF515D;  /* Everyday 1 & 2 */
  --quoin-gold:  #F09E1F;  /* Everyday 1 & 2, Spring/Summer, Fall */
  --quoin-blush: #EEC2DB;  /* Everyday 1 & 2, Spring/Summer */
  --quoin-ochre: #A1A505;  /* Fall, Winter/Holidays */

  /* ---------------------------------------------------------------
     Seasonal palettes — six groups (Allison, 2026). A page draws
     from ONE group; its dominant color field comes from that group
     (quoin.md, Palette mapping rules). Anchors and cross-palette
     colors complete each group and are defined above — never
     re-declared here. Both Everyday groups are tokenized; palette
     review happens on rendered pages, not swatches (quoin.md,
     Open Questions — resolved August 2026).
     --------------------------------------------------------------- */

  /* Everyday 1 — completes with red, gold, blush, cream, coral */
  --quoin-olive:    #9FA438;
  --quoin-tomato:   #ED3424;
  --quoin-indigo:   #3F317E;

  /* Everyday 2 — completes with coral, gold, blush, red */
  --quoin-flame:    #F25C27;
  --quoin-kelly:    #1C8D0B;
  --quoin-violet:   #7C06F2;
  --quoin-orchid:   #DA5FB9;

  /* Valentine's / Early spring — completes with coral, cream */
  --quoin-poppy:    #F94A36;
  --quoin-iris:     #6805FF;
  --quoin-lilac:    #D891DC;
  --quoin-rose:     #FF7782;
  --quoin-cherry:   #ED2D39;

  /* Spring / Summer — completes with cream, gold, blush */
  --quoin-burnt:    #E1551D;
  --quoin-mustard:  #D5C40B;
  --quoin-teal:     #6ABDBF;
  --quoin-plum:     #AD4897;

  /* Fall — completes with cream, gold, ochre */
  --quoin-salmon:   #EF8B7F;
  --quoin-mahogany: #57160B;
  --quoin-rust:     #D56630;

  /* Winter / Holidays — completes with ochre */
  --quoin-holly:    #DE2F24;
  --quoin-garnet:   #6B0800;
  --quoin-snow:     #FFF7EE;  /* Winter light surface — warmer white, distinct from cream */
  --quoin-moss:     #819124;
  --quoin-pine:     #1C441E;

  /* ---------------------------------------------------------------
     Swipe variant tokens — the named ink-swipe color set, exposed
     as block attributes on imp/ink-swipe. Aliases into the palette
     tokens — one source of truth.
     --------------------------------------------------------------- */
  --quoin-swipe-coral:   var(--quoin-coral);
  --quoin-swipe-cream:   var(--quoin-cream);
  --quoin-swipe-burnt:   var(--quoin-burnt);
  --quoin-swipe-red:     var(--quoin-red);
  --quoin-swipe-gold:    var(--quoin-gold);
  --quoin-swipe-mustard: var(--quoin-mustard);
  --quoin-swipe-plum:    var(--quoin-plum);

  /* ---------------------------------------------------------------
     Font tokens — two registers, there is no third
     --------------------------------------------------------------- */
  --quoin-body:    'Proxima Nova', system-ui, sans-serif;  /* Adobe Fonts — everything functional */
  --quoin-display: 'IMP Hand', 'Proxima Nova', cursive;    /* Self-hosted — display moments only, never under ~28px */

  /* ---------------------------------------------------------------
     Type scale — two tracks (approved 2026-06-12, see quoin.md)
     Display track: IMP Hand only, fluid via clamp; the 28px floor on
     display-md makes the IMP Hand minimum structurally unviolable.
     Body track mirrors the functional site (Flatsome ems at 16px root)
     so editorial body copy never drifts from adjacent product UI.
     --------------------------------------------------------------- */
  --quoin-text-display-xl: clamp(44px, 8vw, 64px);   /* Hero headlines */
  --quoin-text-display-lg: clamp(32px, 5.5vw, 44px); /* Collection titles, seasonal headlines */
  --quoin-text-display-md: clamp(28px, 4vw, 32px);   /* Swipe-banner text, small display moments */

  --quoin-text-lg: 20px;   /* Ledes, editorial-insert text cell. = site h3 */
  --quoin-text-md: 16px;   /* Body. = site body / product title */
  --quoin-text-sm: 14px;   /* Captions, meta */
  --quoin-text-xs: 13px;   /* Eyebrow labels (uppercase, tracked). Site floor — nothing smaller */

  --quoin-leading-display: 1.25;
  --quoin-leading-body: 1.6;

  /* ---------------------------------------------------------------
     Spacing scale — Flatsome-native 15px rhythm (approved 2026-06-12)
     md = Flatsome grid gutter, lg = Flatsome section padding, so
     Quoin patterns sit flush with the surrounding functional grid.
     --------------------------------------------------------------- */
  --quoin-space-xs:  5px;    /* Micro gaps: eyebrow → headline */
  --quoin-space-sm:  10px;   /* Tight internal gaps */
  --quoin-space-md:  15px;   /* = grid gutter. Default gap */
  --quoin-space-lg:  30px;   /* = section padding. Default block spacing */
  --quoin-space-xl:  45px;   /* Editorial section internal padding, mobile */
  --quoin-space-2xl: 60px;   /* Editorial section internal padding, desktop */
  --quoin-space-3xl: 90px;   /* Hero color-field padding, desktop */
  --quoin-space-4xl: 120px;  /* Seasonal landing hero, max breathing room */
  --quoin-hero-clearance: 250px;  /* Hero top padding on the Quoin Landing template — clears the transparent floating header so hero content never sits under the nav */

  /* ---------------------------------------------------------------
     Effects + physical surfaces
     --------------------------------------------------------------- */
  --quoin-paper: #FFFFFF;  /* Paper/plate-mount white — a physical surface, not a palette color (plate frames, ink-strip chips). */
  --quoin-plate-shadow: 0 28px 56px rgba(45, 41, 38, 0.22);  /* Plate-frame lift. Ink-tinted shadow; translucency on cast light is fine — the no-translucency rule governs brand ink, not shadows. */
}

/* -------------------------------------------------------------------
   Responsive token values — same tokens, phone-tuned.
   ------------------------------------------------------------------- */
@media (max-width: 599px) {
  :root {
    --quoin-hero-clearance: 120px;  /* Phone header is shorter — 250px reads as dead space above the hero */
  }
}

/* -------------------------------------------------------------------
   IMP Hand — Allison's hand built as an OpenType font.
   Contextual alternates (calt) cycle letter variants so repeated
   characters never render identically; calt and liga are browser
   defaults, so no font-feature-settings rule is needed.
   Fallback is Proxima Nova at heavy weight — an honest fallback,
   never a cursive font faking hand-lettering.
   ------------------------------------------------------------------- */
@font-face {
  font-family: 'IMP Hand';
  src: url('../fonts/imp-hand.woff2') format('woff2');
  font-display: swap;
}