/* =====================================================================
   SYO WEB — AUDIT · feuille de style
   Fichier : /assets/css/audit.css
   Appelée par audit.php. Aucune dépendance : tout est préfixé #ad,
   #ax-modal ou .ad- / .ax-
   ===================================================================== */

/* =========================================================
   AUDIT — direction « épure »
   Beaucoup de blanc, des filets d'un pixel, l'orange en
   ponctuation seulement. Prefixe #ad / .ad-
   ========================================================= */
#ad{
  --paper:#FAF8F5; --soft:#FFF4E9; --card:#FFFFFF; --ink:#0D0B0A; --dim:#7A736C;
  --faint:rgba(13,11,10,.09); --line:rgba(13,11,10,.13);
  --acc:#FF8A3D; --acc2:#F57323;
  --ok:#1F8A5B; --warn:#C9761B; --bad:#B23A2E;
  --ease:cubic-bezier(.22,1,.36,1);
  position:relative; overflow-x:clip;
  background:var(--paper); color:var(--ink);
  font-family:"Schibsted Grotesk",system-ui,-apple-system,Segoe UI,sans-serif;
}
[data-theme="dark"] #ad{
  --paper:#0A0908; --soft:#15100D; --card:#121010; --ink:#F6F1EB; --dim:#9C938B;
  --faint:rgba(246,241,235,.10); --line:rgba(246,241,235,.15);
  --ok:#3BE07E; --warn:#E2A24A; --bad:#E4695B;
}

/* ---- affichage forcé : app.js verrouille le body pour son intro ---- */
#intro,#cur-dot,#cur-ring{ display:none!important; }
html body.locked{ overflow:auto!important; height:auto!important; }
html body #ad,
html body #ad *:not(.ad-res):not(.ad-run):not(.ad-res *){
  opacity:1 !important; visibility:visible !important;
  transform:none !important; filter:none !important; clip-path:none !important;
  max-height:none !important;
}
html body #ad{ display:block !important; min-height:60vh; color:var(--ink) !important; }
html body #ad .ad-hero,html body #ad .ad-wrap,html body #ad .ad-run,
html body #ad .ad-block,html body #ad .ad-verdict{ display:block !important; height:auto !important; }
html body #ad .ad-form,html body #ad .ad-input,html body #ad .ad-steps,
html body #ad .ad-acts{ display:flex !important; }
html body #ad .ad-cats{ display:grid !important; }
html body #ad .ad-go,html body #ad .ad-btn,html body #ad .ad-eyebrow{ display:inline-flex !important; }
html body #ad .ad-top,html body #ad .ad-facts,html body #ad .ad-tools,
html body #ad .ad-cta{ display:grid !important; }
html body #ad h1,html body #ad p,html body #ad .ad-note,html body #ad .ad-err{ display:block !important; }

#ad *{ box-sizing:border-box; }
#ad a{ color:inherit; text-decoration:none; }
#ad button{ font:inherit; cursor:pointer; }

/* grain discret : c'est ce qui évite l'effet « fond blanc plat » */
#ad:before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  opacity:.035; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E"); }

.ad-wrap{ position:relative; z-index:2;
  width:min(1060px,calc(100% - clamp(20px,5vw,60px))); margin:0 auto; }

#ad .ad-aura{ position:absolute; z-index:0; pointer-events:none; border-radius:50%;
  width:min(700px,88vw); height:min(700px,88vw); left:50%; top:-18%;
  transform:translateX(-50%); filter:blur(100px); opacity:.22;
  background:radial-gradient(circle,var(--acc),transparent 62%); }

/* ---------- EN-TÊTE ---------- */
#ad .ad-hero{ padding:calc(var(--header-h,80px) + clamp(46px,8vh,92px)) 0 clamp(28px,5vh,44px);
  text-align:center; }

#ad .ad-eyebrow{ align-items:center; gap:.55rem;
  padding:.4rem .95rem; border:1px solid var(--line); border-radius:999px;
  font-size:.6rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase;
  color:var(--dim); background:transparent; }
#ad .ad-eyebrow:before{ content:""; width:5px; height:5px; border-radius:50%; background:var(--acc);
  box-shadow:0 0 0 0 rgba(255,138,61,.5); animation:adPulse 2.4s ease-out infinite; }
@keyframes adPulse{ 0%{ box-shadow:0 0 0 0 rgba(255,138,61,.45); } 70%,100%{ box-shadow:0 0 0 9px rgba(255,138,61,0); } }

#ad .ad-hero h1{ margin:1.5rem auto 0; max-width:14ch;
  font-size:clamp(2.1rem,5.6vw,4rem); line-height:1.02; letter-spacing:-.05em; font-weight:800;
  word-break:normal; overflow-wrap:normal; hyphens:none; }
#ad .ad-hero h1 mark{ position:relative; background:none; color:var(--acc); font-weight:800; }
/* trait tracé sous le mot accentué : la signature de la marque */
#ad .ad-hero h1 mark:after{ content:""; position:absolute; left:2%; right:2%; bottom:-.1em;
  height:.055em; border-radius:99px; background:var(--acc); opacity:.32;
  transform:scaleX(0); transform-origin:0 50%;
  animation:adTrait 1.1s var(--ease) .45s forwards; }
@keyframes adTrait{ to{ transform:scaleX(1); } }
#ad .ad-hero p{ margin:1.2rem auto 0; max-width:52ch; color:var(--dim);
  font-size:.9rem; line-height:1.85; font-weight:400; }

/* ---------- FORMULAIRE ---------- */
#ad .ad-form{ gap:.5rem; flex-wrap:wrap; justify-content:center;
  margin:2.2rem auto 0; max-width:600px; }
#ad .ad-input{ flex:1 1 320px; align-items:center; gap:.8rem;
  height:62px; padding:0 1.5rem; border-radius:999px;
  background:var(--card); border:1px solid var(--line);
  box-shadow:0 18px 40px -32px rgba(13,11,10,.5);
  transition:border-color .35s, box-shadow .35s, transform .35s var(--ease); }
#ad .ad-input:focus-within{ border-color:var(--acc);
  box-shadow:0 0 0 4px rgba(255,138,61,.12), 0 22px 46px -32px rgba(13,11,10,.5);
  transform:translateY(-1px); }
#ad .ad-input svg{ width:16px; height:16px; flex:0 0 auto; fill:none; stroke:var(--dim);
  stroke-width:1.6; stroke-linecap:round; }
#ad .ad-input input{ flex:1; min-width:0; border:0; outline:none; background:transparent;
  color:var(--ink); font:inherit; font-size:.92rem; }
#ad .ad-input input::placeholder{ color:var(--dim); opacity:.7; }

#ad .ad-go{ position:relative; align-items:center; justify-content:center; gap:.6rem;
  height:62px; padding:0 2.1rem; border-radius:999px; border:0; overflow:hidden;
  font-size:.66rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  background:var(--ink); color:var(--paper);
  box-shadow:0 20px 40px -24px rgba(13,11,10,.85);
  transition:transform .35s var(--ease), box-shadow .35s, color .4s; }
#ad .ad-go:after{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(120deg,var(--acc2),var(--acc));
  transform:translateY(101%); transition:transform .45s var(--ease); }
#ad .ad-go{ z-index:0; }
#ad .ad-go:hover{ transform:translateY(-2px); color:#160A02;
  box-shadow:0 26px 46px -22px rgba(255,138,61,.75); }
#ad .ad-go:hover:after{ transform:none; }
#ad .ad-go[disabled]{ opacity:.55; cursor:progress; transform:none; }
#ad .ad-note{ margin:1rem auto 0; font-size:.7rem; color:var(--dim); text-align:center; letter-spacing:.02em; }
#ad .ad-err{ margin:.8rem auto 0; text-align:center; font-size:.8rem; font-weight:600; color:var(--bad); min-height:1.2em; }

/* ---------- ÉCRAN D'ANALYSE ---------- */
#ad .ad-run{ display:none; margin:2.4rem auto 0; max-width:520px; text-align:center; }
#ad .ad-run.on{ display:block; }
#ad .ad-runbar{ height:2px; border-radius:99px; background:var(--faint); overflow:hidden; margin-bottom:1.3rem; }
#ad .ad-runbar i{ display:block; height:100%; width:0; border-radius:99px;
  background:var(--acc); transition:width .4s var(--ease); }
#ad .ad-run b{ display:block; font-size:.98rem; font-weight:700; letter-spacing:-.02em; }
#ad .ad-run span{ display:block; margin-top:.5rem; font-size:.78rem; color:var(--dim); line-height:1.7; }
#ad .ad-steps{ flex-wrap:wrap; gap:.35rem; justify-content:center; margin-top:1.4rem; }
#ad .ad-steps i{ font-style:normal; font-size:.56rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; padding:.32rem .7rem; border-radius:99px;
  border:1px solid var(--faint); color:var(--dim); opacity:.4; transition:.4s; }
#ad .ad-steps i.on{ opacity:1; color:var(--ink); border-color:var(--line); }

/* ---------- RÉSULTATS ---------- */
#ad .ad-res{ display:none; padding:clamp(1.4rem,4vw,2.4rem) 0 clamp(3rem,8vh,5rem); }
#ad .ad-res.on{ display:block; }

/* bandeau du score : très aéré, sans encadré lourd */
#ad .ad-top{ position:relative; grid-template-columns:auto 1fr; gap:clamp(1.6rem,4vw,3.2rem);
  align-items:center; padding:clamp(1.8rem,4vw,2.8rem);
  border:1px solid var(--line); border-radius:26px; overflow:hidden;
  background:var(--card); box-shadow:0 34px 70px -54px rgba(13,11,10,.6); }
/* halo orange derrière l'anneau : le seul aplat coloré de la page */
#ad .ad-top:before{ content:""; position:absolute; left:-4%; top:-40%;
  width:280px; height:280px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(255,138,61,.14),transparent 65%); }
#ad .ad-top > *{ position:relative; }
@media(max-width:640px){ #ad .ad-top{ grid-template-columns:1fr; text-align:center; justify-items:center; } }

#ad .ad-ring{ position:relative; width:148px; height:148px; flex:0 0 auto; }
#ad .ad-ring svg{ width:100%; height:100%; transform:rotate(-90deg); }
#ad .ad-ring circle{ fill:none; stroke-width:4; stroke-linecap:round; }
#ad .ad-ring .bg{ stroke:var(--faint); }
#ad .ad-ring .fg{ stroke:var(--acc); stroke-dasharray:352; stroke-dashoffset:352;
  transition:stroke-dashoffset 1.6s var(--ease); }
#ad .ad-ring b{ position:absolute; inset:0; display:grid; place-items:center;
  font-size:3.1rem; font-weight:200; letter-spacing:-.07em; }
#ad .ad-ring b small{ font-size:.32em; opacity:.45; font-weight:600; letter-spacing:0; }

#ad .ad-verdict h2{ margin:0; font-size:clamp(1.25rem,2.8vw,1.9rem); font-weight:800; letter-spacing:-.035em; }
#ad .ad-verdict p{ margin:.7rem 0 0; font-size:.86rem; line-height:1.8; color:var(--dim); max-width:50ch; }
#ad .ad-url{ display:inline-flex; align-items:center; gap:.5rem; margin-top:1rem;
  font-family:"JetBrains Mono",ui-monospace,monospace; font-size:.62rem; color:var(--dim);
  max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:.02em; }
#ad .ad-url b{ color:var(--acc); font-weight:600; }

/* les trois compteurs de priorités, sous le verdict */
#ad .ad-counts{ display:flex; flex-wrap:wrap; gap:.45rem; margin-top:1.1rem; }
#ad .ad-counts .c{ display:inline-flex; align-items:center; gap:.4rem;
  padding:.4rem .8rem; border-radius:99px; border:1px solid var(--faint);
  font-size:.68rem; font-weight:600; color:var(--dim); }
#ad .ad-counts .c b{ font-size:.86rem; font-weight:800; }
#ad .ad-counts .c.hi{ border-color:rgba(178,58,46,.35); }
#ad .ad-counts .c.hi b{ color:var(--bad); }
#ad .ad-counts .c.mid{ border-color:rgba(201,118,27,.35); }
#ad .ad-counts .c.mid b{ color:var(--warn); }
#ad .ad-counts .c.lo b{ color:var(--dim); }

/* =========================================================
   LES SIX CATÉGORIES — cartes à jauge circulaire
   Une grille plutôt qu'une liste : on compare les six d'un
   seul regard, ce qu'une colonne empilée ne permet pas.
   ========================================================= */
#ad .ad-cats{ display:grid; grid-template-columns:repeat(3,1fr);
  gap:.7rem; margin-top:1.4rem; }
@media(max-width:900px){ #ad .ad-cats{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:600px){ #ad .ad-cats{ grid-template-columns:1fr; } }

#ad .ad-cat{ display:block; padding:1.3rem 1.35rem; border-radius:20px;
  background:var(--card); border:1px solid var(--line);
  opacity:0; transform:translateY(18px);
  transition:opacity .65s var(--ease) var(--d,0s), transform .7s var(--ease) var(--d,0s),
             border-color .35s, box-shadow .35s, transform .35s var(--ease); }
#ad .ad-cat.in{ opacity:1; transform:none; }
#ad .ad-cat:hover{ border-color:var(--acc); box-shadow:0 26px 50px -40px rgba(13,11,10,.55); }
#ad .ad-cat.nm{ background:var(--paper); }

#ad .ad-cat-hd{ display:grid; grid-template-columns:auto 1fr; gap:.95rem; align-items:center; }

/* la jauge circulaire */
#ad .ad-gauge{ position:relative; width:56px; height:56px; flex:0 0 auto; }
#ad .ad-gauge svg{ width:100%; height:100%; transform:rotate(-90deg); }
#ad .ad-gauge circle{ fill:none; stroke-width:3.5; stroke-linecap:round; }
#ad .ad-gauge .g-bg{ stroke:var(--faint); }
#ad .ad-gauge .g-fg{ transition:stroke-dashoffset 1.1s var(--ease); }
#ad .ad-gauge em{ position:absolute; inset:0; display:grid; place-items:center;
  font-style:normal; font-size:1.15rem; font-weight:600; letter-spacing:-.04em; }
#ad .ad-gauge em.nm{ font-size:1rem; color:var(--dim); }

#ad .ad-cat-tx{ min-width:0; }
#ad .ad-cat-tx b{ display:block; font-size:.92rem; font-weight:700; letter-spacing:-.02em; }
#ad .ad-cat-tx small{ display:block; margin-top:.28rem; font-size:.72rem;
  color:var(--dim); line-height:1.5; }

/* l'étiquette de niveau : lue avant le chiffre */
#ad .ad-tagn{ grid-column:1 / -1; justify-self:start; margin-top:.9rem;
  padding:.3rem .7rem; border-radius:99px; border:1px solid var(--faint);
  font-size:.56rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
  color:var(--dim); }

/* le détail du calcul */
#ad .ad-why{ margin-top:1rem; padding-top:.9rem; border-top:1px solid var(--faint); }
#ad .ad-why summary{ list-style:none; cursor:pointer; font-size:.62rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; color:var(--acc);
  display:inline-flex; align-items:center; gap:.35rem; }
#ad .ad-why summary::-webkit-details-marker{ display:none; }
#ad .ad-why summary:after{ content:"+"; font-size:.8rem; transition:transform .3s; }
#ad .ad-why[open] summary:after{ transform:rotate(45deg); }
#ad .ad-why ul{ list-style:none; margin:.75rem 0 0; padding:.9rem 1rem; border-radius:12px;
  background:var(--soft); display:flex; flex-direction:column; gap:.45rem; }
#ad .ad-why li{ display:grid; grid-template-columns:14px 1fr auto; gap:.6rem; align-items:baseline;
  font-size:.72rem; line-height:1.55; color:var(--dim); }
#ad .ad-why li i{ font-style:normal; font-weight:800; }
#ad .ad-why li.y i{ color:var(--ok); }
#ad .ad-why li.n i{ color:var(--bad); }
#ad .ad-why li b{ color:var(--ink); font-weight:600; }
#ad .ad-why li u{ text-decoration:none; font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.58rem; opacity:.6; white-space:nowrap; }

/* recommandations : des lignes, une pastille de couleur */
#ad .ad-block{ margin-top:clamp(2rem,5vw,3rem); }
#ad .ad-block > h3{ margin:0 0 1.2rem; font-size:.6rem; font-weight:800;
  letter-spacing:.24em; text-transform:uppercase; color:var(--dim); }

#ad .ad-issue{ display:grid; grid-template-columns:auto 1fr; gap:1rem;
  padding:1.15rem 0; border-bottom:1px solid var(--faint); }
#ad .ad-issue{ padding:1.25rem 1rem; margin:0 -1rem; border-radius:14px; transition:background .35s; }
#ad .ad-issue:hover{ background:var(--soft); }
#ad .ad-issue .dot{ width:9px; height:9px; border-radius:50%; margin-top:.42rem; }
#ad .ad-issue.hi .dot{ box-shadow:0 0 0 5px rgba(178,58,46,.12); }
#ad .ad-issue.mid .dot{ box-shadow:0 0 0 5px rgba(201,118,27,.12); }
#ad .ad-issue.hi  .dot{ background:var(--bad); }
#ad .ad-issue.mid .dot{ background:var(--warn); }
#ad .ad-issue.lo  .dot{ background:var(--faint); }
#ad .ad-issue b{ display:block; font-size:.92rem; font-weight:700; letter-spacing:-.02em; }
#ad .ad-issue p{ margin:.45rem 0 0; font-size:.8rem; line-height:1.75; color:var(--dim); max-width:62ch; }

/* mesures : une grille très légère */
#ad .ad-facts{ grid-template-columns:repeat(4,1fr); gap:1px; background:var(--faint);
  border:1px solid var(--faint); border-radius:16px; overflow:hidden; }
@media(max-width:820px){ #ad .ad-facts{ grid-template-columns:repeat(2,1fr); } }
#ad .ad-fact{ padding:1.15rem 1.2rem; background:var(--card); transition:background .35s; }
#ad .ad-fact:hover{ background:var(--soft); }
#ad .ad-fact span{ display:block; font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.54rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); }
#ad .ad-fact b{ display:block; margin-top:.45rem; font-size:1.08rem; font-weight:600; letter-spacing:-.025em; }
#ad .ad-src{ margin-top:1rem; font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.58rem; color:var(--dim); text-align:center; letter-spacing:.04em; }

/* ---------- ACTIONS ---------- */
#ad .ad-tools{ grid-template-columns:1fr 1fr; gap:.7rem; margin-top:clamp(2rem,5vw,3rem); }
@media(max-width:680px){ #ad .ad-tools{ grid-template-columns:1fr; } }

#ad .ad-tool{ position:relative; display:flex; align-items:center; gap:1.1rem;
  padding:1.5rem 1.6rem; border-radius:22px; text-align:left;
  background:var(--card); border:1px solid var(--line); overflow:hidden;
  transition:border-color .4s, transform .4s var(--ease), box-shadow .4s; }
#ad .ad-tool:hover{ border-color:var(--acc); transform:translateY(-3px);
  box-shadow:0 30px 56px -40px rgba(13,11,10,.5); }
#ad .ad-tool .ic{ width:46px; height:46px; flex:0 0 auto; border-radius:14px;
  display:grid; place-items:center; background:var(--soft); transition:.4s; }
#ad .ad-tool .ic svg{ width:18px; height:18px; fill:none; stroke:var(--acc);
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; transition:stroke .4s; }
#ad .ad-tool:hover .ic{ background:var(--acc); }
#ad .ad-tool:hover .ic svg{ stroke:#160A02; }
#ad .ad-tool b{ display:block; font-size:.88rem; font-weight:700; letter-spacing:-.02em; }
#ad .ad-tool small{ display:block; margin-top:.3rem; font-size:.72rem; color:var(--dim); line-height:1.55; }
#ad .ad-tool .go{ margin-left:auto; font-size:.95rem; color:var(--acc); transition:transform .4s var(--ease); }
#ad .ad-tool:hover .go{ transform:translateX(4px); }
#ad .ad-tool.pro{ background:var(--ink); border-color:var(--ink); color:var(--paper); }
#ad .ad-tool.pro .ic{ background:rgba(255,255,255,.1); }
#ad .ad-tool.pro .ic svg{ stroke:var(--acc); }
#ad .ad-tool.pro:hover{ border-color:var(--acc); }
#ad .ad-tool.pro:hover .ic{ background:var(--acc); }
#ad .ad-tool.pro small{ color:rgba(246,241,235,.66); }
[data-theme="dark"] #ad .ad-tool.pro small{ color:rgba(13,11,10,.6); }

/* ---------- CTA ---------- */
#ad .ad-cta{ margin-top:clamp(2rem,5vw,3rem); position:relative; overflow:hidden;
  border-radius:24px; padding:clamp(1.6rem,4vw,2.6rem);
  background:var(--soft); border:1px solid var(--line);
  grid-template-columns:1fr auto; gap:1.4rem; align-items:center; }
@media(max-width:700px){ #ad .ad-cta{ grid-template-columns:1fr; } }
#ad .ad-cta h3{ margin:0; font-size:clamp(1.15rem,2.5vw,1.7rem);
  line-height:1.15; font-weight:800; letter-spacing:-.035em; max-width:20ch; }
#ad .ad-cta p{ margin:.7rem 0 0; max-width:50ch; font-size:.84rem; line-height:1.8; color:var(--dim); }
#ad .ad-acts{ gap:.5rem; flex-wrap:wrap; }
#ad .ad-btn{ align-items:center; justify-content:center; gap:.5rem;
  height:48px; padding:0 1.4rem; border-radius:999px; border:1px solid transparent;
  font-size:.64rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
  background:var(--ink); color:var(--paper); transition:transform .3s var(--ease), background .3s; }
#ad .ad-btn.ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
#ad .ad-btn:hover{ transform:translateY(-2px); background:var(--acc); color:#160A02; border-color:transparent; }
#ad .ad-again{ display:block; margin:1.6rem auto 0; background:none; border:0;
  font-size:.7rem; font-weight:600; color:var(--dim); text-decoration:underline;
  text-underline-offset:3px; }
#ad .ad-again:hover{ color:var(--acc); }

/* ---------- FENÊTRE PDF / RENDEZ-VOUS ---------- */
html.ax-lock, html.ax-lock body{ overflow:hidden; }

#ax-modal{ position:fixed; inset:0; z-index:150; display:grid; place-items:center;
  padding:clamp(10px,3vw,36px); opacity:0; visibility:hidden;
  transition:opacity .35s ease, visibility .35s; }
#ax-modal.on{ opacity:1; visibility:visible; }
#ax-modal .ax-back{ position:absolute; inset:0; border:0; cursor:pointer;
  background:rgba(10,8,6,.55); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
#ax-modal .ax-panel{ position:relative; width:min(490px,100%); max-height:90vh; overflow-y:auto;
  background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:28px;
  padding:clamp(1.6rem,4vw,2.4rem);
  box-shadow:0 50px 110px -46px rgba(8,6,5,.65);
  transform:translateY(18px) scale(.97); transition:transform .5s var(--ease); }
#ax-modal.on .ax-panel{ transform:none; }
#ax-modal .ax-x{ position:absolute; top:16px; right:16px; width:34px; height:34px; border-radius:50%;
  display:grid; place-items:center; border:1px solid var(--line); background:transparent;
  color:var(--dim); font-size:1rem; transition:.3s; }
#ax-modal .ax-x:hover{ transform:rotate(90deg); color:var(--acc); border-color:var(--acc); }

#ax-modal .ax-k{ font-size:.56rem; font-weight:800; letter-spacing:.24em;
  text-transform:uppercase; color:var(--acc); }
#ax-modal h3{ margin:.6rem 0 0; font-size:1.3rem; font-weight:800; letter-spacing:-.035em; line-height:1.15; }
#ax-modal .ax-sub{ margin:.6rem 0 1.4rem; font-size:.8rem; line-height:1.75; color:var(--dim); }
#ax-modal .ax-site{ margin:0 0 1.3rem; padding:.7rem .9rem; border-radius:12px;
  background:var(--soft); font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.62rem; color:var(--dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#ax-modal .ax-site b{ color:var(--acc); font-weight:600; }

#ax-modal .ax-f{ display:flex; flex-direction:column; gap:.35rem; margin-bottom:.8rem; }
#ax-modal .ax-f label{ font-size:.58rem; font-weight:800; letter-spacing:.16em;
  text-transform:uppercase; color:var(--dim); }
#ax-modal .ax-f input,#ax-modal .ax-f select,#ax-modal .ax-f textarea{
  height:48px; padding:0 1rem; border-radius:12px;
  border:1px solid var(--line); background:var(--paper); color:var(--ink);
  font:inherit; font-size:.88rem; outline:none; transition:border-color .3s, box-shadow .3s; }
#ax-modal .ax-f textarea{ height:auto; min-height:84px; padding:.8rem 1rem; resize:vertical; }
#ax-modal .ax-f input:focus,#ax-modal .ax-f select:focus,#ax-modal .ax-f textarea:focus{
  border-color:var(--acc); box-shadow:0 0 0 4px rgba(255,138,61,.1); }
#ax-modal .ax-f.err input{ border-color:var(--bad); }
#ax-modal .ax-two{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
@media(max-width:520px){ #ax-modal .ax-two{ grid-template-columns:1fr; } }
#ax-modal .ax-hp{ position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; opacity:0 !important; }

#ax-modal .ax-send{ width:100%; height:54px; margin-top:.8rem; border:0; border-radius:999px;
  box-shadow:0 20px 38px -24px rgba(13,11,10,.8);
  font-size:.64rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:var(--paper); background:var(--ink);
  transition:transform .3s var(--ease), background .3s, color .3s; }
#ax-modal .ax-send:hover{ transform:translateY(-2px); background:var(--acc); color:#160A02; }
#ax-modal .ax-send[disabled]{ opacity:.55; cursor:progress; transform:none; }
#ax-modal .ax-msg{ margin-top:.9rem; min-height:1.2em; font-size:.78rem; font-weight:600; text-align:center; }
#ax-modal .ax-legal{ margin-top:1rem; font-size:.66rem; line-height:1.65; color:var(--dim); text-align:center; }

@media(prefers-reduced-motion:reduce){
  #ad *{ animation:none !important; transition:none !important; }
  #ad .ad-cat{ opacity:1; transform:none; }
}