:root{
    --bg:#ffffff;
    --bg-soft:#fbfbfb;
    --bg-tint:#f7f5f3;
    --text:#1f2330;
    --muted:#6b7280;
    --brand:#d6b87d;       /* champagne gold */
    --brand-2:#9fd5c3;     /* mint accent */
    --accent:#f3d6da;      /* blush tint */
    --radius:16px;
    --shadow:0 12px 30px rgba(10,11,14,.10), 0 2px 6px rgba(10,11,14,.05);
  }
  
  *{box-sizing:border-box}
  html,body{margin:0;padding:0}
  body{
    font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
    color:var(--text);
    background:linear-gradient(180deg,var(--bg),var(--bg-soft));
    line-height:1.65;
  }
  
  img{display:block;max-width:100%;height:auto;border-radius:12px}
  
  .container{max-width:1220px;margin:auto;padding:0 22px}
  .narrow{max-width:860px}
  
  /* Header */
  .site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.7);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid #eee}
  .site-header.elevated{box-shadow:0 12px 26px rgba(10,11,14,.06)}
  .topbar{border-bottom:1px solid #eee;background:var(--bg)}
  .topbar-inner{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:13px;color:#444}
  .header-inner{display:flex;align-items:center;justify-content:space-between;height:68px}
  .logo{font-family:"Playfair Display",serif;font-weight:700;font-size:26px;color:var(--text);text-decoration:none}
  .site-nav{display:flex;gap:20px;align-items:center}
  .site-nav a{color:var(--text);text-decoration:none;font-weight:500;padding:10px 12px;border-radius:10px}
  .site-nav a.active{background:var(--bg-tint)}
  .link{color:#3a3f50;text-decoration:none}
  .btn{display:inline-block;padding:12px 18px;border-radius:999px;text-decoration:none;font-weight:700}
  .btn-primary{background:var(--brand);color:#2f2412;box-shadow:var(--shadow)}
  .btn-secondary{background:var(--brand-2);color:#0d2c26;box-shadow:var(--shadow)}
  .btn-outline{border:1px solid #e4e4e4}
  .btn-link{padding:10px 6px;color:#614d2b}
  .nav-toggle{display:none;flex-direction:column;gap:4px;background:transparent;border:0;cursor:pointer}
  .nav-toggle span{width:22px;height:2px;background:#222;border-radius:2px}
  
  /* Hero */
  .hero{padding:56px 0 24px}
  .hero-xl{padding:72px 0 28px}
  .hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
  .hero h1{font-family:"Playfair Display",serif;font-size:48px;line-height:1.08;margin:0 0 12px}
  .hero p{color:var(--muted);margin:0 0 16px}
  .cta-row{display:flex;gap:12px;margin:18px 0 10px}
  .trust-badges{display:flex;gap:14px;list-style:none;padding:0;margin:8px 0 0}
  .trust-badges li{font-size:14px;color:#3a3f50;background:var(--bg-tint);padding:8px 12px;border-radius:999px;border:1px solid #eee}
  .card{background:var(--bg);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;border:1px solid rgba(0,0,0,.03)}
  .card.photo{padding:10px}
  .hero-photo{position:relative}
  .stat{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:120px;margin-top:14px;background:linear-gradient(140deg,var(--accent),#fff)}
  .stat-lg{font-size:28px;font-weight:800}
  .stat-sub{color:var(--muted)}
  
  /* Categories */
  .categories{padding:28px 0 12px}
  .section-title{font-family:"Playfair Display",serif;font-size:30px;margin:0 0 18px}
  .grid-6{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
  .cat-card{position:relative;display:block;border-radius:16px;overflow:hidden;height:170px;background:var(--bg-tint);border:1px solid #eee}
  .cat-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .cat-card span{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.9);padding:6px 10px;border-radius:999px;font-weight:700;border:1px solid #eee}
  
  /* Promo */
  .highlight{padding:28px 0}
  .highlight-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(90deg,#fff,#fff 50%,#fff0 100%), radial-gradient(900px 300px at -10% 10%, var(--accent), #fff0 40%), radial-gradient(900px 300px at 110% -10%, var(--brand-2), #fff0 40%);border:1px solid #eee;border-radius:18px;padding:22px}
  .highlight .copy h3{margin:0 0 6px;font-size:22px}
  .highlight .copy p{margin:0;color:var(--muted)}
  
  /* Products */
  .featured{padding:18px 0 44px}
  .product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .product-card{position:relative;background:var(--bg);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;border:1px solid rgba(0,0,0,.04);min-height:260px}
  .product-card img{position:absolute;inset:0;width:100%;height:200px;object-fit:cover}
  .product-card .tag{position:absolute;left:10px;top:10px;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.9);border:1px solid #eee;font-weight:700;font-size:12px}
  .product-info{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.95))}
  .price{font-weight:800;background:linear-gradient(180deg,var(--brand),#e9d6a7);-webkit-background-clip:text;background-clip:text;color:transparent}
  
  /* Pages */
  .page-hero{padding:44px 0 14px}
  .page-hero h1{font-family:"Playfair Display",serif;font-size:38px;margin:0 0 10px}
  .page-hero p{color:var(--muted);margin:0}
  .split{padding:18px 0}
  .split-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:center}
  
  /* Values, Testimonials, FAQ, Newsletter, Gallery */
  .values{padding:16px 0 36px}
  .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .vcard{background:var(--bg);border:1px solid #eee;border-radius:16px;padding:16px;box-shadow:var(--shadow)}
  .testimonials{padding:10px 0 36px}
  .tcard{background:var(--bg);border:1px solid #eee;border-radius:16px;padding:16px;box-shadow:var(--shadow)}
  .faq{padding:10px 0 36px}
  .faq-item{background:#fff;border:1px solid #eee;border-radius:12px;padding:12px 14px;margin-bottom:10px}
  .newsletter{padding:18px 0 40px}
  .newsletter-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;background:linear-gradient(120deg,#fff, #fff0 60%), radial-gradient(900px 300px at 110% -10%, var(--brand-2), #fff0 40%);border:1px solid #eee;border-radius:18px;padding:22px}
  .newsletter-form{display:flex;gap:10px}
  .newsletter-form input{padding:12px 14px;border-radius:999px;border:1px solid #e6e6e6;background:var(--bg-soft);min-width:260px}
  .gallery{padding:6px 0 40px}
  .gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
  
  /* Care & Contact */
  .care{padding:8px 0 40px}
  .care-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center}
  .contact{padding:10px 0 40px}
  .contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
  .form .form-row{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
  .form label{font-weight:700}
  .form input,.form textarea{padding:12px 14px;border-radius:12px;border:1px solid #e6e6e6;background:var(--bg-soft);outline-color:var(--brand)}
  .form-note{font-size:12px;color:var(--muted)}
  
  /* Footer */
  .site-footer{padding:26px 0 30px;border-top:1px solid #eee;margin-top:20px}
  .footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:18px}
  .socials{display:flex;gap:10px;flex-wrap:wrap}
  .footnote{padding-top:10px;border-top:1px dashed #e9e9e9;margin-top:14px;color:var(--muted);text-align:center}
  .linklist{list-style:none;padding:0;margin:0;display:grid;gap:6px}
  .linklist a{text-decoration:none;color:#3a3f50}
  .linklist a:hover{text-decoration:underline}
  
  /* Responsive */
  @media (max-width: 1100px){
    .product-grid{grid-template-columns:repeat(2,1fr)}
    .grid-6{grid-template-columns:repeat(3,1fr)}
    .gallery-grid{grid-template-columns:repeat(2,1fr)}
  }
  @media (max-width: 880px){
    .hero-grid{grid-template-columns:1fr}
    .split-grid,.care-grid,.contact-grid{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr}
    .site-nav{position:fixed;inset:68px 0 auto 0;background:#fff;padding:14px 22px;border-bottom:1px solid #eee;display:none;flex-direction:column;gap:10px}
    .site-nav.open{display:flex}
    .nav-toggle{display:flex}
  }

  /* ===== Enhanced Testimonials, FAQ, Newsletter ===== */
.testimonials{padding:18px 0 40px;background:
    radial-gradient(900px 300px at -10% 0%, var(--accent), #fff0 40%),
    radial-gradient(900px 300px at 110% 0%, var(--brand-2), #fff0 40%);
    border-top:1px solid #eee;border-bottom:1px solid #eee}
  .tcard{
    position:relative;
    padding:18px 16px 16px;
    border-radius:16px;
    background:
      linear-gradient(#fff,#fff) padding-box,
      radial-gradient(1200px 400px at -20% 0%, var(--brand-2), #fff0 40%),
      radial-gradient(1200px 400px at 120% -10%, var(--accent), #fff0 40%) border-box;
    border:1px solid transparent;
    box-shadow:var(--shadow);
  }
  .tcard::before{
    content:"“";
    position:absolute;left:12px;top:-10px;
    font-family:"Playfair Display",serif;font-size:48px;line-height:1;
    color:rgba(31,35,48,.08);pointer-events:none;
  }
  .tcard p{margin:8px 0 10px;color:#2a2f3c}
  .tcard span{color:var(--muted);font-weight:600}
  .rating{
    font-size:14px;letter-spacing:2px;line-height:1;
    background:linear-gradient(180deg,var(--brand),#e9d6a7);
    -webkit-background-clip:text;background-clip:text;color:transparent;
    margin-bottom:6px;
  }
  
  /* FAQ animations */
.faq-item{overflow:hidden; border:1px solid #eee; border-radius:14px; background:#fff}
.faq-item summary{
  list-style:none; cursor:pointer; position:relative;
  padding:14px 42px 14px 14px; font-weight:700; color:#222;
  background:linear-gradient(180deg,#fff,#fbfbfb);
  transition:background .25s ease, box-shadow .25s ease, color .25s ease;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{
  content:""; width:18px; height:18px; position:absolute; right:12px; top:50%;
  transform:translateY(-50%) rotate(0deg);
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="%236b7280" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>');
  background-size:18px 18px; background-repeat:no-repeat; opacity:.9;
  transition:transform .3s cubic-bezier(.22,.61,.36,1), opacity .2s ease;
}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(180deg); opacity:1}
.faq-item summary:hover{box-shadow:0 8px 20px rgba(10,11,14,.06)}
.faq-item summary:active{transform:translateY(0.5px)}
.faq-item[open]{border-color:rgba(214,184,125,.45); box-shadow:0 10px 24px rgba(214,184,125,.12)}

.faq-panel{
  max-height:0; overflow:hidden; opacity:.0;
  transition:max-height .35s ease, opacity .25s ease;
}
.faq-panel > .faq-panel-inner{
  padding:0 14px 14px 14px; color:#3a3f50;
}
.faq-item[open] .faq-panel{opacity:1}
  
  /* Newsletter polish */
  .newsletter-inner{
    background:
      linear-gradient(120deg,#fff,#fff0 60%),
      radial-gradient(900px 300px at 110% -10%, var(--brand-2), #fff0 40%),
      radial-gradient(900px 300px at -10% 110%, var(--accent), #fff0 40%);
    border:1px solid transparent;
    background-clip:padding-box, border-box, border-box;
  }
  .newsletter-form input{
    box-shadow:inset 0 1px 2px rgba(0,0,0,.05);
    transition:border-color .15s ease, box-shadow .15s ease;
  }
  .newsletter-form input:focus{
    border-color:rgba(214,184,125,.6);
    box-shadow:0 0 0 4px rgba(214,184,125,.18);
  }
  .newsletter .btn.btn-primary{
    box-shadow:0 10px 18px rgba(214,184,125,.28), 0 2px 6px rgba(10,11,14,.06);
    transition:transform .08s ease, box-shadow .15s ease;
  }
  .newsletter .btn.btn-primary:hover{transform:translateY(-1px)}
  .breadcrumbs{margin-top:6px;font-size:13px;color:#6b7280}
  .breadcrumbs a{text-decoration:none;color:#3a3f50}
  .breadcrumbs a:hover{text-decoration:underline}

 /* Testimonials slider (fixed layout) */
.t-slider{position:relative;min-height:220px}
.t-slide{
  position:absolute;inset:0;
  display:grid;place-items:center;
  opacity:0;transform:translateY(6px);
  transition:opacity .4s ease,transform .4s ease;
}
.t-slide.active{opacity:1;transform:none}
.t-slide .tcard{max-width:640px;width:92%}

.ugc{padding:10px 0 40px;border-top:1px solid #eee}

/* Modal */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.28);display:grid;place-items:center;z-index:70}
.modal[hidden]{display:none}
.modal__dialog{position:relative;background:#fff;border-radius:16px;max-width:720px;width:92%;padding:16px;border:1px solid #eee;box-shadow:var(--shadow)}
.modal__close{position:absolute;right:14px;top:10px;background:#fff;border:1px solid #eee;border-radius:999px;padding:4px 8px;cursor:pointer}

/* Icon strip */
.usp-strip{padding:10px 0 18px;border-bottom:1px solid #eee;background:linear-gradient(180deg,#fff,#fbfbfb)}
.usp-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.usp{display:flex;gap:10px;align-items:center;background:#fff;border:1px solid #eee;border-radius:14px;padding:10px 12px;box-shadow:var(--shadow)}
.usp i{width:28px;height:28px;border-radius:999px;background:linear-gradient(180deg,var(--accent),#fff);display:grid;place-items:center;font-weight:900;color:#475569}

/* Press logos */
.press{padding:16px 0;border-bottom:1px solid #eee}
.press-logos{display:flex;gap:18px;flex-wrap:wrap;opacity:.7}
.press-logos img{height:24px;filter:grayscale(100%)}

/* Why choose (icons) */
.why{padding:22px 0 10px}
.why-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.why-card{background:#fff;border:1px solid #eee;border-radius:14px;padding:12px;box-shadow:var(--shadow);text-align:center}
.why-card i{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;background:linear-gradient(180deg,#fff,var(--bg-tint));margin-bottom:8px}

/* Materials quality (progress bars) */
.quality{padding:16px 0 30px}
.progress{height:8px;background:#f1f3f5;border-radius:999px;overflow:hidden}
.progress > span{display:block;height:100%;background:linear-gradient(90deg,var(--brand),#e9d6a7);width:0}

/* Shipping band */
.shipping{padding:14px;border:1px solid #eee;border-radius:14px;background:linear-gradient(90deg,#fff,#fff0 60%),radial-gradient(700px 240px at 110% -20%,var(--brand-2),#fff0 40%);box-shadow:var(--shadow)}

/* Mini category nav (services) */
.mini-nav{position:sticky;top:68px;background:#fff;border:1px solid #eee;border-radius:999px;padding:8px 10px;display:flex;gap:8px;flex-wrap:wrap;z-index:40}
.mini-nav a{padding:8px 12px;border-radius:999px;background:#f7f5f3;color:#333;text-decoration:none}
.mini-nav a.active{background:var(--brand);color:#2f2412}

/* Product specs on hover */
.product-card .specs{position:absolute;inset:auto 0 0 0;transform:translateY(100%);background:rgba(255,255,255,.96);padding:10px 12px;font-size:12px;border-top:1px solid #eee;transition:transform .25s ease}
.product-card:hover .specs{transform:translateY(0)}

/* Map box */
.mapbox{border:1px solid #eee;border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}

/* Shipping feature pills */
.shipping-feats{
    display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:0; padding:0;
  }
  .shipping-feats li{
    list-style:none; padding:8px 12px; border-radius:999px;
    background:#fff; border:1px solid #eee; box-shadow:var(--shadow);
    font-weight:700; color:#334155; display:flex; align-items:center; gap:8px;
  }
  .shipping-feats li::before{
    content:"✓"; width:18px; height:18px; display:grid; place-items:center; font-weight:900;
    background:linear-gradient(180deg,var(--brand),#e9d6a7);
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }



