/* ==========================================================================
   JMD Conseil, feuille de style partagee par toutes les pages.
   Extraite du one-page le 17/08/2026 lors du passage en multi-pages.
   Ordre : tokens, base, ornements, nav, typo, sections, composants d'accueil,
   composants des nouvelles pages (tarifs, villes, prose legale), splash, responsive.
   ========================================================================== */

:root{
  --ivory:#EDE4D2;
  --ivory-2:#E7DBC6;
  --paper-deep:#DDCFB4;
  --espresso:#241A14;
  --espresso-2:#2E2118;
  --ink:#241A14;
  --ink-soft:#3A2A20;
  --camel:#7A5B28;
  --camel-light:#9A7B45;
  --camel-bright:#CBA96E;
  --camel-ink:#5E4419;   /* camel assombri : passe AA sur ivoire pour les petits libelles */
  --gold-soft:#E3C88F;   /* or eclairci : passe AA sur bordeaux pour les petits libelles */
  --wine:#7A2A38;
  --wine-deep:#5E2029;
  --mustard:#C9922E;
  --mustard-bright:#E2B24E;
  --taupe:#5F5540;
  --cream-on-dark:#ECE4D2;
  --cream-soft:#CFC3AC;

  --line:rgba(122,91,40,.28);
  --line-soft:rgba(122,91,40,.16);
  --line-on-dark:rgba(203,169,110,.28);

  --maxw:1150px;
  --ease:cubic-bezier(.16,1,.3,1);

  --font-display:'Playfair Display',Georgia,'Times New Roman',serif;
  --font-mono:'Playfair Display',Georgia,serif;
  --font-body:'Montserrat',system-ui,-apple-system,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{
  font-family:var(--font-body);
  background:var(--ivory);
  color:var(--ink);
  line-height:1.7;
  overflow-x:clip; /* clip et pas hidden : hidden casse position:sticky (cartes methode) */
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body::before{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.06;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:var(--camel);color:var(--ivory)}
:focus-visible{outline:2px solid var(--camel);outline-offset:3px;border-radius:2px}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px;position:relative;z-index:2}
.skip{position:absolute;left:-9999px;top:0;background:var(--espresso);color:var(--ivory);padding:10px 16px;z-index:200;font-weight:600}
.skip:focus{left:0}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}

.progress{position:fixed;top:0;left:0;height:2px;width:0;z-index:120;
  background:linear-gradient(90deg,var(--wine),var(--camel),var(--mustard))}

/* Ornements */
.flourish{position:absolute;width:64px;height:64px;pointer-events:none;color:var(--camel);opacity:.55}
.flourish svg{width:100%;height:100%}
.fl-tl{top:20px;left:20px}
.fl-tr{top:20px;right:20px;transform:scaleX(-1)}
.fl-bl{bottom:20px;left:20px;transform:scaleY(-1)}
.fl-br{bottom:20px;right:20px;transform:scale(-1,-1)}
.on-dark .flourish{color:var(--camel-bright);opacity:.6}

.rule{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 auto}
.rule::before,.rule::after{content:"";height:1px;width:46px;background:var(--camel)}
.rule .dia{color:var(--wine);font-size:.7rem;transform:translateY(-1px)}
.on-dark .rule::before,.on-dark .rule::after{background:var(--camel-bright)}
.on-dark .rule .dia{color:var(--mustard-bright)}

/* Monogramme */
.brand{display:flex;align-items:center;gap:13px}
.brand-logo{height:50px;width:auto;display:block}
.foot-logo{height:62px}
.mono{display:flex;flex-direction:column;align-items:center;line-height:1;
  border:1px solid var(--camel);padding:7px 11px 6px;border-radius:3px}
.mono .m1{font-family:var(--font-mono);font-weight:700;font-size:1.02rem;letter-spacing:.14em;color:var(--ink)}
.mono .m2{font-family:var(--font-body);font-weight:600;font-size:.44rem;letter-spacing:.42em;color:var(--camel);margin-top:3px}
.on-dark .mono{border-color:var(--camel-bright)}
.on-dark .mono .m1{color:var(--cream-on-dark)}
.on-dark .mono .m2{color:var(--camel-bright)}

/* Boutons */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-body);font-weight:600;font-size:.9rem;
  letter-spacing:.02em;padding:14px 24px;border-radius:2px;cursor:pointer;border:1px solid transparent;
  transition:transform .25s var(--ease),background .25s,border-color .25s,color .25s,box-shadow .25s;white-space:nowrap}
.btn svg{width:16px;height:16px;flex-shrink:0}
.btn-solid{background:var(--espresso);color:var(--ivory);box-shadow:0 8px 24px rgba(36,26,20,.18)}
.btn-solid:hover{transform:translateY(-2px);background:#160f0a;box-shadow:0 12px 30px rgba(36,26,20,.28)}
.btn-ghost{border-color:var(--camel);color:var(--ink)}
.btn-ghost:hover{background:rgba(122,91,40,.08);transform:translateY(-2px)}
.btn-wa{background:#47734A;color:#fff}
.btn-wa:hover{background:#53845a;transform:translateY(-2px)}
.btn-gold{background:var(--camel-bright);color:var(--espresso)}
.btn-gold:hover{background:var(--mustard-bright);transform:translateY(-2px)}
.on-dark .btn-solid{background:var(--ivory);color:var(--espresso)}
.on-dark .btn-solid:hover{background:#fff}
.on-dark .btn-ghost{border-color:var(--camel-bright);color:var(--cream-on-dark)}
.on-dark .btn-ghost:hover{background:rgba(203,169,110,.12)}

/* Nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:110;padding:20px 0;
  transition:background .4s var(--ease),border-color .4s,padding .4s var(--ease);border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(237,228,210,.86);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom-color:var(--line-soft);padding:12px 0}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px}
.nav-cta{display:flex;align-items:center;gap:10px}
.nav .btn{padding:11px 20px}
.nav .brand-logo--cream{display:none}

/* Nav : liens de section, encre sur le fond parchemin. */
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{position:relative;font-family:var(--font-body);font-weight:500;font-size:.78rem;
  letter-spacing:.09em;text-transform:uppercase;color:var(--ink-soft);padding:7px 1px;
  transition:color .25s var(--ease)}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--wine);transform:scaleX(0);transform-origin:center;
  transition:transform .32s var(--ease)}
.nav-links a:hover,.nav-links a.on{color:var(--ink)}
.nav-links a:hover::after,.nav-links a.on::after{transform:scaleX(1)}

/* Burger (900px et moins) */
.burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;
  flex-direction:column;gap:4px;background:transparent;border:1px solid var(--line);
  border-radius:2px;cursor:pointer;transition:border-color .25s,background .25s}
.burger:hover{background:rgba(122,91,40,.08)}
.burger i{display:block;width:17px;height:1.5px;background:var(--ink);
  transition:transform .3s var(--ease),opacity .2s var(--ease)}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

/* Panneau mobile, espresso, chiffres romains */
.navmenu{position:fixed;left:0;right:0;top:0;z-index:105;background:var(--espresso-2);
  padding:92px 0 26px;transform:translateY(-101%);visibility:hidden;
  transition:transform .45s var(--ease),visibility .45s;
  border-bottom:1px solid var(--line-on-dark);box-shadow:0 20px 54px rgba(0,0,0,.34)}
.navmenu.open{transform:translateY(0);visibility:visible}
.navmenu a{display:flex;align-items:baseline;gap:16px;font-family:var(--font-display);
  font-size:1.32rem;color:var(--cream-on-dark);padding:15px 2px;
  border-bottom:1px solid rgba(203,169,110,.15);transition:color .2s,padding-left .25s var(--ease)}
.navmenu a:last-of-type{border-bottom:0}
.navmenu a:hover,.navmenu a.on{color:var(--camel-bright);padding-left:8px}
.navmenu a em{font-family:var(--font-mono);font-style:normal;font-size:.72rem;
  letter-spacing:.12em;color:var(--camel-bright);min-width:26px}
.navmenu a.on em{color:var(--mustard-bright)}
/* le bouton d'appel flottant (z-130) passerait au-dessus du voile du menu */
body.menu-open .fab{opacity:0;pointer-events:none}
/* Le flottant n'existe que pour donner un bouton d'appel quand il n'y en a pas
   a l'ecran. La ou il y en a deja un (hero, section contact, pied de page) il
   fait doublon et masque le contenu : on l'efface. */
body.at-hero .fab,body.at-contact .fab{opacity:0;pointer-events:none}
.fab{transition:opacity .3s var(--ease)}
.nav-scrim{position:fixed;inset:0;z-index:104;background:rgba(36,26,20,.5);
  opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s}
.nav-scrim.open{opacity:1;visibility:visible}

/* La nav fixe recouvrirait le haut des sections lors d'un saut d'ancre */
section[id]{scroll-margin-top:88px}

/* Kickers et titres */
.kicker{font-family:var(--font-body);font-size:.7rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;
  color:var(--camel-ink);display:inline-flex;align-items:center;gap:14px;margin-bottom:22px}
.kicker::before,.kicker.center::after{content:"";width:34px;height:1px;background:var(--camel)}
.kicker.center{justify-content:center}
/* .kicker est en inline-flex : « center » centre ses filets autour du libelle,
   il ne centre pas la puce dans la colonne. Pour un bloc entierement centre, le
   parent doit porter l'alignement. */
.txt-center{text-align:center}
.txt-center .section-lede,.txt-center .lede{margin-left:auto;margin-right:auto}
.on-dark .kicker{color:var(--gold-soft)}
.on-dark .kicker::before,.on-dark .kicker.center::after{background:var(--camel-bright)}

h1{font-family:var(--font-display);font-weight:600;font-size:clamp(2.7rem,6.6vw,5.2rem);line-height:1.02;letter-spacing:-.015em;color:var(--ink);margin-bottom:26px}
h1 em{font-style:italic;color:var(--camel)}
h2{font-family:var(--font-display);font-weight:600;font-size:clamp(2.1rem,4.8vw,3.5rem);line-height:1.06;letter-spacing:-.01em;color:var(--ink);margin-bottom:20px}
h2 em{font-style:italic;color:var(--camel)}
.on-dark h2{color:var(--cream-on-dark)}
.on-dark h2 em{color:var(--camel-bright)}
.lede{font-size:clamp(1.06rem,2vw,1.28rem);color:var(--ink-soft);max-width:620px;font-weight:400}
.section-lede{font-size:clamp(1rem,1.7vw,1.16rem);color:var(--ink-soft);max-width:600px;font-weight:400}
.on-dark .lede,.on-dark .section-lede{color:var(--cream-soft)}

/* Sections */
section{position:relative;z-index:2}
.band{padding:clamp(84px,11vw,146px) 0}
.band-dark{background:linear-gradient(175deg,var(--espresso),var(--espresso-2));color:var(--cream-on-dark);position:relative;overflow:hidden}
.band-ivory-2{background:linear-gradient(180deg,var(--ivory),var(--ivory-2))}
.band-tight{padding:clamp(58px,7vw,92px) 0}

.watermark{position:absolute;inset:0;display:grid;place-items:center;z-index:0;pointer-events:none;overflow:hidden}
.watermark span{font-family:var(--font-mono);font-weight:700;font-size:clamp(16rem,40vw,34rem);letter-spacing:.06em;
  color:var(--camel);opacity:.05;white-space:nowrap;line-height:1}
.band-dark .watermark span,.wine .watermark span{color:var(--camel-bright)}
.band-dark .wrap{position:relative;z-index:2}

.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.09s}.reveal.d2{transition-delay:.18s}.reveal.d3{transition-delay:.27s}

/* Hero d'accueil */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:160px 0 96px;color:var(--ink);overflow:hidden;
  background:radial-gradient(125% 92% at 50% -5%, #F6EFDF 0%, #E2D4B9 120%)}
.hero-frame{position:absolute;inset:18px;border:1px solid var(--line);pointer-events:none;z-index:1}
.hero .watermark span{color:var(--camel);opacity:.06}
.hero .wrap{max-width:940px;position:relative;z-index:3}
.eyebrow{font-family:var(--font-body);font-size:.72rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;
  color:var(--camel-ink);display:inline-flex;align-items:center;gap:12px;margin-bottom:30px}
.eyebrow .dot{width:6px;height:6px;background:var(--wine);border-radius:50%}
.hero .lede{margin-bottom:20px}
.hero .lede .accent{color:var(--ink);font-weight:600}
.proof{font-family:var(--font-display);font-style:italic;font-size:clamp(1.02rem,1.9vw,1.2rem);color:var(--taupe);max-width:560px;margin-bottom:38px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero-meta{margin-top:40px;display:flex;gap:14px 30px;flex-wrap:wrap;color:var(--taupe);font-size:.84rem;font-weight:500}
.hero-meta span{display:flex;align-items:center;gap:9px}
.hero-meta svg{width:16px;height:16px;color:var(--camel)}
.hero .anim{opacity:0;transform:translateY(24px);animation:fadeUp .9s var(--ease) forwards}
.hero .eyebrow{animation-delay:.05s}
.hero h1{animation-delay:.16s}
.hero .lede{animation-delay:.3s}
.hero .proof{animation-delay:.42s}
.hero .hero-cta{animation-delay:.54s}
.hero .hero-meta{animation-delay:.66s}
@keyframes fadeUp{to{opacity:1;transform:none}}
/* Hero sur fond parchemin : l'encre porte, le bordeaux accentue */
.hero h1 em{color:var(--wine)}
/* L'accroche du 17/08/2026 fait 52 caracteres sur deux lignes. A 83 px elle
   depassait les 940 px du bloc, le retour a la ligne tombait apres « a » et le
   titre partait sur quatre lignes avec une preposition orpheline. On baisse le
   plafond pour que la coupe voulue tienne. Toute nouvelle accroche plus longue
   demandera de reverifier ce point au rendu. */
.hero h1{font-size:clamp(2.2rem,5vw,3.8rem)}
.hero .proof{text-align:right;margin-left:auto;margin-right:0}
.hero .proof .pq2{display:inline-block;margin-right:3.4em}
.hero-guyane{position:absolute;right:-24px;bottom:-8px;width:min(42vw,520px);z-index:1;opacity:.2;pointer-events:none}
.hero-guyane img{width:100%;height:auto;display:block}
@media(max-width:900px){.hero-guyane{opacity:.12;right:-90px;bottom:auto;top:70px;width:78vw}}
.motif{position:absolute;z-index:0;pointer-events:none}
.motif img,.motif svg{width:100%;height:auto;display:block}
#realisations,#pourquoi{overflow:hidden}
.m-expertises{right:-8px;bottom:-24px;width:min(23vw,290px);opacity:.13}
.m-methode{left:-18px;bottom:-16px;width:min(24vw,320px);opacity:.14}
.m-real{right:-6px;top:54px;width:min(20vw,260px);opacity:.1}
.m-pourquoi{right:-18px;bottom:-12px;width:min(19vw,250px);opacity:.1}
@media(max-width:900px){.motif{opacity:.07!important;width:52vw!important;left:auto;right:-70px}}

/* Hero compact des pages interieures */
.page-hero{position:relative;padding:172px 0 clamp(56px,7vw,86px);overflow:hidden;
  background:radial-gradient(125% 120% at 50% -20%, #F6EFDF 0%, #E2D4B9 130%);border-bottom:1px solid var(--line-soft)}
.page-hero .wrap{max-width:860px;position:relative;z-index:3}
.page-hero h1{font-size:clamp(2.3rem,5.4vw,4rem);margin-bottom:20px}
.page-hero h1 em{color:var(--wine)}
.page-hero .lede{max-width:660px}
.page-hero .hero-frame{inset:14px}
.fil{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:26px;
  font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--camel-ink);font-weight:600}
.fil a{border-bottom:1px solid var(--line-soft)}
.fil a:hover{color:var(--wine);border-bottom-color:var(--wine)}
.fil span[aria-current]{color:var(--taupe)}

/* Expertises, 2 piliers */
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:58px}
.pillar{border:1px solid var(--line-on-dark);padding:42px 36px;border-radius:3px;position:relative;
  background:linear-gradient(180deg,#32251B 0%,#241A14 100%);box-shadow:0 20px 44px rgba(36,26,20,.2);
  transition:transform .4s var(--ease),border-color .4s}
.pillar:hover{transform:translateY(-5px);border-color:var(--camel-bright)}
.pillar .rn{font-family:var(--font-display);font-style:italic;color:var(--mustard-bright);font-size:1.15rem;display:block;margin-bottom:16px}
.pillar h3{font-family:var(--font-display);font-weight:600;font-size:1.62rem;color:var(--cream-on-dark);margin-bottom:14px}
.pillar>p{color:var(--cream-soft);font-size:.98rem;margin-bottom:24px}
.pillar ul{list-style:none;border-top:1px solid var(--line-on-dark)}
.pillar li{padding:13px 0;border-bottom:1px solid var(--line-on-dark);color:var(--cream-on-dark);font-size:.93rem;display:flex;gap:12px;align-items:center}
.pillar li:last-child{border-bottom:none}
.pillar li::before{content:"\25C6";color:var(--camel-bright);font-size:.55rem;flex-shrink:0}

/* Realisations, lignes alternees */
.real{display:flex;flex-direction:column;gap:72px;margin-top:64px}
.real-row{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.real-row.rev .real-media{order:2}
.real-media .frame{border:1px solid var(--line-soft);padding:12px;background:var(--ivory)}
.real-media img{width:100%;height:auto;display:block;box-shadow:0 18px 42px rgba(36,26,20,.16)}
.real-text .p-type{font-family:var(--font-body);font-size:.68rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--camel-ink);display:block;margin-bottom:14px}
.real-text h3{font-family:var(--font-display);font-weight:600;font-size:clamp(1.7rem,3vw,2.3rem);color:var(--ink);margin-bottom:16px}
.real-text p{color:var(--taupe);font-size:1rem}
.real-note{text-align:center;margin-top:72px}
.rn-lead{font-family:var(--font-display);font-style:italic;font-size:clamp(1.25rem,2.6vw,1.8rem);color:var(--ink-soft);margin:0}
.rn-punch{font-family:var(--font-display);font-weight:700;font-size:clamp(2.8rem,8vw,5rem);line-height:1.02;color:var(--wine);margin:.12em 0 0}
.rn-cta{margin-top:28px}
.real-media .media-link{display:block;transition:transform .4s var(--ease)}
.real-media .media-link:hover{transform:translateY(-5px)}
.real-media .media-link:hover .frame{border-color:var(--camel)}
.visit-link{display:inline-flex;align-items:center;gap:9px;margin-top:18px;min-height:44px;font-family:var(--font-body);font-size:.76rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--camel-ink);border-bottom:1px solid var(--line-soft);padding-bottom:4px;transition:color .25s,border-color .25s}
.visit-link:hover{color:var(--wine);border-bottom-color:var(--wine)}
.visit-link .arw{font-size:.95rem;transition:transform .25s var(--ease)}
.visit-link:hover .arw{transform:translate(2px,-2px)}
/* Fiche technique sous chaque realisation : ce qui a ete livre, en clair. */
.real-specs{list-style:none;margin-top:20px;border-top:1px solid var(--line-soft)}
.real-specs li{display:flex;gap:14px;padding:9px 0;border-bottom:1px solid var(--line-soft);font-size:.9rem;color:var(--taupe)}
.real-specs li b{flex:0 0 132px;color:var(--ink-soft);font-weight:600;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;padding-top:2px}

/* Demonstrations interactives */
.demos-labo{margin-top:72px}
.demos-title{font-family:var(--font-display);font-weight:700;font-size:clamp(1.5rem,3.2vw,2.1rem);line-height:1.12;margin:.5rem 0 0}
.demos-title em{font-style:italic;color:var(--camel)}
.demos-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:30px}
.demo-card{margin:0}
.demo-screen{position:relative;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#17120E;box-shadow:0 22px 50px -22px rgba(36,26,20,.55)}
.demo-screen::before{content:"";position:absolute;inset:0;border-radius:12px;pointer-events:none;box-shadow:inset 0 1px 0 rgba(203,169,110,.18)}
/* hauteur de depart : la demo annonce sa vraie hauteur et on l'applique
   (voir app.js), sinon son bas etait coupe */
.demo-screen iframe{display:block;width:100%;height:640px;border:0;transition:height .3s var(--ease)}
.demo-card figcaption{margin-top:14px;font-size:.92rem;line-height:1.55;color:var(--ink-soft)}
.demo-card figcaption .p-type{display:block;margin-bottom:5px}

/* Cartes (pourquoi) */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
.card{padding:38px 32px;background:var(--ivory);border:1px solid var(--line-soft);border-radius:3px;
  box-shadow:0 14px 34px rgba(36,26,20,.06);transition:transform .4s var(--ease),box-shadow .4s,border-color .4s;position:relative}
.card:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(36,26,20,.12);border-color:var(--line)}
.card .ico{width:52px;height:52px;display:grid;place-items:center;margin-bottom:24px;
  border:1px solid var(--camel);border-radius:50%;color:var(--camel)}
.card .ico svg{width:23px;height:23px}
.cards .card:nth-child(1) .ico{border-color:var(--wine);color:var(--wine)}
.cards .card:nth-child(3) .ico{border-color:var(--mustard);color:var(--mustard)}
.card h3{font-family:var(--font-display);font-weight:600;font-size:1.32rem;color:var(--ink);margin-bottom:12px}
.card p{color:var(--taupe);font-size:.96rem}

/* Methode, cartes empilees au scroll. overflow:clip rogne le
   watermark sans casser position:sticky (hidden le casserait). */
#methode{overflow:clip}
.steps{margin-top:64px;display:flex;flex-direction:column}
.step{position:sticky;width:min(100%,780px);margin:0 auto 16vh;
  padding:46px 52px 50px;border-radius:16px;border:1px solid var(--line-on-dark);
  background:linear-gradient(180deg,#32251B 0%,#281C13 100%);
  box-shadow:0 -22px 48px rgba(36,26,20,.24)}
.step:nth-child(1){top:112px}
.step:nth-child(2){top:132px}
.step:nth-child(3){top:152px;margin-bottom:0}
.step .rn{font-family:var(--font-display);font-size:2.9rem;font-weight:600;line-height:1;color:var(--mustard-bright);margin-bottom:22px;display:block}
.step h3{font-family:var(--font-display);font-weight:600;font-size:1.55rem;color:var(--cream-on-dark);margin-bottom:12px}
.step p{color:var(--cream-soft);font-size:.98rem;max-width:56ch}
.step .delai{display:inline-flex;align-items:center;gap:9px;margin-top:18px;padding:7px 14px;border-radius:999px;
  border:1px solid var(--line-on-dark);background:rgba(203,169,110,.08);
  font-size:.76rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-soft)}

/* Marque */
.manifesto{text-align:center;position:relative;overflow:hidden}
.manifesto .watermark span{color:var(--camel);opacity:.06}
.manifesto .wrap{max-width:960px;position:relative;z-index:2}
.manifesto blockquote{font-family:var(--font-display);font-style:italic;font-weight:500;
  font-size:clamp(1.9rem,5vw,3.4rem);line-height:1.16;color:var(--ink);margin:26px 0 24px}
.manifesto .sign{font-family:var(--font-body);font-size:.74rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--camel-ink)}

/* Tarif, resume sur l'accueil */
.price{text-align:center}
.price .tag{font-family:var(--font-display);font-size:clamp(2.3rem,5.6vw,4.1rem);font-weight:600;color:var(--ink);line-height:1.1;margin:22px 0 16px}
.price .tag b{color:var(--camel);font-weight:600}
.price p{color:var(--taupe);font-size:1.04rem;max-width:490px;margin:0 auto}
.price .tag2{font-family:var(--font-display);font-weight:600;font-size:clamp(1.3rem,2.7vw,1.95rem);color:var(--ink-soft);line-height:1.15;margin:-4px 0 18px}
.price .tag2 b{color:var(--camel);font-weight:600}
.price .price-cta{margin-top:32px}

/* ==== Page tarifs ==== */
.offers{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:56px;align-items:start}
.offer{position:relative;border:1px solid var(--line);background:var(--ivory);border-radius:3px;padding:40px 34px 36px;
  box-shadow:0 14px 34px rgba(36,26,20,.06);transition:transform .4s var(--ease),box-shadow .4s,border-color .4s}
.offer:hover{transform:translateY(-5px);box-shadow:0 22px 48px rgba(36,26,20,.12)}
.offer.reco{border-color:var(--camel);box-shadow:0 22px 52px rgba(36,26,20,.14)}
.offer .flag{position:absolute;top:-13px;left:34px;background:var(--wine);color:var(--ivory);
  font-size:.66rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;padding:6px 14px;border-radius:2px}
.offer .rn{font-family:var(--font-display);font-style:italic;color:var(--camel);font-size:1.1rem;display:block;margin-bottom:10px}
.offer h2{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,1.95rem);margin-bottom:8px}
.offer .sub{color:var(--taupe);font-size:.95rem;margin-bottom:24px;min-height:3em}
.offer .amount{font-family:var(--font-display);font-weight:600;font-size:clamp(2.6rem,6vw,3.6rem);line-height:1;color:var(--wine)}
.offer .amount small{display:block;font-family:var(--font-body);font-size:.72rem;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--camel-ink);margin-top:10px}
.offer ul{list-style:none;margin:26px 0 30px;border-top:1px solid var(--line-soft)}
.offer li{padding:11px 0;border-bottom:1px solid var(--line-soft);font-size:.94rem;color:var(--ink-soft);display:flex;gap:12px;align-items:flex-start}
.offer li::before{content:"\25C6";color:var(--camel);font-size:.5rem;flex-shrink:0;transform:translateY(.7em)}
.offer li.plus{color:var(--ink);font-weight:600}
.offer .btn{width:100%;justify-content:center}

/* Le tableau des engagements chiffres : le coeur de la page. */
.spec{margin-top:58px;border-top:2px solid var(--camel)}
.spec-row{display:grid;grid-template-columns:1fr auto;gap:18px 28px;align-items:baseline;
  padding:17px 2px;border-bottom:1px solid var(--line-soft)}
.spec-row dt{font-size:.98rem;color:var(--ink-soft)}
.spec-row dt small{display:block;font-size:.8rem;color:var(--taupe);margin-top:3px;line-height:1.5}
.spec-row dd{font-family:var(--font-display);font-weight:600;font-size:clamp(1.3rem,2.6vw,1.7rem);color:var(--wine);
  text-align:right;white-space:nowrap;line-height:1.2}
.spec-row dd em{font-style:normal;display:block;font-family:var(--font-body);font-size:.68rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--camel-ink);white-space:normal}
.spec-note{margin-top:22px;font-size:.86rem;color:var(--taupe);max-width:70ch}
.spec-note a{color:var(--camel-ink);border-bottom:1px solid var(--line)}
.spec-note a:hover{color:var(--wine);border-bottom-color:var(--wine)}

/* Options, ce qui se facture en plus */
.opts{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:44px;background:var(--line-soft);border:1px solid var(--line-soft)}
.opt{background:var(--ivory);padding:22px 20px}
.opt b{display:block;font-family:var(--font-display);font-size:1.14rem;color:var(--ink);font-weight:600}
.opt span{display:block;margin-top:6px;font-size:.85rem;color:var(--taupe)}
.opt i{display:block;margin-top:10px;font-style:normal;font-weight:700;color:var(--wine);font-size:.95rem}

/* ==== Pages villes ==== */
.zones{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:48px;background:var(--line-soft);border:1px solid var(--line-soft)}
.zone{background:var(--ivory);padding:26px 24px;transition:background .3s var(--ease)}
.zone:hover{background:var(--ivory-2)}
.zone b{display:block;font-family:var(--font-display);font-size:1.28rem;font-weight:600;color:var(--ink)}
.zone span{display:block;margin-top:7px;font-size:.88rem;color:var(--taupe);line-height:1.6}
.zone i{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-style:normal;font-size:.72rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--camel-ink)}
.zone:hover i{color:var(--wine)}

.ville-body{display:grid;grid-template-columns:1.5fr 1fr;gap:56px;align-items:start;margin-top:8px}
.ville-body h2{font-size:clamp(1.7rem,3.4vw,2.4rem);margin-top:38px}
.ville-body h2:first-child{margin-top:0}
.ville-body p{color:var(--ink-soft);font-size:1rem;margin-top:14px}
.ville-body ul{list-style:none;margin-top:18px;display:grid;gap:10px}
.ville-body ul li{font-size:.97rem;color:var(--ink-soft);display:flex;gap:12px;align-items:flex-start}
.ville-body ul li::before{content:"\25C6";color:var(--camel);font-size:.5rem;flex-shrink:0;transform:translateY(.8em)}
.aside{position:sticky;top:104px;border:1px solid var(--line);background:var(--ivory-2);padding:30px 28px;border-radius:3px}
.aside h3{font-family:var(--font-display);font-size:1.28rem;margin-bottom:16px;color:var(--ink)}
.aside dl{display:grid;gap:0;border-top:1px solid var(--line-soft)}
.aside dt{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--camel-ink);padding-top:13px}
.aside dd{font-size:.96rem;color:var(--ink-soft);padding-bottom:13px;border-bottom:1px solid var(--line-soft)}
.aside .btn{width:100%;justify-content:center;margin-top:22px}

/* ==== Prose legale (mentions, conditions generales) ==== */
.prose{max-width:78ch;margin-top:8px}
.prose h2{font-size:clamp(1.4rem,2.8vw,1.85rem);margin:44px 0 4px;padding-top:22px;border-top:1px solid var(--line-soft)}
.prose h2:first-of-type{border-top:0;padding-top:0;margin-top:0}
.prose h3{font-family:var(--font-display);font-weight:600;font-size:1.18rem;color:var(--ink);margin:26px 0 6px}
.prose p{color:var(--ink-soft);font-size:.99rem;margin-top:13px}
.prose ul,.prose ol{margin:14px 0 0 1.1rem;color:var(--ink-soft);font-size:.99rem}
.prose li{margin-top:8px}
.prose strong{color:var(--ink);font-weight:600}
.prose a{color:var(--camel-ink);border-bottom:1px solid var(--line)}
.prose a:hover{color:var(--wine);border-bottom-color:var(--wine)}
.prose .maj{font-size:.82rem;color:var(--taupe);letter-spacing:.06em}
.prose .encart{border:1px solid var(--line);border-left:3px solid var(--camel);background:var(--ivory-2);
  padding:20px 24px;margin-top:24px;border-radius:2px}
.prose .encart p{margin-top:8px}
.prose .encart p:first-child{margin-top:0}
.toc{border:1px solid var(--line-soft);background:var(--ivory-2);padding:22px 26px;margin-bottom:40px;border-radius:2px}
.toc b{display:block;font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--camel-ink);margin-bottom:12px}
.toc ol{columns:2;column-gap:32px;margin:0 0 0 1.1rem;font-size:.9rem;color:var(--ink-soft)}
.toc li{margin-top:5px;break-inside:avoid}
.toc a{border-bottom:1px solid transparent}
.toc a:hover{color:var(--wine);border-bottom-color:var(--wine)}
@media(max-width:640px){.toc ol{columns:1}}

/* FAQ */
.faq .wrap{max-width:800px}
.faq h2{text-align:center}
.faq-list{margin-top:52px;border-top:1px solid var(--line-soft)}
.faq-item{border-bottom:1px solid var(--line-soft)}
.faq-item summary{cursor:pointer;list-style:none;padding:24px 4px;display:flex;align-items:center;justify-content:space-between;gap:20px;
  font-family:var(--font-display);font-weight:600;font-size:1.16rem;color:var(--ink)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary .plus{flex-shrink:0;width:24px;height:24px;position:relative}
.faq-item summary .plus::before,.faq-item summary .plus::after{content:"";position:absolute;background:var(--camel);transition:transform .3s var(--ease)}
.faq-item summary .plus::before{top:11px;left:2px;width:20px;height:1.5px}
.faq-item summary .plus::after{left:11px;top:2px;width:1.5px;height:20px}
.faq-item[open] summary .plus::after{transform:rotate(90deg);opacity:0}
.faq-item .a{padding:0 4px 26px;color:var(--taupe);font-size:.98rem;max-width:680px}

/* Contact */
.contact{text-align:center}
.contact .wrap{max-width:760px}
.contact .lede-c{color:var(--cream-soft);font-size:clamp(1.02rem,1.8vw,1.18rem);max-width:520px;margin:0 auto 38px}
.contact-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.contact .btn{padding:16px 30px;font-size:.98rem}
.contact .mail{display:inline-flex;align-items:center;min-height:44px;margin-top:22px;padding:0 4px;color:var(--cream-soft);font-size:.92rem;border-bottom:1px solid transparent;transition:color .25s,border-color .25s}
.contact .mail:hover{color:var(--camel-bright);border-bottom-color:var(--camel-bright)}
.wine{background:radial-gradient(125% 92% at 50% -10%, #7C2B39 0%, #481620 120%)}
.wine .watermark span{color:var(--camel-bright);opacity:.06}
.devis-form{max-width:580px;margin:8px auto 24px;display:grid;grid-template-columns:1fr 1fr;gap:16px;text-align:left}
.devis-form .ff-full{grid-column:1/-1}
.devis-form label{display:block;font-family:var(--font-body);font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:8px}
.devis-form input,.devis-form textarea{width:100%;background:rgba(236,228,210,.06);border:1px solid var(--line-on-dark);border-radius:3px;padding:12px 14px;font-family:var(--font-body);font-size:.95rem;color:var(--cream-on-dark);transition:border-color .2s,background .2s}
.devis-form input::placeholder,.devis-form textarea::placeholder{color:var(--cream-soft);opacity:.55}
.devis-form input:focus,.devis-form textarea:focus{outline:none;border-color:var(--camel-bright);background:rgba(236,228,210,.1)}
.devis-form textarea{resize:vertical;min-height:82px}
.devis-form .df-submit{grid-column:1/-1;justify-content:center;width:100%}
/* Information au moment de la collecte : le RGPD la veut ici, pas seulement dans les mentions. */
.devis-form .df-rgpd{grid-column:1/-1;margin:-4px 0 0;font-family:var(--font-body);font-size:.72rem;line-height:1.65;color:var(--cream-soft);text-align:center}
.devis-form .df-rgpd a{color:var(--gold-soft);border-bottom:1px solid rgba(227,200,143,.4);transition:color .2s,border-color .2s}
.devis-form .df-rgpd a:hover{color:var(--ivory);border-bottom-color:var(--ivory)}
.or-line{text-align:center;color:var(--cream-soft);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;margin:2px 0 20px;opacity:.7}
.devis-ok{font-family:var(--font-display);font-style:italic;font-size:1.16rem;color:var(--camel-bright);max-width:520px;margin:6px auto 26px;line-height:1.4}

/* Footer */
footer{background:var(--ivory-2);border-top:1px solid var(--line-soft);padding:56px 0 40px}
footer .wrap{display:flex;flex-direction:column;gap:26px}
.foot-top{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:32px}
.foot-cols{display:grid;grid-template-columns:repeat(3,minmax(150px,auto));gap:26px 46px}
.foot-col b{display:block;font-size:.68rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--camel-ink);margin-bottom:6px}
.foot-links{display:flex;flex-direction:column;color:var(--taupe);font-size:.9rem;font-weight:500}
.foot-links a{display:inline-flex;align-items:center;min-height:34px;padding:2px 0}
.foot-links a:hover{color:var(--camel)}
.foot-ig{display:inline-flex;align-items:center;gap:6px}
.foot-ig svg{width:17px;height:17px}
.legal{color:var(--taupe);font-size:.82rem;line-height:1.9;border-top:1px solid var(--line-soft);padding-top:24px;
  display:flex;flex-wrap:wrap;gap:6px 26px;align-items:center}
.legal a{display:inline-flex;align-items:center;min-height:44px;color:var(--ink-soft);font-weight:600;font-size:.9rem;text-decoration:none;border-bottom:1px solid var(--line)}
.legal a:hover{color:var(--camel);border-color:var(--camel)}
.foot-id{color:var(--taupe);font-size:.8rem;line-height:1.8;max-width:80ch}
.copy{color:var(--taupe);font-size:.82rem;opacity:.85}

/* FAB mobile */
.fab{position:fixed;bottom:20px;right:18px;z-index:130;display:none;align-items:center;gap:10px;
  padding:14px 22px;border-radius:2px;font-weight:600;font-size:.92rem;font-family:var(--font-body);
  background:var(--espresso);color:var(--ivory);box-shadow:0 8px 26px rgba(36,26,20,.4)}
.fab svg{width:17px;height:17px}

/* ==== Splash d'entree (accueil uniquement) ==== */
#splash-cover{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:24px;overflow:hidden;background:var(--wine);color:var(--ivory);
  font-family:var(--font-body);-webkit-font-smoothing:antialiased;transition:opacity .6s ease,visibility .6s ease}
#splash-cover .sc-rain{position:absolute;inset:0;pointer-events:none;overflow:hidden;
  font-family:var(--font-mono);font-size:18px;line-height:22px;font-weight:500;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 42%,#000 34%,transparent 88%);
          mask-image:radial-gradient(120% 90% at 50% 42%,#000 34%,transparent 88%)}
#splash-cover .sc-rain .col{position:absolute;top:0;white-space:pre;text-align:center;width:22px;color:rgba(233,198,106,.12)}
@keyframes scFall{from{transform:translateY(-50%)}to{transform:translateY(0)}}
html.sc-skip #splash-cover{display:none}
#splash-cover.sc-out{opacity:0;visibility:hidden;pointer-events:none}
#splash-cover .sc-amb{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(55% 40% at 50% 6%,rgba(203,169,110,.20),transparent 60%),
             radial-gradient(45% 45% at 88% 45%,rgba(203,169,110,.10),transparent 60%),
             radial-gradient(75% 60% at 50% 122%,rgba(71,24,31,.85),transparent 60%)}
#splash-cover .sc-grain{position:absolute;inset:0;pointer-events:none;opacity:.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
#splash-cover .sc-jaguar{position:absolute;right:-3%;top:50%;transform:translateY(-50%);height:86vh;max-height:820px;opacity:.20;pointer-events:none;user-select:none}
#splash-cover .sc-ara{position:absolute;left:-5%;bottom:-4%;height:50vh;max-height:500px;opacity:.11;pointer-events:none;user-select:none}
#splash-cover .sc-frame{position:absolute;inset:22px;border:1px solid rgba(203,169,110,.20);border-radius:3px;pointer-events:none}
#splash-cover .sc-corner{position:absolute;width:14px;height:14px;border:0 solid var(--camel-bright);opacity:.7}
#splash-cover .sc-tl{top:-1px;left:-1px;border-top-width:2px;border-left-width:2px}
#splash-cover .sc-tr{top:-1px;right:-1px;border-top-width:2px;border-right-width:2px}
#splash-cover .sc-bl{bottom:-1px;left:-1px;border-bottom-width:2px;border-left-width:2px}
#splash-cover .sc-br{bottom:-1px;right:-1px;border-bottom-width:2px;border-right-width:2px}
#splash-cover .sc-brand{position:absolute;top:30px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;z-index:2}
#splash-cover .sc-mono{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(203,169,110,.5);border-radius:6px;font-family:var(--font-display);font-weight:700;font-size:1.1rem;color:var(--ivory)}
#splash-cover .sc-brand-txt{text-align:left;line-height:1;display:flex;flex-direction:column}
#splash-cover .sc-brand-name{font-family:var(--font-display);font-weight:700;font-size:1rem;color:var(--ivory)}
#splash-cover .sc-brand-sub{font-family:var(--font-mono);font-weight:700;letter-spacing:.18em;font-size:.5rem;color:var(--camel-bright);margin-top:3px}
#splash-cover .sc-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:26px;max-width:min(1000px,100%)}
#splash-cover .sc-inner>*{animation:scUp .7s cubic-bezier(.16,1,.3,1) both}
#splash-cover .sc-inner>*:nth-child(1){animation-delay:.05s}
#splash-cover .sc-inner>*:nth-child(2){animation-delay:.12s}
#splash-cover .sc-inner>*:nth-child(3){animation-delay:.22s}
#splash-cover .sc-inner>*:nth-child(4){animation-delay:.32s}
@keyframes scUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
#splash-cover .sc-eyebrow-wrap{display:inline-flex;align-items:center;gap:12px}
#splash-cover .sc-eyebrow-wrap::before,#splash-cover .sc-eyebrow-wrap::after{content:"";height:1px;width:38px;background:var(--camel-bright);opacity:.6}
#splash-cover .sc-eyebrow{font-family:var(--font-mono);font-weight:700;letter-spacing:.22em;text-transform:uppercase;font-size:.7rem;color:var(--camel-bright)}
#splash-cover .sc-title{display:flex;flex-direction:column;gap:2px;font-weight:800;text-transform:uppercase;letter-spacing:-.02em;line-height:1}
#splash-cover .sc-line{font-size:clamp(2.4rem,8vw,6rem);transition:color .35s ease}
#splash-cover .sc-l1{color:var(--ivory)}
#splash-cover .sc-l2{color:var(--camel-bright)}
#splash-cover .sc-l1:hover{color:var(--camel-bright)}
#splash-cover .sc-l2:hover{color:var(--ivory)}
#splash-cover .sc-line .w{display:inline-flex;overflow:hidden;height:1em;vertical-align:bottom}
#splash-cover .sc-line .c{display:inline-block;transition:transform .25s ease-in-out;text-shadow:0 1em currentColor}
#splash-cover .sc-line:hover .c{transform:translateY(-1em)}
#splash-cover .sc-tagline{max-width:min(30rem,100%);margin:0;font-size:clamp(.95rem,2vw,1.12rem);line-height:1.6;color:var(--cream-soft)}
#splash-cover .sc-enter{display:inline-flex;align-items:center;gap:12px;background:var(--camel-bright);color:var(--espresso);
  font-family:var(--font-body);font-weight:700;text-transform:uppercase;letter-spacing:.2em;font-size:.82rem;
  padding:15px 34px;border:none;border-radius:999px;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.25);transition:transform .25s,background .25s}
#splash-cover .sc-enter:hover{transform:translateY(-2px);background:var(--mustard-bright)}
#splash-cover .sc-enter svg{width:18px;height:18px}
#splash-cover .sc-foot{position:absolute;bottom:26px;left:0;right:0;display:flex;justify-content:center;gap:10px;font-size:.72rem;color:rgba(207,195,172,.7);z-index:2}
#splash-cover .sc-foot a{color:inherit;text-decoration:none}
#splash-cover .sc-foot a:hover{color:var(--camel-bright)}
/* Mobile : splash aussi (identique au PC), en version resserree */
@media(max-width:640px){
  #splash-cover{padding:20px}
  #splash-cover .sc-ara{display:none}
  #splash-cover .sc-jaguar{opacity:.12;right:-22%;height:58vh}
  #splash-cover .sc-frame{inset:12px}
  #splash-cover .sc-brand{top:20px}
  #splash-cover .sc-inner{gap:20px}
  #splash-cover .sc-foot{bottom:18px}
}
/* Ecrans etroits (iPhone SE, Android d'entree de gamme) : les lettres du titre
   sont des <span> qui ne peuvent pas se couper, donc a 2.4rem « MARQUEZ VOTRE »
   depassait de 17px de chaque cote et se faisait rogner. On baisse le plancher.
   A placer APRES la regle de base : meme specificite, c'est l'ordre qui tranche. */
@media(max-width:360px){
  #splash-cover .sc-line{font-size:clamp(1.6rem,8vw,2.1rem)}
  #splash-cover .sc-eyebrow{font-size:.6rem;letter-spacing:.14em}
  #splash-cover .sc-tagline{font-size:.92rem}
}

/* ==== Responsive ==== */
@media(max-width:1000px){
  .ville-body{grid-template-columns:1fr;gap:40px}
  .aside{position:static}
  .opts,.zones{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .pillars{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .offers{grid-template-columns:1fr}
  .step{padding:30px 24px 34px;margin-bottom:14vh}
  .step:nth-child(1){top:92px}
  .step:nth-child(2){top:108px}
  .step:nth-child(3){top:124px;margin-bottom:0}
  .real-row{grid-template-columns:1fr;gap:32px}
  .real-row.rev .real-media{order:0}
  .demos-grid{grid-template-columns:1fr;gap:30px}
  .nav-links{display:none}
  .burger{display:inline-flex}
}
@media(max-width:600px){
  /* Les petits libelles capitales descendaient a 10-11px : illisible sur
     telephone, surtout pour une clientele qui n'a pas vingt ans. On remonte
     seulement ici, la charte desktop reste intacte. */
  .kicker{font-size:.84rem;letter-spacing:.2em}
  .eyebrow{font-size:.84rem;letter-spacing:.18em}
  .real-text .p-type{font-size:.83rem;letter-spacing:.16em}
  .devis-form label{font-size:.83rem;letter-spacing:.11em}
  .or-line{font-size:.83rem}
  .visit-link{font-size:.83rem;letter-spacing:.12em}
  .manifesto .sign{font-size:.85rem;letter-spacing:.18em}
  .hero-meta{font-size:.9rem}
  .demo-card figcaption{font-size:.96rem}
  .copy{font-size:.88rem}
  .fil{font-size:.8rem;letter-spacing:.1em}

  .nav .btn .txt{display:none}
  .nav .btn{padding:11px;width:44px;height:44px;justify-content:center}
  .navmenu a{font-size:1.18rem;padding:13px 2px}
  .hero{padding:132px 0 76px}
  .page-hero{padding:140px 0 52px}
  .hero-frame{inset:10px}
  .hero-cta{width:100%}
  .hero-cta .btn{flex:1;justify-content:center}
  .fab{display:inline-flex}
  .contact .btn{width:100%;justify-content:center}
  .flourish{width:44px;height:44px}
  .devis-form{grid-template-columns:1fr}
  .opts,.zones{grid-template-columns:1fr}
  .spec-row{grid-template-columns:1fr;gap:6px}
  .spec-row dd{text-align:left}
  .real-specs li{flex-direction:column;gap:2px}
  .real-specs li b{flex:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}.hero .anim{opacity:1;transform:none}
  #splash-cover *,#splash-cover *::before,#splash-cover *::after{animation:none!important;transition-duration:.01ms!important}
}