/* ==========================================================================
   Osobní web — jeden stylopis pro dvě rozvržení (E/F) a tři barevná schémata.
   Rozvržení se přepíná atributem  <body data-layout="e|f">
   Schéma se přepíná atributem     <html data-scheme="navy|royal|olive">
   ========================================================================== */

[hidden]{display:none!important}

/* ---------- barevná schémata ----------
   --on-band   = barva textu na barevném pásu s čísly
   --band-line = dělicí linka v tom pásu
   --field-bg  = podklad formulářových polí
   Světlá schémata (lightgrey, white) mají tmavý text — všechny odstíny
   jdou přes proměnné, takže se zbytek stylopisu nemusí měnit.        */

/* --- color-scheme říká prohlížeči, jak vykreslit posuvník a formulářové prvky.
   Bez toho kreslí Windows u tmavého webu světlý posuvník, který u pravého
   okraje působí jako bílý pruh. --- */

/* ===== 1. Dark Navy — hluboká, spíš tmavá modř ===== */
:root,
[data-scheme="navy"]{
  color-scheme:dark;
  --ink:#081627; --ink2:#0E2340; --ink3:#15355F;
  --line:rgba(150,190,240,.15); --line2:rgba(150,190,240,.28);
  --fg:#EDF3FB; --dim:rgba(196,214,238,.64); --stroke:rgba(120,168,222,.50);
  --accent:#2F8AD4; --hot:#E30513; --hot-fg:#fff; --hot-hi:#ff1a28;
  --glow1:rgba(29,112,183,.22); --glow2:rgba(29,112,183,.12); --glow3:rgba(227,5,19,.09);
  --on-band:#fff; --band-line:rgba(255,255,255,.22); --field-bg:rgba(255,255,255,.04);
}
/* ===== 2. Royal Navy — sytá, zářivá královská modř ===== */
[data-scheme="royal"]{
  color-scheme:dark;
  --ink:#0B2A6B; --ink2:#123684; --ink3:#1E4FB8;
  --line:rgba(180,212,255,.24); --line2:rgba(180,212,255,.42);
  --fg:#F2F7FF; --dim:rgba(214,231,255,.76); --stroke:rgba(150,196,255,.80);
  --accent:#6FB4FF; --hot:#E30513; --hot-fg:#fff; --hot-hi:#ff1a28;
  --glow1:rgba(70,140,255,.44); --glow2:rgba(50,110,225,.28); --glow3:rgba(227,5,19,.12);
  --on-band:#fff; --band-line:rgba(255,255,255,.28); --field-bg:rgba(255,255,255,.07);
}
/* ===== 3. Dark Olive + Gold ===== */
[data-scheme="olive"]{
  color-scheme:dark;
  --ink:#10150E; --ink2:#1A2116; --ink3:#2A3421;
  --line:rgba(214,196,140,.16); --line2:rgba(214,196,140,.32);
  --fg:#F3F1E7; --dim:rgba(226,220,196,.66); --stroke:rgba(201,162,39,.60);
  --accent:#C9A227; --hot:#C9A227; --hot-fg:#12160E; --hot-hi:#e0b939;
  --glow1:rgba(201,162,39,.20); --glow2:rgba(201,162,39,.12); --glow3:rgba(120,140,80,.14);
  --on-band:#12160E; --band-line:rgba(18,22,14,.22); --field-bg:rgba(255,255,255,.05);
}
/* ===== 4. Charcoal + Grey + Red ===== */
[data-scheme="charcoal"]{
  color-scheme:dark;
  --ink:#131518; --ink2:#1C1F24; --ink3:#2A2E35;
  --line:rgba(200,206,214,.14); --line2:rgba(200,206,214,.28);
  --fg:#EDEFF2; --dim:rgba(206,212,220,.62); --stroke:rgba(178,186,196,.52);
  --accent:#9AA3AE; --hot:#E30513; --hot-fg:#fff; --hot-hi:#ff1a28;
  --glow1:rgba(150,160,172,.14); --glow2:rgba(150,160,172,.08); --glow3:rgba(227,5,19,.12);
  --on-band:#fff; --band-line:rgba(255,255,255,.20); --field-bg:rgba(255,255,255,.05);
}
/* ===== 5. Grey + Orange + Dark Blue (světlé) ===== */
[data-scheme="grey"]{
  color-scheme:light;
  --ink:#DCE0E5; --ink2:#CFD5DC; --ink3:#0F2E56;      /* pás s čísly = tmavá modř */
  --line:rgba(16,32,56,.18); --line2:rgba(16,32,56,.32);
  --fg:#10203A; --dim:rgba(16,32,58,.66); --stroke:rgba(16,46,86,.55);
  /* tmavý text na oranžové — bílá by měla kontrast jen 2,8:1 */
  --accent:#0F2E56; --hot:#EE7A1B; --hot-fg:#10203A; --hot-hi:#ff8c2e;
  --glow1:rgba(15,46,86,.16); --glow2:rgba(15,46,86,.09); --glow3:rgba(238,122,27,.16);
  --on-band:#fff; --band-line:rgba(255,255,255,.26); --field-bg:rgba(255,255,255,.72);
}
/* ===== 6. Dark Green + White + Brown (tmavé) ===== */
[data-scheme="forest"]{
  color-scheme:dark;
  --ink:#0E1C15; --ink2:#152A20; --ink3:#20402F;
  --line:rgba(214,226,216,.16); --line2:rgba(214,226,216,.30);
  --fg:#F2F7F3; --dim:rgba(222,234,225,.66); --stroke:rgba(196,142,94,.62);
  --accent:#C48E5E; --hot:#8B5E34; --hot-fg:#fff; --hot-hi:#a5713f;
  --glow1:rgba(196,142,94,.16); --glow2:rgba(70,120,90,.16); --glow3:rgba(139,94,52,.14);
  --on-band:#fff; --band-line:rgba(255,255,255,.22); --field-bg:rgba(255,255,255,.05);
}

/* ===== 7. Lilac / aubergine — sytě fialová, výrazná ===== */
[data-scheme="lilac"]{
  color-scheme:dark;
  --ink:#241536; --ink2:#2F1C45; --ink3:#5A3A86;
  --line:rgba(199,155,238,.16); --line2:rgba(199,155,238,.30);
  --fg:#F3ECFB; --dim:rgba(230,215,248,.72); --stroke:rgba(199,155,238,.60);
  --accent:#C79BEE; --hot:#9B4FD6; --hot-fg:#fff; --hot-hi:#AE68E6;
  --glow1:rgba(155,79,214,.26); --glow2:rgba(120,60,170,.16); --glow3:rgba(230,120,200,.12);
  --on-band:#fff; --band-line:rgba(255,255,255,.22); --field-bg:rgba(255,255,255,.05);
}
/* ===== 8. Pudr / víno — hluboká vínová s růžovými akcenty ===== */
[data-scheme="blush"]{
  color-scheme:dark;
  --ink:#38142A; --ink2:#471933; --ink3:#7A2E54;
  --line:rgba(242,167,192,.16); --line2:rgba(242,167,192,.30);
  --fg:#FBECF2; --dim:rgba(245,212,226,.72); --stroke:rgba(242,167,192,.60);
  --accent:#F2A7C0; --hot:#CC3A73; --hot-fg:#fff; --hot-hi:#E0548A;
  --glow1:rgba(214,65,124,.26); --glow2:rgba(150,40,90,.16); --glow3:rgba(245,160,120,.10);
  --on-band:#fff; --band-line:rgba(255,255,255,.22); --field-bg:rgba(255,255,255,.05);
}
/* ===== 9. Citron / zlatá na tmavé — dramatická žlutá ===== */
[data-scheme="lemon"]{
  color-scheme:dark;
  --ink:#1B1A10; --ink2:#26251A; --ink3:#4A4522;
  --line:rgba(234,203,63,.16); --line2:rgba(234,203,63,.30);
  --fg:#FBF7DE; --dim:rgba(240,232,190,.75); --stroke:rgba(234,203,63,.60);
  --accent:#EACB3F; --hot:#E0A21F; --hot-fg:#221A00; --hot-hi:#F2B531;
  --glow1:rgba(234,203,63,.22); --glow2:rgba(180,150,30,.14); --glow3:rgba(224,84,47,.12);
  --on-band:#FBF7DE; --band-line:rgba(255,255,255,.18); --field-bg:rgba(255,255,255,.05);
}
/* ===== 10. Latte / mocha — tmavá káva s karamelovými akcenty ===== */
[data-scheme="latte"]{
  color-scheme:dark;
  --ink:#241A12; --ink2:#31241A; --ink3:#523A28;
  --line:rgba(224,172,114,.16); --line2:rgba(224,172,114,.30);
  --fg:#F6EFE5; --dim:rgba(236,223,206,.72); --stroke:rgba(224,172,114,.60);
  --accent:#E0AC72; --hot:#A5673E; --hot-fg:#fff; --hot-hi:#BE7E4E;
  --glow1:rgba(224,172,114,.22); --glow2:rgba(150,110,70,.14); --glow3:rgba(180,113,62,.12);
  --on-band:#fff; --band-line:rgba(255,255,255,.22); --field-bg:rgba(255,255,255,.05);
}

:root{
  --display:"Archivo Black",Arial,sans-serif;
  --sans:"Archivo",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
  --pad:clamp(20px,5vw,78px);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--fg);font-family:var(--sans);overflow-x:hidden;background:var(--ink)}
img{max-width:100%}
a{color:inherit}

/* modré/zlaté světlo v pozadí — jen rozvržení E */
body[data-layout="e"]{
  background-image:
    radial-gradient(900px 620px at 82% -6%, var(--glow1), transparent 62%),
    radial-gradient(760px 520px at -8% 42%, var(--glow2), transparent 60%),
    radial-gradient(680px 480px at 108% 88%, var(--glow3), transparent 62%);
  background-attachment:fixed;
}

/* jemné zrno */
body.grain::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;opacity:.035;
  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='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}

.tag{font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.tag i{color:var(--hot);font-style:normal}

/* ==================== NAVIGACE ==================== */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:34px;
  padding:0 var(--pad);height:74px;border-bottom:1px solid transparent;transition:.3s}
.nav.stuck{background:color-mix(in srgb, var(--ink) 88%, transparent);backdrop-filter:blur(16px);border-bottom-color:var(--line)}
.nav .mark{font-family:var(--display);font-size:15px;letter-spacing:.1em;text-decoration:none;
  display:flex;align-items:center;gap:11px}
.nav .mark em{color:var(--hot);font-style:normal}
.nav .mark-img{height:34px;width:auto;display:block}
@media(max-width:520px){.nav .mark-img{height:28px}}
.nav .links{display:flex;gap:28px;margin-left:auto}
.nav a{color:var(--dim);text-decoration:none;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;
  text-transform:uppercase;transition:.2s;position:relative;padding:5px 0}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--hot);transition:right .26s}
.nav a:hover{color:var(--fg)} .nav a:hover::after{right:0}
.burger{display:none;background:none;border:0;color:var(--fg);font-size:19px;cursor:pointer;margin-left:auto}

/* ---------- boční lišta (jen F) ---------- */
.rail{display:none}
body[data-layout="f"] .rail{position:fixed;left:0;top:0;bottom:0;width:56px;z-index:45;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  border-right:1px solid var(--line);background:linear-gradient(180deg,color-mix(in srgb,var(--ink) 60%,transparent),var(--ink))}
.rail a{width:7px;height:7px;border-radius:50%;background:var(--line2);transition:.3s;position:relative}
.rail a.on{background:var(--hot);transform:scale(1.5)}
.rail a span{position:absolute;left:20px;top:50%;transform:translateY(-50%);white-space:nowrap;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);
  opacity:0;pointer-events:none;transition:.25s}
.rail a:hover span{opacity:1}
.rail .rot{position:absolute;bottom:26px;writing-mode:vertical-rl;font-family:var(--mono);font-size:10px;
  letter-spacing:.28em;text-transform:uppercase;color:var(--dim);opacity:.6}
body[data-layout="f"] .shell{margin-left:56px}
body[data-layout="f"] .nav{left:56px}

/* ==================== HERO ==================== */
.hero{position:relative;min-height:100svh;overflow:hidden}
.hero-media img,.hero-media video{width:100%;height:100%;object-fit:cover;filter:saturate(1.06) contrast(1.04)}
.hero h1{font-family:var(--display);line-height:.85;margin:16px 0 0;letter-spacing:-.035em;text-transform:uppercase}
.hero h1 .thin{display:block;color:transparent;-webkit-text-stroke:1.6px var(--fg)}
.hero .role{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin:0}
.hero .claim{line-height:1.55;margin:0;color:color-mix(in srgb, var(--fg) 90%, transparent)}
.scroll{position:absolute;left:var(--pad);bottom:24px;z-index:3;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.2em;color:var(--dim);text-transform:uppercase;display:flex;align-items:center;gap:10px}
.scroll::before{content:"";width:44px;height:1px;background:var(--line2);animation:sc 2.2s infinite}
@keyframes sc{0%,100%{transform:scaleX(.3);opacity:.4}50%{transform:scaleX(1);opacity:1}}

/* ---- E: text vlevo, fotka vpravo ----
   V HTML je fotka první (kvůli rozvržení F, kde slouží jako pozadí),
   proto ji tu pořadím posouváme doprava. */
body[data-layout="e"] .hero{display:grid;grid-template-columns:1fr .82fr;align-items:end}
/* min-width:0 — bez toho obří nadpis v levém sloupci roztáhne grid track podle
   své šířky (delší jméno = širší), ukrojí z fotkového sloupce a vpravo zůstane
   mezera. S min-width:0 se sloupce drží poměru 1fr:.82fr a fotka jde až k okraji. */
body[data-layout="e"] .hero-in{order:1;min-width:0;padding:0 0 clamp(48px,7vh,84px) var(--pad);position:relative;z-index:2}
body[data-layout="e"] .hero-media{order:2;min-width:0;position:relative;height:100svh;overflow:hidden}
body[data-layout="e"] .hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--ink) 0%,color-mix(in srgb,var(--ink) 72%,transparent) 22%,transparent 74%),
             linear-gradient(0deg,var(--ink) 0%,transparent 40%)}
body[data-layout="e"] .hero h1{font-size:calc(clamp(52px,10.5vw,164px) * var(--name-scale,1))}
body[data-layout="e"] .hero .role{font-size:12.5px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line);max-width:520px}
body[data-layout="e"] .hero .claim{font-size:clamp(17px,1.7vw,21px);margin-top:20px;max-width:460px}
body[data-layout="e"] .hero-badge{position:absolute;right:var(--pad);top:96px;z-index:3;text-align:right}
body[data-layout="e"] .hero-badge b{display:block;font-family:var(--display);font-size:clamp(56px,9vw,120px);
  line-height:.82;color:transparent;-webkit-text-stroke:1.5px var(--stroke)}
body[data-layout="e"] .hero-badge span{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--dim);text-transform:uppercase}

/* ---- F: fotka přes celou plochu, text dole ---- */
body[data-layout="f"] .hero{display:flex;align-items:flex-end}
body[data-layout="f"] .hero-media{position:absolute;inset:0}
body[data-layout="f"] .hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(0deg,var(--ink) 4%,color-mix(in srgb,var(--ink) 72%,transparent) 32%,transparent 62%,color-mix(in srgb,var(--ink) 55%,transparent) 100%),
             linear-gradient(90deg,color-mix(in srgb,var(--ink) 92%,transparent) 0%,color-mix(in srgb,var(--ink) 45%,transparent) 38%,transparent 68%)}
body[data-layout="f"] .hero-in{position:relative;z-index:2;padding:0 var(--pad) clamp(52px,8vh,96px);width:100%}
body[data-layout="f"] .hero h1{font-size:calc(clamp(50px,11vw,178px) * var(--name-scale,1))}
body[data-layout="f"] .hero-meta{display:grid;grid-template-columns:auto 1fr auto;gap:30px;align-items:end;
  margin-top:34px;padding-top:24px;border-top:1px solid var(--line2)}
body[data-layout="f"] .hero .role{font-size:12px}
body[data-layout="f"] .hero .claim{font-size:clamp(16px,1.5vw,19px);max-width:440px}
body[data-layout="f"] .hero-badge{text-align:right}
body[data-layout="f"] .hero-badge b{display:block;font-family:var(--display);font-size:clamp(38px,5vw,68px);
  line-height:.85;color:transparent;-webkit-text-stroke:1.4px var(--hot)}
body[data-layout="f"] .hero-badge span{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--dim);text-transform:uppercase}

/* ==================== BĚŽÍCÍ PÁS (E) ==================== */
.marq{border-block:1px solid var(--line);padding:20px 0;overflow:hidden;
  background:linear-gradient(90deg,var(--ink2),color-mix(in srgb,var(--accent) 34%,transparent),var(--ink2))}
.marq div{display:flex;gap:56px;white-space:nowrap;animation:mv 34s linear infinite;width:max-content}
.marq span{font-family:var(--display);font-size:clamp(20px,2.6vw,34px);text-transform:uppercase;
  color:transparent;-webkit-text-stroke:1px var(--stroke);display:flex;align-items:center;gap:56px}
.marq span::after{content:"";width:9px;height:9px;background:var(--hot);border-radius:50%;-webkit-text-stroke:0}
@keyframes mv{to{transform:translateX(-50%)}}

/* ==================== PÁS S ČÍSLY (F) ==================== */
.band{background:linear-gradient(100deg,var(--ink3),color-mix(in srgb,var(--accent) 70%,var(--ink3)) 55%,var(--ink3));
  display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.band div{padding:38px var(--pad);position:relative}
.band div+div::before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:1px;background:var(--band-line)}
.band b{display:block;font-family:var(--display);font-size:clamp(32px,4vw,52px);line-height:.9;letter-spacing:-.03em;color:var(--on-band)}
.band span{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--on-band);opacity:.85;display:block;margin-top:10px}

/* ==================== SEKCE ==================== */
section{padding:clamp(74px,10vh,136px) var(--pad);position:relative}
h2{font-family:var(--display);line-height:.98;margin:0;letter-spacing:-.025em;text-transform:uppercase}
.sec-h p,.sec-l p{color:var(--dim);line-height:1.72}

/* E: popisek nad obsahem */
body[data-layout="e"] .sec-h{display:grid;grid-template-columns:190px 1fr;gap:36px;align-items:start;margin-bottom:52px}
body[data-layout="e"] h2{font-size:clamp(30px,4.6vw,62px)}
body[data-layout="e"] .sec-h p{font-size:16px;max-width:520px;margin:20px 0 0}
body[data-layout="e"] .sec-l{display:none}

/* F: popisek drží vlevo */
body[data-layout="f"] .sec-h{display:none}
body[data-layout="f"] .sec{display:grid;grid-template-columns:220px 1fr;gap:clamp(28px,4vw,60px);align-items:start}
body[data-layout="f"] .sec-l{position:sticky;top:110px}
body[data-layout="f"] h2{font-size:clamp(26px,3vw,40px);margin-top:14px}
body[data-layout="f"] .sec-l p{font-size:14.5px;margin:16px 0 0}
body[data-layout="f"] .sec-l .bar{width:52px;height:3px;background:var(--hot);margin-top:18px}
body[data-layout="f"] section.alt{background:linear-gradient(180deg,var(--ink2),var(--ink))}

/* ==================== BENTO ==================== */
.bento{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
body[data-layout="e"] .bento{grid-template-columns:repeat(6,1fr)}
body[data-layout="f"] .bento{grid-template-columns:repeat(4,1fr)}
.b{padding:clamp(24px,3vw,42px);min-height:215px;display:flex;flex-direction:column;justify-content:space-between;
  transition:.3s;position:relative;overflow:hidden}
body[data-layout="e"] .b{background:color-mix(in srgb, var(--ink) 62%, transparent)}
body[data-layout="e"] .b:hover{background:color-mix(in srgb, var(--ink2) 82%, transparent)}
body[data-layout="f"] .b{background:var(--ink)}
body[data-layout="f"] .b:hover{background:var(--ink2)}
body[data-layout="f"] .b::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--accent);
  transform:scaleX(0);transform-origin:left;transition:transform .4s}
body[data-layout="f"] .b:hover::before{transform:scaleX(1)}
.b h3{font-family:var(--display);font-size:clamp(18px,2vw,26px);margin:14px 0 11px;line-height:1.12;
  text-transform:uppercase;letter-spacing:-.015em}
.b p{margin:0;color:var(--dim);font-size:14.5px;line-height:1.7;max-width:440px}
.b .no{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;color:var(--hot)}
.b .big{font-family:var(--display);font-size:clamp(40px,5.4vw,74px);line-height:.9;letter-spacing:-.03em;color:var(--hot)}
.b .ic{font-size:22px;color:var(--accent)}
.b.photo{padding:0;min-height:250px}
.b.photo img{width:100%;height:100%;object-fit:cover;display:block}
/* šířky dlaždic — E má 6 sloupců, F čtyři */
body[data-layout="e"] .b[data-w="1"]{grid-column:span 2}
body[data-layout="e"] .b[data-w="2"]{grid-column:span 3}
body[data-layout="e"] .b[data-w="4"]{grid-column:span 6}
body[data-layout="f"] .b[data-w="1"]{grid-column:span 1}
body[data-layout="f"] .b[data-w="2"]{grid-column:span 2}
body[data-layout="f"] .b[data-w="4"]{grid-column:span 4}

/* ==================== ČASOVÁ OSA ==================== */
.tl{border-top:1px solid var(--line)}
.tl-row{display:grid;gap:30px;padding:34px 0;border-bottom:1px solid var(--line);position:relative;transition:.3s}
body[data-layout="e"] .tl-row{grid-template-columns:190px 1fr}
body[data-layout="f"] .tl-row{grid-template-columns:140px 1fr}
.tl-row::before{content:"";position:absolute;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,var(--accent),var(--hot));transform:scaleY(0);transform-origin:top;transition:transform .38s}
body[data-layout="e"] .tl-row::before{left:0}
body[data-layout="f"] .tl-row::before{left:-14px}
.tl-row:hover{padding-left:18px}
.tl-row:hover::before{transform:scaleY(1)}
.tl-year{font-family:var(--display);font-size:clamp(24px,2.8vw,38px);line-height:1;color:transparent;
  -webkit-text-stroke:1.4px var(--stroke);transition:.3s}
.tl-row:hover .tl-year{-webkit-text-stroke-color:var(--hot)}
.tl-b .meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;color:var(--accent);text-transform:uppercase;margin-bottom:11px}
.tl-b h3{font-weight:700;font-size:clamp(17px,1.9vw,23px);margin:0 0 9px;line-height:1.32}
.tl-b p{margin:0;color:var(--dim);font-size:14.5px;line-height:1.75;max-width:660px}

/* ==================== AKTUALITY ==================== */
.posts{border-top:1px solid var(--line)}
.post{display:grid;align-items:center;gap:32px;padding:24px 0;border-bottom:1px solid var(--line);transition:.3s;text-decoration:none}
body[data-layout="e"] .post{grid-template-columns:180px 1fr 320px}
body[data-layout="e"] .post:hover{padding-left:20px;background:color-mix(in srgb,var(--ink2) 55%,transparent)}
body[data-layout="e"] .post .th{height:108px}
.post time{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--accent);text-transform:uppercase}
.post h3{font-weight:700;font-size:clamp(17px,2vw,25px);margin:0;line-height:1.3}
.post .th{overflow:hidden;position:relative}
.post .th img,.post .th video{width:100%;height:100%;object-fit:cover;filter:saturate(.5) brightness(.88);transition:.5s}
.post:hover .th img,.post:hover .th video{filter:saturate(1.06) brightness(1);transform:scale(1.05)}
.post .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
/* přehrávací kolečko musí být čitelné i na světlých schématech → vždy tmavé */
.post .play span{width:40px;height:40px;border-radius:50%;background:rgba(0,0,0,.58);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;padding-left:3px}
/* F: kartová mřížka — pevně 3 na řádek (další se zalomí na další řádek) */
body[data-layout="f"] .posts{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);border-top:1px solid var(--line)}
@media(max-width:900px){body[data-layout="f"] .posts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){body[data-layout="f"] .posts{grid-template-columns:1fr}}
/* align-items:stretch je nutné — základní .post má center, jinak se náhled
   smrskne na šířku obrázku a nevyplní kartu */
body[data-layout="f"] .post{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;background:var(--ink);border:0}
body[data-layout="f"] .post:hover{background:var(--ink2)}
body[data-layout="f"] .post .th{height:180px}
body[data-layout="f"] .post .tx{padding:24px;display:flex;flex-direction:column;gap:10px}
.post-perex{margin:6px 0 0;color:var(--dim);font-size:13.5px;line-height:1.6;font-weight:400;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body[data-layout="f"] .post .tx .post-perex{margin-top:0}
.tx-mid{min-width:0}
.posts-more{text-align:center;padding-top:34px}

/* ==================== KONTAKT ==================== */
.contact{background:linear-gradient(155deg,var(--ink3),var(--ink) 72%);border-top:1px solid var(--line)}
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,72px);align-items:start}
/* Nadpis kontaktu je záměrně velký. Musí přebít pravidlo pro nadpisy sekcí
   (body[data-layout=…] h2), proto ta dlouhá selektorová váha. */
.cbig{font-family:var(--display);line-height:.94;text-transform:uppercase;letter-spacing:-.03em;margin:16px 0 22px}
body[data-layout="e"] h2.cbig,
body[data-layout="f"] h2.cbig{font-size:clamp(34px,5.2vw,72px)}
.cbig em{color:transparent;-webkit-text-stroke:1.5px var(--fg);font-style:normal}
.clist{list-style:none;margin:26px 0 0;padding:0}
.clist li{padding:15px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:18px;
  font-family:var(--mono);font-size:12.5px}
.clist li span{color:var(--dim);text-transform:uppercase;font-size:10.5px;letter-spacing:.16em}
.clist a{text-decoration:none}
form{display:grid;gap:15px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:15px}
input,textarea{width:100%;color:var(--fg);padding:15px 14px;font-family:var(--sans);font-size:15px;transition:.25s}
body[data-layout="e"] input,body[data-layout="e"] textarea{background:transparent;border:0;border-bottom:1px solid var(--line2);border-radius:0;padding-inline:2px}
body[data-layout="f"] input,body[data-layout="f"] textarea{background:var(--field-bg);border:1px solid var(--line);border-radius:4px}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--dim) 60%,transparent)}
input:focus,textarea:focus{outline:0;border-color:var(--accent)}
body[data-layout="e"] input:focus,body[data-layout="e"] textarea:focus{border-bottom-color:var(--hot)}
textarea{resize:vertical;min-height:118px}
.btn{margin-top:8px;justify-self:start;background:var(--hot);color:var(--hot-fg);border:0;padding:17px 40px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;transition:.25s;
  text-decoration:none;display:inline-block}
body[data-layout="f"] .btn{border-radius:4px}
.btn:hover{background:var(--hot-hi);letter-spacing:.24em}
.hp{position:absolute;left:-9999px}

footer{padding:36px var(--pad);display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  border-top:1px solid var(--line);font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;
  color:var(--dim);text-transform:uppercase}
footer a{text-decoration:none}
footer a:hover{color:var(--fg)}

/* ==================== článek / stránka ==================== */
.doc{padding-top:120px}
.doc .wrap{max-width:1040px;margin:0 auto}
.doc h1{font-family:var(--display);font-size:clamp(30px,4.4vw,54px);line-height:1.02;margin:14px 0 18px;letter-spacing:-.025em}
.doc .body{font-size:16.5px;line-height:1.8;color:color-mix(in srgb,var(--fg) 88%,transparent)}
.doc .body h2,.doc .body h3{font-family:var(--sans);font-weight:700;text-transform:none;letter-spacing:0;margin:34px 0 12px}
.doc .body img{border-radius:8px;margin:18px 0}
.doc .cover{width:100%;max-height:420px;object-fit:cover;border-radius:10px}
.art-head{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(24px,4vw,48px);align-items:start;margin-bottom:30px}
.art-lead{font-size:19px;line-height:1.65;color:var(--fg);margin:0 auto;max-width:720px;
  padding-top:24px;border-top:1px solid var(--line)}
.body-wrap{max-width:720px;margin:0 auto}
@media(max-width:860px){
  .art-head{grid-template-columns:1fr;margin-bottom:24px}
}
.back{font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim);text-decoration:none}
.back:hover{color:var(--fg)}

/* ==================== nájezdy ==================== */
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
.rv.in{opacity:1;transform:none}
body.nomotion .rv{opacity:1;transform:none}

/* ==================== flash / cookies ==================== */
.flash{margin:0 var(--pad) 18px;padding:14px 18px;border-left:3px solid var(--accent);
  background:color-mix(in srgb,var(--ink2) 70%,transparent);font-size:14.5px}
.flash.err{border-left-color:var(--hot)}
/* děkovací okno po odeslání zprávy */
.thanks{position:fixed;inset:0;z-index:120;background:rgba(4,10,20,.72);display:flex;align-items:center;
  justify-content:center;padding:20px;animation:thFade .25s ease}
.thanks-card{position:relative;background:var(--ink2);border:1px solid var(--line2);border-radius:14px;
  width:min(440px,100%);max-height:90vh;overflow:auto;padding:36px 32px 32px;text-align:center;
  box-shadow:0 30px 80px rgba(0,0,0,.5);animation:thUp .3s cubic-bezier(.2,.8,.3,1)}
.thanks-img{width:100%;max-height:190px;object-fit:cover;border-radius:9px;margin-bottom:20px}
.thanks-ic{font-size:44px;color:var(--hot);line-height:1;margin-bottom:14px}
.thanks-card h3{font-family:var(--display);font-size:clamp(21px,3.4vw,27px);line-height:1.15;margin:0 0 12px;
  letter-spacing:-.02em}
.thanks-card p{color:var(--dim);font-size:15px;line-height:1.7;margin:0 0 24px}
.thanks-card .btn{margin:0;justify-self:auto}
.thanks-x{position:absolute;top:10px;right:14px;background:none;border:0;color:var(--dim);font-size:30px;
  line-height:1;cursor:pointer;padding:4px 8px}
.thanks-x:hover{color:var(--fg)}
@keyframes thFade{from{opacity:0}to{opacity:1}}
@keyframes thUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.thanks,.thanks-card{animation:none}}

.cookiebar{position:fixed;left:16px;right:16px;bottom:16px;z-index:70;background:var(--ink2);
  border:1px solid var(--line);padding:18px 22px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;font-size:14px}
.cookiebar .btn{margin:0;padding:12px 24px}

@media(max-width:1000px){
  .burger{display:block}
  .nav .links{position:fixed;inset:74px 0 auto 0;background:var(--ink);flex-direction:column;gap:0;
    padding:10px var(--pad) 24px;border-bottom:1px solid var(--line);display:none}
  .nav .links.open{display:flex}
  .nav .links a{padding:14px 0;font-size:13px;border-bottom:1px solid var(--line)}
  body[data-layout="f"] .rail{display:none}
  body[data-layout="f"] .shell{margin-left:0} body[data-layout="f"] .nav{left:0}
  body[data-layout="e"] .hero{grid-template-columns:1fr;min-height:auto}
  body[data-layout="e"] .hero-media{position:absolute;inset:0;height:100%;opacity:.30}
  body[data-layout="e"] .hero-in{padding:130px var(--pad) 70px}
  body[data-layout="e"] .hero-badge{top:84px}
  body[data-layout="f"] .hero-meta{grid-template-columns:1fr;gap:16px}
  body[data-layout="f"] .hero-badge{text-align:left}
  body[data-layout="e"] .sec-h,body[data-layout="f"] .sec{grid-template-columns:1fr;gap:16px}
  body[data-layout="f"] .sec-l{position:static}
  .bento{grid-template-columns:repeat(2,1fr)!important}
  .b[data-w]{grid-column:span 2!important}
  .tl-row{grid-template-columns:1fr!important;gap:12px}
  body[data-layout="e"] .post{grid-template-columns:1fr;gap:12px}
  body[data-layout="e"] .post .th{height:180px;order:-1}
  .cgrid,.f2{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.marq div{animation:none}}