/* =====================================================================
   LEONIDIS BLOKOVI - globalni CSS biblioteke (PA Designer, dizajn/DESIGN.md)
   Izvor: /var/www/personalassistant/projects/leonidis/dizajn/assets/
   (base.css + blocks*.css, spojeno 29.09.2026). Učitava se na SVAKOJ strani
   (theme_files, tema Core) posle design-tokens override bloka.

   Pravila:
   - Brend je SAMO u Leonidis tokenima (design-tokens.css + design_tokens red);
     --at-* ispod su ALIASI tih tokena - ovde nema hex boja. Novi brend = izmena
     tokena u adminu (Main settings → Stilovi) ili tools/primeni-design.php.
   - Tamna tema i prekidač teme su uklonjeni (Ivan: bez dark/light).
   - Element resetovi i tipografija važe SAMO unutar biblioteke
     (.blk, .at-header, .at-menu, .at-footer) - stare komponente se ne menjaju.
   - Klase su prefiksovane .at-* (komponente) i .blk-* (blokovi, data-blok).
   ===================================================================== */

:root{
  /* --- Podloge --- */
  --at-bg:            rgb(var(--bg-main));
  --at-surface:       rgb(var(--bg-section));
  --at-surface-2:     rgb(var(--surface-strong));
  --at-panel:         rgb(var(--bg-footer));
  --at-panel-ink:     rgb(var(--text-on-dark));
  --at-panel-muted:   rgb(var(--text-on-dark-muted));
  /* --- Tekst --- */
  --at-ink:           rgb(var(--text-primary));
  --at-ink-2:         rgb(var(--text-body));
  --at-muted:         rgb(var(--text-muted));
  /* --- Linije --- */
  --at-line:          rgb(var(--hairline));
  --at-line-strong:   rgb(var(--hairline-strong));
  /* --- Akcent --- */
  --at-accent:        rgb(var(--accent));
  --at-accent-hover:  rgb(var(--accent-deep));
  --at-accent-ink:    rgb(var(--accent-foreground));
  --at-accent-soft:   rgb(var(--accent-soft));
  --at-accent-text:   rgb(var(--accent-text));
  --at-accent-on-panel: rgb(var(--accent-on-dark));
  /* --- Statusi --- */
  --at-success: rgb(var(--success)); --at-success-soft: rgb(var(--success-soft));
  --at-warning: rgb(var(--warning)); --at-warning-soft: rgb(var(--warning-soft));
  --at-danger:  rgb(var(--error));   --at-danger-soft:  rgb(var(--error-soft));
  --at-sale:    rgb(var(--error));   --at-sale-soft:    rgb(var(--error-soft));
  /* --- Overlay / fokus --- */
  --at-overlay:       rgb(var(--text-primary) / .52);
  --at-focus:         var(--at-accent);
  --at-selection-bg:  var(--at-ink); --at-selection-ink: var(--at-bg);
  --at-img-filter:    none;

  /* --- Tipografija --- */
  --at-font-display: var(--font-heading);
  --at-font-body:    var(--font-body);
  --at-display-weight: var(--type-display-weight); --at-display-tracking: var(--type-display-ls); --at-display-lh: var(--type-display-lh);
  --at-body-weight: 400; --at-body-lh: var(--body-lh);
  --at-prose-max: var(--measure);
  --at-fs-display: var(--type-display-size);
  --at-fs-h1: var(--font-size-h1);
  --at-fs-h2: var(--font-size-h2);
  --at-fs-h3: var(--font-size-h3);
  --at-fs-h4: var(--font-size-h4);
  --at-fs-h5: 1.0625rem;
  --at-fs-h6: .9375rem;
  --at-fs-lead:  var(--type-lead-size);
  --at-fs-body:  var(--body-md-size);
  --at-fs-small: var(--type-small-size);
  --at-fs-micro: var(--type-micro-size);
  --at-fs-price: 1.375rem;
  --at-fs-num:   clamp(1.75rem, 1.5rem + 1vw, 2.5rem);
  --at-fs-stat:  clamp(3rem, 2rem + 4vw, 6rem);
  --at-fs-nav-mobile: clamp(2.25rem, 1.4rem + 5vw, 3.5rem);
  --at-lh-h2: var(--h2-lh); --at-lh-h3: var(--h3-lh); --at-lh-h4: var(--h4-lh); --at-lh-lead: var(--type-lead-lh);

  /* --- Razmaci --- */
  --at-s-1: var(--space-1); --at-s-2: var(--space-2); --at-s-3: var(--space-3); --at-s-4: var(--space-4); --at-s-5: var(--space-5);
  --at-s-6: var(--space-6); --at-s-7: var(--space-7); --at-s-8: var(--space-8); --at-s-9: var(--space-9); --at-s-10: var(--space-10);
  --at-section:    var(--section-py);
  --at-section-md: var(--section-py-md);
  --at-section-sm: var(--section-py-snug);
  --at-head-gap:   var(--head-gap);
  --at-gap:        var(--grid-gap);
  --at-gutter:     var(--gutter);

  /* --- Radius (uloge iz admina: polje / kartica / dugme) --- */
  --at-radius-sm:   var(--radius-input);
  --at-radius-md:   var(--radius-card);
  --at-radius-lg:   var(--radius-lg);
  --at-radius-pill: var(--radius-pill);
  --at-radius-btn:  var(--radius-button);

  /* --- Senke --- */
  --at-shadow-xs: var(--shadow-xs);
  --at-shadow-sm: var(--shadow-sm);
  --at-shadow-md: var(--shadow-md);
  --at-shadow-lg: var(--shadow-lg);

  /* --- Z-index (strukturne konstante, nisu brend) --- */
  --at-z-header:100; --at-z-filterbar:150; --at-z-dropdown:200; --at-z-sticky-buy:180;
  --at-z-drawer:400; --at-z-modal:500; --at-z-lightbox:550; --at-z-toast:600;

  /* --- Motion --- */
  --at-d-fast: var(--duration-fast); --at-d-base: var(--duration-base); --at-d-slow: var(--duration-slow);
  --at-d-reveal: var(--animation-duration); --at-d-page: 520ms;
  --at-ease-out:    var(--ease-out);
  --at-ease-in-out: var(--ease-in-out);
  --at-ease-in:     var(--ease-in);
  --at-ease-spring: cubic-bezier(.34,1.4,.64,1);

  /* --- Ostalo (strukturne konstante) --- */
  --at-header-h: 88px; --at-header-h-stuck: 68px;
  --at-logo-h: 40px;   --at-logo-h-stuck: 34px;
  --at-btn-h-sm:40px; --at-btn-h:48px; --at-btn-h-lg:56px; --at-input-h:52px;
  --at-ring: var(--shadow-focus);
  --at-img-ratio-card: 4/5; --at-img-ratio-wide: 16/9; --at-img-ratio-hero: 21/9; --at-img-ratio-post: 3/2;
  --at-container: var(--container-max); --at-container-narrow: 760px; --at-container-wide: 1600px;
}
@media (max-width: 63.99em){
  :root{ --at-header-h:68px; --at-header-h-stuck:60px; --at-logo-h:34px; --at-logo-h-stuck:30px; }
}

/* ===== izvor: dizajn/assets/base.css (element pravila ograničena na biblioteku) ===== */

/* ---------- Reset (samo biblioteka) ---------- */
:where(.blk, .at-header, .at-menu, .at-footer, .at-skip), :where(.blk, .at-header, .at-menu, .at-footer) :where(*, *::before, *::after){ box-sizing:border-box; }
html:has(.at-header, .blk){ -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-padding-top:calc(var(--at-header-h-stuck) + 16px); }
body:has(.at-header, .blk){ margin:0; background:var(--at-bg); color:var(--at-ink-2); font:var(--at-body-weight) var(--at-fs-body)/var(--at-body-lh) var(--at-font-body); -webkit-font-smoothing:antialiased; overflow-x:clip; }
body:has(.at-header, .blk) > .min-h-screen{ background:var(--at-bg); }
/* layout omotač (layouts/app) ne sme da ograniči sticky header - header ostaje vidljiv i iznad footera */
body:has(.at-header) > .min-h-screen{ display:contents; }
@media (max-width:39.99em){ html:has(.at-header, .blk){ font-size:15px; } }
:where(.blk, .at-header, .at-menu, .at-footer) :is(img, svg, video){ display:block; max-width:100%; }
:where(.blk, .at-header, .at-menu, .at-footer) :is(img){ height:auto; filter:var(--at-img-filter); }
:where(.blk, .at-header, .at-menu, .at-footer, .at-skip) :is(a), :where(.at-skip){ color:inherit; text-decoration:none; }
:where(.blk, .at-header, .at-menu, .at-footer) :is(button, input, select, textarea){ font:inherit; color:inherit; }
:where(.blk, .at-header, .at-menu, .at-footer) :is(button){ cursor:pointer; background:none; border:0; padding:0; }
:where(.blk, .at-header, .at-menu, .at-footer) :is(ul, ol){ margin:0; padding:0; list-style:none; }
:where(.blk, .at-header, .at-menu, .at-footer) :is(h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd){ margin:0; }
:where(.blk, .at-header, .at-menu, .at-footer) ::selection{ background:var(--at-selection-bg); color:var(--at-selection-ink); }
[hidden]{ display:none !important; }

/* ---------- Tipografija (samo biblioteka; DesignTokensService h1-h4 pravila je ne diraju) ---------- */
:where(.blk, .at-header, .at-menu, .at-footer) :is(h1, h2, h3, h4, h5, h6), .at-display, .at-h1, .at-h2, .at-h3, .at-h4{ font-family:var(--at-font-display); font-weight:var(--at-display-weight); letter-spacing:var(--at-display-tracking); color:var(--at-ink); text-wrap:balance; }
.at-display{ font-size:var(--at-fs-display); line-height:var(--at-display-lh); }
:where(.blk, .at-header, .at-menu, .at-footer) h1, .at-h1{ font-size:var(--at-fs-h1); line-height:var(--at-display-lh); }
:where(.blk, .at-header, .at-menu, .at-footer) h2, .at-h2{ font-size:var(--at-fs-h2); line-height:var(--at-lh-h2); }
:where(.blk, .at-header, .at-menu, .at-footer) h3, .at-h3{ font-size:var(--at-fs-h3); line-height:var(--at-lh-h3); }
:where(.blk, .at-header, .at-menu, .at-footer) h4, .at-h4{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); letter-spacing:-.01em; }
:where(.blk, .at-header, .at-menu, .at-footer) p{ text-wrap:pretty; }
.at-lead{ font-size:var(--at-fs-lead); line-height:var(--at-lh-lead); color:var(--at-ink-2); max-width:52ch; }
.at-small{ font-size:var(--at-fs-small); }
.at-eyebrow{ display:inline-flex; align-items:center; gap:10px; font:600 var(--at-fs-micro)/1.2 var(--at-font-body); text-transform:uppercase; letter-spacing:.1em; color:var(--at-muted); }
.at-eyebrow::before{ content:""; width:18px; height:2px; background:var(--at-accent-text); }
.at-num{ font-variant-numeric:tabular-nums; }
.at-prose{ max-width:var(--at-prose-max); font-size:1.0625rem; line-height:1.7; }
.at-prose > * + *{ margin-top:1.1em; }
.at-prose h2{ font-size:var(--at-fs-h3); margin-top:2em; }
.at-prose h3{ font-size:var(--at-fs-h4); margin-top:1.8em; }
.at-prose a{ color:var(--at-accent-text); text-decoration:underline; text-underline-offset:3px; }
.at-prose ul{ list-style:disc; padding-left:1.2em; }
.at-prose ol{ list-style:decimal; padding-left:1.2em; }
.at-prose blockquote{ border-left:2px solid var(--at-accent-text); padding-left:var(--at-s-5); font:400 var(--at-fs-h4)/1.45 var(--at-font-display); color:var(--at-ink); }
.at-prose figure img{ border-radius:var(--at-radius-md); }
.at-prose figcaption{ font-size:var(--at-fs-small); color:var(--at-muted); margin-top:8px; }
.at-prose .at-table{ overflow-x:auto; }
.at-prose table{ width:100%; border-collapse:collapse; font-size:var(--at-fs-small); }
.at-prose th,.at-prose td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--at-line); }

/* ---------- Kontejneri i mreža ---------- */
.at-container{ width:min(100% - 2*var(--at-gutter), var(--at-container)); margin-inline:auto; }
.at-container--narrow{ width:min(100% - 2*var(--at-gutter), var(--at-container-narrow)); }
.at-container--wide{ width:min(100% - 2*var(--at-gutter), var(--at-container-wide)); }
.at-grid{ display:grid; gap:var(--at-gap); grid-template-columns:repeat(12,minmax(0,1fr)); }

/* ---------- Sekcija i podloge (tokeni se lokalno premapiraju) ---------- */
.blk{ position:relative; padding-block:var(--at-section); background:var(--at-bg); color:var(--at-ink-2); }
.blk[data-spacing=compact]{ padding-block:var(--at-section-sm); }
.blk[data-bg=surface-2]{ background:var(--at-surface-2); }
.blk[data-bg=bg] + .blk[data-bg=bg],
.waap_component_wrapper:has(> .blk[data-bg=bg]:last-child) + .waap_component_wrapper > .blk[data-bg=bg]:first-child{ border-top:1px solid var(--at-line); } /* Leonidis: svaka komponenta je u .waap_component_wrapper */
.blk address{ font-style:normal; }
[data-bg=panel]{
  --at-ink:var(--at-panel-ink);
  --at-ink-2:color-mix(in srgb, var(--at-panel-ink) 80%, var(--at-panel));
  --at-muted:var(--at-panel-muted);
  --at-line:color-mix(in srgb, var(--at-panel-ink) 14%, var(--at-panel));
  --at-line-strong:color-mix(in srgb, var(--at-panel-ink) 42%, var(--at-panel));
  --at-surface:color-mix(in srgb, var(--at-panel-ink) 6%, var(--at-panel));
  --at-surface-2:color-mix(in srgb, var(--at-panel-ink) 4%, var(--at-panel));
  --at-accent-text:var(--at-accent-on-panel);
  --at-focus:var(--at-panel-ink);
  --at-selection-bg:var(--at-panel-ink); --at-selection-ink:var(--at-panel);
  background:var(--at-panel); color:var(--at-ink-2);
}
[data-bg=accent]{
  --at-ink:var(--at-accent-ink);
  --at-ink-2:color-mix(in srgb, var(--at-accent-ink) 88%, var(--at-accent));
  --at-muted:color-mix(in srgb, var(--at-accent-ink) 78%, var(--at-accent));
  --at-line:color-mix(in srgb, var(--at-accent-ink) 28%, var(--at-accent));
  --at-accent-text:var(--at-accent-ink);
  --at-focus:var(--at-accent-ink);
  background:var(--at-accent); color:var(--at-ink-2);
}
/* primarno dugme na akcentnoj podlozi = panel boje */
[data-bg=accent] .at-btn--primary{ --at-accent:var(--at-panel); --at-accent-hover:color-mix(in srgb, var(--at-panel) 82%, var(--at-panel-ink)); --at-accent-ink:var(--at-panel-ink); }

/* Zaglavlje sekcije: eyebrow -12- naslov -16- uvod -head-gap- sadržaj */
.at-section__head{ display:grid; gap:12px; margin-bottom:var(--at-head-gap); max-width:60ch; }
.at-section__head .at-lead{ margin-top:4px; }
.at-section__head--row{ max-width:none; grid-template-columns:1fr auto; align-items:end; gap:16px 32px; }
.at-section__head--row > :first-child{ display:grid; gap:12px; max-width:60ch; }
@media (max-width:47.99em){ .at-section__head--row{ grid-template-columns:1fr; } }

/* ---------- Dugmad ---------- */
.at-btn{
  --_h:var(--at-btn-h);
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  height:var(--_h); padding:0 26px; border-radius:var(--at-radius-btn); border:1.5px solid transparent;
  font:600 .9375rem/1 var(--at-font-body); letter-spacing:.005em; white-space:nowrap; overflow:hidden; isolation:isolate;
  transition:background-color var(--at-d-base) var(--at-ease-out), color var(--at-d-base) var(--at-ease-out), border-color var(--at-d-base) var(--at-ease-out), transform var(--at-d-base) var(--at-ease-out), box-shadow var(--at-d-base) var(--at-ease-out);
}
.at-btn--sm{ --_h:var(--at-btn-h-sm); padding:0 20px; font-size:.875rem; }
.at-btn--lg{ --_h:var(--at-btn-h-lg); padding:0 32px; font-size:1rem; }
.at-btn--block{ width:100%; }
/* tekst se "kotrlja" na hover: vidljiv span + kopija iz data-t */
.at-btn__t{ position:relative; display:block; overflow:hidden; line-height:1.3; }
.at-btn__t > span{ display:block; transition:transform var(--at-d-slow) var(--at-ease-out); }
.at-btn__t::after{ content:attr(data-t) / ""; position:absolute; left:0; top:100%; width:100%; transition:transform var(--at-d-slow) var(--at-ease-out); }
.at-btn:hover .at-btn__t > span,.at-btn:hover .at-btn__t::after{ transform:translateY(-100%); }
.at-btn__i{ width:18px; height:18px; flex:none; transition:transform var(--at-d-slow) var(--at-ease-out); }
.at-btn:hover .at-btn__i{ transform:translateX(3px); }

.at-btn--primary{ background:var(--at-accent); color:var(--at-accent-ink); }
.at-btn--primary:hover{ background:var(--at-accent-hover); transform:translateY(-2px); box-shadow:var(--at-shadow-sm); }
.at-btn--secondary{ border-color:var(--at-ink); color:var(--at-ink); }
.at-btn--secondary:hover{ background:var(--at-ink); color:var(--at-bg); transform:translateY(-2px); }
[data-bg=panel] .at-btn--secondary:hover{ color:var(--at-panel); }
[data-bg=accent] .at-btn--secondary:hover{ color:var(--at-accent); }
.at-btn--panel{ background:var(--at-panel-ink); color:var(--at-panel); }
.at-btn--panel:hover{ background:color-mix(in srgb, var(--at-panel-ink) 86%, var(--at-accent)); transform:translateY(-2px); }
.at-btn:active{ transform:translateY(0); box-shadow:none; }
.at-btn[disabled],.at-btn[aria-disabled=true]{ opacity:.5; pointer-events:none; }
.at-btn.is-loading{ color:transparent; pointer-events:none; }
.at-btn.is-loading::before{ content:""; position:absolute; width:18px; height:18px; border-radius:50%; border:2px solid var(--at-accent-ink); border-right-color:transparent; animation:at-spin .7s linear infinite; }
@keyframes at-spin{ to{ transform:rotate(360deg); } }

/* Tekst link sa strelicom (nivo 3) */
.at-link{ display:inline-flex; align-items:center; gap:8px; font-weight:600; color:var(--at-ink); padding-block:6px; background:linear-gradient(currentColor,currentColor) left bottom/0% 1.5px no-repeat; transition:background-size var(--at-d-slow) var(--at-ease-out), color var(--at-d-base); }
.at-link svg{ width:18px; height:18px; transition:transform var(--at-d-slow) var(--at-ease-out); }
.at-link:hover{ background-size:100% 1.5px; color:var(--at-accent-text); }
.at-link:hover svg{ transform:translateX(5px); }

/* Ikonsko dugme */
.at-icon-btn{ display:inline-grid; place-items:center; width:44px; height:44px; border-radius:50%; color:var(--at-ink); transition:background-color var(--at-d-base); }
.at-icon-btn:hover{ background:color-mix(in srgb, var(--at-ink) 8%, transparent); }
.at-icon-btn svg{ width:20px; height:20px; }

/* ---------- Forme ---------- */
.at-form{ display:grid; gap:var(--at-s-5); }
.at-form__row{ display:grid; gap:var(--at-s-5); grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.at-field{ display:grid; gap:8px; }
.at-field label,.at-field__label{ font:600 var(--at-fs-small)/1.3 var(--at-font-body); color:var(--at-ink); }
.at-field input,.at-field select,.at-field textarea{
  width:100%; min-height:var(--at-input-h); padding:0 16px; border:1px solid var(--at-line-strong); border-radius:var(--at-radius-sm);
  background:var(--at-surface); color:var(--at-ink); transition:border-color var(--at-d-fast), box-shadow var(--at-d-fast);
}
.at-field textarea{ padding:14px 16px; min-height:140px; resize:vertical; line-height:1.5; }
.at-field input::placeholder,.at-field textarea::placeholder{ color:var(--at-muted); }
.at-field input:hover,.at-field textarea:hover,.at-field select:hover{ border-color:var(--at-ink); }
.at-field input:focus,.at-field textarea:focus,.at-field select:focus{ outline:none; border-color:var(--at-accent-text); box-shadow:var(--at-ring); }
.at-field.is-invalid input,.at-field.is-invalid textarea{ border-color:var(--at-danger); }
.at-field__error{ display:none; font-size:var(--at-fs-small); color:var(--at-danger); }
.at-field.is-invalid .at-field__error{ display:block; }
.at-check{ display:flex; gap:12px; align-items:flex-start; font-size:var(--at-fs-small); line-height:1.5; }
.at-check input{ appearance:none; flex:none; width:20px; height:20px; margin:1px 0 0; border:1.5px solid var(--at-line-strong); border-radius:var(--at-radius-sm); background:var(--at-surface); display:grid; place-content:center; cursor:pointer; }
.at-check input:checked{ background:var(--at-accent); border-color:var(--at-accent); }
.at-check input:checked::after{ content:""; width:10px; height:6px; border:2px solid var(--at-accent-ink); border-top:0; border-right:0; transform:rotate(-45deg) translate(1px,-1px); }
.at-check a{ text-decoration:underline; text-underline-offset:3px; }
.at-check.is-invalid input{ border-color:var(--at-danger); }
.at-form__success{ display:grid; gap:12px; padding:var(--at-s-6); border-radius:var(--at-radius-md); background:var(--at-success-soft); color:var(--at-ink); }
.at-form__success strong{ font:var(--at-display-weight) var(--at-fs-h4)/1.3 var(--at-font-display); color:var(--at-ink); }

/* ---------- Kartica članka (deli se: naslovna, blog lista, povezani) ---------- */
.at-post-card{ position:relative; display:grid; gap:16px; align-content:start; }
.at-post-card__media{ aspect-ratio:var(--at-img-ratio-post); overflow:hidden; border-radius:var(--at-radius-md); background:var(--at-surface-2); }
.at-post-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform var(--at-d-reveal) var(--at-ease-out); }
.at-post-card:hover .at-post-card__media img{ transform:scale(1.04); }
.at-post-card__meta{ display:flex; gap:12px; align-items:center; font-size:var(--at-fs-small); color:var(--at-muted); }
.at-post-card__cat{ font-weight:600; color:var(--at-accent-text); }
.at-post-card__title{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
.at-post-card__title a::after{ content:""; position:absolute; inset:0; }
.at-post-card__title a{ background:linear-gradient(currentColor,currentColor) left 100%/0% 1.5px no-repeat; transition:background-size var(--at-d-slow) var(--at-ease-out); }
.at-post-card:hover .at-post-card__title a{ background-size:100% 1.5px; }
.at-post-card__excerpt{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; color:var(--at-ink-2); }

/* Breadcrumb */
.at-breadcrumb ol{ display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; font-size:var(--at-fs-small); color:var(--at-muted); }
.at-breadcrumb li{ display:inline-flex; align-items:center; gap:10px; }
.at-breadcrumb li + li::before{ content:""; width:6px; height:6px; border-top:1.5px solid currentColor; border-right:1.5px solid currentColor; transform:rotate(45deg); }
.at-breadcrumb a:hover{ color:var(--at-ink); }
.at-breadcrumb [aria-current]{ color:var(--at-ink); }

/* ---------- Logo ---------- */
.at-logo{ display:inline-flex; align-items:center; gap:12px; height:var(--at-logo-h); color:var(--at-ink); transition:height var(--at-d-slow) var(--at-ease-out); }
.at-logo__mark{ height:100%; width:auto; aspect-ratio:1; flex:none; }
.at-logo__word{ font:700 calc(var(--at-logo-h) * .62)/1 var(--at-font-display); letter-spacing:-.02em; }

/* ---------- Header ---------- */
.at-skip{ position:fixed; left:16px; top:-80px; z-index:calc(var(--at-z-toast) + 1); padding:12px 18px; border-radius:var(--at-radius-md); background:var(--at-ink); color:var(--at-bg); font-weight:600; transition:top var(--at-d-base); }
.at-skip:focus{ top:16px; }

.at-header{ position:sticky; top:0; z-index:var(--at-z-header); background:var(--at-bg); border-bottom:1px solid transparent; transition:background-color var(--at-d-slow) var(--at-ease-out), border-color var(--at-d-slow); animation:at-header-in var(--at-d-slow) var(--at-ease-out) both; }
@keyframes at-header-in{ from{ opacity:0; transform:translateY(-8px); } }
.at-header.is-stuck{ background:color-mix(in srgb, var(--at-bg) 88%, transparent); backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2); border-bottom-color:var(--at-line); }
.at-header.is-stuck .at-logo{ height:var(--at-logo-h-stuck); }
.at-header__bar{ display:flex; align-items:center; gap:clamp(16px, 3vw, 48px); height:var(--at-header-h); transition:height var(--at-d-slow) var(--at-ease-out); }
.at-header.is-stuck .at-header__bar{ height:var(--at-header-h-stuck); }
.at-header__logo{ flex:none; border-radius:var(--at-radius-sm); }
.at-header__actions{ display:flex; align-items:center; gap:12px; margin-left:auto; }

.at-nav__list{ display:flex; align-items:center; gap:4px; }
.at-nav__item{ position:relative; display:flex; align-items:center; }
.at-nav__link{ position:relative; display:inline-flex; align-items:center; height:44px; padding:0 14px; font-weight:500; font-size:.975rem; color:var(--at-ink); }
.at-nav__link::after{ content:""; position:absolute; left:14px; right:14px; bottom:8px; height:1.5px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform var(--at-d-slow) var(--at-ease-out); }
.at-nav__link:hover::after,.at-nav__link[aria-current=page]::after{ transform:scaleX(1); transform-origin:left; }
.has-sub > .at-nav__link{ padding-right:4px; }
.has-sub > .at-nav__link::after{ right:4px; }
.at-nav__toggle{ display:grid; place-items:center; width:28px; height:44px; color:var(--at-ink); }
.at-nav__toggle svg{ width:14px; height:14px; transition:transform var(--at-d-base) var(--at-ease-out); }
.at-nav__toggle[aria-expanded=true] svg{ transform:rotate(180deg); }

/* Podmeni (desktop) */
.at-sub{ position:absolute; top:calc(100% + 10px); left:-24px; z-index:var(--at-z-dropdown); width:min(720px, 80vw); display:grid; grid-template-columns:1.25fr 1fr; gap:8px; padding:8px; border-radius:var(--at-radius-lg); background:var(--at-surface); border:1px solid var(--at-line); box-shadow:var(--at-shadow-md);
  opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity var(--at-d-base) var(--at-ease-out), transform var(--at-d-base) var(--at-ease-out), visibility 0s linear var(--at-d-base); }
.at-sub::before{ content:""; position:absolute; left:0; right:0; top:-12px; height:12px; }
.has-sub.is-open .at-sub{ opacity:1; visibility:visible; transform:none; transition-delay:0s; }
.at-sub__list{ display:grid; padding:8px; }
.at-sub__link{ display:grid; grid-template-columns:28px 1fr; gap:2px 12px; padding:12px; border-radius:var(--at-radius-md); transition:background-color var(--at-d-fast); }
.at-sub__link:hover,.at-sub__link:focus-visible{ background:var(--at-surface-2); }
.at-sub__n{ grid-row:span 2; font:600 var(--at-fs-small)/1.6 var(--at-font-display); color:var(--at-accent-text); font-variant-numeric:tabular-nums; }
.at-sub__t{ font-weight:600; color:var(--at-ink); }
.at-sub__d{ font-size:var(--at-fs-small); color:var(--at-muted); line-height:1.45; }
.at-sub__feature{ position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-height:260px; padding:20px; border-radius:var(--at-radius-md); overflow:hidden; color:var(--at-panel-ink); background:var(--at-panel); }
.at-sub__feature img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.6; transition:transform var(--at-d-reveal) var(--at-ease-out); }
.at-sub__feature:hover img{ transform:scale(1.05); }
.at-sub__feature span{ position:relative; font:var(--at-display-weight) var(--at-fs-h4)/1.25 var(--at-font-display); }
.at-sub__feature small{ position:relative; font-size:var(--at-fs-small); opacity:.85; margin-top:4px; }

/* Jezik (segment) */
.at-lang{ display:inline-flex; padding:3px; border-radius:var(--at-radius-pill); border:1px solid var(--at-line); }
.at-lang a{ display:grid; place-items:center; min-width:36px; height:30px; padding:0 8px; border-radius:var(--at-radius-pill); font:600 .8125rem/1 var(--at-font-body); letter-spacing:.04em; color:var(--at-muted); transition:background-color var(--at-d-base), color var(--at-d-base); }
.at-lang a:hover{ color:var(--at-ink); }
.at-lang a[aria-current=true]{ background:var(--at-ink); color:var(--at-bg); }
[data-bg=panel] .at-lang a[aria-current=true]{ color:var(--at-panel); }

/* Hamburger → X */
.at-burger{ display:none; position:relative; width:48px; height:48px; border-radius:50%; background:var(--at-ink); color:var(--at-bg); transition:background-color var(--at-d-base), transform var(--at-d-base) var(--at-ease-out); }
.at-burger:active{ transform:scale(.94); }
.at-burger span{ position:absolute; left:14px; width:20px; height:2px; border-radius:2px; background:currentColor; transition:transform var(--at-d-slow) var(--at-ease-out), width var(--at-d-slow) var(--at-ease-out), top var(--at-d-slow) var(--at-ease-out); }
.at-burger span:nth-child(1){ top:19px; }
.at-burger span:nth-child(2){ top:27px; width:13px; }
.at-burger:hover span:nth-child(2){ width:20px; }
.at-burger[aria-expanded=true] span:nth-child(1){ top:23px; transform:rotate(45deg); }
.at-burger[aria-expanded=true] span:nth-child(2){ top:23px; width:20px; transform:rotate(-45deg); }

/* Mobilni: jezik ostaje u traci (kompaktan), nav i CTA idu u meni; dugačak naziv se skraćuje */
.at-header__logo{ min-width:0; flex:0 1 auto; }
.at-header__logo .at-logo{ max-width:100%; }
.at-logo__word{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding-block:.12em; }
@media (max-width:63.99em){
  .at-nav,.at-header__cta{ display:none; }
  .at-burger{ display:inline-block; flex:none; }
  .at-header__actions{ gap:8px; flex:none; }
  .at-header__actions .at-lang a{ min-width:30px; height:28px; padding:0 6px; font-size:.75rem; }
}

/* ---------- Mobilni meni (full-screen) ---------- */
.at-menu{
  position:fixed; inset:0; z-index:var(--at-z-drawer); display:flex; flex-direction:column;
  padding:calc(var(--at-header-h) + 16px) var(--at-gutter) max(24px, env(safe-area-inset-bottom));
  overflow-y:auto; overscroll-behavior:contain;
  clip-path:inset(0 0 100% 0); visibility:hidden;
  transition:clip-path 560ms var(--at-ease-in-out), visibility 0s linear 560ms;
}
.at-menu.is-open{ clip-path:inset(0 0 0 0); visibility:visible; transition:clip-path 640ms var(--at-ease-out), visibility 0s; }
.is-menu-open{ overflow:hidden; }
.is-menu-open .at-header{ z-index:calc(var(--at-z-drawer) + 1); background:transparent; border-bottom-color:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; }
.is-menu-open .at-header .at-logo{ color:var(--at-panel-ink); }
.is-menu-open .at-burger{ background:var(--at-panel-ink); color:var(--at-panel); }
.is-menu-open .at-header .at-lang{ border-color:color-mix(in srgb, var(--at-panel-ink) 24%, transparent); }
.is-menu-open .at-header .at-lang a{ color:var(--at-panel-muted); }
.is-menu-open .at-header .at-lang a[aria-current=true]{ background:var(--at-panel-ink); color:var(--at-panel); }
.at-menu__list{ display:grid; gap:2px; counter-reset:m; }
.at-menu__item{ overflow:hidden; border-bottom:1px solid var(--at-line); }
.at-menu__row{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.at-menu__link{ display:flex; align-items:baseline; gap:14px; padding:12px 0; font:var(--at-display-weight) var(--at-fs-nav-mobile)/1.08 var(--at-font-display); letter-spacing:var(--at-display-tracking); color:var(--at-ink); transform:translateY(105%); transition:transform 700ms var(--at-ease-out), color var(--at-d-base); transition-delay:calc(120ms + var(--i,0) * 60ms); }
.at-menu__link::before{ counter-increment:m; content:"0" counter(m); font:500 var(--at-fs-small)/1 var(--at-font-body); color:var(--at-muted); letter-spacing:0; transform:translateY(-.9em); }
.at-menu__link:hover,.at-menu__link[aria-current=page]{ color:var(--at-accent-text); }
.at-menu.is-open .at-menu__link{ transform:none; }
.at-menu__sub-btn{ display:grid; place-items:center; width:48px; height:48px; flex:none; border:1px solid var(--at-line); border-radius:50%; color:var(--at-ink); opacity:0; transition:opacity 400ms var(--at-ease-out) 400ms, background-color var(--at-d-base); }
.at-menu.is-open .at-menu__sub-btn{ opacity:1; }
.at-menu__sub-btn svg{ width:16px; height:16px; transition:transform var(--at-d-slow) var(--at-ease-out); }
.at-menu__sub-btn[aria-expanded=true] svg{ transform:rotate(45deg); }
.at-menu__sub{ display:grid; grid-template-rows:0fr; transition:grid-template-rows var(--at-d-slow) var(--at-ease-out); }
.at-menu__sub > ul{ overflow:hidden; }
.at-menu__sub.is-open{ grid-template-rows:1fr; }
.at-menu__sub a{ display:block; padding:10px 0 10px 38px; font-size:1.0625rem; color:var(--at-ink-2); }
.at-menu__sub li:last-child a{ padding-bottom:20px; }
.at-menu__sub a:hover{ color:var(--at-ink); }
.at-menu__foot{ display:grid; gap:20px; margin-top:auto; padding-top:32px; opacity:0; transform:translateY(16px); transition:opacity 500ms var(--at-ease-out), transform 500ms var(--at-ease-out); }
.at-menu.is-open .at-menu__foot{ opacity:1; transform:none; transition-delay:480ms; }
.at-menu__contact{ display:grid; gap:4px; font-size:1.0625rem; }
.at-menu__contact a{ color:var(--at-ink); font-weight:500; }
.at-menu__meta{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
@media (min-width:64em){ .at-menu{ display:none; } }

/* ---------- Društvene mreže ---------- */
.at-social{ display:flex; gap:8px; flex-wrap:wrap; }
.at-social a{ display:grid; place-items:center; width:44px; height:44px; border-radius:50%; border:1px solid var(--at-line); color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base), border-color var(--at-d-base), transform var(--at-d-base) var(--at-ease-out); }
.at-social a:hover{ background:var(--at-ink); color:var(--at-bg); border-color:var(--at-ink); transform:translateY(-2px); }
[data-bg=panel] .at-social a:hover{ color:var(--at-panel); }
.at-social svg{ width:18px; height:18px; }

/* ---------- Footer ---------- */
.at-footer{ position:relative; overflow:hidden; padding-top:var(--at-section-md); }
.at-footer__top{ display:grid; gap:var(--at-s-7); grid-template-columns:repeat(12,minmax(0,1fr)); padding-bottom:var(--at-s-8); }
.at-footer__brand{ grid-column:span 4; display:grid; gap:20px; align-content:start; }
.at-footer__brand p{ max-width:38ch; }
.at-footer__mail{ font:var(--at-display-weight) var(--at-fs-h3)/1.2 var(--at-font-display); color:var(--at-ink); letter-spacing:var(--at-display-tracking); width:fit-content; background:linear-gradient(currentColor,currentColor) left 100%/100% 1.5px no-repeat; transition:background-size var(--at-d-slow) var(--at-ease-out), color var(--at-d-base); }
.at-footer__mail:hover{ color:var(--at-accent-text); background-size:0% 1.5px; }
.at-footer__cols{ grid-column:6 / -1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--at-gap); }
.at-fcol__h{ font:600 var(--at-fs-micro)/1.2 var(--at-font-body); text-transform:uppercase; letter-spacing:.1em; color:var(--at-muted); }
.at-fcol__btn{ display:flex; align-items:center; justify-content:space-between; width:100%; min-height:44px; text-align:left; font:inherit; color:inherit; letter-spacing:inherit; text-transform:inherit; cursor:default; }
.at-fcol__ico{ display:none; position:relative; width:14px; height:14px; }
.at-fcol__ico::before,.at-fcol__ico::after{ content:""; position:absolute; left:0; top:6px; width:14px; height:2px; background:currentColor; transition:transform var(--at-d-slow) var(--at-ease-out); }
.at-fcol__ico::after{ transform:rotate(90deg); }
.at-fcol__btn[aria-expanded=true] .at-fcol__ico::after{ transform:rotate(0); }
.at-fcol__panel{ display:grid; grid-template-rows:1fr; transition:grid-template-rows var(--at-d-slow) var(--at-ease-out); }
.at-fcol__panel > div{ overflow:hidden; }
.at-fcol__panel ul{ display:grid; gap:10px; padding-top:8px; }
.at-fcol__panel a{ color:var(--at-ink-2); transition:color var(--at-d-base); }
.at-fcol__panel a:hover{ color:var(--at-ink); }
.at-fcol__panel address{ font-style:normal; display:grid; gap:10px; padding-top:8px; }
.at-footer__mark{ font:700 clamp(4rem, 2rem + 16vw, 20rem)/.8 var(--at-font-display); letter-spacing:-.04em; color:color-mix(in srgb, var(--at-panel-ink) 7%, var(--at-panel)); white-space:nowrap; user-select:none; text-align:center; height:.56em; overflow:hidden; }
.at-footer__legal{ position:relative; display:flex; flex-wrap:wrap; gap:12px 24px; justify-content:space-between; align-items:center; padding:24px 0 clamp(24px, 3vw, 48px); border-top:1px solid var(--at-line); font-size:var(--at-fs-small); color:var(--at-muted); }
.at-footer__legal ul{ display:flex; flex-wrap:wrap; gap:8px 20px; }
/* + LX: mapa u footeru se učitava tek na klik (Main settings contact_google_map_url) */
.at-footer__map-btn{ display:inline-flex; align-items:center; gap:8px; width:fit-content; color:var(--at-ink); font-weight:600; transition:color var(--at-d-base); }
.at-footer__map-btn:hover{ color:var(--at-accent-text); }
.at-footer__map-btn svg{ width:18px; height:18px; }
.at-footer__map{ position:relative; aspect-ratio:4/3; border-radius:var(--at-radius-md); overflow:hidden; background:var(--at-surface); }
.at-footer__map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
/* + LX: podmeni bez istaknute kartice (samo lista stavki iz CMS-a) */
.at-sub--list{ grid-template-columns:1fr; width:min(420px, 80vw); }
.at-footer__legal a:hover{ color:var(--at-ink); }
@media (max-width:63.99em){
  .at-footer__brand{ grid-column:1 / -1; }
  .at-footer__cols{ grid-column:1 / -1; }
}
@media (max-width:47.99em){
  .at-footer__top{ gap:var(--at-s-6); }
  .at-footer__cols{ grid-template-columns:1fr; gap:0; border-top:1px solid var(--at-line); }
  .at-fcol{ border-bottom:1px solid var(--at-line); }
  .at-fcol__btn{ min-height:56px; cursor:pointer; }
  .at-fcol__ico{ display:block; }
  .at-fcol__panel{ grid-template-rows:0fr; }
  .at-fcol.is-open .at-fcol__panel{ grid-template-rows:1fr; }
  .at-fcol__panel ul,.at-fcol__panel address{ padding-bottom:20px; }
}

/* ---------- Reveal na skrol (IO u site.js) ---------- */
.js [data-reveal-child]{ opacity:0; transform:translateY(24px); transition:opacity var(--at-d-reveal) var(--at-ease-out), transform var(--at-d-reveal) var(--at-ease-out); transition-delay:calc(min(var(--i,0), 8) * 80ms); }
.js .is-inview [data-reveal-child]{ opacity:1; transform:none; }
.js [data-reveal=scale] [data-reveal-child]{ transform:scale(1.04); clip-path:inset(0 0 10% 0); transition-property:opacity, transform, clip-path; }
.js [data-reveal=scale].is-inview [data-reveal-child]{ clip-path:inset(0); transform:none; }

/* ---------- Fokus ---------- */
:where(.blk, .at-header, .at-menu, .at-footer, .at-skip) :focus-visible, .at-skip:focus-visible{ outline:2px solid var(--at-focus); outline-offset:3px; }
.at-sr{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---------- prefers-reduced-motion (jedini dozvoljen !important; samo biblioteka) ---------- */
@media (prefers-reduced-motion: reduce){
  :where(.blk, .at-header, .at-menu, .at-footer), :where(.blk, .at-header, .at-menu, .at-footer) :where(*, *::before, *::after){ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; transition-delay:0ms !important; scroll-behavior:auto !important; }
  .js [data-reveal-child]{ opacity:1; transform:none; clip-path:none; }
}

/* ===== izvor: dizajn/assets/blocks.css ===== */
/* =====================================================================
   LEONIDIS - blocks.css
   Jedan odeljak = jedan blok (<section class="blk blk-IME" data-blok="IME">).
   Blok zna samo za tokene i svoj CSS. Redosled odeljaka = katalog u DESIGN.md.
   ===================================================================== */

/* ============ hero ("Traka usluga": 4 trake → panorama na skrol) ============ */
.blk-hero{ --p:0; display:flex; flex-direction:column; min-height:calc(100svh - var(--at-header-h)); padding-block:clamp(20px, .5rem + 2.2vw, 48px) 0; }
.blk-hero__top{ display:grid; gap:18px; transform:translateY(calc(var(--p) * -40px)); opacity:calc(1 - var(--p) * .6); }
.blk-hero__title{ display:grid; }
.blk-hero__title .ln{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.blk-hero__title .ln > span{ display:block; }
.blk-hero__row{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:24px 48px; margin-top:8px; }
.blk-hero__row .at-lead{ max-width:44ch; }
.blk-hero__ctas{ display:flex; flex-wrap:wrap; align-items:center; gap:16px 28px; }
.js .blk-hero__title .ln > span{ animation:blk-rise 1s var(--at-ease-out) both; animation-delay:calc(120ms + var(--i,0) * 110ms); }
.js .blk-hero__eyebrow,.js .blk-hero__row{ animation:blk-fade 900ms var(--at-ease-out) both; animation-delay:380ms; }
@keyframes blk-rise{ from{ transform:translateY(108%); } }
@keyframes blk-fade{ from{ opacity:0; transform:translateY(16px); } }

.blk-hero__stage{ --hx:max(var(--at-gutter), calc((100% - var(--at-container)) / 2)); flex:1; display:flex; min-height:clamp(300px, 38svh, 560px); margin-top:clamp(28px, 1rem + 2.4vw, 48px); }
.blk-hero__strips{ flex:1; display:flex; gap:calc(10px * (1 - var(--p))); padding-inline:calc(var(--hx) * (1 - var(--p))); }
.blk-hero__strip{ position:relative; flex:1 1 0; min-width:0; overflow:hidden; border-radius:calc(var(--at-radius-lg) * (1 - var(--p))); background:var(--at-panel); transition:flex-grow 1s var(--at-ease-out); }
.blk-hero__strip.is-active{ flex-grow:4.2; }
.js .blk-hero__strip{ animation:blk-strip 1.1s var(--at-ease-out) both; }
.js .blk-hero__strip:nth-child(2){ animation-delay:.08s; } .js .blk-hero__strip:nth-child(3){ animation-delay:.16s; } .js .blk-hero__strip:nth-child(4){ animation-delay:.24s; }
@keyframes blk-strip{ from{ clip-path:inset(100% 0 0 0); } to{ clip-path:inset(0); } }
.blk-hero__link{ position:absolute; inset:0; display:block; color:var(--at-panel-ink); }
.blk-hero__link img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:scale(calc(1.16 - var(--p) * .12)); transition:transform 1.4s var(--at-ease-out); }
.blk-hero__strip.is-active img{ transform:scale(calc(1.06 - var(--p) * .04)); }
.blk-hero__link::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, color-mix(in srgb, var(--at-panel) 78%, transparent) 0%, color-mix(in srgb, var(--at-panel) 20%, transparent) 42%, transparent 64%); }
.blk-hero__strip:not(.is-active) .blk-hero__link::after{ background:color-mix(in srgb, var(--at-panel) 38%, transparent); transition:background-color var(--at-d-slow); }
.blk-hero__strip:not(.is-active):hover .blk-hero__link::after{ background:color-mix(in srgb, var(--at-panel) 18%, transparent); }
.blk-hero__n{ position:absolute; z-index:1; top:20px; left:20px; font:600 var(--at-fs-small)/1 var(--at-font-display); font-variant-numeric:tabular-nums; }
.blk-hero__v{ position:absolute; z-index:1; left:18px; bottom:22px; writing-mode:vertical-rl; transform:rotate(180deg); font:var(--at-display-weight) 1.125rem/1 var(--at-font-display); letter-spacing:-.01em; white-space:nowrap; transition:opacity var(--at-d-base); }
.blk-hero__strip.is-active .blk-hero__v{ opacity:0; }
.blk-hero__body{ position:absolute; z-index:1; left:clamp(20px, 2vw, 32px); right:clamp(20px, 2vw, 32px); bottom:clamp(24px, 2.4vw, 36px); display:grid; gap:6px; max-width:36ch; opacity:0; transform:translateY(14px); transition:opacity 300ms var(--at-ease-out), transform 300ms var(--at-ease-out); }
.blk-hero__strip.is-active .blk-hero__body{ opacity:1; transform:none; transition-duration:700ms; transition-delay:320ms; }
.blk-hero__body strong{ font:var(--at-display-weight) var(--at-fs-h3)/1.15 var(--at-font-display); letter-spacing:var(--at-display-tracking); }
.blk-hero__body small{ font-size:var(--at-fs-body); opacity:.88; }
.blk-hero__bar{ position:absolute; z-index:1; left:0; bottom:0; height:3px; width:100%; background:var(--at-accent-on-panel); transform:scaleX(0); transform-origin:left; }
.blk-hero__strip.is-active .blk-hero__bar{ animation:blk-bar var(--hero-dur, 6s) linear both; }
.blk-hero.is-paused .blk-hero__bar{ animation-play-state:paused; }
@keyframes blk-bar{ to{ transform:scaleX(1); } }
@media (max-width:47.99em){
  .blk-hero{ min-height:0; }
  .blk-hero__stage{ min-height:clamp(380px, 60svh, 520px); }
  .blk-hero__strips{ gap:calc(6px * (1 - var(--p))); }
  .blk-hero__strip.is-active{ flex-grow:5.5; }
  .blk-hero__n{ top:14px; left:50%; transform:translateX(-50%); }
  .blk-hero__strip.is-active .blk-hero__n{ left:20px; transform:none; }
  .blk-hero__v{ left:50%; margin-left:-.5em; bottom:16px; font-size:1rem; }
  .blk-hero__ctas .at-btn{ width:100%; }
}

/* ============ logos ============ */
.blk-logos__in{ display:grid; grid-template-columns:minmax(120px, 180px) 1fr; align-items:center; gap:clamp(24px, 4vw, 64px); }
.blk-logos__label{ font-size:var(--at-fs-small); color:var(--at-muted); line-height:1.4; }
.blk-logos__viewport{ overflow:hidden; -webkit-mask-image:linear-gradient(90deg, transparent, black 12%, black 88%, transparent); mask-image:linear-gradient(90deg, transparent, black 12%, black 88%, transparent); }
.blk-logos__track{ display:flex; align-items:center; gap:clamp(40px, 5vw, 80px); width:max-content; animation:blk-marquee 40s linear infinite; }
.blk-logos__viewport:hover .blk-logos__track,.blk-logos__viewport:focus-within .blk-logos__track{ animation-play-state:paused; }
@keyframes blk-marquee{ to{ transform:translateX(calc(-50% - clamp(20px, 2.5vw, 40px))); } }
.lg{ display:inline-flex; align-items:center; gap:10px; height:48px; white-space:nowrap; color:var(--at-muted); font:600 1.375rem/1 var(--at-font-body); transition:color var(--at-d-base); }
.lg:hover{ color:var(--at-ink); }
.lg i{ width:22px; height:22px; border:2.5px solid currentColor; border-radius:50%; }
.lg-1{ font:700 1.25rem/1 var(--at-font-display); letter-spacing:.18em; }
.lg-2{ font:700 1.625rem/1 var(--at-font-display); letter-spacing:-.04em; }
.lg-2 b{ color:var(--at-accent-text); }
.lg-3{ font:500 1.4rem/1 var(--at-font-body); } .lg-3 i{ border-radius:3px; transform:rotate(45deg) scale(.85); }
.lg-4{ font:800 1.125rem/1 var(--at-font-body); letter-spacing:.08em; }
.lg-5{ font:600 1.5rem/1 var(--at-font-display); } .lg-5 i{ border-radius:0 50% 50% 50%; }
.lg-6{ font:400 1.35rem/1 var(--at-font-body); letter-spacing:.02em; font-style:italic; }
.lg-7{ font:700 1.25rem/1 var(--at-font-display); letter-spacing:.24em; } .lg-7 i{ border-radius:2px; }
@media (max-width:47.99em){ .blk-logos__in{ grid-template-columns:1fr; gap:12px; } }
@media (prefers-reduced-motion: reduce){ .blk-logos__track{ animation:none; flex-wrap:wrap; width:auto; } .blk-logos__viewport{ -webkit-mask-image:none; mask-image:none; } .blk-logos__track [aria-hidden=true]{ display:none; } }

/* ============ usluge (redovi sa otkrivanjem fotografije) ============ */
.blk-usluge__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); }
.blk-usluge__head{ grid-column:1 / span 4; align-self:start; position:sticky; top:calc(var(--at-header-h-stuck) + 40px); display:grid; gap:14px; justify-items:start; }
.blk-usluge__head .at-link{ margin-top:8px; }
.blk-usluge__list{ grid-column:6 / -1; border-top:1px solid var(--at-line); }
.blk-usluge__row{ position:relative; display:grid; grid-template-columns:56px minmax(0,1fr) auto 56px; gap:24px; align-items:center; padding:clamp(24px, 1rem + 1.4vw, 40px) 0; border-bottom:1px solid var(--at-line); }
.blk-usluge__n{ align-self:start; padding-top:.55em; font:500 var(--at-fs-small)/1 var(--at-font-display); color:var(--at-muted); font-variant-numeric:tabular-nums; }
.blk-usluge__main{ display:grid; gap:8px; max-width:46ch; }
.blk-usluge__t{ font:var(--at-display-weight) var(--at-fs-h3)/1.15 var(--at-font-display); letter-spacing:var(--at-display-tracking); color:var(--at-ink); transition:transform var(--at-d-slow) var(--at-ease-out), color var(--at-d-base); }
.blk-usluge__d{ color:var(--at-ink-2); }
.blk-usluge__media{ width:clamp(120px, 11vw, 176px); aspect-ratio:4/3; border-radius:var(--at-radius-md); overflow:hidden; clip-path:inset(0 18% 0 18% round var(--at-radius-md)); transition:clip-path 700ms var(--at-ease-out); }
.blk-usluge__media img{ width:100%; height:100%; object-fit:cover; transform:scale(1.15); transition:transform 900ms var(--at-ease-out); }
.blk-usluge__go{ display:grid; place-items:center; width:56px; height:56px; border-radius:50%; border:1px solid var(--at-line-strong); color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base), border-color var(--at-d-base), transform var(--at-d-slow) var(--at-ease-out); }
.blk-usluge__go svg{ width:20px; height:20px; transition:transform var(--at-d-slow) var(--at-ease-out); }
@media (hover:hover){
  .blk-usluge__row:hover .blk-usluge__t{ transform:translateX(8px); }
  .blk-usluge__row:hover .blk-usluge__media{ clip-path:inset(0 0 0 0 round var(--at-radius-md)); }
  .blk-usluge__row:hover .blk-usluge__media img{ transform:none; }
  .blk-usluge__row:hover .blk-usluge__go{ background:var(--at-accent); border-color:var(--at-accent); color:var(--at-accent-ink); }
  .blk-usluge__row:hover .blk-usluge__go svg{ transform:rotate(45deg); }
}
@media (max-width:63.99em){
  .blk-usluge__head{ grid-column:1 / -1; position:static; }
  .blk-usluge__list{ grid-column:1 / -1; }
}
@media (max-width:47.99em), (hover:none){
  .blk-usluge__row{ grid-template-columns:32px minmax(0,1fr) 76px; gap:16px; }
  .blk-usluge__media{ width:76px; clip-path:none; align-self:start; }
  .blk-usluge__media img{ transform:none; }
  .blk-usluge__go{ display:none; }
}

/* ============ prednosti (sticky fotografija + lista koja se pali) ============ */
.blk-prednosti__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-gap); }
.blk-prednosti__media{ grid-column:1 / span 5; position:sticky; top:calc(var(--at-header-h-stuck) + 32px); align-self:start; height:min(calc(100svh - var(--at-header-h-stuck) - 64px), 700px); display:flex; flex-direction:column; gap:16px; }
.blk-prednosti__frame{ position:relative; flex:1; overflow:hidden; border-radius:var(--at-radius-lg); background:var(--at-surface); }
.blk-prednosti__frame img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.1); transition:opacity 800ms var(--at-ease-out), transform 1400ms var(--at-ease-out); }
.blk-prednosti__frame img.is-active{ opacity:1; transform:none; }
.blk-prednosti__count{ font:var(--at-display-weight) var(--at-fs-h4)/1 var(--at-font-display); color:var(--at-muted); }
.blk-prednosti__count [data-cur]{ color:var(--at-ink); }
.blk-prednosti__list{ grid-column:7 / -1; }
.blk-prednosti__item{ min-height:56svh; display:flex; flex-direction:column; justify-content:center; gap:16px; padding-block:40px; border-top:1px solid var(--at-line); opacity:.3; transition:opacity 600ms var(--at-ease-out); }
.blk-prednosti__item:first-child{ border-top:0; padding-top:0; min-height:44svh; justify-content:flex-start; }
.blk-prednosti__item.is-active{ opacity:1; }
.blk-prednosti__item h3{ font-size:clamp(1.5rem, 1.15rem + 1.3vw, 2.375rem); line-height:1.12; }
.blk-prednosti__item p{ max-width:48ch; font-size:var(--at-fs-lead); line-height:1.55; }
.blk-prednosti__n{ font:var(--at-display-weight) var(--at-fs-num)/1 var(--at-font-display); color:var(--at-accent-text); font-variant-numeric:tabular-nums; }
.blk-prednosti__item .blk-prednosti__fact{ width:fit-content; padding:8px 16px; border:1px solid var(--at-line-strong); border-radius:var(--at-radius-pill); font:600 var(--at-fs-small)/1.3 var(--at-font-body); color:var(--at-ink); }
.blk-prednosti__mimg{ display:none; }
@media (max-width:63.99em){
  .blk-prednosti__media{ display:none; }
  .blk-prednosti__list{ grid-column:1 / -1; display:grid; gap:var(--at-s-7); }
  .blk-prednosti__item,.blk-prednosti__item:first-child{ min-height:0; opacity:1; padding:0; border:0; }
  .blk-prednosti__mimg{ display:block; width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:var(--at-radius-md); margin-bottom:8px; }
}

/* ============ brojke (odometar) ============ */
.blk-brojke__note{ color:var(--at-muted); }
.blk-brojke__grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); border-top:1px solid var(--at-line); }
.blk-brojke__item{ display:flex; flex-direction:column; gap:10px; padding:clamp(24px, 1rem + 1.5vw, 40px) 24px 0 0; }
.blk-brojke__item + .blk-brojke__item{ border-left:1px solid var(--at-line); padding-left:24px; }
.blk-brojke__item dt{ order:2; font-weight:600; color:var(--at-ink); }
.blk-brojke__val{ order:1; display:flex; align-items:flex-start; font:var(--at-display-weight) var(--at-fs-stat)/1 var(--at-font-display); letter-spacing:-.03em; color:var(--at-ink); font-variant-numeric:tabular-nums; }
.blk-brojke__val sup{ font-size:.42em; line-height:1; margin:.12em 0 0 .06em; color:var(--at-accent-text); }
.blk-brojke__d{ order:3; font-size:var(--at-fs-small); color:var(--at-muted); max-width:24ch; }
.odo{ display:inline-flex; }
.odo__col{ display:inline-block; height:1em; overflow:hidden; }
.odo__strip{ display:block; transform:translateY(0); transition:transform 1.8s var(--at-ease-out); transition-delay:calc(var(--k, 0) * 140ms); }
.odo__strip span{ display:block; height:1em; line-height:1; }
@media (max-width:63.99em){
  .blk-brojke__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .blk-brojke__item:nth-child(3){ border-left:0; padding-left:0; }
  .blk-brojke__item:nth-child(n+3){ border-top:1px solid var(--at-line); margin-top:24px; }
}

/* ============ proces (linija koja se puni skrolom) ============ */
.blk-proces__wrap{ --pp:0; position:relative; }
.blk-proces__track{ position:absolute; left:0; right:0; top:11px; height:2px; background:var(--at-line); }
.blk-proces__fill{ position:absolute; inset:0; background:var(--at-accent-text); transform:scaleX(var(--pp)); transform-origin:left; }
.blk-proces__steps{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--at-gap); }
.blk-proces__step{ position:relative; display:grid; gap:12px; align-content:start; justify-items:start; padding-top:52px; }
.blk-proces__step p{ max-width:34ch; }
.blk-proces__dot{ position:absolute; left:0; top:4px; width:16px; height:16px; border-radius:50%; background:var(--at-surface-2); border:2px solid var(--at-line-strong); transition:background-color var(--at-d-slow), border-color var(--at-d-slow), box-shadow var(--at-d-slow); }
.blk-proces__step.is-done .blk-proces__dot{ background:var(--at-accent-text); border-color:var(--at-accent-text); box-shadow:0 0 0 6px color-mix(in srgb, var(--at-accent-text) 18%, transparent); }
.blk-proces__n{ font:600 var(--at-fs-micro)/1 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-proces__time{ margin-top:4px; padding:6px 12px; border-radius:var(--at-radius-pill); background:var(--at-surface); font-size:var(--at-fs-small); font-weight:600; color:var(--at-ink); }
@media (max-width:47.99em){
  .blk-proces__track{ left:7px; right:auto; top:8px; bottom:8px; width:2px; height:auto; }
  .blk-proces__fill{ transform:scaleY(var(--pp)); transform-origin:top; }
  .blk-proces__steps{ grid-template-columns:1fr; gap:var(--at-s-6); }
  .blk-proces__step{ padding:0 0 0 40px; }
  .blk-proces__dot{ top:2px; }
}

/* ============ reference (drag karusel) ============ */
.blk-reference__ctrl{ display:flex; gap:10px; }
.blk-reference__btn{ display:grid; place-items:center; width:52px; height:52px; border-radius:50%; border:1px solid var(--at-line-strong); color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base), border-color var(--at-d-base), opacity var(--at-d-base); }
.blk-reference__btn svg{ width:20px; height:20px; }
.blk-reference__btn:hover{ background:var(--at-accent); border-color:var(--at-accent); color:var(--at-accent-ink); }
.blk-reference__btn[disabled]{ opacity:.3; pointer-events:none; }
.blk-reference__track{ --pad:max(var(--at-gutter), calc((100% - var(--at-container)) / 2)); display:flex; align-items:flex-start; gap:var(--at-gap); overflow-x:auto; scroll-snap-type:x mandatory; padding-inline:var(--pad); scroll-padding-inline:var(--pad); scrollbar-width:none; overscroll-behavior-x:contain; cursor:grab; padding-bottom:8px; }
.blk-reference__track::-webkit-scrollbar{ display:none; }
.blk-reference__track.is-dragging{ cursor:grabbing; scroll-snap-type:none; user-select:none; }
.blk-reference__track.is-dragging a{ pointer-events:none; }
.blk-reference__card{ flex:0 0 clamp(264px, 30vw, 440px); scroll-snap-align:start; }
.blk-reference__card:nth-child(even){ margin-top:clamp(0px, 4vw, 64px); }
.blk-reference__card a{ display:grid; gap:14px; }
.blk-reference__media{ aspect-ratio:var(--at-img-ratio-card); overflow:hidden; border-radius:var(--at-radius-md); background:var(--at-surface); }
.blk-reference__media img{ width:100%; height:100%; object-fit:cover; transition:transform 1s var(--at-ease-out); -webkit-user-drag:none; }
.blk-reference__card a:hover img{ transform:scale(1.05); }
.blk-reference__meta{ display:flex; justify-content:space-between; gap:16px; font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-reference__card h3{ margin-top:-6px; }
.blk-reference__foot{ display:flex; align-items:center; gap:32px; margin-top:var(--at-s-7); }
.blk-reference__progress{ position:relative; flex:1; height:2px; background:var(--at-line); overflow:hidden; }
.blk-reference__progress span{ position:absolute; inset:0; background:var(--at-accent-text); transform:scaleX(var(--rp, .2)); transform-origin:left; transition:transform var(--at-d-base) var(--at-ease-out); }

/* ============ utisci ============ */
.blk-utisci__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); }
.blk-utisci__side{ grid-column:1 / span 4; display:grid; gap:14px; align-content:start; }
.blk-utisci__ctrl{ display:flex; align-items:center; gap:16px; margin-top:20px; }
.blk-utisci__count{ min-width:4.5em; text-align:center; font:var(--at-display-weight) var(--at-fs-h4)/1 var(--at-font-display); color:var(--at-muted); }
.blk-utisci__count [data-cur]{ color:var(--at-ink); }
.blk-utisci__stage{ grid-column:6 / -1; display:grid; }
.blk-utisci__slide{ grid-area:1 / 1; display:grid; align-content:start; gap:32px; opacity:0; visibility:hidden; transform:translateY(18px); transition:opacity 500ms var(--at-ease-out), transform 700ms var(--at-ease-out), visibility 0s linear 500ms; }
.blk-utisci__slide.is-active{ opacity:1; visibility:visible; transform:none; transition-delay:0s; }
.blk-utisci__slide blockquote{ position:relative; }
.blk-utisci__slide blockquote::before{ content:"„"; position:absolute; left:-.05em; top:-.72em; font:700 5rem/1 var(--at-font-display); color:var(--at-accent-text); }
.blk-utisci__slide blockquote p{ padding-top:.9em; font:400 clamp(1.375rem, 1rem + 1.5vw, 2.25rem)/1.32 var(--at-font-display); letter-spacing:-.015em; color:var(--at-ink); }
.blk-utisci__slide figcaption{ display:flex; align-items:center; gap:16px; padding-top:24px; border-top:1px solid var(--at-line); }
.blk-utisci__av{ display:grid; place-items:center; width:56px; height:56px; flex:none; border-radius:50%; background:var(--at-accent-soft); color:var(--at-accent-text); font:600 1rem/1 var(--at-font-display); }
.blk-utisci__slide strong{ display:block; font-weight:600; color:var(--at-ink); }
.blk-utisci__slide small{ font-size:var(--at-fs-small); color:var(--at-muted); }
@media (max-width:63.99em){ .blk-utisci__side,.blk-utisci__stage{ grid-column:1 / -1; } .blk-utisci__ctrl{ order:3; } }

/* ============ cta (akcentna traka) ============ */
.blk-cta{ overflow:hidden; padding-block:var(--at-section-md); }
.blk-cta__in{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); align-items:end; }
.blk-cta__in h2{ grid-column:1 / span 8; font-size:clamp(1.75rem, 1.2rem + 2.2vw, 3.25rem); line-height:1.1; }
.blk-cta__act{ grid-column:9 / -1; display:grid; gap:18px; justify-items:start; }
.blk-cta__tel{ display:inline-flex; align-items:center; gap:10px; font-weight:600; color:var(--at-ink); }
.blk-cta__tel svg{ width:18px; height:18px; }
.blk-cta__tel:hover{ text-decoration:underline; text-underline-offset:4px; }
.blk-cta__deco{ position:absolute; right:-2%; top:50%; height:170%; width:auto; transform:translateY(-50%); fill:none; stroke:color-mix(in srgb, var(--at-accent-ink) 22%, transparent); stroke-width:.25; pointer-events:none; }
@media (max-width:63.99em){ .blk-cta__in h2,.blk-cta__act{ grid-column:1 / -1; } .blk-cta__deco{ height:120%; right:-20%; } }

/* ============ blog (3 ujednačene kartice) ============ */
.blk-blog__grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); }
@media (max-width:47.99em){
  .blk-blog__grid{ grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:84%; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; margin-inline:calc(var(--at-gutter) * -1); padding-inline:var(--at-gutter); scroll-padding-inline:var(--at-gutter); }
  .blk-blog__grid > *{ scroll-snap-align:start; }
}

/* ============ kontakt (podaci + mapa | forma) ============ */
.blk-kontakt__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); }
.blk-kontakt__info{ grid-column:1 / span 5; display:grid; gap:16px; align-content:start; }
.blk-kontakt__data{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:24px; margin-top:12px; padding-top:28px; border-top:1px solid var(--at-line); }
.blk-kontakt__data li{ display:flex; gap:12px; }
.blk-kontakt__data svg{ width:20px; height:20px; flex:none; margin-top:2px; color:var(--at-accent-text); }
.blk-kontakt__data small{ display:block; margin-bottom:2px; font:600 var(--at-fs-micro)/1.4 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-kontakt__data span{ color:var(--at-ink); }
.blk-kontakt__data a{ font-weight:600; color:var(--at-ink); }
.blk-kontakt__data a:hover{ color:var(--at-accent-text); }
.blk-kontakt__map{ position:relative; margin-top:12px; aspect-ratio:16/9; overflow:hidden; border-radius:var(--at-radius-lg); border:1px solid var(--at-line); background-color:var(--at-surface);
  background-image:
    linear-gradient(32deg, transparent 47%, var(--at-line-strong) 47.2%, var(--at-line-strong) 48.4%, transparent 48.6%),
    linear-gradient(-58deg, transparent 58%, var(--at-line-strong) 58.2%, var(--at-line-strong) 59%, transparent 59.2%),
    linear-gradient(var(--at-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--at-line) 1px, transparent 1px);
  background-size:100% 100%, 100% 100%, 28px 28px, 28px 28px; }
.blk-kontakt__map iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; filter:var(--at-img-filter); }
.blk-kontakt__map .at-btn{ position:absolute; left:16px; bottom:16px; background:var(--at-surface); }
.blk-kontakt__pin{ position:absolute; left:56%; top:34%; display:grid; place-items:center; width:44px; height:44px; border-radius:50% 50% 50% 0; background:var(--at-accent); color:var(--at-accent-ink); transform:rotate(-45deg); box-shadow:var(--at-shadow-sm); }
.blk-kontakt__pin svg{ width:20px; height:20px; transform:rotate(45deg); }
.blk-kontakt__pin::after{ content:""; position:absolute; inset:-10px; border-radius:50%; border:2px solid var(--at-accent); opacity:0; animation:blk-ping 2.4s var(--at-ease-out) infinite; }
@keyframes blk-ping{ 0%{ opacity:.6; transform:scale(.6); } 100%{ opacity:0; transform:scale(1.6); } }
.blk-kontakt__map.is-loaded > :not(iframe){ display:none; }
.blk-kontakt__form{ grid-column:7 / -1; align-self:start; padding:clamp(24px, 1rem + 2.4vw, 48px); border-radius:var(--at-radius-lg); background:var(--at-surface); border:1px solid var(--at-line); }
@media (max-width:63.99em){ .blk-kontakt__info,.blk-kontakt__form{ grid-column:1 / -1; } }
@media (max-width:29.99em){ .blk-kontakt__data{ grid-template-columns:1fr; } }

/* ============ page-header (unutrašnje strane - NIKAD kopija hero-a) ============ */
/* <section class="blk blk-page-header" data-blok="page-header" data-variant="type|media" data-bg="bg|surface-2|panel"> */
.blk-page-header{ padding-block:var(--at-section-sm) var(--at-section-md); }
.blk-page-header__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-5) var(--at-gap); align-items:end; margin-top:var(--at-s-7); }
.blk-page-header__title{ grid-column:1 / span 8; font-size:var(--at-fs-h1); }
.blk-page-header__aside{ grid-column:9 / -1; display:grid; gap:20px; justify-items:start; }
.blk-page-header__rule{ display:flex; flex-wrap:wrap; gap:8px; margin-top:var(--at-s-7); padding-top:20px; border-top:1px solid var(--at-line); }
.blk-page-header__rule a{ padding:8px 14px; border:1px solid var(--at-line-strong); border-radius:var(--at-radius-pill); font-size:var(--at-fs-small); font-weight:600; color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base); }
.blk-page-header__rule a:hover{ background:var(--at-ink); color:var(--at-bg); }
.blk-page-header__media{ margin-top:var(--at-s-7); aspect-ratio:var(--at-img-ratio-hero); overflow:hidden; border-radius:var(--at-radius-lg); }
.blk-page-header__media img{ width:100%; height:100%; object-fit:cover; }
@supports (animation-timeline: view()){
  .blk-page-header__media img{ animation:blk-unzoom linear both; animation-timeline:view(); animation-range:entry 0% exit 60%; }
  @keyframes blk-unzoom{ from{ transform:scale(1.14); } to{ transform:scale(1); } }
}
@media (max-width:63.99em){ .blk-page-header__title,.blk-page-header__aside{ grid-column:1 / -1; } .blk-page-header__media{ aspect-ratio:4/3; } }

/* ===== izvor: dizajn/assets/blocks-onama-usluge.css ===== */
/* =====================================================================
   LEONIDIS - blocks-onama-usluge.css (talas 2: o-nama, usluge, usluga)
   Novi blokovi: prica, principi, tim, hronologija, sertifikati,
   usluge-indeks, usluge-model, usluga-uvod, ukljuceno, rezultati, cena,
   faq, upit. Samo var(--at-*), nula zakucanih boja. Glavna nit spaja
   u blocks.css.
   ===================================================================== */

/* ============ prica (izjava koja se "puni" skrolom + uređivački raspored) ============ */
.blk-prica__head{ display:grid; gap:20px; }
.blk-prica__statement{ max-width:30ch; font:var(--at-display-weight) var(--at-fs-h2)/1.18 var(--at-font-display); letter-spacing:var(--at-display-tracking); color:var(--at-ink); text-wrap:pretty; }
.blk-prica__statement.is-split .w{ opacity:.18; transition:opacity 400ms var(--at-ease-out); }
.blk-prica__statement.is-split .w.is-on{ opacity:1; }
.blk-prica__facts{ display:flex; flex-wrap:wrap; gap:8px 0; margin-top:12px; font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-prica__facts li{ display:flex; align-items:center; }
.blk-prica__facts li + li::before{ content:""; width:24px; height:1px; margin-inline:14px; background:var(--at-line-strong); }
.blk-prica__facts b{ font-weight:600; color:var(--at-ink); margin-right:6px; }
.blk-prica__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); margin-top:var(--at-head-gap); }
.blk-prica__fig-a{ grid-column:1 / span 5; grid-row:1 / span 2; align-self:start; }
.blk-prica__text{ grid-column:7 / -1; grid-row:1; }
.blk-prica__fig-b{ grid-column:9 / -1; grid-row:2; }
.blk-prica__fig-a .blk-prica__img{ aspect-ratio:4/5; }
.blk-prica__fig-b .blk-prica__img{ aspect-ratio:4/3; }
.blk-prica__img{ overflow:hidden; border-radius:var(--at-radius-lg); background:var(--at-surface-2); }
.blk-prica__img img{ width:100%; height:100%; object-fit:cover; }
.blk-prica figcaption{ margin-top:10px; font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-prica__sign{ display:block; margin-top:14px; font:600 var(--at-fs-small)/1.4 var(--at-font-body); color:var(--at-muted); }
@media (max-width:63.99em){
  .blk-prica__fig-a,.blk-prica__text,.blk-prica__fig-b{ grid-column:1 / -1; grid-row:auto; }
  .blk-prica__fig-a .blk-prica__img{ aspect-ratio:4/3; }
  .blk-prica__fig-b{ display:none; }
}

/* ============ principi (4 kolone sa razdelnicima, panel) ============ */
.blk-principi__grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); border-top:1px solid var(--at-line); }
.blk-principi__item{ display:flex; flex-direction:column; gap:14px; padding:clamp(28px, 1rem + 2vw, 48px) 28px 0 0; }
.blk-principi__item + .blk-principi__item{ border-left:1px solid var(--at-line); padding-left:28px; }
.blk-principi__n{ font:var(--at-display-weight) var(--at-fs-num)/1 var(--at-font-display); color:var(--at-accent-text); font-variant-numeric:tabular-nums; }
.blk-principi__item h3{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
.blk-principi__praksa{ margin-top:auto; padding-top:16px; border-top:1px dashed var(--at-line-strong); font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-principi__praksa b{ display:block; font-weight:600; color:var(--at-ink); margin-bottom:2px; }
@media (max-width:63.99em){
  .blk-principi__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .blk-principi__item:nth-child(3){ border-left:0; padding-left:0; }
  .blk-principi__item:nth-child(n+3){ border-top:1px solid var(--at-line); margin-top:32px; }
}
@media (max-width:47.99em){
  .blk-principi__grid{ grid-template-columns:1fr; }
  .blk-principi__item,.blk-principi__item + .blk-principi__item{ border-left:0; padding:28px 0 0; }
  .blk-principi__item + .blk-principi__item{ border-top:1px solid var(--at-line); margin-top:28px; }
}

/* ============ tim (kartice; detalj na hover / fokus / dugme +) ============ */
.blk-tim__grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); }
.blk-tim__card{ display:grid; gap:14px; align-content:start; }
.blk-tim__card:nth-child(even){ margin-top:clamp(0px, 4vw, 56px); }
.blk-tim__media{ position:relative; aspect-ratio:var(--at-img-ratio-card); overflow:hidden; overflow:clip;border-radius:var(--at-radius-md); background:var(--at-surface-2); }
.blk-tim__photo{ position:absolute; inset:0; filter:grayscale(1); transition:filter var(--at-d-reveal) var(--at-ease-out); }
.blk-tim__photo img{ width:100%; height:100%; object-fit:cover; transform:scale(1.02); transition:transform 1s var(--at-ease-out); }
.blk-tim__detail{ position:absolute; left:0; right:0; bottom:0; display:grid; gap:14px; padding:clamp(18px, 1.6vw, 24px); transform:translateY(101%); transition:transform 560ms var(--at-ease-out); }
.blk-tim__detail p{ font-size:var(--at-fs-small); line-height:1.55; }
.blk-tim__links{ display:flex; gap:8px; }
.blk-tim__links a{ display:grid; place-items:center; width:44px; height:44px; border-radius:50%; border:1px solid var(--at-line); color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base); }
.blk-tim__links a:hover{ background:var(--at-ink); color:var(--at-panel); }
.blk-tim__links svg{ width:18px; height:18px; }
.blk-tim__more{ position:absolute; z-index:1; top:12px; right:12px; display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:var(--at-surface); color:var(--at-ink); box-shadow:var(--at-shadow-xs); transition:transform var(--at-d-slow) var(--at-ease-out), background-color var(--at-d-base), color var(--at-d-base); }
.blk-tim__more svg{ width:18px; height:18px; }
.blk-tim__card.is-open .blk-tim__more{ transform:rotate(45deg); background:var(--at-accent); color:var(--at-accent-ink); }
.blk-tim__card.is-open .blk-tim__detail,.blk-tim__media:focus-within .blk-tim__detail{ transform:none; }
.blk-tim__card.is-open .blk-tim__photo{ filter:none; }
@media (hover:hover){
  .blk-tim__card:hover .blk-tim__detail{ transform:none; }
  .blk-tim__card:hover .blk-tim__photo{ filter:none; }
  .blk-tim__card:hover .blk-tim__photo img{ transform:scale(1.07); }
  .blk-tim__card:hover .blk-tim__more{ transform:rotate(45deg); }
}
.blk-tim__name{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
.blk-tim__role{ margin-top:-8px; font-size:var(--at-fs-small); color:var(--at-muted); }
@media (max-width:63.99em){ .blk-tim__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } .blk-tim__card:nth-child(even){ margin-top:0; } }
@media (max-width:29.99em){ .blk-tim__grid{ grid-template-columns:1fr; gap:var(--at-s-6); } .blk-tim__media{ aspect-ratio:1; } }

/* ============ hronologija (vertikalna; desktop + GSAP = horizontalna, zakačena) ============ */
.blk-hronologija__bar{ display:none; }
.blk-hronologija__viewport{ width:min(100% - 2*var(--at-gutter), var(--at-container)); margin-inline:auto; }
.blk-hronologija__track{ display:grid; margin-left:7px; border-left:2px solid var(--at-line); }
.blk-hronologija__item{ position:relative; display:grid; gap:12px; align-content:start; padding:0 0 var(--at-s-7) var(--at-s-6); }
.blk-hronologija__item:last-child{ padding-bottom:0; }
.blk-hronologija__item::before{ content:""; position:absolute; left:-9px; top:.9em; width:16px; height:16px; border-radius:50%; background:var(--at-surface-2); border:2px solid var(--at-line-strong); transition:background-color var(--at-d-slow), border-color var(--at-d-slow); }
.blk-hronologija__item.is-on::before{ background:var(--at-accent-text); border-color:var(--at-accent-text); }
.blk-hronologija__year{ font:var(--at-display-weight) var(--at-fs-stat)/1 var(--at-font-display); letter-spacing:-.03em; color:var(--at-ink); font-variant-numeric:tabular-nums; transition:color var(--at-d-slow); }
.blk-hronologija__item h3{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
.blk-hronologija__item p{ max-width:40ch; }
.blk-hronologija__img{ aspect-ratio:16/9; max-width:420px; overflow:hidden; border-radius:var(--at-radius-md); background:var(--at-surface); }
.blk-hronologija__img img{ width:100%; height:100%; object-fit:cover; }
@media (min-width:64em){
  .blk-hronologija{ padding-block:var(--at-section-md); }
  .blk-hronologija__viewport{ width:auto; margin-inline:0; overflow-x:auto; scrollbar-width:none; }
  .blk-hronologija__viewport::-webkit-scrollbar{ display:none; }
  .blk-hronologija__track{ --pad:max(var(--at-gutter), calc((100% - var(--at-container)) / 2)); display:flex; width:max-content; margin:0; border-left:0; padding-inline:var(--pad); }
  .blk-hronologija__item{ width:clamp(300px, 25vw, 380px); padding:44px 56px 0 0; border-top:2px solid var(--at-line); }
  .blk-hronologija__item::before{ left:0; top:-9px; }
  .blk-hronologija__item:last-child{ padding-right:0; }
  .blk-hronologija.is-pinned .blk-hronologija__viewport{ overflow:hidden; }
  .blk-hronologija.is-pinned .blk-hronologija__item:not(.is-on) .blk-hronologija__year{ color:var(--at-line-strong); }
  .blk-hronologija.is-pinned .blk-hronologija__bar{ display:block; position:relative; height:2px; margin-top:var(--at-s-6); background:var(--at-line); overflow:hidden; }
  .blk-hronologija__bar span{ position:absolute; inset:0; background:var(--at-accent-text); transform:scaleX(var(--hp, 0)); transform-origin:left; }
}

/* ============ sertifikati (dokumenti kao redovi) ============ */
.blk-sertifikati__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); }
.blk-sertifikati__head{ grid-column:1 / span 4; align-self:start; position:sticky; top:calc(var(--at-header-h-stuck) + 40px); display:grid; gap:14px; }
.blk-sertifikati__list{ grid-column:6 / -1; border-top:1px solid var(--at-line); }
.blk-sertifikati__row{ display:grid; grid-template-columns:132px minmax(0,1fr) auto; gap:8px 28px; align-items:center; padding:24px 0; border-bottom:1px solid var(--at-line); }
.blk-sertifikati__code{ display:grid; place-items:center; min-height:72px; padding:10px; border:1.5px solid var(--at-line-strong); border-radius:var(--at-radius-sm); text-align:center; font:700 var(--at-fs-small)/1.2 var(--at-font-display); letter-spacing:.02em; color:var(--at-ink); position:relative; }
.blk-sertifikati__code::after{ content:""; position:absolute; inset:4px; border:1px dashed var(--at-line); border-radius:var(--at-radius-sm); pointer-events:none; }
.blk-sertifikati__main{ display:grid; gap:4px; }
.blk-sertifikati__main h3{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
.blk-sertifikati__main p{ font-size:var(--at-fs-small); color:var(--at-muted); }
@media (max-width:63.99em){ .blk-sertifikati__head{ grid-column:1 / -1; position:static; } .blk-sertifikati__list{ grid-column:1 / -1; } }
@media (max-width:47.99em){
  .blk-sertifikati__row{ grid-template-columns:88px minmax(0,1fr); }
  .blk-sertifikati__code{ min-height:64px; font-size:var(--at-fs-micro); }
  .blk-sertifikati__row .at-link{ grid-column:2; justify-self:start; }
}

/* ============ usluge-indeks (filter + indeks lista + pregled slike uz kursor) ============ */
.blk-usluge-indeks__bar{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px 32px; padding-bottom:24px; }
.blk-usluge-indeks__filters{ display:flex; flex-wrap:wrap; gap:8px; }
.blk-usluge-indeks__filter{ display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 18px; border:1px solid var(--at-line-strong); border-radius:var(--at-radius-pill); font:600 var(--at-fs-small)/1 var(--at-font-body); color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base), border-color var(--at-d-base); }
.blk-usluge-indeks__filter sup{ font-size:.7rem; color:var(--at-muted); font-variant-numeric:tabular-nums; }
.blk-usluge-indeks__filter:hover{ border-color:var(--at-ink); }
.blk-usluge-indeks__filter[aria-pressed=true]{ background:var(--at-ink); border-color:var(--at-ink); color:var(--at-bg); }
.blk-usluge-indeks__filter[aria-pressed=true] sup{ color:inherit; opacity:.7; }
.blk-usluge-indeks__count{ font-size:var(--at-fs-small); color:var(--at-muted); font-variant-numeric:tabular-nums; }
.blk-usluge-indeks__list{ border-top:1px solid var(--at-line-strong); }
.blk-usluge-indeks__list > li{ border-bottom:1px solid var(--at-line); transition:opacity var(--at-d-slow) var(--at-ease-out); }
.blk-usluge-indeks__list > li.is-in{ animation:blk-fade 600ms var(--at-ease-out) both; animation-delay:calc(var(--k, 0) * 60ms); }
.blk-usluge-indeks__row{ display:grid; grid-template-columns:56px minmax(0,1.15fr) minmax(0,1fr) 180px 56px; gap:28px; align-items:center; padding:clamp(22px, 1rem + 1.2vw, 36px) 0; }
.blk-usluge-indeks__n{ font:500 var(--at-fs-small)/1 var(--at-font-display); color:var(--at-muted); font-variant-numeric:tabular-nums; }
.blk-usluge-indeks__t{ font:var(--at-display-weight) var(--at-fs-h3)/1.15 var(--at-font-display); letter-spacing:var(--at-display-tracking); color:var(--at-ink); transition:transform var(--at-d-slow) var(--at-ease-out), color var(--at-d-base); }
.blk-usluge-indeks__d{ color:var(--at-ink-2); max-width:44ch; }
.blk-usluge-indeks__meta{ display:grid; gap:4px; font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-usluge-indeks__meta b{ font-weight:600; color:var(--at-ink); }
.blk-usluge-indeks__thumb{ display:none; }
.blk-usluge-indeks__go{ display:grid; place-items:center; width:56px; height:56px; border-radius:50%; border:1px solid var(--at-line-strong); color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base), border-color var(--at-d-base); }
.blk-usluge-indeks__go svg{ width:20px; height:20px; transition:transform var(--at-d-slow) var(--at-ease-out); }
.blk-usluge-indeks__preview{ display:none; }
@media (hover:hover) and (min-width:64em){
  .blk-usluge-indeks__list:hover > li:not(:hover){ opacity:.4; }
  .blk-usluge-indeks__row:hover .blk-usluge-indeks__t,.blk-usluge-indeks__row:focus-visible .blk-usluge-indeks__t{ transform:translateX(10px); color:var(--at-accent-text); }
  .blk-usluge-indeks__row:hover .blk-usluge-indeks__go{ background:var(--at-accent); border-color:var(--at-accent); color:var(--at-accent-ink); }
  .blk-usluge-indeks__row:hover .blk-usluge-indeks__go svg{ transform:rotate(45deg); }
  .blk-usluge-indeks__preview{ display:block; position:fixed; left:0; top:0; z-index:calc(var(--at-z-header) - 1); width:clamp(220px, 18vw, 300px); aspect-ratio:4/5; border-radius:var(--at-radius-md); overflow:hidden; pointer-events:none; background:var(--at-surface-2); box-shadow:var(--at-shadow-lg);
    clip-path:inset(50% 50% 50% 50% round var(--at-radius-md)); transition:clip-path 520ms var(--at-ease-out); will-change:transform; }
  .blk-usluge-indeks__preview.is-on{ clip-path:inset(0 0 0 0 round var(--at-radius-md)); }
  .blk-usluge-indeks__preview img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.12); transition:opacity 360ms var(--at-ease-out), transform 900ms var(--at-ease-out); }
  .blk-usluge-indeks__preview img.is-active{ opacity:1; transform:none; }
}
@media (max-width:63.99em), (hover:none){
  .blk-usluge-indeks__row{ grid-template-columns:28px minmax(0,1fr) 84px; grid-template-areas:"n t th" "n d th" "n m th"; gap:6px 16px; align-items:start; }
  .blk-usluge-indeks__n{ grid-area:n; padding-top:.5em; }
  .blk-usluge-indeks__t{ grid-area:t; }
  .blk-usluge-indeks__d{ grid-area:d; }
  .blk-usluge-indeks__meta{ grid-area:m; margin-top:6px; display:flex; flex-wrap:wrap; gap:4px 12px; }
  .blk-usluge-indeks__thumb{ grid-area:th; display:block; aspect-ratio:1; overflow:hidden; border-radius:var(--at-radius-md); }
  .blk-usluge-indeks__thumb img{ width:100%; height:100%; object-fit:cover; }
  .blk-usluge-indeks__go{ display:none; }
}

/* ============ usluge-model (naizmenični veliki redovi) ============ */
.blk-usluge-model__list{ display:grid; gap:clamp(56px, 2rem + 5vw, 120px); }
.blk-usluge-model__row{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); align-items:center; }
.blk-usluge-model__media{ grid-column:1 / span 7; aspect-ratio:16/11; overflow:hidden; border-radius:var(--at-radius-lg); background:var(--at-surface); }
.blk-usluge-model__media img{ width:100%; height:100%; object-fit:cover; }
.blk-usluge-model__body{ grid-column:9 / -1; display:grid; gap:16px; justify-items:start; }
.blk-usluge-model__row:nth-child(even) .blk-usluge-model__media{ grid-column:6 / -1; grid-row:1; }
.blk-usluge-model__row:nth-child(even) .blk-usluge-model__body{ grid-column:1 / span 4; grid-row:1; }
.blk-usluge-model__k{ font:600 var(--at-fs-micro)/1 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-accent-text); }
.blk-usluge-model__chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; }
.blk-usluge-model__chips li{ padding:7px 12px; border-radius:var(--at-radius-pill); background:var(--at-surface); font-size:var(--at-fs-small); font-weight:600; color:var(--at-ink); }
.blk-usluge-model__fit{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-usluge-model__fit b{ color:var(--at-ink); font-weight:600; }
@media (max-width:63.99em){
  .blk-usluge-model__media,.blk-usluge-model__body,
  .blk-usluge-model__row:nth-child(even) .blk-usluge-model__media,.blk-usluge-model__row:nth-child(even) .blk-usluge-model__body{ grid-column:1 / -1; grid-row:auto; }
  .blk-usluge-model__media{ aspect-ratio:4/3; }
}

/* ============ usluga-uvod (činjenice sticky + uvod + ključne koristi) ============ */
.blk-usluga-uvod__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); }
.blk-usluga-uvod__facts{ grid-column:1 / span 4; align-self:start; position:sticky; top:calc(var(--at-header-h-stuck) + 32px); padding:clamp(20px, 1rem + 1vw, 32px); border-radius:var(--at-radius-lg); background:var(--at-surface); border:1px solid var(--at-line); }
.blk-usluga-uvod__facts h2{ font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); margin-bottom:8px; }
.blk-usluga-uvod__facts dl > div{ display:grid; gap:2px; padding:14px 0; border-bottom:1px solid var(--at-line); }
.blk-usluga-uvod__facts dl > div:last-child{ border-bottom:0; padding-bottom:0; }
.blk-usluga-uvod__facts dt{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-usluga-uvod__facts dd{ font-weight:600; color:var(--at-ink); }
.blk-usluga-uvod__facts dd a{ color:var(--at-accent-text); text-decoration:underline; text-underline-offset:3px; }
.blk-usluga-uvod__main{ grid-column:6 / -1; display:grid; gap:var(--at-s-7); }
.blk-usluga-uvod__intro{ font:400 clamp(1.25rem, 1rem + .9vw, 1.75rem)/1.4 var(--at-font-display); letter-spacing:-.01em; color:var(--at-ink); max-width:34ch; text-wrap:pretty; }
.blk-usluga-uvod__koristi{ display:grid; border-top:1px solid var(--at-line); }
.blk-usluga-uvod__koristi li{ display:grid; grid-template-columns:64px minmax(0,1fr); gap:6px 16px; padding:24px 0; border-bottom:1px solid var(--at-line); }
.blk-usluga-uvod__koristi .n{ grid-row:span 2; font:var(--at-display-weight) var(--at-fs-num)/1 var(--at-font-display); color:var(--at-accent-text); font-variant-numeric:tabular-nums; }
.blk-usluga-uvod__koristi h3{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
@media (max-width:63.99em){ .blk-usluga-uvod__facts{ grid-column:1 / -1; position:static; order:2; } .blk-usluga-uvod__main{ grid-column:1 / -1; } }
@media (max-width:47.99em){ .blk-usluga-uvod__koristi li{ grid-template-columns:44px minmax(0,1fr); } }

/* ============ ukljuceno (faze kao kolone sa listom stavki) ============ */
.blk-ukljuceno__grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--at-gap); }
.blk-ukljuceno__col{ display:grid; gap:18px; align-content:start; padding:clamp(22px, 1rem + 1vw, 32px); border-radius:var(--at-radius-lg); background:var(--at-surface); }
.blk-ukljuceno__top{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:16px; border-bottom:1px solid var(--at-line); }
.blk-ukljuceno__n{ font:var(--at-display-weight) var(--at-fs-num)/1 var(--at-font-display); color:var(--at-accent-text); font-variant-numeric:tabular-nums; }
.blk-ukljuceno__time{ padding:6px 12px; border-radius:var(--at-radius-pill); background:var(--at-surface-2); font-size:var(--at-fs-small); font-weight:600; color:var(--at-ink); }
.blk-ukljuceno__col h3{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
.blk-ukljuceno__col ul{ display:grid; gap:12px; }
.blk-ukljuceno__col li{ position:relative; padding-left:30px; }
.blk-ukljuceno__col li::before{ content:""; position:absolute; left:2px; top:.3em; width:16px; height:16px; border-radius:50%; background:var(--at-accent-soft); }
.blk-ukljuceno__col li::after{ content:""; position:absolute; left:7px; top:calc(.3em + 5px); width:6px; height:3.5px; border:1.5px solid var(--at-accent-text); border-top:0; border-right:0; transform:rotate(-45deg); }
.blk-ukljuceno__out{ display:flex; flex-wrap:wrap; gap:8px 24px; align-items:baseline; margin-top:var(--at-s-6); padding-top:20px; border-top:1px solid var(--at-line); font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-ukljuceno__out b{ font-weight:600; color:var(--at-ink); }
@media (max-width:63.99em){ .blk-ukljuceno__grid{ grid-template-columns:1fr; } }

/* ============ rezultati (poređenje 3D prikaz / izvedeno, panel) ============ */
.blk-rezultati__cmp{ --x:50%; position:relative; aspect-ratio:var(--at-img-ratio-hero); overflow:hidden; border-radius:var(--at-radius-lg); background:var(--at-surface); user-select:none; touch-action:pan-y; }
.blk-rezultati__cmp img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; -webkit-user-drag:none; }
.blk-rezultati__render{ position:absolute; inset:0; filter:grayscale(1) contrast(1.15) brightness(1.08); clip-path:inset(0 calc(100% - var(--x)) 0 0); }
.blk-rezultati__tag{ position:absolute; z-index:1; top:16px; padding:8px 14px; border-radius:var(--at-radius-pill); background:var(--at-panel); color:var(--at-panel-ink); font:600 var(--at-fs-small)/1 var(--at-font-body); }
.blk-rezultati__tag--l{ left:16px; }
.blk-rezultati__tag--r{ right:16px; }
.blk-rezultati__handle{ position:absolute; z-index:2; top:0; bottom:0; left:var(--x); width:2px; margin-left:-1px; background:var(--at-panel-ink); pointer-events:none; }
.blk-rezultati__knob{ position:absolute; left:50%; top:50%; display:flex; align-items:center; justify-content:center; gap:2px; width:56px; height:56px; margin:-28px 0 0 -28px; border-radius:50%; background:var(--at-panel-ink); color:var(--at-panel); box-shadow:var(--at-shadow-md); transition:transform var(--at-d-base) var(--at-ease-out); }
.blk-rezultati__knob svg{ width:16px; height:16px; }
.blk-rezultati__range{ position:absolute; z-index:3; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:ew-resize; }
.blk-rezultati__cmp:hover .blk-rezultati__knob{ transform:scale(1.08); }
.blk-rezultati__cmp:has(.blk-rezultati__range:focus-visible) .blk-rezultati__knob{ outline:2px solid var(--at-focus); outline-offset:4px; }
.blk-rezultati__meta{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--at-gap); margin-top:var(--at-s-6); padding-top:24px; border-top:1px solid var(--at-line); }
.blk-rezultati__meta dt{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-rezultati__meta dd{ font:var(--at-display-weight) var(--at-fs-h4)/1.3 var(--at-font-display); color:var(--at-ink); }
@media (max-width:63.99em){ .blk-rezultati__cmp{ aspect-ratio:4/3; } .blk-rezultati__meta{ grid-template-columns:repeat(2, minmax(0,1fr)); } }

/* ============ cena ("od" blok, jasno označen demo) ============ */
.blk-cena__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); align-items:start; }
.blk-cena__card{ grid-column:1 / span 5; display:grid; gap:18px; justify-items:start; padding:clamp(24px, 1rem + 2vw, 44px); border-radius:var(--at-radius-lg); background:var(--at-surface); border:1px solid var(--at-line); }
.blk-cena__demo{ padding:6px 12px; border-radius:var(--at-radius-sm); background:var(--at-warning-soft); color:var(--at-warning); font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.08em; text-transform:uppercase; }
.blk-cena__label{ font-weight:600; color:var(--at-ink); }
.blk-cena__price{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; color:var(--at-ink); }
.blk-cena__price small{ font:500 var(--at-fs-lead)/1 var(--at-font-body); color:var(--at-muted); }
.blk-cena__price strong{ font:var(--at-display-weight) var(--at-fs-stat)/.95 var(--at-font-display); letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.blk-cena__price span{ font:var(--at-display-weight) var(--at-fs-h3)/1 var(--at-font-display); }
.blk-cena__rows{ width:100%; display:grid; border-top:1px solid var(--at-line); }
.blk-cena__rows div{ display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--at-line); font-size:var(--at-fs-small); }
.blk-cena__rows dt{ color:var(--at-muted); }
.blk-cena__rows dd{ font-weight:600; color:var(--at-ink); text-align:right; }
.blk-cena__side{ grid-column:7 / -1; display:grid; gap:var(--at-s-6); }
.blk-cena__factors{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); }
.blk-cena__factors li{ display:grid; gap:8px; padding-top:18px; border-top:2px solid var(--at-ink); }
.blk-cena__factors h3{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
@media (max-width:63.99em){ .blk-cena__card,.blk-cena__side{ grid-column:1 / -1; } }
@media (max-width:47.99em){ .blk-cena__factors{ grid-template-columns:1fr; } }

/* ============ faq (akordeon, aria) ============ */
.blk-faq__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); }
.blk-faq__head{ grid-column:1 / span 4; align-self:start; position:sticky; top:calc(var(--at-header-h-stuck) + 40px); display:grid; gap:14px; justify-items:start; }
.blk-faq__list{ grid-column:6 / -1; border-top:1px solid var(--at-line-strong); }
.blk-faq__item{ border-bottom:1px solid var(--at-line); }
.blk-faq__item h3{ font-size:inherit; }
.blk-faq__btn{ display:flex; align-items:center; justify-content:space-between; gap:24px; width:100%; min-height:72px; padding:18px 0; text-align:left; font:var(--at-display-weight) var(--at-fs-h4)/1.3 var(--at-font-display); letter-spacing:-.01em; color:var(--at-ink); transition:color var(--at-d-base); }
.blk-faq__btn:hover{ color:var(--at-accent-text); }
.blk-faq__ico{ position:relative; flex:none; display:grid; place-items:center; width:40px; height:40px; border-radius:50%; border:1px solid var(--at-line-strong); transition:background-color var(--at-d-base), border-color var(--at-d-base), color var(--at-d-base), transform var(--at-d-slow) var(--at-ease-out); }
.blk-faq__ico svg{ width:16px; height:16px; }
.blk-faq__btn[aria-expanded=true] .blk-faq__ico{ transform:rotate(45deg); background:var(--at-ink); border-color:var(--at-ink); color:var(--at-bg); }
.blk-faq__panel{ display:grid; grid-template-rows:1fr; transition:grid-template-rows var(--at-d-slow) var(--at-ease-out); }
.blk-faq__panel > div{ overflow:hidden; }
.blk-faq__panel p{ max-width:62ch; padding:0 64px 24px 0; color:var(--at-ink-2); }
.js .blk-faq__panel{ grid-template-rows:0fr; }
.js .blk-faq__panel > div{ visibility:hidden; transition:visibility 0s linear var(--at-d-slow); }
.js .blk-faq__item.is-open .blk-faq__panel{ grid-template-rows:1fr; }
.js .blk-faq__item.is-open .blk-faq__panel > div{ visibility:visible; transition-delay:0s; }
@media (max-width:63.99em){ .blk-faq__head{ grid-column:1 / -1; position:static; } .blk-faq__list{ grid-column:1 / -1; } .blk-faq__panel p{ padding-right:0; } }

/* ============ upit (forma upita za uslugu, panel) ============ */
.blk-upit__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); }
.blk-upit__info{ grid-column:1 / span 5; display:grid; gap:16px; align-content:start; }
.blk-upit__steps{ display:grid; margin-top:12px; border-top:1px solid var(--at-line); counter-reset:u; }
.blk-upit__steps li{ display:grid; grid-template-columns:40px minmax(0,1fr); gap:2px 12px; padding:16px 0; border-bottom:1px solid var(--at-line); counter-increment:u; }
.blk-upit__steps li::before{ content:"0" counter(u); grid-row:span 2; font:600 var(--at-fs-small)/1.6 var(--at-font-display); color:var(--at-accent-text); }
.blk-upit__steps b{ font-weight:600; color:var(--at-ink); }
.blk-upit__steps span{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-upit__tel{ display:inline-flex; align-items:center; gap:10px; margin-top:8px; font:var(--at-display-weight) var(--at-fs-h4)/1 var(--at-font-display); color:var(--at-ink); width:fit-content; }
.blk-upit__tel svg{ width:20px; height:20px; color:var(--at-accent-text); }
.blk-upit__tel:hover{ color:var(--at-accent-text); }
.blk-upit__form{ grid-column:7 / -1; align-self:start; padding:clamp(24px, 1rem + 2.4vw, 48px); border-radius:var(--at-radius-lg); background:var(--at-surface); border:1px solid var(--at-line); }
.blk-upit__form select{ appearance:none; padding-right:44px; background-image:linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position:calc(100% - 22px) 50%, calc(100% - 17px) 50%; background-size:5px 5px; background-repeat:no-repeat; }
@media (max-width:63.99em){ .blk-upit__info,.blk-upit__form{ grid-column:1 / -1; } }

/* ===== izvor: dizajn/assets/blocks-blog-kontakt.css ===== */
/* =====================================================================
   LEONIDIS - blocks-blog-kontakt.css (talas 2: blog, objava, kontakt)
   Učitava se POSLE blocks.css. Samo var(--at-*), nula zakucanih boja.
   Komponente (+ LX): .at-chip · .at-search · .at-pagination · .at-post-meta ·
   .at-avatar · .at-status · .at-choice · .at-file · .at-input-suf
   Blokovi: blog-istaknuto · blog-lista · objava · kontakt-upit ·
   kontakt-lokacije · kontakt-faq
   ===================================================================== */

/* ---------------- Komponente ---------------- */

/* Čip filtera (aria-pressed) */
.at-chip{ display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 16px; flex:none; border:1px solid var(--at-line-strong); border-radius:var(--at-radius-pill); font:600 var(--at-fs-small)/1 var(--at-font-body); color:var(--at-ink); white-space:nowrap; transition:background-color var(--at-d-base) var(--at-ease-out), color var(--at-d-base), border-color var(--at-d-base); }
.at-chip:hover{ border-color:var(--at-ink); }
.at-chip[aria-pressed=true]{ background:var(--at-ink); border-color:var(--at-ink); color:var(--at-bg); }
[data-bg=panel] .at-chip[aria-pressed=true]{ color:var(--at-panel); }
.at-chip__n{ font-size:var(--at-fs-micro); font-variant-numeric:tabular-nums; color:var(--at-muted); transition:color var(--at-d-base); }
.at-chip[aria-pressed=true] .at-chip__n{ color:inherit; opacity:.72; }

/* Pretraga */
.at-search{ position:relative; display:flex; align-items:center; }
.at-search > svg{ position:absolute; left:16px; width:18px; height:18px; color:var(--at-muted); pointer-events:none; }
.at-search input{ width:100%; height:48px; padding:0 48px 0 46px; border:1px solid var(--at-line-strong); border-radius:var(--at-radius-pill); background:var(--at-surface); color:var(--at-ink); transition:border-color var(--at-d-fast), box-shadow var(--at-d-fast); }
.at-search input::placeholder{ color:var(--at-muted); }
.at-search input::-webkit-search-cancel-button{ -webkit-appearance:none; appearance:none; }
.at-search input:hover{ border-color:var(--at-ink); }
.at-search input:focus{ outline:none; border-color:var(--at-accent-text); box-shadow:var(--at-ring); }
.at-search__clear{ position:absolute; right:6px; display:grid; place-items:center; width:36px; height:36px; border-radius:50%; color:var(--at-muted); transition:background-color var(--at-d-base), color var(--at-d-base); }
.at-search__clear:hover{ background:var(--at-surface-2); color:var(--at-ink); }
.at-search__clear svg{ width:16px; height:16px; transform:rotate(45deg); }

/* Numerička paginacija */
.at-pagination{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:var(--at-s-8); padding-top:var(--at-s-6); border-top:1px solid var(--at-line); }
.at-pagination ol{ display:flex; align-items:center; gap:4px; }
.at-pagination__n{ display:grid; place-items:center; min-width:44px; height:44px; padding:0 6px; border-radius:var(--at-radius-pill); font:600 .9375rem/1 var(--at-font-display); font-variant-numeric:tabular-nums; color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base); }
a.at-pagination__n:hover{ background:color-mix(in srgb, var(--at-ink) 8%, transparent); }
.at-pagination__n[aria-current=page]{ background:var(--at-ink); color:var(--at-bg); }
.at-pagination__gap{ padding:0 6px; color:var(--at-muted); }
.at-pagination .at-link[aria-disabled=true]{ opacity:.35; pointer-events:none; }
@media (max-width:47.99em){ .at-pagination__txt{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; } }

/* Avatar (inicijali ili fotografija) */
.at-avatar{ display:grid; place-items:center; width:44px; height:44px; flex:none; overflow:hidden; border-radius:50%; background:var(--at-accent-soft); color:var(--at-accent-text); font:600 .875rem/1 var(--at-font-display); }
.at-avatar img{ width:100%; height:100%; object-fit:cover; }
.at-avatar--lg{ width:88px; height:88px; font-size:1.375rem; }
[data-bg=panel] .at-avatar{ background:color-mix(in srgb, var(--at-panel-ink) 12%, var(--at-panel)); color:var(--at-ink); }

/* Meta objave (page-header objave) */
.at-post-meta{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px 24px; width:100%; padding-top:20px; border-top:1px solid var(--at-line); }
.at-post-meta dt{ margin-bottom:6px; font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.at-post-meta dd{ font-weight:500; color:var(--at-ink); }
.at-post-meta dd a{ color:var(--at-accent-text); font-weight:600; }
.at-post-meta dd a:hover{ text-decoration:underline; text-underline-offset:3px; }
.at-post-meta__who{ display:flex; align-items:center; gap:10px; }
.at-post-meta__who .at-avatar{ width:32px; height:32px; font-size:.75rem; }

/* Status radnog vremena (JS: [data-open-status]) */
.at-status{ display:inline-flex; align-items:center; gap:10px; min-height:40px; padding:8px 16px 8px 14px; border:1px solid var(--at-line); border-radius:var(--at-radius-pill); background:var(--at-surface); font:600 var(--at-fs-small)/1.3 var(--at-font-body); color:var(--at-ink); }
.at-status__dot{ position:relative; width:8px; height:8px; flex:none; border-radius:50%; background:var(--at-muted); }
.at-status.is-open .at-status__dot{ background:var(--at-success); }
.at-status.is-open .at-status__dot::after{ content:""; position:absolute; inset:-5px; border-radius:50%; border:1.5px solid var(--at-success); animation:blk-ping 2.4s var(--at-ease-out) infinite; }

/* Izbor (radio pločica) */
.at-choices{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 196px), 1fr)); gap:10px; }
.at-choices--row{ grid-template-columns:repeat(auto-fit, minmax(min(100%, 140px), 1fr)); }
.at-choice{ position:relative; display:grid; align-content:start; gap:4px; padding:16px 16px 16px 48px; border:1px solid var(--at-line-strong); border-radius:var(--at-radius-md); background:var(--at-surface); cursor:pointer; transition:border-color var(--at-d-base), background-color var(--at-d-base), box-shadow var(--at-d-base), transform var(--at-d-base) var(--at-ease-out); }
.at-choice:hover{ border-color:var(--at-ink); }
.at-choice:active{ transform:scale(.985); }
.at-choice input,.at-field .at-choice input{ position:absolute; left:16px; top:17px; appearance:none; width:20px; height:20px; min-height:0; padding:0; margin:0; border:1.5px solid var(--at-line-strong); border-radius:50%; background:var(--at-surface); display:grid; place-content:center; cursor:pointer; transition:background-color var(--at-d-base), border-color var(--at-d-base); }
.at-choice input::after{ content:""; width:8px; height:8px; border-radius:50%; background:var(--at-accent-ink); transform:scale(0); transition:transform var(--at-d-base) var(--at-ease-spring); }
.at-choice input:checked{ background:var(--at-accent); border-color:var(--at-accent); }
.at-choice input:checked::after{ transform:scale(1); }
.at-choice input:focus-visible{ outline:none; }
.at-choice:has(input:focus-visible){ outline:2px solid var(--at-focus); outline-offset:3px; }
.at-choice:has(input:checked){ border-color:var(--at-accent-text); background:color-mix(in srgb, var(--at-accent-soft) 60%, var(--at-surface)); box-shadow:inset 0 0 0 1px var(--at-accent-text); }
.at-choice__t{ font-weight:600; line-height:1.3; color:var(--at-ink); }
.at-choice__d{ font-size:var(--at-fs-small); line-height:1.4; color:var(--at-muted); }
.at-choice--sm{ padding:13px 14px 13px 46px; }
.at-choice--sm input{ top:13px; }
.at-field.is-invalid .at-choice{ border-color:var(--at-danger); }
.at-field.is-invalid .at-check input{ border-color:var(--at-danger); }
.at-field .at-check input{ width:20px; min-height:0; padding:0; }
.at-field .at-check input:focus{ box-shadow:var(--at-ring); }

/* Polje sa sufiksom (m²) i select sa strelicom od tokena */
.at-input-suf{ position:relative; }
.at-input-suf input{ padding-right:52px; }
.at-input-suf span{ position:absolute; right:16px; top:50%; transform:translateY(-50%); font-size:var(--at-fs-small); color:var(--at-muted); pointer-events:none; }
.at-field select{ appearance:none; padding-right:44px; cursor:pointer;
  background-image:linear-gradient(45deg, transparent 50%, var(--at-ink) 50%), linear-gradient(135deg, var(--at-ink) 50%, transparent 50%);
  background-position:calc(100% - 22px) 50%, calc(100% - 17px) 50%; background-size:5px 5px; background-repeat:no-repeat; }
.at-field__hint{ font-size:var(--at-fs-small); color:var(--at-muted); }
.at-field__foot{ display:flex; justify-content:space-between; gap:16px; }
.at-field__count{ margin-left:auto; font-size:var(--at-fs-small); color:var(--at-muted); font-variant-numeric:tabular-nums; }

/* Prilog (fajl) */
.at-file{ position:relative; display:flex; align-items:center; gap:14px; min-height:var(--at-input-h); padding:6px 16px 6px 6px; border:1px dashed var(--at-line-strong); border-radius:var(--at-radius-sm); background:var(--at-surface); cursor:pointer; transition:border-color var(--at-d-fast), background-color var(--at-d-fast); }
.at-file:hover{ border-color:var(--at-ink); }
.at-file input{ position:absolute; inset:0; width:100%; opacity:0; cursor:pointer; }
.at-file:has(input:focus-visible){ outline:2px solid var(--at-focus); outline-offset:3px; }
.at-file__btn{ flex:none; padding:10px 16px; border-radius:calc(var(--at-radius-sm) - 1px); background:var(--at-surface-2); font:600 var(--at-fs-small)/1.2 var(--at-font-body); color:var(--at-ink); }
.at-file__name{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--at-fs-small); color:var(--at-muted); }
.at-file.has-file{ border-style:solid; }
.at-file.has-file .at-file__name{ color:var(--at-ink); }

/* Page-header: tipografski ulaz se otkriva na učitavanje (unutrašnje strane) */
.js .blk-page-header__grid > *{ animation:blk-fade 900ms var(--at-ease-out) both; animation-delay:calc(80ms + var(--i,0) * 110ms); }
.blk-page-header__aside .at-small{ color:var(--at-muted); }

/* ============ blog-istaknuto (editorijal: velika foto + tekst + najčitanije) ============ */
.blk-blog-istaknuto__main{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); align-items:center; }
.blk-blog-istaknuto__media{ --cx:50%; --cy:50%; position:relative; grid-column:1 / span 7; display:block; aspect-ratio:4/3; overflow:hidden; border-radius:var(--at-radius-lg); background:var(--at-surface-2); }
.blk-blog-istaknuto__media img{ width:100%; height:100%; object-fit:cover; }
.blk-blog-istaknuto__tag{ position:absolute; left:20px; top:20px; padding:8px 14px; border-radius:var(--at-radius-pill); background:var(--at-surface); font:600 var(--at-fs-micro)/1 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-ink); }
.blk-blog-istaknuto__cursor{ position:absolute; left:0; top:0; display:grid; place-items:center; width:116px; height:116px; margin:-58px 0 0 -58px; border-radius:50%; background:var(--at-accent); color:var(--at-accent-ink); font:600 .9375rem/1 var(--at-font-display); pointer-events:none; transform:translate(var(--cx), var(--cy)) scale(0); transition:transform 520ms var(--at-ease-out); }
@media (hover:hover) and (pointer:fine){
  .blk-blog-istaknuto__media{ cursor:none; }
  .blk-blog-istaknuto__media.is-hover .blk-blog-istaknuto__cursor{ transform:translate(var(--cx), var(--cy)) scale(1); }
}
@media (hover:none){ .blk-blog-istaknuto__cursor{ display:none; } }
.blk-blog-istaknuto__body{ grid-column:8 / -1; padding-left:clamp(0px, 2vw, 32px); display:grid; gap:18px; justify-items:start; }
.blk-blog-istaknuto__title{ font-size:var(--at-fs-h2); line-height:var(--at-lh-h2); }
.blk-blog-istaknuto__title a{ background:linear-gradient(currentColor,currentColor) left 100%/0% 2px no-repeat; transition:background-size var(--at-d-slow) var(--at-ease-out); }
.blk-blog-istaknuto__title a:hover{ background-size:100% 2px; }
.blk-blog-istaknuto__by{ display:flex; align-items:center; gap:12px; width:100%; padding-top:18px; border-top:1px solid var(--at-line); }
.blk-blog-istaknuto__by strong{ display:block; font-weight:600; color:var(--at-ink); }
.blk-blog-istaknuto__by small{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-blog-istaknuto__top{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-5) var(--at-gap); margin-top:var(--at-s-8); padding-top:var(--at-s-6); border-top:1px solid var(--at-line); }
.blk-blog-istaknuto__label{ grid-column:1 / span 3; align-self:start; }
.blk-blog-istaknuto__top ol{ grid-column:4 / -1; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--at-gap); }
.blk-blog-istaknuto__top a{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px 16px; }
.blk-blog-istaknuto__n{ grid-row:span 2; font:var(--at-display-weight) var(--at-fs-num)/1 var(--at-font-display); color:var(--at-accent-text); font-variant-numeric:tabular-nums; }
.blk-blog-istaknuto__top strong{ font:600 1.0625rem/1.35 var(--at-font-display); letter-spacing:-.01em; color:var(--at-ink); text-wrap:balance; }
.blk-blog-istaknuto__top strong span{ background:linear-gradient(currentColor,currentColor) left 100%/0% 1.5px no-repeat; transition:background-size var(--at-d-slow) var(--at-ease-out); }
.blk-blog-istaknuto__top a:hover strong span{ background-size:100% 1.5px; }
.blk-blog-istaknuto__top small{ font-size:var(--at-fs-small); color:var(--at-muted); }
@media (max-width:63.99em){
  .blk-blog-istaknuto__media,.blk-blog-istaknuto__body{ grid-column:1 / -1; }
  .blk-blog-istaknuto__media{ aspect-ratio:3/2; }
  .blk-blog-istaknuto__label,.blk-blog-istaknuto__top ol{ grid-column:1 / -1; }
}
@media (max-width:47.99em){
  .blk-blog-istaknuto__top ol{ grid-template-columns:1fr; gap:0; }
  .blk-blog-istaknuto__top li + li{ border-top:1px solid var(--at-line); }
  .blk-blog-istaknuto__top a{ padding-block:16px; }
}

/* ============ blog-lista (čipovi + pretraga + mreža + paginacija) ============ */
.blk-blog-lista{ padding-top:var(--at-section-md); }
.blk-blog-lista__head{ display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:12px 32px; margin-bottom:var(--at-s-6); }
.blk-blog-lista__count{ font-size:var(--at-fs-small); color:var(--at-muted); font-variant-numeric:tabular-nums; }
.blk-blog-lista__count b{ color:var(--at-ink); font-weight:600; }
.blk-blog-lista__bar{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px 24px; padding-bottom:var(--at-s-6); margin-bottom:var(--at-s-7); border-bottom:1px solid var(--at-line); }
.blk-blog-lista__chips{ display:flex; flex-wrap:wrap; gap:8px; }
.blk-blog-lista .at-search{ width:min(100%, 340px); }
.blk-blog-lista__grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--at-s-8) var(--at-gap); transition:opacity 180ms var(--at-ease-out), transform 180ms var(--at-ease-out); }
.blk-blog-lista__grid.is-leaving{ opacity:0; transform:translateY(8px); }
.blk-blog-lista__grid.is-entering .at-post-card{ animation:blk-bl-in 640ms var(--at-ease-out) both; animation-delay:calc(min(var(--i,0), 8) * 60ms); }
@keyframes blk-bl-in{ from{ opacity:0; transform:translateY(22px); } }
.blk-blog-lista .at-post-card__meta span + time::before,.blk-blog-lista .at-post-card__meta time + span::before{ content:"·"; margin-right:12px; margin-left:-2px; color:var(--at-line-strong); }
.blk-blog-lista__empty{ display:grid; justify-items:center; gap:16px; padding:var(--at-s-9) 0; text-align:center; }
.blk-blog-lista__empty strong{ display:block; margin-bottom:4px; font:var(--at-display-weight) var(--at-fs-h4)/1.3 var(--at-font-display); color:var(--at-ink); }
@media (max-width:63.99em){ .blk-blog-lista__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:47.99em){
  .blk-blog-lista__bar{ gap:16px; }
  .blk-blog-lista__chips{ flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; width:calc(100% + 2 * var(--at-gutter)); margin-inline:calc(var(--at-gutter) * -1); padding:2px var(--at-gutter); }
  .blk-blog-lista__chips::-webkit-scrollbar{ display:none; }
  .blk-blog-lista .at-search{ width:100%; }
  .blk-blog-lista__grid{ grid-template-columns:1fr; gap:var(--at-s-7); }
}

/* ============ objava (naslovna slika + sadržaj | tekst | deljenje) ============ */
.blk.blk-page-header[data-bg] + .blk.blk-objava[data-bg],
.waap_component_wrapper:has(> .blk.blk-page-header[data-bg]:last-child) + .waap_component_wrapper > .blk.blk-objava[data-bg]:first-child{ border-top:0; }
.blk-objava{ --rp:0; padding-top:0; }
.blk-objava__bar{ position:fixed; left:0; right:0; top:0; z-index:calc(var(--at-z-header) + 1); height:3px; background:var(--at-accent-text); transform:scaleX(var(--rp)); transform-origin:left; pointer-events:none; }
.blk-objava__cover{ margin-bottom:var(--at-section-sm); }
.blk-objava__cover > div{ aspect-ratio:2/1; overflow:hidden; border-radius:var(--at-radius-lg); background:var(--at-surface-2); }
.blk-objava__cover img{ width:100%; height:100%; object-fit:cover; }
.js .blk-objava__cover > div{ animation:blk-cover 1.2s var(--at-ease-out) both .15s; }
.js .blk-objava__cover img{ animation:blk-cover-img 1.6s var(--at-ease-out) both .15s; }
@keyframes blk-cover{ from{ clip-path:inset(8% 6% 0 6% round var(--at-radius-lg)); } to{ clip-path:inset(0 0 0 0 round var(--at-radius-lg)); } }
@keyframes blk-cover-img{ from{ transform:scale(1.12); } }
.blk-objava__cover figcaption{ margin-top:10px; font-size:var(--at-fs-small); color:var(--at-muted); text-align:right; }

.blk-objava__layout{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,660px) minmax(0,1fr); gap:var(--at-s-8); align-items:start; }
.blk-objava__toc{ grid-column:1; position:sticky; top:calc(var(--at-header-h-stuck) + 32px); display:grid; gap:16px; }
.blk-objava__toc-h{ font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-objava__toc-btn{ display:none; }
.blk-objava__toc-list{ display:grid; }
.blk-objava__toc-list > div{ min-height:0; }
.blk-objava__toc ol{ display:grid; border-left:1px solid var(--at-line); }
.blk-objava__toc a{ position:relative; display:block; padding:8px 0 8px 16px; font-size:var(--at-fs-small); line-height:1.4; color:var(--at-muted); transition:color var(--at-d-base); }
.blk-objava__toc a::before{ content:""; position:absolute; left:-1px; top:0; bottom:0; width:2px; background:var(--at-accent-text); transform:scaleY(0); transform-origin:top; transition:transform var(--at-d-slow) var(--at-ease-out); }
.blk-objava__toc a:hover{ color:var(--at-ink); }
.blk-objava__toc a[aria-current]{ color:var(--at-ink); font-weight:600; }
.blk-objava__toc a[aria-current]::before{ transform:scaleY(1); }
.blk-objava__pct{ display:flex; align-items:center; gap:10px; font-size:var(--at-fs-small); color:var(--at-muted); font-variant-numeric:tabular-nums; }
.blk-objava__ring{ width:28px; height:28px; transform:rotate(-90deg); }
.blk-objava__ring circle{ fill:none; stroke-width:3; }
.blk-objava__ring circle:first-child{ stroke:var(--at-line); }
.blk-objava__ring circle + circle{ stroke:var(--at-accent-text); stroke-dasharray:100; stroke-dashoffset:calc(100 - var(--rp) * 100); stroke-linecap:round; }

.blk-objava__body{ grid-column:2; max-width:none; }
.blk-objava__body > .blk-objava__lede{ font-size:var(--at-fs-lead); line-height:1.6; color:var(--at-ink); }
.blk-objava__body h2{ scroll-margin-top:calc(var(--at-header-h-stuck) + 32px); }
.blk-objava__sum{ padding:24px 28px; border-radius:var(--at-radius-md); background:var(--at-surface-2); }
.blk-objava__sum p{ margin-bottom:14px; }
.at-prose .blk-objava__sum ul{ list-style:none; padding:0; display:grid; gap:10px; }
.blk-objava__sum li{ position:relative; padding-left:28px; color:var(--at-ink); }
.blk-objava__sum li::before{ content:""; position:absolute; left:2px; top:.5em; width:12px; height:7px; border:2px solid var(--at-accent-text); border-top:0; border-right:0; transform:rotate(-45deg); }
.at-prose .blk-objava__pull{ margin-block:2.2em; padding:28px 0 0; border-top:1px solid var(--at-line-strong); }
.at-prose .blk-objava__pull blockquote{ border:0; padding:0; }
.blk-objava__pull p{ position:relative; font:var(--at-display-weight) clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem)/1.2 var(--at-font-display); letter-spacing:var(--at-display-tracking); color:var(--at-ink); text-wrap:balance; }
.blk-objava__pull p::before{ content:""; position:absolute; left:0; top:-29px; width:64px; height:3px; background:var(--at-accent-text); }
.blk-objava__pull cite{ display:block; margin-top:14px; font:500 var(--at-fs-small)/1.4 var(--at-font-body); font-style:normal; color:var(--at-muted); }
.blk-objava__body figure img{ width:100%; aspect-ratio:3/2; object-fit:cover; }
.blk-objava__body .at-table{ border:1px solid var(--at-line); border-radius:var(--at-radius-md); }
.blk-objava__body table{ min-width:520px; }
.blk-objava__body thead th{ background:var(--at-surface-2); font-weight:600; color:var(--at-ink); }
.blk-objava__body tbody tr:last-child td{ border-bottom:0; }
.blk-objava__body td:first-child{ font-weight:600; color:var(--at-ink); }
.blk-objava__body ol li::marker{ font-family:var(--at-font-display); font-weight:600; color:var(--at-accent-text); }
.blk-objava__body li + li{ margin-top:.45em; }

.blk-objava__share{ grid-column:3; position:sticky; top:calc(var(--at-header-h-stuck) + 32px); display:grid; gap:12px; justify-items:start; }
.blk-objava__share-h{ font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-objava__social{ flex-direction:column; }
.blk-objava__social button{ display:grid; place-items:center; width:44px; height:44px; border-radius:50%; border:1px solid var(--at-line); color:var(--at-ink); transition:background-color var(--at-d-base), color var(--at-d-base), border-color var(--at-d-base), transform var(--at-d-base) var(--at-ease-out); }
.blk-objava__social button:hover{ background:var(--at-ink); color:var(--at-bg); border-color:var(--at-ink); transform:translateY(-2px); }
.blk-objava__social button.is-done{ background:var(--at-success); border-color:var(--at-success); color:var(--at-accent-ink); }
.blk-objava__social svg{ width:18px; height:18px; }
.blk-objava__copied{ min-height:1.4em; font-size:var(--at-fs-small); color:var(--at-success); }

.blk-objava__after{ width:min(100% - 2 * var(--at-gutter), 660px); margin:var(--at-s-8) auto 0; }
.blk-objava__author{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px 24px; padding:clamp(20px, 1rem + 1.2vw, 32px); border-radius:var(--at-radius-lg); background:var(--at-surface-2); }
.blk-objava__author .at-avatar{ grid-row:span 3; }
.blk-objava__author h2{ font-size:var(--at-fs-h4); line-height:1.3; }
.blk-objava__author small{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-objava__author p{ margin-top:6px; }
.blk-objava__author .at-link{ grid-column:2; justify-self:start; margin-top:4px; }
.blk-objava__pn{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--at-gap); margin-top:var(--at-s-7); padding-top:var(--at-s-5); border-top:1px solid var(--at-line); }
.blk-objava__pn a{ display:grid; gap:8px; align-content:start; padding-block:8px; }
.blk-objava__pn a + a{ justify-items:end; text-align:right; }
.blk-objava__pn small{ display:inline-flex; align-items:center; gap:8px; font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-objava__pn small svg{ width:16px; height:16px; transition:transform var(--at-d-slow) var(--at-ease-out); }
.blk-objava__pn strong{ font:var(--at-display-weight) var(--at-fs-h4)/1.3 var(--at-font-display); letter-spacing:-.01em; color:var(--at-ink); text-wrap:balance; transition:color var(--at-d-base); }
.blk-objava__pn a:hover strong{ color:var(--at-accent-text); }
.blk-objava__pn a:first-child:hover svg{ transform:translateX(-4px); }
.blk-objava__pn a + a:hover svg{ transform:translateX(4px); }

@media (max-width:79.99em){ .blk-objava__layout{ gap:var(--at-s-6); } }
@media (max-width:63.99em){
  .blk-objava__layout{ grid-template-columns:minmax(0,1fr); max-width:660px; margin-inline:auto; }
  .blk-objava__toc,.blk-objava__body,.blk-objava__share{ grid-column:1; position:static; }
  .blk-objava__toc{ gap:0; padding:4px 20px; border:1px solid var(--at-line); border-radius:var(--at-radius-md); background:var(--at-surface); }
  .blk-objava__toc-h,.blk-objava__pct{ display:none; }
  .blk-objava__toc-btn{ display:flex; align-items:center; justify-content:space-between; width:100%; min-height:52px; font-weight:600; color:var(--at-ink); }
  .blk-objava__toc-btn svg{ width:18px; height:18px; transition:transform var(--at-d-slow) var(--at-ease-out); }
  .blk-objava__toc-btn[aria-expanded=true] svg{ transform:rotate(45deg); }
  .blk-objava__toc-list{ grid-template-rows:0fr; transition:grid-template-rows var(--at-d-slow) var(--at-ease-out); }
  .blk-objava__toc-list > div{ overflow:hidden; }
  .blk-objava__toc-list.is-open{ grid-template-rows:1fr; }
  .blk-objava__toc ol{ margin-bottom:16px; }
  .blk-objava__share{ grid-auto-flow:column; justify-content:start; align-items:center; gap:16px; padding-top:var(--at-s-5); border-top:1px solid var(--at-line); }
  .blk-objava__social{ flex-direction:row; }
  .blk-objava__cover > div{ aspect-ratio:3/2; }
}
@media (max-width:47.99em){
  .blk-objava__share{ grid-auto-flow:row; }
  .blk-objava__author{ grid-template-columns:1fr; }
  .blk-objava__author .at-avatar{ grid-row:auto; width:64px; height:64px; }
  .blk-objava__author .at-link{ grid-column:1; }
  .blk-objava__pn{ grid-template-columns:1fr; }
  .blk-objava__pn a + a{ justify-items:start; text-align:left; border-top:1px solid var(--at-line); padding-top:16px; }
}

/* ============ kontakt-upit (forma u prvom planu + direktan kontakt) ============ */
.blk-kontakt-upit__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); align-items:start; }
.blk-kontakt-upit__card{ grid-column:1 / span 7; padding:clamp(22px, 1rem + 2.4vw, 48px); border-radius:var(--at-radius-lg); background:var(--at-surface); border:1px solid var(--at-line); }
.blk-kontakt-upit__top{ display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:10px 24px; padding-bottom:28px; }
.blk-kontakt-upit__top h2{ font-size:var(--at-fs-h3); line-height:var(--at-lh-h3); }
.blk-kontakt-upit__mtext{ font-size:var(--at-fs-small); color:var(--at-muted); font-variant-numeric:tabular-nums; }
.blk-kontakt-upit__meter{ grid-column:1 / -1; height:4px; overflow:hidden; border-radius:var(--at-radius-pill); background:var(--at-surface-2); }
.blk-kontakt-upit__meter span{ display:block; height:100%; border-radius:inherit; background:var(--at-accent-text); transform:scaleX(var(--fp, 0)); transform-origin:left; transition:transform 600ms var(--at-ease-out); }
.blk-kontakt-upit__summary{ display:grid; gap:6px; margin-bottom:24px; padding:16px 20px; border-radius:var(--at-radius-md); background:var(--at-danger-soft); color:var(--at-ink); }
.blk-kontakt-upit__summary strong{ font-weight:600; }
.blk-kontakt-upit__summary ul{ display:flex; flex-wrap:wrap; gap:4px 16px; font-size:var(--at-fs-small); }
.blk-kontakt-upit__summary a{ color:var(--at-danger); font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.blk-kontakt-upit__form{ gap:0; counter-reset:fs; }
.blk-kontakt-upit__form > .blk-kontakt-upit__fs:first-child{ padding-top:4px; border-top:0; }
.blk-kontakt-upit__fs{ min-width:0; margin:0; padding:28px 0; border:0; border-top:1px solid var(--at-line); counter-increment:fs; }
.blk-kontakt-upit__fs legend{ float:left; width:100%; display:flex; align-items:baseline; gap:12px; margin-bottom:18px; padding:0; font:var(--at-display-weight) var(--at-fs-h4)/1.3 var(--at-font-display); letter-spacing:-.01em; color:var(--at-ink); }
.blk-kontakt-upit__fs legend small{ margin-left:auto; font:500 var(--at-fs-small)/1.3 var(--at-font-body); letter-spacing:0; color:var(--at-muted); }
.blk-kontakt-upit__no{ font:600 var(--at-fs-small)/1 var(--at-font-display); color:var(--at-accent-text); font-variant-numeric:tabular-nums; }
.blk-kontakt-upit__no::before{ content:"0" counter(fs); }
.blk-kontakt-upit__fields{ clear:both; display:grid; grid-template-columns:minmax(0,1fr); gap:var(--at-s-5); }
.blk-kontakt-upit__fields .at-field{ grid-template-columns:minmax(0,1fr); }
.blk-kontakt-upit__col{ display:grid; grid-template-rows:1fr; transition:grid-template-rows var(--at-d-slow) var(--at-ease-out), opacity var(--at-d-slow) var(--at-ease-out); }
.blk-kontakt-upit__col > .blk-kontakt-upit__fs{ min-height:0; overflow:clip; overflow-clip-margin:6px; }
.blk-kontakt-upit__col.is-off{ grid-template-rows:0fr; opacity:0; }
.blk-kontakt-upit__col.is-off > .blk-kontakt-upit__fs{ counter-increment:none; padding-block:0; border-top-color:transparent; }
.blk-kontakt-upit__send{ display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; padding-top:28px; border-top:1px solid var(--at-line); }
.blk-kontakt-upit__send p{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-kontakt-upit__consent{ padding-bottom:24px; }
.blk-kontakt-upit__ok{ display:grid; justify-items:start; gap:16px; padding-block:var(--at-s-6); outline:none; }
.blk-kontakt-upit__ok svg{ width:72px; height:72px; color:var(--at-success); }
.blk-kontakt-upit__ok circle,.blk-kontakt-upit__ok path{ fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:100; animation:blk-draw 900ms var(--at-ease-out) both; }
.blk-kontakt-upit__ok path{ animation-delay:450ms; }
@keyframes blk-draw{ from{ stroke-dashoffset:100; } to{ stroke-dashoffset:0; } }
.blk-kontakt-upit__ok h3{ font-size:var(--at-fs-h3); }
.blk-kontakt-upit__ok p{ max-width:48ch; }
.blk-kontakt-upit__ok b{ color:var(--at-ink); font-weight:600; }

.blk-kontakt-upit__aside{ grid-column:9 / -1; position:sticky; top:calc(var(--at-header-h-stuck) + 24px); display:grid; gap:28px; padding:clamp(22px, 1rem + 2vw, 40px); border-radius:var(--at-radius-lg); }
.blk-kontakt-upit__big{ display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:6px 16px; padding-block:16px; border-bottom:1px solid var(--at-line); }
.blk-kontakt-upit__big small{ grid-column:1 / -1; font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-kontakt-upit__big span{ font:var(--at-display-weight) clamp(1.25rem, 1rem + .9vw, 1.75rem)/1.15 var(--at-font-display); letter-spacing:var(--at-display-tracking); color:var(--at-ink); overflow-wrap:anywhere; transition:color var(--at-d-base); }
.blk-kontakt-upit__big svg{ width:44px; height:44px; padding:12px; border:1px solid var(--at-line-strong); border-radius:50%; color:var(--at-ink); transition:background-color var(--at-d-base), border-color var(--at-d-base), color var(--at-d-base), transform var(--at-d-slow) var(--at-ease-out); }
.blk-kontakt-upit__big:hover span{ color:var(--at-accent-text); }
.blk-kontakt-upit__big:hover svg{ background:var(--at-accent); border-color:var(--at-accent); color:var(--at-accent-ink); transform:rotate(45deg); }
.blk-kontakt-upit__sub{ font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); margin-bottom:14px; }
.blk-kontakt-upit__people{ display:grid; gap:18px; }
.blk-kontakt-upit__people li{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:2px 14px; align-items:center; }
.blk-kontakt-upit__people .at-avatar{ grid-row:span 3; }
.blk-kontakt-upit__people strong{ font-weight:600; color:var(--at-ink); }
.blk-kontakt-upit__people small{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-kontakt-upit__people a{ width:fit-content; font-size:var(--at-fs-small); font-weight:600; color:var(--at-ink); }
.blk-kontakt-upit__people a:hover{ color:var(--at-accent-text); }
.blk-kontakt-upit__hours table{ width:100%; border-collapse:collapse; font-size:var(--at-fs-small); }
.blk-kontakt-upit__hours td{ padding:10px 0; border-top:1px solid var(--at-line); }
.blk-kontakt-upit__hours td + td{ text-align:right; color:var(--at-ink); font-variant-numeric:tabular-nums; }
.blk-kontakt-upit__hours tr.is-today td{ color:var(--at-ink); font-weight:600; }
.blk-kontakt-upit__hours tr.is-today td:first-child::after{ content:"danas"; margin-left:10px; padding:3px 8px; border-radius:var(--at-radius-pill); background:var(--at-accent-text); color:var(--at-panel); font-size:var(--at-fs-micro); font-weight:600; }
@media (max-width:63.99em){
  .blk-kontakt-upit__card,.blk-kontakt-upit__aside{ grid-column:1 / -1; }
  .blk-kontakt-upit__aside{ position:static; }
}
@media (max-width:47.99em){
  .blk-kontakt-upit__card{ margin-inline:calc(var(--at-gutter) * -.5); }
  .blk-kontakt-upit__top{ grid-template-columns:1fr; }
  .blk-kontakt-upit__send .at-btn{ width:100%; }
  .blk-kontakt-upit__fs legend small{ display:none; }
  .at-choices:not(.at-choices--row){ grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
  .at-choice{ padding:14px 12px 14px 42px; }
  .at-choice input,.at-field .at-choice input{ left:12px; top:15px; }
}

/* ============ kontakt-lokacije (stilizovana mapa koja „putuje" između lokacija) ============ */
.blk-kontakt-lokacije__tabs{ display:inline-flex; gap:4px; padding:4px; border:1px solid var(--at-line); border-radius:var(--at-radius-pill); }
.blk-kontakt-lokacije__tabs button{ min-height:44px; padding:0 20px; border-radius:var(--at-radius-pill); font-weight:600; font-size:.9375rem; color:var(--at-muted); white-space:nowrap; transition:background-color var(--at-d-base), color var(--at-d-base); }
.blk-kontakt-lokacije__tabs button:hover{ color:var(--at-ink); }
.blk-kontakt-lokacije__tabs button[aria-selected=true]{ background:var(--at-ink); color:var(--at-bg); }
.blk-kontakt-lokacije__stage{ --px:0%; --py:0%; position:relative; aspect-ratio:21/9; min-height:460px; isolation:isolate; }
.blk-kontakt-lokacije__viewport{ position:absolute; inset:0; overflow:hidden; border-radius:var(--at-radius-lg); border:1px solid var(--at-line); background:var(--at-surface-2); }
.blk-kontakt-lokacije__map{ position:absolute; inset:-15%; transform:translate(var(--px), var(--py)); transition:transform 1.6s var(--at-ease-out);
  background-image:linear-gradient(color-mix(in srgb, var(--at-line) 70%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--at-line) 70%, transparent) 1px, transparent 1px);
  background-size:34px 34px; }
.blk-kontakt-lokacije__map > svg{ position:absolute; inset:0; width:100%; height:100%; }
.lx-water{ fill:none; stroke:color-mix(in srgb, var(--at-ink) 10%, var(--at-surface-2)); stroke-linecap:round; }
.lx-park{ fill:color-mix(in srgb, var(--at-success) 12%, var(--at-surface-2)); }
.lx-case{ fill:none; stroke:var(--at-line-strong); stroke-opacity:.45; stroke-linecap:round; stroke-linejoin:round; }
.lx-road{ fill:none; stroke:var(--at-surface); stroke-linecap:round; stroke-linejoin:round; }
.lx-rail{ fill:none; stroke:var(--at-line-strong); stroke-width:1.5; stroke-dasharray:6 6; }
.blk-kontakt-lokacije__lbl{ position:absolute; font:600 var(--at-fs-micro)/1 var(--at-font-body); letter-spacing:.24em; text-transform:uppercase; color:var(--at-muted); white-space:nowrap; pointer-events:none; }
.blk-kontakt-lokacije__lbl--water{ font-style:italic; letter-spacing:.4em; }
.blk-kontakt-lokacije__pin{ position:absolute; left:var(--x); top:var(--y); z-index:1; display:grid; justify-items:center; gap:8px; transform:translate(-50%, -100%); cursor:pointer; }
.blk-kontakt-lokacije__pin b{ display:grid; place-items:center; width:48px; height:48px; border-radius:50% 50% 50% 0; background:var(--at-ink); color:var(--at-bg); transform:rotate(-45deg) scale(.62); transform-origin:50% 50%; box-shadow:var(--at-shadow-sm); transition:transform 700ms var(--at-ease-spring), background-color var(--at-d-slow); }
.blk-kontakt-lokacije__pin b svg{ width:20px; height:20px; transform:rotate(45deg); }
.blk-kontakt-lokacije__pin span{ order:-1; padding:7px 12px; border-radius:var(--at-radius-pill); background:var(--at-surface); box-shadow:var(--at-shadow-sm); font:600 var(--at-fs-small)/1 var(--at-font-body); color:var(--at-ink); white-space:nowrap; opacity:0; transform:translateY(6px); transition:opacity var(--at-d-slow), transform var(--at-d-slow) var(--at-ease-out); }
.blk-kontakt-lokacije__pin.is-active{ z-index:2; }
.blk-kontakt-lokacije__pin.is-active b{ background:var(--at-accent); color:var(--at-accent-ink); transform:rotate(-45deg) scale(1); }
.blk-kontakt-lokacije__pin.is-active b::after{ content:""; position:absolute; inset:-10px; border-radius:50%; border:2px solid var(--at-accent); opacity:0; animation:blk-ping 2.4s var(--at-ease-out) infinite; }
.blk-kontakt-lokacije__pin.is-active span{ opacity:1; transform:none; transition-delay:500ms; }
.blk-kontakt-lokacije__card{ position:absolute; left:24px; top:24px; z-index:3; width:min(390px, 38%); display:flex; flex-direction:column; padding:clamp(22px, 1rem + 1.2vw, 32px); border-radius:var(--at-radius-md); background:var(--at-surface); box-shadow:var(--at-shadow-md); }
.blk-kontakt-lokacije__panel{ display:grid; gap:16px; align-content:start; flex:1; }
.blk-kontakt-lokacije__panel:not([hidden]){ animation:blk-fade 600ms var(--at-ease-out) both; }
.blk-kontakt-lokacije__panel h3{ font-size:var(--at-fs-h4); line-height:1.3; }
.blk-kontakt-lokacije__dl{ display:grid; gap:14px; margin-top:4px; padding-top:18px; border-top:1px solid var(--at-line); font-size:var(--at-fs-small); }
.blk-kontakt-lokacije__dl dt{ font:600 var(--at-fs-micro)/1.3 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-kontakt-lokacije__dl dd{ color:var(--at-ink); }
.blk-kontakt-lokacije__dl a{ font-weight:600; }
.blk-kontakt-lokacije__dl a:hover{ color:var(--at-accent-text); }
.blk-kontakt-lokacije__panel .at-link{ justify-self:start; margin-top:4px; }
.blk-kontakt-lokacije__load{ position:absolute; right:20px; bottom:20px; z-index:3; }
.blk-kontakt-lokacije__load.at-btn--secondary{ background:var(--at-surface); }
.blk-kontakt-lokacije__viewport iframe{ position:absolute; inset:0; z-index:2; width:100%; height:100%; border:0; filter:var(--at-img-filter); }
.blk-kontakt-lokacije__stage.is-loaded .blk-kontakt-lokacije__map{ visibility:hidden; }
@media (max-width:63.99em){ .blk-kontakt-lokacije__card{ width:min(360px, 46%); } }
@media (max-width:47.99em){
  .blk-kontakt-lokacije__tabs{ display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .blk-kontakt-lokacije__tabs button{ padding:0 12px; }
  .blk-kontakt-lokacije__stage{ aspect-ratio:auto; min-height:0; }
  .blk-kontakt-lokacije__viewport{ position:relative; aspect-ratio:1/1; }
  .blk-kontakt-lokacije__card{ position:relative; left:auto; top:auto; bottom:auto; width:auto; margin:-36px 12px 0; }
  .blk-kontakt-lokacije__load{ top:16px; right:16px; bottom:auto; }
}

/* ============ kontakt-faq (akordeon) ============ */
.blk-kontakt-faq__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); }
.blk-kontakt-faq__side{ grid-column:1 / span 4; position:sticky; top:calc(var(--at-header-h-stuck) + 40px); align-self:start; display:grid; gap:14px; justify-items:start; }
.blk-kontakt-faq__side p{ max-width:34ch; }
.blk-kontakt-faq__list{ grid-column:6 / -1; border-top:1px solid var(--at-line); }
.blk-kontakt-faq__item{ border-bottom:1px solid var(--at-line); }
.blk-kontakt-faq__q{ display:grid; grid-template-columns:minmax(0,1fr) 44px; align-items:center; gap:24px; width:100%; min-height:72px; padding-block:20px; text-align:left; font:var(--at-display-weight) var(--at-fs-h4)/1.35 var(--at-font-display); letter-spacing:-.01em; color:var(--at-ink); }
.blk-kontakt-faq__q i{ position:relative; display:block; width:44px; height:44px; border:1px solid var(--at-line-strong); border-radius:50%; transition:background-color var(--at-d-base), border-color var(--at-d-base), transform var(--at-d-slow) var(--at-ease-out); }
.blk-kontakt-faq__q i::before,.blk-kontakt-faq__q i::after{ content:""; position:absolute; left:50%; top:50%; width:14px; height:2px; margin:-1px 0 0 -7px; background:currentColor; transition:transform var(--at-d-slow) var(--at-ease-out); }
.blk-kontakt-faq__q i::after{ transform:rotate(90deg); }
.blk-kontakt-faq__q:hover i{ border-color:var(--at-ink); }
.blk-kontakt-faq__q[aria-expanded=true] i{ background:var(--at-ink); border-color:var(--at-ink); color:var(--at-bg); transform:rotate(180deg); }
.blk-kontakt-faq__q[aria-expanded=true] i::after{ transform:rotate(0); }
.blk-kontakt-faq__a{ display:grid; grid-template-rows:0fr; transition:grid-template-rows var(--at-d-slow) var(--at-ease-out); }
.blk-kontakt-faq__a > div{ overflow:hidden; }
.blk-kontakt-faq__a p{ max-width:62ch; padding:0 68px 24px 0; }
.blk-kontakt-faq__a.is-open{ grid-template-rows:1fr; }
@media (max-width:63.99em){ .blk-kontakt-faq__side,.blk-kontakt-faq__list{ grid-column:1 / -1; } .blk-kontakt-faq__side{ position:static; } }
@media (max-width:47.99em){ .blk-kontakt-faq__a p{ padding-right:0; } .blk-kontakt-faq__q{ gap:16px; } }

@media (prefers-reduced-motion: reduce){
  .blk-kontakt-lokacije__map{ transition:none; }
  .blk-kontakt-lokacije__pin.is-active b::after,.at-status.is-open .at-status__dot::after{ animation:none; }
}

/* ===== izvor: dizajn/assets/blocks-galerija-strana.css ===== */
/* =====================================================================
   LEONIDIS - blocks-galerija-strana.css (talas 2)
   Blokovi: galerija (filter + masonry + lightbox), studija (pre/posle),
   strana (dug tekst + lepljiv sadržaj). Samo var(--at-*), nula boja.
   Učitava se POSLE blocks.css, samo na galerija.html i strana.html.
   ===================================================================== */

/* ============ galerija: filter + masonry ============ */
.blk-galerija__bar{ position:sticky; top:var(--at-header-h-stuck); z-index:calc(var(--at-z-header) - 1); display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:var(--at-s-6); padding-block:12px; background:var(--at-bg); border-bottom:1px solid var(--at-line); }
.blk-galerija__filters{ display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:3px; margin:-3px; }
.blk-galerija__filters::-webkit-scrollbar{ display:none; }
.blk-galerija__chip{ display:inline-flex; align-items:center; gap:8px; flex:none; height:44px; padding:0 18px; border:1px solid var(--at-line-strong); border-radius:var(--at-radius-btn); font-weight:600; font-size:var(--at-fs-small); color:var(--at-ink); white-space:nowrap; transition:background-color var(--at-d-base) var(--at-ease-out), color var(--at-d-base), border-color var(--at-d-base); }
.blk-galerija__chip:hover{ border-color:var(--at-ink); }
.blk-galerija__chip sup{ top:0; font:500 var(--at-fs-micro)/1 var(--at-font-body); color:var(--at-muted); font-variant-numeric:tabular-nums; transition:color var(--at-d-base); }
.blk-galerija__chip[aria-pressed=true]{ background:var(--at-ink); border-color:var(--at-ink); color:var(--at-bg); }
.blk-galerija__chip[aria-pressed=true] sup{ color:inherit; opacity:.7; }
.blk-galerija__status{ flex:none; font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-galerija__status b{ font:var(--at-display-weight) var(--at-fs-h4)/1 var(--at-font-display); color:var(--at-ink); font-variant-numeric:tabular-nums; margin-right:4px; }

.blk-galerija__grid{ columns:2; column-gap:var(--at-gap); }
.blk-galerija__item{ break-inside:avoid; margin-bottom:var(--at-gap); }
.blk-galerija__open{ position:relative; display:block; width:100%; text-align:left; border-radius:var(--at-radius-md); }
.blk-galerija__media{ position:relative; display:block; overflow:hidden; border-radius:var(--at-radius-md); background:var(--at-surface-2); }
.blk-galerija__media img{ width:100%; transition:transform 1s var(--at-ease-out); }
.blk-galerija__zoom{ position:absolute; right:14px; top:14px; display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:var(--at-surface); color:var(--at-ink); opacity:0; transform:scale(.6) rotate(-90deg); transition:opacity var(--at-d-slow) var(--at-ease-out), transform var(--at-d-slow) var(--at-ease-out); }
.blk-galerija__zoom svg{ width:18px; height:18px; }
.blk-galerija__cap{ display:grid; grid-template-columns:1fr auto; gap:2px 12px; padding-top:12px; }
.blk-galerija__name{ font:var(--at-display-weight) var(--at-fs-h4)/1.25 var(--at-font-display); letter-spacing:-.01em; color:var(--at-ink); }
.blk-galerija__sub{ grid-column:1; font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-galerija__meta{ grid-column:2; grid-row:1 / span 2; align-self:start; font-size:var(--at-fs-small); color:var(--at-muted); font-variant-numeric:tabular-nums; padding-top:3px; }
/* miš: potpis izlazi kao etiketa preko fotografije */
@media (hover:hover) and (pointer:fine){
  .blk-galerija__cap{ position:absolute; left:12px; right:12px; bottom:12px; padding:14px 16px; border-radius:var(--at-radius-sm); background:var(--at-surface); box-shadow:var(--at-shadow-sm); opacity:0; transform:translateY(16px); transition:opacity var(--at-d-slow) var(--at-ease-out), transform var(--at-d-slow) var(--at-ease-out); }
  .blk-galerija__open:hover .blk-galerija__cap,.blk-galerija__open:focus-visible .blk-galerija__cap{ opacity:1; transform:none; }
  .blk-galerija__open:hover .blk-galerija__zoom,.blk-galerija__open:focus-visible .blk-galerija__zoom{ opacity:1; transform:none; }
  .blk-galerija__open:hover img{ transform:scale(1.05); }
}
.blk-galerija__empty{ padding:var(--at-s-8) 0; text-align:center; color:var(--at-muted); }
@media (min-width:64em){ .blk-galerija__grid{ columns:3; } }
@media (min-width:96em){ .blk-galerija__grid{ columns:4; } }
@media (max-width:47.99em){
  .blk-galerija__bar{ margin-inline:calc(var(--at-gutter) * -1); padding-inline:var(--at-gutter); }
  .blk-galerija__status{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
  .blk-galerija__name{ font-size:var(--at-fs-body); }
  .blk-galerija__meta{ display:none; }
}
/* prelaz filtera (View Transitions): pozicije se pretapaju */
::view-transition-group(*){ animation-duration:var(--at-d-page); animation-timing-function:var(--at-ease-out); }
::view-transition-old(*),::view-transition-new(*){ animation-duration:var(--at-d-slow); }

/* ============ galerija: lightbox (native <dialog>, data-bg=panel) ============ */
.blk-galerija__lb{ position:fixed; inset:0; width:100vw; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; overflow:hidden; }
.blk-galerija__lb[open]{ display:grid; grid-template-rows:auto minmax(0,1fr) auto; animation:lb-in var(--at-d-slow) var(--at-ease-out); }
.blk-galerija__lb::backdrop{ background:transparent; }
@keyframes lb-in{ from{ opacity:0; } }
.is-lb-open{ overflow:hidden; }
.is-lb-open body{ background:var(--at-panel); }
.blk-galerija__lb-top,.blk-galerija__lb-foot{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding:16px var(--at-gutter); }
.blk-galerija__lb-count{ font:var(--at-display-weight) var(--at-fs-h4)/1 var(--at-font-display); color:var(--at-muted); }
.blk-galerija__lb-count [data-lb-cur]{ color:var(--at-ink); }
.blk-galerija__lb-stage{ position:relative; min-height:0; touch-action:pan-y; user-select:none; }
.blk-galerija__lb-stage img{ position:absolute; top:0; left:var(--at-gutter); width:calc(100% - 2 * var(--at-gutter)); height:100%; object-fit:contain; -webkit-user-drag:none; }
.blk-galerija__lb-cap{ display:grid; gap:4px; min-width:0; }
.blk-galerija__lb-cap h2{ font-size:var(--at-fs-h4); line-height:var(--at-lh-h4); }
.blk-galerija__lb-cap p{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-galerija__lb-nav{ display:flex; gap:10px; flex:none; }
.blk-galerija__lb-hint{ font-size:var(--at-fs-micro); color:var(--at-muted); letter-spacing:.04em; }
@media (max-width:47.99em){ .blk-galerija__lb-hint{ display:none; } .blk-galerija__lb-foot{ align-items:flex-end; } }

/* ============ studija: pre / posle ============ */
@property --pos{ syntax:"<percentage>"; inherits:true; initial-value:50%; }
.blk-studija__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-7) var(--at-gap); align-items:center; }
.blk-studija__cmp{ --pos:50%; grid-column:1 / span 7; position:relative; aspect-ratio:4/3; overflow:hidden; border-radius:var(--at-radius-lg); background:var(--at-surface); }
.blk-studija__cmp img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.blk-studija__after{ clip-path:inset(0 0 0 var(--pos)); }
.blk-studija__tag{ position:absolute; top:16px; padding:6px 10px; border-radius:var(--at-radius-sm); background:var(--at-panel); color:var(--at-ink); font:600 var(--at-fs-micro)/1 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; pointer-events:none; }
.blk-studija__tag--pre{ left:16px; }
.blk-studija__tag--posle{ right:16px; }
.blk-studija__handle{ position:absolute; top:0; bottom:0; left:var(--pos); width:2px; margin-left:-1px; background:var(--at-ink); pointer-events:none; }
.blk-studija__knob{ position:absolute; left:50%; top:50%; display:flex; align-items:center; justify-content:center; gap:2px; width:56px; height:56px; border-radius:50%; background:var(--at-ink); color:var(--at-panel); transform:translate(-50%,-50%); box-shadow:var(--at-shadow-md); transition:transform var(--at-d-base) var(--at-ease-out); }
.blk-studija__knob svg{ width:16px; height:16px; }
.blk-studija__range{ position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:ew-resize; -webkit-appearance:none; appearance:none; }
.blk-studija__range:active ~ .blk-studija__handle .blk-studija__knob{ transform:translate(-50%,-50%) scale(.92); }
.blk-studija__range:focus-visible ~ .blk-studija__handle .blk-studija__knob{ outline:2px solid var(--at-focus); outline-offset:3px; }
.js .blk-studija__cmp.is-inview{ animation:studija-hint 1.8s var(--at-ease-in-out) .2s; }
@keyframes studija-hint{ 0%{ --pos:50%; } 35%{ --pos:26%; } 70%{ --pos:66%; } 100%{ --pos:50%; } }
.blk-studija__info{ grid-column:9 / -1; display:grid; gap:16px; align-content:center; }
.blk-studija__head{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; }
.blk-studija__demo{ padding:4px 10px; border:1px dashed var(--at-line-strong); border-radius:var(--at-radius-sm); font:600 var(--at-fs-micro)/1.4 var(--at-font-body); letter-spacing:.06em; text-transform:uppercase; color:var(--at-muted); }
.blk-studija__facts{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:20px var(--at-gap); margin-top:12px; padding-top:24px; border-top:1px solid var(--at-line); }
.blk-studija__facts dt{ font:600 var(--at-fs-micro)/1.4 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-studija__facts dd{ margin-top:4px; font:var(--at-display-weight) var(--at-fs-h4)/1.3 var(--at-font-display); color:var(--at-ink); }
.blk-studija__facts .is-full{ grid-column:1 / -1; }
.blk-studija__facts .is-full dd{ color:var(--at-accent-text); }
.blk-studija__info .at-link{ justify-self:start; margin-top:8px; }
@media (max-width:63.99em){ .blk-studija__cmp,.blk-studija__info{ grid-column:1 / -1; } }

/* ============ strana: pravni / dug tekst + lepljiv sadržaj ============ */
.blk-strana__meta{ font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-strana__meta time{ font-weight:600; color:var(--at-ink); }
.blk-strana__grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:var(--at-s-6) var(--at-gap); align-items:start; }
.blk-strana__toc{ grid-column:1 / span 3; position:sticky; top:calc(var(--at-header-h-stuck) + 32px); z-index:calc(var(--at-z-header) - 1); }
.blk-strana__toc summary{ display:flex; align-items:center; gap:12px; list-style:none; font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-muted); }
.blk-strana__toc summary::-webkit-details-marker{ display:none; }
.blk-strana__now{ display:none; }
.blk-strana__chev{ display:none; width:16px; height:16px; margin-left:auto; flex:none; color:var(--at-ink); transition:transform var(--at-d-base) var(--at-ease-out); }
.blk-strana__toc ol{ counter-reset:toc; display:grid; margin-top:16px; }
.blk-strana__toc a{ counter-increment:toc; display:grid; grid-template-columns:2.2em 1fr; padding:9px 0 9px 16px; border-left:2px solid var(--at-line); font-size:var(--at-fs-small); line-height:1.4; color:var(--at-muted); transition:color var(--at-d-base), border-color var(--at-d-base); }
.blk-strana__toc a::before{ content:counter(toc, decimal-leading-zero); font-variant-numeric:tabular-nums; }
.blk-strana__toc a:hover{ color:var(--at-ink); }
.blk-strana__toc a[aria-current=true]{ border-left-color:var(--at-accent-text); color:var(--at-ink); font-weight:600; }
.blk-strana__doc{ grid-column:5 / -1; counter-reset:h2c; }

/* tipografija dokumenta (dopuna .at-prose) */
.blk-strana__doc h2{ counter-increment:h2c; position:relative; margin-top:2.4em; padding-top:1.2em; border-top:1px solid var(--at-line); }
.blk-strana__doc h2::before{ content:counter(h2c, decimal-leading-zero); display:block; margin-bottom:12px; font:600 var(--at-fs-small)/1 var(--at-font-body); letter-spacing:.04em; color:var(--at-accent-text); font-variant-numeric:tabular-nums; }
.blk-strana__doc h3{ position:relative; }
.blk-strana__doc h2 + *,.blk-strana__doc h3 + *{ margin-top:.7em; }
.blk-strana__doc li + li{ margin-top:.45em; }
.blk-strana__doc li::marker{ color:var(--at-muted); font-variant-numeric:tabular-nums; }
.blk-strana__doc strong{ font-weight:600; color:var(--at-ink); }
.blk-strana__doc .blk-strana__anchor{ margin-left:.35em; color:var(--at-muted); text-decoration:none; opacity:0; transition:opacity var(--at-d-base), color var(--at-d-base); }
.blk-strana__doc h2:hover .blk-strana__anchor,.blk-strana__doc h3:hover .blk-strana__anchor,.blk-strana__anchor:focus-visible{ opacity:1; }
.blk-strana__anchor:hover{ color:var(--at-accent-text); }
@media (hover:none){ .blk-strana__doc .blk-strana__anchor{ opacity:.5; } }
.blk-strana__doc .at-table{ border:1px solid var(--at-line); border-radius:var(--at-radius-md); }
.blk-strana__doc table{ min-width:560px; }
.blk-strana__doc caption{ caption-side:bottom; padding:10px 12px; text-align:left; font-size:var(--at-fs-micro); color:var(--at-muted); }
.blk-strana__doc th{ background:var(--at-surface-2); font:600 var(--at-fs-micro)/1.4 var(--at-font-body); letter-spacing:.08em; text-transform:uppercase; color:var(--at-muted); }
.blk-strana__doc td:first-child{ font-weight:600; color:var(--at-ink); }
.blk-strana__doc tr:last-child td{ border-bottom:0; }
.blk-strana__doc code{ font-size:.92em; padding:1px 6px; border-radius:var(--at-radius-sm); background:var(--at-surface-2); color:var(--at-ink); }

/* napomena */
.blk-strana__note{ display:grid; gap:8px; padding:20px 24px; border:1px solid var(--at-line); border-radius:var(--at-radius-md); background:var(--at-surface); font-size:var(--at-fs-body); line-height:1.6; }
.blk-strana__note-t{ display:flex; align-items:center; gap:10px; font:600 var(--at-fs-micro)/1.2 var(--at-font-body); letter-spacing:.1em; text-transform:uppercase; color:var(--at-accent-text); }
.blk-strana__note-t::before{ content:"i"; display:grid; place-items:center; width:20px; height:20px; border-radius:50%; border:1.5px solid currentColor; font:700 11px/1 var(--at-font-display); text-transform:none; letter-spacing:0; }
.blk-strana__note ul{ padding-left:1.1em; }
.blk-strana__note--demo{ border-style:dashed; border-color:var(--at-line-strong); background:transparent; }
.blk-strana__doc .blk-strana__end{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 24px; margin-top:3em; padding-top:24px; border-top:1px solid var(--at-line); font-size:var(--at-fs-small); color:var(--at-muted); }
.blk-strana__end .at-link{ text-decoration:none; }

/* na vrh */
.blk-strana__top{ position:fixed; right:var(--at-gutter); bottom:max(24px, env(safe-area-inset-bottom)); z-index:calc(var(--at-z-header) - 1); display:grid; place-items:center; width:52px; height:52px; border-radius:50%; background:var(--at-ink); color:var(--at-bg); box-shadow:var(--at-shadow-md); opacity:0; visibility:hidden; transform:translateY(12px); transition:opacity var(--at-d-slow) var(--at-ease-out), transform var(--at-d-slow) var(--at-ease-out), visibility 0s linear var(--at-d-slow); }
.blk-strana__top svg{ width:20px; height:20px; transform:rotate(-90deg); }
.blk-strana__top.is-visible{ opacity:1; visibility:visible; transform:none; transition-delay:0s; }
.blk-strana__top:hover{ transform:translateY(-3px); }

/* mobilni / tablet: sadržaj = lepljiva sklopiva traka */
@media (max-width:63.99em){
  .blk-strana__toc,.blk-strana__doc{ grid-column:1 / -1; }
  .blk-strana__toc{ top:var(--at-header-h-stuck); margin-inline:calc(var(--at-gutter) * -1); padding-inline:var(--at-gutter); background:var(--at-bg); border-block:1px solid var(--at-line); }
  .blk-strana__toc summary{ min-height:52px; cursor:pointer; }
  .blk-strana__now{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:600 var(--at-fs-small)/1.2 var(--at-font-body); letter-spacing:0; text-transform:none; color:var(--at-ink); }
  .blk-strana__chev{ display:block; }
  .blk-strana__toc details[open] .blk-strana__chev{ transform:rotate(180deg); }
  .blk-strana__toc ol{ max-height:min(60vh, 420px); overflow-y:auto; margin-top:0; padding-bottom:16px; }
  .blk-strana__doc h2,.blk-strana__doc h3{ scroll-margin-top:calc(var(--at-header-h-stuck) + 72px); }
}
@media (min-width:64em){ .blk-strana__toc summary{ pointer-events:none; } }