/* ══════════════════════════════════════════════════════════════════════════════
   PALETTE — Shoreline Seafood, Inc.                        loaded AFTER kit.css
   Queenstown, Maryland. Built 2026-09-20.

   Every colour below was sampled from one of their own photographs. The source
   is named beside each value. Nothing here came from a palette generator.

   The four fixtures this palette is built on:
     1. THE STORE. Their Facebook profile picture is the Gambrills building: white
        walls, a lighthouse tower, and a deep royal-blue standing-seam roof with
        the SHORELINE and SEAFOOD sign bands in the same blue. That blue is the
        brand, and darkened it is the ground of every dark band on this site.
     2. THE STEAMED CRAB. Their cover photograph is a single steamed Maryland blue
        crab shot close on stainless. The shell runs #FA6E31 in the highlight to
        #D8471E in the shadow. That vermillion is the accent and it is the one
        colour a Maryland seafood company is allowed to own.
     3. THE TRAILER. "Shoreline Seafood Inc." is hand-painted on the catering
        trailer in a weathered seafoam teal over brushed aluminium (#70959B
        measured). Secondary accent.
     4. THE LIVE CRAB. A bushel of live blue crabs, claws a cornflower blue.
        The cool light source.
   ══════════════════════════════════════════════════════════════════════════════ */
:root{
  /* ── the ground ──
     The store's roof and sign blue taken down to near-black. Not a neutral
     charcoal: it stays blue, because their building is blue. */
  --ground:#07182B;        /* SOURCE: store roof + sign band, darkened           */
  --panel:#0C2239;         /* one step up, for alternating bands                 */
  --panel-2:#123049;       /* two steps up                                       */
  --ink:#0A1F36;           /* the sign blue at full depth. dark bookends         */
  --ink-2:#17344F;
  --ink-3:#3C5A78;

  /* ── the two light sources ──
     Warm is the steamed shell. Cool is the live crab's claw. Both light every
     band, glow the small type, and ignite the card edges on hover. */
  --lume:#E2551F;          /* WARM.  SOURCE: steamed crab shell                  */
  --lume-hot:#FF7A45;      /* the same shell in the highlight, for hover         */
  --lume-2:#7FA3D8;        /* COOL.  SOURCE: live blue crab claw                 */

  /* ── accents on the light layer ──
     The vermillion is darkened a step for use as type and buttons on paper,
     so it clears contrast without losing the crab. */
  --accent:#B13F17;        /* steamed shell, darkened for paper                  */
  --accent-lt:#FF9165;     /* the shell highlight, for use on the dark bands     */
  --accent-2:#4E8C8C;      /* SOURCE: hand-painted trailer lettering             */
  --mark:#E2551F;          /* logo mark only. never type, never UI               */

  /* ── paper and type ──
     Warm bone white, off the inner shell of the crab in the cover photograph.
     Never #FFF. */
  --paper:#F8F3E8;
  --paper-2:#FFFDF6;
  --line:#E4DACA;
  --body:#25313E;          /* deep slate blue-grey, off the crab's shadow side   */
  --muted:#404D5C;
  --txt:rgba(244,241,233,.90);
  --txt-2:rgba(244,241,233,.70);

  /* ── edges ── derived from --lume, per the kit's note ── */
  --edge:rgba(226,85,31,.17);
  --edge-hot:rgba(226,85,31,.46);
  --hair:rgba(194,70,26,.24);
  --glow-a:rgba(226,85,31,.22);
  --glow-b:rgba(127,163,216,.18);

  /* ── type ──
     Fraunces for the display: a warm, slightly wonky modern serif that reads as
     a food brand rather than a fish wholesaler, and holds up at 5.4vw. Inter for
     everything else. Both free, both variable. Sizes are the kit's floors. */
  --serif:"Fraunces",'Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;

  --wrap:1180px;

  /* Square buttons, not pills. The Dishoom/Aman camp. A crab feast is a plain,
     confident, working business and the square edge suits it. */
  --btn-r:3px;
  --display:clamp(2.6rem,5.4vw,5.4rem);
}

/* CONTRAST — computed with the WCAG relative-luminance formula against the real
   values above, not eyeballed. Dark grounds flatter type that is actually too dim.
     --ink    #0A1F36 on --paper #F8F3E8 ......... 15.04:1   headings
     --body   #25313E on --paper #F8F3E8 ......... 11.95:1   body copy
     --muted  #404D5C on --paper #F8F3E8 .........  7.80:1   ledes, card copy
     --accent #B13F17 on --paper #F8F3E8 .........  5.28:1   links and 17px+ only
     #FFFFFF          on --accent #B13F17 ........  5.85:1   button labels
     #FFFFFF          on --ink   #0A1F36 ......... 16.64:1   dark-band headings
     --txt            on --ground #07182B ........ 12.90:1   dark-band body
     --txt-2          on --ground #07182B .........  8.19:1   dark-band secondary
     --accent-lt on --ink ........................  7.52:1   eyebrows on dark

   The eyebrow is 12.5px, which is the smallest type on the site, so it does NOT
   use --accent (5.28:1 is fine for 17px and too thin for 12.5px). site.css gives
   it #8C3011 on paper, which computes 7.45:1. Everything above beats the 4.5:1
   legal floor by design: this audience skews older and is reading on a phone. */