/* ==========================================================
   Maya's Secret Premium Shop Styles
   File: css/shop-premium.css
   ========================================================== */

:root{
  --wine:#5b173e;
  --wine-dark:#3c0e29;
  --gold:#c39a56;
  --cream:#f7f2eb;
  --paper:#fffdf9;
  --ink:#20171b;
  --muted:#6b6166;
  --line:#e6ddd4;
  --radius:16px;
  --shadow:0 18px 40px rgba(0,0,0,.08);
}

body[data-page="shop"]{
  background:var(--paper);
  color:var(--ink);
}

.section-heading{
  text-align:center;
  margin-bottom:3rem;
}

.section-heading h2{
  font:600 clamp(2rem,4vw,3.2rem) "Lora",serif;
  margin:.5rem 0;
}

.premium-product-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  gap:24px;
}

.product-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  transition:.25s ease;
  box-shadow:0 2px 10px rgba(0,0,0,.03);
}

.product-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow);
}

.product-image{
    width:100%;
    aspect-ratio:4/5;
    object-fit:cover;
    display:block;
    background:var(--cream);
    transition:transform .35s ease;
}


.product-card:hover .product-image{

    transform:scale(1.05);

}

.product-content{
  padding:1rem;
}

.product-category{
  color:var(--wine);
  text-transform:uppercase;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.08em;
}

.product-name{
 font:600 1.35rem "Cormorant Garamond",serif;
  margin:.4rem 0;
}

.product-price{
  font-size:1.1rem;
  font-weight:700;
  color:var(--wine-dark);
}

.product-actions{
  display:flex;
  gap:.75rem;
  margin-top:1rem;
}

.btn-primary{
  flex:1;
  min-height:48px;
  border:none;
  cursor:pointer;
  border-radius:10px;
  background:var(--wine);
  color:#fff;
  font-weight:700;
  transition:.2s;
}

.btn-premium:hover{
  background:var(--wine-dark);
}

.btn-outline{
  background:#fff;
  color:var(--wine);
  border:1px solid var(--wine);
}

.shop-toolbar{
  display:flex;
  gap:1rem;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  margin-bottom:2rem;
}

.shop-toolbar input,
.shop-toolbar select{
  min-height:48px;
  padding:.75rem 1rem;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
}

.trust-banner{
  margin-top:4rem;
  padding:3rem 0;
  background:var(--cream);
}

.trust-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1.5rem;
  text-align:center;
}

.trust-grid strong{
  display:block;
  color:var(--wine);
  font-size:1.4rem;
}

.shop-faq{
  padding:5rem 0;
}

.faq-list details{
  border-bottom:1px solid var(--line);
  padding:1rem 0;
}

.faq-list summary{
  cursor:pointer;
  font-weight:700;
}

.shop-footer{
  background:var(--ink);
  color:#fff;
  padding:4rem 0 2rem;
}

.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:2rem;
}

.footer-grid ul{
  list-style:none;
  padding:0;
}

.footer-grid li{
  margin:.6rem 0;
}

.footer-bottom{
  text-align:center;
  margin-top:2rem;
  opacity:.75;
}

@media (max-width:900px){
  .trust-grid,
  .footer-grid{
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width:640px){
 .premium-product-grid{
    grid-template-columns:1fr 1fr;
    gap:16px;
}

  .shop-toolbar{
    flex-direction:column;
    align-items:stretch;
  }

  .trust-grid,
  .footer-grid{
    grid-template-columns:1fr;
  }

  .product-title{
    font-size:1.1rem;
  }
}
.shop-hero{
    background:#f7f2eb;
    padding:90px 0;
}

.shop-hero h1{
    font-size:3.5rem;
    color:#5b173e;
}

.shop-toolbar{
    background:white;
    padding:20px;
    border-radius:16px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

/* Maya's Secret storefront v5.1 */
.shop-hero-v2{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);min-height:680px;background:linear-gradient(135deg,#fbf7f1 0%,#f7edf1 100%)}
.shop-hero-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(64px,9vw,130px) clamp(24px,7vw,110px)}
.shop-hero-copy h1{max-width:700px;margin:.25em 0;font-family:Lora,serif;font-size:clamp(3rem,6vw,6.5rem);line-height:.96;color:#341126}
.shop-hero-copy>p:not(.eyebrow){max-width:610px;font-size:1.08rem;line-height:1.75;color:#665862}
.shop-hero-copy .actions{margin-top:28px}.shop-hero-image{min-height:560px;overflow:hidden}.shop-hero-image img{width:100%;height:100%;object-fit:cover}
.shop-trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:30px;color:#5b173e;font-size:.88rem;font-weight:600}
.shop-intro{max-width:850px;text-align:center}.shop-intro>p:last-child{max-width:650px;margin-inline:auto;color:#766b72;line-height:1.8}
.shop-controls{display:grid;grid-template-columns:minmax(240px,1.15fr) 2fr auto;gap:18px;align-items:center;margin:30px 0 40px;padding:18px;border:1px solid rgba(52,17,38,.12);border-radius:20px;background:#fff;box-shadow:0 12px 35px rgba(52,17,38,.06)}
.shop-search input,.shop-sort select{width:100%;min-height:48px;border:1px solid rgba(52,17,38,.16);border-radius:12px;background:#fbf7f1;padding:0 15px;font:inherit;color:#241d22}.shop-search input:focus,.shop-sort select:focus{outline:3px solid rgba(199,163,106,.25);border-color:#c7a36a}
.filter-row{display:flex;gap:8px;overflow:auto;padding-bottom:2px}.filter-row button{flex:none;min-height:42px;padding:0 15px;border:1px solid rgba(52,17,38,.14);border-radius:999px;background:#fff;color:#5b173e;font:inherit;font-weight:700;cursor:pointer}.filter-row button.active,.filter-row button:hover{background:#5b173e;color:#fff;border-color:#5b173e}.shop-sort{display:flex;align-items:center;gap:10px;color:#766b72;font-size:.86rem}.catalogue-note{color:#766b72;font-size:.9rem}.shop-assurance{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;padding:0;background:rgba(52,17,38,.12);border:1px solid rgba(52,17,38,.12)}.shop-assurance article{padding:42px;background:#fbf7f1}.shop-assurance b{color:#c7a36a}.shop-assurance h3{margin:18px 0 8px;color:#341126}.shop-assurance p{margin:0;color:#766b72;line-height:1.7}.no-results{text-align:center;padding:60px 20px}
@media(max-width:1000px){.shop-hero-v2{grid-template-columns:1fr;min-height:0}.shop-hero-image{min-height:430px;order:-1}.shop-controls{grid-template-columns:1fr}.shop-sort{max-width:280px}.shop-assurance{grid-template-columns:1fr}}
@media(max-width:640px){.shop-hero-image{min-height:320px}.shop-hero-copy{padding:48px 20px}.shop-hero-copy h1{font-size:clamp(2.7rem,14vw,4.4rem)}.shop-trust{display:grid}.shop-controls{margin-inline:-4px;padding:12px;border-radius:16px}.filter-row{margin-inline:-2px}.shop-assurance article{padding:30px 22px}.catalogue-note{display:none}}

/* v6.5 premium product presentation — no watermark */
body[data-page="shop"] .product-art::before,
body[data-page="shop"] .product-art:before{content:none!important;display:none!important}
body[data-page="shop"] .product-pack{font-size:0!important;background:radial-gradient(circle at 38% 20%,rgba(255,255,255,.85),rgba(255,255,255,.2) 20%,transparent 38%),linear-gradient(145deg,#6f244f,#260b1c)!important}
body[data-page="shop"] .product-pack::after{content:"Beauty Essential";font:600 10px/1.2 'DM Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#fff;text-align:center;padding:8px}
body[data-page="shop"] .product-grid{perspective:1300px;gap:clamp(12px,2vw,28px)}
body[data-page="shop"] .product-card{isolation:isolate;background:linear-gradient(155deg,rgba(255,255,255,.98),rgba(248,242,236,.88));border:1px solid rgba(91,23,62,.11);border-radius:28px;overflow:hidden;box-shadow:0 18px 45px rgba(52,17,38,.10),inset 0 1px 0 rgba(255,255,255,.85);transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,border-color .3s ease}
body[data-page="shop"] .product-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 28%,rgba(255,255,255,.36) 42%,transparent 56%);transform:translateX(-120%);transition:transform .75s ease;z-index:5}
body[data-page="shop"] .product-card:hover{transform:translateY(-6px);box-shadow:0 26px 58px rgba(52,17,38,.16);border-color:rgba(195,154,86,.38)}
body[data-page="shop"] .product-card:hover::after{transform:translateX(120%)}
body[data-page="shop"] .product-open{display:block;width:100%;padding:0;border:0;background:transparent;cursor:pointer;position:relative;overflow:hidden}
body[data-page="shop"] .product-art{aspect-ratio:1/1.08;border-radius:0 0 34px 34px;background:radial-gradient(circle at 50% 26%,#fff 0,#f7eee7 43%,#e8d8cc 100%);overflow:hidden;transform:none}
body[data-page="shop"] .product-photo img{width:100%;height:100%;object-fit:contain;padding:clamp(10px,2.3vw,28px);filter:drop-shadow(0 24px 20px rgba(50,18,36,.18));transition:transform .5s cubic-bezier(.2,.8,.2,1),filter .5s ease}
body[data-page="shop"] .product-card:hover .product-photo img{transform:scale(1.035) translateY(-2px);filter:drop-shadow(0 32px 25px rgba(50,18,36,.25))}
body[data-page="shop"] .product-badge{top:12px;left:12px;max-width:calc(100% - 24px);border:1px solid rgba(255,255,255,.68);border-radius:999px;background:rgba(255,255,255,.78);backdrop-filter:blur(12px);box-shadow:0 8px 20px rgba(52,17,38,.09)}
body[data-page="shop"] .product-view-label{position:absolute;right:12px;bottom:12px;padding:8px 11px;border-radius:999px;background:rgba(38,11,28,.82);backdrop-filter:blur(10px);color:#fff;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:0;transform:translateY(8px);transition:.3s}
body[data-page="shop"] .product-card:hover .product-view-label{opacity:1;transform:none}
body[data-page="shop"] .product-info{padding:17px 18px 12px}
body[data-page="shop"] .product-info h3{font-size:clamp(18px,2vw,27px);line-height:1.03;min-height:2.06em}
body[data-page="shop"] .add-btn{margin:0 14px 14px;width:calc(100% - 28px);border:0;border-radius:16px;padding:14px;background:linear-gradient(135deg,#6b1d49,#3a0d29);color:#fff;box-shadow:0 12px 22px rgba(91,23,62,.19);transition:transform .25s,box-shadow .25s}
body[data-page="shop"] .add-btn:hover{transform:translateY(-2px);box-shadow:0 17px 28px rgba(91,23,62,.28)}
@media(max-width:600px){body[data-page="shop"] .product-card{border-radius:20px}body[data-page="shop"] .product-art{border-radius:0 0 24px 24px}body[data-page="shop"] .product-info{padding:12px 11px 8px}body[data-page="shop"] .product-info h3{font-size:17px}body[data-page="shop"] .product-info p{font-size:8px}body[data-page="shop"] .product-info strong{font-size:14px;margin-top:8px}body[data-page="shop"] .add-btn{margin:0 8px 9px;width:calc(100% - 16px);padding:11px 6px;border-radius:12px;font-size:9px}body[data-page="shop"] .product-badge{font-size:7px;padding:6px 8px;top:7px;left:7px}body[data-page="shop"] .product-view-label{display:none}}

/* v6.6 final interaction refinement */
@media (hover:hover) and (pointer:fine){
  body[data-page="shop"] .product-card:hover .product-open{animation:mayaProductPulse .5s ease both}
}
@keyframes mayaProductPulse{0%,100%{transform:translateY(0)}45%{transform:translateY(-2px)}70%{transform:translateY(-1px)}}
@media (prefers-reduced-motion:reduce){body[data-page="shop"] .product-card,body[data-page="shop"] .product-photo img,body[data-page="shop"] .product-card::after,body[data-page="shop"] .product-open{transition:none!important;animation:none!important;transform:none!important}}
