/* KAPITAL — specijalno izdanje (poklon sajt Marko Radević) */
:root{
  --paper:#F7F6F3;
  --ink:#17120F;
  --muted:#6B625C;
  --rule:#D8D2CA;
  --ox:#5B1016;        /* bordo časopisa */
  --ox-deep:#3F0B0F;
  --cream:#F6EFE6;     /* tekst na bordo */
  --redact:#000;
  --serif:"Bodoni Moda", "Didot", "Times New Roman", serif;
  --sans:"Archivo Narrow", "Arial Narrow", sans-serif;
  --gutter:clamp(16px,4vw,56px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:19px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
figure{margin:0}
a{color:inherit}
:focus-visible{outline:2px solid #C8A27A;outline-offset:3px}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--gutter)}
.kick{font:700 13px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ox);margin:0 0 18px}

/* ================= NASLOVNA ================= */
.cover-page{
  min-height:100svh;background:var(--ox);color:var(--cream);
  display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:56px;
  padding:40px 56px;
}
.toc{max-width:300px}
.toc h2{font:italic 400 30px/1.1 var(--serif);margin:0 0 20px}
.toc ol{list-style:none;margin:0;padding:0}
.toc li{border-top:1px solid rgba(246,239,230,.32)}
.toc a{display:block;padding:13px 0;text-decoration:none;font-size:19px;line-height:1.3}
.toc a b{display:block;font:700 12px var(--sans);letter-spacing:.14em;opacity:.7;margin-bottom:4px}
.toc a:hover span{text-decoration:underline;text-underline-offset:3px}
.cover-side{align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:4px 0}
.lang{font:700 13px var(--sans);letter-spacing:.16em;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.cue{font:700 13px var(--sans);letter-spacing:.16em;text-decoration:none;opacity:.8}
.cover-lang{display:none;color:inherit;margin-left:1.4em}

.cover{
  position:relative;height:calc(100svh - 80px);aspect-ratio:3/4;overflow:hidden;background:#2a2320;
  box-shadow:0 40px 80px rgba(0,0,0,.5);container-type:inline-size;
}
.cover > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:68% 50%}
.cover::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.74),rgba(0,0,0,0) 44%),linear-gradient(to bottom,rgba(0,0,0,.38),rgba(0,0,0,0) 26%)}
.cv{position:absolute;inset:0;z-index:2;padding:3.2cqw 3.6cqw;color:var(--cream);text-shadow:0 1px 14px rgba(0,0,0,.35)}
.cv .tag,.cv .barcode{text-shadow:none}
.mast{font:900 18.6cqw/.8 var(--serif);letter-spacing:-.03em;margin:0;text-align:center}
.issue{display:flex;justify-content:space-between;gap:12px;font:700 clamp(10px,1.9cqw,12px) var(--sans);letter-spacing:.16em;margin-top:1.8cqw;border-top:1px solid rgba(246,239,230,.6);padding-top:1cqw;text-transform:uppercase}
.line{position:absolute;left:3.6cqw;font:700 clamp(11px,2.2cqw,14px)/1.25 var(--sans);letter-spacing:.06em;text-transform:uppercase;max-width:30cqw}
.line big{display:block;font:900 9.4cqw/.9 var(--serif);letter-spacing:-.02em;text-transform:none;margin-bottom:.6cqw}
.l1{top:29%}
.l2{top:50%}
.cover-bottom{position:absolute;left:3.6cqw;right:3.6cqw;bottom:3.6cqw}
.tag{font:700 clamp(11px,2.3cqw,14px) var(--sans);letter-spacing:.16em;background:var(--cream);color:var(--ox);display:inline-block;padding:.7cqw 1.4cqw;margin-bottom:1.6cqw;text-transform:uppercase}
.cover h1{font:italic 700 11cqw/.92 var(--serif);margin:0 0 1.6cqw;letter-spacing:-.02em}
.dek{font:400 clamp(15px,2.9cqw,18px)/1.3 var(--serif);max-width:70cqw;margin:0}
.barcode{position:absolute;right:3.6cqw;bottom:3.6cqw;width:11cqw;height:7cqw;background:#fff;padding:.7cqw;display:flex;gap:.35cqw}
.barcode i{display:block;background:#111;flex:1}
.barcode i:nth-child(3n){flex:.4}
.barcode i:nth-child(4n){flex:2}

/* ================= ČLANCI ================= */
.article{padding:clamp(72px,10vw,140px) 0}
.folio{display:flex;justify-content:space-between;font:700 12px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--ink);padding-bottom:10px;margin-bottom:clamp(40px,6vw,72px)}
.article h2{font:400 clamp(44px,7vw,104px)/.95 var(--serif);letter-spacing:-.025em;margin:0 0 .3em;max-width:14em}
.lead{font:italic 400 clamp(21px,2.2vw,28px)/1.35 var(--serif);max-width:34em;margin:0 0 clamp(40px,5vw,64px);color:var(--ink)}
.cols{column-count:2;column-gap:44px}
.cols p{margin:0 0 1em}
.dropcap::first-letter{float:left;font:900 5.1em/.78 var(--serif);color:var(--ox);margin:.06em .1em 0 0}

/* naslovna priča */
.story-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
@media (min-width:1101px){.story-grid .cols{column-count:3}}
.story-photo figcaption,.cap{font:400 14px/1.4 var(--sans);letter-spacing:.02em;color:var(--muted);margin-top:10px}
.pull{grid-column:1 / -1;margin:clamp(40px,6vw,80px) 0 0;padding:clamp(28px,4vw,44px) 0;border-top:3px solid var(--ox);border-bottom:1px solid var(--rule);display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:24px;align-items:end}
.pull p{font:italic 400 clamp(30px,4.2vw,56px)/1.1 var(--serif);margin:0;color:var(--ox)}
.pull cite{font:700 13px var(--sans);letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:var(--muted)}

/* lista */
.list-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,5vw,72px);align-items:start}
.big-num{font:900 clamp(120px,19vw,280px)/.8 var(--serif);color:var(--ox);letter-spacing:-.04em;margin:0}
.big-num + p{font:700 13px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:16px 0 0;max-width:16em}
.rank{width:100%;border-collapse:collapse;font-size:clamp(17px,1.5vw,20px)}
.rank th{font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:left;padding:0 12px 12px 0;border-bottom:1px solid var(--ink)}
.rank td{padding:15px 12px 15px 0;border-bottom:1px solid var(--rule)}
.rank td:first-child,.rank th:first-child{width:4.2em}
.rank .num{text-align:right;padding-right:0;white-space:nowrap}
.rank .him td{color:var(--ox);font-weight:700;border-top:2px solid var(--ox);border-bottom:2px solid var(--ox)}
.note{font:italic 400 15px var(--serif);color:var(--muted);margin:18px 0 0}
.rx{display:inline-block;vertical-align:-.12em;width:var(--w,6em);max-width:100%;height:1.02em;background:var(--redact);cursor:not-allowed}

/* profil */
.profile-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,6vw,96px);align-items:start}
.factbox{border-top:6px solid var(--ox);background:#EFEBE5;padding:22px 24px 10px}
.factbox h3{font:700 13px var(--sans);letter-spacing:.16em;text-transform:uppercase;margin:0 0 10px}
.factbox dl{margin:0}
.factbox div{padding:11px 0;border-top:1px solid var(--rule)}
.factbox dt{font:700 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.factbox dd{margin:2px 0 0;font-size:19px;line-height:1.35}
.rows{margin:0;border-top:1px solid var(--ink)}
.row{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:24px;padding:26px 0 28px;border-bottom:1px solid var(--rule)}
.row dt{font:400 clamp(25px,2.4vw,32px)/1.12 var(--serif)}
.row dd{margin:0}

/* bezbednost — bordo strana */
.dark{background:var(--ox);color:var(--cream)}
.dark .folio{color:rgba(246,239,230,.7);border-bottom-color:var(--cream)}
.dark .kick{color:#E8C9A8}
.dark .lead{color:var(--cream)}
.sec-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(28px,6vw,96px);align-items:start}
.sec-grid figcaption{font:400 14px/1.4 var(--sans);color:rgba(246,239,230,.75);margin-top:10px}
.sec-text p{margin:0 0 1.4em;max-width:30em}
.ledger{width:100%;border-collapse:collapse;margin-top:8px}
.ledger caption{text-align:left;font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:rgba(246,239,230,.7);padding-bottom:10px;border-bottom:1px solid var(--cream)}
.ledger th{font-weight:400;text-align:left;padding:12px 16px 12px 0;border-bottom:1px solid rgba(246,239,230,.25)}
.ledger td{text-align:right;padding:12px 0;border-bottom:1px solid rgba(246,239,230,.25);font:900 26px/1 var(--serif);white-space:nowrap}
.ledger .rx{background:#000}

/* nadimak */
.bond-text{max-width:40em;margin-bottom:clamp(48px,7vw,96px)}
.bond-text p{margin:0 0 1em}
.bond-text .last{font:italic 700 clamp(24px,2.6vw,34px)/1.2 var(--serif);color:var(--ox);margin-top:.8em}
.bond-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2.4vw,32px);align-items:start}
.b1{grid-column:1 / span 6}
.b2{grid-column:8 / span 5;margin-top:clamp(80px,14vw,220px)}

/* foto-priča */
.spread{max-width:1600px;margin:0 auto}
.spread img{width:100%}
.spread figcaption{font:400 14px/1.4 var(--sans);letter-spacing:.02em;color:var(--muted);margin-top:12px}
.album-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2.4vw,32px);align-items:start;margin-top:clamp(48px,7vw,96px)}
.a1{grid-column:1 / span 7}
.a2{grid-column:9 / span 4;margin-top:clamp(60px,10vw,160px)}

/* zadnja korica */
.back{background:var(--ox-deep);color:var(--cream);padding:clamp(64px,9vw,120px) 0 40px}
.back-mast{font:900 clamp(64px,12vw,170px)/.8 var(--serif);letter-spacing:-.03em;margin:0 0 clamp(32px,5vw,56px)}
.back-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px;align-items:end;border-top:1px solid rgba(246,239,230,.4);padding-top:28px}
.back-main{font:400 clamp(22px,2.3vw,30px)/1.3 var(--serif);margin:0;max-width:22em}
.back-small{font:400 14px/1.5 var(--sans);letter-spacing:.02em;color:rgba(246,239,230,.75);margin:0}
.back-small a{color:var(--cream)}

/* poruka na klik cenzure */
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,12px);z-index:10;background:#000;color:#F6EFE6;padding:11px 18px;font:15px var(--sans);letter-spacing:.02em;max-width:calc(100% - 32px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ================= manji ekrani ================= */
@media (max-width:1100px){
  .cover-page{grid-template-columns:1fr;justify-items:center;gap:36px;padding:32px var(--gutter) 56px}
  .cover{order:1;height:min(calc(100svh - 64px),1000px)}
  .toc{order:2;max-width:560px;width:100%}
  .cover-side{order:0;flex-direction:row;align-self:auto;width:100%;max-width:560px}
  .cover-side .cue{display:none}
}
@media (max-width:820px){
  body{font-size:18px}
  .cols{column-count:1}
  .story-grid,.list-grid,.profile-grid,.sec-grid{grid-template-columns:1fr}
  .story-photo{max-width:440px}
  .pull{grid-template-columns:1fr}
  .row{grid-template-columns:1fr;gap:8px}
  .b1{grid-column:1 / span 12}
  .b2{grid-column:3 / span 10;margin-top:8px}
  .a1{grid-column:1 / span 12}
  .a2{grid-column:3 / span 10;margin-top:8px}
  .spread figcaption{padding:0 var(--gutter)}
  .back-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .cover-page{padding:0;gap:0;justify-items:stretch}
  .cover{height:100svh;width:100%;aspect-ratio:auto;box-shadow:none}
  .cover-side{display:none}
  .toc{padding:56px var(--gutter) 64px;max-width:none}
  .cover-lang{display:inline}
  .c-country{display:none}
  .rank td:first-child,.rank th:first-child{width:2.6em}
  .ledger td{font-size:22px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.toast{transition:none}}