/* Apples of Gold Press — main stylesheet. Mobile-first; no external fonts or CDNs. */

/* ---- Brand tokens: values from /workspace/shared/brand/BRAND.md ---- */
:root{
  /* Core brand-kit palette (BRAND.md "CSS variables") */
  --aog-navy:#22304A; --aog-navy-deep:#16203A; --aog-gold:#E2B864; --aog-cream:#F6EEDC;
  --aog-ink:#1A1A1A; --aog-burgundy:#6E1E2C;
  --aog-font-display:"PT Serif", Georgia, serif;
  --aog-font-body:"DejaVu Sans", "Verdana", system-ui, sans-serif;

  /* ==== PERSONA COLORS: the ONE place to change Rachel/Daniel hex values ==== */
  --rachel-sage:#8A9A7B;        /* Rachel primary (links, footer) */
  --rachel-cream:#F5EFE3;       /* Rachel page background */
  --rachel-terracotta:#C0714F;  /* Rachel accent (feature links, borders) */
  --rachel-ink:#3E3A35;         /* Rachel body text */
  --daniel-navy:#22313F;        /* Daniel primary (text, links, footer) */
  --daniel-rust:#B5532A;        /* Daniel accent (feature links, buttons) */
  --daniel-canvas:#EFE7D8;      /* Daniel page background */

  /* Site aliases mapped onto the brand kit (rest of this file uses these) */
  --gold:var(--aog-gold); --gold-dark:#8A6420; /* darker gold for readable text on cream */
  --cream:var(--aog-cream); --ink:var(--aog-ink); --navy:var(--aog-navy);
  --green:var(--aog-navy); /* legacy name: hover/focus color, now brand navy */
  --card:#FFFFFF; --muted:#5E5244; --radius:14px;
  --serif:var(--aog-font-display);   /* headings (system fallback; no web fonts loaded) */
  --sans:var(--aog-font-body);       /* body copy */
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--cream);line-height:1.6}
img,svg{max-width:100%}
a{color:var(--gold-dark)} a:hover{color:var(--green)}
/* Visible keyboard focus for accessibility */
:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.skip{position:absolute;left:-999px} .skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem;z-index:9}
.wrap{max-width:960px;margin:0 auto;padding:0 1.1rem}

/* ---- Header / nav ---- */
/* Navy header with gold apple + gold rule (emblem on navy = gold, per BRAND.md) */
header.site{background:var(--aog-navy);border-bottom:4px solid var(--gold)}
header.site .wrap{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;padding:.8rem 1.1rem}
.brand{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--cream);font-family:var(--serif);font-weight:700;font-size:1.25rem}
.brand img{width:44px;height:44px}
nav ul{list-style:none;display:flex;gap:1rem;margin:0;padding:0;flex-wrap:wrap}
nav a{text-decoration:none;font-weight:600;color:var(--cream)} nav a:hover{color:var(--gold)}
nav{margin-left:auto}

/* ---- Hero ---- */
.hero{text-align:center;padding:2.5rem 0 1.5rem}
.hero h1{font-family:var(--serif);font-size:clamp(1.8rem,6vw,2.8rem);margin:.3rem 0;color:var(--gold-dark)}
.verse{font-style:italic;color:var(--muted);max-width:36rem;margin:0 auto}

/* ---- Cards / grid ---- */
h2{font-family:var(--serif);color:var(--gold-dark)}
.grid{display:grid;gap:1rem;grid-template-columns:1fr}
@media (min-width:640px){.grid{grid-template-columns:repeat(2,1fr)}}
.card{background:var(--card);border-radius:var(--radius);padding:1.2rem;box-shadow:0 2px 10px rgba(122,82,10,.12);border-top:5px solid var(--gold)}
.card h3{margin-top:0;font-family:var(--serif)}
.btn{display:inline-block;background:var(--gold);color:var(--ink);padding:.6rem 1rem;border-radius:999px;font-weight:700;text-decoration:none;border:0;cursor:pointer;font-size:1rem;margin:.2rem .3rem .2rem 0}
.btn:hover{background:var(--navy);color:#fff}
.btn.alt{background:transparent;border:2px solid var(--gold-dark)}

/* ---- Signup form ---- */
form.signup{background:#fff;padding:1.2rem;border-radius:var(--radius);border:2px solid var(--gold);max-width:32rem;margin:1rem auto}
form.signup label{display:block;font-weight:600;margin:.5rem 0 .2rem}
form.signup input[type=email],form.signup input[type=text]{width:100%;padding:.7rem;border:2px solid #CDBB94;border-radius:8px;font-size:1rem}
.consent{font-size:.9rem;color:var(--muted)}
.notice{background:#FFF0D0;border-left:5px solid #C0392B;padding:.8rem;margin-top:.8rem;border-radius:6px}
.hp{position:absolute;left:-5000px} /* honeypot field hidden from humans */
section{padding:1.2rem 0}
footer{margin-top:2rem;background:var(--aog-navy-deep);color:#F3E6C8;padding:1.4rem 0;font-size:.9rem}
footer a{color:var(--gold)}
.legal{opacity:.85;font-size:.85rem}

/* ==== Persona link-in-bio pages (/rachel, /daniel) ====
   Self-contained themes; deliberately separate from any IT/drone brand styles. */
body.bio main{max-width:30rem;padding-top:1.5rem}           /* narrow, phone-first column */
.bio-top{text-align:center}
.bio-top h1{font-family:var(--serif);margin:.4rem 0 .2rem}
.avatar{border-radius:50%;background:#fff;padding:6px}
.disclose{font-size:.85rem;margin:.2rem auto 1rem;max-width:22rem}
a.link{display:block;text-align:center;padding:.9rem 1rem;margin:.6rem 0;border-radius:var(--radius);text-decoration:none;font-weight:700}
body.bio footer{text-align:center}
/* Rachel: sage + cream + terracotta (colors come from the PERSONA COLORS block in :root) */
body.rachel{--sage:var(--rachel-sage);--sage-dark:#55634A;background:var(--rachel-cream);color:var(--rachel-ink)} /* --sage-dark: darker sage for readable text */
body.rachel h1{color:var(--sage-dark)}
body.rachel .disclose{color:var(--sage-dark)}
body.rachel .avatar{border:3px solid var(--rachel-terracotta)}
body.rachel a.link{background:var(--sage-dark);color:#fff;border:2px solid var(--sage)} /* dark sage keeps white text readable */
body.rachel a.link:hover{background:var(--rachel-terracotta);border-color:var(--rachel-terracotta)}
body.rachel a.link.feature{background:#fff;color:var(--sage-dark);border:2px solid var(--rachel-terracotta)}
body.rachel footer{background:var(--sage-dark);color:var(--rachel-cream)}
body.rachel footer a{color:var(--aog-gold)}
body.rachel .tag{font-style:italic}

/* Daniel: self-hosted OFL web fonts, loaded ONLY by body.daniel rules below
   (browsers download @font-face files only when a matching element uses them). */
@font-face{font-family:"Zilla Slab";src:url(/assets/fonts/zilla-slab-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Zilla Slab";src:url(/assets/fonts/zilla-slab-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(/assets/fonts/source-sans-3-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Source Sans 3";src:url(/assets/fonts/source-sans-3-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
/* Daniel: navy + rust on canvas, faith-light (no scripture on his page) */
body.daniel{--navy:var(--daniel-navy);--rust:var(--daniel-rust);background:var(--daniel-canvas);color:var(--navy);
  font-family:"Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif}
body.daniel h1,body.daniel h2{color:var(--navy);font-family:"Zilla Slab", Rockwell, "Roboto Slab", Georgia, serif;font-weight:700}
body.daniel .avatar{border:3px solid var(--rust)}
body.daniel a.link{background:var(--navy);color:#fff}
body.daniel a.link.feature{background:var(--rust)}
body.daniel a.link:hover{background:#000}
body.daniel .card{border-top-color:var(--rust)}
body.daniel .btn{background:var(--rust);color:#fff}
body.daniel footer{background:var(--navy);color:var(--daniel-canvas)}
body.daniel footer a{color:#F0A27F} /* light rust for contrast on navy */
/* Release-emails consent checkbox on /bonus (checkbox sits inline with its text) */
.signup label.check{display:flex;gap:.5rem;align-items:flex-start;font-weight:normal;margin-top:.8rem}
.signup label.check input{width:auto;margin-top:.25rem}