/* Mike.S — ajouts communs à toutes les pages : menu (Espace cliente, Réserver un appel), créneaux d'appel,
   sections de l'accueil, cases à cocher des formulaires. Chargé après les styles de chaque page. */

/* Menu */
header .nav-right{ display:flex; align-items:center; gap:24px; }
.nav-espace{ display:inline-flex; align-items:center; gap:8px; font-size:13px; letter-spacing:0.03em; color:var(--ink-dim, #C9BDAE); white-space:nowrap; transition:color .25s ease; }
.nav-espace svg{ width:15px; height:15px; fill:none; stroke:var(--bronze, #B4915B); stroke-width:1.5; flex:none; }
.nav-espace:hover, .nav-espace.active{ color:var(--ink, #F4ECE1); }
header .btn-line{ white-space:nowrap; }
@media (max-width:1380px){ header nav ul{ gap:24px; } }
@media (max-width:1200px){ header nav ul{ gap:18px; } header nav a{ font-size:12.5px; } .nav-espace span{ display:none; } header .nav-right{ gap:18px; } }
@media (max-width:980px){ .btn-long{ display:none; } header .btn-line{ padding:9px 16px; } }
.mobile-menu a.mm-cta{ color:var(--bronze, #B4915B); font-style:italic; }
.mobile-menu a.mm-espace{ font-family:var(--sans, sans-serif); font-size:13px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-dim, #C9BDAE); border:1px solid var(--line, rgba(244,236,225,0.14)); padding:11px 22px; margin-top:6px; }
@media (max-height:760px){ .mobile-menu{ gap:15px; } .mobile-menu a{ font-size:21px; } }

/* Petits éléments communs */
.mk-hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }
.mk-dot{ width:6px; height:6px; border-radius:50%; background:#8FCB9F; box-shadow:0 0 10px #8FCB9F; display:inline-block; flex:none; }
.mk-checks{ display:flex; flex-direction:column; gap:12px; margin-top:4px; text-align:left; }
.mk-check{ display:flex; gap:12px; align-items:flex-start; font-size:13.5px; color:var(--ink-dim, #C9BDAE); cursor:pointer; line-height:1.55; }
.mk-check input{ width:18px; height:18px; margin-top:2px; accent-color:var(--bronze, #B4915B); flex:none; }
.mk-check a{ color:var(--bronze, #B4915B); text-decoration:underline; text-underline-offset:3px; }
.mk-errors{ border:1px solid rgba(232,144,138,.45); background:rgba(232,144,138,.07); padding:16px 20px; margin-bottom:22px; text-align:left; }
.mk-errors p{ color:#E8908A; font-weight:600; font-size:13.5px; margin-bottom:6px; }
.mk-errors ul{ margin-left:18px; color:var(--ink, #F4ECE1); font-size:14px; }
.mk-sent{ border:1px solid var(--bronze-soft, #8C744C); background:var(--bg-2, #151210); padding:40px 34px; text-align:center; box-shadow:0 0 40px rgba(180,145,91,0.10); }
.mk-sent .mark{ width:52px; height:52px; border-radius:50%; border:1px solid var(--bronze, #B4915B); display:grid; place-items:center; margin:0 auto 18px; color:var(--bronze, #B4915B); font-size:20px; }
.mk-sent h2{ font-family:var(--serif, serif); font-weight:400; font-size:30px; line-height:1.2; }
.mk-sent h2 em{ font-style:italic; color:var(--bronze, #B4915B); font-weight:300; }
.mk-sent p{ color:var(--ink-dim, #C9BDAE); margin:12px auto 0; max-width:30em; font-size:14.5px; }
.mk-sent .row{ display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:24px; }
.mk-sent .row a{ padding:14px 24px; font-size:12.5px; }
.mk-fieldrow{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.field select{ width:100%; background:transparent; border:none; border-bottom:1px solid var(--line, rgba(244,236,225,0.14)); color:var(--ink, #F4ECE1); font-family:var(--sans, sans-serif); font-size:15px; padding:10px 26px 10px 2px; border-radius:0; -webkit-appearance:none; appearance:none;
  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; }
.field select:focus{ outline:none; border-color:var(--bronze, #B4915B); }
.field select option{ background:#151210; color:#F4ECE1; }
@media (max-width:980px){ .mk-fieldrow{ grid-template-columns:1fr; } }

/* Créneaux d'appel affichés en direct (accueil, contact) */
.mk-slots{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.mk-slots a{ font-size:12.5px; color:var(--ink, #F4ECE1); border:1px solid var(--line, rgba(244,236,225,0.14)); padding:7px 14px; border-radius:999px; transition:border-color .3s ease, background .3s ease; white-space:nowrap; }
.mk-slots a:hover{ border-color:var(--bronze, #B4915B); background:rgba(180,145,91,0.08); }
.mk-slots .mk-s{ display:none; }
.mk-appel-note{ display:flex; align-items:center; gap:10px; margin-top:18px; font-size:13px; color:var(--ink-dim, #C9BDAE); }
.hero-ctas .btn-solid{ white-space:nowrap; flex:none; }
.hero-ctas .btn-ghost{ min-width:0; }
@media (max-width:980px){
  .hero .mk-appel-note{ display:block; text-align:center; line-height:1.6; max-width:30em; margin-left:auto; margin-right:auto; }
  .hero .mk-appel-note .mk-dot{ vertical-align:middle; margin:-2px 8px 0 0; }
  .hero .mk-slots{ justify-content:center; }
}
@media (max-width:600px){
  .mk-slots .mk-l{ display:none; }
  .mk-slots .mk-s{ display:inline; }
  .mk-slots a{ font-size:12px; padding:7px 13px; }
}
.availability a.slot{ cursor:pointer; transition:color .25s ease; }
.availability a.slot:hover{ color:var(--ink, #F4ECE1); }
.availability .mk-more-link{ display:inline-block; margin-top:6px; font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--bronze, #B4915B); border-bottom:1px solid var(--bronze-soft, #8C744C); padding-bottom:3px; }

/* Bas des pages : rappel de l'appel découverte */
.closing .mk-closing-call{ display:block; max-width:640px; margin:30px auto 0; font-family:var(--sans, sans-serif); font-style:normal; font-size:13.5px; line-height:1.7; color:var(--ink-dim, #C9BDAE); text-align:center; }
.closing .mk-closing-call .mk-dot{ vertical-align:middle; margin:-2px 8px 0 0; }
.closing .mk-closing-call a{ color:var(--bronze, #B4915B); border-bottom:1px solid var(--bronze-soft, #8C744C); padding-bottom:2px; white-space:nowrap; margin-left:4px; transition:color .25s ease; }
.closing .mk-closing-call a:hover{ color:var(--ink, #F4ECE1); }

/* Accueil : « Du premier appel à tes photos » */
.mk-steps-sec{ padding:120px 48px; background:var(--bg-2, #151210); border-top:1px solid var(--line, rgba(244,236,225,0.14)); border-bottom:1px solid var(--line, rgba(244,236,225,0.14)); }
.mk-steps-head{ max-width:720px; margin:0 auto 56px; text-align:center; }
.mk-steps-head h2{ font-family:var(--serif, serif); font-weight:400; font-size:clamp(28px,3.2vw,44px); line-height:1.15; margin-top:14px; }
.mk-steps-head h2 em{ font-style:italic; color:var(--bronze, #B4915B); font-weight:300; }
.mk-steps-head p{ color:var(--ink-dim, #C9BDAE); font-size:15.5px; margin-top:18px; line-height:1.8; }
.mk-steps4{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line, rgba(244,236,225,0.14)); border:1px solid var(--line, rgba(244,236,225,0.14)); list-style:none; }
.mk-steps4 li{ background:var(--bg, #0D0B09); padding:36px 30px 40px; }
.mk-steps4 .n{ font-family:var(--serif, serif); font-style:italic; color:var(--bronze, #B4915B); font-size:36px; line-height:1; display:block; margin-bottom:22px; font-weight:300; }
.mk-steps4 h3{ font-family:var(--serif, serif); font-weight:400; font-size:20px; margin-bottom:10px; }
.mk-steps4 p{ color:var(--ink-dim, #C9BDAE); font-size:14.5px; line-height:1.7; }
.mk-steps4 .tag{ display:inline-block; margin-top:16px; font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--bronze, #B4915B); border:1px solid var(--bronze-soft, #8C744C); padding:5px 10px; }
.mk-steps-cta{ display:flex; flex-direction:column; align-items:center; gap:4px; margin-top:48px; text-align:center; }
.mk-steps-cta .mk-slots{ justify-content:center; }
.mk-steps-cta .sub{ font-size:13px; color:var(--ink-dim, #C9BDAE); margin-top:14px; }

/* Accueil : bandeau de fin */
.mk-final{ text-align:center; padding:120px 48px; background:radial-gradient(ellipse 700px 400px at 50% 100%, rgba(180,145,91,0.12), transparent 70%), var(--bg, #0D0B09); border-top:1px solid var(--line, rgba(244,236,225,0.14)); }
.mk-final h2{ font-family:var(--serif, serif); font-weight:400; font-size:clamp(28px,3.4vw,46px); line-height:1.18; max-width:18em; margin:14px auto 0; }
.mk-final h2 em{ font-style:italic; color:var(--bronze, #B4915B); font-weight:300; }
.mk-final p{ color:var(--ink-dim, #C9BDAE); margin:20px auto 0; max-width:32em; font-size:15.5px; }
.mk-final .row{ display:flex; justify-content:center; flex-wrap:wrap; gap:16px; margin-top:36px; }
.mk-final .mk-outline{ display:inline-flex; align-items:center; border:1px solid var(--line, rgba(244,236,225,0.14)); padding:15px 28px; font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink, #F4ECE1); transition:border-color .3s ease, background .3s ease; }
.mk-final .mk-outline:hover{ border-color:var(--bronze, #B4915B); background:rgba(180,145,91,0.08); }

@media (max-width:980px){
  .mk-steps-sec, .mk-final{ padding:90px 24px; }
  .mk-steps4{ grid-template-columns:1fr 1fr; }
}
@media (max-width:600px){
  .mk-steps4{ grid-template-columns:1fr; }
  .mk-final .row a{ width:100%; justify-content:center; }
}
