/* ============================================================================
   54-metoda.css · GRUPUL 9 · „Metoda"   namespace `xmt`   PREVIEW

   ⚠⚠ ZERO VALORI INVENTATE si ZERO TREPTE DE LITERA NOI. Ancorele:
        20-grup2.css:45-66        `.xgh` — antetul de grup. Se REFOLOSESTE.
        20-grup2.css:82-99        card, titlu de card, lede
        22-fair-value.css:71-77   pastila
        48-context.css            bara de percentila
        52-profiluri.css          plierea pe `checkbox` si sageata
   ⚠ `xmt` e namespace NOU.
   ============================================================================ */

.xmt{ font-family:var(--xf); color:var(--xc-ink); letter-spacing:-.004em;
  margin-top:var(--xsp-grup,92px); overflow-x:clip; }
.xmt *{ box-sizing:border-box; }
.xmt__gh2{ margin:0; }

/* ⚠ Pastila poarta pozitia generala. Culoarea vine din `--k`, pus in marcaj doar
   cand pozitia are un sens („in favoare" / „impotriva"); la „impartit" si
   „neutru" ramane fara, fiindca nu e nici bine, nici rau. */
.xmt__badge{ display:flex; flex-wrap:wrap; align-items:center; gap:9px 12px; margin:18px 0 0; }
.xmt__chip{ flex:none; display:inline-flex; align-items:baseline; gap:8px;
  padding:6px 14px; border-radius:var(--xr-p);
  background:color-mix(in srgb, var(--k, var(--xc-ink3)) 14%, transparent);
  font:600 var(--xf-sm)/1.2 var(--xf); color:var(--k, var(--xc-ink)); letter-spacing:0; }
.xmt__chip b::first-letter{ text-transform:uppercase; }
.xmt__chip em{ font-style:normal; font-weight:500; font-size:var(--xt-8); color:var(--xc-ink3); }

.xmt__lede{ margin:14px 0 0; font:400 var(--xf-sm)/1.55 var(--xf);
  letter-spacing:-.006em; color:var(--xc-ink); }
.xmt__lede b{ color:var(--xc-ink); font-weight:600; }

/* cate familii confirma, cate contrazic */
.xmt__rez{ display:flex; flex-wrap:wrap; gap:8px 18px; margin:12px 0 0;
  font:600 var(--xt-7)/1.3 var(--xf); }
.xmt__rez .is-a{ color:var(--xc-lime); }
.xmt__rez .is-c{ color:var(--xc-pink); }

.xmt__n{ margin:14px 0 0; font:400 var(--xt-7)/1.5 var(--xf); color:var(--xc-ink3); }
/* ⚠ Nota de metoda e cea care spune ca ponderile exista si nu se publica.
   Sta mai aproape de continut decat o nota obisnuita, fiindca e parte din
   promisiunea sectiunii, nu o precizare de subsol. */
.xmt__n--m{ margin-top:18px; padding-top:16px;
  background:var(--xsep) no-repeat top/100% 1px; color:var(--xc-ink2); }

.xmt__bento{ display:grid; grid-template-columns:repeat(6,1fr); gap:12px;
  margin:22px 0 0; align-items:start; }
.xmt__bento > *{ grid-column:span 6; min-width:0; }
.xmt__card{ min-width:0; background:var(--xs-card); border-radius:28px;
  padding:26px 24px 28px; box-shadow:var(--xe-lift); scroll-margin-top:78px; }
.xmt__ct{ margin:0 0 6px; font-weight:600;
  font-size:var(--xt-4); line-height:1.25;
  letter-spacing:-.012em; color:var(--xc-ink); }

/* ══ FAMILIILE DE SEMNALE ═══════════════════════════════════════════════════
   ⚠⚠ RANDUL ARATA DIRECTIA, NU MARIMEA. `score` si `weight` exista in date
      chiar langa `stance`, si NU se deseneaza: o bara ar fi dat marimea, iar
      marimea plus ponderea permite oricui sa reconstruiasca scorul compus.
      Cuvantul „in favoare" / „impotriva" spune tot ce trebuie sa stie
      cititorul, fara sa dea reteta.
   ⚠ Pliere pe `checkbox`: mai multe familii pot fi deschise deodata. */
.xmt__gs{ margin-top:12px; }
.xmt__g{ position:relative; }
.xmt__g + .xmt__g{ background:var(--xsep) no-repeat top/100% 1px; }
.xmt__ft{ position:absolute; opacity:0; pointer-events:none; }
.xmt__gh{ display:grid; grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center; gap:12px 14px; padding:15px 4px; cursor:pointer; }
.xmt__gh:not(label){ cursor:default; }
.xmt__gl{ min-width:0; }
.xmt__gl b{ display:block; font:600 var(--xt-6)/1.25 var(--xf); letter-spacing:-.012em;
  color:var(--xc-ink); }
/* ⚠ „confirma directia" / „contrazice directia" e informatia cea mai onesta din
   sectiune: arata unde modelul e sigur si unde se cearta cu el insusi. */
.xmt__rel{ display:block; margin-top:3px; font:500 var(--xt-8)/1.3 var(--xf);
  font-style:normal; color:var(--xc-ink3); }
.xmt__rel.is-a{ color:var(--xc-lime); }
.xmt__rel.is-c{ color:var(--xc-pink); }

.xmt__st{ justify-self:start; flex:none; padding:5px 12px; border-radius:var(--xr-p);
  background:color-mix(in srgb, var(--k, var(--xc-ink3)) 14%, transparent);
  font:600 var(--xt-8)/1.3 var(--xf); color:var(--k, var(--xc-ink2)); white-space:nowrap; }
.xmt__st::first-letter{ text-transform:uppercase; }

.xmt__ch{ flex:none; width:9px; height:9px; margin-right:4px;
  border-right:2px solid var(--xc-ink3); border-bottom:2px solid var(--xc-ink3);
  transform:translateY(-3px) rotate(45deg); transition:transform .18s ease; }
.xmt__ft:checked ~ .xmt__gh .xmt__ch{ transform:translateY(2px) rotate(-135deg); }
@media (prefers-reduced-motion:reduce){ .xmt__ch{ transition:none; } }

/* ce intra in familie · NUMELE semnalelor, fara scoruri */
.xmt__sv{ display:none; padding:0 4px 16px; }
.xmt__ft:checked ~ .xmt__sv{ display:block; }
.xmt__svt{ margin:0 0 8px; font:600 var(--xt-8)/1.3 var(--xf); color:var(--xc-ink3);
  letter-spacing:.02em; text-transform:uppercase; }
.xmt__sl{ list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; gap:8px; }
.xmt__sl li{ padding:7px 13px; border-radius:var(--xr-p); background:var(--xs-inset);
  font:500 var(--xt-7)/1.3 var(--xf); color:var(--xc-ink2); }

/* ══ PERCENTILA ═════════════════════════════════════════════════════════════
   ⚠ Percentila E publicabila: e o pozitie relativa, nu o formula. Spune „unde
     sta fata de restul", fara sa spuna cum s-a calculat scorul. */
.xmt__pw{ display:flex; align-items:center; gap:14px; margin:16px 0 0; }
.xmt__pb{ flex:1 1 auto; position:relative; height:var(--xbar);
  border-radius:var(--xr-p); background:var(--xs-track); overflow:hidden; }
.xmt__pb i{ display:block; height:100%; border-radius:var(--xr-p);
  background:var(--xc-ink3); }
.xmt__pw b{ flex:none; font:600 var(--xt-5)/1.1 var(--xf); letter-spacing:-.014em;
  font-variant-numeric:tabular-nums; color:var(--xc-ink); }
.xmt__rl{ margin:10px 0 0; font:500 var(--xf-sm)/1.35 var(--xf); color:var(--xc-ink2); }

.mdsx .xmt + .band{ border-top:0; background-image:none; }

@container mdsx (min-width:900px){
  .xmt__card{ border-radius:var(--xr-c); padding:29px 31px 31px; scroll-margin-top:82px; }
  .xmt__bento{ gap:13px; }
  .xmt__bento > .xmt__card:first-child{ grid-column:span 4; }
  .xmt__bento > .xmt__card:last-child{ grid-column:span 2; }
  .xmt__bento:has(> :only-child) > *{ grid-column:span 6; }
  .xmt__gh{ padding:18px 6px; gap:11px 16px;
    grid-template-columns:minmax(0,1fr) 128px auto; }
}

/* ══ CARDURILE DE CONFORMITATE (MAR / 2016/958) ═════════════════════════════
   ⚠ Trepte de litera: 12 · 13,5 · 17 · 20px, plus `--xf-sm`. Toate deja in tema. */

/* rand cheie-valoare, folosit la orizont si la prospetime */
.xmt__kvs{ margin-top:12px; }
.xmt__kv{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between;
  gap:6px 18px; padding:11px 0; font:400 var(--xf-sm)/1.4 var(--xf); color:var(--xc-ink2); }
.xmt__kv + .xmt__kv{ background:var(--xsep) no-repeat top/100% 1px; }
.xmt__kv b{ flex:none; font-weight:600; color:var(--xc-ink); text-align:right;
  font-variant-numeric:tabular-nums; }
/* ⚠ Sursa veche se MARCHEAZA, nu se ascunde — chiar asta cere Art. 3(1)(c). */
.xmt__kv.is-v b{ color:var(--xc-yellow); }
.xmt__kv b em{ display:block; margin-top:2px; font:500 var(--xt-8)/1.25 var(--xf);
  font-style:normal; color:var(--xc-ink3); }

/* ── analiza de senzitivitate · Art. 4(1)(e) ───────────────────────────────
   ⚠ Doua coloane: ce urca si ce coboara. Cuvintele duc mesajul; culoarea doar
     il accentueaza, ca peste tot in pagina. */
.xmt__sens{ display:grid; gap:12px; margin:18px 0 0;
  grid-template-columns:minmax(0,1fr); }
.xmt__sc{ padding:15px 17px; border-radius:var(--xr-i); background:var(--xs-inset); }
.xmt__sc p{ margin:0 0 8px; font:600 var(--xt-8)/1.3 var(--xf); letter-spacing:.02em;
  text-transform:uppercase; }
.xmt__sc.is-s p{ color:var(--xc-lime); }
.xmt__sc.is-j p{ color:var(--xc-pink); }
.xmt__sc ul{ list-style:none; margin:0; padding:0; }
.xmt__sc li{ padding:5px 0; font:400 var(--xf-sm)/1.4 var(--xf); color:var(--xc-ink2); }
.xmt__sc li b{ color:var(--xc-ink); font-weight:600; }

/* ── proiectiile · Art. 3(1)(d) ────────────────────────────────────────────
   ⚠ Eticheta „Proiecție" sta INAINTEA numelui, nu dupa: articolul cere ca
     proiectiile sa fie „etichetate clar si vizibil ca atare", iar ochiul citeste
     de la stanga. */
.xmt__pl{ list-style:none; margin:12px 0 0; padding:0; }
.xmt__pl li{ padding:12px 0; font:400 var(--xf-sm)/1.45 var(--xf); color:var(--xc-ink2); }
.xmt__pl li + li{ background:var(--xsep) no-repeat top/100% 1px; }
.xmt__pe{ display:inline-block; margin-right:9px; padding:3px 9px;
  border-radius:var(--xr-p); background:var(--xs-track);
  font:600 var(--xt-8)/1.3 var(--xf); letter-spacing:.03em; text-transform:uppercase;
  color:var(--xc-ink3); vertical-align:2px; }
.xmt__pl li b{ color:var(--xc-ink); font-weight:600; }
.xmt__pl li em{ display:block; margin-top:4px; font-style:normal; color:var(--xc-ink3); }

/* ── subsolul de conformitate ──────────────────────────────────────────────
   ⚠ LEGATURA E OBLIGATORIE pentru proportionalitate (Art. 3(2), 4(2), 6(4)).
     Fara ea, tot continutul ar trebui pe fiecare pagina de activ. */
.xmt__f{ margin:14px 0 0; font:400 var(--xt-7)/1.6 var(--xf); color:var(--xc-ink3); }
.xmt__lk{ color:var(--xc-ac); text-decoration:underline; text-underline-offset:3px; }
.xmt__lk:hover{ color:var(--xc-ink); }

@container mdsx (min-width:900px){
  .xmt__sens{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:13px; }
  /* cele trei carduri noi: doua pe rand, al treilea intreg */
  .xmt__bento > .xmt__card:nth-child(3),
  .xmt__bento > .xmt__card:nth-child(4){ grid-column:span 3; }
  .xmt__bento > .xmt__card:nth-child(5){ grid-column:span 6; }
}