/* TermOS site public, v2 (9 nov 2026). Fonturi de sistem, fara cereri externe. Vezi NOTE-v2.md. */
:root{
  --carbune:#1c1714; --jar:#ff6a1a; --jar-hover:#ff8240; --chihlimbar:#ffb547; --pe-jar:#1a120d; --led:#3d9bff;
  --sans:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Roboto,Arial,sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  --pad:clamp(20px,5vw,48px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:76px;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
body{margin:0;background:var(--carbune);color:#f5ede4;font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
[hidden]{display:none!important}
a{color:inherit}
p{margin:0;max-width:62ch}
:focus-visible{outline:3px solid var(--led);outline-offset:3px;border-radius:4px}
.sari{position:absolute;left:12px;top:-60px;background:#fff;color:#000;padding:10px 14px;border-radius:8px;z-index:50}
.sari:focus{top:10px}

/* teme pe sectiune */
.dark{--bg:#1c1714;--fg:#f5ede4;--fg2:#cdbfb0;--line:#3a2f28;--surf:#251e19;--acc:#ffb547;--field:#16110e;--field-line:#7d6d5e;--err:#ff9c92;--ph:#a39484}
.light{--bg:#f5f0e8;--fg:#231b16;--fg2:#5a4c41;--line:#ddd2c3;--surf:#fbf8f3;--acc:#a8420a;--field:#fff;--field-line:#8f7f6e;--err:#a3281c;--ph:#6d5f52}
.sec{background:var(--bg);color:var(--fg);padding-block:clamp(64px,9vw,112px)}
.wrap{max-width:1160px;margin-inline:auto;padding-inline:var(--pad)}

/* tipografie */
h1,h2,h3{margin:0;font-family:var(--sans);text-wrap:balance}
h1{font-weight:600;font-size:clamp(34px,4.6vw,58px);line-height:1.08;letter-spacing:-.028em}
h2{font-weight:600;font-size:clamp(28px,3.1vw,40px);line-height:1.15;letter-spacing:-.022em;max-width:20em}
h3{font-weight:600;font-size:19px;line-height:1.3;letter-spacing:-.005em}
.lead{font-size:clamp(17px,1.5vw,20px);line-height:1.6;color:var(--fg2)}
.capsec{display:grid;gap:18px;margin-bottom:clamp(36px,5vw,56px)}
.capsec p{color:var(--fg2)}
.mic,.nota{font-size:14px;line-height:1.55;color:var(--fg2)}
.marca-n{white-space:nowrap}

/* butoane */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 26px;border-radius:10px;border:1.5px solid var(--jar);background:var(--jar);color:var(--pe-jar);font:600 16px/1 var(--sans);text-decoration:none;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn:hover{background:var(--jar-hover);border-color:var(--jar-hover)}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--field-line)}
.btn.ghost:hover{border-color:var(--fg);background:transparent}
.btn.mic-btn{min-height:42px;padding:0 18px;font-size:15px}
.btn[disabled]{opacity:.6;cursor:wait}

/* antet */
.bara{position:sticky;top:0;z-index:30;background:rgba(28,23,20,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid #3a2f28}
.bara .wrap{display:flex;align-items:center;gap:28px;min-height:64px}
.marca{display:inline-flex;align-items:center;gap:9px;text-decoration:none;font-weight:600;font-size:21px;letter-spacing:-.01em;color:#f5ede4}
.marca b{color:var(--chihlimbar);font-weight:700}
.sigla{width:18px;height:24px;color:var(--chihlimbar)}
.meniu{display:flex;gap:26px;margin-left:12px}
.meniu a{text-decoration:none;color:#cdbfb0;font-size:15px}
.meniu a:hover{color:#fff}
.bara-dr{margin-left:auto;display:flex;align-items:center;gap:16px}
.limba{display:flex;gap:6px}
.limba a{display:block;width:28px;height:19px;border-radius:3px;overflow:hidden;opacity:.55;outline-offset:3px}
.limba a[aria-current=page]{opacity:1}
.limba a:hover{opacity:1}
.limba svg{width:100%;height:100%;display:block}
.m-mob{display:none;position:relative}
.m-mob summary{list-style:none;cursor:pointer;min-height:44px;display:inline-flex;align-items:center;padding:0 14px;border:1px solid #5a4a3e;border-radius:10px;font-size:15px;color:#f5ede4}
.m-mob summary::-webkit-details-marker{display:none}
.m-mob nav{position:absolute;right:0;top:52px;width:min(270px,calc(100vw - 2*var(--pad)));background:#251e19;border:1px solid #3a2f28;border-radius:12px;padding:8px;display:grid;box-shadow:0 20px 40px -10px rgba(0,0,0,.6)}
.m-mob nav a{padding:12px 14px;text-decoration:none;border-radius:8px;color:#f5ede4}
.m-mob nav a:hover{background:#2e2520}
@media (max-width:980px){.meniu,.bara-dr .btn{display:none}.m-mob{display:block}.bara .wrap{gap:14px}.bara-dr{gap:14px}}

/* hero */
.hero{background:radial-gradient(52% 60% at 76% 42%,rgba(255,106,26,.15),transparent 72%),var(--carbune);padding-top:clamp(36px,6vw,84px);padding-bottom:clamp(40px,6vw,72px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(32px,5vw,72px);align-items:center}
.hero-text{display:grid;gap:24px;justify-items:start}
.hero-text .lead{max-width:34em}
.cta-rand{display:flex;flex-wrap:wrap;gap:12px}
.proto{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--fg2)}
.proto i{width:9px;height:9px;border-radius:50%;background:var(--chihlimbar);flex:none;box-shadow:0 0 0 4px rgba(255,181,71,.18)}
.duo{position:relative;display:flex;justify-content:center;align-items:flex-start;padding:0 0 clamp(24px,5vw,64px)}
.ph{margin:0;width:min(264px,46%);padding:7px;border-radius:36px;background:#0c0806;box-shadow:0 0 0 1px #4a3d34,0 34px 70px -24px rgba(0,0,0,.8)}
.ph img{width:100%;aspect-ratio:585/1128;border-radius:29px;background:#16110e}
.duo .ph+.ph{margin-left:-7%;margin-top:clamp(36px,7vw,84px)}
.cutie{position:absolute;left:0;bottom:2%;width:22%;filter:drop-shadow(0 18px 22px rgba(0,0,0,.5))}
.fapte{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 40px;margin-top:clamp(40px,6vw,72px);padding-top:26px;border-top:1px solid var(--line);color:var(--fg2);font-size:16px}
.fapte b{display:block;color:var(--fg);font-weight:600;margin-bottom:2px}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .fapte{grid-template-columns:1fr;gap:16px}
}
@media (max-width:520px){.cta-rand .btn{flex:1 1 100%}.duo .ph{width:48%}.cutie{width:27%;bottom:-3%}}

/* cum merge */
.doua-col{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,6vw,80px);align-items:start}
.pasi{list-style:none;margin:28px 0 0;padding:0;counter-reset:pas}
.pasi li{counter-increment:pas;display:grid;grid-template-columns:36px 1fr;gap:16px;padding:20px 0;border-top:1px solid var(--line)}
.pasi li:last-child{border-bottom:1px solid var(--line)}
.pasi li::before{content:counter(pas);width:32px;height:32px;border-radius:50%;border:1.5px solid var(--acc);color:var(--acc);display:grid;place-items:center;font-weight:600;font-size:15px}
.pasi p{color:var(--fg2);margin-top:4px}
.foto-montaj{margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#e8e4de}
.foto-montaj img{width:100%}
.nota-box{margin-top:18px;padding:18px 20px;border-radius:12px;background:var(--surf);border:1px solid var(--line);font-size:16px;color:var(--fg2)}
.nota-box b{color:var(--fg)}
@media (max-width:900px){.doua-col{grid-template-columns:1fr}}

/* aplicatia */
.ecrane{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,3vw,40px)}
.ecrane figure{margin:0;display:grid;gap:18px;align-content:start}
.ecrane .ph{width:100%}
.ecrane figcaption h3{margin-bottom:4px}
.ecrane figcaption p{font-size:15px;color:var(--fg2);line-height:1.55}
.sub-ecrane{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;margin-top:clamp(32px,4vw,48px)}
.sub-ecrane .nota{max-width:46ch}
@media (max-width:900px){
  .ecrane{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);gap:16px;margin-inline:calc(-1*var(--pad));padding-inline:var(--pad);padding-bottom:8px;scrollbar-width:thin}
  .ecrane figure{flex:0 0 min(62%,260px);scroll-snap-align:start}
}

/* grafice */
.grafice{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.g{margin:0;background:var(--surf);border:1px solid var(--line);border-radius:14px;padding:22px 22px 24px;display:grid;gap:10px;align-content:start}
.g h3 .brand{white-space:nowrap}
.g .sub-g{font-size:14px;color:var(--fg2)}
.g svg{width:100%;height:auto;margin-top:6px}
.g p{font-size:15px;color:var(--fg2);line-height:1.55}
.g .sg-i{width:14px;height:18px;vertical-align:-2px;margin-right:6px;color:var(--acc)}
.nota-g{margin-top:18px}
.beneficii{display:grid;grid-template-columns:repeat(2,1fr);column-gap:clamp(32px,6vw,80px);margin-top:clamp(44px,6vw,72px)}
.beneficii>div{padding:22px 0;border-top:1px solid var(--line)}
.beneficii p{color:var(--fg2);margin-top:6px}
@media (max-width:980px){.grafice{grid-template-columns:1fr;max-width:520px}.beneficii{grid-template-columns:1fr}}

/* smart home */
.casa{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(32px,6vw,80px);align-items:center}
.puncte{display:grid;margin-top:28px}
.puncte>div{padding:18px 0;border-top:1px solid var(--line)}
.puncte p{color:var(--fg2);margin-top:4px}
.automatizare{background:var(--surf);border:1px solid var(--line);border-radius:16px;padding:clamp(20px,3vw,32px);display:grid;gap:10px}
.automatizare .titlu{font-size:15px;color:var(--fg2);margin-bottom:6px}
.regula{display:flex;gap:14px;align-items:baseline;padding:14px 16px;border-radius:10px;background:#1c1714;border:1px solid var(--line);font-size:16px}
.regula b{flex:none;min-width:4.2em;color:var(--fg2);font-weight:600;font-size:14px}
.regula.atunci{border-color:#6b4a2d;background:#2a1f16}
.regula.atunci b{color:var(--acc)}
@media (max-width:900px){.casa{grid-template-columns:1fr}}

/* shop */
.shop-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,72px);align-items:start}
.prod{display:grid;grid-template-columns:1fr auto;gap:8px 24px;align-items:center;padding:22px 0;border-top:1px solid var(--line)}
.prod:last-of-type{border-bottom:1px solid var(--line)}
.prod h3{line-height:1.5}
.prod h3 .stare{margin-left:8px;vertical-align:2px}
.stare{font-size:13px;font-weight:600;color:var(--acc);border:1px solid currentColor;border-radius:999px;padding:1px 10px;white-space:nowrap}
.prod p{grid-column:1;color:var(--fg2);font-size:16px}
.prod .btn{grid-column:2;grid-row:1/3;align-self:center}
.prod .brand .sg-i{width:13px;height:17px;vertical-align:-2px;margin-right:6px;color:var(--acc)}
.shop-nota{margin-top:20px}
.shop-grid .formular{position:sticky;top:92px}
@media (max-width:900px){.shop-grid{grid-template-columns:1fr}.shop-grid .formular{position:static}}
@media (max-width:520px){.prod{grid-template-columns:1fr}.prod .btn{grid-column:1;grid-row:auto;justify-self:start;margin-top:6px}}

/* formulare */
.formular{background:var(--surf);border:1px solid var(--line);border-radius:16px;padding:clamp(20px,3vw,32px)}
.formular h3{font-size:21px;margin-bottom:4px}
.pas1{display:grid;gap:16px}
.camp{display:grid;gap:6px;min-width:0}
.lbl{font-size:14px;font-weight:600;color:var(--fg)}
.in{width:100%;min-height:48px;padding:0 14px;border-radius:10px;border:1px solid var(--field-line);background:var(--field);color:var(--fg);font:inherit;font-size:16px}
.in::placeholder{color:var(--ph)}
.in[aria-invalid]{border-color:var(--err);outline:2px solid var(--err)}
select.in{appearance:auto}
.doua{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:520px){.doua{grid-template-columns:1fr}}
.acord{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--fg2);cursor:pointer}
.acord input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--jar)}
.acord a{color:var(--fg)}
.ajutor{font-size:14px;color:var(--fg2)}
.eroare-mesaj{color:var(--err);font-size:15px;font-weight:600}
.pas-final h3{margin-bottom:8px}
.pas-final p{color:var(--fg2)}
fieldset{border:0;margin:0;padding:0;min-width:0}
.optiuni{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:8px}
.optiuni label{display:flex;gap:8px;align-items:center;min-height:36px}
.optiuni input{width:20px;height:20px;margin:0;accent-color:var(--jar)}
.formular .btn{width:100%}

/* compatibilitate */
.compat-grid,.part-grid,.lansare-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:start}
.marci{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 18px}
.marci span{border:1px solid var(--line);border-radius:999px;padding:5px 14px;font-size:15px;color:var(--fg2)}
@media (max-width:900px){.compat-grid,.part-grid,.lansare-grid{grid-template-columns:1fr}}

/* parteneri */
.liniute{display:grid;margin-top:24px}
.liniute>div{padding:14px 0;border-top:1px solid var(--line);color:var(--fg2)}
.liniute>div:last-child{border-bottom:1px solid var(--line)}
.fisa{margin-top:36px}
.fisa h3{margin-bottom:10px}
.fisa dl{margin:0;display:grid}
.fisa dl>div{display:grid;grid-template-columns:minmax(96px,150px) 1fr;gap:16px;padding:11px 0;border-top:1px solid var(--line);font-size:15px}
.fisa dt{color:var(--fg2)}
.fisa dd{margin:0}
.fisa .mic{margin-top:10px}

/* argument instalatori */
.arg{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,6vw,80px);align-items:center}
.arg-ph{display:flex;gap:16px;justify-content:center}
.arg-ph .ph{width:min(230px,48%);margin:0}
.arg-ph .ph+.ph{margin-top:clamp(28px,5vw,56px)}
.puncte h3 .stare{margin-left:10px;vertical-align:2px}
.arg-nota{margin:20px 0 clamp(56px,8vw,96px)}
@media (max-width:900px){.arg{grid-template-columns:1fr}}

/* despre */
.despre{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:clamp(28px,6vw,80px);align-items:center}
.despre .poza{margin:0;border-radius:16px;overflow:hidden;border:1px solid var(--line)}
.despre blockquote{margin:0}
.despre blockquote p{font-size:clamp(20px,2.2vw,26px);line-height:1.5;font-weight:500;letter-spacing:-.01em;max-width:34em}
.despre cite{display:block;margin-top:20px;font-style:normal;color:var(--fg2);font-size:15px}
.despre cite b{display:block;color:var(--fg);font-size:17px}
.nume{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,64px);margin-top:clamp(40px,6vw,72px);padding-top:32px;border-top:1px solid var(--line)}
.nume p{color:var(--fg2);margin-top:6px}
@media (max-width:760px){.despre{grid-template-columns:1fr}.despre .poza{max-width:260px}.nume{grid-template-columns:1fr}}

/* intrebari */
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:clamp(28px,6vw,80px);align-items:start}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 0;font-weight:600;font-size:18px;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:10px;height:10px;border-right:2px solid var(--acc);border-bottom:2px solid var(--acc);transform:rotate(45deg) translateY(-3px);transition:transform .15s}
.faq details[open] summary::after{transform:rotate(-135deg) translateY(-3px)}
.faq details p{padding:0 0 22px;color:var(--fg2)}
@media (max-width:900px){.faq-grid{grid-template-columns:1fr}}

/* lista de lansare */
.avantaje{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:12px}
.avantaje li{display:flex;gap:12px;align-items:flex-start;color:var(--fg2)}
.avantaje li::before{content:"";flex:none;width:20px;height:20px;margin-top:3px;border-radius:50%;background:no-repeat center/12px 12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.3l2.3 2.3 4.7-5' fill='none' stroke='%23ffb547' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),#2e2520}

/* subsol */
footer{background:#120d0a;color:#b3a391;font-size:14px;padding-block:32px}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:center;justify-content:space-between}
footer .marca{font-size:18px}
footer p{max-width:none}
footer a{color:#d8cabb}
.foot-links{display:flex;gap:20px;flex-wrap:wrap}

/* pagini legale */
.legal{max-width:760px;margin:0 auto;padding:clamp(40px,6vw,72px) var(--pad);display:grid;gap:14px}
.legal h1{font-size:clamp(30px,4vw,42px)}
.legal h2{font-size:22px;margin-top:22px}
.legal p,.legal li{color:#d8cabb}
.legal ul{margin:0;padding-left:22px;display:grid;gap:6px}
.legal a{color:var(--chihlimbar)}
.legal .data{font-size:14px;color:#b3a391}
.legal .draft{padding:14px 16px;border:1px solid #6b4a2d;background:#2a1f16;border-radius:10px;color:#f5ede4}
.legal .btn{justify-self:start;margin-top:12px;color:#f5ede4;border-color:#7d6d5e;background:transparent}
.bara .lang-txt{margin-left:auto;font-size:15px;color:#cdbfb0;text-decoration:none}