/* =====================================================================
   VERZE 4 – zkouška v3 (méně efektů podle taste-skillu) + tmavé moduly
   uprostřed + pohyblivá podlaha z v2 + skutečné snímky aplikací.
   Načítá se až po styles.css a jen přepisuje.
   ===================================================================== */

/* ---------- 1) neonová záře jen na hlavních místech ---------- */
.glow { filter: none; }
.accent { color: var(--v-deep); }
.dark .accent { color: var(--v-hi); }
.btn-neon { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 8px 22px -12px rgba(106, 18, 238, .75); }
.btn-neon:hover { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 12px 28px -12px rgba(106, 18, 238, .9); }
.hero .hero-actions .btn-neon, .lead-form .btn-neon {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 0 0 1px rgba(255, 255, 255, .1),
              0 10px 30px -8px rgba(139, 44, 255, .9), 0 0 46px -10px rgba(139, 44, 255, .95);
}
.logo-mark { filter: none; }
.logo .cursor { box-shadow: none; }
.scroll-progress span { box-shadow: none; }
.pill.ok { box-shadow: none; }
.filters button[aria-pressed="true"] { box-shadow: none; }
.status.live { box-shadow: inset 0 0 0 1px rgba(181, 123, 255, .6); }
.status.demo::before, .status.pilot::before, .status.navrh::before { display: none; }
.steps-line i { box-shadow: none; }
.step.on .dot { box-shadow: 0 0 0 6px rgba(139, 44, 255, .12); }
.cta-mark { filter: none; }
.cl-ic { box-shadow: inset 0 0 0 1px rgba(181, 123, 255, .45); }
.lead-form { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 40px 100px -60px rgba(139, 44, 255, .45); }
.work:hover { box-shadow: 0 30px 60px -40px rgba(0, 0, 0, .7); }
.pillar.feat { box-shadow: 0 30px 70px -40px rgba(40, 10, 90, .45); }

/* ---------- 2) žádné dekorativní mřížky a tečky ---------- */
.hero-grid { display: none; }                 /* podlaha (.hero-floor) z v2 zůstává – Vojtovi se líbí */
.pv::before, .work-screen::before { display: none; }

/* ---------- 3) úvod: menší horní odsazení, nadpisy sekcí bez křiku ---------- */
.hero { padding-top: calc(var(--header-h) + clamp(24px, 3vw, 40px)); }
.sec-head h2 { font-size: clamp(34px, 4.4vw, 58px); }

/* ---------- 4) čtyři body zpět v úvodu (Vojta 9. 10.) – výraznější než ve v2 ---------- */
.hero-facts { margin-top: clamp(36px, 4.5vw, 64px); background: rgba(181, 123, 255, .16); box-shadow: inset 0 0 0 1px rgba(181, 123, 255, .22); }
.hero-facts li { padding: 22px 22px 24px; background: rgba(12, 9, 20, .86); }
.hero-facts .chev { color: var(--v-hi); }
.hero-facts b { font-size: 16px; }
.hero-facts span { color: var(--t-l2); }
.stage-ui { margin-bottom: 4px; }

/* ---------- 5) služby: nerovnoměrná mřížka (velká karta + dvě menší) ---------- */
.pillars.bento { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); grid-template-rows: auto auto; }
.pillar.big { grid-row: span 2; }
.pillar.big .pv { flex: 1 1 auto; height: auto; min-height: 360px; }
.pillar.big .pb { flex: none; }
.pillars.bento .pillar:not(.big) { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: stretch; padding: 12px; }
.pillars.bento .pillar:not(.big) .pv { height: auto; min-height: 230px; }
.pillars.bento .pillar:not(.big) .pb { padding: 22px 16px 16px 26px; }
.pillars.bento .pillar:not(.big) .pb h3 { margin-top: 0; }
.pillars.bento .pillar:not(.big) .pb ul { margin-bottom: 4px; }
.pillar.big .pb h3 { margin-top: 0; }

/* ---------- 6) moduly firemních systémů zůstávají tmavé (rytmus stránky), jen bez přebytečné záře ---------- */
.modules .chips span.hl { box-shadow: inset 0 0 0 1px rgba(181, 123, 255, .55); }
.modules .chips span:hover { box-shadow: inset 0 0 0 1px rgba(181, 123, 255, .6); }
.modules .checklist li::before { box-shadow: inset 0 0 0 1px rgba(181, 123, 255, .5); }

/* ---------- 6b) skutečné snímky aplikací v referencích ---------- */
.work-screen:has(.shot-phone:only-child), .work-screen:has(.shot-velin) { place-items: start center; }
.shot-phone {
  position: relative; z-index: 1; width: 38%; margin-top: 7%;
  padding: 7px; border-radius: 30px; background: #16121f;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .14), 0 30px 60px -20px rgba(0, 0, 0, .85);
  transition: transform .9s var(--ease-out);
}
.shot-phone img { display: block; width: 100%; height: auto; border-radius: 23px; }
.work:hover .shot-phone { transform: translateY(-4%); }
.shot-velin { position: relative; z-index: 1; width: 84%; margin-top: 8%; transition: transform .9s var(--ease-out); }
.work:hover .shot-velin { transform: translateY(-3%); }
.shot-desk { overflow: hidden; border-radius: 12px; background: #fff; box-shadow: 0 0 0 1px rgba(255, 255, 255, .12), 0 30px 60px -24px rgba(0, 0, 0, .8); }
.shot-desk img { display: block; width: 100%; height: auto; }
.shot-bar { display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 12px; background: #F5F2FC; border-bottom: 1px solid #ECE7F6; }
.shot-bar i { width: 7px; height: 7px; border-radius: 50%; background: #D9D2E8; }
.shot-bar i:first-child { background: var(--v-hi); }
.shot-bar span { margin-left: 8px; color: #6d6684; font: 600 11px/1 var(--sans); }
.shot-velin .shot-phone.small { position: absolute; right: -7%; top: 34%; width: 31%; margin: 0; padding: 6px; border-radius: 22px; }
.shot-velin .shot-phone.small img { border-radius: 17px; }

/* ---------- 7) proč my: bez karet, jen linky ---------- */
.why { gap: 0 44px; }
.why-item { padding: 26px 0 30px; border: 0; border-top: 1px solid var(--line-l2); border-radius: 0; background: none !important; box-shadow: none; }
.why-item:hover { transform: none; }
.why-item b { margin-top: 0; }

/* ---------- 8) postup: malé tečky místo čísel ---------- */
.step .dot { width: 16px; height: 16px; margin: 20px 0 0 20px; }
.steps-line { top: 27px; }

@media (max-width: 1160px) {
  .pillars.bento { grid-template-columns: 1fr; }
  .pillar.big { grid-row: auto; }
}
@media (max-width: 720px) {
  .pillars.bento .pillar:not(.big) { grid-template-columns: 1fr; }
  .pillars.bento .pillar:not(.big) .pb { padding: 22px 12px 14px; }
}

/* ---------- 9) automatická lupa na nižších noteboocích (skript v hlavičce nastaví zoom a --z) ---------- */
.hero { min-height: calc(100svh / var(--z, 1)); }
