/* koo.css — CE: foaia comună a paginilor KOO (pilon, modele, GEO, configuratoare, 16 simulări). CUM: <link> în blocul wp:html; fără font propriu (Open Sans din temă);
   alb · portocaliu #ef5210/#e04622 · negru #1d2127, zero albastru [C 04.09.2026 18:5x]. DE CE: auditul 04.09 — 6 butoane, 4 casete, 4 tabele → un limbaj.
   CASA: https://www.toproofing.ro/koo-cfg/koo.css. AUTOR: SUB-design-pagini-noi, 04.09.2026 19:1x. */
.koo-ghid{--o:#e04622;--o2:#ef5210;--ink:#1d2127;--ink2:#2e353e;--txt:#606060;--mut:#777;--line:#e4e4e4;--band:#f4f3f1;--tint:#fdf1ec;--pas:36px;
  color:var(--txt);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
.koo-ghid *,.koo-ghid *::before,.koo-ghid *::after{box-sizing:border-box}
/* ── text: măsură de citit (max 46em ≈ 80 semne), aliniat stânga ── */
.koo-ghid p,.koo-ghid ul,.koo-ghid ol{max-width:46em;margin:0 0 1.1em;font-size:17px;line-height:1.65;color:var(--txt)}
.koo-ghid li{margin:.35em 0}
.koo-ghid strong{color:var(--ink);font-weight:700}
.koo-ghid a{color:var(--o2);text-decoration:none;border-bottom:1px solid rgba(239,82,16,.35);transition:border-color .15s}
.koo-ghid a:hover{border-bottom-color:var(--o2)}
.koo-ghid a:focus-visible{outline:3px solid var(--o);outline-offset:3px;border-radius:2px}
.koo-ghid h2{font-size:30px;font-weight:300;line-height:1.25;color:var(--ink);letter-spacing:-.01em;margin:1.9em 0 .55em;max-width:30em}
.koo-ghid h2::after{content:"";display:block;width:var(--pas);height:3px;background:var(--o);margin-top:.45em}
.koo-ghid h3{font-size:20px;font-weight:600;line-height:1.3;color:var(--ink2);margin:1.5em 0 .45em;max-width:40em}
.koo-ghid h3+p{margin-top:0}
.koo-ghid .koo-nota,.koo-ghid .nota{font-size:14px;line-height:1.55;color:var(--mut)}
/* ── definiția (GEO): primul rând, mare și negru ── */
.koo-ghid .koo-def{font-size:22px;line-height:1.45;color:var(--ink);font-weight:300;max-width:34em;margin:0 0 1em}
.koo-ghid .koo-def strong{font-weight:700}
.koo-ghid .koo-def strong::before{content:"\2726\2009";color:var(--o2);font-weight:400}
/* ── banda cu răspunsul: fond cald, textura foilor (modul 35 px = 350 mm), muchia de jos în pantă ── */
.koo-ghid .koo-band{background:var(--band) repeating-linear-gradient(90deg,transparent 0 34px,rgba(29,33,39,.055) 34px 35px);
  padding:34px 40px 56px;margin:0 0 32px;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 26px))}
.koo-ghid .koo-lead{font-size:21px;line-height:1.55;color:var(--ink);font-weight:400;max-width:36em;margin:0}
.koo-ghid .koo-lead strong{font-weight:700}
.koo-ghid .koo-band .koo-lead+.koo-lead{margin-top:.8em}
/* ── poza mare: toată lățimea, tăiată în pantă ── */
.koo-ghid figure{margin:0}
.koo-ghid img{max-width:100%;height:auto;display:block}
.koo-ghid .koo-hero{margin:0 0 36px}
.koo-ghid .koo-hero img{width:100%;aspect-ratio:2/1;object-fit:cover;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 30px))}
.koo-ghid .koo-hero figcaption,.koo-ghid figcaption{font-size:13px;line-height:1.45;color:var(--mut);margin-top:.5em}
/* ── nivelurile de preț: nu cutii — un tarif pe coloane, despărțit de linii ── */
.koo-ghid .koo-niveluri{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));column-gap:36px;row-gap:34px;margin:1.6em 0 1.4em;max-width:none}
.koo-ghid .koo-niv{border-top:3px solid var(--line);padding-top:16px}
.koo-ghid .koo-niv.buget,.koo-ghid .koo-niv.premium{border-top-color:var(--o)}
.koo-ghid .koo-niv .nume{font-size:16px;font-weight:700;color:var(--ink);line-height:1.35;margin:0 0 .35em;max-width:none}
.koo-ghid .koo-niv .pret{font-size:38px;font-weight:800;line-height:1.05;color:var(--ink);letter-spacing:-.02em;margin:0 0 .45em;font-variant-numeric:tabular-nums;max-width:none}
.koo-ghid .koo-niv .pret small{display:block;font-size:13px;font-weight:400;color:var(--mut);letter-spacing:0;margin-top:.45em}
.koo-ghid .koo-niv .det{font-size:15px;line-height:1.55;margin:0;max-width:none}
/* ── modelele (pilon): 5 poze cu numele ── */
.koo-ghid .koo-modele{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;margin:1.4em 0 1.8em}
.koo-ghid .koo-modele a{border:0;display:block;color:var(--ink);font-weight:600;font-size:15px}
.koo-ghid .koo-modele img{aspect-ratio:4/3;object-fit:cover;margin-bottom:.5em;transition:opacity .15s}
.koo-ghid .koo-modele a:hover img{opacity:.88}
/* ── galerie de finisaje ── */
.koo-ghid .koo-galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px 16px;margin:1.4em 0 1.6em}
.koo-ghid .koo-galerie img{aspect-ratio:4/3;object-fit:cover}
/* ── tabele: un singur stil — linii orizontale, cap negru, cifre aliniate ── */
.koo-ghid .koo-scroll{overflow-x:auto;margin:1.2em 0;-webkit-overflow-scrolling:touch}
.koo-ghid table.koo-tabel{width:100%;border-collapse:collapse;font-size:15px;line-height:1.45;font-variant-numeric:tabular-nums}
.koo-ghid .koo-tabel th,.koo-ghid .koo-tabel td{padding:.6em .7em;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.koo-ghid .koo-tabel th{font-size:13px;font-weight:700;color:var(--ink);border-bottom:2px solid var(--ink);white-space:nowrap}
.koo-ghid .koo-tabel th:first-child,.koo-ghid .koo-tabel td:first-child{padding-left:0}
.koo-ghid .koo-tabel.cifre td:nth-child(n+2),.koo-ghid .koo-tabel.cifre th:nth-child(n+2){text-align:right;white-space:nowrap}
.koo-ghid .koo-tabel td.txt,.koo-ghid .koo-tabel th.txt{text-align:left;white-space:normal}
.koo-ghid .koo-tabel tr.sec td{background:var(--band);font-weight:700;color:var(--ink);font-size:13px;text-align:left;white-space:normal;padding-left:.7em}
.koo-ghid .koo-tabel tr.tot td{font-weight:700;color:var(--ink)}
.koo-ghid .koo-tabel tr.big td{font-size:17px;font-weight:800;color:var(--ink);background:var(--tint);border-bottom:2px solid var(--o)}
.koo-ghid .koo-tabel tr.opt td{color:var(--mut);font-style:italic}
/* ── GEO: portocaliu cu alb, semnul ✦ ── */
.koo-ghid .koo-geo{position:relative;overflow:hidden;background:var(--o);color:#fff;padding:36px 40px;margin:2.4em 0;text-align:center;border-radius:4px}
.koo-ghid .koo-geo::before{content:"\2726 \2726 \2726";position:absolute;right:22px;top:-12px;font-size:64px;line-height:1;letter-spacing:.15em;color:#fff;opacity:.16;pointer-events:none}
.koo-ghid .koo-geo::after{content:"\2726";position:absolute;left:26px;bottom:-14px;font-size:96px;line-height:1;color:#fff;opacity:.1;pointer-events:none}
.koo-ghid .koo-geo p{position:relative;color:#fff;font-size:21px;font-weight:300;line-height:1.4;margin:0 auto .9em;max-width:32em}
.koo-ghid .koo-geo p strong{color:#fff}
.koo-ghid .koo-geo a{position:relative;display:inline-block;background:#fff;color:var(--o);font-weight:700;font-size:18px;line-height:1.25;padding:.85em 1.6em;border:0;border-radius:4px;box-shadow:0 2px 0 rgba(0,0,0,.12);transition:transform .12s,box-shadow .12s}
.koo-ghid .koo-geo a::before{content:"\2726\2002";font-weight:400}
.koo-ghid .koo-geo a:hover{transform:translateY(-1px);box-shadow:0 4px 0 rgba(0,0,0,.14)}
.koo-ghid .koo-geo a:focus-visible{outline:3px solid #fff;outline-offset:3px}
.koo-ghid .koo-geo p:has(a){margin-bottom:.9em}
.koo-ghid .koo-geo .obl,.koo-ghid .koo-geo .koo-nota{font-size:14px;font-weight:400;opacity:.92;margin:1em auto 0;color:#fff}
/* ── butonul temei, pentru linkuri de acțiune pe alb ── */
.koo-ghid .koo-btn{display:inline-block;background:var(--o);color:#fff;font-size:17px;font-weight:600;padding:.75em 1.5em;border:0;border-radius:4px}
.koo-ghid .koo-btn:hover{background:#c73c1c}
/* ── cei trei pași (GEO): numerotare mare, subțire — e o secvență reală ── */
.koo-ghid .koo-pasi{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 36px;margin:1.4em 0 1em;border-top:1px solid var(--line)}
.koo-ghid .koo-pas{padding:18px 0 8px}
.koo-ghid .koo-pas .nr{display:block;font-size:56px;font-weight:300;line-height:1;color:var(--o);letter-spacing:-.03em;margin:0 0 6px}
.koo-ghid .koo-pas h3{margin:0 0 .4em;font-size:19px}
.koo-ghid .koo-pas p{font-size:15.5px;line-height:1.6;margin:0}
/* ── ce primești: lista cu ✦ ── */
.koo-ghid .koo-primesti{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 28px;margin:1.2em 0 1.6em}
.koo-ghid .koo-primesti div{position:relative;padding:4px 0 4px 26px;font-size:16px;line-height:1.5;border-top:1px solid var(--line)}
.koo-ghid .koo-primesti div::before{content:"\2726";position:absolute;left:0;top:6px;color:var(--o2)}
.koo-ghid h2.pozitie{border-top:1px solid var(--line);padding-top:1.2em}
.koo-ghid .semnatura,.koo-ghid .koo-semnatura{font-size:14px;line-height:1.55;color:var(--mut);border-top:1px solid var(--line);padding-top:1.2em;margin-top:2.4em;max-width:none}
/* ── uneltele (hub): rânduri despărțite de linii, titlu mare ── */
.koo-ghid .koo-unelte{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:0 40px;margin:1.2em 0 .6em}
.koo-ghid .koo-unealta{border-top:1px solid var(--line);padding:24px 0 22px;display:flex;flex-direction:column}
.koo-ghid .koo-unealta h3{margin:0 0 .45em;font-size:24px;font-weight:600;line-height:1.25}
.koo-ghid .koo-unealta h3 a{color:var(--ink);border-bottom:2px solid var(--o2)}
.koo-ghid .koo-unealta h3 a:hover{color:var(--o)}
.koo-ghid .koo-unealta p{margin:0 0 .9em;font-size:16px;line-height:1.55;max-width:none}
.koo-ghid .koo-unealta .koo-meta{margin-top:auto;font-size:13.5px;color:var(--mut);line-height:1.45}
/* ── schița cu panotaj (simulări): fontul temei, fără albastru ── */
.koo-ghid .koo-schita-cadru{margin:0 0 1.4em;overflow-x:auto;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.koo-schita .v{fill:#f6f1e7;stroke:#6b5d4a;stroke-width:1.5}.koo-schita .c{stroke:#b9a98d;stroke-width:.8;fill:none}.koo-schita .f{stroke:#b9a98d;stroke-width:.8;stroke-dasharray:3 2;fill:none}
.koo-schita .k{stroke:#e04622;stroke-width:4}.koo-schita .j{stroke:#1d2127;stroke-width:5;stroke-linecap:round}.koo-schita .b{stroke:#1d2127;stroke-width:3}
.koo-schita .z{stroke:#c62828;stroke-width:2;stroke-dasharray:6 4}.koo-schita .h{fill:#fff;stroke:#6b5d4a;stroke-width:1.2}
.koo-schita .t{font:700 12px "Open Sans",Helvetica,Arial,sans-serif;fill:#1d2127}.koo-schita .s{font:11px "Open Sans",Helvetica,Arial,sans-serif;fill:#3b3128}.koo-schita .m{font:11px "Open Sans",Helvetica,Arial,sans-serif;fill:#6b5d4a}
/* ── mobil (390 px): o coloană, text mai mare, pante mai mici ── */
@media (max-width:767px){
.koo-ghid{font-size:17px}
.koo-ghid h2{font-size:26px;margin-top:1.6em}
.koo-ghid h3{font-size:19px}
.koo-ghid .koo-def{font-size:20px}
.koo-ghid .koo-band{padding:24px 18px 40px;margin:0 -15px 24px;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 16px))}
.koo-ghid .koo-lead{font-size:19px}
.koo-ghid .koo-hero img{aspect-ratio:3/2;clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 16px))}
.koo-ghid .koo-niveluri{grid-template-columns:1fr;row-gap:26px}
.koo-ghid .koo-niv .pret{font-size:34px}
.koo-ghid .koo-modele,.koo-ghid .koo-galerie{grid-template-columns:repeat(2,1fr);gap:12px}
.koo-ghid .koo-geo{padding:28px 20px;margin:2em -15px;border-radius:0}
.koo-ghid .koo-geo p{font-size:19px}
.koo-ghid .koo-geo a{font-size:17px;padding:.8em 1.3em}
.koo-ghid .koo-pas .nr{font-size:48px}
.koo-ghid table.koo-tabel{font-size:14px}
.koo-ghid .koo-tabel th,.koo-ghid .koo-tabel td{padding:.55em .5em}
.koo-ghid .koo-unealta h3{font-size:22px}
.koo-ghid .koo-schita-cadru svg{min-width:640px}
}
@media (prefers-reduced-motion:reduce){.koo-ghid *{transition:none!important}}