/* ============================================================
   My Med — luxury UI edits (v2)
   Linked from index.html AFTER style.css.

   ROLLBACK (full):
     bash backups/luxury-ui-rollback/RESTORE.sh

   ROLLBACK (CSS only — keep JS structure):
     Remove the <link href="/css/luxury-edits.css"> line in index.html
   ============================================================ */

/* ---------- typography polish ---------- */
.kicker{
  letter-spacing:.22em!important;
  font-size:.7rem!important;
}
.section-head h2{
  letter-spacing:-.02em;
  line-height:1.1;
}
.section-head p{
  max-width:42ch;
  margin-inline:auto;
  line-height:1.6;
}
.hero p.lead{
  max-width:38ch;
  line-height:1.65;
}
.pdp-info > p,
.pdp-info .pdp-desc{
  max-width:42ch;
  line-height:1.65;
  font-size:1.02rem;
}

/* ---------- micro-motion (desktop only — mobile scroll stays smooth) ---------- */
@media (prefers-reduced-motion:no-preference) and (min-width:901px){
  .section-head{
    animation:luxFadeUp .45s cubic-bezier(.22,1,.36,1) both;
  }
}
@keyframes luxFadeUp{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce),(max-width:900px){
  .section-head,.freq-section,.cert-card,.track-hero,.prod-grid .card{
    animation:none!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .hg-1,.hg-2,.hg-3{animation:none!important}
}

/* ---------- skeleton loading (maison) ---------- */
.loading{
  min-height:42vh;
  gap:1.1rem;
}
.loading-txt{
  font-size:.85rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink-soft);
  font-weight:600;
}
.spinner{
  width:36px;height:36px;
  border:2px solid var(--line);
  border-top-color:var(--gold);
  border-right-color:color-mix(in srgb,var(--wood) 50%,var(--line));
}
.skeleton-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:1.25rem;
  width:min(1180px,92vw);
  margin:1.5rem auto 2rem;
}
.skeleton-card{
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:var(--paper);
  overflow:hidden;
  min-height:280px;
}
.skeleton-card .sk-ph{
  aspect-ratio:4/3;
  background:linear-gradient(110deg,#f0e8db 20%,#faf6ee 40%,#f0e8db 60%);
  background-size:200% 100%;
  animation:skShine 1.2s linear infinite;
}
.skeleton-card .sk-body{padding:1rem}
.skeleton-card .sk-line{
  height:12px;border-radius:6px;margin-bottom:.55rem;
  background:linear-gradient(110deg,#efe6d8 20%,#f7f1e6 45%,#efe6d8 70%);
  background-size:200% 100%;
  animation:skShine 1.2s linear infinite;
}
.skeleton-card .sk-line.w60{width:60%}
.skeleton-card .sk-line.w40{width:40%}
.skeleton-card .sk-line.w80{width:80%}
@keyframes skShine{
  to{background-position:-200% 0}
}
@media (prefers-reduced-motion:reduce){
  .skeleton-card .sk-ph,.skeleton-card .sk-line{animation:none}
}

/* ---------- shop collection intro (no category photo banner) ---------- */
.shop-intro{
  margin:0 0 1.15rem;
  padding:1.15rem 1.25rem 1.2rem;
  border-radius:16px;
  border:1px solid color-mix(in srgb,var(--gold) 22%,var(--line));
  background:
    radial-gradient(500px 120px at 0% 0%,rgba(232,213,168,.28),transparent 70%),
    linear-gradient(180deg,#fffcf7,var(--paper));
}
.shop-intro .kicker{margin-bottom:.35rem;display:inline-block}
.shop-intro h1{
  margin:0 0 .35rem;
  font-size:clamp(1.45rem,3vw,1.85rem);
  letter-spacing:-.02em;
}
.shop-intro p{
  margin:0;
  color:var(--ink-soft);
  font-size:.95rem;
  line-height:1.55;
  max-width:52ch;
}

/* ---------- PDP: catalog frame + quieter hierarchy ---------- */
.pdp{
  gap:2.75rem;
  padding-top:2.4rem;
  padding-bottom:1rem;
}
.pdp-media{
  border:none;
  background:transparent;
  box-shadow:none;
  border-radius:0;
  overflow:visible;
}
.pdp-media .main{
  border-radius:20px;
  border:1px solid color-mix(in srgb,var(--gold) 28%,var(--line));
  box-shadow:
    0 1px 0 rgba(255,255,255,.7) inset,
    0 22px 50px rgba(44,30,12,.14);
  background-color:#f3ebe0;
  outline:10px solid rgba(255,252,247,.9);
  outline-offset:0;
}
.pdp-thumbs{
  padding:.85rem .15rem 0;
  gap:.6rem;
}
.pdp-thumb{
  border-radius:12px;
  border:1.5px solid var(--line);
  background:var(--paper);
}
.pdp-thumb.active{
  border-color:var(--gold);
  box-shadow:0 4px 14px rgba(184,149,74,.2);
}
.pdp-info .ref-badge{
  background:transparent;
  border:1px solid color-mix(in srgb,var(--gold) 35%,var(--line));
  color:var(--wood-dark);
  letter-spacing:.14em;
  font-size:.68rem;
  padding:.4rem .85rem;
  margin-bottom:.85rem;
}
.pdp-info h1{
  font-size:clamp(1.75rem,3.5vw,2.35rem);
  letter-spacing:-.02em;
  margin-bottom:.35rem;
  line-height:1.12;
}
.pdp-price{
  font-size:1.15rem!important;
  color:var(--wood-dark)!important;
  font-weight:600!important;
  margin:.2rem 0 1rem!important;
  letter-spacing:.04em;
  opacity:.92;
}
.pdp-info .spec{
  gap:.45rem;
  margin:.85rem 0 1rem;
}
.pdp-info .spec .chip{
  background:rgba(255,252,247,.7);
  border-color:color-mix(in srgb,var(--gold) 15%,var(--line));
  font-size:.8rem;
  padding:.42rem .7rem;
}
.pdp-share-row{
  margin:.35rem 0 1.1rem!important;
  gap:.4rem!important;
  opacity:.85;
}
.pdp-share-row .btn{
  padding:.4rem .75rem!important;
  font-size:.78rem!important;
  font-weight:500;
  letter-spacing:.03em;
  border-color:var(--line)!important;
  color:var(--ink-soft)!important;
  background:transparent!important;
}
.pdp-share-row .btn:hover{
  border-color:var(--tan)!important;
  color:var(--wood-dark)!important;
  background:var(--cream-2)!important;
}
.pdp-actions{
  gap:.65rem;
  margin-top:.55rem;
  align-items:stretch;
}
.pdp-actions #addBtn{
  /* primary */
  min-width:9.5rem;
}
.pdp-actions #devisBtn{
  /* secondary */
  order:0;
}
.pdp-info .note{
  margin-top:1.35rem;
  background:linear-gradient(180deg,#f7f5ec,#f3f0e4);
  border-color:#e2e0cf;
  font-size:.84rem;
  line-height:1.5;
}

/* ---------- cart drawer: sélection partenaire ---------- */
.drawer{
  background:linear-gradient(180deg,#fbf7ef 0%,var(--cream) 40%);
  box-shadow:-18px 0 48px rgba(30,22,12,.2);
}
.drawer-head{
  background:linear-gradient(180deg,#fffcf7,var(--cream-2));
  border-bottom:1px solid color-mix(in srgb,var(--gold) 22%,var(--line));
  padding:1.15rem 1.2rem;
}
.drawer-head h3{
  font-size:1.2rem;
  letter-spacing:-.01em;
}
.drawer-head .drawer-sub{
  display:block;
  margin-top:.2rem;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-soft);
  font-weight:600;
  font-family:var(--sans);
}
.drawer-body{padding:1rem 1.1rem}
.drawer-foot{
  background:linear-gradient(180deg,#fffcf7,var(--paper));
  border-top:1px solid color-mix(in srgb,var(--gold) 20%,var(--line));
  padding:1.15rem 1.2rem 1.35rem;
}
.ci{
  padding:.85rem 0;
  border-bottom:1px solid color-mix(in srgb,var(--gold) 12%,var(--line));
}
.ci img,.ci .ci-img img{
  border-radius:10px;
  border:1px solid var(--line);
  width:74px;height:60px;
}
.mini-qty{
  border-radius:999px;
  border-color:color-mix(in srgb,var(--gold) 25%,var(--line));
  overflow:hidden;
}
.mini-qty button{
  background:var(--champagne);
  color:var(--wood-dark);
}
.cart-moq{
  margin:.35rem 0 .85rem;
}
.cart-moq-label{
  display:flex;
  justify-content:space-between;
  font-size:.78rem;
  color:var(--ink-soft);
  margin-bottom:.35rem;
  font-weight:600;
}
.cart-moq-track{
  height:6px;
  border-radius:999px;
  background:var(--cream-2);
  border:1px solid var(--line);
  overflow:hidden;
}
.cart-moq-fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,var(--olive),var(--gold));
  transition:width .3s var(--ease-lux);
}
.cart-moq-fill.is-low{
  background:linear-gradient(90deg,var(--warn),var(--tan));
}
.cart-moq-fill.is-ok{
  background:linear-gradient(90deg,var(--olive),var(--olive-dark));
}
.drawer-foot .btn-primary{
  letter-spacing:.06em;
}
.drawer .empty{
  padding:2.5rem 1rem;
}
.drawer .empty p{
  font-family:var(--serif);
  font-size:1.15rem;
  color:var(--wood-dark);
  margin:.5rem 0 1rem;
}

/* ---------- footer colophon ---------- */
.site-footer .foot-colophon{
  margin:.55rem 0 0;
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(232,213,168,.75);
  font-weight:600;
}
.site-footer h4{
  margin-bottom:.45rem;
}
.site-footer .foot-grid > div:first-child p[data-i18n="foot_tagline"],
.site-footer .foot-grid > div:first-child p:first-of-type{
  max-width:34ch;
  line-height:1.55;
}

/* ---------- certificate: parchment / seal ---------- */
.cert-card{
  max-width:680px!important;
  padding:2.4rem 1.8rem 2rem!important;
  background:
    radial-gradient(120% 80% at 50% 0%,rgba(232,213,168,.35),transparent 55%),
    linear-gradient(180deg,#fffcf7 0%,#f6efe3 100%)!important;
  border:1px solid color-mix(in srgb,var(--gold) 40%,var(--line))!important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.75) inset,
    0 18px 48px rgba(44,30,12,.1)!important;
  position:relative;
}
.cert-card::before{
  content:"";
  position:absolute;inset:10px;
  border:1px solid color-mix(in srgb,var(--gold) 30%,transparent);
  border-radius:calc(var(--radius) - 4px);
  pointer-events:none;
}
.cert-seal{
  width:64px;height:64px;
  margin:0 auto .75rem;
  display:grid;place-items:center;
  border-radius:50%;
  font-size:1.7rem!important;
  background:linear-gradient(145deg,var(--champagne),#e8d5a8);
  border:1px solid color-mix(in srgb,var(--gold) 45%,var(--line));
  box-shadow:0 8px 20px rgba(184,149,74,.2);
}
.cert-company{
  letter-spacing:.04em;
  font-size:1.05rem;
}
.cert-body{
  text-align:center!important;
  max-width:48ch!important;
  margin-inline:auto!important;
}

/* ---------- track page: calmer timeline ---------- */
.track-hero h1{
  letter-spacing:-.02em;
}
.track-hero-lead{
  max-width:40ch;
}
.track-form-card{
  border:1px solid color-mix(in srgb,var(--gold) 20%,var(--line));
  box-shadow:var(--shadow-sm);
}
.track-result-card{
  border:1px solid color-mix(in srgb,var(--gold) 18%,var(--line));
  border-radius:18px;
  background:linear-gradient(180deg,#fffcf7,var(--paper));
  box-shadow:var(--shadow-sm);
  padding:1.25rem 1.2rem 1.4rem;
}
.track-progress--v2{
  padding:.35rem 0 .5rem;
}
.track-step-node{
  box-shadow:0 4px 12px rgba(84,94,56,.15);
}
.track-section-title{
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.72rem!important;
  font-family:var(--sans)!important;
  color:var(--ink-soft)!important;
  font-weight:700!important;
}

/* ---------- zone banner quieter ---------- */
.zone-banner{
  background:linear-gradient(90deg,#f7f1e4,#fbf7ef)!important;
  border-color:color-mix(in srgb,var(--gold) 25%,var(--line))!important;
  font-weight:500!important;
  letter-spacing:.02em;
}

/* WhatsApp FAB + panel — match maison wood/gold theme */
.wa-float,#waFloat.wa-float,button.wa-float{
  background:linear-gradient(145deg,var(--wood-soft),var(--wood-dark))!important;
  color:#f7efe0!important;
  border:1px solid color-mix(in srgb,var(--gold) 45%,transparent)!important;
  box-shadow:0 8px 24px rgba(92,66,36,.32),0 0 0 1px rgba(255,255,255,.08) inset!important;
}
.wa-float:hover,#waFloat.wa-float:hover{
  background:linear-gradient(145deg,var(--wood),var(--wood-dark))!important;
  box-shadow:0 12px 28px rgba(92,66,36,.4),0 0 0 1px rgba(232,213,168,.2)!important;
}
.wa-panel-head{
  background:linear-gradient(145deg,var(--wood-soft),var(--wood-dark))!important;
  color:#f7efe0!important;
}
.wa-start-btn{
  background:linear-gradient(145deg,var(--wood-soft),var(--wood-dark))!important;
  border-color:transparent!important;
  color:#f7efe0!important;
}

/* ============================================================
   Mobile performance — home scroll smoothness
   ============================================================ */
@media (max-width:900px){
  /* Hero floating product images — fuller, quicker float */
  .hg-1{animation:floaty 5.5s ease-in-out infinite!important}
  .hg-2{animation:floaty 6.5s ease-in-out infinite .35s!important}
  .hg-3{animation:floaty 6s ease-in-out infinite .7s!important}
  .hg-badge{display:flex!important;z-index:5}

  /* Drop noise texture + big blurred blobs only (not the gallery motion) */
  .hero::before{display:none!important}
  .hero .blob{display:none!important}
  .hero{
    background:linear-gradient(168deg,#fbf6ec 0%,#f3ead9 100%)!important;
  }

  /* Sticky header blur is expensive while scrolling */
  .site-header{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    background:rgba(248,243,234,.97)!important;
  }

  /* Instant reveals — no transform transitions on every section */
  .reveal{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }

  /* Lighter lux band (less paint) */
  .lux-band::before{display:none!important}
  .lux-pillar{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .cat-card,.cat-card .cat-img,.card,.card .ph img{
    transition:none!important;
  }
  .cat-card:hover,.card:hover{
    transform:none!important;
  }
  .cat-card:hover .cat-img,.card:hover .ph img{
    transform:none!important;
  }

  /* Skip off-screen work */
  .cat-section,.how-order,.values-band,.lux-band,.cert-strip{
    content-visibility:auto;
    contain-intrinsic-size:auto 480px;
  }
  .prod-grid .card,.cat-card{
    content-visibility:auto;
    contain-intrinsic-size:auto 320px;
  }
}