/* Ghidurile (site/ghid.mjs, 22.10.2026). Tokenurile (--primary, --line, --slate900, --bg, --hero1, .wrap,
   .eyebrow, .hero, .btn) vin din stilul comun al paginilor statice; aici doar ce e propriu ghidului. */

.g-progres{position:fixed;left:0;right:0;top:0;height:3px;z-index:60;pointer-events:none}
.g-progres i{display:block;height:100%;background:linear-gradient(90deg,#14b8a6,var(--primary));transform-origin:0 50%;transform:scaleX(0)}

.g-hero{text-align:center}
.g-hero h1{max-width:20ch;margin-inline:auto;text-wrap:balance}
.g-hero .g-sub{max-width:62ch;margin:16px auto 0;color:#c7dcdb;font-size:17px;line-height:1.65}
.g-fir{margin-bottom:14px;font-size:13.5px}
.g-fir a{color:#9fd8d2;text-decoration:none}
.g-fir a::before{content:"← "}
.g-fir a:hover{color:#fff}
.g-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px;margin-top:22px}
.g-meta > span{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#dcefed;font-size:13.5px}

.g-wrap{max-width:1180px;margin:0 auto;padding:clamp(28px,5vw,56px) 20px clamp(40px,6vw,72px);display:grid;grid-template-columns:minmax(0,1fr);gap:40px}
@media (min-width:1100px){.g-wrap{grid-template-columns:230px minmax(0,760px);justify-content:center;gap:56px}}
.g-art{min-width:0;color:#2b4442;font-size:17px;line-height:1.75}
.g-art p{margin:0 0 16px}
.g-art a{color:var(--primary)}
.g-art a.btn-p{color:#fff}
.g-art a.btn-p:hover{color:#fff}
.g-art strong{color:var(--slate900)}

/* Cuprins: lateral si fix pe ecran lat, pliabil pe telefon. */
.g-toc{display:none}
@media (min-width:1100px){
  .g-toc{display:block;position:sticky;top:96px;align-self:start;max-height:calc(100vh - 120px);overflow:auto;padding-right:6px}
  .g-toc-m{display:none}
}
.g-toc-t{display:block;font:700 12px/1.2 'Inter',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#5b7372;margin-bottom:12px}
.g-toc ol,.g-toc-m ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;counter-reset:t}
.g-toc a,.g-toc-m a{display:block;padding:7px 10px;border-left:2px solid var(--line);color:#46605e;text-decoration:none;font-size:14px;line-height:1.4;border-radius:0 8px 8px 0}
.g-toc a:hover,.g-toc-m a:hover{color:var(--slate900);background:rgba(22,131,135,.06)}
.g-toc a.is-activ{border-left-color:var(--primary);color:var(--primary);font-weight:600;background:rgba(22,131,135,.07)}
.g-toc-sus{display:inline-block!important;margin-top:14px;border:0!important;font-size:13px!important;color:#5b7372!important}
.g-toc-m{margin:0 0 26px;border:1px solid var(--line);border-radius:14px;background:#fff}
.g-toc-m summary{cursor:pointer;padding:14px 18px;font-weight:600;color:var(--slate900);list-style:none}
.g-toc-m summary::-webkit-details-marker{display:none}
.g-toc-m summary::after{content:" ▾";color:var(--primary)}
.g-toc-m ol{padding:0 12px 14px}

/* În 30 de secunde */
.g-rezumat{background:linear-gradient(180deg,rgba(22,131,135,.08),rgba(22,131,135,.03));border:1px solid rgba(22,131,135,.22);border-radius:18px;padding:22px 24px 10px;margin:0 0 26px}
.g-rezumat-t{font-size:15px!important;letter-spacing:.1em;text-transform:uppercase;color:var(--primary)!important;margin:0 0 12px!important}
.g-rezumat ul{list-style:none;margin:0;padding:0}
.g-rezumat li{position:relative;padding:0 0 12px 30px;font-size:16px;line-height:1.6}
.g-rezumat li::before{content:"";position:absolute;left:4px;top:7px;width:12px;height:7px;border-left:2.5px solid var(--primary);border-bottom:2.5px solid var(--primary);transform:rotate(-45deg)}

/* Faptele cheie */
.g-fapte{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:0 0 34px}
.g-fapte > div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.g-fapte dt{font:600 11.5px/1.3 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#5b7372}
.g-fapte dd{margin:6px 0 0;font:700 17px/1.35 'Urbanist','Inter',sans-serif;color:var(--slate900)}

/* Sectiuni */
.g-art section.g-sec{padding:0;scroll-margin-top:90px;margin-top:48px;background:transparent}
.g-sec h2{position:relative;font-size:clamp(23px,2.6vw,29px);line-height:1.25;color:var(--slate900);margin:0 0 16px}
.g-ancora{margin-left:.35em;opacity:0;color:var(--primary);text-decoration:none;transition:opacity .15s}
.g-sec h2:hover .g-ancora{opacity:.7}
.g-lista,.g-bife{margin:0 0 18px;padding:0;list-style:none;display:grid;gap:8px}
.g-lista li{position:relative;padding-left:22px}
.g-lista li::before{content:"";position:absolute;left:4px;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--primary)}
.g-bife li{position:relative;padding:10px 14px 10px 42px;background:#fff;border:1px solid var(--line);border-radius:12px;font-size:16px;line-height:1.55}
.g-bife li::before{content:"";position:absolute;left:16px;top:16px;width:13px;height:7px;border-left:2.5px solid var(--primary);border-bottom:2.5px solid var(--primary);transform:rotate(-45deg)}
.g-cit{font-size:.72em;line-height:0;margin-left:1px;margin-right:1px}
.g-cit a{display:inline-block;min-width:1.15em;padding:0 2px;border-radius:5px;background:rgba(22,131,135,.1);color:var(--primary)!important;text-decoration:none;font-weight:700;text-align:center}
.g-cit a:hover{background:var(--primary);color:#fff!important}

.g-nota{border-left:3px solid var(--primary);background:#fff;border-radius:0 14px 14px 0;padding:16px 20px;margin:0 0 20px;box-shadow:0 1px 0 rgba(15,60,62,.04)}
.g-nota p{margin:0}
.g-nota-t{display:block;margin-bottom:4px;color:var(--primary)!important}
.g-nota--atentie{border-left-color:#d97706;background:#fffbeb}
.g-nota--atentie .g-nota-t{color:#b45309!important}
.g-nota--practica{border-left-color:#0f766e;background:#f0fdfa}

.g-tabel{overflow-x:auto;margin:0 0 22px;border:1px solid var(--line);border-radius:14px;background:#fff}
.g-tabel:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.g-tabel table{width:100%;border-collapse:collapse;font-size:14.5px;line-height:1.55;min-width:560px}
.g-tabel th,.g-tabel td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.g-tabel thead th{font:700 11.5px/1.3 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#0f5e61;background:#f3f8f7}
.g-tabel tbody th{color:var(--slate900);font-weight:600}
.g-tabel tbody tr:last-child > *{border-bottom:0}

.g-cron{list-style:none;margin:0 0 22px;padding:0;position:relative}
.g-cron::before{content:"";position:absolute;left:58px;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--primary),rgba(22,131,135,.15))}
.g-cron li{display:grid;grid-template-columns:72px 1fr;gap:18px;padding:0 0 18px;position:relative}
.g-cron li::before{content:"";position:absolute;left:53px;top:6px;width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid var(--primary)}
.g-cron-t{font:800 15px/1.2 'Urbanist','Inter',sans-serif;color:var(--primary);text-align:right;padding-right:26px;padding-top:2px}
.g-cron--lat::before{left:92px}
.g-cron--lat li{grid-template-columns:106px 1fr}
.g-cron--lat li::before{left:87px}
.g-cron strong{display:block;color:var(--slate900);font-size:16.5px}
.g-cron p{margin:4px 0 0;font-size:15.5px;line-height:1.6}

.g-pasi{list-style:none;margin:0 0 22px;padding:0;counter-reset:p;display:grid;gap:12px}
.g-pasi li{counter-increment:p;position:relative;padding:14px 16px 14px 60px;background:#fff;border:1px solid var(--line);border-radius:14px}
.g-pasi li::before{content:counter(p);position:absolute;left:14px;top:14px;width:32px;height:32px;border-radius:10px;background:rgba(22,131,135,.1);color:var(--primary);display:flex;align-items:center;justify-content:center;font:800 15px/1 'Urbanist',sans-serif}
.g-pasi strong{display:block;color:var(--slate900)}
.g-pasi p{margin:4px 0 0;font-size:15.5px;line-height:1.6}

.g-citat{margin:0 0 22px;padding:18px 22px;border-radius:16px;background:var(--hero1);color:#e6f4f2}
.g-citat p{margin:0;font-size:17px;line-height:1.65}
.g-citat cite{display:block;margin-top:10px;font-style:normal;font-size:13.5px;color:#9fd8d2}

/* Instrumentul interactiv */
.g-unealta{margin:0 0 24px;padding:22px;border-radius:18px;background:#fff;border:2px solid rgba(22,131,135,.35);box-shadow:0 10px 30px -18px rgba(15,60,62,.35)}
.g-unealta-t{display:flex;align-items:center;gap:10px;font:800 19px/1.3 'Urbanist','Inter',sans-serif;color:var(--slate900);margin:0 0 4px}
.g-unealta-t::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--primary);transform:rotate(45deg)}
.g-unealta fieldset{border:0;margin:16px 0 0;padding:0}
.g-unealta legend{font-weight:700;color:var(--slate900);font-size:15.5px;margin-bottom:8px;padding:0}
.g-optiuni{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}
.g-optiuni label{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:11px;cursor:pointer;font-size:14.5px;line-height:1.45;background:#fbfdfd;transition:border-color .15s,background .15s}
.g-optiuni label:hover{border-color:var(--primary)}
.g-optiuni input{margin-top:3px;accent-color:var(--primary)}
.g-optiuni label:has(input:checked){border-color:var(--primary);background:rgba(22,131,135,.07)}
.g-optiuni label:has(input:focus-visible){outline:2px solid var(--primary);outline-offset:2px}
.g-rezultat{margin-top:18px;padding:18px 20px;border-radius:14px;background:#f3f8f7;border:1px solid var(--line)}
.g-rezultat[hidden]{display:none}
.g-rezultat h3{font-size:18px;color:var(--slate900);margin:0 0 8px}
.g-rezultat .btn{margin-top:12px}
.g-eticheta{display:inline-block;padding:4px 10px;border-radius:999px;font:700 12px/1.4 'Inter',sans-serif;letter-spacing:.04em;text-transform:uppercase;margin-bottom:10px}
.g-eticheta--da{background:#fee2e2;color:#b91c1c}
.g-eticheta--poate{background:#fef3c7;color:#b45309}
.g-eticheta--nu{background:#dcfce7;color:#15803d}

/* Apelul din mijloc */
.g-apel{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;justify-content:space-between;margin:40px 0 0;padding:22px 24px;border-radius:18px;background:var(--hero1);color:#fff}
.g-apel strong{display:block;color:#fff;font:800 19px/1.3 'Urbanist','Inter',sans-serif}
.g-apel p{margin:6px 0 0;color:#c7dcdb;font-size:15px;line-height:1.55;max-width:46ch}

.g-faq{max-width:none}
.g-mic{font-size:14.5px;color:#5b7372}
.g-surse ol{margin:0;padding-left:22px;display:grid;gap:10px;font-size:14.5px;line-height:1.55}
.g-surse li{scroll-margin-top:100px;padding-left:4px}
.g-surse li:target{background:rgba(22,131,135,.08);border-radius:8px}
.g-surse li a{font-weight:600;word-break:break-word}
.g-sursa-m{display:block;color:#5b7372;font-size:13px}

.g-autori-l{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.g-autor{display:flex;gap:14px;align-items:flex-start;padding:16px;border:1px solid var(--line);border-radius:14px;background:#fff}
.g-avatar{flex:none;width:46px;height:46px;border-radius:50%;background:var(--hero1);color:#5eead4;display:flex;align-items:center;justify-content:center;font:800 15px/1 'Urbanist',sans-serif}
.g-autor > div{display:grid;gap:2px;font-size:14.5px;line-height:1.45}
.g-autor strong a{color:var(--slate900);text-decoration:none}
.g-autor-rol{font:600 11px/1.3 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#5b7372}
.g-autor-f{color:#46605e}
.g-autor-c{color:var(--primary);font-weight:600;font-size:13px}
.g-avert{margin-top:28px;font-size:13.5px;color:#5b7372;line-height:1.6;border-top:1px solid var(--line);padding-top:16px}
.g-conexe-l{display:flex;flex-wrap:wrap;gap:10px}
.g-conexe-l a{padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--primary);font-weight:600;font-size:14.5px;text-decoration:none}
.g-conexe-l a:hover{border-color:var(--primary)}
.g-conexe-l .g-toate{background:transparent;border-style:dashed}

/* Exploratorul de categorii (OWASP): fiecare categorie e un <details>, textul ramane in HTML */
.g-cat{display:grid;gap:8px;margin:0 0 24px}
.g-cat-i{border:1px solid var(--line);border-radius:14px;background:#fff;transition:border-color .15s,box-shadow .15s}
.g-cat-i[open]{border-color:rgba(22,131,135,.45);box-shadow:0 10px 30px -22px rgba(15,60,62,.45)}
.g-cat-i summary{display:flex;gap:14px;align-items:center;padding:14px 16px;cursor:pointer;list-style:none}
.g-cat-i summary::-webkit-details-marker{display:none}
.g-cat-i summary::after{content:"";margin-left:auto;flex:none;width:9px;height:9px;border-right:2px solid var(--primary);border-bottom:2px solid var(--primary);transform:rotate(45deg);transition:transform .15s}
.g-cat-i[open] summary::after{transform:rotate(-135deg)}
.g-cat-i summary:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:14px}
.g-cat-id{flex:none;min-width:74px;padding:4px 8px;border-radius:8px;background:var(--hero1);color:#5eead4;font:700 12.5px/1.3 ui-monospace,'SFMono-Regular',Menlo,monospace;text-align:center;font-variant-numeric:tabular-nums}
.g-cat-n{display:grid;gap:1px;min-width:0;font-weight:700;color:var(--slate900);font-size:16px;line-height:1.35}
.g-cat-n small{font-weight:500;color:#5b7372;font-size:13px}
.g-cat-i dl{margin:0;padding:0 16px 16px 104px;display:grid;gap:4px}
.g-cat-i dt{font:700 11.5px/1.3 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--primary);margin-top:10px}
.g-cat-i dd{margin:0;font-size:15.5px;line-height:1.6;color:#2b3f3e}
/* Autoevaluarea pe intrebari */
.g-intrebari{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px}
.g-intrebari li{display:grid;grid-template-columns:1fr auto;gap:10px 18px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fbfdfd}
.g-intrebari li:has(input[value=da]:checked){border-color:rgba(21,128,61,.4)}
.g-intrebari li:has(input[value=nu]:checked),.g-intrebari li:has(input[value=ns]:checked){border-color:rgba(180,83,9,.45);background:#fffbeb}
.g-q{font-size:15px;line-height:1.5;color:var(--slate900)}
.g-q b{display:inline-block;margin-right:6px;font:700 12px/1.4 ui-monospace,Menlo,monospace;color:var(--primary)}
.g-r{display:flex;gap:6px}
.g-r label{position:relative;padding:6px 12px;border:1px solid var(--line);border-radius:999px;font-size:13.5px;font-weight:600;cursor:pointer;background:#fff;white-space:nowrap}
.g-r input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.g-r label:has(input:checked){background:var(--primary);border-color:var(--primary);color:#fff}
.g-r label:has(input:focus-visible){outline:2px solid var(--primary);outline-offset:2px}
.g-cat-lista{font:600 14px/1.6 ui-monospace,Menlo,monospace;color:#b45309;margin:4px 0 0}
.g-cat-lista:empty{display:none}

/* Hub-ul ghidurilor: filtrul „De unde incepeti?" si cardurile pe categorii */
.g-hub-start{max-width:780px;margin:0 auto 34px;text-align:center}
.g-hub-start h2{margin:0 0 6px}
.g-hub-start > p{color:#46605e;margin:0 0 18px}
.g-hub-f{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.g-hub-f button{font:600 14.5px/1.3 'Inter',sans-serif;padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--slate900);cursor:pointer;transition:border-color .15s,background .15s,color .15s}
.g-hub-f button:hover{border-color:var(--primary)}
.g-hub-f button[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:#fff}
.g-hub-f button:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.g-hub-n{margin:14px 0 0;font-size:14px;color:#5b7372}
.g-hub-n [data-hub-nr]{font-weight:800;color:var(--primary)}
.g-hub-cat{margin-top:38px}
.g-hub-cat[hidden]{display:none}
.g-hub-h{margin-bottom:14px}
.g-hub-h h2{margin:4px 0 0;font-size:24px}
.g-hub-l{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.g-hub-c{position:relative;display:flex;flex-direction:column;gap:8px;padding:20px 20px 18px;border:1px solid var(--line);border-radius:16px;background:#fff;transition:border-color .15s,box-shadow .15s}
.g-hub-c[hidden]{display:none}
.g-hub-c:hover{border-color:var(--primary);box-shadow:0 8px 26px -14px rgba(15,60,62,.35)}
.g-hub-c:has(a:focus-visible){outline:2px solid var(--primary);outline-offset:3px}
.g-hub-c h3{margin:0;font-size:18.5px;line-height:1.3;color:var(--slate900)}
.g-hub-c h3 a{color:inherit;text-decoration:none}
.g-hub-c h3 a::after{content:"";position:absolute;inset:0;border-radius:16px}
.g-hub-c h3 a:focus-visible{outline:none}
.g-hub-c p{margin:0;font-size:14.5px;line-height:1.6;color:#3c5453}
.g-hub-u{display:flex;flex-wrap:wrap;gap:4px;font-size:13.5px!important;color:var(--primary)!important;font-weight:600}
.g-hub-u span:first-child{color:#5b7372;font-weight:500}
.g-hub-m{margin-top:auto!important;padding-top:10px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12.5px!important;color:#5b7372!important;font-variant-numeric:tabular-nums}
.g-hub-b{align-self:flex-start;padding:3px 9px;border-radius:999px;background:#fef3c7;color:#92400e;font:700 11px/1.4 'Inter',sans-serif;letter-spacing:.05em;text-transform:uppercase}
.g-hub-b--nou{background:#dcfce7;color:#166534}

@media (max-width:640px){
  .g-art{font-size:16.5px}
  .g-cat-i dl{padding:0 14px 14px}
  .g-cat-i summary{padding:12px 14px;gap:12px}
  .g-intrebari li{grid-template-columns:1fr}
  .g-hub-f{justify-content:flex-start}
  .g-hub-start{text-align:left}
  .g-cron::before{left:52px}
  .g-cron li{grid-template-columns:64px 1fr;gap:14px}
  .g-cron li::before{left:47px}
  .g-cron-t{font-size:13.5px;padding-right:22px}
  .g-cron--lat::before{left:84px}
  .g-cron--lat li{grid-template-columns:96px 1fr}
  .g-cron--lat li::before{left:79px}
  .g-unealta{padding:18px 16px}
  .g-apel{padding:20px}
}
@media (prefers-reduced-motion:reduce){.g-progres{display:none}}
@media print{.g-toc,.g-toc-m,.g-progres,.g-apel,.pg-cta,.site-header,.site-footer{display:none!important}.g-wrap{display:block}}
