/* CurataraeAerConditionat.com - servicii dupa aparat Tema: "atelier" - verde adanc, accent verde-turcoaz, actiune albastru Toate marimile de font in rem (panoul Preferinte scaleaza radacina). */ /* ============ 1. TOKENS ============ */ :root{ /* rol 1: brand */ --brand:#1E3B33; --brand-2:#12251F; --brand-ink:#FFFFFF; /* rol 2: accent rece (iconite, linii) */ --accent:#2C7A66; --accent-soft:#E2F0EB; /* rol 3: actiune (doar telefon / WhatsApp / programare) */ --action:#0B5FCB; --action-2:#094CA3; --action-ink:#FFFFFF; --wa:#1F8E4A; /* suprafete si text */ --ground:#F6F8F6; --surface:#FFFFFF; --surface-2:#ECF2EF; --ink:#16231F; --ink-soft:#556660; --line:#D9E2DE; --line-strong:#B8C7C1; /* semantice */ --ok:#2F6B45; --ok-soft:#E5EFE8; --warn:#9A4A16; --warn-soft:#F8ECE2; /* tipografie */ --f-title:"Bitter",Georgia,"Times New Roman",serif; --f-body:"Public Sans","Segoe UI",Arial,sans-serif; --f-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace; /* ritm */ --gut:1.25rem; --maxw:75rem; --readw:65ch; --r:4px; /* straturi (din regulile proiectului) */ --z-drawer:300; --z-scrim:190; --z-header:150; --z-panel:200; --z-bar:110; --z-top:100; } @media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ --brand:#7FC9B3; --brand-2:#0A1714; --brand-ink:#0A1714; --accent:#5FBFA5; --accent-soft:#123029; --action:#5B9DF5; --action-2:#4A87DB; --action-ink:#06111F; --wa:#3FB673; --ground:#0C1512; --surface:#131F1B; --surface-2:#192823; --ink:#E2EBE7; --ink-soft:#95AAA2; --line:#243430; --line-strong:#364B44; --ok:#7CBE97; --ok-soft:#152B20; --warn:#DE9A6B; --warn-soft:#2B1D12; } } :root[data-theme="dark"]{ --brand:#7FC9B3; --brand-2:#0A1714; --brand-ink:#0A1714; --accent:#5FBFA5; --accent-soft:#123029; --action:#5B9DF5; --action-2:#4A87DB; --action-ink:#06111F; --wa:#3FB673; --ground:#0C1512; --surface:#131F1B; --surface-2:#192823; --ink:#E2EBE7; --ink-soft:#95AAA2; --line:#243430; --line-strong:#364B44; --ok:#7CBE97; --ok-soft:#152B20; --warn:#DE9A6B; --warn-soft:#2B1D12; } /* ============ 2. BAZA ============ */ *,*::before,*::after{box-sizing:border-box} /* overflow-x pe : sertarul stationeaza in afara ecranului la dreapta si, fara asta, ar largi caseta de derulare a documentului pe mobil. */ html{font-size:100%;-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden} html[data-motion="off"]{scroll-behavior:auto} body{ margin:0;background:var(--ground);color:var(--ink); font-family:var(--f-body);font-size:1.0625rem;line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden; } body.is-locked{overflow:hidden} img,svg,video{max-width:100%;height:auto;display:block} h1,h2,h3,h4{font-family:var(--f-title);margin:0;line-height:1.18;text-wrap:balance;letter-spacing:-.015em} h1{font-size:clamp(1.9rem,4.6vw,3rem);font-weight:700} h2{font-size:clamp(1.4rem,3vw,2rem);font-weight:700} h3{font-size:1.15rem;font-weight:600} h4{font-size:1rem;font-weight:600} p{margin:0} a{color:var(--accent);text-underline-offset:.15em} a:hover{color:var(--ink)} :focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:2px} .wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)} .read{max-width:var(--readw)} .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0} .skip{position:absolute;left:-999px;top:0;z-index:400;background:var(--action);color:var(--action-ink);padding:.6rem 1rem} .skip:focus{left:.5rem;top:.5rem} hr.sep{border:0;height:1px;background:var(--line);margin:0} /* ============ 3. HEADER ============ */ .hdr{ position:sticky;top:0;z-index:var(--z-header); background:var(--surface);border-bottom:1px solid var(--line); } .hdr-in{display:flex;align-items:center;gap:.75rem;min-height:4.25rem;transition:min-height .18s} body.scrolled .hdr-in{min-height:3.5rem} html[data-motion="off"] .hdr-in{transition:none} .brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);margin-right:auto} .brand .mark{ width:2.1rem;height:2.1rem;flex:none;border-radius:3px; background:var(--brand);color:var(--brand-ink); display:grid;place-items:center;font-family:var(--f-title);font-weight:700;font-size:.95rem; } .brand b{font-family:var(--f-title);font-weight:700;font-size:1.05rem;letter-spacing:-.02em;display:block;line-height:1.1} .brand span{display:block;font-size:.72rem;color:var(--ink-soft);letter-spacing:.06em;text-transform:uppercase} .nav{display:none} .nav ul{display:flex;gap:.15rem;list-style:none;margin:0;padding:0} .nav a{ display:block;padding:.5rem .7rem;border-radius:var(--r); color:var(--ink);text-decoration:none;font-size:.95rem;font-weight:600; } .nav a:hover{background:var(--surface-2)} .nav a[aria-current="page"]{color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent)} .hdr-tools{display:flex;align-items:center;gap:.4rem} .icon-btn{ display:grid;place-items:center;width:2.5rem;height:2.5rem;flex:none; background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r); color:var(--ink);cursor:pointer;padding:0; } .icon-btn:hover{border-color:var(--line-strong)} .icon-btn svg{width:1.15rem;height:1.15rem} .btn-menu{display:inline-flex;align-items:center;gap:.4rem;width:auto;padding-inline:.7rem;font-family:var(--f-title);font-weight:600;font-size:.9rem} .btn-menu .lbl{display:inline} .hdr .btn-call{display:inline-flex;padding-inline:.85rem} /* pe ecrane inguste headerul trebuie sa incapa: butonul de meniu ramane doar iconita */ @media (max-width:430px){ .hdr-in{gap:.45rem} .hdr-tools{gap:.3rem} .btn-menu{width:2.5rem;padding-inline:0;gap:0} .btn-menu .lbl{display:none} .brand .mark{width:1.95rem;height:1.95rem} .brand b{font-size:.98rem} } @media (min-width:1000px){ .nav{display:block} .btn-menu{display:none} .hdr .btn-call{display:none} } /* ============ 4. BUTOANE ============ */ .btn{ display:inline-flex;align-items:center;justify-content:center;gap:.5rem; padding:.7rem 1.15rem;border-radius:var(--r);border:1px solid transparent; font-family:var(--f-title);font-weight:600;font-size:.98rem;line-height:1.2; text-decoration:none;cursor:pointer;text-align:center; } .btn svg{width:1.05rem;height:1.05rem;flex:none} .btn-call{background:var(--action);color:var(--action-ink);border-color:var(--action)} .btn-call:hover{background:var(--action-2);color:var(--action-ink)} .btn-wa{background:var(--wa);color:#fff;border-color:var(--wa)} .btn-wa:hover{filter:brightness(.93);color:#fff} .btn-line{background:transparent;color:var(--ink);border-color:var(--line-strong)} .btn-line:hover{border-color:var(--accent);color:var(--accent)} .btn-solid{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)} .btn-solid:hover{background:var(--brand-2);color:var(--brand-ink)} :root[data-theme="dark"] .btn-solid, :root:not([data-theme="light"]) .btn-solid{color:var(--brand-ink)} .btn-block{width:100%} /* ============ 5. SERTAR MOBIL ============ */ .scrim{ position:fixed;inset:0;z-index:var(--z-scrim); background:rgba(8,18,24,.55); /* fara backdrop-filter: bug Safari */ opacity:0;visibility:hidden;transition:opacity .2s; } .scrim.open{opacity:1;visibility:visible} html[data-motion="off"] .scrim{transition:none} .drawer{ position:fixed;top:0;right:0;bottom:0;z-index:var(--z-drawer); width:min(340px,88vw);background:var(--surface); border-left:1px solid var(--line); transform:translateX(100%);transition:transform .22s ease; display:flex;flex-direction:column; overscroll-behavior:contain; } .drawer.open{transform:translateX(0)} html[data-motion="off"] .drawer{transition:none} .drawer-top{ display:flex;align-items:center;justify-content:space-between;gap:.5rem; padding:.85rem 1rem;border-bottom:1px solid var(--line);flex:none; } .drawer-top h2{font-size:1rem} .drawer-body{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:1rem} .drawer-tools{display:flex;gap:.5rem} .drawer nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column} .drawer nav a{ display:block;padding:.72rem .6rem;border-radius:var(--r); color:var(--ink);text-decoration:none;font-weight:600;font-size:1rem; border-bottom:1px solid var(--line); } .drawer nav a[aria-current="page"]{color:var(--accent);background:var(--accent-soft)} .drawer-foot{display:flex;flex-direction:column;gap:.5rem;padding-top:.25rem} @media (min-width:1000px){.drawer,.scrim{display:none}} /* ============ 6. PANOU PREFERINTE ============ */ .prefs{ position:fixed;z-index:var(--z-panel);background:var(--surface); border:1px solid var(--line);border-radius:var(--r); display:none;flex-direction:column;overflow:hidden; } .prefs.open{display:flex} @media (min-width:1000px){ .prefs{top:4.5rem;right:max(var(--gut),calc((100vw - var(--maxw))/2 + var(--gut)));width:23rem;max-height:min(80vh,42rem)} } @media (max-width:999.98px){ .prefs{left:0;right:0;bottom:0;top:auto;max-height:86vh;border-radius:10px 10px 0 0;border-bottom:0} } .prefs-top{display:flex;align-items:center;justify-content:space-between;padding:.8rem 1rem;border-bottom:1px solid var(--line);flex:none} .prefs-top h2{font-size:1rem} .prefs-body{overflow-y:auto;padding:.85rem 1rem 1.1rem;display:flex;flex-direction:column;gap:1.05rem;overscroll-behavior:contain} .pref{display:flex;flex-direction:column;gap:.45rem} .pref>.lab{font-size:.82rem;font-weight:600;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.05em;font-family:var(--f-title)} .seg{display:flex;border:1px solid var(--line-strong);border-radius:var(--r);overflow:hidden} .seg button{ flex:1;padding:.5rem .35rem;background:var(--surface);color:var(--ink); border:0;border-right:1px solid var(--line);cursor:pointer; font-family:var(--f-body);font-size:.9rem;font-weight:600; } .seg button:last-child{border-right:0} .seg button[aria-pressed="true"]{background:var(--accent);color:#fff} .pref-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem} .pref-row .txt{font-size:.95rem;font-weight:600} .pref-row .hint{display:block;font-size:.8rem;font-weight:400;color:var(--ink-soft);line-height:1.4} .sw{position:relative;flex:none;width:3rem;height:1.7rem;border-radius:1rem;background:var(--line-strong);border:0;cursor:pointer;padding:0} .sw::after{content:"";position:absolute;top:3px;left:3px;width:1.1rem;height:1.1rem;border-radius:50%;background:#fff;transition:transform .16s} html[data-motion="off"] .sw::after{transition:none} .sw[aria-pressed="true"]{background:var(--accent)} .sw[aria-pressed="true"]::after{transform:translateX(1.3rem)} .stepper{display:flex;align-items:center;gap:.5rem} .stepper button{width:2.4rem;height:2.4rem;border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);border-radius:var(--r);cursor:pointer;font-size:1.05rem;font-weight:700;font-family:var(--f-title)} .stepper .out{font-family:var(--f-mono);font-size:.9rem;min-width:3.5rem;text-align:center;color:var(--ink-soft)} select.zone{ width:100%;padding:.6rem .7rem;border:1px solid var(--line-strong);border-radius:var(--r); background:var(--surface);color:var(--ink);font-family:var(--f-body);font-size:.95rem; } /* stari globale comandate din panou */ html[data-contrast="on"]{--ground:#fff;--surface:#fff;--surface-2:#fff;--ink:#000;--ink-soft:#000;--line:#000;--line-strong:#000;--accent:#004A63;--accent-soft:#fff} html[data-contrast="on"][data-theme="dark"], html[data-contrast="on"]:not([data-theme="light"]) [data-dark-probe]{} html[data-contrast="on"] a{text-decoration:underline} html[data-contrast="on"] .card,html[data-contrast="on"] .box,html[data-contrast="on"] .hdr, html[data-contrast="on"] .drawer,html[data-contrast="on"] .prefs{border-width:2px!important;border-color:#000!important} html[data-dys="on"]{--f-title:"Atkinson Hyperlegible",var(--f-body);--f-body:"Atkinson Hyperlegible","Public Sans",Arial,sans-serif} html[data-dys="on"] body{letter-spacing:.02em;word-spacing:.08em;line-height:1.8} html[data-simple="on"] .grid,html[data-simple="on"] .grid-2,html[data-simple="on"] .grid-3{grid-template-columns:1fr!important} html[data-simple="on"] .card,html[data-simple="on"] .box,html[data-simple="on"] .hero{background:transparent!important;box-shadow:none!important} html[data-simple="on"] .hero::before{display:none!important} html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{transition:none!important;animation:none!important} @media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}} /* ============ 7. SECTIUNI ============ */ section{padding-block:clamp(2.5rem,6vw,4.5rem)} section.tight{padding-block:clamp(1.75rem,4vw,3rem)} .eyebrow{ font-family:var(--f-title);font-size:.75rem;font-weight:600;letter-spacing:.12em; text-transform:uppercase;color:var(--accent);display:block;margin-bottom:.55rem; } .lead{font-size:1.15rem;color:var(--ink-soft);max-width:var(--readw)} .sec-head{margin-bottom:clamp(1.5rem,3vw,2.25rem)} .sec-head p{color:var(--ink-soft);max-width:var(--readw);margin-top:.6rem} .prose>*+*{margin-top:1.05rem} .prose h2{margin-top:2.25rem} .prose h3{margin-top:1.6rem} .prose ul,.prose ol{margin:0;padding-left:1.35rem;max-width:var(--readw)} .prose li+li{margin-top:.4rem} .prose p{max-width:var(--readw)} /* hero */ .hero{position:relative;background:var(--brand-2);color:#EAF1F5;overflow:hidden} .hero::before{ content:"";position:absolute;inset:0;opacity:.13;pointer-events:none; background-image:repeating-linear-gradient(180deg,var(--accent) 0 1px,transparent 1px 9px); } .hero .wrap{position:relative} .hero h1{color:#fff;max-width:20ch} .hero .lead{color:#C4D4DD;margin-top:1rem} .hero .eyebrow{color:#8FC4D6} .hero-cta{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.6rem} .hero-facts{display:flex;flex-wrap:wrap;gap:1.75rem;margin-top:2.25rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.16)} .hero-facts div{display:flex;flex-direction:column;gap:.15rem} .hero-facts b{font-family:var(--f-title);font-size:1.5rem;font-weight:700;color:#fff} .hero-facts span{font-size:.85rem;color:#A9BFCB} /* grile & carduri */ .grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(15.5rem,1fr))} .grid-2{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr))} .card{ background:var(--surface);border:1px solid var(--line);border-radius:var(--r); padding:1.25rem 1.35rem;display:flex;flex-direction:column;gap:.6rem; } .card h3{font-size:1.08rem} .card p{color:var(--ink-soft);font-size:.96rem} .card .ico{width:2.2rem;height:2.2rem;border-radius:3px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none} .card .ico svg{width:1.15rem;height:1.15rem} .card a.more{margin-top:auto;font-weight:600;font-size:.93rem;text-decoration:none;font-family:var(--f-title)} .card a.more::after{content:" \2192"} .box{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--accent);padding:1.15rem 1.3rem;border-radius:0 var(--r) var(--r) 0} .box.warn{border-left-color:var(--warn);background:var(--warn-soft);border-color:var(--warn-soft)} .box.ok{border-left-color:var(--ok);background:var(--ok-soft);border-color:var(--ok-soft)} .box p+p{margin-top:.6rem} .box .lab{font-family:var(--f-title);font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:.4rem} .box.warn .lab{color:var(--warn)} .box.ok .lab{color:var(--ok)} /* tabele - obligatoriu in .table-wrap */ .table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)} table{border-collapse:collapse;width:100%;min-width:34rem;font-size:.95rem} th,td{text-align:left;padding:.65rem .85rem;border-bottom:1px solid var(--line);vertical-align:top} thead th{background:var(--surface-2);font-family:var(--f-title);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);font-weight:600} tbody tr:last-child td{border-bottom:0} td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap} /* liste de verificare */ ul.check{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.55rem;max-width:var(--readw)} ul.check li{display:grid;grid-template-columns:1.35rem 1fr;gap:.6rem;align-items:start} ul.check li::before{content:"";width:.85rem;height:.85rem;margin-top:.42rem;border:2px solid var(--accent);border-radius:2px} /* faq */ details.faq{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:0} details.faq+details.faq{margin-top:.6rem} details.faq summary{padding:.9rem 1.1rem;cursor:pointer;font-family:var(--f-title);font-weight:600;list-style:none} details.faq summary::-webkit-details-marker{display:none} details.faq summary::after{content:"+";float:right;color:var(--accent);font-weight:700} details.faq[open] summary::after{content:"\2013"} details.faq .in{padding:0 1.1rem 1.1rem;color:var(--ink-soft)} details.faq .in>*+*{margin-top:.7rem} /* banda de final */ .cta-band{background:var(--brand);color:#fff} .cta-band h2{color:#fff;max-width:22ch} .cta-band p{color:#C8D8E1;max-width:var(--readw);margin-top:.7rem} .cta-band .row{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.4rem} :root[data-theme="dark"] .cta-band,:root:not([data-theme="light"]) .cta-band{color:var(--brand-ink)} :root[data-theme="dark"] .cta-band h2,:root:not([data-theme="light"]) .cta-band h2{color:var(--brand-ink)} :root[data-theme="dark"] .cta-band p,:root:not([data-theme="light"]) .cta-band p{color:#24404F} /* ============ 8. FOOTER ============ */ .ftr{background:var(--surface);border-top:1px solid var(--line);padding-block:2.5rem 1.5rem} .ftr-grid{display:grid;gap:1.75rem;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr))} .ftr h3{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.7rem} .ftr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem} .ftr a{color:var(--ink);text-decoration:none;font-size:.95rem} .ftr a:hover{color:var(--accent)} .ftr-bot{margin-top:2rem;padding-top:1.1rem;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:.75rem;justify-content:space-between;font-size:.85rem;color:var(--ink-soft)} /* ============ 9. BARA FIXA + FLOTANT + SUS ============ */ .bar{ position:fixed;left:0;right:0;bottom:0;z-index:var(--z-bar); display:grid;grid-template-columns:1fr 1fr;gap:.5rem; padding:.55rem .7rem calc(.55rem + env(safe-area-inset-bottom)); background:var(--surface);border-top:1px solid var(--line); } .bar .btn{padding-block:.75rem} @media (min-width:1000px){.bar{display:none}} body{padding-bottom:4.6rem} @media (min-width:1000px){body{padding-bottom:0}} .wa-float{ position:fixed;right:1.25rem;bottom:1.25rem;z-index:var(--z-top); display:none;width:3.4rem;height:3.4rem;border-radius:50%; background:var(--wa);color:#fff;place-items:center;text-decoration:none; box-shadow:0 4px 14px rgba(0,0,0,.22); } .wa-float svg{width:1.7rem;height:1.7rem} @media (min-width:1000px){.wa-float{display:grid}} .to-top{ position:fixed;right:1.25rem;bottom:5.6rem;z-index:var(--z-top); width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid var(--line-strong); background:var(--surface);color:var(--ink);display:none;place-items:center;cursor:pointer; } .to-top.show{display:grid} @media (min-width:1000px){.to-top{right:1.25rem;bottom:5.4rem}} /* ============ 10. PLANIFICATOR ============ */ .tool{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden} .tool-in{padding:1.25rem 1.35rem;display:flex;flex-direction:column;gap:1.1rem} .field{display:flex;flex-direction:column;gap:.4rem} .field label{font-family:var(--f-title);font-weight:600;font-size:.9rem} .field .hint{font-size:.83rem;color:var(--ink-soft)} .field select,.field input[type="number"]{ padding:.65rem .7rem;border:1px solid var(--line-strong);border-radius:var(--r); background:var(--surface);color:var(--ink);font-family:var(--f-body);font-size:1rem;width:100%; } .tool-out{border-top:1px solid var(--line);background:var(--surface-2);padding:1.25rem 1.35rem;display:flex;flex-direction:column;gap:1rem} .out-grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))} .out-tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:.85rem 1rem} .out-tile .k{display:block;font-size:.78rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em;font-family:var(--f-title);font-weight:600;line-height:1.3} .out-tile .v{display:block;font-family:var(--f-title);font-weight:700;font-size:1.5rem;font-variant-numeric:tabular-nums;margin-top:.2rem;line-height:1.2} .tool-out>div>.k{display:block} .cal{display:grid;grid-template-columns:repeat(6,1fr);gap:.35rem} @media (min-width:640px){.cal{grid-template-columns:repeat(12,1fr)}} .cal div{ aspect-ratio:1;display:grid;place-items:center;border:1px solid var(--line);border-radius:2px; font-size:.72rem;font-family:var(--f-mono);color:var(--ink-soft);background:var(--surface); } .cal div.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600} .note{font-size:.86rem;color:var(--ink-soft)} /* ============ 11. PRINT ============ */ @media print{ .hdr,.drawer,.scrim,.prefs,.bar,.wa-float,.to-top,.cta-band,.skip{display:none!important} body{padding:0;background:#fff;color:#000;font-size:11pt} .hero{background:#fff;color:#000} .hero h1,.hero .lead,.hero .eyebrow{color:#000} .hero::before{display:none} a{color:#000;text-decoration:underline} a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:#444} section{padding-block:.8rem} .card,.box,.table-wrap{break-inside:avoid;border-color:#999} } /* ============ 12. FIRUL ARIADNEI ============ */ .crumbs{background:var(--surface-2);border-bottom:1px solid var(--line); padding-block:.6rem;font-size:.85rem;color:var(--ink-soft)} .crumbs .wrap{display:flex;flex-wrap:wrap;gap:.45rem;align-items:center} .crumbs a{color:var(--ink-soft);text-decoration:none} .crumbs a:hover{color:var(--accent);text-decoration:underline} .crumbs .sepx{opacity:.55} .crumbs [aria-current="page"]{color:var(--ink);font-weight:600} /* ============ 13. LEGATURI CATRE ALTE PAGINI ============ */ .rel-grid{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))} .rel{display:flex;flex-direction:column;gap:.3rem;padding:.95rem 1.1rem; background:var(--surface);border:1px solid var(--line);border-radius:var(--r); text-decoration:none;color:var(--ink)} .rel:hover{border-color:var(--accent);color:var(--ink)} .rel b{font-family:var(--f-title);font-weight:600;font-size:.98rem;line-height:1.3;color:var(--accent-ink,var(--accent))} .rel span{font-size:.87rem;color:var(--ink-soft);line-height:1.45} /* ============ 14. LISTA DE PAGINI PE PAGINILE-PILON ============ */ .hub-grid{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr))} .hub-grid a{display:flex;flex-direction:column;gap:.2rem;padding:.8rem 1rem; background:var(--surface);border:1px solid var(--line);border-radius:var(--r); text-decoration:none;color:var(--ink)} .hub-grid a:hover{border-color:var(--accent)} .hub-grid b{font-family:var(--f-title);font-weight:600;font-size:.95rem;line-height:1.3} .hub-grid span{font-size:.84rem;color:var(--ink-soft)} /* pasi numerotati - procedura reala, deci numerotarea inseamna ceva */ ol.pasi{list-style:none;counter-reset:pas;margin:0;padding:0;display:flex;flex-direction:column;gap:.9rem;max-width:var(--readw)} ol.pasi li{counter-increment:pas;display:grid;grid-template-columns:1.9rem 1fr;gap:.85rem;align-items:start} ol.pasi li::before{content:counter(pas);font-family:var(--f-title);font-weight:700;font-size:.85rem; color:#fff;background:var(--accent);width:1.7rem;height:1.7rem;border-radius:50%; display:flex;align-items:center;justify-content:center;margin-top:.15rem} ol.pasi b{display:block;font-family:var(--f-title);font-weight:600;margin-bottom:.15rem}