/* 3d-cotes-darmor.com, direction « radôme » (02/11/2026) : console de station, écran radar à phosphore. */
@font-face{font-family:Michroma;src:url(/assets/fonts/michroma.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Bai Jamjuree";src:url(/assets/fonts/bai-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Bai Jamjuree";src:url(/assets/fonts/bai-600.woff2) format("woff2");font-weight:600 800;font-display:swap}
@font-face{font-family:VT323;src:url(/assets/fonts/vt323.woff2) format("woff2");font-display:swap}
:root{--beige:#d8d2bf;--beige-c:#e9e5d8;--beige-f:#bdb59c;--bakelite:#1d1a16;--bakelite-2:#2b2721;--ecran:#071a10;--ecran-2:#0d2a1b;--phos:#7dff8a;--phos-f:#3fbf55;--orange:#ff6a13;--orange-f:#c94c05;--granit:#e7a594;--granit-f:#b8644f;--bleu:#1f4e8c;--papier:#f4f0e4;--titre:Michroma,"Bai Jamjuree",sans-serif;--texte:"Bai Jamjuree",system-ui,sans-serif;--mono:VT323,ui-monospace,monospace}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--beige);color:var(--bakelite);font:400 1.06rem/1.62 var(--texte);overflow-x:hidden;
 background-image:repeating-linear-gradient(0deg,rgba(0,0,0,.018) 0 2px,transparent 2px 4px)}
img,svg{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--titre);font-weight:400;line-height:1.18;letter-spacing:.01em;margin:0 0 .6em}
p{margin:0 0 1em}
.saut{position:absolute;left:-999px;top:0;background:var(--bakelite);color:#fff;padding:.6rem 1rem;z-index:99}.saut:focus{left:1rem}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.kicker{font:1.15rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--orange-f);margin-bottom:.8rem}
.titre-sec{font-size:clamp(1.35rem,2.6vw,2.1rem);max-width:30ch}
.sec-tete{max-width:62rem;margin:0 auto 2.2rem}
.sec-tete>p:not(.kicker){max-width:60ch;color:#4a443a}
section{padding:clamp(3.5rem,7vw,6rem) clamp(1.1rem,4vw,3rem)}
.note{max-width:62rem;margin:2rem auto 0;color:#4a443a}.note.centre{text-align:center;padding:0 1rem}
.lien-fleche{font-weight:600;text-decoration:none;border-bottom:2px solid var(--orange)}.lien-fleche::after{content:" →"}
.bouton{display:inline-flex;align-items:center;gap:.6rem;background:var(--bakelite);color:var(--papier);text-decoration:none;font:600 1rem/1 var(--texte);padding:1rem 1.4rem;border-radius:6px;border:0;cursor:pointer;
 box-shadow:inset 0 -4px 0 rgba(0,0,0,.45),0 3px 0 var(--beige-f);transition:transform .15s,box-shadow .15s}
.bouton:hover{transform:translateY(2px);box-shadow:inset 0 -2px 0 rgba(0,0,0,.45),0 1px 0 var(--beige-f)}
.voyant{width:.7rem;height:.7rem;border-radius:50%;background:var(--orange);box-shadow:0 0 0 2px rgba(0,0,0,.35),0 0 12px var(--orange);flex:none}
.lien-tel{font:1.5rem/1 var(--mono);text-decoration:none;border-bottom:2px dotted currentColor}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.4rem}
.vis{position:absolute;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#f1ecdf,#8d856e 70%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.3)}
.vis::after{content:"";position:absolute;left:1px;right:1px;top:4px;height:1.5px;background:rgba(0,0,0,.45);transform:rotate(35deg)}
.v1{top:9px;left:9px}.v2{top:9px;right:9px}.v3{bottom:9px;left:9px}.v4{bottom:9px;right:9px}

/* en-tête */
.tete-site{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:1.4rem;padding:.7rem clamp(1rem,3vw,2.4rem);background:var(--bakelite);color:var(--papier);border-bottom:3px solid var(--orange)}
.marque{display:flex;align-items:center;gap:.6rem;text-decoration:none;font:400 .95rem/1 var(--titre);white-space:nowrap}
.marque svg{width:34px;height:34px;color:var(--papier)}.marque b{font-weight:400;color:var(--phos)}
.menu{display:flex;gap:.3rem;margin-left:auto}
.menu>a,.deroulant>a{display:block;padding:.55rem .85rem;text-decoration:none;font-weight:600;font-size:.96rem;border-radius:4px}
.menu a[aria-current]{background:var(--bakelite-2);color:var(--phos)}
.menu>a:hover,.deroulant>a:hover{background:var(--bakelite-2)}
.deroulant{position:relative}
.sous{position:absolute;top:100%;left:0;min-width:17rem;list-style:none;margin:0;padding:.5rem;background:var(--ecran);border:1px solid var(--phos-f);border-radius:6px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s}
.deroulant:hover .sous,.deroulant:focus-within .sous{opacity:1;visibility:visible;transform:none}
.sous a{display:flex;gap:.6rem;padding:.45rem .6rem;text-decoration:none;color:var(--phos);font:1.2rem/1.1 var(--mono);border-radius:3px}.sous a:hover{background:var(--ecran-2)}
.mini{opacity:.6}
.lien-devis{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;background:var(--orange);color:var(--bakelite);font-weight:800;text-decoration:none;border-radius:4px;white-space:nowrap}
.lien-devis .voyant{background:var(--bakelite);box-shadow:none;animation:clignote 1.4s steps(1) infinite}
@keyframes clignote{50%{opacity:.15}}
.menu-tel{display:none;margin-left:auto}
.menu-tel summary{list-style:none;cursor:pointer;width:44px;height:44px;display:grid;place-content:center;gap:5px}.menu-tel summary::-webkit-details-marker{display:none}
.menu-tel summary span{display:block;width:24px;height:2px;background:var(--papier)}
.menu-tel-panneau{position:absolute;left:0;right:0;top:100%;max-height:calc(100vh - 64px);overflow:auto;background:var(--ecran);padding:1.2rem 1.4rem 2rem;border-bottom:3px solid var(--orange)}
.menu-tel-panneau ul{list-style:none;margin:0 0 1rem;padding:0}.menu-tel-panneau a{display:block;padding:.4rem 0;color:var(--phos);font:1.3rem/1.2 var(--mono);text-decoration:none}
.mt-titre{font:.8rem/1 var(--titre);color:var(--papier);margin:.6rem 0 .4rem}
.mt-actions{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}.mt-actions .bouton{background:var(--orange);color:var(--bakelite);font-family:var(--texte);font-size:1rem}
@media (max-width:980px){.menu,.tete-site>.lien-devis{display:none}.menu-tel{display:block}}

/* héros : téléscripteur + console */
.station{padding-top:2rem;padding-bottom:3rem}
.teleimprimeur{position:relative;max-width:78rem;margin:0 auto 1.6rem;background:var(--papier);padding:1.4rem clamp(1.2rem,4vw,3rem) 1.6rem 3.4rem;transform:rotate(-.6deg);
 box-shadow:0 10px 24px -14px rgba(0,0,0,.45);clip-path:polygon(0 4%,2% 0,5% 4%,8% 0,11% 4%,14% 0,17% 4%,20% 0,23% 4%,26% 0,29% 4%,32% 0,35% 4%,38% 0,41% 4%,44% 0,47% 4%,50% 0,53% 4%,56% 0,59% 4%,62% 0,65% 4%,68% 0,71% 4%,74% 0,77% 4%,80% 0,83% 4%,86% 0,89% 4%,92% 0,95% 4%,98% 0,100% 4%,100% 100%,0 100%)}
.ti-trous{position:absolute;left:.9rem;top:0;bottom:0;width:14px;background:radial-gradient(circle,var(--beige) 4.5px,transparent 5px) 0 0/14px 22px repeat-y}
.ti-surtitre{font:1.2rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--bleu)}
.teleimprimeur h1{margin:0;font-size:clamp(1.7rem,5.4vw,4.2rem);line-height:1.08}
.h1-a,.h1-b,.h1-c{display:block}.h1-b{color:var(--orange-f)}.h1-c{font:600 clamp(1rem,1.8vw,1.35rem)/1.3 var(--texte);margin-top:.7rem;color:#4a443a}
.ti-curseur{display:inline-block;width:.7rem;height:1.6rem;background:var(--bakelite);margin-top:.5rem;animation:clignote 1s steps(1) infinite}
.console{position:relative;max-width:78rem;margin:0 auto;display:grid;grid-template-columns:1fr minmax(18rem,26rem) 1fr;gap:clamp(1.2rem,2.5vw,2.4rem);align-items:center;
 padding:clamp(1.6rem,3vw,2.6rem);background:linear-gradient(180deg,var(--beige-c),var(--beige) 60%,var(--beige-f));border-radius:14px;
 box-shadow:inset 0 2px 0 rgba(255,255,255,.7),inset 0 -6px 0 rgba(0,0,0,.12),0 18px 40px -22px rgba(0,0,0,.55)}
.co-chapo{font-size:1.08rem}
.interrupteurs{display:flex;gap:1.2rem;margin-top:1.6rem;font:1.05rem/1 var(--mono);text-transform:uppercase}
.interrupteurs span{display:flex;flex-direction:column;align-items:center;gap:.4rem}
.interrupteurs i{width:20px;height:34px;border-radius:10px;background:var(--bakelite);position:relative;box-shadow:inset 0 0 0 3px #4b443a}
.interrupteurs i::after{content:"";position:absolute;left:4px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--beige-c);transition:top .3s}
.interrupteurs .on i::after{top:18px;background:var(--phos)}
/* écran radar */
.scope{position:relative;text-align:center}
.sc-ecran{position:relative;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,var(--ecran-2),var(--ecran) 70%);overflow:hidden;
 box-shadow:0 0 0 10px var(--bakelite),0 0 0 14px #4b443a,0 0 0 16px var(--beige-f),inset 0 0 40px rgba(0,0,0,.8)}
.sc-ecran::after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.1),transparent 45%),repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px);pointer-events:none}
.sc-grille{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--phos);stroke-width:.5;opacity:.38}
.sc-grille text{fill:var(--phos);stroke:none;font:9px var(--mono)}
.sc-balai{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(125,255,138,0) 0deg,rgba(125,255,138,0) 300deg,rgba(125,255,138,.06) 320deg,rgba(125,255,138,.34) 359deg,rgba(125,255,138,0) 360deg)}
.sc-centre{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:var(--phos)}
.echo{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:flex;align-items:center;gap:.3rem;text-decoration:none;color:var(--phos);font:1rem/1 var(--mono);z-index:2}
.ec-point{width:9px;height:9px;border-radius:50%;background:var(--phos);box-shadow:0 0 10px var(--phos);opacity:.35;transition:opacity .4s}
.ec-nom{opacity:.55;white-space:nowrap;text-shadow:0 0 6px rgba(125,255,138,.7)}
.echo:hover .ec-point,.echo:focus-visible .ec-point,.echo.vu .ec-point{opacity:1}.echo:hover .ec-nom,.echo.vu .ec-nom{opacity:1}
.echo.g{flex-direction:row-reverse}.echo.bas .ec-nom{position:absolute;top:130%;left:-1.6rem}.echo.haut .ec-nom{position:absolute;bottom:130%;left:-2rem}
.echo-ici .ec-point{background:var(--orange);box-shadow:0 0 12px var(--orange);opacity:1}.echo-ici .ec-nom{opacity:1;color:#ffd2b5}
.sc-legende{display:block;margin-top:1.6rem;font:1.05rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#4a443a}
/* journal */
.journal{background:var(--ecran);color:var(--phos);border-radius:8px;padding:1rem 1rem 1.1rem;box-shadow:inset 0 0 0 2px #0f3a24,inset 0 0 30px rgba(0,0,0,.6);font-family:var(--mono)}
.jo-tete{display:flex;justify-content:space-between;font-size:1.05rem;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px dashed var(--phos-f);padding-bottom:.5rem;margin-bottom:.4rem}
.jo-rec{color:var(--orange);animation:clignote 1.2s steps(1) infinite}
.journal ol{list-style:none;margin:0;padding:0}
.journal a{display:grid;grid-template-columns:2.6rem 1fr auto auto;gap:.2rem .6rem;padding:.22rem .3rem;font-size:1.18rem;line-height:1.1;text-decoration:none;border-radius:2px}
.jo-cp{display:none}.jo-km{min-width:3.2rem;text-align:right}
.journal li.vu a,.journal a:hover{background:var(--phos);color:var(--ecran)}
.jo-n{opacity:.6}
.plaques{max-width:78rem;margin:1.6rem auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.plaque{position:relative;margin:0;padding:1.1rem 1.4rem;background:linear-gradient(180deg,#c9c2aa,#b2aa8f);border-radius:6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(0,0,0,.18)}
.plaque dt{font:1rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#4b443a}
.plaque dd{margin:.35rem 0 0;font:400 1.02rem/1.25 var(--titre);color:var(--bakelite);text-shadow:0 1px 0 rgba(255,255,255,.5)}
@media (max-width:1080px){.console{grid-template-columns:1fr 1fr}.co-gauche{grid-column:1/-1}.plaques{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.console{grid-template-columns:1fr;padding:1.4rem 1rem}.scope{max-width:20rem;margin:0 auto;width:100%}.teleimprimeur{padding-left:2.6rem}.ti-trous{left:.5rem}.plaque dd{font-size:.9rem}}

/* bulletin */
.bulletin,.consigne{max-width:62rem;margin:0 auto}
.bu-texte{font:400 clamp(1.15rem,2.1vw,1.55rem)/1.5 var(--titre);letter-spacing:0;border-left:6px solid var(--orange);padding-left:1.4rem}

/* modules (services) */
.canaux-sec{background:var(--bakelite);color:var(--papier)}
.canaux-sec .sec-tete>p:not(.kicker),.canaux-sec .tous{color:#cfc8b4}.canaux-sec .kicker{color:var(--orange)}.canaux-sec .lien-fleche{color:var(--papier)}
.modules{list-style:none;margin:0 auto;padding:0;max-width:78rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.modules.trois{grid-template-columns:repeat(3,1fr)}
.module{position:relative;display:grid;grid-template-columns:1fr auto;grid-template-areas:"canal canal" "ecran rot" "titre titre" "txt txt" "lire lire";gap:.7rem 1rem;height:100%;padding:1.6rem 1.4rem 1.3rem;
 background:linear-gradient(180deg,#3a352d,#2b2721);border-radius:10px;text-decoration:none;color:var(--papier);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 0 #12100d;transition:transform .2s,box-shadow .2s}
.module:hover{transform:translateY(-4px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 0 #12100d}
.module .vis{background:radial-gradient(circle at 35% 35%,#8a8170,#2a251f 70%)}
.mo-canal{grid-area:canal;font:1.1rem/1 var(--mono);letter-spacing:.1em;color:#a9a18b}
.mo-ecran{grid-area:ecran;position:relative;background:var(--ecran);border-radius:4px;padding:.6rem .7rem;overflow:hidden;min-height:4.4rem;box-shadow:inset 0 0 14px rgba(0,0,0,.8)}
.mo-signal{position:relative;z-index:1;font:1.5rem/1 var(--mono);color:var(--t);text-shadow:0 0 8px var(--t)}
.mo-onde{position:absolute;left:0;right:0;bottom:.5rem;height:22px;background:linear-gradient(90deg,transparent,var(--t),transparent) 0 50%/40% 2px no-repeat;opacity:.8;animation:onde 2.4s linear infinite}
@keyframes onde{from{background-position:-40% 50%}to{background-position:140% 50%}}
.bouton-rot{grid-area:rot;width:62px;height:62px;stroke:#a9a18b;stroke-width:1.5}
.br-collier{fill:#14120f;stroke:#4b443a}.br-tete{transform-origin:30px 30px;transform:rotate(var(--r));transition:transform .6s cubic-bezier(.3,1.6,.5,1)}
.br-tete circle{fill:#d8d2bf;stroke:none}.br-tete rect{fill:var(--orange);stroke:none}
.module:hover .br-tete{transform:rotate(calc(var(--r) + 90deg))}
.mo-titre{grid-area:titre;font:400 1.08rem/1.25 var(--titre)}
.mo-txt{grid-area:txt;color:#cfc8b4;font-size:.98rem}
.mo-lire{grid-area:lire;font:1.1rem/1 var(--mono);color:var(--t);text-transform:uppercase;letter-spacing:.08em}.mo-lire::after{content:" ▸"}
.canaux-sec.seul{padding-top:2rem}
.tous{max-width:78rem;margin:1.6rem auto 0}
@media (max-width:980px){.modules,.modules.trois{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.modules,.modules.trois{grid-template-columns:1fr}}

/* compte à rebours */
.compte-sec{position:relative}
.trajectoire{position:relative;max-width:78rem;height:150px;margin:0 auto}
.trajectoire>svg:first-child{width:100%;height:100%}
.tj-arc{fill:none;stroke:var(--beige-f);stroke-width:2;stroke-dasharray:6 8}
.tj-trace{fill:none;stroke:var(--orange);stroke-width:3}
.satellite{position:absolute;left:0;top:0;width:56px;height:56px;margin:-28px;stroke:var(--bakelite);stroke-width:2;fill:none}
.sa-pan{fill:var(--bleu)}.sa-corps{fill:var(--papier)}
.compte{list-style:none;margin:0 auto;padding:0;max-width:78rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.ct-etape{background:var(--papier);border-radius:8px;padding:1.3rem;border-top:6px solid var(--bakelite)}
.ct-etape.allume{border-top-color:var(--orange)}
.ct-t{display:block;font:1.7rem/1 var(--mono);color:var(--orange-f)}
.ct-moment{display:block;font:1.05rem/1.2 var(--mono);text-transform:uppercase;color:#6a6252;margin:.3rem 0 .8rem}
.ct-etape h3{font-size:1rem}
.ct-etape p{font-size:.97rem;margin:0}
@media (max-width:900px){.compte{grid-template-columns:1fr 1fr}}@media (max-width:560px){.compte{grid-template-columns:1fr}.trajectoire{height:90px}}

/* télégrammes (communes) */
.telegrammes-sec{background:var(--beige-c);overflow:hidden}
.telegrammes{list-style:none;margin:0 auto;padding:0;max-width:78rem;display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem 1.2rem}
.telegramme{position:relative;display:flex;flex-direction:column;gap:.45rem;height:100%;padding:0 0 1.2rem;background:#fbf6dd;text-decoration:none;transform:rotate(var(--rot));
 box-shadow:0 1px 0 rgba(0,0,0,.08),0 10px 18px -12px rgba(0,0,0,.5);transition:transform .25s}
.telegramme:hover{transform:rotate(0) translateY(-4px)}
.telegramme[aria-current]{outline:3px solid var(--orange)}
.tg-tete{display:flex;justify-content:space-between;align-items:baseline;padding:.6rem .9rem;background:var(--bleu);color:#fff;font:1.05rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.tg-tete b{font:400 .78rem/1 var(--titre);letter-spacing:.12em}
.tg-dest{padding:0 .9rem;font:1.2rem/1.1 var(--mono);text-transform:uppercase}
.tg-ind{padding:0 .9rem;font:600 .9rem/1.2 var(--texte);color:var(--bleu)}
.tg-msg{padding:.5rem .9rem 0;font:1.25rem/1.15 var(--mono);text-transform:uppercase;border-top:1px dashed #b9b18f;margin:0 .9rem;padding-left:0;padding-right:0}
.tg-tampon{position:absolute;right:.8rem;bottom:.6rem;font:.66rem/1 var(--titre);color:var(--granit-f);border:2px solid var(--granit-f);border-radius:50%;padding:.9rem .45rem;transform:rotate(-14deg);opacity:.75}
@media (max-width:1000px){.telegrammes{grid-template-columns:repeat(2,1fr)}}@media (max-width:520px){.telegrammes{grid-template-columns:1fr}}

/* cartes perforées (matières) */
.cartes-perf{list-style:none;margin:0 auto;padding:0;max-width:78rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:1.2rem}
.carte-perf{position:relative;background:#efe3b8;padding:1.1rem 1.2rem 1.2rem;border-radius:4px;clip-path:polygon(22px 0,100% 0,100% 100%,0 100%,0 22px);box-shadow:inset 0 0 0 1px rgba(0,0,0,.07)}
.cp-tete{display:flex;justify-content:space-between;font:1.05rem/1 var(--mono);text-transform:uppercase;color:#6a6252;padding-left:1rem}
.cp-code{color:var(--orange-f);font-size:1.3rem}
.cp-nom{font:400 1.25rem/1.2 var(--titre);margin:.4rem 0 .8rem}
.cp-grille{display:grid;grid-template-columns:repeat(5,1fr);gap:.3rem;padding:.6rem;background:repeating-linear-gradient(90deg,transparent 0 calc(20% - 1px),rgba(0,0,0,.08) calc(20% - 1px) 20%);border:1px solid rgba(0,0,0,.1)}
.cp-col{display:flex;flex-direction:column;align-items:center;gap:.35rem}
.cp-u{font:.92rem/1 var(--mono);text-transform:uppercase;color:#5a5244;writing-mode:vertical-rl;transform:rotate(180deg);height:5.2rem;text-align:left}
.cp-trous{display:flex;flex-direction:column-reverse;gap:4px}
.cp-trous i{width:12px;height:16px;border-radius:2px;background:rgba(0,0,0,.08)}
.cp-trous i.p{background:var(--bakelite);box-shadow:inset 0 2px 0 rgba(255,255,255,.12)}
.cp-txt{margin:.9rem 0 0;font-size:.97rem}

/* listing (avis) */
.listing-sec{background:var(--beige-c)}
.listing{position:relative;max-width:60rem;margin:0 auto;padding:1.4rem 3.2rem;background:repeating-linear-gradient(180deg,#e3f0db 0 3.2rem,#fbfdf8 3.2rem 6.4rem);box-shadow:0 14px 30px -18px rgba(0,0,0,.5)}
.listing::before,.listing::after{content:"";position:absolute;top:0;bottom:0;width:18px;background:radial-gradient(circle,var(--beige-c) 5px,transparent 5.5px) 0 0/18px 1.6rem repeat-y}
.listing::before{left:.6rem}.listing::after{right:.6rem}
.listing-l{margin:0;padding:1.2rem 0;border-bottom:1px dashed #9ab68d;display:grid;grid-template-columns:4rem 1fr;gap:.2rem 1rem}
.li-num{font:1.2rem/1.3 var(--mono);color:#6b8a5f;grid-row:span 2}
.listing blockquote{margin:0;font:1.32rem/1.3 var(--mono);color:#1f2b1a}.listing blockquote p{margin:0}
.listing figcaption{font-weight:600;font-size:.92rem;color:#4b5a43}
@media (max-width:560px){.listing{padding:1rem 1.8rem}.listing::before{left:.1rem}.listing::after{right:.1rem}.listing-l{grid-template-columns:1fr}.li-num{grid-row:auto}}

/* dossiers (guides) */
.dossiers{max-width:78rem;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}.dossiers.deux{grid-template-columns:repeat(2,1fr)}
.dossier{position:relative;display:flex;flex-direction:column;gap:.7rem;padding:2.6rem 1.4rem 1.6rem;margin-top:1.4rem;background:#c9a774;border-radius:0 8px 8px 8px;text-decoration:none;box-shadow:0 10px 20px -14px rgba(0,0,0,.6);transition:transform .25s}
.dossier:hover{transform:translateY(-4px) rotate(-.5deg)}
.do-onglet{position:absolute;left:0;top:-1.4rem;padding:.35rem 1rem;background:#c9a774;border-radius:8px 8px 0 0;font:1.05rem/1 var(--mono);text-transform:uppercase;letter-spacing:.08em}
.do-titre{font:400 1.12rem/1.3 var(--titre)}
.do-chapo{font-size:.97rem;color:#3b3226}
.do-tampon{align-self:flex-start;margin-top:auto;font:.7rem/1 var(--titre);text-transform:uppercase;color:#9c2f1b;border:2px solid #9c2f1b;padding:.35rem .6rem;transform:rotate(-6deg)}
@media (max-width:900px){.dossiers,.dossiers.deux{grid-template-columns:1fr}}

/* FAQ en transmissions */
.questions .transmissions{max-width:62rem;margin:0 auto;display:grid;gap:.6rem}
.transmission{background:var(--ecran);color:var(--phos);border-radius:6px;box-shadow:inset 0 0 0 1px #12402a}
.transmission summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:4.6rem 1fr 1.4rem;gap:.8rem;align-items:center;padding:1rem 1.1rem}
.transmission summary::-webkit-details-marker{display:none}
.tr-code{font:1.15rem/1 var(--mono);color:var(--orange)}
.tr-texte{font:600 1.02rem/1.35 var(--texte);color:#e9ffe9}
.tr-plus{position:relative;width:1.2rem;height:1.2rem}.tr-plus::before,.tr-plus::after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;background:var(--phos);transition:transform .25s}
.tr-plus::after{transform:rotate(90deg)}.transmission[open] .tr-plus::after{transform:rotate(0)}
.tr-rep{display:grid;grid-template-columns:4.6rem 1fr;gap:.8rem;padding:0 1.1rem 1.1rem}
.tr-rep p{margin:0;font:1.28rem/1.3 var(--mono)}
@media (max-width:560px){.transmission summary,.tr-rep{grid-template-columns:1fr 1.4rem}.tr-rep{grid-template-columns:1fr}.tr-code{grid-column:1/-1}}

/* devis : émetteur */
.devis{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(1.4rem,3vw,2.6rem);max-width:84rem;margin:0 auto;align-items:start}
.emetteur{position:relative;background:var(--bakelite);color:var(--papier);border-radius:14px;padding:2.4rem 2rem 2rem;box-shadow:0 10px 0 #12100d}
.emetteur .kicker{color:var(--orange)}.emetteur h2{font-size:clamp(1.3rem,2.4vw,1.9rem)}.emetteur p{color:#d8d2bf}
.emetteur .vis{background:radial-gradient(circle at 35% 35%,#8a8170,#2a251f 70%)}
.vumetre{display:flex;gap:4px;align-items:flex-end;height:46px;margin:1.4rem 0}
.vumetre i{flex:1;height:calc(20% + var(--k) * 5%);background:var(--phos);opacity:.85;border-radius:2px;transform-origin:bottom}
.vumetre i:nth-child(n+10){background:var(--orange)}
.compteur{display:flex;align-items:center;gap:1rem}
.cp-chiffres{font:3rem/1 var(--mono);color:var(--orange);background:#0d0b09;padding:.3rem .8rem;border-radius:4px;text-shadow:0 0 10px rgba(255,106,19,.7)}
.compteur span:last-child{font-size:.9rem;color:#a9a18b}
.devis-tel a{color:var(--phos);font:1.5rem var(--mono)}
.devis-papier{background:var(--papier);border-radius:6px;padding:clamp(1.4rem,3vw,2.4rem);box-shadow:0 14px 30px -18px rgba(0,0,0,.5)}
.formulaire{display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.2rem}
.champ{display:flex;flex-direction:column;gap:.35rem}.champ.tout{grid-column:1/-1}
.champ label{font-weight:600;font-size:.95rem}.champ small{font-weight:400;color:#6a6252}
.champ input,.champ select,.champ textarea{font:inherit;font-size:1rem;padding:.75rem .8rem;border:2px solid #9d957d;border-radius:4px;background:#fffdf6;color:var(--bakelite);min-width:0;width:100%}
.champ input:focus,.champ select:focus,.champ textarea:focus{border-color:var(--orange);outline:none;box-shadow:0 0 0 3px rgba(255,106,19,.25)}
.aide{font-size:.85rem;color:#6a6252}
.piege{position:absolute;left:-9999px}
.emettre{grid-column:1/-1;justify-self:start;background:var(--orange);color:var(--bakelite);font-size:1.08rem;padding:1.1rem 1.7rem}.emettre .voyant{background:var(--bakelite);box-shadow:none}
.mention{grid-column:1/-1;font-size:.86rem;color:#6a6252;margin:0}
@media (max-width:900px){.devis{grid-template-columns:1fr}}@media (max-width:560px){.formulaire{grid-template-columns:1fr}.emetteur{padding:2.2rem 1.3rem 1.6rem}}

/* pied */
.pied{position:relative;background:var(--bakelite);color:#d8d2bf;padding:4rem clamp(1.1rem,4vw,3rem) 1.4rem;overflow:hidden}
.pied-radome{position:absolute;right:-2rem;bottom:2.4rem;width:min(30rem,70vw);fill:#25211c;stroke:#3a342c;stroke-width:2;pointer-events:none}
.pied-grille{position:relative;max-width:78rem;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem}
.pied ul{list-style:none;margin:0;padding:0}.pied li{margin:.3rem 0}.pied a{color:#f4f0e4;text-decoration-color:rgba(244,240,228,.35)}
.pied-titre{font:1.15rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--phos)}
.pied .marque{margin-bottom:1rem}.petit{font-size:.86rem;color:#a9a18b}
.pied-bas{position:relative;max-width:78rem;margin:3rem auto 0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem;padding-top:1rem;border-top:1px solid #3a342c;font:1.05rem var(--mono);color:#a9a18b}
@media (max-width:900px){.pied-grille{grid-template-columns:1fr 1fr}}@media (max-width:560px){.pied-grille{grid-template-columns:1fr}}

/* pages communes */
.ariane{display:flex;flex-wrap:wrap;gap:.4rem;font:1.1rem/1.2 var(--mono);text-transform:uppercase;margin-bottom:1.2rem}.ariane a{text-decoration:none;border-bottom:1px dotted}
.poursuite{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:2rem clamp(1.6rem,4vw,3.4rem);max-width:84rem;margin:0 auto;align-items:center}
.poursuite h1{font-size:clamp(1.8rem,4.4vw,3.4rem)}.poursuite h1 em{font-style:normal;display:block;color:var(--orange-f)}
.po-suite{font-size:1.15rem;color:#4a443a}
.po-console{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;align-items:center;padding:1.8rem;background:linear-gradient(180deg,var(--beige-c),var(--beige-f));border-radius:14px;box-shadow:inset 0 2px 0 rgba(255,255,255,.7),0 16px 30px -20px rgba(0,0,0,.6)}
.po-console .sc-legende{font-size:.95rem;margin-top:1.2rem}
.fiche{position:relative;margin:0;background:var(--bakelite);color:var(--papier);border-radius:8px;padding:1.6rem 1.3rem 1.2rem}
.fiche .vis{background:radial-gradient(circle at 35% 35%,#8a8170,#2a251f 70%)}
.fi-titre{font:1.1rem/1.1 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--phos);margin-bottom:.8rem}
.fiche div{display:grid;grid-template-columns:7.2rem 1fr;gap:.6rem;padding:.4rem 0;border-top:1px solid #3a342c}
.fiche dt{font:1.05rem/1.2 var(--mono);text-transform:uppercase;color:#a9a18b}.fiche dd{margin:0;font-size:.95rem}
.ruban{grid-column:1/-1;position:relative;background:var(--papier);padding:1rem 1.4rem 1rem 3rem;transform:rotate(.4deg);box-shadow:0 8px 18px -12px rgba(0,0,0,.5)}
.ruban p{margin:0;font:1.5rem/1.2 var(--mono);text-transform:uppercase}
.ru-trous{position:absolute;left:.8rem;top:0;bottom:0;width:14px;background:radial-gradient(circle,var(--beige) 4px,transparent 4.5px) 0 0/14px 18px repeat-y}
@media (max-width:1000px){.poursuite{grid-template-columns:1fr}}
@media (max-width:560px){.po-console{grid-template-columns:1fr;padding:1.4rem 1rem}.po-console .scope{max-width:17rem;margin:0 auto;width:100%}.ruban p{font-size:1.2rem}}
.recit{display:grid;grid-template-columns:minmax(0,1fr) 19rem;gap:2.6rem;max-width:78rem;margin:0 auto;align-items:start}
.recit-corps{max-width:66ch}.chapeau{font-size:1.18rem;font-weight:600}.recit h2{font-size:1.4rem;margin-top:1.8rem}
.encart{position:sticky;top:6rem;background:var(--bakelite);color:var(--papier);border-radius:10px;padding:2rem 1.5rem 1.4rem}
.encart .vis{background:radial-gradient(circle at 35% 35%,#8a8170,#2a251f 70%)}
.en-voyant{display:flex;align-items:center;gap:.6rem;font:1.2rem/1 var(--mono);text-transform:uppercase;color:var(--orange)}
.encart .voyant{animation:clignote 1.6s steps(1) infinite}
@media (max-width:900px){.recit{grid-template-columns:1fr}.encart{position:static}}
.depeches{max-width:78rem;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1.2rem}
.depeche{background:var(--papier);padding:1.3rem 1.3rem 1.1rem;border-left:5px solid var(--granit-f);box-shadow:0 8px 16px -12px rgba(0,0,0,.45)}
.de-tete{font:1.05rem/1 var(--mono);text-transform:uppercase;color:var(--granit-f);margin-bottom:.6rem}
.depeche h3{font-size:1rem}.depeche p:last-child{margin:0;font-size:.97rem}

/* pages services : oscilloscope */
.oscillo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem clamp(1.6rem,4vw,3.4rem);max-width:84rem;margin:0 auto;align-items:center}
.oscillo h1{font-size:clamp(1.7rem,4vw,3.1rem)}.oscillo h1 em{font-style:normal;display:block;color:var(--orange-f)}
.os-ecran{position:relative;background:var(--bakelite);border-radius:14px;padding:2.2rem 1.6rem 1.4rem;box-shadow:0 10px 0 #12100d}
.os-ecran .vis{background:radial-gradient(circle at 35% 35%,#8a8170,#2a251f 70%)}
.os-signal{font:2.6rem/1 var(--mono);color:var(--t);text-shadow:0 0 12px var(--t);margin:0 0 .8rem}
.onde{width:100%;height:180px;background:var(--ecran);border-radius:6px;box-shadow:inset 0 0 30px rgba(0,0,0,.8)}
.on-grille{stroke:rgba(125,255,138,.15);stroke-width:1;fill:none}
.on-trace{fill:none;stroke:var(--t);stroke-width:2.5;filter:drop-shadow(0 0 4px var(--t));vector-effect:non-scaling-stroke}
.os-mesures{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem;margin:.9rem 0 0;font:1.1rem var(--mono);color:#a9a18b;text-transform:uppercase}
.chapo{font-size:1.12rem;max-width:58ch}
@media (max-width:1000px){.oscillo{grid-template-columns:1fr}}
.corps-service{display:grid;grid-template-columns:minmax(0,1fr) 22rem;gap:2.6rem;max-width:78rem;margin:0 auto;align-items:start}
.cs-texte{max-width:68ch}
.cs-photo{position:relative;margin:0 0 1.6rem;padding:14px;background:linear-gradient(180deg,#c9c2aa,#b2aa8f);border-radius:10px}
.cs-photo img{width:100%;height:auto;border-radius:4px}.cs-photo figcaption{font:1.05rem/1.2 var(--mono);text-transform:uppercase;margin-top:.6rem;color:#4b443a}
.corps-service .fiche{position:sticky;top:6rem}
@media (max-width:900px){.corps-service{grid-template-columns:1fr}.corps-service .fiche{position:static}}
.consigne{max-width:62rem}

/* pages simples, guides */
.tete-simple{max-width:62rem;margin:0 auto}
.tete-simple h1{font-size:clamp(1.8rem,4.4vw,3.2rem)}.tete-simple h1 em{font-style:normal;color:var(--orange-f)}
.tete-simple.vide{text-align:center}.tete-simple.vide .actions{justify-content:center}.tete-simple.vide .chapo{margin:0 auto 1.6rem}
.code-ecran{display:inline-block;font:1.6rem/1 var(--mono);color:var(--phos);background:var(--ecran);padding:.7rem 1.1rem;border-radius:6px;margin-bottom:1.4rem;text-shadow:0 0 8px var(--phos)}
.tete-guide{background:var(--bakelite);color:var(--papier)}
.tete-guide>*{max-width:62rem;margin-left:auto;margin-right:auto}
.tete-guide .kicker{color:var(--orange)}.tete-guide h1{font-size:clamp(1.6rem,3.8vw,2.8rem)}.tete-guide .chapo{color:#d8d2bf}
.sommaire{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.sommaire a{display:flex;gap:.5rem;padding:.5rem .8rem;background:var(--ecran);color:var(--phos);border-radius:4px;text-decoration:none;font:1.15rem/1.1 var(--mono)}
.sommaire a span{color:var(--orange)}
.lecture{max-width:68ch;margin:0 auto;padding:3.4rem clamp(1.1rem,4vw,0px)}
.lecture .partie{padding:0;margin-bottom:2.4rem;scroll-margin-top:6rem}
.lecture h2{font-size:1.35rem}.pa-n{display:block;font:1.1rem/1 var(--mono);text-transform:uppercase;color:var(--orange-f);margin-bottom:.4rem}
.fin-guide{font-weight:600}
.mentions h1,.mentions h2{font-size:1.4rem}.mentions{padding-top:3rem}
.bande-lecture{position:fixed;left:0;right:0;bottom:0;z-index:30;height:22px;background:var(--papier);border-top:2px solid var(--bakelite);display:flex;align-items:center}
.bl-trous{display:block;height:100%;width:0;background:radial-gradient(circle,var(--bakelite) 3.5px,transparent 4px) 0 50%/14px 14px repeat-x}
.bl-pc{position:absolute;right:.6rem;font:1.05rem/1 var(--mono);background:var(--papier);padding:0 .3rem}

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