/*
 * Шестте карти на prototype.edufacturing.com и потокът след щракване (Краси, 29.10.2026). Светъл вид „Сцена без рамка“ от одобрения макет (версия 2), както на 3ddesign:
 * моделите стоят на страницата върху мек бял кръг светлина, без кутии и без рамки; името се подчертава в оранжево при задържане. Токените (--tx, --mu, --ln, --or, --te2,
 * --sv-*) са на корена .efv4.prt.reklama (uslugi-app-svetli.css); шрифтът е на страницата. Зарежда се само когато страницата има карти, след prototip.css и преди
 * uslugi-app-svetli.css (той остава последен). Всяко правило започва с .efv4.prt.reklama, за да бие общите правила за h2, h3, бутоните и списъците на efv4.css и на светлия файл.
 * Мястото в страницата: картите и потокът са между .intro (заглавие, NDA, „Как работи“) и картата с водача #pokazhi, която остава под тях и се скрива, докато потокът е отворен.
 * Кръговете (номерата на стъпките и отметката накрая) и значката „Препоръчваме“ са от макета.
 */
.efv4.prt.reklama{--k-zeleno:#1E7A4C;--k-izhod:cubic-bezier(.23,1,.32,1);--k-liniya2:#B9C1CA}
.efv4.prt.reklama :is(.karti,.potok,.napredak,.vtori,.podskazka-greshka)[hidden]{display:none}
@media (scripting:none){.efv4.prt.reklama :is(.karti,.potok){display:none}}
/* докато потокът е отворен, водачът и лепкавият бутон към него се скриват (prototip.js ги следи, но не знае за потока) */
html.efprt-potok .efv4.prt.reklama #pokazhi{display:none}
html.efprt-potok a.stick.btn{display:none}

/* ---------------------------------------------------------------- мястото в страницата */
.efv4.prt.reklama .hero .w > :is(.intro,.karti,.potok){grid-column:1 / -1;min-width:0}
.efv4.prt.reklama .hero .w > .card{grid-column:1 / -1;width:100%;max-width:760px;justify-self:start}
@media (min-width:641px){.efv4.prt.reklama .hero .w{row-gap:clamp(24px,3vw,44px)}}
@media (max-width:640px){
  .efv4.prt.reklama .hero .w > :is(.karti,.potok){order:8;margin-top:28px}
  .efv4.prt.reklama .hero .w > .card{order:9}
  /* мишени за пръст в потока (изпитът от 29.10.2026, a11y.dopir.cel_malka): връзката към NDA след изпращането е сама в
     реда и е висока 40px, както горе; политиката в изречението за съгласие расте с вътрешно поле, без да мести текста */
  .efv4.prt.reklama .belezhka-p a{display:inline-flex;align-items:center;min-height:40px}
  .efv4.prt.reklama .forma .saglasie a{padding:4px 0}
}

/* ---------------------------------------------------------------- картите */
.efv4.prt.reklama .karti,.efv4.prt.reklama .potok{padding:0}
.efv4.prt.reklama .karti-vapros{margin:0;font-size:clamp(26px,3.2vw,40px);line-height:1.12;font-weight:800;letter-spacing:-.03em;color:var(--tx);text-wrap:balance}
.efv4.prt.reklama .karti-podsk{margin:8px 0 clamp(18px,2.6vw,30px);color:var(--mu);font-size:clamp(16px,1.4vw,18px)}
.efv4.prt.reklama .mreja{list-style:none;margin:0;padding:0;max-width:1320px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,2.4vw,34px) clamp(12px,2vw,26px)}
@media (max-width:1000px){.efv4.prt.reklama .mreja{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.efv4.prt.reklama .mreja{grid-template-columns:minmax(0,1fr)}}
.efv4.prt.reklama .mreja > li{min-width:0}
.efv4.prt.reklama .karta{all:unset;box-sizing:border-box;position:relative;display:grid;grid-template-rows:auto 1fr;width:100%;height:100%;cursor:pointer;overflow:hidden;background:transparent}
.efv4.prt.reklama .scena{position:relative;display:block;aspect-ratio:4/3;max-width:100%}
.efv4.prt.reklama .karta .scena{background:radial-gradient(54% 42% at 50% 64%, #FFFFFF 0%, rgba(255,255,255,.6) 42%, rgba(255,255,255,0) 72%)}
/* плакатът е на мястото на модела, докато той не е готов; model-viewer идва отгоре и се показва, щом се зареди */
.efv4.prt.reklama .plakat{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;transition:opacity 400ms ease}
.efv4.prt.reklama :is(.scena,.golyam).gotova .plakat{opacity:0}
.efv4.prt.reklama :is(.scena,.golyam) model-viewer{position:absolute;inset:0;display:block;width:100%;height:100%;background:transparent;--poster-color:transparent;--progress-bar-height:0px;--progress-bar-color:transparent;opacity:0;transition:opacity 500ms ease}   /* без сивата лента на зареждането: плакатът е мястото на модела, докато не е готов */
.efv4.prt.reklama :is(.scena,.golyam) model-viewer.vidim{opacity:1}
.efv4.prt.reklama .karta .scena model-viewer{pointer-events:none;clip-path:inset(0 0 1px 0)}   /* при дробна височина на сцената въртящият се модел оставя тъмен ред на долния ръб на платното; там сянката е прозрачна (урок от 3ddesign) */
.efv4.prt.reklama .tekst{display:grid;gap:4px;align-content:start;text-align:center;padding:2px 8px 0}
.efv4.prt.reklama .ime{font-size:clamp(19px,1.8vw,23px);font-weight:700;letter-spacing:-.015em;line-height:1.2;color:var(--tx);text-decoration:underline 3px transparent;text-underline-offset:7px;transition:text-decoration-color 200ms ease}
.efv4.prt.reklama .karta:hover .ime,.efv4.prt.reklama .karta:focus-visible .ime{text-decoration-color:var(--or)}
.efv4.prt.reklama .red{color:var(--mu);font-size:15.5px;line-height:1.45}
.efv4.prt.reklama .karti-sam{margin:clamp(18px,2.4vw,30px) 0 0;font-size:16px}
.efv4.prt.reklama .karti-sam a{display:inline-flex;align-items:center;min-height:44px;color:var(--te2);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.efv4.prt.reklama .karti-sam a:hover{color:var(--tx)}

/* ---------------------------------------------------------------- потокът след щракване */
.efv4.prt.reklama .potok{padding-bottom:clamp(8px,2vw,24px)}
.efv4.prt.reklama .potok-gore{display:flex;align-items:center;gap:18px;margin-bottom:clamp(18px,2.6vw,28px);min-height:44px}
.efv4.prt.reklama .vrashtane{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:10px;border:1.5px solid var(--k-liniya2);background:#FFFFFF;color:var(--tx);font-weight:700;font-size:15px;transition:border-color 160ms ease, transform 160ms ease-out}
.efv4.prt.reklama .vrashtane:hover{border-color:var(--tx)}
.efv4.prt.reklama .vrashtane:active{transform:scale(.97)}
.efv4.prt.reklama .napredak{flex:1;display:flex;align-items:center;gap:12px;font-size:14px;color:var(--mu);font-variant-numeric:tabular-nums}
.efv4.prt.reklama .napredak .pista{flex:1;max-width:420px;height:6px;border-radius:3px;background:var(--ln);overflow:hidden}
.efv4.prt.reklama .napredak .pista i{display:block;height:100%;width:0;border-radius:3px;background:var(--or);transition:width 320ms var(--k-izhod)}
.efv4.prt.reklama .potok h2.vapros{margin:0;font-size:clamp(28px,3.6vw,44px);line-height:1.1;font-weight:800;letter-spacing:-.03em;color:var(--tx);text-wrap:balance}
.efv4.prt.reklama .potok h2.vapros:focus{outline:none}
.efv4.prt.reklama .podsk{margin:8px 0 0;color:var(--mu);font-size:17px;max-width:62ch}

/* плочките на избора: три в ред (четири за технологиите и етапите); на телефон три избора стават редове с картинка вляво, четири остават в две колони */
.efv4.prt.reklama .plochki{margin-top:clamp(18px,2.4vw,26px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.4vw,16px)}
.efv4.prt.reklama .plochki.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){.efv4.prt.reklama .plochki.n4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .efv4.prt.reklama .plochki:not(.n4){grid-template-columns:minmax(0,1fr)}
  .efv4.prt.reklama .plochki:not(.n4) .plochka{grid-template-rows:none;grid-template-columns:136px minmax(0,1fr);align-items:center}
}
.efv4.prt.reklama .plochka{all:unset;box-sizing:border-box;cursor:pointer;position:relative;display:grid;grid-template-rows:auto 1fr;background:#FFFFFF;border:2px solid #E1E5EA;border-radius:16px;overflow:hidden;transition:border-color 160ms ease, transform 160ms ease-out, box-shadow 200ms ease}
.efv4.prt.reklama .plochka:hover{border-color:var(--k-liniya2);box-shadow:0 10px 24px rgba(28,35,43,.08)}
.efv4.prt.reklama .plochka:active{transform:scale(.98)}
.efv4.prt.reklama .plochka[aria-pressed="true"]{border-color:var(--or);box-shadow:0 0 0 3px rgba(242,106,27,.2)}
.efv4.prt.reklama .kartinka{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:radial-gradient(90% 80% at 50% 35%, #FFFFFF 0%, #F1F3F5 60%, #E4E8EC 100%)}
.efv4.prt.reklama .plochka .pt{display:grid;gap:3px;padding:12px 14px 14px;align-content:start}
.efv4.prt.reklama .plochka b{font-size:17px;line-height:1.25;color:var(--tx)}
.efv4.prt.reklama .plochka small{font-size:14px;color:var(--mu);line-height:1.35}
.efv4.prt.reklama .znachka{justify-self:start;font-size:12.5px;font-weight:700;color:#FFFFFF;background:var(--te2);border-radius:999px;padding:2px 10px;margin-bottom:2px}
@media (max-width:640px){.efv4.prt.reklama .plochka b{font-size:15.5px}.efv4.prt.reklama .plochka .pt{padding:10px 11px 12px}}

/* „Как става“: големият модел вляво със подсказка под сцената, четирите стъпки вдясно */
.efv4.prt.reklama .ek-kak{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(18px,3vw,44px);align-items:start}
@media (max-width:900px){.efv4.prt.reklama .ek-kak{grid-template-columns:minmax(0,1fr)}}
.efv4.prt.reklama .golyam{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3;max-width:100%;background:radial-gradient(90% 80% at 50% 35%, #FFFFFF 0%, #F1F3F5 60%, #E1E6EA 100%)}
.efv4.prt.reklama .golyam model-viewer{pointer-events:auto}
.efv4.prt.reklama .ruka{margin:8px 0 0;text-align:center;font-size:13px;color:var(--mu)}
.efv4.prt.reklama .kak-stapki{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;counter-reset:st}
.efv4.prt.reklama .kak-stapki li{position:relative;background:#FFFFFF;border:1px solid #E1E5EA;border-radius:14px;overflow:hidden;display:grid;grid-template-rows:auto 1fr}
.efv4.prt.reklama .kak-stapki li::before{counter-increment:st;content:counter(st);position:absolute;z-index:1;top:10px;left:10px;width:28px;height:28px;border-radius:50%;background:var(--tx);color:#FFFFFF;font-weight:800;font-size:14px;display:grid;place-items:center}
.efv4.prt.reklama .kak-stapki .pt{display:grid;gap:2px;padding:10px 12px 12px;align-content:start}
.efv4.prt.reklama .kak-stapki b{font-size:16px;line-height:1.25;color:var(--tx)}
.efv4.prt.reklama .kak-stapki small{font-size:14px;color:var(--mu);line-height:1.35}
.efv4.prt.reklama .poluchavate{margin:16px 0 0;font-size:16px;max-width:62ch;color:var(--sv-tekst)}
.efv4.prt.reklama .poluchavate b{color:var(--tx)}

/* „Какво още да включва?“: списък с отметки (може няколко) и винаги включеното */
.efv4.prt.reklama .spisak{list-style:none;margin:clamp(18px,2.4vw,26px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:980px}
@media (max-width:760px){.efv4.prt.reklama .spisak{grid-template-columns:minmax(0,1fr)}}
.efv4.prt.reklama .spisak > li{min-width:0}
.efv4.prt.reklama .red-izbor{all:unset;box-sizing:border-box;cursor:pointer;width:100%;height:100%;display:grid;grid-template-columns:120px minmax(0,1fr) auto;align-items:center;gap:14px;padding:10px 16px 10px 10px;background:#FFFFFF;border:2px solid #E1E5EA;border-radius:16px;transition:border-color 160ms ease, box-shadow 200ms ease}
@media (max-width:420px){.efv4.prt.reklama .red-izbor{grid-template-columns:92px minmax(0,1fr) auto;gap:10px}}
.efv4.prt.reklama .red-izbor:hover{border-color:var(--k-liniya2)}
.efv4.prt.reklama .red-izbor[aria-pressed="true"]{border-color:var(--or);box-shadow:0 0 0 3px rgba(242,106,27,.2)}
.efv4.prt.reklama .red-izbor .kartinka{border-radius:10px}
.efv4.prt.reklama .red-izbor .pt{display:grid;gap:2px;min-width:0}
.efv4.prt.reklama .red-izbor b{font-size:16.5px;line-height:1.25;color:var(--tx)}
.efv4.prt.reklama .red-izbor small{font-size:14px;color:var(--mu);line-height:1.35}
.efv4.prt.reklama .otm{width:26px;height:26px;border-radius:7px;border:2px solid #AEB7C1;display:grid;place-items:center;background:#FFFFFF}
.efv4.prt.reklama .red-izbor[aria-pressed="true"] .otm{background:var(--or);border-color:var(--or)}
.efv4.prt.reklama .red-izbor[aria-pressed="true"] .otm::after{content:"";width:7px;height:13px;border:solid #FFFFFF;border-width:0 3px 3px 0;transform:translate(0,-1px) rotate(45deg)}
.efv4.prt.reklama .red-izbor.vklyucheno{cursor:default;background:#F4F8F6;border-color:#CFE3D8}
.efv4.prt.reklama .red-izbor.vklyucheno .otm{border:none;background:none;width:auto;height:auto;font-size:12.5px;font-weight:700;color:var(--k-zeleno)}

/* бутоните на потока */
.efv4.prt.reklama .deystviya{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:24px}
.efv4.prt.reklama .glaven{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 30px;border-radius:12px;background:var(--or);color:#14191F;font-weight:800;font-size:18px;text-decoration:none;transition:transform 160ms ease-out, background-color 160ms ease}
.efv4.prt.reklama .glaven:hover{background:#FF8A47}
.efv4.prt.reklama .glaven:active{transform:scale(.97)}
.efv4.prt.reklama .glaven[disabled]{opacity:.42;cursor:not-allowed;transform:none}
.efv4.prt.reklama .vtori{all:unset;cursor:pointer;font-weight:600;color:var(--te2);text-decoration:underline;text-underline-offset:3px;padding:8px 4px}
.efv4.prt.reklama .belezhka-p{color:var(--mu);font-size:14.5px;margin:10px 0 0}
.efv4.prt.reklama .podskazka-greshka{color:var(--sv-greshka-t);font-size:14.5px;font-weight:600;margin:6px 0 0}

/* „Покажете ни идеята“: описание с брояч и истинско качване на файлове */
.efv4.prt.reklama .forma{display:grid;gap:8px;max-width:560px;margin-top:20px}
.efv4.prt.reklama .forma > label{display:grid;gap:6px;font-weight:600;margin-top:6px;color:var(--tx)}
.efv4.prt.reklama .forma input[type=text],.efv4.prt.reklama .forma input[type=email],.efv4.prt.reklama .forma input[type=tel],.efv4.prt.reklama .forma textarea{font:inherit;font-size:17px;width:100%;min-height:50px;padding:13px 14px;border:1.5px solid var(--k-liniya2);border-radius:10px;background:#FFFFFF;color:var(--tx)}
.efv4.prt.reklama .forma textarea{resize:vertical;min-height:96px}
.efv4.prt.reklama .forma input:focus,.efv4.prt.reklama .forma textarea:focus{outline:3px solid rgba(11,111,134,.3);border-color:var(--te2)}
.efv4.prt.reklama .broyach{color:var(--mu);font-size:13.5px;font-variant-numeric:tabular-nums;justify-self:end}
.efv4.prt.reklama .kachi{box-sizing:border-box;cursor:pointer;position:relative;display:grid;grid-template-columns:120px minmax(0,1fr);align-items:center;gap:16px;width:100%;max-width:560px;min-height:96px;margin-top:18px;padding:10px 16px 10px 10px;border:2px dashed #AEB7C1;border-radius:16px;background:#F8F9FA;color:var(--tx);font-weight:700;font-size:17px;transition:border-color 160ms ease, background-color 160ms ease}
.efv4.prt.reklama .kachi:hover{border-color:var(--or)}
.efv4.prt.reklama .kachi:focus-within{outline:3px solid var(--or);outline-offset:2px}
.efv4.prt.reklama .kachi .kartinka{border-radius:10px}
.efv4.prt.reklama .kachi-tekst{display:block}
.efv4.prt.reklama .kachi small{display:block;font-weight:500;font-size:14px;color:var(--mu)}
.efv4.prt.reklama .kachi.dobaveni{border-style:solid;border-color:var(--k-zeleno);background:#EEF7F2}
.efv4.prt.reklama .kachi input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.efv4.prt.reklama .faylove-spisak{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px;max-width:560px}
.efv4.prt.reklama .faylove-spisak:empty{display:none}
.efv4.prt.reklama .fr{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:8px 8px 8px 14px;border:1px solid var(--ln);border-radius:10px;background:#FFFFFF;color:var(--tx);font-size:15px}
.efv4.prt.reklama .fr.bad{border-color:var(--sv-greshka)}
.efv4.prt.reklama .fr.ok{border-color:var(--k-zeleno)}
.efv4.prt.reklama .fr .fn{flex:1 1 200px;min-width:0;overflow-wrap:anywhere;font-weight:600}
.efv4.prt.reklama .fr .fs,.efv4.prt.reklama .fr .fm{color:var(--mu)}
.efv4.prt.reklama .fr.bad .fm{color:var(--sv-greshka-t)}
.efv4.prt.reklama .fr .fx{all:unset;box-sizing:border-box;cursor:pointer;display:grid;place-items:center;width:44px;height:44px;border-radius:10px;color:var(--te2);font-size:22px;line-height:1}
.efv4.prt.reklama .fr .fx:hover{background:var(--s2)}
.efv4.prt.reklama .fayl-greshka{margin:8px 0 0;color:var(--sv-greshka-t);font-weight:600;max-width:560px}
.efv4.prt.reklama .fayl-greshka:empty{display:none}

/* цената накрая */
.efv4.prt.reklama .cena{display:grid;gap:4px;margin-top:16px}
.efv4.prt.reklama .cena-etiket{font-weight:700;color:var(--mu);font-size:16px}
.efv4.prt.reklama .cena-chislo{font-size:clamp(46px,7.4vw,84px);line-height:1;font-weight:800;letter-spacing:-.045em;font-variant-numeric:tabular-nums;color:var(--tx);text-wrap:balance}
.efv4.prt.reklama .cena-za{color:var(--mu);font-size:17px;max-width:60ch}
.efv4.prt.reklama .cena-za::first-letter{text-transform:uppercase}
.efv4.prt.reklama .obobshtenie{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:8px;max-width:760px}
.efv4.prt.reklama .obobshtenie li{display:grid;grid-template-columns:160px minmax(0,1fr);gap:12px;padding:10px 14px;background:#FFFFFF;border:1px solid #E1E5EA;border-radius:12px;font-size:16px;color:var(--tx)}
.efv4.prt.reklama .obobshtenie li span:first-child{color:var(--mu);font-weight:600}
@media (max-width:520px){.efv4.prt.reklama .obobshtenie li{grid-template-columns:minmax(0,1fr);gap:2px}}
.efv4.prt.reklama .oferta-belezhka{margin:18px 0 0;padding:14px 16px;border-radius:12px;background:#FFFFFF;border:1px solid #E1E5EA;max-width:760px;color:var(--sv-tekst)}

/* контактът */
.efv4.prt.reklama .forma .saglasie{margin-top:10px}
.efv4.prt.reklama .forma .saglasie label{display:flex;align-items:flex-start;gap:12px;font-weight:400;font-size:15px;color:var(--sv-tekst);margin:0}
.efv4.prt.reklama .forma .saglasie input{flex:none;width:24px;height:24px;margin:0;accent-color:var(--or)}
.efv4.prt.reklama .forma .saglasie a{color:var(--te2);text-decoration:underline;text-underline-offset:3px}
.efv4.prt.reklama .forma .err{margin:0;color:var(--sv-greshka-t);font-size:14.5px;font-weight:600}
.efv4.prt.reklama .forma .err:empty{display:none}
.efv4.prt.reklama .forma .forma-greshka{margin:6px 0 0;color:var(--sv-greshka-t);font-weight:600}
.efv4.prt.reklama .forma .forma-greshka:empty{display:none}
.efv4.prt.reklama .forma .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* краят */
.efv4.prt.reklama .otmetka{width:72px;height:72px;border-radius:50%;background:var(--k-zeleno);position:relative;margin-bottom:18px}
.efv4.prt.reklama .otmetka::after{content:"";position:absolute;left:26px;top:15px;width:17px;height:32px;border:solid #FFFFFF;border-width:0 6px 6px 0;transform:rotate(45deg)}

@media (prefers-reduced-motion: reduce){
  .efv4.prt.reklama :is(.karta,.plochka,.glaven,.vrashtane,.red-izbor,.kachi,.napredak .pista i,.plakat,.scena model-viewer,.golyam model-viewer,.ime){transition:none}
}
