:root{
    --green-900:#0f3d2e;
    --green-800:#124f3b;
    --green-700:#166944;
    --green-600:#1c8a56;
    --green-500:#2ea866;
    --green-100:#e3f3ea;
    --cream:#fbf7ee;
    --sand:#f1e8d6;
    --sand-dark:#e6d8bd;
    --ink:#1a2420;
    --ink-soft:#57645d;
    --ink-faint:#8a938d;
    --gold:#d9a441;
    --gold-dark:#b8842a;
    --red:#c0392b;
    --white:#ffffff;
    --radius-sm:8px;
    --radius:14px;
    --radius-lg:22px;
    --shadow-sm:0 1px 2px rgba(15,61,46,0.06), 0 1px 1px rgba(15,61,46,0.10);
    --shadow:0 2px 6px rgba(15,61,46,0.08), 0 8px 20px rgba(15,61,46,0.10);
    --shadow-lg:0 4px 12px rgba(15,61,46,0.10), 0 20px 48px rgba(15,61,46,0.20);
    --line:rgba(15,61,46,0.10);
    --ease:cubic-bezier(.22,1,.36,1);
  }
  ::selection{background:var(--green-600);color:var(--white);}
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;width:100%;overflow-x:hidden;overflow-x:clip;}
  body{
    margin:0;
    font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    background:var(--cream);
    color:var(--ink);
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  img,svg{max-width:100%;display:block;}
  a{color:inherit;}
  button{font-family:inherit;cursor:pointer;}
  h1,h2,h3,h4{font-family:Georgia,"Times New Roman",serif;}
  ::selection{background:var(--gold);color:var(--green-900);}
  :focus-visible{outline:2.5px solid var(--gold);outline-offset:2px;border-radius:4px;}
  .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}

  /* ---------- Top bar ---------- */
  .topbar{
    background:var(--green-900);
    color:rgba(255,255,255,0.92);
    font-size:0.82rem;
    padding:7px 0;
    border-bottom:1px solid rgba(255,255,255,0.08);
  }
  .topbar .wrap{
    max-width:1200px;margin:0 auto;padding:0 20px;
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px;
  }
  .topbar a{text-decoration:none;opacity:0.92;font-weight:600;}
  .topbar a:hover{opacity:1;text-decoration:underline;}

  /* ---------- Header ---------- */
  header.site{
    background:rgba(255,255,255,0.94);
    backdrop-filter:blur(10px);
    position:sticky;top:0;z-index:50;
    border-bottom:1px solid var(--line);
    box-shadow:0 4px 16px rgba(15,61,46,0.05);
  }
  .header-inner{
    max-width:1200px;margin:0 auto;padding:12px 20px;
    display:flex;align-items:center;gap:24px;justify-content:space-between;
  }
  .brand{display:flex;align-items:center;gap:12px;text-decoration:none;transition:transform .2s var(--ease);}
  .brand:hover{transform:scale(1.02);}
  .logo-mark{width:auto;flex-shrink:0;display:block;object-fit:contain;}
  .logo-mark.header{height:52px;}
  .logo-badge{
    border-radius:50%;background:var(--white);display:flex;align-items:center;justify-content:center;
    overflow:hidden;flex-shrink:0;box-shadow:0 4px 14px rgba(15,61,46,0.20);
  }
  .logo-badge img{width:100%;height:100%;object-fit:contain;padding:14%;box-sizing:border-box;display:block;}
  .logo-badge.header{width:50px;height:50px;}
  .logo-badge.badge-hero{width:150px;height:150px;box-shadow:0 12px 32px rgba(0,0,0,0.30);margin:0 0 24px;}
  .brand-name{font-weight:800;font-size:1.08rem;color:var(--green-900);letter-spacing:-0.01em;line-height:1.15;white-space:nowrap;}
  .logo-mark.footer{height:80px;}
  .logo-mark.hero{height:104px;}
  .logo-vip-mark{width:auto;flex-shrink:0;}
  nav.main-nav{display:flex;gap:8px;font-weight:600;font-size:0.94rem;}
  nav.main-nav a{
    text-decoration:none;color:var(--ink);padding:9px 14px;border-radius:999px;
    transition:background .18s var(--ease),color .18s var(--ease);
  }
  nav.main-nav a:hover{background:var(--green-100);color:var(--green-800);}
  nav.main-nav a.active{background:var(--green-800);color:var(--white);}
  nav.main-nav a.active:hover{background:var(--green-800);color:var(--white);}
  .header-actions{display:flex;align-items:center;gap:12px;}
  .search-box{
    display:flex;align-items:center;background:var(--sand);border-radius:999px;
    padding:9px 16px;gap:8px;min-width:230px;border:1.5px solid transparent;
    transition:border-color .18s var(--ease), background .18s var(--ease);
  }
  .search-box:focus-within{border-color:var(--green-500);background:var(--white);}
  .search-box input{
    border:none;background:transparent;outline:none;font-size:0.9rem;width:100%;color:var(--ink);
  }
  .search-box input::placeholder{color:var(--ink-faint);}
  .mobile-search{display:none;}
  .cart-btn{
    position:relative;background:var(--green-700);color:var(--white);border:none;
    border-radius:999px;padding:11px 20px;font-weight:700;font-size:0.9rem;
    display:flex;align-items:center;gap:9px;box-shadow:var(--shadow-sm);
    transition:background .18s var(--ease), transform .18s var(--ease);
  }
  .cart-btn:hover{background:var(--green-600);transform:translateY(-1px);}
  .cart-btn:active{transform:translateY(0);}
  .cart-count{
    background:var(--gold);color:var(--green-900);border-radius:999px;
    font-size:0.72rem;font-weight:800;min-width:20px;height:20px;
    display:flex;align-items:center;justify-content:center;padding:0 5px;
    transition:transform .2s var(--ease);
  }
  .cart-count.bump{animation:bump .3s var(--ease);}
  @keyframes bump{0%{transform:scale(1);}40%{transform:scale(1.35);}100%{transform:scale(1);}}
  .mobile-toggle{display:none;background:var(--sand);border:none;font-size:1.3rem;color:var(--green-900);border-radius:10px;width:42px;height:42px;}

  /* ---------- Hero ---------- */
  .hero{
    background:
      radial-gradient(circle at 12% 15%, rgba(217,164,65,0.20), transparent 42%),
      radial-gradient(circle at 88% 85%, rgba(46,168,102,0.20), transparent 48%),
      linear-gradient(135deg,var(--green-900),var(--green-700));
    color:var(--white);
    padding:60px 20px 52px;
    position:relative;
    overflow:hidden;
  }
  .hero-inner{
    max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:44px;flex-wrap:wrap;position:relative;z-index:1;
  }
  .hero-copy{flex:1 1 440px;}
  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,0.14);
    padding:7px 15px;border-radius:999px;font-size:0.76rem;font-weight:700;
    letter-spacing:.05em;text-transform:uppercase;margin-bottom:18px;
  }
  .hero h1{font-size:clamp(1.9rem,4vw,2.6rem);line-height:1.14;margin:0 0 16px;font-weight:700;}
  .hero p.lead{font-size:1.05rem;color:rgba(255,255,255,0.88);max-width:520px;margin:0 0 26px;}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;}
  .btn{
    border:none;border-radius:10px;padding:14px 28px;font-weight:700;font-size:0.95rem;
    text-decoration:none;display:inline-flex;align-items:center;gap:8px;
    transition:transform .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease);
  }
  .btn-primary{background:var(--gold);color:var(--green-900);box-shadow:0 10px 24px rgba(217,164,65,0.32);}
  .btn-primary:hover{background:#e8b656;transform:translateY(-2px);box-shadow:0 14px 28px rgba(217,164,65,0.4);}
  .btn-outline{background:rgba(255,255,255,0.05);color:var(--white);border:1.5px solid rgba(255,255,255,0.55);}
  .btn-outline:hover{background:rgba(255,255,255,0.14);transform:translateY(-2px);}
  .btn-dark{background:var(--green-900);color:var(--white);box-shadow:0 10px 24px rgba(0,0,0,0.32);}
  .btn-dark:hover{background:#0a2e22;transform:translateY(-2px);box-shadow:0 14px 28px rgba(0,0,0,0.38);}
  .hero-stats{display:flex;gap:30px;margin-top:34px;flex-wrap:wrap;}
  .hero-stats div{min-width:110px;}
  .hero-stats .num{font-size:1.55rem;font-weight:800;color:var(--gold);font-family:Georgia,serif;}
  .hero-stats .label{font-size:0.78rem;color:rgba(255,255,255,0.72);}
  .hero-card{
    flex:1 1 320px;background:var(--white);color:var(--ink);border-radius:var(--radius-lg);
    padding:26px;box-shadow:var(--shadow-lg);max-width:380px;
  }
  .hero-card h3{margin:0 0 14px;color:var(--green-900);font-size:1.05rem;}
  .info-row{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--sand);}
  .info-row:last-child{border-bottom:none;}
  .info-row .ic{
    width:36px;height:36px;border-radius:10px;background:var(--sand);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.02rem;
  }
  .info-row .txt strong{display:block;font-size:0.88rem;}
  .info-row .txt span{font-size:0.82rem;color:var(--ink-soft);}

  /* ---------- Section shell ---------- */
  section{padding:60px 20px;}
  .section-inner{max-width:1200px;margin:0 auto;}
  .section-head{text-align:center;max-width:640px;margin:0 auto 40px;}
  .section-head .tag{
    color:var(--green-700);font-weight:700;letter-spacing:.07em;text-transform:uppercase;font-size:0.76rem;
  }
  .section-head h2{font-size:1.9rem;margin:8px 0 10px;color:var(--green-900);font-weight:700;}
  .section-head p{color:var(--ink-soft);margin:0;}

  /* ---------- Categories ---------- */
  .cat-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;
  }
  .cat-card{
    background:var(--white);border-radius:var(--radius);padding:24px 16px;text-align:center;
    box-shadow:var(--shadow-sm);border:1px solid var(--line);
    transition:transform .16s var(--ease), box-shadow .16s var(--ease), border-color .16s var(--ease);
    cursor:pointer;position:relative;
    display:block;text-decoration:none;
  }
  .cat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--green-500);}
  .cat-card:active{transform:translateY(-1px);}
  .cat-card.active{border-color:var(--green-700);border-width:2px;background:var(--green-100);box-shadow:var(--shadow-sm);}
  .cat-card .ic-wrap{
    width:56px;height:56px;border-radius:50%;background:var(--sand);margin:0 auto 12px;
    display:flex;align-items:center;justify-content:center;font-size:1.7rem;
    box-shadow:inset 0 0 0 1px var(--line);
    transition:background .16s var(--ease);
  }
  .cat-card:hover .ic-wrap{background:var(--green-100);}
  .cat-card h4{margin:0 0 4px;font-size:0.94rem;color:var(--green-900);font-weight:700;letter-spacing:-0.01em;}
  .cat-card .count{font-size:0.72rem;color:var(--ink-faint);font-weight:700;text-transform:uppercase;letter-spacing:.04em;}

  /* ---------- Featured brand strip ---------- */
  .brand-strip{
    background:var(--white);border-radius:var(--radius-lg);padding:36px;margin-top:36px;
    display:flex;gap:26px;align-items:center;flex-wrap:wrap;border:2px solid var(--gold);
    box-shadow:var(--shadow-sm);
  }
  .brand-strip h3{margin:0 0 8px;color:var(--green-900);font-size:1.15rem;font-weight:700;}
  .brand-strip p{margin:0;color:var(--ink-soft);}

  /* ---------- Shop ---------- */
  .shop-bg{background:var(--white);}
  .filter-row{
    display:flex;gap:16px;flex-wrap:wrap;justify-content:space-between;align-items:center;margin-bottom:28px;
  }
  .filter-bar{display:flex;gap:9px;flex-wrap:wrap;}
  .chip{
    background:var(--sand);border:none;padding:9px 18px;border-radius:999px;
    font-weight:600;font-size:0.85rem;color:var(--ink);
    transition:background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease);
  }
  .chip:hover{transform:translateY(-1px);}
  .chip.active{background:var(--green-700);color:var(--white);}
  .sort-select{
    background:var(--sand);border:none;border-radius:999px;padding:9px 16px;font-weight:600;
    font-size:0.85rem;color:var(--ink);cursor:pointer;
  }
  .result-count{font-size:0.82rem;color:var(--ink-faint);text-align:center;margin:-14px 0 22px;}
  .product-grid{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(224px,1fr));gap:20px;
  }
  .product-card{
    background:var(--cream);border-radius:var(--radius);padding:16px;
    box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:10px;position:relative;
    transition:transform .16s var(--ease), box-shadow .16s var(--ease), border-color .16s var(--ease);
    border:1px solid var(--line);
  }
  .product-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(15,61,46,0.16);}
  .product-thumb{
    height:112px;border-radius:10px;background:linear-gradient(150deg,var(--sand),var(--white));
    display:flex;align-items:center;justify-content:center;font-size:2.5rem;position:relative;
    overflow:hidden;box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;
  }
  .product-thumb img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:10px;transition:transform .3s var(--ease);}
  .product-card:hover .product-thumb img{transform:scale(1.045);}
  .brand-chip{
    align-self:flex-start;font-size:0.66rem;font-weight:800;color:var(--green-700);
    background:var(--green-100);padding:3px 9px;border-radius:999px;letter-spacing:.03em;text-transform:uppercase;
  }
  .product-card h4{margin:0;font-size:0.95rem;font-weight:700;line-height:1.32;min-height:2.5em;letter-spacing:-0.005em;color:var(--ink);}
  .product-meta{font-size:0.76rem;color:var(--ink-faint);font-weight:500;}
  .size-pills{display:flex;flex-wrap:wrap;gap:5px;}
  .size-pill{
    background:var(--sand);border:1px solid transparent;color:var(--ink);font-weight:700;font-size:0.68rem;
    padding:4px 9px;border-radius:999px;transition:background .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease);
  }
  .size-pill:hover{border-color:var(--green-500);}
  .size-pill.active{background:var(--green-700);color:var(--white);}

  /* ---------- Quick-view modal ---------- */
  .qv-modal{
    position:fixed;top:50%;left:50%;transform:translate(-50%,-46%);width:min(720px,92vw);max-height:88vh;
    overflow-y:auto;background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
    z-index:401;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
  }
  .qv-modal.open{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,-50%);}
  .qv-close{
    position:absolute;top:14px;right:14px;background:var(--sand);border:none;width:34px;height:34px;border-radius:50%;
    font-size:1rem;color:var(--ink);z-index:1;
  }
  .qv-close:hover{background:var(--green-100);}
  .qv-body{display:flex;gap:0;}
  .qv-image{
    flex:1 1 45%;min-height:280px;background:linear-gradient(150deg,var(--sand),var(--white));
    display:flex;align-items:center;justify-content:center;border-radius:var(--radius-lg) 0 0 var(--radius-lg);overflow:hidden;
  }
  .qv-image img{width:100%;height:100%;object-fit:contain;min-height:280px;padding:18px;box-sizing:border-box;}
  .qv-image .qv-emoji{font-size:5rem;}
  .qv-info{flex:1 1 55%;padding:32px 30px;display:flex;flex-direction:column;gap:10px;}
  .qv-info h3{margin:0;font-size:1.3rem;color:var(--green-900);letter-spacing:-0.01em;}
  .qv-desc{margin:0;color:var(--ink-soft);font-size:0.92rem;line-height:1.6;}
  .qv-size-select{margin-top:6px;}
  .qv-size-label{font-size:0.76rem;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.03em;margin-bottom:8px;}
  .qv-variant-size{font-size:0.8rem;color:var(--ink-soft);margin-top:8px;}
  .qv-bottom{
    margin-top:auto;padding-top:18px;border-top:1px solid var(--line);
    display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  }
  .qv-bottom .price{font-size:1.35rem;}
  #qvAddWrap .qv-add-btn{width:auto;height:auto;padding:11px 22px;border-radius:10px;font-size:0.9rem;font-weight:700;white-space:nowrap;flex-shrink:0;}
  #qvAddWrap{flex-shrink:0;}

  .product-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:2px;border-top:1px solid var(--line);padding-top:10px;}
  .price{font-weight:800;color:var(--green-800);font-size:1.1rem;font-family:Georgia,serif;letter-spacing:-0.01em;}
  .price small{font-weight:700;font-size:0.68rem;color:var(--ink-faint);font-family:Arial,sans-serif;letter-spacing:.02em;}
  .add-btn{
    background:var(--green-700);color:var(--white);border:none;border-radius:9px;
    width:36px;height:36px;font-size:1.25rem;font-weight:700;line-height:1;box-shadow:var(--shadow-sm);
    transition:background .15s var(--ease), transform .15s var(--ease), box-shadow .15s var(--ease);
  }
  .add-btn:hover{background:var(--green-600);transform:scale(1.08);box-shadow:var(--shadow);}
  .add-btn:active{transform:scale(0.96);}
  .qty-control{
    display:flex;align-items:center;gap:9px;background:var(--green-700);border-radius:9px;padding:5px 7px;
  }
  .qty-control button{background:transparent;color:var(--white);border:none;width:24px;height:24px;font-size:1rem;font-weight:700;border-radius:5px;}
  .qty-control button:hover{background:rgba(255,255,255,0.15);}
  .qty-control span{color:var(--white);font-weight:700;min-width:16px;text-align:center;font-size:0.9rem;}
  .badge{
    position:absolute;top:12px;left:12px;background:var(--gold);color:var(--green-900);
    font-size:0.63rem;font-weight:800;padding:4px 10px;border-radius:999px;text-transform:uppercase;
    box-shadow:0 2px 6px rgba(217,164,65,0.4);letter-spacing:.02em;
  }
  .no-results{text-align:center;color:var(--ink-soft);padding:50px 0;grid-column:1/-1;}
  .no-results .emoji{font-size:2.2rem;margin-bottom:10px;}

  /* ---------- About / story ---------- */
  .story-grid{
    display:grid;grid-template-columns:1.6fr 1fr;gap:40px;align-items:start;
  }
  .story-copy p{color:var(--ink-soft);line-height:1.75;margin:0 0 18px;font-size:0.98rem;}
  .story-copy p:last-child{margin-bottom:0;}
  .story-stats{
    display:grid;grid-template-columns:1fr 1fr;gap:16px;background:var(--cream);
    border-radius:var(--radius-lg);padding:26px;border:1px solid var(--line);
  }
  .story-stat .num{font-size:1.8rem;font-weight:800;color:var(--green-700);font-family:Georgia,serif;letter-spacing:-0.01em;}
  .story-stat .label{font-size:0.76rem;color:var(--ink-faint);font-weight:600;margin-top:4px;line-height:1.35;}

  /* ---------- About / why us ---------- */
  .why-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px;
  }
  .why-card{
    background:var(--white);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow-sm);
    transition:transform .2s var(--ease), box-shadow .2s var(--ease);
  }
  .why-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
  .why-card .ic-wrap{
    width:46px;height:46px;border-radius:12px;background:var(--green-100);margin-bottom:14px;
    display:flex;align-items:center;justify-content:center;font-size:1.4rem;
  }
  .why-card h4{margin:0 0 6px;color:var(--green-900);font-size:1rem;}
  .why-card p{margin:0;font-size:0.88rem;color:var(--ink-soft);}
  .quote-block{
    background:var(--green-900);color:var(--white);border-radius:var(--radius-lg);padding:42px;margin-top:42px;
    display:flex;gap:26px;align-items:center;flex-wrap:wrap;
  }
  .quote-block .mark{font-size:3.2rem;color:var(--gold);font-weight:800;line-height:0.6;font-family:Georgia,serif;}
  .quote-block p{margin:0;font-size:1.1rem;font-style:italic;max-width:640px;}
  .quote-block span{display:block;margin-top:10px;font-size:0.82rem;color:rgba(255,255,255,0.68);font-style:normal;}

  /* ---------- Locations / contact ---------- */
  .contact-bg{background:var(--sand);}
  .contact-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;}
  .contact-card{background:var(--white);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow-sm);}
  .contact-card h3{margin-top:0;color:var(--green-900);font-weight:700;}
  .contact-card .info-row .ic{background:var(--cream);}
  .map-embed-card{
    border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);
    display:flex;flex-direction:column;background:var(--green-900);
    transition:transform .18s var(--ease), box-shadow .18s var(--ease);
  }
  .map-embed-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);}
  .map-embed{width:100%;height:220px;border:0;display:block;}
  .map-cta-link{
    display:flex;align-items:center;gap:14px;padding:18px 20px;
    background:linear-gradient(rgba(22,105,68,0.95),rgba(15,61,46,0.98));
    color:var(--white);text-decoration:none;text-align:left;
  }
  .map-cta-link .pin{font-size:1.8rem;flex-shrink:0;}
  .map-cta-link .map-cta-text{flex:1;font-size:0.85rem;color:rgba(255,255,255,0.85);line-height:1.5;}
  .map-cta-link .map-cta-text strong{color:var(--white);font-size:0.95rem;}
  .map-cta-link .map-cta{
    flex-shrink:0;background:var(--gold);color:var(--green-900);font-weight:700;font-size:0.82rem;
    padding:9px 16px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  }

  /* ---------- Footer ---------- */
  footer{background:var(--green-900);color:rgba(255,255,255,0.85);padding:48px 20px 22px;}
  .footer-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px;}
  .footer-grid h5{color:var(--white);margin:0 0 14px;font-size:0.95rem;font-family:inherit;}
  .footer-grid p, .footer-grid a{font-size:0.85rem;color:rgba(255,255,255,0.72);text-decoration:none;line-height:2;}
  .footer-grid a:hover{color:var(--gold);}
  .footer-brand{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
  .social-row{display:flex;gap:10px;margin-top:10px;}
  .social-row a{
    width:36px;height:36px;border-radius:999px;background:rgba(255,255,255,0.1);
    display:flex;align-items:center;justify-content:center;font-size:0.95rem;
    transition:background .18s var(--ease);
  }
  .social-row a:hover{background:var(--gold);color:var(--green-900);}
  .footer-bottom{
    max-width:1200px;margin:32px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,0.15);
    font-size:0.78rem;color:rgba(255,255,255,0.55);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;
  }

  /* ---------- Cart drawer ---------- */
  .overlay{
    position:fixed;inset:0;background:rgba(15,36,26,0.5);opacity:0;pointer-events:none;
    transition:opacity .3s var(--ease);z-index:90;
  }
  .overlay.open{opacity:1;pointer-events:auto;}
  .cart-drawer{
    position:fixed;top:0;right:0;width:400px;max-width:92vw;height:100%;background:var(--white);
    z-index:95;box-shadow:-10px 0 40px rgba(0,0,0,0.22);transition:transform .35s var(--ease);
    display:flex;flex-direction:column;transform:translateX(100%);
  }
  .cart-drawer.open{transform:translateX(0);}
  .cart-head{padding:22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--sand);}
  .cart-head h3{margin:0;color:var(--green-900);font-weight:700;}
  .cart-close{background:var(--sand);border:none;width:34px;height:34px;border-radius:999px;font-size:1.1rem;transition:background .18s var(--ease);}
  .cart-close:hover{background:var(--sand-dark);}
  .cart-items{flex:1;overflow-y:auto;padding:8px 22px;}
  .cart-item{display:flex;gap:12px;padding:15px 0;border-bottom:1px solid var(--sand);align-items:center;}
  .cart-item .thumb{
    width:52px;height:52px;border-radius:9px;background:var(--sand);display:flex;align-items:center;
    justify-content:center;font-size:1.4rem;flex-shrink:0;
  }
  .cart-item .info{flex:1;min-width:0;}
  .cart-item .info h5{margin:0 0 2px;font-size:0.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .cart-item .info .unit{font-size:0.76rem;color:var(--ink-soft);}
  .cart-item .remove{background:none;border:none;color:var(--red);font-size:0.78rem;font-weight:700;margin-left:8px;}
  .cart-item .remove:hover{text-decoration:underline;}
  .cart-empty{text-align:center;color:var(--ink-soft);padding:70px 22px;}
  .cart-empty .emoji{font-size:2.8rem;margin-bottom:14px;}
  .cart-foot{padding:22px;border-top:1px solid var(--sand);}
  .cart-total-row{display:flex;justify-content:space-between;font-weight:700;font-size:1.08rem;margin-bottom:14px;color:var(--green-900);}
  .cart-note{font-size:0.76rem;color:var(--ink-soft);margin-bottom:14px;}
  .checkout-btn{
    width:100%;background:var(--green-700);color:var(--white);border:none;border-radius:10px;
    padding:15px;font-weight:800;font-size:0.95rem;transition:background .18s var(--ease);
  }
  .checkout-btn:hover{background:var(--green-600);}

  /* ---------- Toast ---------- */
  .toast{
    position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(20px);
    background:var(--green-900);color:var(--white);padding:13px 24px;border-radius:999px;
    font-size:0.88rem;font-weight:600;box-shadow:var(--shadow-lg);opacity:0;pointer-events:none;
    transition:all .3s var(--ease);z-index:200;display:flex;align-items:center;gap:8px;
  }
  .toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

  @media (max-width:900px){
    nav.main-nav{display:none;}
    nav.main-nav.mobile-open{
      display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;
      background:var(--white);padding:10px 20px 16px;gap:2px;box-shadow:var(--shadow-lg);
      border-top:1px solid var(--line);z-index:49;
    }
    nav.main-nav.mobile-open a{padding:13px 14px;border-radius:10px;}
    nav.main-nav.mobile-open .mobile-search{
      display:flex;align-items:center;background:var(--sand);border-radius:999px;
      padding:9px 16px;gap:8px;border:1.5px solid transparent;margin-bottom:8px;
      transition:border-color .18s var(--ease), background .18s var(--ease);
    }
    nav.main-nav.mobile-open .mobile-search:focus-within{border-color:var(--green-500);background:var(--white);}
    nav.main-nav.mobile-open .mobile-search input{
      border:none;background:transparent;outline:none;font-size:0.9rem;width:100%;color:var(--ink);
    }
    nav.main-nav.mobile-open .mobile-search input::placeholder{color:var(--ink-faint);}
    .search-box{display:none;}
    .mobile-toggle{display:block;}
    .contact-grid{grid-template-columns:1fr;}
    .footer-grid{grid-template-columns:1fr 1fr;}
    .filter-row{flex-direction:column;align-items:stretch;}
    .story-grid{grid-template-columns:1fr;}
  }
  /* ---------- Narrow phones: header brand + cart + hamburger all fighting for
     space in one row was pushing the hamburger button off-screen (unreachable).
     Tighten spacing and drop the "Cart" text label so everything fits. ---------- */
  @media (max-width:480px){
    .header-inner{gap:8px;padding:12px 14px;}
    .brand{gap:9px;}
    .brand-name{font-size:0.82rem;}
    .logo-badge.header{width:42px;height:42px;}
    .header-actions{gap:8px;}
    .cart-btn{padding:11px 12px;gap:6px;}
    .cart-btn .cart-label{display:none;}
    .mobile-toggle{width:38px;height:38px;flex-shrink:0;}
  }
  @media (max-width:600px){
    .footer-grid{grid-template-columns:1fr 1fr;}

    /* ---------- Dense mobile grids: 3-4 columns everywhere ---------- */
    .cat-grid{grid-template-columns:repeat(4,1fr);gap:8px;}
    .cat-card{padding:10px 5px;border-radius:12px;}
    .cat-card .ic-wrap{width:36px;height:36px;font-size:1rem;margin:0 auto 6px;}
    .cat-card h4{font-size:0.6rem;line-height:1.15;margin:0 0 3px;}
    .cat-card .count{font-size:0.52rem;}

    .product-grid{grid-template-columns:repeat(3,1fr);gap:9px;}
    .product-card{padding:8px 7px;gap:6px;border-radius:12px;}
    .product-thumb{height:64px;font-size:1.5rem;border-radius:8px;}
    .product-thumb img{border-radius:8px;}
    .brand-chip{font-size:0.5rem;padding:2px 6px;}
    .product-card h4{font-size:0.66rem;line-height:1.2;min-height:2.1em;}
    .product-meta{font-size:0.58rem;}
    .product-bottom{padding-top:6px;}
    .price{font-size:0.72rem;}
    .price small{font-size:0.5rem;}
    .add-btn{width:26px;height:26px;font-size:0.95rem;border-radius:7px;}
    .qty-control{padding:3px 5px;gap:5px;border-radius:7px;}
    .qty-control button{width:18px;height:18px;font-size:0.8rem;}
    .qty-control span{font-size:0.72rem;min-width:12px;}
    .badge{top:6px;left:6px;font-size:0.5rem;padding:3px 7px;}
    .size-pills{gap:3px;}
    .size-pill{font-size:0.52rem;padding:2px 6px;}
    .qv-body{flex-direction:column;}
    .qv-image{border-radius:var(--radius-lg) var(--radius-lg) 0 0;min-height:200px;}
    .qv-image img{min-height:200px;}
    .qv-info{padding:20px 18px;}
    .qv-modal{width:94vw;max-height:92vh;}

    .why-grid{grid-template-columns:repeat(3,1fr);gap:9px;}
    .why-card{padding:12px 9px;border-radius:12px;}
    .why-card .ic-wrap{width:32px;height:32px;border-radius:9px;font-size:1rem;margin-bottom:8px;}
    .why-card h4{font-size:0.72rem;margin:0 0 4px;}
    .why-card p{font-size:0.62rem;line-height:1.35;}
    .cart-drawer{width:100%;}
    .brand-strip{flex-direction:column;text-align:center;justify-content:center;}
  }

  /* ---------- Homepage loading screen (shows once per session) ---------- */
  .load-screen{
    position:fixed;inset:0;z-index:9999;
    background:radial-gradient(circle at 50% 40%, var(--green-700), var(--green-900));
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;
    transition:opacity .5s ease, visibility .5s ease;
  }
  .load-screen.hide{opacity:0;visibility:hidden;pointer-events:none;}
  .load-cart-wrap{position:relative;width:140px;height:70px;overflow:visible;}
  .load-cart{
    position:absolute;top:6px;left:0;font-size:3rem;line-height:1;
    animation:cartRoll 1.3s ease-in-out infinite;
  }
  .load-track{
    position:absolute;bottom:0;left:0;right:0;height:2px;background:rgba(255,255,255,0.18);border-radius:2px;
  }
  @keyframes cartRoll{
    0%{transform:translateX(0) rotate(0deg);}
    50%{transform:translateX(70px) rotate(6deg);}
    100%{transform:translateX(0) rotate(0deg);}
  }
  .load-brand{
    color:var(--white);font-family:Georgia,'Times New Roman',serif;font-weight:700;
    font-size:1.3rem;letter-spacing:.02em;text-align:center;
  }
  .load-sub{color:rgba(255,255,255,0.72);font-size:0.85rem;text-align:center;}
  .load-dots{display:flex;gap:6px;}
  .load-dots span{
    width:7px;height:7px;border-radius:50%;background:var(--gold);
    animation:dotPulse 1.2s ease-in-out infinite;
  }
  .load-dots span:nth-child(2){animation-delay:.15s;}
  .load-dots span:nth-child(3){animation-delay:.3s;}
  @keyframes dotPulse{
    0%,80%,100%{opacity:0.3;transform:scale(0.8);}
    40%{opacity:1;transform:scale(1.15);}
  }