/* ─── Shared design tokens and base styles ─── */

:root {
  /* Storefront palette */
  --cream: #fdf8f2; --warm: #f5ebe0; --sand: #e8d5b7;
  --terracot: #c8693a; --rust: #a84e28; --green: #3a7d44;
  --darkgreen: #2c5f35; --brown: #5c3d2e; --dark: #2d1f0e;
  --light-txt: #7a6552; --white: #ffffff;
  /* Admin / shared */
  --brand: #c8693a; --brand-dark: #a84e28;
  --red: #e74c3c; --navy: #1a1a2e; --sidebar-bg: #16213e;
  --gray-50: #f8fafc; --gray-100: #f1f5f9; --gray-200: #e2e8f0;
  --gray-400: #94a3b8; --gray-600: #475569; --gray-800: #1e293b;
  --radius: 12px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
input, select, textarea, button { font-family: 'Inter', sans-serif; }
a { text-decoration: none; }

/* ── Storefront buttons ── */
.btn { display:inline-flex;align-items:center;gap:7px;padding:8px 18px;border-radius:50px;font-weight:600;font-size:.85rem;cursor:pointer;transition:all .25s ease;border:2px solid transparent;font-family:'Inter',sans-serif; }
.btn-primary { background:var(--terracot);color:#fff; }
.btn-primary:hover { background:var(--rust);transform:translateY(-2px);box-shadow:0 8px 24px rgba(200,105,58,.35); }
.btn-outline { background:transparent;color:var(--terracot);border-color:var(--terracot); }
.btn-outline:hover { background:var(--terracot);color:#fff;transform:translateY(-2px); }
.btn-green { background:var(--green);color:#fff; }
.btn-green:hover { background:var(--darkgreen);transform:translateY(-2px); }

/* ── Layout ── */
.container { max-width:1120px;margin:0 auto;padding:0 24px; }

/* ── Section headings ── */
.section-label { font-size:.7rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--terracot);display:block;margin-bottom:2px; }
.section-title { font-family:'Playfair Display',serif;font-size:clamp(1.2rem,2.5vw,1.8rem);font-weight:700;color:var(--dark);line-height:1.2; }
.section-subtitle { font-size:.87rem;color:var(--light-txt);margin-top:3px;max-width:560px; }

/* ── Touch improvements ── */
@media(hover:none) and (pointer:coarse){
  .btn{min-height:44px;-webkit-tap-highlight-color:transparent}
  a,button{-webkit-tap-highlight-color:transparent}
  /* Prevent iOS Safari from zooming into inputs smaller than 16px */
  input,select,textarea{font-size:max(16px,1em)}
}

/* ── Active nav link ── */
.nav-links a.nav-active { color:var(--terracot);font-weight:600;border-bottom:2px solid rgba(200,105,58,.3);padding-bottom:4px; }
.mobile-link.nav-active { color:var(--terracot);font-weight:600;border-bottom:2px solid rgba(200,105,58,.3);padding-bottom:4px; }

/* ── Animations ── */
@keyframes fadeInUp { from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)} }
.animate-in { animation:fadeInUp .6s ease forwards; }
.delay-1{animation-delay:.1s}.delay-2{animation-delay:.2s}.delay-3{animation-delay:.3s}
