/* Couleurs des ambiances Jour et Nuit de l'app (ios/Dreamcase/Theme/AmbiancePalette.swift). */
:root {
  --feuille: #F6F1E7;
  --texte: #1B1F3B;
  --texte-2: #4A4F6E;
  --accent: #2E4A9E;
  --filet: #B8954A;
  --separateur: #D9D0BF;
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) {
  :root {
    --feuille: #0E1433;
    --texte: #F6F1E7;
    --texte-2: #B9BFDA;
    --accent: #F3C969;
    --filet: #A8873F;
    --separateur: #2A3360;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--feuille);
  color: var(--texte);
  font: 17px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}
header, nav, main { max-width: 720px; margin: 0 auto; padding: 0 16px; }
header {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-top: 24px; padding-bottom: 12px;
  border-bottom: 1px solid var(--filet);
}
.marque, h1, h2 { font-family: ui-serif, "New York", Georgia, serif; }
.marque { font-size: 22px; color: var(--texte); text-decoration: none; }
nav { display: flex; flex-wrap: wrap; gap: 4px 20px; padding-top: 12px; padding-bottom: 12px; }
nav a, .langue { color: var(--texte-2); text-decoration: none; padding: 10px 0; }
nav a[aria-current="page"] { color: var(--texte); text-decoration: underline; text-decoration-color: var(--filet); }
main { padding-bottom: 64px; }
h1 { font-size: 32px; line-height: 1.2; font-weight: 600; margin: 24px 0 8px; }
h2 { font-size: 21px; line-height: 1.3; font-weight: 600; margin: 32px 0 8px; }
p, ul { margin: 0 0 14px; }
ul { padding-left: 22px; }
li { margin-bottom: 6px; }
a { color: var(--accent); text-underline-offset: 2px; }
code { font: inherit; }
.tableau { overflow-x: auto; margin: 0 0 16px; }
table { border-collapse: collapse; width: 100%; font-size: 15px; }
th, td { text-align: left; vertical-align: top; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--separateur); }
th { color: var(--texte-2); font-weight: 600; border-bottom-color: var(--filet); }

/* Page d'accueil : le ciel du Soir, puis la feuille crème qui le recouvre (direction A du 2026-10-24). */
.accueil { background: #2A1F45; }
.accueil .ciel {
  background: #2A1F45 url(/images/ciel-soir.jpg) center top / cover no-repeat;
  color: #F6F1E7;
}
.accueil header {
  border: 0; max-width: 1080px; padding-top: 20px;
}
.accueil header .marque, .accueil header .langue { color: #F6F1E7; }
.une { max-width: 720px; margin: 0 auto; padding: 28px 16px 0; text-align: center; }
.une .icone { width: 88px; height: 88px; border-radius: 22px; box-shadow: 0 12px 32px rgba(20, 10, 40, .45); }
.une h1 {
  font-size: clamp(34px, 6.5vw, 58px); line-height: 1.08; font-weight: 600; margin: 18px 0 14px;
  text-shadow: 0 2px 18px rgba(30, 15, 60, .45);
}
.chapeau { font-size: clamp(17px, 2.2vw, 20px); line-height: 1.5; margin: 0 auto 24px; max-width: 560px; color: #F6F1E7; opacity: .95; }
.bouton {
  display: inline-block; min-height: 44px; padding: 13px 22px; border-radius: 14px;
  background: #F3C969; color: #2A1F45; font-weight: 600; text-decoration: none;
}
.bouton.bientot { cursor: default; }
.eventail {
  display: flex; justify-content: center; align-items: flex-end; gap: clamp(10px, 3vw, 28px);
  padding: 40px 16px 0; margin-bottom: -90px; position: relative; z-index: 1;
}
.telephone {
  margin: 0; flex: none; width: clamp(150px, 26vw, 250px);
  border-radius: clamp(22px, 4vw, 38px); overflow: hidden;
  border: clamp(4px, .8vw, 7px) solid #0b0b14; background: #0b0b14;
  box-shadow: 0 24px 50px rgba(20, 10, 40, .45);
}
.telephone img { display: block; width: 100%; height: auto; }
.eventail .gauche { transform: rotate(-6deg) translateY(18px); }
.eventail .droite { transform: rotate(6deg) translateY(18px); }
.eventail .centre { width: clamp(170px, 30vw, 290px); }
@media (max-width: 560px) {
  .eventail .gauche, .eventail .droite { display: none; }
  .eventail .centre { width: 230px; }
}
.feuille {
  max-width: none; padding: 130px 16px 24px; background: #F6F1E7; color: #1B1F3B;
  border-radius: 28px 28px 0 0;
}
.bloc {
  max-width: 980px; margin: 0 auto; padding: 48px 0;
  display: flex; align-items: center; gap: clamp(24px, 6vw, 72px);
  border-bottom: 1px solid #B8954A;
}
.bloc.inverse { flex-direction: row-reverse; }
.bloc .images { display: flex; gap: 16px; flex: none; }
.bloc .telephone { width: clamp(150px, 24vw, 250px); box-shadow: 0 18px 40px rgba(27, 31, 59, .22); }
.bloc .texte { flex: 1; }
.bloc h2 { font-size: clamp(28px, 4vw, 40px); margin: 0 0 12px; }
.bloc p { font-size: 19px; line-height: 1.55; color: #4A4F6E; margin: 0; max-width: 460px; }
@media (max-width: 720px) {
  .bloc, .bloc.inverse { flex-direction: column; text-align: center; padding: 40px 0; }
  .bloc .telephone { width: min(240px, 64vw); }
  .bloc .texte p { margin: 0 auto; }
}
.confiance { max-width: 980px; margin: 0 auto; padding: 56px 0 32px; }
.confiance h2 { font-size: clamp(28px, 4vw, 40px); margin: 0 0 20px; text-align: center; }
.registre { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 32px; }
.registre div { border-top: 1px solid #B8954A; padding: 16px 0; }
.registre h3 { font-family: ui-serif, "New York", Georgia, serif; font-size: 21px; font-weight: 600; margin: 0 0 6px; }
.registre p { margin: 0; color: #4A4F6E; }
.ciel.fin { background-position: center 70%; text-align: center; padding: 64px 16px; }
.fin-titre { font-family: ui-serif, "New York", Georgia, serif; font-size: clamp(28px, 4vw, 40px); margin: 0 0 20px; }
.accueil footer { background: #F6F1E7; color: #4A4F6E; text-align: center; padding: 28px 16px 40px; font-size: 15px; }
.accueil footer p { margin: 0 0 8px; }
.accueil footer a { color: #4A4F6E; }
@media (prefers-color-scheme: dark) {
  .feuille, .accueil footer { background: #0E1433; color: #F6F1E7; }
  .bloc p, .registre p, .accueil footer, .accueil footer a { color: #B9BFDA; }
  .bloc, .registre div { border-color: #A8873F; }
}
