/* ==== IDENTITA OBCE – farby z erbu a z webu oreske.sk ==== */
:root{
  --navy:#18327C;     /* nadpis „Oreské“ na obecnom webe */
  --indigo:#35316C;   /* rámik vyhľadávania */
  --blue:#3E60CE;     /* štít erbu */
  --peri:#5D7CE8;     /* tlačidlo MENU */
  --amber:#EEAA3B;    /* oranžový pás webu */
  --lemon:#F3EE5E;    /* vták, orechy a pažiť v erbe */
  --leaf:#5E8F3A;
}
:root{--photo:url(/assets/oreske-dron.jpg)}
:root{
  --bg:#F7F8FC; --surface:#FFFFFF; --tint:#EEF1FB;
  --ink:#141B33; --muted:#5A6482; --line:#DDE2F0;
  --free:#2E8B57; --held:#D99A1E; --busy:#C2413A;
  --r-s:10px; --r-l:22px;
  --shadow:0 18px 40px -24px rgba(24,50,124,.45);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0D1226;--surface:#151C36;--tint:#18213F;--ink:#E9ECF8;--muted:#9CA6C6;--line:#27304F;
  --free:#5CC287;--held:#E8B04F;--busy:#E5675F;--shadow:0 18px 40px -20px rgba(0,0,0,.7);color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0D1226;--surface:#151C36;--tint:#18213F;--ink:#E9ECF8;--muted:#9CA6C6;--line:#27304F;
  --free:#5CC287;--held:#E8B04F;--busy:#E5675F;--shadow:0 18px 40px -20px rgba(0,0,0,.7);color-scheme:dark}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.6 "Instrument Sans",system-ui,sans-serif}
h1,h2,h3{font-family:"Bricolage Grotesque",system-ui,sans-serif;line-height:1.06;margin:0 0 .5em;letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,6.4vw,5rem);font-weight:800}
h2{font-size:clamp(2rem,4vw,3rem);font-weight:800}
h3{font-size:1.25rem;font-weight:600}
p{margin:0 0 1em;max-width:68ch}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
[hidden]{display:none!important}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
section{padding:96px 0;position:relative}
.muted{color:var(--muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* tlačidlá s leskom */
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.5em;border:0;border-radius:999px;padding:.9em 1.55em;font:600 1rem "Instrument Sans",sans-serif;cursor:pointer;text-decoration:none;transition:transform .2s,box-shadow .2s}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .6s}
.btn:hover{transform:translateY(-2px)}
.btn:hover::after{transform:translateX(120%)}
.btn-primary{background:var(--amber);color:#1E1606;box-shadow:0 10px 24px -12px var(--amber)}
.btn-blue{background:var(--peri);color:#fff;box-shadow:0 10px 24px -12px var(--peri)}
.btn-ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 2px currentColor}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}

/* podčiarknutie, ktoré sa nakreslí */
.mark{position:relative;white-space:nowrap;display:inline-block}
.mark svg{position:absolute;left:-2%;bottom:-.18em;width:104%;height:.4em;overflow:visible}
.mark path{fill:none;stroke:var(--amber);stroke-width:7;stroke-linecap:round;stroke-dasharray:420;stroke-dashoffset:420;transition:stroke-dashoffset 1s cubic-bezier(.6,.1,.2,1) .2s}
.in .mark path,.mark.in path{stroke-dashoffset:0}
h2:hover .mark path{animation:redraw 1s}
@keyframes redraw{0%{stroke-dashoffset:420}100%{stroke-dashoffset:0}}

/* linka pod odkazmi */
.ul{text-decoration:none;background:linear-gradient(currentColor,currentColor) left bottom/0 2px no-repeat;transition:background-size .3s}
.ul:hover{background-size:100% 2px}

/* postupné odkrytie pri scrolle */
.rv.in{animation:rvin .8s cubic-bezier(.2,.7,.2,1) backwards}
@keyframes rvin{from{opacity:0;transform:translateY(28px)}}

/* priebeh scrollu */
#progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--lemon),var(--amber),var(--peri));z-index:50}

/* ===== header ===== */
header.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:14px;height:76px}
.brandmark{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.brandmark img{width:46px;height:auto;transition:transform .4s}
.brandmark:hover img{transform:rotate(-6deg) scale(1.06)}
.brandmark b{display:block;font:800 1.5rem/1 "Bricolage Grotesque",sans-serif;color:var(--navy)}
.brandmark span{display:block;font:600 .95rem "Bricolage Grotesque",sans-serif;color:var(--indigo);margin-top:3px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .brandmark b,:root:not([data-theme="light"]) .brandmark span{color:#fff}}
:root[data-theme="dark"] .brandmark b,:root[data-theme="dark"] .brandmark span{color:#fff}
nav a{color:var(--ink);text-decoration:none;font-weight:500;margin-left:22px;position:relative;padding:4px 0}
nav a::after{content:"";position:absolute;left:0;bottom:-2px;height:3px;width:100%;border-radius:2px;background:var(--amber);transform:scaleX(0);transform-origin:right;transition:transform .3s}
nav a:hover::after{transform:scaleX(1);transform-origin:left}
@media (max-width:920px){nav{display:none}}
@media (max-width:420px){.brandmark b{font-size:1.2rem}.brandmark span{font-size:.8rem}.top .btn{padding:.65em 1em}}

/* ===== HERO – ilustrácia: kultúrny dom, orech a vtáčiky z erbu ===== */
:root{--sky1:#D6E1FF;--sky2:#EEF2FF;--sky3:#FFF4D6;--hero-ink:var(--navy)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--sky1:#0E1736;--sky2:#1B2752;--sky3:#3A3A5E;--hero-ink:#fff}}
:root[data-theme="dark"]{--sky1:#0E1736;--sky2:#1B2752;--sky3:#3A3A5E;--hero-ink:#fff}
.hero{padding:0;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,var(--sky1) 0%,var(--sky2) 45%,var(--sky3) 100%)}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:start;padding-top:64px;padding-bottom:clamp(200px,24vw,330px);position:relative;z-index:2}
@media (max-width:960px){.hero .wrap{grid-template-columns:minmax(0,1fr);padding-top:40px;padding-bottom:190px}}
.kicker{display:inline-flex;align-items:center;gap:10px;background:color-mix(in srgb,var(--surface) 75%,transparent);border:1px solid var(--line);color:var(--hero-ink);padding:6px 14px 6px 6px;border-radius:999px;font-size:.92rem;font-weight:600;margin-bottom:22px}
.kicker i{width:9px;height:9px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 0 var(--amber);animation:ping 2s infinite;margin-left:8px}
@keyframes ping{70%{box-shadow:0 0 0 10px transparent}100%{box-shadow:0 0 0 0 transparent}}
.hero h1{color:var(--hero-ink);margin-bottom:.35em}
.rot{display:inline-grid;vertical-align:bottom;color:var(--blue);position:relative}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .rot{color:var(--lemon)}}
:root[data-theme="dark"] .rot{color:var(--lemon)}
.rot span{grid-area:1/1;opacity:0;transform:translateY(60%) rotateX(-60deg);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1);white-space:nowrap}
.rot span.on{opacity:1;transform:none}
.rot span.out{opacity:0;transform:translateY(-60%) rotateX(60deg)}
.rot svg{position:absolute;left:0;bottom:-.12em;width:100%;height:.35em;overflow:visible}
.rot path{fill:none;stroke:var(--amber);stroke-width:8;stroke-linecap:round;stroke-dasharray:420;stroke-dashoffset:420}
.rot.draw path{animation:draw 1.1s cubic-bezier(.6,.1,.2,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.hero .lead{font-size:1.18rem;color:var(--muted);max-width:52ch}
.hero .btn-ghost{color:var(--hero-ink)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.scene{position:absolute;left:0;bottom:0;width:100%;height:clamp(300px,34vw,470px);z-index:1;display:block}
.sun{transform-origin:250px 120px;animation:sun 6s ease-in-out infinite}
@keyframes sun{50%{transform:scale(1.08);opacity:.85}}
.cloud{animation:cloud 60s linear infinite}.c2{animation-duration:80s;animation-delay:-30s}
@keyframes cloud{from{transform:translateX(-260px)}to{transform:translateX(1500px)}}
.flock{animation:flock 28s linear infinite}
.gull{fill:none;stroke:var(--navy);stroke-width:2.6;stroke-linecap:round;transform-box:fill-box;transform-origin:center;animation:flap .5s ease-in-out infinite alternate}
@keyframes flock{from{transform:translate(-120px,150px)}to{transform:translate(1560px,40px)}}
.wins rect,.wins circle{fill:#2E4A7E;transition:fill 1s}
.lit .wins rect,.lit .wins circle{fill:#F6C452}
.bulb{opacity:.25;transition:opacity .4s}
.lit .bulb{opacity:1;animation:pop .5s backwards}
@keyframes pop{0%{opacity:.2;transform:scale(.6)}60%{opacity:1;transform:scale(1.25)}100%{transform:scale(1)}}
.tree-b,.tree-s{transform-box:fill-box}
.tree-b>g,.tree-b{animation:none}
.perch{animation:hopb 3.2s ease-in-out infinite}
@keyframes hopb{0%,70%,100%{transform:translate(992px,150px) scale(.8)}78%{transform:translate(992px,138px) scale(.8)}86%{transform:translate(992px,150px) scale(.8)}}
.fall{animation:fall 7s ease-in infinite;transform-box:fill-box}
@keyframes fall{0%,60%{transform:translateY(0);opacity:0}62%{opacity:1}80%{transform:translateY(104px)}86%{transform:translateY(90px)}92%{transform:translateY(104px);opacity:1}100%{transform:translateY(104px);opacity:0}}

/* kalendár */
.cal{background:var(--surface);color:var(--ink);border-radius:var(--r-l);padding:22px;box-shadow:0 40px 80px -40px rgba(0,0,0,.7);position:relative;transition:transform .3s}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin:-22px -22px 14px;padding:18px 22px;border-radius:var(--r-l) var(--r-l) 0 0;background:linear-gradient(120deg,var(--navy),var(--peri));color:#fff}
.cal-head h3{margin:0;font-size:1.45rem;color:#fff}
@media (max-width:560px){.cal-head{margin:-16px -16px 12px;padding:14px 16px}}
.cal-nav{display:flex;gap:6px}
.cal-nav button{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.12);color:#fff;font-size:1.15rem;cursor:pointer;transition:background .2s,color .2s}
.cal-nav button:hover:not(:disabled){background:var(--amber);color:#1E1606;border-color:var(--amber)}
.cal-nav button:disabled{opacity:.35}
.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.grid.anim .day:not(.out){animation:dayin .4s backwards}
@keyframes dayin{from{opacity:0;transform:scale(.7)}}
.dow{font-size:.78rem;color:var(--peri);text-align:center;padding:4px 0;font-weight:600}
.day{aspect-ratio:1/1;border:0;border-radius:var(--r-s);background:color-mix(in srgb,var(--free) 16%,var(--surface));color:var(--ink);font:600 1rem "Instrument Sans",sans-serif;cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:transform .15s,box-shadow .15s}
.day small{font-weight:500;font-size:.6rem;line-height:1;color:var(--muted)}
.day:hover:not(:disabled):not(.busy){transform:scale(1.1);background:var(--free);color:#fff;box-shadow:0 8px 18px -8px var(--free);z-index:1}
.day:hover:not(:disabled):not(.busy) small{color:#fff}
.day.we{background:color-mix(in srgb,var(--free) 32%,var(--surface));color:color-mix(in srgb,var(--free) 70%,var(--ink))}
.day.held{background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--held) 45%,var(--surface)) 0 6px,color-mix(in srgb,var(--held) 25%,var(--surface)) 6px 12px);color:var(--ink)}
.day.busy{background:var(--busy);color:#fff}
.day.busy small{color:#fff;opacity:.9}
.day.past,.day.out{background:transparent;color:var(--line);cursor:default}
.day.sel{box-shadow:0 0 0 3px var(--amber);transform:scale(1.06)}
.day.today{box-shadow:inset 0 0 0 2px var(--amber)}
.day.today::after{content:"";position:absolute;bottom:5px;width:5px;height:5px;border-radius:50%;background:var(--amber)}
.legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:14px;font-size:.85rem;color:var(--muted)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.cal-pick{margin-top:14px;padding:14px;border-radius:var(--r-s);background:var(--tint);display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between}

/* bežiaci pás */
.marquee{background:var(--navy);color:#fff;overflow:hidden;padding:14px 0;position:relative;z-index:3}
.marquee-track{display:flex;gap:28px;width:max-content;animation:marquee 40s linear infinite;font:600 clamp(1.05rem,2vw,1.3rem) "Bricolage Grotesque",sans-serif;white-space:nowrap;align-items:center}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track svg{width:52px;height:22px;flex:none}
@keyframes marquee{to{transform:translateX(-50%)}}

/* fakty */
.facts{padding:64px 0 24px}
.facts .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:760px){.facts .wrap{grid-template-columns:repeat(2,1fr)}}
.fact{padding:20px;border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line);transition:transform .3s,box-shadow .3s}
.fact:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.fact b{display:block;font:800 clamp(1.6rem,3.2vw,2.3rem)/1.1 "Bricolage Grotesque",sans-serif;color:var(--navy)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .fact b{color:var(--lemon)}}
:root[data-theme="dark"] .fact b{color:var(--lemon)}
.fact span{font-size:.92rem;color:var(--muted)}

/* farebné škvrny v pozadí */
.blobs{position:absolute;inset:0;overflow:hidden;z-index:-1;pointer-events:none}
.blobs i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.38;animation:blob 18s ease-in-out infinite alternate}
.blobs i:nth-child(1){width:420px;height:420px;background:var(--lemon);left:-120px;top:8%}
.blobs i:nth-child(2){width:360px;height:360px;background:var(--peri);right:-80px;top:30%;animation-delay:-6s}
.blobs i:nth-child(3){width:300px;height:300px;background:var(--amber);left:40%;bottom:-120px;animation-delay:-12s}
@keyframes blob{50%{transform:translate(60px,-40px) scale(1.15)}100%{transform:translate(-30px,40px) scale(.9)}}
.dots{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(color-mix(in srgb,var(--blue) 18%,transparent) 1.2px,transparent 1.3px);background-size:22px 22px;mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent)}
#akcie,#partneri{isolation:isolate;overflow:hidden}

/* ===== typy akcií ===== */
.types{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:18px;margin-top:36px;perspective:1000px}
.type{--c:var(--blue);--mx:50%;--my:50%;position:relative;background:var(--surface);border-radius:var(--r-l);padding:26px;border:1px solid var(--line);overflow:hidden;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:transform .25s,box-shadow .25s,border-color .25s,opacity .7s;transform-style:preserve-3d}
.type::before{content:"";position:absolute;inset:0;background:radial-gradient(320px circle at var(--mx) var(--my),color-mix(in srgb,var(--c) 22%,transparent),transparent 60%);opacity:0;transition:opacity .3s}
.type:hover{box-shadow:0 30px 50px -30px var(--c);border-color:color-mix(in srgb,var(--c) 50%,var(--line))}
.type:hover::before{opacity:1}
.type .blobc{position:absolute;right:-50px;top:-50px;width:150px;height:150px;border-radius:42% 58% 63% 37%/45% 40% 60% 55%;background:color-mix(in srgb,var(--c) 14%,transparent);transition:transform .8s;animation:morph 9s ease-in-out infinite}
.type:hover .blobc{transform:scale(1.6) rotate(40deg)}
@keyframes morph{50%{border-radius:60% 40% 35% 65%/55% 60% 40% 45%}}
.type>*{position:relative}
.type .ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:var(--c);color:#fff;margin-bottom:18px;box-shadow:0 10px 20px -10px var(--c);transition:transform .3s}
.type:hover .ic{transform:translateZ(30px) rotate(-6deg)}
.type .ic svg{width:30px;height:30px}
.type:hover .ic svg,.type.in .ic svg{animation:var(--a) 1s ease-in-out}
.type h3{margin-bottom:.3em;font-size:1.35rem}
.type p{margin:0;color:var(--muted);font-size:.96rem}
.type .from{display:flex;justify-content:space-between;align-items:center;margin-top:20px;font-weight:600;color:var(--c)}
.type .go{display:inline-flex;align-items:center;gap:6px}
.type .go svg{width:18px;height:18px;transition:transform .3s}
.type:hover .go svg{transform:translateX(5px)}
@keyframes swing{20%{transform:rotate(14deg)}40%{transform:rotate(-10deg)}60%{transform:rotate(6deg)}80%{transform:rotate(-3deg)}}
@keyframes hop{30%{transform:translateY(-7px)}50%{transform:translateY(0)}70%{transform:translateY(-3px)}}
@keyframes flick{25%{opacity:.5;transform:scaleY(.9)}50%{opacity:1}75%{opacity:.7}}
@keyframes pulse{50%{transform:scale(1.2)}}

/* ===== oddeľovač: linka a vtáčik z erbu ===== */
.divider{display:flex;align-items:center;gap:18px;max-width:560px;margin:0 auto;padding:12px 16px}
.divider::before,.divider::after{content:"";flex:1;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--amber))}
.divider::after{background:linear-gradient(90deg,var(--amber),transparent)}
.divider svg{width:84px;height:34px;flex:none;transition:transform .5s}
.divider.in svg{animation:hopd 1.2s}
.divider:hover svg{transform:translateY(-4px) rotate(-6deg)}
@keyframes hopd{30%{transform:translateY(-8px)}55%{transform:none}75%{transform:translateY(-3px)}}

/* ===== layout ===== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px}
@media (max-width:860px){.split{grid-template-columns:minmax(0,1fr)}.sticky{position:static!important}}
.tinted{background:var(--tint)}

/* cenník */
table{width:100%;border-collapse:collapse;font-size:.98rem}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-weight:600;color:var(--muted);font-size:.85rem}
td.num,th.num{text-align:right;white-space:nowrap}
tbody tr{transition:background .2s}
tbody tr:hover{background:color-mix(in srgb,var(--lemon) 22%,transparent)}
.note{font-size:.88rem;color:var(--muted);margin-top:12px}

/* panel, formulár */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);padding:26px;box-shadow:var(--shadow)}
label{display:block;font-weight:600;font-size:.92rem;margin:14px 0 6px}
input,select,textarea{width:100%;padding:.78em .9em;border:1px solid var(--line);border-radius:var(--r-s);background:var(--bg);color:var(--ink);font:inherit;transition:border-color .2s,box-shadow .2s}
input:focus,select:focus,textarea:focus{border-color:var(--peri);outline:none;box-shadow:0 0 0 4px color-mix(in srgb,var(--peri) 22%,transparent)}
textarea{min-height:90px;resize:vertical}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.row{grid-template-columns:1fr}.panel,.cal{padding:16px}}
.checks label{display:flex;gap:10px;align-items:flex-start;font-weight:400;margin:8px 0;cursor:pointer}
.checks input{width:auto;margin-top:5px;accent-color:var(--peri)}
.total{display:flex;justify-content:space-between;align-items:baseline;border-top:2px solid var(--navy);margin-top:18px;padding-top:12px}
.total strong{display:inline-block;font:800 2.2rem "Bricolage Grotesque",sans-serif;color:var(--navy)}
.total strong.bump{animation:pulse .35s}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .total strong{color:var(--lemon)}}
:root[data-theme="dark"] .total strong{color:var(--lemon)}
.steps{display:flex;gap:6px;margin-bottom:8px;list-style:none;padding:0}
.steps li{flex:1;height:6px;border-radius:3px;background:var(--line);overflow:hidden;position:relative}
.steps li::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--amber),var(--peri));transform:scaleX(0);transform-origin:left;transition:transform .5s}
.steps li.on::after{transform:none}
.step{display:none}.step.on{display:block;animation:stepin .45s}
@keyframes stepin{from{opacity:0;transform:translateX(24px)}}
.form-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:20px}
.err{color:#C0362C;font-size:.9rem;min-height:1.2em;margin-top:8px}
.ok{padding:22px;border-radius:var(--r-s);background:color-mix(in srgb,var(--free) 14%,var(--surface));animation:stepin .5s}
.howto{list-style:none;padding:0;margin:24px 0 0;counter-reset:s}
.howto li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;gap:14px;padding:12px 0;align-items:start}
.howto li::before{content:counter(s);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--navy);color:var(--lemon);font:800 1.05rem "Bricolage Grotesque",sans-serif;transition:transform .3s,background .3s}
.howto li:hover::before{transform:scale(1.15) rotate(-8deg);background:var(--peri)}
.howto b{display:block}

/* ===== partneri ===== */
.pcats{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}
.pcats button{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:.5em 1.1em;font:600 .95rem "Instrument Sans",sans-serif;cursor:pointer;transition:all .2s}
.pcats button:hover{border-color:var(--peri);color:var(--peri)}
.pcats button[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}
.plist{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}
.partner{--c:var(--peri);position:relative;padding:24px;border-radius:var(--r-l);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden;transition:transform .3s,box-shadow .3s;animation:stepin .4s backwards}
.partner::before{content:"";position:absolute;inset:0 0 auto;height:5px;background:var(--c)}
.partner:hover{transform:translateY(-6px);box-shadow:0 30px 50px -28px var(--c)}
.partner .pic{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 15%,transparent);color:var(--c);margin-bottom:14px;transition:transform .4s}
.partner:hover .pic{transform:rotate(-10deg) scale(1.1)}
.partner .pic svg{width:26px;height:26px}
.partner h3{margin-bottom:.2em}
.partner .meta{font-size:.88rem;color:var(--muted);margin-bottom:10px}
.partner p{margin:0}
.badge{position:absolute;top:18px;right:18px;font-size:.75rem;font-weight:600;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--amber) 25%,transparent);color:color-mix(in srgb,var(--amber) 40%,var(--ink))}
.partner.join{background:linear-gradient(135deg,var(--navy),var(--peri));color:#fff;border:0}
.partner.join::before{height:100%;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.18) 50%,transparent 65%);background-size:250% 100%;animation:shine 4s linear infinite}
@keyframes shine{from{background-position:150% 0}to{background-position:-100% 0}}
.partner.join a{color:var(--lemon)}
.partner.join .pic{background:rgba(255,255,255,.15);color:var(--lemon)}

/* ===== príbeh ===== */
.story{background:var(--navy);color:#DDE4F8;overflow:hidden;isolation:isolate}
.story h2{color:#fff}
.story .muted{color:#AEBBE0}
.story .tree{position:absolute;right:-40px;bottom:-60px;width:440px;opacity:.08;filter:grayscale(1) brightness(3);z-index:-1;transform-origin:50% 100%;animation:sway 8s ease-in-out infinite}
@keyframes sway{50%{transform:rotate(2.5deg)}}
.tl{list-style:none;margin:0;padding:0;position:relative}
.tl::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:rgba(255,255,255,.15)}
.tl::after{content:"";position:absolute;left:0;top:0;width:2px;height:calc(var(--p,0) * 100%);background:linear-gradient(var(--lemon),var(--amber))}
.tl li{position:relative;padding:0 0 26px 28px;opacity:.45;transition:opacity .5s}
.tl li.on{opacity:1}
.tl li::before{content:"";position:absolute;left:-7px;top:6px;width:16px;height:16px;border-radius:50%;background:var(--navy);box-shadow:inset 0 0 0 3px rgba(255,255,255,.3);transition:box-shadow .4s,background .4s;z-index:1}
.tl li.on::before{background:var(--lemon);box-shadow:0 0 0 5px color-mix(in srgb,var(--lemon) 30%,transparent)}
.tl b{display:block;font-family:"Bricolage Grotesque",sans-serif;font-size:1.25rem;color:#fff}
.big{font:800 clamp(2.4rem,6vw,4.2rem)/1 "Bricolage Grotesque",sans-serif;color:var(--lemon);margin:10px 0 6px}

/* ===== CTA s vtáčikom z erbu ===== */
.cta{background:var(--amber);color:#1E1606;padding:72px 0;overflow:hidden}
.cta .wrap{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between;position:relative;z-index:1}
.cta h2{margin:0 0 .2em}
.cta p{margin:0}
.cta .btn-blue{box-shadow:none}
.bird{position:absolute;top:18px;left:-80px;width:64px;color:var(--navy);animation:fly 16s linear infinite;z-index:0}
.bird .wing{transform-origin:30px 18px;animation:flap .3s ease-in-out infinite alternate}
@keyframes fly{0%{transform:translate(0,30px)}25%{transform:translate(30vw,0)}50%{transform:translate(60vw,40px)}75%{transform:translate(90vw,8px)}100%{transform:translate(115vw,30px)}}
@keyframes flap{to{transform:scaleY(-.6)}}

/* faq */
details{border-bottom:1px solid var(--line);padding:18px 0}
summary{cursor:pointer;font-weight:600;font-size:1.05rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;transition:color .2s}
summary:hover{color:var(--blue)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--tint);font:600 1.3rem/1 "Bricolage Grotesque",sans-serif;color:var(--blue);transition:transform .3s,background .3s}
details[open] summary::after{transform:rotate(135deg);background:var(--lemon)}
details p{margin:10px 0 0;animation:stepin .35s}

/* kontakt */
.contact dl{display:grid;grid-template-columns:max-content 1fr;gap:8px 20px;margin:0}
.contact dt{color:var(--muted)}
.contact dd{margin:0}
.mapcard{border-radius:var(--r-l);padding:30px;color:#fff;position:relative;overflow:hidden;isolation:isolate;min-height:300px;display:flex;flex-direction:column;justify-content:flex-end}
.mapcard::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(13,25,70,.92),rgba(13,25,70,.2)),var(--photo) center 45%/cover;transition:transform 1.2s}
.mapcard:hover::before{transform:scale(1.06)}
.mapcard h3{color:#fff}
.mapcard p{color:#E2E8FA}
.pin{position:absolute;top:24px;right:24px;width:44px;color:var(--lemon);animation:hop 2.2s ease-in-out infinite}

/* ===== PÄTIČKA s dronovou fotkou ===== */
footer{position:relative;color:#CBD4EE;font-size:.95rem;isolation:isolate;overflow:hidden}
footer .fbg{position:absolute;inset:-240px 0 0;z-index:-2;background:var(--photo) center 70%/cover;will-change:transform}
footer::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(13,25,70,.45) 0%,rgba(13,25,70,.85) 40%,rgba(10,18,52,.97) 100%)}
footer a{color:#fff;text-decoration:none}
.f-hero{padding:120px 16px 40px;text-align:center}
.f-hero .giant{font:800 clamp(4rem,16vw,12rem)/.9 "Bricolage Grotesque",sans-serif;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px rgba(255,255,255,.7);margin:0 auto;max-width:none}
.f-hero .giant span{display:inline-block;transition:color .3s,transform .3s,-webkit-text-stroke-color .3s}
.f-hero .giant span:hover{color:var(--lemon);-webkit-text-stroke-color:var(--lemon);transform:translateY(-10px) rotate(-4deg)}
.f-hero p{margin:12px auto 0;color:#E2E8FA;font-size:1.1rem}
.f-main{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px;padding:36px}
@media (max-width:900px){.f-main{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.f-main{grid-template-columns:1fr;padding:24px}}
.f-brand{display:flex;gap:16px;align-items:flex-start}
.f-brand img{width:68px;height:auto;filter:drop-shadow(0 8px 16px rgba(0,0,0,.4))}
.f-brand b{display:block;font:800 1.4rem "Bricolage Grotesque",sans-serif;color:#fff;margin-bottom:4px}
footer h4{font:600 1rem "Bricolage Grotesque",sans-serif;color:var(--lemon);margin:0 0 12px}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin:0 0 8px}
.f-glass{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-l);backdrop-filter:blur(8px)}
.f-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:40px}
.f-bottom .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;padding-block:18px;font-size:.85rem}
.f-bottom button{background:none;border:0;color:#CBD4EE;cursor:pointer;font:inherit;padding:0;text-decoration:underline}
.photo-credit{opacity:.6}

/* admin */
dialog{border:0;border-radius:var(--r-l);padding:0;max-width:880px;width:calc(100% - 32px);background:var(--surface);color:var(--ink)}
dialog::backdrop{background:rgba(8,14,40,.6);backdrop-filter:blur(3px)}
.dlg{padding:24px}
.req{border-bottom:1px solid var(--line);padding:12px 0;display:grid;grid-template-columns:1fr auto;gap:10px}
.req .acts{display:flex;gap:6px;flex-wrap:wrap;align-items:start}
.req .acts button{padding:.4em .8em;font-size:.85rem}
.dlg .btn-ghost{color:var(--ink)}
.st{font-size:.78rem;font-weight:600;padding:2px 8px;border-radius:999px}
.st-held{background:color-mix(in srgb,var(--held) 30%,transparent)}
.st-busy{background:color-mix(in srgb,var(--busy) 30%,transparent)}
.st-rej{background:var(--line)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .mark path,.rot path{stroke-dashoffset:0}
}

/* honeypot proti robotom */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.ok .ref{font:800 1.3rem "Bricolage Grotesque",sans-serif;letter-spacing:.04em;color:var(--navy)}
.sel{user-select:all}