/* ============================================================
   TOKENS — Mike's Donuts & Coffee × eirene-classic (merged)
   Palette = the NYC Anthora coffee cup ("We Are Happy To Serve You"):
   medium blue page, deep navy footer, gold + cream print, white ink.
   Type: Fraunces/Palatino serif headings (from Mike's theme),
   Space Grotesk labels, Avenir Next body. Motion system unchanged.
   ============================================================ */

:root{
  --primary: #2a6ebb;        /* cup medium blue — page bg */
  --primary-dark: #1a3760;   /* footer, bag text — cup deep navy */
  --tertiary: #f2c274;       /* bright gold accent (was lime) */
  --secondary: #eef3fd;      /* cream-white accent (was tan) */
  --brown: #28466e;          /* deep blue variant (was brown) */
  --white-smoke: #f4f8ff;    /* body ink — white like the cup print */
  --dark-text: #d7e3f4;      /* soft text */

  --font-heading: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --font-label: "Space Grotesk", "Avenir Next", sans-serif;
  --font-body: "Avenir Next", "Poppins", sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%;overflow-x:clip}
body{
  font-family:var(--font-body);font-size:1rem;line-height:1.3;
  background:var(--primary);color:var(--white-smoke);
}
img,video,svg{display:block;max-width:100%}
ul{list-style:none}
a{color:inherit;text-decoration:none}
button{font-family:inherit;background:none;border:0;color:inherit;cursor:pointer}

/* type — reference scale unchanged */
.small-heading{
  color:var(--secondary);letter-spacing:3px;font-family:var(--font-label);
  font-size:3vw;line-height:1;
}
.small-heading.align-middle{text-align:center}
.small-heading.color-light-green{color:var(--tertiary)}
.small-heading.color-dark-green{color:var(--primary-dark)}
.heading-style-h2{
  color:var(--tertiary);font-family:var(--font-heading);
  font-size:5vw;font-weight:500;
}
.heading-style-h2.roast{color:var(--secondary);text-align:center;font-size:7vw}
.heading-style-h2.bag{color:var(--primary-dark);text-align:center;font-size:7vw}
.split-lines{
  color:var(--secondary);text-align:center;font-family:var(--font-heading);
  font-size:4vw;line-height:.9;
}
.text-size-regular{
  color:#fff;max-width:50ch;font-size:1vw;font-weight:400;line-height:1.3;
}
.text-size-regular.align-middle{text-align:center}
.bag-text{
  color:var(--primary-dark);letter-spacing:3px;text-transform:uppercase;font-size:1.2rem;
}

/* split-lines reveal targets (JS wraps lines) */
.split-lines .sl-line{display:block;overflow:hidden}
.split-lines .sl-line > span{display:inline-block;transform:translateY(110%)}

/* image frame — deep navy behind every photo */
.img-slot{
  position:relative;overflow:hidden;background:#14335e;
  display:flex;align-items:center;justify-content:center;
}
.img-slot::before{
  content:"";position:absolute;inset:0;
  background:
    repeating-linear-gradient(45deg, rgba(255,255,255,.03) 0 16px, transparent 16px 32px);
}

/* mobile type — vw sizes collapse on phones, so pin readable sizes */
@media (max-width:767px){
  .small-heading{font-size:.85rem}
  .heading-style-h2{font-size:1.65rem;line-height:1.15}
  .heading-style-h2.roast,.heading-style-h2.bag{font-size:2rem}
  .split-lines{font-size:2.1rem;line-height:1.05}
  .text-size-regular{font-size:1.05rem;line-height:1.55}
}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
  .split-lines .sl-line > span{transform:none}
}