/* ============================================================
   BODOR, LLC — "PRENOS / RUNDOWN"
   Broadcast-grade editorial identity
   ============================================================ */

:root{
  /* brand navy system — deepest to lightest */
  --vac:    #050a30;   /* brand deep navy — hero, footer */
  --vac-2:  #091240;  /* navy mid — cinnost, spojenie */
  --vac-3:  #0e1c58;  /* navy lighter — profil panels */
  --vac-4:  #162568;  /* navy lightest — hover / card bg */
  /* phosphor — warmer, noticeably brighter */
  --phos:       #F0EAE0;
  --phos-dim:   #B8B0A6;
  --phos-faint: rgba(240,234,224,.22);
  --phos-line:  rgba(240,234,224,.16);
  /* signal accents */
  --tally:  #E8412C;   /* on-air red */
  --amber:  #F0B040;   /* oscilloscope amber */

  --maxw: 1320px;
  --gut: clamp(20px, 5vw, 84px);

  --mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --serif:"Newsreader", Georgia, "Times New Roman", serif;
  --disp: "Bricolage Grotesque", "Newsreader", Georgia, serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  background:var(--vac);
  color:var(--phos);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.65;
  font-weight:380;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

/* faint film grain over everything */
body::after{
  content:""; position:fixed; inset:0; z-index:9000; pointer-events:none;
  opacity:.04; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; }
::selection{ background:var(--tally); color:var(--vac); }

.mono{ font-family:var(--mono); }
.wrap{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--gut); }

.eyebrow{
  font-family:var(--mono); font-size:.66rem; letter-spacing:.26em;
  text-transform:uppercase; color:var(--phos-dim);
  display:flex; align-items:center; gap:.7em;
}
.eyebrow .seg{ color:var(--tally); }
.eyebrow::before{
  content:""; width:26px; height:1px; background:var(--phos-faint);
}

/* ============================================================
   VIEWPORT CHROME — safe-area brackets + top/bottom bars
   ============================================================ */
.chrome-corner{
  position:fixed; width:26px; height:26px; z-index:7000; pointer-events:none;
  border:1px solid var(--phos-faint);
}
.cc-tl{ top:14px; left:14px; border-right:0; border-bottom:0; }
.cc-tr{ top:14px; right:14px; border-left:0; border-bottom:0; }
.cc-bl{ bottom:14px; left:14px; border-right:0; border-top:0; }
.cc-br{ bottom:14px; right:14px; border-left:0; border-top:0; }

.topbar{
  position:fixed; top:0; left:0; right:0; z-index:6500;
  display:flex; justify-content:space-between; align-items:center;
  padding:16px clamp(26px,5vw,56px);
  font-family:var(--mono); font-size:.66rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--phos-dim);
  mix-blend-mode:difference;
}
.topbar .ident{ display:flex; align-items:center; gap:.8em; color:var(--phos); }
.topbar .ident b{ font-weight:600; letter-spacing:.22em; }
.topbar .ident .sep{ color:var(--phos-dim); }
.topbar .live{ display:flex; align-items:center; gap:1.4em; }
.tally{ display:inline-flex; align-items:center; gap:.55em; color:var(--phos); }
.tally .dot{
  width:8px; height:8px; border-radius:50%; background:var(--tally);
  box-shadow:0 0 10px var(--tally); animation:blink 1.6s steps(1) infinite;
}
@keyframes blink{ 0%,55%{opacity:1} 56%,100%{opacity:.25} }
#tc{ color:var(--phos); }

/* language switcher */
.topbar .langs{ display:flex; align-items:center; gap:.05em; }
.topbar .langs button{
  appearance:none; -webkit-appearance:none; background:none; border:0;
  cursor:inherit; font:inherit; letter-spacing:.16em; text-transform:uppercase;
  color:var(--phos-dim); padding:.4em .5em; line-height:1; position:relative;
  transition:color .2s ease;
}
.topbar .langs button:hover{ color:var(--phos); }
.topbar .langs button.active{ color:var(--phos); }
.topbar .langs button.active::after{
  content:""; position:absolute; left:.5em; right:.5em; bottom:.12em;
  height:1px; background:var(--tally);
}

/* Bodor.TV topbar link */
.topbar .bodortv-link{
  font-family:var(--mono); font-size:.66rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--amber);
  padding:.38em .7em; border:1px solid rgba(240,176,64,.3);
  border-radius:1px; white-space:nowrap;
  transition:color .2s, border-color .2s, background .2s;
}
.topbar .bodortv-link:hover{
  color:var(--phos); border-color:var(--phos-faint);
  background:rgba(240,234,224,.06);
}

/* BGM toggle button — styled like lang buttons, no border (avoids mix-blend-mode artefact) */
.bgm-btn{
  appearance:none !important; -webkit-appearance:none !important;
  background:none !important; background-color:transparent !important;
  border:0 !important; border-radius:0; box-shadow:none !important;
  outline:none; -webkit-tap-highlight-color:transparent;
  cursor:inherit; font-family:var(--mono); font-size:.82rem;
  color:var(--phos-dim); padding:.38em .5em; line-height:1;
  transition:color .2s ease; position:relative; letter-spacing:0;
  display:inline-flex; align-items:center;
}
.bgm-btn:hover{ color:var(--phos); }
.bgm-btn:focus{ outline:none; }
/* ON — playing with sound */
.bgm-btn.is-active{ color:var(--amber); }
.bgm-btn.is-active::after{
  content:""; position:absolute; left:.5em; right:.5em; bottom:.12em;
  height:1px; background:var(--tally);
}
/* OFF — muted */
.bgm-btn[data-bgm="off"] .bgm-icon{ opacity:.55; }
@keyframes note-pulse{ 0%,100%{opacity:1} 50%{opacity:.5} }
.bgm-btn.is-active .bgm-icon{ animation:note-pulse 2.4s ease-in-out infinite; }

/* ============================================================
   RUNDOWN INDEX (right edge nav)
   ============================================================ */
.rundown{
  position:fixed; right:18px; top:50%; transform:translateY(-50%);
  z-index:6000; display:flex; flex-direction:column; gap:2px;
  font-family:var(--mono); font-size:.62rem; letter-spacing:.14em;
  text-transform:uppercase; text-align:right;
}
.rundown a{
  display:flex; gap:.7em; align-items:baseline; justify-content:flex-end;
  color:var(--phos-dim); padding:5px 0; opacity:.55;
  transition:opacity .3s, color .3s, transform .3s;
}
.rundown a .n{ color:var(--phos-faint); }
.rundown a .bar{
  width:14px; height:1px; background:var(--phos-faint); align-self:center;
  transition:width .35s, background .35s;
}
.rundown a:hover{ opacity:1; color:var(--phos); transform:translateX(-4px); }
.rundown a.active{ opacity:1; color:var(--phos); }
.rundown a.active .bar{ width:34px; background:var(--tally); }
.rundown a.active .n{ color:var(--tally); }

/* ============================================================
   CUSTOM CURSOR — viewfinder reticle
   ============================================================ */
.vf{ position:fixed; left:0; top:0; z-index:8500; pointer-events:none;
     width:0; height:0; mix-blend-mode:difference; will-change:transform; }
.vf .frame{
  position:absolute; left:50%; top:50%;
  width:30px; height:30px; transform:translate(-50%,-50%);
  transition:width .22s cubic-bezier(.2,.7,.2,1), height .22s cubic-bezier(.2,.7,.2,1);
}
.vf .br{ position:absolute; width:9px; height:9px; border:1.5px solid var(--phos); }
.vf .br.tl{ left:0;  top:0;  border-right:0; border-bottom:0; }
.vf .br.tr{ right:0; top:0;  border-left:0;  border-bottom:0; }
.vf .br.bl{ left:0;  bottom:0;border-right:0; border-top:0; }
.vf .br.br2{right:0; bottom:0;border-left:0;  border-top:0; }
.vf .dot{
  position:absolute; left:50%; top:50%; width:3px; height:3px;
  background:var(--phos); border-radius:50%; transform:translate(-50%,-50%);
  transition:opacity .2s;
}
.vf .label{
  position:absolute; left:50%; top:calc(50% + 26px); transform:translateX(-50%);
  font-family:var(--mono); font-size:.56rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--phos); white-space:nowrap;
  opacity:0; transition:opacity .2s;
}
/* hover state — frame opens to "compose the shot" */
.vf.is-active .frame{ width:74px; height:54px; }
.vf.is-active .dot{ opacity:0; }
.vf.is-active .label{ opacity:1; }
.vf.is-rec .br{ border-color:var(--tally); }
.vf.is-rec .label{ color:var(--tally); }

/* ============================================================
   00 — SIGNAL / HERO
   ============================================================ */
#signal{
  position:relative; min-height:100svh; display:flex; align-items:flex-end;
  padding-block:118px clamp(56px,9vh,120px); overflow:hidden;
  /* studio radial glow — brand navy with light from centre */
  background:radial-gradient(ellipse 120% 80% at 58% 44%, #162264 0%, #050a30 68%);
}
#wave{ position:absolute; inset:0; width:100%; height:100%; z-index:0; }

.hero-inner{ position:relative; z-index:2; width:100%; }
.hero-meta{
  display:flex; justify-content:space-between; align-items:flex-end;
  gap:24px; flex-wrap:wrap; margin-bottom:clamp(18px,3vh,40px);
}
.hero-coords{ font-family:var(--mono); font-size:.66rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--phos-dim); line-height:2; }
.hero-coords b{ color:var(--phos); font-weight:500; }

.hero-name{
  font-family:var(--disp); font-weight:800;
  font-size:clamp(4.4rem, 17vw, 17rem); line-height:.82;
  letter-spacing:-.03em; margin:0; color:var(--phos);
  display:flex; align-items:baseline; gap:.12em; flex-wrap:wrap;
}
.hero-name .reg{
  font-family:var(--mono); font-weight:400;
  font-size:clamp(.7rem,1.2vw,1rem); letter-spacing:.08em;
  color:var(--phos-dim); align-self:flex-start; transform:translateY(.6em);
}
.hero-statement{
  max-width:46ch; margin-top:clamp(20px,3.5vh,40px);
  font-family:var(--serif); font-size:clamp(1.2rem,2.3vw,1.95rem);
  line-height:1.4; font-weight:400; color:var(--phos);
}
.hero-statement em{ color:var(--amber); font-style:italic; }

/* lower-third chyron */
.chyron{
  position:relative; z-index:2; margin-top:clamp(26px,4vh,46px);
  display:inline-flex; align-items:stretch;
  border-left:3px solid var(--tally); background:rgba(5,10,48,.65);
  backdrop-filter:blur(3px);
}
.chyron .who{ padding:11px 20px 11px 16px; }
.chyron .nm{ font-family:var(--disp); font-weight:700; font-size:1.05rem;
  letter-spacing:.01em; line-height:1.1; }
.chyron .rl{ font-family:var(--mono); font-size:.6rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--phos-dim); margin-top:3px; }
.chyron .tag{ display:flex; align-items:center; padding:0 18px;
  border-left:1px solid var(--phos-line);
  font-family:var(--mono); font-size:.58rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--amber); }

.scroll-cue{ position:absolute; bottom:26px; left:50%; transform:translateX(-50%);
  z-index:2; font-family:var(--mono); font-size:.56rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--phos-dim); display:flex;
  flex-direction:column; align-items:center; gap:8px; }
.scroll-cue .ln{ width:1px; height:34px; background:linear-gradient(var(--phos-dim),transparent);
  animation:drop 2.2s ease-in-out infinite; }
@keyframes drop{ 0%{transform:scaleY(0);transform-origin:top} 50%{transform:scaleY(1);transform-origin:top}
  51%{transform:scaleY(1);transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

/* ============================================================
   SECTION SCAFFOLD + signal divider
   ============================================================ */
section{ position:relative; }
.band{ padding-block:clamp(72px,11vh,148px); }
.sec-head{ margin-bottom:clamp(34px,6vh,72px); max-width:var(--maxw); }
.sec-head h2{
  font-family:var(--disp); font-weight:700;
  font-size:clamp(2.1rem,5.2vw,4.1rem); line-height:1.02;
  letter-spacing:-.02em; margin-top:18px; color:var(--phos);
}
.sec-head .lead{ margin-top:20px; max-width:54ch; color:var(--phos-dim);
  font-size:clamp(1.02rem,1.5vw,1.2rem); }

/* filmstrip / ruler divider */
.divider{ height:34px; position:relative; }
.divider::before{ content:""; position:absolute; left:var(--gut); right:var(--gut);
  top:50%; height:1px; background:var(--phos-line); }
.divider::after{ content:""; position:absolute; left:var(--gut); right:var(--gut);
  top:50%; height:9px; transform:translateY(-50%);
  background-image:repeating-linear-gradient(90deg, var(--phos-faint) 0 1px, transparent 1px 26px);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }

/* ============================================================
   01 — PROFIL
   ============================================================ */
#profil{ background:var(--vac-3); }
.profil-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
  gap:clamp(34px,5vw,84px); align-items:start; }
.monitor{ position:relative; }
.monitor-frame{ position:relative; border:1px solid var(--phos-line);
  background:var(--vac-4); padding:14px; }
.monitor-frame::before{ content:"CAM 01 · SIGNÁL"; position:absolute; top:-1px; left:14px;
  transform:translateY(-50%); background:var(--vac-3); padding:0 8px;
  font-family:var(--mono); font-size:.56rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--phos-dim); }
.monitor-frame::after{ content:"REC ●"; position:absolute; top:24px; right:26px;
  font-family:var(--mono); font-size:.56rem; letter-spacing:.18em; color:var(--tally);
  z-index:3; opacity:.9; }
.monitor-pic{ position:relative; overflow:hidden; aspect-ratio:4/5; background:var(--vac-4); }
.monitor-pic img{ width:100%; height:100%; object-fit:cover; object-position:center 18%;
  filter:grayscale(1) contrast(1.06) brightness(.9) sepia(.22);
  transition:filter .7s ease, transform 1.2s ease; transform:scale(1.02); }
.monitor-pic::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(232,65,44,.12), transparent 40%, rgba(5,10,48,.38));
  mix-blend-mode:multiply; transition:opacity .7s; }
.monitor-pic::before{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,.14) 0 1px, transparent 1px 3px);
  opacity:.45; transition:opacity .6s; }
.monitor:hover .monitor-pic img{ filter:none; transform:scale(1); }
.monitor:hover .monitor-pic::after{ opacity:0; }
.monitor:hover .monitor-pic::before{ opacity:0; }
.monitor-readout{ display:flex; justify-content:space-between; margin-top:11px;
  font-family:var(--mono); font-size:.56rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--phos-dim); }

.profil-body .kicker{ font-family:var(--disp); font-weight:600;
  font-size:clamp(1.5rem,2.8vw,2.5rem); line-height:1.18; letter-spacing:-.01em;
  color:var(--phos); margin-bottom:26px; }
.profil-body .kicker em{ font-family:var(--serif); font-style:italic; color:var(--amber); font-weight:400; }
.profil-body p{ color:var(--phos-dim); margin-bottom:18px; font-size:1.08rem; }
.profil-body p b{ color:var(--phos); font-weight:500; }
.profil-body p:first-of-type::first-letter{ font-family:var(--disp); font-weight:700; color:var(--tally);
  float:left; font-size:3.1em; line-height:.8; padding:.04em .12em 0 0; }

.credits-row{ display:flex; flex-wrap:wrap; gap:10px 12px; margin-top:30px; }
.credits-row .pill{ font-family:var(--mono); font-size:.6rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--phos-dim);
  border:1px solid var(--phos-line); padding:7px 12px; border-radius:1px; }

/* stat strip */
.statstrip{ display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--phos-line); margin-top:clamp(44px,7vh,80px); }
.statstrip .st{ padding:26px 18px 4px; border-right:1px solid var(--phos-line); }
.statstrip .st:last-child{ border-right:0; }
.statstrip .num{ font-family:var(--disp); font-weight:700; color:var(--phos);
  font-size:clamp(2rem,4vw,3.3rem); line-height:1; letter-spacing:-.02em; }
.statstrip .num span{ color:var(--tally); }
.statstrip .lbl{ font-family:var(--mono); font-size:.58rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--phos-dim); margin-top:12px; }

/* ============================================================
   02 — ČINNOSŤ (rundown / running order)
   ============================================================ */
#cinnost{ background:var(--vac-2); }
.rundown-list{ border-top:1px solid var(--phos-line); }
.seg{ position:relative; border-bottom:1px solid var(--phos-line);
  display:grid; grid-template-columns:84px minmax(0,1fr) auto;
  gap:clamp(16px,3vw,48px); align-items:start; padding:clamp(22px,3vh,34px) 0;
  cursor:pointer; transition:background .4s; }
.seg::before{ content:""; position:absolute; left:0; top:0; bottom:-1px; width:0;
  background:linear-gradient(90deg, rgba(232,65,44,.10), transparent);
  transition:width .5s ease; z-index:0; }
.seg:hover::before, .seg.open::before{ width:100%; }
.seg > *{ position:relative; z-index:1; }
.seg .code{ font-family:var(--mono); font-size:.7rem; letter-spacing:.12em;
  color:var(--phos-dim); padding-top:.5em; }
.seg .code .ix{ color:var(--tally); display:block; font-size:1.05rem; letter-spacing:0; }
.seg .main .ttl{ font-family:var(--disp); font-weight:600;
  font-size:clamp(1.4rem,3vw,2.3rem); line-height:1.08; letter-spacing:-.01em;
  color:var(--phos); transition:transform .45s cubic-bezier(.2,.7,.2,1); }
.seg:hover .main .ttl, .seg.open .main .ttl{ transform:translateX(10px); }
.seg .main .desc{ display:grid; grid-template-rows:0fr;
  transition:grid-template-rows .5s ease, opacity .5s, margin .5s; opacity:0; margin-top:0; }
.seg.open .main .desc{ grid-template-rows:1fr; opacity:1; margin-top:16px; }
.seg .main .desc > div{ overflow:hidden; }
.seg .main .desc p{ color:var(--phos-dim); max-width:62ch; padding-bottom:4px; }
.seg .toggle{ font-family:var(--mono); font-size:1.3rem; color:var(--phos-dim);
  padding-top:.2em; transition:transform .45s, color .3s; line-height:1; }
.seg.open .toggle{ transform:rotate(45deg); color:var(--tally); }

/* ============================================================
   03 — PODIELY (holdings / co-productions)
   ============================================================ */
#podiely{ background:var(--vac); }
.hold{ display:grid; grid-template-columns:64px minmax(0,1.5fr) minmax(0,1fr) 150px;
  gap:clamp(18px,3vw,46px); align-items:center;
  padding:clamp(26px,4vh,46px) 0; border-top:1px solid var(--phos-line);
  position:relative; transition:padding-left .45s; }
.hold:last-child{ border-bottom:1px solid var(--phos-line); }
.hold:hover{ padding-left:14px; }
.hold .hix{ font-family:var(--mono); font-size:.9rem; color:var(--tally); letter-spacing:0; }
.hold .hbody .hname{ font-family:var(--disp); font-weight:700;
  font-size:clamp(1.7rem,3.6vw,2.9rem); line-height:1; letter-spacing:-.02em; color:var(--phos); }
.hold .hbody .hrole{ font-family:var(--mono); font-size:.6rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--phos-dim); margin-top:10px; }
.hold .hdesc{ color:var(--phos-dim); font-size:.98rem; line-height:1.55; }
.hold .hmeta{ text-align:right; }
.hold .hstake{ font-family:var(--disp); font-weight:700; font-size:1.5rem; color:var(--phos);
  line-height:1; }
.hold .hstake small{ font-family:var(--mono); font-size:.54rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--phos-dim); display:block; margin-top:8px; font-weight:400; }
.hold .hlogo{ height:34px; margin-top:16px; margin-left:auto; opacity:.78;
  transition:opacity .4s; }
.hold .hlogo img{ height:100%; width:auto; object-fit:contain; }
.hold:hover .hlogo{ opacity:1; }
.hold .hgo{ position:absolute; right:0; bottom:18px; font-family:var(--mono);
  font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; color:var(--tally);
  opacity:0; transform:translateX(-8px); transition:.4s; }
.hold:hover .hgo{ opacity:1; transform:translateX(0); }

/* credits / references */
.refs{ margin-top:clamp(54px,8vh,96px); }
.refs .refs-lbl{ font-family:var(--mono); font-size:.62rem; letter-spacing:.24em;
  text-transform:uppercase; color:var(--phos-dim); margin-bottom:26px;
  display:flex; align-items:center; gap:1em; }
.refs .refs-lbl::after{ content:""; flex:1; height:1px; background:var(--phos-line); }
.client-logos{ display:flex; flex-wrap:wrap; align-items:center;
  gap:clamp(28px,5vw,68px); margin-bottom:34px; }
.client-logos img{ height:30px; width:auto; opacity:.5; filter:grayscale(1);
  transition:opacity .4s, filter .4s; }
.client-logos img:hover{ opacity:.95; filter:grayscale(0); }
.ref-names{ font-family:var(--mono); font-size:.74rem; line-height:2.1;
  letter-spacing:.04em; color:var(--phos-dim); columns: 1; }
.ref-names span{ display:inline; }
.ref-names span::after{ content:" · "; color:var(--phos-faint); }
.ref-names span:last-child::after{ content:""; }

.refs-lbl.refs-lbl-2{ margin-top:38px; }
.ref-links{ font-family:var(--mono); font-size:.74rem; line-height:2.1;
  letter-spacing:.04em; color:var(--phos-dim); }
.ref-links a{ color:var(--phos-dim); transition:color .25s; }
.ref-links a:hover{ color:var(--amber); }
.ref-links a::after{ content:" · "; color:var(--phos-faint); }
.ref-links a:last-child::after{ content:""; }

/* ============================================================
   FLOATING PHONE CTA — fixed, bottom-right, amber
   ============================================================ */
.phone-fab{
  position:fixed; right:28px; bottom:28px; z-index:7200;
  display:inline-flex; align-items:center;
  height:58px; border-radius:999px;
  background:var(--amber); color:var(--vac);
  box-shadow:0 6px 24px rgba(5,10,48,.45), 0 0 0 0 rgba(240,176,64,.45);
  overflow:hidden; white-space:nowrap;
  transition:box-shadow .35s ease, padding .35s ease;
  animation:fab-pulse 3.2s ease-in-out infinite;
}
.phone-fab-icon{
  display:flex; align-items:center; justify-content:center;
  width:58px; height:58px; flex:0 0 58px;
}
.phone-fab-icon svg{ display:block; }
.phone-fab-text, .phone-fab-num{
  font-size:.66rem; letter-spacing:.14em; text-transform:uppercase;
  max-width:0; opacity:0; overflow:hidden;
  transition:max-width .4s ease, opacity .3s ease, margin .4s ease;
  white-space:nowrap;
}
.phone-fab-text{ font-weight:600; }
.phone-fab-num{ font-weight:500; letter-spacing:.04em; text-transform:none; font-size:.78rem; }
.phone-fab:hover{
  padding-right:22px;
  box-shadow:0 8px 30px rgba(5,10,48,.5), 0 0 0 8px rgba(240,176,64,.18);
}
.phone-fab:hover .phone-fab-text{ max-width:80px; opacity:1; margin-left:4px; margin-right:8px; }
.phone-fab:hover .phone-fab-num{ max-width:160px; opacity:1; }
@keyframes fab-pulse{
  0%,100%{ box-shadow:0 6px 24px rgba(5,10,48,.45), 0 0 0 0 rgba(240,176,64,.4); }
  50%{ box-shadow:0 6px 24px rgba(5,10,48,.45), 0 0 0 9px rgba(240,176,64,0); }
}

/* ============================================================
   04 — SPOJENIE
   ============================================================ */
#spojenie{ background:var(--vac-3); }
.contact-grid{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
  gap:clamp(34px,6vw,90px); align-items:start; }
.contact-lead .big{ font-family:var(--disp); font-weight:700;
  font-size:clamp(2.4rem,6vw,5rem); line-height:.98; letter-spacing:-.025em; color:var(--phos); }
.contact-lead .em-link{ display:inline-flex; align-items:center; gap:.5em;
  margin-top:30px; font-family:var(--disp); font-weight:600;
  font-size:clamp(1.3rem,3vw,2.1rem); color:var(--phos);
  border-bottom:2px solid var(--tally); padding-bottom:6px; transition:gap .4s, color .3s; }
.contact-lead .em-link:hover{ gap:1em; color:var(--amber); }
.contact-lead .sub{ margin-top:24px; color:var(--phos-dim); max-width:44ch; }

.colophon{ font-family:var(--mono); font-size:.74rem; letter-spacing:.04em;
  line-height:1.95; color:var(--phos-dim); }
.colophon .row{ display:grid; grid-template-columns:128px 1fr; gap:14px;
  padding:13px 0; border-top:1px solid var(--phos-line); }
.colophon .row:last-child{ border-bottom:1px solid var(--phos-line); }
.colophon .row .k{ text-transform:uppercase; letter-spacing:.16em; color:var(--phos-faint); }
.colophon .row .v{ color:var(--phos); }
.colophon .row .v a{ border-bottom:1px solid var(--phos-line); }
.colophon .row .v a:hover{ color:var(--amber); border-color:var(--amber); }

/* ============================================================
   FOOTER — sign-off + SMPTE bar
   ============================================================ */
footer{ background:var(--vac); position:relative; }
.smpte{ display:flex; height:6px; }
.smpte i{ flex:1; }
.smpte i:nth-child(1){ background:#c8c0ad; }
.smpte i:nth-child(2){ background:var(--amber); }
.smpte i:nth-child(3){ background:#3f8a86; }
.smpte i:nth-child(4){ background:#6a8f4e; }
.smpte i:nth-child(5){ background:#9a5a8e; }
.smpte i:nth-child(6){ background:var(--tally); }
.smpte i:nth-child(7){ background:#3a5f9a; }
.foot-inner{ padding-block:clamp(46px,7vh,80px);
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; align-items:start; }
.foot-brand .foot-logo img{ height:30px; width:auto; }
.foot-brand .foot-tag{ margin-top:20px; color:var(--phos-dim); max-width:38ch; font-size:.98rem; }
.foot-brand .foot-reg{ margin-top:18px; font-family:var(--mono); font-size:.62rem;
  letter-spacing:.06em; line-height:1.9; color:rgba(240,234,224,.32); }
.foot-col h4{ font-family:var(--mono); font-size:.6rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--phos-dim); margin-bottom:18px; font-weight:500; }
.foot-col ul{ list-style:none; }
.foot-col li{ margin-bottom:11px; }
.foot-col a{ color:var(--phos); font-size:.95rem; transition:color .3s; }
.foot-col a:hover{ color:var(--amber); }
.foot-bottom{ border-top:1px solid var(--phos-line); padding-block:24px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
  font-family:var(--mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--phos-dim); }
.foot-bottom .endmark{ color:var(--tally); }

/* ============================================================
   REVEAL ANIMATION
   ============================================================ */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1); }
.reveal.in{ opacity:1; transform:none; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .rundown{ display:none; }
  .profil-grid{ grid-template-columns:1fr; gap:44px; }
  .monitor{ max-width:420px; }
  .contact-grid{ grid-template-columns:1fr; gap:48px; }
  .foot-inner{ grid-template-columns:1fr 1fr; }
}
@media (max-width:720px){
  body{ font-size:16px; }
  .topbar .ident .addr{ display:none; }
  .topbar{ padding:14px clamp(16px,4vw,30px); font-size:.6rem; }
  .topbar #tc{ display:none; }
  .topbar .live{ gap:.7em; }
  .topbar .langs button{ padding:.4em .32em; letter-spacing:.1em; }
  .topbar .bodortv-link{ display:none; }   /* hides both Bodor.TV and Facebook on mobile */
  .bgm-btn{ padding:.25em .44em; font-size:.68rem; }
  .hold{ grid-template-columns:42px 1fr; row-gap:8px; }
  .hold .hdesc{ grid-column:1/-1; }
  .hold .hmeta{ grid-column:1/-1; text-align:left; display:flex; align-items:flex-end;
    justify-content:space-between; }
  .hold .hlogo{ margin:0; }
  .hold .hgo{ position:static; opacity:1; transform:none; margin-top:6px; }
  .seg{ grid-template-columns:54px 1fr auto; }
  .statstrip{ grid-template-columns:repeat(2,1fr); }
  .statstrip .st:nth-child(2){ border-right:0; }
  .statstrip .st:nth-child(3),.statstrip .st:nth-child(4){ border-top:1px solid var(--phos-line); }
  .foot-inner{ grid-template-columns:1fr; gap:34px; }
  .chrome-corner{ width:18px; height:18px; }
  .phone-fab{ right:16px; bottom:16px; height:52px; }
  .phone-fab-icon{ width:52px; height:52px; flex:0 0 52px; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* hide custom cursor on touch / coarse pointers; keep native */
@media (pointer:fine){
  html.has-vf, html.has-vf *{ cursor:none; }
}