:root{
  --bg:#edeff3;
  --panel:#ffffff;
  --ink:#0b0d14;
  --muted:#646a76;
  --accent:#e5322b;
  --accent-deep:#b3231d;
  --line:rgba(11,13,20,.12);
  --max:1240px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}

/* heading mask reveal */
.mask-rise{overflow:hidden;padding-bottom:.08em}
.mask-rise__in{display:block;transform:translateY(112%);transition:transform 1s var(--ease)}
.mask-rise.in .mask-rise__in{transform:translateY(0)}
body{background:var(--bg);color:var(--ink);font-family:"Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip;line-height:1.55}
::selection{background:var(--accent);color:#fff}
a{color:inherit;text-decoration:none}
img,svg{display:block}
.eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent-deep);font-weight:600}
.display{font-family:"Manrope",sans-serif;font-weight:800;letter-spacing:-.025em;line-height:.94;text-transform:uppercase}

/* ---------- BUTTONS ---------- */
.btn{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:15px;padding:15px 28px;border-radius:999px;cursor:pointer;border:1px solid var(--ink);background:var(--ink);color:#fff;transition:transform .2s var(--ease),background .2s,color .2s}
.btn:hover{transform:translateY(-2px)}
.btn--accent{background:var(--accent);border-color:var(--accent);color:#fff}
.btn .a{transition:transform .3s var(--ease)}
.btn:hover .a{transform:translateX(5px)}

/* ---------- NAV ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:24px clamp(22px,4vw,52px);transition:background .4s,backdrop-filter .4s,padding .4s,box-shadow .4s}
nav.scrolled{background:rgba(243,242,236,.82);backdrop-filter:blur(12px);padding-top:14px;padding-bottom:14px;box-shadow:0 1px 0 var(--line)}
.brand{display:flex;align-items:center;gap:12px}
.brand__knot{width:30px;height:30px;filter:none}
.brand__name{font-family:"Manrope",sans-serif;font-weight:800;letter-spacing:.04em;font-size:16px}
.nav-links{display:flex;gap:34px}
.nav-links a{position:relative;font-size:14px;color:var(--ink);opacity:.82;transition:opacity .25s}
.nav-links a:hover{opacity:1}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:1.5px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .38s var(--ease)}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-cta{font-size:13px;font-weight:600;padding:9px 18px;border-radius:999px;background:var(--accent);color:#fff;transition:transform .2s var(--ease)}
.nav-cta:hover{transform:translateY(-2px)}
.nav-toggle{display:none;background:none;border:0;color:var(--ink);font-size:12px;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;z-index:66}

/* ---------- HERO ---------- */
.hero{position:sticky;top:0;min-height:100svh;display:grid;grid-template-columns:1.05fr .95fr;align-items:stretch}
.hero__copy{display:flex;flex-direction:column;justify-content:center;padding:120px clamp(22px,4vw,52px) 80px;position:relative;z-index:3}
.hero__eyebrow{opacity:0;animation:fade .8s ease .2s forwards}
.hero__title{font-family:"Manrope",sans-serif;font-weight:800;letter-spacing:-.02em;line-height:.97;text-transform:uppercase;font-size:clamp(46px,7.4vw,114px);margin:26px 0 0}
.hero__title span{display:block;overflow:hidden;padding-top:.08em;margin-top:-.08em}
.hero__title span>i{display:block;font-style:normal;transform:translateY(106%);animation:rise 1s var(--ease) forwards}
.hero__title span:nth-child(1)>i{animation-delay:.35s}
.hero__title span:nth-child(2)>i{animation-delay:.5s;color:var(--accent)}
@keyframes rise{to{transform:translateY(0)}}
.hero__lead{max-width:440px;margin-top:26px;color:var(--muted);font-size:clamp(16px,1.5vw,19px);opacity:0;animation:fade .8s ease 1s forwards}
.hero__actions{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap;opacity:0;animation:fade .8s ease 1.2s forwards}
@keyframes fade{to{opacity:1}}

.hero__media{position:relative;overflow:hidden;clip-path:inset(0 0 100% 0);animation:hero-reveal 1.3s var(--ease) .15s forwards}
@keyframes hero-reveal{to{clip-path:inset(0 0 0 0)}}
.hero__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 28%;filter:grayscale(100%) contrast(1.05) brightness(.98);transform:scale(1.12);animation:hero-zoom 18s var(--ease) .15s forwards;will-change:transform}
@keyframes hero-zoom{to{transform:scale(1)}}
.hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bg),transparent 22%)}

.hero__scroll{position:absolute;left:clamp(22px,4vw,52px);bottom:30px;z-index:4;display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11px;letter-spacing:.18em;text-transform:uppercase;opacity:0;animation:fade .8s ease 1.5s forwards}
.hero__scroll .line{width:46px;height:1px;background:var(--ink);transform-origin:left;animation:scrollline 2s var(--ease) infinite}
@keyframes scrollline{0%,100%{transform:scaleX(.4)}50%{transform:scaleX(1)}}

/* ---------- SECTION SHELL ---------- */
.section{padding:clamp(90px,12vw,150px) clamp(22px,4vw,52px)}
.section-head{max-width:var(--max);margin:0 auto 56px;display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap}
.section-head__l{max-width:640px}
.section-head h2{font-family:"Manrope",sans-serif;font-weight:800;font-size:clamp(30px,4.4vw,56px);line-height:1.02;letter-spacing:-.02em;margin-top:14px}
.section-head__r{color:var(--muted);font-size:16px;max-width:300px;text-align:right}

/* ---------- MANIFEST ---------- */
.manifest__grid{max-width:var(--max);margin:0 auto}
.manifest__body{margin-top:24px;font-size:clamp(21px,2.6vw,36px);line-height:1.42;color:var(--ink);opacity:.9;letter-spacing:-.01em}
.manifest__lead{margin-top:34px;font-family:"Manrope",sans-serif;font-weight:700;font-size:clamp(30px,4.6vw,64px);line-height:1.08;letter-spacing:-.02em}
.manifest__lead b{color:var(--accent)}
.manifest__by{margin-top:24px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

/* ---------- EBOOKY — scroll-driven rotating logo ---------- */
.es{position:relative;height:680vh}
.es__sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;background:var(--bg);color:var(--ink);--es-bg:var(--bg);transition:background-color .7s ease,color .7s ease}
.es__sticky[data-theme="dark"]{background:#0b0d14;color:#fff;--es-bg:#0b0d14}
.es__sticky[data-theme="light"]{background:#ffffff;color:#0b0d14;--es-bg:#ffffff}
.es__sticky[data-theme="blue"]{background:var(--accent);color:#fff;--es-bg:var(--accent)}
.es__inner{position:relative;z-index:2;width:100%;max-width:1340px;margin:0 auto;height:100%;padding:0 clamp(22px,4vw,52px)}
.es__label{position:absolute;top:34px;left:clamp(22px,4vw,52px);font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.55;z-index:4}

/* big photo on the right (full-bleed to the corner) */
.es__media{position:absolute;top:0;right:0;bottom:0;width:clamp(360px,46vw,760px);z-index:1;overflow:hidden}
.es__pic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:grayscale(100%) contrast(1.04);opacity:0;transform:scale(1.06);transition:opacity .8s ease,transform 1.4s var(--ease)}
.es__pic.active{opacity:1;transform:scale(1)}
.es__media-fade{position:absolute;inset:0;background:linear-gradient(90deg,var(--es-bg) 1%,transparent 30%);pointer-events:none}

/* logo on the left */
.es__logo{position:absolute;top:50%;left:50%;width:clamp(110px,12vw,200px);transform:translate(-50%,-50%);will-change:transform;z-index:2}
.es__logo img{width:100%;height:auto;transition:filter .7s ease}
.es__sticky[data-theme="dark"] .es__logo img,.es__sticky[data-theme="blue"] .es__logo img{filter:invert(1)}

/* text panels (bigger), middle */
.es__panels{position:absolute;left:clamp(150px,22vw,340px);right:clamp(40px,5vw,90px);top:50%;transform:translateY(-50%);height:58vh;z-index:3}
.es__panel{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;transform:translateY(26px);transition:opacity .6s ease,transform .8s var(--ease);pointer-events:none}
.es__panel.active{opacity:1;transform:none;pointer-events:auto}
.es__kicker{display:block;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.es__sticky[data-theme="light"] .es__kicker{color:var(--accent-deep)}
.es__sticky[data-theme="blue"] .es__kicker{color:#fff;opacity:.85}
.es__kicker{font-size:clamp(13px,1.1vw,15px)}
.es__name{font-family:"Manrope",sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(42px,7.5vw,118px);line-height:.94;letter-spacing:-.03em;margin-top:14px}
.es__desc{margin-top:22px;max-width:440px;font-size:clamp(16px,1.6vw,21px);line-height:1.5;opacity:.84}
.es__hook{margin-top:16px;max-width:600px;font-size:clamp(15px,1.35vw,18px);line-height:1.5;font-weight:600;color:var(--accent)}
.es__sticky[data-theme="light"] .es__hook{color:var(--accent-deep)}
.es__sticky[data-theme="blue"] .es__hook{color:#fff}
.es__cta{display:inline-block;margin-top:22px;font-size:14px;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid currentColor;padding-bottom:7px}

/* static fallback (mobile / reduced motion) */
.es--static{height:auto}
.es--static .es__sticky{position:static;height:auto;display:block;padding:clamp(70px,10vw,110px) 0;background:var(--bg);color:var(--ink)}
.es--static .es__inner{height:auto}
.es--static .es__logo,.es--static .es__label{display:none}
.es--static .es__media{position:static;width:100%;height:46vw;max-height:360px;margin-bottom:30px}
.es--static .es__pic{opacity:0}.es--static .es__pic:first-child{opacity:1}
.es--static .es__media-fade{display:none}
.es--static .es__panels{position:static;transform:none;width:100%;height:auto;display:flex;flex-direction:column;gap:0}
.es--static .es__panel{position:static;opacity:1;transform:none;pointer-events:auto;border-top:1px solid var(--line);padding:34px 0;width:100%}
.es--static .es__panel .es__kicker{color:var(--accent)}

/* mobile: pinned rotating logo stays — logo top-centre, text below, centred */
@media(max-width:900px){
  .es__logo{top:30%;width:clamp(140px,38vw,230px)}
  .es__panels{left:22px;right:22px;top:auto;bottom:8vh;height:42vh;transform:none;text-align:center;z-index:3}
  .es__panel{align-items:center;justify-content:center}
  .es__name{font-size:clamp(34px,10vw,56px);margin-top:14px}
  .es__desc,.es__hook{margin-left:auto;margin-right:auto;font-size:15px}
  .es__cta{margin-top:20px}
}

/* ---------- REFERENCE ---------- */
.refs{background:var(--ink);color:#fff}
.refs .section-head h2{color:var(--ink)}
.refs .eyebrow{color:var(--accent)}
.refs .section-head__r{color:rgba(255,255,255,.6)}
/* horizontal moving photo collage (two rows, opposite directions) */
.marq{position:relative;width:100vw;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:14px;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marq__row{overflow:hidden}
.marq__track{display:flex;gap:14px;width:max-content;will-change:transform;animation:marq-l 70s linear infinite}
.marq__track.is-rev{animation:marq-r 70s linear infinite}
.marq:hover .marq__track{animation-play-state:paused}
.marq__track img{height:clamp(150px,21vw,250px);width:auto;border-radius:12px;display:block;cursor:pointer;filter:saturate(1.04) contrast(1.02);transition:transform .45s var(--ease),box-shadow .45s ease}
.marq__track img:hover{transform:scale(1.05);box-shadow:0 16px 40px rgba(0,0,0,.55)}
@keyframes marq-l{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes marq-r{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.marq__row{overflow-x:auto}.marq__track{animation:none}}
.refs__cta{max-width:var(--max);margin:54px auto 0;display:flex;justify-content:center}

/* ---------- NABÍDKA — one section, bubble cards in a horizontal scroll ---------- */
.offers{padding:clamp(80px,11vw,130px) 0;background:var(--bg);overflow:hidden}
.offers__head{max-width:var(--max);margin:0 auto 30px;padding:0 clamp(20px,5vw,52px);display:flex;align-items:baseline;justify-content:space-between;gap:20px}
.offers__hint{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.offers__row{display:flex;gap:22px;align-items:stretch;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding:6px clamp(20px,5vw,52px) 24px;scroll-padding-left:clamp(20px,5vw,52px)}
.offers__row::-webkit-scrollbar{height:8px}
.offers__row::-webkit-scrollbar-thumb{background:rgba(13,15,18,.22);border-radius:8px}
.offers__row::-webkit-scrollbar-track{background:transparent}
.offercard{flex:0 0 auto;width:clamp(278px,80vw,400px);scroll-snap-align:start;display:flex}
/* star-border: a rotating conic-gradient ring around the bubble */
.sb{position:relative;flex:1;display:flex;border-radius:26px;overflow:hidden;padding:2px;background:#0a0a0e;box-shadow:0 24px 54px rgba(0,0,0,.28)}
.sb::before{content:"";position:absolute;left:50%;top:50%;width:175%;aspect-ratio:1;transform:translate(-50%,-50%);background:conic-gradient(from 0deg,transparent 0deg,transparent 232deg,var(--accent) 300deg,#ff9c88 326deg,transparent 360deg);z-index:0}
/* start all glows with the SAME class at the SAME moment → perfectly in sync */
.offers.glow-on .sb::before{animation:sb-spin 3.5s linear infinite}
@keyframes sb-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.sb__inner{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;justify-content:center;background:#15151c;border-radius:24px;padding:clamp(26px,3.2vw,40px);color:#fff;min-width:0}
.offercard .offer__idx{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.offercard .offer__name{font-family:"Manrope",sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(26px,3vw,40px);line-height:1.02;letter-spacing:-.02em;margin-top:12px;overflow-wrap:break-word}
.offercard .offer__text{margin-top:16px;font-size:15px;line-height:1.6;color:rgba(255,255,255,.85)}
.offercard .offer__hook{margin-top:14px;font-size:15px;line-height:1.5;font-weight:600;color:#ff8071}
.offercard .offer__cta{display:inline-block;margin-top:20px;width:max-content;font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#fff;border-bottom:1px solid var(--accent);padding-bottom:5px;transition:color .25s}
.offercard .offer__cta:hover{color:#ff8071}
@media(prefers-reduced-motion:reduce){.sb::before{animation:none}}

/* ---------- KONTAKT ---------- */
.contact__grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,90px);align-items:start}
.contact__title{font-family:"Manrope",sans-serif;font-weight:800;font-size:clamp(28px,4vw,52px);line-height:1.06;letter-spacing:-.02em;margin-top:16px}
.contact__meta{margin-top:32px;display:flex;flex-direction:column;gap:10px;font-size:15px;color:var(--muted)}
.contact__meta a{color:var(--accent-deep);width:max-content;border-bottom:1px solid var(--line);padding-bottom:3px}
.contact__form{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:32px;display:flex;flex-direction:column;gap:20px}
.field{position:relative}
.field input,.field textarea{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:12px;color:var(--ink);font-family:inherit;font-size:15px;padding:14px 15px;resize:vertical;transition:border-color .25s,background .25s}
.field input::placeholder,.field textarea::placeholder{color:#a0a4aa}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent-deep);background:#fff}
.field input.invalid,.field textarea.invalid{border-color:#cf4a3e}
.field label{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;font-weight:600}
.form-note{font-size:14px;color:var(--accent-deep);min-height:18px}
.form-note.err{color:#c23a30}
.contact__form .btn{justify-content:center}

/* honeypot: invisible to real visitors, catches simple bots */
.hp{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden;opacity:0}

/* GDPR consent checkbox */
.consent{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5;color:var(--muted)}
.consent input{margin-top:3px;width:16px;height:16px;accent-color:var(--accent);flex:0 0 auto;cursor:pointer}
.consent label{cursor:pointer}
.consent a{color:var(--accent-deep);text-decoration:underline;text-underline-offset:2px}
.consent.invalid,.consent.invalid a{color:#c23a30}

/* ---------- FOOTER ---------- */
footer{max-width:var(--max);margin:0 auto;padding:40px clamp(22px,4vw,52px) 80px;display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid var(--line)}
footer .mark{font-family:"Manrope",sans-serif;font-weight:800;font-size:22px}
footer .meta{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-align:right;line-height:1.9}
footer .legal-links{display:flex;gap:16px;margin-top:8px}
footer .legal-links a{color:var(--muted);text-decoration:underline;text-underline-offset:2px;transition:color .2s}
footer .legal-links a:hover{color:var(--ink)}

/* ---------- LEGAL PAGES ---------- */
.legal{max-width:760px;margin:0 auto;padding:clamp(120px,14vw,160px) clamp(22px,4vw,52px) clamp(80px,10vw,120px)}
.legal__back{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:26px}
.legal__back:hover{color:var(--ink)}
.legal h1{font-family:"Manrope",sans-serif;font-weight:800;font-size:clamp(30px,4.4vw,48px);line-height:1.05;letter-spacing:-.02em}
.legal__updated{margin-top:12px;font-size:13px;color:var(--muted)}
.legal h2{font-family:"Manrope",sans-serif;font-weight:700;font-size:clamp(19px,2.2vw,24px);margin-top:44px;margin-bottom:14px;letter-spacing:-.01em}
.legal p,.legal li{font-size:15.5px;line-height:1.7;color:var(--ink);opacity:.88}
.legal p+p{margin-top:14px}
.legal ul{margin-top:10px;padding-left:22px}
.legal li+li{margin-top:8px}
.legal a{color:var(--accent-deep);text-decoration:underline;text-underline-offset:2px}
.legal strong{font-weight:700}
.legal__todo{margin-top:14px;padding:14px 16px;border-radius:10px;background:rgba(229,50,43,.08);border:1px solid rgba(229,50,43,.25);color:var(--accent-deep);font-size:14px;line-height:1.6}

/* ---------- STACKED "FLASH CARDS" BETWEEN SECTIONS ---------- */
/* pin & cover: each card pins at the top and the next slides up over it.
   min-height:100vh = no hold/pause, the cover starts right away. Contact = static. */
.stack{position:relative;border-top-left-radius:42px;border-top-right-radius:42px;box-shadow:0 -26px 60px rgba(13,15,18,.2)}
.stack-wrap{position:relative}
section.section.stack{position:sticky;top:0;min-height:100vh;background:var(--bg)}
.refs.stack{background:var(--ink)}
.es.stack{overflow:visible}
.es.stack .es__sticky{border-top-left-radius:42px;border-top-right-radius:42px;box-shadow:0 -26px 60px rgba(13,15,18,.2)}
@media(max-width:560px){.stack,.es.stack .es__sticky{border-top-left-radius:30px;border-top-right-radius:30px}}

/* ---------- REVEAL ---------- */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .9s ease,transform 1.1s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

/* ---------- RESPONSIVE ---------- */
@media(max-width:980px){
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero__media{min-height:62svh;order:-1}
  .hero__media::after{background:linear-gradient(0deg,var(--bg),transparent 30%)}
  .hero__copy{padding-top:40px}
  .manifest__grid{grid-template-columns:1fr;gap:30px}
  .grid{grid-template-columns:1fr 1fr}
  .contact__grid{grid-template-columns:1fr;gap:38px}
}
@media(max-width:680px){
  .nav-links,.nav-cta{display:none}
  .nav-toggle{display:block}
  .nav-links.open{display:flex;position:fixed;inset:0;flex-direction:column;justify-content:center;align-items:center;gap:30px;background:var(--bg);z-index:55}
  .nav-links.open a{font-size:20px}
  .grid{grid-template-columns:1fr}
  .section-head__r{text-align:left}
  footer{flex-direction:column;gap:20px;align-items:flex-start}
  footer .meta{text-align:left}
}


/* ---------- REDUCED MOTION ---------- */
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .hero__title span>i{transform:none}.hero__eyebrow,.hero__lead,.hero__actions,.hero__scroll{opacity:1}
  .hero__photo{transform:none}.reveal{opacity:1;transform:none}
  .mask-rise__in{transform:none}.scroll-prog{display:none}
}
