/* ══════════════════════════════
   VARIABLES & RESET
══════════════════════════════ */
:root {
  --bleu: #1a3a5c;
  --bleu-clair: #2d6a9f;
  --or: #c8973a;
  --or-clair: #f0c96e;
  --creme: #faf7f2;
  --gris: #f2ede6;
  --texte: #1e1e1e;
  --texte-doux: #4a4a4a;
  --blanc: #ffffff;
  --ombre: 0 4px 24px rgba(26,58,92,0.10);
  --ombre-forte: 0 12px 40px rgba(26,58,92,0.18);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family:'DM Sans',sans-serif;
  background:var(--creme);
  color:var(--texte);
  line-height:1.7;
}

/* ══════════════════════════════
   NAVIGATION
══════════════════════════════ */
.navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(26,58,92,0.97); backdrop-filter:blur(10px);
  padding:0 40px; display:flex; align-items:center; justify-content:space-between;
  height:68px; box-shadow:0 2px 20px rgba(0,0,0,0.2);
  transition:all 0.3s;
}
.nav-logo {
  font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:900;
  color:var(--blanc); text-decoration:none; letter-spacing:-0.5px; cursor:pointer;
}
.nav-logo span { color:var(--or-clair); }
.nav-links { display:flex; gap:6px; align-items:center; }
.nav-link {
  color:rgba(255,255,255,0.7); text-decoration:none; font-size:0.88rem;
  font-weight:500; padding:8px 16px; border-radius:8px; transition:all 0.2s;
  cursor:pointer; border:none; background:transparent; font-family:'DM Sans',sans-serif;
}
.nav-link:hover, .nav-link.active { color:#fff; background:rgba(255,255,255,0.1); }
.nav-cta {
  background:var(--or); color:var(--bleu) !important; font-weight:700 !important;
  border-radius:30px !important; padding:9px 22px !important;
}
.nav-cta:hover { background:var(--or-clair) !important; color:var(--bleu) !important; }
.nav-burger {
  display:none; flex-direction:column; gap:5px; cursor:pointer;
  background:transparent; border:none; padding:4px;
}
.nav-burger span { width:24px; height:2px; background:#fff; border-radius:2px; transition:all 0.3s; }
.mobile-menu {
  display:none; position:fixed; top:68px; left:0; right:0; z-index:999;
  background:var(--bleu); padding:20px; flex-direction:column; gap:4px;
  box-shadow:0 10px 30px rgba(0,0,0,0.3);
}
.mobile-menu.open { display:flex; }
.mobile-link {
  color:rgba(255,255,255,0.8); text-decoration:none; font-size:1rem;
  font-weight:500; padding:12px 16px; border-radius:8px; transition:all 0.2s;
  cursor:pointer; border:none; background:transparent; font-family:'DM Sans',sans-serif;
  text-align:left;
}
.mobile-link:hover { background:rgba(255,255,255,0.1); color:#fff; }

/* ══════════════════════════════
   PAGES
══════════════════════════════ */
.page { display:none; padding-top:68px; min-height:100vh; }
.page.active { display:block; }

/* ══════════════════════════════
   PAGE ACCUEIL — HERO
══════════════════════════════ */
.hero {
  background:var(--bleu); color:var(--blanc); min-height:calc(100vh - 68px);
  display:flex; align-items:center; position:relative; overflow:hidden;
  padding:60px 40px;
}
.hero::before {
  content:''; position:absolute; width:700px; height:700px; border-radius:50%;
  border:90px solid rgba(200,151,58,0.08); top:-250px; right:-200px;
}
.hero::after {
  content:''; position:absolute; width:400px; height:400px; border-radius:50%;
  border:60px solid rgba(200,151,58,0.06); bottom:-150px; left:-100px;
}
.hero-inner {
  max-width:1100px; margin:0 auto; width:100%;
  display:grid; grid-template-columns:1fr 1fr; gap:60px;
  align-items:center; position:relative; z-index:1;
}
.hero-badge {
  display:inline-block; background:var(--or); color:var(--bleu);
  font-weight:700; font-size:0.72rem; letter-spacing:3px; text-transform:uppercase;
  padding:6px 20px; border-radius:30px; margin-bottom:24px;
}
.hero h1 {
  font-family:'Playfair Display',serif; font-size:clamp(2.2rem,5vw,3.8rem);
  font-weight:900; line-height:1.08; margin-bottom:20px; letter-spacing:-1px;
}
.hero h1 span { color:var(--or-clair); }
.hero-desc {
  font-size:1.05rem; color:rgba(255,255,255,0.75); font-weight:300;
  line-height:1.75; margin-bottom:36px; max-width:480px;
}
.hero-btns { display:flex; gap:14px; flex-wrap:wrap; }

/* Boutons */
.btn-primary {
  background:var(--or); color:var(--bleu); font-weight:700; font-size:0.95rem;
  padding:14px 32px; border-radius:40px; text-decoration:none; border:none;
  cursor:pointer; font-family:'DM Sans',sans-serif; transition:all 0.25s;
  box-shadow:0 8px 24px rgba(200,151,58,0.35); letter-spacing:0.3px;
}
.btn-primary:hover {
  background:var(--or-clair); transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(200,151,58,0.45);
}
.btn-secondary {
  background:transparent; color:var(--blanc); font-weight:600; font-size:0.95rem;
  padding:14px 32px; border-radius:40px; text-decoration:none;
  border:2px solid rgba(255,255,255,0.3); cursor:pointer;
  font-family:'DM Sans',sans-serif; transition:all 0.25s;
}
.btn-secondary:hover { border-color:var(--or-clair); color:var(--or-clair); }

/* Hero card */
.hero-card {
  background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.12);
  border-radius:20px; padding:36px; backdrop-filter:blur(10px);
}
.hero-card h3 {
  font-family:'Playfair Display',serif; font-size:1.1rem;
  margin-bottom:20px; color:var(--or-clair);
}
.hero-stat {
  display:flex; align-items:center; gap:16px; padding:14px 0;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.hero-stat:last-child { border-bottom:none; }
.hero-stat-icon { font-size:1.6rem; flex-shrink:0; }
.hero-stat-text strong { display:block; font-size:0.95rem; font-weight:600; }
.hero-stat-text span { font-size:0.82rem; color:rgba(255,255,255,0.6); }

/* Scroll hint */
.scroll-hint {
  position:absolute; bottom:30px; left:50%; transform:translateX(-50%);
  z-index:1; text-align:center; color:rgba(255,255,255,0.4);
  font-size:0.75rem; letter-spacing:1px;
}
.scroll-hint::after {
  content:'↓'; display:block; font-size:1.2rem; margin-top:4px;
  animation:bounce 2s infinite;
}
@keyframes bounce {
  0%,100% { transform:translateY(0); }
  50%      { transform:translateY(6px); }
}

/* ══════════════════════════════
   SECTIONS COMMUNES
══════════════════════════════ */
section { padding:80px 40px; }
.section-inner { max-width:1100px; margin:0 auto; }
.section-badge {
  display:inline-block; background:var(--or); color:var(--bleu);
  font-weight:700; font-size:0.7rem; letter-spacing:3px; text-transform:uppercase;
  padding:5px 16px; border-radius:30px; margin-bottom:18px;
}
.section-title {
  font-family:'Playfair Display',serif; font-size:clamp(1.8rem,4vw,2.6rem);
  color:var(--bleu); font-weight:900; line-height:1.15; margin-bottom:10px;
}
.section-title span { color:var(--or); }
.ligne-or { width:50px; height:3px; background:var(--or); border-radius:2px; margin:14px 0 20px; }
.section-sub {
  color:var(--texte-doux); font-size:1rem; font-weight:300;
  max-width:580px; margin-bottom:50px;
}

/* ══════════════════════════════
   PHILOSOPHIE
══════════════════════════════ */
.philo-bg { background:var(--blanc); }
.philo-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:24px; }
.philo-card {
  background:var(--creme); border-radius:16px; padding:30px 26px;
  border-left:4px solid var(--or); transition:transform 0.2s;
}
.philo-card:hover { transform:translateY(-4px); }
.philo-icon { font-size:2rem; margin-bottom:14px; }
.philo-card h3 { font-family:'Playfair Display',serif; color:var(--bleu); font-size:1.05rem; margin-bottom:8px; }
.philo-card p { font-size:0.88rem; color:var(--texte-doux); line-height:1.65; }

/* ══════════════════════════════
   TÉMOIGNAGES
══════════════════════════════ */
.temoignages-bg { background:var(--bleu); }
.temoignages-bg .section-title { color:var(--blanc); }
.temoignages-bg .section-title span { color:var(--or-clair); }
.temoignages-bg .section-sub { color:rgba(255,255,255,0.6); }
.temoignages-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; }
.temoignage-card {
  background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.12);
  border-radius:16px; padding:28px; transition:transform 0.2s;
}
.temoignage-card:hover { transform:translateY(-3px); }
.temoignage-stars { color:var(--or-clair); font-size:1rem; margin-bottom:14px; letter-spacing:2px; }
.temoignage-text {
  font-size:0.9rem; color:rgba(255,255,255,0.8); line-height:1.7;
  font-style:italic; margin-bottom:18px;
}
.temoignage-author { display:flex; align-items:center; gap:12px; }
.temoignage-avatar {
  width:40px; height:40px; border-radius:50%;
  background:var(--or); display:flex; align-items:center; justify-content:center;
  font-weight:700; color:var(--bleu); font-size:0.9rem; flex-shrink:0;
}
.temoignage-name strong { display:block; font-size:0.88rem; color:#fff; }
.temoignage-name span { font-size:0.78rem; color:rgba(255,255,255,0.5); }

/* ══════════════════════════════
   CTA ACCUEIL
══════════════════════════════ */
.cta-home {
  background:linear-gradient(135deg, var(--or), var(--or-clair));
  text-align:center; padding:80px 40px;
}
.cta-home h2 {
  font-family:'Playfair Display',serif; font-size:clamp(1.8rem,4vw,2.6rem);
  color:var(--bleu); margin-bottom:14px;
}
.cta-home p {
  color:var(--bleu); opacity:0.8; margin-bottom:36px;
  font-size:1rem; max-width:500px; margin-left:auto; margin-right:auto;
}

/* ══════════════════════════════
   PAGE HERO (formules & résa)
══════════════════════════════ */
.page-hero {
  background:var(--bleu); color:var(--blanc); padding:70px 40px 60px;
  position:relative; overflow:hidden;
}
.page-hero::before {
  content:''; position:absolute; width:400px; height:400px; border-radius:50%;
  border:60px solid rgba(200,151,58,0.10); top:-150px; right:-100px;
}
.page-hero::after {
  content:''; position:absolute; width:250px; height:250px; border-radius:50%;
  border:40px solid rgba(200,151,58,0.07); bottom:-100px; left:-60px;
}
.page-hero-inner { max-width:1100px; margin:0 auto; position:relative; z-index:1; }
.page-hero h1 {
  font-family:'Playfair Display',serif; font-size:clamp(2rem,5vw,3rem);
  font-weight:900; margin-bottom:12px;
}
.page-hero h1 span { color:var(--or-clair); }
.page-hero p { color:rgba(255,255,255,0.7); font-weight:300; font-size:1rem; max-width:560px; }

/* ══════════════════════════════
   FORMULES
══════════════════════════════ */
.formules-section { padding:70px 40px; }
.formules-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:28px; }
.formule-card {
  background:var(--blanc); border-radius:20px; overflow:hidden;
  box-shadow:var(--ombre); display:flex; flex-direction:column;
  transition:transform 0.25s, box-shadow 0.25s;
}
.formule-card:hover { transform:translateY(-6px); box-shadow:var(--ombre-forte); }
.formule-card.vedette { border:2.5px solid var(--or); transform:scale(1.02); }
.formule-card.vedette:hover { transform:scale(1.02) translateY(-6px); }
.formule-header { background:var(--bleu); color:var(--blanc); padding:28px 26px 22px; position:relative; }
.formule-card.vedette .formule-header { background:linear-gradient(135deg,var(--bleu),var(--bleu-clair)); }
.formule-niveau {
  font-size:0.62rem; letter-spacing:3px; text-transform:uppercase;
  color:var(--or-clair); margin-bottom:6px; font-weight:600;
}
.formule-emoji { font-size:1.8rem; margin-bottom:10px; display:block; }
.formule-header h3 { font-family:'Playfair Display',serif; font-size:1.35rem; }
.badge-vedette {
  position:absolute; top:16px; right:16px;
  background:var(--or); color:var(--bleu); font-size:0.6rem; font-weight:800;
  letter-spacing:2px; text-transform:uppercase; padding:4px 10px; border-radius:20px;
}
.formule-tarif { padding:18px 26px; border-bottom:1px solid var(--gris); background:#fefefe; }
.tarif-principal { font-size:2rem; font-weight:700; color:var(--bleu); }
.tarif-detail { font-size:0.79rem; color:var(--texte-doux); margin-top:3px; }
.tarif-pack { font-size:0.8rem; color:var(--or); font-weight:600; margin-top:5px; }
.formule-body { padding:22px 26px; flex:1; }
.formule-body ul { list-style:none; }
.formule-body ul li {
  padding:7px 0; font-size:0.87rem; color:var(--texte-doux);
  display:flex; align-items:flex-start; gap:10px;
  border-bottom:1px dashed #ece8e0;
}
.formule-body ul li:last-child { border-bottom:none; }
.formule-body ul li::before { content:'✓'; color:var(--or); font-weight:700; flex-shrink:0; margin-top:1px; }
.formule-footer { padding:20px 26px; }
.btn-formule {
  display:block; text-align:center; background:var(--bleu); color:var(--blanc);
  padding:13px; border-radius:10px; font-weight:600; font-size:0.9rem;
  text-decoration:none; border:none; cursor:pointer; font-family:'DM Sans',sans-serif;
  width:100%; transition:background 0.2s;
}
.btn-formule:hover { background:var(--bleu-clair); }
.formule-card.vedette .btn-formule { background:var(--or); color:var(--bleu); }
.formule-card.vedette .btn-formule:hover { background:var(--or-clair); }

/* ══════════════════════════════
   TABLEAU COMPARATIF
══════════════════════════════ */
.comparatif-section { background:var(--blanc); padding:70px 40px; }
.tableau-wrap { overflow-x:auto; margin-top:40px; }
table.comp {
  width:100%; border-collapse:collapse; font-size:0.87rem;
  background:var(--blanc); border-radius:16px; overflow:hidden;
  box-shadow:var(--ombre);
}
table.comp thead { background:var(--bleu); color:var(--blanc); }
table.comp thead th { padding:16px 18px; text-align:center; font-weight:600; font-size:0.8rem; }
table.comp thead th:first-child { text-align:left; }
table.comp tbody tr { border-bottom:1px solid #ece8e0; }
table.comp tbody tr:last-child { border-bottom:none; }
table.comp tbody tr:nth-child(even) { background:#faf8f4; }
table.comp tbody td { padding:13px 18px; color:var(--texte-doux); text-align:center; }
table.comp tbody td:first-child { text-align:left; color:var(--texte); font-weight:500; }
.check { color:var(--or); font-size:1.1rem; font-weight:700; }
.cross { color:#ccc; }
.partiel { color:var(--bleu-clair); font-size:0.78rem; font-weight:600; }

/* ══════════════════════════════
   INFOS COMPLÉMENTAIRES
══════════════════════════════ */
.infos-section { padding:70px 40px; background:var(--gris); }
.infos-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; }
.info-card {
  background:var(--blanc); border-radius:16px; padding:30px 26px;
  box-shadow:var(--ombre); border-top:4px solid var(--bleu);
}
.info-card.or { border-top-color:var(--or); }
.info-card h3 { font-family:'Playfair Display',serif; color:var(--bleu); font-size:1.1rem; margin-bottom:14px; }
.info-card ul { list-style:none; }
.info-card ul li {
  font-size:0.87rem; color:var(--texte-doux); padding:6px 0;
  display:flex; gap:8px; align-items:flex-start;
  border-bottom:1px dashed #ece8e0;
}
.info-card ul li:last-child { border-bottom:none; }

/* ══════════════════════════════
   PAGE RÉSERVATION
══════════════════════════════ */
.reservation-section { padding:60px 40px; }
.reservation-inner { max-width:1100px; margin:0 auto; }
.reservation-layout { display:grid; grid-template-columns:1fr 2fr; gap:40px; align-items:start; }
.resa-info { position:sticky; top:90px; }
.resa-info-card {
  background:var(--blanc); border-radius:16px; padding:30px 26px;
  box-shadow:var(--ombre); margin-bottom:20px;
}
.resa-info-card h3 { font-family:'Playfair Display',serif; color:var(--bleu); font-size:1.1rem; margin-bottom:16px; }
.resa-step { display:flex; gap:14px; align-items:flex-start; margin-bottom:16px; }
.resa-step:last-child { margin-bottom:0; }
.resa-step-num {
  background:var(--or); color:var(--bleu); border-radius:50%;
  width:30px; height:30px; min-width:30px;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:0.82rem;
}
.resa-step-text strong { display:block; font-size:0.9rem; color:var(--texte); margin-bottom:2px; }
.resa-step-text span { font-size:0.82rem; color:var(--texte-doux); }
.resa-contact {
  background:var(--bleu); border-radius:16px; padding:26px;
  color:var(--blanc); text-align:center;
}
.resa-contact h4 { font-family:'Playfair Display',serif; font-size:1rem; margin-bottom:8px; }
.resa-contact p { font-size:0.84rem; color:rgba(255,255,255,0.7); margin-bottom:16px; }
.resa-contact a {
  display:inline-block; background:var(--or); color:var(--bleu);
  padding:10px 24px; border-radius:30px; font-weight:700; font-size:0.85rem;
  text-decoration:none; transition:background 0.2s;
}
.resa-contact a:hover { background:var(--or-clair); }

/* SimplyBook */
.simplybook-container {
  background:var(--blanc); border-radius:16px; overflow:hidden;
  box-shadow:var(--ombre); border:1px solid #e0dbd2;
}
.simplybook-header {
  background:var(--bleu); padding:20px 26px;
  display:flex; align-items:center; gap:14px;
}
.simplybook-header h3 { font-family:'Playfair Display',serif; color:var(--blanc); font-size:1.1rem; }
.simplybook-badge {
  margin-left:auto; background:var(--or); color:var(--bleu); font-size:0.65rem;
  font-weight:800; letter-spacing:1.5px; text-transform:uppercase;
  padding:4px 10px; border-radius:20px;
}
.simplybook-frame { width:100%; height:700px; border:none; display:block; }
.simplybook-placeholder { padding:60px 40px; text-align:center; }
.simplybook-placeholder .placeholder-icon { font-size:3rem; margin-bottom:20px; }
.simplybook-placeholder h4 {
  font-family:'Playfair Display',serif; color:var(--bleu);
  font-size:1.3rem; margin-bottom:12px;
}
.simplybook-placeholder p {
  color:var(--texte-doux); font-size:0.9rem;
  max-width:420px; margin:0 auto 24px; line-height:1.65;
}
.simplybook-steps { text-align:left; max-width:480px; margin:0 auto 30px; }
.simplybook-step-item {
  display:flex; gap:14px; padding:10px 0;
  border-bottom:1px dashed #e0dbd2; font-size:0.87rem; color:var(--texte-doux);
}
.simplybook-step-item:last-child { border-bottom:none; }
.simplybook-step-item .step-n {
  background:var(--bleu); color:#fff; border-radius:50%;
  width:26px; height:26px; min-width:26px;
  display:flex; align-items:center; justify-content:center;
  font-size:0.75rem; font-weight:700; flex-shrink:0;
}
.code-block {
  background:#1e2d3d; color:#a8d8ea; border-radius:10px;
  padding:20px 24px; font-family:monospace; font-size:0.82rem;
  text-align:left; max-width:500px; margin:0 auto 20px;
  line-height:1.8; overflow-x:auto;
}
.code-block .comment { color:#6a9fb5; }
.code-block .attr { color:var(--or-clair); }
.code-block .val { color:#98d8c8; }

/* ══════════════════════════════
   FOOTER
══════════════════════════════ */
footer {
  background:#0e1f30; color:rgba(255,255,255,0.5);
  padding:50px 40px 30px;
}
.footer-inner { max-width:1100px; margin:0 auto; }
.footer-top {
  display:grid; grid-template-columns:1.5fr 1fr 1fr;
  gap:40px; margin-bottom:40px;
}
.footer-brand .logo {
  font-family:'Playfair Display',serif; font-size:1.5rem;
  color:#fff; font-weight:900; margin-bottom:12px;
}
.footer-brand .logo span { color:var(--or-clair); }
.footer-brand p { font-size:0.85rem; line-height:1.7; max-width:280px; }
.footer-col h4 {
  color:#fff; font-size:0.78rem; letter-spacing:2px;
  text-transform:uppercase; margin-bottom:16px; font-weight:600;
}
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:8px; }
.footer-col ul li button,
.footer-col ul li a {
  color:rgba(255,255,255,0.5); font-size:0.85rem; text-decoration:none;
  background:transparent; border:none; cursor:pointer;
  font-family:'DM Sans',sans-serif; padding:0; transition:color 0.2s; text-align:left;
}
.footer-col ul li button:hover,
.footer-col ul li a:hover { color:var(--or-clair); }
.footer-bottom {
  border-top:1px solid rgba(255,255,255,0.08); padding-top:24px;
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:10px;
}
.footer-bottom p { font-size:0.8rem; }
.footer-bottom strong { color:var(--or-clair); }
.footer-badge {
  background:rgba(200,151,58,0.15); border:1px solid rgba(200,151,58,0.3);
  color:var(--or-clair); font-size:0.72rem; padding:4px 12px;
  border-radius:20px; font-weight:600;
}

/* ══════════════════════════════
   RESPONSIVE
══════════════════════════════ */
@media(max-width:900px) {
  .hero-inner { grid-template-columns:1fr; gap:40px; }
  .hero-card { display:none; }
  .reservation-layout { grid-template-columns:1fr; }
  .resa-info { position:static; }
  .footer-top { grid-template-columns:1fr; }
  .scroll-hint { display:none; }
}
@media(max-width:680px) {
  .navbar { padding:0 20px; }
  .nav-links { display:none; }
  .nav-burger { display:flex; }
  .hero { padding:40px 20px; min-height:auto; padding-bottom:60px; }
  section,
  .formules-section,
  .comparatif-section,
  .infos-section,
  .reservation-section { padding:50px 20px; }
  .page-hero { padding:50px 20px; }
  footer { padding:40px 20px 24px; }
  .cta-home { padding:60px 20px; }
  .scroll-hint { display:none; }

}
