/* season: fall */
/* Generated by set_season.py. Edit themes/<name>.css, not this file. */
/* ==========================================================================
   Peninsula Post - FALL seasonal layer
   October on the peninsula: bigleaf maple gold and vine maple red against
   the evergreens, walnut dark blocks, parchment paper.

   Loaded after styles.css as /assets/season.css. Overrides tokens first,
   then adds a few seasonal touches. Remove nothing from styles.css for this;
   `python set_season.py off` puts the base look back.
   ========================================================================== */

:root{
  --cream:#F4ECDD;
  --cream-deep:#EADAC0;
  --paper:#FBF5EA;
  --callout:#F8EEDD;
  --ink:#7A3418;          /* maple rust - headings, buttons, borders (7.7:1 on cream) */
  --deep:#2B1D17;         /* walnut - dark blocks */
  --green:#2E5E4E;        /* evergreen becomes the accent: links, italic em */
  --gold:#E0A03A;         /* harvest amber */
  --gold-deep:#A44A1F;    /* rust orange for small labels (5:1 on cream) */
  --terracotta:#B5502A;
  --text:#3A2F28;
  --text-soft:#5E4E42;
  --muted:#7A6656;
  --line:#E0CBA8;
  --evergreen:var(--deep); /* bracket.css falls back to #1F4A32 without this */

  --leaf-maple:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 1L13.6 5.2L16 4.2L15.4 8.6L18.6 6.6L19.6 8.8L22.6 8.4L21 11.6L23 12.8L18.4 16.2L19.2 18.2L13 17.4L12.6 22.5L11.4 22.5L11 17.4L4.8 18.2L5.6 16.2L1 12.8L3 11.6L1.4 8.4L4.4 8.8L5.4 6.6L8.6 8.6L8 4.2L10.4 5.2Z'/></svg>");
}

::selection{background:var(--gold);color:var(--deep);}

/* Warm the green-tinted shadows from the base sheet. */
.btn:hover{box-shadow:0 10px 24px rgba(74,34,16,.24);}
.poster{box-shadow:0 26px 60px rgba(58,30,14,.30),0 4px 12px rgba(58,30,14,.16);}
.stage:hover .poster{box-shadow:0 32px 70px rgba(58,30,14,.34),0 6px 14px rgba(58,30,14,.18);}
.card:hover{box-shadow:0 18px 38px rgba(58,30,14,.13);}
.panel{box-shadow:0 22px 46px rgba(58,30,14,.14);}
.issue-card:hover{box-shadow:0 24px 50px rgba(58,30,14,.17);}
.paper{box-shadow:0 30px 66px rgba(58,30,14,.26),0 6px 16px rgba(58,30,14,.14);}

/* ---- masthead: the gold dot becomes a maple leaf ---- */
.brand__mark{width:16px;height:16px;border-radius:0;box-shadow:none;background:var(--terracotta);
  -webkit-mask:var(--leaf-maple) center/contain no-repeat;mask:var(--leaf-maple) center/contain no-repeat;
  transform:rotate(-14deg);transition:transform .4s cubic-bezier(.2,.7,.3,1);}
.brand:hover .brand__mark{transform:rotate(8deg);}

/* ---- hero sprig, recolored to turning leaves (CSS beats the SVG attributes) ---- */
.hero__sprig path:nth-child(1){stroke:#7A3418;}
.hero__sprig path:nth-child(2),.hero__sprig path:nth-child(3){fill:#B5502A;}
.hero__sprig path:nth-child(4),.hero__sprig path:nth-child(5){fill:#D98A2B;}
.hero__sprig circle{fill:#8C2F1B;}

/* ---- hero: a slow, sparse drift of leaves behind the copy ----
   One tile of scattered leaves, a tile taller than the hero, sliding down by
   exactly one tile so the loop has no seam. Transform only, so it stays on
   the compositor. The reduced-motion rule in styles.css freezes it. */
.hero::before{content:"";position:absolute;left:0;right:0;top:-640px;bottom:0;z-index:0;
  pointer-events:none;opacity:.28;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='520' height='640' viewBox='0 0 520 640'><defs><path id='m' d='M12 1L13.6 5.2L16 4.2L15.4 8.6L18.6 6.6L19.6 8.8L22.6 8.4L21 11.6L23 12.8L18.4 16.2L19.2 18.2L13 17.4L12.6 22.5L11.4 22.5L11 17.4L4.8 18.2L5.6 16.2L1 12.8L3 11.6L1.4 8.4L4.4 8.8L5.4 6.6L8.6 8.6L8 4.2L10.4 5.2Z'/><path id='o' d='M12 1C18.5 5.5 19.5 14 12 23C4.5 14 5.5 5.5 12 1Z'/></defs><use href='%23m' fill='%23B5502A' transform='translate(40 30) rotate(-20 12 12) scale(1.3)'/><use href='%23o' fill='%23D98A2B' transform='translate(300 90) rotate(35 12 12) scale(.9)'/><use href='%23m' fill='%23E0A03A' transform='translate(450 250) rotate(18 12 12) scale(1)'/><use href='%23m' fill='%238C2F1B' transform='translate(160 330) rotate(55 12 12) scale(.8)'/><use href='%23o' fill='%23B5502A' transform='translate(30 470) rotate(-50 12 12) scale(1.1)'/><use href='%23m' fill='%23D98A2B' transform='translate(360 520) rotate(-8 12 12) scale(1.15)'/><use href='%23o' fill='%23E0A03A' transform='translate(230 610) rotate(70 12 12) scale(.75)'/></svg>");
  background-size:520px 640px;
  animation:pp-leaves 70s linear infinite;}
@keyframes pp-leaves{to{transform:translateY(640px);}}

/* ---- marquee: maple leaves between the towns ---- */
.marquee{border-block-color:color-mix(in srgb,var(--gold) 32%,transparent);}
.marquee__track span::after{content:"";display:inline-block;width:15px;height:15px;
  background:var(--gold);vertical-align:middle;transform:rotate(-12deg);
  -webkit-mask:var(--leaf-maple) center/contain no-repeat;mask:var(--leaf-maple) center/contain no-repeat;}
.marquee__track span:nth-child(3n+2)::after{background:#D9692B;transform:rotate(16deg);}
.marquee__track span:nth-child(3n)::after{background:#C9472B;transform:rotate(-30deg);}

/* ---- small accents ---- */
.card__rule{width:44px;background:linear-gradient(90deg,#8C2F1B,#C25A22 50%,var(--gold));}
.paper__rule{background:linear-gradient(90deg,#8C2F1B,#C25A22 50%,var(--gold));}
.agenda__head{border-bottom-color:var(--terracotta);}

/* ---- footer: a turning-leaf ribbon along the top edge ---- */
.footer{position:relative;border-top:0;}
.footer::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg,var(--green) 0%,#8C2F1B 28%,#C25A22 52%,var(--gold) 76%,var(--green) 100%);}
