/* ============================================================
   cafe-core.css — sdílený engine pro Altán (kavárna & all-day bar)
   Vychází z Vítova liquid-glass enginu (shared.css + fv-core.css),
   přepsáno do TEPLÉ kávové palety. Dvě témata: tmavé espresso (default)
   a světlé „cream". Živé pozadí = jedna pevná vrstva (blury + dýchající
   tečky), liquid glass všude propouští rozmazané pozadí, reaktivní okraj
   závislý na vzdálenosti od kurzoru. Smooth ease-in-out všude. Žádné
   useklé hrany. Descendery (p,y,g,j) nikdy neoříznuté.
   ============================================================ */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Inter+Tight:wght@500;600;700;800&family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,500;1,9..144,600&family=Playfair+Display:ital,wght@0,500;0,600;1,500;1,600&display=swap");
@property --dot-r { syntax: "<number>"; inherits: false; initial-value: 1; }

:root{
  /* ---- tmavé espresso téma (default) ---- */
  --bg:#140c08; --bg2:#1d120b;
  --ink:#fdf4ea; --muted:rgba(253,244,234,.66); --faint:rgba(253,244,234,.42);
  --line:rgba(253,244,234,.10); --line2:rgba(253,244,234,.17);
  --crema:#f0d8b6; --caramel:#d39a5e; --amber:#e6a94f; --wine:#a23b4e; --wine-deep:#6e2233;
  --espresso:#2a1810; --leaf:#5f9a6a;
  --accent:var(--caramel); --accent-2:var(--amber);
  --glass-bg:rgba(255,247,238,.045); --glass-brd:rgba(255,240,225,.10);
  --gx:50vw; --gy:18vh; --mx:0; --my:0;
  --glow-on:1; --glow-mul:.72; --nav-a:0;
  --ease:cubic-bezier(.16,1,.3,1);
}
/* ---- světlé „cream" téma ---- */
.theme-cream{
  --bg:#f5ece0; --bg2:#efe3d3;
  --ink:#2a1a12; --muted:rgba(42,26,18,.66); --faint:rgba(42,26,18,.42);
  --line:rgba(42,26,18,.10); --line2:rgba(42,26,18,.16);
  --glass-bg:rgba(255,250,243,.50); --glass-brd:rgba(255,255,255,.72);
  --glow-mul:.5;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--ink); overflow-x:hidden;
  font-family:"Inter",system-ui,-apple-system,sans-serif; letter-spacing:-.011em;
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
h1,h2,h3,.tight{font-family:"Inter Tight","Inter",sans-serif; letter-spacing:-.034em; line-height:1.05}
/* descendery nikdy useklé: dost místa + žádný filter v klidu + viditelný overflow */
h1,h2,h3{padding-bottom:.06em;overflow:visible;filter:none}
.pf{font-family:"Playfair Display",serif; font-style:italic; font-weight:500; letter-spacing:-.02em}
.fr{font-family:"Fraunces",serif; font-weight:500; letter-spacing:-.01em}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.muted{color:var(--muted)} .faint{color:var(--faint)}
section{scroll-margin-top:96px}

/* ---------- kontinuální teplý základ (žádné černé díry) ---------- */
.base-glow{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(85% 60% at 50% -8%,rgba(120,70,28,.30),transparent 62%),
    radial-gradient(70% 55% at 82% 108%,rgba(120,40,52,.20),transparent 66%),
    radial-gradient(70% 55% at 14% 96%,rgba(150,100,40,.18),transparent 66%);}
.theme-cream .base-glow{
  background:
    radial-gradient(85% 60% at 50% -8%,rgba(220,170,110,.32),transparent 62%),
    radial-gradient(70% 55% at 82% 108%,rgba(200,120,130,.20),transparent 66%),
    radial-gradient(70% 55% at 14% 96%,rgba(230,190,140,.24),transparent 66%);}

/* ---------- živé teplé blury (parallax na myš) ---------- */
.bg-blobs{position:fixed;inset:-16%;z-index:0;pointer-events:none;opacity:.82;
  transform:translate3d(calc(var(--mx)*26px),calc(var(--my)*26px),0);transition:transform .5s var(--ease)}
.bg-blobs i{position:absolute;display:block;border-radius:50%;mix-blend-mode:screen;filter:blur(66px) saturate(1.25);will-change:transform}
.theme-cream .bg-blobs{mix-blend-mode:normal;opacity:.55}
.theme-cream .bg-blobs i{mix-blend-mode:multiply;filter:blur(72px) saturate(1.1)}
.blob1{width:52vw;height:52vw;background:radial-gradient(circle,rgba(211,154,94,.52),transparent 64%);left:-10vw;top:-10vw;animation:blobA 8.2s ease-in-out infinite alternate}
.blob2{width:46vw;height:46vw;background:radial-gradient(circle,rgba(162,59,78,.42),transparent 64%);right:-12vw;top:0vw;animation:blobB 9.8s ease-in-out infinite alternate}
.blob3{width:48vw;height:48vw;background:radial-gradient(circle,rgba(230,169,79,.46),transparent 64%);left:12vw;bottom:-20vw;animation:blobC 10.9s ease-in-out infinite alternate}
.blob4{width:40vw;height:40vw;background:radial-gradient(circle,rgba(150,96,52,.44),transparent 64%);right:8vw;bottom:-14vw;animation:blobD 9.3s ease-in-out infinite alternate}
.blob5{width:42vw;height:42vw;background:radial-gradient(circle,rgba(196,120,70,.4),transparent 66%);left:30vw;top:22vh;animation:blobE 12.6s ease-in-out infinite alternate}
@keyframes blobA{0%{transform:translate(0,0) scale(1)}50%{transform:translate(22vw,24vh) scale(1.22)}100%{transform:translate(36vw,10vh) scale(1.08)}}
@keyframes blobB{0%{transform:translate(0,0) scale(1.05)}50%{transform:translate(-24vw,18vh) scale(.9)}100%{transform:translate(-12vw,30vh) scale(1.16)}}
@keyframes blobC{0%{transform:translate(0,0) scale(1)}50%{transform:translate(18vw,-20vh) scale(1.24)}100%{transform:translate(-12vw,-6vh) scale(1.05)}}
@keyframes blobD{0%{transform:translate(0,0) scale(.96)}50%{transform:translate(-20vw,-18vh) scale(1.14)}100%{transform:translate(-4vw,-28vh) scale(1)}}
@keyframes blobE{0%{transform:translate(0,0) scale(1)}50%{transform:translate(16vw,14vh) scale(1.2)}100%{transform:translate(-18vw,6vh) scale(.93)}}

/* ---------- tečky: jedna vrstva, dýchající (malý range) ---------- */
.dots-bg{position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:radial-gradient(circle at center,rgba(220,180,140,.20) calc(var(--dot-r)*1px),transparent calc(var(--dot-r)*1px + .8px));
  background-size:23px 23px;animation:dotBreath 6s ease-in-out infinite}
.theme-cream .dots-bg{background-image:radial-gradient(circle at center,rgba(120,80,40,.16) calc(var(--dot-r)*1px),transparent calc(var(--dot-r)*1px + .8px))}
@keyframes dotBreath{0%,100%{--dot-r:.7}50%{--dot-r:.95}}

/* ---------- světelný zdroj u kurzoru (idle-fade, dim nad contentem) ---------- */
.light-glow{position:fixed;left:var(--gx);top:var(--gy);width:540px;height:540px;z-index:1;
  transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  opacity:calc(var(--glow-on) * var(--glow-mul));transition:opacity .55s var(--ease);
  background:radial-gradient(circle,rgba(230,169,79,.14),rgba(211,154,94,.06) 42%,transparent 70%);filter:blur(26px)}
.theme-cream .light-glow{background:radial-gradient(circle,rgba(200,130,60,.16),rgba(230,180,120,.06) 42%,transparent 70%)}

/* ---------- mesh gradienty (bohaté, teplé) ---------- */
.grad-caramel{
  background:
    radial-gradient(120% 160% at 12% -10%,#f0c089 0%,rgba(240,192,137,0) 46%),
    radial-gradient(125% 170% at 100% 110%,#c47b3c 0%,rgba(196,123,60,0) 52%),
    radial-gradient(150% 230% at 55% 135%,#7c3d1c 0%,rgba(124,61,28,0) 56%),
    linear-gradient(135deg,#9a531f,#c98a4b);
  background-size:215% 215%,215% 215%,215% 215%,100% 100%;
  animation:meshMove 2.6s ease-in-out infinite alternate}
.grad-wine{
  background:
    radial-gradient(120% 160% at 14% -8%,#d77f8f 0%,rgba(215,127,143,0) 44%),
    radial-gradient(130% 180% at 100% 112%,#9c2f44 0%,rgba(156,47,68,0) 50%),
    radial-gradient(150% 230% at 55% 135%,#4e1422 0%,rgba(78,20,34,0) 54%),
    linear-gradient(135deg,#5e1d2c,#a23b4e);
  background-size:180% 180%,180% 180%,180% 180%,100% 100%;
  animation:meshMove 2.6s ease-in-out infinite alternate}
.grad-espresso{
  background:
    radial-gradient(120% 160% at 14% -8%,#6b4630 0%,rgba(107,70,48,0) 44%),
    radial-gradient(130% 180% at 100% 112%,#3a241a 0%,rgba(58,36,26,0) 50%),
    radial-gradient(150% 230% at 55% 135%,#1a0f0a 0%,rgba(26,15,10,0) 54%),
    linear-gradient(135deg,#241510,#4a2e20);
  background-size:180% 180%,180% 180%,180% 180%,100% 100%;
  animation:meshMove 2.9s ease-in-out infinite alternate}
.grad-amber{
  background:
    radial-gradient(120% 160% at 14% -8%,#ffd07a 0%,rgba(255,208,122,0) 44%),
    radial-gradient(130% 180% at 100% 112%,#e0892f 0%,rgba(224,137,47,0) 50%),
    radial-gradient(150% 230% at 55% 135%,#8a4a12 0%,rgba(138,74,18,0) 54%),
    linear-gradient(135deg,#b9651b,#e6a94f);
  background-size:180% 180%,180% 180%,180% 180%,100% 100%;
  animation:meshMove 2.4s ease-in-out infinite alternate}
@keyframes meshMove{
  0%{background-position:0% 8%,100% 92%,38% 100%,0 0}
  50%{background-position:70% 40%,30% 60%,72% 28%,0 0}
  100%{background-position:24% 84%,76% 16%,18% 70%,0 0}}
.grad-text{background:linear-gradient(100deg,#f0d8b6,#e6a94f 50%,#f3ddb8);
  -webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- liquid glass (propouští rozmazané pozadí + 3D stín) ---------- */
.glass{
  position:relative; isolation:isolate;
  background:var(--glass-bg);
  -webkit-backdrop-filter:blur(15px) saturate(1.35); backdrop-filter:blur(15px) saturate(1.35);
  border:1px solid var(--glass-brd); border-radius:20px;
  box-shadow:inset 0 1px 0 rgba(255,245,230,.10), 0 2px 10px rgba(20,8,4,.24), 0 22px 54px rgba(20,8,4,.34);
}
.theme-cream .glass{box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 2px 10px rgba(90,50,20,.10), 0 24px 60px rgba(90,50,20,.16)}
.glass::before{ /* specular fill — slábne se vzdáleností (--edge-i) */
  content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; pointer-events:none;
  opacity:var(--edge-i,1);
  background:radial-gradient(220px circle at var(--lx,50%) var(--ly,0%),rgba(255,240,220,.12),transparent 72%);}
.theme-cream .glass::before{background:radial-gradient(220px circle at var(--lx,50%) var(--ly,0%),rgba(255,255,255,.5),transparent 72%)}
.glass::after,.btn::after,.pill::after,.seg::after{ /* reaktivní okraj — smooth, slábne se vzdáleností */
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none;
  background:conic-gradient(from var(--la,0deg),
    rgba(255,238,214,.5),rgba(255,238,214,.06) 58deg,rgba(255,238,214,.03) 180deg,
    rgba(255,238,214,.06) 302deg,rgba(255,238,214,.5) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:var(--edge-i,1);}
.theme-cream .glass::after,.theme-cream .btn::after,.theme-cream .pill::after,.theme-cream .seg::after{
  background:conic-gradient(from var(--la,0deg),
    rgba(255,255,255,.85),rgba(255,255,255,.12) 58deg,rgba(255,255,255,.06) 180deg,
    rgba(255,255,255,.12) 302deg,rgba(255,255,255,.85) 360deg)}
.btn::after,.pill::after,.seg::after{opacity:calc(var(--edge-i,1)*.8)}
.glass.no-edge::after{display:none}

/* ---------- layout ---------- */
.container{max-width:1180px;margin:0 auto;padding:0 28px}
.section{position:relative;z-index:3;padding:clamp(60px,8vw,104px) 0}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}
.eyebrow::before{content:"";width:24px;height:1.5px;background:var(--accent);opacity:.7;border-radius:2px}
h1{font-size:clamp(44px,7.4vw,82px);font-weight:700}
h2{font-size:clamp(28px,4.2vw,50px);font-weight:700}
h3{font-size:21px;font-weight:600;letter-spacing:-.02em}
.lead{font-size:clamp(16px,1.6vw,20px);color:var(--muted);line-height:1.62}

/* ---------- buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:9px;font-family:inherit;font-weight:600;font-size:15px;
  letter-spacing:-.01em;padding:14px 25px;border-radius:999px;border:none;cursor:pointer;
  transition:transform .3s var(--ease),filter .3s var(--ease),box-shadow .3s var(--ease)}
.btn i{font-size:18px}
.btn-primary{position:relative;overflow:hidden;color:#2a1408;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30),0 2px 8px rgba(40,16,6,.25),0 12px 30px rgba(150,86,30,.42)}
.btn-primary::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(120px circle at var(--lx,50%) var(--ly,50%),rgba(255,255,255,.10),transparent 62%);opacity:var(--edge-i,1)}
.btn-primary:hover{transform:translateY(-2px);filter:brightness(1.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 18px 44px rgba(150,86,30,.55)}
.btn-ghost{color:var(--ink);background:rgba(255,245,232,.05);border:1px solid var(--line2);
  -webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2)}
.theme-cream .btn-ghost{background:rgba(255,252,247,.5)}
.btn-ghost:hover{transform:translateY(-2px);background:rgba(255,245,232,.11)}
.theme-cream .btn-ghost:hover{background:rgba(255,255,255,.75)}

/* ---------- pills / chips ---------- */
.pill{position:relative;display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted);
  border:1px solid var(--line2);background:var(--glass-bg);padding:7px 15px;border-radius:999px;
  -webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);
  transition:transform .3s var(--ease),background .3s var(--ease)}
.pill:hover{transform:translateY(-2px)}
.chip{display:inline-block;font-size:12px;font-weight:600;color:var(--crema);background:rgba(211,154,94,.16);
  border:1px solid rgba(211,154,94,.32);padding:3px 11px;border-radius:999px}
.theme-cream .chip{color:var(--wine-deep);background:rgba(162,59,78,.10);border-color:rgba(162,59,78,.28)}

/* živá blikající status tečka (otevřeno) */
.live-dot{width:7px;height:7px;border-radius:50%;background:#5fb87a;animation:liveBlink 2.5s ease-in-out infinite}
@keyframes liveBlink{0%,100%{opacity:.5;box-shadow:0 0 0 0 rgba(95,184,122,0)}50%{opacity:1;box-shadow:0 0 9px 1px rgba(95,184,122,.5)}}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;
  padding:16px 30px;transition:background .5s var(--ease),border-color .5s var(--ease);
  background:rgba(20,12,8,calc(var(--nav-a)*.66));-webkit-backdrop-filter:blur(calc(var(--nav-a)*13px));backdrop-filter:blur(calc(var(--nav-a)*13px));
  border-bottom:1px solid rgba(253,244,234,calc(var(--nav-a)*.1))}
.theme-cream .nav{background:rgba(245,236,224,calc(var(--nav-a)*.74));border-bottom-color:rgba(42,26,18,calc(var(--nav-a)*.09))}
.brand{display:inline-flex;align-items:center;gap:11px;font-family:"Inter Tight";font-size:24px;font-weight:700;letter-spacing:-.04em;line-height:1}
.brand .pf,.brand .fr{font-size:25px}
.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;color:#2a1408;
  box-shadow:0 6px 16px rgba(150,86,30,.42),inset 0 1px 0 rgba(255,255,255,.5);font-size:18px}
.nav-links{display:flex;gap:4px}
.nav-links a{padding:9px 15px;font-size:14.5px;font-weight:500;color:var(--muted);border-radius:999px;transition:background .3s,color .3s}
.nav-links a:hover{color:var(--ink);background:var(--glass-bg)}
@media(max-width:820px){.nav-links{display:none}.nav{padding:14px 18px}}

/* ---------- scroll reveal ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}.reveal[data-d="4"]{transition-delay:.32s}.reveal[data-d="5"]{transition-delay:.40s}

/* ---------- marquee ---------- */
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marquee-track{display:flex;gap:30px;width:max-content;animation:marquee 36s linear infinite}
/* marquee bez hover-pause — plynulý nepřetržitý scroll */
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- scroll progress ---------- */
.scroll-prog{position:fixed;top:0;left:0;height:2px;width:0;z-index:80;
  background:linear-gradient(90deg,var(--caramel),var(--amber));box-shadow:0 0 12px rgba(230,169,79,.6)}

/* ---------- form ---------- */
.field{width:100%;font-family:inherit;font-size:15px;color:var(--ink);background:var(--glass-bg);
  border:1px solid var(--line2);border-radius:12px;padding:13px 15px;transition:border .25s,background .25s}
.field::placeholder{color:var(--faint)}
.field:focus{outline:none;border-color:var(--accent)}

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