/* Martin Tomčík — osobný autorský web. Samostatné CSS, bez externých závislostí. */
:root {
  color-scheme: dark;
  --bg: #101a14;
  --bg-deep: #0b130f;
  --pine: #15271d;
  --pine-soft: #203328;
  --paper: #f5f1e7;
  --gold: #d7b577;
  --gold-bright: #f2d69b;
  --text: #d5dcd2;
  --muted: #a5b2a6;
  --line: rgba(215,181,119,.25);
  --line-strong: rgba(215,181,119,.43);
  --serif: Georgia, 'Times New Roman', serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; min-width:280px; color:var(--text); font: 16px/1.76 var(--sans); background:var(--bg); -webkit-font-smoothing:antialiased; }
body::before { content:""; position:fixed; inset:0; z-index:-2; pointer-events:none; background:radial-gradient(ellipse at 30% 8%, rgba(68,104,69,.09),transparent 44%),linear-gradient(#101a14,#0e1712); }
::selection { background:var(--gold); color:var(--bg-deep); }
a { color:inherit; text-decoration:none; }
a:focus-visible, summary:focus-visible { outline:2px solid var(--gold-bright); outline-offset:5px; }
img { display:block; max-width:100%; }
h1,h2,h3,h4,p,figure { margin-top:0; }
h1,h2,h3,h4 { font-family:var(--serif); font-weight:400; }
p { margin-bottom:1.2em; }
.container { width:min(1120px, calc(100% - 56px)); margin-inline:auto; }
.narrow { max-width:750px; }
.skip-link { position:absolute; z-index:100; top:-90px; left:18px; padding:10px 18px; background:var(--gold-bright); color:var(--bg-deep); }
.skip-link:focus { top:10px; }

/* Header */
.site-header { position:sticky; top:0; z-index:30; border-bottom:1px solid var(--line); background:rgba(10,19,14,.95); backdrop-filter:blur(14px); }
.header-inner { display:flex; align-items:center; justify-content:space-between; min-height:80px; gap:30px; }
.brand { display:inline-flex; gap:13px; align-items:center; min-width:0; }
.logo { display:grid; place-items:center; border:1px solid var(--gold); color:var(--gold-bright); border-radius:50%; flex-shrink:0; width:42px; height:42px; font:italic 18px/1 var(--serif); }
.brand-name { color:var(--paper); font:19px/1.12 var(--serif); }
.brand-name small { color:var(--gold); font:600 9px/1.9 var(--sans); text-transform:uppercase; letter-spacing:.14em; display:block; margin-top:4px; }
.site-nav { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:clamp(11px, 2.4vw, 27px); }
.site-nav a { font-size:11px; font-weight:700; letter-spacing:.105em; text-transform:uppercase; color:#d3c59f; line-height:1.4; transition:color .2s; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color:white; }

/* Typography / decorations */
.kicker { font-size:11px; text-transform:uppercase; letter-spacing:.22em; color:var(--gold); font-weight:700; }
.section-head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:30px; }
.section-head h2, .section-title { font-size:clamp(32px,4.1vw,49px); line-height:1.18; color:var(--paper); margin:10px 0 0; }
.section-intro { color:var(--muted); max-width:670px; margin-bottom:28px; }
.section-pad { padding-block:80px; }
.section-rule { border-top:1px solid var(--line); }
.soft-section { background:linear-gradient(180deg, rgba(30,47,34,.78), rgba(19,33,24,.82)); }
.ornament { width:96px; height:1px; background:linear-gradient(to right,var(--gold),transparent); margin:22px 0; }
.eyeline { display:inline-flex; align-items:center; gap:12px; color:var(--gold); text-transform:uppercase; font-size:11px; font-weight:700; letter-spacing:.17em; }
.eyeline::before { content:""; display:inline-block; width:22px; height:1px; background:var(--gold); }
.text-link { display:inline-flex; align-items:center; gap:9px; color:var(--gold-bright); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; border-bottom:1px solid var(--line-strong); padding:9px 0; white-space:nowrap; transition:color .2s,border-color .2s; }
.text-link:hover { color:#fff; border-color:var(--gold-bright); }
.text-link .arr { font-size:18px; line-height:.8; font-weight:400; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:44px; gap:10px; border:1px solid var(--gold); border-radius:2px; padding:12px 20px; background:linear-gradient(105deg,#c7a369,#f2d79c,#c4a164); color:#152018; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.095em; transition:transform .2s, filter .2s, background .2s; }
.btn:hover { transform:translateY(-2px); filter:brightness(1.07); }
.btn-outline { background:rgba(11,20,15,.15); color:var(--gold-bright); }
.btn-outline:hover { background:rgba(215,181,119,.12); }

/* Hero */
.hero { position:relative; overflow:hidden; border-bottom:1px solid var(--line); background:radial-gradient(ellipse at 82% 32%,rgba(217,181,119,.16),transparent 44%),radial-gradient(ellipse at 14% 84%,rgba(75,123,83,.13),transparent 54%),linear-gradient(123deg,#111c16 15%,#1b3023 67%,#303724 100%); }
.hero::before { content:""; position:absolute; inset:0; opacity:.14; pointer-events:none; background-image:radial-gradient(circle,rgba(235,207,153,.20) .8px,transparent 1.5px); background-size:36px 36px; }
.hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); align-items:center; gap:clamp(36px,6vw,80px); padding:64px 0 66px; }
.hero-copy { padding-block:8px; }
.hero h1 { color:var(--paper); font-size:clamp(60px,6.5vw,91px); letter-spacing:-.025em; line-height:1.04; margin:18px 0 24px; }
.hero h1 em { color:var(--gold-bright); font-style:italic; }
.genres { color:var(--gold); font:700 12px/1.5 var(--sans); text-transform:uppercase; letter-spacing:.19em; margin-bottom:23px; }
.motto { color:var(--paper); font:italic clamp(23px,2.65vw,30px)/1.4 var(--serif); margin-bottom:20px; }
.hero-intro { max-width:520px; color:#c4cec4; line-height:1.82; font-size:15px; margin-bottom:27px; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
.portrait-wrap { width:min(100%,370px); justify-self:end; }
.portrait-frame { border:1px solid var(--line-strong); background:linear-gradient(155deg,rgba(219,182,113,.17),rgba(10,23,16,.65)); padding:11px; position:relative; box-shadow:0 23px 62px rgba(0,0,0,.27); }
.portrait-frame::before, .portrait-frame::after { content:""; position:absolute; width:24px; height:24px; border:solid var(--gold); pointer-events:none; }
.portrait-frame::before { top:-1px;left:-1px;border-width:2px 0 0 2px; }
.portrait-frame::after { bottom:-1px;right:-1px;border-width:0 2px 2px 0; }
.portrait-frame img { width:100%; height:370px; object-fit:cover; object-position:center 42%; }
.portrait-frame figcaption { text-align:center; padding:11px 4px 4px; color:var(--gold); text-transform:uppercase; font-size:10px; letter-spacing:.17em; }

/* Bio */
.bio-grid { display:grid; grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr); gap:clamp(25px,7vw,100px); align-items:start; }
.bio-grid p { color:var(--muted); }
.bio-grid strong { color:var(--paper); }
.bio-aside { border-top:1px solid var(--gold); padding-top:17px; margin-top:14px; font:italic 19px/1.6 var(--serif); color:var(--gold-bright); }

/* Tvorba, karty */
.genre-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:30px; }
.genre-chip { border:1px solid var(--line); background:rgba(9,17,12,.18); padding:20px 22px; }
.genre-chip strong { display:block; color:var(--paper); font:23px/1.25 var(--serif); margin-bottom:7px; }
.genre-chip span { font-size:13px; line-height:1.5; color:var(--muted); }
.card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:19px; }
.story-card { position:relative; display:flex; flex-direction:column; padding:27px 26px 24px; background:linear-gradient(148deg,rgba(35,55,40,.87),rgba(20,34,24,.94)); border:1px solid var(--line); min-height:235px; transition:transform .2s,border-color .2s; }
.story-card:hover { transform:translateY(-3px); border-color:var(--line-strong); }
.card-meta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; color:var(--gold); text-transform:uppercase; letter-spacing:.1em; font-size:10px; font-weight:700; }
.card-meta time { color:var(--muted); text-transform:none; letter-spacing:0; font-weight:400; }
.story-card h3 { font-size:26px; line-height:1.2; color:var(--gold-bright); margin:19px 0 12px; }
.story-card p { color:var(--muted); font-size:14px; line-height:1.68; margin-bottom:21px; }
.story-card .text-link { margin-top:auto; align-self:flex-start; }
.demo-mark { display:inline-block; color:#b8bfae; font-size:10px; font-weight:400; text-transform:none; letter-spacing:0; border:1px solid rgba(215,181,119,.18); padding:2px 7px; border-radius:12px; }

/* Publication */
.publication-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.publication-box { display:flex; flex-direction:column; padding:35px 36px; border:1px solid var(--line); background:rgba(13,24,17,.38); min-height:220px; }
.publication-box .years { color:var(--gold); font:italic 36px/1.1 var(--serif); margin-bottom:14px; }
.publication-box .label { color:var(--gold); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.18em; }
.publication-box h3 { color:var(--paper); font-size:28px; line-height:1.2; margin:11px 0; }
.publication-box p { margin:0; color:var(--muted); font-size:14px; }
.publication-box strong { color:var(--paper); }

/* Autorský svet */
.world { position:relative; overflow:hidden; border-top:1px solid var(--line); background:linear-gradient(90deg,rgba(14,26,18,.98) 4%,rgba(14,26,18,.96) 34%,rgba(17,30,21,.72) 100%); }
.world::before { content:""; position:absolute; inset:0; pointer-events:none; background:url('mapa-pozadie.png') no-repeat right -110px center / min(970px,90vw); opacity:.38; }
.world::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(13,24,17,.8) 0%,rgba(13,24,17,.46) 39%,rgba(13,24,17,.15) 100%); }
.world .container { position:relative; z-index:1; }
.world-copy { width:min(550px,100%); padding-block:88px; }
.world-copy h2 { max-width:440px; }
.world-copy p { max-width:420px; color:#bec8bb; }
.world-quote { margin-top:29px; color:var(--gold-bright); font:italic 19px/1.6 var(--serif); border-left:2px solid var(--gold); padding-left:18px; }

/* Footer */
.site-footer { background:#0a120d; border-top:1px solid var(--line); }
.footer-grid { display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; padding:33px 0; }
.footer-name { color:var(--paper); font:21px/1.2 var(--serif); }
.footer-sub { color:var(--muted); font-size:12px; margin-top:6px; }
.socials { display:flex; align-items:center; gap:10px; }
.socials a, .socials .social-pending { width:42px; height:42px; display:grid;place-items:center; color:var(--gold-bright); border:1px solid var(--line-strong); border-radius:50%; transition:transform .2s,background .2s; }
.socials a:hover { transform:translateY(-2px); background:rgba(215,181,119,.11); }
.socials .social-pending { color:#718173; border-color:rgba(160,176,157,.17); cursor:not-allowed; }
.socials svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.socials .fb-icon { fill:currentColor; stroke:none; }
.footer-bottom { border-top:1px solid rgba(215,181,119,.12); padding:17px 0; color:#879789; font-size:11px; display:flex;flex-wrap:wrap; justify-content:space-between; gap:10px; }
.footer-bottom a { color:var(--gold); }

/* Archive and details */
.page-hero { padding:64px 0 56px; background:radial-gradient(ellipse at 90% 30%,rgba(215,181,119,.13),transparent 36%),linear-gradient(115deg,#15251b,#1b3123); border-bottom:1px solid var(--line); }
.page-hero h1 { font:normal clamp(43px,5.8vw,68px)/1.12 var(--serif); color:var(--paper); max-width:850px; margin:12px 0 16px; }
.page-hero p { color:#b9c4b6; max-width:700px; margin-bottom:0; }
.breadcrumbs { font-size:12px; color:var(--gold); margin-bottom:15px; }
.breadcrumbs a { color:var(--gold-bright); }
.archive-intro { color:var(--muted); margin-bottom:28px; max-width:690px; }
.archive-section { padding-block:58px 90px; }
.archive-year { color:var(--paper); font:28px/1.2 var(--serif); margin:30px 0 18px; }
.archive-list { display:grid; grid-template-columns:1fr; gap:12px; }
.archive-item { display:grid; grid-template-columns:155px minmax(0,1fr) auto; gap:28px; align-items:center; border:1px solid var(--line); background:rgba(25,41,30,.55); padding:24px 28px; transition:border-color .2s,background .2s; }
.archive-item:hover { border-color:var(--line-strong); background:rgba(30,48,35,.72); }
.archive-item .stamp { color:var(--gold); font-size:12px; line-height:1.5; }
.archive-item .stamp small { display:block; color:var(--muted); font-size:11px; }
.archive-item h2 { margin:0 0 7px; color:var(--paper); font:25px/1.24 var(--serif); }
.archive-item p { margin:0; color:var(--muted); font-size:13px; line-height:1.6; }
.archive-item .arr { color:var(--gold); font:28px/1 var(--serif); }
.pagination { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-top:30px; }
.pagination a, .pagination span { display:inline-flex; min-width:36px; min-height:36px; padding:6px 11px; justify-content:center; align-items:center; border:1px solid var(--line); color:var(--gold-bright); font-size:13px; }
.pagination .current { background:var(--gold); color:var(--bg-deep); }
.article-section { padding:65px 0 90px; }
.article-content { max-width:760px; margin-inline:auto; }
.article-content .leadin { font:italic 23px/1.57 var(--serif); color:var(--gold-bright); padding-bottom:23px; border-bottom:1px solid var(--line); margin-bottom:32px; }
.article-body { font-size:17px; line-height:1.9; color:var(--text); }
.article-body p { margin-bottom:23px; }
.notice-demo { border:1px solid rgba(215,181,119,.27); border-left:3px solid var(--gold); background:rgba(215,181,119,.06); color:#c9cbb9; padding:13px 17px; margin-bottom:33px; font-size:13px; line-height:1.6; }
.article-actions { display:flex; flex-wrap:wrap; justify-content:space-between; gap:15px; margin-top:45px; padding-top:27px; border-top:1px solid var(--line); }
.article-nav { display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:38px; }
.article-nav a { display:block; border:1px solid var(--line);padding:17px 20px;color:var(--paper);font:20px/1.3 var(--serif); }
.article-nav small { display:block;color:var(--gold);font:700 10px/1.6 var(--sans);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px; }
.article-nav .right { text-align:right; }

@media (max-width:900px) {
  .hero-grid { gap:35px; }
  .portrait-wrap { width:min(100%,330px); }
  .portrait-frame img { height:350px; }
  .genre-chip { padding:18px; }
  .story-card { padding:24px 22px; }
  .story-card h3 { font-size:23px; }
  .world::before { opacity:.29; }
}
@media (max-width:720px) {
  .container { width:calc(100% - 36px); }
  .header-inner { min-height:unset; flex-direction:column; gap:0; align-items:stretch; padding-top:11px; }
  .brand { padding-bottom:11px; }
  .site-nav { flex-wrap:nowrap; width:100%; justify-content:space-between; gap:16px; border-top:1px solid rgba(215,181,119,.12); overflow-x:auto; padding:12px 0 13px; scrollbar-width:thin; }
  .site-nav a { white-space:nowrap; font-size:10px; }
  .hero-grid { grid-template-columns:1fr; padding:54px 0 61px; }
  .hero-copy { padding:0; }
  .portrait-wrap { justify-self:center; width:min(100%,350px); }
  .portrait-frame img { height:340px; }
  .bio-grid { grid-template-columns:1fr; gap:20px; }
  .section-pad { padding-block:66px; }
  .genre-row, .card-grid { grid-template-columns:1fr; }
  .genre-row { gap:10px; }
  .genre-chip { padding:15px 19px; }
  .story-card { min-height:unset; }
  .section-head { flex-direction:column; align-items:flex-start; gap:14px; }
  .publication-grid { grid-template-columns:1fr; }
  .publication-box { min-height:unset; }
  .world::before { background-position:center bottom; background-size:110vw auto; opacity:.21; }
  .world::after { background:rgba(13,24,17,.42); }
  .world-copy { padding-block:75px; }
  .archive-item { grid-template-columns:1fr 25px; gap:7px 15px; padding:22px 23px; }
  .archive-item .stamp { grid-column:1 / -1; }
  .archive-item .arr { grid-column:2; grid-row:2 / span 2; }
  .page-hero { padding-block:51px; }
  .article-nav { grid-template-columns:1fr; }
}
@media (max-width:380px) {
  .hero h1 { font-size:55px; }
  .genres { font-size:10px; letter-spacing:.13em; }
  .hero-actions { flex-direction:column; }
  .hero-actions .btn { width:100%; }
  .footer-grid { align-items:flex-start; }
  .portrait-frame img { height:310px; }
  .section-head h2 { font-size:34px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { transition:none !important; }
}