/* Aplicații WINLEX (/aplicatii/): lista aplicațiilor, prezentările și termenii.
 * Culorile, fonturile și colțurile vin din winlex-tokens.css; antetul, butoanele și subsolul sunt cele ale site-ului. */
:root{color-scheme:light}
html.t-dark{color-scheme:dark}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:72px;-webkit-text-size-adjust:100%}
body{font-family:var(--font);color:var(--ink);background:var(--paper);font-size:17px;line-height:1.5;letter-spacing:-.016em;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
:focus-visible{outline:2px solid var(--ok);outline-offset:3px;border-radius:4px}
.wrap{max-width:1024px;margin:0 auto;padding-inline:22px}
main .wrap{max-width:var(--wrap)}
.center{text-align:center}

/* butoanele site-ului */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--btn-bg);color:#fff;font-size:17px;padding:12px 24px;border-radius:9px;transition:background .3s var(--ease),transform .3s var(--ease)}
.btn:hover{background:var(--btn-hover)}
.btn:active{transform:scale(.98)}
.btn.ghost{background:transparent;color:var(--ok-ink);box-shadow:inset 0 0 0 1px currentColor}
.btn.ghost:hover{background:var(--tone)}
.dark .btn.ghost{color:var(--ok)}
.dark .btn.ghost:hover{background:rgba(60,207,42,.12)}
.btn svg{width:15px;height:15px}

/* lista aplicațiilor */
.head{background:var(--mist);padding-block:84px 64px;text-align:center}
.head h1{font-size:clamp(40px,6vw,64px);line-height:1.06;font-weight:600;letter-spacing:-.009em}
.head .lead{margin:18px auto 0;max-width:620px;font-size:clamp(17px,2vw,21px);line-height:1.38}
.head .lead::before{content:"/>\00a0";font-family:var(--mono);font-weight:600;color:var(--ok)}
.apps{padding-block:56px 110px}
.app-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.app{display:flex;flex-direction:column;background:var(--card);border-radius:var(--r-5xl);overflow:hidden;box-shadow:0 0 0 1px var(--line);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.app:hover{transform:translateY(-4px);box-shadow:0 0 0 1px rgba(60,207,42,.45),0 18px 40px -18px rgba(60,207,42,.35)}
.app-top{display:block;background:var(--black);color:#f5f5f7;text-align:center;padding:44px 24px 36px}
.app-top img{display:block;width:84px;height:78px;object-fit:contain;margin:0 auto 18px}
.app-top h2{font-size:clamp(32px,4vw,42px);line-height:1.05;font-weight:650;letter-spacing:-.014em}
.app-top p{margin-top:10px;font-size:17px;line-height:1.35;color:var(--muted-dark)}
.app-b{display:flex;flex-direction:column;gap:12px;padding:24px 26px 26px;flex:1}
.app-b p{color:var(--muted);font-size:16px}
.app-b .price{color:var(--ink);font-weight:600;font-size:15px}
.app-b .acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:8px}
.app-b .acts{gap:8px}
.app-b .acts .btn{font-size:14px;padding:8px 15px}
.app-b .terms{font-size:14px;color:var(--ok-ink);font-weight:500}

/* prezentările (păstrate din paginile primite) */
img,svg{max-width:100%}
.center{text-align:center}


section{padding-block:clamp(64px,10vw,112px)}
.dark{background:var(--black);color:#f5f5f7}
.mist{background:var(--mist)}
.paper{background:var(--paper)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ok-ink);margin-bottom:14px}
.dark .eyebrow{color:var(--ok)}
h1{font-size:clamp(46px,9vw,88px);line-height:1.02;font-weight:650;letter-spacing:-.018em}
h2{font-size:clamp(32px,5.2vw,54px);line-height:1.08;font-weight:600;letter-spacing:-.012em}
h3{font-size:19px;line-height:1.25;font-weight:600;letter-spacing:-.004em}
.sub{font-size:clamp(19px,2.3vw,27px);line-height:1.25;letter-spacing:.004em;margin-top:18px}
.lead{font-size:clamp(17px,1.8vw,20px);line-height:1.5;color:var(--muted);margin-top:16px;max-width:720px}
.center .lead{margin-inline:auto}
.dark .lead{color:var(--muted-dark)}

.hero{padding-block:clamp(72px,12vh,120px) clamp(72px,11vw,120px)}
.hero .mark{display:block;width:96px;height:90px;margin:0 auto 22px;object-fit:contain}
.ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px}
.fine{font-size:14px;color:var(--muted-dark);margin-top:24px}

.flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:48px;counter-reset:step}
.step{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-5xl);padding:28px 24px;position:relative;counter-increment:step}
.step::before{content:counter(step);position:absolute;top:22px;right:24px;font-size:13px;font-weight:700;color:var(--ok-ink)}
.ic{display:grid;place-items:center;width:48px;height:48px;border-radius:var(--r-xl);background:var(--tone);color:var(--tone-ink);margin-bottom:16px}
.ic svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.step p,.feat p,.need p,.qa p{color:var(--muted);font-size:15.5px;margin-top:8px}

.feats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 32px;margin-top:56px}
.feat{border-top:1px solid var(--line);padding-top:22px}
.dark .feat{border-top-color:#424245}
.dark .feat p{color:var(--muted-dark)}
.dark .ic{color:var(--ok)}

.cases{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.center .cases{justify-content:center}
.cases span{background:var(--tone);color:var(--tone-ink);font-size:14px;font-weight:600;padding:8px 14px;border-radius:var(--r-pill)}
.story{display:grid;gap:0;margin-top:44px;border-top:1px solid var(--line)}
.story div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
.story b{font-weight:650;color:var(--ok-ink);font-variant-numeric:tabular-nums}
.story span{color:var(--ink)}

.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:44px}
.need{background:var(--panel);border:1px solid var(--line2);border-radius:var(--r-5xl);padding:28px 26px}
.need ul{list-style:none;margin-top:14px}
.need li{position:relative;padding:8px 0 8px 26px;font-size:15.5px;color:var(--muted)}
.need li::before{content:"";position:absolute;left:3px;top:14px;width:11px;height:6px;border-left:2px solid var(--ok-ink);border-bottom:2px solid var(--ok-ink);transform:rotate(-45deg)}
.need li b{color:var(--ink);font-weight:600}
.note{background:var(--tone);border-radius:var(--r-2xl);padding:18px 22px;margin-top:22px;font-size:15px;color:var(--ink)}

.faq{margin-top:40px;border-top:1px solid var(--line);text-align:left}
.qa{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:19px 0;font-size:17px;font-weight:600}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font-size:23px;font-weight:400;line-height:1;color:var(--ok-ink);flex:none}
.qa[open] summary::after{content:"\2212"}
.qa p{margin:-5px 0 20px;max-width:780px}


@media (max-width:800px){
  .flow,.feats,.two{grid-template-columns:minmax(0,1fr)}
  .feats{gap:30px}
}

/* Termeni si conditii */
.legal{padding-block:clamp(56px,9vh,88px) clamp(56px,8vw,88px)}
.legal .wrap{max-width:820px}
.legal-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-bottom:34px}
.legal-head img{display:block;height:34px;width:auto}
.legal-app{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:650;line-height:34px}
/* sigla WINLEX: varianta neagră pe luminos, cea albă pe întunecat */
.legal-w.on-dark{display:none}
html.t-dark .legal-w.on-dark{display:block}
html.t-dark .legal-w.on-light{display:none}
.legal h1{font-size:clamp(32px,5vw,46px);line-height:1.1;letter-spacing:-.01em}
.legal h3{margin-top:32px}
.legal p{margin-top:10px;font-size:16px;line-height:1.6;color:var(--muted)}
.legal p strong{color:var(--ink);font-weight:600}
.legal p a,.legal li a{color:var(--ok-ink);font-weight:600}
.legal ul{margin-top:10px;padding-left:20px;font-size:16px;line-height:1.6;color:var(--muted)}
.legal li{margin-top:6px}
.legal li strong{color:var(--ink);font-weight:600}
.legal .added{background:var(--tone);border-radius:var(--r-lg);padding:14px 16px;color:var(--ink)}
.legal .ctas{justify-content:flex-start}

/* subsolul site-ului */
footer{background:var(--mist);color:var(--muted);font-size:12px;padding-block:24px}
footer .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
footer a{color:var(--muted)}
footer a.cr{color:var(--ok-ink);font-weight:600}

/* lista de aplicații: compactă, ca antetul și cardurile să încapă pe ecran fără derulare */
.head-s{padding-block:40px 34px}
.head-s h1{font-size:clamp(34px,4.4vw,48px)}
.head-s .lead{margin-top:10px;font-size:clamp(16px,1.7vw,19px)}
.head-s+.apps{padding-block:32px 72px}
.head-s+.apps .app-top{padding:28px 22px 24px}
.head-s+.apps .app-top img{width:64px;height:60px;margin-bottom:12px}
.head-s+.apps .app-top h2{font-size:clamp(28px,3.2vw,34px)}
.head-s+.apps .app-top p{margin-top:6px;font-size:16px}
.head-s+.apps .app-b{gap:10px;padding:18px 22px 22px}
.head-s+.apps .app-b p{font-size:15px}
/* pe ecranele înalte cardurile stau centrate între antet și subsol */
main.list{display:flex;flex-direction:column}
main.list .apps{flex:1 0 auto;width:100%;display:flex;flex-direction:column;justify-content:center}
@media (max-width:760px){.app-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:600px){.hero .ctas .btn{font-size:15px;padding:10px 20px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.app{transition:none}}