*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #F5F1E8;--bg2: #EDE8DC;--cream: #FAF7F2;--brown-dark: #3E2723;--brown-mid: #5D4037;--brown-light: #8D6E63;--gold: #D4A574;--orange: #CC5500;--green-wa: #25D366;--border: #E5D9C5;--border2: rgba(62,39,35,.1);--radius: 8px;--shadow: 0 2px 12px rgba(62,39,35,.08);--shadow-lg: 0 8px 32px rgba(62,39,35,.14)}body{font-family:Lato,sans-serif;background:var(--bg);color:var(--brown-dark);min-height:100vh;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5{font-family:Playfair Display,serif}a{text-decoration:none;color:inherit}button{font-family:Lato,sans-serif;cursor:pointer}input,textarea,select{font-family:Lato,sans-serif}img{display:block;max-width:100%}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:var(--radius);font-size:14px;font-weight:700;padding:10px 24px;border:none;transition:all .18s;cursor:pointer;white-space:nowrap}.btn-primary{background:var(--brown-dark);color:#faf7f2}.btn-primary:hover{background:var(--brown-mid);transform:translateY(-1px);box-shadow:var(--shadow-lg)}.btn-secondary{background:transparent;color:var(--brown-dark);border:2px solid var(--brown-dark)}.btn-secondary:hover{background:var(--brown-dark);color:#faf7f2}.btn-gold{background:var(--gold);color:var(--brown-dark)}.btn-gold:hover{background:#c8965a;transform:translateY(-1px)}.btn-whatsapp{background:var(--green-wa);color:#fff;width:100%}.btn-whatsapp:hover{background:#1ebe5d;transform:translateY(-1px)}.btn-sm{padding:7px 16px;font-size:13px}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.form-group{margin-bottom:16px}.form-group label{display:block;font-size:13px;font-weight:700;color:var(--brown-mid);margin-bottom:5px}.form-control{width:100%;padding:10px 14px;border:1.5px solid var(--border);border-radius:var(--radius);background:white;color:var(--brown-dark);font-size:14px;outline:none;transition:border-color .2s}.form-control:focus{border-color:var(--gold)}textarea.form-control{resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.badge{display:inline-block;background:var(--orange);color:#fff;font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.05em}.badge-gold{background:var(--gold);color:var(--brown-dark)}.product-card{background:white;border-radius:var(--radius);border:1px solid var(--border);overflow:hidden;transition:all .3s;position:relative}.product-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.product-card__img{width:100%;aspect-ratio:1;overflow:hidden}.product-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.product-card:hover .product-card__img img{transform:scale(1.06)}.product-card__body{padding:14px}.product-card__cat{font-size:11px;color:var(--gold);font-weight:700;text-transform:uppercase;letter-spacing:.1em;margin-bottom:5px}.product-card__name{font-family:Playfair Display,serif;font-size:15px;font-weight:600;color:var(--brown-dark);margin-bottom:8px;line-height:1.35}.product-card__price{display:flex;align-items:center;gap:8px;margin-bottom:12px}.product-card__price-main{font-size:17px;font-weight:700;color:var(--brown-dark)}.product-card__price-orig{font-size:13px;color:var(--brown-light);text-decoration:line-through}.product-card__actions{display:flex;gap:8px}.btn-wish{width:36px;height:36px;flex-shrink:0;border-radius:var(--radius);border:1.5px solid var(--border);background:none;color:var(--brown-light);display:flex;align-items:center;justify-content:center;transition:all .2s}.btn-wish:hover,.btn-wish.active{border-color:#e53e3e;color:#e53e3e;background:#fff0f0}.btn-cart{width:36px;height:36px;flex-shrink:0;border-radius:var(--radius);border:1.5px solid var(--border);background:none;color:var(--brown-dark);display:flex;align-items:center;justify-content:center;transition:all .2s}.btn-cart:hover{background:var(--brown-dark);color:#fff;border-color:var(--brown-dark)}.product-card__badge{position:absolute;top:10px;left:10px;z-index:2}.product-card__wish-btn{position:absolute;top:10px;right:10px;z-index:2}.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:24px}@media (max-width: 640px){.products-grid{grid-template-columns:repeat(2,1fr);gap:12px}}.category-badge{display:inline-flex;align-items:center;padding:8px 22px;border-radius:100px;font-size:14px;font-weight:700;cursor:pointer;border:1px solid var(--border);background:white;color:var(--brown-dark);transition:all .18s}.category-badge.active,.category-badge:hover{background:var(--gold);color:var(--brown-dark);border-color:var(--gold)}.section-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:var(--orange);margin-bottom:8px}.section-title{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:700;color:var(--brown-dark);line-height:1.2}.section-sub{font-size:15px;color:var(--brown-mid);line-height:1.6;margin-top:8px}.stars{display:flex;gap:3px}.toast-wrap{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none}.toast{background:var(--brown-dark);color:#fff;padding:12px 22px;border-radius:var(--radius);font-size:14px;font-weight:600;box-shadow:0 4px 20px #0003;animation:toastIn .3s ease;pointer-events:auto;white-space:nowrap}.toast.success{background:var(--green-wa)}.toast.error{background:#e53e3e}@keyframes toastIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.wa-float{position:fixed;bottom:28px;right:28px;z-index:1000;width:56px;height:56px;border-radius:50%;background:var(--green-wa);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px #25d36666;transition:transform .2s;border:none}.wa-float:hover{transform:scale(1.12)}.hero-section{background:linear-gradient(135deg,var(--bg) 0%,var(--bg2) 100%);position:relative;overflow:hidden}.hero-section:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%233E2723' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E")}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.5);z-index:10000;display:flex;align-items:center;justify-content:center;padding:16px}.modal{background:white;border-radius:12px;width:100%;max-width:600px;max-height:92vh;overflow-y:auto;padding:28px;box-shadow:0 20px 60px #0000004d}.modal h3{font-family:Playfair Display,serif;font-size:20px;margin-bottom:20px;color:var(--brown-dark)}.admin-wrap{display:flex;min-height:100vh}.admin-sidebar{width:240px;flex-shrink:0;background:var(--brown-dark);color:#fff;padding:0;position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column}.admin-sidebar__logo{padding:24px;border-bottom:1px solid rgba(255,255,255,.1)}.admin-sidebar__logo h2{font-family:Playfair Display,serif;font-size:17px;color:#fff}.admin-sidebar__logo p{font-size:11px;opacity:.55;margin-top:3px}.admin-sidebar nav{padding:12px 0;flex:1}.admin-sidebar nav a,.admin-sidebar nav button{display:flex;align-items:center;gap:10px;width:100%;padding:11px 22px;font-size:14px;font-weight:600;color:#ffffffb3;background:none;border:none;text-align:left;text-decoration:none;cursor:pointer;transition:all .18s}.admin-sidebar nav a:hover,.admin-sidebar nav a.active,.admin-sidebar nav button:hover{background:rgba(255,255,255,.1);color:#fff}.admin-sidebar__bottom{padding:16px;border-top:1px solid rgba(255,255,255,.1)}.admin-content{flex:1;padding:32px;background:#F9F6F0;overflow-y:auto;min-height:100vh}.admin-card{background:white;border-radius:var(--radius);border:1px solid var(--border);padding:24px;margin-bottom:20px;box-shadow:var(--shadow)}.admin-table{width:100%;border-collapse:collapse}.admin-table th{background:var(--bg);padding:10px 14px;text-align:left;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--brown-light);border-bottom:2px solid var(--border)}.admin-table td{padding:12px 14px;border-bottom:1px solid var(--border);font-size:14px;vertical-align:middle}.admin-table tr:last-child td{border-bottom:none}.admin-table tr:hover td{background:#faf7f2}.header-blur{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.coupon-progress-bar{height:7px;background:rgba(62,39,35,.1);border-radius:100px;overflow:hidden}.coupon-progress-fill{height:100%;border-radius:100px;background:linear-gradient(90deg,var(--gold),var(--orange));transition:width .6s ease}@media (max-width: 768px){.admin-wrap{flex-direction:column}.admin-sidebar{width:100%;height:auto;position:relative}.form-row{grid-template-columns:1fr}.hide-mobile{display:none!important}}

/* ═══════════════════════════════════════════════════════
   RESPONSIVE PATCH v2 — Admin Panel + Frontend Mobile
   ═══════════════════════════════════════════════════════ */

/* ── Admin Mobile Sidebar ────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .admin-wrap { flex-direction: column; }

  .admin-sidebar {
    width: 100%;
    height: auto;
    position: relative;
    flex-direction: column;
  }

  /* Collapsible sidebar on mobile */
  .admin-sidebar nav {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 6px 8px;
    gap: 2px;
  }

  .admin-sidebar nav a,
  .admin-sidebar nav button {
    padding: 8px 12px;
    font-size: 12px;
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: center;
    text-align: center;
    border-radius: 6px;
  }

  .admin-sidebar__bottom {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding: 8px;
  }

  .admin-content {
    padding: 14px;
    min-height: unset;
  }

  /* Admin tables scroll on mobile */
  .admin-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .admin-card {
    padding: 14px;
    margin-bottom: 12px;
  }

  /* Hide non-essential table columns */
  .hide-mobile { display: none !important; }

  /* Admin modal full screen on mobile */
  .modal-overlay { padding: 0; align-items: flex-end; }
  .modal {
    max-width: 100%;
    max-height: 95vh;
    border-radius: 16px 16px 0 0;
    padding: 20px;
  }
}

/* ── Frontend Hero Section Mobile ────────────────────────────────────────── */
@media (max-width: 768px) {
  .hero-section { padding: 24px 0 32px; }

  /* Stack hero columns vertically */
  .hero-section .container > div {
    flex-direction: column !important;
    gap: 24px !important;
  }

  /* Hero image full width */
  .hero-section img {
    width: 100%;
    max-height: 260px;
    object-fit: cover;
    border-radius: 12px;
  }

  /* Hero text sizing */
  .hero-section h1 { font-size: clamp(1.6rem, 7vw, 2.4rem) !important; }
  .hero-section p  { font-size: 14px !important; }

  /* Hero buttons stack */
  .hero-section .btn { width: 100%; justify-content: center; }
}

/* ── Products Grid Mobile ────────────────────────────────────────────────── */
@media (max-width: 480px) {
  .products-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .product-card__body { padding: 10px; }
  .product-card__name { font-size: 13px; }
  .product-card__price-main { font-size: 15px; }
}

/* ── Navbar Mobile ───────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  /* Ensure navbar stays compact */
  header .container {
    padding: 0 12px;
  }

  /* Cart / wishlist icon spacing */
  header button { min-width: 36px; min-height: 36px; }
}

/* ── Section About / Story layout Mobile ─────────────────────────────────── */
@media (max-width: 768px) {
  /* Any flex row with image + text — stack them */
  section > .container > div[style*="display:flex"],
  section > div > div[style*="display:flex"] {
    flex-direction: column !important;
  }

  section img { max-height: 220px; object-fit: cover; border-radius: 10px; width: 100%; }

  .section-title { font-size: clamp(1.3rem, 5vw, 1.8rem); }
}

/* ── Category Badges scroll on mobile ───────────────────────────────────── */
@media (max-width: 640px) {
  .category-badges-wrap, .category-filters {
    display: flex;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 8px;
    padding-bottom: 4px;
    scrollbar-width: none;
  }
  .category-badges-wrap::-webkit-scrollbar,
  .category-filters::-webkit-scrollbar { display: none; }

  .category-badge { white-space: nowrap; flex-shrink: 0; padding: 6px 14px; font-size: 13px; }
}

/* ── Form rows stack on mobile ───────────────────────────────────────────── */
@media (max-width: 600px) {
  .form-row { grid-template-columns: 1fr !important; }
  .form-row-2 { grid-template-columns: 1fr !important; }
}

/* ── WhatsApp float button position ─────────────────────────────────────── */
@media (max-width: 480px) {
  .wa-float { bottom: 16px; right: 16px; width: 48px; height: 48px; }
}

/* ── Touch targets — min 44px ────────────────────────────────────────────── */
@media (max-width: 768px) {
  button, a, input[type="button"], input[type="submit"] {
    min-height: 36px;
  }
  input, select, textarea {
    font-size: 16px !important; /* prevents iOS zoom */
  }
}