/* SEYMR® — feuille unique · v3
   Noir · Ivoire · Or. Aucun filtre sur les visuels. Aucun rognage.
   Échelle fluide de l'iPhone au téléviseur. */

:root{
  --noir:#0A0A0B; --noir-2:#101011; --surface:#141416; --surface-h:#1B1B1E;
  --ivoire:#EFEAE0; --ivoire-2:#B4AEA2; --ivoire-3:#726D63;
  --blanc:#FAFAF7;
  --or:#C9A227; --or-clair:#E3CB86; --or-profond:#8F721A;
  --plaque:#F4F1EA;
  --hair:rgba(239,234,224,.10);
  --hair-fort:rgba(239,234,224,.22);
  --hair-or:rgba(201,162,39,.30);
  --verre:rgba(10,10,11,.66);

  --display:'Bodoni Moda',"Times New Roman",serif;
  --body:'Cormorant Garamond',Georgia,serif;
  --mono:'JetBrains Mono',ui-monospace,"SFMono-Regular",Menlo,monospace;
  --e:cubic-bezier(.16,1,.3,1);

  --maxw:1320px;
  --gut:clamp(1.25rem,4.5vw,4rem);
  --gap:clamp(1.5rem,2.6vw,2.75rem);
  --sec:clamp(4.5rem,11vh,8.5rem);

  --t-corps:clamp(1rem,.28vw + .95rem,1.2rem);
  --t-petit:clamp(.8rem,.14vw + .77rem,.92rem);
  --t-data:clamp(.78rem,.12vw + .75rem,.9rem);
  --t-label:clamp(.72rem,.1vw + .7rem,.84rem);
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;border-radius:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:6rem}
body{
  background:var(--noir);color:var(--ivoire);
  font-family:var(--body);font-size:var(--t-corps);line-height:1.66;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,video,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--or);color:var(--noir)}
:focus-visible{outline:3px solid var(--or);outline-offset:4px}

body::after{
  content:'';position:fixed;inset:0;z-index:9990;pointer-events:none;opacity:.03;
  mix-blend-mode:screen;background-size:180px;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
.mono{font-family:var(--mono)}
.eyebrow{
  font-family:var(--mono);font-size:var(--t-label);letter-spacing:.26em;text-transform:uppercase;
  color:var(--or);display:block;margin-bottom:1rem;
}

/* ── NAVIGATION ──────────────────────────────── */
.nav{
  position:fixed;inset:0 0 auto;z-index:800;min-height:68px;display:flex;align-items:center;
  border-bottom:1px solid transparent;transition:background .4s var(--e),border-color .4s;
}
.nav.fixe{background:rgba(10,10,11,.90);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom-color:var(--hair)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%}
.marque{font-family:var(--display);font-weight:700;font-size:clamp(1.05rem,.5vw + .95rem,1.35rem);letter-spacing:.26em;padding:.75rem .25rem;display:inline-block}
.marque sup{font-size:.45em;vertical-align:.95em;color:var(--or)}
.nav-l{display:flex;gap:clamp(.75rem,1.9vw,2.4rem);align-items:center}
.nav-l a{
  font-family:var(--mono);font-size:var(--t-label);letter-spacing:.18em;text-transform:uppercase;
  color:var(--ivoire-2);position:relative;transition:color .28s;
  min-height:44px;display:inline-flex;align-items:center;padding:0 .15rem;
}
.nav-l a::after{content:'';position:absolute;left:0;bottom:14px;width:0;height:1px;background:var(--or);transition:width .35s var(--e)}
.nav-l a:hover{color:var(--blanc)}
.nav-l a:hover::after{width:100%}
.lang{display:flex;align-items:center;gap:.2rem;font-family:var(--mono);font-size:var(--t-label);letter-spacing:.1em}
.lang a{color:var(--ivoire-3);min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--hair)}
.lang a:hover{color:var(--blanc);border-color:var(--hair-or)}
.lang a.on{color:var(--noir);background:var(--or);border-color:var(--or)}
.burger{display:none;width:48px;height:48px;background:none;border:1px solid var(--hair);flex-direction:column;gap:5px;align-items:center;justify-content:center;cursor:pointer}
.burger span{width:18px;height:1px;background:var(--ivoire);transition:.3s var(--e)}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.tiroir{position:fixed;inset:0;z-index:780;background:var(--noir);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;opacity:0;pointer-events:none;transition:opacity .35s var(--e)}
.tiroir.ouvert{opacity:1;pointer-events:auto}
.tiroir a{font-family:var(--display);font-size:clamp(1.5rem,6.5vw,2.2rem);font-weight:500;padding:1rem 2rem;min-height:56px;display:flex;align-items:center;text-transform:uppercase;letter-spacing:.05em}
.tiroir a:hover{color:var(--or)}
@media(max-width:900px){.nav-l{display:none}.burger{display:flex}}

/* ── HERO ────────────────────────────────────── */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--noir)}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-media video,.hero-media img,#champ-gl{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
#champ-gl{opacity:0;transition:opacity 1.4s ease}
#champ-gl.vu{opacity:1}
.hero::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(10,10,11,.68) 0%,rgba(10,10,11,.12) 26%,rgba(10,10,11,.32) 58%,var(--noir) 97%)}
.hero-c{position:relative;z-index:2;width:100%;padding-bottom:clamp(2.5rem,8vh,5.5rem);padding-top:6rem}
.hero h1{
  font-family:var(--display);font-weight:800;line-height:.84;letter-spacing:.004em;
  font-size:clamp(3.2rem,14vw,11rem);color:var(--blanc);
}
.hero h1 sup{font-size:.16em;vertical-align:.95em;color:var(--or);font-weight:400}
.hero-sous{
  margin-top:1.5rem;max-width:46ch;font-size:clamp(1.05rem,.5vw + .95rem,1.4rem);
  color:var(--ivoire);line-height:1.5;text-wrap:balance;
}
.hero-sous strong{color:var(--blanc);font-weight:500}
.hero-etat{
  display:flex;flex-wrap:wrap;gap:.9rem clamp(1.2rem,3vw,2.8rem);margin-top:2rem;padding-top:1.3rem;
  border-top:1px solid var(--hair-or);font-family:var(--mono);font-size:var(--t-label);
  letter-spacing:.14em;text-transform:uppercase;color:var(--ivoire-2);
}
.hero-etat b{color:var(--or);font-weight:500}

/* ── SECTIONS ────────────────────────────────── */
section{padding:var(--sec) 0;border-top:1px solid var(--hair)}
.tete{margin-bottom:clamp(2rem,5vh,3.4rem)}
.part{
  font-family:var(--mono);font-size:var(--t-label);letter-spacing:.3em;color:var(--or);
  display:block;margin-bottom:.9rem;text-transform:uppercase;
}
h2{
  font-family:var(--display);font-weight:600;font-size:clamp(1.7rem,4.2vw,3.1rem);
  line-height:1.06;letter-spacing:.04em;text-transform:uppercase;text-wrap:balance;
}
h3{font-family:var(--display);font-weight:600;font-size:clamp(1.2rem,2vw,1.6rem);line-height:1.15}
.chapo{max-width:62ch;color:var(--ivoire-2);font-size:var(--t-corps);margin-top:1rem;text-wrap:pretty}

.rev{opacity:0;transform:translateY(18px);transition:opacity .8s var(--e),transform .8s var(--e)}
.rev.vu{opacity:1;transform:none}

/* ── OPÉRATEURS ──────────────────────────────── */
.ops{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
@media(max-width:1000px){.ops{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.ops{gap:1rem}}
.op{border:1px solid var(--hair);background:var(--noir-2);transition:border-color .35s var(--e)}
.op:hover{border-color:var(--hair-or)}
.op-g{aspect-ratio:1;background:var(--plaque);display:grid;place-items:center;padding:14%}
.op-g img{width:100%;height:100%;object-fit:contain}
.op-g.vide{background:var(--surface);border-bottom:1px solid var(--hair);padding:1rem}
.op-g.vide span{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.16em;color:var(--ivoire-3);text-transform:uppercase;text-align:center;line-height:1.7}
.op-t{padding:1.1rem 1.15rem 1.3rem}
.op-n{font-family:var(--mono);font-size:var(--t-data);letter-spacing:.18em;color:var(--blanc)}
.op-f{font-family:var(--body);font-size:var(--t-petit);color:var(--ivoire-2);margin-top:.3rem;line-height:1.4}
.op-c{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.12em;color:var(--or);margin-top:.65rem}

.bande{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.4rem 0}
.bande span{
  font-family:var(--mono);font-size:var(--t-label);letter-spacing:.12em;padding:.5rem .75rem;
  border:1px solid var(--hair);color:var(--ivoire-3);
}
.bande span.actif{border-color:var(--or);color:var(--or-clair);background:rgba(201,162,39,.08)}

/* ── GRILLES DE FICHES ───────────────────────── */
.grille{display:grid;gap:var(--gap)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1100px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.g3,.g4{grid-template-columns:1fr}}

.carte{
  background:var(--noir-2);border:1px solid var(--hair);
  display:flex;flex-direction:column;position:relative;
  transition:border-color .4s var(--e),background .4s var(--e),transform .5s var(--e);
}
.carte:hover{border-color:var(--hair-or);background:var(--surface);transform:translateY(-3px)}
.carte-v{
  background:var(--plaque);aspect-ratio:4/5;display:grid;place-items:center;
  padding:clamp(.9rem,2vw,1.6rem);overflow:hidden;
}
.carte-v img{width:100%;height:100%;object-fit:contain;transition:transform 1s var(--e)}
.carte:hover .carte-v img{transform:scale(1.03)}
.carte-t{padding:1.25rem 1.25rem 1.4rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.carte-t .cat{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.2em;text-transform:uppercase;color:var(--ivoire-3)}
.carte-t .nom{font-family:var(--display);font-size:clamp(1.1rem,1.3vw,1.32rem);font-weight:600;letter-spacing:.03em;text-transform:uppercase;line-height:1.15}
.carte-t .spec{font-family:var(--mono);font-size:var(--t-data);color:var(--ivoire-2);line-height:1.6}
.carte-t .fin{
  margin-top:auto;padding-top:1rem;display:flex;justify-content:space-between;align-items:baseline;
  gap:1rem;border-top:1px solid var(--hair);font-family:var(--mono);font-size:var(--t-data);letter-spacing:.06em;
}
.carte-t .fin .n{color:var(--or)}
.carte-t .fin .p{color:var(--blanc)}

/* ── PIÈCE ───────────────────────────────────── */
.piece{padding-top:clamp(7rem,13vh,10rem);padding-bottom:var(--sec)}
.piece-haut{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2rem,4.5vw,4.5rem);align-items:start}
@media(max-width:980px){.piece-haut{grid-template-columns:1fr;gap:2.5rem}}
.piece-med{display:flex;flex-direction:column;gap:var(--gap)}
.plaque{background:var(--plaque);padding:clamp(1rem,2.4vw,2.2rem);border:1px solid var(--hair);display:grid;place-items:center}
.plaque img{width:100%;height:auto;object-fit:contain;max-height:78svh}
.plaque.vide{background:var(--surface);aspect-ratio:4/5}
.plaque.vide span{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.2em;text-transform:uppercase;color:var(--ivoire-3)}
.piece h1{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,4.4vw,3.2rem);line-height:1.05;letter-spacing:.035em;text-transform:uppercase;text-wrap:balance}
.piece-sous{font-family:var(--mono);font-size:var(--t-data);letter-spacing:.18em;text-transform:uppercase;color:var(--or);margin-top:.9rem}
.piece-txt{max-width:60ch}
.piece-txt p{margin-top:1.1rem;color:var(--ivoire-2);text-wrap:pretty}
.piece-txt p:first-child{color:var(--ivoire)}
.retour{
  font-family:var(--mono);font-size:var(--t-label);letter-spacing:.2em;text-transform:uppercase;
  color:var(--ivoire-3);min-height:44px;display:inline-flex;align-items:center;
}
.retour:hover{color:var(--or)}

.releve{margin-top:2.2rem;border-top:1px solid var(--hair-or)}
.releve-t{
  font-family:var(--mono);font-size:var(--t-label);letter-spacing:.26em;text-transform:uppercase;
  color:var(--or);padding:1rem 0 .4rem;display:block;
}
.releve table{width:100%;border-collapse:collapse}
.releve th,.releve td{
  font-family:var(--mono);font-size:var(--t-data);line-height:1.6;text-align:left;
  padding:.7rem 0;border-bottom:1px solid var(--hair);vertical-align:top;
}
.releve th{color:var(--ivoire-3);font-weight:400;width:40%;letter-spacing:.07em;padding-right:1rem}
.releve td{color:var(--ivoire)}

.verif{
  margin-top:1.5rem;border:1px solid var(--hair);padding:1.1rem 1.2rem;
  font-family:var(--mono);font-size:var(--t-data);line-height:1.9;color:var(--ivoire-2);
  word-break:break-all;position:relative;overflow:hidden;
}
.verif b{color:var(--or);font-weight:500;letter-spacing:.2em;text-transform:uppercase;font-size:var(--t-label);display:block;margin-bottom:.5rem}
.verif a{color:var(--or-clair);border-bottom:1px solid var(--hair-or);display:inline-block}
.verif a:hover{color:var(--blanc);border-bottom-color:var(--blanc)}
.verif::before{content:'';position:absolute;left:0;top:0;width:100%;height:1px;
  background:linear-gradient(90deg,transparent,var(--or),transparent);animation:scan 6s linear infinite}
@keyframes scan{0%{transform:translateY(0)}100%{transform:translateY(var(--h,160px))}}

.acq{margin-top:2.2rem;padding-top:1.5rem;border-top:1px solid var(--hair-or);display:flex;flex-wrap:wrap;gap:1.2rem 2rem;align-items:center;justify-content:space-between}
.acq-p{font-family:var(--mono);font-size:clamp(1.05rem,1.2vw,1.3rem);letter-spacing:.03em;color:var(--blanc)}
.acq-p small{display:block;font-size:var(--t-label);text-transform:uppercase;color:var(--ivoire-3);margin-top:.45rem;letter-spacing:.14em}
.actions{display:flex;flex-wrap:wrap;gap:.75rem}
.bouton{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:var(--t-label);letter-spacing:.2em;text-transform:uppercase;
  padding:1rem 1.8rem;min-height:48px;border:1px solid var(--hair-fort);color:var(--ivoire);
  transition:background .32s var(--e),border-color .32s,color .32s;
}
.bouton:hover{background:var(--ivoire);border-color:var(--ivoire);color:var(--noir)}
.bouton.or{border-color:var(--or);color:var(--noir);background:var(--or)}
.bouton.or:hover{background:var(--or-clair);border-color:var(--or-clair)}

/* ── DOCTRINE ────────────────────────────────── */
.doctrine{max-width:64ch}
.doctrine p{margin-top:1.3rem;color:var(--ivoire-2);text-wrap:pretty}
.doctrine p.fort{color:var(--ivoire)}
.cite{
  font-family:var(--display);font-weight:500;font-size:clamp(1.4rem,3.2vw,2.3rem);
  line-height:1.2;letter-spacing:.03em;color:var(--or-clair);max-width:24ch;text-transform:uppercase;
}

.foyer{position:relative}
.pt{
  position:absolute;width:44px;height:44px;border:0;background:transparent;cursor:pointer;
  display:grid;place-items:center;transform:translate(-50%,-50%);
}
.pt::after{content:'';width:22px;height:22px;border:1px solid var(--or);background:rgba(250,250,247,.45)}
.pt::before{content:'';position:absolute;width:5px;height:5px;background:var(--or);animation:pulse 2.6s var(--e) infinite;z-index:1}
@keyframes pulse{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.9)}}
.pt-p{
  position:absolute;z-index:5;max-width:min(340px,84vw);padding:1.1rem 1.2rem;
  background:var(--verre);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);
  border:1px solid var(--hair-or);opacity:0;pointer-events:none;transition:opacity .3s var(--e);
}
.pt-p.ouvert{opacity:1;pointer-events:auto}
.pt-p h4{font-family:var(--mono);font-size:var(--t-label);letter-spacing:.18em;text-transform:uppercase;color:var(--or);margin-bottom:.45rem}
.pt-p p{font-size:var(--t-petit);color:var(--ivoire);line-height:1.5}

/* ── TERMINAL ────────────────────────────────── */
.terminal{border:1px solid var(--hair-or);padding:clamp(1.6rem,3.5vw,2.8rem);max-width:680px;background:var(--noir-2)}
.terminal .l{font-family:var(--mono);font-size:var(--t-data);line-height:2;color:var(--ivoire-3);letter-spacing:.06em}
.terminal .l b{color:var(--or);font-weight:400}
.terminal h3{margin:1.1rem 0 .5rem;text-transform:uppercase;letter-spacing:.04em}
.terminal>p{color:var(--ivoire-2);font-size:var(--t-petit)}
.terminal form{display:flex;gap:0;margin-top:1.5rem;flex-wrap:wrap}
.terminal input{
  flex:1;min-width:220px;background:transparent;border:1px solid var(--hair-fort);border-right:0;
  color:var(--ivoire);font-family:var(--mono);font-size:var(--t-data);padding:1rem 1.1rem;min-height:52px;
}
.terminal input::placeholder{color:var(--ivoire-3)}
.terminal input:focus{outline:none;border-color:var(--or)}
.terminal button{
  background:var(--or);border:1px solid var(--or);color:var(--noir);cursor:pointer;min-height:52px;
  font-family:var(--mono);font-size:var(--t-label);letter-spacing:.18em;text-transform:uppercase;padding:1rem 1.6rem;
  transition:background .3s}
.terminal button:hover{background:var(--or-clair)}
.terminal .note{font-family:var(--mono);font-size:var(--t-label);color:var(--ivoire-3);margin-top:.9rem;width:100%;line-height:1.7}
@media(max-width:560px){.terminal input{border-right:1px solid var(--hair-fort)}.terminal button{width:100%;margin-top:.6rem}}

/* ── AGENDA ──────────────────────────────────── */
.agenda{border-top:1px solid var(--hair-or);max-width:820px}
.agenda div{display:grid;grid-template-columns:1fr auto;gap:.4rem 2rem;padding:1.3rem 0;border-bottom:1px solid var(--hair);font-family:var(--mono);font-size:var(--t-data)}
.agenda .n{color:var(--blanc);text-transform:uppercase;letter-spacing:.1em}
.agenda .l{color:var(--ivoire-3);display:block;margin-top:.3rem;text-transform:none;letter-spacing:.04em}
.agenda .d{color:var(--or);text-align:right;white-space:nowrap}
@media(max-width:600px){.agenda div{grid-template-columns:1fr}.agenda .d{text-align:left;margin-top:.5rem}}

/* ── PIED ────────────────────────────────────── */
footer{border-top:1px solid var(--hair);padding:var(--sec) 0 3rem;font-family:var(--mono)}
.pied{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(2rem,4vw,3rem)}
@media(max-width:950px){.pied{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.pied{grid-template-columns:1fr}}
.pied h5{font-size:var(--t-label);letter-spacing:.24em;text-transform:uppercase;color:var(--or);margin-bottom:1rem;font-weight:400}
.pied a,.pied p{display:block;font-size:var(--t-data);line-height:1.6;color:var(--ivoire-2)}
.pied a{min-height:44px;display:flex;align-items:center}
.pied a:hover{color:var(--or-clair)}
.pied .sig{font-family:var(--display);font-size:1.3rem;letter-spacing:.24em;color:var(--blanc);margin-bottom:1rem}
.bas{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--hair);display:flex;flex-wrap:wrap;gap:.9rem 2rem;justify-content:space-between;font-size:var(--t-label);letter-spacing:.1em;color:var(--ivoire-3);text-transform:uppercase;line-height:1.7}
.clos{font-family:var(--display);letter-spacing:.3em;color:var(--or);text-transform:uppercase}

/* ── TÉLÉVISEUR ──────────────────────────────── */
@media(min-width:1800px){
  :root{--maxw:1560px;--t-corps:1.32rem;--t-petit:1.02rem;--t-data:1rem;--t-label:.95rem;--gap:2.75rem}
  .hero h1{font-size:12rem}
}
@media(min-width:2560px){
  :root{--maxw:1900px;--t-corps:1.55rem;--t-petit:1.2rem;--t-data:1.15rem;--t-label:1.05rem;--gap:3.25rem}
}
@media(hover:none) and (pointer:coarse){.carte:hover{transform:none}}
.carte:focus-within{border-color:var(--or);outline:3px solid var(--or);outline-offset:3px}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .rev{opacity:1;transform:none}
  #champ-gl{opacity:1}
}
