/* ================================================================
   OZARINE — peau du mini-site (remplace la peau Labo).
   Le kit est piloté par variables : on redéfinit la palette, rien d'autre.
   Registre : soirée élégante — fond nuit profond, or Ozarine, crème marbre.
   ================================================================ */
body.gv-minisite{
  --ms-ink:#161310;            /* la nuit du gala, remplace l'encre Labo */
  --ms-cuir:#6E5A3E;           /* taupe doré — les accents chauds */
  --ms-cuir-clair:#A98D5F;
  --ms-or:#C9950C;             /* L'OR OZARINE — le même que la boutique */
  --ms-or-clair:#E3B84A;
  --ms-creme:#FCFAF5;          /* le crème marbre des cartes boutique */
  --ms-texte:#221E18;
  --ms-vert:#2F6B3F;
}

@media(max-width:760px){ body.gv-minisite{ padding-top:0 !important; } }

/* le bandeau de tête : la marque, sobre, or sur nuit */
.glabo-head{ background:#161310; padding:.6rem 1rem; text-align:center;
  border-bottom:1px solid rgba(201,149,12,.35); }
.glabo-brand{ color:#E3B84A; font-weight:700; letter-spacing:.26em;
  text-transform:uppercase; font-size:.85rem; text-decoration:none; }

body.gv-minisite .gv-legalbar{ padding-bottom:84px; }

/* les touches or sur les éléments que le kit peint en couleur d'accent */
body.gv-minisite .gv-ob-badge{ background:#C9950C; }
body.gv-minisite .gv-ob-more{ color:#8a6a08; }

/* le tiroir : invisible tant que fermé — sinon il élargit la page */
#gv-dr{visibility:hidden;transition:transform .28s cubic-bezier(.4,0,.2,1),visibility 0s .28s}
#gv-dr.open{visibility:visible;transition:transform .28s cubic-bezier(.4,0,.2,1)}
#gv-dr:not(.open){display:none}
/* ⚠️ NE PAS remettre overflow-x sur le body : `clip` ecrete la barre d achat
   fixe (elle disparait de l ecran), `hidden` casse le sticky de la galerie.
   Le debordement lateral est deja regle a la source (#gv-dr masque ferme). */

/* ================================================================
   OZARINE — chasse au VERT Labo : tout ce qui était teal passe or/nuit
   ================================================================ */
body.gv-minisite .gv-ms-cta,
body.gv-minisite .gv-ms-cta button,
body.gv-minisite button.single_add_to_cart_button,
body.gv-minisite .gv-ms-sticky .gv-ms-sticky-cta,
body.gv-minisite [class*=cta] a.button{
  background:linear-gradient(180deg,#E3B84A,#C9950C)!important;color:#241b06!important;
  border-color:#C9950C!important}
body.gv-minisite .gv-dr-checkout{background:linear-gradient(180deg,#E3B84A,#C9950C)!important;color:#241b06!important}
body.gv-minisite .gv-ob-check:checked + .gv-ob-slider{background:#C9950C}
body.gv-minisite .gv-ob-vbtn.is-active{border-color:#C9950C;background:#faf3df;color:#6e5205}
body.gv-minisite .gv-ob-more{color:#8a6a08}

/* ⛔ URGENCE FAUSSE : compte à rebours inventé (affichait 00:00) — interdit chez
   Ozarine. La barre haute et le bloc rareté disparaissent. */
body.gv-minisite .gv-ms-topbar{display:none!important}
body.gv-minisite .gv-ms-rarete{display:none!important}
/* le bandeau vide au-dessus du header : compensation d'un header qui n'existe plus */
body.gv-minisite{padding-top:0!important;margin-top:0!important}
body.gv-minisite #masthead,body.gv-minisite .site-header{display:none!important}

/* ================================================================
   DESKTOP (≥1000px) — le hero en DEUX COLONNES façon Corval :
   la galerie à gauche, tout ce qui décide à droite, zéro défilement.
   Les wrappers .gv-colg / .gv-cold sont posés par le JS du plugin.
   ================================================================ */
/* ================================================================
   GALERIE NARRATIVE — TOUS ECRANS (regle Florient 16/08) : chaque slide
   se montre ENTIERE et LISIBLE sans l ouvrir ; le deroule = l offre.
   ================================================================ */
body.gv-minisite .gv-ms-galerie-principale{width:100%;height:auto!important;
  overflow:visible!important}
body.gv-minisite .gv-ms-galerie-principale img{width:100%;height:auto!important;
  object-fit:contain;border-radius:12px}
body.gv-minisite .gv-ms-vignettes{display:grid;gap:10px;margin-top:10px;
  height:auto!important;max-height:none!important;overflow:visible!important}
body.gv-minisite .gv-ms-vignette{height:auto!important;overflow:visible!important}
body.gv-minisite .gv-ms-vignettes img,
body.gv-minisite .gv-ms-vignette img{width:100%;height:auto!important;object-fit:contain;border-radius:10px}
/* mobile : la principale domine, les autres slides un cran plus petites
   mais toujours lisibles — le script se deroule au fil du scroll */
@media(max-width:999px){
  body.gv-minisite .gv-ms-vignettes{grid-template-columns:1fr;justify-items:center}
  body.gv-minisite .gv-ms-vignettes a,
  body.gv-minisite .gv-ms-vignette,
  body.gv-minisite .gv-ms-vignettes > *{width:88%;margin:0 auto}
}

@media(min-width:1000px){
  /* la page quitte la colonne mobile (600px) : elle respire enfin */
  body.gv-minisite .gv-ms-page{max-width:1280px;margin:0 auto;padding:0 32px}
  /* le hero en deux colonnes, GALERIE DOMINANTE (facon Corval, regle 16/08 :
     photos grandes, pas de vide sur les cotes) */
  body.gv-minisite .gv-ms-hero{max-width:none;margin:0 0 28px;
    display:grid;grid-template-columns:1.12fr 1fr;gap:8px 64px;align-items:start}
  /* la galerie est LONGUE (grille de slides lisibles) : c est donc le BLOC D ACHAT
     qui devient collant et suit le defilement — patron Corval, plus de blanc mort.
     min-width:0 : sans lui les images imposent leur largeur a la colonne
     et les deux colonnes se chevauchent */
  body.gv-minisite .gv-colg{grid-column:1;min-width:0}
  body.gv-minisite .gv-cold{grid-column:2;position:sticky;top:14px;min-width:0}
  /* la principale montre la slide ENTIERE (bandeau de texte compris) : le kit
     mobile la figeait a 340px + overflow hidden -> photo coupee, info invisible */
  body.gv-minisite .gv-colg .gv-ms-galerie-principale{width:100%;height:auto!important;
    overflow:visible!important}
  body.gv-minisite .gv-colg .gv-ms-galerie-principale img{width:100%;height:auto!important;
    object-fit:contain;border-radius:12px}
  /* les vignettes deviennent une GRILLE exploitable (regle Corval 16/08) : assez
     grandes pour lire leur texte sans les ouvrir — le blanc mort devient utile */
  body.gv-minisite .gv-colg .gv-ms-vignettes{display:grid;grid-template-columns:1fr 1fr;
    gap:10px;margin-top:10px}
  body.gv-minisite .gv-colg .gv-ms-vignettes a,
  body.gv-minisite .gv-colg .gv-ms-vignettes > *{width:100%;margin:0}
  body.gv-minisite .gv-colg .gv-ms-vignettes img{width:100%;height:auto;border-radius:10px}
  /* les sections apres le hero : colonne de lecture confortable, centree */
  body.gv-minisite .gv-ms-page > :not(.gv-ms-hero){max-width:760px;margin-left:auto;margin-right:auto}
}

/* ================================================================
   ANTI-MODE-SOMBRE (regle maison) : Chrome/Safari mobile inversaient
   la page — fond noir, textes delaves. Le mini-site vit en clair.
   ================================================================ */
:root{color-scheme:only light}
body.gv-minisite{color-scheme:only light;background:#FCFAF5}

/* ================================================================
   CHASSE AU VERT LABO — passe 2 : les accents restes teal
   (eyebrow, reassurance, puces) passent en or/nuit Ozarine.
   ================================================================ */
body.gv-minisite .gv-ms-eyebrow,
body.gv-minisite .gv-ms-kicker,
body.gv-minisite [class*=eyebrow]{color:#A67C08!important}
body.gv-minisite .gv-ms-reassure strong,
body.gv-minisite .gv-ms-reassure b,
body.gv-minisite .gv-ms-reassure-t,
body.gv-minisite .gv-ms-reassure li > span:first-child{color:#2b2621!important}
body.gv-minisite .gv-ms-reassure svg,
body.gv-minisite .gv-ms-reassure .ico{color:#C9950C!important;fill:#C9950C!important}
body.gv-minisite .gv-ms-reassure .ico{background:rgba(201,149,12,.12)!important}
body.gv-minisite .gv-ms-badge--vert,
body.gv-minisite .gv-ms-tag{background:#C9950C!important;color:#241b06!important}

/* ================================================================
   RESPIRATION sous la galerie : la legende et le titre etaient colles
   aux photos (Florient 16/08).
   ================================================================ */
body.gv-minisite .gv-ms-galerie-legende,
body.gv-minisite .oz-galerie + *{margin-top:20px}
body.gv-minisite .gv-ms-galerie-legende{margin-bottom:18px;line-height:1.6}
@media(max-width:999px){
  body.gv-minisite .oz-galerie{margin-bottom:22px}
  body.gv-minisite .gv-ms-galerie-legende{margin:0 0 20px}
  body.gv-minisite .gv-ms-eyebrow{margin-top:6px;display:block}
  body.gv-minisite .gv-ms-titre,
  body.gv-minisite .gv-ms-hero h1{margin-top:10px}
}

/* la reassurance Ozarine (.ozarine-reassurance) : accents or, jamais vert Labo */
body.gv-minisite .ozarine-reassurance{border-color:#e6ddc9!important;background:#FCFAF5!important}
body.gv-minisite .oza-rea-item svg{color:#C9950C!important;fill:#C9950C!important}
body.gv-minisite .oza-rea-item strong{color:#2b2621!important}
body.gv-minisite .oza-rea-item span{color:#6b6459!important}
body.gv-minisite .gv-ms-deux-clics{color:#A67C08!important}
body.gv-minisite .gv-ms-cta-sous{color:#8a8378!important}

/* ================================================================
   LA BARRE D ACHAT DOIT RESTER A L ECRAN. Le thema pose sur le body
   un transform (matrice identite) + overflow-x:hidden : les deux
   piegent position:fixed, la barre partait hors ecran. On les
   neutralise UNIQUEMENT sur le mini-site.
   ================================================================ */
body.gv-minisite{transform:none!important;overflow-x:visible!important;
  animation:none!important;perspective:none!important;filter:none!important}
body.gv-minisite .gv-ms-deux-clics,
body.gv-minisite .gv-ms-deux-clics *{color:#A67C08!important}