/* Charte OBS (numérique, provisoire) : crème et noir du logo, taupe et rose clair des visuels Instagram, filet argenté.
   Mise en page : une colonne éditoriale, carte des soins comme une carte de salon, résultats en polaroïds comme sur Instagram. */
:root{
  --paper:#F7F2EC;      /* crème du logo */
  --paper-2:#F0E6E1;    /* crème rosé, surfaces */
  --card:#FFFFFF;       /* polaroïds */
  --ink:#1F1F1F;        /* noir du logo */
  --muted:#6E625B;      /* texte secondaire */
  --line:#E2D8D1;       /* filets */
  --silver:#BDBAB6;     /* cercle argenté */
  --taupe:#A3846F;      /* fond des visuels Instagram */
  --taupe-ink:#7E604E;  /* taupe lisible sur crème, rosé et blanc (≥ 4,5:1) */
  --taupe-fond:#86675A; /* taupe des bandeaux qui portent du texte crème (≥ 4,5:1) */
  --on-taupe:#FBF7F3;
  --accent:#1F1F1F;     /* boutons noirs, comme le logo */
  --on-accent:#F7F2EC;
  --todo:#9A5B2E;
  --display:"Inter","Helvetica Neue",Arial,system-ui,sans-serif;
  --serif:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;
  --body:"Inter","Helvetica Neue",Arial,system-ui,sans-serif;
  --measure:62ch;
  --gutter:clamp(16px,5vw,40px);
  --wide:1080px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#191716;--paper-2:#221E1C;--card:#2A2523;--ink:#F2ECE6;--muted:#B5A9A0;--line:#36302C;--silver:#6F6B67;--taupe:#7E6453;--taupe-ink:#CDAE97;--on-taupe:#FBF7F3;--accent:#F2ECE6;--on-accent:#191716;--todo:#E0A57A;color-scheme:dark}}
:root[data-theme="dark"]{--paper:#191716;--paper-2:#221E1C;--card:#2A2523;--ink:#F2ECE6;--muted:#B5A9A0;--line:#36302C;--silver:#6F6B67;--taupe:#7E6453;--taupe-ink:#CDAE97;--on-taupe:#FBF7F3;--accent:#F2ECE6;--on-accent:#191716;--todo:#E0A57A;color-scheme:dark}

*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-weight:400;font-size:16px;line-height:1.6}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:500;letter-spacing:-.02em;line-height:1.1;margin:0;text-wrap:balance}
p{margin:0}
.page{max-width:760px;margin:0 auto;padding-inline:var(--gutter);padding-block:32px 64px;display:flex;flex-direction:column;gap:18px}
.marque{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--serif);font-weight:400;font-size:22px;letter-spacing:-.035em;line-height:1}
.marque em{font-style:italic;margin-left:.06em}
.marque img{width:40px;height:40px;border-radius:50%;box-shadow:0 0 0 1px var(--silver)}
.eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--accent);color:var(--on-accent);border:1px solid var(--accent);font:inherit;font-size:14.5px;letter-spacing:.04em;text-decoration:none;cursor:pointer}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.petit{min-height:36px;padding:0 14px;font-size:13.5px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.carte{background:var(--card);border:1px solid var(--line);padding:16px}
input,select,textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--card);border:1px solid var(--line);padding:10px 12px;border-radius:0;width:100%}
label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
.alerte{border:1px solid var(--todo);color:var(--todo);padding:10px 14px;font-size:14px}
.ok{border:1px solid var(--taupe);background:var(--paper-2);padding:10px 14px;font-size:14px}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}