/* Flowmatic v1, supliment pentru paginile de serviciu (creare-site, websites-seo, meta-ads, aplicatii-web, automatizari, chatboti).
   Se încarcă DUPĂ fm-v1.css, doar pe aceste pagini. Refolosește primitivele scenelor din fm-v1 (.panel, .ptitle, .chip, .browser,
   .page, .blk, .chat, .msg, .map, .gcard, .ads, keyframes in-N / grow-N). Doar transform, opacity, clip-path în animații. */

/* ---------- Componente de pagină ---------- */
.logo-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;padding:0;margin:0;list-style:none}
.logo-strip li{height:64px;border:1px solid var(--line);border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;padding:12px 18px}
.logo-strip li.dark{background:#14171C;border-color:#14171C}
.logo-strip img{max-height:36px;width:auto;max-width:100%;object-fit:contain}
.sec-head.row{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 20px;max-width:none}
.sec-head.row h2{margin:0}
.sec-head.row .aside{color:var(--ink-2);font-size:1rem;font-weight:500}
.sec-head.row p{flex-basis:100%;max-width:62ch}
.card figure,.works figure{margin:0}
.card.media{padding:0;overflow:hidden}
.card.media img{width:100%;aspect-ratio:16/10;object-fit:cover;border-bottom:1px solid var(--line)}
.card.media .body{padding:22px 24px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.card.media .body .more{margin-top:auto;padding-top:8px;font-weight:600;color:var(--blue);font-size:.95rem}
.card .eyebrow{font-size:.9rem;color:var(--ink-2);font-weight:500}
.card ul{margin:4px 0 0;padding-left:20px;color:var(--ink-2);font-size:1rem;display:grid;gap:6px}
.sec.dark .card ul{color:#B7BEDA}
.works{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.works img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;border:1px solid var(--line);background:#E3E8F4}
.works figcaption{padding-top:10px}
.works figcaption b{display:block;font-weight:600}
.works figcaption span{color:var(--ink-2);font-size:.95rem}
.steps.five{grid-template-columns:repeat(5,1fr)}
@media (max-width:1100px){.steps.five{grid-template-columns:repeat(3,1fr)}.steps.five .step:nth-child(3)::before{right:0}}
@media (max-width:900px){.steps.five{grid-template-columns:1fr 1fr}.steps.five .step:nth-child(3)::before{right:-20px}.steps.five .step:nth-child(2)::before,.steps.five .step:nth-child(4)::before{right:0}}
@media (max-width:560px){.steps.five{grid-template-columns:1fr}.steps.five .step::before,.steps.five .step:nth-child(n)::before{right:0}}
.steps.three{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.steps.three{grid-template-columns:1fr 1fr}.steps.three .step:nth-child(2)::before{right:0}}
@media (max-width:560px){.steps.three{grid-template-columns:1fr}.steps.three .step::before,.steps.three .step:nth-child(n)::before{right:0}}
.step .when{display:block;font-size:.9rem;color:var(--blue);font-weight:600;margin-top:4px}
.sec.dark .step .when{color:#9DB7FF}
.proof-grid.three{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.proof-grid.three{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.proof-grid.three{grid-template-columns:1fr}}
.proof-grid a{display:block;color:inherit}
.proof-grid a:hover img{opacity:.92}
.proof-grid .zoom{display:block;padding:0 18px 14px;margin-top:-6px;font-size:.88rem;color:var(--ink-2)}
.places{margin:0;padding:0;list-style:none;border-top:1px solid rgba(255,255,255,.18)}
.places li{display:grid;grid-template-columns:90px minmax(0,1fr) minmax(0,1.6fr);gap:12px 28px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.18);align-items:baseline}
.places .tag{font-family:var(--display);font-weight:800;font-size:1.1rem;color:#9DB7FF}
.places h3{font-size:1.25rem}
.places p{color:#B7BEDA;font-size:1.05rem}
@media (max-width:760px){.places li{grid-template-columns:70px minmax(0,1fr)}.places p{grid-column:2}}
.checklist{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 28px}
.checklist li{position:relative;padding-left:32px;font-size:1.05rem;color:#E8ECFA;line-height:1.45}
.checklist li::before{content:"";position:absolute;left:0;top:.2em;width:20px;height:20px;border-radius:50%;background:rgba(29,180,122,.22) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3 3 7-7' fill='none' stroke='%237CE6B9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
@media (max-width:700px){.checklist{grid-template-columns:1fr}}
.two-col .col-media img{width:100%;border-radius:var(--r-l);border:1px solid var(--line);background:#E3E8F4}
.two-col .col-media img.tall{aspect-ratio:5/4;object-fit:cover}
.two-col .col-text .links{margin-top:22px}
.two-col .col-text .prose{max-width:none}
.two-col .stack{display:grid;gap:14px}
.two-col .stack .card{padding:20px 22px}
.two-col .bul{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.two-col .bul li{position:relative;padding-left:26px;color:var(--ink-2);font-size:1.05rem}
.two-col .bul li::before{content:"";position:absolute;left:0;top:.5em;width:10px;height:10px;border-radius:50%;background:var(--blue)}
.sec.white .two-col .col-media img{border-color:var(--line)}

/* Rezultate Meta (tile-uri) și dovezi pe fundal închis */
.sec.dark .results li{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14)}
.sec.dark .results .fact{color:#fff}
.sec.dark .results .fact small{color:#B7BEDA}
.sec.dark .proof-grid{margin-top:28px}
.sec.dark .proof-grid figure{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.14)}
.sec.dark .proof-grid figcaption{color:#fff}
.sec.dark .proof-grid figcaption small{display:block;color:#B7BEDA;font-size:.9rem;margin-bottom:4px}

/* Simulator buget (meta-ads) */
.sim{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:clamp(22px,3vw,34px);display:grid;gap:18px}
.sim .head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.sim .head label{font-weight:600;font-size:.95rem;color:var(--ink-2)}
.sim .head output{font-family:var(--display);font-weight:800;font-size:clamp(1.6rem,2.6vw,2.2rem);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.sim input[type=range]{width:100%;font-size:16px;min-height:44px;accent-color:var(--blue);margin:0;cursor:pointer;background:transparent}
.sim .range-ends{display:flex;justify-content:space-between;font-size:.88rem;color:var(--ink-2);margin-top:-10px}
.sim-out{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.sim-out li{background:var(--paper);border-radius:14px;padding:16px 18px}
.sim-out output{display:block;font-family:var(--display);font-weight:800;font-size:clamp(1.4rem,2.2vw,1.9rem);letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}
.sim-out small{display:block;color:var(--ink-2);font-size:.88rem;margin-top:6px}
.sim .note{font-size:.88rem;color:var(--ink-2)}
@media (max-width:480px){.sim-out{grid-template-columns:1fr}}

/* Pachete (meta-ads) */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:stretch}
@media (max-width:900px){.tiers{grid-template-columns:1fr}}
.tier{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;display:flex;flex-direction:column;gap:14px}
.tier .name{font-weight:600;color:var(--ink-2)}
.tier .badge{align-self:flex-start;font-size:.82rem;font-weight:600;padding:5px 10px;border-radius:999px;background:var(--tint);color:var(--blue-ink)}
.tier .price{font-family:var(--display);font-weight:800;font-size:clamp(2rem,3.4vw,2.8rem);letter-spacing:-.02em;line-height:1}
.tier .price small{display:block;font-family:var(--body);font-weight:500;font-size:.95rem;color:var(--ink-2);letter-spacing:0;margin-top:6px}
.tier ul{margin:0;padding:0;list-style:none;display:grid;gap:8px;color:var(--ink-2)}
.tier ul li{padding-left:22px;position:relative}
.tier ul li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:50%;background:var(--blue)}
.tier.featured{background:var(--ink);color:#fff;border-color:var(--ink)}
.tier.featured .name,.tier.featured ul,.tier.featured .price small{color:#B7BEDA}
.tier.featured .badge{background:rgba(255,255,255,.14);color:#fff}
.tier.featured ul li::before{background:#9DB7FF}
.audit-box{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:32px;align-items:center}
@media (max-width:820px){.audit-box{grid-template-columns:1fr}}

/* Cazuri chatbot */
.case-nav{margin-top:0}
.case{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px;align-items:center;padding:44px 0;border-top:1px solid var(--line);scroll-margin-top:90px}
.case:first-of-type{border-top:0;padding-top:8px}
.case:nth-of-type(even) .case-media{order:2}
.case-media img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-l);border:1px solid var(--line);background:#E3E8F4}
.case h3{font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.1}
.case .lbl{display:block;font-weight:600;font-size:.95rem;color:var(--blue);margin:22px 0 6px}
.case p{color:var(--ink-2);font-size:1.05rem}
.case ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.case ul li{position:relative;padding-left:26px;color:var(--ink-2);font-size:1.02rem}
.case ul li::before{content:"";position:absolute;left:0;top:.45em;width:10px;height:10px;border-radius:50%;background:var(--green)}
.case .fit{margin-top:6px}
.case .fit b{font-weight:600;color:var(--ink)}
.case .go{display:inline-block;margin-top:18px;font-weight:600;color:var(--blue)}
@media (max-width:900px){.case{grid-template-columns:1fr;gap:22px;padding:34px 0}.case:nth-of-type(even) .case-media{order:0}}

/* ---------- Scene noi (aceleași primitive ca în fm-v1) ---------- */
/* Scena: site construit zi cu zi (creare-site) */
.s-build{display:grid;grid-template-columns:1.45fr 1fr;gap:1em}
@media (max-width:640px){.s-build{grid-template-columns:1fr}}
.s-build .p-build{display:flex;flex-direction:column}
.s-build .browser{margin-bottom:.8em}
.s-build .page .blk.nav{height:1.1em;animation:in-10 12s infinite}
.s-build .page .blk.hero-blk{animation:in-33 12s infinite}
.s-build .page .txt{display:grid;gap:.35em;animation:in-22 12s infinite}
.s-build .page .txt i{display:block;height:.55em;border-radius:.3em;background:#E5E9F3}
.s-build .page .txt i:nth-child(2){width:84%}
.s-build .page .txt i:nth-child(3){width:62%}
.s-build .page .cards .blk{animation:in-36 12s infinite}
.s-build .page .frm{height:2.2em;border:1px dashed #C9D1E3;border-radius:.4em;display:flex;align-items:center;gap:.4em;padding:0 .5em;animation:in-45 12s infinite}
.s-build .page .frm i{display:block;height:.9em;border-radius:.3em;background:#EEF1F8;flex:1}
.s-build .page .frm b{display:block;height:.9em;width:2.6em;border-radius:.3em;background:var(--blue)}
.s-build .stamp{animation:in-58 12s infinite;margin-top:auto;align-self:flex-end}
.week-list{display:grid;gap:.45em;margin:0;padding:0;list-style:none}
.week-list li{display:grid;grid-template-columns:3.2em 1fr auto;align-items:center;gap:.6em;padding:.5em .7em;border-radius:.6em;background:rgba(255,255,255,.05);font-size:1.05em}
.week-list .d{color:var(--screen-mute);font-weight:600;font-size:.9em}
.week-list .ok{width:1.4em;height:1.4em;border-radius:50%;background:rgba(29,180,122,.22);display:grid;place-items:center;opacity:0}
.week-list .ok svg{width:.9em;height:.9em}
.week-list li:nth-child(1) .ok{animation:in-8 12s infinite}
.week-list li:nth-child(2) .ok{animation:in-20 12s infinite}
.week-list li:nth-child(3) .ok{animation:in-32 12s infinite}
.week-list li:nth-child(4) .ok{animation:in-44 12s infinite}
.week-list li:nth-child(5) .ok{animation:in-56 12s infinite}
.week-list li:nth-child(5){background:rgba(36,106,244,.22)}

/* Scena: fișă Google, Search Console, răspuns AI (websites-seo) */
.s-rank{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1em}
@media (max-width:640px){.s-rank{grid-template-columns:1fr 1fr}.s-rank .p-ai{grid-column:1/-1}}
.gsc{background:#fff;color:var(--ink);border-radius:.8em;padding:.8em;position:relative}
.gsc svg{width:100%;height:auto;display:block;overflow:visible}
.gsc .grid-l{stroke:#E5E9F3;stroke-width:1}
.gsc .line{fill:none;stroke:var(--blue);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:400;stroke-dashoffset:400;animation:sv-draw 12s ease-out infinite}
.gsc .area{fill:rgba(36,106,244,.12);clip-path:inset(0 100% 0 0);animation:sv-reveal 12s ease-out infinite}
.gsc .lbl{font-size:8px;fill:#8A93B8}
@keyframes sv-draw{0%,6%{stroke-dashoffset:400}60%,96%{stroke-dashoffset:0}99%,100%{stroke-dashoffset:400}}
@keyframes sv-reveal{0%,6%{clip-path:inset(0 100% 0 0)}60%,96%{clip-path:inset(0 0 0 0)}99%,100%{clip-path:inset(0 100% 0 0)}}
.s-rank .p-gsc .chip{margin-top:.8em;justify-self:start;animation:in-30 12s infinite}
.s-rank .p-gsc{display:flex;flex-direction:column}
.s-rank .p-gsc .chip{align-self:flex-start}
.s-rank .p-ai .msg{max-width:100%}
.s-rank .p-ai .msg.ai{background:rgba(255,255,255,.1);border-bottom-left-radius:.3em;animation:in-24 12s infinite}
.s-rank .p-ai .msg.them{animation:in-10 12s infinite}
.s-rank .p-ai .chip{margin-top:.8em;animation:in-42 12s infinite;justify-self:start;white-space:normal;line-height:1.3}
.s-rank .p-ai .chat{display:grid}
.s-rank .gcard .chip{white-space:normal;line-height:1.3;align-items:flex-start}
.s-rank .gcard .chip svg{margin-top:.15em}

/* Scena: reclamă + buget pe zile (meta-ads) */
.s-ads{display:grid;grid-template-columns:1fr 1.15fr;gap:1em}
@media (max-width:640px){.s-ads{grid-template-columns:1fr}}
.post{background:#fff;color:var(--ink);border-radius:.8em;overflow:hidden;font-size:1em}
.post .ph{display:flex;align-items:center;gap:.6em;padding:.7em .8em}
.post .ph i{width:2em;height:2em;border-radius:50%;background:var(--tint);flex:none}
.post .ph b{display:block;font-weight:600;font-size:1em}
.post .ph small{color:#8A93B8;font-size:.85em}
.post .ph img{margin-left:auto;height:1em;width:auto}
.post .pimg{height:6.5em;background:linear-gradient(135deg,#DCE5FA,#B9CCF8);position:relative;overflow:hidden}
.post .pimg::after{content:"";position:absolute;left:8%;right:8%;bottom:14%;height:38%;border-radius:.4em;background:rgba(255,255,255,.75)}
.post .pimg i{position:absolute;left:12%;bottom:22%;height:.6em;width:34%;border-radius:.3em;background:var(--blue);animation:in-14 12s infinite}
.post .pt{padding:.7em .8em;display:grid;gap:.35em}
.post .pt i{display:block;height:.55em;border-radius:.3em;background:#E5E9F3}
.post .pt i:nth-child(2){width:70%}
.post .pbtn{margin:0 .8em .8em;padding:.5em .8em;border-radius:.5em;background:var(--blue);color:#fff;font-weight:600;text-align:center;font-size:.95em}
.s-ads .p-ad{display:flex;flex-direction:column}
.s-ads .p-ad .chip{margin-top:.8em;align-self:flex-start;animation:in-24 12s infinite}
.s-ads .p-ad .post{animation:in-2 12s infinite}

/* Scena: flux n8n cu puls + jurnal (automatizari) */
.s-flow{display:grid;grid-template-columns:1.15fr 1fr;gap:1em}
@media (max-width:640px){.s-flow{grid-template-columns:1fr}}
.graph{background:#fff;color:var(--ink);border-radius:.8em;padding:.9em .8em;display:grid;place-items:center}
.graph svg{max-width:22em}
.graph svg{width:100%;height:auto;display:block;overflow:visible;font-family:var(--body)}
.graph .node{fill:#F1F4FB;stroke:#D9DEEA}
.graph .node.trig{fill:#E6ECF9}
.graph .on{fill:var(--blue);opacity:0}
.graph .nt{font-size:10.5px;fill:#121527;font-weight:600}
.graph .on+.nt{fill:#fff}
.graph .wire{fill:none;stroke:#C9D1E3;stroke-width:2}
.graph .pulse{fill:var(--blue);animation:sv-pulse 12s linear infinite;opacity:0}
.graph .on.n1{animation:sv-on-4 12s infinite}
.graph .on.n2{animation:sv-on-16 12s infinite}
.graph .on.n3{animation:sv-on-30 12s infinite}
.graph .on.n4{animation:sv-on-44 12s infinite}
.graph .on.n5{animation:sv-on-58 12s infinite}
@keyframes sv-pulse{0%,8%{transform:translateY(0);opacity:0}9%{opacity:1}16%{transform:translateY(38px)}22%{transform:translateY(38px)}30%{transform:translateY(76px)}36%{transform:translateY(76px)}44%{transform:translateY(114px)}50%{transform:translateY(114px)}58%{transform:translateY(152px);opacity:1}60%,100%{transform:translateY(152px);opacity:0}}
@keyframes sv-on-4{0%,4%{opacity:0}8%,96%{opacity:1}99%,100%{opacity:0}}
@keyframes sv-on-16{0%,16%{opacity:0}20%,96%{opacity:1}99%,100%{opacity:0}}
@keyframes sv-on-30{0%,30%{opacity:0}34%,96%{opacity:1}99%,100%{opacity:0}}
@keyframes sv-on-44{0%,44%{opacity:0}48%,96%{opacity:1}99%,100%{opacity:0}}
@keyframes sv-on-58{0%,58%{opacity:0}62%,96%{opacity:1}99%,100%{opacity:0}}
.log{display:grid;gap:.5em;margin:0;padding:0;list-style:none}
.log li{justify-self:start;white-space:normal;line-height:1.3}
.log li:nth-child(1){animation:in-18 12s infinite}
.log li:nth-child(2){animation:in-32 12s infinite}
.log li:nth-child(3){animation:in-45 12s infinite}
.log li:nth-child(4){animation:in-60 12s infinite}
.log li:nth-child(5){animation:in-72 12s infinite}

/* Scena: chatbot pe canale + tabloul echipei (chatboti) */
.s-chat{display:grid;grid-template-columns:1.15fr 1fr;gap:1em}
@media (max-width:640px){.s-chat{grid-template-columns:1fr}}
.chan{display:flex;gap:.4em;margin-bottom:.8em;flex-wrap:wrap}
.chan span{font-size:.95em;padding:.3em .7em;border-radius:.5em;background:rgba(255,255,255,.06);color:var(--screen-mute)}
.chan span.on{background:rgba(29,180,122,.18);color:#7CE6B9;font-weight:600}
.s-chat .chat .msg:nth-child(5){animation:in-56 14s infinite;justify-self:start}
.conv{display:grid;gap:.45em;margin:0;padding:0;list-style:none}
.conv li{display:grid;grid-template-columns:auto 1fr;gap:.6em;align-items:start;padding:.55em .7em;border-radius:.6em;background:rgba(255,255,255,.05);font-size:1em;line-height:1.35}
.conv li i{width:.6em;height:.6em;border-radius:50%;background:#7CE6B9;margin-top:.45em}
.conv li.h i{background:var(--amber)}
.conv li b{font-weight:600;color:var(--screen-text)}
.conv li span{display:block;color:var(--screen-mute);font-size:.92em}
.conv li:nth-child(1){animation:in-8 14s infinite}
.conv li:nth-child(2){animation:in-20 14s infinite}
.conv li:nth-child(3){animation:in-42 14s infinite}
.conv li:nth-child(4){animation:in-60 14s infinite}

/* Reduced motion: starea finală, nimic nu se mișcă */
@media (prefers-reduced-motion:reduce){
  .week-list .ok,.graph .on,.log li,.conv li{opacity:1}
  .graph .pulse{display:none}
  .gsc .line{stroke-dashoffset:0}
  .gsc .area{clip-path:none}
}
