/* ═══════════════════════════════════════
   ISINYA FARM — Shared Stylesheet
   ═══════════════════════════════════════ */

/* ── TOKENS ── */
:root {
  --earth:  #2d2016;
  --soil:   #3d2c18;
  --amber:  #c8781a;
  --gold:   #e8a030;
  --wheat:  #f0d090;
  --cream:  #fdf8f0;
  --sage:   #6b7c5a;
  --moss:   #4a5c3a;
  --shell:  #f5ece0;
  --white:  #ffffff;
  --text:   #1a1208;
  --muted:  #6b5c48;
  --border: #e0d0b8;
  --red:    #d94040;
  --radius: 14px;
  --shadow: 0 8px 28px rgba(45,32,22,0.10);
  --shadow-lg: 0 16px 48px rgba(45,32,22,0.16);
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:'DM Sans',sans-serif; background:var(--cream); color:var(--text); overflow-x:hidden; line-height:1.5; }
img { display:block; max-width:100%; }
a { color:inherit; }
button { font-family:inherit; cursor:pointer; }
input, select, textarea { font-family:inherit; }

/* ── PROMO BAR ── */
.promo-bar {
  background:var(--earth); color:var(--wheat);
  font-size:12.5px; letter-spacing:0.07em;
  padding:9px 0; overflow:hidden;
}
.promo-ticker {
  display:flex; gap:56px;
  animation:ticker 30s linear infinite;
  white-space:nowrap;
}
.promo-ticker span { display:inline-flex; gap:10px; align-items:center; }
.promo-ticker span::before { content:'✦'; color:var(--gold); }
@keyframes ticker { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ── NAV ── */
.site-nav {
  position:sticky; top:0; z-index:200;
  background:rgba(253,248,240,.96); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
  padding:0 5%; display:flex; align-items:center;
  justify-content:space-between; height:70px;
}
.logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.logo-icon {
  width:40px; height:40px; background:var(--earth); border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:19px; flex-shrink:0;
}
.logo-name {
  font-family:'Playfair Display',serif; font-size:21px; font-weight:800;
  color:var(--earth); letter-spacing:-.02em; line-height:1.1;
}
.logo-tag { font-size:9.5px; color:var(--muted); letter-spacing:.14em; text-transform:uppercase; }
.nav-links { display:flex; gap:30px; list-style:none; }
.nav-links a {
  text-decoration:none; color:var(--muted); font-size:14px; font-weight:500;
  letter-spacing:.01em; transition:color .2s; position:relative; padding-bottom:2px;
}
.nav-links a:hover, .nav-links a.active { color:var(--earth); }
.nav-links a.active::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0;
  height:2px; background:var(--amber); border-radius:2px;
}
.nav-actions { display:flex; align-items:center; gap:12px; }
.nav-search {
  display:flex; align-items:center; gap:8px;
  background:var(--shell); border:1.5px solid var(--border);
  border-radius:8px; padding:7px 13px;
}
.nav-search input {
  border:none; background:transparent; font-size:13px; color:var(--text);
  outline:none; width:150px;
}
.nav-search button { background:none; border:none; font-size:15px; color:var(--muted); }
.btn-cart {
  background:var(--earth); color:var(--cream); border:none;
  padding:9px 20px; border-radius:8px; font-size:13px; font-weight:600;
  letter-spacing:.04em; display:flex; align-items:center; gap:8px;
  transition:background .2s;
}
.btn-cart:hover { background:var(--amber); }
.cart-badge {
  background:var(--gold); color:var(--earth);
  border-radius:50%; width:18px; height:18px;
  font-size:10px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.hamburger { display:none; background:none; border:none; font-size:22px; color:var(--earth); }

/* ── BUTTONS ── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:none; border-radius:8px; font-size:14px; font-weight:600; letter-spacing:.03em; padding:12px 26px; transition:all .25s; cursor:pointer; text-decoration:none; }
.btn-primary { background:var(--amber); color:#fff; }
.btn-primary:hover { background:var(--earth); transform:translateY(-2px); box-shadow:0 8px 20px rgba(200,120,26,.35); }
.btn-dark { background:var(--earth); color:var(--cream); }
.btn-dark:hover { background:var(--amber); }
.btn-outline { background:transparent; color:var(--earth); border:1.5px solid var(--border); }
.btn-outline:hover { border-color:var(--amber); color:var(--amber); }
.btn-ghost { background:transparent; color:var(--wheat); border:1.5px solid rgba(240,208,144,.35); }
.btn-ghost:hover { border-color:var(--wheat); color:var(--cream); }
.btn-lg { padding:15px 34px; font-size:15px; border-radius:10px; }
.btn-sm { padding:7px 16px; font-size:12px; border-radius:6px; }
.btn-full { width:100%; }

/* ── SECTION ── */
.section { padding:72px 5%; }
.section-alt { background:var(--shell); }
.section-dark { background:var(--earth); }
.section-tag {
  display:inline-block; background:rgba(200,120,26,.1); color:var(--amber);
  font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
  padding:5px 13px; border-radius:20px; margin-bottom:10px;
}
.section-dark .section-tag { background:rgba(200,120,26,.2); color:var(--gold); }
.section-title {
  font-family:'Playfair Display',serif; font-size:clamp(26px,4vw,42px);
  font-weight:800; color:var(--earth); line-height:1.12; letter-spacing:-.02em;
}
.section-dark .section-title { color:var(--cream); }
.section-sub { color:var(--muted); font-size:15px; line-height:1.65; margin-top:10px; }
.section-header { text-align:center; max-width:560px; margin:0 auto 48px; }

/* ── CART DRAWER ── */
.cart-overlay {
  position:fixed; inset:0; z-index:890;
  background:rgba(20,12,4,.55);
  opacity:0; pointer-events:none; transition:opacity .3s;
}
.cart-overlay.open { opacity:1; pointer-events:all; }
.cart-drawer {
  position:fixed; top:0; right:0; bottom:0; z-index:900;
  width:370px; max-width:100vw; background:var(--white);
  box-shadow:-6px 0 36px rgba(0,0,0,.14);
  transform:translateX(100%); transition:transform .35s cubic-bezier(.4,0,.2,1);
  display:flex; flex-direction:column;
}
.cart-drawer.open { transform:translateX(0); }
.cart-head {
  padding:22px 24px; border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
}
.cart-head h3 { font-family:'Playfair Display',serif; font-size:19px; font-weight:800; color:var(--earth); }
.cart-x { background:var(--shell); border:none; width:32px; height:32px; border-radius:50%; font-size:15px; transition:background .2s; }
.cart-x:hover { background:var(--border); }
.cart-body { flex:1; overflow-y:auto; padding:18px 24px; }
.cart-item { display:flex; gap:13px; align-items:flex-start; padding:13px 0; border-bottom:1px solid var(--border); }
.ci-img { width:58px; height:58px; background:var(--shell); border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:26px; flex-shrink:0; overflow:hidden; }
.ci-info { flex:1; }
.ci-cat { font-size:10px; color:var(--amber); font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.ci-name { font-size:13px; font-weight:600; color:var(--earth); line-height:1.3; margin:2px 0 8px; }
.ci-qty { display:flex; align-items:center; gap:8px; }
.ci-qty-btn { width:24px; height:24px; border-radius:5px; border:1px solid var(--border); background:var(--shell); font-size:14px; display:flex; align-items:center; justify-content:center; }
.ci-qty-val { font-size:13px; font-weight:700; min-width:18px; text-align:center; }
.ci-price { font-family:'Playfair Display',serif; font-size:15px; font-weight:700; color:var(--earth); margin-top:6px; }
.ci-rm { background:none; border:none; color:var(--muted); font-size:16px; transition:color .2s; align-self:flex-start; }
.ci-rm:hover { color:var(--red); }
.cart-empty-state { text-align:center; padding:52px 16px; }
.cart-empty-state .icon { font-size:48px; margin-bottom:12px; }
.cart-empty-state p { font-size:13px; color:var(--muted); line-height:1.6; }
.cart-foot { padding:18px 24px; border-top:1px solid var(--border); }
.cart-row { display:flex; justify-content:space-between; font-size:13px; color:var(--muted); margin-bottom:7px; }
.cart-row.total { font-size:15px; font-weight:700; color:var(--earth); border-top:1px solid var(--border); padding-top:10px; margin-top:10px; }
.cart-row.total .v { font-family:'Playfair Display',serif; font-size:17px; }

/* ── TOAST ── */
.toast {
  position:fixed; bottom:26px; left:50%; transform:translateX(-50%) translateY(80px);
  background:var(--earth); color:var(--cream);
  padding:12px 22px; border-radius:10px; font-size:13px; font-weight:600;
  box-shadow:0 6px 20px rgba(0,0,0,.2); z-index:9999;
  transition:transform .3s; white-space:nowrap;
  display:flex; align-items:center; gap:9px;
}
.toast.show { transform:translateX(-50%) translateY(0); }

/* ── FOOTER ── */
.site-footer { background:var(--earth); padding:60px 5% 28px; color:rgba(253,248,240,.7); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:44px; margin-bottom:44px; }
.footer-brand p { font-size:13px; line-height:1.7; margin:14px 0 18px; }
.footer-social { display:flex; gap:9px; }
.social-btn {
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1);
  display:flex; align-items:center; justify-content:center;
  font-size:13px; text-decoration:none; transition:background .2s;
}
.social-btn:hover { background:var(--amber); }
.footer-contact .ci { display:flex; gap:8px; align-items:flex-start; font-size:13px; margin-bottom:9px; }
.footer-contact .ci .ic { color:var(--gold); flex-shrink:0; margin-top:2px; }
.footer-contact .ci a { transition:color .2s; }
.footer-contact .ci a:hover { color:var(--gold) !important; }
.footer-col h4 { font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--wheat); margin-bottom:16px; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:9px; }
.footer-col ul li a { font-size:13px; color:rgba(253,248,240,.6); text-decoration:none; transition:color .2s; }
.footer-col ul li a:hover { color:var(--gold); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding-top:22px; display:flex; align-items:center; justify-content:space-between; font-size:12px; flex-wrap:wrap; gap:10px; }
.footer-bottom a { color:var(--gold); text-decoration:none; }
.footer-links { display:flex; gap:18px; }

/* ── REVEAL ── */
.reveal { opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .nav-links, .nav-search { display:none; }
  .hamburger { display:block; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
}
@media(max-width:600px){
  .section { padding:52px 5%; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; text-align:center; }
}