:root{
      --cream:#FDFAF6;
      --warm:#F5EEE4;
      --orange:#E8742A;
      --orange-light:#FFF0E6;
      --amber:#F4A825;
      --brown:#5C3317;
      --dark:#1A0E06;
      --muted:#8A7060;
      --white:#FFFFFF;
      --green:#25D366;
      --green-dark:#128C7E;
      --card-radius:20px;
      --pill-radius:50px;
      --shadow-sm:0 2px 12px rgba(92,51,23,.08);
      --shadow-md:0 8px 32px rgba(92,51,23,.13);
      --shadow-lg:0 20px 60px rgba(92,51,23,.18);
    }
    *,*::before,*::after{
        box-sizing:border-box;
        margin:0;
        padding:0
    }
    html{
        scroll-behavior:smooth
    }
    body{
        font-family:'Plus Jakarta Sans',sans-serif;
        background:var(--cream);
        color:var(--dark);
        overflow-x:hidden;
        -webkit-font-smoothing:antialiased
    }
    img{
        display:block;max-width:100%;
        object-fit:cover
    }
    a{
        text-decoration:none;
        color:inherit
    }
    .container{
        max-width:1120px;
        margin:0 auto;
        padding:0 20px
    }
    .tag{
        display:inline-flex;
        align-items:center;
        gap:6px;border:1.5px solid var(--orange);color:var(--orange);border-radius:var(--pill-radius);padding:4px 14px;font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;cursor:pointer;font-family:inherit;font-weight:700;border-radius:var(--pill-radius);transition:.2s ease;white-space:nowrap}
    .btn-orange{background:var(--orange);color:#fff;box-shadow:0 6px 20px rgba(232,116,42,.35)}
    .btn-orange:hover{background:#d4641e;transform:translateY(-2px)}
    .btn-outline-light{background:rgba(255,255,255,.1);backdrop-filter:blur(6px);color:#fff;border:2px solid rgba(255,255,255,.4)}
    .btn-outline-light:hover{background:rgba(255,255,255,.2)}
    .btn-outline-dark{background:transparent;color:rgba(253,250,246,.7);border:2px solid rgba(253,250,246,.2)}
    .btn-outline-dark:hover{background:rgba(255,255,255,.08)}
    .btn-green{background:var(--green);color:#fff;box-shadow:0 6px 20px rgba(37,211,102,.35)}
    .btn-green:hover{background:var(--green-dark);transform:translateY(-2px)}
    .btn-lg{font-size:1rem;padding:15px 32px}
    .btn-md{font-size:.88rem;padding:11px 24px}
    .btn-sm{font-size:.78rem;padding:8px 18px}
    .section-title{font-family:'Fraunces',serif;font-size:clamp(1.75rem,3.5vw,2.6rem);font-weight:800;line-height:1.2;color:var(--dark)}
    .section-sub{margin-top:10px;font-size:.97rem;color:var(--muted);line-height:1.75;max-width:520px}

    /* Reveal */
    .reveal{opacity:0;transform:translateY(26px);transition:opacity .6s ease,transform .6s ease}
    .reveal.up{opacity:1;transform:translateY(0)}

    /* ── NAVBAR ── */
    nav{position:fixed;top:0;left:0;right:0;z-index:1000;height:66px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;background:rgba(253,250,246,.93);backdrop-filter:blur(14px);border-bottom:1px solid rgba(232,116,42,.12)}
    .nav-brand{display:flex;align-items:center;gap:10px}
    .nav-icon{width:38px;height:38px;border-radius:10px;background:var(--orange);display:flex;align-items:center;justify-content:center}
    .nav-name{font-family:'Fraunces',serif;font-size:1.2rem;font-weight:800;color:var(--brown)}
    .nav-links{display:flex;gap:28px;list-style:none}
    .nav-links a{font-size:.88rem;font-weight:600;color:var(--muted);transition:color .2s}
    .nav-links a:hover,.nav-links a.active{color:var(--orange)}
    .hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:6px}
    .hamburger span{width:23px;height:2px;background:var(--brown);border-radius:2px;transition:.3s}
    .hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
    .hamburger.open span:nth-child(2){opacity:0}
    .hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
    .mobile-nav{display:none;position:fixed;top:66px;left:0;right:0;z-index:999;background:var(--cream);padding:24px;border-bottom:1px solid rgba(232,116,42,.12);flex-direction:column;gap:18px}
    .mobile-nav.open{display:flex}
    .mobile-nav a{font-size:1rem;font-weight:700;color:var(--muted)}
    .mobile-nav a:hover{color:var(--orange)}

    /* ── HERO ── */
    .hero{min-height:100svh;padding-top:66px;
        
        
        display:flex;flex-direction:column;position:relative;overflow:hidden}
    .hero-bg{position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1542838132-92c53300491e?w=1400&q=80') center/cover no-repeat;filter:brightness(.38)}
    .hero-content{position:relative;z-index:2;flex:1;display:flex;align-items:center;padding:60px 24px 80px}
    .hero-inner{
        max-width:700px;margin:0 auto;margin-top: 35px;margin-bottom: -35px;  text-align:center }
    
    .hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.15);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);border-radius:var(--pill-radius);padding:7px 18px;font-size:.78rem;font-weight:700;color:#fff;letter-spacing:.06em;text-transform:uppercase;margin-bottom:24px}
    .hero-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--green);display:inline-block;animation:blink 1.4s ease-in-out infinite}
    @keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
    .hero h1{font-family:'Fraunces',serif;font-size:clamp(2.4rem,6vw,4rem);font-weight:900;line-height:1.1;color:#fff;margin-bottom:18px}
    .hero h1 em{color:var(--amber);font-style:normal}
    .hero-sub{font-size:1.06rem;color:rgba(255,255,255,.8);line-height:1.75;max-width:480px;margin:0 auto 36px}
    .hero-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
    .hero-trust{position:relative;z-index:2;background:rgba(253,250,246,.97);display:flex;
        margin-top: 66px; 
        
        justify-content:center;border-top:1px solid rgba(232,116,42,.1)}
    .trust-pill{padding:20px 28px;display:flex;align-items:center;gap:12px;border-right:1px solid rgba(232,116,42,.1);flex:1;justify-content:center}
    .trust-pill:last-child{border-right:none}
    .trust-icon-wrap{width:40px;height:40px;border-radius:10px;background:var(--orange-light);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}
    .trust-text strong{display:block;font-size:.85rem;font-weight:700;color:var(--dark)}
    .trust-text span{font-size:.74rem;color:var(--muted)}
/* 
      .order-popup{
        position: fixed;
        bottom: 20px;
        left: 20px;
        background: #fff;
        padding: 10px 14px;
        border-radius: 10px;
        box-shadow: 0 8px 25px rgba(0,0,0,0.08);
        font-size: 0.8rem;
        font-weight: 600;
        color: #333;
        z-index: 1000;
        animation: fadeInUp .6s ease;
        }

        @keyframes fadeInUp{
            from{
             opacity:0;
             transform:translateY(20px);
             }
            to {
                opacity:1;
                transform:translateY(0);
            }
        }   */

    /* ── ABOUT ── */
    .about{padding:96px 0;background:var(--warm)}
    .about-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
    .about-img-stack{position:relative;height:460px}
    .about-img-main{width:78%;height:380px;border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow-lg);position:absolute;bottom:0;right:0}
    .about-img-main img{width:100%;height:100%;object-fit:cover}
    .about-img-sm{width:52%;height:220px;border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow-md);position:absolute;top:0;left:0;border:5px solid var(--warm)}
    .about-img-sm img{width:100%;height:100%;object-fit:cover}
    .about-badge-float{position:absolute;bottom:32px;left:0;background:#fff;border-radius:var(--card-radius);padding:16px 20px;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:12px;z-index:2}
    .about-badge-float .num{font-family:'Fraunces',serif;font-size:1.6rem;font-weight:900;color:var(--orange)}
    .about-badge-float .lbl{font-size:.75rem;color:var(--muted);font-weight:600}
    .section-head{margin-bottom:40px}
    .section-head .tag{margin-bottom:14px}
    .about-features{display:flex;flex-direction:column;gap:16px;margin-top:32px}
    .about-feat{display:flex;align-items:flex-start;gap:14px;background:#fff;border-radius:14px;padding:18px;box-shadow:var(--shadow-sm)}
    .feat-icon{width:42px;height:42px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:1.2rem}
    .feat-icon.g{background:#E8F9F0}
    .feat-icon.a{background:#FFF8E1}
    .feat-icon.o{background:var(--orange-light)}
    .feat-title{font-weight:700;font-size:.92rem;color:var(--dark);margin-bottom:3px}
    .feat-desc{font-size:.8rem;color:var(--muted);line-height:1.6}

    /* ── CATEGORIES ── */
    .categories{padding:96px 0;background:var(--cream)}
    .cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
    .cat-card{border-radius:var(--card-radius);overflow:hidden;background:#fff;box-shadow:var(--shadow-sm);cursor:pointer;transition:.25s ease;flex-shrink:0}
    .cat-card:hover{transform:translateY(-7px);box-shadow:var(--shadow-md)}
    .cat-img{height:280px;overflow:hidden}
    .cat-img img{width:100%;height:100%;object-fit:cover;transition:.4s ease}
    .cat-card:hover .cat-img img{transform:scale(1.06)}
    .cat-body{padding:22px}
    .cat-name{font-family:'Fraunces',serif;font-size:1.1rem;font-weight:800;color:var(--dark);margin-bottom:6px}
    .cat-desc{font-size:.82rem;color:var(--muted);line-height:1.6;margin-bottom:14px}
    .cat-link{display:inline-flex;align-items:center;gap:5px;font-size:.82rem;font-weight:700;color:var(--orange)}
    .cat-link svg{transition:.2s}
    .cat-card:hover .cat-link svg{transform:translateX(3px)}
    @media(max-width:700px){
      .categories{padding:72px 0}
      .cat-grid{display:flex;flex-direction:column;gap:20px}
      .cat-card{width:100%}
      .cat-img{height:260px}
    }

    /* ── PRODUCTS ── */
    .products{padding:96px 0;background:var(--warm)}
    .prod-grid{display:flex;flex-direction:column;gap:20px}
    .prod-card{background:#fff;border-radius:var(--card-radius);overflow:hidden;box-shadow:var(--shadow-sm);display:flex;align-items:stretch;transition:.25s ease}
    .prod-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}
    .prod-img-wrap{flex:0 0 260px;overflow:hidden;position:relative}
    .prod-img-wrap img{width:100%;height:100%;object-fit:cover;transition:.4s}
    .prod-card:hover .prod-img-wrap img{transform:scale(1.05)}
    .prod-badge{position:absolute;top:12px;left:12px;border-radius:var(--pill-radius);padding:4px 12px;font-size:.68rem;font-weight:800;letter-spacing:.04em;color:#fff}
    .b-best{background:#E8742A}
    .b-new{background:#7B2FF7}
    .b-pop{background:#E91E8C}
    .b-trending{background:#0EA5E9}
    .prod-body{padding:22px 24px;flex:1;display:flex;flex-direction:column;justify-content:space-between}
    .prod-cat{font-size:.7rem;font-weight:700;color:var(--orange);letter-spacing:.07em;text-transform:uppercase;margin-bottom:6px}
    .prod-name{font-family:'Fraunces',serif;font-size:1.1rem;font-weight:800;color:var(--dark);margin-bottom:8px}
    .prod-desc{font-size:.82rem;color:var(--muted);line-height:1.65;margin-bottom:16px;flex:1}
    .prod-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}
    .prod-price{font-family:'Fraunces',serif;font-size:1.15rem;font-weight:900;color:var(--orange)}

    /* ── HOW ── */
    .how{padding:96px 0;background:var(--cream)}
    .how-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;margin-bottom:52px}
    .how-card{background:#fff;border-radius:var(--card-radius);padding:34px 26px;box-shadow:var(--shadow-sm);text-align:center}
    .how-num{width:48px;height:48px;border-radius:50%;background:var(--orange);color:#fff;font-family:'Fraunces',serif;font-size:1.1rem;font-weight:900;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;box-shadow:0 6px 18px rgba(232,116,42,.35)}
    .how-icon{font-size:2rem;margin-bottom:14px}
    .how-title{font-weight:800;font-size:.97rem;color:var(--dark);margin-bottom:8px}
    .how-desc{font-size:.82rem;color:var(--muted);line-height:1.65}

    /* ── TESTIMONIALS ── */
    .testi{padding:96px 0;background:var(--warm)}
    .testi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
    .testi-card{background:#fff;border-radius:var(--card-radius);padding:30px;box-shadow:var(--shadow-sm)}
    .stars{color:var(--amber);font-size:.9rem;letter-spacing:2px;margin-bottom:14px}
    .testi-quote{font-size:.92rem;color:#5a4a3a;line-height:1.75;font-style:italic;margin-bottom:22px;padding-left:14px;border-left:3px solid var(--orange)}
    .testi-author{display:flex;align-items:center;gap:12px}
    .testi-ava{width:42px;height:42px;border-radius:50%;overflow:hidden;flex-shrink:0}
    .testi-ava img{width:100%;height:100%;object-fit:cover}
   
    .testi-ava{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#E8742A;
  color:#fff;
  font-weight:700;
}
.testi-meta{
  font-size:.72rem;
  color: #10b981;
  font-weight:600;
  margin-bottom:2px;
}
    .testi-name{font-weight:700;font-size:.88rem;color:var(--dark)}
    .testi-place{font-size:.75rem;color:var(--muted)}

    /* ── CONTACT ── */
    .contact{padding:96px 0;background:var(--dark);position:relative;overflow:hidden}
    .contact::before{content:'';position:absolute;top:-200px;right:-200px;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(232,116,42,.12) 0%,transparent 70%)}
    .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;position:relative;z-index:2}
    .contact .tag{border-color:var(--amber);color:var(--amber)}
    .contact .section-title{color:var(--cream)}
    .contact .section-sub{color:rgba(253,250,246,.6)}
    .contact-links{margin-top:32px;display:flex;flex-direction:column;gap:12px}
    .contact-row{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:16px 20px;transition:.2s;cursor:pointer}
    .contact-row:hover{background:rgba(255,255,255,.1)}
    .contact-row-left{display:flex;align-items:center;gap:14px}
    .ci{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}
    .ci-g{background:rgba(37,211,102,.18)}
    .ci-o{background:rgba(232,116,42,.18)}
    .ci-a{background:rgba(244,168,37,.18)}
    .contact-label{font-size:.72rem;color:rgba(253,250,246,.45);font-weight:600;margin-bottom:2px}
    .contact-val{font-size:.93rem;color:var(--cream);font-weight:700}
    .cta-box{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:40px}
    .cta-box h3{font-family:'Fraunces',serif;font-size:1.55rem;font-weight:800;color:var(--cream);margin-bottom:10px}
    .cta-box p{font-size:.88rem;color:rgba(253,250,246,.55);margin-bottom:28px;line-height:1.7}

    /* ── FOOTER ── */
    footer{background:#110800;padding:36px 24px;text-align:center;border-top:1px solid rgba(255,255,255,.05)}
    .footer-logo{font-family:'Fraunces',serif;font-size:1.4rem;font-weight:900;color:var(--amber);margin-bottom:8px}
    .footer-sub{font-size:.8rem;color:rgba(253,250,246,.35);margin-bottom:22px}
    .footer-links{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin-bottom:20px}
    .footer-links a{font-size:.82rem;color:rgba(253,250,246,.4);font-weight:600;transition:color .2s}
    .footer-links a:hover{color:var(--amber)}
    .footer-copy{font-size:.74rem;color:rgba(253,250,246,.2)}

    /* ── FLOATING WA ── */
    .float-wa{position:fixed;bottom:26px;right:26px;z-index:990;width:60px;height:60px;border-radius:50%;background:var(--green);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 28px rgba(37,211,102,.5);transition:.2s}
    .float-wa:hover{transform:scale(1.1)}
    .float-wa svg{width:30px;height:30px;fill:#fff;position:relative;z-index:1}
    .float-pulse{position:absolute;inset:0;border-radius:50%;background:var(--green);opacity:.3;animation:pulse 2.2s ease-in-out infinite}
    @keyframes pulse{0%,100%{transform:scale(1);opacity:.3}50%{transform:scale(1.65);opacity:0}}

    /* ── RESPONSIVE ── */
    @media(max-width:900px){
      .nav-links,.nav-cta-d{display:none}
      .hamburger{display:flex}
      .about-grid,.contact-grid{grid-template-columns:1fr}
      .about-img-stack{height:320px}
      .about-img-main{width:82%;height:290px}
      .about-img-sm{height:170px}
      .trust-pill{padding:14px 16px}
    }
    @media(max-width:640px){
      .hero-trust{flex-direction:column}
      .trust-pill{border-right:none;border-bottom:1px solid rgba(232,116,42,.1)}
      .trust-pill:last-child{border-bottom:none}
      .prod-img-wrap{flex:0 0 130px}
      .how-grid{grid-template-columns:1fr 1fr}
      .prod-body{padding:16px}
    }
    @media(max-width:420px){
      .how-grid{grid-template-columns:1fr}
      .hero h1{font-size:2rem}
      .prod-img-wrap{flex:0 0 110px}
    }