/* Sweet Slade's — matches sweetslades.com: Rye headings, Inter body, Syne pill buttons,
   red #cf0b05, tan #c8ac7e, brown #4a3917, light-blue candy stripes. */
:root{
  --red:#cf0b05; --red-dark:#a80904; --tan:#c8ac7e; --ink:#4a3917; --muted:#7d6a45;
  --sky:#e9f5f6; --sky-line:#cfe7ea; --white:#fff; --line:#eadfcb; --cream:#fdfaf4;
  --wrap:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--white);color:var(--ink);font-family:Inter,system-ui,sans-serif;line-height:1.55;font-size:17px}
img{max-width:100%;display:block}
a{color:var(--red)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:var(--red);color:#fff;padding:8px 14px;z-index:99}

/* Header */
.site-head{text-align:center;padding:18px 0 10px;background:var(--white)}
.site-head .logo{width:150px;margin:0 auto 6px}
.nav{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 22px;font-size:1.05rem}
.nav a{color:var(--red);text-decoration:none;padding:4px 2px;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current=page]{border-color:var(--red)}
.status{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font-family:Syne,Inter,sans-serif;font-size:.85rem;padding:5px 14px;border-radius:300px;background:var(--sky);color:var(--ink)}
.status i{width:9px;height:9px;border-radius:50%;background:#2e9e5b;display:inline-block}
.status.closed i{background:var(--red)}

/* Type */
h1,h2,h3,.rye{font-family:Rye,Georgia,serif;font-weight:400;line-height:1.12;margin:0 0 .4em}
h1{font-size:clamp(2.2rem,5.4vw,3.9rem);color:var(--red)}
h2{font-size:clamp(2rem,4.4vw,3.2rem);color:var(--tan)}
h3{font-size:clamp(1.4rem,2.6vw,1.9rem);color:var(--red)}
.lead{font-size:1.2rem;font-weight:600}
.center{text-align:center}
.eyebrow{font-family:Syne,Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;font-size:.8rem;color:var(--red)}

/* Buttons */
.btn{display:inline-block;font-family:Syne,Inter,sans-serif;font-size:1rem;text-decoration:none;padding:12px 26px;border-radius:300px;background:var(--red);color:#fff;border:2px solid var(--red);transition:background .15s}
.btn:hover{background:var(--red-dark)}
.btn.ghost{background:#fff;color:var(--red)}
.btn.ghost:hover{background:var(--sky)}
.btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:18px}

/* Sections */
section{padding:64px 0}
.stripes{background:repeating-linear-gradient(90deg,var(--sky) 0 9%,#fff 9% 18%)}
.stripes .panel{background:rgba(255,255,255,.88);border-radius:6px;padding:34px 24px;max-width:780px;margin:0 auto;text-align:center}
.red-band{background:var(--red);color:#fff;text-align:center}
.red-band h2{color:#fff}
.red-band .btn{background:#fff;color:var(--red);border-color:#fff}
.red-band .btn:hover{background:var(--sky)}
.tint{background:var(--cream)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.split.flip > :first-child{order:2}
@media (max-width:820px){.split{grid-template-columns:1fr}.split.flip > :first-child{order:0}}
.photo{border-radius:6px;overflow:hidden;box-shadow:0 10px 30px rgba(74,57,23,.15)}
.photo img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.cards{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:#fff;border:2px solid var(--sky-line);border-radius:6px;padding:22px;
  background-image:linear-gradient(to bottom,var(--sky) 0,var(--sky) 6px,transparent 6px)}
.card img{border-radius:4px;margin:-4px 0 14px;aspect-ratio:4/3;object-fit:cover;width:100%}
.facts{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:16px 0 0;padding:0;list-style:none}
.facts li{background:var(--sky);border-radius:300px;padding:6px 16px;font-family:Syne,Inter,sans-serif;font-size:.9rem}

/* Live board */
.board-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.board-grid ul{list-style:none;margin:0;padding:0}
.board-grid li{padding:11px 0;border-top:1px dashed var(--line)}
.board-grid li:first-child{border-top:0;padding-top:2px}
.board-grid .t{font-weight:700;font-size:1.05rem}
.board-grid .d{opacity:.85;font-size:.95rem;margin-top:2px}
.badge{display:inline-block;font-family:Syne,Inter,sans-serif;font-size:.72rem;padding:2px 10px;border-radius:300px;margin-left:6px;vertical-align:2px;background:var(--red);color:#fff}
.until,.src{font-size:.8rem;color:var(--muted);margin-top:3px}
.src.shop{color:var(--red);font-weight:700}
.ev{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:start}
.cal{background:var(--sky);border:1px solid var(--sky-line);border-radius:6px;text-align:center;padding:5px 0 6px;line-height:1.05}
.cal b{display:block;font-family:Rye,Georgia,serif;font-weight:400;font-size:1.35rem;color:var(--red)}
.cal span{font-family:Syne,Inter,sans-serif;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}
.empty{color:var(--muted);font-style:italic;padding:6px 0 10px}
.more{display:inline-block;margin-top:10px;font-family:Syne,Inter,sans-serif;font-size:.85rem;text-decoration:none;color:#fff;background:var(--red);padding:8px 18px;border-radius:300px}
.skeleton{height:14px;border-radius:4px;background:#eef6f7;margin:10px 0}

/* Menu */
.flavors{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.flavor{border-bottom:1px dashed var(--line);padding:10px 0 14px}
.flavor h3{font-size:1.45rem;margin-bottom:.2em}
.chips{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:0;justify-content:center}
.chips li{border:2px solid var(--sky-line);background:#fff;border-radius:300px;padding:7px 16px;font-weight:600}
.note{font-size:.88rem;color:var(--muted);max-width:720px;margin:26px auto 0;text-align:center}
.price-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-top:20px}
.price{background:#fff;border:2px solid var(--sky-line);border-radius:6px;padding:14px;text-align:center}
.price b{display:block;font-family:Rye,Georgia,serif;font-weight:400;color:var(--red);font-size:1.6rem}

/* Lists / rules */
.steps{counter-reset:s;list-style:none;padding:0;margin:0;display:grid;gap:12px}
.steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center;background:#fff;border:2px solid var(--sky-line);border-radius:6px;padding:12px 14px}
.steps li::before{content:counter(s);font-family:Rye,Georgia,serif;color:#fff;background:var(--red);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:1.2rem}
.rules{padding-left:1.1em}.rules li{margin:.45em 0}
blockquote{font-family:Rye,Georgia,serif;color:var(--tan);font-size:1.3rem;line-height:1.4;max-width:780px;margin:0 auto;text-align:center}
blockquote cite{display:block;font-family:Inter,sans-serif;font-style:normal;font-size:.95rem;color:var(--muted);margin-top:10px}

/* Contact */
.map{border:0;width:100%;min-height:340px;border-radius:6px}
.hours{list-style:none;padding:0;margin:0}
.hours li{display:flex;justify-content:space-between;border-bottom:1px dashed var(--line);padding:7px 0}

/* Footer */
.site-foot{background:var(--ink);color:#f3ead9;padding:44px 0 28px;font-size:.95rem}
.site-foot a{color:#fff}
.foot-grid{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.site-foot h4{font-family:Rye,Georgia,serif;font-weight:400;color:var(--tan);font-size:1.3rem;margin:0 0 8px}
.site-foot .small{opacity:.7;font-size:.82rem;text-align:center;margin-top:30px}

/* Homepage hero photo + inside-the-shop strip */
.split.hero{gap:28px}
.split.hero .panel{margin:0;text-align:left}
.split.hero .facts,.split.hero .btns{justify-content:flex-start}
.hero-photo img{aspect-ratio:4/5}
@media (max-width:820px){.split.hero .panel{text-align:center}.split.hero .facts,.split.hero .btns{justify-content:center}.hero-photo img{aspect-ratio:4/3}}
.shop-strip{padding:0}
.shop-strip .strip{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.shop-strip img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
@media (max-width:700px){.shop-strip .strip{grid-template-columns:repeat(2,1fr)}}
