/* MM’S Rent — Site vitrine + réservation (mobile-first) */
:root{
  --bg:#0b1220; --text:#e9eefb; --muted:#b9c4dd;
  --border:rgba(233,238,251,.14); --shadow:0 18px 45px rgba(0,0,0,.35);
  --accent:#2f73ff; --accent2:#24d1a3;
  --radius:18px; --radiusSm:12px;
  --container:1160px; --pad:18px;
  --h1:clamp(2.0rem,2.6vw,3.0rem);
  --h2:clamp(1.35rem,1.7vw,2.0rem);
  --h3:1.15rem; --p:1.02rem;
  --font:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0; font-family:var(--font); color:var(--text); line-height:1.45;
  background:
    radial-gradient(1200px 800px at 20% -20%, rgba(47,115,255,.28), transparent 55%),
    radial-gradient(900px 700px at 85% 15%, rgba(36,209,163,.20), transparent 55%),
    radial-gradient(900px 900px at 60% 110%, rgba(47,115,255,.16), transparent 52%),
    linear-gradient(180deg,#070c16,var(--bg));
}
a{color:inherit;text-decoration:none;}
button,input,select,textarea{font:inherit;color:inherit;}
.container{width:min(var(--container),calc(100% - 2*var(--pad)));margin:0 auto;}
.skip-link{position:absolute;left:-999px;width:1px;height:1px;overflow:hidden;}
.skip-link:focus{left:var(--pad);top:var(--pad);width:auto;height:auto;padding:10px 12px;border-radius:10px;background:rgba(47,115,255,.22);border:1px solid var(--border);z-index:9999;}

.header{position:sticky;top:0;z-index:50;backdrop-filter:blur(12px);background:rgba(7,12,22,.6);border-bottom:1px solid rgba(233,238,251,.10);}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:12px;}
.brand{display:flex;align-items:center;gap:12px;min-width:0;}
.brand-mark{width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,rgba(47,115,255,.95),rgba(36,209,163,.8));box-shadow:0 10px 30px rgba(47,115,255,.25);display:grid;place-items:center;flex:0 0 auto;}
.brand-mark svg{width:20px;height:20px;}
.brand-text{display:flex;flex-direction:column;min-width:0;}
.brand-text .name{font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.brand-text .tag{font-size:.9rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.nav{display:flex;align-items:center;gap:14px;}
.nav a{font-size:.98rem;color:rgba(233,238,251,.88);padding:10px 10px;border-radius:10px;}
.nav a:hover{background:rgba(233,238,251,.06);}
.nav .active{background:rgba(47,115,255,.18);border:1px solid rgba(47,115,255,.28);}

.header-cta{display:flex;align-items:center;gap:10px;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 14px;border-radius:14px;border:1px solid rgba(233,238,251,.16);background:rgba(233,238,251,.06);cursor:pointer;transition:transform .08s ease, background .15s ease;}
.btn:hover{background:rgba(233,238,251,.10);}
.btn:active{transform:translateY(1px);}
.btn.primary{background:linear-gradient(135deg,rgba(47,115,255,1),rgba(47,115,255,.78));border-color:rgba(47,115,255,.45);box-shadow:0 14px 32px rgba(47,115,255,.22);}
.btn.ghost{background:transparent;border-color:rgba(233,238,251,.14);}
.btn.small{padding:10px 12px;border-radius:12px;}

.burger{display:none;width:44px;height:44px;border-radius:14px;border:1px solid rgba(233,238,251,.16);background:rgba(233,238,251,.06);cursor:pointer;}
.burger svg{width:22px;height:22px;}
.mobile-panel{display:none;border-top:1px solid rgba(233,238,251,.10);background:rgba(7,12,22,.75);}
.mobile-panel.show{display:block;}
.mobile-panel .links{display:flex;flex-direction:column;gap:6px;padding:12px 0 14px 0;}
.mobile-panel a{padding:12px 12px;border-radius:14px;border:1px solid rgba(233,238,251,.10);background:rgba(233,238,251,.04);}
.mobile-panel a:hover{background:rgba(233,238,251,.08);}

.hero{padding:38px 0 10px 0;}
.hero-grid{display:grid;gap:18px;}
.hero-card{background:linear-gradient(180deg,rgba(17,31,58,.82),rgba(15,26,48,.72));border:1px solid rgba(233,238,251,.12);border-radius:var(--radius);padding:clamp(18px,2.4vw,28px);box-shadow:var(--shadow);position:relative;overflow:hidden;}
.hero-card:before{content:"";position:absolute;inset:-40px -20px auto -20px;height:160px;background:radial-gradient(420px 140px at 30% 60%, rgba(47,115,255,.32), transparent 70%);pointer-events:none;}
.kicker{display:inline-flex;gap:10px;align-items:center;padding:8px 12px;border-radius:999px;border:1px solid rgba(233,238,251,.14);background:rgba(233,238,251,.06);font-size:.95rem;}
.kicker .dot{width:10px;height:10px;border-radius:99px;background:var(--accent2);box-shadow:0 0 0 6px rgba(36,209,163,.13);}
h1{margin:14px 0 10px;font-size:var(--h1);letter-spacing:-.5px;line-height:1.1;}
.lead{margin:0 0 18px 0;font-size:var(--p);color:rgba(233,238,251,.86);max-width:62ch;}
.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.meta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.pill{display:inline-flex;align-items:center;gap:10px;padding:10px 12px;border-radius:999px;border:1px solid rgba(233,238,251,.12);background:rgba(233,238,251,.04);font-size:.95rem;color:rgba(233,238,251,.88);}

.side-card{background:linear-gradient(180deg,rgba(17,31,58,.72),rgba(15,26,48,.58));border:1px solid rgba(233,238,251,.12);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);}
.side-title{font-weight:740;font-size:1.05rem;margin:0 0 10px 0;}
.side-list{display:grid;gap:10px;margin:0;padding:0;list-style:none;}
.side-list li{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:var(--radiusSm);border:1px solid rgba(233,238,251,.12);background:rgba(233,238,251,.04);}
.icon{width:34px;height:34px;border-radius:12px;background:rgba(47,115,255,.14);border:1px solid rgba(47,115,255,.24);display:grid;place-items:center;flex:0 0 auto;}
.icon svg{width:18px;height:18px;}

.section{padding:26px 0;}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:14px;}
.section-head h2{margin:0;font-size:var(--h2);letter-spacing:-.3px;}
.section-head p{margin:0;color:rgba(233,238,251,.78);max-width:62ch;}

.grid{display:grid;gap:12px;}
.cards-3{grid-template-columns:1fr;}
.card{background:rgba(233,238,251,.04);border:1px solid rgba(233,238,251,.12);border-radius:var(--radius);padding:16px;box-shadow:0 10px 30px rgba(0,0,0,.20);}
.card h3{margin:0 0 8px;font-size:var(--h3);}
.card p{margin:0;color:rgba(233,238,251,.82);}
.card .mini{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap;}
.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;border:1px solid rgba(233,238,251,.12);background:rgba(233,238,251,.04);font-size:.92rem;color:rgba(233,238,251,.86);}

.split{display:grid;gap:12px;}
.panel{background:linear-gradient(180deg,rgba(17,31,58,.70),rgba(15,26,48,.55));border:1px solid rgba(233,238,251,.12);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);}
.panel h3{margin:0 0 10px 0;font-size:1.12rem;}
.panel p{margin:0 0 10px 0;color:rgba(233,238,251,.82);}
.ul{margin:0;padding-left:18px;color:rgba(233,238,251,.82);}
.ul li{margin:8px 0;}

.cta-band{margin:18px 0 0 0;padding:16px;border-radius:var(--radius);border:1px solid rgba(47,115,255,.30);
  background:radial-gradient(800px 220px at 20% 0%, rgba(47,115,255,.30), transparent 60%), rgba(47,115,255,.10);
  display:flex;flex-direction:column;gap:12px;align-items:flex-start;}
.cta-band .row{display:flex;flex-wrap:wrap;gap:10px;}

.form{display:grid;gap:12px;}
.field{display:grid;gap:6px;}
label{font-size:.95rem;color:rgba(233,238,251,.86);}
input,select,textarea{width:100%;padding:12px 12px;border-radius:14px;border:1px solid rgba(233,238,251,.14);background:rgba(233,238,251,.05);outline:none;}
textarea{min-height:120px;resize:vertical;}
input:focus,select:focus,textarea:focus{border-color:rgba(47,115,255,.55);box-shadow:0 0 0 4px rgba(47,115,255,.18);}
.hint{font-size:.92rem;color:rgba(233,238,251,.72);}
.notice{padding:12px;border-radius:14px;border:1px solid rgba(233,238,251,.14);background:rgba(233,238,251,.05);}
.notice.success{border-color:rgba(36,209,163,.35);background:rgba(36,209,163,.10);}
.notice.error{border-color:rgba(255,77,109,.35);background:rgba(255,77,109,.10);}

.table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid rgba(233,238,251,.12);border-radius:var(--radius);overflow:hidden;background:rgba(233,238,251,.04);}
.table th,.table td{text-align:left;padding:12px 12px;border-bottom:1px solid rgba(233,238,251,.10);vertical-align:top;color:rgba(233,238,251,.86);font-size:.98rem;}
.table th{background:rgba(233,238,251,.03);}
.table tr:last-child td{border-bottom:0;}

.footer{padding:26px 0 34px 0;border-top:1px solid rgba(233,238,251,.10);background:rgba(7,12,22,.55);}
.footer-grid{display:grid;gap:14px;}
.footer small{color:rgba(233,238,251,.72);}
.footer .cols{display:grid;gap:14px;}
.footer .cols a{display:inline-flex;margin:6px 0;padding:8px 10px;border-radius:12px;border:1px solid rgba(233,238,251,.10);background:rgba(233,238,251,.04);}
.footer .cols a:hover{background:rgba(233,238,251,.08);}

.page-title{padding:18px 0 8px 0;}
.breadcrumb{font-size:.95rem;color:rgba(233,238,251,.76);}
.kpi-grid{display:grid;gap:12px;}
.kpi{padding:14px;border-radius:var(--radius);border:1px solid rgba(233,238,251,.12);background:rgba(233,238,251,.04);}
.kpi .label{color:rgba(233,238,251,.72);font-size:.92rem;}
.kpi .value{font-size:1.2rem;font-weight:760;margin-top:6px;}
.sep{border:none;height:1px;background:rgba(233,238,251,.10);margin:18px 0;}

@media (min-width:920px){
  .hero{padding:54px 0 16px 0;}
  .hero-grid{grid-template-columns:1.55fr .85fr;align-items:start;}
  .split{grid-template-columns:1.1fr .9fr;align-items:start;}
  .cards-3{grid-template-columns:repeat(3,1fr);}
  .kpi-grid{grid-template-columns:repeat(3,1fr);}
  .footer-grid{grid-template-columns:1.4fr .6fr;align-items:start;}
}
@media (max-width:919px){
  .nav,.header-cta{display:none;}
  .burger{display:grid;place-items:center;}
}


/* === UX FIX : FORM CONTRAST (Reservation page) === */
input, select, textarea {
  background: rgba(255,255,255,0.08);
  color: #ffffff;
}

input::placeholder,
textarea::placeholder {
  color: rgba(255,255,255,0.55);
}

select option {
  background: #0b1220;
  color: #ffffff;
}

label {
  color: rgba(255,255,255,0.9);
}