/* ============================================================
   MNK Split - "Klasika" dizajn
   Paleta: krem / zlato / jadranska plava
   Fontovi: Cormorant Garamond, Inter, IBM Plex Mono (Google Fonts)
   ============================================================ */
  :root{
    --cream:#ffffff; /* f5efdf osnovna krem boja - pozadina stranice */
    --cream-2:#ebe2cb;
    --cream-3:#e2d6b7;
    --ink:#15110b;
    --ink-2:#3a2f1f;
    --gold:#a8772a;
    --gold-2:#8c5f1d;
    --gold-3:#d7b46a;
    --jadran:#0e2a36;
    --jadran-2:#163a48;
    --line:rgba(21,17,11,.18);
    --serif:'Cormorant Garamond', 'EB Garamond', Georgia, serif;
    --sans:'Inter', system-ui, sans-serif;
    --mono:'IBM Plex Mono', ui-monospace, monospace;
  }
  *{box-sizing:border-box}
  html,body{margin:0;padding:0;background:var(--cream);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;max-width:100%}
  body{background-image:
    radial-gradient(circle at 20% 0%, rgba(168,119,42,.06), transparent 50%),
    radial-gradient(circle at 80% 100%, rgba(14,42,54,.05), transparent 50%);
  }
  a{color:inherit;text-decoration:none}
  button{font:inherit;cursor:pointer}
  .serif{font-family:var(--serif)}
  .mono{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase}
  .container{max-width:1280px;margin:0 auto;padding:0 32px}
  hr.rule{border:0;border-top:1px solid var(--line);margin:0}
  hr.gold-rule{border:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold) 20%,var(--gold) 80%,transparent);margin:0}

  /* TOP BAR */
  .topbar{background:var(--jadran);color:var(--cream);font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;padding:9px 32px;display:flex;justify-content:space-between;align-items:center;gap:24px}
  .topbar .ticker{display:flex;gap:24px;overflow:hidden;flex:1;min-width:0}
  .topbar .ticker span{white-space:nowrap;color:var(--gold-3)}
  .topbar .ticker em{font-style:normal;color:var(--cream);margin-right:6px}
  .topbar .lang{display:flex;gap:6px;align-items:center}
  .topbar .lang b{color:var(--gold-3)}

  /* NAV */
  .nav{position:sticky;top:0;z-index:50;background:rgba(245,239,223,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 32px;max-width:1280px;margin:0 auto;gap:24px}
  .brand{display:flex;align-items:center;gap:14px;cursor:pointer}
  .brand .crest{width:42px;height:48px;flex:0 0 auto}
  .brand .wm{display:flex;flex-direction:column;line-height:1}
  .brand .wm b{font-family:var(--serif);font-weight:600;font-size:18px;letter-spacing:.04em;color:var(--ink)}
  .brand .wm small{font-family:var(--mono);font-size:9.5px;letter-spacing:.22em;color:var(--gold-2);margin-top:4px;text-transform:uppercase}
  .nav-links{display:flex;gap:6px;align-items:center}
  .nav-links button{background:none;border:0;padding:9px 12px;font-family:var(--sans);font-size:12.5px;color:var(--ink-2);letter-spacing:.04em;border-radius:0;position:relative}
  .nav-links button.active{color:var(--ink)}
  .nav-links button.active::after{content:"";position:absolute;left:12px;right:12px;bottom:2px;height:2px;background:var(--gold)}
  .nav-links button:hover{color:var(--ink)}
  .nav-toggle{display:none}
  .nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;border:1px solid var(--line);background:transparent;cursor:pointer;padding:0 11px;border-radius:0}
  .nav-burger span{display:block;height:2px;width:100%;background:var(--ink);transition:transform .25s ease,opacity .2s ease}
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav-cta{display:flex;gap:10px;align-items:center}
  .nav-cta .iconbtn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:transparent;display:flex;align-items:center;justify-content:center;color:var(--ink-2)}
  .nav-cta .iconbtn:hover{background:var(--cream-2);border-color:var(--gold)}
  .btn{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border:1px solid var(--gold);background:var(--gold);color:#fff7e3;font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;border-radius:0}
  .btn.ghost{background:transparent;color:var(--gold-2)}
  .btn.dark{background:var(--ink);border-color:var(--ink);color:var(--cream)}
  .btn:hover{background:var(--gold-2);color:#fff}
  .btn.ghost:hover{background:var(--gold);color:#fff7e3}

  /* HERO */
  .hero{position:relative;/*padding:70px 0 60px;*/overflow:hidden}
  .hero-inner{display:grid;grid-template-columns:1.2fr .9fr;gap:60px;align-items:center}
  .hero h1{font-family:var(--serif);font-weight:500;font-size:96px;line-height:.96;margin:0;letter-spacing:-.01em;color:var(--ink)}
  .hero h1 .ital{font-style:italic;color:var(--gold-2)}
  .hero h1 .small{display:block;font-size:36px;font-style:italic;color:var(--ink-2);font-weight:400;margin-top:10px;letter-spacing:0}
  .hero .eyebrow{display:flex;align-items:center;gap:16px;margin-bottom:28px}
  .hero .eyebrow .line{flex:0 0 60px;height:1px;background:var(--gold)}
  .hero .lede{margin-top:32px;max-width:520px;font-size:15px;color:var(--ink-2);line-height:1.7}
  .hero .actions{display:flex;gap:14px;margin-top:36px}
  .hero-frame{position:relative;aspect-ratio:4/5;background:transparent;overflow:hidden}
  .hero-frame .placeholder{position:absolute;inset:0;background:
    repeating-linear-gradient(45deg, rgba(255,255,255,.025) 0 2px, transparent 2px 14px),
    linear-gradient(180deg, #163a48, #0a1c25);
    display:flex;flex-direction:column;justify-content:flex-end;padding:24px;color:var(--cream)}
  .hero-frame .placeholder .ph-tag{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--gold-3);text-transform:uppercase;margin-bottom:8px}
  .hero-frame .placeholder .ph-name{font-family:var(--serif);font-style:italic;font-size:28px;line-height:1}
  .hero-frame .placeholder .ph-no{position:absolute;top:24px;right:24px;font-family:var(--serif);font-size:96px;line-height:1;color:rgba(215,180,106,.85)}
  .hero-frame .placeholder.has-photo{background:transparent}
  .hero-frame .placeholder.has-photo .ph-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;z-index:0}
  .hero-slideshow .ph-photo{opacity:0;transition:opacity 1s ease}
  .hero-slideshow .ph-photo.active{opacity:1}
  .hero-frame .corner{display:none}

  /* FACT STRIP */
  .factstrip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--cream-2)}
  .factstrip-inner{display:grid;grid-template-columns:repeat(4,1fr);max-width:1280px;margin:0 auto}
  .fact{padding:32px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
  .fact:last-child{border-right:0}
  .fact .n{font-family:var(--serif);font-size:64px;line-height:1;color:var(--gold-2);font-weight:500}
  .fact .l{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;color:var(--ink-2);text-transform:uppercase}
  .fact .sub{font-family:var(--serif);font-style:italic;font-size:14px;color:var(--ink-2);margin-top:2px}

  /* SECTION */
  .section{padding:80px 0}
  .section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:40px}
  .section-head h2{font-family:var(--serif);font-weight:500;font-size:54px;line-height:1;margin:0;letter-spacing:-.01em}
  .section-head h2 em{font-style:italic;color:var(--gold-2)}
  .section-head .right{display:flex;gap:10px;align-items:center}
  .section-head .label{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-2);margin-bottom:10px;display:flex;align-items:center;gap:10px}
  .section-head .label::before{content:"";width:24px;height:1px;background:var(--gold)}

  /* NEXT MATCH */
  .nextmatch{background:var(--jadran);color:var(--cream);padding:48px;position:relative;overflow:hidden;border:1px solid var(--ink)}
  .nextmatch::before{content:"";position:absolute;inset:8px;border:1px solid rgba(215,180,106,.25);pointer-events:none}
  .nm-inner{display:grid;grid-template-columns:1fr auto 1fr auto;gap:32px;align-items:center}
  .nm-team{display:flex;align-items:center;gap:18px}
  .nm-team.right{justify-content:flex-end;flex-direction:row-reverse}
  .nm-team .badge{width:74px;height:84px;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
  .nm-team .meta b{font-family:var(--serif);font-size:30px;display:block;line-height:1}
  .nm-team .meta small{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;color:var(--gold-3);text-transform:uppercase;display:block;margin-top:6px}
  .nm-vs{font-family:var(--serif);font-style:italic;font-size:38px;color:var(--gold-3)}
  .nm-cd{text-align:center;border-left:1px solid rgba(215,180,106,.25);padding-left:32px}
  .nm-cd .row{display:flex;gap:14px;justify-content:center}
  .nm-cd .cell{min-width:72px}
  .nm-cd .cell b{font-family:var(--serif);font-size:54px;line-height:1;color:var(--gold-3);font-variant-numeric:tabular-nums}
  .nm-cd .cell small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;color:var(--cream);text-transform:uppercase;margin-top:6px;opacity:.7}
  .nm-meta{margin-top:24px;display:flex;justify-content:space-between;align-items:center;padding-top:20px;border-top:1px solid rgba(215,180,106,.2);font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-3)}
  .nm-meta a{color:var(--cream);border-bottom:1px solid rgba(245,239,223,.4);padding-bottom:1px}

  /* NEWS */
  .news-grid{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:24px}
  .news-card{background:var(--cream);border:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden;transition:transform .25s ease, box-shadow .25s ease}
  .news-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(20,15,8,.08)}
  .news-card .img{aspect-ratio:16/10;background:
    repeating-linear-gradient(135deg, rgba(168,119,42,.07) 0 2px, transparent 2px 10px),
    linear-gradient(180deg, var(--cream-3), var(--cream-2));
    position:relative;display:flex;align-items:flex-end;padding:16px;color:var(--ink-2)}
  .news-card .img .tag{position:absolute;top:14px;left:14px;background:var(--ink);color:var(--cream);font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;padding:5px 9px;text-transform:uppercase}
  .news-card .img .desc{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:rgba(60,47,31,.6)}
  .news-card .body{padding:22px 22px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
  .news-card.feature .img{aspect-ratio:16/9}
  .news-card h3{font-family:var(--serif);font-weight:500;font-size:24px;line-height:1.15;margin:0;letter-spacing:-.005em}
  .news-card.feature h3{font-size:34px}
  .news-card .date{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--gold-2);text-transform:uppercase}
  .news-card p{margin:0;color:var(--ink-2);font-size:13.5px;line-height:1.55}
  .news-card .more{margin-top:auto;font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-2);display:inline-flex;align-items:center;gap:8px}
  .news-card .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}

  /* NEWS ARTICLE (single) */
  .news-article{max-width:820px;margin:0 auto;background:var(--cream);border:1px solid var(--line)}
  .news-article .img{aspect-ratio:16/9;position:relative;overflow:hidden;background:
    repeating-linear-gradient(135deg, rgba(168,119,42,.07) 0 2px, transparent 2px 10px),
    linear-gradient(180deg, var(--cream-3), var(--cream-2))}
  .news-article .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
  .news-article .img .tag{position:absolute;top:18px;left:18px;background:var(--ink);color:var(--cream);font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;padding:6px 11px;text-transform:uppercase;z-index:1}
  .news-article .body{padding:40px 48px 48px;display:flex;flex-direction:column;gap:18px}
  .news-article .date{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--gold-2);text-transform:uppercase}
  .news-article h3{font-family:var(--serif);font-weight:500;font-size:40px;line-height:1.1;margin:0 0 6px;letter-spacing:-.01em}
  .news-article p{margin:0;color:var(--ink-2);font-size:16px;line-height:1.7}

  /* SPONSORS */
  .sponsors{padding:60px 0;background:var(--cream-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .sponsors h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;color:var(--ink-2);text-transform:uppercase;text-align:center;margin:0 0 28px}
  .sponsor-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:0;border-left:1px solid var(--line)}
  .sponsor-grid .s{height:90px;border-right:1px solid var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;color:var(--ink-2);font-size:18px;background:var(--cream);transition:background .2s}
  .sponsor-grid .s:hover{background:var(--cream-3);color:var(--gold-2)}

  /* CLUB PAGE */
  .club-hero{padding:80px 0 40px}
  .club-hero h1{font-family:var(--serif);font-weight:500;font-size:120px;line-height:.95;margin:0;letter-spacing:-.015em}
  .club-hero h1 em{font-style:italic;color:var(--gold-2)}
  .club-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:60px;padding:40px 0 80px}
  .club-grid .left .stat{padding:24px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:baseline}
  .club-grid .left .stat:last-child{border-bottom:1px solid var(--line)}
  .club-grid .left .stat .l{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
  .club-grid .left .stat .v{font-family:var(--serif);font-size:42px;color:var(--gold-2)}
  .club-grid .right p{font-family:var(--serif);font-size:22px;line-height:1.5;color:var(--ink-2);margin:0 0 18px;font-weight:400}
  .club-grid .right p:first-of-type::first-letter{font-family:var(--serif);font-size:88px;line-height:.85;float:left;padding:6px 12px 0 0;color:var(--gold-2);font-weight:500}
  .academy-intro{padding:40px 0 80px}
  .academy-wide{aspect-ratio:3/2;margin-bottom:48px}
  .academy-wide .placeholder.has-photo .ph-photo{object-position:center}
  .academy-intro-text{display:grid;grid-template-columns:1fr 1fr;gap:48px}
  .academy-intro-text p{font-family:var(--serif);font-size:22px;line-height:1.5;color:var(--ink-2);margin:0;font-weight:400}
  .academy-list{font-family:var(--serif);font-size:20px;line-height:1.5;color:var(--ink-2);padding-left:22px;margin:0 0 18px}
  .academy-list li{margin:0 0 6px}
  .timeline{padding:80px 0;background:var(--cream-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .tl-row{display:grid;grid-template-columns:140px 1fr 1fr;gap:32px;padding:28px 0;border-top:1px solid var(--line);align-items:baseline}
  .tl-row .y{font-family:var(--serif);font-size:48px;color:var(--gold-2);line-height:1}
  .tl-row .t{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ink)}
  .tl-row .d{color:var(--ink-2);font-size:13.5px;line-height:1.55}

  /* SQUAD */
  .squad-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
  .player{position:relative;overflow:hidden;border:1px solid var(--line);background:var(--cream);cursor:pointer}
  .player .ph{aspect-ratio:4/5;background:linear-gradient(180deg,var(--jadran),#0a1c25);position:relative;overflow:hidden}
  .player .ph::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg, rgba(255,255,255,.04) 0 1px, transparent 1px 12px)}
  .player .no{position:absolute;top:14px;right:18px;font-family:var(--serif);font-size:88px;line-height:1;color:var(--gold-3);opacity:.9;transition:transform .35s ease}
  .player .bg-name{position:absolute;left:0;right:0;bottom:30%;font-family:var(--serif);font-style:italic;font-size:46px;color:rgba(245,239,223,.08);line-height:.9;padding:0 18px;text-align:left;transform:translateY(20px);transition:transform .35s ease}
  .player .body{padding:18px;display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
  .player .body .nm{font-family:var(--serif);font-size:22px;line-height:1.05}
  .player .body .nm small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--gold-2);text-transform:uppercase;margin-top:6px}
  .player .body .pos{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
  .player:hover .no{transform:translateY(-6px) scale(1.04)}
  .player:hover .bg-name{transform:translateY(0)}
  .player .stats{position:absolute;left:0;right:0;bottom:0;background:rgba(14,42,54,.92);color:var(--cream);padding:18px;transform:translateY(100%);transition:transform .3s ease;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  .player:hover .stats{transform:translateY(0)}
  .player .stats .s{text-align:center}
  .player .stats .s b{font-family:var(--serif);font-size:26px;color:var(--gold-3);display:block;line-height:1}
  .player .stats .s small{font-family:var(--mono);font-size:9px;letter-spacing:.18em;color:var(--cream);opacity:.8;text-transform:uppercase}

  /* SCHEDULE */
  .schedule-table{border-top:1px solid var(--line);width:100%;border-collapse:collapse}
  .schedule-table tr{border-bottom:1px solid var(--line)}
  .schedule-table td{padding:20px 16px;vertical-align:middle;font-size:14px;color:var(--ink-2)}
  .schedule-table .date b{display:block;font-family:var(--serif);font-size:28px;color:var(--ink);line-height:1}
  .schedule-table .date small{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--gold-2);text-transform:uppercase}
  .schedule-table .vs{font-family:var(--serif);font-size:20px;color:var(--ink)}
  .schedule-table .vs small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--ink-2);text-transform:uppercase;margin-top:4px}
  .schedule-table .res{font-family:var(--serif);font-size:24px;color:var(--gold-2)}
  .schedule-table .res.loss{color:var(--ink-2);opacity:.65}
  .schedule-table .venue{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
  .schedule-table .comp{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-2)}
  .schedule-table tr:hover{background:var(--cream-2)}

  /* STANDINGS */
  .standings{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:11.5px}
  .standings th{text-align:left;padding:12px 14px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);border-bottom:1px solid var(--ink);font-size:10.5px}
  .standings td{padding:14px;border-bottom:1px solid var(--line);font-family:var(--sans);font-size:13.5px}
  .standings td.club{font-family:var(--serif);font-size:18px}
  .standings td.num{text-align:center;font-variant-numeric:tabular-nums}
  .standings tr.us{background:var(--cream-2)}
  .standings tr.us td{color:var(--ink);font-weight:500}
  .standings tr.us td.club{color:var(--gold-2);font-style:italic}
  .standings .rank{font-family:var(--serif);font-size:20px;color:var(--gold-2);width:48px}

  /* SHOP */
  .shop-layout{display:grid;grid-template-columns:240px 1fr;gap:48px;padding:48px 0 80px}
  .filters h5{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-2);margin:32px 0 14px;padding-bottom:10px;border-bottom:1px solid var(--line)}
  .filters h5:first-child{margin-top:0}
  .filters .opt{display:flex;justify-content:space-between;padding:7px 0;font-size:13.5px;color:var(--ink-2);cursor:pointer}
  .filters .opt:hover{color:var(--gold-2)}
  .filters .opt.active{color:var(--gold-2);font-weight:500}
  .filters .opt small{color:var(--ink-2);opacity:.5;font-family:var(--mono);font-size:10.5px}
  .filters .swatches{display:flex;gap:8px;flex-wrap:wrap;padding-top:4px}
  .filters .sw{width:28px;height:28px;border-radius:50%;border:2px solid var(--cream);box-shadow:0 0 0 1px var(--line);cursor:pointer}
  .filters .sw:hover{box-shadow:0 0 0 1px var(--gold)}
  .filters .price{display:flex;gap:8px;align-items:center;margin-top:6px}
  .filters .price input{width:80px;padding:8px 10px;border:1px solid var(--line);background:var(--cream);font-family:var(--mono);font-size:11px}
  .filters .check{display:flex;justify-content:space-between;align-items:center;padding:8px 0;font-size:13.5px;color:var(--ink-2)}
  .filters .check input{accent-color:var(--gold)}

  .shop-toolbar{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:24px}
  .shop-toolbar .count{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2)}
  .shop-toolbar .sort{display:flex;gap:18px;align-items:center}
  .shop-toolbar .sort select{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;background:transparent;border:0;border-bottom:1px solid var(--ink);color:var(--ink);padding:6px 4px}

  .products{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 20px}
  .prod{background:var(--cream);border:1px solid var(--line);overflow:hidden;cursor:pointer;display:flex;flex-direction:column;transition:transform .25s, box-shadow .25s}
  .prod:hover{transform:translateY(-3px);box-shadow:0 14px 36px rgba(20,15,8,.10)}
  .prod .img{aspect-ratio:4/5;background:
    repeating-linear-gradient(45deg, rgba(168,119,42,.05) 0 2px, transparent 2px 12px),
    linear-gradient(180deg,var(--cream-3),var(--cream-2));
    position:relative;display:flex;align-items:center;justify-content:center;color:rgba(60,47,31,.45)}
  .prod .img .placeholder-label{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase}
  .prod .img .badge{position:absolute;top:12px;left:12px;background:var(--ink);color:var(--cream);font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;padding:5px 8px;text-transform:uppercase}
  .prod .img .badge.gold{background:var(--gold);color:#fff7e3}
  .prod .img .fav{position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:50%;background:rgba(245,239,223,.92);border:0;display:flex;align-items:center;justify-content:center;color:var(--ink)}
  .prod .body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px}
  .prod .nm{font-family:var(--serif);font-size:20px;line-height:1.15}
  .prod .meta{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);opacity:.7}
  .prod .row{display:flex;justify-content:space-between;align-items:center;margin-top:8px;padding-top:10px;border-top:1px solid var(--line)}
  .prod .row .price{font-family:var(--serif);font-size:22px;color:var(--gold-2)}
  .prod .row .price s{color:var(--ink-2);opacity:.5;font-size:14px;margin-right:6px;font-family:var(--sans)}
  .prod .row .add{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);background:transparent;border:0;padding:6px 0;border-bottom:1px solid var(--ink)}
  .prod .row .add:hover{color:var(--gold-2);border-color:var(--gold)}

  /* TICKETS */
  .tickets{padding:48px 0 80px}
  .tickets-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px}
  .ticket-card{background:var(--cream);border:1px solid var(--ink);padding:0;position:relative}
  .ticket-card .head{padding:24px 28px;border-bottom:1px dashed var(--line);display:flex;justify-content:space-between;align-items:center;background:var(--ink);color:var(--cream)}
  .ticket-card .head .nm{font-family:var(--serif);font-style:italic;font-size:22px}
  .ticket-card .head .nm small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--gold-3);text-transform:uppercase;margin-bottom:6px}
  .ticket-card .body{padding:32px 28px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
  .ticket-card .body .col h6{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2);margin:0 0 8px}
  .ticket-card .body .col b{font-family:var(--serif);font-size:26px;color:var(--ink);display:block;line-height:1}
  .ticket-card .seatmap{padding:24px 28px;border-top:1px dashed var(--line)}
  .ticket-card .foot{padding:22px 28px;display:flex;justify-content:space-between;align-items:center;border-top:1px dashed var(--line)}
  .ticket-card .foot .price{font-family:var(--serif);font-size:34px;color:var(--gold-2)}
  .ticket-card .foot .price small{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);margin-bottom:4px}
  .seatmap-svg{width:100%;height:auto;display:block}
  .sector{cursor:pointer}
  .sector:hover rect{fill:var(--gold-3)}
  .sector.selected rect{fill:var(--gold)}

  /* CONTACT */
  .contact{padding:80px 0;display:grid;grid-template-columns:1fr 1fr;gap:60px}
  .contact .left h2{font-family:var(--serif);font-size:64px;line-height:1;margin:0 0 24px;font-weight:500}
  .contact .left h2 em{font-style:italic;color:var(--gold-2)}
  .contact .info{display:flex;flex-direction:column;gap:18px;margin-top:32px}
  .contact .info .row{display:grid;grid-template-columns:140px 1fr;padding:14px 0;border-top:1px solid var(--line);align-items:baseline}
  .contact .info .row .l{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2)}
  .contact .info .row .v{font-family:var(--serif);font-size:20px;color:var(--ink)}
  .form{background:var(--cream-2);padding:36px;border:1px solid var(--line)}
  .form .field{display:flex;flex-direction:column;gap:6px;margin-bottom:20px}
  .form .field label{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2)}
  .form .field input,.form .field textarea{font-family:var(--serif);font-size:18px;background:transparent;border:0;border-bottom:1px solid var(--line);padding:8px 0;color:var(--ink);outline:none}
  .form .field input:focus,.form .field textarea:focus{border-color:var(--gold)}
  .form .field textarea{resize:none;height:90px}

  /* FOOTER */
  footer{background:var(--ink);color:var(--cream);padding:64px 0 24px;margin-top:40px}
  footer .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px;border-bottom:1px solid rgba(245,239,223,.1)}
  footer h6{font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:var(--gold-3);text-transform:uppercase;margin:0 0 18px}
  footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
  footer ul li{font-size:13px;color:rgba(245,239,223,.78);cursor:pointer}
  footer ul li:hover{color:var(--gold-3)}
  footer .brand-foot{display:flex;flex-direction:column;gap:14px}
  footer .brand-foot p{margin:0;color:rgba(245,239,223,.68);font-size:13px;line-height:1.6;max-width:280px}
  footer .marjan-row{display:flex;align-items:flex-end;justify-content:center;padding:32px 0;opacity:.4}
  footer .legal{display:flex;justify-content:space-between;padding-top:24px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:rgba(245,239,223,.5)}

  /* SPONSOR TIERS */
  .sp-section{padding:80px 0;background:var(--cream-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .sp-head{text-align:center;margin-bottom:48px}
  .sp-head .label{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-2);margin-bottom:14px;display:flex;align-items:center;gap:10px;justify-content:center}
  .sp-head .label::before,.sp-head .label::after{content:"";width:24px;height:1px;background:var(--gold)}
  .sp-head h2{font-family:var(--serif);font-weight:500;font-size:48px;line-height:1;margin:0;letter-spacing:-.01em}
  .sp-head h2 em{font-style:italic;color:var(--gold-2)}
  .sp-tier{margin-bottom:34px}
  .sp-tier:last-child{margin-bottom:0}
  .sp-tier-label{display:flex;align-items:center;gap:14px;margin-bottom:16px}
  .sp-tier-label .dot{width:12px;height:12px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 3px rgba(27,22,19,.05)}
  .sp-tier-label .nm{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap}
  .sp-tier-label .nm b{color:var(--ink);font-weight:600}
  .sp-tier-label .ln{flex:1;height:1px;background:var(--line)}
  .sp-tier-label .ct{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);opacity:.55;white-space:nowrap}
  .sp-gold-card{position:relative;display:grid;grid-template-columns:1.35fr .85fr;border:1px solid var(--gold);background:var(--cream);overflow:hidden}
  .sp-gold-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold-3),var(--gold),var(--gold-2))}
  .sp-gold-left{padding:44px 48px;display:flex;flex-direction:column;justify-content:center;gap:8px}
  .sp-gold-left .tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2)}
  .sp-gold-left .nm{font-family:var(--serif);font-size:54px;line-height:1;color:var(--ink);font-weight:500;letter-spacing:-.01em}
  .sp-gold-left p{margin:10px 0 0;color:var(--ink-2);font-size:14px;line-height:1.6;max-width:440px}
  .sp-gold-logo{border-left:1px solid var(--line);background:
    repeating-linear-gradient(45deg, rgba(168,119,42,.05) 0 2px, transparent 2px 12px),
    linear-gradient(180deg,var(--cream-3),var(--cream-2));
    display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(27,22,19,.4);min-height:170px;text-align:center;padding:0 16px}
  .sp-row{display:grid;border-left:1px solid var(--line)}
  .sp-row.silver{grid-template-columns:repeat(3,1fr)}
  .sp-row.bronze{grid-template-columns:repeat(6,1fr)}
  .sp-row.media{grid-template-columns:repeat(4,1fr)}
  .sp-cell{border-right:1px solid var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center;background:var(--cream);font-family:var(--serif);font-style:italic;color:var(--ink-2);transition:background .2s,color .2s;text-align:center;padding:0 14px}
  .sp-cell:hover{background:var(--cream-3);color:var(--gold-2)}
  .sp-row.silver .sp-cell{height:124px;font-size:26px}
  .sp-row.bronze .sp-cell{height:88px;font-size:17px}
  .sp-row.media .sp-cell{height:96px;font-size:20px}

  /* MISC SVG */
  .col-set{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;opacity:.05;position:absolute;left:0;right:0;height:120px;pointer-events:none}
  .col-set div{background:var(--ink)}

  /* COACHING STAFF */
  .staff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:48px;padding-bottom:48px;border-bottom:1px solid var(--line)}
  .staff{display:flex;gap:18px;padding:8px 0}
  .staff .avatar{width:84px;height:84px;flex:0 0 auto;background:var(--jadran);border-radius:50%;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center;color:var(--gold-3);font-family:var(--serif);font-size:28px;font-style:italic}
  .staff .avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}
  .staff-lead .avatar{width:120px;height:120px;font-size:38px}
  .staff-lead .info b{font-size:26px}
  .staff .info b{font-family:var(--serif);font-size:22px;display:block;line-height:1.1}
  .staff .info small{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--gold-2);text-transform:uppercase;display:block;margin:6px 0 8px}
  .staff .info p{margin:0;font-size:13px;color:var(--ink-2);line-height:1.5}

  /* ANIMATIONS */
  @keyframes fadeup{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
  .page{animation:fadeup .35s ease}

  /* ===== BLAZOR PRILAGODBE ===== */

  /* NavLink kao <a> umjesto <button> */
  .nav-links a{display:inline-block;background:none;border:0;padding:9px 12px;font-family:var(--sans);font-size:12.5px;color:var(--ink-2);letter-spacing:.04em;position:relative;cursor:pointer}
  .nav-links a:hover{color:var(--ink)}
  .nav-links a.active{color:var(--ink)}
  .nav-links a.active::after{content:"";position:absolute;left:12px;right:12px;bottom:2px;height:2px;background:var(--gold)}

  /* Blazor error UI */
  #blazor-error-ui{color-scheme:light only;background:var(--ink);color:var(--cream);bottom:0;box-shadow:0 -2px 12px rgba(0,0,0,.3);display:none;left:0;padding:.8rem 1.2rem .9rem 1.2rem;position:fixed;width:100%;z-index:1000;font-family:var(--mono);font-size:12px;letter-spacing:.06em}
  #blazor-error-ui .dismiss,#blazor-error-ui .reload{color:var(--gold-3);margin-left:12px;cursor:pointer;text-decoration:underline}

  /* Responsivnost */
  @media (max-width: 1100px){
    .hero h1{font-size:64px}
    .club-hero h1{font-size:76px}
    .news-grid{grid-template-columns:1fr 1fr}
    .news-card.feature{grid-column:1/-1}
    .squad-grid{grid-template-columns:repeat(3,1fr)}
    .products{grid-template-columns:repeat(2,1fr)}
    .nm-inner{grid-template-columns:1fr;gap:24px}
    .nm-cd{border-left:0;padding-left:0;border-top:1px solid rgba(215,180,106,.25);padding-top:24px}
    .tickets-grid{grid-template-columns:1fr}
    footer .grid{grid-template-columns:1fr 1fr}
  }
  @media (max-width: 760px){
    .container{padding:0 22px}
    .nav-inner{flex-wrap:wrap;justify-content:space-between;padding:12px 18px;gap:14px}
    .nav-cta{display:none}
    .nav-burger{display:flex;order:2}
    .nav-links{order:3;display:none;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid var(--line);padding-top:6px}
    .nav-toggle:checked ~ .nav-links{display:flex}
    .nav-links button,.nav-links a{display:block;width:100%;padding:13px 4px;font-size:15px;border-bottom:1px solid var(--line)}
    .nav-links a:last-child{border-bottom:0}
    .nav-links button.active::after,.nav-links a.active::after{left:4px;right:auto;width:18px;bottom:8px}
    .hero-inner{grid-template-columns:1fr}
    .factstrip-inner{grid-template-columns:1fr 1fr}
    .fact{border-bottom:1px solid var(--line)}
    .news-grid{grid-template-columns:1fr}
    .squad-grid{grid-template-columns:1fr 1fr}
    .products{grid-template-columns:1fr}
    .shop-layout{grid-template-columns:1fr}
    .club-grid{grid-template-columns:1fr}
    .academy-intro-text{grid-template-columns:1fr;gap:18px}
    .academy-wide{aspect-ratio:4/3;margin-bottom:32px}
    .contact{grid-template-columns:1fr}
    .tl-row{grid-template-columns:1fr;gap:8px}
    .sp-gold-card{grid-template-columns:1fr}
    .sp-row.bronze{grid-template-columns:repeat(3,1fr)}
    .sp-row.media{grid-template-columns:repeat(2,1fr)}
    .staff-grid{grid-template-columns:1fr}
    .values-grid{grid-template-columns:1fr!important}
    .section-head{flex-direction:column;align-items:flex-start}
    /*.club-hero{padding:44px 0 28px}*/
    .hero h1{font-size:44px}
    .club-hero h1{font-size:40px;letter-spacing:-.01em;overflow-wrap:break-word}
    .club-hero p.serif{font-size:19px!important}
  }

  /* Mali pomoćni stilovi (layout) */
  .nav-cta .cart-count{position:absolute;top:-4px;right:-4px;background:var(--gold);color:#fff;font-family:var(--mono);font-size:9px;width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center}
  footer .soc{width:32px;height:32px;border:1px solid rgba(245,239,223,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--gold-3);cursor:pointer;text-decoration:none;transition:border-color .2s,color .2s}
  footer .soc:hover{border-color:var(--gold-3);color:var(--cream)}
  footer ul li a{color:inherit}
  footer ul li a:hover{color:var(--gold-3)}

  /* DONACIJE */
  .donate-wrap{display:grid;grid-template-columns:1.5fr 1fr;gap:48px;padding:20px 0 90px;align-items:start}
  .donate-card{border:1px solid var(--line);background:var(--cream);padding:32px}
  .donate-toggle{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);margin-bottom:28px}
  .donate-toggle button{padding:14px;background:transparent;border:0;cursor:pointer;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2)}
  .donate-toggle button.active{background:var(--ink);color:var(--cream)}
  .donate-presets{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}
  .donate-presets .preset{display:flex;flex-direction:column;gap:4px;text-align:left;padding:16px;border:1px solid var(--line);background:var(--cream-2);cursor:pointer;transition:border-color .15s,box-shadow .15s}
  .donate-presets .preset:hover{border-color:var(--gold)}
  .donate-presets .preset.active{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
  .donate-presets .preset .amt{font-family:var(--serif);font-size:30px;color:var(--gold-2);line-height:1}
  .donate-presets .preset .ttl{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink)}
  .donate-presets .preset .dsc{font-size:12.5px;color:var(--ink-2);line-height:1.4}
  .donate-custom{margin-bottom:22px}
  .donate-custom .lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);display:block;margin-bottom:8px}
  .donate-custom .field{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--cream-2);padding:10px 14px}
  .donate-custom .field .cur{font-family:var(--serif);font-size:24px;color:var(--gold-2)}
  .donate-custom .field input{flex:1;border:0;background:transparent;font-family:var(--serif);font-size:24px;color:var(--ink);outline:none;width:100%}
  .donate-custom .field .per{font-family:var(--mono);font-size:11px;color:var(--ink-2)}
  .donate-submit{width:100%;justify-content:center;padding:15px;font-size:11px}
  .donate-submit:disabled{opacity:.45;cursor:not-allowed}
  .donate-secure{font-size:10px;letter-spacing:.12em;color:var(--ink-2);text-align:center;margin-top:14px}
  .donate-error{background:#fff3f0;border:1px solid #e7b9ab;color:#9a3b22;padding:10px 14px;font-size:13px;margin-bottom:16px}
  .donate-note{background:var(--cream-2);border:1px solid var(--line);color:var(--ink-2);padding:10px 14px;font-size:12.5px;line-height:1.5;margin-bottom:16px}
  .donate-note code{font-family:var(--mono);color:var(--gold-2)}
  .donate-side .cause{padding:18px 0;border-top:1px solid var(--line)}
  .donate-side .cause:last-child{border-bottom:1px solid var(--line)}
  .donate-side .cause h4{font-family:var(--serif);font-size:22px;margin:0 0 6px;color:var(--ink)}
  .donate-side .cause p{font-size:14px;line-height:1.6;color:var(--ink-2);margin:0}

  /* DONACIJE — CTA na početnoj */
  .donate-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:32px;border:1px solid var(--line);background:var(--cream-2);padding:40px}
  .donate-cta-text h2{font-family:var(--serif);font-weight:500;font-size:48px;line-height:1;margin:0}
  .donate-cta-text h2 em{font-style:italic;color:var(--gold-2)}
  .donate-cta-text p{font-family:var(--serif);font-size:19px;line-height:1.5;color:var(--ink-2);margin:14px 0 0;max-width:520px}
  .donate-cta-actions{display:flex;gap:12px;flex-shrink:0}

  /* KOŠARICA — traka na webshopu */
  .cart-bar{position:sticky;bottom:0;z-index:40;background:var(--ink);color:var(--cream);border-top:1px solid var(--gold)}
  .cart-bar-inner{padding:18px 32px;display:flex;flex-direction:column;gap:12px}
  .cart-bar-info{display:flex;align-items:baseline;gap:16px}
  .cart-bar-info .ct{font-size:11px;letter-spacing:.18em;color:var(--gold-3)}
  .cart-bar-info .tot{font-family:var(--serif);font-size:28px;color:var(--gold-2);margin-left:auto}
  .cart-bar-items{display:flex;flex-direction:column;gap:6px;max-height:180px;overflow-y:auto}
  .cart-bar-items .ci{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:14px;font-size:14px;padding:4px 0;border-bottom:1px solid rgba(245,239,223,.12)}
  .cart-bar-items .ci-nm{color:var(--cream)}
  .cart-bar-items .ci-qty{display:flex;align-items:center;gap:10px}
  .cart-bar-items .ci-qty button{width:24px;height:24px;border:1px solid rgba(245,239,223,.25);background:transparent;color:var(--cream);cursor:pointer;font-size:15px;line-height:1}
  .cart-bar-items .ci-qty button:hover{border-color:var(--gold);color:var(--gold-2)}
  .cart-bar-items .ci-pr{font-family:var(--mono);font-size:13px;color:var(--gold-3);min-width:78px;text-align:right}
  .cart-bar-items .ci-rm{background:transparent;border:0;color:rgba(245,239,223,.5);cursor:pointer;font-size:13px}
  .cart-bar-items .ci-rm:hover{color:var(--gold-2)}
  .cart-bar-actions{display:flex;gap:12px;justify-content:flex-end}
  .cart-bar-error{background:rgba(154,59,34,.25);border:1px solid #c0654a;color:#f3c9bd;padding:8px 12px;font-size:13px}
  .cart-bar-note{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--gold-3)}

  @media (max-width:860px){
    .donate-wrap{grid-template-columns:1fr;gap:32px}
    .donate-presets{grid-template-columns:1fr}
    .donate-cta-inner{flex-direction:column;align-items:flex-start;padding:28px}
    .cart-bar-info .tot{font-size:22px}
  }

  /* ============================================================
     ARHIVA POVIJESTI — novinski timeline (svijetla "klasika" tema)
     ============================================================ */
  .archive{
    --arch-red:#a32630;
    --arch-blue:#1d5f8a;
    background:var(--cream-2);
    color:var(--ink);
    padding:80px 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .archive .archive-head{max-width:760px;margin-bottom:48px}
  .archive .archive-head .label{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-2);margin-bottom:12px;display:flex;align-items:center;gap:10px}
  .archive .archive-head .label::before{content:"";width:24px;height:1px;background:var(--gold)}
  .archive .archive-head h2{font-family:var(--serif);font-weight:500;font-size:54px;line-height:1;margin:0;letter-spacing:-.01em;color:var(--ink)}
  .archive .archive-head h2 em{font-style:italic;color:var(--gold-2)}
  .archive .archive-intro{font-family:var(--serif);font-size:21px;line-height:1.55;color:var(--ink-2);margin:18px 0 0}

  .archive-timeline{position:relative;padding-left:40px}
  .archive-timeline::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--gold),var(--jadran))}
  .arch-year{position:relative;padding:0 0 56px}
  .arch-year:last-child{padding-bottom:0}
  .arch-marker{display:flex;align-items:center;gap:16px;margin-bottom:22px;flex-wrap:wrap}
  .arch-marker .dot{position:absolute;left:-40px;top:6px;width:16px;height:16px;border-radius:50%;background:var(--gold-3);box-shadow:0 0 0 4px rgba(215,180,106,.25),0 0 0 1px var(--cream-2)}
  .arch-marker .yr{font-family:var(--serif);font-weight:600;font-size:46px;line-height:.9;color:var(--gold-2)}
  .arch-marker .era{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--cream);background:var(--jadran);border:1px solid var(--jadran);padding:6px 12px}

  .arch-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
  .arch-card{margin:0;display:flex;flex-direction:column;background:var(--cream);border:1px solid var(--line);transition:transform .18s,border-color .18s,box-shadow .18s}
  .arch-card:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 10px 26px rgba(21,17,11,.12)}
  .arch-photo{position:relative;display:block;width:100%;padding:0;border:0;background:#d9d0bb;cursor:zoom-in;overflow:hidden;aspect-ratio:3/4}
  .arch-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;transition:transform .3s}
  .arch-card:hover .arch-photo img{transform:scale(1.04)}
  .arch-photo .zoom{position:absolute;top:10px;right:10px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:rgba(21,17,11,.6);color:var(--gold-3);font-size:15px;border:1px solid rgba(255,255,255,.25);opacity:0;transition:opacity .18s}
  .arch-card:hover .arch-photo .zoom{opacity:1}
  .arch-card figcaption{padding:14px 16px 18px;display:flex;flex-direction:column;gap:6px;border-top:2px solid var(--arch-red)}
  .arch-card figcaption .ttl{font-family:var(--serif);font-style:italic;font-size:18px;line-height:1.25;color:var(--ink)}
  .arch-card figcaption .src{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--ink-2);line-height:1.4}

  .archive-note{font-family:var(--mono);font-size:11px;line-height:1.7;color:var(--ink-2);border-left:2px solid var(--gold);padding:10px 0 10px 16px;margin:48px 0 0;max-width:820px}

  .archive-tables{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px}
  .arch-table{background:var(--cream);border:1px solid var(--line)}
  .arch-table h3{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2);margin:0;padding:18px 20px;border-bottom:1px solid var(--line)}
  .arch-table table{width:100%;border-collapse:collapse}
  .arch-table td{padding:10px 20px;font-size:14px;border-bottom:1px solid var(--line)}
  .arch-table tr:last-child td{border-bottom:0}
  .arch-table .se{font-family:var(--mono);font-size:12px;color:var(--ink-2);width:90px}
  .arch-table .wn{font-family:var(--serif);font-size:18px;color:var(--ink)}
  .arch-table tr.us{background:var(--cream-2)}
  .arch-table tr.us .wn{color:var(--gold-2);font-style:italic}

  /* LIGHTBOX (overlay ostaje taman radi kontrasta skena) */
  .lb{position:fixed;inset:0;z-index:1000;background:rgba(8,6,5,.92);display:flex;align-items:center;justify-content:center;padding:40px}
  .lb[hidden]{display:none}
  .lb-fig{margin:0;max-width:92vw;max-height:90vh;display:flex;flex-direction:column;align-items:center;gap:14px}
  .lb-img{max-width:92vw;max-height:78vh;object-fit:contain;border:1px solid rgba(215,180,106,.4);box-shadow:0 20px 60px rgba(0,0,0,.6);background:#fff}
  .lb-cap{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;max-width:680px}
  .lb-cap .lb-ttl{font-family:var(--serif);font-style:italic;font-size:22px;color:#fff}
  .lb-cap .lb-src{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:#cdbf9f}
  .lb-close,.lb-prev,.lb-next{position:fixed;background:rgba(20,15,12,.8);color:var(--gold-3);border:1px solid rgba(215,180,106,.4);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
  .lb-close:hover,.lb-prev:hover,.lb-next:hover{background:var(--gold);color:#fff7e3;border-color:var(--gold)}
  .lb-close{top:22px;right:26px;width:46px;height:46px;font-size:20px}
  .lb-prev,.lb-next{top:50%;transform:translateY(-50%);width:54px;height:72px;font-size:34px}
  .lb-prev{left:24px}
  .lb-next{right:24px}

  @media (max-width:860px){
    .archive{padding:60px 0}
    .archive .archive-head h2{font-size:38px}
    .archive-timeline{padding-left:30px}
    .arch-marker .yr{font-size:36px}
    .arch-marker .dot{left:-30px;width:13px;height:13px}
    .arch-cards{grid-template-columns:1fr}
    .archive-tables{grid-template-columns:1fr}
    .lb{padding:16px}
    .lb-prev,.lb-next{width:42px;height:56px;font-size:26px}
    .lb-prev{left:8px}
    .lb-next{right:8px}
    .lb-close{top:12px;right:12px;width:40px;height:40px}
  }