/* Mike.S — styles des pages Réserver un appel et Espace cliente (repris de tes pages, mêmes couleurs et polices). */
:root{
  --ink:#F4ECE1; --ink-dim:#C9BDAE; --bg:#0D0B09; --bg-2:#151210; --bg-3:#1C1815;
  --line:rgba(244,236,225,0.14); --bronze:#B4915B; --bronze-soft:#8C744C;
  --ok:#8AA88A; --danger:#E8908A;
  --serif:'Fraunces',serif; --sans:'Manrope',sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{ background:var(--bg); color:var(--ink); font-family:var(--sans); line-height:1.6; }
::selection{ background:var(--bronze); color:var(--bg); }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
.eyebrow{ font-size:12px; letter-spacing:0.22em; text-transform:uppercase; color:var(--bronze); font-weight:600; }
[hidden]{ display:none !important; }
:focus-visible{ outline:2px solid var(--bronze); outline-offset:3px; }

/* En-tête (identique à tes pages) */
header{
  position:fixed; top:0; left:0; right:0; z-index:320;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 48px; background:rgba(13,11,9,0.88); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.logo{ font-family:var(--serif); font-size:20px; letter-spacing:0.08em; font-weight:500; }
.logo span{ color:var(--bronze); font-style:italic; }
nav ul{ display:flex; gap:38px; list-style:none; }
nav a{ font-size:13px; letter-spacing:0.03em; color:var(--ink-dim); position:relative; padding-bottom:4px; transition:color .25s ease; }
nav a.active{ color:var(--ink); }
nav a::after{ content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--bronze); transition:width .3s ease; }
nav a:hover{ color:var(--ink); }
nav a:hover::after, nav a.active::after{ width:100%; }
.btn-line{ border:1px solid var(--line); padding:10px 22px; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink); transition:border-color .3s ease, background .3s ease; }
.btn-line:hover, .btn-line.active{ border-color:var(--bronze); background:rgba(180,145,91,0.08); }
.hamburger{ display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:8px; z-index:310; position:relative; }
.hamburger span{ width:22px; height:1px; background:var(--ink); display:block; transition:transform .3s ease, opacity .3s ease; }
.hamburger.open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.hamburger.open span:nth-child(2){ opacity:0; }
.hamburger.open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }
.mobile-menu{
  position:fixed; inset:0; background:var(--bg); z-index:300;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:24px;
  transform:translateY(-100%); transition:transform .4s cubic-bezier(.22,.61,.36,1);
}
.mobile-menu.open{ transform:translateY(0); }
.mobile-menu a{ font-family:var(--serif); font-size:25px; font-weight:400; color:var(--ink); }
.mobile-menu a.active{ color:var(--bronze); }

/* Boutons */
.btn-solid{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  background:var(--ink); color:var(--bg); padding:16px 34px; font-size:13px;
  letter-spacing:0.06em; text-transform:uppercase; font-weight:600; border:none; cursor:pointer;
  transition:transform .3s ease, background .3s ease; font-family:var(--sans);
}
.btn-solid:hover{ background:var(--bronze); transform:translateY(-2px); }
.btn-solid[disabled]{ opacity:.6; cursor:wait; transform:none; }
.btn-outline{ display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--line); color:var(--ink); padding:15px 28px; font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase; transition:border-color .3s ease, background .3s ease; background:transparent; cursor:pointer; font-family:var(--sans); }
.btn-outline:hover{ border-color:var(--bronze); background:rgba(180,145,91,0.08); }
.mk-link{ color:var(--bronze); border-bottom:1px solid var(--bronze-soft); padding-bottom:2px; transition:color .25s ease; }
.mk-link:hover{ color:var(--ink); }

/* Mise en page à deux colonnes (comme ta page Contact) */
.mk-wrap{
  min-height:100vh; padding:170px 48px 120px;
  background:radial-gradient(ellipse 900px 600px at 85% 10%, rgba(180,145,91,0.10), transparent 60%), var(--bg);
  display:grid; grid-template-columns:0.8fr 1.2fr; gap:80px; max-width:1180px; margin:0 auto; align-items:start;
}
.mk-intro{
  position:sticky; top:110px; padding:44px 40px; border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(13,11,9,0.88) 0%, rgba(13,11,9,0.74) 55%, rgba(13,11,9,0.92) 100%), var(--mk-bg, none);
  background-size:cover; background-position:center 30%;
}
.mk-intro h1{ font-family:var(--serif); font-weight:400; font-size:clamp(34px,4vw,50px); line-height:1.12; margin-top:14px; }
.mk-intro h1 em{ font-style:italic; color:var(--bronze); font-weight:300; }
.mk-intro .lede{ font-family:var(--serif); font-style:italic; font-size:19px; color:var(--ink-dim); margin-top:24px; line-height:1.6; }
.mk-intro .note{ margin-top:22px; color:var(--ink-dim); font-size:14.5px; line-height:1.8; }
.mk-list{ list-style:none; margin-top:30px; }
.mk-list li{ padding:12px 0 12px 26px; border-top:1px solid var(--line); color:var(--ink-dim); font-size:14.5px; position:relative; }
.mk-list li::before{ content:'✓'; position:absolute; left:0; color:var(--bronze); font-size:13px; }
.mk-alt{ margin-top:28px; font-size:13.5px; color:var(--ink-dim); }

/* Blocs du formulaire */
.mk-block{ padding:34px 0 38px; border-bottom:1px solid var(--line); }
.mk-block:first-child{ padding-top:0; }
.mk-block h2{ font-family:var(--serif); font-weight:400; font-size:26px; margin-bottom:6px; }
.mk-block h2 em{ font-style:italic; color:var(--bronze); font-weight:300; }
.mk-block .hint-top{ color:var(--ink-dim); font-size:13.5px; margin-bottom:24px; }
.mk-fields{ display:grid; grid-template-columns:1fr 1fr; gap:24px 26px; }
.mk-fields .full{ grid-column:1/-1; }
.field label, .mk-label{ display:block; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--bronze-soft); margin-bottom:10px; }
.field .req{ color:var(--bronze); }
.field input, .field textarea, .field select{
  width:100%; background:transparent; border:none; border-bottom:1px solid var(--line);
  color:var(--ink); font-family:var(--sans); font-size:15px; padding:10px 2px; border-radius:0;
  transition:border-color .3s ease; -webkit-appearance:none; appearance:none;
}
.field select{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23B4915B' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 4px center; padding-right:26px; }
.field select option{ background:var(--bg-2); color:var(--ink); }
.field input:focus, .field textarea:focus, .field select:focus{ outline:none; border-color:var(--bronze); }
.field textarea{ resize:vertical; min-height:96px; line-height:1.6; }
.field input::placeholder, .field textarea::placeholder{ color:var(--ink-dim); opacity:0.5; }
.field .hint{ display:block; margin-top:8px; font-size:12.5px; color:var(--ink-dim); opacity:.8; }

/* Créneaux et choix */
.mk-days{ display:flex; flex-direction:column; gap:22px; }
.mk-day{ border:0; }
.mk-day legend{ font-family:var(--serif); font-style:italic; font-size:18px; color:var(--ink); margin-bottom:12px; }
.mk-pills{ display:flex; flex-wrap:wrap; gap:8px; }
.mk-pill{ position:relative; }
.mk-pill input{ position:absolute; opacity:0; pointer-events:none; }
.mk-pill span{ display:inline-flex; align-items:center; justify-content:center; min-width:84px; min-height:44px; padding:10px 16px; border:1px solid var(--line); font-size:14px; color:var(--ink-dim); cursor:pointer; transition:border-color .2s ease, background .2s ease, color .2s ease; }
.mk-pill span:hover{ border-color:rgba(244,236,225,0.3); color:var(--ink); }
.mk-pill input:checked + span{ border-color:var(--bronze); background:rgba(180,145,91,0.16); color:var(--ink); }
.mk-pill input:focus-visible + span{ outline:2px solid var(--bronze); outline-offset:2px; }
.mk-more summary{ cursor:pointer; color:var(--bronze); font-size:13.5px; list-style:none; margin-top:4px; }
.mk-more summary::-webkit-details-marker{ display:none; }
.mk-more[open] summary{ margin-bottom:22px; }
.mk-choices{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:26px; }
.mk-choices .mk-pill span{ display:flex; flex-direction:column; align-items:flex-start; gap:3px; text-align:left; padding:16px 18px; width:100%; height:100%; font-size:13.5px; line-height:1.5; }
.mk-choices .mk-pill strong{ color:var(--ink); font-weight:500; font-size:15px; }

.mk-actions{ margin-top:30px; display:flex; flex-wrap:wrap; align-items:center; gap:16px 22px; }
.mk-actions .note{ font-size:12.5px; color:var(--ink-dim); }

/* Message de confirmation */
.mk-success{ text-align:center; border:1px solid var(--bronze-soft); background:var(--bg-2); padding:56px 40px; box-shadow:0 0 40px rgba(180,145,91,0.10); }
.mk-success .mark{ width:56px; height:56px; border-radius:50%; border:1px solid var(--bronze); display:grid; place-items:center; margin:0 auto 22px; color:var(--bronze); font-size:22px; }
.mk-success h2{ font-family:var(--serif); font-weight:400; font-size:clamp(28px,3vw,38px); line-height:1.2; }
.mk-success h2 em{ font-style:italic; color:var(--bronze); font-weight:300; }
.mk-success .when{ font-family:var(--serif); font-style:italic; font-size:clamp(21px,2.2vw,27px); color:var(--bronze); margin-top:14px; }
.mk-success p{ color:var(--ink-dim); max-width:34em; margin:14px auto 0; font-size:15px; }
.mk-success .row{ display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:28px; }
.mk-notice{ border:1px solid var(--line); background:var(--bg-2); padding:24px 26px; color:var(--ink-dim); font-size:14.5px; line-height:1.8; }
.mk-notice a{ color:var(--bronze); text-decoration:underline; text-underline-offset:3px; }

/* ---------------- Espace cliente ---------------- */
.mk-dash{ max-width:1180px; margin:0 auto; padding:160px 48px 110px; }
.mk-hello{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; padding-bottom:34px; border-bottom:1px solid var(--line); }
.mk-hello h1{ font-family:var(--serif); font-weight:400; font-size:clamp(38px,4.6vw,60px); line-height:1.08; margin-top:12px; }
.mk-hello h1 em{ font-style:italic; color:var(--bronze); font-weight:300; }
.mk-hello .headline{ font-family:var(--serif); font-style:italic; font-size:20px; color:var(--ink-dim); margin-top:14px; }
.mk-hello .side{ text-align:right; font-size:12.5px; color:var(--ink-dim); }
.mk-hello .side button{ background:none; border:none; color:var(--bronze); cursor:pointer; font:inherit; text-decoration:underline; text-underline-offset:3px; margin-top:6px; }
.mk-cols{ display:grid; grid-template-columns:1.15fr 0.85fr; gap:56px; margin-top:48px; align-items:start; }
.mk-h2{ font-family:var(--serif); font-weight:400; font-size:28px; margin-bottom:22px; }
.mk-h2 em{ font-style:italic; color:var(--bronze); font-weight:300; }

.mk-steps{ list-style:none; border-top:1px solid var(--line); }
.mk-step{ display:grid; grid-template-columns:44px 1fr; gap:18px; padding:24px 0; border-bottom:1px solid var(--line); }
.mk-step .ico{ width:36px; height:36px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; font-size:14px; color:var(--ink-dim); font-family:var(--serif); }
.mk-step h3{ font-family:var(--serif); font-weight:400; font-size:20px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.mk-step .badge{ font-family:var(--sans); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; padding:4px 9px; border:1px solid var(--line); color:var(--ink-dim); }
.mk-step p{ color:var(--ink-dim); font-size:14.5px; margin-top:6px; line-height:1.7; }
.mk-step .act{ margin-top:14px; }
.mk-step .act .btn-solid{ padding:13px 24px; font-size:12px; }
.mk-step .act .btn-outline{ padding:12px 22px; font-size:12px; }
.mk-step.fait .ico{ border-color:var(--ok); color:var(--ok); }
.mk-step.fait .badge{ color:var(--ok); border-color:rgba(138,168,138,.4); }
.mk-step.a_faire .ico{ border-color:var(--bronze); color:var(--bronze); background:rgba(180,145,91,0.12); }
.mk-step.a_faire .badge{ color:var(--bronze); border-color:var(--bronze-soft); }
.mk-step.prevu .ico{ border-color:var(--ink-dim); color:var(--ink); }
.mk-step.a_venir{ opacity:.62; }

.mk-side > section + section{ margin-top:44px; }
.mk-gal{ position:relative; display:block; border:1px solid var(--line); overflow:hidden; isolation:isolate; min-height:250px; padding:28px; display:flex; flex-direction:column; justify-content:flex-end; }
.mk-gal + .mk-gal{ margin-top:16px; }
.mk-gal .bg{ position:absolute; inset:0; z-index:-2; background-size:cover; background-position:center 30%; transition:transform 1.2s ease; }
.mk-gal::after{ content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(13,11,9,0.15) 0%, rgba(13,11,9,0.92) 75%); }
.mk-gal::before{ content:''; position:absolute; inset:14px; border:1px solid rgba(244,236,225,0.22); pointer-events:none; }
a.mk-gal:hover .bg{ transform:scale(1.03); }
.mk-gal .eyebrow{ position:relative; }
.mk-gal h3{ font-family:var(--serif); font-weight:400; font-size:26px; margin:8px 0 6px; position:relative; }
.mk-gal p{ color:var(--ink-dim); font-size:14px; position:relative; max-width:30em; }
.mk-gal .go{ margin-top:16px; position:relative; display:inline-block; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; border:1px solid rgba(244,236,225,0.35); padding:11px 18px; align-self:flex-start; transition:border-color .3s ease, background .3s ease; }
a.mk-gal:hover .go{ border-color:var(--bronze); background:rgba(180,145,91,0.15); }
.mk-event{ border:1px solid var(--line); background:var(--bg-2); padding:22px 24px; }
.mk-event + .mk-event{ margin-top:12px; }
.mk-event .when{ font-family:var(--serif); font-size:19px; margin-top:6px; }
.mk-event p{ color:var(--ink-dim); font-size:14px; margin-top:6px; white-space:pre-line; }
.mk-event a{ display:inline-block; margin-top:12px; font-size:13px; }
.mk-help{ border:1px solid var(--line); padding:26px; }
.mk-help p{ color:var(--ink-dim); font-size:14.5px; margin-top:10px; }
.mk-help .row{ display:flex; flex-wrap:wrap; gap:14px 20px; margin-top:16px; font-size:13.5px; }

/* Explication de l'espace (avant connexion) */
.mk-feat{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:30px; }
.mk-feat div{ background:var(--bg); padding:22px 20px; }
.mk-feat h3{ font-family:var(--serif); font-weight:400; font-size:17px; margin-top:10px; }
.mk-feat p{ color:var(--ink-dim); font-size:13px; margin-top:4px; line-height:1.6; }
.mk-feat svg{ width:22px; height:22px; stroke:var(--bronze); fill:none; stroke-width:1.4; }

/* Pied de page (identique à tes pages) */
footer{ border-top:1px solid var(--line); padding:70px 48px 40px; background:var(--bg-2); }
.footer-top{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:60px; padding-bottom:56px; border-bottom:1px solid var(--line); }
footer .logo{ margin-bottom:16px; display:inline-block; }
footer .footer-tag{ color:var(--ink-dim); font-size:14px; max-width:280px; line-height:1.7; }
footer h4{ font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:var(--bronze); margin-bottom:20px; font-weight:600; }
.social-icons{ display:flex; gap:12px; margin-top:16px; }
.social-icons a{ width:38px; height:38px; border:1px solid var(--line); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--ink-dim); transition:border-color .3s ease, color .3s ease, background .3s ease; }
.social-icons a:hover{ border-color:var(--bronze); color:var(--ink); background:rgba(180,145,91,0.08); }
.social-icons svg{ width:16px; height:16px; fill:currentColor; }
footer ul{ list-style:none; display:flex; flex-direction:column; gap:12px; }
footer ul a{ font-size:14px; color:var(--ink-dim); transition:color .25s ease; }
footer ul a:hover{ color:var(--ink); }
.legal-links{ max-width:1180px; margin:0 auto; display:flex; gap:18px; padding-top:20px; font-size:12px; }
.legal-links a{ color:var(--ink-dim); transition:color .25s ease; }
.legal-links a:hover{ color:var(--ink); }
.footer-bottom{ max-width:1180px; margin:0 auto; display:flex; justify-content:space-between; padding-top:28px; font-size:12.5px; color:var(--ink-dim); }

@media (max-width:980px){
  .hamburger{ display:flex; }
  header{ padding-left:24px; padding-right:24px; }
  nav ul{ display:none; }
  .mk-wrap{ grid-template-columns:1fr; padding:130px 24px 90px; gap:44px; }
  .mk-intro{ position:static; padding:34px 28px; }
  .mk-dash{ padding:130px 24px 90px; }
  .mk-cols{ grid-template-columns:1fr; gap:48px; }
  .mk-hello .side{ text-align:left; }
  .footer-top{ grid-template-columns:1fr; gap:36px; }
  footer{ padding-left:24px; padding-right:24px; }
  .footer-bottom{ flex-direction:column; gap:8px; }
}
@media (max-width:640px){
  .mk-fields, .mk-choices, .mk-feat{ grid-template-columns:1fr; }
  .mk-success{ padding:40px 22px; }
  .mk-actions .btn-solid{ width:100%; }
  .mk-step{ grid-template-columns:36px 1fr; gap:14px; }
}
@media (prefers-reduced-motion:reduce){ *{ transition:none !important; } }

/* Acompte : moyens de paiement */
.mk-pay{ margin-top:16px; border-top:1px solid var(--line); }
.mk-pay-opt{ border-bottom:1px solid var(--line); }
.mk-pay-opt summary{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; align-items:center; padding:14px 0; font-size:15px; color:var(--ink); }
.mk-pay-opt summary::-webkit-details-marker{ display:none; }
.mk-pay-opt summary::after{ content:'+'; color:var(--bronze); font-size:20px; line-height:1; transition:transform .3s ease; }
.mk-pay-opt[open] summary::after{ transform:rotate(45deg); }
.mk-pay-body{ padding:0 0 18px; }
.mk-pay-body p{ margin-top:0 !important; }
.mk-pay-body dl{ margin-top:10px; display:grid; gap:8px; }
.mk-pay-body dl > div{ display:grid; grid-template-columns:96px 1fr; gap:10px; align-items:center; font-size:14px; }
.mk-pay-body dt{ color:var(--ink-dim); }
.mk-pay-body dd{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; color:var(--ink); word-break:break-all; }
.mk-copy{ font:inherit; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--bronze); background:none; border:1px solid var(--bronze-soft); padding:3px 9px; cursor:pointer; }
.mk-pay-body .btn-solid{ margin-top:14px; padding:13px 24px; font-size:12px; display:inline-block; }

/* Guide de préparation */
.mk-guide-card{ display:flex; flex-direction:column; gap:8px; padding:26px 28px; border:1px solid var(--bronze-soft); background:linear-gradient(160deg, rgba(180,145,91,0.12), rgba(180,145,91,0.02)); transition:border-color .3s ease; }
.mk-guide-card:hover{ border-color:var(--bronze); }
.mk-guide-card strong{ font-family:var(--serif); font-weight:400; font-size:24px; }
.mk-guide-card > span:not(.eyebrow):not(.go){ color:var(--ink-dim); font-size:14px; }
.mk-guide-card .go{ margin-top:8px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--bronze); }

/* Contrat : choix en face à face ou en ligne */
.mk-step .act{ display:flex; align-items:center; flex-wrap:wrap; gap:12px 20px; }
.mk-choice{ display:inline; }
.mk-choice button{ font:inherit; font-size:13.5px; color:var(--ink); background:none; border:0; border-bottom:1px solid var(--bronze); padding:0 0 3px; cursor:pointer; }
.mk-choice button:hover{ color:var(--bronze); }
