/* ============================================================================
   ONDŘEJ DUŠEK — Portfolio (dark editorial)
   Component DNA + motion language borrowed from the Yugen teardown,
   reskinned to the brief: near-black + one disciplined violet accent,
   Clash Display / Urbanist, 8pt grid, sharp corners, lots of whitespace.
   ============================================================================ */

:root{
  /* ---- color (brief tokens) ---- */
  --bg:#0A0A0C;
  --surface:#101013;
  --surface-2:#16161A;
  --ink:#ECEAE6;
  --muted:#8C8C93;
  --ink-2:#CAC7C2;          /* sekundární text na dark (blog body) */
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.045);
  --accent:#7C5CFF;
  --accent-text:#9E84FF;
  --accent-dim:rgba(124,92,255,.14);
  --ok:#5BE39A;
  --no:#FF6B6B;

  /* ---- type ---- */
  --display:'Urbanist',system-ui,sans-serif;
  --body:'Urbanist',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,monospace;

  /* fluid display scale (clamp = premium scale, lots of range) */
  --fs-hero:clamp(2.75rem,7vw,6.25rem);
  --fs-statement:clamp(2.1rem,5vw,4.25rem);
  --fs-h2:clamp(1.9rem,3.6vw,3.25rem);
  --fs-h3:clamp(1.35rem,2vw,2rem);
  --fs-footer:clamp(3rem,12vw,11rem);
  --fs-eyebrow:.78rem;
  --fs-body:1.125rem;                              /* 18px — kanonický body (Yugen-consistent) */
  --fs-body-l:clamp(1.125rem,1.55vw,1.5rem);       /* 18–24px — leady */
  --fs-small:.875rem;

  /* ---- 8pt spacing ---- */
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s6:48px; --s8:64px; --s12:96px; --s16:128px; --s24:192px;

  /* ---- layout ---- */
  --maxw:1240px;
  --gutter:24px;
  --pad:max(24px,4vw);
  --radius:8px;          /* buttons · simple tags · small controls */
  --radius-lg:12px;      /* surfaces: navbar · cards · media · offer block · modal */
  --radius-xs:4px;       /* chips · tiny indicators */
  --radius-pill:999px;   /* pills: eyebrow & tag base · cursor labels */

  /* ---- motion (Yugen easing) ---- */
  --ease:cubic-bezier(.22,.6,.36,1);
  --ease2:cubic-bezier(.87,0,.13,1);
  --ease3:cubic-bezier(.21,1,.34,1);
  --dur:.9s;
}

/* ---------- reset ---------- */
*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
html.lenis,html.lenis body{height:auto;}
.lenis.lenis-smooth{scroll-behavior:auto !important;}
.lenis.lenis-stopped{overflow:hidden;}
::selection{background:var(--accent);color:#fff;}
::-webkit-scrollbar{width:0;height:0;}

body{
  background:var(--bg);color:var(--ink);
  font-family:var(--body);font-size:var(--fs-body);font-weight:400;line-height:1.55;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
img,video{display:block;max-width:100%;}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;}

/* film grain over everything (perfectly imperfect) */
body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.04;
  background-image:url('../img/noise.webp');
  background-size:260px;mix-blend-mode:overlay;
}

/* ---------- layout primitives ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad);}
.section{padding-block:clamp(64px,11vw,160px);position:relative;}
.section.tight{padding-block:clamp(48px,7vw,96px);}
.grid12{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gutter);}
.hairline{height:1px;background:var(--line);border:0;width:100%;}

/* ---------- type helpers ---------- */
.eyebrow{
  font-family:var(--body);font-size:var(--fs-eyebrow);font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--muted);
  display:inline-flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--accent);display:inline-block;}
.eyebrow.no-tick::before{display:none;}
.accent{color:var(--accent-text);}
.muted{color:var(--muted);}
h1,h2,h3,.display{font-family:var(--display);font-weight:600;line-height:.98;letter-spacing:-.02em;}
.h-hero{font-size:var(--fs-hero);font-weight:600;line-height:.96;letter-spacing:-.03em;}
.h-statement{font-size:var(--fs-statement);font-weight:500;line-height:1.02;letter-spacing:-.02em;}
.h2{font-size:var(--fs-h2);font-weight:600;}
.h3{font-size:var(--fs-h3);font-weight:600;line-height:1.1;}
.lead{font-size:var(--fs-body-l);color:#C9C7C2;line-height:1.5;font-weight:400;}
.small{font-size:var(--fs-small);}
.mono-num{font-family:var(--display);font-feature-settings:"tnum";}

/* ============================================================================
   NAV  (Yugen sticky pill → dark glass, the one allowed glass moment)
   ============================================================================ */
.nav{position:fixed;top:0;left:0;right:0;z-index:200;padding:14px var(--pad);
  transition:padding .5s var(--ease),background .5s var(--ease);}
.nav-inner{
  max-width:var(--maxw);margin-inline:auto;height:70px;            /* 4.375rem — Yugen nav-head */
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:10px 15px 10px 30px;                                     /* .625 / .9375 / .625 / 1.875rem */
  border:1px solid var(--line);border-radius:var(--radius-lg);     /* unified surface radius */
  background:rgba(16,16,19,.55);backdrop-filter:blur(14px) saturate(1.2);
  transition:background .4s var(--ease),border-color .4s var(--ease);
}
.nav.scrolled .nav-inner{background:rgba(12,12,15,.8);border-color:rgba(255,255,255,.13);}
.brand{display:flex;align-items:center;line-height:1;}
.brand b{font-family:var(--display);font-weight:600;font-size:1.25rem;letter-spacing:-.01em;color:var(--ink);white-space:nowrap;}
.nav-links{display:flex;gap:28px;align-items:center;}
.nav-links a{font-size:.92rem;color:#BFBDB8;position:relative;padding:4px 0;transition:color .3s var(--ease);}
.nav-links a:hover{color:var(--ink);}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;height:1px;width:100%;
  background:var(--accent);transform:scaleX(0);transform-origin:0 50%;transition:transform .5s var(--ease);}
.nav-links a:hover::after{transform:scaleX(1);}
.nav-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-left:7px;position:relative;vertical-align:1px;}
.nav-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--accent);animation:nav-pulse 1.8s var(--ease) infinite;}
@keyframes nav-pulse{0%{transform:scale(1);opacity:.55}100%{transform:scale(2.8);opacity:0}}
.nav-burger{display:none;width:30px;height:30px;flex-direction:column;justify-content:center;gap:5px;}
.nav-burger span{height:1.5px;background:var(--ink);width:20px;margin-left:auto;transition:.4s var(--ease);}
/* nav CTA seated like Yugen: 50px button fills the 50px content area, vertically
   centered with 10px breathing room, sitting 15px from the pill's right edge */
.nav-inner .btn.primary{height:50px;padding:0 16px 0 22px;gap:10px;border-radius:var(--radius);font-size:.95rem;flex:none;}
.nav-inner .btn.primary .chip{width:20px;height:20px;border-radius:var(--radius-xs);}
.nav-inner .btn.primary .chip svg{width:11px;height:11px;}
.nav-inner .btn.primary:hover{transform:none;background:#8E72FF;}

/* ============================================================================
   BUTTONS  (Yugen .btn arrow chip → dark + violet)
   ============================================================================ */
.btn{display:inline-flex;align-items:center;gap:12px;font-family:var(--body);
  font-weight:600;font-size:.95rem;letter-spacing:-.01em;
  padding:13px 18px 13px 22px;border-radius:var(--radius);
  border:1px solid transparent;line-height:1;white-space:nowrap;
  transition:transform .5s var(--ease),background .4s var(--ease),color .3s,border-color .3s;}
.btn .chip{width:26px;height:26px;border-radius:var(--radius-xs);display:grid;place-items:center;overflow:hidden;position:relative;}
.btn .chip svg{width:13px;height:13px;transition:transform .5s var(--ease);}
.btn:hover .chip svg{transform:translate(140%,-140%);}
.btn .chip svg.is-2{position:absolute;transform:translate(-140%,140%);}
.btn:hover .chip svg.is-2{transform:translate(0,0);}
.btn.primary{background:var(--accent);color:#fff;}
.btn.primary .chip{background:rgba(255,255,255,.16);}
.btn.primary:hover{background:#8E72FF;transform:translateY(-2px);}
.btn.ghost{border-color:var(--line);color:var(--ink);}
.btn.ghost .chip{background:var(--accent-dim);color:var(--accent-text);}
.btn.ghost:hover{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.03);}
.btn.lg{font-size:1.05rem;padding:17px 22px 17px 26px;}
.btn.lg .chip{width:32px;height:32px;}
.btn.lg .chip svg{width:15px;height:15px;}

/* ============================================================================
   HERO
   ============================================================================ */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;
  text-align:center;padding:clamp(150px,19vh,270px) var(--pad) 0;overflow:visible;}
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;}
.hero-bg video{width:100%;height:100%;object-fit:cover;filter:saturate(.7) brightness(.5);}
.hero-bg-fade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,12,.32) 0%,rgba(10,10,12,.42) 20%,rgba(10,10,12,.56) 38%,rgba(10,10,12,.72) 54%,rgba(10,10,12,.85) 68%,rgba(10,10,12,.94) 80%,rgba(10,10,12,.985) 90%,var(--bg) 99%);}
.hero-glow{position:absolute;z-index:1;width:80vw;height:80vw;max-width:1000px;max-height:1000px;
  top:-26%;right:-12%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(124,92,255,.34),transparent 60%);filter:blur(40px);opacity:.85;}
.hero-inner{position:relative;z-index:3;max-width:62rem;display:flex;flex-direction:column;align-items:center;}
.hero-eyebrow{font-family:var(--mono);font-size:.72rem;font-weight:400;letter-spacing:.22em;
  text-transform:uppercase;color:var(--muted);margin-bottom:24px;}
.hero .h-hero{margin-bottom:24px;max-width:17ch;}
.hero .h-hero .accent{font-style:italic;font-weight:500;}
.hero-sub{font-size:var(--fs-body-l);color:#C9C7C2;max-width:52ch;line-height:1.5;margin-bottom:32px;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-bottom:34px;}
.hero-trust{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:.92rem;}
.hero-trust .avatars{display:flex;}
.hero-trust .avatars img{width:34px;height:34px;border-radius:50%;border:2px solid var(--bg);
  object-fit:cover;margin-left:-10px;background:var(--surface-2);}
.hero-trust .avatars img:first-child{margin-left:0;}
.hero-values{position:absolute;left:var(--pad);bottom:36px;z-index:3;display:flex;align-items:center;gap:13px;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.hero-values i{width:3px;height:3px;border-radius:50%;background:var(--accent);display:inline-block;}
.scroll-hint{position:absolute;right:var(--pad);bottom:36px;z-index:3;font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px;}
.scroll-hint .ln{width:1px;height:30px;background:linear-gradient(var(--accent),transparent);display:block;}
/* VSL box: full grid width, straddles hero + the section below */
/* VSL block straddles the hero / trust-strip boundary (pulled up into hero) */
.vsl-block{position:relative;z-index:6;display:flex;justify-content:center;padding:0 var(--pad);
  margin-top:calc(-1 * clamp(150px,13vw,280px));margin-bottom:clamp(56px,7vw,100px);}
.vsl-straddle{position:relative;width:min(100% - 2*var(--pad), 1000px);max-width:none;aspect-ratio:16/9;
  border-radius:var(--radius-lg);overflow:hidden;border:1px solid rgba(255,255,255,.12);
  background:var(--surface);box-shadow:0 40px 120px rgba(0,0,0,.65);}
.vsl-straddle video{width:100%;height:100%;object-fit:cover;}
/* YouTube varianta VSL — wrapper drží 21:9 cover (16:9 ořízne nahoře/dole jako object-fit:cover), iframe ho vyplní 100% (přebije rozměry, co YT IFrame API nastaví). pointer-events:none → klik/parallax řeší straddle, přehrávač řídí JS přes API. */
.vsl-straddle .vsl-yt{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;aspect-ratio:16/9;pointer-events:none;}
.vsl-straddle .vsl-yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.vsl-straddle .vsl-vimeo{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;aspect-ratio:16/9;pointer-events:none;}
.vsl-straddle .vsl-vimeo iframe,.vsl-straddle .vsl-vimeo .vsl-vimeo-mount{position:absolute;inset:0;width:100%;height:100%;border:0;}
.vsl-badge{position:absolute;left:18px;bottom:18px;z-index:2;display:flex;align-items:center;gap:9px;
  font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:#fff;
  background:rgba(10,10,12,.5);backdrop-filter:blur(8px);border:1px solid var(--line);
  padding:8px 13px;border-radius:var(--radius-pill);}
.vsl-badge .play{width:20px;height:20px;border-radius:50%;background:var(--accent);display:grid;place-items:center;}
.vsl-badge .play svg{width:9px;height:9px;}

/* ============================================================================
   PROOF STRIP
   ============================================================================ */
.proof{border-block:1px solid var(--line);background:var(--surface);}
.proof .wrap{display:flex;align-items:center;gap:clamp(24px,5vw,72px);flex-wrap:wrap;
  padding-block:26px;justify-content:space-between;}
.proof-item{display:flex;align-items:center;gap:14px;}
.proof-item b{font-family:var(--display);font-weight:600;font-size:1.6rem;letter-spacing:-.02em;}
.proof-item span{font-size:.92rem;color:var(--muted);max-width:24ch;line-height:1.3;}
.avatars{display:flex;}
.avatars img{width:38px;height:38px;border-radius:50%;border:2px solid var(--bg);object-fit:cover;margin-left:-12px;
  background:var(--surface-2);}
.avatars img:first-child{margin-left:0;}

/* ============================================================================
   SECTION HEADER
   ============================================================================ */
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:clamp(40px,6vw,72px);}
.sec-head .eyebrow{margin-bottom:22px;}
.sec-head-r{padding-bottom:6px;}

/* ============================================================================
   REFRAME / PROBLEM
   ============================================================================ */
.reframe .h-statement{max-width:18ch;margin-bottom:36px;}
.reframe-body{max-width:54ch;}
.reframe-body p+p{margin-top:22px;}
.fomo{margin-top:40px;padding:24px 28px;border-left:2px solid var(--accent);background:var(--accent-dim);
  border-radius:0 var(--radius) var(--radius) 0;max-width:60ch;}
.fomo b{color:var(--accent-text);}

/* ============================================================================
   FIT  (two-column ✓ / ✕)
   ============================================================================ */
.fit-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.fit-card{border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(24px,3vw,40px);background:var(--surface);}
.fit-card.no{background:transparent;}
.fit-card h3{font-size:1.25rem;margin-bottom:24px;display:flex;align-items:center;gap:12px;font-family:var(--display);}
.fit-mark{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;}
.fit-card.yes .fit-mark{background:rgba(91,227,154,.14);color:var(--ok);}
.fit-card.no .fit-mark{background:rgba(255,107,107,.12);color:var(--no);}
.fit-list{display:flex;flex-direction:column;}
.fit-list li{list-style:none;display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--line-2);line-height:1.4;}
.fit-list li:first-child{border-top:0;}
.fit-list .ic{flex:none;margin-top:3px;}
.fit-card.yes .ic{color:var(--ok);}
.fit-card.no .ic{color:var(--no);}
.fit-card.no li{color:var(--muted);}

/* ============================================================================
   FOUNDER DNA — 3 phase cards (Yugen card: hairline, hover lift, violet stroke)
   ============================================================================ */
.dna-tagline{font-family:var(--display);font-weight:500;font-size:clamp(1.5rem,3vw,2.4rem);
  letter-spacing:-.02em;margin:8px 0 56px;}
.dna-tagline .accent{font-style:italic;}
.dna-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.dna-card{position:relative;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:clamp(24px,2.4vw,38px);background:var(--surface);overflow:hidden;
  transition:transform .55s var(--ease),border-color .45s var(--ease),background .45s var(--ease);}
.dna-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(120% 80% at 100% 0%,var(--accent-dim),transparent 60%);opacity:0;transition:opacity .5s var(--ease);}
.dna-card:hover{transform:translateY(-6px);border-color:rgba(124,92,255,.5);background:var(--surface-2);}
.dna-card:hover::before{opacity:1;}
.dna-idx{font-family:var(--display);font-weight:600;font-size:.95rem;color:var(--accent-text);letter-spacing:.04em;}
.dna-card h3{margin:clamp(60px,9vw,120px) 0 14px;font-size:1.4rem;font-family:var(--display);line-height:1.05;}
.dna-card p{color:var(--muted);line-height:1.5;}
.dna-card .sub{display:block;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;}

/* ============================================================================
   WORK / GLIMPSES  (Yugen project-block hover)
   ============================================================================ */
.glimpse-note{font-size:.92rem;color:var(--muted);margin-top:14px;}
.glimpse-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.glimpse{position:relative;border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;
  background:var(--surface);}
.glimpse-img{aspect-ratio:4/5;overflow:hidden;position:relative;}
.glimpse-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(10,10,12,.85));}
.glimpse-img img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.05) brightness(.7);
  transition:transform .8s var(--ease),filter .6s var(--ease);}
.glimpse:hover .glimpse-img img{transform:scale(1.05);filter:grayscale(.55) brightness(.8);}
/* violet duotone tint overlay */
.glimpse-img .tint{position:absolute;inset:0;background:var(--accent);mix-blend-mode:color;opacity:.32;
  transition:opacity .6s var(--ease);z-index:1;}
.glimpse:hover .glimpse-img .tint{opacity:.16;}
.glimpse-meta{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:22px;}
.glimpse-meta .tags{display:flex;gap:8px;margin-bottom:10px;}
.glimpse h3{font-size:1.3rem;font-family:var(--display);font-weight:600;}
.glimpse .role{font-size:.85rem;color:var(--muted);margin-top:4px;}
.tag{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-text);
  border:1px solid var(--line);border-radius:var(--radius-pill);padding:5px 10px;background:rgba(124,92,255,.08);}

/* ============================================================================
   ENGAGEMENT  (Yugen signature engagements / slide cards)
   ============================================================================ */
.eng-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:stretch;}
.eng-card{border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(28px,3vw,48px);
  background:var(--surface);display:flex;flex-direction:column;position:relative;overflow:hidden;
  transition:border-color .45s var(--ease);}
.eng-card.main{background:
  radial-gradient(130% 100% at 0% 0%,rgba(124,92,255,.16),transparent 55%),var(--surface-2);}
.eng-card:hover{border-color:rgba(124,92,255,.45);}
.eng-card .label{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-text);margin-bottom:20px;display:flex;gap:10px;align-items:center;}
.eng-card h3{font-size:clamp(1.6rem,2.4vw,2.3rem);font-family:var(--display);font-weight:600;line-height:1;margin-bottom:14px;}
.eng-card .desc{color:#C9C7C2;max-width:42ch;}
.eng-tags{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0;}
.eng-meta{margin-top:auto;padding-top:24px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:flex-end;gap:16px;}
.eng-price{font-family:var(--display);font-weight:600;font-size:1.5rem;letter-spacing:-.01em;}
.eng-price small{display:block;font-family:var(--body);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:4px;}
.eng-card.alt{justify-content:space-between;}
.eng-detail{font-size:.9rem;color:var(--muted);line-height:1.5;}
.eng-cta-row{display:flex;justify-content:center;margin-top:48px;}

/* ============================================================================
   IMPACT  (big numbers + hairlines)
   ============================================================================ */
.impact-grid{display:grid;grid-template-columns:repeat(4,1fr);}
.impact-cell{padding:clamp(28px,3vw,44px) 24px;border-left:1px solid var(--line);}
.impact-cell:first-child{border-left:0;padding-left:0;}
.impact-num{font-family:var(--display);font-weight:600;font-size:clamp(3rem,6vw,5.5rem);
  line-height:.9;letter-spacing:-.03em;margin-bottom:14px;}
.impact-num .accent{color:var(--accent-text);}
.impact-cell p{color:var(--muted);font-size:.95rem;line-height:1.4;max-width:22ch;}

/* ============================================================================
   FAQ  (accordion rows, + rotate)
   ============================================================================ */
.faq-list{border-top:1px solid var(--line);}
.faq{border-bottom:1px solid var(--line);}
.faq-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:28px 0;text-align:left;transition:color .3s var(--ease);}
.faq-q h3{font-size:clamp(1.15rem,1.8vw,1.6rem);font-family:var(--display);font-weight:500;line-height:1.15;}
.faq:hover .faq-q h3{color:var(--accent-text);}
.faq-plus{flex:none;width:34px;height:34px;border:1px solid var(--line);border-radius:50%;position:relative;
  transition:transform .5s var(--ease),border-color .4s,background .4s;}
.faq:hover .faq-plus{border-color:var(--accent);background:var(--accent-dim);}
.faq-plus::before,.faq-plus::after{content:"";position:absolute;background:var(--ink);transition:transform .4s var(--ease);}
.faq-plus::before{left:50%;top:9px;bottom:9px;width:1.5px;transform:translateX(-50%);}
.faq-plus::after{top:50%;left:9px;right:9px;height:1.5px;transform:translateY(-50%);}
.faq.open .faq-plus{transform:rotate(135deg);border-color:var(--accent);}
.faq-a{overflow:hidden;height:0;transition:height .5s var(--ease);}
.faq-a-inner{padding:0 60px 30px 0;color:var(--muted);max-width:70ch;line-height:1.6;}

/* ============================================================================
   MARQUEE
   ============================================================================ */
.marquee{border-block:1px solid var(--line);padding-block:26px;overflow:hidden;background:var(--surface);}
.marquee-track{display:flex;width:max-content;animation:marquee 38s linear infinite;}
.marquee-track:hover{animation-play-state:paused;}
.marquee-group{display:flex;align-items:center;gap:40px;padding-right:40px;}
.marquee-item{font-family:var(--display);font-weight:600;font-size:clamp(1.4rem,3vw,2.4rem);
  letter-spacing:-.01em;color:var(--ink);white-space:nowrap;}
.marquee-star{color:var(--accent-text);font-size:1.2em;}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ============================================================================
   FOOTER / FINAL CTA  (transition into giant bold typography)
   ============================================================================ */
.footer{position:relative;padding-top:clamp(64px,10vw,140px);padding-bottom:48px;overflow:hidden;}
.footer-glow{position:absolute;left:50%;top:30%;transform:translateX(-50%);width:120vw;height:60vw;
  background:radial-gradient(ellipse at 50% 0%,rgba(124,92,255,.22),transparent 60%);pointer-events:none;z-index:0;}
.footer .wrap{position:relative;z-index:2;}
.footer-eyebrow{text-align:center;margin-bottom:30px;justify-content:center;}
.footer-cta{display:block;text-align:center;font-family:var(--display);font-weight:600;
  font-size:var(--fs-footer);line-height:.9;letter-spacing:-.04em;
  transition:color .4s var(--ease);}
.footer-cta:hover{color:var(--accent-text);}
.footer-cta .arrow{display:inline-block;transition:transform .5s var(--ease);}
.footer-cta:hover .arrow{transform:translate(.1em,-.05em) rotate(0deg);}
.footer-sub{text-align:center;color:var(--muted);max-width:42ch;margin:32px auto 0;font-size:var(--fs-body-l);}
.footer-meta{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  margin-top:clamp(56px,8vw,110px);padding-top:32px;border-top:1px solid var(--line);}
.footer-meta a:hover{color:var(--accent-text);}
.footer-socials{display:flex;gap:24px;font-size:.92rem;}
.footer-socials .live{display:flex;align-items:center;gap:9px;color:var(--ink);}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);position:relative;}
.dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--ok);animation:pulse 1.8s var(--ease) infinite;}
@keyframes pulse{0%{transform:scale(1);opacity:.6}100%{transform:scale(2.6);opacity:0}}
.footer-note{margin-top:40px;text-align:center;font-size:.9rem;color:var(--muted);}
.footer-note .accent{color:var(--accent-text);}

/* ============================================================================
   MOTION — reveal gate (Yugen .ready system, scroll-triggered)
   ============================================================================ */
[data-anim]{opacity:0;transform:translate3d(0,18px,0);
  transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);will-change:opacity,transform;}
[data-anim].is-in{opacity:1;transform:none;}
[data-anim="scale"]{transform:scale(.94);}
[data-anim="clip"]{clip-path:inset(0 0 100% 0);transform:none;transition:clip-path 1s var(--ease),opacity 1s var(--ease);}
[data-anim="clip"].is-in{clip-path:inset(0 0 0 0);}
[data-d="1"]{transition-delay:.08s}[data-d="2"]{transition-delay:.16s}[data-d="3"]{transition-delay:.24s}
[data-d="4"]{transition-delay:.32s}[data-d="5"]{transition-delay:.40s}[data-d="6"]{transition-delay:.48s}

/* custom cursor */
.cursor{position:fixed;top:0;left:0;width:8px;height:8px;border-radius:50%;background:var(--accent);
  pointer-events:none;z-index:10000;transform:translate(-50%,-50%);
  display:grid;place-items:center;overflow:hidden;color:transparent;
  font-family:var(--body);font-weight:600;font-size:.8rem;letter-spacing:-.01em;white-space:nowrap;
  transition:width .3s var(--ease),height .3s var(--ease),padding .3s var(--ease),border-radius .3s var(--ease),background .3s;mix-blend-mode:difference;}
.cursor.big{width:46px;height:46px;background:rgba(158,132,255,.25);}
.cursor.label{width:auto;height:auto;padding:11px 18px;border-radius:var(--radius-pill);background:var(--accent);color:#fff;mix-blend-mode:normal;}
@media (hover:none){.cursor{display:none;}}

/* (loader removed — content paints immediately) */

/* ============================================================================
   RESPONSIVE
   ============================================================================ */
@media (max-width:991px){
  .hero-grid{grid-template-columns:1fr;gap:40px;}
  .showreel{max-width:340px;}
  .dna-grid{grid-template-columns:1fr;}
  .impact-grid{grid-template-columns:repeat(2,1fr);}
  .impact-cell:nth-child(3){border-left:0;padding-left:0;}
  .eng-grid{grid-template-columns:1fr;}
  .sec-head{grid-template-columns:1fr;gap:18px;}
}
@media (max-width:767px){
  .nav-links{display:none;}
  .nav-burger{display:flex;}
  .nav-inner{height:54px;}
  .proof .wrap{flex-direction:column;align-items:flex-start;gap:20px;}
  .glimpse-grid{grid-template-columns:1fr;}
  .fit-cols{grid-template-columns:1fr;}
  .impact-grid{grid-template-columns:1fr 1fr;}
  .footer-meta{flex-direction:column;align-items:flex-start;}
  body::after{background-size:180px;}
}
@media (max-width:479px){
  .impact-grid{grid-template-columns:1fr;}
  .impact-cell{border-left:0;padding-left:0;border-top:1px solid var(--line);}
  .impact-cell:first-child{border-top:0;}
}


/* ====================== ONE-SHOT ITERATION ADDITIONS ====================== */

/* nav dot -> before the label */
.nav-dot{margin-left:0;margin-right:8px;}

/* hero values -> glassmorphic pill */
.hero-values{background:rgba(255,255,255,.06);backdrop-filter:blur(14px) saturate(1.3);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);border:1px solid rgba(255,255,255,.13);
  border-radius:var(--radius-pill);padding:11px 18px;}

/* trust strip refinement */
.proof .wrap{justify-content:center;gap:clamp(32px,6vw,90px);}

/* thinner marquee strip (Yugen-thin) */
.marquee{padding-block:13px;}
.marquee-item{font-size:clamp(.95rem,1.6vw,1.3rem);}
.marquee-star{font-size:1em;}

/* ---------------- LIGHT CONTRAST SECTIONS ---------------- */
.light{background:#F4F1EC;color:#16161A;}
.light .h2,.light .h-statement,.light .h3,.light h1,.light h2,.light h3{color:#16161A;}
.light .eyebrow{color:#5b5b62;}
.light .lead{color:#3f3f47;}
.light .muted{color:#6b6b72;}
.light .accent{color:#5b3edb;}
.light .tag{border-color:rgba(0,0,0,.16);color:#555;background:transparent;}
/* FIT on light */
.light .fit-card{background:#fff;border-color:rgba(0,0,0,.08);}
.light .fit-card.no{background:transparent;}
.light .fit-card h3{color:#16161A;}
.light .fit-list li{border-color:rgba(0,0,0,.07);color:#1f1f24;}
.light .fit-card.no li{color:#6b6b72;}
/* engagement on light */
.light .eng-card{background:#fff;border-color:rgba(0,0,0,.08);}
.light .eng-card.main{background:radial-gradient(130% 100% at 0% 0%,rgba(124,92,255,.10),transparent 55%),#fff;}
.light .eng-card h3{color:#16161A;}
.light .eng-card .desc{color:#3f3f47;}
.light .eng-card .label{color:#5b3edb;}
.light .eng-price{color:#16161A;}
.light .eng-price small{color:#6b6b72;}
.light .eng-meta{border-color:rgba(0,0,0,.08);}
.light .eng-detail{color:#6b6b72;}

/* ---------------- FEATURED WORK: impact-led ---------------- */
.glimpse-impact{font-family:var(--display);font-weight:600;font-size:1.9rem;line-height:1;color:#fff;margin:4px 0 0;}
.glimpse-divider{height:1px;background:rgba(255,255,255,.20);margin:12px 0;width:100%;}
.glimpse-name{font-size:.92rem;color:#D6D3CE;line-height:1.35;}

/* ---------------- FAQ: numbered square boxes + rotating arrow ---------------- */
.faq-q{gap:18px;}
.faq-num{font-family:var(--mono);font-size:.78rem;color:var(--muted);border:1px solid var(--line);
  border-radius:5px;width:36px;height:36px;display:grid;place-items:center;flex:none;}
.faq-q h3{flex:1;}
.faq-arrow{flex:none;width:24px;height:24px;display:grid;place-items:center;color:var(--ink);
  transition:transform .5s var(--ease);}
.faq-arrow svg{width:16px;height:16px;}
.faq.open .faq-arrow{transform:rotate(180deg);}
.light .faq-num{border-color:rgba(0,0,0,.16);color:#6b6b72;}
.light .faq-arrow{color:#16161A;}
.light .faq-list,.light .faq{border-color:rgba(0,0,0,.12);}
.light .faq-q h3{color:#16161A;}
.light .faq:hover .faq-q h3{color:#5b3edb;}
.light .faq-a-inner{color:#5b5b62;}

/* ---------------- IMPACT: full bleed ---------------- */
.impact-fullbleed{width:100%;padding-inline:var(--pad);}
.impact-num{font-size:clamp(3.5rem,8vw,8rem);}
.impact-cell{padding:clamp(28px,3vw,52px) clamp(16px,2vw,40px);}

/* ---------------- PEOPLE & PLANET carousel (skeleton, zoom-out) ---------------- */
.pp-section{overflow:hidden;background:#0c0c0e;}
.pp-carousel{display:flex;gap:24px;padding:clamp(36px,5vw,64px) var(--pad) 0;overflow-x:auto;
  scroll-snap-type:x mandatory;scrollbar-width:none;}
.pp-carousel::-webkit-scrollbar{display:none;}
.pp-card{flex:0 0 clamp(260px,27vw,420px);scroll-snap-align:center;background:var(--surface-2);
  border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;
  transition:transform .5s var(--ease),opacity .5s var(--ease);opacity:.5;transform:scale(.9);}
.pp-card.is-active{opacity:1;transform:scale(1);}
.pp-media{aspect-ratio:4/5;background:linear-gradient(135deg,#1d1d24,#101013);position:relative;}
.pp-media::after{content:"▶";position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.25);font-size:1.4rem;}
.pp-body{padding:22px;}
.pp-amount{font-family:var(--display);font-weight:600;font-size:1.6rem;color:var(--accent-text);margin-bottom:10px;}
.pp-quote{color:#C9C7C2;margin-bottom:14px;line-height:1.4;}
.pp-name{font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}

/* ---------------- CLIENT WINS (skeleton) ---------------- */
.cw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.cw-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:clamp(24px,2.4vw,36px);display:flex;flex-direction:column;min-height:260px;}
.cw-amount{font-family:var(--display);font-weight:600;font-size:2rem;color:var(--accent-text);}
.cw-quote{color:#C9C7C2;line-height:1.5;margin:18px 0 24px;}
.cw-person{display:flex;align-items:center;gap:12px;margin-top:auto;}
.cw-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#2a2a32,#16161a);flex:none;}
.cw-name{font-size:.92rem;color:var(--ink);}
.cw-card.is-video{padding:0;position:relative;overflow:hidden;min-height:300px;}
.cw-video{position:absolute;inset:0;background:linear-gradient(135deg,#1d1d24,#0c0c0e);}
.cw-video::after{content:"▶";position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.3);font-size:1.6rem;}
.cw-amount.on-media{position:absolute;left:22px;bottom:22px;z-index:2;}

/* ---------------- FOOTER: full-bleed, stone, wordmark, columns ---------------- */
.footer{overflow:hidden;}
.footer-stone{position:absolute;inset:0;z-index:0;pointer-events:none;}
.footer-stone img{width:100%;height:100%;object-fit:cover;opacity:.16;filter:grayscale(.35) brightness(.65);}
.footer-wordmark{font-family:var(--display);font-weight:600;font-size:clamp(2.6rem,7vw,6rem);
  letter-spacing:-.03em;text-align:center;margin-top:clamp(48px,7vw,90px);color:var(--ink);opacity:.94;}
.footer-cols{display:flex;justify-content:center;gap:clamp(40px,8vw,120px);flex-wrap:wrap;
  margin-top:clamp(40px,6vw,80px);padding-top:32px;border-top:1px solid var(--line);}
.footer-col{display:flex;flex-direction:column;gap:11px;}
.footer-col-title{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:5px;}
.footer-col a,.footer-col .live{color:#BFBDB8;font-size:.95rem;transition:color .3s var(--ease);display:inline-flex;align-items:center;gap:8px;}
.footer-col a:hover{color:var(--accent-text);}

/* ---------------- BOOK MODAL (Calendly overlay) ---------------- */
.book-modal{position:fixed;inset:0;z-index:11000;display:grid;place-items:center;padding:24px;
  opacity:0;pointer-events:none;transition:opacity .4s var(--ease);}
.book-modal.open{opacity:1;pointer-events:auto;}
.book-modal-bg{position:absolute;inset:0;background:rgba(6,6,8,.72);backdrop-filter:blur(6px);}
.book-modal-panel{position:relative;z-index:2;width:min(720px,100%);background:var(--surface-2);
  border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;transform:translateY(22px);
  transition:transform .55s var(--ease3);box-shadow:0 40px 120px rgba(0,0,0,.6);}
.book-modal.open .book-modal-panel{transform:none;}
.book-modal-x{position:absolute;top:14px;right:16px;z-index:3;width:34px;height:34px;border-radius:50%;
  border:1px solid var(--line);color:var(--ink);font-size:1.2rem;line-height:1;}
.book-modal-head{padding:32px 32px 22px;}
.book-badge{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent-text);border:1px solid var(--line);border-radius:var(--radius-pill);padding:6px 12px;margin-bottom:16px;}
.book-modal-head h3{font-family:var(--display);font-size:1.6rem;margin-bottom:8px;}
.book-modal-head p{color:var(--muted);}
.book-embed{height:420px;background:#0c0c0e;border-top:1px solid var(--line);display:grid;place-items:center;}
.book-embed-ph{font-family:var(--mono);font-size:.85rem;color:var(--muted);text-align:center;line-height:1.7;}
.book-embed iframe{width:100%;height:100%;border:0;}

/* ---------------- responsive ---------------- */
@media (max-width:991px){
  .cw-grid{grid-template-columns:1fr;}
  .impact-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:767px){
  .footer-cols{gap:32px;}
  .pp-card{flex-basis:78vw;}
}

/* ====== SCALE-UP + WIDER FULL-BLEED (match Yugen proportions, ~12% bigger) ====== */
:root{
  --maxw:1440px;                                   /* wider container          */
  --fs-hero:clamp(3rem,7.6vw,7rem);
  --fs-statement:clamp(2.35rem,5.4vw,4.9rem);
  --fs-h2:clamp(2.1rem,4vw,3.7rem);
  --fs-h3:clamp(1.5rem,2.2vw,2.25rem);
  --fs-body-l:clamp(1.125rem,1.55vw,1.5rem);
}
/* bigger navbar */
.nav-inner{height:80px;padding:11px 17px 11px 34px;}
.brand b{font-size:1.42rem;}
.nav-links{gap:34px;}
.nav-links a{font-size:1.02rem;}
.nav-inner .btn.primary{height:56px;font-size:1rem;padding:0 18px 0 26px;}
.nav-inner .btn.primary .chip{width:22px;height:22px;}
/* a touch more room per section */
.section{padding-block:clamp(72px,12vw,180px);}
/* hero a bit taller breathing + bigger sub */
.hero-sub{max-width:54ch;}

/* hero values -> individual frosted-glass tags (like the Yugen tag pills) */
.hero-values{background:transparent !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;border:0 !important;padding:0 !important;border-radius:0 !important;gap:10px;}
.hero-values span{display:inline-block;background:rgba(16,16,20,.42);backdrop-filter:blur(13px) saturate(1.3);-webkit-backdrop-filter:blur(13px) saturate(1.3);border:1px solid rgba(255,255,255,.14);border-radius:6px;padding:10px 14px;color:var(--ink);line-height:1;}
.hero-values i{display:none !important;}

/* hero values = EXACT Yugen .tag style copied 1:1 (size + glass) */
.hero-values{gap:.63rem;}
.hero-values span{
  background-color:rgba(0,0,0,.30);
  -webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);
  color:#fff;text-transform:uppercase;
  border:0;border-radius:.25rem;padding:.62rem;
  font-family:var(--mono);font-size:.875rem;font-weight:400;line-height:1.1;letter-spacing:normal;
}

/* ============ ITERATION: glass/dot/eyebrow/FAQ/VSL/footer ============ */

/* hero values -> LIGHT frosted glass (visible on dark video) */
.hero-values span{
  background-color:rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);
  border:1px solid rgba(255,255,255,.28);color:#fff;
}

/* eyebrow bigger + more prominent */
.hero-eyebrow{font-size:.82rem;font-weight:500;color:#D8D5D0;letter-spacing:.24em;}

/* nav dot -> premium pulse + glow */
.nav-dot{width:7px;height:7px;background:#8E72FF;box-shadow:0 0 10px rgba(124,92,255,.9);}
.nav-dot::after{background:#8E72FF;animation:nav-pulse 1.5s var(--ease) infinite;}
@keyframes nav-pulse{0%{transform:scale(1);opacity:.85}70%{opacity:0}100%{transform:scale(3.5);opacity:0}}

/* VSL straddle: pull up less + raise values so they never overlap */
.vsl-block{margin-top:calc(-1 * clamp(100px,11vw,220px));}
.hero-values{bottom:clamp(120px,12vw,248px);}

/* FAQ: wider full-bleed + FILLED accent number boxes (readable) */
#faq .wrap{max-width:1640px;}
.faq-num,.light .faq-num{background:var(--accent);color:#fff;border:0;font-weight:600;}

/* FOOTER: badge eyebrow, more visible stone, bottom bar */
.footer-eyebrow{display:flex;align-items:center;gap:9px;width:fit-content;margin:0 auto clamp(24px,3vw,40px);
  border:1px solid var(--line);border-radius:var(--radius-pill);padding:9px 16px;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.footer-eyebrow .dot{width:7px;height:7px;}
.footer-stone img{opacity:.22;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  margin-top:clamp(40px,5vw,70px);padding-top:24px;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted);}
.footer-bottom .live{display:inline-flex;align-items:center;gap:8px;}
.footer-bottom a:hover{color:var(--accent-text);}

/* ============ GRID + TYPE SCALE matched to Yugen (full-bleed, ~47px h2) ============ */
:root{
  --maxw:1880px;                    /* původní (Yugen wide container) — nabídka byla stavěná na tuhle šířku */
  --pad:max(20px,2.5vw);            /* Yugen padding-global = 2.5vw           */
  --fs-hero:clamp(2.8rem,5vw,8rem);   /* small desktop smaller (~76px @1512) · large desktop bigger/full-bleed (~128px @2560) */
  --fs-statement:clamp(2.1rem,3.8vw,3.7rem);
  --fs-h2:clamp(1.85rem,3.2vw,3.3rem);   /* ~48–53px (was 59px cap)           */
  --fs-h3:clamp(1.4rem,2vw,2rem);
}
.h2{line-height:1.15;letter-spacing:-.02em;}
.h-statement{line-height:1.1;}
.h-hero{line-height:.97;}

/* hero values -> centered below VSL, darker settled glass */
.hero-values{position:static;left:auto;bottom:auto;right:auto;justify-content:center;
  margin:clamp(26px,3vw,46px) auto 0;}
.hero-values span{background-color:rgba(8,8,10,.55);border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);backdrop-filter:blur(16px) saturate(1.2);color:#E6E3DE;}

/* PROOF STRIP -> Yugen impact-style row (big numbers + ash labels + dividers) */
.proof .wrap{justify-content:flex-start;gap:0;padding-block:0;}
.proof-item{flex:1;flex-direction:column;align-items:flex-start;gap:14px;
  padding:clamp(28px,3vw,46px) clamp(20px,2.5vw,48px);border-left:1px solid var(--line);}
.proof-item:first-child{border-left:0;padding-left:0;}
.proof-item b{font-family:var(--display);font-weight:600;font-size:clamp(2.4rem,4.3vw,4rem);line-height:1;letter-spacing:-.02em;}
.proof-item span{font-size:.96rem;color:var(--muted);max-width:24ch;line-height:1.35;}

/* nav: more translucent ideal glassmorphism on scroll */
.nav.scrolled .nav-inner{background:rgba(12,12,15,.5);border-color:rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(22px) saturate(1.3);backdrop-filter:blur(22px) saturate(1.3);}

/* ============ HERO spacing + foot row + VSL overlap fix ============ */
.hero{justify-content:center;padding:120px var(--pad) clamp(150px,16vh,270px);}
.hero-foot{position:absolute;left:0;right:0;bottom:clamp(96px,9vw,186px);z-index:3;
  display:flex;justify-content:space-between;align-items:flex-end;padding:0 var(--pad);pointer-events:none;}
.hero-foot .hero-values,.hero-foot .scroll-hint{pointer-events:auto;}
.hero-values{position:static;margin:0;justify-content:flex-start;}
.scroll-hint{position:static;right:auto;bottom:auto;}
/* VSL pulls up only a little -> never covers avatars / foot */
.vsl-block{margin-top:calc(-1 * clamp(50px,6vw,140px));}
.proof-item b,.impact-num{font-variant-numeric:tabular-nums;}

/* ============ MOBILE responsive ============ */
@media (max-width:767px){
  .nav-inner .btn.primary{display:none;}     /* hide CTA, keep burger */
  .nav-burger{display:flex;}
  .nav-inner{padding:8px 12px 8px 18px;height:62px;}
  .hero-foot{bottom:auto;top:calc(100svh - 110px);justify-content:flex-start;}
  .hero-foot .scroll-hint{display:none;}
  .proof .wrap{flex-direction:column;gap:0;}
  .proof-item{flex:none;width:100%;border-left:0;border-top:1px solid var(--line);padding:22px 0;}
  .proof-item:first-child{border-top:0;}
  .proof-item b{font-size:2.6rem;}
  .impact-grid{grid-template-columns:1fr;}
  .impact-cell{border-left:0!important;border-top:1px solid var(--line);padding:22px 0!important;}
  .impact-cell:first-child{border-top:0;}
  .impact-num{font-size:3.2rem;}
  .dna-grid,.cw-grid,.fit-cols,.eng-grid,.glimpse-grid{grid-template-columns:1fr;}
  .footer-cols{flex-direction:column;gap:26px;text-align:left;}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:10px;}
  .hero .h-hero{max-width:18ch;}
}

/* ============ Hero breathing + VSL tilt + round unmute cursor ============ */
.vsl-block{margin-top:calc(-1 * clamp(36px,4vw,84px));}
.hero-foot{bottom:clamp(56px,6vw,104px);}
.hero{padding-bottom:clamp(130px,14vh,230px);}
.vsl-straddle{transition:opacity var(--dur) var(--ease),transform .45s var(--ease);
  transform-style:preserve-3d;cursor:none;will-change:transform;}
/* round "Spustit zvuk" cursor bubble (like Yugen video hover) */
.cursor.round{width:92px;height:92px;border-radius:50%;background:rgba(124,92,255,.92);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;mix-blend-mode:normal;
  border:1px solid rgba(255,255,255,.25);
  font-family:var(--mono);font-size:.75rem;letter-spacing:.03em;text-transform:uppercase;
  padding:0;line-height:1.35;white-space:normal;text-align:center;}

/* proof strip + impact -> Yugen impact-card layout (tall, number top / label bottom) */
.proof-item{justify-content:space-between;gap:0;min-height:clamp(210px,17vw,300px);}
.impact-cell{display:flex;flex-direction:column;justify-content:space-between;
  min-height:clamp(220px,18vw,320px);gap:24px;}
@media (max-width:767px){
  .proof-item{min-height:0;gap:12px;}
  .impact-cell{min-height:0;gap:14px;}
}

/* bigger premium unmute bubble (GSAP-scaled) + number labels 18px */
.cursor.round{width:124px;height:124px;font-size:.74rem;line-height:1.45;letter-spacing:.05em;
  transition:background .25s,color .25s;border:1px solid rgba(255,255,255,.28);}
.proof-item span,.impact-cell p{font-size:var(--fs-body);line-height:1.4;}

/* ============ Founder DNA -> clean numbered process ============ */
.process{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:clamp(48px,6vw,90px);}
.process-step{display:flex;flex-direction:column;justify-content:space-between;
  min-height:clamp(340px,28vw,470px);padding:clamp(36px,4vw,68px) clamp(24px,2.4vw,56px) 0;
  border-left:1px solid var(--line);}
.process-step:first-child{border-left:0;padding-left:0;}
.process-num{align-self:flex-start;display:grid;place-items:center;width:40px;height:40px;border-radius:5px;
  background:var(--accent);color:#fff;font-family:var(--mono);font-size:.82rem;}
.process-body{margin-top:auto;}
.process-title{font-family:var(--display);font-weight:600;font-size:clamp(1.45rem,2vw,1.95rem);margin-bottom:16px;}
.process-desc{color:var(--muted);font-size:var(--fs-body);line-height:1.55;max-width:34ch;}
.process-cta{display:inline-flex;align-items:center;gap:9px;margin-top:26px;font-weight:600;color:var(--ink);}
.process-cta:hover{color:var(--accent-text);}
.process-arrow{position:relative;width:17px;height:17px;display:inline-block;overflow:hidden;}
.process-arrow svg{position:absolute;inset:0;width:17px;height:17px;transition:transform .5s var(--ease);}
.process-arrow svg.dup{transform:translate(-130%,130%);}
.process-cta:hover .process-arrow svg{transform:translate(130%,-130%);}
.process-cta:hover .process-arrow svg.dup{transform:translate(0,0);}
@media (max-width:767px){
  .process{grid-template-columns:1fr;}
  .process-step{min-height:0;border-left:0;border-top:1px solid var(--line);padding:30px 0 0;}
  .process-step:first-child{border-top:0;}
  .process-body{margin-top:22px;}
}
/* spacing: VSL <-> numbers <-> reframe */
.vsl-block{margin-bottom:clamp(72px,8vw,124px);}
.reframe{padding-top:clamp(72px,8vw,130px);}

/* ===== process: titles on shared baseline + 18px + arrow-in-square (tilt-run) ===== */
.process-step{justify-content:flex-start;min-height:auto;}
.process-num{margin-bottom:clamp(120px,15vw,210px);}
.process-body{margin-top:0;}
.process-desc{font-size:var(--fs-body);}
.process-arrow{width:28px;height:28px;border-radius:4px;background:var(--accent);}
.process-arrow svg{inset:auto;top:50%;left:50%;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;color:#fff;}
.process-arrow svg.dup{transform:translate(-160%,160%);}
.process-cta:hover .process-arrow svg{transform:translate(160%,-160%);}
.process-cta:hover .process-arrow svg.dup{transform:translate(0,0);}
/* tagline breathing + wider number labels (no slivered wrapping) */
.dna-tagline{margin-bottom:clamp(72px,9vw,130px);}
.proof-item span,.impact-cell p{max-width:34ch;}

/* ===== hero: 16px eyebrow + bigger subhead + declutter badges (center scroll) ===== */
.hero-eyebrow{font-size:1rem;letter-spacing:.14em;}
.hero-sub{font-size:clamp(1.2rem,1.7vw,1.6rem);}
.hero-values{display:none;}                 /* declutter at Full HD (move to About later) */
.hero-foot{justify-content:center;}          /* scroll centered, connects to VSL */

/* ===== system: numbers closer to titles + clean letter-spacing ===== */
.process-num{margin-bottom:clamp(40px,5vw,92px);}
#system .h2,.dna-tagline{letter-spacing:-.012em;}

/* ===== footer: balanced weights/sizes ===== */
.footer-wordmark{font-weight:600;letter-spacing:-.035em;}
.footer-cols{gap:clamp(48px,9vw,140px);}
.footer-col-title{font-weight:500;}
.footer-col a,.footer-col .live{font-weight:400;}

/* system: simpler hierarchy — lighter tagline, no italic (less heavy) */
.dna-tagline{font-size:clamp(1.2rem,1.9vw,1.65rem);font-weight:500;}
.dna-tagline .accent{font-style:normal;}

/* scroll indicator: no text, longer 2px line, pulses downward */
.scroll-hint{gap:0;}
.scroll-hint .ln{position:relative;width:2px;height:60px;background:rgba(255,255,255,.12);
  overflow:hidden;border-radius:2px;}
.scroll-hint .ln::after{content:"";position:absolute;left:0;top:-50%;width:100%;height:50%;
  background:linear-gradient(transparent,var(--accent));animation:scrollPulse 2s var(--ease) infinite;}
@keyframes scrollPulse{0%{top:-50%}100%{top:100%}}

/* hero: pull VSL closer to content (scales with viewport height) + content lower */
.hero{padding-bottom:clamp(90px,10vh,180px);}
.vsl-block{margin-top:calc(-1 * clamp(60px,15vh,230px));}

/* ===== hero: center content above the VSL + scroll line above VSL + 47px H2 / 18px body ===== */
:root{
  --fs-body:1.125rem;                       /* 18px desktop body (Yugen-consistent) */
  --fs-h2:clamp(1.9rem,3vw,2.94rem);        /* ~47px max */
  --vsl-pull:clamp(60px,15vh,230px);        /* single source: VSL overlap into hero */
}
.vsl-block{margin-top:calc(-1 * var(--vsl-pull));}
/* padding-bottom = VSL overlap + gap -> content centers in the area ABOVE the VSL */
.hero{padding-bottom:calc(var(--vsl-pull) + clamp(36px,5vh,80px));}
/* scroll line sits just above the VSL (no longer hidden under it) */
.hero-foot{bottom:calc(var(--vsl-pull) + 24px);}

/* reframe: the impact line is the message -> bigger + brighter (not a tiny muted afterthought) */
.reframe-body p.muted{font-size:var(--fs-body-l);color:#CAC7C2;margin-top:28px;}

/* ====================== SPACING SYSTEM (8pt, Yugen rhythm) ====================== */
:root{
  --space-xs:8px;   --space-sm:16px;  --space-md:24px;  --space-lg:32px;   /* lg = buttons↔subheading */
  --space-xl:48px;  --space-2xl:64px; --space-3xl:96px; --space-4xl:128px;
  --space-section:clamp(72px,11vw,180px);
}
/* apply to hero rhythm */
.hero-eyebrow{margin-bottom:var(--space-md);}
.hero .h-hero{margin-bottom:var(--space-md);}
.hero-sub{margin-bottom:var(--space-lg);}
.hero-ctas{margin-bottom:var(--space-lg);}
/* scroll line: in flow under social proof, centered, spacing = buttons↔sub (32px) */
.scroll-hint{position:static;right:auto;bottom:auto;margin-top:var(--space-lg);}
.hero{padding-bottom:calc(var(--vsl-pull) + var(--space-lg));}

/* ====================== BUTTON ARROW: tilt 45° to upper-right + forward run ====================== */
.btn:hover .chip svg{transform:translate(140%,-140%) rotate(-45deg);}
.btn .chip svg.is-2{transform:translate(-140%,140%) rotate(-45deg);}
.btn:hover .chip svg.is-2{transform:translate(0,0) rotate(-45deg);}

/* ====================== FOOTER: spacing system applied ====================== */
.footer-cta{margin-top:var(--space-md);}
.footer-sub{margin-top:var(--space-md);}
.footer-wordmark{margin-top:var(--space-3xl);}
.footer-cols{margin-top:var(--space-2xl);padding-top:var(--space-lg);}
.footer-bottom{margin-top:var(--space-2xl);padding-top:var(--space-md);}

/* scroll line longer -> reaches toward the VSL on its own */
.scroll-hint{margin-top:var(--space-md);}
.scroll-hint .ln{height:clamp(82px,9vh,132px);}
.hero{padding-bottom:calc(var(--vsl-pull) + var(--space-md));}

/* button arrow conveyor: both arrows stacked & centered, GSAP drives them */
.btn .chip{display:grid;place-items:center;position:relative;overflow:hidden;}
.btn .chip svg{grid-area:1/1;position:static !important;transition:none !important;}

/* ====================== VSL edge beams — two rays trace from the top-left corner and
   meet at the bottom-right corner (one via top+right, one via left+bottom). ====================== */
.vsl-straddle{isolation:isolate;}
.vsl-straddle::before,
.vsl-straddle::after{
  content:"";position:absolute;width:58px;height:2px;border-radius:2px;z-index:5;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(194,173,255,.85) 36%,#ffffff 50%,rgba(194,173,255,.85) 64%,transparent);
  filter:drop-shadow(0 0 7px rgba(124,92,255,.9));
  offset-path:inset(1px round var(--radius-lg));
  offset-rotate:auto;
}
.vsl-straddle::before{animation:vslBeamCW 4.6s linear infinite;}   /* top-left → top → top-right → right → bottom-right */
.vsl-straddle::after{animation:vslBeamCCW 4.6s linear infinite;}   /* top-left → left → bottom-left → bottom → bottom-right */
@keyframes vslBeamCW{
  0%{offset-distance:0%;opacity:0;}
  7%{opacity:1;}
  58%{offset-distance:50%;opacity:1;}
  65%{offset-distance:50%;opacity:0;}
  100%{offset-distance:50%;opacity:0;}
}
@keyframes vslBeamCCW{
  0%{offset-distance:100%;opacity:0;}
  7%{opacity:1;}
  58%{offset-distance:50%;opacity:1;}
  65%{offset-distance:50%;opacity:0;}
  100%{offset-distance:50%;opacity:0;}
}
@media (prefers-reduced-motion:reduce){.vsl-straddle::before,.vsl-straddle::after{animation:none;opacity:0;}}
/* fallback for browsers without offset-path: subtle static side glow */
@supports not (offset-path: inset(1px)){
  .vsl-straddle::before,.vsl-straddle::after{offset-path:none;width:2px;height:42%;top:6%;
    background:linear-gradient(180deg,transparent,#c2adff,transparent);animation:none;opacity:.5;}
  .vsl-straddle::before{left:0;}.vsl-straddle::after{right:0;}
}

/* ====================== ARROW — dead simple: one arrow, rotate 45° on hover ====================== */
.btn .chip svg.is-2{display:none !important;}
.btn .chip svg{grid-area:auto !important;position:static !important;transition:transform .4s var(--ease) !important;transform:none;}
.btn:hover .chip svg{transform:rotate(-45deg);}

/* ====================== GRID — align SECTIONS to the (untouched) navbar ======================
   The navbar stays exactly as it was. The section .wrap now mirrors the navbar's container math
   (min(maxw, 100vw - 2*pad)) and its content inset, so logo == section start, CTA == section end. */
@media (min-width:992px){
  /* content area = maxw, so section content edges == navbar bar edges == expanded VSL edges */
  .wrap{max-width:calc(var(--maxw) + 2 * var(--pad));}
  #faq .wrap{max-width:calc(var(--maxw) + 2 * var(--pad));}
}


/* ====================== BATCH: eyebrow unify · icons · nav · VSL glow · work ====================== */

/* 1. EYEBROW — hero keeps its own previous style (mono, no tick); reverted per request */

/* 2. PRO KOHO icons — SVG, perfectly centered in the circle */
.fit-mark svg{width:13px;height:13px;display:block;}
.fit-mark{place-items:center;}

/* 3. NAV — logo evenly spaced (left gap == CTA gap) */
@media (min-width:992px){ .nav-inner{padding-left:17px;} }

/* 4. NAV DOT — solid brand accent, no pulse (calm/premium, not an "open bookings" signal) */
.nav-dot::after{display:none;}
.nav-dot{background:var(--accent);}

/* 5. VSL — soft, EVEN, symmetrical ambient glow (premium) instead of the running beams */
.vsl-straddle::before,.vsl-straddle::after{display:none !important;}
.vsl-straddle{box-shadow:0 40px 120px rgba(0,0,0,.6), 0 0 78px -4px rgba(124,92,255,.30);}

/* 6. FEATURED WORK — quality over quantity: 2 curated cards, balanced */
.glimpse-grid{grid-template-columns:repeat(2,1fr);gap:28px;}
.glimpse-img{aspect-ratio:4/3;}

/* ====================== VSL sound icon — animated equalizer (bubble + mobile button) ====================== */
/* equalizer: 4 pulsing bars, used in BOTH the cursor bubble (desktop) and the mobile button (touch) */
.snd-eq{display:inline-flex;align-items:flex-end;gap:2.5px;height:15px;line-height:0;}
.snd-eq i{width:2.5px;height:100%;background:currentColor;border-radius:2px;transform-origin:bottom;
  animation:sndEq 1s ease-in-out infinite;}
.snd-eq i:nth-child(1){animation-delay:0s;}
.snd-eq i:nth-child(2){animation-delay:.22s;}
.snd-eq i:nth-child(3){animation-delay:.44s;}
.snd-eq i:nth-child(4){animation-delay:.12s;}
@keyframes sndEq{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
@media (prefers-reduced-motion:reduce){.snd-eq i{animation:none;transform:scaleY(.66);}}

/* cursor round bubble: stack the equalizer above the label */
.cursor.round{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;}
.cursor.round .snd-eq{height:19px;}
.cursor.round .rb-txt{display:block;}

/* mobile/touch sound button on the VSL (no custom cursor there) — balanced, responsive */
.vsl-sound{position:absolute;right:16px;bottom:16px;z-index:4;width:44px;height:44px;border-radius:50%;
  display:none;place-items:center;color:#fff;cursor:pointer;
  background:rgba(124,92,255,.92);border:1px solid rgba(255,255,255,.28);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 6px 24px rgba(0,0,0,.4);
  transition:background .25s var(--ease),transform .25s var(--ease);}
.vsl-sound:active{transform:scale(.92);}
.vsl-sound.is-on{background:rgba(124,92,255,.7);}
@media (hover:none){ .vsl-sound{display:grid;} }     /* show only where there is no cursor */
@media (max-width:767px){ .vsl-sound{width:40px;height:40px;right:12px;bottom:12px;} }

/* ====================== FOOTER — Yugen layout + exact type scale (wordmark 188 / display 90 / social 58 / nav 28 / body 24) ====================== */
.footer{padding-top:clamp(72px,10vw,150px);padding-bottom:40px;overflow:hidden;}
.footer .wrap{position:relative;z-index:2;}

/* CTA (main-cta-block, centered) */
.footer-cta-block{text-align:center;max-width:62rem;margin-inline:auto;}
.footer-eyebrow{justify-content:center;margin:0 auto clamp(22px,2.6vw,36px);}
.footer-display{font-family:var(--display);font-weight:600;line-height:1.04;letter-spacing:-.025em;
  font-size:clamp(2.5rem,6vw,5.625rem);color:var(--ink);}                 /* text-style-display 90px */
.footer-sub{text-align:center;color:#C9C7C2;max-width:48ch;margin:clamp(18px,2vw,26px) auto 0;
  font-size:clamp(1.125rem,1.6vw,1.5rem);line-height:1.45;font-weight:500;}/* text-size-large 24px */
.footer-btn{margin-top:clamp(26px,3vw,42px);}

/* wordmark + about (footer-yugen-text + sustainability blurb, top-left) */
.footer-sign{margin-top:clamp(64px,9vw,130px);}
.footer-wordmark{font-family:var(--display);font-weight:600;line-height:.82;letter-spacing:-.045em;
  font-size:clamp(3rem,13.4vw,11.7rem);color:var(--ink);}                 /* footer-yugen-text 188px */
.footer-about{max-width:46ch;margin-top:clamp(20px,2.2vw,34px);}
.footer-about .footer-col-title{margin-bottom:14px;}
.footer-about p{font-size:clamp(1.0625rem,1.4vw,1.4375rem);color:var(--muted);line-height:1.45;font-weight:500;} /* text-size-body-l 23px */

/* nav + socials row (footer-head: space-between, bottom-aligned) */
.footer-head{display:flex;justify-content:space-between;align-items:flex-end;gap:clamp(32px,5vw,80px);flex-wrap:wrap;
  border-top:1px solid var(--line);padding-top:clamp(40px,5vw,60px);margin-top:clamp(48px,6vw,90px);}
.footer-nav .footer-col-title{margin-bottom:clamp(20px,2vw,28px);}
.footer-nav-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,80px);}
.footer-links-list{display:flex;flex-direction:column;align-items:flex-start;gap:14px;}
.footer-links-list a{font-size:clamp(1.25rem,1.9vw,1.75rem);font-weight:500;letter-spacing:-.02em;line-height:1.2;
  color:#D6D3CE;transition:color .3s var(--ease);}                        /* text-size-body-xl 28px */
.footer-links-list a:hover{color:var(--accent-text);}
.footer-socials{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right;}
.footer-socials .footer-col-title{margin-bottom:8px;}
.footer-socials a{font-family:var(--display);font-weight:600;line-height:1;letter-spacing:-.03em;
  font-size:clamp(2rem,4.4vw,3.625rem);color:var(--ink);transition:color .3s var(--ease);}  /* socials 58px */
.footer-socials a:hover{color:var(--accent-text);}

/* bottom bar */
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;
  border-top:1px solid var(--line);padding-top:clamp(20px,2.4vw,28px);margin-top:clamp(48px,6vw,80px);}
.footer-status{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:.74rem;
  letter-spacing:.08em;text-transform:uppercase;color:var(--ink);
  background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:5px;padding:8px 13px;}
.footer-status .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);}
.footer-copy{font-size:clamp(1rem,1.4vw,1.5rem);color:var(--muted);}      /* copyright 24px */
.footer-top{font-size:clamp(1rem,1.4vw,1.5rem);color:var(--muted);transition:color .3s var(--ease);}
.footer-top:hover{color:var(--accent-text);}

.footer-col-title{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:500;}

/* responsive — verified on mobile */
@media (max-width:991px){
  .footer-head{flex-direction:column;align-items:flex-start;gap:40px;}
  .footer-socials{align-items:flex-start;text-align:left;}
}
@media (max-width:600px){
  .footer-wordmark{font-size:clamp(2.4rem,15vw,4.6rem);line-height:.92;}
  .footer-nav-grid{grid-template-columns:1fr;gap:22px;}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:14px;}
  .footer-socials a{font-size:clamp(1.8rem,9vw,2.6rem);}
}

/* ====================== EYEBROW — unify every section to the hero eyebrow style (mono, no tick) ====================== */
.eyebrow{font-family:var(--mono);font-size:1rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:#D8D5D0;display:inline-flex;align-items:center;gap:0;}
.eyebrow::before{display:none !important;}
.light .eyebrow{color:#5b5b62;}

/* ====================== FOOTER fixes (wordmark left · animated lines · book-intro · socials top-left) ====================== */
/* 1 · wordmark left-aligned (override old centering) */
.footer-sign,.footer-head,.footer-bottom{text-align:left;}
.footer-wordmark{text-align:left;margin-top:0;}

/* 4 · nav + socials top-aligned; socials left-aligned, on the same grid line as the nav */
.footer-head{align-items:flex-start;}
.footer-socials{align-items:flex-start;text-align:left;}

/* 2 · the two divider lines — draw left→right on scroll reveal, more prominent */
.footer-head,.footer-bottom{border-top:none;position:relative;}
.footer-head::before,.footer-bottom::before{content:"";position:absolute;top:0;left:0;right:0;height:1.5px;
  background:rgba(255,255,255,.24);transform:scaleX(0);transform-origin:left center;
  transition:transform 1.25s var(--ease) .15s;}
.footer-head.is-in::before,.footer-bottom.is-in::before{transform:scaleX(1);}

/* 3 · "Rezervovat hovor →" link with animated arrow (accent), replaces the email */
.footer-links-list a.footer-book{color:var(--accent-text);display:inline-flex;align-items:center;gap:.32em;}
.footer-links-list a.footer-book:hover{color:#B9A4FF;}
.footer-arrow{display:inline-flex;align-items:center;justify-content:center;width:.62em;height:.62em;}
.footer-arrow svg{width:100%;height:100%;transition:transform .42s var(--ease);}
.footer-book:hover .footer-arrow svg{transform:rotate(-45deg);}

/* ====================== FOOTER tweaks: wordmark · eyebrow radius · CTA visual fade · book square arrow ====================== */
/* 1 · wordmark a touch smaller */
.footer-wordmark{font-size:clamp(2.8rem,12.6vw,10.8rem);}

/* 2 · CTA eyebrow — subtle 4px radius (Yugen .25rem), not a pill */
.footer-eyebrow{border-radius:4px;}

/* 3 · CTA visual behind the top, fading to palette black (--bg) for the rest of the footer */
.footer{background:var(--bg);}
.footer-stone img{opacity:.55;}
.footer-stone::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,12,.3) 0%,rgba(10,10,12,.55) 20%,var(--bg) 44%);}

/* 4 · "Rezervovat hovor" arrow = violet square component (same as system section) */
.footer-links-list a.footer-book{color:var(--ink);gap:.5em;}
.footer-book .process-arrow{width:28px;height:28px;border-radius:4px;background:var(--accent);
  overflow:hidden;position:relative;display:inline-block;flex:none;}
.footer-book .process-arrow svg{position:absolute;top:50%;left:50%;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;
  color:#fff;transition:transform .5s var(--ease);}
.footer-book .process-arrow svg.dup{transform:translate(-160%,160%);}
.footer-book:hover .process-arrow svg{transform:translate(160%,-160%);}
.footer-book:hover .process-arrow svg.dup{transform:translate(0,0);}

/* ====================== FOOTER: unify eyebrow size + radius (design system) + Yugen spacing ====================== */
/* eyebrow text size unified with the section/hero eyebrows (mono 1rem · .14em) */
.footer-eyebrow,.footer-col-title{font-size:1rem;letter-spacing:.14em;font-weight:500;}
/* design-system radius token (--radius = 4px, sharp — not a pill) */
.footer-eyebrow{border-radius:var(--radius);}
.footer-status{border-radius:var(--radius);}
/* spacing — match Yugen: wordmark → about = flex-verti gap 1.25rem (was 33px) */
.footer-about{margin-top:1.25rem;}

/* ====================== FOOTER v2 — visual confined to CTA · eyebrow component · spacing ====================== */
.footer{background:var(--bg);--foot-gap:clamp(64px,8vw,112px);padding-bottom:clamp(34px,3.4vw,52px);}

/* TASK 1 · background picture ONLY behind the CTA, then fades fully to palette black (--bg) */
.footer-stone{position:absolute;top:0;left:0;right:0;bottom:auto;height:clamp(620px,66vh,720px);z-index:0;}
.footer-stone img{width:100%;height:100%;object-fit:cover;object-position:center 26%;opacity:.6;}
.footer-stone::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,12,.3) 0%,rgba(10,10,12,.42) 40%,rgba(10,10,12,.82) 66%,var(--bg) 84%);}

/* TASK 2+3 · EYEBROW COMPONENT (one source of truth) — sections+footer = 14px, hero = 16px */
.eyebrow,.footer-eyebrow,.footer-col-title{font-family:var(--mono);font-size:.875rem;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:#D8D5D0;}
.eyebrow::before{display:none !important;}
.light .eyebrow{color:#5b5b62;}
.hero-eyebrow{font-size:1rem;letter-spacing:.14em;}                 /* hero variant = 16px */

/* TASK 4 · wordmark a bit smaller */
.footer-wordmark{font-size:clamp(2.6rem,10.6vw,9.5rem);}

/* TASK 6 · consistent vertical rhythm between footer blocks (same gap above each) */
.footer-sign{margin-top:var(--foot-gap);}
.footer-head{margin-top:var(--foot-gap);}
.footer-bottom{margin-top:var(--foot-gap);}

/* TASK 5 · bottom strip — more breathing room top & bottom */
.footer-bottom{padding-top:clamp(30px,3.2vw,48px);padding-bottom:0;}

/* TASK 1 (robust) · CTA visual confined to .footer-cta-wrap; everything below = --bg */
.footer{padding-top:0;}
.footer-cta-wrap{position:relative;overflow:hidden;padding-top:clamp(72px,11vw,150px);padding-bottom:var(--foot-gap);}
.footer-cta-wrap > .wrap{position:relative;z-index:2;}
.footer-stone{position:absolute;inset:0;top:0;bottom:0;height:auto;z-index:0;}
.footer-stone img{width:100%;height:100%;object-fit:cover;object-position:center 28%;opacity:.6;}
.footer-stone::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,12,.32) 0%,rgba(10,10,12,.46) 50%,rgba(10,10,12,.84) 78%,var(--bg) 100%);}
.footer-sign{margin-top:0;}

/* ====================== TASK 2 · smooth dissolve of CTA visual to black (no band, no purple) ====================== */
.footer-glow{display:none;}                         /* footer fades to black, not violet */
.footer-stone img{opacity:.6;}
.footer-stone{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 30%,rgba(0,0,0,0) 86%);
  mask-image:linear-gradient(180deg,#000 0%,#000 30%,rgba(0,0,0,0) 86%);}
.footer-stone::after{background:linear-gradient(180deg,rgba(10,10,12,.46) 0%,rgba(10,10,12,0) 52%) !important;}

/* ====================== TASK 4 · nav dot — orange + pulsing (attention) ====================== */
.nav-dot{background:#FF7A1A;box-shadow:0 0 9px rgba(255,122,26,.6);}
.nav-dot::after{display:block;background:#FF7A1A;animation:nav-pulse 1.6s var(--ease) infinite;}

/* ====================== marquee — keep scrolling on hover (no pause) ====================== */
.marquee-track:hover{animation-play-state:running !important;}

/* ====================== footer spacing — more prominent CTA→logo + breathing logo→O mně (Yugen rhythm) ====================== */
.footer-cta-wrap{padding-bottom:clamp(96px,12.5vw,176px);}      /* CTA → wordmark, prominent */
.footer-about{margin-top:clamp(42px,4.8vw,72px);}                /* wordmark → "O mně", breathing */

/* VSL — smaller initial width so the scroll-expand reads more prominently on 1080p */
.vsl-straddle{max-width:1180px;}
/* Pro koho — box subheadings a touch bigger (design-system scale) */
.fit-card h3{font-size:clamp(1.3rem,1.7vw,1.55rem);}
.fit-mark svg{display:block;width:13px;height:13px;}

/* ====================== batch: footer spacing token + visual hierarchy + hero/VSL ====================== */
/* TASK 1 · footer CTA → wordmark = big lead (token ~256px, next step on the 8pt scale: 2×128) */
.footer{--foot-lead:clamp(150px,18vw,256px);}
.footer-cta-wrap{padding-bottom:var(--foot-lead);}

/* TASK 3+4 · footer visual hierarchy (subtle links · accent CTA · white copyright/back-to-top) */
.footer-links-list a{color:var(--muted);}
.footer-links-list a:hover{color:var(--ink);}
.footer-socials a{color:#A8A49C;}
.footer-socials a:hover{color:var(--ink);}
.footer-links-list a.footer-book{color:var(--accent-text);}
.footer-links-list a.footer-book:hover{color:#B9A4FF;}
.footer-copy{color:var(--ink);}
.footer-top{color:var(--ink);}

/* TASK 2 · hero — more space eyebrow↔navbar + smaller VSL lip (VSL sits lower) */
.hero{padding-top:clamp(150px,17vh,210px);}
:root{--vsl-pull:clamp(36px,8.5vh,140px);}

/* ====================== footer strip spacing symmetric + bottom bar bigger ====================== */
/* nav strip — equal gap from line to content (top == bottom) */
.footer-head{padding-top:clamp(52px,5.5vw,80px);}
.footer-bottom{margin-top:clamp(52px,5.5vw,80px);}
/* bottom bar (name + year) — bigger top + bottom, symmetric */
.footer-bottom{padding-top:clamp(46px,5vw,68px);}
.footer{padding-bottom:clamp(46px,5vw,68px);}

/* Pro koho subheadings — more impactful */
.fit-card h3{font-size:clamp(1.5rem,2.1vw,1.9rem);}

/* ═══════════════════════ WORK SHOWCASE — Yugen .work-block layout + clip-path reveal ═══════════════════════ */
.work-intro{margin-bottom:clamp(44px,5.5vw,84px);}
.work-list{display:flex;flex-direction:column;gap:clamp(48px,6vw,80px);}     /* gap-5rem */
.work-item{display:flex;flex-direction:column;gap:clamp(28px,3vw,44px);}

.work-block{position:relative;display:flex;flex-direction:column;gap:1.25rem;width:54.9vw;max-width:1180px;margin-left:auto;}

.work-block-image{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:var(--surface);padding-top:56%;
  clip-path:inset(25% round var(--radius-lg));transition:clip-path 1.05s cubic-bezier(.76,0,.24,1) .05s;}
.work-block-image.is-in{clip-path:inset(0% round var(--radius-lg));}
.work-block-image[data-anim]{opacity:1;transform:none;}     /* clip-path IS the reveal — skip generic fade/translate */
.work-block-image .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.work-block-image .bg.cover{transition:transform 1.4s var(--ease);}
.work-block-image .bg.hover{opacity:0;transform:scale(1.05);transition:opacity .6s var(--ease),transform 1.4s var(--ease);}
.work-block:hover .bg.hover{opacity:1;}
.work-block:hover .bg.cover{transform:scale(1.05);}

.work-block-text{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;}
.work-block-title{display:flex;flex-direction:column;gap:.5rem;}
.work-block-text h3{font-family:var(--display);font-weight:600;letter-spacing:-.02em;line-height:1.02;font-size:clamp(1.75rem,2.8vw,2.6rem);color:var(--ink);}
.work-sub{font-family:var(--display);font-weight:500;font-size:clamp(1.05rem,1.5vw,1.4375rem);color:var(--muted);}

.tags-list{display:flex;flex-wrap:wrap;align-items:center;gap:.63rem;}
.tag.simple-style{border:1px solid var(--line);background:transparent;color:var(--muted);font-family:var(--mono);font-size:.72rem;
  font-weight:500;letter-spacing:.06em;text-transform:uppercase;padding:.45rem .72rem;border-radius:var(--radius);white-space:nowrap;
  transition:color .3s var(--ease),border-color .3s var(--ease);}
.work-block:hover .tag.simple-style{border-color:rgba(255,255,255,.22);color:var(--ink);}
.tag-more{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--muted);}

.absolute-link{position:absolute;inset:0;z-index:3;cursor:pointer;}

.divider-line{width:100%;height:1.5px;background:var(--line);transform:scaleX(0);transform-origin:left;
  transition:transform 1.15s cubic-bezier(.76,0,.24,1) .12s;}
.divider-line.is-in{transform:scaleX(1);}
.divider-line[data-anim]{opacity:1;}

/* ═══════════════════════ CLIENT LOGOS — Yugen .logos marquee ═══════════════════════ */
.for-logos{padding-block:clamp(40px,5vw,72px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;}
.logos-component{display:flex;flex-direction:column;overflow:hidden;}
.logos-track{display:flex;}
.logos{flex:none;display:flex;width:max-content;animation:logos-marquee 42s linear infinite;}
.logos-col-wrap{flex:none;}
.logos-list{display:flex;align-items:center;}
.logo-wrap{flex:none;display:grid;place-items:center;width:12.875rem;height:4.6875rem;padding:0 1rem;border-right:1px solid var(--line);}
.logo-wrap img,.logo-wrap .fit-contain{object-fit:contain;max-width:100%;max-height:62%;}
.logo-text{font-family:var(--display);font-weight:600;font-size:1.3rem;letter-spacing:.04em;color:var(--muted);white-space:nowrap;
  opacity:.62;transition:opacity .3s var(--ease),color .3s var(--ease);}
.logo-wrap:hover .logo-text{opacity:1;color:var(--ink);}
@keyframes logos-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.logos{animation:none;}}

/* ═══════════════════════ work + logos responsive ═══════════════════════ */
@media (max-width:991px){
  .work-block{width:72vw;}
}
@media (max-width:767px){
  .work-block{width:100%;}
  .work-block-image{padding-top:56.25%;border-radius:var(--radius);clip-path:inset(20% round var(--radius));}
  .work-block-image.is-in{clip-path:inset(0% round var(--radius));}
  .work-block-text{flex-direction:column;align-items:flex-start;gap:1rem;}
  .logo-wrap{width:38vw;height:4rem;}
  .logo-text{font-size:1.05rem;}
}
@media (hover:none){ .work-block-image .bg.hover{display:none;} }

/* ═══════════ footer mid-spacing — srovnání: snap onto scale, even rhythm ═══════════ */
/* defect was 72(wordmark→O mně) vs 112(about→NAVIGACE): off-grid + uneven jump.       */
/* fix → 64 (tight signature cluster) then uniform 80 around the nav strip.            */
.footer-about{margin-top:clamp(48px,5vw,64px);}   /* wordmark → "O mně"  (64) */
.footer-head{margin-top:clamp(56px,6vw,80px);}    /* "O mně" → NAVIGACE  (80, = nav strip) */

/* ═══════════ work hover cursor — circular bubble + big 45° arrow (Yugen look) ═══════════ */
.cursor.arrow{width:92px;height:92px;border-radius:50%;background:rgba(124,92,255,.92);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;mix-blend-mode:normal;
  border:1px solid rgba(255,255,255,.28);display:flex;align-items:center;justify-content:center;padding:0;}
.cursor.arrow .cur-arrow{width:50%;height:50%;display:block;}

/* ═══════════ work images: VSL-style SCRUBBED clip-path — JS owns it frame-by-frame ═══════════ */
.work-block-image{transition:none;}                                  /* kill one-shot tween so scrub is 1:1 */
@media (prefers-reduced-motion:reduce){.work-block-image{clip-path:none!important;}}  /* a11y fallback */

/* ═══════════ middle work item shifts LEFT → right · left · right contrast ═══════════ */
/* (note: Yugen is all-right-aligned; this alternation is our own variation, by request) */
.work-item:nth-child(even) .work-block{margin-left:0;margin-right:auto;}

/* ═══════════ slim Yugen arrow (filled) in the work hover bubble ═══════════ */
.cursor.arrow .cur-arrow{width:44%;height:44%;}

/* ═══════════ WORK section LIGHT theme (Yugen cream) — contrast break ═══════════ */
.light .work-block-text h3{color:#16161A;}
.light .work-sub{color:#6b6b72;}
.light .tag.simple-style{border-color:rgba(0,0,0,.18);color:#555;}
.light .work-block:hover .tag.simple-style{border-color:rgba(0,0,0,.42);color:#16161A;}
.light .tag-more{color:#6b6b72;}
.light .divider-line{background:rgba(0,0,0,.14);}
.light .work-block-image{background:#e7e3db;}

/* ═══════════ clients band — logos merged into the (light) work section ═══════════ */
.logos-band{margin-top:clamp(64px,8vw,116px);overflow:hidden;}
.logos-eyebrow{margin-bottom:clamp(26px,3.2vw,44px);}
.light .logo-text{color:#16161A;opacity:.45;}
.light .logo-wrap{border-right-color:rgba(0,0,0,.10);}
.light .logo-wrap:hover .logo-text{opacity:1;color:#16161A;}

/* ═══════════ Pro koho: bigger heading-circle icons (match list checks/crosses) ═══════════ */
.fit-mark{width:30px;height:30px;}
.fit-mark svg{width:17px;height:17px;}

/* ═══════════ SYSTEM section: 2-col top (intro + media), benefits, image carousel ═══════════ */
.sys-top{display:grid;grid-template-columns:1fr;gap:clamp(36px,5vw,64px);align-items:start;}
.sys-h2{margin-top:22px;}
.sys-benefits{display:flex;flex-wrap:wrap;gap:clamp(16px,2.2vw,34px);margin-top:clamp(30px,3.6vw,50px);}
.sys-benefit{display:flex;align-items:center;gap:12px;font-family:var(--display);font-weight:500;font-size:clamp(1rem,1.15vw,1.15rem);color:var(--ink);}
.sys-benefit-ic{flex:none;width:38px;height:38px;border-radius:var(--radius);background:rgba(124,92,255,.10);border:1px solid rgba(124,92,255,.22);display:grid;place-items:center;color:var(--accent-text);}
.sys-benefit-ic svg{width:20px;height:20px;display:block;}

.sys-media{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:var(--surface);aspect-ratio:16/10;cursor:pointer;
  clip-path:inset(25% round var(--radius-lg));transition:none;}
.sys-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s var(--ease);}
.sys-media img.on{opacity:1;}
@media (prefers-reduced-motion:reduce){.sys-media{clip-path:none!important;}.sys-media img{transition:none;}}

@media (min-width:900px){ .sys-top{grid-template-columns:1.08fr 0.92fr;} }
@media (max-width:899px){ .sys-media{aspect-ratio:16/11;} .sys-h2{max-width:24ch;} }

/* ════ STEP4 · pro-koho check alignment + logo marquee 4-set loop + side fade ════ */
.fit-list .ic{width:30px;display:inline-grid;place-items:center;margin-top:3px;}
.fit-list li{gap:12px;}
@keyframes logos-marquee{from{transform:translateX(0)}to{transform:translateX(-25%)}}
.logos{animation:logos-marquee 84s linear infinite;will-change:transform;}
@media (prefers-reduced-motion:reduce){.logos{animation:none;}}
.logos-component{
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 clamp(32px,7vw,170px),#000 calc(100% - clamp(32px,7vw,170px)),transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 clamp(32px,7vw,170px),#000 calc(100% - clamp(32px,7vw,170px)),transparent 100%);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;}
.logos-band{overflow:clip;}

/* ════ STEP5 · OFFER accordion (Yugen hover-expand, dark cards on light section) ════ */
.offers{display:flex;gap:10px;align-items:stretch;height:clamp(480px,60vh,600px);margin-top:clamp(36px,4.5vw,64px);}
.offer{position:relative;flex:.72;min-width:0;overflow:hidden;border-radius:var(--radius-lg);background:#141417;border:1px solid rgba(255,255,255,.08);cursor:pointer;transition:flex .55s var(--ease),border-color .4s var(--ease);}
.offer.active{flex:1.6;}
.offer-inner{display:flex;flex-direction:column;gap:clamp(22px,2.2vw,38px);height:100%;padding:clamp(26px,2.5vw,42px);min-width:0;}
.offer-head{display:flex;flex-direction:column;gap:clamp(18px,1.8vw,30px);opacity:.5;transition:opacity .35s var(--ease);}
.offer.active .offer-head{opacity:1;transition-delay:.12s;}
.offer-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.offer-title{font-family:var(--display);font-weight:600;letter-spacing:-.02em;line-height:1.02;font-size:clamp(1.7rem,2.3vw,2.6rem);color:#fff;}
.offer .offer-title{color:#fff;}
.offer-body{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:clamp(18px,1.8vw,30px);width:clamp(300px,46vw,680px);opacity:0;transition:opacity .24s var(--ease);will-change:opacity;}
.offer.active .offer-body{opacity:1;transition:opacity .5s var(--ease);transition-delay:.5s;}
.offer-desc{font-family:var(--display);font-weight:500;font-size:var(--fs-body-l);color:rgba(255,255,255,.82);max-width:32ch;}
.offer-includes{list-style:none;display:flex;flex-direction:column;gap:.62rem;}
.offer-includes li{position:relative;padding-left:1.5rem;color:rgba(255,255,255,.72);font-size:var(--fs-body);line-height:1.45;}
.offer-includes li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:2px;}
.offer-badge{font-family:var(--mono);font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;border-radius:var(--radius);padding:.42rem .62rem;white-space:nowrap;}
.offer-foot{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;flex-wrap:wrap;padding-top:clamp(14px,1.5vw,22px);border-top:1px solid rgba(255,255,255,.1);}
.offer-price{font-family:var(--display);font-weight:600;font-size:clamp(1.15rem,1.5vw,1.55rem);color:#fff;white-space:nowrap;}
.offer-price small{display:block;font-family:var(--mono);font-size:.68rem;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.48);margin-bottom:.25rem;}
@media (max-width:859px){
  .offers{flex-direction:column;height:auto;gap:14px;}
  .offer,.offer.active{flex:none;}
  .offer-inner{height:auto;}
  .offer-head{opacity:1;}
  .offer-body{opacity:1;width:auto;flex:none;transform:none;}
  .offer-desc{max-width:none;}
}

/* ════════════════ SPACING SYSTEM — single source of truth (token-based, even top/bottom) ════════════════ */
:root{
  --space-section:clamp(72px,12vw,180px);          /* standard section pad, top == bottom */
  --space-section-tight:clamp(48px,8vw,120px);     /* light/secondary sections */
  --space-block:clamp(56px,7vw,112px);             /* canonical large intra-section gap */
}
.section{padding-block:var(--space-section);}
.section.tight{padding-block:var(--space-section-tight);}
.reframe{padding-top:var(--space-section);}        /* #problem 120/180 -> even 180/180 */
.work-intro{margin-bottom:var(--space-block);}
.logos-band{margin-top:var(--space-block);}        /* fixes work uneven-bottom complaint */
.process{margin-top:var(--space-block);}
.offers{margin-top:var(--space-block);}
.vsl-block{margin-bottom:var(--space-block);}
.sec-head{margin-bottom:var(--space-2xl);}
.sec-head .eyebrow{margin-bottom:var(--space-sm);}
.sec-head-r{padding-bottom:0;}
.sys-h2{margin-top:var(--space-md);}
.sys-benefits{margin-top:var(--space-xl);}
.fomo{margin-top:var(--space-xl);}
.footer{padding-bottom:var(--space-2xl);}
@media (max-width:859px){.offers{margin-top:var(--space-block);}}

/* ════════════════ button small variant — offer CTAs use the REAL .btn component ════════════════ */
.btn.sm{font-size:.84rem;padding:9px 13px 9px 16px;gap:9px;}
.btn.sm .chip{width:21px;height:21px;}
.btn.sm .chip svg{width:11px;height:11px;}
.offer .btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;}
.offer .btn.ghost:hover{border-color:rgba(255,255,255,.6);background:rgba(255,255,255,.06);}
.offer .btn.primary{color:#fff;}

/* ════════════════ offer accent — single brand violet on every tier (mint/amber retired) ════════════════ */
.offer{--tier:124,92,255;}
.offer .tag.simple-style{border-color:rgba(var(--tier),.45);color:rgba(var(--tier),.95);}
.offer-includes li::before{background:rgb(var(--tier));}
.offer.is-primary{background:radial-gradient(120% 130% at 0% 0%,rgba(var(--tier),.22),transparent 52%),#141417;border-color:rgba(var(--tier),.5);}
.offer-badge{color:rgb(var(--tier));border-color:rgba(var(--tier),.55);background:rgba(var(--tier),.14);}

/* ═══════════ OFFER overhaul · taller cards, head-row + side image (Yugen clip-expand), detail-list ═══════════ */
.offers{height:clamp(760px,80vh,860px);}
.offer-head{flex-direction:row;justify-content:space-between;align-items:flex-start;gap:1.2rem;}
.offer-head-text{display:flex;flex-direction:column;gap:clamp(16px,1.6vw,28px);min-width:0;}
.offer-image{flex:none;width:clamp(120px,13vw,200px);align-self:stretch;position:relative;overflow:hidden;border-radius:var(--radius);
  transform-origin:100% 0;clip-path:inset(50% round var(--radius));transition:clip-path .5s var(--ease),transform .5s var(--ease);}
.offer-image img{width:100%;height:100%;object-fit:cover;display:block;}
.offer:not(.active) .offer-image{transform:scale(0);}
.offer.active .offer-image{clip-path:inset(0% round var(--radius));transform:scale(1);}
.offer-bottom{margin-top:auto;display:flex;flex-direction:column;gap:clamp(16px,1.6vw,24px);}
.offer-details{display:flex;flex-direction:column;}
.offer-detail{display:flex;justify-content:space-between;align-items:center;gap:1rem;border-top:1px solid rgba(255,255,255,.12);padding:clamp(12px,1.15vw,17px) 0;}
.offer-detail .kicker{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.55);white-space:nowrap;}
.offer-detail .kicker:last-child{color:rgba(255,255,255,.9);}

/* grid: right-align section-head leads to the grid right edge + work item gap on token */
.sec-head-r{text-align:right;}
.work-list{gap:var(--space-block);}

@media (max-width:859px){
  .offers{height:auto;}
  .offer-head{flex-direction:column;gap:clamp(18px,4vw,24px);}
  .offer-image{width:100%;align-self:auto;aspect-ratio:16/9;clip-path:none!important;transform:none!important;}
  .offer-detail{padding:clamp(11px,3vw,15px) 0;}
}

/* hero benefits (moved from system) — above the VSL, connected to the scroll-hint */
.hero-benefits{display:flex;flex-wrap:wrap;gap:clamp(16px,2vw,32px);margin-top:clamp(22px,2.6vw,36px);}
@media (max-width:767px){ .sec-head-r{text-align:left;} .hero-benefits{gap:14px;} }

/* ═══════════ OFFER v3 — joined cards · one violet accent · bg hierarchy · simplified · cursor-arrow ═══════════ */
.offers{gap:0;height:clamp(800px,max(82vh,57vw),900px);border-radius:var(--radius-lg);overflow:hidden;}   /* min vyska vazana i na sirku: obsah karty roste s vw (obrazek 24vw, fonty), 82vh na 14" MBP (<980px) padalo na 800px min -> „Investice" bez spodniho paddingu */
.offer{border-radius:0;border:none;border-right:1px solid rgba(255,255,255,.07);}
.offer:last-child{border-right:none;}
.offer:nth-child(1){background-color:#1a1626;}                 /* primary, lightest (violet-tinted) */
.offer:nth-child(2){background-color:#15131c;}
.offer:nth-child(3){background-color:#111016;}                 /* darkest */
.offer.active{background-image:radial-gradient(130% 120% at 0% 0%,rgba(124,92,255,.20),transparent 52%);}  /* expanded glows with brand */

/* one violet accent — collapsed = white, active = violet (glows) */
.offer .tag.simple-style{border-color:rgba(124,92,255,.55);color:var(--accent-text);transition:color .4s var(--ease),border-color .4s var(--ease);}
.offer:not(.active) .tag.simple-style{border-color:rgba(255,255,255,.28);color:rgba(255,255,255,.72);}

.offer-tags{flex-wrap:nowrap;}                                 /* badges stay in a row, fixed position */
.offer-title{font-size:clamp(2rem,2.9vw,3.3rem);}             /* bigger display title */
.offer-image{width:clamp(150px,17vw,280px);align-self:stretch;border-radius:var(--radius);}  /* wider (Yugen 17.5vw) */
.offer-inner{gap:clamp(20px,2vw,32px);}
.offer-desc{max-width:38ch;}
.offer-details{margin-top:auto;}                               /* full-width lines, sunk to bottom */
.offer-desc,.offer-details,.offer-cta-m{opacity:0;transition:opacity .4s var(--ease);}
.offer.active .offer-desc,.offer.active .offer-details,.offer.active .offer-cta-m{opacity:1;transition-delay:.16s;}
.offer-cta-m{display:none;}                                    /* desktop: whole card clickable + cursor circle */

@media (max-width:859px){
  .offers{gap:14px;height:auto;border-radius:0;overflow:visible;}
  .offer{border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-lg);}
  .offer-head{opacity:1;}
  .offer:not(.active) .tag.simple-style{border-color:rgba(124,92,255,.45);color:var(--accent-text);}
  .offer-desc,.offer-details,.offer-cta-m{opacity:1!important;}
  .offer-cta-m{display:inline-flex;margin-top:clamp(10px,2.5vw,16px);}
  .offer-image{width:100%;align-self:auto;aspect-ratio:16/9;}
  .offer-title{font-size:clamp(1.7rem,7vw,2.4rem);}
}

/* heading sizing — unify .h-statement to the section H2 size (no 59 vs 47 mismatch) */
.h-statement{font-size:var(--fs-h2);}

/* ═══ system image ~18% shorter (less gap to process points) + benefits back in system ═══ */
.sys-media{aspect-ratio:16/8.2;}
@media (max-width:899px){.sys-media{aspect-ratio:16/10;}}

/* ═══ work — center the divider line between items (equal space above & below) ═══ */
.work-item{gap:clamp(40px,4.5vw,72px);}    /* work-block → divider */
.work-list{gap:clamp(40px,4.5vw,72px);}    /* divider → next work-block — equal ⇒ line centered */

/* ═══════════ OFFER refine v2 — readable details · prominent price · 16:9 wider image · radius · tighter offer→FAQ ═══════════ */
/* detail rows: labels + values ≥16px (was 11px) + more breathing */
.offer-detail{padding:clamp(15px,1.4vw,21px) 0;align-items:baseline;}
.offer-detail .kicker{font-size:1rem;letter-spacing:.03em;}
.offer-detail .kicker:last-child{color:#fff;}
/* price = last detail-row value: prominent display, readable (h3-ish);
   center místo baseline + pevná line-height, ať řádek drží stejný rytmus jako ostatní */
.offer-details .offer-detail:last-child{align-items:center;}
.offer-details .offer-detail:last-child .kicker:last-child{
  font-family:var(--display);text-transform:none;letter-spacing:-.01em;line-height:1.15;
  font-size:clamp(1.4rem,1.7vw,1.8rem);font-weight:600;color:#fff;white-space:normal;text-align:right;}

/* image: true 16:9, wider (Yugen-like), matching radius */
.offer-image{width:clamp(230px,24vw,380px);aspect-ratio:16/9;align-self:flex-start;border-radius:var(--radius);}
.offer.active .offer-image{clip-path:inset(0% round var(--radius));}

/* offer block radius — unified surface radius (== navbar / cards / media) */
.offers{border-radius:var(--radius-lg);}

/* same-bg adjacent sections (offer→FAQ both .light): kill doubled-padding void */
.section.light:has(+ .section.light){padding-bottom:var(--space-block);}
.section.light + .section.light{padding-top:var(--space-block);}

/* mobile re-assert */
@media (max-width:859px){
  .offers{border-radius:0;}
  .offer-image{width:100%;align-self:auto;aspect-ratio:16/9;}
  .offer-detail{flex-wrap:wrap;gap:2px 1rem;}
  .offer-detail .kicker{font-size:.92rem;white-space:normal;}
  .offer-details .offer-detail:last-child .kicker:last-child{font-size:clamp(1.35rem,5.2vw,1.7rem);}
}

/* ═══════════ HERO eyebrow with social-proof avatars (Yugen-style) + staggered reveal ═══════════ */
.hero-eyebrow{display:inline-flex;align-items:center;gap:13px;justify-content:center;flex-wrap:wrap;}
.eyebrow-avatars{display:inline-flex;flex:none;}
.eyebrow-avatars img{width:30px;height:30px;border-radius:50%;border:2px solid rgba(10,10,12,.85);object-fit:cover;margin-left:-11px;
  opacity:0;transform:scale(.3) translateY(3px);transition:opacity .55s var(--ease),transform .55s var(--ease);}
.eyebrow-avatars img:first-child{margin-left:0;}
.hero-eyebrow.is-in .eyebrow-avatars img{opacity:1;transform:scale(1) translateY(0);}
.hero-eyebrow.is-in .eyebrow-avatars img:nth-child(1){transition-delay:.10s;}
.hero-eyebrow.is-in .eyebrow-avatars img:nth-child(2){transition-delay:.18s;}
.hero-eyebrow.is-in .eyebrow-avatars img:nth-child(3){transition-delay:.26s;}
.hero-eyebrow.is-in .eyebrow-avatars img:nth-child(4){transition-delay:.34s;}

/* hero button → benefits breathing (uses spacing system) */
.hero-ctas{margin-bottom:0;}
.hero-benefits{margin-top:var(--space-2xl);}

/* ═══ offer head — Yugen: tags top · title bottom-aligned with image bottom · breathing before desc ═══ */
.offer-head{align-items:stretch;margin-bottom:clamp(10px,1.3vw,22px);}
.offer-head-text{justify-content:space-between;}

/* ═══ footer breathing — eyebrow → heading gap opened up (spacing system) ═══ */
.footer-eyebrow{margin-bottom:clamp(32px,4.5vw,68px);}

/* mobile eyebrow — compact + left-aligned to match the left-aligned mobile hero */
@media (max-width:600px){
  .hero-eyebrow{font-size:.72rem;letter-spacing:.05em;gap:9px;justify-content:flex-start;}
  .eyebrow-avatars img{width:26px;height:26px;margin-left:-9px;}
}

/* mobile eyebrow — stack avatars above the (wrapping) text so the long line never overflows */
@media (max-width:600px){
  .hero-eyebrow{flex-direction:column;align-items:flex-start;gap:11px;width:100%;}
  .eyebrow-text{text-align:left;max-width:30ch;line-height:1.5;}
}

/* hero eyebrow tweaks — avatars to the RIGHT · larger · accent-colour ring (Yugen-style) */
.eyebrow-avatars{order:2;}
.eyebrow-avatars img{width:38px;height:38px;border:2px solid var(--accent);margin-left:-12px;}
@media (max-width:600px){
  .eyebrow-avatars{order:0;}
  .eyebrow-avatars img{width:32px;height:32px;margin-left:-10px;}
}

/* ═══════════ #problem — text + balanced visual (top) · scroll-fill statement (centered, below) ═══════════ */
.reframe-top{display:grid;grid-template-columns:1fr;gap:clamp(30px,6vw,44px);align-items:center;}
@media (min-width:900px){.reframe-top{grid-template-columns:1.05fr 0.92fr;column-gap:clamp(40px,5vw,72px);align-items:center;}}
.reframe-text .h-statement{max-width:18ch;}
.reframe-media{position:relative;overflow:hidden;border-radius:var(--radius-lg);background:var(--surface);aspect-ratio:4/5;}
.reframe-media video,.reframe-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;display:block;}
@media (min-width:900px){.reframe-media{aspect-ratio:1/1;height:auto;min-height:0;}}
.u-vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.reframe-media img{width:100%;height:100%;object-fit:cover;display:block;}
@media (prefers-reduced-motion:reduce){.reframe-media{clip-path:none!important;}}

/* hide the default hand cursor wherever the custom arrow bubble appears (work · offer · sys-media) */
@media (hover:hover){ [data-cursor-arrow]{cursor:none;} }

/* hero bottom — balance the scroll cue: shorter line centered between benefits & VSL */
.scroll-hint{margin-top:clamp(24px,2.9vh,30px);}
.scroll-hint .ln{height:clamp(44px,5.2vh,58px);}

/* hero sub — emphasise the system name */
.hero-sub .hl{color:#fff;font-weight:600;}

/* #problem visual — reverted from tall portrait to a balanced ratio that sits with the paragraph */

/* scroll bar — a touch longer (closer to original) + rebalanced gaps */
.scroll-hint{margin-top:clamp(16px,2.2vh,24px);}
.scroll-hint .ln{height:clamp(58px,6.8vh,76px);}

/* ═══ hero — more breathing between elements (was cramped 24/24/32/…/20) ═══ */
.hero-eyebrow{margin-bottom:clamp(30px,2.7vw,42px);}   /* eyebrow → H1  (24 → ~40) */
.hero .h-hero{margin-bottom:clamp(30px,2.7vw,42px);}   /* H1 → sub      (24 → ~40) */
.hero-sub{margin-bottom:clamp(34px,3vw,46px);}         /* sub → CTAs    (32 → ~44) */
.scroll-hint{margin-top:clamp(24px,2.4vh,30px);}       /* benefits → scroll (20 → ~26) */

/* hero H1 — cap so big screens stay big (not 5-line tall); laptop already smaller via 5vw */
:root{--fs-hero:clamp(2.8rem,5vw,7rem);}            /* cap 112px */
@media (min-width:1700px){ .hero-inner{max-width:68rem;} }   /* a touch wider content on large desktops */

/* H1 a touch smaller (user @1800px viewport was 90px → ~77px) + balanced sub line-wrap */
:root{--fs-hero:clamp(2.8rem,4.3vw,6.5rem);}
.hero-sub{text-wrap:balance;}

/* VSL region spacing — unify VSL→proof and proof→problem to one tight value (was 112 / 184) */
.vsl-block{margin-bottom:calc(var(--space-section-tight) + var(--space-sm) + 64px);}     /* VSL → CTA(--space-sm + 64px) → proof = --space-section-tight */
.proof + .reframe{padding-top:var(--space-section-tight);} /* proof → problem = 120 (was 184) */

/* ════════════════════════════════════════════════════════════════════════
   QUALIFY FORM — fullscreen Typeform-style overlay (design-system native)
   ════════════════════════════════════════════════════════════════════════ */
.qf{position:fixed;inset:0;z-index:12000;background:var(--bg);display:flex;flex-direction:column;
  opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s var(--ease);overflow:hidden;}
.qf.open{opacity:1;visibility:visible;}
.qf-glow{position:absolute;top:-20%;left:50%;width:90vw;max-width:1100px;height:60vh;transform:translateX(-50%);
  background:radial-gradient(60% 60% at 50% 0%,rgba(124,92,255,.16),transparent 70%);pointer-events:none;}
/* top bar: brand · counter · close */
.qf-top{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;
  padding:clamp(16px,2.2vw,26px) clamp(18px,3vw,40px);flex:none;}
.qf-brand{font-family:var(--display);font-weight:600;font-size:1.05rem;letter-spacing:-.01em;color:var(--ink);}
.qf-count{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;}
.qf-close{width:42px;height:42px;border-radius:var(--radius-pill);border:1px solid var(--line);background:rgba(255,255,255,.03);
  color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:.3s var(--ease);}
.qf-close:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2);transform:rotate(90deg);}
.qf-close svg{width:16px;height:16px;}
/* progress bar */
.qf-bar{position:relative;z-index:3;height:3px;background:rgba(255,255,255,.07);flex:none;margin:0 clamp(18px,3vw,40px);border-radius:var(--radius-pill);overflow:hidden;}
.qf-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-text));border-radius:var(--radius-pill);transition:width .5s var(--ease3);}
/* stage */
.qf-stage{position:relative;z-index:2;flex:1;display:flex;align-items:center;justify-content:center;padding:clamp(20px,4vh,48px) clamp(20px,4vw,40px);overflow-y:auto;}
.qf-step{display:none;width:100%;max-width:680px;}
.qf-step.is-active{display:block;animation:qfIn .55s var(--ease3);}
@keyframes qfIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.qf-eyebrow{font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text);margin-bottom:clamp(14px,1.6vw,20px);display:flex;align-items:center;gap:10px;}
.qf-eyebrow::before{content:"";width:22px;height:1px;background:var(--accent);}
.qf-q{font-family:var(--display);font-weight:600;letter-spacing:-.02em;line-height:1.08;color:var(--ink);font-size:clamp(1.6rem,3.4vw,2.5rem);}
.qf-help{margin-top:clamp(12px,1.4vw,18px);color:var(--muted);font-size:clamp(.98rem,1.1vw,1.1rem);line-height:1.55;max-width:46ch;}
.qf-help b{color:var(--ink);font-weight:600;}
/* options */
.qf-opts{margin-top:clamp(24px,3vw,38px);display:flex;flex-direction:column;gap:12px;}
.qf-opt{display:flex;align-items:center;gap:16px;width:100%;text-align:left;padding:clamp(15px,1.5vw,20px) clamp(16px,1.6vw,22px);
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);color:var(--ink);cursor:pointer;
  font-family:var(--body);font-size:clamp(1rem,1.15vw,1.12rem);font-weight:500;transition:border-color .25s var(--ease),background .25s var(--ease),transform .25s var(--ease);}
.qf-opt:hover{border-color:rgba(124,92,255,.5);background:var(--surface-2);transform:translateX(4px);}
.qf-opt-key{flex:none;width:30px;height:30px;border-radius:var(--radius);border:1px solid var(--line);display:grid;place-items:center;
  font-family:var(--mono);font-size:.82rem;color:var(--muted);transition:.25s var(--ease);}
.qf-opt-tx{flex:1;}.qf-opt-tx small{display:block;margin-top:3px;color:var(--muted);font-size:.86rem;font-weight:400;}
.qf-opt-tick{flex:none;width:22px;height:22px;border-radius:var(--radius-pill);border:1px solid var(--line);display:grid;place-items:center;opacity:0;transition:.25s var(--ease);}
.qf-opt-tick svg{width:12px;height:12px;color:#fff;}
.qf-opt.selected{border-color:var(--accent);background:rgba(124,92,255,.10);}
.qf-opt.selected .qf-opt-key{background:var(--accent);border-color:var(--accent);color:#fff;}
.qf-opt.selected .qf-opt-tick{opacity:1;background:var(--accent);border-color:var(--accent);}
/* text inputs */
.qf-field{margin-top:clamp(24px,3vw,36px);}
.qf-input,.qf-textarea{width:100%;background:transparent;border:0;border-bottom:2px solid var(--line);color:var(--ink);
  font-family:var(--display);font-weight:500;font-size:clamp(1.3rem,2.2vw,1.9rem);padding:10px 2px;transition:border-color .3s var(--ease);}
.qf-input::placeholder,.qf-textarea::placeholder{color:rgba(140,140,147,.55);}
.qf-input:focus,.qf-textarea:focus{outline:none;border-color:var(--accent);}
.qf-textarea{resize:none;line-height:1.35;min-height:3.4em;font-size:clamp(1.15rem,1.8vw,1.5rem);}
.qf-grid2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.5vw,34px);}
.qf-lbl{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;display:block;}
.qf-err{color:#FF6B6B;font-size:.85rem;margin-top:10px;min-height:1em;}
/* nav */
.qf-nav{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:14px;flex:none;
  padding:clamp(16px,2vw,24px) clamp(18px,3vw,40px);border-top:1px solid var(--line-2);}
.qf-back{display:inline-flex;align-items:center;gap:8px;background:none;border:0;color:var(--muted);font-family:var(--body);font-weight:500;font-size:.95rem;cursor:pointer;padding:8px 4px;transition:color .25s;}
.qf-back:hover{color:var(--ink);}.qf-back svg{width:15px;height:15px;}
.qf-back[hidden]{visibility:hidden;}
.qf-hint{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;opacity:.7;}
@media (max-width:600px){.qf-hint{display:none;}}
/* result screens */
.qf-res{text-align:center;max-width:620px;margin-inline:auto;}
.qf-res-ic{width:64px;height:64px;border-radius:var(--radius-pill);display:grid;place-items:center;margin:0 auto clamp(20px,2.5vw,30px);
  background:rgba(124,92,255,.14);border:1px solid rgba(124,92,255,.3);color:var(--accent-text);}
.qf-res-ic svg{width:28px;height:28px;}
.qf-res .qf-q{font-size:clamp(1.8rem,3.6vw,2.8rem);}
.qf-res .qf-help{margin-inline:auto;text-align:center;}
.qf-res-cta{margin-top:clamp(26px,3vw,38px);display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.qf-cal{margin-top:clamp(24px,3vw,34px);width:100%;height:min(560px,60vh);border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;color:var(--muted);font-family:var(--mono);font-size:.8rem;letter-spacing:.06em;}
@media (max-width:600px){.qf-grid2{grid-template-columns:1fr;}.qf-opt{gap:13px;}.qf-opt-key{display:none;}}

/* ═══ qualify form — living violet ambiance (subtle drifting blobs) ═══ */
.qf-blob{position:absolute;z-index:0;border-radius:50%;filter:blur(72px);pointer-events:none;will-change:transform;}
.qf-blob.b1{width:46vw;height:46vw;left:-8vw;top:6vh;background:radial-gradient(circle,rgba(124,92,255,.5),transparent 62%);opacity:.5;animation:qfDrift1 24s var(--ease) infinite alternate;}
.qf-blob.b2{width:40vw;height:40vw;right:-7vw;top:34vh;background:radial-gradient(circle,rgba(158,132,255,.45),transparent 60%);opacity:.42;animation:qfDrift2 30s var(--ease) infinite alternate;}
.qf-blob.b3{width:36vw;height:36vw;left:32vw;bottom:-14vh;background:radial-gradient(circle,rgba(124,92,255,.4),transparent 60%);opacity:.38;animation:qfDrift3 27s var(--ease) infinite alternate;}
@keyframes qfDrift1{from{transform:translate(0,0) scale(1)}to{transform:translate(9vw,7vh) scale(1.18)}}
@keyframes qfDrift2{from{transform:translate(0,0) scale(1.12)}to{transform:translate(-8vw,9vh) scale(.92)}}
@keyframes qfDrift3{from{transform:translate(0,0) scale(.95)}to{transform:translate(6vw,-8vh) scale(1.22)}}
@media (prefers-reduced-motion:reduce){.qf-blob{animation:none!important;}}
/* product (Webdesign Hero) result — photo background (placeholder image, swap later) */
.qf-photo{position:absolute;inset:0;z-index:0;opacity:0;transition:opacity .8s var(--ease);pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,12,.74),rgba(10,10,12,.9)),url("../img/67aa187aa9eab3e972aed676_wins-1-min.webp") center/cover no-repeat;}
.qf.qf-product .qf-photo{opacity:1;}
.qf.qf-product .qf-blob{opacity:.18;}
/* Cal.com inline embed container (replaces the placeholder) */
.qf-cal{display:block;overflow:hidden;}
.qf-cal #my-cal-inline-15min{width:100%;height:100%;}

/* ═══ qualify form — balanced question wrapping + living particle bg + film grain ═══ */
.qf-q, .qf-help{text-wrap:balance;}
.qf-canvas{position:absolute;inset:0;z-index:1;pointer-events:none;}
.qf.qf-product .qf-canvas{opacity:.28;}
.qf-grain{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* offer — more breathing between the image and the desc + tighter desc (clears the visual) */
.offer-head{margin-bottom:clamp(24px,2.6vw,44px);}
.offer-desc{max-width:35ch;}

/* offer — head→desc gap dialed back (was overflowing Founder DNA) + smooth title during accordion */
.offer-head{margin-bottom:clamp(6px,0.8vw,14px);}
.offer-title{transition:opacity .45s var(--ease);}

/* qualify form — a touch more line-height on headings (breathing) */
.qf-q{line-height:1.16;}

/* mobile — kill stray horizontal overflow (decorative glows / proof slider / marquee bleed inflating the viewport) */
html,body{overflow-x:clip;}

/* ============ eyebrow tracking + footer CTA contrast + booking cursor + mobile eyebrow fit ============ */
/* tighter, consistent tracking across hero + sections + footer eyebrows */
.eyebrow,.footer-eyebrow,.footer-col-title,.hero-eyebrow{letter-spacing:.105em;}
/* footer "Rezervovat hovor" — brighter violet so it pops as the booking CTA */
.footer-links-list a.footer-book{color:#B9A4FF;}
.footer-links-list a.footer-book:hover{color:#D6CBFF;}
/* booking cursor label hides the native cursor */
[data-cursor-label]{cursor:none;}
/* mobile — hero eyebrow must fit (was forcing a ~500px min-width floor → broke form/page on phones) */
@media (max-width:600px){
  .hero-eyebrow{font-size:.75rem;letter-spacing:.05em;gap:8px;max-width:100%;}
  .hero-eyebrow .eyebrow-text{min-width:0;}
}

/* ============ booking cursor bubble — variant of .cursor.label: bigger, arrow, gentle beacon pulse ============ */
@keyframes cursor-beacon{
  0%{box-shadow:0 0 0 0 rgba(124,92,255,.42);}
  70%{box-shadow:0 0 0 18px rgba(124,92,255,0);}
  100%{box-shadow:0 0 0 0 rgba(124,92,255,0);}
}
.cursor.label.book{
  display:inline-flex;align-items:center;gap:.5em;overflow:visible;
  font-size:var(--fs-body);font-weight:600;letter-spacing:-.005em;padding:13px 22px;
  animation:cursor-beacon 1.9s var(--ease) infinite;
}
.cursor.label.book::after{
  content:"";width:.82em;height:.82em;flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 12 12 4M5 4h7v7' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
@media (prefers-reduced-motion:reduce){.cursor.label.book{animation:none;}}

/* ===== Cal embed (qualified result) — responsive container that grows to the iframe + traveling light highlight ===== */
@property --wh-p{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes whtravel{0%{--wh-p:0deg;opacity:0}20%{opacity:.85}80%{opacity:.85}100%{--wh-p:180deg;opacity:0}}
.qf-cal{position:relative;width:100%;height:auto;min-height:0;margin-top:clamp(22px,2.6vw,32px);background:var(--surface);border:1px solid rgba(255,255,255,.13);border-radius:14px;padding:clamp(8px,1.6vw,12px);box-shadow:0 0 40px rgba(124,92,255,.07);display:block;overflow:visible;place-items:initial;color:inherit;}
.qf-cal::before,.qf-cal::after{content:"";position:absolute;inset:0;border-radius:14px;padding:1.5px;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:whtravel 3.6s ease-in-out infinite;}
.qf-cal::before{background:conic-gradient(from 0deg,transparent calc(var(--wh-p) - 30deg),rgba(207,194,255,.95) var(--wh-p),transparent calc(var(--wh-p) + 30deg));}
.qf-cal::after{background:conic-gradient(from 0deg,transparent calc(360deg - var(--wh-p) - 30deg),rgba(207,194,255,.95) calc(360deg - var(--wh-p)),transparent calc(360deg - var(--wh-p) + 30deg));}
.qf-cal #my-cal-inline-15min{width:100%;height:auto;min-height:560px;border-radius:12px;overflow:visible;transition:min-height .3s ease;}
@media (max-width:600px){.qf-cal{padding:6px;}}
@media (prefers-reduced-motion:reduce){.qf-cal::before,.qf-cal::after{animation:none;opacity:0;}}

/* qualify form — per-field contact validation: error under the right field + invalid highlight */
.qf-cf{min-width:0;}
.qf-input.is-invalid,.qf-input.is-invalid:focus{border-color:#FF6B6B;}

/* ===== mobile open-nav menu (burger overlay, 50/50 columns) ===== */
.nav-menu{position:fixed;inset:0;z-index:190;background:var(--bg);opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility 0s linear .45s;display:flex;flex-direction:column;padding:calc(64px + env(safe-area-inset-top)) var(--pad) calc(34px + env(safe-area-inset-bottom));}
body.nav-open .nav-menu{opacity:1;visibility:visible;transition:opacity .45s var(--ease);}
.nav-menu-inner{margin-top:auto;display:flex;flex-direction:column;gap:34px;transform:translateY(18px);opacity:0;transition:transform .55s var(--ease) .06s,opacity .55s var(--ease) .06s;}
body.nav-open .nav-menu-inner{transform:none;opacity:1;}
.nav-menu-cols{display:grid;grid-template-columns:1fr 1fr;gap:30px 18px;}
.nav-menu-label{display:block;font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:18px;}
.nav-menu-col a,.nav-menu-socials a{display:block;font-size:1.55rem;font-weight:500;letter-spacing:-.02em;color:var(--ink);line-height:1.12;padding:6px 0;}
.nav-menu-foot{display:flex;flex-direction:column;gap:26px;padding-top:30px;margin-top:30px;border-top:1px solid var(--line);}
.nav-menu-cta{width:100%;height:58px;justify-content:center;font-size:1rem;}
.nav-burger{position:relative;z-index:201;}
body.nav-open .nav-burger span:nth-child(1){transform:translateY(3.25px) rotate(45deg);}
body.nav-open .nav-burger span:nth-child(2){transform:translateY(-3.25px) rotate(-45deg);}
@media (min-width:601px){.nav-menu{display:none;}}

/* ===== HERO mobile — eyebrow centered (avatars on top), equal full-width CTAs, symmetric benefits ===== */
@media (max-width:600px){
  .hero-eyebrow{flex-direction:column;gap:11px;font-size:.72rem;letter-spacing:.1em;text-align:center;max-width:100%;}
  .hero-eyebrow .eyebrow-text{order:2;min-width:0;}
  .hero-eyebrow .eyebrow-avatars{order:1;}
  .eyebrow-avatars img{width:31px;height:31px;}
  .hero-ctas{flex-direction:column;align-items:stretch;width:100%;gap:12px;}
  .hero-ctas .btn{width:100%;}
  .hero-benefits{flex-direction:column;align-items:center;gap:15px;margin-top:clamp(20px,5vw,30px);}
}

/* ===== VSL mobile — portrait 9:16, ~72% of viewport, centered ===== */
@media (max-width:600px){
  .vsl-block{padding:0;margin-bottom:var(--space-section-tight);}  /* mobil: CTA je uvnitř boxu VSL, dole jen sekční rytmus */
  .vsl-straddle{aspect-ratio:9/16;width:calc(100% - 2*var(--pad));max-width:none;height:auto;margin-inline:auto;border-radius:var(--radius-lg);overflow:hidden;}
  .vsl-straddle video{object-position:center;transform:none!important;}
  .vsl-straddle .vsl-vimeo{width:100%;aspect-ratio:9/16;}
}

/* ===== OFFERS mobile — clean stacked cards: badges wrap, full-width buttons, fitting titles, free-tier italic ===== */
.offer-detail .free{font-style:italic;color:var(--accent-text);font-weight:500;}
@media (max-width:600px){
  .offer-tags{flex-wrap:wrap!important;gap:7px;}
  .offer-title{font-size:clamp(1.55rem,7vw,2.05rem);line-height:1.05;}
  .offer-inner{padding:22px 20px;gap:17px;}
  .offer-image{aspect-ratio:2/1;}                     /* nižší vizuál jako Yugen — široký pás, ne blok */
  .offer-desc{font-size:var(--fs-body);line-height:1.45;}
  .offer-cta-m{display:inline-flex!important;width:100%;justify-content:center;height:54px;margin-top:6px;font-size:16px;font-weight:600;}
  .offer-details .offer-detail:last-child .kicker:last-child{font-size:clamp(1.25rem,6vw,1.6rem);white-space:normal;text-align:right;}
}

/* ===== FOOTER bottom — copyright + cities stacked left, "back to top" inline right ===== */
.footer-bottom-l{display:flex;flex-direction:column;gap:6px;}
@media (max-width:720px){ .footer-bottom{flex-direction:row;align-items:flex-end;gap:16px;} }
/* process CTA — breathing room so it doesn't blend with the divider line */
.process-cta{margin-bottom:clamp(12px,2.6vw,24px);}
/* work — "Spolupracoval jsem s:" centered */
.logos-band .wrap{text-align:center;}
.logos-eyebrow{justify-content:center;}

/* ===== FOOTER nav — keep 50/50 columns on mobile (Yugen-style) ===== */
@media (max-width:600px){
  .footer-nav-grid{display:grid!important;grid-template-columns:1fr 1fr;gap:28px 16px;}
  .footer-links-list a{font-size:1.02rem;}
}

/* ===== OFFERS mobile — tap-to-expand accordion (collapsed: badges+title+image; tap → desc+details+CTA, smooth) ===== */
@media (max-width:600px){
  .offer .absolute-link{display:none;}                 /* card tap = expand, not open form */
  .offer{cursor:pointer;}
  .offer-inner{position:relative;gap:0;}
  .offer-body{display:grid;grid-template-rows:0fr;opacity:0;transform:none;margin-top:0;transition:grid-template-rows .5s var(--ease),opacity .4s var(--ease),margin-top .5s var(--ease);}
  .offer.active .offer-body{grid-template-rows:1fr;opacity:1;margin-top:16px;}
  .offer-body-in{overflow:hidden;min-height:0;display:flex;flex-direction:column;gap:16px;}
  .offer-inner::after{content:"";position:absolute;top:24px;right:20px;width:10px;height:10px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .4s var(--ease);pointer-events:none;}
  .offer.active .offer-inner::after{transform:rotate(-135deg);}
  .offer-head-text{padding-right:24px;}
}

/* ===== SYSTEM benefits mobile — symmetric vertical stack (left-aligned to the section) ===== */
@media (max-width:600px){
  .sys-benefits{flex-direction:column;align-items:flex-start;gap:14px;}
}

/* ===== mobile nav menu v2 — single column (Yugen): 36px links → divider → socials → divider → CTA ===== */
.nav-menu{justify-content:flex-start;padding:calc(82px + env(safe-area-inset-top)) var(--pad) calc(34px + env(safe-area-inset-bottom));}
.nav-menu-inner{margin-top:0;display:flex;flex-direction:column;gap:0;width:100%;transform:translateY(16px);opacity:0;transition:transform .55s var(--ease) .06s,opacity .55s var(--ease) .06s;}
body.nav-open .nav-menu-inner{transform:none;opacity:1;}
.nav-menu-links{display:flex;flex-direction:column;align-items:flex-start;gap:0;}
.nav-menu-links a{display:block;font-size:2.25rem;font-weight:500;letter-spacing:-.02em;line-height:1.16;color:var(--ink);padding:4px 0;}
.nav-menu-divider{height:1px;width:100%;background:var(--line);margin:26px 0;}
.nav-menu-socials{display:flex;flex-direction:column;align-items:flex-start;gap:9px;}
.nav-menu-socials a{display:block;font-size:1.05rem;font-weight:500;color:var(--muted);padding:3px 0;}
.nav-menu-cta{width:100%;height:60px;justify-content:center;font-size:1rem;margin-top:4px;}

/* ===== HERO mobile v2 — force-center eyebrow (was left-aligned @390px), clean CTAs ===== */
@media (max-width:600px){
  .hero-eyebrow{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;text-align:center;gap:11px;}
  .hero-eyebrow .eyebrow-avatars{order:1;align-self:center;}
  .hero-eyebrow .eyebrow-text{order:2;min-width:0;max-width:32ch;align-self:center;}
  .hero-ctas .btn{width:100%;justify-content:center;}
  .hero-benefits{flex-direction:column;align-items:center;gap:15px;}
}

/* ===== VSL — fill video (cover, no letterbox) + centered play/unmute button (badge removed) ===== */
.vsl-straddle video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.vsl-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:3;width:72px;height:72px;border-radius:50%;background:rgba(124,92,255,.92);display:grid;place-items:center;pointer-events:none;box-shadow:0 12px 40px rgba(0,0,0,.45);transition:opacity .4s var(--ease),transform .4s var(--ease);}
.vsl-play svg{width:26px;height:26px;margin-left:4px;color:#fff;}
.vsl-straddle.is-unmuted .vsl-play{opacity:0;transform:translate(-50%,-50%) scale(.7);}

/* VSL mobile — placeholder showreel has baked-in letterbox bars; zoom to crop them (real 9:16 VSL won't need this) */
@media (max-width:600px){
  .vsl-straddle{overflow:hidden;}
  .vsl-straddle video{transform:scale(1.62);transform-origin:center;}
}

/* ===== PROCESS mobile — real breathing room below each step's content before the divider line ===== */
@media (max-width:600px){
  .process-step{padding:34px 0 clamp(42px,10vw,60px);}
  .process-step:first-child{padding-top:0;}
  .process-step:last-child{padding-bottom:0;}
  .process-cta{margin-top:28px;margin-bottom:0;}
}
/* ===== eyebrow spacing — system section eyebrow→heading matches the .sec-head sections ===== */
.sys-intro .eyebrow{margin-bottom:var(--space-sm);}

/* ===== FOOTER bottom — balanced (Yugen): desktop one row; mobile cities on top, copyright + back-to-top balanced row ===== */
.footer-bottom-row{display:contents;}
@media (max-width:720px){
  .footer-bottom{flex-direction:column;align-items:stretch;gap:16px;}
  .footer-bottom-row{display:flex;justify-content:space-between;align-items:center;gap:16px;}
}
/* footer nav — a touch bigger + readable on mobile */
@media (max-width:600px){
  .footer-links-list a{font-size:1.18rem;font-weight:500;color:#D8D5D0;}
}
/* ===== SERVICE CARD mobile — even vertical rhythm (per grid), no clamped bottom ===== */
@media (max-width:600px){
  .offer-inner{padding:clamp(22px,5.5vw,26px);gap:0;}
  .offer-head{gap:18px;}
  .offer-head-text{gap:14px;}
  .offer.active .offer-body{margin-top:18px;}
  .offer-body-in{gap:18px;}
  .offer-detail{padding:13px 0;}
}

/* ===== OFFERS mobile — expanded cards, single violet accent (mint/amber tier tints removed) ===== */
@media (max-width:600px){
  /* fully expanded, no collapse, no chevron */
  .offer-body{display:block!important;opacity:1!important;margin-top:18px;}
  .offer-body-in{overflow:visible;}
  .offer-inner::after{content:none!important;}
  /* every card shows its tier tag colour */
  .offer .tag.simple-style{border-color:rgba(var(--tier),.45)!important;color:rgba(var(--tier),.95)!important;}
}
/* ===== HERO eyebrow — truly centered text ===== */
@media (max-width:600px){
  .hero-eyebrow .eyebrow-text{text-align:center;text-wrap:balance;width:100%;}
}
/* ===== LOGOS marquee — fit 3+ logos across 390px ===== */
@media (max-width:600px){
  .logo-wrap{width:30vw;padding:0 .55rem;}
  .logo-text{font-size:.95rem;}
}

/* ===== mobile nav menu v3 — glass morphism, more spacing from navbar, bigger socials, GSAP-driven ===== */
.nav-menu{background:rgba(10,10,12,.82);-webkit-backdrop-filter:blur(26px) saturate(1.35);backdrop-filter:blur(26px) saturate(1.35);padding-top:calc(112px + env(safe-area-inset-top));}
.nav-menu-inner{opacity:1!important;transform:none!important;transition:none!important;}
.nav-menu-divider{transform-origin:left center;margin:30px 0;}
.nav-menu-socials{gap:12px;}
.nav-menu-socials a{font-size:1.3rem;color:#A6A6AD;font-weight:500;}
.nav-menu-cta{margin-top:8px;}

/* ===== FAQ mobile — even top/bottom padding + controlled head→list gap ===== */
@media (max-width:600px){
  #faq{padding-top:clamp(58px,13vw,84px);padding-bottom:clamp(58px,13vw,84px);}
  #faq .sec-head{margin-bottom:clamp(34px,8vw,50px);}
  #faq .faq-list{margin-top:0;}
}

/* ===== BURGER — Yugen-style 3 lines (diagonal "sword cut" staircase) → X on open ===== */
.nav-burger{align-items:flex-end;gap:5px;}
.nav-burger span{height:1.6px;background:var(--ink);width:22px;border-radius:2px;transition:width .4s var(--ease),transform .45s var(--ease),opacity .3s var(--ease);transform-origin:center;margin-left:0;}
.nav-burger span:nth-child(1){width:22px;}
.nav-burger span:nth-child(2){width:17px;}
.nav-burger span:nth-child(3){width:12px;}
body.nav-open .nav-burger span:nth-child(1){width:22px;transform:translateY(6.6px) rotate(45deg);}
body.nav-open .nav-burger span:nth-child(2){width:0;opacity:0;}
body.nav-open .nav-burger span:nth-child(3){width:22px;transform:translateY(-6.6px) rotate(-45deg);}
/* ===== NAVBAR seamless into overlay — pill disappears, logo on grid (left), X on right ===== */
body.nav-open .nav-inner{background:transparent!important;border-color:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;padding-left:0!important;padding-right:0!important;}
/* ===== HERO reveal — faster + lighter on mobile (perf/conversions) ===== */
@media (max-width:600px){
  :root{--dur:.5s;}
  [data-anim]{transform:translate3d(0,11px,0);}
  [data-d="1"]{transition-delay:.04s}[data-d="2"]{transition-delay:.09s}[data-d="3"]{transition-delay:.14s}
  [data-d="4"]{transition-delay:.19s}[data-d="5"]{transition-delay:.24s}[data-d="6"]{transition-delay:.29s}
}
/* ===== HERO mobile — even vertical spacing of content ===== */
@media (max-width:600px){
  .hero-eyebrow{margin-bottom:clamp(24px,6vw,34px);}
  .h-hero{margin:0 0 clamp(22px,5.5vw,30px);}
  .hero-sub{margin-bottom:clamp(26px,6.5vw,36px);}
  .hero-ctas{margin-bottom:clamp(24px,6vw,34px);}
  .hero-benefits{margin-top:0;}
}

/* ===== OFFERS desktop REVERT — flatten the mobile offer-body wrapper so desktop accordion layout/gaps/margin-top:auto are untouched ===== */
.offer-body,.offer-body-in{display:contents;}
@media (max-width:600px){
  .offer-body{display:block;margin-top:18px;}
  .offer-body-in{display:flex;flex-direction:column;gap:18px;overflow:visible;}
  /* monochrome + violet only: secondary cards keep the neutral dark surface, tags stay brand violet */
  .offer .tag.simple-style{border-color:rgba(124,92,255,.45)!important;color:var(--accent-text)!important;}
}

/* ===== VSL play button — mobile only (remove on desktop) ===== */
@media (min-width:601px){ .vsl-play{display:none!important;} }
/* ===== OFFERS desktop — title scales smoothly with the card width (container query) → no choppy reflow ===== */
@media (min-width:601px){
  .offer{container-type:inline-size;}
  .offer-title{font-size:clamp(1.15rem,5.4cqw,3.3rem);transition:none;}
}

/* offers desktop — container on the head-text (title scales with its own column → consistent wrap, no reflow) */
@media (min-width:601px){
  .offer{container-type:normal;}
  .offer-head-text{container-type:inline-size;}
  .offer-title{font-size:clamp(1rem,13cqw,3.3rem);}
}

/* revert the container-query title experiment — back to original fixed title (no small/inconsistent titles) */
@media (min-width:601px){
  .offer{container-type:normal;}
  .offer-head-text{container-type:normal;}
  .offer-title{font-size:clamp(2rem,2.9vw,3.3rem);}
}

/* ===== FOOTER bottom mobile — cities box fit-content + centered, more breathing ===== */
@media (max-width:720px){
  .footer-status{align-self:center;width:fit-content;}
  .footer-bottom{gap:26px;}
  .footer-bottom-row{padding-top:2px;}
}

/* ===== FOOTER bottom mobile — pill evenly spaced: gap above (divider→pill) == gap below (pill→copyright) ===== */
@media (max-width:720px){
  .footer-bottom{padding-top:28px!important;gap:28px!important;padding-bottom:0;}
}

/* ===== HERO benefits mobile → pills (equal width, centered, icons aligned) + more rhythm ===== */
@media (max-width:600px){
  .hero-benefits{flex-direction:column;align-items:stretch;width:fit-content;max-width:90%;margin-left:auto;margin-right:auto;gap:12px;}
  .hero-benefits .sys-benefit{border:1px solid var(--line);background:rgba(255,255,255,.035);border-radius:var(--radius-pill);padding:12px 20px;justify-content:flex-start;}
  .hero-ctas{margin-bottom:clamp(32px,8vw,44px)!important;}
  .scroll-hint{margin-top:clamp(32px,8vw,44px)!important;}
}
/* ===== BURGER → overlay: logo slides left / burger slides right smoothly (transition the pill padding collapse) ===== */
.nav-inner{transition:background .4s var(--ease),border-color .4s var(--ease),padding .52s var(--ease);}

/* ===== mobile menu — Founder DNA pulsing beacon dot (after the text) + whiter dividers; re-enable desktop nav-dot beacon ===== */
.nav-menu-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--accent);position:relative;margin-left:14px;vertical-align:middle;}
.nav-menu-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--accent);animation:nav-pulse 1.8s var(--ease) infinite;}
.nav-menu-divider{background:rgba(255,255,255,.17);}
.nav-dot::after{display:block!important;}

/* menu beacon dot — match the desktop nav-dot exactly (colour + glow + pulse speed) */
.nav-menu-dot,.nav-menu-dot::after{background:#8E72FF;}
.nav-menu-dot{box-shadow:0 0 10px rgba(124,92,255,.9);}
.nav-menu-dot::after{animation-duration:1.5s;}

/* CORRECT — desktop nav-dot is the orange #FF7A1A "open bookings" beacon; match the menu dot to it */
.nav-menu-dot,.nav-menu-dot::after{background:#FF7A1A!important;}
.nav-menu-dot{box-shadow:0 0 9px rgba(255,122,26,.6)!important;}
.nav-menu-dot::after{animation-duration:1.6s!important;}

/* ===== VSL mobile conversion optimizer — sound top-right; bottom CTA reveals after 8s (generous margins) ===== */
@media (max-width:600px){
  .vsl-sound{top:14px;right:14px;bottom:auto;}
  .vsl-playpause{top:14px;left:14px;bottom:auto;}   /* zrcadlí sound vpravo nahoře — spodek boxu patří CTA */
  .vsl-cta{position:absolute;left:50%;top:auto;bottom:14px;transform:translate(-50%,16px);width:calc(100% - 2*var(--pad) - 28px);max-width:none;height:58px;justify-content:center;z-index:5;opacity:0;visibility:hidden;pointer-events:none;transition:none;box-shadow:0 16px 44px rgba(0,0,0,.55);}
  .vsl-straddle.cta-on + .vsl-cta{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);animation:vslCtaAppear .9s cubic-bezier(.22,1,.36,1) backwards;}
}
/* ===== VSL desktop delayed CTA — hidden at first; after ~12s of cumulative watch time (JS adds .cta-in)
   it slides up from the bottom edge (bottom-center — clear of the corner play/pause & sound controls)
   and gently pulses. Mobile (≤600px) keeps its own cta-on behaviour above — untouched. ===== */
@media (min-width:601px){
  .vsl-block .vsl-cta{position:absolute;left:50%;top:calc(100% + var(--space-sm));bottom:auto;z-index:5;margin:0;
    opacity:0;transform:translate(-50%,30px) scale(.94);pointer-events:none;visibility:hidden;
    box-shadow:0 18px 44px rgba(0,0,0,.45);
    transition:transform .35s var(--ease),box-shadow .35s var(--ease);}
  .vsl-straddle.cta-in + .vsl-cta{opacity:1;transform:translate(-50%,0) scale(1);pointer-events:auto;visibility:visible;
    animation:vslCtaAppear 1.05s cubic-bezier(.22,1,.36,1) backwards, vslCtaPulse 2.6s ease-in-out 2s infinite;}
  .vsl-straddle.cta-in + .vsl-cta:hover{transform:translate(-50%,-3px) scale(1.015);}
}
@keyframes vslCtaAppear{
  0%{opacity:0;transform:translate(-50%,46px) scale(.86);filter:blur(10px);}
  55%{opacity:1;filter:blur(0);}
  72%{transform:translate(-50%,-4px) scale(1.04);box-shadow:0 22px 54px rgba(0,0,0,.4), 0 0 64px 10px rgba(124,92,255,.5);}
  100%{opacity:1;transform:translate(-50%,0) scale(1);filter:blur(0);box-shadow:0 18px 44px rgba(0,0,0,.45);}
}
@keyframes vslCtaPulse{0%,100%{box-shadow:0 18px 44px rgba(0,0,0,.45);}50%{box-shadow:0 18px 44px rgba(0,0,0,.4), 0 0 48px 6px rgba(124,92,255,.52);}}
@media (min-width:601px) and (prefers-reduced-motion:reduce){
  .vsl-block .vsl-cta{transform:translate(-50%,0);transition:opacity .5s ease,visibility 0s linear .5s;}
  .vsl-straddle.cta-in + .vsl-cta,
  .vsl-straddle.cta-in + .vsl-cta:hover{animation:none;transform:translate(-50%,0);}
}

/* ===== VSL play/pause button (bottom-left) — toggles video play/pause ===== */
.vsl-playpause{position:absolute;left:16px;bottom:16px;z-index:5;width:44px;height:44px;border-radius:50%;background:rgba(8,8,11,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;color:#fff;cursor:pointer;transition:background .3s var(--ease),transform .2s var(--ease);}
.vsl-playpause:hover{background:rgba(8,8,11,.72);}
.vsl-playpause:active{transform:scale(.92);}
.vsl-playpause svg{width:17px;height:17px;display:block;}
.vsl-playpause .ic-play{display:none;margin-left:2px;}
.vsl-playpause.is-paused .ic-pause{display:none;}
.vsl-playpause.is-paused .ic-play{display:block;}
@media (max-width:600px){ .vsl-playpause{display:none;} }   /* desktop control */

/* ALL collapsed offer titles share ONE size + one line; scale up identically when active/hover with a blur dip so letters never jump (no reflow). Unifies Design & AI Build vs Konzultace. */
@media (min-width:601px){
  .offers .offer .offer-title{white-space:nowrap;font-size:clamp(1.5rem,2.2vw,2.5rem);transition:font-size .55s var(--ease);will-change:font-size,filter;animation:title-defocus-out .55s var(--ease);}
  .offers .offer:hover .offer-title,
  .offers .offer.active .offer-title{font-size:clamp(2rem,2.9vw,3.3rem);animation:title-defocus-in .55s var(--ease);}
}
@keyframes title-defocus-in{0%,100%{filter:blur(0)}50%{filter:blur(3px)}}
@keyframes title-defocus-out{0%,100%{filter:blur(0)}50%{filter:blur(3px)}}
@media (prefers-reduced-motion:reduce){.offers .offer .offer-title{animation:none!important;}}
/* cursor label — radius from the design system: matches .btn (--radius:8px), since the bubble is a floating button preview */
.cursor.label,.cursor.label.book{border-radius:var(--radius);}
/* footer tagline */
.footer-tag{color:var(--muted);}
/* hide custom cursor (sound bubble) over the VSL play/pause button so the click target stays visible */
.cursor.cursor-hidden{opacity:0!important;}
.vsl-playpause{cursor:pointer!important;}

/* qualify budget — highlight the investment amount in white against the muted help */
.qf-strong{color:var(--ink);}
/* footer tagline — em-dash only inline (desktop); on mobile it sits on its own clean line */
.footer-tag::before{content:"— ";}
@media (max-width:720px){
  .footer-bottom-row{flex-direction:column;align-items:flex-start;gap:14px;}
  .footer-tag{display:block;margin-top:3px;}
  .footer-tag::before{content:none;}
  .footer-top{white-space:nowrap;}
}

/* mobile polish — hero benefit pills proportions + proof strip breathing (design-system spacing) */
@media (max-width:600px){
  .hero-benefits .sys-benefit{padding:11px 22px;gap:13px;}
  .proof-item{padding-block:32px;}
}

/* mobile rhythm audit — every content section breathes the same --space-section (72) top/bottom.
   Fixes the FAQ 65px one-off and the lone offers→FAQ adjacent-light reduction so the whole page is consistent.
   (proof→problem stays deliberately tighter — proof is a thin stat strip, not a full section.) */
@media (max-width:600px){
  #faq{padding-top:var(--space-section);padding-bottom:var(--space-section);}
  #spoluprace{padding-bottom:var(--space-section);}
}

/* footer bottom strip (mobile) — centered content + equal top/bottom breathing (divider→cities == back-to-top→edge) */
@media (max-width:720px){
  .footer-bottom{align-items:center;text-align:center;padding-top:var(--space-lg)!important;padding-bottom:var(--space-lg)!important;}
  .footer-bottom-row{align-items:center;}
  .footer-copy,.footer-top{text-align:center;}
  .footer{padding-bottom:0;}
}

/* qualify form — tidy line wrapping + mobile-only line-break helper */
.qf-q{text-wrap:balance;}
.qf-help,.qf-opt-tx{text-wrap:pretty;}
.qf-nl{display:inline;}
@media (max-width:600px){ .qf-nl{display:block;} }

/* qualify form — confidentiality reassurance line (brand padlock) */
.qf-confidential{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:9px;margin:14px auto 0;width:100%;max-width:var(--maxw);padding:0 var(--pad);font-family:var(--mono);font-size:.72rem;letter-spacing:.02em;color:var(--muted);text-align:center;}
.qf-confidential .qf-lock{flex:none;width:15px;height:15px;color:var(--accent-text);}
.qf-confidential b{color:var(--ink);font-weight:600;}
@media (max-width:600px){ .qf-confidential{font-size:.75rem;gap:7px;margin-top:10px;} .qf-confidential .qf-lock{width:14px;height:14px;} }

/* VSL mobile player — sound icon (initial) → tap = unmute & PLAY CLEAN (no control) → tap = pause (play arrow) → tap = play. Top-right sound hidden. */
@media (max-width:600px){
  .vsl-sound{display:none!important;}
  /* while playing unmuted the control is hidden (base .is-unmuted rule = opacity:0); it returns ONLY when paused */
  .vsl-straddle.is-unmuted.is-paused .vsl-play{opacity:1!important;transform:translate(-50%,-50%)!important;}
  .vsl-play .vsl-ic{display:none;}
  .vsl-play .vsl-ic-eq{display:inline-flex;color:#fff;height:22px;}                          /* initial: animated sound bars */
  .vsl-straddle.is-unmuted .vsl-play .vsl-ic-eq{display:none;}
  .vsl-straddle.is-unmuted.is-paused .vsl-play .vsl-ic-play{display:block;margin-left:4px;}  /* paused: play arrow */
}

/* qualified result — sub-line reads like a heading (not muted helptext) */
.qf-help-lg{font-size:clamp(1.1rem,2.6vw,1.35rem);color:var(--ink);font-weight:500;max-width:30ch;margin-inline:auto;}
/* fix: tall steps (calendar) were centre-cut in the scroll area — margin:auto centres short steps but lets tall ones scroll from the top */
.qf-stage{align-items:flex-start;}
.qf-step{margin-block:auto;}

/* qualify text input — smaller placeholder so longer example hints fit the field width (no cut-off) */
.qf-input::placeholder{font-size:.72em;}

/* footer "AI, pojď o mně něco zjistit" — subtle plain-text link at the very bottom (no pill) */
.footer-ai{display:block;width:100%;text-align:center;margin-top:clamp(16px,2.4vw,24px);font-family:var(--mono);font-size:.72rem;letter-spacing:.05em;color:var(--muted);text-decoration:none;opacity:.8;transition:color .3s var(--ease),opacity .3s var(--ease);}
.footer-ai:hover{color:var(--accent-text);opacity:1;}

/* ═══════════════════════ VÝSLEDKY · editorial bento (featured + obří čísla, match škále webu) ═══════════════════════ */
.rc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.1vw,22px);grid-auto-rows:minmax(210px,auto);grid-auto-flow:dense;}
.rc{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(26px,2vw,40px);overflow:hidden;}
.rc-feat{grid-column:span 2;grid-row:span 2;}                  /* velký featured kus */
.rc-badge{align-self:flex-start;font-family:var(--mono);font-size:.62rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;padding:4px 9px;border-radius:var(--radius-xs);border:1px solid;line-height:1;margin-bottom:clamp(22px,1.8vw,32px);}
.rc-badge.is-client{color:#D9B884;border-color:rgba(217,184,132,.38);background:rgba(217,184,132,.07);}   /* lehce zlatá */
.rc-badge.is-student{color:var(--accent-text);border-color:rgba(124,92,255,.40);background:rgba(124,92,255,.08);}
.rc-num{font-family:var(--display);font-weight:600;font-size:clamp(1.9rem,2.5vw,2.8rem);line-height:1;letter-spacing:-.02em;color:var(--accent-text);white-space:nowrap;}
.rc-num.is-impact{color:var(--ink);}
.rc-feat .rc-num{font-size:clamp(3.4rem,5.6vw,6.4rem);}        /* obří číslo na featured */
.rc-quote{color:#C9C7C2;line-height:1.5;font-size:var(--fs-body);margin:clamp(16px,1.3vw,22px) 0 0;}
.rc-feat .rc-quote{font-size:var(--fs-h3);line-height:1.42;color:var(--ink);max-width:26ch;}  /* velký pull-quote */
.rc-who{display:flex;align-items:center;gap:13px;margin-top:auto;padding-top:clamp(24px,2vw,36px);}
.rc-wmeta{display:flex;flex-direction:column;gap:3px;min-width:0;}
.rc-avatar{width:46px;height:46px;border-radius:50%;flex:none;}
.rc-feat .rc-avatar{width:56px;height:56px;}
.rc-name{font-family:var(--display);font-weight:600;font-size:var(--fs-body);color:var(--ink);line-height:1.2;}
.rc-feat .rc-name{font-size:1.35rem;}
.rc-role{font-size:.88rem;color:var(--muted);}
.rc-trans{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:.86rem;color:var(--muted);margin-top:2px;}
.rc-trans .t-arrow{flex:none;width:30px;height:8px;color:rgba(255,255,255,.4);}   /* premium tenká šipka, ne fialová */
.rc-trans .t-to{color:#C9C7C2;}
/* video karty — hover-preview (jako YouTube thumbnail: hover → rozhýbe se, klik → zvuk/full) */
.rc-video{padding:0;overflow:hidden;cursor:pointer;background:#0b0b0d;}
.rc-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.rc-video .rc-badge{position:absolute;top:16px;left:16px;z-index:3;margin:0;}
.rc-voverlay{position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;flex-direction:column;gap:5px;padding:clamp(20px,1.6vw,30px);background:linear-gradient(transparent,rgba(0,0,0,.8));}
.rc-voverlay .rc-name{color:#fff;}
.rc-voverlay .rc-trans{color:rgba(255,255,255,.72);}
.rc-voverlay .rc-trans .t-to{color:#fff;}
.rc-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:4;width:62px;height:62px;border-radius:50%;border:1.5px solid rgba(255,255,255,.65);background:rgba(0,0,0,.32);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);cursor:pointer;transition:transform .35s var(--ease),background .35s var(--ease),opacity .3s var(--ease);}
.rc-play::before{content:"";position:absolute;top:50%;left:54%;transform:translate(-50%,-50%);border-left:15px solid #fff;border-top:9px solid transparent;border-bottom:9px solid transparent;}
.rc-video:hover .rc-play{transform:translate(-50%,-50%) scale(1.08);background:rgba(0,0,0,.48);}
.rc-video.is-playing .rc-play{opacity:0;pointer-events:none;}
.rc-video:not(.rc-feat){aspect-ratio:16/9;}                  /* malé video karty = 16:9 → žádný squish */
.rc-vwho,.rc-vmeta{display:flex;flex-direction:column;gap:2px;min-width:0;}
.rc-vfoot{display:flex;align-items:center;gap:11px;}
.rc-voverlay{gap:11px;}
.rc-voverlay .rc-avatar{width:40px;height:40px;border:1.5px solid rgba(255,255,255,.22);}
.rc-feat.rc-video .rc-voverlay .rc-avatar{width:48px;height:48px;}
.rc-voverlay .rc-num{color:#fff;font-size:clamp(1.5rem,1.9vw,2.1rem);line-height:1;white-space:nowrap;}
.rc-feat.rc-video .rc-voverlay{padding:clamp(28px,2.2vw,44px);}
.rc-feat.rc-video .rc-voverlay .rc-num{font-size:clamp(2.6rem,3.8vw,4.4rem);}   /* velké číslo na featured videu */
.rc-feat.rc-video .rc-name{font-size:1.32rem;}
@media (max-width:991px){.rc-grid{grid-template-columns:repeat(2,1fr);}.rc-feat{grid-column:span 2;grid-row:auto;}}
@media (max-width:600px){.rc-grid{grid-template-columns:1fr;gap:14px;grid-auto-rows:auto;grid-auto-flow:row;}.rc-feat{grid-column:auto;grid-row:auto;}.rc-video{aspect-ratio:4/5;}.rc-feat .rc-num{font-size:clamp(2.8rem,13vw,3.6rem);}.rc-feat .rc-quote{font-size:1.25rem;}}

/* ═══════════════════════ CTA nebula shader + film grain ═══════════════════════ */
.footer-stone{background:radial-gradient(80% 92% at 50% 42%,rgba(46,34,86,.5),rgba(10,10,12,1) 70%);max-width:var(--maxw);margin-inline:auto;left:0;right:0;} /* fallback + drží se gridu 1880, centrovaně */
.footer-shade,.footer-grain{max-width:var(--maxw);margin-inline:auto;left:0;right:0;}  /* shader vizuál max do gridu 1880, nejde za */
.footer-stone canvas.footer-shader{width:100%;height:100%;display:block;opacity:0;transition:opacity 1.1s var(--ease);}
.footer-stone canvas.footer-shader.is-on{opacity:.82;}
.footer-stone canvas.footer-shader.is-nogl{display:none;}
.footer-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(72% 66% at 50% 52%,rgba(10,10,12,.5),rgba(10,10,12,0) 76%);} /* scrim pro čitelnost textu */
.footer-grain{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;mix-blend-mode:overlay;background-size:140px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
@media (prefers-reduced-motion:reduce){.footer-stone canvas.footer-shader{transition:none;}}
@media (max-width:760px){.footer-grain{opacity:.38;}}

/* CTA shader/grain — cross-fade maska na všech okrajích → bezešvý přechod do footeru (žádné ostré linky) */
.footer-stone,.footer-grain{
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,transparent 0%,#000 7%,#000 72%,transparent 98%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(180deg,transparent 0%,#000 7%,#000 72%,transparent 98%);
  mask-composite:intersect;
}

/* CTA — celá sekce klikací + arrow kurzor (data-cursor-arrow → kolečko se šipkou ↗). Touch: nech explicitní button. */
/* footer CTA: arrow cursor over the whole block; button keeps its native hover (no covering link) */
@media (hover:hover){.footer-cta-block,.footer-cta-block *{cursor:none;}}

/* #system — konkrétní deliverables (řeší Mikyho feedback: rámec byl abstraktní) */

/* ── #system: dopady (Více důvěry / Nové příležitosti / Ideální klienti) se odhalují 1-2-3 s jemným popem ── */
#system .sys-benefits[data-anim]{opacity:1;transform:none;}                 /* parent = jen scroll-trigger, neanimuje se sám */
#system .sys-benefits .sys-benefit{opacity:0;transform:translate3d(0,16px,0) scale(.975);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);will-change:opacity,transform;}
#system .sys-benefits.is-in .sys-benefit{opacity:1;transform:none;}
#system .sys-benefits.is-in .sys-benefit:nth-child(1){transition-delay:.10s;}
#system .sys-benefits.is-in .sys-benefit:nth-child(2){transition-delay:.25s;}
#system .sys-benefits.is-in .sys-benefit:nth-child(3){transition-delay:.40s;}
@media (prefers-reduced-motion:reduce){#system .sys-benefits .sys-benefit{transition:none;transform:none;opacity:1;}}

/* footer CTA button: magnet owns the transform, so kill the CSS hover-lift (translateY(-2px)) that fought it and made the hover "blink"/jump. Now only background eases — smooth like the nav button. */
.footer-btn.btn.primary:hover{transform:none;}
.sys-h2 .sys-h2-sub{display:block;}

/* #spoluprace — "living proof" strip (Flowlance · Webdesign Hero · YouTube) on the light section */
.coop-proof{margin-top:clamp(34px,4vw,58px);padding-top:clamp(26px,3vw,40px);border-top:1px solid rgba(10,10,12,.12);}
.coop-proof-lead{font-family:var(--display);font-weight:600;font-size:clamp(1.1rem,1.45vw,1.5rem);line-height:1.25;letter-spacing:-.01em;color:#15151A;max-width:34ch;margin-bottom:clamp(24px,2.6vw,40px);}
.coop-proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,56px);}
.coop-proof-kicker{font-family:var(--mono);font-size:.72rem;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);margin-bottom:12px;}
.coop-proof-headline{font-family:var(--display);font-weight:600;font-size:clamp(1.9rem,2.7vw,2.9rem);line-height:1;letter-spacing:-.02em;color:#15151A;}
.coop-proof-sub{margin-top:9px;font-size:clamp(.9rem,1vw,1.02rem);line-height:1.4;color:rgba(20,20,26,.6);}
@media (max-width:760px){.coop-proof-grid{grid-template-columns:1fr;gap:24px;}.coop-proof-item{display:flex;flex-direction:column;}}

/* offer card bullets: reveal AFTER the card is fully expanded (clip open) → no clip-assembling; gentle staggered fade+rise. Desktop only (mobile uses its own body accordion). */
@media (min-width:601px){
  .offer-includes li{opacity:0;transform:translateY(9px);transition:opacity .25s var(--ease),transform .25s var(--ease);will-change:opacity,transform;}
  .offer.active .offer-includes li{opacity:1;transform:none;transition:opacity .42s var(--ease),transform .42s var(--ease);}
  .offer.active .offer-includes li:nth-child(1){transition-delay:.50s;}
  .offer.active .offer-includes li:nth-child(2){transition-delay:.56s;}
  .offer.active .offer-includes li:nth-child(3){transition-delay:.62s;}
}
@media (min-width:601px) and (prefers-reduced-motion:reduce){.offer-includes li{transition:none!important;transform:none!important;opacity:1!important;}}

/* klienti band — real logos: uniform monochrome, LOCKED (no hover), constrained to the grid (no full-bleed on ultrawide) */
.light .logo-wrap img{filter:brightness(0);opacity:.42;}
.logos-band .logo-wrap{pointer-events:none;}
.logos-component{max-width:calc(var(--maxw) - 2 * var(--pad));margin-inline:auto;}


/* ═══════════ #autorita — borrow authority: auto-rotating 3D coverflow carousel (full-bleed) + scroll-fill statement ═══════════ */
.carousel3d{position:relative;width:100%;max-width:1640px;margin-inline:auto;overflow:hidden;perspective:1900px;user-select:none;-webkit-user-select:none;height:clamp(560px,53vw,860px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);}
.cov-track{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;}
.cov-track .ace{position:absolute;left:0;top:0;width:clamp(310px,30vw,470px);transform-style:preserve-3d;backface-visibility:hidden;will-change:transform,opacity;}
.carousel3d .ace-photo{position:relative;aspect-ratio:9/16;border-radius:var(--radius-lg);overflow:hidden;}
.ace-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 15%;z-index:0;}
.carousel3d .ace-photo.reach{display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,1.7vw,30px);background:#0f0e16;background:radial-gradient(125% 82% at 50% 6%, #1c1b24 0%, #131119 52%, #0b0a11 100%);box-shadow:0 46px 92px -30px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 0 1px rgba(255,255,255,.05);}
.carousel3d .ace-photo.reach::after{content:"";position:absolute;left:0;right:0;bottom:0;height:66%;z-index:1;background:linear-gradient(180deg,transparent 0%,rgba(6,6,10,.12) 34%,rgba(6,6,10,.56) 66%,rgba(6,6,10,.93) 100%);pointer-events:none;}
.reach-head{display:flex;align-items:center;gap:9px;position:relative;z-index:2;text-shadow:0 1px 14px rgba(0,0,0,.55);}
.reach-ic{width:18px;height:18px;flex:none;color:rgba(255,255,255,.58);}
.reach-handle{font-family:var(--mono);font-size:clamp(.78rem,.9vw,.92rem);letter-spacing:.01em;color:rgba(255,255,255,.92);}
.reach-bottom{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;text-shadow:0 1px 18px rgba(0,0,0,.5);}
.reach-num{font-family:var(--display);font-weight:800;font-size:clamp(3.4rem,5.1vw,5.4rem);line-height:.8;letter-spacing:-.045em;color:#fff;}
.reach-unit{font-size:.5em;font-weight:700;color:var(--accent-text);letter-spacing:0;margin-left:.07em;}
.reach-label{font-family:var(--mono);font-size:clamp(.92rem,1.02vw,1.12rem);letter-spacing:.005em;text-transform:none;color:rgba(255,255,255,.5);margin-top:7px;}
.reach-foll{color:rgba(255,255,255,.88);font-weight:500;}
.reach-foot{display:flex;flex-direction:column;gap:4px;margin-top:clamp(13px,1.5vw,20px);}
.reach-name{font-family:var(--display);font-weight:700;font-size:clamp(1.25rem,1.5vw,1.7rem);color:#fff;line-height:1.03;letter-spacing:-.015em;}
.reach-co{font-family:var(--mono);font-size:clamp(.74rem,.82vw,.88rem);letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.64);}
/* #autorita — mobile/tablet: rAF coverflow off, native horizontal scroll-snap swipe strip */
@media (max-width:899px){
  .carousel3d{height:auto;max-width:none;overflow:visible;perspective:none;-webkit-mask-image:none;mask-image:none;}
  .cov-track{position:static;left:auto;top:auto;width:auto;height:auto;transform:none;display:flex;gap:14px;overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:8px 11vw 20px;scrollbar-width:none;}
  .cov-track::-webkit-scrollbar{display:none;}
  .carousel3d .ace{position:static;left:auto;top:auto;width:min(78vw,330px);flex:0 0 min(78vw,330px);scroll-snap-align:center;transform:none!important;opacity:1!important;visibility:visible!important;}
}
/* wide scroll-fill statement (soft char-wipe; legible default for no-JS) */
.authority-eyebrow{display:flex;justify-content:center;margin-bottom:clamp(10px,1.6vw,20px);}
.authority-statement{margin-top:clamp(40px,5vw,80px);text-align:center;font-family:var(--display);font-weight:600;font-size:clamp(2rem,5.2vw,4.9rem);line-height:1.06;letter-spacing:-.022em;max-width:17ch;margin-inline:auto;}
.authority-statement .c{color:var(--muted);opacity:1;}
.authority-statement.js-fill .c{opacity:.15;}
.authority-statement .s .c{color:var(--ink);font-weight:700;}
@media (prefers-reduced-motion:reduce){.authority-statement .c{opacity:1!important;}}
@media (max-width:600px){.authority-statement{font-size:clamp(2.55rem,8.6vw,4.6rem);line-height:1.12;max-width:none;}}

/* Flowlance work card — cover = founders photo · hover = brand logo on a 2-tone pane */
.flowlance-cover .bg.cover{object-position:center 22%;}
.flowlance-logo-pane{background:#161334;display:grid;place-items:center;}
.flowlance-logo-mark{width:28%;max-width:172px;height:auto;}
.work-sub{text-wrap:balance;}

/* ════ RESPONSIVE AUDIT FIXES — tablet 768–899 was getting the cramped desktop layout (flips fired at 767/991, not the 900 design breakpoint) ════ */
@media (min-width:768px) and (max-width:899px){
  .proof-item{min-height:0;gap:12px;}
  .process{grid-template-columns:1fr;}
  .work-block{width:100%;}
  .work-block-text{flex-direction:column;align-items:flex-start;gap:1rem;}
  .sec-head-r{text-align:left;}
  .reframe-media{aspect-ratio:4/3;}
}
/* tap targets ≥44px on touch */
@media (max-width:899px){ .process-cta{min-height:44px;} }
@media (max-width:600px){ .footer-links-list a{padding-block:7px;} }
/* #system heading — desktop-only chopped breaks; on mobile let it flow naturally */
@media (max-width:700px){ .sys-h2 br.d-br{display:none;} }


/* ---------- VSL CTA: Large + dual-ring beacon ---------- */
@media (min-width:601px){
  .vsl-block .vsl-cta{height:64px;font-size:18px;font-weight:600;padding-inline:42px;}
  .vsl-straddle.cta-in + .vsl-cta::before,
  .vsl-straddle.cta-in + .vsl-cta::after{content:"";position:absolute;inset:-2px;border-radius:inherit;border:1.5px solid rgba(124,92,255,.65);opacity:0;pointer-events:none;will-change:transform,opacity;}
  .vsl-straddle.cta-in + .vsl-cta::before{animation:vslCtaBeacon 2.4s cubic-bezier(.25,.6,.35,1) 1.1s infinite;}
  .vsl-straddle.cta-in + .vsl-cta::after{animation:vslCtaBeacon 2.4s cubic-bezier(.25,.6,.35,1) 2.3s infinite;}
  @keyframes vslCtaBeacon{0%{transform:scale(1);opacity:.8;}80%{transform:scale(1.22,1.85);opacity:0;}100%{transform:scale(1.22,1.85);opacity:0;}}
  @media (prefers-reduced-motion:reduce){.vsl-straddle.cta-in + .vsl-cta::before,.vsl-straddle.cta-in + .vsl-cta::after{animation:none;display:none;}}
}

/* ═══════════ #problem mobile — full-width CTA closing the reframe section (hidden ≥900) ═══════════ */
.reframe-cta-m{display:none;}
@media (max-width:899px){
  .reframe-cta-m{display:block;margin-top:clamp(28px,8vw,44px);margin-bottom:8px;}
  .reframe-cta-m .btn{width:100%;display:flex;justify-content:center;height:58px;font-size:17px;font-weight:600;}
}

/* ═══════════ OFFER micro-CTAs mobile — real tap targets: full-width, ≥16px, ≥52px (beats .btn.sm) ═══════════ */
@media (max-width:859px){
  .offer .offer-cta-m{width:100%;justify-content:center;height:54px;font-size:16px;font-weight:600;padding:0 18px;}
  .offer .offer-cta-m .chip{width:26px;height:26px;}
  .offer .offer-cta-m .chip svg{width:13px;height:13px;}
}

/* ═══════════ MOBILE TYPE FLOOR — body/list/label-value text ≥16px in the offer accordion ═══════════ */
@media (max-width:859px){
  .offer-includes li{font-size:1rem;line-height:1.5;}
  .offer-detail .kicker{font-size:1rem;}
}

/* ═══════════ MOBILE TYPE FLOOR ≤600 — micro-labels never under 12px (tags, eyebrow, footer meta) ═══════════ */
@media (max-width:600px){
  .tag,.tag.simple-style{font-size:.75rem;}
  .hero-eyebrow{font-size:.75rem;}
  .footer-status,.footer-ai{font-size:.75rem;}
  .reach-co{font-size:.75rem;}
}


/* ---------- VSL roll-in: scroll-scrub (JS ridi opacity/transform/blur podle pozice scrollu) ---------- */
.vsl-straddle[data-anim]{opacity:1;transform:none;}   /* genericky one-shot reveal vypnut, nastup vlastni scrub JS */
.vsl-straddle.vsl-scrub{transition:none!important;}   /* behem scrubu zadne CSS transitions (jinak by se smyvalo) */

/* ===== #vysledky — reálné reference: portrait Vimeo karty, money karty, monogram avatary ===== */
.rc-tall{grid-row:span 2;}
.rc-video.rc-tall{aspect-ratio:auto;}                 /* přebíjí 16:9 malých video karet — portrait přes 2 řádky */
.rc-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.rc-vframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:5;background:#000;}
.rc-video.is-playing .rc-voverlay,
.rc-video.is-playing .rc-badge{opacity:0;pointer-events:none;transition:opacity .3s var(--ease);}
.rc-mono{display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:1.02rem;letter-spacing:.02em;
  background:rgba(124,92,255,.13);color:var(--accent-text);border:1px solid rgba(124,92,255,.32);}
.rc-feat .rc-num{white-space:normal;line-height:1.04;font-size:clamp(2.7rem,4.2vw,4.8rem);}
.rc-sub{font-size:.95rem;color:var(--muted);margin-top:12px;}
.rc-tall .rc-play{top:44%;}   /* play nad overlay footerem */
@media (max-width:600px){
  .rc-tall{grid-row:auto;}
  .rc-video.rc-tall{aspect-ratio:4/5;}
  .rc-feat .rc-num{font-size:clamp(2.2rem,10vw,3rem);}
}

/* ===== #vysledky — featured karta (Patrik): čistý sloupec, headline na jeden řádek, citát přes celou šířku ===== */
.rc-feat .rc-num{font-size:clamp(2.3rem,3.2vw,3.6rem);}
.rc-feat .rc-quote{max-width:52ch;}   /* 45–65 znaků na řádek = čitelný pull-quote, ne zeď textu */
.rc-grid .rc-num{white-space:normal;word-spacing:.06em;}   /* Clash žere mezeru mezi písmenem a číslicí — roztáhnout */
.rc-poster{object-position:50% 22%;}                        /* 9:16 video v kartě: hlava mluvčího viditelná */

/* ===== FAQ — domino reveal 01→06: řádek nastoupí s blur-in, číslo dopadne s pružinou, linka se dokreslí ===== */
.faq-list .faq[data-anim]{
  position:relative;border-bottom-color:transparent!important;
  opacity:0;transform:translate3d(0,30px,0);filter:blur(5px);
  transition:opacity .75s cubic-bezier(.22,1,.36,1),transform .75s cubic-bezier(.22,1,.36,1),filter .75s cubic-bezier(.22,1,.36,1);
}
.faq-list .faq[data-anim].is-in{opacity:1;transform:none;filter:none;}
.faq-list .faq[data-anim]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:rgba(0,0,0,.12);transform:scaleX(0);transform-origin:left;
  transition:transform .95s cubic-bezier(.22,1,.36,1) .25s;}
.faq-list .faq[data-anim].is-in::after{transform:scaleX(1);}
.faq[data-anim] .faq-num{opacity:0;transform:translateY(-10px) scale(.85);
  transition:opacity .45s cubic-bezier(.22,1,.36,1),transform .55s cubic-bezier(.34,1.56,.64,1);}
.faq[data-anim].is-in .faq-num{opacity:1;transform:none;}
/* desktop domino: řádky i čísla se řetězí 01→06 */
@media (min-width:900px){
  .faq-list .faq[data-anim]:nth-child(1){transition-delay:0s;}      .faq-list .faq[data-anim]:nth-child(1).is-in .faq-num{transition-delay:.14s;} .faq-list .faq[data-anim]:nth-child(1)::after{transition-delay:.25s;}
  .faq-list .faq[data-anim]:nth-child(2){transition-delay:.09s;}    .faq-list .faq[data-anim]:nth-child(2).is-in .faq-num{transition-delay:.23s;} .faq-list .faq[data-anim]:nth-child(2)::after{transition-delay:.34s;}
  .faq-list .faq[data-anim]:nth-child(3){transition-delay:.18s;}    .faq-list .faq[data-anim]:nth-child(3).is-in .faq-num{transition-delay:.32s;} .faq-list .faq[data-anim]:nth-child(3)::after{transition-delay:.43s;}
  .faq-list .faq[data-anim]:nth-child(4){transition-delay:.27s;}    .faq-list .faq[data-anim]:nth-child(4).is-in .faq-num{transition-delay:.41s;} .faq-list .faq[data-anim]:nth-child(4)::after{transition-delay:.52s;}
  .faq-list .faq[data-anim]:nth-child(5){transition-delay:.36s;}    .faq-list .faq[data-anim]:nth-child(5).is-in .faq-num{transition-delay:.50s;} .faq-list .faq[data-anim]:nth-child(5)::after{transition-delay:.61s;}
  .faq-list .faq[data-anim]:nth-child(6){transition-delay:.45s;}    .faq-list .faq[data-anim]:nth-child(6).is-in .faq-num{transition-delay:.59s;} .faq-list .faq[data-anim]:nth-child(6)::after{transition-delay:.70s;}
}
/* mobil: řádky nastupují vlastním scrollem, bez čekání, kratší dráha (smooth) */
@media (max-width:899px){
  .faq-list .faq[data-anim]{transform:translate3d(0,22px,0);filter:blur(4px);
    transition-duration:.6s,.6s,.6s;}
  .faq[data-anim].is-in .faq-num{transition-delay:.1s;}
  .faq-list .faq[data-anim]::after{transition-delay:.18s;}
}
@media (prefers-reduced-motion:reduce){
  .faq-list .faq[data-anim]{opacity:1;transform:none;filter:none;transition:none;border-bottom-color:rgba(0,0,0,.12)!important;}
  .faq-list .faq[data-anim]::after{display:none;}
  .faq[data-anim] .faq-num{opacity:1;transform:none;transition:none;}
}

/* ===== #vysledky — feat tagy (deliverables) + čitelné role na video overlayích ===== */
.rc-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;}
.rc-tag{font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;
  padding:4px 10px;border-radius:var(--radius-xs);border:1px solid var(--line);color:rgba(255,255,255,.72);line-height:1;}
.rc-voverlay .rc-role{color:rgba(255,255,255,.82);}
.rc-video.is-playing{background:#000;}   /* 9:16 player v širší kartě: pruhy splynou s pozadím */
@media (max-width:700px){ .hero-sub br.d-br{display:none;} }   /* mobil: druhá věta teče přirozeně */

.offer-desc .hl{color:#fff;font-weight:600;}   /* highlight v popisu nabídky: bílá, ne fialová (na tmavé kartě zaniká) */

/* ===== #system mobil — utažený vertikální rytmus na tokenech (chipy → kroky → dělítka) ===== */
@media (max-width:767px){
  .process{margin-top:var(--space-xl);}                      /* méně mrtvého prostoru nad kroky */
  .process-step{padding:var(--space-md) 0 var(--space-lg);}  /* symetrie kolem dělicích linek */
  .process-step:first-child{padding-top:var(--space-xs);}
  .process-body{margin-top:var(--space-sm);}
  .process-cta{margin-top:var(--space-sm);margin-bottom:0;}
  .sys-benefits{margin-top:var(--space-lg);}
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ===== FINAL mobilní revize (iPhone pass) ===== */
.nb{white-space:nowrap;}
@media (max-width:600px){
  /* hero: menší gap pod navbarem, kompaktnější subheading → CTA se vejde do prvního viewportu */
  .hero{padding-top:98px;}
  .hero-eyebrow{margin-bottom:var(--space-sm);}
  .hero .h-hero{font-size:clamp(2.4rem,11vw,2.9rem);margin-bottom:var(--space-sm);}
  .hero-sub{font-size:1rem;line-height:1.5;margin-bottom:var(--space-md);}
  /* nabídky: vzduch mezi obsahem a blokem detailů */
  .offer-body-in{gap:var(--space-md);}
  .offer-details{margin-top:var(--space-sm);}
  /* cena: hodnota pod labelem, vlevo, bez rozbitého zalomení */
  .offer-details .offer-detail:last-child{flex-direction:column;align-items:flex-start;gap:6px;}
  .offer-details .offer-detail:last-child .kicker:last-child{text-align:left;font-size:clamp(1.2rem,5.4vw,1.45rem);white-space:normal;}
  /* systém: víc vzduchu mezi benefity ↔ kroky i mezi kroky navzájem */
  .process{margin-top:var(--space-2xl);}
  .process-step{padding:var(--space-lg) 0 var(--space-xl);}
  /* nav overlay: obsah se musí vejít NAD spodní browser bar — kompaktnější vertikální rytmus + scroll pojistka */
  .nav-menu{height:100dvh;padding-top:calc(96px + env(safe-area-inset-top));
    padding-bottom:calc(28px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;}
  .nav-menu-divider{margin:18px 0;}
  .nav-menu-socials{gap:8px;}
  .nav-menu-cta{margin-top:6px;flex-shrink:0;}
}
/* FAQ na mobilu: bez blur filtru (jank na iOS), rychlý čistý nástup */
@media (max-width:899px){
  .faq-list .faq[data-anim]{filter:none;transform:translate3d(0,16px,0);
    transition:opacity .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1);}
  .faq-list .faq[data-anim].is-in{filter:none;}
  .faq[data-anim] .faq-num{transition-duration:.35s,.4s;}
  .faq-list .faq[data-anim]::after{transition-duration:.6s;transition-delay:.12s;}
}

/* ═══════════ A11Y — prefers-reduced-motion: klid bez pohybu (kurzor, nekonecne animace, reveal; video autoplay resi JS) ═══════════ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important;}
  [data-anim],[data-anim="scale"],[data-anim="clip"]{opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important;transition:none!important;will-change:auto!important;}
  .cursor{display:none!important;}                                                   /* JS kurzor nebezi -> tecka by zustala trcet v rohu */
  .vsl-straddle,[data-cursor-arrow],[data-cursor-label],.footer-cta-block,.footer-cta-block *{cursor:pointer!important;}   /* cursor:none bez nahrady = neviditelna mys */
  .nav-dot::after,.nav-menu-dot::after,.dot::after,.scroll-hint .ln::after,.marquee-track{animation:none!important;}
  .vsl-block .vsl-cta,.vsl-straddle.cta-in + .vsl-cta,.vsl-straddle.cta-on + .vsl-cta{animation:none!important;}
  .offer,.offer-image,.offer-head,.offer-body,.offer-desc,.offer-details,.offer-cta-m,.offer .tag.simple-style{transition:none!important;}
  .work-block-image .bg,.vsl-straddle{transition:none!important;}
}

/* ═══════════ #vysledky mobil — scrub clip-path na vlastni compositor vrstve (JS rAF smycka na touch zarizenich) ═══════════ */
@media (hover:none){
  .work-block-image{will-change:clip-path;transform:translateZ(0);}
}

/* ═══════════ VSL — autoplay-blokujici prohlizece (Firefox „Blokovat audio i video", Safari „Nikdy neprehravat") ═══════════ */
.vsl-straddle:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:var(--radius-lg);}   /* klavesnice: mezernik/Enter */
.vsl-straddle.is-blocked .vsl-play{display:grid!important;}                          /* blokovany autoplay: velky play i na desktopu (jinak „mrtva" pauza) */
.vsl-straddle.is-blocked .vsl-play .vsl-ic{display:none;}
.vsl-straddle.is-blocked .vsl-play .vsl-ic-play{display:block;margin-left:4px;}
.vsl-straddle.is-native{cursor:auto;}                                                /* nativni Vimeo ovladani: klik jde do iframu, nase overlaye pryc */
.vsl-straddle.is-native .vsl-vimeo,.vsl-straddle.is-native .vsl-yt{pointer-events:auto;}
.vsl-straddle.is-native .vsl-play,.vsl-straddle.is-native .vsl-sound,.vsl-straddle.is-native .vsl-playpause{display:none!important;}

/* ═══════════ OFFER head (desktop akordeon) — obrázek ustoupí textu, hlava karty má KONSTANTNÍ výšku ═══════════
   Bug: .offer-image = 24vw (363px na 1512) + tagy/titulek nowrap → na 1280–1600px „Funnel" a „Design & AI Build" běžely pod obrázek.
   Pravidla: (1) nic nikdy nezalamuje (tagy i titulek nowrap = žádný skok během flex transition), text sloupec absorbuje
   šířku jako původně; (2) v usazeném stavu ustoupí obrázek (flex-shrink 100 : 1), ne text; (3) výška obrázku je fixní
   z PLNÉ šířky (ne aspect-ratio ze zmenšené) → výška hlavy se během přechodu nemění, titulek/desc/body se nehýbou. */
@media (min-width:860px){
  .offer-head{gap:clamp(1.2rem,1.8vw,1.8rem);}
  .offer-head-text{flex:0 1 auto;min-width:0;}
  .offer-image{flex:0 100 auto;min-width:clamp(150px,15vw,230px);aspect-ratio:auto;height:calc(clamp(230px,24vw,380px) * .5625);}
}

/* ═══════════ ceny vč. DPH — prémiový zápis: velká cifra + malý mono sufix (label zůstává čistý) ═══════════ */
.offer-detail .vat{font-family:var(--mono);font-weight:500;font-size:.55em;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.44);white-space:nowrap;margin-left:.18em;}

/* kurzor na světlých sekcích: bez blend-mode (difference = zelená), plná fialová */
.cursor.on-light{mix-blend-mode:normal;background:#5A3DE0;}
.cursor.on-light.big{background:rgba(90,61,224,.22);}
.cursor.on-light.label{background:var(--accent);}