/* ==========================================================
   DURATECFRANCE · base
   Tokens de color, tipografía, reset y zonas claras
   ========================================================== */

/* Layout: collage de blocs de couleur décalés derrière des visuels produit détourés, titres posés à cheval sur les blocs. */
:root{
  --bg:#0B0C0E; --band:#15171B; --paper:#FFFFFF; --fg:#F4F1EA; --muted:#A9ABB0; --line:#2A2D33;
  --ink:#0B0C0E; --navy:#0B0C0E; --navy-soft:#1B1D22; --gold:#E3A63C; --copper:#C4762F; --copper-hi:#E08A3C; --steel:#8A8D92;
  --beige:#F4F1EA; --on-navy:#F4F1EA; --on-copper:#0B0C0E; --on-gold:#0B0C0E; --tile:#ECE7DC; color-scheme:dark;
  --f-display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --f-body:"DM Sans","Helvetica Neue",Arial,sans-serif;
  --f-mono:"Space Mono","Courier New",monospace;
  --f-head:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --gutter:max(16px,env(safe-area-inset-left,0px));
  --gutter-r:max(16px,env(safe-area-inset-right,0px));
}
/* zones claires : texte noir sur blanc / beige */
.titlebox,.sp-panel,.plate.tx,.tiles>div.lt,.beige{--fg:#0B0C0E;--muted:#5A5E66;--band:#F4F1EA;--line:#DDD8CC}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:16px;line-height:1.6;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:800;line-height:1.05;letter-spacing:-.02em;margin:0;text-wrap:balance}
p{margin:0}
.wrap{max-width:1200px;margin:0 auto;padding-inline:var(--gutter) var(--gutter-r)}
:lang(fr) .es,:lang(es) .fr{display:none}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}