/* Couche D0 — Design System SOTI RENCONTRE.
   Chargée après les autres feuilles : elle en reprend les jetons et les
   composants pour les aligner sur D0. Les valeurs viennent du D0 ; aucune
   ne s'invente ici. */

@font-face{font-family:"Playfair Display";src:url("assets/fonts/playfair-display-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("assets/fonts/playfair-display-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("assets/fonts/playfair-display-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("assets/fonts/playfair-display-latin-500-italic.woff2") format("woff2");font-weight:500;font-style:italic;font-display:swap}
/* Satoshi : déposer Satoshi-Variable.woff2 dans assets/fonts. En son absence,
   le repli prévu par D0 s'applique : Inter, puis la police du système. */

@font-face{font-family:"Inter";src:url("assets/fonts/inter-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url("assets/fonts/inter-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Inter";src:url("assets/fonts/inter-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}

:root{
  /* Primitives D0 */
  --cream-50:#FDF7ED;--cream-100:#F4EAD8;--cream-200:#EDE0C8;--cream-raised:#FFFCF7;
  --charcoal-900:#1A1A1A;--neutral-800:#2B2926;--neutral-700:#43403B;--neutral-600:#5E5A53;
  --neutral-500:#6B665E;--neutral-400:#8A847A;--neutral-300:#BDB6AB;--neutral-200:#D9D1C3;--neutral-100:#E9E1D2;
  --gold-500:#D4AF37;--gold-600:#C29D2C;--gold-650:#B38F28;--gold-700:#9A7A1E;--gold-200:#E8D7B1;
  --burgundy-500:#8B1E3F;--burgundy-600:#741833;--burgundy-050:#F7E9ED;
  --error:#C2330F;
  /* Jetons sémantiques */
  --background-primary:var(--cream-50);--background-secondary:var(--cream-100);
  --surface-default:var(--cream-raised);--surface-soft:var(--cream-200);
  --text-primary:var(--charcoal-900);--text-secondary:var(--neutral-600);--text-tertiary:var(--neutral-500);
  --action-primary:var(--gold-500);--action-primary-hover:var(--gold-600);--action-primary-pressed:var(--gold-650);
  --accent-emotional:var(--burgundy-500);--border-subtle:var(--neutral-100);--border-premium:var(--gold-200);
  --border-emphasis:var(--gold-700);--focus-ring:var(--charcoal-900);
  --radius-200:8px;--radius-300:12px;--radius-400:16px;--radius-500:20px;
  --elevation-1:0 1px 4px rgba(60,45,20,.08);--elevation-2:0 6px 18px rgba(60,45,20,.10);--elevation-3:0 16px 40px rgba(60,45,20,.14);
  --motion-fast:120ms;--motion-standard:180ms;--motion-emphasis:240ms;--ease-standard:cubic-bezier(.2,0,0,1);
  /* Rattachement des variables de la maquette */
  --paper:var(--cream-50);--ink:var(--charcoal-900);--wine:var(--burgundy-500);--muted:var(--neutral-600);
  --line:var(--neutral-100);--gold:var(--gold-500);--white:var(--cream-raised);
  --serif:"Playfair Display",Arial,serif;
  --sans:Inter,"Segoe UI",Arial,sans-serif;
}

body{background:var(--background-primary);color:var(--text-primary);font-family:var(--sans)}
p{color:var(--text-secondary)}
h1,h2,h3{font-family:var(--serif);font-weight:500;letter-spacing:-.01em;color:var(--text-primary)}
em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--accent-emotional)}
.eyebrow,.hero-copy>.eyebrow,.section-head .eyebrow{color:var(--accent-emotional);font-family:var(--sans)}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}

.preview{background:var(--background-secondary);color:var(--text-primary)}
.header{background:rgba(253,247,237,.96);border-bottom-color:var(--border-subtle)}
.brand>span,.brand small{font-family:var(--sans)}
.desktop-nav a:hover{color:var(--accent-emotional)}

/* Appel principal : or plat, texte noir, rayon 12 */
.button,.button.small,.hero-actions .button{background:var(--action-primary);color:var(--text-primary);border:1px solid var(--action-primary);border-radius:var(--radius-300);box-shadow:none;min-height:48px;transition:background var(--motion-fast) var(--ease-standard)}
.button:hover{background:var(--action-primary-hover);border-color:var(--action-primary-hover);color:var(--text-primary);box-shadow:none;transform:none}
.button:active{background:var(--action-primary-pressed);border-color:var(--action-primary-pressed)}
/* Action secondaire : crème et contour or profond */
.button.cream{background:var(--surface-default);color:var(--text-primary);border:1px solid var(--border-emphasis)}
.button.cream:hover{background:var(--surface-soft);color:var(--text-primary);border-color:var(--border-emphasis)}
/* Action tertiaire : lien bordeaux */
.text-link,.hero-actions .text-link{color:var(--accent-emotional);border-bottom-color:var(--accent-emotional)}
.text-link:hover{color:var(--burgundy-600)}
.status-dot,.opening .status-dot{background:var(--accent-emotional)}
.opening strong{color:var(--text-secondary)}

/* Composition de marque : crème, filet d'or, un accent bordeaux */
.hero-art{background:radial-gradient(ellipse at 30% 25%,#FFFCF7,transparent 60%),linear-gradient(140deg,var(--cream-100),var(--cream-200));border:1px solid var(--border-premium);border-radius:var(--radius-500);box-shadow:var(--elevation-2)}
.art-top{color:var(--neutral-600)}
.arch-front{background:linear-gradient(95deg,var(--burgundy-500),var(--burgundy-600));box-shadow:18px 5px 40px rgba(60,45,20,.18)}
.arch-back{box-shadow:18px 12px 32px rgba(60,45,20,.16)}
.art-seal{background:rgba(255,252,247,.92);color:var(--gold-700);border-color:var(--gold-700)}
.art-seal i{font-family:var(--serif);font-style:italic}
.art-bottom{color:var(--neutral-800)}
.art-cross{color:var(--gold-700)}
.principles{color:var(--text-secondary);border-color:var(--border-subtle)}
.principles i{color:var(--gold-700)}

/* Cartes signature : premium */
.path-card{background:var(--surface-default);color:var(--text-primary);border:1px solid var(--border-premium);border-radius:var(--radius-500);box-shadow:var(--elevation-2)}
.path-card:before{background:radial-gradient(380px circle at var(--pointer-x,50%) var(--pointer-y,0%),rgba(232,215,177,.35),transparent 75%)}
.path-card:hover{border-color:var(--border-emphasis);box-shadow:var(--elevation-3)}
.path-card .eyebrow{color:var(--accent-emotional)}
.path-card h3{color:var(--text-primary)}
.path-card>p,.path-card ul{color:var(--text-secondary)}
.path-card li:before{color:var(--gold-700)}
.card-number{font-family:var(--sans);color:var(--neutral-200);opacity:1}
.card-footer{border-top-color:var(--border-subtle)}
.tag{background:var(--burgundy-050);color:var(--burgundy-500);border-color:transparent;border-radius:999px}
.round-link{background:var(--action-primary);border-color:var(--action-primary);color:var(--text-primary)}
.round-link:hover{background:var(--action-primary-hover);transform:none}

/* Mise en avant de la première application */
.launch{background:var(--background-secondary);color:var(--text-primary)}
.launch h2{color:var(--text-primary)}
.launch em{color:var(--accent-emotional)}
.launch-copy>p:not(.eyebrow),.launch-copy>.muted-light,.launch-copy small{color:var(--text-secondary)!important}
.light{border-color:var(--border-emphasis);color:var(--gold-700)}
.launch-symbol{color:var(--gold-700)}
.launch-caption{color:var(--text-tertiary)}
.orbital{border-color:var(--gold-200);box-shadow:none}
.gold{color:var(--gold-700)}

.steps article{border-top-color:var(--border-premium)}
.steps article>span{font-family:var(--sans);color:var(--gold-700)}
.method-note{background:var(--background-secondary);border-radius:var(--radius-400)}
.method-note>span{color:var(--gold-700)}
.maison .large-copy{font-family:var(--serif);color:var(--neutral-800)}

.guide-art{border-radius:var(--radius-400)}
.art-choice{background:var(--cream-200)}
.art-choice i{background:linear-gradient(100deg,#B38F28,#E8D7B1)}
.art-choice i+i{background:linear-gradient(100deg,var(--burgundy-500),var(--burgundy-600))}
.art-steps{background:var(--cream-100)}
.art-steps i{background:linear-gradient(var(--gold-200),var(--gold-500))}
.art-circle{background:var(--burgundy-050)}
.art-circle i{border-color:var(--gold-700);box-shadow:none}

.faq-list summary:after,summary:after{font-family:var(--sans);color:var(--accent-emotional)}
input,select{background:var(--surface-default);border:1px solid var(--neutral-400);border-radius:var(--radius-200);color:var(--text-primary)}
input::placeholder{color:var(--text-tertiary)}

.invitation{background:var(--background-secondary);color:var(--text-primary);border:1px solid var(--border-premium);border-radius:var(--radius-500)}
.invitation .eyebrow{color:var(--accent-emotional)}
.invitation em{color:var(--accent-emotional)}
.invitation p:not(.eyebrow){color:var(--text-secondary)}
.invitation-line{border-color:var(--gold-200)}

.footer{background:var(--background-secondary);color:var(--text-primary)}
.footer p{color:var(--text-secondary)}
.footer-bottom{color:var(--text-tertiary);border-color:var(--neutral-200)}

dialog{background:var(--background-primary);border-color:var(--border-subtle);border-radius:var(--radius-500);box-shadow:var(--elevation-3)}
.close{background:var(--surface-default);color:var(--text-primary);border-color:var(--neutral-300)}
.demo-notice{background:var(--background-secondary);border-radius:var(--radius-200)}
.choice{border-color:var(--neutral-300);border-radius:var(--radius-300)}
.choice:has(input:checked),.orientation-choices .choice[aria-pressed=true]{border-color:var(--accent-emotional);background:var(--burgundy-050)}
.choice input,.check-news input{accent-color:var(--accent-emotional)}
.error{color:var(--error)}
.cursor-halo{border-color:var(--gold-700);background:rgba(232,215,177,.18)}
.mobile-menu nav{font-family:var(--serif);font-weight:500}

@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* Téléphone : une seule colonne pour l'accroche, comme le prévoit la grille D0 */
@media (max-width:760px){.hero{grid-template-columns:1fr}.hero-art{height:385px}}
.art-bottom>span:first-child{background:rgba(255,252,247,.92);padding:10px 14px;border-radius:var(--radius-300);box-shadow:var(--elevation-1)}
