/*
Theme Name: Espresso Street
Theme URI: https://example.com/
Author: SmartKeySolutions
Description: Custom theme for Espresso Street (mobile coffee van + pop-up schedule).
Version: 1.0.0
License: GPLv2 or later
Text Domain: espresso-street
*/

:root{
  --es-red:#B01020;
  --es-black:#0B0B0B;
  --es-white:#FFFFFF;
  --es-gray:#F4F4F4;
  --es-muted:#6B7280;
  --es-radius:18px;
  --es-shadow:0 10px 30px rgba(0,0,0,.08);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background:var(--es-white);
  color:#111;
  line-height:1.55;
}
a{color:inherit}
img{max-width:100%;height:auto;display:block}

.container{width:min(1100px, 92vw); margin-inline:auto}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5rem; padding:.85rem 1.05rem;
  border-radius:999px; border:1px solid rgba(0,0,0,.12);
  text-decoration:none; font-weight:650;
}
.btn.primary{background:var(--es-red); color:var(--es-white); border-color:transparent}
.btn.ghost{background:transparent}
.badge{
  display:inline-block; padding:.25rem .6rem; border-radius:999px;
  background:rgba(176,16,32,.10); color:var(--es-red); font-weight:700; font-size:.85rem;
}
.site-header{
  position:sticky; top:0; z-index:20;
  background:rgba(255,255,255,.86); backdrop-filter:saturate(120%) blur(12px);
  border-bottom:1px solid rgba(0,0,0,.08);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; padding:.9rem 0; gap:1rem}
.brand{display:flex; align-items:center; gap:.75rem; text-decoration:none}
.brand .logo{width:42px; height:42px; border-radius:999px; background:var(--es-red); display:grid; place-items:center; color:#fff; font-weight:900}
.brand .name{font-weight:900; letter-spacing:.02em}
.nav{display:flex; gap:1rem; flex-wrap:wrap}
.nav a{ text-decoration:none; padding:.4rem .55rem; border-radius:10px}
.nav a:hover{ background:rgba(0,0,0,.04)}
.hamburger{display:none}
@media (max-width:820px){
  .nav{display:none}
  .hamburger{display:inline-flex}
  .mobile-nav{display:block; border-top:1px solid rgba(0,0,0,.08); padding:.75rem 0}
  .mobile-nav a{display:block; padding:.6rem .4rem; text-decoration:none; border-radius:10px}
  .mobile-nav a:hover{background:rgba(0,0,0,.04)}
}

.hero{
  padding:3.3rem 0 2rem;
  background:linear-gradient(180deg, rgba(176,16,32,.08), rgba(0,0,0,0) 70%);
}
.hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:1.25rem; align-items:stretch}
@media (max-width:880px){.hero-grid{grid-template-columns:1fr}}
.card{
  background:#fff; border:1px solid rgba(0,0,0,.08);
  border-radius:var(--es-radius); box-shadow:var(--es-shadow);
}
.card.pad{padding:1.2rem}
.h1{font-size:clamp(2rem, 4vw, 3rem); line-height:1.05; margin:.2rem 0 .8rem; font-weight:950}
.lead{font-size:1.05rem; color:#1f2937; margin:0 0 1.1rem}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem}
@media (max-width:880px){.grid-3{grid-template-columns:1fr}}
.section{padding:2.2rem 0}
.section h2{font-size:1.55rem; margin:0 0 1rem; font-weight:900}
.kicker{color:var(--es-red); font-weight:900; letter-spacing:.08em; text-transform:uppercase; font-size:.8rem}
.pill-list{display:flex; flex-wrap:wrap; gap:.5rem}
.pill{padding:.35rem .7rem; border-radius:999px; border:1px solid rgba(0,0,0,.12); background:#fff}
.footer{padding:2.5rem 0; border-top:1px solid rgba(0,0,0,.08); color:#111}
.footer small{color:var(--es-muted)}
.table{
  width:100%; border-collapse:separate; border-spacing:0; overflow:hidden;
  border:1px solid rgba(0,0,0,.08); border-radius:16px;
}
.table th,.table td{padding:.7rem .75rem; text-align:left; border-bottom:1px solid rgba(0,0,0,.06); vertical-align:top}
.table tr:last-child td{border-bottom:none}
.table th{background:rgba(0,0,0,.03); font-size:.9rem}
.muted{color:var(--es-muted)}
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:1rem}
@media (max-width:880px){.two-col{grid-template-columns:1fr}}
.gallery-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem}
@media (max-width:880px){.gallery-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.gallery-grid{grid-template-columns:1fr}}
.thumb{aspect-ratio:4/3; border-radius:16px; overflow:hidden; border:1px solid rgba(0,0,0,.08); background:var(--es-gray)}
.thumb img{width:100%; height:100%; object-fit:cover}
.notice{padding:.8rem 1rem; border-radius:14px; border:1px dashed rgba(176,16,32,.35); background:rgba(176,16,32,.06)}
.form input,.form textarea{
  width:100%; padding:.75rem .8rem; border-radius:14px; border:1px solid rgba(0,0,0,.15);
  font:inherit;
}
.form textarea{min-height:140px; resize:vertical}
.form label{font-weight:800; font-size:.92rem}
.form .row{display:grid; gap:.35rem; margin-bottom:.85rem}