/* =========================================================
   KOSHEREVENT — LUXE SYSTEM (BASE PROPRE v1)
   - Look Dior-like: noir profond + blanc pur + champagne gold
   - Header premium: gauche / centre / droite (desktop)
   - Drawer mobile élégant, burger uniquement mobile
   - Hero + Search + Cards + Footer cohérents
========================================================= */

:root{
  --bg:#ffffff;
  --ink:#0b0b0c;
  --muted:rgba(11,11,12,.62);

  --black:#070708;
  --panel:rgba(255,255,255,.06);
  --line:rgba(255,255,255,.14);
  --line2:rgba(11,11,12,.10);

  --gold:#c8a45a;
  --gold2:#d8bf7a;

  --serif:"Playfair Display", ui-serif, Georgia, "Times New Roman", serif;
  --sans:"Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

  --ease:cubic-bezier(.2,.8,.2,1);
  --shadow-soft:0 22px 70px rgba(0,0,0,.22);
  --shadow-card:0 18px 60px rgba(0,0,0,.30);

  --radius:18px;
  --radius-lg:26px;
}

/* Reset */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; height:auto; }

:focus-visible{
  outline:2px solid rgba(200,164,90,.65);
  outline-offset:3px;
  border-radius:12px;
}

/* =========================================================
   HEADER (Desktop: left / center / right)
========================================================= */

.has-header{ padding-top:76px; }
@media (max-width: 899px){ .has-header{ padding-top:72px; } }

.ke-header{
  position:fixed;
  top:0; left:0; right:0;
  z-index:1000;

  background: rgba(6,6,7,.78);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.ke-header--light{
  background: rgba(255,255,255,.76);
  border-bottom: 1px solid rgba(11,11,12,.08);
}
.ke-header__inner{
  height:76px;
  max-width: 1260px;
  margin: 0 auto;
  padding: 0 18px;
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  gap: 18px;
}

@media (max-width: 899px){
  .ke-header__inner{
    height:72px;
    grid-template-columns: 40px 1fr 88px;
    gap: 12px;
  }
}

/* Brand center */
.ke-brand{
  justify-self:center;
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  user-select:none;
}
.ke-brand__word{
  font-family:var(--serif);
  font-style: italic;
  font-weight: 600;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size: 18px;
  line-height:1;
  color: rgba(255,255,255,.92);
}
.ke-header--light .ke-brand__word{ color: rgba(11,11,12,.92); }

.ke-brand__hairline{
  width: 62px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(200,164,90,.92), transparent);
  opacity:.95;
}

/* Desktop nav left/right */
.ke-navL, .ke-navR{
  display:flex;
  align-items:center;
  gap: 18px;
  min-width: 0;
}
.ke-navL{ justify-self:start; }
.ke-navR{ justify-self:end; }

.ke-nav__link{
  position:relative;
  font-size: 13px;
  font-weight: 300;          /* ✅ plus fin */
  letter-spacing: .02em;
  color: rgba(255,255,255,.86);
  padding: 10px 2px;
  white-space:nowrap;
}
.ke-header--light .ke-nav__link{ color: rgba(11,11,12,.78); }

/* ✅ Underline luxe au hover */
.ke-nav__link::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:6px;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(200,164,90,.92), transparent);
  transform: scaleX(0);
  transform-origin:center;
  transition: transform .55s var(--ease), opacity .55s var(--ease);
  opacity:.9;
}
@media (hover:hover){
  .ke-nav__link:hover::after{ transform: scaleX(1); }
}

/* Pill (Entreprise/Privé ou Dashboard) */
.ke-nav__pill{
  padding: 9px 14px;
  border-radius: 999px;
  border: 1px solid rgba(200,164,90,.42);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.90);
  font-weight: 400;
}
.ke-header--light .ke-nav__pill{
  background: rgba(11,11,12,.04);
  color: rgba(11,11,12,.86);
}

/* CTA inscription */
.ke-nav__cta{
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid rgba(200,164,90,.62);
  background: rgba(200,164,90,.10);
  color: rgba(255,255,255,.92);
  font-weight: 400;
}
.ke-header--light .ke-nav__cta{
  color: rgba(11,11,12,.92);
  background: rgba(200,164,90,.14);
}

/* Hide desktop nav on mobile */
@media (max-width: 899px){
  .ke-navL, .ke-navR{ display:none; }
}

/* Burger (MOBILE ONLY) */
.ke-burger{
  width:40px; height:40px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  cursor:pointer;
}
.ke-header--light .ke-burger{
  border: 1px solid rgba(11,11,12,.10);
  background: rgba(11,11,12,.03);
}
.ke-burger span{
  display:block;
  width: 16px;
  height: 1px;
  background: rgba(255,255,255,.92);
}
.ke-header--light .ke-burger span{ background: rgba(11,11,12,.86); }

@media (min-width: 900px){
  .ke-burger{ display:none !important; } /* ✅ burger jamais sur ordi */
}

/* Mini right (mobile) */
.ke-mini{
  justify-self:end;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(200,164,90,.40);
  background: rgba(255,255,255,.06);
  font-size: 12px;
  font-weight: 300;
  color: rgba(255,255,255,.88);
}
.ke-header--light .ke-mini{
  background: rgba(11,11,12,.03);
  color: rgba(11,11,12,.84);
}
@media (min-width: 900px){
  .ke-mini{ display:none !important; }
}

/* =========================================================
   DRAWER MOBILE (click-outside closes)
========================================================= */

.ke-drawer__overlay{
  position:fixed;
  inset:0;
  z-index: 1001;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
}

.ke-drawer{
  position:fixed;
  top:0; left:0;
  height:100vh;
  width: min(420px, 92vw);
  z-index: 1002;
  background: rgba(10,10,11,.92);
  border-right: 1px solid rgba(255,255,255,.08);
  transform: translateX(-104%);
  transition: transform .35s var(--ease);
  display:flex;
  flex-direction:column;
}
.ke-header--light .ke-drawer{
  background: rgba(255,255,255,.92);
  border-right: 1px solid rgba(11,11,12,.08);
}

.ke-drawer-open .ke-drawer{ transform: translateX(0); }

.ke-drawer__top{
  padding: 18px 18px 10px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
}
.ke-drawer__logo{
  font-family:var(--serif);
  font-style: italic;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color: rgba(255,255,255,.92);
}
.ke-header--light .ke-drawer__logo{ color: rgba(11,11,12,.90); }
.ke-drawer__sub{
  margin-top: 6px;
  font-size: 12px;
  font-weight: 300;
  color: rgba(255,255,255,.70);
}
.ke-header--light .ke-drawer__sub{ color: rgba(11,11,12,.60); }

.ke-drawer__close{
  width:40px; height:40px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.90);
  cursor:pointer;
}
.ke-header--light .ke-drawer__close{
  border: 1px solid rgba(11,11,12,.10);
  background: rgba(11,11,12,.03);
  color: rgba(11,11,12,.86);
}

.ke-drawer__list{
  padding: 10px 12px 18px;
  overflow:auto;
}
.ke-drawer__link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 14px;
  border-radius: 14px;
  margin: 6px 0;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.90);
  font-weight: 300;
}
.ke-header--light .ke-drawer__link{
  border: 1px solid rgba(11,11,12,.08);
  background: rgba(11,11,12,.03);
  color: rgba(11,11,12,.86);
}
.ke-drawer__link--pill{
  border-color: rgba(200,164,90,.40);
  background: rgba(200,164,90,.10);
}
.ke-drawer__link--cta{
  border-color: rgba(200,164,90,.60);
  background: rgba(200,164,90,.14);
}

.ke-drawer__sep{
  height:1px;
  margin: 10px 6px;
  background: rgba(255,255,255,.08);
}
.ke-header--light .ke-drawer__sep{ background: rgba(11,11,12,.08); }

.ke-drawer__footer{
  margin-top:auto;
  padding: 14px 18px 18px;
  border-top: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.62);
  font-size: 12px;
  font-weight: 300;
}
.ke-header--light .ke-drawer__footer{
  border-top: 1px solid rgba(11,11,12,.08);
  color: rgba(11,11,12,.56);
}

/* =========================================================
   MAIN
========================================================= */
.ke-main{ min-height: 60vh; }

/* =========================================================
   HERO (Univers pages)
========================================================= */

.page-univers{ background: #0a0a0b; color: #fff; }

.ke-hero{
  position:relative;
  min-height: 56vh;
  padding: 92px 18px 34px;
  overflow:hidden;
}
@media (max-width: 899px){
  .ke-hero{ padding-top: 84px; min-height: 58vh; }
}

.ke-hero__media{
  position:absolute; inset:0;
  background-image: var(--hero-img);
  background-size: cover;
  background-position:center;
  transform: scale(1.06);
  filter: saturate(1.02) contrast(1.08);
}
.ke-hero__veil{
  position:absolute; inset:0;
  background:
    radial-gradient(1000px 600px at 50% 12%, rgba(0,0,0,.20) 0%, rgba(0,0,0,0) 55%),
    linear-gradient(180deg, rgba(0,0,0,.70) 0%, rgba(0,0,0,.55) 45%, rgba(0,0,0,.88) 100%);
}

.ke-hero__content{
  position:relative;
  max-width: 1100px;
  margin: 0 auto;
}

.ke-hero__kicker{
  font-size: 11px;
  letter-spacing: .20em;
  text-transform: uppercase;
  color: rgba(255,255,255,.70);
}
.ke-hero__title{
  margin: 10px 0 0;
  font-family: var(--serif);
  font-weight: 600;
  font-size: clamp(36px, 4.6vw, 62px);
  letter-spacing: .01em;
}
.ke-hero__sub{
  margin: 10px 0 0;
  font-size: 14px;
  font-weight: 300;
  color: rgba(255,255,255,.78);
}

/* Search bar */
.ke-search{
  margin-top: 22px;
  display:grid;
  grid-template-columns: 1fr 1fr auto auto;
  gap: 12px;
  padding: 14px;
  border-radius: 22px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  box-shadow: var(--shadow-soft);
}
@media (max-width: 899px){
  .ke-search{
    grid-template-columns: 1fr;
  }
}

.ke-field{ display:flex; flex-direction:column; gap: 8px; }
.ke-field__label{
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.62);
}
.ke-field__input{
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
  color: rgba(255,255,255,.92);
  padding: 0 14px;
  outline: none;
  font-weight: 300;
}
.ke-field__input::placeholder{ color: rgba(255,255,255,.45); }

.ke-search__btn{
  height: 46px;
  padding: 0 18px;
  border-radius: 14px;
  border: 1px solid rgba(200,164,90,.55);
  background: rgba(200,164,90,.18);
  color: rgba(255,255,255,.92);
  font-weight: 400;
  cursor:pointer;
}
.ke-search__ghost{
  height: 46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 0 18px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.88);
  font-weight: 300;
}

.ke-hero__trust{
  margin-top: 14px;
  display:flex;
  flex-wrap:wrap;
  gap: 14px;
  color: rgba(255,255,255,.74);
  font-size: 13px;
  font-weight: 300;
}

/* =========================================================
   Sections (white)
========================================================= */
.ke-section{
  background: #fff;
  color: #0b0b0c;
  padding: 44px 18px;
  border-top: 1px solid rgba(11,11,12,.06);
}
.ke-section__head{
  max-width: 1100px;
  margin: 0 auto 18px;
}
.ke-section__title{
  margin:0;
  font-family: var(--serif);
  font-weight: 600;
  font-size: 38px;
}
.ke-section__sub{
  margin: 8px 0 0;
  color: rgba(11,11,12,.60);
  font-weight: 300;
}
.ke-section__foot{
  max-width: 1100px;
  margin: 18px auto 0;
}
.ke-link{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  font-weight: 300;
  color: rgba(11,11,12,.78);
  position:relative;
  padding-bottom: 6px;
}
.ke-link::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:0;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(200,164,90,.92), transparent);
  transform: scaleX(.28);
  transform-origin:center;
  transition: transform .55s var(--ease);
}
@media (hover:hover){
  .ke-link:hover::after{ transform: scaleX(1); }
}

/* Cards */
.ke-cards{
  max-width: 1100px;
  margin: 0 auto;
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
@media (max-width: 1099px){ .ke-cards{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 599px){ .ke-cards{ grid-template-columns: 1fr; } }

.ke-card{
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(11,11,12,.10);
  background: #fff;
  box-shadow: 0 14px 40px rgba(0,0,0,.10);
  transition: transform .55s var(--ease), box-shadow .55s var(--ease);
}
@media (hover:hover){
  .ke-card:hover{
    transform: translateY(-3px);
    box-shadow: 0 22px 60px rgba(0,0,0,.14);
  }
}

.ke-card__media{
  position:relative;
  height: 180px;
  background-image: var(--card-img);
  background-size: cover;
  background-position:center;
}
.ke-badge{
  position:absolute;
  top: 12px; left: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,.30);
  background: rgba(0,0,0,.30);
  color: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
}
.ke-badge[data-plan="vip"]{ border-color: rgba(200,164,90,.70); }
.ke-badge[data-plan="premium"]{ border-color: rgba(255,255,255,.35); }

.ke-card__body{ padding: 14px 14px 16px; }
.ke-card__title{
  font-family: var(--serif);
  font-weight: 600;
  font-size: 18px;
  margin: 0;
}
.ke-card__meta{
  margin-top: 8px;
  display:flex;
  gap: 8px;
  color: rgba(11,11,12,.62);
  font-weight: 300;
  font-size: 13px;
}
.ke-card__cta{
  margin-top: 12px;
  font-weight: 300;
  color: rgba(11,11,12,.80);
}

/* =========================================================
   FOOTER
========================================================= */
.ke-footer{
  background: #fff;
  border-top: 1px solid rgba(11,11,12,.08);
  padding: 34px 18px;
}
.ke-footer__inner{
  max-width: 1100px;
  margin: 0 auto;
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.ke-footer__brand{
  font-family: var(--serif);
  font-style: italic;
  font-weight: 600;
  letter-spacing:.18em;
  text-transform: uppercase;
}
.ke-footer__links{
  display:flex;
  flex-wrap:wrap;
  gap: 14px;
  color: rgba(11,11,12,.68);
  font-weight: 300;
}
.ke-footer__copy{
  color: rgba(11,11,12,.58);
  font-weight: 300;
  font-size: 13px;
}

/* =========================================================
   Utility
========================================================= */
.hidden{ display:none !important; }

/* =========================================================
   LANDING (index.php — 2 portes) — FULL BLEED DIOR
   (réintégré depuis l'ancien style.css)
========================================================= */

body.landing{ overflow:hidden; }

.landing-shell{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  isolation:isolate;
  background:#000;
}

/* Doors grid */
.doors{
  position:relative;
  z-index:1;
  min-height:100vh;
  min-height:100svh;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
}

.door{
  position:relative;
  overflow:hidden;
  min-height:50svh;
  border:0;
  padding:0;
  transform: translateZ(0);
  will-change: transform;
}

/* Image */
.door-media{
  position:absolute;
  inset:-1px; /* anti hairline */
  background-image: var(--door-img);
  background-size:cover;
  background-position:center;
  transform: scale(1.06);
  filter: saturate(1.00) contrast(1.06);
  transition: transform .95s var(--ease), filter .95s var(--ease);
}

/* Overlay cinema */
.door-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(1200px 700px at 50% 15%, rgba(0,0,0,.22) 0%, rgba(0,0,0,0) 56%),
    linear-gradient(180deg,
      rgba(0,0,0,.10) 0%,
      rgba(0,0,0,.08) 55%,
      rgba(0,0,0,.58) 100%);
}

/* Reflets “porte” */
.door::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.70;
  background:
    linear-gradient(90deg,
      rgba(255,255,255,.18) 0%,
      rgba(255,255,255,0) 14%,
      rgba(255,255,255,0) 86%,
      rgba(255,255,255,.14) 100%);
}

/* Texte porte */
.door-inner{
  position:absolute;
  left:0; right:0;
  z-index:3;
  padding: 0 26px;
  color: rgba(255,255,255,.94);
  text-shadow: 0 2px 14px rgba(0,0,0,.40);
  text-align:center;
}

.door-kicker{
  font-size:11px;
  letter-spacing:.20em;
  text-transform:uppercase;
  color: rgba(255,255,255,.72);
  margin-bottom:10px;
}

.door-title{
  font-family:var(--serif);
  font-weight:500;
  font-size: clamp(24px, 4.4vw, 46px);
  letter-spacing:.01em;
  line-height:1.08;
}

.door-desc{
  margin:10px auto 0;
  color: rgba(255,255,255,.82);
  font-size: 14px;
  line-height: 1.5;
  max-width: 60ch;
}

.door-cta{
  margin-top:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}

.btn-gold{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 11px 16px;
  border-radius: 999px;
  border:1px solid rgba(200,164,90,.90);
  background: rgba(0,0,0,.18);
  backdrop-filter: blur(6px);
  color: rgba(255,255,255,.92);
  font-weight:500;
  letter-spacing:.02em;
  box-shadow: 0 14px 40px rgba(0,0,0,.22);
  transition: transform .45s var(--ease), background .45s var(--ease), box-shadow .45s var(--ease);
}

.door-arrow{
  font-size:16px;
  transform: translateY(-1px);
  opacity:.88;
  transition: transform .45s var(--ease), opacity .45s var(--ease);
}

@media (hover:hover){
  .door:hover .door-media{
    transform: scale(1.12);
    filter: saturate(1.04) contrast(1.08);
  }
  .door:hover .btn-gold{
    transform: translateY(-1px);
    background: rgba(0,0,0,.28);
    box-shadow: 0 18px 54px rgba(0,0,0,.28);
  }
  .door:hover .door-arrow{
    transform: translate(4px,-1px);
    opacity: .98;
  }
}

/* Desktop split */
@media (min-width: 900px){
  .doors{ grid-template-columns:1fr 1fr; }
  .door{ min-height:100vh; min-height:100svh; }

  /* textes en bas */
  .door-inner{ bottom: 10vh; }

  /* joint central */
  .doors::after{
    content:"";
    position:absolute;
    top:0; bottom:0;
    left:50%;
    width:1px;
    transform: translateX(-.5px);
    background: linear-gradient(180deg, rgba(255,255,255,.40), rgba(0,0,0,.18), rgba(255,255,255,.40));
    z-index:5;
    pointer-events:none;
  }
}

/* Mobile: porte 1 texte en haut, porte 2 texte en bas */
@media (max-width: 899px){
  .door-left  .door-inner{ top: 16%; }
  .door-right .door-inner{ bottom: 12%; }
}

/* Logo centre landing */
.landing-center{
  position:absolute;
  inset:0;
  z-index:6;
  display:grid;
  place-items:center;
  padding:22px;
  pointer-events:none;
  text-align:center;
}

.brand{ max-width: 980px; }

.brand-title{
  margin:0;
  font-family:var(--serif);
  font-style: italic;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: clamp(30px, 5.5vw, 72px);
  line-height:1.01;
  color: rgba(255,255,255,.95);
  text-shadow:
    0 2px 14px rgba(0,0,0,.32),
    0 28px 70px rgba(0,0,0,.22);
}

.brand-hint{
  margin-top:16px;
  font-size:11px;
  letter-spacing:.20em;
  text-transform:uppercase;
  color: rgba(255,255,255,.70);
  text-shadow: 0 2px 10px rgba(0,0,0,.22);
}

/* Mobile: logo au milieu entre les 2 cases */
@media (max-width: 899px){
  .landing-center{
    place-items: start center;
    padding: 0 18px;
    top: 50svh;
    bottom:auto;
    transform: translateY(-50%);
  }
}

/* Transition overlay */
.transition-overlay{
  position:absolute;
  inset:0;
  z-index:10;
  pointer-events:none;
  opacity:0;
  background: rgba(255,255,255,.96);
  transition: opacity .72s var(--ease);
}

.transition-overlay.is-on{ opacity:1; }

html.is-entering .landing-center{
  transition: opacity .6s var(--ease);
  opacity: 0;
}
html.is-entering .doors{
  transition: filter .72s var(--ease);
  filter: blur(1px) saturate(.98);
}
html.is-entering[data-enter="left"] .door-left{ animation: chosenDoor .82s var(--ease) forwards; }
html.is-entering[data-enter="left"] .door-right{ animation: otherDoorRight .82s var(--ease) forwards; }
html.is-entering[data-enter="right"] .door-right{ animation: chosenDoor .82s var(--ease) forwards; }
html.is-entering[data-enter="right"] .door-left{ animation: otherDoorLeft .82s var(--ease) forwards; }

@keyframes chosenDoor{
  0%   { transform: scale(1) translateY(0); opacity:1; }
  55%  { transform: scale(1.03) translateY(-2px); opacity:1; }
  100% { transform: scale(1.06) translateY(-4px); opacity:0; }
}
@keyframes otherDoorRight{
  0%   { transform: translateX(0); opacity:1; }
  100% { transform: translateX(18%); opacity:0; }
}
@keyframes otherDoorLeft{
  0%   { transform: translateX(0); opacity:1; }
  100% { transform: translateX(-18%); opacity:0; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *{
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}

/* Noscript */
.noscript{
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 120;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 16px;
  padding: 12px 14px;
  box-shadow: var(--shadow-soft);
  font-size: 13px;
  color: rgba(11,11,12,.75);
}
/* =========================================================
   ANNUAIRE — TRAITEURS (UI/UX luxe + responsive)
========================================================= */

.page-traiteurs{ background:#fff; color:var(--ink); }
.page-traiteurs .ke-main{ padding-top: 24px; }

.ke-wrap{
  max-width: 1260px;
  margin: 0 auto;
  padding: 0 18px;
}

/* Top head */
.ke-list-head{
  padding: 18px 0 10px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
}
.ke-list-title{
  margin:0;
  font-family:var(--serif);
  font-weight:600;
  letter-spacing:.01em;
  font-size: clamp(26px, 3vw, 40px);
}
.ke-list-sub{
  margin:8px 0 0;
  color: rgba(11,11,12,.62);
  font-weight:300;
}

/* Sticky filter bar */
.ke-filterbar{
  position: sticky;
  top: 76px; /* header height desktop */
  z-index: 30;
  padding: 12px 0;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(11,11,12,.06);
}
@media (max-width: 899px){
  .ke-filterbar{ top:72px; }
}

.ke-filters{
  display:grid;
  grid-template-columns: 1.3fr .7fr .7fr .8fr .8fr .8fr auto;
  gap: 10px;
  align-items:end;
}
@media (max-width: 1099px){
  .ke-filters{ grid-template-columns: 1.2fr .8fr .8fr .8fr auto; }
}
@media (max-width: 899px){
  .ke-filters{ display:none; } /* remplacé par bottom sheet */
}

.ke-field2{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.ke-field2 label{
  font-size: 11px;
  letter-spacing:.18em;
  text-transform: uppercase;
  color: rgba(11,11,12,.58);
}
.ke-input, .ke-select{
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(11,11,12,.12);
  background: #fff;
  padding: 0 12px;
  font-weight: 300;
  color: rgba(11,11,12,.86);
  outline: none;
}
.ke-input:focus, .ke-select:focus{
  border-color: rgba(200,164,90,.55);
  box-shadow: 0 0 0 3px rgba(200,164,90,.14);
}

.ke-actions{ display:flex; gap:10px; justify-content:flex-end; }
.ke-btn{
  height:44px;
  padding: 0 14px;
  border-radius: 14px;
  border: 1px solid rgba(11,11,12,.14);
  background: rgba(11,11,12,.02);
  color: rgba(11,11,12,.84);
  font-weight: 300;
  cursor:pointer;
}
.ke-btn--gold{
  border-color: rgba(200,164,90,.62);
  background: rgba(200,164,90,.14);
}
.ke-btn--ghost{
  background: transparent;
}

/* Chips actifs */
.ke-chips{
  padding: 12px 0 2px;
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}
.ke-chip{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(11,11,12,.10);
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  font-size: 12px;
  font-weight: 300;
}
.ke-chip button{
  border:0;
  background:transparent;
  cursor:pointer;
  opacity:.65;
  font-size:14px;
}
@media (hover:hover){
  .ke-chip button:hover{ opacity:1; }
}

/* Results meta */
.ke-results-meta{
  padding: 10px 0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color: rgba(11,11,12,.62);
  font-weight:300;
  font-size: 13px;
}
.ke-sort{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.ke-sort select{
  height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(11,11,12,.12);
  padding: 0 10px;
  font-weight:300;
}

/* Cards grid */
.ke-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  padding-bottom: 26px;
}
@media (max-width: 1099px){ .ke-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 699px){ .ke-grid{ grid-template-columns: 1fr; } }

.ke-tcard{
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(11,11,12,.10);
  background: #fff;
  box-shadow: 0 14px 50px rgba(0,0,0,.10);
  transition: transform .55s var(--ease), box-shadow .55s var(--ease);
}
@media (hover:hover){
  .ke-tcard:hover{ transform: translateY(-3px); box-shadow: 0 22px 70px rgba(0,0,0,.14); }
}

.ke-tmedia{
  position:relative;
  height: 180px;
  background: #0b0b0c;
  background-image: var(--cover);
  background-size: cover;
  background-position:center;
}
.ke-tveil{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.10) 55%, rgba(0,0,0,.42) 100%);
}
.ke-tbadges{
  position:absolute;
  top: 12px; left: 12px;
  display:flex;
  gap:8px;
  z-index:3;
}
.ke-b{
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 11px;
  letter-spacing:.16em;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(0,0,0,.28);
  color: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
}
.ke-b--vip{ border-color: rgba(200,164,90,.75); }
.ke-b--kosher{ border-color: rgba(255,255,255,.35); }

.ke-tlogo{
  position:absolute;
  bottom: 12px; left: 12px;
  width: 58px; height: 58px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(255,255,255,.22);
  overflow:hidden;
  box-shadow: 0 18px 60px rgba(0,0,0,.30);
  z-index:4;
}
.ke-tlogo img{ width:100%; height:100%; object-fit:cover; }

.ke-tbody{
  padding: 14px 14px 16px;
}
.ke-ttitle{
  margin:0;
  font-family: var(--serif);
  font-weight: 600;
  font-size: 18px;
  letter-spacing:.01em;
}
.ke-tmeta{
  margin-top: 8px;
  display:flex;
  flex-wrap:wrap;
  gap: 8px 10px;
  color: rgba(11,11,12,.62);
  font-weight:300;
  font-size: 13px;
}
.ke-dot::before{
  content:"•";
  margin: 0 6px 0 2px;
  opacity:.45;
}
.ke-rating{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.ke-stars{
  letter-spacing: .12em;
  font-size: 12px;
  opacity:.9;
}
.ke-ctaRow{
  margin-top: 12px;
  display:flex;
  gap:10px;
}
.ke-cta{
  flex:1;
  height: 44px;
  border-radius: 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(11,11,12,.12);
  background: rgba(11,11,12,.02);
  font-weight: 300;
}
.ke-cta--gold{
  border-color: rgba(200,164,90,.62);
  background: rgba(200,164,90,.14);
}

/* Pagination */
.ke-pager{
  display:flex;
  gap: 10px;
  justify-content:center;
  align-items:center;
  padding: 10px 0 30px;
}
.ke-page{
  min-width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(11,11,12,.12);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:300;
}
.ke-page.is-on{
  border-color: rgba(200,164,90,.62);
  background: rgba(200,164,90,.14);
}

/* Mobile filter button + bottom sheet */
.ke-mobilebar{
  display:none;
}
@media (max-width: 899px){
  .ke-mobilebar{
    display:flex;
    gap:10px;
    align-items:center;
    justify-content:space-between;
    padding: 10px 0;
  }
  .ke-mobilebar .ke-btn{ flex:1; }
}

.ke-sheetOverlay{
  position:fixed;
  inset:0;
  z-index: 1200;
  background: rgba(0,0,0,.50);
  backdrop-filter: blur(6px);
}
.ke-sheet{
  position:fixed;
  left:0; right:0;
  bottom:0;
  z-index: 1201;
  background:#fff;
  border-top-left-radius: 26px;
  border-top-right-radius: 26px;
  border-top: 1px solid rgba(11,11,12,.10);
  box-shadow: 0 -24px 80px rgba(0,0,0,.25);
  max-height: 86svh;
  overflow:auto;
}
.ke-sheetHead{
  padding: 14px 16px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom: 1px solid rgba(11,11,12,.06);
}
.ke-sheetTitle{
  font-family: var(--serif);
  font-weight: 600;
  margin:0;
}
.ke-sheetBody{ padding: 12px 16px 16px; }
.ke-sheetGrid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.ke-sheetFoot{
  padding: 12px 16px 16px;
  border-top: 1px solid rgba(11,11,12,.06);
  display:flex;
  gap:10px;
}
/* =========================================================
   MEGA MENU — ANNUAIRE
========================================================= */

.ke-mega{ position:relative; display:inline-flex; align-items:center; }

.ke-mega__btn{
  border:0;
  background:transparent;
  cursor:pointer;
}

.ke-mega__chev{
  margin-left: 8px;
  opacity:.75;
  font-size: 12px;
  transform: translateY(-1px);
}

.ke-mega__panel{
  position:absolute;
  top: calc(100% + 14px);
  left: -10px;
  width: min(420px, 86vw);
  padding: 10px;
  border-radius: 18px;
  background: rgba(10,10,11,.92);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(14px);
  box-shadow: 0 30px 90px rgba(0,0,0,.34);
  display:none;
  z-index: 1400;
}

.ke-header--light .ke-mega__panel{
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(11,11,12,.10);
}

.ke-mega.is-open .ke-mega__panel{ display:block; }

.ke-mega__item{
  display:block;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  margin: 8px 0;
}
.ke-header--light .ke-mega__item{
  border: 1px solid rgba(11,11,12,.08);
  background: rgba(11,11,12,.03);
}

.ke-mega__title{
  font-family: var(--serif);
  font-weight: 600;
  letter-spacing:.01em;
  color: rgba(255,255,255,.92);
}
.ke-header--light .ke-mega__title{ color: rgba(11,11,12,.92); }

.ke-mega__sub{
  margin-top: 4px;
  font-size: 12px;
  font-weight: 300;
  color: rgba(255,255,255,.68);
}
.ke-header--light .ke-mega__sub{ color: rgba(11,11,12,.62); }

.ke-mega__soon{
  display:inline-block;
  margin-top: 8px;
  font-size: 10px;
  letter-spacing:.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
}
.ke-header--light .ke-mega__soon{ color: rgba(11,11,12,.45); }

.ke-mega__sep{
  height:1px;
  margin: 10px 6px;
  background: rgba(255,255,255,.10);
}
.ke-header--light .ke-mega__sep{ background: rgba(11,11,12,.10); }

.ke-mega__cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(200,164,90,.55);
  background: rgba(200,164,90,.14);
  color: rgba(255,255,255,.92);
  font-weight: 300;
}
.ke-header--light .ke-mega__cta{
  color: rgba(11,11,12,.92);
}

@media (max-width: 899px){
  /* Sur mobile : on peut garder simple (dans le drawer tu peux mettre une section Annuaire) */
  .ke-mega__panel{ left: -120px; }
}
/* ===== Fix alignement texte boutons cards traiteurs ===== */
.ke-ctaRow .ke-cta{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;

  min-height: 44px;            /* hauteur pro */
  padding: 10px 14px;          /* respiration */
  line-height: 1.15;           /* multi-ligne clean */
  white-space: normal;         /* autorise le retour ligne */
  word-break: break-word;      /* évite débordement */
}

/* Optionnel : même rendu sur les gros boutons */
.ke-btn,
.ke-search__btn,
.ke-search__ghost{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.15;
}

/* ===== CTA row: boutons alignés / largeur égale / rendu premium ===== */
.ke-ctaRow{
  display:grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)); /* 4 boutons */
  gap:10px;
  align-items:stretch;
}

/* Si parfois tu n’as que 3 boutons (pas de WhatsApp), ça reste clean */
.ke-ctaRow .ke-cta{
  width:100%;
  min-height:44px;
  padding:10px 12px;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  line-height:1.15;
  white-space:normal;
  word-break:normal;
  overflow-wrap:anywhere;
}

/* Version desktop un peu plus large */
@media (min-width: 980px){
  .ke-ctaRow{ gap:12px; }
  .ke-ctaRow .ke-cta{ min-height:46px; }
}

/* Mobile: on évite 4 boutons trop serrés -> 2 par ligne */
@media (max-width: 520px){
  .ke-ctaRow{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ===== CTA row (PRO): jamais de coupure au milieu d’un mot ===== */
.ke-ctaRow{
  display:grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:10px;
  align-items:stretch;
}

.ke-ctaRow .ke-cta{
  width:100%;
  min-height:44px;
  padding:10px 12px;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;

  line-height:1.15;

  /* ✅ le point clé */
  white-space: normal;          /* ok multi-ligne */
  word-break: normal !important;/* pas de casse sauvage */
  overflow-wrap: normal !important; /* ❌ plus de "anywhere" */
  hyphens: none;                /* pas de césure auto */
}

/* Petit ajustement typographique si nécessaire */
.ke-ctaRow .ke-cta{
  font-size: 13px;
}
/* =========================================================
   PAGE — DEMANDE DE DEVIS (déplacé depuis demande_devis.php)
========================================================= */

.page-devis .ke-formCard{
  margin-top: 18px;
  border: 1px solid rgba(11,11,12,.10);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 50px rgba(0,0,0,.08);
  overflow:hidden;
}

.page-devis .ke-formHead{
  padding: 18px 18px 12px;
  border-bottom: 1px solid rgba(11,11,12,.06);
}

.page-devis .ke-formHead h1{
  margin:0;
  font-family: var(--serif);
  font-weight: 600;
  letter-spacing:.01em;
  font-size: clamp(26px, 3vw, 40px);
}

.page-devis .ke-formHead p{
  margin:8px 0 0;
  color: rgba(11,11,12,.62);
  font-weight:300;
}

.page-devis .ke-formBody{ padding: 18px; }

.page-devis .ke-formGrid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}
@media (max-width: 799px){ .page-devis .ke-formGrid{ grid-template-columns: 1fr; } }

.page-devis .ke-formRow{ display:flex; flex-direction:column; gap:6px; min-width:0; }

.page-devis .ke-formRow label{
  font-size: 11px;
  letter-spacing:.18em;
  text-transform: uppercase;
  color: rgba(11,11,12,.58);
}

.page-devis input[type="text"],
.page-devis input[type="email"],
.page-devis input[type="date"],
.page-devis input[type="number"],
.page-devis select,
.page-devis textarea{
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(11,11,12,.12);
  background: #fff;
  padding: 0 12px;
  font-weight: 300;
  color: rgba(11,11,12,.86);
  outline:none;
}

.page-devis textarea{
  height:auto;
  min-height: 120px;
  padding: 12px;
  line-height:1.5;
}

.page-devis input:focus, .page-devis select:focus, .page-devis textarea:focus{
  border-color: rgba(200,164,90,.55);
  box-shadow: 0 0 0 3px rgba(200,164,90,.14);
}

/* services cards */
.page-devis .ke-services{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:10px;
}
@media (max-width: 899px){ .page-devis .ke-services{ grid-template-columns: repeat(2, minmax(0,1fr)); } }

.page-devis .ke-svc{
  border: 1px solid rgba(11,11,12,.10);
  border-radius: 16px;
  padding: 12px 12px;
  display:flex;
  align-items:flex-start;
  gap:10px;
  cursor:pointer;
  background: rgba(11,11,12,.01);
  user-select:none;
  min-height: 60px;              /* ✅ évite les cases “écrasées” */
}

.page-devis .ke-svc input{
  margin-top: 2px;
  width: 16px; height: 16px;     /* ✅ size stable */
  flex: 0 0 16px;
}

.page-devis .ke-svc strong{ font-weight:500; }
.page-devis .ke-svc small{
  display:block;
  color: rgba(11,11,12,.58);
  font-weight:300;
  margin-top:2px;
  line-height: 1.25;
}

.page-devis .ke-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(11,11,12,.10);
  background:#fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
  font-size: 12px;
  font-weight: 300;
}

.page-devis .ke-note{
  color: rgba(11,11,12,.62);
  font-weight:300;
  font-size: 13px;
}

.page-devis .ke-actionsBar{
  margin-top: 14px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}

.page-devis .ke-actionsBar .ke-btn{
  height:46px;
  padding:0 18px;
  border-radius: 14px;
  border: 1px solid rgba(11,11,12,.14);
  background: rgba(11,11,12,.02);
  font-weight:300;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.page-devis .ke-actionsBar .ke-btn--gold{
  border-color: rgba(200,164,90,.62);
  background: rgba(200,164,90,.14);
}

.page-devis .ke-hidden{ display:none !important; }

/* =========================================================
   FIX — Checkboxes "prestataires" (rendu homogène + luxe)
   => supprime le rendu natif Chrome/Windows + aligne
========================================================= */

.page-devis .ke-svc{
  align-items: center;            /* ✅ centre vertical */
  min-height: 68px;               /* ✅ toutes les cases même hauteur */
}

.page-devis .ke-svc input[type="checkbox"]{
  -webkit-appearance: none;
  appearance: none;               /* ✅ supprime style navigateur */
  width: 18px;
  height: 18px;
  border-radius: 6px;
  border: 1px solid rgba(11,11,12,.18);
  background: #fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
  display: inline-grid;
  place-items: center;
  flex: 0 0 18px;
  margin: 0;                      /* ✅ évite décalage par défaut */
  transform: translateY(0);       /* ✅ anti weird baseline */
  cursor: pointer;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
}

.page-devis .ke-svc input[type="checkbox"]::after{
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 3px;
  transform: scale(0);
  transition: transform .18s var(--ease);
  background: linear-gradient(180deg, rgba(200,164,90,.95), rgba(200,164,90,.70));
  box-shadow: 0 10px 26px rgba(200,164,90,.22);
}

.page-devis .ke-svc input[type="checkbox"]:checked{
  border-color: rgba(200,164,90,.75);
  box-shadow: 0 0 0 3px rgba(200,164,90,.12), 0 10px 24px rgba(0,0,0,.06);
}

.page-devis .ke-svc input[type="checkbox"]:checked::after{
  transform: scale(1);
}

/* focus clavier propre */
.page-devis .ke-svc input[type="checkbox"]:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(200,164,90,.18), 0 10px 24px rgba(0,0,0,.06);
}

/* zone texte = prend toute la place, évite des hauteurs bizarres */
.page-devis .ke-svc .ke-svcText{
  display:block;
  min-width: 0;
}
.page-devis .ke-svc .ke-svcText strong{
  display:block;
  line-height: 1.15;
}
.page-devis .ke-svc .ke-svcText small{
  display:block;
  margin-top: 4px;
  line-height: 1.25;
}
/* =========================================================
   FIX — Champs "devis" qui ne prennent pas le style
   (type=tel/search + inputs sans type + classes différentes)
========================================================= */

.page-devis .ke-formBody input,
.page-devis .ke-formBody select,
.page-devis .ke-formBody textarea{
  width: 100%;
  font-family: var(--sans);
  font-weight: 300;
  color: rgba(11,11,12,.86);

  border-radius: 14px;
  border: 1px solid rgba(11,11,12,.12);
  background: #fff;

  outline: none;
}

/* hauteur uniforme pour tous les inputs/select */
.page-devis .ke-formBody input,
.page-devis .ke-formBody select{
  height: 46px;
  padding: 0 12px;
}

/* textarea */
.page-devis .ke-formBody textarea{
  height: auto;
  min-height: 120px;
  padding: 12px;
  line-height: 1.5;
}

/* focus luxe */
.page-devis .ke-formBody input:focus,
.page-devis .ke-formBody select:focus,
.page-devis .ke-formBody textarea:focus{
  border-color: rgba(200,164,90,.55);
  box-shadow: 0 0 0 3px rgba(200,164,90,.14);
}

/* (optionnel) enlève le style chelou du champ "search" sur Safari/Chrome */
.page-devis .ke-formBody input[type="search"]{
  -webkit-appearance: none;
  appearance: none;
}
.ke-modalTitle{font-family:var(--serif,"Playfair Display",serif);font-size:22px;font-style:italic;color:#fff}
.ke-modalBody{padding:16px}
.ke-modalText{margin:0 0 14px;color:rgba(255,255,255,.78);font-weight:300;line-height:1.6}

.ke-choiceGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ke-choiceCard{display:block;padding:16px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);
  box-shadow:0 20px 70px rgba(0,0,0,.30);text-decoration:none}
.ke-choiceCard:hover{background:rgba(255,255,255,.06);border-color:rgba(216,191,122,.35)}
.ke-choiceTitle{color:#fff;font-weight:600;font-size:18px}
.ke-choiceSub{margin-top:6px;color:rgba(255,255,255,.72);font-weight:300}

@media(max-width:720px){
  .ke-choiceGrid{grid-template-columns:1fr}
}
/* AUTH / FORMS */
.ke-authWrap{max-width:980px;margin:0 auto;padding:0 14px 30px}
.ke-formCard{border:1px solid rgba(255,255,255,.12);border-radius:22px;background:rgba(255,255,255,.04);
  box-shadow:0 30px 120px rgba(0,0,0,.55);padding:16px}
.ke-formGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(max-width:820px){.ke-formGrid{grid-template-columns:1fr}}
.ke-divider{height:1px;background:rgba(255,255,255,.10);margin:8px 0}
.ke-subtitle{font-family:var(--serif,"Playfair Display",serif);font-size:20px;font-style:italic;color:#fff;margin-top:6px}
.ke-help{margin-top:6px;color:rgba(255,255,255,.62);font-weight:300;font-size:13px}
.ke-actionsRow{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:6px}
.ke-note{color:rgba(255,255,255,.65);font-weight:300;font-size:13px;line-height:1.6;margin-top:6px}
.ke-honey{position:absolute;left:-9999px;opacity:0;height:0;width:0}

.ke-alert{border-radius:16px;padding:12px 14px;margin:0 0 12px;border:1px solid rgba(255,255,255,.12);font-weight:300}
.ke-alert--ok{background:rgba(120,255,190,.08);color:rgba(255,255,255,.92);border-color:rgba(120,255,190,.22)}
.ke-alert--error{background:rgba(255,120,120,.08);color:rgba(255,255,255,.92);border-color:rgba(255,120,120,.22)}

.ke-check{display:flex;gap:10px;align-items:flex-start;color:rgba(255,255,255,.80);font-weight:300;line-height:1.5}
.ke-check input{margin-top:4px}

/* FOOTER */
.ke-footer{background:#070708;border-top:1px solid rgba(255,255,255,.10)}
.ke-footer__inner{max-width:1200px;margin:0 auto;padding:24px 14px}
.ke-footer__top{display:flex;gap:22px;justify-content:space-between;align-items:flex-start;flex-wrap:wrap}
.ke-footer__brand{max-width:360px}
.ke-footer__logo{font-family:var(--serif,"Playfair Display",serif);letter-spacing:.08em;color:#fff;font-size:20px}
.ke-footer__tag{margin-top:8px;color:rgba(255,255,255,.62);font-weight:300;line-height:1.6}
.ke-footer__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;min-width:min(620px,100%)}
.ke-footer__col{display:flex;flex-direction:column;gap:8px}
.ke-footer__h{color:#fff;font-weight:600;margin-bottom:4px}
.ke-footer__col a{color:rgba(255,255,255,.70);text-decoration:none;font-weight:300}
.ke-footer__col a:hover{color:#fff}
.ke-footer__bottom{margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.10);display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ke-footer__copy{color:rgba(255,255,255,.55);font-weight:300}
.ke-footer__mini{display:flex;gap:10px;align-items:center;color:rgba(255,255,255,.45);font-weight:300}
.ke-footer__mini a{color:rgba(255,255,255,.70);text-decoration:none}
.ke-footer__mini a:hover{color:#fff}
@media(max-width:820px){.ke-footer__cols{grid-template-columns:1fr;}}

/* =========================================================
   FIX AUTH + FOOTER OVERRIDES
   - Tes blocs "AUTH / FORMS" et "FOOTER" en bas du fichier
     forcent un thème dark partout.
   - On remet AUTH en blanc via .page-auth
   - On évite que le footer dark écrase le footer blanc global
========================================================= */

/* 1) Pages AUTH => look blanc premium */
.page-auth{
  background:#fff;
  color: var(--ink);
}
.page-auth .ke-main{ padding-top: 24px; }

/* Container auth */
.page-auth .ke-authWrap{
  max-width: 980px;
  margin: 0 auto;
  padding: 0 18px 34px;
}

/* Card blanche (premium) */
.page-auth .ke-formCard{
  border: 1px solid rgba(11,11,12,.10);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 50px rgba(0,0,0,.08);
  padding: 18px;
}

/* Titres / textes */
.page-auth .ke-subtitle{
  color: rgba(11,11,12,.92);
  font-family: var(--serif);
  font-style: italic;
  font-size: 22px;
  margin: 0;
}
.page-auth .ke-help,
.page-auth .ke-note{
  color: rgba(11,11,12,.62);
}

/* Divider clair */
.page-auth .ke-divider{
  background: rgba(11,11,12,.08);
}

/* Inputs (on réutilise ton style clean devis) */
.page-auth input[type="text"],
.page-auth input[type="email"],
.page-auth input[type="password"],
.page-auth input[type="tel"],
.page-auth select{
  width: 100%;
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(11,11,12,.12);
  background: #fff;
  padding: 0 12px;
  font-weight: 300;
  color: rgba(11,11,12,.86);
  outline: none;
}
.page-auth input:focus,
.page-auth select:focus{
  border-color: rgba(200,164,90,.55);
  box-shadow: 0 0 0 3px rgba(200,164,90,.14);
}

/* Checkbox */
.page-auth .ke-check{
  color: rgba(11,11,12,.78);
}
.page-auth .ke-check input{ margin-top: 4px; }

/* Alertes (version claire) */
.page-auth .ke-alert{
  border-radius: 16px;
  padding: 12px 14px;
  margin: 0 0 12px;
  border: 1px solid rgba(11,11,12,.10);
  font-weight: 300;
}
.page-auth .ke-alert--ok{
  background: rgba(120,255,190,.10);
  color: rgba(11,11,12,.92);
  border-color: rgba(120,255,190,.25);
}
.page-auth .ke-alert--error{
  background: rgba(255,120,120,.10);
  color: rgba(11,11,12,.92);
  border-color: rgba(255,120,120,.25);
}

/* Boutons (on réutilise tes ke-btn) */
.page-auth .ke-actionsRow{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
  margin-top: 10px;
}

/* 2) IMPORTANT: ton footer noir global écrase le footer blanc du haut.
      => On force le footer BLANC par défaut, et on réserve le footer NOIR
         uniquement aux pages .page-univers (si tu veux une page dark). */
.ke-footer{
  background:#fff !important;
  border-top: 1px solid rgba(11,11,12,.08) !important;
}
.ke-footer__links,
.ke-footer__copy{
  color: rgba(11,11,12,.68) !important;
}

/* Si tu veux vraiment un footer dark sur les pages dark uniquement : */
.page-univers .ke-footer{
  background:#070708 !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}
.page-univers .ke-footer__links,
.page-univers .ke-footer__copy{
  color: rgba(255,255,255,.70) !important;
}

/* =========================================================
   MODAL — Choix inscription (BASE)
========================================================= */
.ke-modal{
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  padding: 18px;
}
.ke-modalOverlay{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
}
.ke-modalPanel{
  position: relative;
  width: min(720px, 94vw);
  border-radius: 22px;
  background: rgba(10,10,11,.92);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 30px 120px rgba(0,0,0,.55);
  overflow: hidden;
}
.ke-modalHead{
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

/* =========================================================
   AUTH / FORMS — SCOPÉ (n'affecte pas devis/annuaire)
========================================================= */
.page-auth .ke-authWrap{max-width:980px;margin:0 auto;padding:0 14px 30px}
.page-auth .ke-formCard{
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  background:rgba(255,255,255,.04);
  box-shadow:0 30px 120px rgba(0,0,0,.55);
  padding:16px
}
.page-auth .ke-formGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(max-width:820px){.page-auth .ke-formGrid{grid-template-columns:1fr}}
.page-auth .ke-divider{height:1px;background:rgba(255,255,255,.10);margin:8px 0}
.page-auth .ke-subtitle{font-family:var(--serif,"Playfair Display",serif);font-size:20px;font-style:italic;color:#fff;margin-top:6px}
.page-auth .ke-help{margin-top:6px;color:rgba(255,255,255,.62);font-weight:300;font-size:13px}
.page-auth .ke-actionsRow{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:6px}
.page-auth .ke-note{color:rgba(255,255,255,.65);font-weight:300;font-size:13px;line-height:1.6;margin-top:6px}
.page-auth .ke-honey{position:absolute;left:-9999px;opacity:0;height:0;width:0}

.page-auth .ke-alert{border-radius:16px;padding:12px 14px;margin:0 0 12px;border:1px solid rgba(255,255,255,.12);font-weight:300}
.page-auth .ke-alert--ok{background:rgba(120,255,190,.08);color:rgba(255,255,255,.92);border-color:rgba(120,255,190,.22)}
.page-auth .ke-alert--error{background:rgba(255,120,120,.08);color:rgba(255,255,255,.92);border-color:rgba(255,120,120,.22)}


/* ===== FOOTER FORCE (dernier gagne) ===== */
.ke-footer{
  background:#070708 !important;
  border-top:1px solid rgba(255,255,255,.10) !important;
  color: rgba(255,255,255,.92) !important;
}

.ke-footer__inner{
  max-width:1200px;
  margin:0 auto;
  padding:34px 18px; /* bande plus “premium” */
}

.ke-footer__h,
.ke-footer__logo{ color:#fff !important; }

.ke-footer__col a,
.ke-footer__copy,
.ke-footer__tag,
.ke-footer__mini,
.ke-footer__mini a{
  color: rgba(255,255,255,.70) !important;
}

.ke-footer__col a:hover,
.ke-footer__mini a:hover{
  color:#fff !important;
}