/* GoDrive · godrive.bg · светла версия · общ стил за всички страници
   Шрифт: Onest (Google Fonts). Тематичните страници (/page/...) са с <body class="p-topic">,
   служебните (правни, контакти, линкове, грешки) с <body class="p-svc">. */

[hidden]{display:none!important}
.h1 span{text-wrap:balance}
/* Слоганът: на компютър балончето е „следи останалото“, на телефон/таблет само „останалото“ (иначе се пренася).
   „следи“ е в HTML само веднъж (в балончето); на телефон го показваме на първия ред чрез CSS, а в балончето
   остава само за екранните четци - така текстът без стилове не е „следи следи“. */
.h1 .h1-m,.h1 .h1-d{text-wrap:wrap}
.h1-m{display:none}
.h1-m::before{content:" следи"}
@media (max-width:1023px){.h1-m{display:inline}.h1-d{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}
body{margin:0;background:#0f0f10;font-family:'Onest',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:96px}
h1,h2,h3,p{margin:0}
.topbar{position:sticky;top:0;z-index:30;width:100%;display:flex;justify-content:center;padding:12px 12px 0}
.topnav{display:flex;align-items:center;gap:6px;padding:6px 6px 6px 8px;background:rgba(26,26,28,0.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border:1px solid #262629;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,0.35)}
.nav-a{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;font-size:15px;font-weight:500;color:#d4d4d8;transition:color .2s ease,background-color .2s ease}
.nav-a:hover{color:#ffffff;background:#222226}
.nav-a.on{color:#ffffff;background:#26262a}
.nav-logo{display:flex;align-items:center;gap:10px;margin-right:6px;padding-right:6px}
.nav-brand{font-size:18px;font-weight:700;color:#0E2747;letter-spacing:-0.01em}
.topnav .btn{white-space:nowrap}
/* Тесни телефони (iPhone SE/mini): логото, името и бутонът на един ред */
@media (max-width:400px){
.topbar{padding:12px 8px 0}
.nav-logo{gap:8px;margin-right:2px;padding-right:2px}
.nav-brand{font-size:17px}
.topnav .btn-sm{padding:11px 14px;gap:8px}
}
@media (max-width:359px){
.topnav .btn-sm svg{display:none}
}
.nav-logo{flex-shrink:0}
.topnav .btn-sm{margin-left:6px}
img{display:block;max-width:100%}
a{color:#e4e4e7;text-decoration:none}a:hover{color:#ffffff}
a:focus{outline:none}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #bcd5ff;outline-offset:4px;border-radius:999px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;cursor:pointer;font-family:inherit;font-weight:600;border-radius:999px;transition:transform .15s ease,filter .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease;-webkit-tap-highlight-color:transparent}
.btn-primary{background:#1565C0;color:#ffffff;box-shadow:inset 0 1px 0 rgba(255,255,255,0.25)}
.btn-primary:hover{filter:brightness(1.12);transform:translateY(-1px);color:#ffffff}
.btn-primary:active{filter:brightness(0.9);transform:translateY(1px) scale(0.98)}
.btn-secondary{background:#1b1b1e;border:1px solid #28282b;color:#f4f4f5}
.btn-secondary:hover{background:#26262a;border-color:#3f3f46;transform:translateY(-1px);color:#ffffff}
.btn-secondary:active{background:#141416;transform:translateY(1px) scale(0.98)}
.btn-lg{padding:18px 30px;font-size:18px;min-height:60px;box-shadow:inset 0 1px 0 rgba(255,255,255,0.25),0 8px 30px rgba(37,99,235,0.35)}
.btn-sm{padding:11px 18px;font-size:15px;min-height:44px}
.nav-link{transition:color .15s ease}
.nav-link:hover{color:#ffffff!important}
.nav-hide{display:none!important}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.sec{width:100%;padding:96px 0 0}
.head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;max-width:780px;margin:0 auto}
.head-left{align-items:flex-start;text-align:left;margin:0}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:#8db4ff}
.h1{font-size:clamp(40px,10.5vw,88px);line-height:1.06;font-weight:600;letter-spacing:-0.04em;color:#ffffff}
.h2{font-size:clamp(32px,7.4vw,56px);line-height:1.08;font-weight:600;letter-spacing:-0.035em;color:#ffffff;text-wrap:balance}
.h3{font-size:21px;line-height:1.3;font-weight:600;color:#ffffff}
.lead{font-size:clamp(18px,2.6vw,21px);line-height:1.55;color:#a1a1aa;text-wrap:pretty}
.body{font-size:16px;line-height:1.6;color:#a1a1aa;text-wrap:pretty}
.pill{display:inline-block;padding:2px clamp(18px,3vw,36px) clamp(6px,1vw,12px);border-radius:999px;background:#bcd5ff;color:#1f55e0}
.tag{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:0.02em;text-transform:none;white-space:nowrap;vertical-align:middle}
.tag-pro{background:#bcd5ff;color:#1f55e0}
.tag-plus{background:#1b2740;color:#8db4ff;border:1px solid #2a3a5c}
.card{padding:30px;border-radius:22px;background:#161618;border:1px solid #242427;display:flex;flex-direction:column;gap:14px}
.ico{width:48px;height:48px;flex:0 0 48px;border-radius:14px;background:#1b2740;color:#8db4ff;display:flex;align-items:center;justify-content:center}
.grid-3,.grid-2,.grid-4,.grid-5{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.split{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;align-items:center}
.col{display:flex;flex-direction:column;gap:32px}
.stack{display:flex;flex-direction:column;gap:56px}
.shot{position:relative;display:flex;justify-content:center;align-items:flex-start;height:clamp(460px,110vw,640px);border-radius:22px;overflow:hidden;border:1px solid #2a2a2e;background:#7fb0e8;box-shadow:0 40px 120px rgba(59,124,246,0.18)}
.shot-bg{position:absolute;inset:0;background:radial-gradient(120% 90% at 85% 10%,#b8d6f5 0%,rgba(184,214,245,0) 55%),radial-gradient(70% 80% at 100% 90%,#1f4ea8 0%,rgba(31,78,168,0) 70%),linear-gradient(180deg,#86b6ec 0%,#a7bcd6 45%,#c9b797 100%)}
.shot-ring1{position:absolute;width:1400px;height:1400px;left:55%;top:150px;border-radius:999px;border:70px solid rgba(255,255,255,0.14);filter:blur(6px)}
.shot-ring2{position:absolute;width:1400px;height:1400px;left:62%;top:230px;border-radius:999px;border:40px solid rgba(20,60,140,0.25);filter:blur(10px)}
.shot-night{background:#10213f}
.shot-night .shot-bg{background:radial-gradient(110% 80% at 15% 0%,#2f5fb8 0%,rgba(47,95,184,0) 60%),radial-gradient(80% 70% at 100% 100%,#1f4ea8 0%,rgba(31,78,168,0) 70%),linear-gradient(180deg,#14284d 0%,#0f1d38 100%)}
.phone{position:relative;margin-top:56px;width:min(300px,74%);padding:10px;border-radius:50px;background:#0b0b0c;box-shadow:0 40px 90px rgba(8,20,50,0.45)}
.phone img{width:100%;height:auto;border-radius:41px}
.phone-video{display:block;width:100%;height:auto;border-radius:41px;background:#f2f4f8}
.step{transition:opacity .35s ease}
.step .num{transition:box-shadow .35s ease,scale .35s ease}
.step.dim{opacity:.4}
.step.on .num{scale:1.08;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 0 0 6px rgba(37,99,235,.3)}
.phone-hero{margin-top:70px;width:min(330px,76%);padding:11px;border-radius:54px}
.phone-hero img{border-radius:44px}
.list{display:flex;flex-direction:column;gap:18px;padding:0;margin:0;list-style:none}
.list li{display:flex;gap:16px;align-items:flex-start}
.list .h3{font-size:18px}
.check{width:26px;height:26px;flex:0 0 26px;border-radius:999px;background:#1b2740;color:#8db4ff;display:flex;align-items:center;justify-content:center;margin-top:1px}
.num{width:40px;height:40px;flex:0 0 40px;border-radius:999px;background:#1565C0;color:#ffffff;font-weight:700;font-size:17px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px 0 rgba(255,255,255,0.25)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 16px;border-radius:999px;font-size:15px;font-weight:600}
.chip i{width:9px;height:9px;border-radius:999px;background:currentColor;display:block}
.chip-ok{background:#12301d;color:#7ee2a0}
.chip-warn{background:#3a2410;color:#ffb46b}
.chip-bad{background:#3a1515;color:#ff9a92}
.chip-none{background:#1f1f23;color:#a1a1aa}
.chip-none i{background:transparent;border:2px solid currentColor;width:10px;height:10px}
.callout{display:flex;gap:16px;align-items:center;padding:22px 24px;border-radius:22px;background:#bcd5ff;color:#0b1a3a}
.callout .ico{background:#ffffff;color:#1f55e0}
.callout b{display:block;font-size:21px;line-height:1.25;font-weight:700;letter-spacing:-0.01em;color:#0b1a3a}
.callout .txt span{display:block;margin-top:4px;font-size:15px;line-height:1.5;color:#233a6b}
.gd{display:inline-block;padding:0 .38em .1em;border-radius:999px;background:#bcd5ff;color:#1f55e0;line-height:1.15}
.trio{display:flex;justify-content:center;align-items:flex-start;width:100%}
.trio .phone{flex:0 0 auto}
.trio .phone-hero{position:relative;z-index:2;width:min(330px,52%)}
.trio .phone-side{position:relative;z-index:1;margin-top:150px;width:min(280px,42%);padding:9px;border-radius:46px}
.trio .phone-side img{border-radius:38px}
.trio .phone-side.l{margin-right:-11%;transform:rotate(-5deg)}
.trio .phone-side.r{margin-left:-11%;transform:rotate(5deg)}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.stat{padding:26px;border-radius:22px;background:#161618;border:1px solid #242427}
.stat b{display:block;font-size:clamp(48px,9vw,72px);line-height:1;font-weight:600;letter-spacing:-0.04em;color:#ffffff}
.stat span{display:block;margin-top:10px;font-size:15px;line-height:1.45;color:#a1a1aa}
.gallery{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 20px 8px;margin:0 -20px;scrollbar-width:none}
.gallery::-webkit-scrollbar{display:none}
.gallery figure{margin:0;flex:0 0 min(270px,74vw);scroll-snap-align:center;display:flex;flex-direction:column;gap:14px}
.gallery .shot{height:clamp(420px,120vw,520px)}
.gallery .phone{margin-top:40px;width:80%}
.gallery figcaption{font-size:15px;font-weight:600;color:#d4d4d8;text-align:center}
.tile{padding:24px;border-radius:22px;background:#161618;border:1px solid #242427;display:flex;flex-direction:column;gap:12px}
.tile .h3{font-size:18px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tile p{font-size:15px;line-height:1.55;color:#a1a1aa}
.plan{padding:32px;border-radius:22px;background:#161618;border:1px solid #242427;display:flex;flex-direction:column;gap:20px}
.plan-hot{background:#13203a;border:1px solid #3b6fd8;box-shadow:0 30px 80px rgba(59,124,246,0.18)}
.plan-name{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:22px;font-weight:600;color:#ffffff}
.price{display:flex;align-items:baseline;gap:8px}
.price b{font-size:44px;line-height:1;font-weight:600;letter-spacing:-0.035em;color:#ffffff}
.price span{font-size:16px;color:#a1a1aa}
.plan ul{display:flex;flex-direction:column;gap:12px;padding:0;margin:0;list-style:none}
.plan li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.45;color:#d4d4d8}
.plan li .check{width:22px;height:22px;flex-basis:22px}
.from{font-size:14px;font-weight:600;color:#8db4ff}
.faq{display:flex;flex-direction:column;gap:12px;max-width:860px;margin:0 auto;width:100%}
.faq details{border-radius:22px;background:#161618;border:1px solid #242427}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:18px 24px;font-size:18px;font-weight:600;color:#ffffff;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{flex:0 0 22px;color:#8db4ff;transition:transform .2s ease}
.faq details[open] summary svg{transform:rotate(180deg)}
.faq .ans{padding:0 24px 22px;font-size:16px;line-height:1.6;color:#a1a1aa}
.final{position:relative;overflow:hidden;border-radius:22px;border:1px solid #2a2a2e;padding:56px 24px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px;background:#13203a}
.final-bg{position:absolute;inset:0;background:radial-gradient(90% 120% at 50% 0%,#2f5fb8 0%,rgba(47,95,184,0) 65%),linear-gradient(180deg,#14284d 0%,#0f1d38 100%)}
.final > *{position:relative}
.final > .final-bg{position:absolute}
.appicon{width:84px;height:84px;border-radius:24px;transform:rotate(-7deg);box-shadow:0 14px 40px rgba(0,0,0,0.35)}
.more-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:16px;font-weight:600;color:#8db4ff}
.more-link:hover{color:#bcd5ff}
.trust{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 20px;font-size:14px;color:#a1a1aa}
.trust span{display:inline-flex;align-items:center;gap:6px}
.ph{display:inline-block;padding:1px 8px;border-radius:999px;background:#2a2412;color:#f5c96a;font-weight:600;font-size:13px}
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 24px}
.footer-links a,.footer-links button{display:inline-flex;align-items:center;min-height:44px;font-size:15px;font-weight:500;color:#a1a1aa;background:none;border:0;padding:0;cursor:pointer;font-family:inherit}
.footer-links a:hover,.footer-links button:hover{color:#ffffff}
.cookie{position:fixed;left:12px;right:12px;bottom:12px;z-index:50;max-width:560px;margin:0 auto;padding:22px;border-radius:22px;background:#1a1a1c;border:1px solid #262629;box-shadow:0 20px 50px rgba(0,0,0,0.5);display:flex;flex-direction:column;gap:14px}
.cookie b{font-size:18px;font-weight:600;color:#ffffff}
.cookie p{font-size:15px;line-height:1.55;color:#a1a1aa}
.cookie p a{color:#8db4ff;text-decoration:underline}
.cookie-btns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cookie-btns .btn{min-height:48px;font-size:16px}
@media (min-width:600px){
.grid-2,.grid-3,.grid-4,.grid-5{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:768px) and (max-width:1023px){
.grid-5{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:768px){
.wrap{padding:0 40px}
.sec{padding-top:140px}
.gallery{overflow:visible;justify-content:center;margin:0;padding:0}
.gallery figure{flex:1 1 0;max-width:340px}
.final{padding:80px 40px}
}
@media (min-width:1024px){
.nav-hide{display:inline-flex!important}
.split{grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:72px;align-items:start}
.split .shot{position:sticky;top:104px}
.split.rev{grid-template-columns:minmax(0,520px) minmax(0,1fr)}
.split.rev .shot{order:-1}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.gallery figure:nth-child(2){transform:translateY(-40px)}
.trio .phone-side.l{margin-right:40px}
.trio .phone-side.r{margin-left:40px}
}
/* Анимации */
@keyframes fade-up{from{opacity:0;translate:0 28px}to{opacity:1;translate:0 0}}
@keyframes pill-pop{0%{opacity:0;scale:.82}60%{opacity:1;scale:1.04}100%{opacity:1;scale:1}}
@keyframes rise{from{opacity:0;translate:0 90px}to{opacity:1;translate:0 0}}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 -10px}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,180,107,.55)}70%{box-shadow:0 0 0 8px rgba(255,180,107,0)}100%{box-shadow:0 0 0 0 rgba(255,180,107,0)}}
@keyframes reveal{from{opacity:0;translate:0 36px}to{opacity:1;translate:0 0}}
@media (prefers-reduced-motion:no-preference){
.a1{animation:fade-up .8s cubic-bezier(.2,.7,.2,1) .05s both}
.a2{animation:fade-up .8s cubic-bezier(.2,.7,.2,1) .2s both}
.a3{animation:fade-up .8s cubic-bezier(.2,.7,.2,1) .35s both}
.a4{animation:fade-up .8s cubic-bezier(.2,.7,.2,1) .5s both}
.pill-anim{animation:pill-pop .7s cubic-bezier(.2,.7,.2,1) .35s both}
.trio .phone-hero{animation:rise 1.1s cubic-bezier(.2,.7,.2,1) .45s both}
.trio .phone-side.l{animation:rise 1.1s cubic-bezier(.2,.7,.2,1) .65s both,float 7s ease-in-out 1.9s infinite}
.trio .phone-side.r{animation:rise 1.1s cubic-bezier(.2,.7,.2,1) .8s both,float 7s ease-in-out 2.6s infinite}
.chip-warn i{animation:pulse 2s ease-out infinite}
.card,.tile,.stat{transition:translate .25s ease,border-color .25s ease,background-color .25s ease}
.card:hover,.tile:hover,.stat:hover{translate:0 -4px;border-color:#33333a;background:#19191c}
.phone img{transition:scale .5s ease}
}
@supports (animation-timeline: view()){
@media (prefers-reduced-motion:no-preference){
.sec .head,.card,.tile,.stat,.split .shot,.callout,.chips,.list > li,.gallery figure,.faq details,.final,.more-link{animation:reveal linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
.grid-3 > :nth-child(2),.grid-5 > :nth-child(2),.grid-4 > :nth-child(2),.grid-2 > :nth-child(2),.stats > :nth-child(2),.gallery figure:nth-child(2),.list > li:nth-child(2){animation-range:entry 6% entry 51%}
.grid-3 > :nth-child(3),.grid-5 > :nth-child(3),.grid-4 > :nth-child(3),.gallery figure:nth-child(3),.list > li:nth-child(3){animation-range:entry 12% entry 57%}
.grid-5 > :nth-child(4),.grid-4 > :nth-child(4),.list > li:nth-child(4){animation-range:entry 18% entry 63%}
.grid-5 > :nth-child(5){animation-range:entry 24% entry 69%}
}
}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
}

/* ===== СВЕТЛА ТЕМА ===== */
body{background:#F3F6FB}
a{color:#0E2747}a:hover{color:#1565C0}
a:focus-visible,button:focus-visible,summary:focus-visible{outline-color:#1565C0}
.btn-primary,.btn-primary:hover{color:#FFFFFF}
.btn-lg{box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 28px rgba(21,101,192,.28)}
.btn-secondary{background:#FFFFFF;border-color:#DCE4EF;color:#0E2747}
.btn-secondary:hover{background:#F3F6FB;border-color:#C9D6E8;color:#0E2747}
.nav-link:hover{color:#1565C0!important}
.topnav{background:rgba(255,255,255,.86);border-color:#DCE4EF;box-shadow:0 10px 30px rgba(14,39,71,.10)}
.nav-a{color:#33435C}
.nav-a:hover{color:#0E2747;background:#EEF3FA}
.nav-a.on{color:#0E2747;background:#E3EDFA}
.eyebrow{color:#1565C0}
.h1,.h2,.h3{color:#0E2747}
.lead,.body,.tile p,.trust{color:#4A5A73}
.card,.tile,.stat,.faq details{background:#FFFFFF;border-color:#DCE4EF}
.card:hover,.tile:hover,.stat:hover{background:#FFFFFF;border-color:#B9CBE6;box-shadow:0 14px 30px rgba(14,39,71,.08)}
.ico,.check{background:#E3EDFA;color:#1565C0}
.chip-ok{background:#E2F2E6;color:#1E6B32}
.chip-warn{background:#FDEBD8;color:#9A4A00}
.chip-bad{background:#FBE2E0;color:#A8231B}
.chip-none{background:#E8EDF4;color:#4A5A73}
.stat b{color:#0E2747}
.stat span{color:#4A5A73}
.gallery figcaption{color:#33435C}
.faq summary{color:#0E2747}
.faq summary svg{color:#1565C0}
.faq .ans{color:#4A5A73}
.more-link{color:#1565C0}
.more-link:hover{color:#0F4C93}
.ph{background:#FFF1CC;color:#6B4200}
.footer-links a,.footer-links button{color:#4A5A73}
.footer-links a:hover,.footer-links button:hover{color:#0E2747}
.shot{border-color:#DCE4EF;box-shadow:0 30px 80px rgba(21,101,192,.14)}
.phone{box-shadow:0 30px 70px rgba(14,39,71,.28)}
.gallery .phone{box-shadow:0 24px 50px rgba(14,39,71,.30)}
.final .h2{color:#FFFFFF}
.final{border-color:#1B3A6B}
.cookie{background:#FFFFFF;border-color:#DCE4EF;box-shadow:0 20px 50px rgba(14,39,71,.18)}
.cookie b{color:#0E2747}
.cookie p{color:#4A5A73}
.cookie p a{color:#1565C0}

/* Логото навсякъде е кръгло */
img[src^="/assets/img/godrive-icon.webp"]{border-radius:100%!important}

.rating{font-weight:700;color:#0E2747}

/* Хедър: анимация при зареждане */
@keyframes nav-drop{from{opacity:0;translate:0 -28px;scale:.96}to{opacity:1;translate:0 0;scale:1}}
@keyframes nav-item{from{opacity:0;translate:0 -10px}to{opacity:1;translate:0 0}}
@media (prefers-reduced-motion:no-preference){
.topnav{animation:nav-drop .8s cubic-bezier(.2,.7,.2,1) both}
.topnav > *{animation:nav-item .55s cubic-bezier(.2,.7,.2,1) both}
.topnav > :nth-child(1){animation-delay:.2s}
.topnav > :nth-child(2){animation-delay:.28s}
.topnav > :nth-child(3){animation-delay:.34s}
.topnav > :nth-child(4){animation-delay:.4s}
.topnav > :nth-child(5){animation-delay:.46s}
.topnav > :nth-child(6){animation-delay:.52s}
.topnav > :nth-child(n+7){animation-delay:.6s}
}

/* Плъзгащо се балонче за активната секция в менюто */
.topnav{position:relative}
.topnav > a{position:relative;z-index:1}
.nav-a.on{background:transparent}
.nav-ind{position:absolute;top:6px;bottom:6px;z-index:0;border-radius:999px;background:#E3EDFA;opacity:0;pointer-events:none;transition:opacity .25s ease}
.nav-ind.show{opacity:1}
.nav-ind.slide{transition:left .45s cubic-bezier(.2,.7,.2,1),width .45s cubic-bezier(.2,.7,.2,1),opacity .25s ease}
.topnav > .nav-ind{animation:none}
@media (prefers-reduced-motion:reduce){.nav-ind.slide{transition:opacity .25s ease}}

/* Изтегляне от компютър: прозорец с QR код и двата магазина */
.dl{width:min(400px,calc(100% - 32px));padding:36px 28px 28px;border:1px solid #DCE4EF;border-radius:28px;background:#FFFFFF;color:#0E2747;box-shadow:0 30px 80px rgba(14,39,71,.25);text-align:center;font-family:'Onest',system-ui,-apple-system,sans-serif}
.dl[open]{display:flex;flex-direction:column;align-items:center;gap:14px}
.dl::backdrop{background:rgba(14,39,71,.45);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.dl .h3{font-size:24px}
.dl-sub{font-size:15px;line-height:1.55;color:#4A5A73;max-width:320px;text-wrap:balance}
.dl-qr{width:220px;height:220px;margin:6px 0 4px;padding:10px;border:1px solid #DCE4EF;border-radius:20px;background:#FFFFFF}
.dl-stores{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%}
.store{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:8px 14px;border-radius:16px;background:#0E2747;color:#FFFFFF;text-align:left;transition:filter .15s ease,transform .15s ease}
.store:hover{color:#FFFFFF;filter:brightness(1.25);transform:translateY(-1px)}
.store span{display:flex;flex-direction:column;font-size:16px;font-weight:600;line-height:1.15;white-space:nowrap}
.store small{font-size:11px;font-weight:500;opacity:.8}
.dl-x{position:absolute;top:12px;right:12px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:0;border-radius:999px;background:#EEF3FA;color:#33435C;cursor:pointer}
.dl-x:hover{background:#E3EDFA;color:#0E2747}
@media (prefers-reduced-motion:no-preference){
.dl[open]{animation:fade-up .35s cubic-bezier(.2,.7,.2,1) both}
}

/* ===== ТЕЛЕФОН: по-компактно ===== */
@media (max-width:767px){
/* По-малко празно място между заглавието на секцията и съдържанието, и над „Повече за…“ */
.stack{gap:32px}
.col{gap:28px}
.col > .more-link,.stack > .more-link{margin-top:-12px}
/* Иконата/цифрата и заглавието на един ред, текстът под тях */
.card:has(> .ico),.card:has(> .num),.tile:has(> .ico){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;row-gap:10px;align-items:center}
.card:has(> .ico) > .h3,.card:has(> .num) > .h3,.tile:has(> .ico) > .h3{margin-top:0!important}
.card:has(> .ico) > p,.card:has(> .num) > p,.tile:has(> .ico) > p{grid-column:1 / -1}
/* Галерия: целият телефон се вижда в картата, а сянката не се реже от хоризонталното превъртане */
.gallery{padding-bottom:48px;margin-bottom:-40px}
.gallery .shot{height:auto;padding-bottom:24px}
.gallery .phone{border-radius:36px;padding:8px}
.gallery .phone img{border-radius:29px}
/* Секциите със статистика и галерия („На пътя“ на началната, „Карта“ в /page/kameri): вляво като останалите */
.stack:has(> .gallery) > .head{align-items:flex-start;text-align:left}
.stack:has(> .gallery) > .more-link{align-self:flex-start!important}
}
/* „Екрани от приложението“: заобляне и рамка пропорционални на ширината на телефона
   (на компютър остават 54/44 px и 46/38 px, на телефон намаляват заедно с телефоните) */
.trio{container-type:inline-size}
.trio .phone-hero{padding:min(11px,1.7cqw);border-radius:min(54px,8.5cqw)}
.trio .phone-hero img{border-radius:min(44px,6.9cqw)}
.trio .phone-side{padding:min(9px,1.4cqw);border-radius:min(46px,6.9cqw)}
.trio .phone-side img{border-radius:min(38px,5.6cqw)}

/* ===== Еднакви разстояния във всички секции =====
   Заглавие на секцията → съдържание: 56px (компютър) / 32px (телефон) - и в секциите с телефон отстрани (.col).
   Под секцията: 140px / 96px до следващата - „Повече за…“ е висок 44px заради докосването, затова
   прибираме невидимия отстъп под текста му, когато е последен. */
.col > .head{margin-bottom:24px}
.col > .more-link:last-child,.stack > .more-link:last-child{margin-bottom:-12px}
@media (max-width:767px){
.col > .head{margin-bottom:4px}
}

/* Статистика над галерия на компютър: средният телефон е вдигнат с 40px - пазим 56px до него от статистиката */
@media (min-width:1024px){
.stack > .stats:has(+ .gallery){margin-bottom:40px!important} /* !important: вграденият style="margin: 0 auto" */
}

/* ===== Тематични страници (/page/...) ===== */
.p-topic .float-card{position:absolute;z-index:3;background:rgba(20,20,22,.88);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);border-radius:22px;box-shadow:0 20px 50px rgba(8,20,50,.35);color:#f4f4f5;text-align:left}
.p-topic .fc-note{display:none;align-items:flex-start;gap:12px;width:300px;padding:12px 14px}
.p-topic .fc-note img{width:40px;height:40px;border-radius:10px;flex:0 0 40px}
.p-topic .fc-gtp{display:flex;left:0;right:0;top:16px;margin:0 auto;width:min(320px,88%)}
.p-topic .fc-title{font-size:15px;font-weight:600;color:#ffffff}
.p-topic .fc-text{font-size:14px;line-height:1.4;color:#d4d4d8;margin-top:2px}
.p-topic .fc-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid rgba(255,255,255,.08);font-size:14px;color:#d4d4d8}
.p-topic .fc-st{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.p-topic .fc-st i{width:8px;height:8px;border-radius:999px;background:currentColor;display:block}
.p-topic .fc-ok{color:#7ee2a0}
.p-topic .fc-warn{color:#ffb46b}
.p-topic .status-list{display:flex;flex-direction:column;gap:12px;padding:0;margin:0;list-style:none}
.p-topic .status-list li{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.p-topic .status-list .chip{min-width:176px}
.p-topic .grid-track{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.p-topic .trk{padding:20px;border-radius:20px;background:#161618;border:1px solid #242427;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.p-topic .grid-track{grid-auto-rows:1fr}
.p-topic .trk .ico{width:40px;height:40px;flex:0 0 40px;border-radius:12px;margin-bottom:4px}
.p-topic .trk .tag-auto{margin-top:auto}
.p-topic .trk b{font-size:16px;line-height:1.3;font-weight:600;color:#ffffff}
.p-topic .trk .s{font-size:14px;line-height:1.45;color:#a1a1aa}
.p-topic .tag-auto{background:#12301d;color:#7ee2a0;margin-top:4px}
.p-topic .link-card{padding:26px;border-radius:22px;background:#161618;border:1px solid #242427;display:flex;flex-direction:column;gap:12px;color:#f4f4f5;transition:translate .25s ease,border-color .25s ease,background-color .25s ease}
.p-topic .link-card:hover{translate:0 -4px;border-color:#3b6fd8;background:#19191c;color:#f4f4f5}
.p-topic .link-card .h3{font-size:19px}
.p-topic .link-card p{font-size:15px;line-height:1.55;color:#a1a1aa;flex:1}
.p-topic .link-card .more-link{min-height:0}
@media (min-width:768px){.p-topic .grid-track{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1024px){.p-topic .grid-track{grid-template-columns:repeat(5,minmax(0,1fr))}.p-topic .fc-note{display:flex}.p-topic .fc-gtp{left:auto;right:6%;top:200px;margin:0;width:300px}.p-topic .fc-go{left:6%;top:170px}.p-topic .fc-vin{left:8%;top:360px}.p-topic .fc-kasko{right:8%;top:390px}}
@media (prefers-reduced-motion:no-preference){.p-topic .hero-rise{animation:rise 1.1s cubic-bezier(.2,.7,.2,1) .45s both}.p-topic .fc-gtp{animation:fade-up .9s cubic-bezier(.2,.7,.2,1) .9s both,float 7s ease-in-out 2s infinite}.p-topic .fc-go{animation:fade-up .9s cubic-bezier(.2,.7,.2,1) 1.1s both,float 8s ease-in-out 2.3s infinite}.p-topic .fc-vin{animation:fade-up .9s cubic-bezier(.2,.7,.2,1) 1.3s both,float 9s ease-in-out 2.6s infinite}.p-topic .fc-kasko{animation:fade-up .9s cubic-bezier(.2,.7,.2,1) 1.5s both,float 7.5s ease-in-out 2.9s infinite}}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){.p-topic .trk,.p-topic .link-card,.p-topic .status-list li{animation:reveal linear both;animation-timeline:view();animation-range:entry 0% entry 45%}.p-topic .link-card .more-link{animation:none}.p-topic .grid-track > :nth-child(5n+2),.p-topic .status-list li:nth-child(2){animation-range:entry 5% entry 50%}.p-topic .grid-track > :nth-child(5n+3),.p-topic .status-list li:nth-child(3){animation-range:entry 10% entry 55%}.p-topic .grid-track > :nth-child(5n+4),.p-topic .status-list li:nth-child(4){animation-range:entry 15% entry 60%}.p-topic .grid-track > :nth-child(5n+5){animation-range:entry 20% entry 65%}}}
.p-topic .hero-logo{display:inline-flex;margin-bottom:22px;border-radius:18px}
.p-topic .hero-logo img{width:72px;height:72px;border-radius:18px;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.p-topic .card,.p-topic .tile,.p-topic .stat,.p-topic .faq details,.p-topic .trk,.p-topic .link-card{background:#FFFFFF;border-color:#DCE4EF}
.p-topic .card:hover,.p-topic .tile:hover,.p-topic .stat:hover,.p-topic .link-card:hover{background:#FFFFFF;border-color:#B9CBE6;box-shadow:0 14px 30px rgba(14,39,71,.08)}
.p-topic .link-card{color:#0E2747}
.p-topic .link-card p{color:#4A5A73}
.p-topic .trk b{color:#0E2747}
.p-topic .trk .s{color:#4A5A73}
.p-topic .tag-auto{background:#E2F2E6;color:#1E6B32}
.p-topic .float-card{background:rgba(255,255,255,.92);border-color:rgba(14,39,71,.08);color:#0E2747;box-shadow:0 20px 50px rgba(14,39,71,.18)}
.p-topic .fc-title{color:#0E2747}
.p-topic .fc-text{color:#33435C}
.p-topic .hero-logo img{box-shadow:0 12px 30px rgba(14,39,71,.18)}
.p-topic .grid-track.c4{grid-template-columns:repeat(2,minmax(0,1fr))}
.p-topic .cat-chips{display:flex;flex-wrap:wrap;gap:10px}
.p-topic .cat-chips .chip{height:44px;padding:0 18px;font-size:16px}
.p-topic .disc-list{display:flex;flex-direction:column;gap:12px;padding:0;margin:0;list-style:none}
.p-topic .disc-list li{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.p-topic .disc-list .chip{min-width:96px;justify-content:center}
.p-topic .note-small{font-size:13px;line-height:1.5;color:#a1a1aa}
@media (min-width:768px){.p-topic .grid-track.c4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.p-topic .note-small{color:#4A5A73}

/* ===== Служебни страници (правни, контакти, линкове, грешки) ===== */
.svc-nav{justify-content:space-between;width:min(720px,calc(100vw - 24px))}
.p-svc .svc-main{width:100%;max-width:1200px;margin:0 auto;padding:0 20px;flex:1 0 auto}
.p-svc .svc-hero{display:flex;flex-direction:column;gap:14px;padding:64px 0 36px}
.p-svc .svc-hero.center{align-items:center;text-align:center;margin:0 auto}
.p-svc .svc-h1{font-size:clamp(34px,7vw,56px);line-height:1.08;font-weight:600;letter-spacing:-.035em;color:#ffffff;text-wrap:balance}
.p-svc .meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:#a1a1aa}
.p-svc .legal{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:start;padding-bottom:24px}
.p-svc .toc{display:none}
.p-svc .toc b{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#8db4ff;padding:4px 10px 10px}
.p-svc .toc a{display:block;font-size:14px;line-height:1.35;color:#a1a1aa;padding:8px 10px;border-radius:10px}
.p-svc .toc a:hover{color:#ffffff;background:#1f1f23}
.p-svc .doc{padding:4px 22px;border-radius:22px;background:#161618;border:1px solid #242427}
.p-svc .doc > section{padding:26px 0;border-top:1px solid #242427;scroll-margin-top:96px}
.p-svc .doc > section:first-child{border-top:0}
.p-svc .doc h2{margin:0 0 10px;font-size:20px;line-height:1.3;font-weight:600;letter-spacing:-.01em;color:#ffffff}
.p-svc .doc p,.p-svc .doc li{font-size:16px;line-height:1.7;color:#c4c4cc}
.p-svc .doc p + p{margin-top:10px}
.p-svc .doc ul,.p-svc .doc ol{margin:6px 0 0;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.p-svc .ph-block{display:block;padding:14px 16px;border-radius:14px;border:1.5px dashed #3a3a42;color:#8a8a93!important;font-size:15px!important}
.p-svc .info-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding-bottom:24px}
.p-svc .info-card{padding:26px;border-radius:22px;background:#161618;border:1px solid #242427;display:flex;flex-direction:column;gap:12px}
.p-svc .info-card .h3{font-size:19px}
.p-svc .info-grid a.info-card{transition:border-color .25s ease,translate .25s ease}
.p-svc .info-grid a.info-card:hover{border-color:#3b6fd8;translate:0 -3px}
.p-svc .info-card .body{font-size:16px}
.p-svc .big-link{font-size:clamp(18px,4.6vw,22px);font-weight:600;color:#8db4ff;word-break:break-word}
.p-svc .big-link:hover{color:#bcd5ff}
.p-svc .num-list{display:flex;flex-direction:column;gap:14px;padding:0;margin:4px 0 0;list-style:none}
.p-svc .num-list li{display:flex;gap:14px;align-items:flex-start;font-size:16px;line-height:1.55;color:#c4c4cc}
.p-svc .num-list .num{width:32px;height:32px;flex-basis:32px;font-size:15px}
.p-svc .dot-list{display:flex;flex-direction:column;gap:10px;padding:0;margin:4px 0 0;list-style:none}
.p-svc .dot-list li{display:flex;gap:12px;align-items:flex-start;font-size:16px;line-height:1.55;color:#c4c4cc}
.p-svc .dot-list .check{width:24px;height:24px;flex-basis:24px}
.p-svc .tag-rec{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:#12301d;color:#7ee2a0;font-size:12px;font-weight:700;align-self:flex-start}
.p-svc .company dl{display:grid;grid-template-columns:minmax(0,1fr);gap:4px 20px;margin:0}
.p-svc .company dt{font-size:13px;color:#a1a1aa}
.p-svc .company dd{margin:0 0 10px;font-size:16px;color:#f4f4f5}
.p-svc .state{min-height:620px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:18px;padding:56px 0 32px;max-width:620px;margin:0 auto}
.p-svc .state .lead{max-width:540px}
.p-svc .code{margin:0;font-size:clamp(76px,20vw,150px);line-height:1;font-weight:700;letter-spacing:-.05em}
.p-svc .code .pill{padding:0 .28em .06em}
.p-svc .state-ico{width:88px;height:88px;border-radius:28px;background:#1b2740;color:#8db4ff;display:flex;align-items:center;justify-content:center;transform:rotate(-6deg)}
.p-svc .state-ico.bad{background:#3a1515;color:#ff9a92}
.p-svc .state-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px}
.p-svc .state-btns .btn{min-height:56px;padding:16px 26px;font-size:17px}
.p-svc .mini-steps{width:100%;margin-top:18px;text-align:left}
.p-svc .mini-steps .h3{font-size:17px}
.p-svc .small{font-size:14px;line-height:1.55;color:#a1a1aa}
@media (min-width:768px){.p-svc .svc-main{padding:0 40px}.p-svc .svc-hero{padding:88px 0 44px}.p-svc .doc{padding:8px 40px}.p-svc .info-grid.c2{grid-template-columns:repeat(2,minmax(0,1fr))}.p-svc .info-grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}.p-svc .company dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.p-svc .legal{grid-template-columns:280px minmax(0,1fr);gap:48px}.p-svc .toc{display:flex;flex-direction:column;position:sticky;top:104px;padding:16px;border-radius:22px;background:#161618;border:1px solid #242427;max-height:calc(100vh - 140px);overflow:auto}}
.p-svc .svc-h1{color:#0E2747}
.p-svc .meta,.p-svc .small{color:#4A5A73}
.p-svc .toc,.p-svc .doc,.p-svc .info-card{background:#FFFFFF;border-color:#DCE4EF}
.p-svc .toc b{color:#1565C0}
.p-svc .toc a{color:#4A5A73}
.p-svc .toc a:hover{color:#0E2747;background:#EEF3FA}
.p-svc .doc > section{border-top-color:#E3EAF3}
.p-svc .doc h2{color:#0E2747}
.p-svc .doc p,.p-svc .doc li,.p-svc .num-list li,.p-svc .dot-list li{color:#33435C}
.p-svc .ph-block{border-color:#C9D6E8;color:#4A5A73!important}
.p-svc .big-link{color:#1565C0}
.p-svc .big-link:hover{color:#0F4C93}
.p-svc .tag-rec{background:#E2F2E6;color:#1E6B32}
.p-svc .company dt{color:#4A5A73}
.p-svc .company dd{color:#0E2747}
.p-svc .state-ico{background:#E3EDFA;color:#1565C0}
.p-svc .state-ico.bad{background:#FBE2E0;color:#A8231B}
.p-svc .state-ico.ok{background:#E2F2E6;color:#1E6B32}
/* Покана (/r/<код>): кодът на приятеля, голям, с „Копирай“ */
.p-svc .ref-code{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;max-width:420px;padding:22px 20px 20px;border-radius:22px;background:#FFFFFF;border:1.5px dashed #9DBBE3}
.p-svc .ref-label{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#4A5A73}
.p-svc .ref-value{font-size:clamp(38px,11vw,54px);line-height:1.05;font-weight:700;letter-spacing:.06em;color:#0E2747;-webkit-user-select:all;user-select:all;word-break:break-all}
.p-svc .ref-copy{min-height:44px;padding:10px 20px;font-size:16px}
.p-svc .ref-copy.ok{background:#E2F2E6;border-color:#BFE3C8;color:#1E6B32}

/* Служебни страници - нашите правила върху дизайна */
.p-svc .svc-nav .nav-logo{margin-right:0}
.p-svc .doc .doc-intro{padding:26px 0 0}
@media (max-width:767px){
/* Иконата и заглавието на един ред, останалото под тях (като картите на началната) */
.p-svc .info-card:has(> .ico){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;row-gap:12px;align-items:center}
.p-svc .info-card:has(> .ico) > :not(.ico):not(.h3){grid-column:1 / -1}
.p-svc .info-card:has(> .ico) > .h3{margin:0}
}

/* Контакти → „Данни за фирмата“ на компютър: колоната с етикетите е колкото най-дългия етикет (не 50/50),
   стойностите веднага след нея */
@media (min-width:768px){
.p-svc .company dl{grid-template-columns:max-content minmax(0,1fr);gap:12px 28px;align-items:baseline}
.p-svc .company dt,.p-svc .company dd{margin:0}
.p-svc .company dt{font-size:14px}
}

/* Тематични страници - нашите правила върху дизайна (хедърът е общият, без закачен бутон долу) */
@media (max-width:767px){
.p-topic .link-card:has(> .ico){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;row-gap:10px;align-items:center}
.p-topic .link-card:has(> .ico) > :not(.ico):not(.h3){grid-column:1 / -1}
.p-topic .link-card:has(> .ico) > .h3{margin:0}
}
/* Телефонът в първата снимка: заобляне и рамка пропорционални на ширината (като „Екрани от приложението“) */
.p-topic .shot{container-type:inline-size}
.p-topic .shot > .phone-hero{padding:min(11px,2.5cqw);border-radius:min(54px,12.4cqw)}
.p-topic .shot > .phone-hero img{border-radius:min(44px,10.1cqw)}
