:root{
  --bg:#ffffff; --surface:#f8fafc; --text:#0f172a; --muted:#475569;
  --brand:#16a34a; --brand-2:#0ea5e9; --border:#e2e8f0; --card:#ffffff;
  --shadow:0 10px 25px rgba(2,6,23,.08); --radius:1rem;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,Segoe UI,Inter,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.65}
.container{max-width:1200px;margin:0 auto;padding:0 1rem}
a{color:inherit;text-decoration:none} img{max-width:100%;display:block}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.1rem;border-radius:999px;border:1px solid var(--border);background:#fff;box-shadow:var(--shadow);transition:transform .15s ease, box-shadow .2s ease}
.btn:hover{transform:translateY(-1px)} .btn.primary{background:var(--brand);color:#fff;border-color:transparent} .btn.ghost{background:transparent}
.badge{display:inline-block;background:var(--surface);padding:.3rem .7rem;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:.85rem}
header.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--border)}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0}
.nav-left,.nav-right{display:flex;align-items:center;gap:.8rem}
.nav-center{display:flex;align-items:center;gap:1.2rem}
.logo{display:flex;align-items:center;gap:.6rem;font-weight:800}.logo .dot{width:10px;height:10px;border-radius:50%;background:var(--brand)}
.nav a{padding:.5rem .7rem;border-radius:.6rem}.nav a.active,.nav a:hover{background:var(--surface)}
.cart-pill{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .7rem;border-radius:999px;border:1px solid var(--border);background:#fff}
.cart-count{min-width:1.3rem;height:1.3rem;border-radius:999px;background:var(--brand);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700}
.hero{padding:4rem 0 2.5rem;background:linear-gradient(180deg,#ecfeff 0%,#fff 100%);border-bottom:1px solid var(--border)}
.hero h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin:.2rem 0} .hero p{color:var(--muted);max-width:60ch}
.grid{display:grid;gap:1rem} .grid.cols-3{grid-template-columns:repeat(3,1fr)} .grid.cols-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.grid.cols-3,.grid.cols-4{grid-template-columns:repeat(2,1fr)}} @media (max-width:600px){.grid.cols-3,.grid.cols-4{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.card .p{padding:1rem} .card h3{margin:.2rem 0}
.price{font-weight:800} .price del{color:var(--muted);font-weight:500;margin-left:.4rem}
.kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.kpi .stat{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow);text-align:center}
.kpi .stat h4{margin:.2rem 0;font-size:1.8rem}
@media (max-width:800px){.kpi{grid-template-columns:repeat(2,1fr)}}
.video-section{padding:2.5rem 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface)}
.video-wrap{position:relative;padding-top:56.25%;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.section{padding:2.5rem 0} .section h2{margin-top:0}
.products-grid .card .thumb{aspect-ratio:4/3;background:#eef2ff;display:flex;align-items:center;justify-content:center;color:#334155}
.testimonials{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.testimonial{padding:1rem;border:1px solid var(--border);background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow)}
.testimonial .author{display:flex;align-items:center;gap:.6rem;margin-top:.6rem;color:var(--muted);font-size:.9rem}
@media (max-width:900px){.testimonials{grid-template-columns:1fr}}
.faq .item{border:1px solid var(--border);border-radius:var(--radius);background:var(--card);margin-bottom:.6rem;overflow:hidden}
.faq .q{display:flex;justify-content:space-between;align-items:center;padding:1rem;cursor:pointer}
.faq .a{padding:0 1rem 1rem;display:none;color:var(--muted)} .faq .item.open .a{display:block}
.product-page{display:grid;grid-template-columns:1.1fr .9fr;gap:1.5rem}
.product-gallery .main{aspect-ratio:4/3;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.product-gallery .thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}
.product-gallery .thumbs img{border:1px solid var(--border);border-radius:.6rem;cursor:pointer}
@media (max-width:900px){.product-page{grid-template-columns:1fr}}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid var(--border);padding:.7rem;text-align:start}
.table tfoot td{font-weight:800}
footer.site-footer{border-top:1px solid var(--border);background:#fff;padding:2rem 0;margin-top:3rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:1rem}
.footer-grid h4{margin:.4rem 0} .footer-grid ul{list-style:none;padding:0;margin:0}
.footer-grid li{margin:.3rem 0} .copy{margin-top:1rem;color:var(--muted);font-size:.9rem;text-align:center}
.search-input{border:1px solid var(--border);border-radius:999px;padding:.55rem .9rem;min-width:220px;background:#fff}
footer form input[type=email]{border:1px solid var(--border);border-radius:999px;padding:.55rem .9rem;margin-right:.5rem}

/* === Centovita Pro Header (responsive) === */
.cv-container{max-width:1200px;margin:0 auto;padding:0 .8rem}
.cv-header{
  position:sticky;top:0;z-index:80;
  backdrop-filter:saturate(180%) blur(10px);
  background:rgba(255,255,255,.9);
  border-bottom:1px solid var(--border);
}
.cv-header.is-scrolled{box-shadow:var(--shadow)}

.cv-nav{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.7rem 0}

/* Brand */
.cv-brand{display:flex;align-items:center;gap:.6rem;font-weight:800;color:var(--text)}
.cv-brand-dot{width:10px;height:10px;border-radius:50%;background:var(--brand)}
.cv-badge{display:none;background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:.2rem .6rem;color:var(--muted);font-size:.8rem}

/* Desktop nav */
.cv-primary{display:flex;align-items:center;gap:.6rem}
.cv-primary>a,.cv-dd-btn{
  padding:.55rem .7rem;border-radius:.6rem;border:1px solid transparent;
}
.cv-primary>a:hover,.cv-dd-btn:hover,
.cv-primary>a.active{background:var(--surface)}
.cv-dropdown{position:relative}
.cv-dd-btn{display:flex;align-items:center;gap:.4rem;background:transparent;cursor:pointer}
.cv-dd-menu{
  position:absolute;top:calc(100% + .4rem);inset-inline-start:0;
  background:#fff;border:1px solid var(--border);border-radius:.8rem;
  min-width:220px;box-shadow:var(--shadow);padding:.4rem;display:none;
}
.cv-dropdown.open .cv-dd-menu{display:block}
.cv-dd-menu a{display:block;padding:.6rem;border-radius:.6rem}
.cv-dd-menu a:hover{background:var(--surface)}

/* Search + Actions */
.cv-actions{display:flex;align-items:center;gap:.6rem}
.cv-search{display:flex;align-items:center;border:1px solid var(--border);border-radius:999px;padding:.35rem .45rem;background:#fff}
.cv-search-input{border:0;outline:0;background:transparent;min-width:220px}
.cv-icon-btn{border:0;background:transparent;padding:.2rem .3rem;cursor:pointer;border-radius:.5rem}
.cv-icon-btn:hover{background:var(--surface)}
.cv-cart{
  display:inline-flex;align-items:center;gap:.35rem;
  padding:.45rem .7rem;border-radius:999px;border:1px solid var(--border);background:#fff;
}
.cv-cart-badge{
  min-width:1.2rem;height:1.2rem;border-radius:999px;background:var(--brand);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700
}

/* Burger */
.cv-burger{display:none;flex-direction:column;gap:4px;background:transparent;border:0;padding:.4rem;border-radius:.6rem;cursor:pointer}
.cv-burger:hover{background:var(--surface)}
.cv-burger span{width:22px;height:2px;background:var(--text);display:block;border-radius:2px}

/* Mobile drawer */
.cv-mobile{position:fixed;inset:60px 0 0 0;background:#fff;border-top:1px solid var(--border);box-shadow:var(--shadow);padding:1rem;display:none}
.cv-mobile.open{display:block}
.cv-mobile-nav{display:flex;flex-direction:column;gap:.4rem}
.cv-mobile-nav a{padding:.7rem;border-radius:.6rem}
.cv-mobile-nav a:hover{background:var(--surface)}
.cv-mobile-dd summary{padding:.7rem;border-radius:.6rem;cursor:pointer}
.cv-mobile-dd[open] summary, .cv-mobile-dd summary:hover{background:var(--surface)}
.cv-mobile-dd-menu{padding:.3rem .6rem .6rem .6rem;display:grid;gap:.3rem}
.cv-mobile-search{display:flex;gap:.5rem;margin-top:.8rem}
.cv-mobile-search input{flex:1;border:1px solid var(--border);border-radius:.6rem;padding:.55rem .7rem}

/* Breakpoints */
@media (max-width:1024px){
  .cv-search-input{min-width:160px}
  .cv-badge{display:none}
}
@media (max-width:860px){
  .cv-primary{display:none}
  .cv-burger{display:flex}
  .cv-search-input{min-width:130px}
}
@media (min-width:861px){
  .cv-mobile{display:none !important}
  .cv-badge{display:inline-block}
}

/* RTL/LTR auto support */
:root[dir="rtl"] .cv-dd-menu{inset-inline-start:auto;inset-inline-end:0}


/* ====== Pro Index Layout ====== */
.cv-announce{background:#0ea5e9;color:#fff}
.cv-announce .cv-container{display:flex;gap:.8rem;align-items:center;justify-content:center;padding:.45rem 1rem;font-weight:600}
.cv-announce-link{color:#fff;text-decoration:underline}

.cv-hero-pro{border-bottom:1px solid var(--border);background:linear-gradient(180deg,#f0fdf4 0%, #fff 60%)}
.cv-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:1.4rem;padding:2.5rem 0}
.cv-hero-copy h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin:.4rem 0}
.cv-hero-copy p{color:var(--muted);max-width:54ch}
.cv-hero-cta{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.8rem}
.cv-checks{margin:1rem 0 0 0;padding:0 0 0 1.1rem;color:var(--muted)}
.cv-checks li{margin:.25rem 0}
.cv-hero-media{position:relative}
.cv-hero-frame{margin:0;background:#fff;border:1px solid var(--border);border-radius:1.1rem;overflow:hidden;box-shadow:var(--shadow)}
.cv-hero-frame img{display:block;width:100%;height:auto}
.cv-floating{position:absolute;inset:auto 0 -14px auto;display:flex;gap:.6rem;justify-content:flex-end}
.cv-float-card{background:#fff;border:1px solid var(--border);border-radius:.9rem;padding:.6rem .8rem;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;min-width:120px}
.cv-float-card strong{font-size:1.1rem}

@media (max-width:900px){ .cv-hero-grid{grid-template-columns:1fr} .cv-floating{position:static;margin-top:.6rem;justify-content:flex-start} }

.cv-trustbar{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface)}
.cv-trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;padding:1rem 0}
.cv-trust-item{display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--border);border-radius:.8rem;padding:.7rem;font-weight:700}
@media (max-width:800px){.cv-trust-grid{grid-template-columns:repeat(2,1fr)}}

.cv-section{padding:2.2rem 0}
.cv-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.8rem}
.cv-head h2{margin:0}
.cv-head-actions{display:flex;gap:.4rem;flex-wrap:wrap}

.cv-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.cv-cat{border:1px solid var(--border);border-radius:1rem;overflow:hidden;display:grid;grid-template-rows:140px auto;background:#fff;box-shadow:var(--shadow)}
.cv-cat-img{background:linear-gradient(135deg,var(--brand) 0%, var(--brand-2) 100%);opacity:.15}
.cv-cat-meta{padding:1rem}
.cv-cat:hover .cv-cat-img{opacity:.2}
@media (max-width:900px){.cv-cats{grid-template-columns:1fr}}

.cv-video-banner{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--surface)}
.cv-video-wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:1rem;padding:1.5rem 0}
.cv-video-copy p{color:var(--muted)}
.cv-bullets{margin:.6rem 0 0 1rem;color:var(--muted)}
.cv-video-frame{position:relative;padding-top:56.25%;border-radius:1rem;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--border);background:#000}
.cv-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (max-width:900px){.cv-video-wrap{grid-template-columns:1fr}}

.cv-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.cv-benefit{padding:1rem}
@media (max-width:900px){.cv-benefits{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cv-benefits{grid-template-columns:1fr}}

.cv-newsletter{background:linear-gradient(180deg,#fff 0%, #f0f9ff 100%);border-top:1px solid var(--border)}
.cv-news-wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.4rem 0}
.cv-news-wrap form{display:flex;gap:.4rem;flex-wrap:wrap}
.cv-news-wrap input{border:1px solid var(--border);border-radius:999px;padding:.6rem .9rem;min-width:260px;background:#fff}
@media (max-width:800px){.cv-news-wrap{flex-direction:column;align-items:flex-start}}


/* ===== Trustbar Pro ===== */
.cv-trustbar-pro{
  /* خلفية متدرجة مع نقش خفيف */
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(14,165,233,.08), transparent 60%),
    radial-gradient(900px 500px at 90% 10%, rgba(22,163,74,.08), transparent 60%),
    linear-gradient(180deg, #f8fbff 0%, #ffffff 70%);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:1.2rem 0 1.4rem;
}

.cv-trust-grid-pro{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0.9rem;
}

.cv-trust-card{
  display:flex; align-items:center; gap:.8rem;
  background:#fff;
  border:1px solid var(--border);
  border-radius:1rem;
  padding:.9rem 1rem;
  box-shadow:0 8px 24px rgba(2,6,23,.06);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cv-trust-card:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 30px rgba(2,6,23,.08);
  border-color:#dbe3ee;
}

.cv-trust-ico{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:12px;
  background:linear-gradient(135deg, rgba(22,163,74,.12), rgba(14,165,233,.12));
  color:#0f172a;
  flex:0 0 42px;
}
.cv-trust-text h3{
  margin:0; font-size:1rem; line-height:1.2;
}
.cv-trust-text p{
  margin:.15rem 0 0; color:var(--muted); font-size:.9rem;
}

/* ريسبونسف */
@media (max-width:1000px){
  .cv-trust-grid-pro{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px){
  .cv-trust-card{ padding:.8rem .9rem; }
  .cv-trust-ico{ width:38px; height:38px; border-radius:10px; }
  .cv-trust-text h3{ font-size:.95rem; }
  .cv-trust-text p{ font-size:.86rem; }
}



/* ===== Section shells (backgrounds) ===== */
.cv-sec{padding:2.2rem 0; position:relative}
.cv-sec-products{
  background:
    radial-gradient(900px 500px at -10% 10%, rgba(14,165,233,.08), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.cv-sec-video{
  background:
    linear-gradient(180deg, #ecfdf5 0%, #ffffff 100%);
  overflow:hidden;
}
.cv-sec-benefits{
  background:
    radial-gradient(700px 420px at 110% -10%, rgba(22,163,74,.08), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-top:1px solid var(--border);
}
.cv-sec-testimonials{
  background: linear-gradient(180deg, #f0f9ff 0%, #ffffff 90%);
}
.cv-sec-faq{
  background: linear-gradient(180deg, #fff 0%, #f9fafb 100%);
  border-top:1px solid var(--border);
}

/* ===== Tabs (products) ===== */
.cv-tabs{display:flex;gap:.4rem;flex-wrap:wrap}
.cv-tabs .btn{background:#fff;border:1px solid var(--border)}
.cv-tabs .btn.active{background:var(--brand);color:#fff;border-color:transparent}
.reveal-grid .card{opacity:0;transform:translateY(10px);transition:all .35s ease}
.reveal-grid.ready .card{opacity:1;transform:none}
.reveal-grid.ready .card:nth-child(1){transition-delay:.02s}
.reveal-grid.ready .card:nth-child(2){transition-delay:.06s}
.reveal-grid.ready .card:nth-child(3){transition-delay:.10s}
.reveal-grid.ready .card:nth-child(4){transition-delay:.14s}

/* ===== Video bubbles ===== */
.cv-bg-bubbles::before,
.cv-bg-bubbles::after{
  content:""; position:absolute; inset:auto auto -120px -120px;
  width:320px; height:320px; border-radius:50%;
  background: radial-gradient(circle at 30% 30%, rgba(14,165,233,.18), rgba(14,165,233,0) 60%);
  animation: floatA 9s ease-in-out infinite;
}
.cv-bg-bubbles::after{
  inset:auto -120px -140px auto;
  background: radial-gradient(circle at 70% 40%, rgba(22,163,74,.18), rgba(22,163,74,0) 60%);
  animation: floatB 11s ease-in-out infinite;
}
@keyframes floatA{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-18px)} }
@keyframes floatB{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-24px)} }

/* ===== Video layout ===== */
.cv-video-wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:1rem;align-items:center}
.cv-video-copy p{color:var(--muted)}
.cv-video-frame{position:relative;padding-top:56.25%;border-radius:1rem;overflow:hidden;border:1px solid var(--border);background:#000}
.cv-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.shadow-pop{box-shadow:0 18px 40px rgba(2,6,23,.12)}
@media (max-width:900px){.cv-video-wrap{grid-template-columns:1fr}}

/* ===== Benefits grid ===== */
.cv-benefits-pro{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:.8rem}
.cv-benefit-card{
  background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1rem;
  box-shadow:0 10px 24px rgba(2,6,23,.06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cv-benefit-card:hover{ transform: translateY(-3px); box-shadow:0 18px 36px rgba(2,6,23,.10); border-color:#dbe3ee; }
.cv-ico{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg, rgba(22,163,74,.12), rgba(14,165,233,.12)); margin-bottom:.6rem}
.cv-benefit-card h3{margin:.2rem 0}
.cv-benefit-card p{color:var(--muted)}
@media (max-width:900px){.cv-benefits-pro{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cv-benefits-pro{grid-template-columns:1fr}}

/* ===== Testimonials ===== */
.cv-testis{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.cv-testi{
  background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1rem 1.1rem;
  box-shadow:0 10px 24px rgba(2,6,23,.06);
  transform: translateY(10px) scale(.98); opacity:0; transition:.35s ease;
}
.cv-testi blockquote{margin:0 0 .6rem;font-size:1.02rem;line-height:1.5}
.cv-testi figcaption{color:var(--muted);font-size:.92rem}
.reveal-zoom.revealed{transform:none;opacity:1}
@media (max-width:900px){.cv-testis{grid-template-columns:1fr}}

/* ===== FAQ (details/summary) ===== */
.cv-faq{display:grid;gap:.6rem;margin-top:.6rem}
.cv-faq-item{
  background:#fff;border:1px solid var(--border);border-radius:1rem;overflow:hidden;
  box-shadow:0 10px 24px rgba(2,6,23,.06); transition:border-color .2s ease, box-shadow .2s ease;
}
.cv-faq-item[open]{border-color:#dbe3ee; box-shadow:0 16px 30px rgba(2,6,23,.08);}
.cv-faq-item summary{
  list-style:none; cursor:pointer; padding:1rem 1.1rem; display:flex; align-items:center; gap:.6rem;
}
.cv-faq-item summary::-webkit-details-marker{display:none}
.cv-faq-a{padding:0 1.1rem 1rem; color:var(--muted); animation:faqOpen .22s ease}
.q-ico{font-size:1.1rem}
@keyframes faqOpen{ from{opacity:.4;transform:translateY(-4px)} to{opacity:1;transform:none} }

/* ===== Reveal helpers ===== */
.reveal{opacity:0; transform: translateY(14px); transition: .5s ease}
.reveal.revealed{opacity:1; transform:none}

/* ==== Featured Products Pro (no categories) ==== */
.cv-sec-products{
  background:
    radial-gradient(900px 500px at -10% 10%, rgba(14,165,233,.08), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

.cv-pro-grid{
  display:grid; gap:1rem;
  grid-template-columns:repeat(4,1fr);
}
@media (max-width:900px){ .cv-pro-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .cv-pro-grid{ grid-template-columns:1fr; } }

.cv-card{
  position:relative; overflow:hidden; border:1px solid var(--border); border-radius:1rem;
  background:#fff; box-shadow:0 10px 24px rgba(2,6,23,.06);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cv-card:hover{ transform:translateY(-4px); box-shadow:0 18px 36px rgba(2,6,23,.1); border-color:#dbe3ee; }

.cv-thumb{ aspect-ratio:4/3; background:#f1f5f9; display:grid; place-items:center; overflow:hidden }
.cv-thumb img{ width:100%; height:100%; object-fit:cover; display:block }

.cv-badges{ position:absolute; inset:10px auto auto 10px; display:flex; gap:.35rem; z-index:2 }
.cv-badge{ padding:.25rem .5rem; border-radius:999px; font-size:.78rem; font-weight:700; border:1px solid var(--border); background:#fff }
.cv-badge.sale{ background:#ecfdf5; border-color:#bbf7d0; color:#065f46 }
.cv-badge.new{ background:#eff6ff; border-color:#bfdbfe; color:#1e40af }

.cv-body{ padding:0.85rem 1rem 1rem }
.cv-title{ margin:.1rem 0 .3rem; font-weight:700; line-height:1.3 }
.cv-stars{ color:#f59e0b; font-size:.9rem; letter-spacing:.5px; }
.cv-price{ margin:.3rem 0 .6rem; font-weight:800 }
.cv-price del{ color:var(--muted); font-weight:500; margin-left:.4rem }

.cv-cta{ display:flex; gap:.5rem; flex-wrap:wrap }
.cv-cta .btn{ flex:0 0 auto }

.skel{
  height:320px; border-radius:1rem;
  background: linear-gradient(90deg, #f5f7fb 25%, #eef2f8 37%, #f5f7fb 63%);
  background-size:400% 100%; animation: shimmer 1.2s infinite;
  border:1px solid var(--border);
}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:0 0}}

/* دخول ناعم للكروت */
.cv-card{ opacity:0; transform:translateY(10px); }
.cv-card.revealed{ opacity:1; transform:none; transition:.35s ease; }

/* ==== Featured Products Pro (no categories) ==== */
.cv-sec-products{
  background:
    radial-gradient(900px 500px at -10% 10%, rgba(14,165,233,.08), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

.cv-pro-grid{display:grid;gap:1rem;grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.cv-pro-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.cv-pro-grid{grid-template-columns:1fr}}

.cv-card{
  position:relative;overflow:hidden;border:1px solid var(--border);border-radius:1rem;background:#fff;
  box-shadow:0 10px 24px rgba(2,6,23,.06);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cv-card:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(2,6,23,.1);border-color:#dbe3ee}

.cv-thumb{aspect-ratio:4/3;background:#f1f5f9;display:grid;place-items:center;overflow:hidden}
.cv-thumb img{width:100%;height:100%;object-fit:cover;display:block}

.cv-badges{position:absolute;inset:10px auto auto 10px;display:flex;gap:.35rem;z-index:2}
.cv-badge{padding:.25rem .5rem;border-radius:999px;font-size:.78rem;font-weight:700;border:1px solid var(--border);background:#fff}
.cv-badge.sale{background:#ecfdf5;border-color:#bbf7d0;color:#065f46}
.cv-badge.new{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}

.cv-body{padding:.85rem 1rem 1rem}
.cv-title{margin:.1rem 0 .3rem;font-weight:700;line-height:1.3}
.cv-stars{color:#f59e0b;font-size:.9rem;letter-spacing:.5px}
.cv-price{margin:.3rem 0 .6rem;font-weight:800}
.cv-price del{color:var(--muted);font-weight:500;margin-left:.4rem}
.cv-cta{display:flex;gap:.5rem;flex-wrap:wrap}

.cv-card{opacity:0;transform:translateY(10px)}
.cv-card.revealed{opacity:1;transform:none;transition:.35s ease}
/* ===== Footer (Responsive, with payment logos) ===== */
.cv-footer{
  margin-top:2.2rem;
  background:
    radial-gradient(900px 500px at -10% 10%, rgba(14,165,233,.08), transparent 60%),
    radial-gradient(700px 420px at 110% -10%, rgba(22,163,74,.08), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border-top:1px solid var(--border);
  color:var(--text);
}
.cv-footer .cv-container{padding:1.6rem 1rem}

.cv-footer-grid{
  display:grid; gap:1.2rem;
  grid-template-columns:2fr 1fr 1fr 1fr;
}
@media (max-width:980px){ .cv-footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .cv-footer-grid{ grid-template-columns:1fr; } }

.cv-foot-brand .cv-brand{display:flex;align-items:center;gap:.6rem;font-weight:800;color:var(--text)}
.cv-brand-logo{height:80px;width:auto;display:block}
.cv-foot-desc{color:var(--muted);max-width:46ch;margin:.4rem 0 .8rem}

.cv-news{display:flex;gap:.4rem;flex-wrap:wrap}
.cv-news input{
  border:1px solid var(--border);border-radius:999px;padding:.6rem .9rem;min-width:260px;background:#fff
}

.cv-social{display:flex;gap:.6rem;margin-top:.8rem}
.cv-ico-soc{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:10px;border:1px solid var(--border);background:#fff;
  transition:transform .15s ease, box-shadow .15s ease;
}
.cv-ico-soc:hover{transform:translateY(-2px);box-shadow:var(--shadow)}

.cv-foot-col h4{margin:.2rem 0 .4rem}
.cv-foot-col ul{list-style:none;margin:0;padding:0;display:grid;gap:.35rem}
.cv-foot-col a{color:inherit;padding:.2rem .1rem;border-radius:.4rem}
.cv-foot-col a:hover{background:var(--surface)}

.cv-pay-row{
  display:flex;align-items:center;justify-content:space-between;gap:.8rem;
  margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--border);
  flex-wrap:wrap;
}
.cv-pay-logos{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.cv-pay svg{filter: drop-shadow(0 2px 6px rgba(2,6,23,.08));}
.cv-secure{display:flex;align-items:center;gap:.45rem;color:var(--muted);font-size:.95rem}

.cv-foot-copy{
  margin-top:1rem;color:var(--muted);text-align:center;font-size:.9rem
}

/* RTL tweaks */
:root[dir="rtl"] .cv-pay-row{flex-direction:row-reverse}
:root[dir="rtl"] .cv-foot-col ul{text-align:right}

.cv-foot-copy { display:flex; gap:.5rem; justify-content:center; flex-wrap:wrap; }
.cv-foot-copy .sep { color: var(--muted); }
.cv-foot-copy .powered a {
  font-weight:700; text-decoration:underline; text-underline-offset:2px;
}
.cv-foot-copy .powered a:hover { opacity:.85; }


/* ===== About Page Pro ===== */
.cv-about-hero{
  background:
    radial-gradient(900px 500px at -10% 10%, rgba(14,165,233,.08), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  border-bottom:1px solid var(--border);
}
.cv-about-hero-grid{
  display:grid;grid-template-columns:1.1fr .9fr;gap:1.4rem;padding:2.2rem 0;
}
.cv-about-copy h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin:.4rem 0}
.cv-about-copy p{color:var(--muted);max-width:60ch}
.cv-about-visual .cv-about-frame{
  border:1px solid var(--border);border-radius:1.1rem;overflow:hidden;background:#fff;box-shadow:var(--shadow)
}
.cv-about-visual img{display:block;width:100%;height:auto}
@media (max-width:900px){.cv-about-hero-grid{grid-template-columns:1fr}}

.cv-values{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:.8rem}
.cv-val{
  background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1rem;
  box-shadow:0 10px 24px rgba(2,6,23,.06);transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cv-val:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(2,6,23,.1);border-color:#dbe3ee}
.cv-ico{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg, rgba(22,163,74,.12), rgba(14,165,233,.12));margin-bottom:.6rem}
@media (max-width:900px){.cv-values{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cv-values{grid-template-columns:1fr}}

.cv-about-quality{
  background: linear-gradient(180deg, #ecfdf5 0%, #ffffff 100%);
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.cv-quality-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:1rem;padding:1.6rem 0}
.cv-quality-card{
  background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1rem;
  box-shadow:0 10px 24px rgba(2,6,23,.06);
}
.cv-q-badges{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.5rem}
.cv-q-sign{margin-top:.6rem;color:var(--muted);font-style:italic}
@media (max-width:900px){.cv-quality-grid{grid-template-columns:1fr}}

.cv-timeline{position:relative;margin:1rem 0 0;padding-left:1.6rem;list-style:none}
.cv-timeline::before{
  content:""; position:absolute; left:.6rem; top:0; bottom:0; width:2px; background:linear-gradient(#e2e8f0,#cbd5e1)
}
.cv-timeline li{position:relative;margin:0 0 1rem}
.cv-tl-dot{
  position:absolute; left:.2rem; top:.35rem; width:12px; height:12px; border-radius:50%;
  background:var(--brand); box-shadow:0 0 0 4px rgba(22,163,74,.15)
}
.cv-tl-card{
  background:#fff;border:1px solid var(--border);border-radius:.9rem;padding:.8rem 1rem;box-shadow:0 10px 24px rgba(2,6,23,.06)
}
.cv-tl-card h3{margin:.1rem 0}
.cv-tl-card .cv-tl-time{display:inline-block;margin-top:.3rem;color:var(--muted);font-size:.9rem}

.cv-stats .stat{opacity:0;transform:translateY(12px);transition:.4s ease}
.cv-stats .stat.revealed{opacity:1;transform:none}

.cv-team{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.cv-member{
  background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1rem;text-align:center;
  box-shadow:0 10px 24px rgba(2,6,23,.06)
}
.cv-avatar{width:72px;height:72px;border-radius:50%;margin:0 auto .6rem;background:linear-gradient(135deg,#e2e8f0,#f8fafc);border:1px solid var(--border)}
@media (max-width:900px){.cv-team{grid-template-columns:1fr}}

.cv-about-cta{
  background:
    radial-gradient(900px 500px at -10% 10%, rgba(14,165,233,.08), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f0f9ff 100%);
  border-top:1px solid var(--border);
}
.cv-about-cta-wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.6rem 0}
.cv-cta-actions{display:flex;gap:.5rem;flex-wrap:wrap}
@media (max-width:860px){.cv-about-cta-wrap{flex-direction:column;align-items:flex-start}}

/* small helpers */
.muted{color:var(--muted)}
.cv-section{padding:2.2rem 0}
.cv-container{max-width:1200px;margin:0 auto;padding:0 1rem}
.cv-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:.8rem}
.cv-head p{margin:0}

/* ========== ABOUT (Centovita Kids style) ========== */

/* announcement */
.ab-announce{
  background:#a7f3d0; color:#064e3b; border-bottom:1px solid var(--border);
}
.ab-announce .cv-container{display:flex;gap:.6rem;align-items:center;justify-content:center;padding:.5rem 1rem;font-weight:700}
.ab-flower{filter:saturate(120%)}

/* hero */
.ab-hero{
  background:
    radial-gradient(900px 500px at -10% 10%, rgba(14,165,233,.10), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #f0fdf4 100%);
  border-bottom:1px solid var(--border);
}
.ab-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:1.4rem;align-items:center;padding:1.8rem 0}
.ab-hero-copy p{color:var(--muted);max-width:60ch}
.ab-badge{background:#e0f2fe;border:1px solid #bfdbfe;color:#0369a1}
.ab-peace{color:#10b981;font-size:clamp(2.2rem,5vw,3.4rem);line-height:1}
.ab-hero-photo{
  border:1px solid var(--border); background:#fff; border-radius:1.2rem; overflow:hidden; box-shadow:0 16px 40px rgba(2,6,23,.08);
  transform:rotate(-2.2deg);
}
.ab-hero-photo img{display:block;width:100%;height:auto}
@media (max-width:900px){ .ab-hero-grid{grid-template-columns:1fr} .ab-hero-photo{transform:none} }

/* auto delivery */
.ab-auto{background:#ecfeff;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.ab-auto-wrap{display:grid;grid-template-columns:1fr 1.2fr;gap:1rem;padding:1.1rem 0;align-items:center}
.ab-auto-left h3{margin:.2rem 0}
.ab-auto-chip{display:inline-block;margin-top:.2rem;background:#10b981;color:#fff;border-radius:999px;padding:.25rem .6rem;font-weight:800}
.ab-auto-list{margin:0;padding-left:1rem;display:grid;gap:.25rem;color:var(--muted)}
@media (max-width:900px){ .ab-auto-wrap{grid-template-columns:1fr} }

/* mosaic grid */
.ab-mosaic{background:#fff}
.ab-grid{display:grid;gap:12px;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px}
.ab-card{
  background:#fff;border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:0 10px 24px rgba(2,6,23,.06);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease; opacity:0; transform:translateY(12px);
}
.ab-card.rev{opacity:1;transform:none}
.ab-card:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(2,6,23,.10);border-color:#dbe3ee}
.ab-photo img{width:100%;height:100%;object-fit:cover;display:block}
.ab-tile{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:1rem;gap:.5rem;color:#0f172a}
.ab-tile h3{margin:0 0 .2rem;font-size:1.1rem}
.ab-mint{background:#d1fae5}
.ab-sky{background:#e0f2fe}
.ab-yellow{background:#fef9c3}
.ab-rose{background:#ffe4e6}
.ab-olive{background:#d9f99d}
.ab-made{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;padding:1rem;background:#fff7ed}
.ab-made .ab-flag{width:52px;height:auto}
.ab-made .ab-product{width:110px;height:auto;border-radius:12px;border:1px solid var(--border);box-shadow:var(--shadow)}
@media (max-width:1100px){ .ab-grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width:780px){ .ab-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px} }
@media (max-width:520px){ .ab-grid{grid-template-columns:1fr;grid-auto-rows:200px} }

/* science */
.ab-science{
  background:linear-gradient(180deg, #f0f9ff 0%, #ffffff 90%);
  border-top:1px solid var(--border);border-bottom:1px solid var(--border)
}
.ab-science-grid{display:grid;grid-template-columns:1fr .9fr;gap:1rem;align-items:center;padding:1.6rem 0}
.ab-science-card{
  background:#fff;border:1px solid var(--border);border-radius:18px;padding:1.1rem;box-shadow:0 16px 36px rgba(2,6,23,.08);
  opacity:0; transform:translateY(12px);
}
.ab-science-card.rev{opacity:1;transform:none}
.ab-mini-photos{display:flex;gap:.6rem;margin-top:.6rem}
.ab-mini-photos img{width:110px;height:78px;object-fit:cover;border-radius:10px;border:1px solid var(--border)}
.ab-doctors{
  border:1px solid var(--border);border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 16px 36px rgba(2,6,23,.08);
  opacity:0; transform:translateY(12px);
}
.ab-doctors.rev{opacity:1;transform:none}
.ab-doctors img{display:block;width:100%;height:auto}
@media (max-width:900px){ .ab-science-grid{grid-template-columns:1fr} }

/* CTA */
.ab-cta{
  background:linear-gradient(180deg,#ffffff 0%,#ecfeff 100%);border-top:1px solid var(--border)
}
.ab-cta-wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.2rem 0}
@media (max-width:760px){ .ab-cta-wrap{flex-direction:column;align-items:flex-start} }


/* Ensure header stays above everything & clickable */
.cv-header { position: sticky; top:0; z-index: 1000; pointer-events: auto; }

/* Burger visible on mobile and above overlays */
.cv-burger { z-index: 1001; }

/* Mobile drawer fills viewport and sits below header */
.cv-mobile{
  position: fixed;
  top: 60px;          /* عدّلها إذا ارتفاع الهيدر مختلف */
  left: 0; right: 0; bottom: 0;
  z-index: 999;
  background: #fff;
  border-top: 1px solid var(--border);
  box-shadow: 0 12px 30px rgba(2,6,23,.18);
}

/* Prevent body scroll when menu is open */
.cv-no-scroll { overflow: hidden; }

/* Safety: any hero/overlay won't block header clicks */
.cv-hero-pro, .ab-hero, .cv-announce, .cv-bg-bubbles { position: relative; z-index: 1; }
/* اجعل الهيدر مصمت على الجوال */
@media (max-width: 860px){
  .cv-header{
    background: #ffffff !important;   /* لا شفافية */
    border-bottom: 1px solid var(--border);
    backdrop-filter: none !important;
  }
}

/* قائمة الموبايل: خلفية مصمتة وفوق كل شيء */
.cv-mobile{
  position: fixed;
  top: 60px;              /* عدّلها حسب ارتفاع الهيدر لديك */
  left: 0; right: 0; bottom: 0;
  background: #ffffff !important;     /* لا rgba ولا شفافية */
  backdrop-filter: none !important;
  z-index: 1002;                        /* أعلى من الهيدر إذا لزم */
  overflow: auto;
}

/* ستارة الخلفية (تمنع التفاعل والتمرير خلف القائمة) */
.cv-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);         /* تغميق بسيط */
  z-index: 1001;                       /* تحت القائمة وفوق المحتوى */
  opacity: 0;
  transition: opacity .18s ease;
}
.cv-backdrop.open{ opacity: 1; }

/* قفل تمرير الصفحة عند فتح القائمة */
.cv-no-scroll{ overflow: hidden; }

/* تأكد أن العناصر الأخرى لا تطغى على القائمة */
.cv-hero-pro, .ab-hero, .cv-announce, .cv-bg-bubbles { position: relative; z-index: 1; }

/* ===== Products Page ===== */
.prod-hero{
  background:
    radial-gradient(900px 500px at -10% 10%, rgba(14,165,233,.10), transparent 60%),
    linear-gradient(180deg,#fff 0%,#f7fbff 100%);
  border-bottom:1px solid var(--border);
}
.prod-hero-wrap{padding:1.4rem 0}
.breadcrumb{display:flex;gap:.4rem;align-items:center;color:var(--muted);font-size:.95rem}
.breadcrumb a{text-decoration:underline;text-underline-offset:2px}

.prod-controls{
  background:#fff;border-bottom:1px solid var(--border);
  position:sticky; top:var(--headerH,60px); z-index: 20;
}
.prod-controls-grid{
  display:grid;grid-template-columns:1fr 1.2fr;gap:1rem;align-items:center;padding:.9rem 0;
}
.pc-left{display:flex;align-items:center}
.pc-right{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;justify-content:flex-end}
.pc-search{display:flex;gap:.4rem;flex-wrap:wrap}
.pc-search input{
  border:1px solid var(--border);border-radius:999px;padding:.55rem .9rem;min-width:260px;background:#fff
}
.pc-price{display:flex;align-items:center;gap:.4rem}
.pc-price input{
  width:100px;border:1px solid var(--border);border-radius:.6rem;padding:.45rem .6rem
}
.pc-sort{display:flex;align-items:center;gap:.4rem}
.pc-sort select{border:1px solid var(--border);border-radius:.6rem;padding:.45rem .6rem;background:#fff}

@media (max-width:900px){
  .prod-controls-grid{grid-template-columns:1fr}
  .pc-right{justify-content:flex-start}
}

.prod-grid{padding:1.4rem 0}
#products-grid .cv-card{opacity:0;transform:translateY(10px)}
#products-grid .cv-card.revealed{opacity:1;transform:none;transition:.35s ease}

.pagination{
  display:flex;gap:.4rem;justify-content:center;margin:1rem 0 0;
}
.pagination .page-btn{
  border:1px solid var(--border);background:#fff;border-radius:.6rem;padding:.5rem .8rem;cursor:pointer;
}
.pagination .page-btn[aria-current="true"]{
  background:var(--brand);border-color:transparent;color:#fff;font-weight:700;
}

/* small badge for “x results” */
.results-info{
  display:flex;align-items:center;gap:.4rem;margin:.6rem 0 0;color:var(--muted);font-size:.95rem;
}


/* ===== Product Page (PDP) ===== */
.prod-bc{border-bottom:1px solid var(--border);background:linear-gradient(180deg,#fff 0%, #f7fbff 100%)}
.prod-bc .cv-container{display:flex;gap:.4rem;align-items:center;padding:.6rem 0;color:var(--muted)}
.prod-bc a{text-decoration:underline;text-underline-offset:2px}

.pdp{padding:1.2rem 0}
.pdp-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:1.2rem;align-items:start}
@media (max-width:940px){.pdp-grid{grid-template-columns:1fr}}

.pdp-gallery .pdp-main{border:1px solid var(--border);border-radius:1rem;overflow:hidden;background:#fff;box-shadow:var(--shadow)}
.pdp-main img{display:block;width:100%;height:auto}
.pdp-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem;margin-top:.6rem}
.pdp-thumbs img{border:1px solid var(--border);border-radius:.6rem;cursor:pointer;aspect-ratio:1/1;object-fit:cover;background:#f8fafc}
.pdp-thumbs img.active{outline:2px solid var(--brand)}

.pdp-info h1{margin:.2rem 0}
.pdp-rating{display:flex;align-items:center;gap:.5rem}
.pdp-rating .stars{color:#f59e0b;letter-spacing:.5px}
.pdp-price{display:flex;align-items:baseline;gap:.6rem;margin:.3rem 0 .6rem}
.pdp-price #pdp-price{font-weight:800;font-size:1.45rem}
.save-badge{background:#ecfdf5;border:1px solid #bbf7d0;color:#065f46;border-radius:999px;padding:.15rem .5rem;font-weight:700;font-size:.85rem}

.pdp-sub{display:flex;align-items:center;gap:.6rem;margin:.8rem 0 1rem}
.switch{position:relative;width:46px;height:26px;display:inline-block}
.switch input{opacity:0;width:0;height:0}
.slider{position:absolute;cursor:pointer;inset:0;background:#e2e8f0;border-radius:999px;transition:.2s}
.slider:before{content:"";position:absolute;height:20px;width:20px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;box-shadow:0 2px 8px rgba(2,6,23,.15)}
.switch input:checked + .slider{background:#16a34a}
.switch input:checked + .slider:before{transform:translateX(20px)}

.pdp-variants{display:flex;flex-wrap:wrap;gap:.4rem;margin:.3rem 0 1rem}
.pill{border:1px solid var(--border);background:#fff;border-radius:999px;padding:.45rem .7rem;cursor:pointer}
.pill.active{background:var(--brand);color:#fff;border-color:transparent}

.pdp-buy{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.qty{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:.7rem;overflow:hidden;background:#fff}
.qbtn{border:0;background:transparent;padding:.55rem .7rem;cursor:pointer}
.qty input{width:56px;border:0;text-align:center;padding:.55rem 0}

.pdp-trust{display:flex;gap:.4rem;flex-wrap:wrap;margin:.9rem 0}
.pdp-trust .tag{padding:.35rem .6rem;border:1px solid var(--border);border-radius:999px;background:#fff;font-size:.9rem}

.pdp-bullets{margin:.6rem 0 0 1rem;color:var(--muted)}

.pdp-tabs{border-top:1px solid var(--border);background:linear-gradient(180deg,#fff 0%, #f8fafc 100%);padding:1.2rem 0}
.tabs{display:flex;gap:.4rem;flex-wrap:wrap}
.tab{border:1px solid var(--border);background:#fff;border-radius:.7rem;padding:.55rem .9rem;cursor:pointer}
.tab.active{background:var(--brand);color:#fff;border-color:transparent}
.panes{margin-top:.8rem}
.pane{display:none;background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1rem;box-shadow:var(--shadow)}
.pane.show{display:block}
.check{margin:.3rem 0 0 1rem;color:var(--muted)}

.pdp-fbt{padding:1.4rem 0;border-top:1px solid var(--border)}
.pdp-reviews{padding:1.4rem 0;border-top:1px solid var(--border)}

.pdp-sticky{
  position:sticky;bottom:0;z-index: 900;
  background:rgba(255,255,255,.95);backdrop-filter:saturate(180%) blur(10px);
  border-top:1px solid var(--border); display:none;
}
.sb-wrap{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.6rem 0}
@media (max-width:860px){ .pdp-sticky{display:block} }