/* ═══════════════════════════════════════════
   YDUCK MEDIA — Depth & 3D UI vrstva
   Střídmé vrstvení, směrové stíny, tloušťka objektů,
   jemné světlo. Obsah, texty a brand se nemění.
   Vše funguje i bez animací / bez JS.
   ═══════════════════════════════════════════ */

:root {
  --depth-soft: 0 18px 34px -16px rgba(0,0,0,0.28);
  --depth-soft-hover: 0 26px 44px -18px rgba(0,0,0,0.36);
  --edge-shadow: rgba(0,0,0,0.26);
}

/* ─── Header: měkký stín po scrollu ─── */
body.header-scrolled .header {
  box-shadow: 0 10px 24px -14px rgba(0,0,0,0.22);
}

/* ─── 3D předěl sekcí — "schod" / svítící hrana desky ───
   Nahrazuje jemnou linku výraznou kachní hranou + tvrdým
   stínem: spodní sekce působí jako zvednutá deska, která
   vrhá stín na sekci nad sebou. */
.section + .section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 8px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.45), rgba(255,255,255,0) 55%),
    var(--kachna);
  transform: none;
  opacity: 1;
  box-shadow:
    0 -4px 0 rgba(0,0,0,0.65),
    0 -18px 26px -12px rgba(0,0,0,0.4);
  z-index: 2;
}

/* ─── HERO: vigneta + teplé kachní světlo (přes původní overlay) ─── */
.hero-overlay {
  background-image:
    radial-gradient(130% 100% at 50% 12%, rgba(255,218,68,0.16), transparent 52%),
    radial-gradient(150% 110% at 50% 112%, rgba(0,0,0,0.62), transparent 60%);
}

/* ─── Marquee: stuha v prostoru ─── */
.marquee {
  box-shadow: 0 14px 26px -14px rgba(0,0,0,0.4);
}

/* ─── O agentuře: tloušťka rámu + tilt + hover zoom videa ─── */
.about-video-wrap {
  position: relative;
  box-shadow: 8px 8px 0 var(--cerna), var(--depth-soft);
  will-change: transform;
}
.about-video-wrap:hover {
  transform: none;
  border-color: var(--raspberry);
  box-shadow: 12px 12px 0 rgba(0,0,0,0.2), var(--depth-soft-hover);
}
.about-video-wrap .about-video {
  transition: transform 0.3s ease;
}
.about-video-wrap:hover .about-video {
  transform: scale(1.03);
}

/* ─── Karty: tloušťka objektu + směrový měkký stín ─── */
.project-card,
.video-card-fusion,
.business-paper-card {
  position: relative;
}
.project-card {
  box-shadow: 8px 8px 0 var(--cerna), var(--depth-soft);
}
.project-card:hover {
  box-shadow: 10px 10px 0 var(--cerna), var(--depth-soft-hover);
}
.video-card-fusion {
  box-shadow: 6px 6px 0 var(--cerna), var(--depth-soft);
}
.video-card-fusion:hover {
  box-shadow: 14px 14px 0 var(--cerna), var(--depth-soft-hover);
}
.business-paper-card {
  box-shadow: 8px 8px 0 var(--cerna), var(--depth-soft);
}
.business-paper-card:hover {
  box-shadow: 16px 16px 0 var(--cerna), var(--depth-soft-hover);
}

/* tloustka hrany */
.project-card::after,
.video-card-fusion::after,
.business-paper-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-right: 3px solid var(--edge-shadow);
  border-bottom: 3px solid var(--edge-shadow);
  pointer-events: none;
  z-index: 1;
}
.section-dark .project-card::after {
  border-right-color: rgba(255,255,255,0.10);
  border-bottom-color: rgba(255,255,255,0.16);
}

/* featured karta: tilt řídí transform (hover lift jen stínem) */
.project-card-featured:hover {
  transform: none;
}

/* ─── Press: lepicí páska (papírový objekt) ─── */
.tape-strip {
  display: block;
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%) rotate(-4deg);
  width: 92px;
  height: 22px;
  background: rgba(255,218,68,0.55);
  border-left: 1px solid rgba(0,0,0,0.15);
  border-right: 1px solid rgba(0,0,0,0.15);
  box-shadow: 0 2px 4px rgba(0,0,0,0.18);
  z-index: 2;
}
body.dark-mode .tape-strip {
  background: rgba(255,218,68,0.45);
}

/* ─── Podcast: fyzické "zařízení" ─── */
.podcast-player-main,
.podcast-playlist {
  box-shadow: 10px 10px 0 #000;
}
.podcast-player-main {
  background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(0,0,0,0.32));
}
.podcast-btn {
  box-shadow: 4px 4px 0 #000;
}
.podcast-btn:active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 #000;
}

/* ─── Fun Zone: bezel depth ─── */
.funzone-card,
.funzone-featured {
  will-change: transform;
}
.funzone-card:hover,
.funzone-featured:hover {
  transform: translateY(-4px);
}

/* ─── Mobil: redukce těžkých stínů a hoveru ─── */
@media (max-width: 768px) {
  .project-card,
  .video-card-fusion,
  .business-paper-card,
  .about-video-wrap,
  .podcast-player-main,
  .podcast-playlist {
    box-shadow: 8px 8px 0 var(--cerna);
  }
  .funzone-card:hover,
  .funzone-featured:hover {
    transform: none;
  }
}

/* ─── Reduced motion: animace vypnuty (globální pravidlo zajišťuje zbytek) ─── */
