/* ============================================================
   DKNY SELECTION — Fashion campaign · hero slider 2 sacs
   ============================================================ */
:root{
  --noir:#171717;
  --creme:#f4eee5;
  --creme-2:#efe7db;
  --beige:#d8cabb;
  --taupe:#b8aa98;
  --brun:#5a4632;
  --brun-2:#3a2c20;
  --texte:#241f1a;
  --texte-doux:#857a6c;
  --or:#c2a878;

  /* Pricing premium */
  --prix-final:#8A6A2F;   /* champagne — prix final 950 MAD */
  --prix-barre:#9B9288;   /* prix barré 1500 MAD */
  --badge-bg:#3B281D;     /* fond badge */
  --badge-text:#F7E7B5;   /* texte badge champagne clair */
  --cta-bg:#151515;       /* CTA fond */
  --cta-hover:#2B211B;    /* CTA hover */

  --serif:'Cormorant Garamond', Georgia, serif;
  --sans:'Inter', system-ui, sans-serif;
  --max:1280px;
  --gut:clamp(20px,5vw,60px);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:hidden; }
body{ font-family:var(--sans); color:var(--texte); background:var(--creme); font-weight:300; line-height:1.6; overflow-x:hidden; }
img{ display:block; width:100%; height:auto; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
h1,h2,h3{ font-family:var(--serif); font-weight:500; line-height:1.04; color:var(--noir); }

.eyebrow{ font-family:var(--sans); font-size:10.5px; font-weight:600; letter-spacing:.3em; text-transform:uppercase; color:var(--texte-doux); }

.sec-head{ text-align:center; max-width:640px; margin:0 auto clamp(34px,5vw,58px); }
.sec-head .eyebrow{ display:block; margin-bottom:14px; }
.sec-head h2{ font-size:clamp(30px,4vw,52px); }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; font-size:11px; font-weight:500; letter-spacing:.2em; text-transform:uppercase; background:var(--cta-bg); color:#fff; padding:16px 32px; border-radius:40px; transition:.4s var(--ease); }
.btn:hover{ background:var(--cta-hover); transform:translateY(-2px); box-shadow:0 14px 30px rgba(0,0,0,.2); }
.btn--ghost{ background:transparent; color:var(--noir); border:1px solid rgba(36,31,26,.4); }
.btn--ghost:hover{ background:var(--noir); color:var(--creme); border-color:var(--noir); }
.btn--ghost-light{ background:transparent; color:var(--creme); border:1px solid rgba(244,238,229,.5); }
.btn--ghost-light:hover{ background:var(--creme); color:var(--noir); }

/* ============================================================
   HEADER (pill nav)
   ============================================================ */
.header{ position:sticky; top:0; z-index:100; background:rgba(244,238,229,.82); backdrop-filter:saturate(140%) blur(12px); border-bottom:1px solid rgba(36,31,26,.06); }
.header__inner{ max-width:var(--max); margin-inline:auto; height:70px; padding-inline:var(--gut); display:flex; align-items:center; justify-content:space-between; gap:16px; }
.brand{ font-family:var(--serif); font-size:24px; font-weight:600; letter-spacing:.12em; color:var(--noir); white-space:nowrap; }
.brand span{ font-family:var(--sans); font-size:10px; font-weight:500; letter-spacing:.32em; text-transform:uppercase; color:var(--texte-doux); }
.brand-logo{ display:inline-flex; align-items:center; text-decoration:none; background:transparent !important; border:0 !important; box-shadow:none !important; padding:0 !important; }
.brand-logo img{ display:block; width:clamp(140px,14vw,210px); height:auto; max-height:48px; object-fit:contain; background:transparent !important; }
.pillnav{ display:flex; gap:6px; background:rgba(36,31,26,.06); border-radius:40px; padding:6px; }
.pillnav a{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; padding:9px 18px; border-radius:30px; transition:.3s; }
.pillnav a:hover{ background:var(--creme); }
.header__actions{ display:flex; gap:8px; }
.hbtn{ width:38px; height:38px; border-radius:50%; border:1px solid rgba(36,31,26,.16); display:flex; align-items:center; justify-content:center; font-size:15px; transition:.3s; }
.hbtn:hover{ background:var(--noir); color:var(--creme); border-color:var(--noir); }

.burger{ display:none; width:24px; height:15px; position:relative; }
.burger span{ position:absolute; left:0; width:100%; height:1.5px; background:var(--noir); transition:.32s var(--ease); }
.burger span:nth-child(1){ top:0; } .burger span:nth-child(2){ top:50%; transform:translateY(-50%); } .burger span:nth-child(3){ bottom:0; }
.burger.open span:nth-child(1){ top:50%; transform:translateY(-50%) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ bottom:50%; transform:translateY(50%) rotate(-45deg); }
.nav-mobile{ display:none; background:var(--creme); border-top:1px solid rgba(36,31,26,.08); overflow:hidden; max-height:0; opacity:0; transition:max-height .45s var(--ease), opacity .35s ease; }
.nav-mobile.open{ max-height:360px; opacity:1; }
.nav-mobile a{ display:block; padding:16px var(--gut); font-size:12px; letter-spacing:.2em; text-transform:uppercase; border-bottom:1px solid rgba(36,31,26,.06); }
.nav-mobile a:last-child{ border-bottom:none; }

/* ============================================================
   HERO SLIDER
   ============================================================ */
.hero{ position:relative; height:96vh; min-height:640px; max-height:1040px; overflow:hidden;
  background:
    radial-gradient(circle at 72% 48%, rgba(190,154,104,.18), transparent 34%),
    linear-gradient(90deg, var(--creme) 0%, #f1e8da 38%, #e2d2ba 100%); }
.slide{ position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .8s var(--ease); }
.slide.is-active{ opacity:1; visibility:visible; }
.slide[data-slide="0"]{ background:#ccbfad; }
.slide[data-slide="1"]{ background:#ddd2c3; }
/* Image hero full-bleed : remplit toute la section */
.slide__img{ position:absolute; inset:0; display:block; overflow:hidden; }
/* échelle légèrement réduite + léger décalage à droite (le fond beige du slide comble) */
.slide__img img{ width:100%; height:100%; object-fit:cover; object-position:center;
  transform:scale(1.07); transform-origin:66% center;
  filter:contrast(1.06) saturate(1.05) brightness(.985); }
/* Profondeur photographique : halo chaud derrière le sac + ancrage d'ombre douce */
.slide__img::after{ content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(44% 56% at 70% 46%, rgba(226,188,128,.30), transparent 60%),
    radial-gradient(100% 76% at 76% 124%, rgba(44,29,18,.32), transparent 56%); }
/* Voile dégradé gauche : crème opaque à gauche → transparent vers le centre */
.slide__scrim{ position:absolute; inset:0; z-index:1;
  background:linear-gradient(95deg, rgba(244,238,229,.96) 0%, rgba(244,238,229,.8) 16%, rgba(244,238,229,.4) 32%, rgba(244,238,229,.1) 44%, rgba(244,238,229,0) 52%); }

/* Contenu texte posé par-dessus l'image, à gauche */
.slide__grid{ position:absolute; inset:0; z-index:2; max-width:var(--max); margin-inline:auto; padding-inline:var(--gut);
  display:flex; align-items:center; }
.slide__left{ max-width:470px; }
.slide__left .eyebrow{ display:inline-block; margin-bottom:22px; padding-bottom:9px; color:#8a6a2f; position:relative; }
.slide__left .eyebrow::after{ content:''; position:absolute; left:0; bottom:0; width:42px; height:1px; background:var(--or); }
.slide__left h1{ font-size:clamp(36px,4.2vw,58px); line-height:1.08; letter-spacing:.004em; margin-bottom:20px; }
.slide__sub{ font-size:15px; line-height:1.72; color:#4a4239; max-width:340px; margin-bottom:28px; }
.slide__left .price{ margin-top:4px; }
.slide__cta{ display:flex; flex-wrap:wrap; gap:12px; }
.slide__trust{ margin-top:18px; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:#8A7A68; }

/* Prix */
.price{ display:flex; align-items:baseline; flex-wrap:wrap; gap:10px 14px; margin-bottom:26px; }
.price__old{ font-size:15px; color:var(--prix-barre); opacity:.85; text-decoration:line-through; text-decoration-thickness:1.5px; }
.price__now{ font-family:var(--serif); font-weight:700; font-size:clamp(33px,3.4vw,44px); line-height:1; color:var(--prix-final); }
.price__label{ font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--badge-text); background:var(--badge-bg); padding:6px 11px; border-radius:30px; }
.price--card{ margin-bottom:18px; gap:8px 12px; }
.price--card .price__now{ font-size:32px; }

/* Contrôles slider — discrets */
.hero__arrows{ position:absolute; left:var(--gut); bottom:28px; z-index:6; display:flex; gap:8px; }
.arrow{ width:34px; height:34px; border-radius:50%; border:1px solid rgba(36,31,26,.16); background:rgba(244,238,229,.35); backdrop-filter:blur(4px); color:var(--noir); font-size:15px; opacity:.55; display:flex; align-items:center; justify-content:center; transition:.3s; }
.arrow:hover{ opacity:1; background:var(--noir); color:var(--creme); border-color:var(--noir); }
.hero__dots{ position:absolute; left:50%; bottom:30px; transform:translateX(-50%); z-index:6; display:flex; gap:10px; }
.dot{ width:7px; height:7px; border-radius:50%; background:rgba(36,31,26,.2); transition:.35s var(--ease); }
.dot.is-active{ background:var(--or); transform:scale(1.35); box-shadow:0 0 0 4px rgba(194,168,120,.18); }

/* Entrée très légère du contenu actif (campagne) */
@keyframes heroRise{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
.slide.is-active .slide__left>*{ animation:heroRise .7s var(--ease) both; }
.slide.is-active .slide__left>*:nth-child(2){ animation-delay:.06s; }
.slide.is-active .slide__left>*:nth-child(3){ animation-delay:.12s; }
.slide.is-active .slide__left>*:nth-child(4){ animation-delay:.18s; }
.slide.is-active .slide__left>*:nth-child(5){ animation-delay:.24s; }
.slide.is-active .slide__left>*:nth-child(6){ animation-delay:.30s; }
@media (prefers-reduced-motion:reduce){ .slide.is-active .slide__left>*{ animation:none; } }

/* ============================================================
   TRUST BAND
   ============================================================ */
.infoband{ background:var(--noir); color:#d8d0c4; }
.infoband__inner{ max-width:var(--max); margin-inline:auto; padding:16px var(--gut); display:flex; flex-wrap:wrap; justify-content:center; gap:0; font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; }
.infoband__inner span{ padding:0 clamp(14px,3vw,40px); position:relative; }
.infoband__inner span+span::before{ content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:13px; background:rgba(255,255,255,.18); }

/* ============================================================
   RÉSERVATION DIRECTE (callbox)
   ============================================================ */
.callbox{ padding:clamp(48px,7vw,86px) var(--gut); text-align:center; background:var(--creme-2); }
.callbox__inner{ max-width:600px; margin-inline:auto; }
.callbox .eyebrow{ display:block; margin-bottom:14px; }
.callbox h2{ font-size:clamp(28px,3.4vw,44px); margin-bottom:14px; }
.callbox p{ font-size:15px; color:var(--texte-doux); margin-bottom:26px; }
.callbox__cta{ display:flex; flex-wrap:wrap; justify-content:center; gap:13px; }
.callbox__note{ margin-top:16px; font-size:12px; color:var(--texte-doux); min-height:1px; }
.btn--wa{ background:#1f7a4d; }
.btn--wa:hover{ background:#1a6b43; }

/* ============================================================
   BUSINESS URGENCY — drop
   ============================================================ */
.drop{ background:var(--brun-2); color:var(--creme); padding:clamp(60px,8vw,120px) var(--gut); text-align:center; position:relative; overflow:hidden; }
.drop::before{ content:''; position:absolute; inset:0; background:radial-gradient(circle at 50% 0%, rgba(201,180,143,.16), transparent 62%); }
.drop__inner{ position:relative; max-width:600px; margin-inline:auto; }
.drop .eyebrow{ color:var(--or); display:block; margin-bottom:16px; }
.drop h2{ color:#fff; font-size:clamp(34px,4.6vw,60px); margin-bottom:16px; }
.drop p{ color:rgba(247,242,233,.94); font-size:16.5px; line-height:1.72; margin-bottom:30px; }
.drop p b{ color:#fff; font-weight:600; }
.drop p s{ color:rgba(244,238,229,.55); }
.drop__note{ font-size:12px !important; letter-spacing:.1em; text-transform:uppercase; color:rgba(247,231,181,.72) !important; margin:-14px 0 28px !important; }
.drop__cta{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px; }
.drop .btn:not(.btn--ghost-light){ background:var(--creme); color:var(--noir); }
.drop .btn:not(.btn--ghost-light):hover{ background:#fff; }

/* Réassurance modal */
.modal__reassure{ margin-top:14px; font-size:12px; color:var(--texte-doux); text-align:center; line-height:1.5; }

/* ============================================================
   MODÈLES DISPONIBLES
   ============================================================ */
.models{ padding:clamp(56px,8vw,110px) 0; }
.models__grid{ max-width:1080px; margin-inline:auto; padding-inline:var(--gut); display:grid; grid-template-columns:1fr 1fr; gap:clamp(22px,3vw,42px); }
.pcard{ background:var(--creme-2); border-radius:6px; overflow:hidden; display:flex; flex-direction:column; transition:.5s var(--ease); }
.pcard:hover{ transform:translateY(-5px); box-shadow:0 24px 50px rgba(36,31,26,.12); }
.pcard__media{ position:relative; aspect-ratio:1/1; overflow:hidden; background:#e7ded1; }
/* contain : sac entièrement visible, jamais coupé */
.pcard__media img{ height:100%; object-fit:contain; transition:transform .7s var(--ease); }
.pcard:hover .pcard__media img{ transform:scale(1.03); }
.pcard__tag{ position:absolute; top:14px; left:14px; font-size:10px; letter-spacing:.14em; text-transform:uppercase; background:#2f5d3a; color:#fff; padding:6px 12px; border-radius:30px; }
.pcard__body{ padding:26px clamp(20px,3vw,32px) 30px; }
.pcard__body h3{ font-size:26px; margin-bottom:8px; }
.pcard__desc{ font-size:14px; color:var(--texte-doux); margin-bottom:16px; }
.pcard__bullets{ list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:8px 18px; margin-bottom:24px; }
.pcard__bullets li{ position:relative; padding-left:16px; font-size:12.5px; color:var(--texte); }
.pcard__bullets li::before{ content:''; position:absolute; left:0; top:8px; width:5px; height:5px; border-radius:50%; background:var(--or); }
.pcard__btn{ width:100%; }
.pcard__auth{ display:inline-flex; align-items:center; gap:7px; margin:-8px 0 16px; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:#8A7A68; }
.pcard__auth::before{ content:''; width:14px; height:1px; background:var(--prix-final); opacity:.7; }

/* ============================================================
   CONFIANCE / AUTHENTICITÉ
   ============================================================ */
.trust{ padding:clamp(50px,7vw,92px) 0; background:var(--creme); }
.sec-sub{ margin-top:12px; font-size:14px; color:var(--texte-doux); }
.trust__grid{ max-width:var(--max); margin-inline:auto; padding-inline:var(--gut); display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid rgba(36,31,26,.1); }
.trust__item{ padding:clamp(26px,3vw,40px) clamp(20px,2.6vw,40px); border-left:1px solid rgba(36,31,26,.1); }
.trust__item:first-child{ border-left:none; }
.trust__k{ display:block; font-family:var(--serif); font-size:15px; font-weight:600; color:var(--prix-final); letter-spacing:.1em; margin-bottom:16px; }
.trust__item h3{ font-size:clamp(19px,2vw,23px); margin-bottom:10px; }
.trust__item p{ font-size:13.5px; line-height:1.6; color:var(--texte-doux); max-width:30ch; }

/* ============================================================
   GALLERY
   ============================================================ */
.gallery{ padding:clamp(50px,7vw,96px) 0; background:var(--creme-2); }
.gallery--alt{ background:var(--creme); }
.gallery__grid{ max-width:var(--max); margin-inline:auto; padding-inline:var(--gut); display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:1fr; gap:14px; }
.g-item{ position:relative; overflow:hidden; border-radius:3px; background:var(--beige); cursor:zoom-in; aspect-ratio:1/1; }
.g-item img{ height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.g-item:hover img{ transform:scale(1.05); }
.g-main{ grid-column:span 2; grid-row:span 2; aspect-ratio:auto; }
.gallery--alt .gallery__grid{ grid-template-columns:repeat(4,1fr); }
.gallery--alt .g-main{ grid-column:span 2; grid-row:span 2; }
.gallery__hint{ display:none; }

/* ============================================================
   DÉTAILS — accordéons
   ============================================================ */
.specs{ padding:clamp(56px,8vw,110px) 0; }
.acc{ max-width:820px; margin-inline:auto; padding-inline:var(--gut); }
.acc__item{ border-bottom:1px solid rgba(36,31,26,.14); }
.acc__head{ width:100%; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:22px 2px; font-family:var(--serif); font-size:23px; color:var(--noir); text-align:left; }
.acc__ic{ font-family:var(--sans); font-size:22px; font-weight:300; color:var(--texte-doux); transition:transform .35s; }
.acc__item.is-open .acc__ic{ transform:rotate(45deg); }
.acc__panel{ max-height:0; overflow:hidden; transition:max-height .45s var(--ease); }
.acc__item.is-open .acc__panel{ max-height:420px; }
.specs__list{ list-style:none; padding-bottom:18px; }
.specs__list li{ display:flex; justify-content:space-between; align-items:baseline; gap:18px; padding:12px 0; border-top:1px solid rgba(36,31,26,.16); }
.specs__list li span{ font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:#6f6557; }
.specs__list li b{ font-weight:500; font-size:15px; color:var(--noir); text-align:right; }

/* ============================================================
   RÉSERVATION
   ============================================================ */
.reserve{ background:var(--brun-2); color:var(--creme); padding:clamp(64px,9vw,128px) var(--gut); text-align:center; position:relative; overflow:hidden; }
.reserve::before{ content:''; position:absolute; inset:0; background:radial-gradient(circle at 50% 0%, rgba(201,180,143,.14), transparent 62%); }
.reserve__inner{ position:relative; max-width:580px; margin-inline:auto; }
.reserve .eyebrow{ color:var(--or); display:block; margin-bottom:18px; }
.reserve h2{ color:#fff; font-size:clamp(34px,4.6vw,60px); margin-bottom:16px; }
.reserve p{ color:rgba(244,238,229,.78); font-size:15px; margin-bottom:24px; }
.reserve__points{ list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:10px 22px; margin-bottom:34px; }
.reserve__points li{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(244,238,229,.72); position:relative; padding-left:18px; }
.reserve__points li::before{ content:'✓'; position:absolute; left:0; color:var(--or); }
.reserve__cta{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px; }
.reserve .btn:not(.btn--ghost-light){ background:var(--creme); color:var(--noir); }
.reserve .btn:not(.btn--ghost-light):hover{ background:#fff; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:#1c1c1b; color:#d8d0c4; padding:clamp(46px,7vw,72px) var(--gut) 28px; }
.footer__inner{ max-width:var(--max); margin-inline:auto; display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:24px; padding-bottom:28px; border-bottom:1px solid rgba(255,255,255,.08); }
.footer-logo{ display:inline-flex; align-items:center; text-decoration:none; background:transparent !important; border:0 !important; box-shadow:none !important; padding:0; }
.footer-logo img{ display:block; width:clamp(130px,12vw,190px); height:auto; object-fit:contain; }
.footer__desc{ font-size:14px; color:rgba(216,208,196,.6); max-width:300px; }
.footer__links{ display:flex; gap:26px; }
.footer__links a{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; opacity:.8; transition:.3s; }
.footer__links a:hover{ opacity:1; color:var(--or); }
.footer__copy{ max-width:var(--max); margin:24px auto 0; font-size:11px; letter-spacing:.04em; color:rgba(216,208,196,.42); }

/* ============================================================
   CTA STICKY / LIGHTBOX / MODAL
   ============================================================ */
.cta-sticky{ position:fixed; left:14px; right:14px; bottom:14px; z-index:120; display:none; text-align:center; background:#151515; color:#fff; height:48px; line-height:48px; padding:0; font-size:11.5px; letter-spacing:.18em; text-transform:uppercase; font-weight:500; border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.26); opacity:0; transform:translateY(140%); transition:opacity .4s var(--ease), transform .4s var(--ease); }
.cta-sticky.show{ opacity:1; transform:none; }
.cta-sticky.hidden{ opacity:0; transform:translateY(140%); pointer-events:none; }

.lightbox{ position:fixed; inset:0; z-index:400; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(18,14,10,.92); }
.lightbox.open{ display:flex; }
.lightbox img{ max-width:92vw; max-height:88vh; width:auto; height:auto; border-radius:4px; box-shadow:0 30px 80px rgba(0,0,0,.5); }
.lightbox__close{ position:absolute; top:20px; right:26px; font-size:34px; line-height:1; color:#f2ebe3; opacity:.8; }
.lightbox__close:hover{ opacity:1; }

.modal{ position:fixed; inset:0; z-index:300; display:none; align-items:center; justify-content:center; padding:20px; }
.modal.open{ display:flex; }
.modal__overlay{ position:absolute; inset:0; background:rgba(21,21,21,.55); backdrop-filter:blur(3px); opacity:0; transition:.4s; }
.modal.open .modal__overlay{ opacity:1; }
.modal__box{ position:relative; width:100%; max-width:470px; background:var(--creme); border-radius:6px; padding:clamp(26px,4vw,44px); transform:translateY(18px) scale(.98); opacity:0; transition:.45s var(--ease); max-height:90vh; overflow-y:auto; }
.modal.open .modal__box{ transform:none; opacity:1; }
.modal__close{ position:absolute; top:16px; right:18px; font-size:24px; line-height:1; color:var(--texte-doux); }
.modal__close:hover{ color:var(--noir); }
.modal .eyebrow{ display:block; margin-bottom:8px; }
.modal h3{ font-family:var(--serif); font-weight:500; font-size:30px; color:var(--noir); margin-bottom:6px; }
.modal__intro{ font-size:12.5px; line-height:1.55; color:var(--texte-doux); margin:6px 0 16px; }
.modal__product{ font-size:13px; color:var(--texte-doux); margin-bottom:22px; }
.modal__product b{ color:var(--noir); font-weight:500; }
.field{ margin-bottom:15px; }
.field label{ display:block; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--texte-doux); margin-bottom:7px; }
.field input, .field textarea{ width:100%; font-family:inherit; font-size:14px; color:var(--texte); background:#fffaf3; border:1px solid rgba(36,31,26,.18); border-radius:3px; padding:0 14px; height:48px; transition:border-color .3s; }
.field textarea{ height:auto; min-height:84px; padding:12px 14px; resize:vertical; }
.field input:focus, .field textarea:focus{ outline:none; border-color:var(--noir); }
.field.error input, .field.error textarea{ border-color:#b4452f; }
.field .err{ display:none; color:#b4452f; font-size:11px; margin-top:5px; }
.field.error .err{ display:block; }
.modal__submit{ width:100%; margin-top:6px; }
.modal__success{ display:none; text-align:center; padding:14px 0 4px; }
.modal__success.show{ display:block; }
.modal__success .check{ width:60px; height:60px; border-radius:50%; margin:0 auto 20px; background:var(--noir); color:var(--or); display:flex; align-items:center; justify-content:center; font-size:26px; }
.modal__success p{ color:var(--texte-doux); font-size:15px; margin:14px 0 24px; }

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s ease, transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal{opacity:1;transform:none;transition:none;} html{scroll-behavior:auto;} }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:980px){
  .pillnav{ display:none; }
  .models__grid{ grid-template-columns:1fr; max-width:440px; }
}

@media (max-width:760px){
  /* Confiance mobile : blocs compacts empilés */
  .trust__grid{ grid-template-columns:1fr; }
  .trust__item{ border-left:none; border-top:1px solid rgba(36,31,26,.1); padding:20px 4px; }
  .trust__item:first-child{ border-top:none; }
  .trust__k{ margin-bottom:8px; }
  .trust__item p{ max-width:none; }

  /* Header mobile */
  .header__inner{ height:60px; }
  .header__actions{ display:none; }
  .burger{ display:block; order:-1; }
  .brand{ font-size:21px; }
  .brand-logo img{ width:135px; max-height:40px; }
  .footer-logo img{ width:135px; }
  .nav-mobile{ display:block; }

  /* HERO mobile : image full width en haut, texte dessous */
  .hero{ height:auto; min-height:0; max-height:none; }
  .slide{ position:absolute; inset:0; }
  .slide.is-active{ position:relative; }
  .slide[data-slide="0"], .slide[data-slide="1"]{ background:var(--creme); }
  /* image full width — plus de présence campagne */
  .slide__img{ position:relative; inset:auto; width:100%; height:51svh; max-height:440px; }
  .slide__img img{ width:100%; height:100%; object-fit:cover; object-position:center; transform:none; }
  .slide__scrim{ display:none; }
  /* contenu sous l'image — espaces resserrés */
  .slide__grid{ position:relative; inset:auto; z-index:2; display:block; padding:16px var(--gut) 24px; background:var(--creme); }
  .slide__left{ max-width:none; text-align:center; }
  .slide__left .eyebrow{ margin-bottom:10px; }
  .slide__left h1{ font-size:clamp(30px,8vw,42px); line-height:1.1; margin-bottom:10px; }
  .slide__sub{ display:none; }                 /* hero mobile court */
  .price{ justify-content:center; margin-bottom:16px; }
  .slide__cta{ width:100%; }
  .slide__cta .btn{ flex:1 1 100%; }
  .slide__trust{ margin-top:14px; }

  /* flèches + dots discrets superposés en bas de l'image */
  .hero__arrows{ position:absolute; top:calc(51svh - 50px); left:var(--gut); z-index:3; }
  .hero__dots{ position:absolute; top:calc(51svh - 24px); left:50%; transform:translateX(-50%); z-index:3; }

  /* Info band */
  .infoband__inner{ gap:0; }
  .infoband__inner span{ flex:1 1 50%; text-align:center; padding:8px 6px; }
  .infoband__inner span+span::before{ display:none; }

  /* Galeries : slider swipe */
  .gallery__grid, .gallery--alt .gallery__grid{ display:flex; grid-template-columns:none; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; gap:14px; padding:2px var(--gut) 8px; scrollbar-width:none; grid-auto-rows:auto; }
  .gallery__grid::-webkit-scrollbar{ display:none; }
  .g-item, .gallery--alt .g-item{ flex:0 0 auto; width:clamp(240px,76vw,300px); aspect-ratio:4/5; scroll-snap-align:start; cursor:pointer; grid-column:auto; grid-row:auto; }
  .gallery__hint{ display:block; text-align:center; margin-top:14px; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--texte-doux); }

  .drop__cta .btn{ flex:1 1 100%; }
  .cta-sticky{ display:block; }
  body{ padding-bottom:84px; }

  /* Compactage mobile : sections plus denses, page plus courte */
  .callbox{ padding:40px var(--gut); }
  .callbox p{ font-size:14px; margin-bottom:20px; }
  .callbox__cta{ width:100%; }
  .callbox__cta .btn{ flex:1 1 100%; }
  .models{ padding:40px 0; }
  .models__grid{ gap:16px; }
  .pcard__body{ padding:18px 18px 20px; }
  .pcard__body h3{ font-size:23px; margin-bottom:6px; }
  .pcard__desc{ font-size:12.5px; line-height:1.5; margin-bottom:10px; }
  .pcard__bullets{ gap:5px 12px; margin-bottom:12px; }
  .pcard__bullets li:nth-child(n+3){ display:none; }  /* 2 bullets max */
  .price--card{ margin-bottom:12px; }
  .gallery{ padding:34px 0; }
  .specs{ padding:44px 0; }
  .acc__head{ font-size:20px; padding:18px 2px; }
  .drop{ padding:54px var(--gut); }
  .sec-head{ margin-bottom:26px; }
  .footer{ padding:40px var(--gut) 26px; }
}

@media (max-width:480px){
  .pcard__bullets{ grid-template-columns:1fr; }
  .g-item{ width:82vw; }
  .footer__inner{ flex-direction:column; }
  .slide__img{ height:40svh; }
  .hero__arrows{ top:calc(40svh - 50px); }
  .hero__dots{ top:calc(40svh - 24px); }
}
@media (max-width:390px){
  .brand{ font-size:19px; }
  .slide__left h1{ font-size:clamp(34px,11.5vw,44px); }
  .infoband__inner span{ flex:1 1 100%; }
}

/* Mobile : suppression TOTALE des flèches du slider hero.
   Slide automatique conservé (swipe + dots restent fonctionnels).
   Les vrais sélecteurs de ce projet sont .hero__arrows et .arrow ;
   les classes génériques sont gardées par sécurité. */
@media (max-width:768px){
  .hero__arrows,
  .hero__arrows .arrow,
  .arrow,
  #prevSlide,
  #nextSlide,
  .hero-slider button,
  .hero-slider .slider-arrow,
  .hero-slider .hero-arrow,
  .hero-slider .carousel-arrow,
  .hero-slider .swiper-button-prev,
  .hero-slider .swiper-button-next,
  .slider-arrow,
  .hero-arrow,
  .carousel-arrow,
  .swiper-button-prev,
  .swiper-button-next{
    display:none !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }

  /* Microtrust hero — lisible, centrée, au-dessus, sans chevauchement */
  .slide__trust,
  .hero-trust,
  .microtrust,
  .hero__trust{
    position:relative;
    z-index:5;
    margin-top:14px;
    padding:0 18px;
    text-align:center;
    line-height:1.5;
  }
}