/* California Collection : feuille de style commune (page d'attente, mentions légales, 404) */
/* police maison : ses chiffres ne servent jamais (29/10) ; unicode-range les exclut, ils passent en Playfair (police suivante) */
@font-face{font-family:"California Display";src:url("fonts/california-display.woff2") format("woff2");font-display:swap;unicode-range:U+0000-002F,U+003A-10FFFF}
@font-face{font-family:"Playfair Display";src:url("fonts/playfair.woff2") format("woff2");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("fonts/playfair-italic.woff2") format("woff2");font-weight:400 900;font-style:italic;font-display:swap}
@font-face{font-family:"Jost";src:url("fonts/jost.woff2") format("woff2");font-weight:100 900;font-display:swap}

/* Une seule encre : Basalte. Cognac pour les petits repères. Le bleu ne vient que des photos. */
:root{
  --ecume:#F1EEE6; --sable:#BFAA8A; --cognac:#80582F; --basalte:#342019;
  --ink:var(--basalte); --ink-soft:rgba(52,32,25,.72); --line:rgba(52,32,25,.14);
  --pad:max(20px,4.4vw); --hd:80px;
  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;
  --cal:"California Display","Playfair Display",Georgia,serif;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ecume);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit}
p,h1,h2,h3,figure,ul{margin:0}
ul{padding:0;list-style:none}
h1,h2,h3{font-weight:400}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid var(--cognac);outline-offset:3px}
.kicker{display:block;font-size:12px;line-height:1.4;letter-spacing:.08em;text-transform:uppercase;color:var(--cognac)}
.cal{font-family:var(--cal);font-weight:400;text-transform:uppercase;letter-spacing:.01em}

/* Page d'attente (29/10, refaite) : fond Basalte uni, encre Écume en trois intensités, logo et typographie seuls */
html:has(body.attente){overflow:hidden;background:var(--basalte)}
body.attente{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100svh;overflow:hidden;background:var(--basalte);color:var(--ecume);
  padding:max(clamp(20px,3.4vh,40px),env(safe-area-inset-top,0px)) max(clamp(20px,3.2vw,48px),env(safe-area-inset-right,0px)) max(clamp(20px,3.4vh,40px),env(safe-area-inset-bottom,0px)) max(clamp(20px,3.2vw,48px),env(safe-area-inset-left,0px))}
.marge{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;font-size:11px;line-height:1.4;letter-spacing:.2em;text-transform:uppercase;color:rgba(241,238,230,.62)}
.marge .m-l{justify-self:start}
.marge .m-r{justify-self:end}
.marge a{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;padding-bottom:2px;transition:color .4s var(--ease),background-size .5s var(--ease)}
.marge a:hover{color:var(--ecume);background-size:100% 1px}
.marge .poincon{display:block;height:clamp(34px,5.4vh,48px);width:auto;color:var(--ecume)}
.coeur{display:grid;place-content:center;justify-items:center;text-align:center;min-height:0}
.coeur .logo{display:block;width:min(680px,46vw,calc(30svh * 3.24));height:auto;color:var(--ecume)}
.coeur .filet{display:block;width:56px;height:1px;margin:clamp(30px,5.4vh,52px) 0 clamp(22px,3.6vh,32px);background:rgba(241,238,230,.36);transform-origin:50% 50%}
.coeur .ligne{font-family:var(--serif);font-size:clamp(14px,1.9vh,17px);line-height:1.3;letter-spacing:.24em;margin-right:-.24em;text-transform:uppercase;color:rgba(241,238,230,.88)}
.coeur .bientot{margin-top:clamp(34px,6.2vh,60px);font-family:var(--serif);font-style:italic;font-size:clamp(16px,2.2vh,20px);line-height:1.3;color:rgba(241,238,230,.62)}
/* apparition lente : le logo, puis le filet qui se trace, puis les textes, puis les marges */
.motion .coeur .logo{animation:attente-monte 1.8s var(--ease) .2s both}
.motion .coeur .filet{animation:attente-trace 1.1s var(--ease) 1s both}
.motion .coeur .ligne{animation:attente-fondu 1.4s var(--ease) 1.25s both}
.motion .coeur .bientot{animation:attente-fondu 1.4s var(--ease) 1.6s both}
.motion .marge{animation:attente-fondu 1.6s var(--ease) 1.9s both}
@keyframes attente-monte{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes attente-trace{from{transform:scaleX(0)}to{transform:none}}
@keyframes attente-fondu{from{opacity:0}to{opacity:1}}

/* Barre du haut (mentions légales) */
.hd{position:fixed;inset:0 0 auto 0;z-index:10;height:calc(var(--hd) + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) max(var(--pad),env(safe-area-inset-right,0px)) 0 max(var(--pad),env(safe-area-inset-left,0px));display:grid;grid-template-columns:1fr auto 1fr;align-items:center;transition:background-color .6s var(--ease),border-color .6s var(--ease),height .5s var(--ease);border-bottom:1px solid transparent}
.hd.solid{--hd:64px;background:rgba(241,238,230,.82);-webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);border-bottom-color:var(--line)}
.hd-l{font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.hd-cc{display:block;height:48px;transition:height .5s var(--ease)}
.hd.solid .hd-cc{height:40px}
.hd-cc img{height:100%;width:auto}
.hd-r{justify-self:end;font-size:12px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;padding:12px 0;background:linear-gradient(currentColor,currentColor) 0 calc(100% - 9px)/0 1px no-repeat;transition:background-size .45s var(--ease),color .3s}
.hd-r:hover{background-size:100% 1px;color:var(--cognac)}

/* Pied de page (mentions légales) */
.ft{display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;padding:24px max(var(--pad),env(safe-area-inset-right,0px)) calc(28px + env(safe-area-inset-bottom,0px)) max(var(--pad),env(safe-area-inset-left,0px));border-top:1px solid var(--line);font-size:13px;color:var(--ink-soft)}
.ft a{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:2px}
.ft a:hover{color:var(--cognac)}

/* Mentions légales */
.legal{max-width:760px;margin:0 auto;padding:calc(var(--hd) + 64px + env(safe-area-inset-top,0px)) max(var(--pad),env(safe-area-inset-right,0px)) 96px max(var(--pad),env(safe-area-inset-left,0px))}
.legal h1{font-family:var(--cal);text-transform:uppercase;font-size:clamp(34px,4vw,52px);line-height:1;margin:14px 0 40px}
.legal h2{font-family:var(--serif);font-size:22px;margin:36px 0 10px}
.legal p,.legal li{color:var(--ink-soft)}
.legal p+p{margin-top:10px}
.legal a{color:var(--ink)}

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

/* Téléphone */
@media (max-width:720px){
  :root{--hd:62px}
  .hd.solid{--hd:56px}
  .hd-cc,.hd.solid .hd-cc{height:36px}
  .coeur .logo{width:min(82vw,calc(30svh * 3.24))}
  .marge{font-size:10px;letter-spacing:.16em;gap:12px}
  .marge.bas{grid-template-columns:1fr;justify-items:center;gap:8px}
  .marge.bas .m-l,.marge.bas .m-r{justify-self:center}
  .marge.bas .m-c{display:none}
  .ft{flex-direction:column;align-items:center;text-align:center}
}