/* =========================================================
   PRETTIEST - landing page campagne de décembre
   Complète css/style.css. Nuit chaude + or rose du logo.
   ========================================================= */
:root {
  --night: #1a110b;          /* fond des fêtes, plus profond que le charbon */
  --rose-light: #e8b4a4;     /* reflets or rose du logo */
  --rose-mid: #c98a78;
  --rose-gold: linear-gradient(100deg, #f1c7b8 0%, #c98a78 45%, #9c5c4c 75%, #e8b4a4 100%);
}

body.page-lp { background: var(--white); }

/* ---------- Boutons ---------- */
.lp-btn { background: var(--rose-mid); color: var(--night); border-color: var(--rose-mid); font-weight: 700; }
.lp-btn::before { background: var(--white); }
.lp-btn:hover { color: var(--night); }

/* ---------- Nav ---------- */
.lp-nav__right { display: flex; align-items: center; gap: 28px; }
.lp-nav__cta { padding: 12px 22px; }
@media (max-width: 640px) {
  .lp-nav__link { display: none; }
  .lp-nav__cta { padding: 10px 16px; }
}

/* ---------- Hero ---------- */
.lp-hero {
  position: relative;
  min-height: 100vh; min-height: 100svh;
  background: var(--night);
  color: var(--white);
  overflow: hidden;
  display: flex; align-items: center;
  padding: calc(var(--nav-h) + 40px) 0 72px;
}
.lp-hero::before {
  /* halo chaud derrière les bustes */
  content: ""; position: absolute; right: -10%; top: 10%;
  width: 70vw; height: 70vw; max-width: 900px; max-height: 900px;
  background: radial-gradient(closest-side, rgba(201, 138, 120, .28), transparent 70%);
  pointer-events: none;
}
.lp-sparkles { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.lp-hero__grid {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: clamp(32px, 6vw, 96px);
  align-items: center;
}
.lp-hero__text { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.lp-eyebrow {
  font-size: var(--text-small); font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--rose-light);
}
.lp-hero__title {
  display: flex; flex-direction: column;
  font-family: var(--display); font-stretch: 125%; font-weight: 800;
  text-transform: uppercase;
  line-height: .95;
}
.lp-hero__big {
  font-size: clamp(76px, 11.5vw, 180px);
  white-space: nowrap;
  letter-spacing: 0.01em;
  line-height: .85;
  background: var(--rose-gold);
  background-size: 200% 100%;
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  animation: shimmer 6s ease-in-out infinite;
  padding-bottom: .04em;
}
@keyframes shimmer { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
.lp-hero__line { font-size: clamp(24px, 3.6vw, 50px); letter-spacing: 0.1em; }
.lp-hero__sub { max-width: 34em; font-size: var(--text-body); letter-spacing: 0.04em; color: rgba(255,255,255,.8); }
.lp-hero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }

/* ---------- Compte à rebours ---------- */
.countdown { display: flex; flex-direction: column; gap: 10px; }
.countdown__label { font-size: var(--text-caption); letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.countdown__grid { display: flex; gap: 8px; }
.countdown__cell {
  min-width: 74px;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 12px 10px 10px;
  border: 1px solid rgba(232, 180, 164, .35);
  background: rgba(255, 255, 255, .03);
}
.countdown__n {
  font-family: var(--display); font-stretch: 125%; font-weight: 800;
  font-size: clamp(26px, 3vw, 38px); line-height: 1;
  font-variant-numeric: tabular-nums;
  display: inline-block;
}
.countdown__u { font-size: var(--text-caption); letter-spacing: 0.1em; text-transform: uppercase; color: var(--rose-light); }
.countdown--small .countdown__cell { min-width: 64px; }

/* ---------- Bustes en éventail ---------- */
.lp-hero__visual { position: relative; display: flex; justify-content: center; }
.lp-fan { position: relative; width: min(100%, 460px); aspect-ratio: 4 / 5; }
.lp-fan__card {
  position: absolute; top: 50%; left: 50%;
  width: 58%; aspect-ratio: 9 / 16;
  overflow: hidden;
  background: var(--charcoal);
  box-shadow: 0 30px 60px rgba(0, 0, 0, .45);
  transform-origin: 50% 90%;
}
.lp-fan__card img { width: 100%; height: 100%; object-fit: cover; }
.lp-fan__card--1 { transform: translate(-50%, -50%) translateX(-42%) rotate(-10deg); }
.lp-fan__card--2 { transform: translate(-50%, -50%); z-index: 2; }
.lp-fan__card--3 { transform: translate(-50%, -50%) translateX(42%) rotate(10deg); }
.lp-stamp {
  position: absolute; right: -2%; top: 4%; z-index: 3;
  width: 116px; height: 116px;
  border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: var(--rose-gold); color: var(--night);
  font-family: var(--display); font-stretch: 125%; font-weight: 800; font-size: 28px; line-height: 1;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
.lp-stamp small { font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; margin-top: 6px; }

/* ---------- Marquee ---------- */
.lp-marquee { background: var(--rose-mid); color: var(--night); border-top: 0; }
.lp-marquee em { font-style: normal; }

/* ---------- Offre ---------- */
.lp-offer { padding: var(--section) 0; }
.lp-offer__intro { max-width: 40em; letter-spacing: 0.04em; }
.lp-products { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start; }
.lp-product { display: flex; flex-direction: column; border: 1px solid var(--ash); background: var(--white); }
.lp-product--featured { border-color: var(--black); }
.lp-product__media { position: relative; aspect-ratio: 3 / 4; overflow: hidden; background: var(--ash); }
.lp-product__media img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform 1.2s var(--ease-out), clip-path 1s var(--ease-io);
}
.lp-product__alt { clip-path: inset(100% 0 0 0); }
.lp-product:hover .lp-product__media img { transform: scale(1.05); }
.lp-product:hover .lp-product__alt { clip-path: inset(0 0 0 0); }
.lp-product__tag {
  position: absolute; left: 12px; top: 12px; z-index: 2;
  padding: 7px 12px;
  background: var(--rose-gold); color: var(--night);
  font-family: var(--display); font-stretch: 125%; font-weight: 800; font-size: 14px; letter-spacing: .04em;
}
.lp-product__body { display: flex; flex-direction: column; gap: 12px; padding: 20px; }
.lp-product__name {
  font-family: var(--display); font-stretch: 125%; font-weight: 800;
  font-size: clamp(20px, 2vw, 26px); letter-spacing: 0.1em; text-transform: uppercase;
}
.lp-product__meta { font-size: var(--text-caption); letter-spacing: 0.093em; text-transform: uppercase; color: #6d6560; }
.lp-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: var(--text-ui); letter-spacing: 0.05em; }
.lp-price__from { text-transform: uppercase; font-size: var(--text-caption); letter-spacing: .093em; }
.lp-price__old { color: #8c8480; }
.lp-price__new { font-family: var(--display); font-stretch: 125%; font-weight: 800; font-size: 22px; letter-spacing: 0.03em; color: var(--rose); }
.lp-lengths { display: flex; gap: 8px; }
.lp-product__cta { width: 100%; margin-top: 4px; }

/* ---------- Cadeau ---------- */
.lp-gift { background: var(--night); color: var(--white); padding: var(--section) 0; overflow: hidden; }
.lp-gift__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.lp-gift__video { max-width: 420px; width: 100%; justify-self: center; }
.lp-gift__text { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.lp-gift__accent { color: var(--rose-light); }
.lp-gift__lead { max-width: 36em; letter-spacing: 0.04em; color: rgba(255,255,255,.8); }
.lp-perks { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 10px; }
.lp-perks li { display: flex; flex-direction: column; gap: 6px; border-top: 1px solid rgba(232, 180, 164, .4); padding-top: 14px; }
.lp-perks b { font-family: var(--display); font-stretch: 125%; font-weight: 800; font-size: clamp(24px, 3vw, 36px); color: var(--rose-light); }
.lp-perks span { font-size: var(--text-caption); letter-spacing: 0.093em; text-transform: uppercase; }

/* ---------- Étapes ---------- */
.lp-steps { padding: var(--section) 0; }
.steps { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; position: relative; }
.steps::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: var(--black); transform-origin: left; transform: scaleX(var(--line, 1));
}
.steps__item { padding-top: 28px; display: flex; flex-direction: column; gap: 12px; }
.steps__num {
  font-family: var(--display); font-stretch: 125%; font-weight: 800;
  font-size: clamp(40px, 5vw, 64px); line-height: 1;
  background: var(--rose-gold); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.steps__title { font-family: var(--display); font-stretch: 125%; font-weight: 800; font-size: 18px; letter-spacing: 0.1em; text-transform: uppercase; }
.steps__item p { max-width: 28em; letter-spacing: 0.04em; }

/* ---------- Témoignage ---------- */
.lp-proof { background: var(--ash); padding: var(--section) 0; }
.lp-proof__grid { display: flex; justify-content: center; text-align: center; }
.lp-proof__text { display: flex; flex-direction: column; align-items: center; gap: 20px; max-width: 900px; }
.lp-quote {
  font-family: var(--display); font-stretch: 110%; font-weight: 600;
  font-size: clamp(24px, 3.4vw, 46px); line-height: 1.15; text-transform: uppercase; letter-spacing: 0.02em;
}
.lp-quote__by { font-size: var(--text-ui); letter-spacing: 0.067em; text-transform: uppercase; }
.lp-proof__video { max-width: 400px; width: 100%; justify-self: center; }

/* ---------- CTA final ---------- */
.lp-final { position: relative; background: var(--night); color: var(--white); padding: var(--section) 0; overflow: hidden; text-align: center; }
.lp-final__inner { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 28px; }
.lp-final__title {
  font-family: var(--display); font-stretch: 125%; font-weight: 800;
  font-size: clamp(30px, 6vw, 80px); line-height: 1; letter-spacing: 0.06em; text-transform: uppercase;
  text-wrap: balance;
}
.lp-final__title span { background: var(--rose-gold); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lp-final .countdown__grid { justify-content: center; }
.lp-final__cta { padding: 20px 48px; }
.lp-final__legal { max-width: 46em; font-size: var(--text-caption); letter-spacing: 0.093em; text-transform: uppercase; color: rgba(255,255,255,.55); }

/* ---------- Footer ---------- */
.lp-footer { background: var(--night); color: var(--white); border-top: 1px solid rgba(232, 180, 164, .2); padding: 56px 0 96px; }
.lp-footer__inner { display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center; }
.lp-footer__logo { width: 120px; height: auto; }
.lp-footer__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 32px; font-size: var(--text-ui); letter-spacing: 0.067em; text-transform: uppercase; }
.lp-footer__links a { border-bottom: 1px solid rgba(255,255,255,.3); }
.lp-footer__links a:hover { color: var(--rose-light); border-color: var(--rose-light); }
.lp-footer__legal { font-size: var(--text-caption); letter-spacing: 0.093em; text-transform: uppercase; color: rgba(255,255,255,.5); }

/* ---------- Barre mobile ---------- */
.lp-sticky {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  display: none; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  background: var(--night); color: var(--white);
  border-top: 1px solid rgba(232, 180, 164, .3);
  transform: translateY(110%);
  transition: transform .5s var(--ease-out);
}
.lp-sticky.is-visible { transform: none; }
.lp-sticky__text { font-size: var(--text-small); letter-spacing: 0.071em; text-transform: uppercase; }
.lp-sticky__text b { color: var(--rose-light); }
.lp-sticky .btn { padding: 12px 20px; }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .lp-hero__grid, .lp-gift__grid, .lp-proof__grid { grid-template-columns: 1fr; }
  .lp-hero__visual { order: -1; }
  .lp-fan { width: min(80%, 360px); }
  .lp-products { grid-template-columns: 1fr 1fr; }
  .lp-products .lp-product:last-child { grid-column: 1 / -1; max-width: 50%; justify-self: center; width: 100%; }
  .lp-proof__video { order: -1; }
}
@media (max-width: 640px) {
  .lp-hero { padding-top: calc(var(--nav-h) + 16px); }
  .lp-fan { width: 74%; }
  .lp-stamp { width: 88px; height: 88px; font-size: 21px; right: -6%; }
  .countdown__cell { min-width: 0; flex: 1; padding: 10px 4px 8px; }
  .lp-products { grid-template-columns: 1fr; }
  .lp-products .lp-product:last-child { max-width: none; }
  .lp-perks { grid-template-columns: 1fr; }
  .steps { grid-template-columns: 1fr; gap: 0; }
  .steps__item { border-top: 1px solid var(--black); padding: 24px 0; }
  .steps::before { display: none; }
  .lp-hero__ctas .btn { width: 100%; }
  .lp-sticky { display: flex; }
  .page-lp .footer { padding-bottom: 72px; }
}
@media (prefers-reduced-motion: reduce) {
  .lp-hero__big { animation: none; }
}

/* =========================================================
   TYPOGRAPHIE v2 - serif (titres) + sans douce (texte)
   Placé en fin de fichier pour l'emporter sur les règles ci-dessus.
   ========================================================= */
.lp-hero__title, .countdown__n, .lp-stamp, .lp-product__tag, .lp-product__name,
.lp-price__new, .lp-perks b, .steps__num, .steps__title, .lp-quote, .lp-final__title {
  font-family: var(--display);
  font-stretch: normal;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.005em;
  font-variant-numeric: lining-nums;
}
.lp-btn { font-weight: 600; }
.lp-hero__title { line-height: 1; }
.lp-hero__big { font-weight: 600; letter-spacing: 0.01em; font-size: clamp(72px, 12vw, 190px); line-height: .9; }
.lp-hero__line { font-size: clamp(30px, 4vw, 56px); letter-spacing: 0.005em; }
.lp-hero__sub, .lp-offer__intro, .lp-gift__lead, .steps__item p { letter-spacing: 0.005em; line-height: 1.7; }
.lp-hero__sub { font-size: 17px; }
.countdown__n { font-size: clamp(30px, 3.4vw, 44px); }
.lp-stamp { font-size: 32px; }
.lp-stamp small { font-family: var(--ui); font-size: 11px; font-weight: 600; letter-spacing: .06em; }
.lp-product__tag { font-size: 18px; letter-spacing: 0.01em; }
.lp-product__name { font-size: clamp(24px, 2.4vw, 31px); line-height: 1.15; }
.lp-price { font-size: 15px; letter-spacing: 0.01em; font-family: var(--ui); }
.lp-price__new { font-size: 28px; letter-spacing: 0; }
.lp-price__old { color: #7a726d; }
.lp-perks b { font-size: clamp(30px, 3.6vw, 44px); }
.steps__num { font-size: clamp(48px, 5.6vw, 72px); }
.steps__title { font-size: 24px; }
.lp-quote { font-weight: 500; font-size: clamp(28px, 3.8vw, 52px); line-height: 1.15; }
.lp-final__title { font-size: clamp(36px, 6.4vw, 84px); line-height: 1.05; }
/* Petites phrases d'interface : casse normale, lisibles */
.lp-product__meta, .lp-perks span, .lp-final__legal, .lp-footer__links, .lp-footer__legal,
.lp-sticky__text, .lp-quote__by {
  text-transform: none; letter-spacing: 0.01em;
}
.lp-product__meta, .lp-perks span, .lp-final__legal, .lp-footer__legal { font-size: 13px; }
.lp-footer__links, .lp-quote__by, .lp-sticky__text { font-size: 14.5px; }
.lp-final__legal, .lp-footer__legal { color: rgba(255,255,255,.7); }
/* Étiquettes : petites capitales espacées */
.lp-eyebrow, .countdown__label, .countdown__u, .lp-price__from {
  font-family: var(--ui); font-weight: 500; letter-spacing: 0.1em; font-size: var(--text-caption);
}
.countdown__label { color: rgba(255,255,255,.75); }

/* Prix avant le début de l'offre, offre vide, perruque épuisée */
.lp-price__soon { display: block; margin-top: 4px; font-size: 12px; color: var(--rose); letter-spacing: .02em; }
.lp-offer__empty { padding: 40px 0; text-align: center; color: #6d6560; }
.lp-product.is-out .lp-product__cta { opacity: .45; cursor: not-allowed; }
.lp-product__media.is-soldout { position: relative; }

/* Ordinateur : page Offres plus compacte (le téléphone ne change pas) */
@media (min-width: 961px) {
  .lp-hero__big { font-size: clamp(64px, 8vw, 132px); }
  .lp-hero__line { font-size: clamp(26px, 2.8vw, 40px); }
  .countdown__n { font-size: clamp(26px, 2.6vw, 36px); }
  .lp-product__name { font-size: clamp(22px, 1.9vw, 27px); }
  .lp-perks b { font-size: clamp(26px, 2.6vw, 34px); }
  .steps__num { font-size: clamp(40px, 4.2vw, 56px); }
  .lp-quote { font-size: clamp(26px, 2.8vw, 40px); }
  .lp-final__title { font-size: clamp(34px, 4.6vw, 62px); }
}