@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&family=Montserrat:wght@400;500;600;700;800&display=swap');
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --primary:#3366ff;--primary-h:#2b56d8;--primary-l:#e0e8ff;
  --primary-link:#3366ff;--primary-link-h:#2b56d8;
  --secondary:#2f4a69;--on-secondary:#ffffff;--accent:#2f4a69;--on-accent:#ffffff;--accent-text:#2f4a69;
  --on-text:#ffffff;
  --brand-header-bg:#3366ff;--brand-header-fg:#ffffff;
  --brand-footer-bg:#2f4a69;--brand-footer-fg:#ffffff;
  --brand-action-bg:#3366ff;--brand-action-fg:#ffffff;
  --hdr-custom-bg:;--hdr-custom-fg:#ffffff;
  --hdr-overlay-color:#0000ff;--hdr-overlay-top:rgba(0,0,255,0.570);--hdr-overlay-mid:rgba(0,0,255,0.314);--hdr-overlay-gradient:linear-gradient(180deg,var(--hdr-overlay-top),var(--hdr-overlay-mid) 70%,transparent 100%);--hdr-overlay-bg:rgba(0,0,255,0.570);
  --footer-logo-height:90px;
  --ftr-custom-bg:#3366ff;--ftr-custom-fg:#ffffff;
  --ftr-bottom-custom-bg:;--ftr-bottom-custom-fg:#ffffff;
  --text:#1a1a1a;--muted:#67777f;--bg:#ffffff;
  --surface:#ffffff;--surface-2:#f9f9f9;--border:rgba(0,0,0,.07);--card-shadow:0 8px 26px rgba(18,60,80,.09);--chip-bg:#e0e8ff;
  --hdr-fg-light:#67777f;--hdr-fg-dark:#ffffff;--hdr-fg-primary:#ffffff;
  --hdr-act-light:#2d5ae0;--hdr-act-primary:#161616;
  --on-primary:#ffffff;--cta-btn-bg:#ffffff;--cta-btn-fg:#3366ff;
  --font-head:'Poppins',system-ui,sans-serif;
  --font-body:'Montserrat',system-ui,sans-serif;
  --radius:14px;--btn-radius:10px;
  --container:1400px;
  --scheme-dark:#2f4a69;--body-bg:#ffffff;
  --shadow:0 8px 32px rgba(0,0,0,.10);
  --shadow-lg:0 20px 60px rgba(0,0,0,.15);
  --transition:200ms ease;

  /* ── Množitelji ritma i tipografije ─────────────────────────────────────
     Ovo su jedine dvije brojke koje mood mijenja. Sve izvedene vrijednosti
     su niže, na `body`. */
  --space-unit:1;
  --type-user-scale:0.8;
  --body-user-scale:1;
  --mood-type-scale:1;
  --type-scale:calc(var(--type-user-scale) * var(--mood-type-scale)); /* heading alias */
  --body-scale:var(--body-user-scale);
  --gutter:clamp(1rem,4vw,2rem);
  --leading-tight:1.08;--leading-snug:1.35;--leading-normal:1.7;--leading-loose:1.85;
  --tracking-tight:-.02em;--tracking-normal:0;--tracking-wide:.12em;
  --shadow-sm:0 1px 2px rgba(0,0,0,.05);
  --shadow-xl:0 32px 80px rgba(0,0,0,.20);
  --border-thin:1px;--border-thick:2px;
}

/* ── IZVEDENA SKALA ─────────────────────────────────────────────────────────
   PAZI: izvedeni tokeni MORAJU biti deklarirani na istom elementu na kojem
   mood mijenja `--space-unit` / `--type-scale`, tj. na `body`.

   Zamjena `var()` se izračuna na elementu gdje je token DEKLARIRAN, a ne gdje
   je upotrijebljen. Da `--space-6:calc(2rem * var(--space-unit))` stoji u
   `:root`, izračunalo bi se s `:root` vrijednošću (1) i naslijedilo kao gotov
   broj — `body.mood-bold{--space-unit:1.4}` ne bi imao nikakav učinak.
   Prva verzija ove skale imala je upravo taj bug: tipografija je reagirala na
   mood (jer `.hero-title` piše calc izravno u pravilu), a razmaci nisu.

   `body.mood-*` (0,1,1) nadjačava `body` (0,0,1) za množitelje, a izvedeni
   tokeni se deklariraju samo ovdje, pa nema sukoba u kaskadi. */
body{
  --space-1:calc(.25rem * var(--space-unit));
  --space-2:calc(.5rem  * var(--space-unit));
  --space-3:calc(.75rem * var(--space-unit));
  --space-4:calc(1rem   * var(--space-unit));
  --space-5:calc(1.5rem * var(--space-unit));
  --space-6:calc(2rem   * var(--space-unit));
  --space-7:calc(3rem   * var(--space-unit));
  --space-8:calc(4rem   * var(--space-unit));

  --section-y:clamp(4rem,6.5vw,6.25rem);
  --card-pad:calc(clamp(1rem,2vw,1.5rem) * var(--space-unit));
  --stack-gap:var(--space-6);

  --text-xs:max(11.5px,calc(.75rem * var(--body-scale)));
  --text-sm:max(12.5px,calc(.875rem * var(--body-scale)));
  --text-base:max(14px,calc(1rem * var(--body-scale)));
  --text-lg:calc(1.125rem * var(--body-scale));
  --text-xl:calc(clamp(1.2rem,2vw,1.5rem)      * var(--type-scale));
  --text-2xl:calc(clamp(1.5rem,3vw,2.5rem)     * var(--type-scale));
  --text-3xl:calc(clamp(1.75rem,3.5vw,2.75rem) * var(--type-scale));
  --text-4xl:calc(clamp(2.25rem,5.5vw,4rem)    * var(--type-scale));

  --shadow-md:var(--card-shadow);
}
/* `scroll-padding-top` je uvjet da sidra iz one-page izbornika rade: bez njega
   skok na #usluge dovede naslov sekcije točno POD ljepljivi header i korisnik
   vidi sredinu sekcije bez naslova. 68px je visina `.header-inner` + zrak. */
html{font-size:16px;-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:84px;background:var(--body-bg)}
body{font-family:var(--font-body);font-size:var(--text-base);color:var(--text);background:var(--bg);line-height:var(--leading-normal)}
img{max-width:100%;height:auto;display:block}
a{color:var(--primary-link);text-decoration:none}
a:hover{color:var(--primary-link-h)}
/* Ručni override boja po sekciji — eksplicitna odluka korisnika ima prednost. */
section.sec-manual-text :is(.section-title,.section-text,.hero-title,.hero-text,h1,h2,h3,h4,h5,h6,p,li,.section-eyebrow,.hero-eyebrow){color:var(--section-text-override)!important}
section.sec-manual-link a:not(.btn){color:var(--primary-link)!important}
section.sec-manual-link-hover a:not(.btn):hover{color:var(--primary-link-h)!important}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);line-height:var(--leading-tight);font-weight:800;letter-spacing:var(--tracking-tight)}
h1{font-size:var(--text-4xl)}h2{font-size:var(--text-3xl)}
h3{font-size:var(--text-xl);line-height:var(--leading-snug)}
h4,h5,h6{font-size:var(--text-lg);line-height:var(--leading-snug);letter-spacing:var(--tracking-normal)}
p{margin-bottom:var(--space-4)}p:last-child{margin-bottom:0}
ul,ol{list-style:none}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}
.section{padding:var(--section-y) 0}
/* ── RUČNI LAYOUT OVERRIDE SEKCIJE ────────────────────────────────────────
   `section_width` kontrolira samo VANJSKI omotač/pozadinu sekcije.
   `content_width` nikad ne radi sadržaj full-width: sadržaj je ili normalan
   (glavni site container) ili uži. To je namjeran ugovor editora. */
section.sec-width-normal{width:calc(100% - var(--gutter) - var(--gutter));max-width:var(--container);margin-left:auto!important;margin-right:auto!important}
section.sec-width-full{width:100%;max-width:none;margin-left:0!important;margin-right:0!important}
section.sec-content-normal>.container{max-width:var(--container)!important}
section.sec-content-narrow>.container{max-width:900px!important}
/* Neke starije varijante imaju još jedan hardkodirani uski wrapper unutar
   `.container`. Kada korisnik EKSPLICITNO zatraži normalnu širinu, taj limit
   više ne smije pobijediti njegov odabir. */
section.sec-content-normal :is(.section-header,.section-head,.services-header,.pricing-header,.cf-wrap,.cf-head,.faq-acc,.hours-wrap,.steps-wrap,.cta-box,.contact-boxed,.contact-head,.contact-header,.about-vh,.about-timeline-wrap,.about-story-head,.about-story-cols,.svc-rich-list,.t-quote-list,.t-min-list,.faq-grid,.faq-modern-head,.team-list,.video-head){max-width:none!important}
/* Poravnanje iz editora mora pobijediti layout-specifični CSS. Namjerno
   ciljamo uvod/sadržaj sekcije, a ne svaku karticu u gridu. */
section.sec-align-left,section.sec-align-left :is(.section-header,.section-head,.services-header,.pricing-header,.cf-head,.cta-content,.contact-intro,.contact-head,.contact-header,.contact-si-head,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.faq-numbered-head,.gallery-fullbleed-head,.team-editorial-head,.video-head){text-align:left!important}
section.sec-align-center,section.sec-align-center :is(.section-header,.section-head,.services-header,.pricing-header,.cf-head,.cta-content,.contact-intro,.contact-head,.contact-header,.contact-si-head,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.faq-numbered-head,.gallery-fullbleed-head,.team-editorial-head,.video-head){text-align:center!important}
section.sec-align-right,section.sec-align-right :is(.section-header,.section-head,.services-header,.pricing-header,.cf-head,.cta-content,.contact-intro,.contact-head,.contact-header,.contact-si-head,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.faq-numbered-head,.gallery-fullbleed-head,.team-editorial-head,.video-head){text-align:right!important}
section.sec-align-left :is(.section-header,.section-head,.services-header,.pricing-header,.cf-head,.cta-content,.contact-intro,.contact-head,.contact-header,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.gallery-fullbleed-head,.video-head){margin-left:0!important;margin-right:auto!important}
section.sec-align-center :is(.section-header,.section-head,.services-header,.pricing-header,.cf-head,.cta-content,.contact-intro,.contact-head,.contact-header,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.gallery-fullbleed-head,.video-head){margin-left:auto!important;margin-right:auto!important}
section.sec-align-right :is(.section-header,.section-head,.services-header,.pricing-header,.cf-head,.cta-content,.contact-intro,.contact-head,.contact-header,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.gallery-fullbleed-head,.video-head){margin-left:auto!important;margin-right:0!important}
.section-eyebrow{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-wide);color:var(--primary-link);margin-bottom:var(--space-5)}
.section-eyebrow::before{content:'';width:28px;height:2px;background:var(--primary);border-radius:2px;flex-shrink:0}
/* Prazan nadnaslov je do v1.131 crtao samotnu 28px crticu u primary boji
   iznad naslova, uz 24px margine. Osam renderera emitira <div
   class="section-eyebrow"> bezuvjetno iz heredoca, gdje se uvjet ne može
   napisati — pa se guard rješava ovdje, jednom, i vrijedi i za buduće.
   Regresija: tools/structure_test.php → empty-eyebrow-hidden */
.section-eyebrow:empty,.section-text:empty,.section-title:empty{display:none}
/* Strict brand fidelity: postojeći identitet mora se stvarno vidjeti. */
body.brand-fidelity-strict .section-eyebrow,body.brand-fidelity-strict .hero-eyebrow,body.brand-fidelity-strict .hslide-eyebrow,body.brand-fidelity-strict .ct-eyebrow{color:var(--accent-text)}
body.brand-fidelity-strict .section-eyebrow::before,body.brand-fidelity-strict .hero-eyebrow::before,body.brand-fidelity-strict .hslide-eyebrow::before,body.brand-fidelity-strict .ct-eyebrow::before{background:var(--accent)}
body.brand-fidelity-strict .site-header:not(.hdr-transparent):not(.hdr-floating){background:var(--brand-header-bg)!important}
body.brand-fidelity-strict .site-header:not(.hdr-transparent):not(.hdr-floating) .site-logo,body.brand-fidelity-strict .site-header:not(.hdr-transparent):not(.hdr-floating) .site-logo-text{color:var(--brand-header-fg)!important}
/* `opacity:.82` je bijeli tekst na brand pozadini obarao s 4.82 na 3.73 —
   ispod AA. Mehanizam je bio ispravan (`--brand-header-fg` se računa iz
   pozadine), ali ga je prozirnost pokvarila. Mjereno u pregledniku na 96
   kombinacija (tools/header_probe.php). Umirenost se postiže bojom, ne
   prozirnošću. Regresija: tools/header_test.php */
body.brand-fidelity-strict .site-header:not(.hdr-transparent):not(.hdr-floating) .site-nav a{color:var(--brand-header-fg)!important}
body.brand-fidelity-strict .site-header:not(.hdr-transparent):not(.hdr-floating) .site-nav a:hover,body.brand-fidelity-strict .site-header:not(.hdr-transparent):not(.hdr-floating) .site-nav a.active{color:var(--brand-header-fg)!important;opacity:1;background:color-mix(in srgb,var(--brand-header-fg) 14%,transparent)}
body.brand-fidelity-strict .site-footer{background:var(--brand-footer-bg)!important;color:var(--brand-footer-fg)!important}
body.brand-fidelity-strict .site-footer :is(.footer-logo-text,.footer-col-title,.footer-links a,.footer-links li,.footer-desc,.footer-bottom,.footer-copy,.footer-legal,.footer-legalbar a){color:var(--brand-footer-fg)!important}
body.brand-fidelity-strict .site-footer .footer-legalbar{background:color-mix(in srgb,var(--brand-footer-fg) 8%,var(--brand-footer-bg))!important;color:var(--brand-footer-fg)!important}
body.brand-fidelity-strict .site-header .header-cta{background:var(--brand-action-bg)!important;color:var(--brand-action-fg)!important;border-color:var(--brand-action-bg)!important}
/* Na tamnoj strict-brand glavi accent je prirodniji CTA od slučajno
   pronađene utility/action boje; na svijetloj glavi ostaje izvorni action. */
body.brand-fidelity-strict:is(.hdr-scheme-dark,.hdr-scheme-primary) .site-header .header-cta{background:var(--accent)!important;color:var(--on-accent)!important;border-color:var(--accent)!important}
body.brand-fidelity-strict .site-header:not(.hdr-transparent):not(.hdr-floating){border-bottom:1px solid color-mix(in srgb,var(--accent) 34%,transparent)}
body.brand-fidelity-strict .site-header .site-logo-img{height:var(--site-logo-height,68px);max-width:380px}
body.brand-fidelity-strict .header-inner{height:88px}
body.brand-fidelity-strict .step-num{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
body.brand-fidelity-strict section[data-eyebrow-style="accent"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){background:var(--accent);color:var(--on-accent)!important}
.section-title{font-family:var(--font-head);font-size:var(--text-2xl);font-weight:700;margin-bottom:var(--space-4);color:var(--text)}
.section-text{font-size:var(--text-lg);color:var(--muted);max-width:62ch;line-height:var(--leading-loose)}
/* Basic Rich Text — content semantics without user-controlled design. */
.ss-rich-p{display:block}.ss-rich-p+.ss-rich-p{margin-top:.7em}.ss-rich-list{display:block;margin:.7em 0;padding:0;line-height:inherit}.ss-rich-li{display:block;position:relative;padding-left:1.25em;margin:.28em 0}.ss-rich-list--ul>.ss-rich-li::before{content:'•';position:absolute;left:.15em;color:var(--primary);font-weight:800}.ss-rich-list--ol{counter-reset:ss-rich-item}.ss-rich-list--ol>.ss-rich-li{counter-increment:ss-rich-item;padding-left:1.7em}.ss-rich-list--ol>.ss-rich-li::before{content:counter(ss-rich-item) '.';position:absolute;left:0;color:var(--primary);font-weight:700}.ss-rich-p a,.ss-rich-list a,.ss-rich-li a{color:var(--primary-link,var(--primary));text-decoration:underline;text-underline-offset:.16em}.ss-rich-p a:hover,.ss-rich-list a:hover,.ss-rich-li a:hover{color:var(--primary-link-h,var(--primary-d))}
/* ── ZAGLAVLJE SEKCIJE ─────────────────────────────────────────────────────
   Namjerno rano u stylesheetu: postojeća pravila po tipu (.pricing-header,
   .services-header, .stats-header …) dolaze kasnije i moraju i dalje
   pobjeđivati, da se izgled objavljenih projekata ne promijeni.
   `center` je zadano i reproducira inline stilove koji su ovdje bili do
   v1.131. `left` i `split` dobivaju samo projekti koji ih izričito traže. */
.ss-head{margin-bottom:var(--head-gap,3rem)}
.ss-head .section-text{margin-top:.75rem}
.ss-head--center{text-align:center}
.ss-head--center .section-text{margin-left:auto;margin-right:auto}
.services-header .section-text{max-width:560px}
.pricing-header .section-text{margin-top:0}
.ss-head--left{text-align:left}
.ss-head--left .section-text{max-width:64ch}
.ss-head--split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:end;text-align:left}
.ss-head--split .section-title{margin-bottom:0}
.ss-head--split .section-text{margin-top:0}
@media(max-width:768px){.ss-head--split{grid-template-columns:1fr;gap:1rem;align-items:start}}
/* v1.223 header contract za legacy layoute. Novi rendereri koriste `sectionHead()`,
   ali stariji wrapperi više ne ignoriraju globalni/lokalni header_align. Split
   se na legacy strukturi namjerno degradira na lijevo poravnanje umjesto da
   Renderer ne nagađa strukturu i ne razbija sadržaj. */
section.sec-head-left :is(.section-header,.section-head,.services-header,.pricing-header,.stats-header,.cf-head,.contact-head,.contact-header,.contact-si-head,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.faq-numbered-head,.gallery-fullbleed-head,.team-editorial-head,.video-head){text-align:left!important;margin-left:0;margin-right:auto}
section.sec-head-center :is(.section-header,.section-head,.services-header,.pricing-header,.stats-header,.cf-head,.contact-head,.contact-header,.contact-si-head,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.faq-numbered-head,.gallery-fullbleed-head,.team-editorial-head,.video-head){text-align:center!important;margin-left:auto;margin-right:auto}
section.sec-head-split :is(.section-header,.section-head,.services-header,.pricing-header,.stats-header,.cf-head,.contact-head,.contact-header,.contact-si-head,.hours-head,.about-vh,.about-tl-head,.about-story-head,.faq-modern-head,.faq-numbered-head,.gallery-fullbleed-head,.team-editorial-head,.video-head):not(.ss-head){text-align:left!important;margin-left:0;margin-right:auto;max-width:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.875rem 2rem;font-family:var(--font-body);font-size:var(--text-sm);font-weight:700;border-radius:var(--btn-radius);border:2px solid transparent;cursor:pointer;transition:all var(--transition);text-decoration:none;white-space:nowrap}
.btn-primary{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.btn-hero{padding:.875rem 2rem;font-size:.9375rem;font-weight:700}
/* OSNOVNO pravilo je do v1.154 bilo bijeli tekst na prozirno bijeloj podlozi,
   dakle pretpostavka da hero UVIJEK stoji na tamnoj plohi. Postojale su svijetle
   iznimke (`.hero-inner`, `.hero-centered:not(.hero-centered-bg)`,
   `.hero-minimal:not(--img)`), ali svaka varijanta koja u njih ne upada dobivala
   je nevidljiv gumb — na odvjetničkom uredu Holjar upravo se to dogodilo.
   Sada je zadano ČITLJIVO, a bijela se uključuje samo ondje gdje je podloga
   stvarno tamna. Nova varijanta heroja tako ne može naslijediti nevidljivost. */
.btn-hero-outline{background:transparent;color:var(--text);border:2px solid var(--text);padding:.875rem 2rem;border-radius:var(--btn-radius);font-weight:700;font-size:.9375rem;transition:all .25s;display:inline-flex;align-items:center;text-decoration:none}
.btn-hero-outline:hover{background:var(--text);color:var(--bg);transform:translateY(-1px)}
/* Tamne podloge: fotografija ispod heroja, tamna traka ili preljev. */
.hero-centered-bg .btn-hero-outline,.hero-minimal--img .btn-hero-outline,
.hero-image .btn-hero-outline,.hslide .btn-hero-outline,.sec-dark .btn-hero-outline{
  background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.3);backdrop-filter:blur(8px)}
.hero-centered-bg .btn-hero-outline:hover,.hero-minimal--img .btn-hero-outline:hover,
.hero-image .btn-hero-outline:hover,.hslide .btn-hero-outline:hover,.sec-dark .btn-hero-outline:hover{
  background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.65);color:#fff}
.btn-primary:hover{background:var(--primary-h);border-color:var(--primary-h);color:var(--on-primary);transform:translateY(-1px);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.btn-secondary{background:transparent;color:var(--text);border-color:var(--text)}
.btn-secondary:hover{background:var(--text);color:var(--bg);transform:translateY(-1px)}
/* Ghost gumb je do v1.151 imao TVRDO UPISANU bijelu boju i bijelu prozirnu
   pozadinu. To je pretpostavljalo da hero uvijek stoji na tamnoj plohi. Na
   svijetlom herou Auto Servisa Gile gumb „Saznajte više" bio je bijeli tekst na
   gotovo bijeloj podlozi — postojao je, ali ga se nije vidjelo.
   Sada uzima tokene sekcije, pa `sec-dark` sam vraća svijetlu varijantu. */
.btn-ghost{background:var(--chip-bg,rgba(0,0,0,.045));color:var(--text);border-color:var(--border)}
.btn-ghost:hover{background:var(--text);color:var(--bg)}
/* ── GLOBALNI STIL GUMBA ────────────────────────────────────────────────
   `button_style` mijenja samo tretman CTA-a. Radius uvijek dolazi iz
   postojećeg `--btn-radius` tokena / Globalne zaobljenosti. `auto` ne dodaje
   body klasu i čuva layout-specifični dizajn. */
body.button-style-full :is(.btn-primary,.btn-accent,.btn-secondary){background:var(--primary)!important;color:var(--on-primary)!important;border-color:var(--primary)!important;box-shadow:0 6px 18px rgba(0,0,0,.12)}
body.button-style-full :is(.btn-primary,.btn-accent,.btn-secondary):hover{background:var(--primary-h)!important;color:var(--on-primary)!important;border-color:var(--primary-h)!important}
body.button-style-outline :is(.btn-primary,.btn-accent,.btn-secondary){background:transparent!important;color:var(--primary)!important;border-color:currentColor!important;box-shadow:none!important}
body.button-style-outline :is(.btn-primary,.btn-accent,.btn-secondary):hover{background:var(--primary)!important;color:var(--on-primary)!important;border-color:var(--primary)!important;box-shadow:none!important}
body.button-style-minimal :is(.btn-primary,.btn-accent,.btn-secondary,.btn-outline,.btn-hero-outline,.btn-outline-white,.pr-btn-ghost){background:transparent!important;color:var(--primary)!important;border-color:transparent!important;box-shadow:none!important;padding-left:.2rem!important;padding-right:.2rem!important;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em}
body.button-style-minimal :is(.btn-primary,.btn-accent,.btn-secondary,.btn-outline,.btn-hero-outline,.btn-outline-white,.pr-btn-ghost):hover{background:transparent!important;color:var(--primary-h)!important;border-color:transparent!important;box-shadow:none!important;transform:none!important}
/* Tamne/photo hero plohe: outline/minimal mora ostati čitljiv. */
body.button-style-outline :is(.hero-centered-bg,.hero-minimal--img,.hero-image,.hslide,.sec-dark,.sec-accent) .btn-primary,
body.button-style-minimal :is(.hero-centered-bg,.hero-minimal--img,.hero-image,.hslide,.sec-dark,.sec-accent) :is(.btn-primary,.btn-secondary,.btn-outline,.btn-hero-outline){color:#fff!important;border-color:currentColor!important}
body.button-style-outline :is(.hero-centered-bg,.hero-minimal--img,.hero-image,.hslide,.sec-dark,.sec-accent) .btn-primary:hover{background:#fff!important;color:#111!important;border-color:#fff!important}
body.button-style-minimal :is(.hero-centered-bg,.hero-minimal--img,.hero-image,.hslide,.sec-dark,.sec-accent) :is(.btn-primary,.btn-secondary,.btn-outline,.btn-hero-outline):hover{color:#fff!important;opacity:.78}
/* CTA sekcija ima vlastiti kontrastni token. */
body.button-style-outline .cta-section .btn-primary{background:transparent!important;color:var(--cta-btn-bg)!important;border-color:var(--cta-btn-bg)!important}
body.button-style-outline .cta-section .btn-primary:hover{background:var(--cta-btn-bg)!important;color:var(--cta-btn-fg)!important}
body.button-style-minimal .cta-section .btn-primary{background:transparent!important;color:var(--cta-btn-bg)!important;border-color:transparent!important}
body.button-style-minimal .cta-section .btn-primary:hover{color:var(--cta-btn-bg)!important;opacity:.78}
/* Header CTA mora koristiti boju koja je čitljiva na samom headeru. */
body.button-style-full .cta-section .btn-primary{background:var(--cta-btn-bg)!important;color:var(--cta-btn-fg)!important;border-color:var(--cta-btn-bg)!important}
body.button-style-full .ftr-cta .footer-cta-btn{background:#fff!important;color:var(--primary)!important;border-color:#fff!important}
body.button-style-full .site-header .header-cta{background:var(--primary)!important;color:var(--on-primary)!important;border-color:var(--primary)!important}
body.brand-fidelity-strict.button-style-full .site-header .header-cta{background:var(--brand-action-bg)!important;color:var(--brand-action-fg)!important;border-color:var(--brand-action-bg)!important}
body.button-style-outline .site-header .header-cta{background:transparent!important;border-color:currentColor!important;box-shadow:none!important}
body.button-style-minimal .site-header .header-cta{background:transparent!important;border-color:transparent!important;box-shadow:none!important;padding-left:.25rem!important;padding-right:.25rem!important;text-decoration:underline;text-underline-offset:.3em}
body:is(.button-style-outline,.button-style-minimal):is(.hdr-type-classic,.hdr-type-centered,.hdr-type-transparent,.hdr-type-bold,.hdr-type-topbar) .site-header .header-cta{color:#fff!important}
body:is(.button-style-outline,.button-style-minimal):is(.hdr-type-minimal,.hdr-type-split,.hdr-type-floating) .site-header .header-cta{color:var(--text)!important}
body:is(.button-style-outline,.button-style-minimal).hdr-scheme-light .site-header .header-cta{color:var(--hdr-fg-light)!important}
body:is(.button-style-outline,.button-style-minimal).hdr-scheme-dark .site-header .header-cta{color:var(--hdr-fg-dark)!important}
body:is(.button-style-outline,.button-style-minimal).hdr-scheme-primary .site-header .header-cta{color:var(--hdr-fg-primary)!important}
body:is(.button-style-outline,.button-style-minimal).hdr-custom .site-header .header-cta{color:var(--hdr-custom-fg)!important}
body.button-style-outline .site-header .header-cta:hover{background:color-mix(in srgb,currentColor 13%,transparent)!important;border-color:currentColor!important}
body.button-style-minimal .site-header .header-cta:hover{background:transparent!important;opacity:.78}
/* Kontekstualni bijeli CTA-i zadržavaju kontrast, ali prate odabrani tretman. */
body.button-style-outline :is(.ftr-cta,.pr-main,.cat-ov-card) :is(.footer-cta-btn,.pr-btn-cream,.cat-ov-btn){background:transparent!important;color:#fff!important;border:2px solid currentColor!important;box-shadow:none!important}
body.button-style-minimal :is(.ftr-cta,.pr-main,.cat-ov-card) :is(.footer-cta-btn,.pr-btn-cream,.cat-ov-btn){background:transparent!important;color:#fff!important;border-color:transparent!important;box-shadow:none!important;text-decoration:underline;text-underline-offset:.3em}
body.button-style-full .cat-ov-btn{border-radius:var(--btn-radius)}
.grid-1{display:grid;grid-template-columns:1fr;gap:var(--stack-gap);max-width:700px;margin:0 auto}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--stack-gap)}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(max(240px,calc((100% - var(--stack-gap) - var(--stack-gap))/3)),1fr));gap:var(--stack-gap)}
.grid-4{display:grid;grid-template-columns:repeat(auto-fit,minmax(max(200px,calc((100% - var(--space-5) - var(--space-5) - var(--space-5))/4)),1fr));gap:var(--space-5)}
.grid-fixed{display:grid;gap:var(--stack-gap)}
.grid-fixed-1{grid-template-columns:1fr;max-width:700px;margin:0 auto}
.grid-fixed-2{grid-template-columns:repeat(2,1fr)}
.grid-fixed-3{grid-template-columns:repeat(3,1fr)}
.grid-fixed-4{grid-template-columns:repeat(4,1fr)}
/* v1.213: ručni `Broj stupaca` dobiva i section-level contract.
   Renderer i dalje smije koristiti gridClass(), ali sekcija nosi `sec-cols-N`
   pa i stariji/hardkodirani grid wrapperi pouzdano poštuju isti odabir.
   Override vrijedi samo na desktopu; postojeći responsive breakpointi i dalje
   spuštaju 3/4 → 2, zatim sve → 1 na mobitelu. */
@media(min-width:861px){
  section.sec-cols-1 :is(.pricing-grid,.logos-grid,.logos-cards,.catalog-grid,.catalog-showcase-grid,.cat-ov-grid,.cat-ed-grid,.svc-ed-grid,.gallery-grid,.gallery-contactsheet,.tm-grid,.references-grid,.standards-grid,.certificates-cards,.certificates-showcase,.documents-cards,.reviews-grid,.faq-grid,.blog-grid){grid-template-columns:repeat(1,minmax(0,1fr))!important}
  section.sec-cols-2 :is(.pricing-grid,.logos-grid,.logos-cards,.catalog-grid,.catalog-showcase-grid,.cat-ov-grid,.cat-ed-grid,.svc-ed-grid,.gallery-grid,.gallery-contactsheet,.tm-grid,.references-grid,.standards-grid,.certificates-cards,.certificates-showcase,.documents-cards,.reviews-grid,.faq-grid,.blog-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important}
  section.sec-cols-3 :is(.pricing-grid,.logos-grid,.logos-cards,.catalog-grid,.catalog-showcase-grid,.cat-ov-grid,.cat-ed-grid,.svc-ed-grid,.gallery-grid,.gallery-contactsheet,.tm-grid,.references-grid,.standards-grid,.certificates-cards,.certificates-showcase,.documents-cards,.reviews-grid,.faq-grid,.blog-grid){grid-template-columns:repeat(3,minmax(0,1fr))!important}
  section.sec-cols-4 :is(.pricing-grid,.logos-grid,.logos-cards,.catalog-grid,.catalog-showcase-grid,.cat-ov-grid,.cat-ed-grid,.svc-ed-grid,.gallery-grid,.gallery-contactsheet,.tm-grid,.references-grid,.standards-grid,.certificates-cards,.certificates-showcase,.documents-cards,.reviews-grid,.faq-grid,.blog-grid){grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
/* Dynamic content grids: never reserve an empty desktop column when the
   section contains fewer real items than its layout maximum. */
/* `display:grid` je OVDJE NUŽAN, i njegov izostanak je bio kvar od v1.131.
   `gridClass()` vraća ILI `grid-3` ILI `grid-fixed grid-fixed-N` ILI
   `adaptive-cols-N` — prva dva nose `display:grid`, treći ga nije nosio.
   Omoti koji se na njega oslanjaju (`cat-ov-grid`, `catalog-grid`,
   `team-grid`, `logos-grid`, `logos-cards`) deklariraju samo `gap`, pa je
   `grid-template-columns` bio bez učinka i kartice su padale JEDNA ISPOD
   DRUGE, punom širinom.
   Vidjelo se tek kad je `grid_balance` uključen — a v1.132 ga uključuje
   zadano SVAKOM novom AI projektu. Izmjereno u headless Chromiumu:
   catalog s 3 stavke, balance on → display:block, prva kartica 1116 px;
   isti sadržaj s balance off → display:grid, 356 px.
   Regresija: tools/structure_test.php → adaptive-grid-has-display */
.adaptive-cols-1,.adaptive-cols-2,.adaptive-cols-3,.adaptive-cols-4{display:grid;gap:var(--stack-gap)}
.adaptive-cols-1{grid-template-columns:minmax(0,1fr)!important}
.adaptive-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.adaptive-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.adaptive-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}
/* Siroče u zadnjem redu.
   Za neke brojeve stavki nijedan broj stupaca ne izbjegne usamljenu karticu —
   7 stavki u najviše 3 stupca je 3+3+1 ili 2+2+2+1, oboje ostavlja jednu samu.
   Tada je centriramo umjesto da visi uz lijevi rub. Do v1.131 u cijelom
   stylesheetu nije bilo nijednog :nth-last-child pravila, pa se zadnji red
   nigdje nije obrađivao.
   Regresija: tools/structure_test.php → grid-orphan-css */
.adaptive-cols-3 > :last-child:nth-child(3n+1){grid-column:2}
.adaptive-cols-4 > :last-child:nth-child(4n+1){grid-column:2/span 2}
@media(max-width:860px){.grid-fixed-3,.grid-fixed-4,.adaptive-cols-3,.adaptive-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .adaptive-cols-3 > :last-child:nth-child(3n+1),.adaptive-cols-4 > :last-child:nth-child(4n+1){grid-column:auto}}
@media(max-width:560px){.grid-fixed-2,.grid-fixed-3,.grid-fixed-4,.adaptive-cols-2,.adaptive-cols-3,.adaptive-cols-4{grid-template-columns:1fr!important}}
/* ── ANIMACIJE ── */
.ss-fade{opacity:0;transform:translateY(28px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1)}
.ss-fade.ss-in{opacity:1;transform:none}
@keyframes heroRise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.hero-rise{animation:heroRise .75s cubic-bezier(.16,1,.3,1) both}
@media (prefers-reduced-motion:reduce){.hero-rise{animation:none}}
/* ── STICKY HEADER ── */
.site-header.scrolled{box-shadow:0 2px 20px rgba(0,0,0,.15)!important}
.hdr-minimal.scrolled{background:#fff!important}
.hdr-transparent.scrolled{background:var(--secondary)!important}
body.hdr-scheme-light .hdr-transparent.scrolled{background:var(--surface)!important}
body.hdr-scheme-dark .hdr-transparent.scrolled{background:var(--scheme-dark)!important}
body.hdr-scheme-primary .hdr-transparent.scrolled{background:var(--primary)!important}
body.hdr-custom .hdr-transparent.scrolled{background:var(--hdr-custom-bg)!important}
.hdr-floating.scrolled{box-shadow:none!important}
/* ── GRADIENT TEKST ── */
.text-gradient{background:linear-gradient(135deg,var(--primary),var(--accent,#a78bfa));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
/* ── DEKORATIVNI KRUGOVI ── */
.deco-blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.12;pointer-events:none;z-index:0}
.deco-blob-1{width:600px;height:600px;background:var(--primary);top:-20%;right:-10%}
.deco-blob-2{width:400px;height:400px;background:var(--accent,#a78bfa);bottom:-10%;left:-5%}

/* ── AI DESIGN ENRICHMENT (v1.187.1) ─────────────────────────────────────
   Samo novi AI projekti dobivaju ss-* klase kroz DesignEnrichmentEngine.
   Existing/published projekti bez klasa ostaju piksel-identični. */
section[class*="ss-detail-"],section[class*="ss-hero-"]{position:relative;isolation:isolate;overflow:hidden}
section[class*="ss-detail-"]>.container,section[class*="ss-hero-"]>.container{position:relative;z-index:2}
.ss-detail-grid::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.42;background-image:linear-gradient(color-mix(in srgb,var(--primary) 8%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--primary) 8%,transparent) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 82%,transparent 100%)}
.ss-detail-orbit::after{content:'';position:absolute;width:360px;height:360px;border:1px solid color-mix(in srgb,var(--primary) 23%,transparent);border-radius:50%;right:-180px;top:50%;transform:translateY(-50%);z-index:0;box-shadow:0 0 0 42px color-mix(in srgb,var(--primary) 3%,transparent),0 0 0 84px color-mix(in srgb,var(--primary) 2%,transparent);pointer-events:none}
.ss-detail-corner::before{content:'';position:absolute;right:max(22px,5vw);top:32px;width:72px;height:72px;border-top:3px solid var(--primary);border-right:3px solid var(--primary);opacity:.48;z-index:1;pointer-events:none}
.ss-detail-rule::before{content:'';position:absolute;left:max(20px,calc((100vw - var(--container,1200px))/2 - 38px));top:18%;bottom:18%;width:2px;background:linear-gradient(180deg,transparent,var(--primary),transparent);opacity:.32;z-index:1;pointer-events:none}
.ss-detail-stripe::after{content:'';position:absolute;left:0;top:0;width:clamp(90px,18vw,270px);height:5px;background:linear-gradient(90deg,var(--primary),var(--accent));z-index:3;pointer-events:none}
.ss-detail-glow::before{content:'';position:absolute;width:420px;height:420px;border-radius:50%;background:var(--primary);filter:blur(110px);opacity:.07;right:-120px;top:-160px;z-index:0;pointer-events:none}
.ss-detail-dots::before{content:'';position:absolute;width:180px;height:180px;right:5vw;bottom:28px;opacity:.16;background-image:radial-gradient(var(--primary) 1.5px,transparent 1.5px);background-size:14px 14px;z-index:0;pointer-events:none}
.ss-hero-rail::before{content:'';position:absolute;left:0;top:12%;bottom:12%;width:6px;background:linear-gradient(180deg,var(--accent),var(--primary));z-index:4}
.ss-hero-corner::after{content:'';position:absolute;right:5vw;top:4.5rem;width:90px;height:90px;border-top:4px solid color-mix(in srgb,var(--accent) 75%,transparent);border-right:4px solid color-mix(in srgb,var(--accent) 75%,transparent);z-index:1;pointer-events:none}
.ss-hero-orbit::after{content:'';position:absolute;width:min(48vw,620px);aspect-ratio:1;border-radius:50%;border:1px solid color-mix(in srgb,var(--on-primary,currentColor) 20%,transparent);right:-18vw;bottom:-55%;box-shadow:0 0 0 58px color-mix(in srgb,var(--accent) 5%,transparent),0 0 0 116px color-mix(in srgb,var(--accent) 3%,transparent);pointer-events:none}
.ss-head-left .section-header{margin-left:0;margin-right:0;text-align:left;max-width:760px}
.ss-head-center .section-header{margin-left:auto;margin-right:auto;text-align:center}
.ss-head-offset .section-header{margin-left:clamp(0px,7vw,90px);margin-right:0;text-align:left;max-width:720px}
.ss-head-rule .section-header{margin-left:0;margin-right:0;text-align:left;max-width:760px;padding-left:1.1rem;border-left:3px solid var(--primary)}
.ss-cards-lift :is(.service-card,.svc-img-card,.pricing-card,.faq-item,.std-card,.reference-card,.about-card,.step-card,.team-card,.catalog-item){box-shadow:0 16px 44px rgba(14,28,52,.10);border-color:color-mix(in srgb,var(--primary) 12%,var(--border))}
.ss-cards-outline :is(.service-card,.svc-img-card,.pricing-card,.faq-item,.std-card,.reference-card,.about-card,.step-card,.team-card,.catalog-item){border-color:color-mix(in srgb,var(--primary) 25%,var(--border));box-shadow:none}
.ss-cards-soft :is(.service-card,.svc-img-card,.pricing-card,.faq-item,.std-card,.reference-card,.about-card,.step-card,.team-card,.catalog-item){border-radius:calc(var(--radius) * 1.45);box-shadow:0 12px 34px rgba(14,28,52,.07)}
.ss-cards-clean :is(.service-card,.svc-img-card,.pricing-card,.faq-item,.std-card,.reference-card,.about-card,.step-card,.team-card,.catalog-item){box-shadow:none}
@media(min-width:861px){.ss-cards-stagger :is(.service-card,.svc-img-card,.pricing-card,.std-card,.reference-card,.step-card,.team-card,.catalog-item):nth-child(even){transform:translateY(18px)}}
@media(max-width:860px){.ss-head-offset .section-header{margin-left:0}.ss-detail-rule::before,.ss-detail-corner::before,.ss-detail-dots::before{display:none}}
/* ── GLASSMORPHISM ── */
.glass{background:rgba(255,255,255,.08);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.15)}
/* ── DIVIDER WAVE ── */
.wave-divider{width:100%;overflow:hidden;line-height:0;margin-top:-1px}
.wave-divider svg{display:block;width:100%}
/* ── HIGHLIGHT BADGE ── */
.highlight-badge{display:inline-flex;align-items:center;gap:6px;background:var(--primary-l);color:var(--primary);border:1px solid var(--primary-l);padding:.375rem 1rem;border-radius:100px;font-size:.8125rem;font-weight:700;margin-bottom:1.5rem}
.highlight-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--primary);animation:pulse-dot 2s infinite}
@keyframes pulse-dot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}}
/* ── CARD SHINE ── */
.card-shine{position:relative;overflow:hidden}
.card-shine::after{content:'';position:absolute;top:-50%;left:-60%;width:40%;height:200%;background:linear-gradient(to right,transparent,rgba(255,255,255,.06),transparent);transform:skewX(-20deg);transition:left .6s}
.card-shine:hover::after{left:120%}
/* ── NUMBER HIGHLIGHT ── */
.stat-value{background:linear-gradient(135deg,var(--accent,#fff),rgba(255,255,255,.9));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
/* ── FAQ ──────────────────────────────────────────────────────────────────
   JEDNA definicija po elementu. Do v1.131 su .faq-item, .faq-question i
   .faq-answer bili deklarirani na DVA mjesta (ovdje i u "FAQ varijante"
   bloku). Oba su se primjenjivala, pa je svako pitanje imalo istovremeno
   'Q' značku (::before) i '+' toggle (::after), a stavka i puni okvir i
   donji rub unutar overflow:hidden kutije. Ne dodavati drugu deklaraciju
   ovih selektora — varijantne razlike idu kroz .faq-acc / .faq-grid.
   Regresija: tools/structure_test.php → faq-single-decoration           */
.faq-item{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:.5rem;overflow:hidden;transition:box-shadow .2s;background:var(--surface)}
.faq-item:hover,.faq-item.faq-open{box-shadow:0 4px 16px rgba(0,0,0,.08)}
.faq-question{display:flex;width:100%;justify-content:space-between;align-items:center;padding:.9rem 1.35rem;font-weight:600;font-size:1rem;color:var(--text);gap:1rem;user-select:none;background:none;border:0;font-family:inherit;text-align:left;cursor:pointer}
.faq-question::after{content:'+';font-size:1.5rem;font-weight:300;color:var(--primary);flex-shrink:0;transition:transform .3s;line-height:1}
.faq-question[aria-expanded="true"]::after,.faq-question.faq-open::after{transform:rotate(45deg)}
.faq-question:focus-visible{outline:2px solid var(--primary);outline-offset:-2px}
.faq-answer{padding:0 1.35rem;max-height:0;overflow:hidden;opacity:0}
.faq-item.faq-open .faq-answer{max-height:none;opacity:1}
.faq-answer p{padding-bottom:1rem;color:var(--muted);line-height:1.7;font-size:.9375rem}
/* ── SECTION DIVIDERS ── */
.section-alt{background:rgba(0,0,0,.02)}
/* ── MOBILE ── */
@media(max-width:768px){.deco-blob{display:none}}
/* Header */
/* ── GLOBAL TOP BAR ─────────────────────────────────────────── */
.site-topbar{background:var(--secondary);color:var(--on-secondary);font-size:.78rem;line-height:1.2;position:relative;z-index:101}
.topbar-inner{min-height:34px;display:flex;align-items:center;justify-content:flex-end;gap:.7rem;white-space:nowrap;overflow:hidden}
.site-topbar a,.site-topbar span{color:inherit;text-decoration:none}
.site-topbar a:hover{color:var(--on-secondary);text-decoration:underline}
.topbar-sep{width:1px;height:13px;background:rgba(255,255,255,.22);flex:0 0 1px}
.topbar-hours{background:var(--primary)}
.topbar-utility{background:linear-gradient(90deg,var(--secondary),color-mix(in srgb,var(--secondary) 78%,var(--primary)))}
.has-topbar.hdr-type-transparent .site-topbar{position:fixed;top:0;left:0;right:0}
.has-topbar .site-header.hdr-transparent{top:34px}
.has-topbar.hdr-type-transparent .hero{padding-top:0}
@media(max-width:760px){.topbar-inner{justify-content:center}.topbar-inner>*:nth-child(n+4){display:none}.site-topbar{font-size:.72rem}}

/* ── HEADER BASE ────────────────────────────────────────────── */
.site-header{padding:0;position:sticky;top:0;z-index:100}
.header-inner{display:flex;align-items:center;height:68px;gap:1.5rem}
.site-logo{font-family:var(--font-head);font-size:1.25rem;font-weight:800;text-decoration:none;white-space:nowrap;display:flex;align-items:center;gap:10px}
.site-logo-img{height:var(--site-logo-height,46px);width:auto;max-width:240px;object-fit:contain;display:block}
.site-logo-text{line-height:1}
.site-nav{display:flex;gap:.25rem;margin-left:auto;align-items:center}
.site-nav a{padding:.5rem .875rem;border-radius:6px;font-size:.9375rem;font-weight:500;transition:all var(--transition);text-decoration:none}
.header-cta{margin-left:.5rem}
/* CTA u headeru: poravnat s nav linkovima (ne nasljeđuj veliki in-page padding .btn-a) */
.site-header .header-cta{padding:.5rem 1.15rem!important;font-size:.9375rem!important;line-height:1.25!important;border-radius:var(--btn-radius);align-self:center}
/* Header ponašanje: sticky toggle (zadano lijepljiv) + puna širina */
.hdr-no-sticky .site-header:not(.hdr-transparent):not(.hdr-floating){position:relative;top:auto}
.hdr-no-sticky .site-header.hdr-transparent,.hdr-no-sticky .site-header.hdr-floating{position:absolute}
.hdr-fullwidth .site-header .container{max-width:none}
.lang-switcher{display:flex;align-items:center;gap:3px;margin-right:6px;background:rgba(255,255,255,.1);border-radius:6px;padding:3px}
.lang-item{font-size:15px;text-decoration:none;opacity:.65;transition:all .2s;cursor:pointer;padding:3px 6px;border-radius:4px;line-height:1;display:inline-flex;align-items:center}
.lang-item:hover{opacity:1;background:rgba(255,255,255,.15)}
.lang-item.lang-active{opacity:1;background:rgba(255,255,255,.25)}
.hdr-minimal .lang-switcher{background:rgba(0,0,0,.06)}
.hdr-minimal .lang-item:hover{background:rgba(0,0,0,.08)}
.hdr-minimal .lang-item.lang-active{background:rgba(0,0,0,.1)}
.btn-outline-white{border:2px solid rgba(255,255,255,.7);color:#fff;padding:.5rem 1.25rem;border-radius:var(--btn-radius);font-weight:600;transition:all .2s;text-decoration:none;display:inline-flex;align-items:center}
.btn-outline-white:hover{background:#fff;color:var(--secondary)}
/* Technical component visibility: even outline actions need a visible edge. */
.site-header .header-cta{outline:1px solid color-mix(in srgb,currentColor 12%,transparent);outline-offset:-1px}
.hdr-transparent .header-cta{box-shadow:0 4px 18px rgba(0,0,0,.18);backdrop-filter:blur(7px)}
.btn-accent{background:var(--accent,#f59e0b);color:var(--on-accent);padding:.625rem 1.5rem;border-radius:var(--btn-radius);font-weight:600;transition:all .2s;text-decoration:none}
.btn-accent:hover{opacity:.9;transform:translateY(-1px)}

/* ── HEADER: Classic ── */
.hdr-classic{background:var(--secondary);box-shadow:0 1px 3px rgba(0,0,0,.15)}
.hdr-classic .site-logo,.hdr-classic .site-logo-text{color:var(--on-secondary)}
.hdr-classic .site-nav a{color:color-mix(in srgb,var(--on-secondary) 82%,transparent)}
.hdr-classic .site-nav a:hover,.hdr-classic .site-nav a.active{background:color-mix(in srgb,var(--on-secondary) 12%,transparent);color:var(--on-secondary)}

/* ── HEADER: Centered ── */
.hdr-centered{background:var(--secondary);box-shadow:0 1px 3px rgba(0,0,0,.15)}
.hdr-centered .hdr-centered-top{display:flex;justify-content:center;padding:1rem 0 .75rem;border-bottom:1px solid color-mix(in srgb,var(--footer-fg) 12%,transparent)}
.hdr-centered .hdr-centered-nav{display:flex;justify-content:center;padding:.5rem 0}
.hdr-centered .site-nav{margin-left:0}
.hdr-centered .site-logo,.hdr-centered .site-logo-text{color:var(--on-secondary);font-size:1.5rem}
.hdr-centered .site-nav a{color:color-mix(in srgb,var(--on-secondary) 82%,transparent)}
.hdr-centered .site-nav a:hover,.hdr-centered .site-nav a.active{color:var(--on-secondary);background:color-mix(in srgb,var(--on-secondary) 10%,transparent)}

/* ── HEADER: Minimal ── */
.hdr-minimal{background:#fff;border-bottom:1px solid rgba(0,0,0,.08);box-shadow:0 1px 8px rgba(0,0,0,.06)}
.hdr-minimal .site-logo,.hdr-minimal .site-logo-text{color:var(--text)}
.hdr-minimal .site-nav a{color:var(--muted)}
.hdr-minimal .site-nav a:hover,.hdr-minimal .site-nav a.active{color:var(--primary);background:var(--primary-l)}

/* ── HEADER: Split ── */
.hdr-split{background:#fff;border-bottom:1px solid rgba(0,0,0,.07);box-shadow:0 6px 22px rgba(15,23,42,.06)}
.hdr-split-inner{min-height:76px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(1rem,3vw,2rem)}
.hdr-split .site-logo,.hdr-split .site-logo-text{color:var(--text)}
.hdr-split .site-nav{margin-left:0;justify-self:center}
.hdr-split .site-nav a{color:var(--muted)}
.hdr-split .site-nav a:hover,.hdr-split .site-nav a.active{color:var(--primary);background:var(--primary-l)}
.hdr-split-action{margin-left:0!important;box-shadow:0 8px 22px color-mix(in srgb,var(--primary) 22%,transparent)}
@media(max-width:900px){.hdr-split-inner{display:flex;min-height:68px}.hdr-split .site-nav,.hdr-split-action{display:none}.hdr-split .nav-toggle{display:flex}}

/* ── HEADER: Transparent ── */
.site-header.hdr-transparent{background:transparent;position:fixed;left:0;right:0;top:0}
.hdr-type-transparent .hero{padding-top:0}
.hdr-type-transparent .blog-index,.hdr-type-transparent .blog-detail{padding-top:calc(68px + clamp(1.5rem,4vw,3rem))}
.hdr-type-transparent .hero-full{min-height:min(92vh,900px)}
.hdr-type-transparent .hero-full .hero-full-inner{padding-top:clamp(9rem,14vw,12rem)}
.hdr-type-transparent .hero-full .hero-full-overlay{background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,.12) 16%,rgba(0,0,0,0) 28%),linear-gradient(105deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.35) 55%,rgba(0,0,0,.05) 100%)}
.hdr-transparent .site-logo,.hdr-transparent .site-logo-text{color:#fff}
.hdr-transparent .site-nav a{color:rgba(255,255,255,.85)}
.hdr-transparent .site-nav a:hover,.hdr-transparent .site-nav a.active{color:#fff;background:rgba(255,255,255,.15)}

/* ── HEADER: Bold ── */
.hdr-bold{background:linear-gradient(135deg,var(--secondary) 0%,var(--primary) 100%);box-shadow:0 2px 12px rgba(0,0,0,.2)}
.hdr-bold .header-inner{height:80px}
.hdr-bold .site-logo,.hdr-bold .site-logo-text{color:#fff;font-size:1.5rem}
.hdr-bold .site-logo-img{height:var(--site-logo-height,48px)}
.hdr-bold .site-nav a{color:rgba(255,255,255,.85)}
.hdr-bold .site-nav a:hover,.hdr-bold .site-nav a.active{color:#fff;background:rgba(255,255,255,.15)}

/* ── LAYOUT: boxed / padded (okvir) ── */
body.layout-boxed,body.layout-padded{background:var(--body-bg)}
.layout-boxed .page-shell,.layout-padded .page-shell{max-width:1400px;margin-left:auto;margin-right:auto;background:var(--bg);position:relative}
.layout-boxed .page-shell{box-shadow:0 0 0 1px var(--border),0 12px 50px rgba(0,0,0,.10)}
.layout-padded .page-shell{margin-top:clamp(1rem,3vw,2.5rem);margin-bottom:clamp(1rem,3vw,2.5rem);border-radius:clamp(14px,2vw,26px);overflow:clip;box-shadow:0 24px 70px rgba(0,0,0,.16)}

/* ── HEADER SCHEME (boja, neovisno o stilu headera) ── */
/* Transparent header: suptilni gornji scrim za čitljivost preko slike (prije shema da ga shema može nadjačati) */
.site-header.hdr-transparent{background:var(--hdr-overlay-bg)}
.hdr-scheme-light .site-header:not(.hdr-transparent):not(.hdr-floating){background:var(--surface);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.hdr-scheme-light .site-header .site-logo,.hdr-scheme-light .site-header .site-logo-text{color:var(--text)}
.hdr-scheme-light .site-header .site-nav a{color:var(--hdr-fg-light)}
.hdr-scheme-light .site-header .site-nav a:hover,.hdr-scheme-light .site-header .site-nav a.active{color:var(--hdr-act-light);background:var(--chip-bg)}
.hdr-scheme-dark .site-header:not(.hdr-transparent):not(.hdr-floating){background:var(--scheme-dark);box-shadow:0 1px 3px rgba(0,0,0,.18)}
.hdr-scheme-dark .site-header .site-logo,.hdr-scheme-dark .site-header .site-logo-text{color:#fff}
.hdr-scheme-dark .site-header .site-nav a{color:var(--hdr-fg-dark)}
.hdr-scheme-dark .site-header .site-nav a:hover,.hdr-scheme-dark .site-header .site-nav a.active{color:#fff;background:rgba(255,255,255,.14)}
.hdr-scheme-primary .site-header:not(.hdr-transparent):not(.hdr-floating){background:var(--primary);box-shadow:0 1px 3px rgba(0,0,0,.15)}
.hdr-scheme-primary .site-header .site-logo,.hdr-scheme-primary .site-header .site-logo-text{color:var(--on-primary)}
.hdr-scheme-primary .site-header .site-nav a{color:var(--hdr-fg-primary)}
.hdr-scheme-primary .site-header .site-nav a:hover,.hdr-scheme-primary .site-header .site-nav a.active{color:var(--hdr-act-primary);opacity:1;background:rgba(255,255,255,.16)}
/* Stil headera određuje geometriju. Shema smije mijenjati boju teksta, ali
   NE smije transparentni header pretvoriti u čvrstu traku niti ga izbaciti iz
   overlay položaja. To vrijedi i za AI brand-fidelity projekte. */
.hdr-scheme-light .site-header.hdr-transparent,.hdr-scheme-dark .site-header.hdr-transparent,.hdr-scheme-primary .site-header.hdr-transparent{background:var(--hdr-overlay-bg);box-shadow:none}

/* ── FOOTER SCHEME (boja) ── */
.ftr-scheme-light .site-footer{--footer-fg:var(--text);background:var(--surface-2);color:var(--muted)}
.ftr-scheme-light .site-footer .footer-logo-text,.ftr-scheme-light .site-footer .footer-col-title{color:var(--text)}
.ftr-scheme-light .site-footer .footer-links a,.ftr-scheme-light .site-footer .footer-links li,.ftr-scheme-light .site-footer .footer-desc,.ftr-scheme-light .site-footer .footer-bottom{color:var(--muted)}
.ftr-scheme-light .site-footer .footer-links a:hover{color:var(--primary)}
.ftr-scheme-dark .site-footer{--footer-fg:#fff;background:var(--scheme-dark)}
.ftr-scheme-primary .site-footer{--footer-fg:var(--on-primary);background:var(--primary)}
.ftr-scheme-primary .site-footer .footer-logo-text,.ftr-scheme-primary .site-footer .footer-col-title{color:var(--on-primary)}
.ftr-scheme-primary .site-footer .footer-links a,.ftr-scheme-primary .site-footer .footer-links li,.ftr-scheme-primary .site-footer .footer-desc,.ftr-scheme-primary .site-footer .footer-bottom{color:var(--on-primary);opacity:.85}

/* ── RUČNE BOJE HEADERA / FOOTERA ──────────────────────────────────────────
   Eksplicitna korisnička boja je zadnji sloj i zato namjerno koristi !important.
   Tekst se računa Palette::foregroundOn() pa ostaje čitljiv i na proizvoljnoj
   pozadini. Floating header boji pilulu, ne cijeli prozirni overlay. */
body.hdr-custom .site-header:not(.hdr-floating):not(.hdr-transparent){background:var(--hdr-custom-bg)!important;color:var(--hdr-custom-fg)!important}
body.hdr-custom .site-header :is(.site-logo,.site-logo-text,.lang-switcher,.lang-switcher a){color:var(--hdr-custom-fg)!important}
body.hdr-custom .site-header .site-nav a{color:var(--hdr-custom-fg)!important;opacity:.88}
body.hdr-custom .site-header .site-nav a:hover,body.hdr-custom .site-header .site-nav a.active{color:var(--hdr-custom-fg)!important;opacity:1;background:color-mix(in srgb,var(--hdr-custom-fg) 14%,transparent)!important}
body.hdr-custom .site-header .header-cta{background:var(--hdr-custom-fg)!important;color:var(--hdr-custom-bg)!important;border-color:var(--hdr-custom-fg)!important}
body.hdr-custom .site-header.hdr-floating{background:transparent!important;box-shadow:none!important}
body.hdr-custom .site-header.hdr-floating .hdr-floating-pill{background:var(--hdr-custom-bg)!important;border-color:color-mix(in srgb,var(--hdr-custom-fg) 18%,transparent)!important}
body.hdr-custom .site-header.hdr-floating .hdr-floating-pill :is(.site-logo,.site-logo-text,.lang-switcher,.lang-switcher a),body.hdr-custom .site-header.hdr-floating .hdr-floating-pill .site-nav a{color:var(--hdr-custom-fg)!important}

body.ftr-custom .site-footer{background:var(--ftr-custom-bg)!important;color:var(--ftr-custom-fg)!important}
body.ftr-custom .site-footer :is(.footer-logo-text,.footer-logo,.footer-col-title,.footer-links a,.footer-links li,.footer-desc,.footer-copy,.footer-legal,.footer-legalbar a){color:var(--ftr-custom-fg)!important}
body.ftr-custom .site-footer :is(.footer-cols,.ftr-brand-grid,.ftr-centered-contact,.ftr-stacked-rail,.ftr-split-panel){border-color:color-mix(in srgb,var(--ftr-custom-fg) 16%,transparent)!important}
body.ftr-bottom-custom .site-footer .footer-legalbar{background:var(--ftr-bottom-custom-bg)!important;color:var(--ftr-bottom-custom-fg)!important}
body.ftr-bottom-custom .site-footer .footer-legalbar :is(.footer-copy,.footer-legal,.footer-legalbar-links a){color:var(--ftr-bottom-custom-fg)!important}

/* ── DIZAJN MOOD (stil, neovisno o boji/presetu) ── */
/* Klasično / Editorial — uredno, časopisno: oštri rubovi, kartice s obrubom, zračni razmaci */
body.mood-editorial{--space-unit:1.25;--mood-type-scale:1;--leading-tight:1.08;--leading-normal:1.75;--tracking-tight:-.025em;--tracking-wide:.18em}
body.mood-editorial h1{font-weight:700}
body.mood-editorial h2{font-weight:700}
body.mood-editorial .section-title{font-weight:700}
body.mood-editorial .section-eyebrow,body.mood-editorial .hero-eyebrow{font-weight:600;font-size:.72rem}
body.mood-editorial .btn{padding:.75rem 1.6rem;font-weight:600}

/* Upečatljivo / Bold — udarno: ogromni teški naslovi, jaka sjena, veliki razmaci */
body.mood-bold{--space-unit:1.4;--mood-type-scale:1.15;--leading-tight:1.02;--tracking-tight:-.035em;--tracking-wide:.06em}
body.mood-bold h1{font-weight:800}
body.mood-bold h2{font-weight:800}
body.mood-bold .section-title{font-weight:800}
body.mood-bold .section-eyebrow,body.mood-bold .hero-eyebrow{font-weight:800}
body.mood-bold .btn{padding:1.05rem 2.4rem;font-weight:800}

/* Elegantno / Minimal — smireno: lagane težine, suzdržano, maksimum praznog prostora */
body.mood-minimal{--space-unit:1.5;--mood-type-scale:.96;--leading-tight:1.18;--leading-normal:1.8;--tracking-tight:-.01em;--tracking-wide:.22em}
body.mood-minimal h1{font-weight:600}
body.mood-minimal h2{font-weight:600}
body.mood-minimal h3{font-weight:600}
body.mood-minimal .section-title{font-weight:600;letter-spacing:0}
body.mood-minimal .section-eyebrow,body.mood-minimal .hero-eyebrow{font-weight:600;font-size:.7rem;opacity:.85}
body.mood-minimal .btn{padding:.8rem 1.7rem;font-weight:600;border-width:var(--border-thin)}

/* Toplo / Soft — prijateljsko: veliki radius, pill gumbi, meke sjene */
body.mood-soft{--space-unit:1.15;--mood-type-scale:1.02;--leading-tight:1.12;--leading-normal:1.75;--tracking-tight:-.015em;--tracking-wide:.1em}
body.mood-soft h1{font-weight:700}
body.mood-soft h2{font-weight:700}
body.mood-soft .section-title{font-weight:700}
body.mood-soft .section-eyebrow,body.mood-soft .hero-eyebrow{font-weight:700}
body.mood-soft .btn{padding:.95rem 2.1rem;font-weight:700}

/* Hero */
.hero{position:relative;overflow:hidden}
.hero-split{background:linear-gradient(135deg,var(--bg) 50%,var(--primary-l) 100%);padding:clamp(4rem,8vw,7rem) 0}
.hero-full{background:var(--secondary);min-height:min(88vh,840px);display:flex;align-items:center;padding:0;position:relative;overflow:hidden}
.hero-full-bg{position:absolute;inset:0;background-size:cover;background-position:var(--ss-bg-position,center);background-attachment:var(--ss-bg-attachment,scroll);background-repeat:no-repeat;z-index:0}
.hero-full-overlay{position:absolute;inset:0;background:linear-gradient(105deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.40) 52%,rgba(0,0,0,.10) 100%),linear-gradient(180deg,transparent 50%,rgba(0,0,0,.45) 100%)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to right,rgba(0,0,0,.7) 0%,rgba(0,0,0,.35) 60%,rgba(0,0,0,.05) 100%);z-index:1;pointer-events:none}
.hero-bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
/* (v1.58.5) hero "blob" uklonjen — čišći, moderniji hero */
.hero-inner{display:grid;grid-template-columns:minmax(0,.92fr) minmax(360px,1.08fr);gap:clamp(2.5rem,6vw,6rem);align-items:center;position:relative;padding:clamp(4.75rem,8vw,7.25rem) 0}
.hdr-type-transparent .hero-inner,.hdr-type-floating .hero-inner{padding-top:0}
.hero-content{}
.hero-eyebrow{font-size:var(--text-sm);font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-wide);color:var(--primary);margin-bottom:var(--space-5);display:inline-flex;align-items:center;gap:var(--space-2)}
.hero-eyebrow::before{content:'';width:28px;height:2px;background:var(--primary);display:inline-block;border-radius:2px}

/* ── Eyebrow Design System ───────────────────────────────────────────────
   Nadnaslov nije više univerzalna crta + uppercase tekst. Stil se bira po
   sekciji (`data-eyebrow-style`) iz Design DNA-a ili ručno u editoru. */
body{counter-reset:ss-eyebrow}
section{counter-increment:ss-eyebrow}
section[data-eyebrow-style] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){transition:color .2s,background .2s,border-color .2s}
section[data-eyebrow-style] .hslide-eyebrow{display:inline-flex;align-items:center;gap:var(--space-2)}
section[data-eyebrow-style="line"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow)::before{content:'';width:28px;height:2px;background:var(--primary);border-radius:2px;flex-shrink:0}
section[data-eyebrow-style="plain"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow)::before,
section[data-eyebrow-style="pill"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow)::before,
section[data-eyebrow-style="label"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow)::before,
section[data-eyebrow-style="accent"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow)::before,
section[data-eyebrow-style="overline"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow)::before{display:none}
section[data-eyebrow-style="plain"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){text-transform:none;letter-spacing:.035em;font-weight:650}
section[data-eyebrow-style="pill"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){background:var(--chip-bg);color:var(--primary-link);padding:.42rem .8rem;border-radius:999px;letter-spacing:.06em}
section[data-eyebrow-style="label"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){border:1px solid color-mix(in srgb,var(--primary) 35%,var(--border));padding:.38rem .68rem;border-radius:max(2px,calc(var(--radius)*.32));letter-spacing:.08em}
section[data-eyebrow-style="dot"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow)::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--primary);flex-shrink:0}
section[data-eyebrow-style="number"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow)::before{content:counter(ss-eyebrow,decimal-leading-zero);width:auto;height:auto;background:none;border:0;border-bottom:1px solid currentColor;border-radius:0;padding-bottom:.12rem;font-family:var(--font-head);font-size:.9em;line-height:1;color:var(--primary)}
section[data-eyebrow-style="accent"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){background:var(--primary);color:var(--on-primary)!important;padding:.42rem .72rem;border-radius:max(2px,calc(var(--radius)*.25));letter-spacing:.07em}
section[data-eyebrow-style="overline"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){display:inline-block;border-top:2px solid var(--primary);padding-top:.52rem;letter-spacing:.12em}
section[data-eyebrow-style="none"] :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){display:none!important}
/* Na tamnim površinama dekoracija prati boju teksta osim kod accent stila. */
.sec-dark[data-eyebrow-style]:not([data-eyebrow-style="accent"]) :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow),
.sec-accent[data-eyebrow-style]:not([data-eyebrow-style="accent"]) :is(.section-eyebrow,.hero-eyebrow,.hslide-eyebrow,.ct-eyebrow){color:var(--text)}
.hero-title{font-family:var(--font-head);font-size:calc(clamp(2.5rem,5.5vw,4.25rem) * var(--type-scale));font-weight:900;line-height:var(--leading-tight);margin-bottom:var(--space-5);color:var(--text);letter-spacing:var(--tracking-tight)}
.hero-full-inner{padding:clamp(7rem,12vw,11rem) 0 clamp(5rem,8vw,7rem);position:relative;z-index:2;width:100%}
.hero-full-content{max-width:760px}
.hero-full .hero-title{color:#fff;font-size:calc(clamp(2.75rem,6vw,5.5rem) * var(--type-scale));letter-spacing:-.04em;line-height:1.02;text-shadow:0 2px 30px rgba(0,0,0,.4)}
.hero-full .hero-eyebrow{color:rgba(255,255,255,.65)}
.hero-full .hero-eyebrow::before{background:var(--primary)}
.hero-full .hero-text{color:rgba(255,255,255,.82);font-size:var(--text-lg);max-width:540px;line-height:var(--leading-normal)}
.hero-text{font-size:var(--text-lg);color:var(--muted);line-height:var(--leading-loose);margin-bottom:var(--space-7);max-width:480px}
.hero-actions{display:flex;gap:var(--space-4);flex-wrap:wrap}
.hero-image{position:relative;aspect-ratio:5/4;border-radius:calc(var(--radius) * 1.15);display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:.875rem;font-weight:600}
.hero-image::before{content:'';position:absolute;top:18px;left:18px;right:-18px;bottom:-18px;background:var(--primary-l);border-radius:inherit;z-index:0}
.hero-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;border-radius:var(--radius);z-index:1;box-shadow:0 34px 80px -28px rgba(0,0,0,.45),0 10px 30px -16px rgba(0,0,0,.22)}
.hero-image .img-placeholder{position:relative;z-index:2}
/* ── Objavljena stranica bez slike ──────────────────────────────────────────
   U uređivaču se crta okvir s „📷 Klikni za dodavanje slike" da korisnik ima
   gdje kliknuti. Na objavljenoj stranici tog okvira nema, pa bi bez ovoga
   ostala prazna polovica sekcije — sivi pravokutnik koji izgleda kao slika
   koja se nije učitala. Raspored se umjesto toga skuplja na jedan stupac.
   Isti mehanizam koji već koristi mobilni prikaz. */
.hero-inner.no-media,.about-ed-grid.no-media,.about-overlap-inner.no-media{grid-template-columns:1fr}
.about-fs.no-media{grid-template-columns:1fr;min-height:0}
.hero-inner.no-media .hero-image,
.about-ed-grid.no-media .about-ed-media,
.about-fs.no-media .about-fs-media,
.about-story.no-media .about-story-img,
.about-overlap-inner.no-media .about-overlap-img{display:none}
.about-overlap-inner.no-media .about-overlap-card{margin-left:0;margin-top:0}
.about-story.no-media .about-story-head{margin-top:0}
/* split hero — editorial tipografija + svijetli outline gumb (fiks: bio nevidljiv na svijetloj pozadini) */
.hero-inner .hero-title{font-size:calc(clamp(2.6rem,5.4vw,4.5rem) * var(--type-scale));line-height:var(--leading-tight);letter-spacing:var(--tracking-tight)}
.hero-inner .btn-hero-outline{background:transparent;color:var(--text);border:2px solid var(--text);opacity:.9;backdrop-filter:none}
.hero-inner .btn-hero-outline:hover{background:var(--text);color:var(--bg);opacity:1;transform:translateY(-1px)}
/* ── Hero: CENTERED ── */
.hero-centered{position:relative;text-align:center;padding:clamp(5.5rem,10vw,8rem) 0;background:radial-gradient(circle at 15% 18%,var(--primary-l) 0,transparent 30%),radial-gradient(circle at 86% 76%,var(--primary-l) 0,transparent 27%),var(--bg);overflow:hidden;border-bottom:1px solid var(--border)}
.hero-centered-inner{position:relative;z-index:2;max-width:900px;margin:0 auto}
.hero-centered::before{content:'';position:absolute;width:min(42vw,520px);aspect-ratio:1;border:1px solid var(--border);border-radius:50%;left:-16%;top:-45%;opacity:.55}.hero-centered::after{content:'';position:absolute;width:min(30vw,360px);aspect-ratio:1;border:1px solid var(--border);border-radius:50%;right:-10%;bottom:-42%;opacity:.45}
.hero-centered .hero-eyebrow{justify-content:center}
.hero-centered .hero-title{font-size:calc(clamp(2.65rem,6.4vw,5.2rem) * var(--type-scale));margin-left:auto;margin-right:auto;max-width:15ch;line-height:1.02}
.hero-centered .hero-text{margin:0 auto 2.5rem;max-width:620px}
.hero-centered .hero-actions{justify-content:center}
.hero-centered:not(.hero-centered-bg) .btn-hero-outline{background:transparent;border-color:var(--text);color:var(--text);backdrop-filter:none}
.hero-centered:not(.hero-centered-bg) .btn-hero-outline:hover{background:var(--text);color:var(--bg)}
.hero-centered-bg{background-color:var(--secondary);background-size:cover;background-position:var(--ss-bg-position,center);background-attachment:var(--ss-bg-attachment,scroll)}
.hero-centered-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.72));z-index:1}
.hero-centered-bg .hero-title{color:#fff;text-shadow:0 2px 30px rgba(0,0,0,.4)}
.hero-centered-bg .hero-text{color:rgba(255,255,255,.85)}
.hero-centered-bg .hero-eyebrow{color:rgba(255,255,255,.72)}
.hero-splitcard{position:relative;min-height:min(84vh,800px);display:flex;align-items:center;overflow:hidden;background:var(--secondary)}
.hero-splitcard-bg{position:absolute;inset:0;background-size:cover;background-position:var(--ss-bg-position,center);background-attachment:var(--ss-bg-attachment,scroll);background-repeat:no-repeat;z-index:0}
.hero-splitcard-ovl{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.52) 0%,rgba(0,0,0,.14) 52%,rgba(0,0,0,0) 82%)}
body.brand-surface-balanced .hero-splitcard-ovl{background:linear-gradient(90deg,rgba(12,14,20,.70) 0%,rgba(12,14,20,.38) 58%,rgba(12,14,20,.16) 100%)}
.hero-splitcard-inner{position:relative;z-index:2;width:100%;padding:clamp(4rem,8vw,7rem) 0}
.hero-splitcard-card{background:var(--surface);color:var(--text);max-width:580px;padding:clamp(2.15rem,4vw,3.35rem);border-radius:calc(var(--radius) * 1.15);box-shadow:0 34px 90px rgba(0,0,0,.30);border:1px solid var(--border);border-left:4px solid var(--primary);backdrop-filter:blur(12px)}
.hero-splitcard-card .hero-title{font-size:calc(clamp(2.2rem,4.5vw,3.5rem) * var(--type-scale));margin-bottom:1rem}
.hero-splitcard-card .hero-text{margin-bottom:1.75rem}
@media (max-width:640px){.hero-splitcard{min-height:auto}.hero-splitcard-ovl{background:rgba(0,0,0,.25)}.hero-splitcard-card{max-width:none}}
.hero-slider{position:relative;overflow:hidden;background:var(--secondary)}
.hslider-track{position:relative;min-height:78vh}
.hslide{position:absolute;inset:0;background-size:cover;background-position:var(--ss-bg-position,center);background-attachment:var(--ss-bg-attachment,scroll);background-repeat:no-repeat;display:flex;align-items:center;opacity:0;transition:opacity .8s ease;pointer-events:none}
.hslide.is-active{opacity:1;pointer-events:auto}
.hslide-ovl{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.28) 55%,rgba(0,0,0,.08) 100%)}
.hslide-inner{position:relative;z-index:2;width:100%;padding:clamp(4rem,9vw,8rem) 0}
.hslide-c{max-width:640px;color:#fff}
.hslide-eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.8rem;font-weight:600;color:rgba(255,255,255,.82);margin-bottom:1rem}
.hero-slider .hero-title{color:#fff;font-size:calc(clamp(2.2rem,5vw,4rem) * var(--type-scale));line-height:var(--leading-tight);margin-bottom:1rem;text-shadow:0 2px 24px rgba(0,0,0,.4)}
.hero-slider .hero-text{color:rgba(255,255,255,.9);font-size:1.1rem;line-height:1.65;margin-bottom:1.75rem;max-width:520px}
.hslide-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:48px;height:48px;border:none;border-radius:50%;background:rgba(255,255,255,.18);color:#fff;font-size:1.8rem;line-height:1;cursor:pointer;backdrop-filter:blur(6px);transition:background .2s}
.hslide-arrow:hover{background:rgba(255,255,255,.34)}
.hslide-prev{left:18px}.hslide-next{right:18px}
.hslide-dots{position:absolute;bottom:20px;left:0;right:0;z-index:5;display:flex;gap:8px;justify-content:center}
.hslide-dot{width:10px;height:10px;border-radius:50%;border:none;background:rgba(255,255,255,.45);cursor:pointer;padding:0;transition:background .2s,width .2s}
.hslide-dot.is-active{background:#fff;width:26px;border-radius:5px}
@media (max-width:640px){.hslider-track{min-height:62vh}.hslide-arrow{width:38px;height:38px;font-size:1.4rem}.hslide-prev{left:8px}.hslide-next{right:8px}}
/* ── Hero: MINIMAL (page-header — nikad prazno) ── */
.hero-minimal{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--primary-l) 0%,var(--bg) 62%);padding:clamp(3.75rem,7vw,6rem) 0;border-bottom:1px solid var(--border)}
.hero-minimal::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--primary);opacity:.9}
.hero-minimal-inner{position:relative;z-index:1;max-width:820px}
.hero-minimal .hero-title{font-size:calc(clamp(2.1rem,4.6vw,3.4rem) * var(--type-scale));margin-bottom:.9rem;letter-spacing:var(--tracking-tight)}
.hero-minimal .hero-text{max-width:560px;margin-bottom:1.25rem}
.hero-minimal .hero-actions{margin-top:0}
.hero-minimal:not(.hero-minimal--img) .hero-title::after{content:'';display:block;width:54px;height:3px;border-radius:3px;background:var(--primary);margin-top:1.05rem}
.hero-minimal:not(.hero-minimal--img) .btn-hero-outline{background:transparent;color:var(--text);border:2px solid var(--text);backdrop-filter:none}
.hero-minimal--img{position:relative;background-size:cover;background-position:var(--ss-bg-position,center);background-attachment:var(--ss-bg-attachment,scroll);background-repeat:no-repeat;border-bottom:0;padding:clamp(4.5rem,9vw,7rem) 0}
.hero-minimal--img::before{display:none}
.hero-minimal-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,.58) 100%);z-index:1}
.hero-minimal--img .hero-minimal-inner{position:relative;z-index:2}
.hero-minimal--img .hero-title,.hero-minimal--img .hero-text{color:#fff}
.hero-minimal--img .hero-eyebrow{color:rgba(255,255,255,.88)}
.hero-minimal--img .hero-eyebrow::before{background:rgba(255,255,255,.6)}
/* v1.237 Contrast Guard — only newly generated sites that explicitly opt in.
   It does not choose colors/layouts; it guarantees a minimum darkening layer
   wherever white copy sits directly over photography. */
body.contrast-guard-v1 .hero-full-overlay{background:linear-gradient(105deg,rgba(0,0,0,.84) 0%,rgba(0,0,0,.52) 54%,rgba(0,0,0,.20) 100%),linear-gradient(180deg,rgba(0,0,0,.08) 35%,rgba(0,0,0,.52) 100%)}
body.contrast-guard-v1 .hero-centered-overlay{background:linear-gradient(180deg,rgba(0,0,0,.64),rgba(0,0,0,.78))}
body.contrast-guard-v1 .hero-minimal-overlay{background:linear-gradient(180deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.72) 100%)}
body.contrast-guard-v1 .hero-splitcard-ovl{background:linear-gradient(90deg,rgba(0,0,0,.68) 0%,rgba(0,0,0,.38) 58%,rgba(0,0,0,.16) 100%)}
body.contrast-guard-v1 :is(.hero-full,.hero-centered-bg,.hero-minimal--img) :is(.hero-title,.hero-text,.hero-eyebrow){text-shadow:0 2px 20px rgba(0,0,0,.55)}
body.contrast-guard-v1 .sec-image::before{background:rgba(0,0,0,.64)}
body.contrast-guard-v1 .sec-image :is(.section-title,.section-text,.section-eyebrow,h2,h3){text-shadow:0 2px 16px rgba(0,0,0,.48)}
/* Stats */
.stats{background:var(--secondary);color:var(--on-secondary);padding:clamp(3rem,5vw,5rem) 0}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;text-align:center}
@media(max-width:640px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
.stat-item{padding:1.5rem 1rem;border:1px solid color-mix(in srgb,var(--on-secondary) 12%,transparent);border-radius:var(--radius);background:color-mix(in srgb,var(--on-secondary) 6%,transparent)}
.stat-value{font-family:var(--font-head);font-size:clamp(1.75rem,3vw,2.5rem);font-weight:800;color:var(--accent,#fff);line-height:1.1;word-break:break-word}
.stat-label{font-size:.875rem;color:color-mix(in srgb,var(--on-secondary) 68%,transparent);margin-top:.625rem;line-height:1.4}
.stats-header{text-align:center;margin-bottom:2.5rem}
.stats-header .section-title{color:var(--on-secondary)}
.stats-header .section-text{color:color-mix(in srgb,var(--on-secondary) 76%,transparent);margin:0 auto}
/* Services */
.services{background:var(--bg)}
.services-header{margin-bottom:3rem}
.service-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(1.55rem,2.5vw,2.1rem);box-shadow:none;transition:transform .22s,box-shadow .22s,border-color .22s;position:relative;overflow:hidden}
.service-card::before{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:var(--primary);transform:scaleX(.22);transform-origin:left;opacity:.75;transition:transform .22s}
.service-card:hover{transform:translateY(-3px);box-shadow:0 18px 42px -28px rgba(0,0,0,.38);border-color:color-mix(in srgb,var(--primary) 22%,var(--border))}
.service-card:hover::before{transform:scaleX(1)}
.svc-card-ic{width:52px;height:52px;margin:1.25rem 1.25rem 0;background:var(--chip-bg,var(--primary-l));border-radius:14px;display:flex;align-items:center;justify-content:center;color:var(--primary);flex:none}
.svc-card-ic svg{width:1.5em;height:1.5em;display:block}
.service-icon{width:48px;height:48px;background:var(--primary-l);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:1.35rem;color:var(--primary);font-size:1.25rem;font-weight:800;position:relative;transition:transform .2s}
.service-card:hover .service-icon{transform:translateY(-2px)}
/* Services: IMAGE CARDS */
.svc-card{background:var(--surface,#fff);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;height:100%;box-shadow:0 2px 10px rgba(0,0,0,.05);transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s,border-color .3s}
.svc-card:hover{transform:translateY(-6px);box-shadow:0 26px 56px -22px rgba(0,0,0,.3);border-color:var(--primary-l)}
.svc-card-media{position:relative;aspect-ratio:16/10;overflow:hidden}
.svc-card-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.svc-card:hover .svc-card-media img{transform:scale(1.06)}
.svc-card-media--ph{background:var(--primary-l);display:flex;align-items:center;justify-content:center;color:var(--primary);font-weight:600}
.svc-card-body{padding:1.6rem 1.6rem 1.7rem;display:flex;flex-direction:column;flex:1}
.svc-card-title{font-family:var(--font-head);font-weight:600;font-size:1.4rem;line-height:1.2;margin:0 0 .55rem;color:var(--text)}
.svc-card-text{color:var(--muted);font-size:.97rem;margin:0 0 1.3rem;flex:1}
.svc-card-link{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.92rem;color:var(--primary);text-decoration:none;align-self:flex-start}
.svc-card-link .arr{transition:transform .25s}
.svc-card:hover .svc-card-link .arr{transform:translateX(5px)}
.service-title{font-family:var(--font-head);font-size:calc(1.12rem * var(--type-scale));font-weight:700;line-height:1.25;margin-bottom:.625rem;color:var(--text)}
.service-text{font-size:.9375rem;color:var(--muted);line-height:1.7}
/* ── Services varijante ── */
.svc-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(2rem,5vw,5rem);max-width:none;margin:0;border-top:1px solid var(--border)}
.svc-row{display:grid;grid-template-columns:48px minmax(0,1fr);gap:1rem;align-items:flex-start;padding:1.45rem 0;border-bottom:1px solid var(--border)}
.svc-row:last-child{border-bottom:0}
.svc-row-ic{width:48px;height:48px;border-radius:12px;background:var(--primary-l);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0}
.svc-row-c h3{font-family:var(--font-head);font-size:calc(1.12rem * var(--type-scale));margin-bottom:.4rem;color:var(--text);line-height:1.25}
.svc-row-c p{font-size:.95rem;color:var(--muted);line-height:1.7}
.svc-num-card{position:relative;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);padding:2.5rem 2rem 2rem;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.05);transition:transform .25s,box-shadow .25s}
.svc-num-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(0,0,0,.1)}
.svc-num{position:absolute;top:.35rem;right:1rem;font-family:var(--font-head);font-size:3.5rem;font-weight:900;color:var(--primary-l);line-height:1;z-index:0}
.svc-num-card h3{position:relative;z-index:1;font-size:1.1rem;margin-bottom:.5rem;color:var(--text)}
.svc-num-card p{position:relative;z-index:1;font-size:.9375rem;color:var(--muted);line-height:1.7}
.svc-compact-grid{gap:0 clamp(1.6rem,4vw,3.5rem);border-top:1px solid var(--border)}
.svc-cmp{display:flex;gap:1rem;align-items:flex-start;padding:1.15rem 0;border-bottom:1px solid var(--border)}
.svc-cmp-ic{width:44px;height:44px;border-radius:12px;background:var(--primary-l);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}
.svc-cmp h3{font-size:1rem;margin-bottom:.25rem;color:var(--text)}
.svc-cmp p{font-size:.9rem;color:var(--muted);line-height:1.6}
.svc-split{display:grid;grid-template-columns:.85fr 1.15fr;gap:3rem;align-items:start}
.svc-split-head{position:sticky;top:90px}
.svc-split-head .section-text{margin-top:1rem}
.svc-split-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1.25rem}
@media(max-width:860px){.svc-split{grid-template-columns:1fr;gap:2rem}.svc-split-head{position:static}}
.svc-supp{margin-top:clamp(2.5rem,5vw,4.5rem);padding-top:clamp(2rem,4vw,3rem);border-top:1px solid var(--border)}
.svc-supp-head{max-width:680px;margin-bottom:1.5rem}.svc-supp-head h3{font-size:clamp(1.45rem,2.5vw,2rem);margin:.35rem 0 .5rem}.svc-supp-head p{color:var(--muted)}
.svc-supp-list{border-top:1px solid var(--border)}.svc-supp-item{border-bottom:1px solid var(--border)}.svc-supp-item summary{list-style:none;display:grid;grid-template-columns:2.5rem 1fr auto;gap:.8rem;align-items:center;padding:1rem .1rem;cursor:pointer}.svc-supp-item summary::-webkit-details-marker{display:none}.svc-supp-item summary>span{font-size:.7rem;letter-spacing:.12em;color:var(--primary);font-weight:800}.svc-supp-item summary strong{font-family:var(--font-head);font-size:1rem}.svc-supp-item summary i{font-style:normal;width:1.8rem;height:1.8rem;border:1px solid var(--border);border-radius:50%;display:grid;place-items:center;color:var(--primary);transition:transform .2s}.svc-supp-item[open] summary i{transform:rotate(45deg)}.svc-supp-copy{padding:0 3.3rem 1.35rem;color:var(--muted);line-height:1.8;max-width:82ch}
@media(max-width:640px){.svc-supp-copy{padding-left:0}.svc-supp-item summary{grid-template-columns:2rem 1fr auto}}
/* Services: NATURAL / EDITORIAL GRID — bez generičke card školjke */
.svc-ed-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(2rem,4vw,4.5rem) clamp(1.4rem,3vw,3rem);border-top:1px solid var(--border);padding-top:clamp(1.5rem,3vw,2.25rem)}
.svc-ed-item{min-width:0;display:flex;flex-direction:column;gap:1.25rem;border:0;background:transparent;box-shadow:none}
.svc-ed-media{aspect-ratio:4/3;overflow:hidden;background:color-mix(in srgb,var(--primary) 5%,var(--surface));border-radius:min(var(--radius),6px)}
.svc-ed-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s cubic-bezier(.16,1,.3,1)}
.svc-ed-item:hover .svc-ed-media img{transform:scale(1.025)}
.svc-ed-media--ph{display:grid;place-items:center;color:var(--muted)}
.svc-ed-icon{width:54px;height:54px;display:flex;align-items:center;justify-content:flex-start;color:var(--primary);margin-top:.15rem}
.svc-ed-icon svg{width:38px;height:38px;stroke-width:1.35}
.svc-ed-copy{border-top:1px solid var(--border);padding-top:1rem}
.svc-ed-num{display:block;margin-bottom:.8rem;font-size:.66rem;line-height:1;letter-spacing:.16em;font-weight:800;color:var(--primary)}
.svc-ed-copy h3{font-family:var(--font-head);font-size:calc(clamp(1.15rem,1.7vw,1.45rem)*var(--type-scale));font-weight:650;line-height:1.2;margin:0 0 .65rem;color:var(--text)}
.svc-ed-copy p{margin:0;color:var(--muted);font-size:.92rem;line-height:1.7;max-width:46ch}
.svc-ed-link{display:inline-flex;gap:.5rem;align-items:center;margin-top:1rem;color:var(--text);font-size:.78rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--primary) 65%,transparent);padding-bottom:.2rem}
.svc-ed-link span{color:var(--primary);transition:transform .2s}.svc-ed-link:hover span{transform:translate(2px,-2px)}
@media(max-width:900px){.svc-ed-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.svc-ed-grid{grid-template-columns:1fr;gap:2rem}.svc-ed-media{aspect-ratio:16/10}}

/* Services: rich multipage→onepage layouts */
.svc-md-shell{display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,1.55fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.svc-md-tabs{display:flex;flex-direction:column;border-top:1px solid var(--border)}
.svc-md-tab{appearance:none;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);padding:1.15rem .15rem;display:grid;grid-template-columns:2.5rem 1fr auto;gap:.75rem;align-items:center;text-align:left;font:inherit;cursor:pointer;transition:color .2s,padding .2s,background .2s}
.svc-md-tab:hover,.svc-md-tab.is-active{color:var(--primary);padding-left:.55rem;background:color-mix(in srgb,var(--primary-l) 50%,transparent)}
.svc-md-num{font-size:.72rem;letter-spacing:.1em;color:var(--muted);font-weight:800}.svc-md-arr{font-size:1.1rem;transition:transform .2s}.svc-md-tab.is-active .svc-md-arr{transform:translateX(4px)}
.svc-md-panels{min-width:0}.svc-md-panel{background:var(--surface);border:1px solid var(--border);border-radius:calc(var(--radius) * 1.15);overflow:hidden;box-shadow:var(--shadow)}
.svc-md-panel[hidden]{display:none}.svc-md-media{aspect-ratio:16/7;overflow:hidden;background:var(--primary-l)}.svc-md-media img{width:100%;height:100%;object-fit:cover;display:block}
.svc-md-content{padding:clamp(1.6rem,4vw,3.2rem)}.svc-md-kicker{font-size:.72rem;letter-spacing:.14em;color:var(--primary);font-weight:800;margin-bottom:.75rem}.svc-md-content h3{font-size:clamp(1.7rem,3vw,2.65rem);margin:0 0 .8rem}.svc-md-summary{font-size:1.05rem;color:var(--text);line-height:1.7;margin:0 0 1.35rem;font-weight:550}.svc-md-copy{color:var(--muted);line-height:1.85;max-width:72ch}
.svc-rich-list{max-width:980px;margin:0 auto;border-top:1px solid var(--border)}.svc-rich-item{border-bottom:1px solid var(--border)}.svc-rich-item summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:3rem 1fr auto;gap:1rem;align-items:start;padding:1.45rem .25rem}.svc-rich-item summary::-webkit-details-marker{display:none}.svc-rich-num{font-size:.74rem;font-weight:800;letter-spacing:.12em;color:var(--primary);padding-top:.2rem}.svc-rich-head{display:flex;flex-direction:column;gap:.35rem}.svc-rich-head strong{font-family:var(--font-head);font-size:1.2rem;color:var(--text)}.svc-rich-summary{font-size:.92rem;color:var(--muted);line-height:1.55}.svc-rich-plus{width:2rem;height:2rem;border-radius:50%;border:1px solid var(--border);display:grid;place-items:center;color:var(--primary);font-size:1.2rem;transition:transform .2s,background .2s}.svc-rich-item[open] .svc-rich-plus{transform:rotate(45deg);background:var(--primary-l)}.svc-rich-body{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:2rem;padding:0 3.25rem 1.75rem}.svc-rich-body:has(.svc-rich-media:only-child){grid-template-columns:1fr}.svc-rich-media{border-radius:var(--radius);overflow:hidden;min-height:180px}.svc-rich-media img{width:100%;height:100%;object-fit:cover;display:block}.svc-rich-copy{color:var(--muted);line-height:1.85;max-width:72ch}
/* Services DIRECTORY — za 8–16 usluga s mnogo teksta. Dvije kolone drže
   stranicu kratkom, a puni tekst ostaje u DOM-u i otvara se po potrebi. */
.svc-directory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:start}.svc-dir-item{background:var(--surface);border:1px solid var(--border);border-radius:calc(var(--radius)*1.05);overflow:hidden;box-shadow:0 8px 26px rgba(0,0,0,.04)}.svc-dir-item summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:2.7rem minmax(0,1fr) 2rem;gap:.8rem;align-items:start;padding:1.15rem 1.2rem}.svc-dir-item summary::-webkit-details-marker{display:none}.svc-dir-num{font-size:.72rem;letter-spacing:.12em;color:var(--primary);font-weight:800;padding-top:.18rem}.svc-dir-head{display:flex;flex-direction:column;gap:.28rem;min-width:0}.svc-dir-head strong{font-family:var(--font-head);font-size:1.08rem;color:var(--text);line-height:1.25}.svc-dir-summary{font-size:.86rem;color:var(--muted);line-height:1.5}.svc-dir-plus{width:1.85rem;height:1.85rem;border:1px solid var(--border);border-radius:50%;display:grid;place-items:center;color:var(--primary);font-size:1.05rem;transition:transform .2s,background .2s}.svc-dir-item[open] .svc-dir-plus{transform:rotate(45deg);background:var(--primary-l)}.svc-dir-copy{padding:0 1.2rem 1.25rem 4.7rem;color:var(--muted);line-height:1.72}.svc-dir-static{padding:1.15rem 1.2rem;display:grid;grid-template-columns:2.7rem minmax(0,1fr);gap:.8rem}.svc-dir-static .svc-dir-head strong{margin-bottom:.15rem}
@media(max-width:800px){.svc-md-shell{grid-template-columns:1fr}.svc-md-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;border:0}.svc-md-tab{border:1px solid var(--border);border-radius:10px;padding:.85rem;grid-template-columns:1.8rem 1fr}.svc-md-tab .svc-md-arr{display:none}.svc-rich-body{grid-template-columns:1fr;padding:0 .25rem 1.4rem}.svc-rich-item summary{grid-template-columns:2.25rem 1fr auto}.svc-rich-summary{display:none}.svc-directory{grid-template-columns:1fr}.svc-dir-copy{padding-left:1.2rem}}
/* Services: HOVER PREVIEW — popis reagira fotografijom desno */
.svc-hp-shell{display:grid;grid-template-columns:minmax(0,.92fr) minmax(360px,1.08fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.svc-hp-list{border-top:1px solid var(--border)}
.svc-hp-row{position:relative;display:grid;grid-template-columns:3rem minmax(0,1fr) 2.25rem;gap:1rem;align-items:start;padding:clamp(1.25rem,2.4vw,1.85rem) .15rem;border-bottom:1px solid var(--border);outline:none;cursor:default;transition:padding .22s,color .22s,background .22s}
.svc-hp-row:hover,.svc-hp-row:focus-visible,.svc-hp-row.is-active{padding-left:.65rem;color:var(--primary)}
.svc-hp-row:focus-visible{box-shadow:inset 3px 0 0 var(--primary)}
.svc-hp-num{padding-top:.25rem;font-size:.72rem;font-weight:800;letter-spacing:.12em;color:var(--muted)}
.svc-hp-copy h3{margin:0;font-size:clamp(1.2rem,2vw,1.75rem);font-family:var(--font-head);line-height:1.15;color:var(--text)}
.svc-hp-copy p{margin:.55rem 0 0;color:var(--muted);line-height:1.65;max-width:55ch}
.svc-hp-link,.svc-hp-arr{width:2rem;height:2rem;display:grid;place-items:center;align-self:center;color:var(--primary);text-decoration:none;font-size:1.15rem;transition:transform .2s}
.svc-hp-row:hover .svc-hp-link,.svc-hp-row:hover .svc-hp-arr,.svc-hp-row.is-active .svc-hp-link,.svc-hp-row.is-active .svc-hp-arr{transform:translate(3px,-3px)}
.svc-hp-stage{position:sticky;top:110px;min-height:clamp(360px,42vw,560px);border-radius:var(--radius);overflow:hidden;background:var(--primary-l)}
.svc-hp-visual{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.025);transition:opacity .38s ease,transform .55s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.svc-hp-visual.is-active{opacity:1;transform:scale(1);pointer-events:auto}
.svc-hp-visual img{width:100%;height:100%;object-fit:cover;display:block}
.svc-hp-fallback{width:100%;height:100%;min-height:360px;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(2rem,5vw,4rem);background:linear-gradient(145deg,color-mix(in srgb,var(--primary) 12%,var(--surface)),color-mix(in srgb,var(--secondary) 16%,var(--surface)));color:var(--text)}
.svc-hp-fallback span{font-size:.75rem;letter-spacing:.15em;color:var(--primary);font-weight:800}.svc-hp-fallback strong{font-family:var(--font-head);font-size:clamp(1.8rem,4vw,3.2rem);max-width:10ch;margin-top:.7rem}
@media(max-width:850px){.svc-hp-shell{grid-template-columns:1fr}.svc-hp-stage{position:relative;top:auto;order:-1;min-height:320px}.svc-hp-row{grid-template-columns:2.4rem minmax(0,1fr) 2rem}.svc-hp-copy p{max-width:none}}
@media(max-width:540px){.svc-hp-stage{min-height:260px}.svc-hp-row{padding:1.1rem 0}.svc-hp-row:hover,.svc-hp-row:focus-visible,.svc-hp-row.is-active{padding-left:.25rem}}

/* PORTFOLIO TABS — univerzalni filter za projekte, usluge, katalog i galeriju */
.portfolio{background:var(--bg)}
.pf-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:end;margin-bottom:clamp(2rem,4vw,3.5rem)}
.portfolio-header{margin:0!important;max-width:760px}.portfolio-header.ss-head{--head-gap:0!important}.portfolio-header .section-text{max-width:62ch}
.pf-tabs{display:flex;gap:.45rem;flex-wrap:wrap;justify-content:flex-end}
.pf-tab{appearance:none;border:1px solid var(--border);background:transparent;color:var(--muted);border-radius:999px;padding:.68rem 1rem;font:inherit;font-size:.82rem;font-weight:750;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s}
.pf-tab:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-1px)}.pf-tab.is-active{background:var(--text);border-color:var(--text);color:var(--bg)}
.pf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.25rem,2.5vw,2rem)}
.pf-card{min-width:0;display:flex;flex-direction:column;animation:pfIn .32s ease both;animation-delay:calc(var(--pf-order,0)*35ms)}.pf-card[hidden]{display:none!important}
@keyframes pfIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.pf-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:color-mix(in srgb,var(--primary) 7%,var(--surface));border-radius:var(--radius)}
.pf-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s cubic-bezier(.2,.7,.2,1)}.pf-card:hover .pf-media img{transform:scale(1.035)}
.pf-empty{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary-l),var(--surface));color:var(--primary)}.pf-empty span{font-family:var(--font-head);font-size:3rem;font-weight:800;opacity:.45}
.pf-card-copy{padding:1.1rem .05rem 0}.pf-cat-label{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;color:var(--primary);margin-bottom:.45rem}.pf-meta{font-size:.78rem;color:var(--muted);margin-bottom:.35rem}.pf-card h3{margin:0 0 .45rem;font-family:var(--font-head);font-size:clamp(1.2rem,2vw,1.55rem);line-height:1.2}.pf-card p{margin:0;color:var(--muted);line-height:1.65}.pf-link{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;font-size:.8rem;font-weight:800;text-decoration:none;color:var(--text);border-bottom:1px solid var(--border);padding-bottom:.2rem}.pf-link span{color:var(--primary);transition:transform .2s}.pf-link:hover span{transform:translate(3px,-3px)}
.portfolio--editorial .pf-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,4vw,4rem)}.portfolio--editorial .pf-media{aspect-ratio:16/10;border-radius:min(var(--radius),8px)}.portfolio--editorial .pf-card-copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);column-gap:1.5rem;border-top:1px solid var(--border);margin-top:.9rem;padding-top:1rem}.portfolio--editorial .pf-cat-label,.portfolio--editorial .pf-meta{grid-column:1}.portfolio--editorial .pf-card h3,.portfolio--editorial .pf-card p,.portfolio--editorial .pf-link{grid-column:2}.portfolio--editorial .pf-card h3{grid-row:1/span 2}
.portfolio--showcase .pf-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:dense}.portfolio--showcase .pf-card.is-featured{grid-row:span 2}.portfolio--showcase .pf-card.is-featured .pf-media{aspect-ratio:auto;min-height:100%}.portfolio--showcase .pf-card.is-featured .pf-card-copy{padding-top:1.25rem}.portfolio--showcase .pf-card.is-featured h3{font-size:clamp(1.55rem,3vw,2.2rem)}
@media(max-width:900px){.pf-top{grid-template-columns:1fr;align-items:start}.pf-tabs{justify-content:flex-start}.pf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portfolio--editorial .pf-grid{gap:2rem}.portfolio--showcase .pf-card.is-featured{grid-row:auto}.portfolio--showcase .pf-card.is-featured .pf-media{aspect-ratio:4/3;min-height:0}}
@media(max-width:620px){.pf-grid,.portfolio--editorial .pf-grid,.portfolio--showcase .pf-grid{grid-template-columns:1fr}.portfolio--editorial .pf-card-copy{display:block}.pf-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:.25rem}.pf-tab{white-space:nowrap}}

/* About */
.about{background:var(--bg)}
.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.about-image{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;background:var(--primary-l);display:flex;align-items:center;justify-content:center;color:var(--primary);font-size:.875rem;box-shadow:var(--shadow);position:relative}
.about-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.about-items{display:flex;flex-direction:column;gap:1.25rem;margin-top:2rem}
.about-item{display:flex;gap:1rem;align-items:flex-start}
.about-item-icon{width:36px;height:36px;background:var(--primary-l);border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--primary);font-weight:800;font-size:.875rem;flex-shrink:0;margin-top:2px}
.about-item-title{font-weight:700;margin-bottom:.25rem;font-size:.9375rem}
.about-item-text{font-size:.9rem;color:var(--muted);line-height:1.6}
/* ── About varijante ── */
.about-eyebrow-c{display:inline-flex;justify-content:center}
/* About: EDITORIAL */
.about-ed-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(2.5rem,6vw,6rem);align-items:center}
.about-ed-media{position:relative;aspect-ratio:4/5;border-radius:var(--radius);background:none;box-shadow:none}
.about-ed-media::before{content:'';position:absolute;top:22px;left:22px;right:-22px;bottom:-22px;background:var(--primary-l);border-radius:var(--radius);z-index:0}
.about-ed-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:var(--radius);z-index:1;box-shadow:0 34px 80px -28px rgba(0,0,0,.45),0 10px 30px -16px rgba(0,0,0,.25);transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.about-ed-media:hover img{transform:scale(1.035)}
.about-ed-media .img-placeholder{position:absolute;inset:0;z-index:1;border-radius:var(--radius);background:var(--primary-l);display:flex;align-items:center;justify-content:center;color:var(--primary);font-weight:600}
.about-ed-media[data-img-field]:hover{outline:2px dashed var(--primary);outline-offset:2px;border-radius:var(--radius)}
.about-ed-badge{position:absolute;z-index:2;left:-14px;bottom:30px;background:var(--surface);border-radius:14px;padding:.85rem 1.15rem;box-shadow:0 18px 40px -14px rgba(0,0,0,.32);display:flex;align-items:center;gap:.7rem;border:1px solid var(--border)}
.about-ed-badge .num{font-family:var(--font-head);font-weight:700;font-size:1.6rem;color:var(--primary);line-height:1}
.about-ed-badge .lab{font-size:.8rem;color:var(--muted);line-height:1.25;max-width:130px}
.about-ed-title{font-family:var(--font-head);font-weight:600;font-size:calc(clamp(2.1rem,4.4vw,3.4rem) * var(--type-scale));line-height:1.08;letter-spacing:-.015em;margin:0 0 1.3rem}
.about-ed-lead{max-width:540px;margin:0 0 2rem}
.about-ed-list{display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1.6rem;margin:0 0 2.3rem;padding:0;list-style:none}
.about-ed-list li{display:flex;gap:.7rem;align-items:flex-start;font-size:.97rem;font-weight:600}
.about-ed-list .ic{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--primary-l);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:.8rem;margin-top:1px;font-weight:700}
.about-ed-foot{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap}
.about-ed-sign{font-family:var(--font-head);font-style:italic;font-size:1.05rem;color:var(--secondary)}
.about-ed-sign small{display:block;font-family:var(--font-body);font-style:normal;font-size:.78rem;color:var(--muted);letter-spacing:.02em;margin-top:2px}
.about-ed--rev{direction:rtl}.about-ed--rev>*{direction:ltr}
@media(max-width:820px){.about-ed-grid{grid-template-columns:1fr;gap:3.25rem}.about-ed--rev{direction:ltr}.about-ed-media{order:-1;aspect-ratio:4/3;max-width:480px;width:100%;margin:0 auto}.about-ed-media::before{top:12px;left:12px;right:-12px;bottom:-12px}.about-ed-list{grid-template-columns:1fr}}
/* About: HIGHLIGHT */
.about-hl-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center}
.about-hl-title{font-family:var(--font-head);font-weight:600;font-size:calc(clamp(2.1rem,4.6vw,3.5rem) * var(--type-scale));line-height:1.07;letter-spacing:-.015em;margin:0 0 1.3rem}
.about-hl-lead{max-width:540px;margin:0 0 2.4rem}
.about-hl-stats{display:flex;gap:clamp(1.4rem,4vw,2.6rem);margin:0 0 2.4rem;flex-wrap:wrap}
.about-hl-stat{position:relative;padding-right:clamp(1.4rem,4vw,2.6rem)}
.about-hl-stat:not(:last-child)::after{content:'';position:absolute;right:0;top:6px;bottom:6px;width:1px;background:var(--border)}
.about-hl-stat .num{font-family:var(--font-head);font-weight:700;font-size:clamp(1.9rem,3.4vw,2.6rem);color:var(--primary);line-height:1.05;letter-spacing:-.01em}
.about-hl-stat .lab{display:block;font-size:.82rem;color:var(--muted);margin-top:.35rem;max-width:130px;line-height:1.35}
.about-hl-foot{display:flex;gap:1rem;flex-wrap:wrap}
.about-hl-media{position:relative;aspect-ratio:5/6;border-radius:var(--radius)}
.about-hl-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:var(--radius);box-shadow:0 30px 70px -26px rgba(0,0,0,.42),0 8px 24px -14px rgba(0,0,0,.22);transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.about-hl-media:hover img{transform:scale(1.03)}
.about-hl-media::after{content:'';position:absolute;top:-12px;right:-12px;width:84px;height:84px;border-top:4px solid var(--primary);border-right:4px solid var(--primary);border-top-right-radius:var(--radius);z-index:2;pointer-events:none}
.about-hl-media .img-placeholder{position:absolute;inset:0;border-radius:var(--radius);background:var(--primary-l);display:flex;align-items:center;justify-content:center;color:var(--primary);font-weight:600}
.about-hl-media[data-img-field]:hover{outline:2px dashed var(--primary);outline-offset:2px;border-radius:var(--radius)}
.about-hl--rev{direction:rtl}.about-hl--rev>*{direction:ltr}
@media(max-width:820px){.about-hl-grid{grid-template-columns:1fr;gap:3.25rem}.about-hl--rev{direction:ltr}.about-hl-media{order:-1;aspect-ratio:4/3;max-width:520px;width:100%;margin:0 auto}.about-hl-media::after{width:60px;height:60px}}
/* About: FULL-BLEED SPLIT */
.about-fs{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:clamp(440px,52vw,640px);background:var(--surface)}
.about-fs-media{position:relative;overflow:hidden;background:var(--primary-l);min-height:300px}
.about-fs-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.about-fs:hover .about-fs-media img{transform:scale(1.04)}
.about-fs-media .img-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--primary);font-weight:600}
.about-fs-media[data-img-field]:hover{outline:2px dashed var(--primary);outline-offset:-2px}
.about-fs-content{display:flex;align-items:center;padding:clamp(2.5rem,6vw,6rem)}
.about-fs-inner{max-width:540px}
.about-fs-title{font-family:var(--font-head);font-weight:600;font-size:calc(clamp(2rem,3.6vw,3.2rem) * var(--type-scale));line-height:1.08;letter-spacing:-.015em;margin:0 0 1.25rem}
.about-fs-lead{margin:0 0 2rem;max-width:none}
.about-fs-list{display:flex;flex-direction:column;gap:.75rem;margin:0 0 2.2rem;padding:0;list-style:none}
.about-fs-list li{display:flex;gap:.7rem;align-items:center;font-size:.98rem;font-weight:600}
.about-fs-list .ic{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:var(--primary-l);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700}
.about-fs--rev{direction:rtl}.about-fs--rev>*{direction:ltr}
@media(max-width:820px){.about-fs{grid-template-columns:1fr}.about-fs--rev{direction:ltr}.about-fs-media{order:-1;min-height:0;aspect-ratio:16/10}.about-fs-content{padding:clamp(2rem,8vw,3rem)}}
.about-vh{text-align:center;max-width:680px;margin:0 auto 3rem}
.about-vh .section-text{margin:1rem auto 0}
.about-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(1.5rem,3vw,3rem)}
.about-vcard{background:transparent;border:0;border-top:2px solid color-mix(in srgb,var(--primary) 72%,var(--border));border-radius:0;padding:1.45rem 1.35rem 1.5rem;box-shadow:none;transition:border-color .2s,transform .2s}
.about-vcard:hover{transform:translateY(-2px);border-color:var(--primary);box-shadow:none}
.about-vcard-ic{width:46px;height:46px;border-radius:13px;background:var(--primary-l);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:800;margin-bottom:1.25rem}
.about-vcard h3{font-size:1.05rem;margin-bottom:.5rem;color:var(--text)}
.about-vcard p{font-size:.9375rem;color:var(--muted);line-height:1.7}
.about-timeline-wrap{max-width:none;margin:0;display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:clamp(2.5rem,7vw,7rem);align-items:start}
.about-tl-head{text-align:left;margin-bottom:0;position:sticky;top:110px}
.about-tl-head .section-text{margin:1rem 0 0;max-width:48ch}
.about-tl-item{position:relative;display:grid;grid-template-columns:auto 1fr;gap:1.25rem;padding-bottom:1.85rem}
.about-tl-item:last-child{padding-bottom:0}
.about-tl-num{width:44px;height:44px;border-radius:50%;background:var(--primary);color:var(--on-primary);display:flex;align-items:center;justify-content:center;font-weight:800;font-family:var(--font-head);flex-shrink:0;position:relative;z-index:1}
.about-tl-item:not(:last-child)::before{content:'';position:absolute;left:21px;top:46px;bottom:-2px;width:2px;background:var(--primary-l)}
.about-tl-c h3{font-size:1.05rem;margin-bottom:.35rem;color:var(--text)}
.about-tl-c p{font-size:.9375rem;color:var(--muted);line-height:1.7}
.about-story{text-align:center}
.about-story-img{border-radius:calc(var(--radius) * 1.4);overflow:hidden;aspect-ratio:21/9;margin-bottom:2.5rem;box-shadow:var(--shadow);position:relative;background:var(--primary-l)}
.about-story-img img{width:100%;height:100%;object-fit:cover}
.about-story-head{max-width:720px;margin:0 auto 2.5rem}
.about-story-head .section-text{margin:1rem auto 0}
.about-story-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;text-align:left;max-width:980px;margin:0 auto}
.about-story-col h3{font-size:1rem;margin-bottom:.4rem;color:var(--text);display:flex;align-items:center;gap:.55rem}
.about-story-col h3::before{content:'';width:22px;height:2px;background:var(--primary);border-radius:2px;flex-shrink:0}
.about-story-col p{font-size:.9rem;color:var(--muted);line-height:1.7}
.about-overlap-inner{display:grid;grid-template-columns:1.1fr .9fr;align-items:center}
.about-overlap-img{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;box-shadow:var(--shadow-lg);position:relative;background:var(--primary-l)}
.about-overlap-img img{width:100%;height:100%;object-fit:cover}
.about-overlap-card{background:var(--secondary);color:var(--on-secondary);border-radius:var(--radius);padding:2.5rem;margin-left:-3rem;box-shadow:0 24px 56px rgba(0,0,0,.28);position:relative;z-index:2}
.about-overlap-card .section-eyebrow{color:#fff;opacity:.85}
.about-overlap-card .section-eyebrow::before{background:var(--accent,#fff)}
.about-overlap-card h2{color:#fff;font-family:var(--font-head);font-size:calc(clamp(1.4rem,2.4vw,2rem) * var(--type-scale));font-weight:800;margin-bottom:1rem;line-height:1.15}
.about-ov-text{color:rgba(255,255,255,.82);margin-bottom:1.5rem;font-size:1rem;line-height:1.75}
.about-ov-list{display:flex;flex-direction:column;gap:.95rem}
.about-ov-item{display:flex;gap:.75rem;align-items:flex-start}
.about-ov-item .ic{color:var(--accent,#7ee0c0);font-weight:800;flex-shrink:0;font-size:1rem;line-height:1.4}
.about-ov-item b{display:block;font-size:.95rem;margin-bottom:.1rem;color:#fff}
.about-ov-item .ov-d{display:block;font-size:.875rem;color:rgba(255,255,255,.72);line-height:1.55}
.about-banner{position:relative;padding:clamp(4rem,8vw,7rem) 0;overflow:hidden}
.about-banner-media{position:absolute;inset:0;z-index:0}
.about-banner-media img{width:100%;height:100%;object-fit:cover}
.about-banner-media .img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.about-banner-ovl{position:absolute;inset:0;background:linear-gradient(105deg,rgba(0,0,0,.74) 0%,rgba(0,0,0,.45) 55%,rgba(0,0,0,.12) 100%)}
.about-banner-inner{position:relative;z-index:2}
.about-banner-card{max-width:560px}
.about-banner-card .section-eyebrow{color:#fff;opacity:.85}
.about-banner-card .section-eyebrow::before{background:var(--accent,#fff)}
.about-banner-card h2{color:#fff;font-family:var(--font-head);font-size:calc(clamp(1.6rem,3vw,2.5rem) * var(--type-scale));font-weight:800;margin-bottom:1rem;line-height:1.12}
.about-bn-text{color:rgba(255,255,255,.85);font-size:1.05rem;line-height:1.75;margin-bottom:1.75rem}
.about-bn-list{display:flex;flex-direction:column;gap:.85rem}
.about-bn-item{display:flex;gap:.75rem;align-items:flex-start}
.about-bn-ic{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.18);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:800;flex-shrink:0}
.about-bn-item b{display:block;color:#fff;font-size:.95rem;margin-bottom:.1rem}
.about-bn-d{display:block;font-size:.875rem;color:rgba(255,255,255,.74);line-height:1.55}
@media(max-width:900px){.about-timeline-wrap{grid-template-columns:1fr;gap:2rem}.about-tl-head{position:static;max-width:680px}}
@media(max-width:768px){
  .about-cards-grid,.about-story-cols{grid-template-columns:1fr}
  .about-overlap-inner{grid-template-columns:1fr}
  .about-overlap-card{margin-left:0;margin-top:-2.5rem}
}
/* Testimonials */
/* Pozadinu sekcije određuje ISKLJUČIVO shema (`sec-tint`/`sec-dark`/…), nikad
   pojedini tip sekcije. Ovdje je stajalo `background:var(--primary-l)` — točno
   ista boja koju `sec-tint` koristi na svijetlim paletama (`--chip-bg` =
   `--primary-l`), pa je izgledalo kao da ritam radi. Nije: recenzije su bile
   obojene bez znanja `applyRhythm()`, koji ih je smatrao neobojenima i mirno
   stavljao traku na susjednu sekciju. Mjereno na 85 stranica predložaka: od 23
   recenzije bez sheme, 22 su imale traku na susjedu — dva bloka boje koja se
   stope u jedan, što je upravo ono što pravilo „nikad dvije trake jedna do
   druge" treba spriječiti. */
.testimonials{background:var(--bg)}
.testimonials-header{text-align:center;margin-bottom:3rem}
.testimonials-header .section-text{margin:0 auto}
.testimonial-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);padding:2rem;box-shadow:0 2px 8px rgba(0,0,0,.06);position:relative;transition:box-shadow .2s,transform .2s}
.testimonial-card:hover{box-shadow:0 12px 32px rgba(0,0,0,.12);transform:translateY(-3px)}
.t-stars{color:#f59e0b;font-size:1rem;letter-spacing:2px;margin-bottom:1rem}
.testimonial-text{font-size:.9375rem;line-height:1.85;color:var(--muted);margin-bottom:1.75rem;font-style:italic;position:relative;padding-top:.5rem}
.testimonial-text::before{content:'"';font-size:4rem;line-height:0;vertical-align:-.5em;color:var(--primary);margin-right:.25rem;font-family:Georgia,serif;opacity:.25}
.testimonial-card{padding:2rem 2rem 1.75rem}
.testimonial-meta{display:flex;align-items:center;gap:12px}
.testimonial-av{width:42px;height:42px;border-radius:50%;background:var(--primary);color:var(--on-primary);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1rem;flex-shrink:0}
.testimonial-author{font-weight:700;font-size:.9375rem;color:var(--text)}
.testimonial-role{font-size:.8125rem;color:var(--muted);margin-top:1px}
/* ── Testimonials varijante ── */
.t-slider{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.35rem 0 1.25rem;-webkit-overflow-scrolling:touch;scroll-padding-inline:1px}
.t-slider .testimonial-card{flex:0 0 min(520px,88vw);max-width:520px;scroll-snap-align:start;min-height:100%;padding:clamp(1.6rem,3vw,2.25rem);box-shadow:none;border-color:var(--border)}
.t-slider::-webkit-scrollbar{height:5px}
.t-slider::-webkit-scrollbar-track{background:color-mix(in srgb,var(--border) 55%,transparent)}
.t-slider::-webkit-scrollbar-thumb{background:var(--primary);border-radius:99px}
.t-quote-list{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:3rem}
.t-quote{text-align:center;margin:0}
.t-quote-mark{font-family:Georgia,serif;font-size:4rem;line-height:.6;color:var(--primary);opacity:.3;margin-bottom:.5rem}
.t-quote blockquote{font-size:clamp(1.15rem,2vw,1.6rem);line-height:1.5;color:var(--text);font-weight:500;margin:0 0 1.25rem;font-family:var(--font-head)}
.t-quote figcaption{display:flex;flex-direction:column;gap:.15rem}
.t-quote-name{font-weight:700;color:var(--text)}
.t-quote-src{font-size:.875rem;color:var(--muted)}
.t-spotlight{max-width:900px;margin:clamp(1rem,3vw,2rem) auto 0;text-align:center;position:relative}
.spot-mark{font-family:Georgia,serif;font-size:clamp(5rem,12vw,9rem);line-height:.7;color:var(--primary);opacity:.18;margin-bottom:-1.5rem}
.spot-quote{font-family:var(--font-head);font-size:clamp(1.6rem,3.4vw,2.6rem);line-height:1.3;font-weight:700;letter-spacing:-.02em;color:var(--text);margin:0 0 2rem}
.spot-meta{display:inline-flex;align-items:center;gap:.85rem}
.spot-av{width:52px;height:52px;border-radius:50%;background:var(--primary);color:var(--on-primary);display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:800;font-size:1.25rem;flex-shrink:0}
.spot-who{display:flex;flex-direction:column;text-align:left}
.spot-name{font-weight:700;color:var(--text)}
.spot-src{font-size:.9rem;color:var(--muted)}
.logos-mq{overflow:hidden;width:100%;margin-top:1.5rem;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logos-mq-track{display:flex;align-items:center;gap:clamp(2.5rem,6vw,5rem);width:max-content;animation:logos-scroll 28s linear infinite}
.logos-mq:hover .logos-mq-track{animation-play-state:paused}
.logos-mq .logo-item{flex:0 0 auto;margin:0}
.logos-mq .logo-text{font-family:var(--font-head);font-weight:700;font-size:clamp(1.1rem,2vw,1.5rem);color:var(--muted);white-space:nowrap}
@keyframes logos-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.logos-mq-track{animation:none;flex-wrap:wrap;justify-content:center}}
.blog-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease}
.blog-card:hover{transform:translateY(-4px);box-shadow:var(--card-shadow)}
.blog-card-media{display:block;aspect-ratio:16/10;background-size:cover;background-position:center;background-color:var(--chip-bg)}
.blog-list{display:flex;flex-direction:column;gap:1.5rem;max-width:820px;margin:0 auto}
.blog-list .blog-card{flex-direction:row}
.blog-list .blog-card-media{flex:0 0 38%;aspect-ratio:auto;min-height:190px}
.blog-list .blog-card-body{justify-content:center}
@media(max-width:640px){.blog-list .blog-card{flex-direction:column}.blog-list .blog-card-media{flex-basis:auto;aspect-ratio:16/10;min-height:0}}
.blog-card-body{padding:clamp(1.1rem,2vw,1.5rem);display:flex;flex-direction:column;gap:.6rem;flex:1}
.blog-card-meta{display:flex;gap:.75rem;align-items:center;font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.blog-card-cat{color:var(--primary);font-weight:700}
.blog-card-title{font-family:var(--font-head);font-size:1.25rem;font-weight:700;line-height:1.25;margin:0;letter-spacing:-.01em}
.blog-card-title a{color:var(--text);text-decoration:none}
.blog-card-title a:hover{color:var(--primary)}
.blog-card-text{color:var(--muted);font-size:.95rem;line-height:1.6;margin:0}
.blog-card-more{margin-top:auto;color:var(--primary);font-weight:600;text-decoration:none;font-size:.9rem}
/* Blog: ISTAKNUTA + LISTA */
.blog-feat-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:2.5rem;align-items:start}
.blog-feat{display:flex;flex-direction:column}
.blog-feat-cover{display:block;aspect-ratio:16/10;border-radius:var(--radius);overflow:hidden;background:var(--primary-l);background-size:cover;background-position:center;margin-bottom:1.3rem}
.blog-meta{display:flex;gap:.7rem;align-items:center;font-size:.8rem;color:var(--muted);margin-bottom:.7rem}
.blog-cat{background:var(--primary-l);color:var(--primary);font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;padding:.25rem .7rem;border-radius:999px}
.blog-feat-title{font-family:var(--font-head);font-weight:600;font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.15;margin:0 0 .8rem}
.blog-feat-title a{color:var(--text);text-decoration:none}
.blog-feat-title a:hover{color:var(--primary)}
.blog-feat-ex{color:var(--muted);margin:0 0 1.2rem}
.blog-more{color:var(--primary);font-weight:600;text-decoration:none;font-size:.92rem}
.blog-side{display:flex;flex-direction:column;gap:1.4rem}
.blog-side-item{display:flex;gap:1rem;align-items:stretch;padding-bottom:1.4rem;border-bottom:1px solid var(--border)}
.blog-side-item:last-child{border-bottom:none;padding-bottom:0}
.blog-side-thumb{flex-shrink:0;width:108px;aspect-ratio:1;border-radius:14px;overflow:hidden;background:var(--primary-l);background-size:cover;background-position:center}
.blog-side-body{display:flex;flex-direction:column;justify-content:center}
.blog-side-title{font-family:var(--font-head);font-weight:600;font-size:1.05rem;line-height:1.25;margin:.3rem 0 0}
.blog-side-title a{color:var(--text);text-decoration:none}
.blog-side-title a:hover{color:var(--primary)}
@media(max-width:820px){.blog-feat-grid{grid-template-columns:1fr;gap:2.5rem}}
@media(max-width:900px),(prefers-reduced-motion:reduce){.sec-image,.hero-full-bg,.hero-centered-bg,.hero-splitcard-bg,.hero-minimal--img,.hslide,.cta-cover-bg,.cta-split-media{background-attachment:scroll!important}}
@media(max-width:420px){.blog-side-thumb{width:84px}}
.blog-detail-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.blog-back{display:inline-block;color:var(--muted);text-decoration:none;font-size:.9rem;margin-bottom:1rem}
.blog-back:hover{color:var(--primary)}
.blog-art-meta{display:flex;gap:.75rem;align-items:center;font-size:.82rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.6rem}
.blog-art-cat{color:var(--primary);font-weight:700}
.blog-art-title{font-family:var(--font-head);font-size:clamp(1.9rem,4vw,2.8rem);font-weight:800;line-height:1.12;letter-spacing:-.02em;margin:0 0 1.2rem}
.blog-art-cover{width:100%;aspect-ratio:16/9;background-size:cover;background-position:center;border-radius:var(--radius);margin-bottom:1.6rem;background-color:var(--chip-bg)}
.blog-art-body{color:var(--text);font-size:1.05rem;line-height:1.75}
.blog-art-body p{margin:0 0 1.1rem}
.blog-art-body h2{font-family:var(--font-head);font-size:1.6rem;font-weight:700;margin:1.8rem 0 .8rem;line-height:1.2}
.blog-art-body h3{font-family:var(--font-head);font-size:1.3rem;font-weight:700;margin:1.4rem 0 .6rem}
.blog-art-body ul,.blog-art-body ol{margin:0 0 1.1rem;padding-left:1.4rem}
.blog-art-body li{margin:.3rem 0}
.blog-art-body a{color:var(--primary);text-decoration:underline}
.blog-art-body img{max-width:100%;height:auto;border-radius:var(--radius)}
.blog-art-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.blog-tag{font-size:.8rem;background:var(--chip-bg);color:var(--muted);padding:4px 12px;border-radius:999px}
.blog-sidebar{display:flex;flex-direction:column;gap:1.6rem;position:sticky;top:90px}
.blog-sb-box h4{font-family:var(--font-head);font-size:1.05rem;font-weight:700;margin:0 0 .8rem;padding-bottom:.5rem;border-bottom:2px solid var(--primary);display:inline-block}
.blog-sb-cats,.blog-sb-recent{list-style:none;margin:0;padding:0}
.blog-sb-cats li{display:flex;justify-content:space-between;padding:.45rem 0;border-bottom:1px solid var(--border);color:var(--text);font-size:.95rem}
.blog-sb-cats li span{color:var(--muted)}
.blog-sb-recent li{padding:.45rem 0;border-bottom:1px solid var(--border)}
.blog-sb-recent a{color:var(--text);text-decoration:none;font-size:.95rem;font-weight:500;line-height:1.35;display:block}
.blog-sb-recent a:hover{color:var(--primary)}
@media(max-width:880px){.blog-detail-wrap{grid-template-columns:1fr}.blog-sidebar{position:static;border-top:1px solid var(--border);padding-top:1.6rem}}
.blog-card-media--ph{background-image:linear-gradient(135deg,var(--chip-bg),var(--border))}
.blog-allposts{margin-top:clamp(1.6rem,3vw,2.4rem);text-align:center}
.blog-allposts a{display:inline-block;color:var(--primary);font-weight:600;text-decoration:none;font-size:.95rem;border:1px solid var(--border);padding:.7rem 1.6rem;border-radius:var(--radius);transition:background .15s ease,border-color .15s ease}
.blog-allposts a:hover{background:var(--chip-bg);border-color:var(--primary)}
.t-min-list{max-width:720px;margin:0 auto;display:flex;flex-direction:column}
.t-min{padding:1.5rem 0;border-bottom:1px solid rgba(0,0,0,.08)}
.t-min:last-child{border-bottom:0}
.t-min p{font-size:1.0625rem;line-height:1.7;color:var(--text);margin:.5rem 0 .75rem;font-style:italic}
.t-min-name{font-weight:700;font-size:.9375rem;color:var(--text)}
.t-min-name span{font-weight:400;color:var(--muted)}
/* CTA */
.cta-section{--cta-surface-fg:var(--on-primary);background:linear-gradient(135deg,var(--primary) 0%,var(--primary-h) 100%);padding:clamp(4rem,8vw,7rem) 0;text-align:center;position:relative;overflow:hidden}
.cta-section .section-eyebrow{color:color-mix(in srgb,var(--cta-surface-fg) 74%,transparent)}
.cta-section .section-eyebrow::before{background:color-mix(in srgb,var(--cta-surface-fg) 56%,transparent)}
.cta-section .section-title{color:var(--cta-surface-fg)}
.cta-section .section-text{color:color-mix(in srgb,var(--cta-surface-fg) 84%,transparent);margin:0 auto 2rem}
.cta-section .btn-primary{background:var(--cta-btn-bg);color:var(--cta-btn-fg);border-color:var(--cta-btn-bg)}
.cta-section .btn-primary:hover{background:var(--cta-btn-bg);color:var(--cta-btn-fg);opacity:.9}
.cta-section.cta-banner{--cta-surface-fg:var(--on-secondary);padding:clamp(2.2rem,4.5vw,3.6rem) 0;background:var(--secondary);border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08)}
.cta-banner .cta-banner-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(2rem,5vw,5rem);text-align:left}
.cta-banner .cta-banner-text{min-width:0;max-width:760px}
.cta-banner .section-title{margin-bottom:.55rem;font-size:calc(clamp(1.8rem,3vw,2.7rem) * var(--type-scale))}
.cta-banner .section-text{margin:0;max-width:640px}
.cta-banner .cta-banner-action{flex-shrink:0}.cta-banner .btn{white-space:nowrap}
@media (max-width:680px){.cta-banner .cta-banner-inner{grid-template-columns:1fr;text-align:left;gap:1.4rem}.cta-banner .section-text{margin:0}.cta-banner .cta-banner-action{width:100%}.cta-banner .cta-banner-action .btn{width:100%}}
.cta-section.cta-boxed{background:var(--secondary);padding:clamp(3rem,6vw,5rem) 0}
.cta-section.cta-boxed .cta-box{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-h) 100%);border-radius:var(--radius,20px);padding:clamp(2.5rem,5vw,4rem);text-align:center;max-width:840px;margin:0 auto;box-shadow:0 24px 60px rgba(0,0,0,.18)}
/* CTA: COVER — slika preko cijele + poruka */
.cta-section.cta-cover{--cta-surface-fg:#fff;background:var(--secondary);min-height:clamp(360px,46vw,560px);display:flex;align-items:center;padding:clamp(4rem,8vw,7rem) 0}
.cta-cover-bg{position:absolute;inset:0;background-size:cover;background-position:var(--ss-bg-position,center);background-attachment:var(--ss-bg-attachment,scroll);background-repeat:no-repeat;z-index:0;display:flex;align-items:center;justify-content:center}
.cta-cover-ovl{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,.62) 100%)}
.cta-cover-inner{position:relative;z-index:2;text-align:center}
.cta-cover-ph{position:relative;z-index:1;color:#fff;opacity:.85;font-weight:600}
/* CTA: SPOTLIGHT — slika + box na ~1/3 */
.cta-section.cta-spotlight{--cta-surface-fg:var(--on-secondary);background:var(--secondary);min-height:clamp(400px,48vw,580px);display:flex;align-items:center;padding:clamp(3.5rem,7vw,6rem) 0}
.cta-spotlight-ovl{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.2) 46%,rgba(0,0,0,0) 72%)}
.cta-spotlight-inner{position:relative;z-index:2;width:100%}
.cta-spotlight-box{background:var(--secondary);color:var(--on-secondary);max-width:440px;padding:clamp(1.9rem,3.4vw,2.8rem);border-radius:var(--radius,18px);box-shadow:0 30px 80px rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.08);text-align:left}
.cta-spotlight-box .section-eyebrow{color:var(--primary)}
.cta-spotlight-box .section-eyebrow::before{background:var(--primary)}
.cta-spotlight-box .section-title{color:var(--on-secondary);margin-bottom:.75rem}
.cta-spotlight-box .section-text{color:color-mix(in srgb,var(--on-secondary) 86%,transparent);margin:0 0 1.5rem;max-width:none}
.cta-spotlight-box .btn-primary{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.cta-spotlight-box .btn-primary:hover{background:var(--primary-h);border-color:var(--primary-h)}
.cta-spotlight--rev .cta-spotlight-inner{display:flex;justify-content:flex-end}
.cta-spotlight--rev .cta-spotlight-ovl{background:linear-gradient(270deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.2) 46%,rgba(0,0,0,0) 72%)}
/* CTA: SPLIT — slika do ruba | sadržaj */
.cta-section.cta-split{--cta-surface-fg:var(--on-secondary);background:var(--secondary);padding:0;overflow:hidden}
.cta-split-grid{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:clamp(360px,42vw,520px)}
.cta-split--rev .cta-split-grid{direction:rtl}.cta-split--rev .cta-split-grid>*{direction:ltr}
.cta-split-media{background-size:cover;background-position:var(--ss-bg-position,center);background-attachment:var(--ss-bg-attachment,scroll);background-repeat:no-repeat;min-height:260px}
.cta-split-media--ph{display:flex;align-items:center;justify-content:center;background:var(--primary-l);color:var(--primary);font-weight:600}
.cta-split-content{display:flex;align-items:center;padding:clamp(2.5rem,5vw,4.5rem);text-align:left}
.cta-split-inner{max-width:520px}
.cta-split .section-eyebrow{color:var(--primary)}
.cta-split .section-title{color:var(--on-secondary)}
.cta-split .section-text{color:color-mix(in srgb,var(--on-secondary) 84%,transparent);margin:0 0 2rem;max-width:none}
.cta-split .btn-primary{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.cta-split .btn-primary:hover{background:var(--primary-h);border-color:var(--primary-h)}
@media (max-width:760px){.cta-split-grid{grid-template-columns:1fr}.cta-split--rev .cta-split-grid{direction:ltr}.cta-split-media{min-height:220px}.cta-spotlight-box{max-width:none}.cta-spotlight-ovl{background:rgba(0,0,0,.5)}}
/* CTA: STATEMENT */
.cta-section.cta-statement{--cta-surface-fg:var(--on-primary);background:var(--primary);text-align:left;padding:clamp(3.5rem,8vw,6.5rem) 0;position:relative;overflow:hidden}
.cta-statement::after{content:'';position:absolute;top:50%;right:-160px;transform:translateY(-50%);width:520px;height:520px;border-radius:50%;border:60px solid rgba(255,255,255,.07);pointer-events:none}
.cta-statement .container{position:relative;z-index:1}
.cta-st-inner{max-width:680px}
.cta-statement .section-eyebrow{color:color-mix(in srgb,var(--on-primary) 84%,transparent);margin-bottom:1.2rem}
.cta-statement .section-eyebrow::before{background:color-mix(in srgb,var(--on-primary) 76%,transparent)}
.cta-statement .section-title{font-family:var(--font-head);font-weight:600;font-size:calc(clamp(2.3rem,5vw,4rem) * var(--type-scale));line-height:1.05;letter-spacing:-.02em;margin:0 0 1rem;color:var(--on-primary)}
.cta-statement .section-text{color:color-mix(in srgb,var(--on-primary) 90%,transparent);font-size:1.12rem;line-height:1.7;margin:0 0 2.3rem;max-width:560px}
.cta-statement .btn-primary{background:var(--cta-btn-bg);color:var(--cta-btn-fg);border-color:var(--cta-btn-bg);padding:1rem 2.2rem;font-size:1rem;box-shadow:0 12px 30px -10px rgba(0,0,0,.35)}
.cta-statement .btn-primary:hover{background:var(--cta-btn-bg);color:var(--cta-btn-fg);opacity:.92;transform:translateY(-2px)}
.cta-st-actions{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap}
.cta-st-phone{display:inline-flex;align-items:center;gap:.7rem;color:var(--on-primary);text-decoration:none;font-weight:600}
.cta-st-phone .ic{width:42px;height:42px;border-radius:50%;border:2px solid color-mix(in srgb,var(--on-primary) 44%,transparent);display:flex;align-items:center;justify-content:center;font-size:1.1rem;transition:background .2s,border-color .2s}
.cta-st-phone:hover .ic{background:color-mix(in srgb,var(--on-primary) 16%,transparent);border-color:var(--on-primary)}
.cta-st-phone .lab{display:flex;flex-direction:column;line-height:1.2}
.cta-st-phone .lab small{font-size:.78rem;color:color-mix(in srgb,var(--on-primary) 76%,transparent);font-weight:500}
.cta-st-phone .lab b{font-size:1.05rem;font-weight:700}
@media (max-width:600px){.cta-st-actions{flex-direction:column;align-items:stretch}.cta-statement .btn-primary{justify-content:center}.cta-statement::after{width:340px;height:340px;border-width:40px;right:-120px}}
/* Contact */
.contact{background:var(--bg)}
.contact-inner{display:grid;grid-template-columns:minmax(250px,.78fr) minmax(0,1.22fr);gap:clamp(3rem,7vw,7rem);align-items:start}
.contact--split .contact-header{position:sticky;top:110px}
.contact-items{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--border)}
.contact--split .contact-items .contact-item{display:grid;grid-template-columns:44px minmax(0,1fr);gap:1rem;align-items:start;padding:1.2rem 0;border-bottom:1px solid var(--border)}
.contact-item{}
.contact-label{font-size:.8125rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--primary);margin-bottom:.375rem}
.contact-value{font-size:1rem;color:var(--text);line-height:1.6}
/* ── Contact varijante ── */
.contact-row{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(1.25rem,3vw,2.5rem);margin-top:2.5rem}
.contact--centered .contact-head{text-align:center;max-width:760px;margin:0 auto}
.contact--centered .contact-row{gap:0;border-top:1px solid var(--border);justify-content:stretch}
.contact--centered .contact-row .contact-item{flex:1 1 220px;min-width:220px;padding:1.35rem clamp(1rem,2vw,1.6rem);border-bottom:1px solid var(--border);text-align:left;display:grid;grid-template-columns:42px minmax(0,1fr);gap:.9rem;align-items:start}
.contact--centered .contact-row .contact-item+.contact-item{border-left:1px solid var(--border)}
.contact-boxed{background:var(--surface);border:1px solid var(--border);border-radius:calc(var(--radius,18px)*1.15);padding:clamp(2rem,5vw,3.8rem);box-shadow:0 24px 70px -46px rgba(0,0,0,.42);max-width:1080px;margin:0 auto;position:relative;overflow:hidden}.contact-boxed::before{content:'';position:absolute;inset:0 auto 0 0;width:4px;background:var(--primary)}
.contact-boxed-row{margin-top:0;gap:2rem 3rem}
.contact-head{max-width:720px;margin:0 auto;text-align:center}.contact-head--spaced{margin-bottom:2.5rem}.contact-head--boxed{max-width:640px;margin-bottom:2.25rem}
.contact-row .contact-item,.contact-cards .contact-item{flex-direction:column;align-items:center;text-align:center;gap:.65rem;display:flex}
.contact-row .contact-icon,.contact-cards .contact-icon{width:54px;height:54px;border-radius:50%;background:var(--primary-l);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:1.5rem}
.contact-cards{margin-top:0}
.contact-cards .contact-item{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:var(--radius);padding:2rem 1.5rem;box-shadow:0 2px 8px rgba(0,0,0,.05)}
/* Contact: PANEL (dvotonski split) */
.ct-card{display:grid;grid-template-columns:.92fr 1.08fr;border-radius:calc(var(--radius) + 6px);overflow:hidden;box-shadow:0 30px 70px -30px rgba(36,28,24,.4);background:var(--surface)}
.ct-panel{position:relative;background:var(--primary);color:var(--on-primary);padding:clamp(2.2rem,4vw,3.2rem);overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.ct-panel::after{content:'';position:absolute;bottom:-110px;left:-90px;width:300px;height:300px;border-radius:50%;border:54px solid rgba(255,255,255,.08);pointer-events:none}
.ct-eyebrow{position:relative;display:inline-flex;align-items:center;gap:10px;font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.16em;color:color-mix(in srgb,var(--on-primary) 86%,transparent);margin-bottom:1.1rem}
.ct-eyebrow::before{content:'';width:28px;height:2px;background:color-mix(in srgb,var(--on-primary) 76%,transparent);border-radius:2px}
.ct-title{position:relative;font-family:var(--font-head);font-weight:600;font-size:calc(clamp(1.7rem,3.2vw,2.5rem) * var(--type-scale));line-height:1.1;letter-spacing:-.015em;margin:0 0 1rem;color:var(--on-primary)}
.ct-text{position:relative;color:color-mix(in srgb,var(--on-primary) 90%,transparent);margin:0}
.ct-list{padding:clamp(2.2rem,4vw,3.2rem);display:flex;flex-direction:column;gap:1.5rem;justify-content:center}
.ct-item{display:flex;align-items:flex-start;gap:1rem}
.ct-ico{flex-shrink:0;width:46px;height:46px;border-radius:50%;background:var(--primary-l);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:1.2rem}
.ct-ico svg{width:22px;height:22px}
.ct-label{font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:.15rem}
.ct-value{font-size:1.05rem;font-weight:600;color:var(--text)}
.ct-value a{color:var(--text);text-decoration:none}
.ct-value a:hover{color:var(--primary)}
@media(max-width:720px){.ct-card{grid-template-columns:1fr}.ct-panel::after{display:none}}
/* ── Kontakt FORMULAR (PRO) ── */
.contact-form-section{background:var(--surface-2)}
.cf-wrap{max-width:680px}
.cf-head{text-align:center;margin-bottom:2rem}
.cf-intro{color:var(--muted);margin-top:.6rem}
.cf-form{display:flex;flex-direction:column;gap:1rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(1.5rem,4vw,2.5rem);box-shadow:0 8px 30px rgba(0,0,0,.06)}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:560px){.cf-row{grid-template-columns:1fr}}
.cf-field{display:flex;flex-direction:column;gap:.4rem}
.cf-field label{font-size:.85rem;font-weight:600;color:var(--text)}
.cf-form input,.cf-form textarea,.cf-form select{width:100%;padding:.75rem .9rem;border:1px solid var(--border);border-radius:var(--btn-radius);font:inherit;color:var(--text);background:var(--bg);transition:border-color .15s,box-shadow .15s}.cf-form select{appearance:auto}
.cf-form input:focus,.cf-form textarea:focus,.cf-form select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--chip-bg)}
.cf-form textarea{resize:vertical;min-height:120px}
.cf-submit{align-self:flex-start;margin-top:.4rem;cursor:pointer;border:none}
.cf-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;overflow:hidden}
.cf-note{font-size:.8rem;color:var(--muted);margin-top:.2rem}
.cf-status{max-width:680px;margin:0 auto 1.25rem;padding:.9rem 1.1rem;border-radius:var(--radius);font-weight:600;text-align:center}
.cf-status.cf-ok{background:rgba(22,163,74,.1);color:#15803d;border:1px solid rgba(22,163,74,.25)}
.cf-status.cf-err{background:rgba(220,38,38,.08);color:#b91c1c;border:1px solid rgba(220,38,38,.22)}
/* ── FAQ ── */
.faq-layout{display:grid;grid-template-columns:1fr 1.6fr;gap:4rem;align-items:start}
@media(max-width:768px){.faq-layout{grid-template-columns:1fr}}
.faq-header{position:sticky;top:80px}
.faq-list{display:flex;flex-direction:column;gap:.5rem}
.faq{background:var(--bg)}
.faq-header{margin-bottom:2.5rem}
/* ── FAQ varijante ── */
.faq-acc{max-width:760px;margin:0 auto}
.faq-grid-head{text-align:left;margin:0;max-width:760px}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(2.5rem,6vw,6rem);max-width:none;margin:2.75rem 0 0;border-top:1px solid var(--border)}.faq-grid .faq-item{border-radius:0;border-left:0;border-right:0;box-shadow:none;margin:0;background:transparent}.faq-grid .faq-question{padding-left:0;padding-right:0}.faq-grid .faq-answer{padding-left:0;padding-right:0}
@media(max-width:768px){.faq-grid{grid-template-columns:1fr;gap:0;margin-top:2rem}}
/* Gallery */
.gallery{background:var(--bg)}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.gallery-item{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;background:var(--primary-l);display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.875rem}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.gallery-item:hover img{transform:scale(1.05)}
.gallery-masonry{columns:3 240px;column-gap:1rem}
.gallery-masonry .gallery-item{break-inside:avoid;margin-bottom:1rem;aspect-ratio:auto;height:auto}
.gallery-masonry .gallery-item img{height:auto;aspect-ratio:auto}
.gallery-slider{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem;-webkit-overflow-scrolling:touch}
.gallery-slider .gallery-item{flex:0 0 300px;scroll-snap-align:start}
.gallery-slider::-webkit-scrollbar{height:8px}
.gallery-slider::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15);border-radius:99px}
.gallery-mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:170px;gap:12px}
.gallery-mosaic .gallery-item{margin:0;height:100%}
.gallery-mosaic .gallery-item:first-child{grid-column:span 2;grid-row:span 2}
.gallery-mosaic .gallery-item img{width:100%;height:100%;object-fit:cover}
@media(max-width:760px){.gallery-mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:140px}.gallery-mosaic .gallery-item:first-child{grid-column:span 2;grid-row:span 2}}
/* Lightbox (galerije) */
.gallery-item[data-lb]{position:relative;cursor:zoom-in}
.gallery-item[data-lb]::after{content:'⤢';position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1rem;opacity:0;transition:opacity .2s;pointer-events:none;z-index:2}
.gallery-item[data-lb]:hover::after{opacity:1}
.gallery-figure[data-lb]{cursor:zoom-in}.gallery-figure[data-lb]::after{content:'⤢';position:absolute;top:10px;right:10px;width:32px;height:32px;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1rem;opacity:0;transition:opacity .2s;pointer-events:none;z-index:3}.gallery-figure[data-lb]:hover::after{opacity:1}
.ss-lb{position:fixed;inset:0;background:rgba(20,14,11,.94);z-index:9999;display:none;align-items:center;justify-content:center;padding:24px}
.ss-lb.open{display:flex}
.ss-lb-img{max-width:88vw;max-height:80vh;object-fit:contain;border-radius:10px;box-shadow:0 24px 70px rgba(0,0,0,.55)}
.ss-lb-cap{position:absolute;bottom:26px;left:0;right:0;text-align:center;color:rgba(255,255,255,.82);font-size:.95rem;padding:0 20px}
.ss-lb-count{position:absolute;top:22px;left:0;right:0;text-align:center;color:rgba(255,255,255,.6);font-size:.85rem;letter-spacing:.05em}
.ss-lb-btn{position:absolute;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);color:#fff;width:50px;height:50px;border-radius:50%;font-size:1.6rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}
.ss-lb-btn:hover{background:rgba(255,255,255,.22)}
.ss-lb-prev{left:18px;top:50%;transform:translateY(-50%)}
.ss-lb-next{right:18px;top:50%;transform:translateY(-50%)}
.ss-lb-close{top:18px;right:18px;width:42px;height:42px;font-size:1.3rem}
@media(max-width:600px){.ss-lb-btn{width:40px;height:40px}.ss-lb-prev{left:8px}.ss-lb-next{right:8px}}

/* ── 1.121 Section Expansion: moderne varijante ───────────────────── */
.stats-cards{background:var(--surface-2);color:var(--text)}.stats-cards .stats-header .section-title{color:var(--text)}.stats-cards .stats-header .section-text{color:var(--muted)}.stats-cards .stats-grid{gap:1rem}.stats-cards .stat-item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(1.4rem,3vw,2.2rem);text-align:left}.stats-cards .stat-value{font-size:clamp(2.2rem,5vw,4.4rem);line-height:.9;color:var(--primary);-webkit-text-fill-color:currentColor}.stats-cards .stat-label{color:var(--muted)}.stats-band{background:var(--text);color:var(--on-text)}.stats-band .stats-header .section-title,.stats-band .stat-value{color:var(--on-text)}.stats-band .stats-grid{border-top:1px solid color-mix(in srgb,var(--on-text) 18%,transparent);border-bottom:1px solid color-mix(in srgb,var(--on-text) 18%,transparent);gap:0}.stats-band .stat-item{padding:2rem 1.4rem;border-right:1px solid color-mix(in srgb,var(--on-text) 18%,transparent)}.stats-band .stat-item:last-child{border-right:0}.stats-band .stat-label{color:color-mix(in srgb,var(--on-text) 68%,transparent)}
.references-section .section-head,.standards-section .section-head{max-width:760px;margin:0 auto 2.5rem;text-align:center}.references-section .section-head .section-text,.standards-section .section-head .section-text{margin-left:auto;margin-right:auto}.references-section.references-section--compact .section-head{margin-bottom:1.5rem}.standards-section.section-sparse{padding-top:clamp(2.75rem,4.5vw,4rem);padding-bottom:clamp(2.75rem,4.5vw,4rem)}.standards-section.section-sparse .section-head{margin-bottom:1.5rem}.standards-section.section-sparse .standards-grid{max-width:760px;margin-left:auto;margin-right:auto;justify-content:center}.standards-section.section-sparse .standards-grid.adaptive-cols-1{grid-template-columns:minmax(0,520px)}.standards-section.section-sparse .standard-card{min-height:0}.references-list{border-top:1px solid var(--border)}.reference-row{display:grid;grid-template-columns:minmax(190px,.7fr) 1.3fr;gap:clamp(1.5rem,4vw,4.5rem);padding:1.5rem 0;border-bottom:1px solid var(--border)}.reference-row h3{margin:0;font-size:clamp(1.05rem,2vw,1.35rem)}.reference-row p{margin:0;color:var(--muted);line-height:1.7}.reference-meta{display:block;margin-top:.45rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;color:var(--primary)}.references-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.references-grid.references-grid--dense{grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.reference-card{padding:1.5rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}.references-grid--dense .reference-card{padding:1.15rem}.reference-card h3{margin:0 0 .65rem}.reference-card p{margin:0;color:var(--muted);line-height:1.65}.references-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--border);border-left:1px solid var(--border);background:color-mix(in srgb,var(--surface) 78%,transparent)}.reference-wall-item{min-width:0;min-height:86px;padding:1rem 1.1rem;border-right:1px solid var(--border);border-bottom:1px solid var(--border);display:flex;flex-direction:column;justify-content:center}.reference-wall-item h3{margin:0;font-size:clamp(.9rem,1.3vw,1.05rem);line-height:1.25}.reference-wall-item p{margin:.35rem 0 0;color:var(--muted);font-size:.84rem;line-height:1.4}.reference-wall-item .reference-meta{margin-top:.35rem;font-size:.68rem}.standards-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}.standard-card{display:flex;flex-direction:column;min-height:180px;padding:1.25rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);align-items:flex-start}.standard-logo{height:74px;width:100%;display:flex;align-items:center;margin-bottom:1rem}.standard-logo img{max-height:70px;max-width:150px;width:auto;object-fit:contain}.standard-card h3{margin:auto 0 .4rem;font-size:1rem}.standard-card p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.55}.standards-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.standards-list .standard-card{min-height:120px;display:grid;grid-template-columns:120px 1fr;align-items:center;column-gap:1.25rem}.standards-list .standard-logo{margin:0}.standards-list .standard-card h3{margin:0 0 .35rem}@media(max-width:900px){.references-wall{grid-template-columns:repeat(2,minmax(0,1fr))}.references-grid.references-grid--dense{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:800px){.standards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reference-row{grid-template-columns:1fr;gap:.5rem}.references-grid,.standards-list{grid-template-columns:1fr}}@media(max-width:560px){.references-wall{grid-template-columns:1fr}.reference-wall-item{min-height:68px}}@media(max-width:480px){.standards-grid{grid-template-columns:1fr}}
.certificates-section .section-head{max-width:760px;margin:0 auto 2.5rem;text-align:center}.certificates-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.certificates-showcase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}.certificate-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;display:flex;flex-direction:column;gap:1rem}.certificate-media{aspect-ratio:4/3;background:var(--surface-2);border-radius:calc(var(--radius)*.75);overflow:hidden;display:flex;align-items:center;justify-content:center}.certificate-media img{width:100%;height:100%;object-fit:contain}.certificate-card h3{margin:0;font-size:1.05rem}.certificate-card p{margin:.35rem 0 0;color:var(--muted);line-height:1.55}.certificate-card--text{min-height:0;padding:1.35rem 1.5rem;justify-content:center}.certificates-text-only{grid-template-columns:minmax(0,760px)!important;justify-content:center}@media(max-width:800px){.certificates-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.certificates-cards,.certificates-showcase{grid-template-columns:1fr}}
.documents-section .section-head{max-width:760px;margin:0 auto 2.3rem;text-align:center}.documents-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.documents-list{display:grid;grid-template-columns:1fr;gap:.75rem;max-width:900px;margin:0 auto}.document-card{display:flex;align-items:flex-start;gap:1rem;padding:1.25rem 1.35rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);text-decoration:none;color:inherit;transition:transform .18s ease,border-color .18s ease}.document-card:hover{transform:translateY(-2px);border-color:var(--accent)}.document-mark{width:2.65rem;height:2.65rem;flex:0 0 2.65rem;border-radius:calc(var(--radius)*.65);display:grid;place-items:center;background:var(--surface-2);font-weight:800;font-size:.72rem;letter-spacing:.05em;color:var(--accent)}.document-copy{min-width:0;flex:1}.document-copy h3{margin:0;font-size:1.05rem}.document-copy p{margin:.35rem 0 0;color:var(--muted);line-height:1.55}.document-meta{display:block;margin-top:.6rem;font-size:.78rem;color:var(--muted)}.document-action{margin-left:auto;align-self:center;font-size:1.25rem;color:var(--accent)}@media(max-width:700px){.documents-cards{grid-template-columns:1fr}.document-card{padding:1rem}.document-action{margin-left:.25rem}}
.hero-slider--cinematic .hslider-track{min-height:min(86vh,880px)}.hero-slider--cinematic .hslide-ovl{background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,.12) 62%)}.hero-slider--cinematic .hslide-inner{min-height:min(86vh,880px);display:flex;align-items:flex-end;padding-bottom:clamp(4rem,8vw,7rem)}.hero-slider--cinematic .hslide-c{max-width:820px}.hero-slider--cinematic .hero-title{font-size:calc(clamp(3rem,7vw,7rem) * var(--type-scale));max-width:12ch}.hero-slider--split .hslide{background-color:var(--surface-2);background-size:50% 100%;background-position:var(--ss-bg-position,right center);background-repeat:no-repeat}.hero-slider--split .hslide-ovl{background:linear-gradient(90deg,var(--surface) 0 48%,rgba(255,255,255,.92) 55%,rgba(255,255,255,0) 75%)}.hero-slider--split .hslide-inner{min-height:650px;display:flex;align-items:center}.hero-slider--split .hslide-c{color:var(--text);max-width:48%}.hero-slider--split .hslide-eyebrow{color:var(--primary)}.hero-slider--split .hero-title{color:var(--text)}.hero-slider--split .hero-text{color:var(--muted)}.hero-slider--split .hslide-dots{justify-content:flex-start;left:max(24px,calc((100% - var(--container))/2));right:auto}.hero-slider--split .hslide-dot{background:var(--border)}.hero-slider--split .hslide-dot.is-active{background:var(--primary)}.hero-slider--fixedsplit{background:var(--bg);color:var(--text)}.hero-slider--fixedsplit .hslider-track{min-height:auto}.hero-slider--fixedsplit .hslide{background:none}.hero-slider--fixedsplit .hslide-ovl{display:none}.hero-slider--fixedsplit .hslide-fixed-inner{min-height:min(82vh,840px);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:clamp(2rem,7vw,8rem);align-items:center;padding:clamp(3rem,7vw,6rem) 0}.hero-slider--fixedsplit .hslide-fixed-copy{max-width:640px}.hero-slider--fixedsplit .hslide-eyebrow{display:block;margin-bottom:1.15rem;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--primary);font-weight:700}.hero-slider--fixedsplit .hero-title{color:var(--text);font-size:calc(clamp(3.1rem,8vw,6.4rem) * var(--type-scale));line-height:.95;max-width:8.5ch;text-shadow:none}.hero-slider--fixedsplit .hero-text{color:var(--muted);font-size:1.14rem;line-height:1.75;max-width:32ch;margin-bottom:2rem}.hero-slider--fixedsplit .hero-actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.hero-slider--fixedsplit .hslide-fixed-stage{display:flex;justify-content:center}.hero-slider--fixedsplit .hslide-fixed-frame{position:relative;width:min(100%,480px);aspect-ratio:4/5;border:1px solid color-mix(in srgb,var(--border) 92%,transparent);border-radius:calc(var(--radius) * 1.2);background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 92%,#fff),color-mix(in srgb,var(--surface-2) 88%,#fff));box-shadow:0 22px 54px rgba(12,18,28,.10);padding:clamp(1.25rem,3vw,2rem);display:flex;align-items:center;justify-content:center;overflow:hidden}.hero-slider--fixedsplit .hslide-fixed-frame::after{content:'';position:absolute;right:7%;bottom:12%;width:28%;aspect-ratio:1;background:color-mix(in srgb,var(--surface) 88%,transparent);border-radius:8px;opacity:.55}.hero-slider--fixedsplit .hslide-fixed-frame img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 22px 25px rgba(0,0,0,.12))}.hero-slider--fixedsplit .hslide-fixed-frame .catalog-img-placeholder{position:relative;z-index:1;width:100%;height:100%;display:grid;place-items:center;font-size:2rem}.hero-slider--fixedsplit.hero-slider--reverse .hslide-fixed-copy{order:2}.hero-slider--fixedsplit.hero-slider--reverse .hslide-fixed-stage{order:1}.hero-slider--fixedsplit .hslide-dots{justify-content:flex-start;left:max(24px,calc((100% - var(--container))/2));right:auto}.hero-slider--fixedsplit .hslide-dot{background:var(--border)}.hero-slider--fixedsplit .hslide-dot.is-active{background:var(--primary)}@media(max-width:960px){.hero-slider--fixedsplit .hslide-fixed-inner{grid-template-columns:1fr;min-height:auto}.hero-slider--fixedsplit .hslide-fixed-copy,.hero-slider--fixedsplit .hero-text{max-width:none}.hero-slider--fixedsplit .hslide-fixed-stage{justify-content:flex-start}.hero-slider--fixedsplit.hero-slider--reverse .hslide-fixed-copy,.hero-slider--fixedsplit.hero-slider--reverse .hslide-fixed-stage{order:initial}.hero-slider--fixedsplit .hslide-dots{left:24px}}@media(max-width:640px){.hero-slider--fixedsplit .hero-title{font-size:calc(clamp(2.55rem,13vw,4.2rem) * var(--type-scale))}.hero-slider--fixedsplit .hslide-fixed-frame{width:100%;aspect-ratio:1/1}}
/* `.cf-wrap` ima max-width:680px za klasični, jednostupčani obrazac. Split
   varijanta to nije poništavala, pa je CIJELI dvostupčani raspored stajao u
   680 px — lijevi stupac ~270 px, naslov se lomio usred riječi
   („Razgovarajm / o o vašem upitu"), a ispod teksta je zjapila praznina.
   Uz to je naslov ostajao centriran, što u dvostupčanom rasporedu izgleda
   kao greška. */
.cf-layout-split .cf-wrap{max-width:var(--container);width:100%;display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr);gap:clamp(2rem,5vw,4rem);align-items:start}
.cf-layout-split .cf-head{position:sticky;top:100px;text-align:left;margin-bottom:0}
.cf-layout-split .cf-head .section-title,.cf-layout-split .cf-head h2{text-wrap:balance;overflow-wrap:normal;word-break:normal;hyphens:none}
.cf-layout-split .cf-intro{margin-right:0}.cf-layout-split .cf-form{background:var(--surface);border:1px solid var(--border);border-radius:calc(var(--radius)*1.2);padding:clamp(1.5rem,3vw,2.5rem);box-shadow:var(--card-shadow)}.cf-layout-card .cf-wrap{max-width:900px}.cf-layout-card .cf-head{text-align:center;max-width:620px;margin:0 auto 2rem}.cf-layout-card .cf-form{background:var(--surface);border:1px solid var(--border);border-radius:calc(var(--radius)*1.4);padding:clamp(1.5rem,4vw,3rem);box-shadow:0 24px 70px rgba(0,0,0,.09)}
/* Contact form ASIDE — otvoreni editorial split + stvarni kontakt podaci. */
.cf-layout-aside{background:var(--bg)}.cf-layout-aside .cf-wrap{max-width:var(--container);width:100%;display:grid;grid-template-columns:minmax(260px,.78fr) minmax(0,1.22fr);gap:clamp(2rem,6vw,5rem);align-items:start}.cf-layout-aside .cf-head{text-align:left;margin:0;padding:1rem 0 1rem clamp(1.2rem,2vw,1.8rem);border-left:3px solid var(--primary)}.cf-layout-aside .cf-form{background:var(--surface);box-shadow:var(--card-shadow)}
/* Contact form BAND — jak završni brand blok, ali forma ostaje čitljiva bijela kartica. */
.cf-layout-band{background:var(--surface-2)}.cf-layout-band .cf-wrap{max-width:var(--container);width:100%;display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr);gap:clamp(1.5rem,4vw,3rem);align-items:center;background:var(--primary);border-radius:calc(var(--radius)*1.8);padding:clamp(1.5rem,4vw,3.5rem);box-shadow:0 28px 80px rgba(0,0,0,.14)}.cf-layout-band .cf-head{text-align:left;margin:0}.cf-layout-band .cf-head .section-eyebrow,.cf-layout-band .cf-head .section-title{color:var(--on-primary)}.cf-layout-band .cf-head .section-eyebrow::before{background:color-mix(in srgb,var(--on-primary) 70%,transparent)}.cf-layout-band .cf-intro{color:color-mix(in srgb,var(--on-primary) 78%,transparent)}.cf-layout-band .cf-form{background:var(--surface);border-color:rgba(0,0,0,.06);box-shadow:0 18px 50px rgba(0,0,0,.14)}
.cf-meta{display:grid;gap:.55rem;margin-top:1.4rem}.cf-meta>a,.cf-meta>span{display:flex;gap:.55rem;align-items:flex-start;font-size:.9rem;line-height:1.45;color:var(--muted);text-decoration:none;overflow-wrap:anywhere}.cf-meta a:hover{color:var(--primary)}.cf-layout-band .cf-meta a,.cf-layout-band .cf-meta span{color:color-mix(in srgb,var(--on-primary) 82%,transparent)}.cf-layout-band .cf-meta a:hover{color:var(--on-primary)}
.faq-modern-head{max-width:720px;margin-bottom:2.5rem}.faq-modern-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.faq-modern-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(1.4rem,3vw,2.2rem)}.faq-modern-card h3{font-family:var(--font-head);font-size:1.2rem;margin:.55rem 0}.faq-modern-card p{color:var(--muted);line-height:1.7}.faq-modern-kicker{font-size:.72rem;text-transform:uppercase;letter-spacing:.14em;color:var(--primary);font-weight:700}.faq-numbered-layout{display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);gap:clamp(2rem,7vw,7rem);align-items:start}.faq-numbered-head{position:sticky;top:100px}.faq-num-row{display:grid;grid-template-columns:56px minmax(0,1fr);gap:1rem;padding:1.35rem 0;border-top:1px solid var(--border)}.faq-num-row:last-child{border-bottom:1px solid var(--border)}.faq-num{font-family:var(--font-head);font-size:1.4rem;color:var(--primary)}.faq-num-row h3{margin:0 0 .45rem;font-size:1.05rem}.faq-num-row p{color:var(--muted);line-height:1.65}
.gallery-showcase{display:grid;grid-template-columns:1.25fr .75fr .75fr;grid-template-rows:repeat(2,minmax(220px,1fr));gap:1rem}.gallery-showcase-item{min-height:220px}.gallery-showcase-i0{grid-row:1/3}.gallery-showcase-i3{grid-column:2/4}.gallery-showcase .gallery-figure{height:100%}.gallery-fullbleed-head{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2rem}.gallery-fullbleed{display:grid;grid-template-columns:repeat(5,minmax(260px,1fr));gap:.65rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(1rem,calc((100vw - 1400px)/2)) 1rem}.gallery-fullbleed-item{height:clamp(340px,48vw,640px);scroll-snap-align:center}.gallery-fullbleed-item:nth-child(even){height:clamp(300px,42vw,560px);margin-top:clamp(1.5rem,5vw,5rem)}
.reviews-spotlight{display:grid;grid-template-columns:1.5fr .75fr .75fr;gap:1rem}.reviews-spotlight .review-card:first-child{grid-row:span 2;padding:clamp(2rem,4vw,3.5rem)}.reviews-spotlight .review-card:first-child .review-text{font-size:clamp(1.2rem,2.4vw,2rem);line-height:1.45}.reviews-wall{columns:3 280px;column-gap:1rem;margin-top:2.75rem}.reviews-wall .review-card{break-inside:avoid;margin-bottom:1rem;border-radius:calc(var(--radius)*.8)}.reviews-wall .review-card:nth-child(3n+1){padding-top:2rem;padding-bottom:2rem}.reviews-wall .review-card:nth-child(3n+2){background:color-mix(in srgb,var(--primary) 4%,var(--surface))}
.map-section--card .map-layout{background:var(--surface);border:1px solid var(--border);border-radius:calc(var(--radius)*1.3);padding:.75rem;box-shadow:var(--card-shadow);grid-template-columns:minmax(260px,.7fr) minmax(0,1.3fr)}.map-section--card .map-info{padding:clamp(1rem,3vw,2.5rem)}
.map-section--full .section-header{margin-bottom:1.75rem}.map-full-info{display:flex;flex-wrap:wrap;gap:.75rem 2rem;align-items:center;margin-bottom:2rem}.map-full-info .map-row{padding:.35rem 0}.map-full-info .map-btn{margin-left:auto}.map-full-media .map-embed{border-radius:0;border-left:0;border-right:0;min-height:clamp(360px,46vw,620px)}.map-full-media .map-embed iframe{min-height:clamp(360px,46vw,620px)}
.hours-section--split .hours-wrap{max-width:var(--container);width:100%;display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr);gap:clamp(2rem,6vw,6rem);align-items:start}.hours-section--split .section-header{text-align:left;position:sticky;top:100px}.hours-section--split .hours-card{margin-top:0;width:100%;max-width:none;padding:1.75rem 2rem}.hours-section--brief .hours-wrap{max-width:var(--container);width:100%;display:grid;grid-template-columns:minmax(260px,.9fr) minmax(340px,1.1fr);gap:clamp(2rem,5vw,4rem);align-items:center}.hours-section--brief .section-header{text-align:left;margin:0}.hours-section--brief .section-header .section-text{margin-left:0;margin-right:0}.hours-section--brief .hours-card{margin:0;padding:clamp(1.25rem,3vw,1.8rem)}.hours-section--brief .hours-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.hours-section--brief .hours-row{display:block;border:1px solid var(--border)!important;border-radius:var(--radius);padding:1rem 1.1rem;background:var(--surface-2)}.hours-section--brief .hours-val{display:block;margin-top:.35rem;color:var(--primary);font-weight:750}.hours-section--compact .hours-wrap{max-width:var(--container);width:100%}.hours-section--compact .section-header{text-align:left;display:grid;grid-template-columns:.7fr 1.3fr;gap:2rem;align-items:end}.hours-section--compact .hours-card{padding:0;background:transparent;border:0;box-shadow:none}.hours-section--compact .hours-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.hours-section--compact .hours-row{background:var(--surface);border:1px solid var(--border)!important;border-radius:var(--radius);padding:1rem;display:block}.hours-section--compact .hours-val{display:block;margin-top:.25rem;color:var(--primary);font-weight:700}
.steps-section--timeline .steps-grid{display:block;max-width:900px;margin-left:auto;margin-right:auto;position:relative}.steps-section--timeline .steps-grid:before{content:'';position:absolute;left:27px;top:20px;bottom:20px;width:1px;background:var(--border)}.steps-section--timeline .step-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:1.3rem;background:transparent;border:0;padding:1rem 0;position:relative}.steps-section--timeline .step-num{z-index:1;background:var(--surface);border:1px solid var(--primary);color:var(--primary)}.steps-section--split .container{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:clamp(2rem,6vw,6rem);align-items:start}.steps-section--split .section-header{position:sticky;top:100px;text-align:left}.steps-section--split .steps-grid{grid-template-columns:1fr;gap:.75rem;margin-top:0}.steps-section--split .step-card{display:grid;grid-template-columns:56px minmax(0,1fr);gap:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:1.15rem 1.35rem;box-shadow:var(--shadow-sm)}
.offer-section--poster .offer-card{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);background:var(--text);color:var(--on-text)}.offer-section--poster .offer-body{padding:clamp(2rem,6vw,5rem)}.offer-section--poster .offer-title{color:var(--on-text);font-size:calc(clamp(2.3rem,5vw,5rem) * var(--type-scale));max-width:10ch}.offer-section--poster .offer-text,.offer-section--poster .offer-feats li{color:color-mix(in srgb,var(--on-text) 74%,transparent)}.offer-section--poster .offer-media{min-height:520px}.offer-section--banner .offer-card{grid-template-columns:320px minmax(0,1fr);align-items:center}.offer-section--banner .offer-media{min-height:240px}.offer-section--banner .offer-body{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:2rem;align-items:center}.offer-section--banner .offer-title,.offer-section--banner .offer-text,.offer-section--banner .offer-feats{grid-column:1}.offer-section--banner .offer-price,.offer-section--banner .offer-btn{grid-column:2}.offer-section--banner .offer-price{grid-row:1/3;align-self:end}
.team-editorial-head{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:end;margin-bottom:3rem}.team-editorial-grid{gap:1rem}.team-editorial .tm-card{text-align:left}.team-editorial .tm-photo{aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden}.team-feature-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:clamp(2rem,6vw,6rem);align-items:stretch}.team-feature-grid.no-media{grid-template-columns:1fr;max-width:900px}.team-feature-grid.no-media .team-feature-photo{display:none}.team-feature-photo{min-height:560px;border-radius:var(--radius);overflow:hidden;background:var(--surface-2)}.team-feature-photo img{width:100%;height:100%;object-fit:cover}.team-feature-main{display:flex;flex-direction:column;justify-content:center}.team-feature-label{text-transform:uppercase;letter-spacing:.15em;font-size:.72rem;color:var(--primary);font-weight:700}.team-feature-main h3{font-family:var(--font-head);font-size:calc(clamp(2rem,4vw,4rem) * var(--type-scale));margin:.7rem 0}.team-feature-main>p{font-size:1.05rem;color:var(--muted)}.team-feature-rest{margin-top:2rem;border-top:1px solid var(--border)}.team-feature-row{display:grid;grid-template-columns:40px 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--border)}.team-feature-row span{color:var(--primary);font-family:var(--font-head)}.team-feature-row small{display:block;color:var(--muted);margin-top:.2rem}

@media(max-width:640px){.gallery-masonry{columns:2 150px}}
/* Pricing */
.pricing{background:var(--bg)}
.pricing-header{text-align:center;margin-bottom:3rem}
.pricing-grid{gap:1.5rem;align-items:start}
.pricing-card{border:1px solid var(--border);border-radius:var(--radius);padding:clamp(1.65rem,3vw,2.25rem);position:relative;transition:transform .2s,box-shadow .2s,border-color .2s;background:var(--surface);display:flex;flex-direction:column;min-height:100%}
.pricing-card:hover{transform:translateY(-3px);box-shadow:0 20px 48px -34px rgba(0,0,0,.45);border-color:color-mix(in srgb,var(--primary) 22%,var(--border))}
.pricing-card-featured{border-color:var(--primary);box-shadow:0 20px 54px -36px color-mix(in srgb,var(--primary) 55%,transparent);transform:none}
.pricing-card-featured:hover{transform:translateY(-3px)}
.pricing-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--primary);color:var(--on-primary);font-size:.75rem;font-weight:700;padding:.25rem 1rem;border-radius:100px;white-space:nowrap}
.pricing-name{font-weight:800;font-size:1.25rem;margin-bottom:.375rem;color:var(--text)}
.pricing-desc{font-size:.875rem;color:var(--muted);margin-bottom:1.25rem;line-height:1.6}
.pricing-price-wrap{margin-bottom:1.5rem}
.pricing-price{font-family:var(--font-head);font-size:2.75rem;font-weight:900;color:var(--primary);line-height:1}
.pricing-period{font-size:1rem;font-weight:400;color:var(--muted)}
.pricing-features{list-style:none;margin:0 0 1.75rem;padding:0;text-align:left;display:flex;flex-direction:column;gap:.6rem}
.pricing-features li{display:flex;align-items:flex-start;gap:8px;font-size:.9375rem;color:var(--text);line-height:1.5}
.pf-check{color:var(--primary);font-weight:700;flex-shrink:0}
.pricing-cta{width:100%;justify-content:center;text-align:center}
.btn-outline{display:inline-flex;align-items:center;border:2px solid var(--primary);color:var(--primary);padding:.625rem 1.5rem;border-radius:var(--btn-radius);font-weight:600;text-decoration:none;transition:all .2s}
.btn-outline:hover{background:var(--primary);color:var(--on-primary)}
.pricing-features{list-style:none;margin:1.5rem 0;text-align:left}
.pricing-features li{padding:.5rem 0;border-bottom:1px solid rgba(0,0,0,.06);font-size:.9375rem;color:var(--muted);display:flex;gap:.625rem}
.pricing-features li::before{content:'✓';color:var(--primary);font-weight:700;flex-shrink:0}
/* ── Pricing varijante ── */
/* Pricing: SPOTLIGHT */
.pr-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:1.5rem;align-items:stretch}
.pr-main{position:relative;background:var(--primary);color:var(--on-primary);border-radius:var(--radius);padding:clamp(2rem,4vw,3rem);overflow:hidden;box-shadow:0 24px 60px -20px rgba(0,0,0,.4);display:flex;flex-direction:column}
.pr-main::after{content:'';position:absolute;top:-80px;right:-80px;width:260px;height:260px;border-radius:50%;border:46px solid rgba(255,255,255,.08);pointer-events:none}
.pr-badge{position:relative;align-self:flex-start;background:var(--on-primary);color:var(--primary);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:.35rem .9rem;border-radius:999px;margin-bottom:1.2rem}
.pr-main-name{position:relative;font-family:var(--font-head);font-weight:600;font-size:1.8rem;margin:0 0 .4rem;color:var(--on-primary)}
.pr-main-price{position:relative;font-family:var(--font-head);font-weight:600;font-size:3rem;line-height:1;margin:0 0 1.5rem;color:var(--on-primary)}
.pr-main-price .pricing-period{font-family:var(--font-body);font-size:1rem;font-weight:500;color:color-mix(in srgb,var(--on-primary) 84%,transparent)}
.pr-list{position:relative;list-style:none;padding:0;margin:0 0 1.8rem;display:flex;flex-direction:column;gap:.7rem}
.pr-list li{display:flex;gap:.6rem;align-items:flex-start;font-size:.98rem;line-height:1.45}
.pr-list li::before{content:'✓';flex-shrink:0;font-weight:700}
.pr-main .pr-list li::before{color:var(--on-primary)}
.pr-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-body);font-weight:700;font-size:.98rem;padding:.95rem 1.5rem;border-radius:var(--btn-radius);text-decoration:none;transition:transform .2s,background .2s,color .2s;margin-top:auto}
.pr-btn-cream{background:var(--on-primary);color:var(--primary);border:2px solid var(--on-primary)}
.pr-btn-cream:hover{transform:translateY(-2px);background:rgba(255,255,255,.92);color:var(--primary)}
.pr-side{display:flex;flex-direction:column;gap:1.5rem}
.pr-card{background:var(--surface,#fff);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(1.6rem,3vw,2rem);display:flex;flex-direction:column;flex:1;transition:transform .2s,box-shadow .2s,border-color .2s}
.pr-card:hover{transform:translateY(-3px);box-shadow:0 16px 36px -16px rgba(0,0,0,.2);border-color:var(--primary-l)}
.pr-card-name{font-family:var(--font-head);font-weight:600;font-size:1.3rem;margin:0 0 .2rem}
.pr-card-price{font-family:var(--font-head);font-weight:600;font-size:1.9rem;color:var(--primary);line-height:1;margin:0 0 1rem}
.pr-card-price .pricing-period{font-family:var(--font-body);font-size:.85rem;font-weight:500;color:var(--muted)}
.pr-card .pr-list{margin:0 0 1.3rem}
.pr-card .pr-list li{font-size:.92rem;color:var(--text)}
.pr-card .pr-list li::before{color:var(--primary)}
.pr-btn-ghost{background:transparent;color:var(--text);border:2px solid var(--text)}
.pr-btn-ghost:hover{background:var(--text);color:var(--bg)}
@media(max-width:760px){.pr-grid{grid-template-columns:1fr}}
.pr-rows{display:flex;flex-direction:column;gap:1rem;max-width:840px;margin:0 auto}
.pm-list{display:flex;flex-direction:column;gap:1.1rem;max-width:540px;margin:0 auto}
.pm-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius,14px);padding:1.5rem 1.6rem}
.pm-row-f{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}
.pm-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.6rem}
.pm-head .pricing-price{margin:0;font-size:1.5rem}
.pm-star{color:var(--primary)}
.pm-feats{margin:.4rem 0 1.1rem}
.pr-row{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:center;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:var(--radius);padding:1.75rem 2rem;transition:box-shadow .2s}
.pr-row:hover{box-shadow:0 10px 30px rgba(0,0,0,.08)}
.pr-row-f{border-color:var(--primary);box-shadow:0 8px 28px rgba(0,0,0,.1)}
.pr-row .pricing-name{display:flex;align-items:center;gap:.75rem;font-size:1.2rem;margin-bottom:.75rem}
.pr-row-badge{background:var(--primary);color:var(--on-primary);font-size:.7rem;font-weight:700;padding:.15rem .6rem;border-radius:99px;white-space:nowrap}
.pr-row-feats{margin:0}
.pr-row-feats li{padding:.25rem 0;border:0}
.pr-row-side{text-align:center;display:flex;flex-direction:column;gap:.75rem;min-width:170px}
.pr-row-side .pricing-price{font-size:2rem}
.pr-cmp{background:var(--card-bg,var(--surface));border:1px solid var(--card-border-c,var(--border));border-radius:var(--radius);padding:1.5rem;display:flex;flex-direction:column}
.pr-cmp-f{border-color:var(--primary);box-shadow:0 8px 28px rgba(0,0,0,.1)}
.pr-cmp-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1rem;gap:.5rem}
.pr-cmp-name{font-weight:800;font-size:1.05rem;color:var(--text)}
.pr-cmp-price{font-family:var(--font-head);font-weight:900;font-size:1.5rem;color:var(--primary);white-space:nowrap}
.pr-cmp-price small{font-size:.8rem;font-weight:400;color:var(--muted)}
.pr-cmp .pricing-features{margin:0 0 1.25rem;flex:1}
.pricing-grid-dense .pricing-header{margin-bottom:2rem}
.pricing-grid-dense .pricing-grid{gap:1rem}
.pr-cmp-dense{padding:1.15rem 1.25rem;min-height:0;box-shadow:none}
.pr-cmp-dense .pr-cmp-top{margin:0;align-items:flex-start}
.pr-cmp-dense .pr-cmp-name{font-size:.96rem;line-height:1.35;max-width:70%}
.pr-cmp-dense .pr-cmp-price{font-size:1.25rem;line-height:1.2}
.pr-cmp-dense .pricing-features{margin:.8rem 0 0}
.pr-cmp-dense .pricing-features li{padding:.25rem 0;border:0;font-size:.82rem}
.pricing-grid-action{display:flex;justify-content:center;margin-top:2rem}
/* Pricing: SERVICE LIST — za duge cjenike pojedinačnih usluga/tretmana. */
.price-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(2rem,5vw,5rem);row-gap:0;border-top:1px solid var(--border)}
.price-list.price-list-dense{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(1.4rem,3vw,3rem)}
.price-list-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:start;padding:1rem 0;border-bottom:1px solid var(--border);break-inside:avoid}
.price-list-name{font-weight:750;color:var(--text);line-height:1.35}
.price-list-note{display:block;margin-top:.3rem;color:var(--muted);font-size:.84rem;line-height:1.45;font-weight:400}
.price-list-price{font-family:var(--font-head);font-weight:800;color:var(--primary);white-space:nowrap;text-align:right}
.price-list-period{display:block;font-family:var(--font-body);font-size:.72rem;font-weight:500;color:var(--muted);margin-top:.18rem}
.price-list-section .pricing-header{max-width:780px;margin-left:auto;margin-right:auto}
.price-list-action{display:flex;justify-content:center;margin-top:2rem}
@media(max-width:880px){.price-list.price-list-dense{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.price-list,.price-list.price-list-dense{grid-template-columns:1fr}.price-list-row{padding:.9rem 0}.price-list-section .pricing-header{text-align:left}.price-list-section .pricing-header .section-text{margin-left:0!important}}
@media(max-width:680px){.pr-row{grid-template-columns:1fr}.pr-row-side{min-width:0}}
/* Footer */
/* ── Katalog proizvoda ── */
.catalog-grid{gap:1.5rem}
.catalog-card{background:var(--surface,#fff);border:1px solid var(--border,rgba(0,0,0,.06));border-radius:var(--radius);overflow:hidden;transition:transform .2s,box-shadow .2s}
.catalog-list{display:flex;flex-direction:column;gap:1rem}
.catalog-list .catalog-card{display:flex;align-items:stretch}
.catalog-list .catalog-img{width:200px;flex-shrink:0;aspect-ratio:auto}
.catalog-list .catalog-img img{height:100%;object-fit:cover}
.catalog-list .catalog-info{flex:1;display:flex;flex-direction:column;justify-content:center}
.catalog-list .catalog-footer{margin-top:auto}
@media (max-width:640px){.catalog-list .catalog-card{flex-direction:column}.catalog-list .catalog-img{width:100%}}
.catalog-menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(1.6rem,3vw,3.2rem);row-gap:0;border-top:1px solid var(--border)}
.catalog-menu-item{padding:1.15rem 0;border-bottom:1px solid var(--border);min-width:0}
.catalog-menu-top{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}
.catalog-menu-title{font-family:var(--font-head);font-size:clamp(1rem,1.35vw,1.18rem);font-weight:800;line-height:1.25;color:var(--text)}
.catalog-menu-price{font-family:var(--font-head);font-weight:800;color:var(--primary);white-space:nowrap}
.catalog-menu-desc{margin:.45rem 0 0;color:var(--muted);font-size:.88rem;line-height:1.55}
.catalog-menu-meta{display:flex;align-items:center;gap:.7rem;margin-top:.6rem}
.catalog-menu-badge{font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--primary)}
.catalog-menu-action{font-size:.78rem;font-weight:800;padding:.45rem .8rem;white-space:nowrap}
@media(max-width:880px){.catalog-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.catalog-menu-grid{grid-template-columns:1fr}.catalog-menu-item{padding:1rem 0}}
/* Catalog: EDITORIAL — proizvod kao objekt, tekst kao urednički blok */
.cat-ed-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(2.2rem,5vw,5rem) clamp(1.5rem,3vw,3rem)}
.cat-ed-item{min-width:0;background:transparent;border:0;box-shadow:none}
.cat-ed-media{position:relative;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden;background:color-mix(in srgb,var(--primary) 5%,var(--surface));border-radius:min(var(--radius),5px);padding:clamp(.75rem,2vw,1.4rem)}
.cat-ed-media img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.cat-ed-item:hover .cat-ed-media img{transform:scale(1.025)}
.cat-ed-media .catalog-img-placeholder{position:absolute;inset:0;width:100%;height:100%;display:grid;place-items:center}.catalog-showcase-grid{gap:clamp(1.75rem,4vw,2.5rem)}.catalog-showcase-card{display:flex;flex-direction:column;min-width:0}.catalog-showcase-media{position:relative;aspect-ratio:1/1;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:clamp(1.2rem,2.5vw,1.8rem);display:flex;align-items:center;justify-content:center;overflow:hidden}.catalog-showcase-media img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 24px rgba(0,0,0,.10))}.catalog-showcase-media .catalog-img-placeholder{width:100%;height:100%;display:grid;place-items:center;font-size:2rem}.catalog-showcase-badge{position:absolute;left:1rem;top:1rem;z-index:2;padding:.38rem .58rem;border-radius:999px;background:var(--text);color:var(--on-text);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.catalog-showcase-body{padding-top:1.2rem;border-top:1px solid var(--border)}.catalog-showcase-title{font-family:var(--font-head);font-size:clamp(1.35rem,2.4vw,1.9rem);line-height:1.15;margin:0;color:var(--text)}.catalog-showcase-desc{margin:.85rem 0 0;color:var(--muted);line-height:1.75}.catalog-showcase-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-top:1.15rem}.catalog-showcase-price{font-family:var(--font-head);font-size:1rem;font-weight:800;color:var(--primary)}.catalog-showcase-action .btn{padding:.72rem 1.15rem}.catalog-showcase-grid.grid-fixed-1 .catalog-showcase-card,.catalog-showcase-grid.adaptive-cols-1 .catalog-showcase-card{max-width:760px;margin:0 auto}
.cat-ed-badge{position:absolute;left:.8rem;top:.8rem;font-size:.64rem;line-height:1;text-transform:uppercase;letter-spacing:.12em;font-weight:800;background:var(--secondary);color:var(--on-secondary);padding:.48rem .58rem;border-radius:2px}
.cat-ed-body{border-top:1px solid var(--border);margin-top:1rem;padding-top:1rem}
.cat-ed-kicker{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;color:var(--primary);font-size:.68rem;letter-spacing:.12em;font-weight:800;text-transform:uppercase}
.cat-ed-price{font-family:var(--font-head);font-size:1rem;letter-spacing:0;text-transform:none;color:var(--text)}
.cat-ed-body h3{font-family:var(--font-head);font-size:calc(clamp(1.2rem,1.8vw,1.55rem)*var(--type-scale));line-height:1.15;margin:.85rem 0 .55rem;color:var(--text)}
.cat-ed-body p{color:var(--muted);font-size:.9rem;line-height:1.7;margin:0;max-width:none;width:100%}
.cat-ed-action{margin-top:1.1rem}.cat-ed-action .btn{box-shadow:none;padding:.7rem 1rem;font-size:.8rem}
@media(max-width:900px){.cat-ed-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.cat-ed-grid{grid-template-columns:1fr}.cat-ed-media{aspect-ratio:4/3}}
.catalog-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,.1)}
.catalog-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--primary-l)}
.catalog-img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.catalog-card:hover .catalog-img img{transform:scale(1.05)}
.catalog-img-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:2rem;color:var(--primary)}
.catalog-badge{position:absolute;top:10px;left:10px;background:var(--primary);color:var(--on-primary);font-size:.75rem;font-weight:700;padding:.25rem .625rem;border-radius:5px}
.catalog-info{padding:1.5rem}
.catalog-title{font-weight:700;font-size:1rem;margin-bottom:.375rem;color:var(--text)}
.catalog-desc{font-size:.875rem;color:var(--muted);line-height:1.6;margin-bottom:1rem}
.catalog-footer{display:flex;align-items:center;justify-content:space-between;gap:8px}
.catalog-price{font-family:var(--font-head);font-size:1.25rem;font-weight:800;color:var(--primary)}
.catalog-btn{font-size:.8125rem;padding:.5rem 1rem}
/* Catalog: OVERLAY */
.cat-ov-grid{gap:1.5rem}
.cat-ov-card{position:relative;aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden;background:var(--secondary);cursor:pointer;box-shadow:0 10px 30px -14px rgba(0,0,0,.4)}
.cat-ov-media{position:absolute;inset:0}
.cat-ov-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cat-ov-card:hover .cat-ov-media img{transform:scale(1.07)}
.cat-ov-media .catalog-img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--primary-l)}
.cat-ov-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.45) 38%,rgba(0,0,0,0) 68%);pointer-events:none}
.cat-ov-badge{position:absolute;top:14px;left:14px;background:var(--primary);color:var(--on-primary);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:.35rem .8rem;border-radius:999px;z-index:2}
.cat-ov-body{position:absolute;left:0;right:0;bottom:0;padding:1.4rem;color:#fff;z-index:2}
.cat-ov-row{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem}
.cat-ov-name{font-family:var(--font-head);font-weight:600;font-size:1.35rem;line-height:1.15;color:#fff}
.cat-ov-price{font-weight:700;font-size:1.1rem;color:#fff;white-space:nowrap}
.cat-ov-reveal{max-height:0;opacity:0;overflow:hidden;transition:max-height .35s ease,opacity .3s ease,margin .35s ease}
.cat-ov-card:hover .cat-ov-reveal{max-height:160px;opacity:1;margin-top:.6rem}
.cat-ov-desc{font-size:.9rem;color:rgba(255,255,255,.85);margin:0 0 1rem}
.cat-ov-btn{display:inline-flex;align-items:center;gap:.4rem;background:#fff;color:var(--primary);font-weight:700;font-size:.88rem;padding:.6rem 1.2rem;border-radius:var(--btn-radius);text-decoration:none;border:none;cursor:pointer}
.cat-ov-btn:hover{background:rgba(255,255,255,.9)}
@media(hover:none){.cat-ov-reveal{max-height:160px;opacity:1;margin-top:.6rem}}

/* ── Foto galerija s lightboxom ── */
.photo-grid{gap:8px}
.photo-item{position:relative;aspect-ratio:1;overflow:hidden;border-radius:8px;cursor:zoom-in;background:var(--primary-l)}
.photo-item img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.photo-item:hover img{transform:scale(1.05)}
.photo-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff;padding:.5rem .75rem;font-size:.8125rem;opacity:0;transition:opacity .2s}
.photo-item:hover .photo-caption{opacity:1}
.gallery-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:2rem}

/* ── Tim ── */
.team-grid{gap:1.5rem}
.team-card{text-align:center;padding:1.5rem}
.team-avatar{width:142px;height:142px;border-radius:50%;overflow:hidden;margin:0 auto 1rem;border:3px solid var(--primary-l);background:var(--primary-l)}
.team-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;max-width:none;margin:0}
.team-list .team-card{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:1.25rem;text-align:left;padding:1.15rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius,14px);box-shadow:none}
.team-list .team-avatar{width:92px;height:104px;border-radius:calc(var(--radius,14px)*.8);margin:0;grid-row:1/span 3;border-width:0}
.team-list .team-role{color:var(--muted)}
.team-avatar img{width:100%;height:100%;object-fit:cover}
/* ODREZANE GLAVE.
   `object-fit:cover` bez `object-position` reže sredinu, a na fotografiji
   osobe glava je u gornjoj trećini — u širokom okviru prvo strada ona.
   Vrijedi samo za okvire u kojima je sadržaj po definiciji osoba. */
.team-avatar img,.tm-photo img,.team-feature-photo img{object-position:50% 22%}
.team-av-initial{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:2.5rem;font-weight:800;color:var(--primary)}
.team-name{font-weight:700;font-size:1rem;color:var(--text);margin-bottom:.25rem}
.team-role{font-size:.875rem;color:var(--muted)}
/* Prazna uloga ne smije zauzimati redak: kartica bez uloge pokraj kartica
   koje je imaju izgleda kao kvar, a ne kao izbor. Ista obitelj zaštite kao
   `.section-eyebrow:empty` iz v1.131.
   Regresija: tools/team_test.php → prazna-uloga-skrivena */
.team-role:empty,.tm-role:empty{display:none}
/* Team: PORTRETI */
.tm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.75rem}
.tm-card{display:flex;flex-direction:column}
.tm-photo{position:relative;aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden;background:var(--primary-l);margin-bottom:1.1rem}
.tm-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.tm-card:hover .tm-photo img{transform:scale(1.05)}
.tm-ph-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-size:2.5rem;font-weight:600;color:var(--primary)}
/* Kartica bez fotografije: umjesto portretne plohe 4/5 (u dva stupca ~600 px
   praznine s jednim slovom) — kompaktan krug, kao avatar. Izgleda kao izbor,
   a ne kao nedovršen web.
   Regresija: tools/team_test.php → kartica-bez-fotografije-kompaktna */
.tm-card.tm-no-photo .tm-photo{aspect-ratio:1;width:88px;max-width:88px;height:88px;border-radius:50%;margin-bottom:.9rem;background:var(--primary-l)}
.tm-card.tm-no-photo .tm-ph-fallback{font-size:1.6rem}
.tm-name{font-family:var(--font-head);font-weight:600;font-size:1.2rem;margin:0 0 .15rem;color:var(--text)}
.tm-role{color:var(--primary);font-size:.9rem;font-weight:600;margin:0 0 .7rem}
.tm-socials{display:flex;gap:.5rem}
.tm-soc{width:34px;height:34px;border-radius:50%;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;color:var(--muted);text-decoration:none;font-size:.85rem;font-weight:700;transition:background .2s,border-color .2s,color .2s}
.tm-soc:hover{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
@media(max-width:560px){.tm-grid{grid-template-columns:repeat(2,1fr);gap:1.25rem}}
/* Team: PROFIL U POP-UPU (v1.178.0)
   Stari web je za svakog djelatnika imao podstranicu; na jednostraničnom webu
   taj sadržaj živi u zatvorenom `<dialog>`-u — vidljiv tražilicama, skriven
   posjetitelju dok ne klikne.
   `:not([open])` je namjerno napisan tako da ga i PHP inventar boja pročita
   kao „ovo je skriveno" (selektor bez pseudo-klase ostaje `dialog.tm-modal`).
   Bez toga bi boje iz zatvorenog pop-upa ušle u dokaze o brendu — točno onaj
   kvar zbog kojeg je v1.176.0 lovila losos #d9534f iz skrivenog modala.
   Regresija: tools/team_modal_test.php → zatvoren-popup-je-skriven */
dialog.tm-modal:not([open]){display:none}
dialog.tm-modal{position:fixed;inset:0;margin:auto;width:min(680px,92vw);max-height:86vh;border:0;padding:0;border-radius:var(--radius);background:var(--bg);color:var(--text);box-shadow:0 30px 80px -20px rgba(0,0,0,.45);overflow:auto}
dialog.tm-modal::backdrop{background:rgba(0,0,0,.55)}
.tm-modal-in{padding:clamp(1.5rem,4vw,2.5rem);position:relative}
.tm-modal-x{position:absolute;top:.8rem;right:.8rem;width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;font-size:1rem;line-height:1;transition:background .2s,border-color .2s,color .2s}
.tm-modal-x:hover{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.tm-modal-head{display:flex;gap:1.1rem;align-items:center;margin-bottom:1.3rem;padding-right:2.6rem}
.tm-modal-photo{width:96px;height:96px;flex:0 0 96px;border-radius:50%;overflow:hidden;background:var(--primary-l)}
.tm-modal-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;display:block}
.tm-modal-name{font-family:var(--font-head);font-size:1.35rem;margin:0 0 .2rem;color:var(--text)}
.tm-modal-role{color:var(--primary);font-weight:600;font-size:.9rem;margin:0}
.tm-modal-body p{color:var(--muted);line-height:1.75;margin:0 0 .9rem}
.tm-modal-body p:last-child{margin-bottom:0}
.tm-more{margin:.1rem 0 .7rem;align-self:flex-start;background:transparent;border:1px solid var(--border);color:var(--primary);font-family:inherit;font-weight:600;font-size:.82rem;padding:.42rem .9rem;border-radius:var(--btn-radius);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.tm-more:hover{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.team-feature-row .tm-more{margin:.35rem 0 0}
@media(max-width:560px){.tm-modal-head{gap:.85rem}.tm-modal-photo{width:72px;height:72px;flex:0 0 72px}}

/* ── Video ── */
.video-wrap{position:relative;padding-bottom:56.25%;height:0;border-radius:var(--radius);overflow:hidden;box-shadow:0 16px 48px rgba(0,0,0,.15)}
.video-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.video-split-text .section-title,.video-split-text .section-text{text-align:left}
.video-split-media{min-width:0}
@media(max-width:760px){.team-list{grid-template-columns:1fr}.video-split{grid-template-columns:1fr}}
.video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%}
.video-placeholder{background:var(--primary-l);border-radius:var(--radius);padding:4rem;text-align:center;font-size:1.5rem;color:var(--primary)}
/* Video: COVER (poster + play) */
.video-cover{position:relative;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;cursor:pointer;background:var(--secondary);box-shadow:0 24px 60px -24px rgba(0,0,0,.5)}
.video-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.video-cover:hover img{transform:scale(1.04)}
.video-cover-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.6),rgba(0,0,0,.15) 50%,rgba(0,0,0,.35));pointer-events:none}
.video-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:84px;height:84px;border-radius:50%;background:var(--primary);color:var(--on-primary);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.8rem;padding-left:6px;box-shadow:0 10px 30px rgba(0,0,0,.4);transition:transform .2s,background .2s;z-index:2}
.video-cover:hover .video-play{transform:translate(-50%,-50%) scale(1.08);background:var(--primary-h)}
.video-play::after{content:'';position:absolute;inset:-12px;border-radius:50%;border:2px solid rgba(255,255,255,.5);animation:vcpulse 2s infinite;pointer-events:none}
@keyframes vcpulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.35);opacity:0}}
.video-cover-cap{position:absolute;left:0;right:0;bottom:0;padding:1.6rem 1.8rem;color:#fff;font-family:var(--font-head);font-weight:600;font-size:1.3rem;z-index:2;pointer-events:none}
.video-cover iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ── Logo strip ── */
.logos-section{padding:3rem 0;background:var(--surface,#f8f8ff)}
.logos-label{text-align:center;font-size:.8125rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:1.5rem}
.logos-grid{align-items:center;justify-items:center}
.logos-grid:not([class*="grid-"]){display:flex;flex-wrap:wrap;gap:2rem;justify-content:center}
.logo-item{opacity:.72;transition:opacity .25s,transform .25s;max-width:160px}
.logo-item:hover{opacity:1;transform:translateY(-3px)}
.logo-item img{width:100%;height:64px;object-fit:contain;filter:grayscale(100%);transition:filter .25s}
.logo-item:hover img{filter:none}
.logo-text{font-weight:700;font-size:1.125rem;color:var(--text)}
/* Logos: CARDS */
.logos-cards{align-items:stretch;justify-items:stretch;gap:0}.logos-cards .logo-card{box-shadow:none}
.logos-cards:not([class*="grid-"]){display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0}
.logo-card{display:flex;align-items:center;justify-content:center;min-height:116px;padding:1.5rem 1.1rem;background:transparent;border:0;border-right:1px solid var(--border);border-bottom:1px solid var(--border);border-radius:0;color:var(--muted);opacity:.72;transition:opacity .25s,background .25s,color .25s}
.logo-card:hover{opacity:1;color:var(--text);box-shadow:none;transform:none;background:color-mix(in srgb,var(--primary) 4%,transparent);border-color:var(--border)}
.logo-card img{max-width:100%;max-height:62px;object-fit:contain;filter:grayscale(100%);transition:filter .25s}
.logo-card:hover img{filter:none}
.logo-card.logo-text{font-weight:700;font-size:1.1rem}

.reviews-section{}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin-top:2.5rem}
.review-card{background:var(--surface,#fff);border:1px solid var(--border,rgba(0,0,0,.07));border-radius:var(--radius);padding:clamp(1.35rem,2.5vw,1.8rem);box-shadow:none;display:flex;flex-direction:column;gap:1rem;position:relative}.review-card::before{content:'“';position:absolute;right:1rem;top:.35rem;font-family:var(--font-head);font-size:3.4rem;line-height:1;color:color-mix(in srgb,var(--primary) 18%,transparent);pointer-events:none}
.reviews-slider{display:flex;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:1.25rem;padding-bottom:1rem;scroll-padding-left:1px}
.reviews-slider .review-card{flex:0 0 min(360px,82%);scroll-snap-align:start}
.review-header{display:flex;align-items:center;gap:.875rem}
.review-avatar{width:42px;height:42px;border-radius:50%;background:var(--primary);color:var(--on-primary);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.125rem;flex-shrink:0}
.review-name{font-weight:700;font-size:.9375rem;color:var(--text)}
.review-source{font-size:.75rem;color:var(--muted);margin-top:1px}
.review-stars{margin-left:auto;color:#f59e0b;font-size:1rem;letter-spacing:1px}
.review-text{font-size:.9375rem;color:var(--muted);line-height:1.7;font-style:italic}
.reviews-google-link{text-align:center;margin-top:2rem}

.svc-md-copy p,.svc-rich-copy p,.svc-supp-copy p{margin:0 0 .85rem;line-height:1.75}
.svc-rich-bullets{display:grid;gap:.45rem;margin:.75rem 0 1rem;padding:0}
.svc-rich-bullets li{position:relative;padding-left:1.15rem;line-height:1.65}
.svc-rich-bullets li::before{content:'•';position:absolute;left:0;color:var(--primary);font-weight:800}

/* ── FOOTER BASE ────────────────────────────────────────────── */
.site-footer{--footer-fg:var(--on-secondary);background:var(--secondary);color:color-mix(in srgb,var(--footer-fg) 68%,transparent);padding:3rem 0 0}

/* ── FOOTER: Columns ── */
.ftr-columns .footer-cols{display:grid;grid-template-columns:2fr 1fr;gap:3rem;margin-bottom:2rem}
@media(max-width:640px){.ftr-columns .footer-cols{grid-template-columns:1fr;gap:1.5rem}}
.ftr-columns .footer-col-brand{}
.ftr-columns .footer-col-title{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:color-mix(in srgb,var(--footer-fg) 52%,transparent);margin-bottom:.875rem}

/* ── FOOTER: Simple ── */
.ftr-simple .footer-simple-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;padding:.5rem 0}

/* ── FOOTER: Centered ── */
.ftr-centered{padding-top:clamp(3.25rem,6vw,5rem)}
.ftr-centered-main{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem;padding-bottom:clamp(2.4rem,5vw,4rem)}
.ftr-centered-logo{font-size:clamp(1.2rem,2vw,1.75rem)}
.ftr-centered .site-logo-img{max-width:240px}
.ftr-centered .footer-desc{max-width:62ch;margin:.15rem auto .5rem;font-size:.95rem}
.ftr-centered-contact{width:100%;padding-top:1.25rem;border-top:1px solid color-mix(in srgb,var(--footer-fg) 14%,transparent)}
.ftr-centered-contact .footer-links{flex-direction:row;justify-content:center;align-items:center;gap:.65rem 1.6rem;flex-wrap:wrap}
.ftr-centered .footer-socials{justify-content:center;margin-top:.25rem}

/* ── FOOTER: Split ── */
.ftr-split{padding-top:clamp(3rem,6vw,5rem)}
.ftr-split-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:clamp(2rem,6vw,6rem);align-items:stretch;padding-bottom:clamp(2.5rem,5vw,4rem)}
.ftr-split-brand{display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(.5rem,2vw,1.5rem) 0}
.ftr-split-logo{font-size:clamp(1.5rem,3.5vw,3.2rem);letter-spacing:-.035em;margin-bottom:1rem}
.ftr-split .site-logo-img{max-width:280px}
.ftr-split-brand .footer-desc{max-width:62ch;font-size:.95rem}
.ftr-split-panel{border:1px solid color-mix(in srgb,var(--footer-fg) 16%,transparent);background:color-mix(in srgb,var(--footer-fg) 7%,transparent);border-radius:calc(var(--radius) * 1.35);padding:clamp(1.5rem,3vw,2.25rem);display:flex;flex-direction:column;justify-content:center;min-height:210px}
.ftr-split-panel .footer-links{gap:.75rem}
.ftr-split-panel .footer-socials{margin-top:1.25rem}
.ftr-split-panel-social{min-height:0;align-items:flex-start}
@media(max-width:760px){.ftr-split-grid{grid-template-columns:1fr;gap:1.5rem}.ftr-split-panel{min-height:0}.ftr-split-logo{font-size:clamp(1.5rem,9vw,2.7rem)}}

/* ── FOOTER: Stacked ── */
.ftr-stacked{padding-top:clamp(3.25rem,6vw,5.25rem)}
.ftr-stacked-head{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr);gap:clamp(2rem,7vw,7rem);align-items:start;padding-bottom:clamp(2rem,4vw,3.25rem)}
.ftr-stacked-logo{font-size:clamp(1.5rem,3vw,2.7rem);letter-spacing:-.03em}
.ftr-stacked .site-logo-img{max-width:280px}
.ftr-stacked-copy .footer-desc{max-width:62ch;margin:0;font-size:1rem;line-height:1.75}
.ftr-stacked-rail{display:flex;align-items:center;justify-content:space-between;gap:1.25rem 2.5rem;padding:1.3rem 0;border-top:1px solid color-mix(in srgb,var(--footer-fg) 15%,transparent);border-bottom:1px solid color-mix(in srgb,var(--footer-fg) 15%,transparent)}
.ftr-stacked-contact{min-width:0;flex:1}
.ftr-stacked-contact .footer-links{flex-direction:row;align-items:center;gap:.65rem 1.6rem;flex-wrap:wrap}
.ftr-stacked .footer-socials{margin-top:0;flex-shrink:0}
@media(max-width:720px){.ftr-stacked-head{grid-template-columns:1fr;gap:1.25rem}.ftr-stacked-rail{align-items:flex-start;flex-direction:column}.ftr-stacked-contact .footer-links{flex-direction:column;align-items:flex-start;gap:.55rem}}

/* ── FOOTER: CTA — kompaktni kontaktni poziv, ne drugi Columns footer ── */
.ftr-cta{padding-top:clamp(2.5rem,5vw,4rem)}
.ftr-cta .footer-cta-panel{background:var(--primary);border-radius:calc(var(--radius) * 1.35);padding:clamp(1.5rem,3.5vw,2.4rem);display:flex;align-items:center;justify-content:space-between;gap:1.5rem 2.5rem;flex-wrap:wrap;box-shadow:0 14px 38px rgba(0,0,0,.12)}
.ftr-cta .footer-cta-title{font-size:clamp(1.2rem,2.2vw,1.65rem);font-weight:750;color:var(--on-primary)}
.ftr-cta .footer-cta-sub{font-size:.875rem;color:color-mix(in srgb,var(--on-primary) 76%,transparent);margin-top:.3rem}
.ftr-cta .footer-cta-btn{background:var(--on-primary);color:var(--primary);padding:.875rem 1.55rem;border-radius:var(--btn-radius);font-weight:700;text-decoration:none;white-space:nowrap;transition:all .2s}
.ftr-cta .footer-cta-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.2)}
.ftr-cta-rail{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(220px,.7fr) auto;gap:1.5rem 2.5rem;align-items:end;padding:clamp(2rem,4vw,3rem) 0 .75rem}
.ftr-cta-brand .footer-desc{max-width:52ch;margin-bottom:0}
.ftr-cta-contact .footer-links{gap:.55rem}
.ftr-cta .footer-socials{margin-top:0;justify-content:flex-end}
@media(max-width:820px){.ftr-cta-rail{grid-template-columns:1fr 1fr}.ftr-cta .footer-socials{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:600px){.ftr-cta .footer-cta-panel{align-items:flex-start;flex-direction:column}.ftr-cta-rail{grid-template-columns:1fr}.ftr-cta .footer-socials{grid-column:auto}}

/* ── FOOTER: Minimal ── */
.ftr-minimal{padding:0}
.ftr-minimal .footer-legalbar{margin-top:0}
.ftr-minimal .footer-minimal-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}

/* ── FOOTER: Brand ── */
.ftr-brand{padding-top:clamp(3.5rem,7vw,6rem)}
.ftr-brand-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(220px,.8fr);gap:clamp(2rem,6vw,6rem);align-items:end;padding-bottom:clamp(2.5rem,5vw,4.5rem);border-bottom:1px solid color-mix(in srgb,var(--footer-fg) 14%,transparent)}
.ftr-brand-logo{font-size:clamp(2rem,5vw,4.8rem);line-height:.95;letter-spacing:-.045em;margin-bottom:1.25rem;max-width:12ch}
.ftr-brand .site-logo-img{max-width:320px}
.ftr-brand .footer-desc{max-width:58ch;font-size:.95rem}
.ftr-brand-contact .footer-links{gap:.7rem}
@media(max-width:720px){.ftr-brand-grid{grid-template-columns:1fr;align-items:start}.ftr-brand-logo{font-size:clamp(2rem,12vw,3.5rem)}}

/* ── FOOTER SHARED ── */
.footer-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}
.footer-cols{display:grid;grid-template-columns:1fr 1fr;gap:3rem;padding-bottom:2rem;border-bottom:1px solid color-mix(in srgb,var(--footer-fg) 12%,transparent)}
.footer-col-title{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:color-mix(in srgb,var(--footer-fg) 52%,transparent);margin-bottom:.75rem}
.footer-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.4rem}
.footer-links a{color:color-mix(in srgb,var(--footer-fg) 68%,transparent);text-decoration:none;font-size:.9rem;transition:color .15s}
.footer-links a:hover{color:var(--footer-fg)}
.footer-links li{color:color-mix(in srgb,var(--footer-fg) 68%,transparent);font-size:.9rem}
.footer-desc{color:color-mix(in srgb,var(--footer-fg) 62%,transparent);font-size:.875rem;margin:.5rem 0 1rem;line-height:1.6}
.footer-socials{display:flex;gap:.5rem;margin-top:.75rem}
.footer-social{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:color-mix(in srgb,var(--footer-fg) 11%,transparent);color:color-mix(in srgb,var(--footer-fg) 76%,transparent);font-size:.75rem;font-weight:700;text-decoration:none;transition:all .15s}
.footer-social:hover{background:var(--primary);color:var(--on-primary)}
.footer-bottom{padding-top:1.5rem;font-size:.8125rem;color:color-mix(in srgb,var(--footer-fg) 52%,transparent)}
/* Univerzalna donja footer traka: copyright lijevo, pravni linkovi desno. */
.footer-legalbar{margin-top:2rem;padding:1rem 0;background:color-mix(in srgb,var(--footer-fg) 8%,transparent);font-size:.8125rem;color:color-mix(in srgb,var(--footer-fg) 70%,transparent)}
.footer-legalbar .footer-legal{margin:0 0 .65rem;line-height:1.55;opacity:.82}
.footer-legalbar-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem 2rem}
.footer-legalbar .footer-copy{font-size:.8125rem;color:inherit;line-height:1.5}
.footer-legalbar-links{display:flex;align-items:center;justify-content:flex-end;gap:.85rem 1.15rem;flex-wrap:wrap;margin-left:auto;text-align:right}
.footer-legalbar-links a{color:inherit;text-decoration:none;white-space:nowrap}
.footer-legalbar-links a:hover{text-decoration:underline;color:inherit}
.ftr-scheme-light .site-footer .footer-legalbar{background:rgba(0,0,0,.055);color:var(--muted)}
.ftr-scheme-primary .site-footer .footer-legalbar{background:rgba(0,0,0,.12);color:var(--on-primary)}
@media(max-width:700px){.footer-legalbar-inner{align-items:flex-start;flex-direction:column}.footer-legalbar-links{margin-left:0;justify-content:flex-start;text-align:left}.footer-legalbar{margin-top:1.5rem}}
.footer-legal{margin-bottom:.5rem;line-height:1.6;opacity:.85}
.price-vat-note{margin-top:1rem;font-size:.8125rem;color:var(--muted)}
.cf-consent{margin:.25rem 0 1rem}
.cf-consent label{display:flex;gap:.6rem;align-items:flex-start;font-size:.8125rem;color:var(--muted);line-height:1.55;cursor:pointer}
.cf-consent input{margin-top:.2rem;flex-shrink:0;width:16px;height:16px;accent-color:var(--primary)}
.cf-consent a{color:var(--primary-link);text-decoration:underline}
@media(max-width:640px){.footer-cols{grid-template-columns:1fr}}
.footer-logo{font-family:var(--font-head);font-weight:700;color:var(--footer-fg);font-size:1rem}
.footer-logo:empty{display:none!important}
.site-footer .footer-logo .site-logo-img.footer-logo-img{height:var(--footer-logo-height,36px)!important;width:auto;max-width:min(320px,70vw);object-fit:contain}
.footer-copy{font-size:.875rem}
/* Sakrij po uređaju */
.img-placeholder{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:.875rem;gap:8px;transition:background .2s}
.img-change-overlay{position:absolute;inset:0;background:rgba(0,0,0,.0);display:flex;align-items:center;justify-content:center;color:transparent;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s;z-index:2}
.img-change-overlay:hover{background:rgba(0,0,0,.45);color:#fff}
.hero-image[data-img-field]:hover,.about-image[data-img-field]:hover{outline:2px dashed var(--primary);outline-offset:2px}
.hero-badge{position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);background:#fff;border-radius:100px;padding:.5rem 1.25rem;box-shadow:0 8px 24px rgba(0,0,0,.12);display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:700;color:var(--text);white-space:nowrap}
.hero-badge-dot{width:8px;height:8px;border-radius:50%;background:var(--primary);flex-shrink:0}
.img-change-overlay{position:absolute;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:600;gap:6px;opacity:0;transition:opacity .2s;pointer-events:none;border-radius:inherit}
.hero-image:hover .img-change-overlay,.about-image:hover .img-change-overlay,.catalog-img:hover .img-change-overlay{opacity:1}
.hero-image[data-img-field]{cursor:pointer!important}
.hero-image[data-img-field]:hover{outline:2px dashed var(--primary);outline-offset:-2px}
/* Sakrij overlay u standalone previewu (postoji ss-preview-bar) */
body.has-preview-bar .img-change-overlay{display:none!important}
body.has-preview-bar [data-img-field]{cursor:default!important;outline:none!important}
.img-placeholder:hover{background:var(--primary-l)}
@media(max-width:768px){.hide-mobile{display:none!important}}
@media(min-width:769px){.hide-desktop{display:none!important}}
/* Scroll animacije */
.ss-animate{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.ss-animate.ss-visible{opacity:1;transform:translateY(0)}
.ss-animate:nth-child(2){transition-delay:.1s}
.ss-animate:nth-child(3){transition-delay:.2s}
/* Reversed layout */
.hero-reversed .hero-content{order:2}
.hero-reversed .hero-image{order:1}
.about-reversed .about-image{order:2}
.about-reversed .about-content{order:1}
/* Responsive */
/* Hamburger menu */
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px;margin-left:auto;color:#fff;position:relative;z-index:102}
.nav-toggle span{display:block;width:24px;height:2px;background:currentColor;border-radius:2px;transition:all .25s}
/* Hamburger mora pratiti stvarnu boju headera. Prije v1.197 crtice su bile
   hardkodirane #fff pa su nestajale na minimal/light i ručno bijelom headeru. */
.hdr-minimal .nav-toggle,.hdr-split .nav-toggle,.hdr-floating .nav-toggle{color:var(--text)}
.hdr-scheme-light .site-header .nav-toggle{color:var(--text)}
.hdr-scheme-dark .site-header .nav-toggle{color:#fff}
.hdr-scheme-primary .site-header .nav-toggle{color:var(--on-primary)}
body.hdr-custom .site-header .nav-toggle{color:var(--hdr-custom-fg)!important}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--secondary);padding:.75rem 0;box-shadow:0 8px 24px rgba(0,0,0,.2);z-index:99}
.mobile-nav.open{display:block}
.mobile-nav a{display:block;padding:.75rem 1.5rem;color:rgba(255,255,255,.85);font-size:.9375rem;font-weight:500;border-bottom:1px solid rgba(255,255,255,.07);text-decoration:none;transition:background .15s}
.mobile-nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.mobile-nav .mobile-cta{margin:.75rem 1.5rem 0;display:block;text-align:center}
/* Transparent je stvarni overlay header. Stari kasni `position:relative`
   poništavao je vlastiti `position:fixed`, a header_scheme/brand fidelity su ga
   zatim mogli pretvoriti u običnu punu traku iznad hera. Stil sada ima jasan
   ugovor: transparent = overlay na vrhu; `hdr-no-sticky` ga može svjesno
   spustiti na absolute, a `.scrolled` mu kasnije daje čvrstu pozadinu. */
.site-header.hdr-transparent{position:fixed;left:0;right:0;top:0}
@media(max-width:768px){
  .nav-toggle{display:flex}
  .hero-inner,.about-inner,.contact-inner{grid-template-columns:1fr}.contact--split .contact-header{position:static}
  .hero-image,.about-image{order:-1}
  .hero-image{aspect-ratio:4/3}
  .hero-image::before{top:12px;left:12px;right:-12px;bottom:-12px}
  .site-nav{display:none}
  .hero-full{min-height:auto}
  .hero-full-inner{padding:5.5rem 0 4rem}
  .hero-full-overlay{background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.72))}
  .hero-full .hero-text,.hero-centered .hero-text{font-size:1rem}
  .hero-centered{padding:5rem 0}
  .hero-actions{flex-wrap:wrap}
  .hero-actions .btn{flex:1 1 auto;justify-content:center}
}

/* ── Design polish ─────────────────────────────────────── */
.section-title{letter-spacing:-.03em;font-weight:800;line-height:1.1}
.btn-primary{box-shadow:0 6px 18px rgba(0,0,0,.12)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.2)}
.site-nav a:not(.btn){position:relative}
.site-nav a:not(.btn)::after{content:'';position:absolute;left:.875rem;right:.875rem;bottom:.3rem;height:2px;background:currentColor;border-radius:2px;transform:scaleX(0);transform-origin:left;opacity:0;transition:transform .25s ease,opacity .25s ease}
.site-nav a:not(.btn):hover::after,.site-nav a:not(.btn).active::after{transform:scaleX(1);opacity:.85}
.about-vcard-ic,.about-item-icon{font-size:1.5rem;font-weight:400;line-height:1}
.about-item-icon{width:44px;height:44px;border-radius:12px}
.service-card{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(0,0,0,.1)}
.about-image,.about-overlap-img,.about-story-img,.gallery-item{overflow:hidden}
.about-image img,.about-overlap-img img,.about-story-img img,.gallery-item img{transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.about-image:hover img,.about-overlap-img:hover img,.about-story-img:hover img,.gallery-item:hover img{transform:scale(1.045)}
.service-icon svg,.about-vcard-ic svg,.about-item-icon svg,.svc-row-ic svg,.svc-cmp-ic svg,.about-bn-ic svg,.contact-ic svg,.contact-icon svg,.stat-ic svg{width:1.3em;height:1.3em;display:block}
.about-ov-item .ic svg{width:1.1em;height:1.1em;display:inline-block;vertical-align:-2px}
.site-logo-mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;background:var(--primary);color:var(--on-primary);font-family:var(--font-head);font-weight:800;font-size:.95rem;letter-spacing:-.02em;flex-shrink:0}
.hdr-centered .site-logo-mark,.hdr-bold .site-logo-mark{width:38px;height:38px;font-size:1.05rem}
/* ── OBITELJI KARTICE ──────────────────────────────────────────────────────
   Mjereno u v1.130: 40 CSS klasa dijelilo je isti recept — bijela ploha,
   1px rub, zaobljenje — a tri para su bila bajt-identična. Nije postojala
   nijedna alternativa, pa su svi predlošci izgledali kao isti niz bijelih
   pravokutnika bez obzira na paletu i djelatnost.
   Kartice sada čitaju tokene umjesto doslovnih vrijednosti, a `body.cards-*`
   mijenja cijelu obitelj odjednom. Zadano (bez klase) je `surface`, dakle
   znakovno isti izlaz kao prije — postojeći projekti se ne mijenjaju.
   Regresija: tools/structure_test.php → card-families */
.ss-card,.service-card,.testimonial-card,.testi-card,.srv-card,.pricing-card,.about-vcard,.faq-item,.reference-card,.standard-card,.certificate-card,.blog-card,.review-card,.step-card,.catalog-card,.faq-modern-card,.svc-fg-card,.svc-num-card,.stats-cards .stat-item,.contact-cards .contact-item{background:var(--card-bg,var(--surface));border-color:var(--card-border-c,var(--border));box-shadow:var(--card-shadow-e,var(--card-shadow))}
body.cards-outline{--card-bg:transparent;--card-border-c:var(--border);--card-shadow-e:none}
body.cards-bare{--card-bg:transparent;--card-border-c:transparent;--card-shadow-e:none}
/* Bez plohe rub nosi cijelu podjelu, pa mora biti vidljiviji. */
body.cards-outline .service-card,body.cards-outline .pricing-card,body.cards-outline .testimonial-card,body.cards-outline .review-card,body.cards-outline .reference-card,body.cards-outline .standard-card,body.cards-outline .certificate-card,body.cards-outline .blog-card,body.cards-outline .catalog-card{border-width:1px;border-style:solid;border-color:var(--border)}
body.cards-outline .service-card:hover{box-shadow:none;border-color:var(--primary)}
/* Bez kutije: razdvaja se tipografijom i razmakom, ne plohom. */
body.cards-bare .service-card,body.cards-bare .testimonial-card,body.cards-bare .review-card,body.cards-bare .reference-card,body.cards-bare .blog-card,body.cards-bare .catalog-card,body.cards-bare .faq-modern-card{border:0;padding-left:0;padding-right:0}
body.cards-bare .service-card:hover{transform:none;box-shadow:none}
.service-icon,.about-vcard-ic,.about-item-icon{background:var(--chip-bg)}
.btn-primary,.btn-primary:hover{color:var(--on-primary)}
.cta-section .section-title{color:var(--cta-surface-fg,var(--on-primary))}
.cta-section .section-text{color:var(--cta-surface-fg,var(--on-primary));opacity:.82}
.cta-section .section-eyebrow{color:var(--cta-surface-fg,var(--on-primary));opacity:.7}
.cta-section .section-eyebrow::before{background:var(--cta-surface-fg,var(--on-primary));opacity:.5}
.cta-section .btn-primary{background:var(--cta-btn-bg);color:var(--cta-btn-fg);border-color:var(--cta-btn-bg)}
.cta-section .btn-primary:hover{background:var(--cta-btn-bg);color:var(--cta-btn-fg);opacity:.9}
.hero-stats{background:var(--secondary);color:var(--on-secondary);position:relative;overflow:hidden;padding:clamp(3rem,5vw,4.5rem) 0 clamp(3rem,6vw,6rem)}
.hdr-type-transparent .hero-stats{padding-top:clamp(1.5rem,3.5vw,3rem)}
.pricing-card{background:var(--chip-bg);border:1px solid transparent}
.pricing-card-featured{border-color:var(--primary)}
.pricing-price{color:var(--text)}
.pricing-features li{border-bottom-color:var(--border)}
.pricing-features li::before{color:var(--primary)}
.zz-list{display:flex;flex-direction:column;gap:clamp(2.5rem,6vw,5rem);margin-top:clamp(1.5rem,3vw,2.5rem)}
.zz-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.zz-row.zz-rev .zz-media{order:2}
.zz-media{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;background:var(--chip-bg);display:flex;align-items:center;justify-content:center}
.zz-media img{width:100%;height:100%;object-fit:cover;display:block}
.zz-media-ph{font-family:var(--font-head);font-weight:800;font-size:2.5rem;color:var(--primary);opacity:.5}
.zz-media-ph svg{width:64px;height:64px}
.zz-body{max-width:48ch}
.zz-num{font-family:var(--font-head);font-weight:800;color:var(--primary);font-size:.95rem;letter-spacing:.12em}
.zz-title{font-family:var(--font-head);font-size:clamp(1.5rem,3vw,2.25rem);font-weight:800;letter-spacing:-.02em;margin:.5rem 0 .75rem;line-height:1.12}
.zz-text{color:var(--muted);line-height:1.7;font-size:1.02rem}
@media(max-width:780px){.zz-row,.zz-row.zz-rev{grid-template-columns:1fr}.zz-row.zz-rev .zz-media{order:0}}
.hdr-floating{position:fixed;left:0;right:0;top:0;z-index:50;padding:1rem clamp(1rem,4vw,2rem);background:transparent}
/* Header scheme boji klasične headere, ali floating mora ostati samo PILULA preko
   hero fotografije. Inače primary/dark scheme nacrta punu traku iza pilule i izgubi
   smisao ovog templatea. */
.hdr-scheme-light .site-header.hdr-floating,.hdr-scheme-dark .site-header.hdr-floating,.hdr-scheme-primary .site-header.hdr-floating{background:transparent;box-shadow:none}
/* floating se ponaša kao overlay (kao transparent) — hero ide do vrha, bez pozadinske trake ispod pilule */
.hdr-type-floating .hero{padding-top:calc(84px + clamp(1rem,2.5vw,2.25rem))}
.hdr-type-floating .hero-full,.hdr-type-floating .hero-splitcard,.hdr-type-floating .hero-slider{padding-top:0}
.hdr-type-floating .blog-index,.hdr-type-floating .blog-detail{padding-top:calc(80px + clamp(1.5rem,4vw,3rem))}
.hdr-type-floating .hero-full{min-height:min(92vh,900px)}
.hdr-type-floating .hero-full .hero-full-inner{padding-top:clamp(7rem,10vw,9rem)}
.hdr-type-floating .hero-stats{padding-top:calc(clamp(1.5rem,3.5vw,3rem) + 92px)}
.hdr-floating-pill{width:100%;max-width:var(--container);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;background:var(--surface,#fff);border:1px solid var(--border,rgba(0,0,0,.1));border-radius:999px;padding:.55rem .65rem .55rem 1.5rem;box-shadow:0 10px 30px rgba(0,0,0,.12)}
/* Floating header ima vlastitu SVIJETLU pilulu. Body header_scheme smije bojati
   vanjski header, ali ne smije pretvoriti tekst unutar bijele pilule u bijeli.
   Ovo je završni contrast guard za kombinacije primary/dark + floating. */
.hdr-floating .hdr-floating-pill .site-logo,.hdr-floating .hdr-floating-pill .site-logo-text{color:var(--text)!important}
.hdr-floating .hdr-floating-pill .site-nav a{color:var(--hdr-fg-light)!important}
.hdr-floating .hdr-floating-pill .site-nav a:hover,.hdr-floating .hdr-floating-pill .site-nav a.active{color:var(--hdr-act-light)!important;background:var(--chip-bg)!important;opacity:1}
.hdr-floating .hdr-floating-pill .lang-switcher,.hdr-floating .hdr-floating-pill .lang-switcher a{color:var(--text)!important}
.hdr-floating .header-cta{border-radius:var(--btn-radius)}
.ftr-bigcta-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;padding:clamp(2.5rem,5vw,4rem) 0;border-bottom:1px solid rgba(255,255,255,.14);margin-bottom:clamp(2rem,4vw,3rem)}
.ftr-bigcta-title{font-family:var(--font-head);font-size:clamp(1.8rem,4vw,3rem);font-weight:800;letter-spacing:-.02em;color:var(--footer-fg);margin:0;max-width:18ch;line-height:1.05}
.ftr-bigcta-btn{flex-shrink:0}
.sec-tint{background:var(--chip-bg)}
.sec-brand-tint{background:color-mix(in srgb,var(--accent) 4%,var(--bg))}
/* U strict redesignu neutralni tint prati accent starog brenda. Time velike
   alternirajuće površine ne postaju generički hladnosive samo zato što je
   primary tamna. Intenzitet ostaje vrlo blag da brand ne oboji cijeli web. */
body.brand-fidelity-strict .sec-tint{background:color-mix(in srgb,var(--accent) 4%,var(--bg))}
body.brand-fidelity-strict .sec-brand-tint{background:color-mix(in srgb,var(--accent) 5%,var(--bg))}
/* CTA Contrast Guard: ritam/editor tint ne smije pretvoriti CTA u blijedu plohu s
   tekstom projektiranim za primary. CTA ostaje naglašena primary površina. */
.cta-section.sec-tint{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-h) 100%)}
.sec-dark{background:#171a21;--text:#ffffff;--muted:color-mix(in srgb,#ffffff 72%,transparent);--border:color-mix(in srgb,#ffffff 14%,transparent);--surface:color-mix(in srgb,#ffffff 6%,transparent);--surface-2:color-mix(in srgb,#ffffff 4%,transparent);--chip-bg:color-mix(in srgb,#ffffff 10%,transparent)}
.sec-accent{background:var(--primary);--text:var(--on-primary);--muted:color-mix(in srgb,var(--on-primary) 72%,transparent);--border:color-mix(in srgb,var(--on-primary) 18%,transparent);--surface:color-mix(in srgb,var(--on-primary) 8%,transparent);--surface-2:color-mix(in srgb,var(--on-primary) 6%,transparent);--chip-bg:color-mix(in srgb,var(--on-primary) 12%,transparent)}
.sec-dark .section-title,.sec-dark h2,.sec-dark h3,.sec-accent .section-title,.sec-accent h2,.sec-accent h3{color:var(--text)}
.sec-dark .section-text,.sec-accent .section-text{color:var(--muted)}
.sec-dark .section-eyebrow,.sec-accent .section-eyebrow{color:var(--text)}
/* Ikone na tamnoj shemi. Čip dobije prozirno bijelu pozadinu (`--chip-bg`), ali
   je glif ostajao `var(--primary)` — tamnozelen na tamnozelenom, dakle nevidljiv.
   Vidjelo se tek kad su sheme prvi put uopće počele raditi. */
.sec-dark .service-icon,.sec-accent .service-icon,.sec-image .service-icon,
.sec-dark .about-item-icon,.sec-accent .about-item-icon,.sec-image .about-item-icon,
.sec-dark .about-vcard-ic,.sec-accent .about-vcard-ic,.sec-image .about-vcard-ic,
.sec-dark .contact-icon,.sec-accent .contact-icon,.sec-image .contact-icon,
.sec-dark .contact-ic,.sec-accent .contact-ic,.sec-image .contact-ic,
.sec-dark .svc-row-ic,.sec-accent .svc-row-ic,.sec-dark .svc-cmp-ic,.sec-accent .svc-cmp-ic,
.sec-dark .about-bn-ic,.sec-accent .about-bn-ic,
.sec-dark .stat-ic,.sec-accent .stat-ic,.sec-image .stat-ic{color:var(--text)}
.sec-image{position:relative;background-size:cover;background-position:var(--ss-bg-position,center);background-attachment:var(--ss-bg-attachment,scroll);--text:#fff;--muted:rgba(255,255,255,.82)}
.sec-image::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.55);z-index:0}
.sec-image>.container,.sec-image>*{position:relative;z-index:1}
.sec-image .section-title,.sec-image h2,.sec-image h3{color:#fff}
.sec-image .section-text{color:rgba(255,255,255,.85)}
.proc-steps{display:grid;grid-template-columns:repeat(var(--proc-cols,4),1fr);gap:clamp(1.5rem,3vw,2.5rem);margin-top:clamp(2rem,4vw,3rem)}
.proc-step{text-align:center;position:relative}
.proc-step-mark{width:64px;height:64px;border-radius:50%;background:var(--chip-bg);color:var(--primary);display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:800;font-size:1.4rem;margin:0 auto 1.1rem;position:relative;z-index:2;border:2px solid var(--primary)}
.proc-step-mark svg{width:28px;height:28px}
.proc-step:not(:last-child)::after{content:"";position:absolute;top:31px;left:50%;width:100%;height:2px;background:var(--border);z-index:1}
.proc-step-title{font-family:var(--font-head);font-size:1.15rem;font-weight:700;margin:0 0 .5rem}
.proc-step-text{color:var(--muted);font-size:.95rem;line-height:1.6;margin:0}
@media(max-width:760px){.proc-steps{grid-template-columns:1fr;gap:0}.proc-step{display:grid;grid-template-columns:64px 1fr;gap:1rem 1.1rem;text-align:left;padding-bottom:1.75rem}.proc-step-mark{margin:0}.proc-step:not(:last-child)::after{top:64px;left:31px;right:auto;width:2px;height:calc(100% - 64px)}.proc-step-title{grid-column:2;margin:0 0 .4rem;align-self:center}.proc-step-text{grid-column:2}}
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(150px,1fr);gap:clamp(.75rem,1.5vw,1.25rem);margin-top:clamp(2rem,4vw,3rem)}
.bento-tile{border-radius:var(--radius);padding:clamp(1.25rem,2vw,1.75rem);background:var(--chip-bg);display:flex;flex-direction:column;justify-content:flex-end;gap:.5rem;position:relative;overflow:hidden}
.bento-ic{width:44px;height:44px;border-radius:12px;background:var(--surface);display:flex;align-items:center;justify-content:center;color:var(--primary);margin-bottom:auto}
.bento-ic svg{width:24px;height:24px}
.bento-tile h3{font-family:var(--font-head);font-size:1.15rem;font-weight:700;margin:0;letter-spacing:-.01em}
.bento-tile p{color:var(--muted);font-size:.92rem;line-height:1.55;margin:0}
.bento-tile.has-img{color:#fff}
.bento-tile.has-img::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.72));z-index:1}
.bento-tile.has-img>*{position:relative;z-index:2}
.bento-tile.has-img h3{color:#fff}
.bento-tile.has-img p{color:rgba(255,255,255,.85)}
@media(max-width:760px){.bento{grid-template-columns:1fr;grid-auto-rows:auto}.bento-tile{grid-column:auto!important;grid-row:auto!important;min-height:150px}}
.hero-stats-inner{display:flex;flex-direction:column;gap:clamp(2rem,4vw,3rem)}
.hero-stats .hero-title{color:#fff;max-width:16ch}
.hero-stats .hero-eyebrow{color:var(--primary)}
.hero-stats .hero-text{color:rgba(255,255,255,.72);max-width:52ch}
.hero-stats-row{display:grid;grid-template-columns:1.7fr 1fr;gap:clamp(1.25rem,2.5vw,2rem);align-items:stretch}
.hero-stats-solo{grid-template-columns:1fr}
.hero-stats-solo .hero-stats-img{min-height:clamp(280px,40vw,520px)}
.hero-stats-img{border-radius:var(--radius);overflow:hidden;min-height:clamp(240px,32vw,420px);background:rgba(255,255,255,.05)}
.hero-stats-img img{width:100%;height:100%;object-fit:cover;display:block}
.hero-stats-panel{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:clamp(1.5rem,2.5vw,2.25rem);display:flex;flex-direction:column;justify-content:center;gap:clamp(1rem,2vw,1.5rem)}
.hero-stat{display:flex;flex-direction:column;gap:.3rem;padding-bottom:clamp(1rem,2vw,1.4rem);border-bottom:1px solid color-mix(in srgb,var(--footer-fg) 14%,transparent)}
.hero-stat:last-child{border-bottom:0;padding-bottom:0}
.hero-stat-num{font-family:var(--font-head);font-size:clamp(1.9rem,3.2vw,2.6rem);font-weight:800;line-height:1}
.hero-stat-label{font-size:.88rem;color:rgba(255,255,255,.6)}
.hero-ring{position:absolute;top:clamp(5rem,8vw,6.5rem);right:clamp(1.5rem,5vw,4rem);width:104px;height:104px;animation:hr-spin 16s linear infinite;z-index:3}
.hero-ring svg{width:100%;height:100%}
.hero-ring-text{fill:rgba(255,255,255,.85);font-size:11px;letter-spacing:2px;font-family:var(--font-body)}
.hero-ring-dot{position:absolute;top:50%;left:50%;width:18px;height:18px;margin:-9px;border-radius:50%;background:var(--primary);box-shadow:0 0 18px 4px var(--primary)}
@keyframes hr-spin{to{transform:rotate(360deg)}}
@media(max-width:860px){.hero-stats-row{grid-template-columns:1fr}.hero-ring{display:none}}
.svc-nlist{display:flex;flex-direction:column;border-top:1px solid var(--border);margin-top:.5rem}
.svc-nrow{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(1rem,3vw,2.5rem);padding:clamp(1.1rem,2.2vw,1.7rem) .25rem;border-bottom:1px solid var(--border);transition:padding-left .25s ease}
.svc-nrow-num{font-family:var(--font-head);font-size:clamp(1rem,1.4vw,1.15rem);font-weight:700;color:var(--muted);min-width:2.5ch}
.svc-nrow-title{display:block;font-family:var(--font-head);font-size:clamp(1.35rem,2.6vw,2.1rem);font-weight:800;line-height:1.15;letter-spacing:-.02em;color:var(--text);transition:color .2s ease}
.svc-nrow-text{display:block;font-size:.95rem;color:var(--muted);margin-top:.35rem;max-width:62ch;line-height:1.6}
.svc-nrow-arrow{font-size:1.5rem;color:var(--muted);line-height:1;transition:transform .25s ease,color .2s ease}
.svc-nrow:hover{padding-left:clamp(.5rem,1.5vw,1.25rem)}
.svc-nrow:hover .svc-nrow-title,.svc-nrow:hover .svc-nrow-num,.svc-nrow:hover .svc-nrow-arrow{color:var(--primary)}
.svc-nrow:hover .svc-nrow-arrow{transform:translate(5px,-5px)}

/* ── NAPREDNE SEKCIJE (uvedene v1.52; od v1.202 dostupne svim paketima) ── */
.map-layout{display:grid;grid-template-columns:1fr 1.4fr;gap:2rem;margin-top:2.5rem;align-items:stretch}
.map-info{display:flex;flex-direction:column;gap:1rem;background:var(--surface,#fff);border:1px solid var(--border,rgba(0,0,0,.08));border-radius:var(--radius);padding:1.75rem}
.map-row{display:flex;gap:.75rem;align-items:flex-start;color:var(--text);font-size:1rem;line-height:1.5}
.map-row a{color:var(--text);text-decoration:none}
.map-row a:hover{color:var(--primary)}
.map-ico{flex:0 0 auto}
.map-btn{margin-top:.5rem;align-self:flex-start}
.map-embed{border-radius:var(--radius);overflow:hidden;min-height:340px;border:1px solid var(--border,rgba(0,0,0,.08))}
.map-embed iframe{width:100%;height:100%;min-height:340px;border:0;display:block}
.map-embed--empty{display:flex;align-items:center;justify-content:center;color:var(--muted);background:var(--surface-2,rgba(0,0,0,.03));font-size:.9rem}
@media(max-width:768px){.map-layout{grid-template-columns:1fr}}

.hours-wrap{max-width:680px}
.hours-card{margin-top:2.5rem;background:var(--surface,#fff);border:1px solid var(--border,rgba(0,0,0,.08));border-radius:var(--radius);padding:1.5rem 1.75rem;box-shadow:0 2px 14px rgba(0,0,0,.05)}
.hours-status{display:inline-block;font-size:.8125rem;font-weight:700;padding:.3rem .8rem;border-radius:999px;margin-bottom:1rem}
.hours-status.is-open{background:rgba(34,197,94,.14);color:#15803d}
.hours-status.is-closed{background:rgba(0,0,0,.07);color:var(--muted)}
.hours-row{display:flex;justify-content:space-between;gap:1rem;padding:.7rem .5rem;border-radius:8px;font-size:1rem}
.hours-row+.hours-row{border-top:1px solid var(--border,rgba(0,0,0,.06))}
.hours-day{color:var(--text);font-weight:600}
.hours-val{color:var(--muted)}
.hours-row.hours-closed .hours-val{opacity:.7}
.hours-row.hours-today{background:var(--primary-l);border-top-color:transparent}
.hours-row.hours-today .hours-day,.hours-row.hours-today .hours-val{color:var(--primary);font-weight:700}

.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-top:2.5rem}
.step-card{position:relative;background:var(--surface,#fff);border:1px solid var(--border,rgba(0,0,0,.07));border-radius:var(--radius);padding:1.75rem;display:flex;flex-direction:column;gap:.9rem;box-shadow:0 2px 10px rgba(0,0,0,.05)}
.step-num{width:46px;height:46px;border-radius:50%;background:var(--primary);color:var(--on-primary,#fff);display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-weight:800;font-size:1.25rem}
.step-title{font-family:var(--font-head);font-weight:700;font-size:1.15rem;color:var(--text)}
.step-text{color:var(--muted);font-size:.95rem;line-height:1.6}

.offer-card{display:grid;grid-template-columns:1fr 1fr;gap:0;background:var(--surface,#fff);border:1px solid var(--border,rgba(0,0,0,.08));border-radius:calc(var(--radius) * 1.3);overflow:hidden;box-shadow:0 16px 50px rgba(0,0,0,.10);margin-top:1rem}
.offer-media{position:relative;min-height:320px;background:var(--primary-l)}
.offer-media img{width:100%;height:100%;object-fit:cover;display:block}
.offer-img-ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:320px;font-size:2.5rem;color:var(--primary)}
.offer-badge{position:absolute;top:1rem;left:1rem;background:var(--primary);color:var(--on-primary,#fff);font-weight:700;font-size:.8rem;padding:.4rem .85rem;border-radius:6px}
.offer-body{padding:clamp(1.75rem,4vw,3rem);display:flex;flex-direction:column;justify-content:center;gap:1rem}
.offer-title{font-family:var(--font-head);font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;line-height:1.15;color:var(--text);margin:0}
.offer-text{color:var(--muted);line-height:1.6;margin:0}
.offer-feats{list-style:none;padding:0;margin:.25rem 0;display:flex;flex-direction:column;gap:.5rem}
.offer-feats li{position:relative;padding-left:1.6rem;color:var(--text);font-size:.95rem}
.offer-feats li::before{content:'✓';position:absolute;left:0;color:var(--primary);font-weight:800}
.offer-price{display:flex;align-items:baseline;gap:.6rem;margin-top:.25rem}
.offer-old{text-decoration:line-through;color:var(--muted);font-size:1.1rem}
.offer-now{font-family:var(--font-head);font-size:2rem;font-weight:800;color:var(--primary)}
.offer-btn{align-self:flex-start;margin-top:.5rem}
@media(max-width:768px){.offer-card{grid-template-columns:1fr}.offer-media{min-height:240px}}

/* ── DESIGN DIVERSITY (v1.118) ─────────────────────────────────────── */
/* Hero: editorial */
.hero-editorial{padding:clamp(5.5rem,10vw,9rem) 0 clamp(4rem,8vw,7rem);background:var(--bg);overflow:hidden}
.hero-editorial-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:clamp(2rem,6vw,6rem);align-items:end}
.hero-editorial-copy .hero-title{font-size:calc(clamp(3.2rem,7.2vw,6.8rem) * var(--type-scale));max-width:11ch;line-height:.94;letter-spacing:-.045em;margin-bottom:clamp(2rem,5vw,4rem)}
.hero-editorial-foot{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:end;border-top:1px solid var(--border);padding-top:1.5rem}
.hero-editorial-foot .hero-text{max-width:48ch;margin:0}
.hero-editorial-media{position:relative;min-height:clamp(420px,60vw,700px);overflow:hidden;border-radius:calc(var(--radius) * 1.1)}
.hero-editorial-media img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.hero-editorial--rev .hero-editorial-copy{order:2}.hero-editorial--rev .hero-editorial-media{order:1}
/* `no-media` je do v1.141 samo skupljao mrežu na jedan stupac, a prazan
   `.hero-editorial-media` je OSTAJAO u toku kao drugi red — s vlastitim
   `min-height:clamp(420px,60vw,700px)`. Na 1280 px to je 700 px praznine
   ispod naslova. Prijavljeno na redizajnu odvjetničkog ureda kao „header se
   razletio"; izmjereno vizualnim QA-om: rupa od 879 px.
   Ostale `no-media` varijante svoj medij skrivaju (vidi HERO/ABOUT blok);
   editorial i manifesto su bili jedini koji nisu.
   Regresija: tools/visual_test.php → bez-rupa */
.hero-editorial-grid.no-media{grid-template-columns:1fr}.hero-editorial-grid.no-media .hero-editorial-copy{max-width:1000px}
.hero-editorial-grid.no-media .hero-editorial-media{display:none}

/* Hero: framed */
.hero-framed{padding:clamp(5rem,9vw,8rem) 0;background:linear-gradient(180deg,var(--bg),var(--surface-2))}
.hero-framed-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);gap:clamp(2.5rem,6vw,6rem);align-items:center}
.hero-framed-copy .hero-title{font-size:calc(clamp(2.8rem,5.7vw,5.2rem) * var(--type-scale));max-width:12ch;letter-spacing:-.04em}
.hero-framed-shell{position:relative;padding:clamp(.75rem,1.6vw,1.2rem);border:1px solid var(--border);border-radius:calc(var(--radius) * 1.4);background:var(--surface);box-shadow:0 30px 80px rgba(0,0,0,.11)}
.hero-framed-shell::before{content:'';position:absolute;width:32%;aspect-ratio:1;right:-5%;top:-8%;background:var(--primary);opacity:.12;border-radius:50%;filter:blur(2px)}
.hero-framed-media{position:relative;aspect-ratio:4/3;border-radius:var(--radius);overflow:hidden;background:var(--surface-2)}
.hero-framed-media img{width:100%;height:100%;object-fit:cover}
.hero-framed--rev .hero-framed-copy{order:2}.hero-framed--rev .hero-framed-shell{order:1}
.hero-framed-grid.no-media{grid-template-columns:1fr;max-width:920px}.hero-framed-grid.no-media .hero-framed-shell{display:none}


/* Hero — Statement: tipografija kao glavni vizual */
.hero-statement{position:relative;background:var(--secondary);color:var(--on-secondary);padding:clamp(5.75rem,10vw,9rem) 0;overflow:hidden}
.hero-statement::before{content:'';position:absolute;inset:auto -8% -55% auto;width:min(52vw,720px);aspect-ratio:1;border-radius:50%;background:var(--primary);opacity:.12;filter:blur(1px)}
.hero-statement::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:color-mix(in srgb,var(--on-secondary) 18%,transparent)}
.hero-statement-inner{position:relative;z-index:1}
.hero-statement-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:clamp(1.8rem,4vw,3.5rem)}
.hero-statement .hero-eyebrow{color:color-mix(in srgb,var(--on-secondary) 72%,transparent);margin:0}.hero-statement .hero-eyebrow::before{background:var(--primary)}
.hero-statement-badge{border:1px solid color-mix(in srgb,var(--on-secondary) 22%,transparent);border-radius:999px;padding:.55rem .9rem;color:color-mix(in srgb,var(--on-secondary) 80%,transparent);font-size:.78rem;font-weight:700;letter-spacing:.04em}
.hero-statement .hero-title{color:var(--on-secondary);font-size:calc(clamp(3.4rem,8vw,7.7rem)*var(--type-scale));line-height:.9;letter-spacing:-.055em;max-width:12ch;margin:0 0 clamp(2rem,5vw,4.5rem)}
.hero-statement-foot{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(2rem,6vw,6rem);align-items:end;padding-top:1.4rem;border-top:1px solid color-mix(in srgb,var(--on-secondary) 18%,transparent);max-width:980px}
.hero-statement .hero-text{color:color-mix(in srgb,var(--on-secondary) 76%,transparent);margin:0;max-width:56ch}.hero-statement .hero-actions{justify-content:flex-end}
.hero-statement .btn-hero-outline{border-color:color-mix(in srgb,var(--on-secondary) 58%,transparent);color:var(--on-secondary)}

/* Hero — Side panel: fotografija do ruba viewporta */
.hero-sidepanel{background:var(--bg);overflow:hidden}
.hero-sidepanel-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);min-height:min(82vh,780px)}
.hero-sidepanel-copy{display:flex;flex-direction:column;justify-content:center;padding:clamp(4.5rem,8vw,7rem) clamp(2rem,5vw,5rem) clamp(4.5rem,8vw,7rem) max(var(--gutter),calc((100vw - var(--container))/2 + var(--gutter)))}
.hero-sidepanel-copy .hero-title{font-size:calc(clamp(2.8rem,5.8vw,5.15rem)*var(--type-scale));max-width:12ch;line-height:1.01}
.hero-sidepanel-copy .hero-text{max-width:50ch}
.hero-sidepanel-media{position:relative;min-height:100%;background:var(--surface-2);overflow:hidden}
.hero-sidepanel-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-sidepanel--rev .hero-sidepanel-copy{order:2;padding-left:clamp(2rem,5vw,5rem);padding-right:max(var(--gutter),calc((100vw - var(--container))/2 + var(--gutter)))}
.hero-sidepanel--rev .hero-sidepanel-media{order:1}

/* Services: feature grid */
.svc-fg-grid{display:grid;grid-template-columns:minmax(300px,1.05fr) minmax(0,.95fr);gap:1rem;align-items:stretch}
.svc-fg-lead{position:relative;min-height:520px;border-radius:calc(var(--radius) * 1.2);padding:clamp(2rem,4vw,3rem);overflow:hidden;background:var(--secondary);color:var(--on-secondary);display:flex;align-items:flex-end;background-size:cover;background-position:center}
.svc-fg-lead.has-img{color:#fff}.svc-fg-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.72))}
.svc-fg-lead-body{position:relative;z-index:1;max-width:34rem}.svc-fg-lead h3{font-family:var(--font-head);font-size:calc(clamp(1.8rem,3.6vw,3rem) * var(--type-scale));line-height:1.05;margin:.8rem 0;color:inherit}.svc-fg-lead p{color:rgba(255,255,255,.86);max-width:42ch}
.svc-fg-ic,.svc-fg-card-ic{width:42px;height:42px;display:flex;align-items:center;justify-content:center;color:currentColor}.svc-fg-ic svg,.svc-fg-card-ic svg{width:26px;height:26px}
.svc-fg-rest{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.svc-fg-card{border:1px solid var(--border);background:var(--surface);border-radius:var(--radius);padding:1.5rem;display:flex;flex-direction:column;justify-content:space-between;min-height:250px;transition:transform .25s,border-color .25s}.svc-fg-card:hover{transform:translateY(-4px);border-color:var(--primary)}
.svc-fg-card-top{display:flex;justify-content:space-between;align-items:flex-start;color:var(--primary)}.svc-fg-num{font-size:.78rem;letter-spacing:.12em;color:var(--muted);font-weight:800}.svc-fg-card h3{font-family:var(--font-head);font-size:1.35rem;margin:1.4rem 0 .6rem}.svc-fg-card p{color:var(--muted);font-size:.95rem;line-height:1.65}

/* Services: bands */
.svc-bands-wrap{display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);gap:clamp(2rem,7vw,7rem);align-items:start}.svc-bands-head{position:sticky;top:110px}.svc-bands-list{border-top:1px solid var(--border)}
.svc-band{display:grid;grid-template-columns:48px minmax(150px,.55fr) minmax(0,1fr) 28px;gap:1.25rem;align-items:center;padding:1.45rem 0;border-bottom:1px solid var(--border);transition:padding .2s}.svc-band:hover{padding-left:.6rem}.svc-band-num{font-size:.75rem;letter-spacing:.12em;color:var(--muted);font-weight:800}.svc-band h3{font-family:var(--font-head);font-size:1.25rem;margin:0}.svc-band p{color:var(--muted);margin:0;line-height:1.6}.svc-band-arr{font-size:1.25rem;color:var(--primary)}

/* About: manifesto */
.about-mf-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:clamp(2.5rem,7vw,7rem);align-items:end;margin-bottom:clamp(2.5rem,5vw,4rem)}.about-mf-head.no-media{grid-template-columns:1fr;max-width:1000px}.about-mf-head.no-media .about-mf-media{display:none}.about-mf-copy .section-title{font-size:calc(clamp(2.6rem,5.8vw,5.2rem) * var(--type-scale));line-height:.98;max-width:14ch;letter-spacing:-.04em}.about-mf-copy .section-text{margin-top:1.5rem;max-width:56ch}.about-mf-media{aspect-ratio:4/5;overflow:hidden;border-radius:calc(var(--radius)*1.15)}.about-mf-media img{width:100%;height:100%;object-fit:cover}.about-mf-list{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.about-mf-item{padding:1.5rem;border-right:1px solid var(--border)}.about-mf-item:last-child{border-right:0}.about-mf-item>span{font-size:.72rem;letter-spacing:.12em;color:var(--primary);font-weight:800}.about-mf-item h3{font-family:var(--font-head);font-size:1.1rem;margin:.9rem 0 .45rem}.about-mf-item p{font-size:.9rem;line-height:1.6;color:var(--muted);margin:0}

/* Gallery: editorial + strip */
.gallery-ed-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:1rem}.gallery-ed-rest{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.gallery-figure{position:relative;margin:0;overflow:hidden;border-radius:var(--radius);background:var(--surface-2)}.gallery-figure img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.16,1,.3,1)}.gallery-figure:hover img{transform:scale(1.025)}.gallery-figure figcaption{position:absolute;left:.8rem;bottom:.8rem;right:.8rem;background:rgba(15,15,15,.72);backdrop-filter:blur(8px);color:#fff;padding:.55rem .7rem;border-radius:8px;font-size:.78rem}.gallery-ed-lead{min-height:620px}.gallery-ed-small{min-height:300px}.gallery-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.gallery-strip-item{aspect-ratio:4/3}.gallery-strip-item:nth-child(3n+2){aspect-ratio:4/4.6;margin-top:clamp(1rem,3vw,3rem)}.gallery-duo{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:1rem;align-items:start}.gallery-duo-item{aspect-ratio:4/3}.gallery-duo-item:nth-child(2){margin-top:clamp(1.5rem,5vw,5rem);aspect-ratio:4/3.35}.gallery-triptych{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);grid-template-rows:repeat(2,minmax(190px,1fr));gap:1rem}.gallery-triptych-item{min-height:220px}.gallery-triptych-i0{grid-row:1/3;min-height:520px}.gallery-triptych .gallery-figure{height:100%}
/* Gallery: CONTACT SHEET — stroga, tijesna fotografska matrica */
.gallery-contactsheet{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(.35rem,.8vw,.7rem)}
.gallery-contact-item{aspect-ratio:1/1;border-radius:0;background:var(--surface-2)}
.gallery-contact-item img{width:100%;height:100%;object-fit:cover}
.gallery-contact-item figcaption{opacity:0;transform:translateY(4px);transition:opacity .2s,transform .2s;border-radius:0;font-size:.7rem}
.gallery-contact-item:hover figcaption{opacity:1;transform:none}
@media(max-width:800px){.gallery-contactsheet{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){.gallery-contactsheet{grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}}

/* CTA: card */
.cta-card-section{padding:clamp(3.5rem,7vw,6rem) 0;background:var(--surface-2)}.cta-card-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(2rem,5vw,4.5rem);align-items:center;background:var(--secondary);color:var(--on-secondary);padding:clamp(2.2rem,5vw,4.25rem);border-radius:calc(var(--radius)*1.5);position:relative;overflow:hidden}.cta-card-inner::after{content:'';position:absolute;right:-8%;top:-55%;width:360px;height:360px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 45px rgba(255,255,255,.025),0 0 0 90px rgba(255,255,255,.018)}.cta-card-copy{position:relative;z-index:1;text-align:left;max-width:760px}.cta-card-inner .section-title{color:var(--on-secondary);font-size:calc(clamp(2rem,4vw,3.4rem)*var(--type-scale));max-width:18ch;margin-left:0;margin-right:0}.cta-card-inner .section-text{color:color-mix(in srgb,var(--on-secondary) 84%,transparent);max-width:58ch;margin-left:0;margin-right:0}.cta-card-inner .section-eyebrow{color:color-mix(in srgb,var(--on-secondary) 80%,transparent)}.cta-card-inner .section-eyebrow::before{background:color-mix(in srgb,var(--on-secondary) 76%,transparent)}.cta-card-action{position:relative;z-index:1;justify-self:end}.cta-card-inner .btn-primary{background:var(--on-secondary);color:var(--secondary);border-color:var(--on-secondary);white-space:nowrap}.cta-card-section.sec-align-center .cta-card-inner,.cta-card-section.sec-align-right .cta-card-inner{grid-template-columns:1fr}.cta-card-section.sec-align-center .cta-card-copy{text-align:center;max-width:820px;margin-inline:auto}.cta-card-section.sec-align-center .cta-card-inner .section-title,.cta-card-section.sec-align-center .cta-card-inner .section-text{margin-left:auto;margin-right:auto}.cta-card-section.sec-align-center .cta-card-action{justify-self:center}.cta-card-section.sec-align-right .cta-card-copy{text-align:right;max-width:820px;margin-left:auto}.cta-card-section.sec-align-right .cta-card-inner .section-title,.cta-card-section.sec-align-right .cta-card-inner .section-text{margin-left:auto;margin-right:0}.cta-card-section.sec-align-right .cta-card-action{justify-self:end}

/* Contact: split info */
.contact-si-grid{display:grid;grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr);gap:clamp(2rem,7vw,7rem);align-items:start}.contact-si-head{position:sticky;top:110px}.contact-si-rule{display:block;width:72px;height:3px;background:var(--primary);margin-top:2rem}.contact-si-list{border-top:1px solid var(--border)}.contact-si-row{display:grid;grid-template-columns:48px minmax(0,1fr);gap:1rem;align-items:center;padding:1.35rem 0;border-bottom:1px solid var(--border)}.contact-si-ic,.contact-si-num{width:40px;height:40px;border-radius:50%;background:var(--primary-l);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:800}.contact-si-ic svg{width:18px;height:18px}.contact-si-label{display:block;color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.25rem}.contact-si-row strong{display:block;font-family:var(--font-head);font-size:1.15rem;color:var(--text);overflow-wrap:anywhere}

@media(max-width:900px){
 .hero-editorial-grid,.hero-framed-grid,.svc-fg-grid,.svc-bands-wrap,.about-mf-head,.gallery-ed-grid,.gallery-duo,.gallery-triptych,.contact-si-grid{grid-template-columns:1fr}
 .hero-statement-foot{grid-template-columns:1fr}.hero-statement .hero-actions{justify-content:flex-start}.hero-sidepanel-grid{grid-template-columns:1fr;min-height:0}.hero-sidepanel-copy,.hero-sidepanel--rev .hero-sidepanel-copy{order:1;padding:4.5rem var(--gutter)}.hero-sidepanel-media,.hero-sidepanel--rev .hero-sidepanel-media{order:2;min-height:0;aspect-ratio:16/10}
 .hero-editorial-copy .hero-title{max-width:13ch}.hero-editorial-media{min-height:480px}.hero-editorial-foot{grid-template-columns:1fr}.hero-framed-copy .hero-title{max-width:14ch}
 .svc-bands-head,.contact-si-head{position:static}.about-mf-list{grid-template-columns:1fr 1fr}.about-mf-item:nth-child(2){border-right:0}.about-mf-item:nth-child(-n+2){border-bottom:1px solid var(--border)}
 .gallery-ed-lead{min-height:500px}.gallery-duo-item:nth-child(2){margin-top:0}.gallery-triptych{grid-template-rows:auto}.gallery-triptych-i0{grid-row:auto;min-height:440px}.gallery-triptych-item{min-height:280px}.gallery-strip{grid-template-columns:repeat(2,1fr)}.cta-card-inner{grid-template-columns:1fr}.cta-card-action{justify-self:start}
}
@media(max-width:600px){
 .hero-editorial{padding-top:4.5rem}.hero-editorial-media{min-height:360px}.hero-editorial-copy .hero-title{font-size:calc(clamp(2.6rem,13vw,4.2rem)*var(--type-scale))}
 .hero-statement{padding:4.5rem 0}.hero-statement-top{align-items:flex-start}.hero-statement-badge{display:none}.hero-statement .hero-title{font-size:calc(clamp(2.7rem,15vw,4.4rem)*var(--type-scale));max-width:11ch}.hero-sidepanel-copy,.hero-sidepanel--rev .hero-sidepanel-copy{padding:3.75rem var(--gutter)}
 .hero-framed{padding:4rem 0}.hero-framed-shell{padding:.55rem}.svc-fg-rest{grid-template-columns:1fr}.svc-fg-lead{min-height:390px}.svc-band{grid-template-columns:34px 1fr 24px;gap:.75rem}.svc-band p{grid-column:2/4}.svc-band-arr{grid-column:3;grid-row:1}.about-mf-list{grid-template-columns:1fr}.about-mf-item{border-right:0!important;border-bottom:1px solid var(--border)}.about-mf-item:last-child{border-bottom:0}.gallery-ed-rest{grid-template-columns:1fr}.gallery-ed-small{min-height:240px}.gallery-duo-item,.gallery-duo-item:nth-child(2){aspect-ratio:16/10;margin-top:0}.gallery-triptych-i0,.gallery-triptych-item{min-height:0;aspect-ratio:16/10}.gallery-strip{grid-template-columns:1fr}.gallery-strip-item,.gallery-strip-item:nth-child(3n+2){aspect-ratio:16/10;margin-top:0}.cta-card-inner{padding:1.6rem}.cta-card-action,.cta-card-action .btn{width:100%}
}




/* ── paket: about/fullsplit ── */
/* ── O nama — slika do ruba ekrana ──────────────────────────────────────────
   ZAŠTO OVAJ PAKET POSTOJI
   Ugrađena `about fullsplit` varijanta je bez slike ostavljala pola sekcije
   prazno — beži blok s natpisom „Klikni za dodavanje slike". Isti problem kao
   kod `cta split`, i isto rješenje: druga strana nikad nije prazna.

   Ovdje na mjesto slike idu dvije brojke (godine, projekti). To je sadržaj koji
   na „O nama" sekciji radi posao koji bi ionako trebala raditi fotografija —
   daje povjerenje. Slika je nadogradnja, ne uvjet. */

.ss-about-fullsplit-grid {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .ss-about-fullsplit-grid { grid-template-columns: 1fr 1.1fr; }
}

/* ── Slika ──────────────────────────────────────────────────────────────── */
.ss-about-fullsplit-media {
  position: relative;
  min-height: 340px;
  overflow: hidden;
}
.ss-about-fullsplit-media :is(img, picture) {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Brojke kad slike nema ──────────────────────────────────────────────── */
.ss-about-fullsplit-figures {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--section-y) var(--gutter);
  background:
    radial-gradient(120% 120% at 0% 0%, var(--primary) 0%, transparent 62%),
    var(--secondary);
}
.ss-about-fullsplit-figures-in {
  display: grid;
  gap: var(--space-7);
  width: 100%;
  max-width: 30ch;
}
.ss-about-fullsplit-fig {
  display: grid;
  gap: var(--space-1);
}
/* Brojka je namjerno velika: ona je ovdje slika. */
.ss-about-fullsplit-fig b {
  font-family: var(--font-head);
  font-size: var(--text-4xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: #fff;
}
.ss-about-fullsplit-fig small {
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  color: rgba(255, 255, 255, .74);
}
/* Tanka crta razdvaja brojke bez dodatnog elementa u templateu. */
.ss-about-fullsplit-fig + .ss-about-fullsplit-fig {
  border-top: var(--border-thin) solid rgba(255, 255, 255, .16);
  padding-top: var(--space-7);
}

/* ── Tekstualna strana ──────────────────────────────────────────────────── */
.ss-about-fullsplit-body {
  display: flex;
  align-items: center;
  background: var(--bg);
  padding: var(--section-y) var(--gutter);
}
.ss-about-fullsplit-inner {
  width: 100%;
  max-width: 58ch;
  margin-inline: auto;
}

.ss-about-fullsplit-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: var(--primary-link);
  margin-bottom: var(--space-4);
}
.ss-about-fullsplit-eyebrow::before {
  content: '';
  width: 26px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.ss-about-fullsplit-title {
  font-family: var(--font-head);
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0 0 var(--space-4);
  text-wrap: balance;
}
.ss-about-fullsplit-lead {
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
  color: var(--muted);
  margin: 0 0 var(--space-6);
}

.ss-about-fullsplit-list {
  list-style: none;
  margin: 0 0 var(--space-6);
  padding: 0;
  display: grid;
  gap: var(--space-3);
}
.ss-about-fullsplit-li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--text);
}
.ss-about-fullsplit-tick {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  flex: 0 0 auto;
  margin-top: 1px;
  background: var(--chip-bg);
  color: var(--primary-link);
}
.ss-about-fullsplit-tick svg { width: 15px; height: 15px; }

.ss-about-fullsplit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4) var(--space-6);
  border-radius: var(--btn-radius);
  background: var(--primary);
  color: var(--on-primary);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
  transition: transform var(--transition), box-shadow var(--transition);
}
.ss-about-fullsplit-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}
.ss-about-fullsplit-btn:focus-visible {
  outline: var(--border-thick) solid var(--primary);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .ss-about-fullsplit-btn { transition: none; }
  .ss-about-fullsplit-btn:hover { transform: none; }
}
/* ── paket: cta/cover ── */
/* ── Poziv na akciju — traka preko širine ───────────────────────────────────
   ZAŠTO OVAJ PAKET POSTOJI
   Ugrađena `cta cover` varijanta je bez slike bila tamni pravokutnik sa sitnim
   tekstom u sredini i natpisom „Dodaj pozadinsku sliku" preko opisa. Većina
   korisnika sliku nikad ne doda, pa je najčešće viđeno stanje bilo i najgore.

   Ovdje je obrnuto: verzija BEZ slike je namjerno dizajnirana — slojeviti
   gradijent iz palete i dva tiha prstena — a slika je nadogradnja, ne uvjet.
   Sve boje idu kroz tokene, pa traka prati preset. */

.ss-cta-cover-band {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius);
  isolation: isolate;
  /* Osnova je uvijek tu, i sa slikom i bez nje — nikad goli pravokutnik. */
  background:
    radial-gradient(120% 140% at 8% 0%, var(--primary) 0%, transparent 58%),
    radial-gradient(90% 120% at 100% 100%, var(--primary-h) 0%, transparent 62%),
    var(--secondary);
}

/* ── Slika kao pozadina ─────────────────────────────────────────────────── */
.ss-cta-cover-media {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.ss-cta-cover-media :is(img, picture) {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Veo drži kontrast teksta bez obzira na to kakvu je fotografiju korisnik
   odabrao. `rgba(0,0,0,…)` je neutralno i radi u svakom presetu. */
.ss-cta-cover-veil {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(100deg, rgba(0, 0, 0, .82) 0%, rgba(0, 0, 0, .55) 55%, rgba(0, 0, 0, .28) 100%);
}

/* ── Dekor kad slike nema ───────────────────────────────────────────────── */
.ss-cta-cover-deco {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
.ss-cta-cover-ring {
  position: absolute;
  border-radius: 50%;
  border: var(--border-thick) solid rgba(255, 255, 255, .10);
}
.ss-cta-cover-ring--a {
  width: 460px;
  height: 460px;
  right: -120px;
  top: -180px;
}
.ss-cta-cover-ring--b {
  width: 300px;
  height: 300px;
  right: 60px;
  bottom: -160px;
  border-color: rgba(255, 255, 255, .07);
}

/* ── Sadržaj ────────────────────────────────────────────────────────────── */
.ss-cta-cover-inner {
  position: relative;
  padding: var(--space-8) 0;
  max-width: 60ch;
  margin-inline: 0;
  padding-inline: var(--gutter);
}

.ss-cta-cover-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: rgba(255, 255, 255, .72);
  margin-bottom: var(--space-4);
}
.ss-cta-cover-eyebrow::before {
  content: '';
  width: 26px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.ss-cta-cover-title {
  font-family: var(--font-head);
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: #fff;
  margin: 0 0 var(--space-4);
  text-wrap: balance;
}

.ss-cta-cover-text {
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
  color: rgba(255, 255, 255, .82);
  margin: 0 0 var(--space-6);
  max-width: 52ch;
}

/* Gumb je bijel, ne `--primary`: stoji na podlozi koja JEST primary, pa bi se
   primary gumb na njoj izgubio.

   Tekst ide kroz `--primary-link`, a ne `--primary`: to je varijanta koju je
   `Palette::ensureContrast()` već korigirala za čitljivost na svijetloj
   podlozi. Gumb je bijel, dakle svijetla podloga — `--primary` bi za žutu ili
   svijetlu paletu dao 1.6:1. */
.ss-cta-cover-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4) var(--space-6);
  border-radius: var(--btn-radius);
  background: #fff;
  color: var(--primary-link);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
  transition: transform var(--transition), box-shadow var(--transition);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .22);
}
.ss-cta-cover-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .28);
}
.ss-cta-cover-btn:focus-visible {
  outline: var(--border-thick) solid #fff;
  outline-offset: 3px;
}

.ss-cta-cover-note {
  font-size: var(--text-xs);
  color: rgba(255, 255, 255, .62);
  margin: var(--space-3) 0 0;
}

/* Na uskom ekranu traka ide preko cijele širine — okvir bi na mobitelu bio
   samo gubitak prostora. */
@media (max-width: 640px) {
  .ss-cta-cover-band { border-radius: 0; }
  .ss-cta-cover-inner { padding: var(--space-7) 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ss-cta-cover-btn { transition: none; }
  .ss-cta-cover-btn:hover { transform: none; }
}
/* ── paket: cta/split ── */
/* ── Poziv na akciju — pola slika, pola tekst ───────────────────────────────
   ZAŠTO OVAJ PAKET POSTOJI
   Ugrađena `cta split` varijanta je bez slike ostavljala POLA sekcije prazno —
   beživotni beži blok s natpisom „Dodaj sliku". Korisnik koji sliku nema (a to
   je većina) dobio je stranicu s velikom rupom.

   Ovdje druga strana nikad nije prazna: ako slike nema, na njeno mjesto ide
   panel s jamstvima (rok, cijena, obveza) — sadržaj koji na CTA sekciji ionako
   pomaže više od ukrasne fotografije. Slika je nadogradnja, ne uvjet. */

.ss-cta-split-grid {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 860px) {
  .ss-cta-split-grid { grid-template-columns: 1.05fr 1fr; }
}

/* ── Tekstualna strana ──────────────────────────────────────────────────── */
.ss-cta-split-body {
  display: flex;
  align-items: center;
  background: var(--surface);
  padding: var(--section-y) var(--gutter);
}
.ss-cta-split-inner {
  max-width: 56ch;
  margin-inline: auto;
  width: 100%;
}

.ss-cta-split-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: var(--primary-link);
  margin-bottom: var(--space-4);
}
.ss-cta-split-eyebrow::before {
  content: '';
  width: 26px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.ss-cta-split-title {
  font-family: var(--font-head);
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0 0 var(--space-4);
  text-wrap: balance;
}
.ss-cta-split-text {
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
  color: var(--muted);
  margin: 0 0 var(--space-6);
}

.ss-cta-split-actions {
  display: flex;
  align-items: center;
  gap: var(--space-5);
  flex-wrap: wrap;
}

.ss-cta-split-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4) var(--space-6);
  border-radius: var(--btn-radius);
  background: var(--primary);
  color: var(--on-primary);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
  transition: transform var(--transition), box-shadow var(--transition);
}
.ss-cta-split-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}
.ss-cta-split-btn:focus-visible {
  outline: var(--border-thick) solid var(--primary);
  outline-offset: 3px;
}

/* Telefon je link, ne ukras — na mobitelu se iz njega zove. */
.ss-cta-split-phone {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  text-decoration: none;
  color: var(--text);
}
.ss-cta-split-phone-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--chip-bg);
  color: var(--primary-link);
  flex: 0 0 auto;
}
.ss-cta-split-phone-ic svg { width: 20px; height: 20px; }
.ss-cta-split-phone-lab { display: grid; line-height: var(--leading-snug); }
.ss-cta-split-phone-lab small {
  font-size: var(--text-xs);
  color: var(--muted);
}
.ss-cta-split-phone-lab b {
  font-family: var(--font-head);
  font-size: var(--text-base);
  color: var(--text);
}
.ss-cta-split-phone:hover .ss-cta-split-phone-lab b { color: var(--primary-link); }

/* ── Slika ──────────────────────────────────────────────────────────────── */
.ss-cta-split-media {
  position: relative;
  min-height: 320px;
  overflow: hidden;
}
.ss-cta-split-media :is(img, picture) {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Panel kad slike nema ───────────────────────────────────────────────── */
.ss-cta-split-panel {
  display: flex;
  align-items: center;
  padding: var(--section-y) var(--gutter);
  background:
    radial-gradient(110% 130% at 100% 0%, var(--primary) 0%, transparent 60%),
    var(--secondary);
}
.ss-cta-split-points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-5);
  width: 100%;
  max-width: 42ch;
  margin-inline: auto;
}
.ss-cta-split-point {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
}
.ss-cta-split-point-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: rgba(255, 255, 255, .12);
  color: #fff;
}
.ss-cta-split-point-ic svg { width: 21px; height: 21px; }
.ss-cta-split-point-body { display: grid; gap: var(--space-1); }
.ss-cta-split-point-body b {
  font-family: var(--font-head);
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
  color: #fff;
}
.ss-cta-split-point-body small {
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  color: rgba(255, 255, 255, .74);
}

@media (prefers-reduced-motion: reduce) {
  .ss-cta-split-btn { transition: none; }
  .ss-cta-split-btn:hover { transform: none; }
}
/* ── paket: faq/accordion ── */
/* ── Česta pitanja — harmonika ───────────────────────────────────────────────
   Interakcija bez JavaScripta: `<details>` / `<summary>` je nativna harmonika.
   Tipkovnica radi sama (Enter/Space), čitač ekrana zna stanje, a sadržaj se vidi
   i u ispisu i kad se skripta ne učita.

   To je i razlog zašto pravilo „paket ne smije sadržavati JS" nije ograničenje:
   ono što sekcijama stvarno treba — harmonika, tabovi, otkrivanje sadržaja —
   danas se radi CSS-om i HTML-om. Uploadani JS bi završio u objavljenoj
   klijentskoj stranici koju nitko više ne pregledava.

   Sve mjere idu kroz tokene, pa sekcija posluša i preset i design mood. */

.ss-faq-accordion-wrap {
  display: grid;
  gap: var(--stack-gap);
  max-width: 820px;
}

.ss-faq-accordion-head { text-align: center; margin-inline: auto; }
.ss-faq-accordion-intro { margin-inline: auto; }

.ss-faq-accordion-list {
  display: grid;
  gap: var(--space-3);
}

.ss-faq-accordion-item {
  border: var(--border-thin) solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  overflow: hidden;
  transition: box-shadow var(--transition), border-color var(--transition);
}
.ss-faq-accordion-item:hover { border-color: var(--primary-l); }
.ss-faq-accordion-item[open] {
  box-shadow: var(--card-shadow);
  border-color: var(--primary-l);
}

/* ── Pitanje ────────────────────────────────────────────────────────────────
   `list-style:none` + `::-webkit-details-marker` skidaju nativni trokutić u
   svim preglednicima; svoj znak crtamo niže, da se može animirati. */
.ss-faq-accordion-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--card-pad);
  cursor: pointer;
  font-family: var(--font-head);
  font-size: var(--text-lg);
  font-weight: 700;
  line-height: var(--leading-snug);
  color: var(--text);
  list-style: none;
}
.ss-faq-accordion-q::-webkit-details-marker { display: none; }
.ss-faq-accordion-q:hover { color: var(--primary-link); }

/* Fokus mora biti vidljiv — `<summary>` je jedini interaktivni element ovdje. */
.ss-faq-accordion-q:focus-visible {
  outline: var(--border-thick) solid var(--primary);
  outline-offset: -2px;
}

.ss-faq-accordion-qtext { min-width: 0; }

/* Znak plus/minus iz dvije pseudo-crte — nema ikone za skinuti, nema fonta. */
.ss-faq-accordion-mark {
  position: relative;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}
.ss-faq-accordion-mark::before,
.ss-faq-accordion-mark::after {
  content: '';
  position: absolute;
  inset: 50% 0 auto 0;
  height: 2px;
  border-radius: 2px;
  background: var(--primary);
  transform: translateY(-50%);
  transition: transform var(--transition), opacity var(--transition);
}
.ss-faq-accordion-mark::after { transform: translateY(-50%) rotate(90deg); }
.ss-faq-accordion-item[open] .ss-faq-accordion-mark::after {
  transform: translateY(-50%) rotate(180deg);
  opacity: 0;
}

/* ── Odgovor ──────────────────────────────────────────────────────────────── */
.ss-faq-accordion-a {
  padding: 0 var(--card-pad) var(--card-pad);
  color: var(--muted);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
}
.ss-faq-accordion-a p { margin: 0; }

/* Otvaranje se animira samo tamo gdje `interpolate-size` postoji; gdje ne
   postoji, sadržaj se pojavi bez animacije — ispravno, samo manje elegantno. */
@supports (interpolate-size: allow-keywords) {
  .ss-faq-accordion-item::details-content {
    block-size: 0;
    overflow: hidden;
    transition: block-size var(--transition), content-visibility var(--transition);
    transition-behavior: allow-discrete;
  }
  .ss-faq-accordion-item[open]::details-content { block-size: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .ss-faq-accordion-item,
  .ss-faq-accordion-mark::before,
  .ss-faq-accordion-mark::after { transition: none; }
}
/* ── paket: showcase/bento ── */
/* ── Izlog — bento mreža ────────────────────────────────────────────────────
   Referentni paket. Sav izgled dolazi iz dizajn tokena, pa sekcija posluša
   svaki preset I svaki design mood. Nijedna boja, font, razmak ni veličina
   fonta nisu hardkodirani — to je ugovor koji `SectionCssLint` provjerava pri
   uploadu, a `tests/sectioncsslint_test.php` drži ovaj paket kao dokaz da je
   ugovor ispunjiv.

   Konvencija imenovanja: svaka klasa nosi prefiks `ss-<type>-<variant>`, ovdje
   `ss-showcase-bento`. Bez toga bi uploadana sekcija mogla preimenovati
   `.card` ili `.grid-3` i time promijeniti izgled cijele stranice.

   Složenost nosi CSS, ne jezik predložaka: asimetrična mreža, container
   queries, `:has()`. Predložak samo izbaci `.ss-showcase-bento-cell` elemente. */

.ss-showcase-bento { container-type: inline-size; }

.ss-showcase-bento-wrap {
  display: grid;
  gap: var(--stack-gap);
}

/* Naslovni blok drži mjeru čitljivosti, ne cijelu širinu. */
.ss-showcase-bento-head { max-width: 52ch; }
.ss-showcase-bento-title { margin-bottom: var(--space-3); }
.ss-showcase-bento-intro {
  color: var(--muted);
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
}
.ss-showcase-bento-cta { margin-top: var(--space-4); }

/* ── Mreža ────────────────────────────────────────────────────────────────
   Jedan stupac na mobilnom, dva od 640cqi, tri od 960cqi. Prva kartica
   zauzima dva stupca i dva reda — odatle asimetrija.

   Mjere su container query, ne media query: sekcija tako izgleda ispravno i u
   uskom stupcu editora i na cijeloj širini objavljene stranice. */
.ss-showcase-bento-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  grid-auto-rows: minmax(180px, auto);
}

@container (min-width: 640px) {
  .ss-showcase-bento-grid { grid-template-columns: repeat(2, 1fr); }
  .ss-showcase-bento-grid > .ss-showcase-bento-cell:first-child { grid-column: span 2; }
}

@container (min-width: 960px) {
  .ss-showcase-bento-grid { grid-template-columns: repeat(3, 1fr); }
  .ss-showcase-bento-grid > .ss-showcase-bento-cell:first-child {
    grid-column: span 2;
    grid-row: span 2;
  }
  /* Kad ima 5+ kartica, četvrta se razvuče da mreža ne ostane rupičasta. */
  .ss-showcase-bento-grid:has(> .ss-showcase-bento-cell:nth-child(5))
    > .ss-showcase-bento-cell:nth-child(4) { grid-column: span 2; }
}

/* ── Kartica ──────────────────────────────────────────────────────────────── */
.ss-showcase-bento-cell {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--surface);
  border: var(--border-thin) solid var(--border);
  box-shadow: var(--card-shadow);
  transition: transform var(--transition), box-shadow var(--transition);
}
.ss-showcase-bento-cell:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}

/* Kartica bez slike dobiva tintani blok, da mreža ostane ujednačena. */
.ss-showcase-bento-cell:not(:has(.ss-showcase-bento-media)) { background: var(--chip-bg); }

.ss-showcase-bento-media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 10;
}
.ss-showcase-bento-media :is(img, picture) {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Prva kartica je veća, pa nosi viši kadar i veći naslov. */
.ss-showcase-bento-cell:first-child .ss-showcase-bento-media { aspect-ratio: 4 / 3; }
.ss-showcase-bento-cell:first-child .ss-showcase-bento-ctitle { font-size: var(--text-xl); }

.ss-showcase-bento-body {
  display: grid;
  align-content: start;
  gap: var(--space-2);
  padding: var(--card-pad);
}

.ss-showcase-bento-badge {
  justify-self: start;
  background: var(--primary);
  color: var(--on-primary);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  padding: var(--space-1) var(--space-2);
  border-radius: 999px;
}

.ss-showcase-bento-icon { color: var(--primary-link); display: inline-flex; }
.ss-showcase-bento-icon svg { width: 22px; height: 22px; }

.ss-showcase-bento-ctitle {
  font-family: var(--font-head);
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
  color: var(--text);
  margin: 0;
}
.ss-showcase-bento-text {
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  margin: 0;
}

/* Redni broj kao tiha tipografska dekoracija. */
.ss-showcase-bento-num {
  position: absolute;
  right: .75rem;
  top: .6rem;
  font-family: var(--font-head);
  font-size: var(--text-xs);
  font-weight: 800;
  color: var(--muted);
  opacity: .45;
}
/* Preko fotografije broj mora biti bijel — `#fff` i `rgba(0,0,0,…)` su
   neutralni, rade u svakom presetu, i lint ih zato dopušta. */
.ss-showcase-bento-cell:has(.ss-showcase-bento-media) .ss-showcase-bento-num {
  color: #fff;
  opacity: .85;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .5);
}

@media (prefers-reduced-motion: reduce) {
  .ss-showcase-bento-cell { transition: none; }
  .ss-showcase-bento-cell:hover { transform: none; }
}


/* ── MOBILE LAYOUT GUARD (v1.113) ──────────────────────────────────────────
   Zadnja obrambena linija za core i section-pakete. Namjerno je iza
   `
/* ── paket: about/fullsplit ── */
/* ── O nama — slika do ruba ekrana ──────────────────────────────────────────
   ZAŠTO OVAJ PAKET POSTOJI
   Ugrađena `about fullsplit` varijanta je bez slike ostavljala pola sekcije
   prazno — beži blok s natpisom „Klikni za dodavanje slike". Isti problem kao
   kod `cta split`, i isto rješenje: druga strana nikad nije prazna.

   Ovdje na mjesto slike idu dvije brojke (godine, projekti). To je sadržaj koji
   na „O nama" sekciji radi posao koji bi ionako trebala raditi fotografija —
   daje povjerenje. Slika je nadogradnja, ne uvjet. */

.ss-about-fullsplit-grid {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .ss-about-fullsplit-grid { grid-template-columns: 1fr 1.1fr; }
}

/* ── Slika ──────────────────────────────────────────────────────────────── */
.ss-about-fullsplit-media {
  position: relative;
  min-height: 340px;
  overflow: hidden;
}
.ss-about-fullsplit-media :is(img, picture) {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Brojke kad slike nema ──────────────────────────────────────────────── */
.ss-about-fullsplit-figures {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--section-y) var(--gutter);
  background:
    radial-gradient(120% 120% at 0% 0%, var(--primary) 0%, transparent 62%),
    var(--secondary);
}
.ss-about-fullsplit-figures-in {
  display: grid;
  gap: var(--space-7);
  width: 100%;
  max-width: 30ch;
}
.ss-about-fullsplit-fig {
  display: grid;
  gap: var(--space-1);
}
/* Brojka je namjerno velika: ona je ovdje slika. */
.ss-about-fullsplit-fig b {
  font-family: var(--font-head);
  font-size: var(--text-4xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: #fff;
}
.ss-about-fullsplit-fig small {
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  color: rgba(255, 255, 255, .74);
}
/* Tanka crta razdvaja brojke bez dodatnog elementa u templateu. */
.ss-about-fullsplit-fig + .ss-about-fullsplit-fig {
  border-top: var(--border-thin) solid rgba(255, 255, 255, .16);
  padding-top: var(--space-7);
}

/* ── Tekstualna strana ──────────────────────────────────────────────────── */
.ss-about-fullsplit-body {
  display: flex;
  align-items: center;
  background: var(--bg);
  padding: var(--section-y) var(--gutter);
}
.ss-about-fullsplit-inner {
  width: 100%;
  max-width: 58ch;
  margin-inline: auto;
}

.ss-about-fullsplit-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: var(--primary-link);
  margin-bottom: var(--space-4);
}
.ss-about-fullsplit-eyebrow::before {
  content: '';
  width: 26px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.ss-about-fullsplit-title {
  font-family: var(--font-head);
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0 0 var(--space-4);
  text-wrap: balance;
}
.ss-about-fullsplit-lead {
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
  color: var(--muted);
  margin: 0 0 var(--space-6);
}

.ss-about-fullsplit-list {
  list-style: none;
  margin: 0 0 var(--space-6);
  padding: 0;
  display: grid;
  gap: var(--space-3);
}
.ss-about-fullsplit-li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--text);
}
.ss-about-fullsplit-tick {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  flex: 0 0 auto;
  margin-top: 1px;
  background: var(--chip-bg);
  color: var(--primary-link);
}
.ss-about-fullsplit-tick svg { width: 15px; height: 15px; }

.ss-about-fullsplit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4) var(--space-6);
  border-radius: var(--btn-radius);
  background: var(--primary);
  color: var(--on-primary);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
  transition: transform var(--transition), box-shadow var(--transition);
}
.ss-about-fullsplit-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}
.ss-about-fullsplit-btn:focus-visible {
  outline: var(--border-thick) solid var(--primary);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .ss-about-fullsplit-btn { transition: none; }
  .ss-about-fullsplit-btn:hover { transform: none; }
}
/* ── paket: cta/cover ── */
/* ── Poziv na akciju — traka preko širine ───────────────────────────────────
   ZAŠTO OVAJ PAKET POSTOJI
   Ugrađena `cta cover` varijanta je bez slike bila tamni pravokutnik sa sitnim
   tekstom u sredini i natpisom „Dodaj pozadinsku sliku" preko opisa. Većina
   korisnika sliku nikad ne doda, pa je najčešće viđeno stanje bilo i najgore.

   Ovdje je obrnuto: verzija BEZ slike je namjerno dizajnirana — slojeviti
   gradijent iz palete i dva tiha prstena — a slika je nadogradnja, ne uvjet.
   Sve boje idu kroz tokene, pa traka prati preset. */

.ss-cta-cover-band {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius);
  isolation: isolate;
  /* Osnova je uvijek tu, i sa slikom i bez nje — nikad goli pravokutnik. */
  background:
    radial-gradient(120% 140% at 8% 0%, var(--primary) 0%, transparent 58%),
    radial-gradient(90% 120% at 100% 100%, var(--primary-h) 0%, transparent 62%),
    var(--secondary);
}

/* ── Slika kao pozadina ─────────────────────────────────────────────────── */
.ss-cta-cover-media {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.ss-cta-cover-media :is(img, picture) {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Veo drži kontrast teksta bez obzira na to kakvu je fotografiju korisnik
   odabrao. `rgba(0,0,0,…)` je neutralno i radi u svakom presetu. */
.ss-cta-cover-veil {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(100deg, rgba(0, 0, 0, .82) 0%, rgba(0, 0, 0, .55) 55%, rgba(0, 0, 0, .28) 100%);
}

/* ── Dekor kad slike nema ───────────────────────────────────────────────── */
.ss-cta-cover-deco {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
.ss-cta-cover-ring {
  position: absolute;
  border-radius: 50%;
  border: var(--border-thick) solid rgba(255, 255, 255, .10);
}
.ss-cta-cover-ring--a {
  width: 460px;
  height: 460px;
  right: -120px;
  top: -180px;
}
.ss-cta-cover-ring--b {
  width: 300px;
  height: 300px;
  right: 60px;
  bottom: -160px;
  border-color: rgba(255, 255, 255, .07);
}

/* ── Sadržaj ────────────────────────────────────────────────────────────── */
.ss-cta-cover-inner {
  position: relative;
  padding: var(--space-8) 0;
  max-width: 60ch;
  margin-inline: 0;
  padding-inline: var(--gutter);
}

.ss-cta-cover-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: rgba(255, 255, 255, .72);
  margin-bottom: var(--space-4);
}
.ss-cta-cover-eyebrow::before {
  content: '';
  width: 26px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.ss-cta-cover-title {
  font-family: var(--font-head);
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: #fff;
  margin: 0 0 var(--space-4);
  text-wrap: balance;
}

.ss-cta-cover-text {
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
  color: rgba(255, 255, 255, .82);
  margin: 0 0 var(--space-6);
  max-width: 52ch;
}

/* Gumb je bijel, ne `--primary`: stoji na podlozi koja JEST primary, pa bi se
   primary gumb na njoj izgubio.

   Tekst ide kroz `--primary-link`, a ne `--primary`: to je varijanta koju je
   `Palette::ensureContrast()` već korigirala za čitljivost na svijetloj
   podlozi. Gumb je bijel, dakle svijetla podloga — `--primary` bi za žutu ili
   svijetlu paletu dao 1.6:1. */
.ss-cta-cover-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4) var(--space-6);
  border-radius: var(--btn-radius);
  background: #fff;
  color: var(--primary-link);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
  transition: transform var(--transition), box-shadow var(--transition);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .22);
}
.ss-cta-cover-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, .28);
}
.ss-cta-cover-btn:focus-visible {
  outline: var(--border-thick) solid #fff;
  outline-offset: 3px;
}

.ss-cta-cover-note {
  font-size: var(--text-xs);
  color: rgba(255, 255, 255, .62);
  margin: var(--space-3) 0 0;
}

/* Na uskom ekranu traka ide preko cijele širine — okvir bi na mobitelu bio
   samo gubitak prostora. */
@media (max-width: 640px) {
  .ss-cta-cover-band { border-radius: 0; }
  .ss-cta-cover-inner { padding: var(--space-7) 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ss-cta-cover-btn { transition: none; }
  .ss-cta-cover-btn:hover { transform: none; }
}
/* ── paket: cta/split ── */
/* ── Poziv na akciju — pola slika, pola tekst ───────────────────────────────
   ZAŠTO OVAJ PAKET POSTOJI
   Ugrađena `cta split` varijanta je bez slike ostavljala POLA sekcije prazno —
   beživotni beži blok s natpisom „Dodaj sliku". Korisnik koji sliku nema (a to
   je većina) dobio je stranicu s velikom rupom.

   Ovdje druga strana nikad nije prazna: ako slike nema, na njeno mjesto ide
   panel s jamstvima (rok, cijena, obveza) — sadržaj koji na CTA sekciji ionako
   pomaže više od ukrasne fotografije. Slika je nadogradnja, ne uvjet. */

.ss-cta-split-grid {
  display: grid;
  grid-template-columns: 1fr;
}

@media (min-width: 860px) {
  .ss-cta-split-grid { grid-template-columns: 1.05fr 1fr; }
}

/* ── Tekstualna strana ──────────────────────────────────────────────────── */
.ss-cta-split-body {
  display: flex;
  align-items: center;
  background: var(--surface);
  padding: var(--section-y) var(--gutter);
}
.ss-cta-split-inner {
  max-width: 56ch;
  margin-inline: auto;
  width: 100%;
}

.ss-cta-split-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  color: var(--primary-link);
  margin-bottom: var(--space-4);
}
.ss-cta-split-eyebrow::before {
  content: '';
  width: 26px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.ss-cta-split-title {
  font-family: var(--font-head);
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0 0 var(--space-4);
  text-wrap: balance;
}
.ss-cta-split-text {
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
  color: var(--muted);
  margin: 0 0 var(--space-6);
}

.ss-cta-split-actions {
  display: flex;
  align-items: center;
  gap: var(--space-5);
  flex-wrap: wrap;
}

.ss-cta-split-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4) var(--space-6);
  border-radius: var(--btn-radius);
  background: var(--primary);
  color: var(--on-primary);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 700;
  text-decoration: none;
  transition: transform var(--transition), box-shadow var(--transition);
}
.ss-cta-split-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}
.ss-cta-split-btn:focus-visible {
  outline: var(--border-thick) solid var(--primary);
  outline-offset: 3px;
}

/* Telefon je link, ne ukras — na mobitelu se iz njega zove. */
.ss-cta-split-phone {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  text-decoration: none;
  color: var(--text);
}
.ss-cta-split-phone-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--chip-bg);
  color: var(--primary-link);
  flex: 0 0 auto;
}
.ss-cta-split-phone-ic svg { width: 20px; height: 20px; }
.ss-cta-split-phone-lab { display: grid; line-height: var(--leading-snug); }
.ss-cta-split-phone-lab small {
  font-size: var(--text-xs);
  color: var(--muted);
}
.ss-cta-split-phone-lab b {
  font-family: var(--font-head);
  font-size: var(--text-base);
  color: var(--text);
}
.ss-cta-split-phone:hover .ss-cta-split-phone-lab b { color: var(--primary-link); }

/* ── Slika ──────────────────────────────────────────────────────────────── */
.ss-cta-split-media {
  position: relative;
  min-height: 320px;
  overflow: hidden;
}
.ss-cta-split-media :is(img, picture) {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ── Panel kad slike nema ───────────────────────────────────────────────── */
.ss-cta-split-panel {
  display: flex;
  align-items: center;
  padding: var(--section-y) var(--gutter);
  background:
    radial-gradient(110% 130% at 100% 0%, var(--primary) 0%, transparent 60%),
    var(--secondary);
}
.ss-cta-split-points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-5);
  width: 100%;
  max-width: 42ch;
  margin-inline: auto;
}
.ss-cta-split-point {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
}
.ss-cta-split-point-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: rgba(255, 255, 255, .12);
  color: #fff;
}
.ss-cta-split-point-ic svg { width: 21px; height: 21px; }
.ss-cta-split-point-body { display: grid; gap: var(--space-1); }
.ss-cta-split-point-body b {
  font-family: var(--font-head);
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
  color: #fff;
}
.ss-cta-split-point-body small {
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  color: rgba(255, 255, 255, .74);
}

@media (prefers-reduced-motion: reduce) {
  .ss-cta-split-btn { transition: none; }
  .ss-cta-split-btn:hover { transform: none; }
}
/* ── paket: faq/accordion ── */
/* ── Česta pitanja — harmonika ───────────────────────────────────────────────
   Interakcija bez JavaScripta: `<details>` / `<summary>` je nativna harmonika.
   Tipkovnica radi sama (Enter/Space), čitač ekrana zna stanje, a sadržaj se vidi
   i u ispisu i kad se skripta ne učita.

   To je i razlog zašto pravilo „paket ne smije sadržavati JS" nije ograničenje:
   ono što sekcijama stvarno treba — harmonika, tabovi, otkrivanje sadržaja —
   danas se radi CSS-om i HTML-om. Uploadani JS bi završio u objavljenoj
   klijentskoj stranici koju nitko više ne pregledava.

   Sve mjere idu kroz tokene, pa sekcija posluša i preset i design mood. */

.ss-faq-accordion-wrap {
  display: grid;
  gap: var(--stack-gap);
  max-width: 820px;
}

.ss-faq-accordion-head { text-align: center; margin-inline: auto; }
.ss-faq-accordion-intro { margin-inline: auto; }

.ss-faq-accordion-list {
  display: grid;
  gap: var(--space-3);
}

.ss-faq-accordion-item {
  border: var(--border-thin) solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  overflow: hidden;
  transition: box-shadow var(--transition), border-color var(--transition);
}
.ss-faq-accordion-item:hover { border-color: var(--primary-l); }
.ss-faq-accordion-item[open] {
  box-shadow: var(--card-shadow);
  border-color: var(--primary-l);
}

/* ── Pitanje ────────────────────────────────────────────────────────────────
   `list-style:none` + `::-webkit-details-marker` skidaju nativni trokutić u
   svim preglednicima; svoj znak crtamo niže, da se može animirati. */
.ss-faq-accordion-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--card-pad);
  cursor: pointer;
  font-family: var(--font-head);
  font-size: var(--text-lg);
  font-weight: 700;
  line-height: var(--leading-snug);
  color: var(--text);
  list-style: none;
}
.ss-faq-accordion-q::-webkit-details-marker { display: none; }
.ss-faq-accordion-q:hover { color: var(--primary-link); }

/* Fokus mora biti vidljiv — `<summary>` je jedini interaktivni element ovdje. */
.ss-faq-accordion-q:focus-visible {
  outline: var(--border-thick) solid var(--primary);
  outline-offset: -2px;
}

.ss-faq-accordion-qtext { min-width: 0; }

/* Znak plus/minus iz dvije pseudo-crte — nema ikone za skinuti, nema fonta. */
.ss-faq-accordion-mark {
  position: relative;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
}
.ss-faq-accordion-mark::before,
.ss-faq-accordion-mark::after {
  content: '';
  position: absolute;
  inset: 50% 0 auto 0;
  height: 2px;
  border-radius: 2px;
  background: var(--primary);
  transform: translateY(-50%);
  transition: transform var(--transition), opacity var(--transition);
}
.ss-faq-accordion-mark::after { transform: translateY(-50%) rotate(90deg); }
.ss-faq-accordion-item[open] .ss-faq-accordion-mark::after {
  transform: translateY(-50%) rotate(180deg);
  opacity: 0;
}

/* ── Odgovor ──────────────────────────────────────────────────────────────── */
.ss-faq-accordion-a {
  padding: 0 var(--card-pad) var(--card-pad);
  color: var(--muted);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
}
.ss-faq-accordion-a p { margin: 0; }

/* Otvaranje se animira samo tamo gdje `interpolate-size` postoji; gdje ne
   postoji, sadržaj se pojavi bez animacije — ispravno, samo manje elegantno. */
@supports (interpolate-size: allow-keywords) {
  .ss-faq-accordion-item::details-content {
    block-size: 0;
    overflow: hidden;
    transition: block-size var(--transition), content-visibility var(--transition);
    transition-behavior: allow-discrete;
  }
  .ss-faq-accordion-item[open]::details-content { block-size: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .ss-faq-accordion-item,
  .ss-faq-accordion-mark::before,
  .ss-faq-accordion-mark::after { transition: none; }
}
/* ── paket: showcase/bento ── */
/* ── Izlog — bento mreža ────────────────────────────────────────────────────
   Referentni paket. Sav izgled dolazi iz dizajn tokena, pa sekcija posluša
   svaki preset I svaki design mood. Nijedna boja, font, razmak ni veličina
   fonta nisu hardkodirani — to je ugovor koji `SectionCssLint` provjerava pri
   uploadu, a `tests/sectioncsslint_test.php` drži ovaj paket kao dokaz da je
   ugovor ispunjiv.

   Konvencija imenovanja: svaka klasa nosi prefiks `ss-<type>-<variant>`, ovdje
   `ss-showcase-bento`. Bez toga bi uploadana sekcija mogla preimenovati
   `.card` ili `.grid-3` i time promijeniti izgled cijele stranice.

   Složenost nosi CSS, ne jezik predložaka: asimetrična mreža, container
   queries, `:has()`. Predložak samo izbaci `.ss-showcase-bento-cell` elemente. */

.ss-showcase-bento { container-type: inline-size; }

.ss-showcase-bento-wrap {
  display: grid;
  gap: var(--stack-gap);
}

/* Naslovni blok drži mjeru čitljivosti, ne cijelu širinu. */
.ss-showcase-bento-head { max-width: 52ch; }
.ss-showcase-bento-title { margin-bottom: var(--space-3); }
.ss-showcase-bento-intro {
  color: var(--muted);
  font-size: var(--text-lg);
  line-height: var(--leading-normal);
}
.ss-showcase-bento-cta { margin-top: var(--space-4); }

/* ── Mreža ────────────────────────────────────────────────────────────────
   Jedan stupac na mobilnom, dva od 640cqi, tri od 960cqi. Prva kartica
   zauzima dva stupca i dva reda — odatle asimetrija.

   Mjere su container query, ne media query: sekcija tako izgleda ispravno i u
   uskom stupcu editora i na cijeloj širini objavljene stranice. */
.ss-showcase-bento-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  grid-auto-rows: minmax(180px, auto);
}

@container (min-width: 640px) {
  .ss-showcase-bento-grid { grid-template-columns: repeat(2, 1fr); }
  .ss-showcase-bento-grid > .ss-showcase-bento-cell:first-child { grid-column: span 2; }
}

@container (min-width: 960px) {
  .ss-showcase-bento-grid { grid-template-columns: repeat(3, 1fr); }
  .ss-showcase-bento-grid > .ss-showcase-bento-cell:first-child {
    grid-column: span 2;
    grid-row: span 2;
  }
  /* Kad ima 5+ kartica, četvrta se razvuče da mreža ne ostane rupičasta. */
  .ss-showcase-bento-grid:has(> .ss-showcase-bento-cell:nth-child(5))
    > .ss-showcase-bento-cell:nth-child(4) { grid-column: span 2; }
}

/* ── Kartica ──────────────────────────────────────────────────────────────── */
.ss-showcase-bento-cell {
  position: relative;
  display: grid;
  grid-template-rows: auto 1fr;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--surface);
  border: var(--border-thin) solid var(--border);
  box-shadow: var(--card-shadow);
  transition: transform var(--transition), box-shadow var(--transition);
}
.ss-showcase-bento-cell:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}

/* Kartica bez slike dobiva tintani blok, da mreža ostane ujednačena. */
.ss-showcase-bento-cell:not(:has(.ss-showcase-bento-media)) { background: var(--chip-bg); }

.ss-showcase-bento-media {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 10;
}
.ss-showcase-bento-media :is(img, picture) {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Prva kartica je veća, pa nosi viši kadar i veći naslov. */
.ss-showcase-bento-cell:first-child .ss-showcase-bento-media { aspect-ratio: 4 / 3; }
.ss-showcase-bento-cell:first-child .ss-showcase-bento-ctitle { font-size: var(--text-xl); }

.ss-showcase-bento-body {
  display: grid;
  align-content: start;
  gap: var(--space-2);
  padding: var(--card-pad);
}

.ss-showcase-bento-badge {
  justify-self: start;
  background: var(--primary);
  color: var(--on-primary);
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  padding: var(--space-1) var(--space-2);
  border-radius: 999px;
}

.ss-showcase-bento-icon { color: var(--primary-link); display: inline-flex; }
.ss-showcase-bento-icon svg { width: 22px; height: 22px; }

.ss-showcase-bento-ctitle {
  font-family: var(--font-head);
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
  color: var(--text);
  margin: 0;
}
.ss-showcase-bento-text {
  color: var(--muted);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  margin: 0;
}

/* Redni broj kao tiha tipografska dekoracija. */
.ss-showcase-bento-num {
  position: absolute;
  right: .75rem;
  top: .6rem;
  font-family: var(--font-head);
  font-size: var(--text-xs);
  font-weight: 800;
  color: var(--muted);
  opacity: .45;
}
/* Preko fotografije broj mora biti bijel — `#fff` i `rgba(0,0,0,…)` su
   neutralni, rade u svakom presetu, i lint ih zato dopušta. */
.ss-showcase-bento-cell:has(.ss-showcase-bento-media) .ss-showcase-bento-num {
  color: #fff;
  opacity: .85;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .5);
}

@media (prefers-reduced-motion: reduce) {
  .ss-showcase-bento-cell { transition: none; }
  .ss-showcase-bento-cell:hover { transform: none; }
}
` kako paket s desktop fiksnim širinama ne bi mogao razbiti
   360–430 px viewport. Ne mijenja desktop. */
html,body{max-width:100%;overflow-x:clip}
@supports not (overflow:clip){body{overflow-x:hidden}}
img,picture,video,canvas,iframe,svg{max-width:100%}
.container,.section,.hero,.stats,.cta-section,main,header,footer{min-width:0}
.container>*{min-width:0}
.hero-inner>*,.about-inner>*,.contact-inner>*,.map-layout>*,.cta-split-grid>*,.hero-stats-row>*,
.svc-split>*,.svc-nrow>*,.svc-row>*,.proc-step>*,.offer-card>*,.footer-cols>*{min-width:0}
.hero-title,.section-title,.section-text,.hero-text,.contact-value,.map-row,.footer-desc,.footer-links,
.svc-nrow-title,.svc-nrow-text,.svc-row-c,.svc-card-title,.svc-card-text,.proc-step-title,.proc-step-text,
.cta-section,.cta-section a,.contact-item a,.map-row a{overflow-wrap:anywhere;word-break:normal}

@media(max-width:768px){
  :root{--gutter:1rem}
  body{--section-y:clamp(3rem,10vw,4.25rem);--stack-gap:var(--space-5)}
  .container{padding-left:1rem;padding-right:1rem}
  body.brand-fidelity-strict .site-logo-img{height:min(var(--site-logo-height,50px),50px);max-width:260px}
  body.brand-fidelity-strict .header-inner{height:72px}
  .section,.hero,.stats,.cta-section,.site-footer{max-width:100%;overflow-x:clip}

  /* Tipografija ne smije sama stvoriti horizontalni scroll. */
  .hero-title,.hero-inner .hero-title,.hero-full .hero-title,.hero-centered .hero-title,
  .hero-slider .hero-title,.hero-stats .hero-title{font-size:calc(clamp(2rem,10vw,3rem) * var(--type-scale));line-height:1.06}
  .section-title{font-size:calc(clamp(1.75rem,8vw,2.5rem) * var(--type-scale));line-height:1.1}
  .hero-text,.section-text{font-size:1rem;line-height:1.65}

  /* Gumbi: dugi CTA više ne širi viewport. */
  .btn,.hero-actions .btn,.cta-section .btn,.map-btn,.offer-btn{max-width:100%;white-space:normal;text-align:center;line-height:1.25}
  .hero-actions{width:100%;gap:.75rem}
  .hero-actions .btn{flex:1 1 100%;width:100%}

  /* Split hero / about dekoracije su prije izlazile 12–20px iz containera. */
  .hero-inner{gap:2rem;padding:3.25rem 0}
  .hdr-type-transparent .hero-inner,.hdr-type-floating .hero-inner{padding-top:1.5rem}
  .hero-image::before{top:8px;left:8px;right:0;bottom:-8px}
  .about-ed-media::before{top:8px;left:8px;right:0;bottom:-8px}
  .hero-badge{max-width:calc(100% - 1rem);white-space:normal;text-align:center;padding:.45rem .85rem}
  .hero-full-inner{padding:4.75rem 0 3.25rem}
  .hero-centered{padding:4rem 0}
  .hero-splitcard-inner{padding:3rem 0}
  .hero-splitcard-card{padding:1.5rem}
  .hero-stats-img{min-height:220px}

  /* Numbered services — ključni overflow s OPG testa. */
  .svc-nrow{grid-template-columns:2rem minmax(0,1fr) 1.25rem;gap:.65rem;padding:1rem 0}
  .svc-nrow-num{min-width:0;font-size:.9rem}
  .svc-nrow-title{font-size:1.15rem;line-height:1.18}
  .svc-nrow-text{font-size:.9rem;line-height:1.55;max-width:100%}
  .svc-nrow-arrow{font-size:1.1rem;justify-self:end}
  .svc-nrow:hover{padding-left:0}
  .svc-list{grid-template-columns:1fr;column-gap:0}
  .svc-row{grid-template-columns:44px minmax(0,1fr);gap:.85rem;padding:1.25rem 0}
  .svc-row-ic{width:44px;height:44px;font-size:1.15rem}
  .svc-split-grid,.steps-grid{grid-template-columns:1fr}

  /* Proces: manji marker i minmax(0,1fr) sprečavaju bijeg teksta. */
  .proc-step{grid-template-columns:48px minmax(0,1fr);gap:.75rem .9rem;padding-bottom:1.4rem}
  .proc-step-mark{width:48px;height:48px;font-size:1.05rem}
  .proc-step:not(:last-child)::after{top:48px;left:23px;height:calc(100% - 48px)}
  .proc-step-title,.proc-step-text{grid-column:2;min-width:0}

  /* Galerija na mobitelu mora izgledati namjerno, ne kao desktop kolaž stisnut u 360px. */
  .gallery-grid{grid-template-columns:1fr;gap:.75rem}
  .gallery-grid .gallery-item{aspect-ratio:16/10}
  .gallery-mosaic{grid-template-columns:1fr;grid-auto-rows:auto;gap:.75rem}
  .gallery-mosaic .gallery-item,.gallery-mosaic .gallery-item:first-child{grid-column:auto;grid-row:auto;aspect-ratio:16/10;height:auto}
  .gallery-masonry{columns:1;column-gap:0}
  .gallery-slider .gallery-item{flex:0 0 min(84vw,320px)}

  /* Kontakt i karta često nose najduže neprekinute vrijednosti (email/URL/adresa). */
  .map-layout{gap:1rem;margin-top:1.5rem}
  .map-info{padding:1.25rem;min-width:0}
  .map-row{min-width:0;font-size:.95rem}
  .map-row>*:not(.map-ico){min-width:0;max-width:100%}
  .map-row a,.contact-value,.contact-value a,.footer-links a,.footer-desc{overflow-wrap:anywhere;word-break:break-word}
  .map-btn{align-self:stretch;width:100%}
  .map-embed,.map-embed iframe{min-height:260px}
  .contact-row{gap:1.25rem;margin-top:1.5rem}
  .contact-row .contact-item,.contact-cards .contact-item{min-width:0;max-width:100%}
  .contact-boxed{padding:1.35rem}

  /* CTA i offer kartice na uskim ekranima. */
  .cta-banner .cta-banner-text{min-width:0;width:100%}
  .cta-banner .cta-banner-action{width:100%}
  .cta-banner .cta-banner-action .btn{width:100%}
  .cta-box,.cta-spotlight-box{width:100%;max-width:100%;padding:1.5rem}
  .cta-split-content{padding:1.5rem}
  .cta-st-actions{gap:.8rem}
  .cta-st-phone{max-width:100%;min-width:0}
  .cta-st-phone .lab{min-width:0}
  .cta-st-phone .lab b{overflow-wrap:anywhere}
  .offer-body{padding:1.4rem}

  /* Tablični/parni redovi. */
  .hours-card{padding:1.15rem}
  .hours-row{flex-wrap:wrap;gap:.3rem .75rem;padding:.65rem .25rem}
  .hours-val{margin-left:auto;text-align:right;overflow-wrap:anywhere}

  /* Footer i floating elementi. */
  .footer-inner,.footer-minimal-inner{align-items:flex-start}
  .footer-cols{gap:1.25rem}
  .footer-copy{overflow-wrap:anywhere}
}

/* Ručno/AI odabrana shema sekcije je završni surface override. Layout smije
   oblikovati unutarnje kartice, ali ne smije potajno pregaziti boju cijele sekcije. */
section.sec-light{background:var(--bg)!important}
section.sec-tint{background:var(--chip-bg)!important}
section.sec-brand-tint{background:color-mix(in srgb,var(--accent) 4%,var(--bg))!important}
section.sec-dark{background:#171a21!important}
section.sec-accent{background:var(--primary)!important}

@media(max-width:420px){
  .container{padding-left:.9rem;padding-right:.9rem}
  .hero-title,.hero-inner .hero-title,.hero-full .hero-title,.hero-centered .hero-title,
  .hero-slider .hero-title,.hero-stats .hero-title{font-size:calc(clamp(1.85rem,9.5vw,2.45rem) * var(--type-scale))}
  .section-title{font-size:calc(clamp(1.6rem,7.8vw,2.15rem) * var(--type-scale))}
  .gallery-slider .gallery-item{flex-basis:88vw}
}
@media(max-width:820px){
 .hero-slider--split .hslide{background-size:100% 55%;background-position:var(--ss-bg-position,center top)}.hero-slider--split .hslide-ovl{background:linear-gradient(0deg,var(--surface) 0 48%,rgba(255,255,255,.82) 62%,rgba(255,255,255,.08) 100%)}.hero-slider--split .hslide-inner{min-height:760px;align-items:flex-end}.hero-slider--split .hslide-c{max-width:100%}
 .cf-layout-split .cf-wrap,.cf-layout-aside .cf-wrap,.cf-layout-band .cf-wrap,.faq-numbered-layout,.hours-section--split .hours-wrap,.hours-section--brief .hours-wrap,.steps-section--split .container,.team-feature-grid{grid-template-columns:1fr}.cf-layout-split .cf-head,.cf-layout-aside .cf-head,.faq-numbered-head,.hours-section--split .section-header,.steps-section--split .section-header{position:static}.cf-layout-band .cf-wrap{padding:clamp(1.35rem,5vw,2.2rem)}.faq-modern-cards{grid-template-columns:1fr}.gallery-showcase{grid-template-columns:1fr 1fr;grid-template-rows:auto}.gallery-showcase-i0{grid-column:1/3;grid-row:auto}.gallery-showcase-i3{grid-column:auto}.gallery-showcase-item{min-height:260px}.reviews-spotlight{grid-template-columns:1fr}.reviews-spotlight .review-card:first-child{grid-row:auto}.reviews-wall{columns:1}.hours-section--compact .section-header{grid-template-columns:1fr}.hours-section--compact .hours-list{grid-template-columns:1fr 1fr}.hours-section--brief .section-header{text-align:center}.hours-section--brief .section-header .section-text{margin-left:auto;margin-right:auto}.hours-section--brief .hours-list{grid-template-columns:repeat(2,minmax(0,1fr))}.offer-section--poster .offer-card,.offer-section--banner .offer-card{grid-template-columns:1fr}.offer-section--banner .offer-body{display:flex}.offer-section--banner .offer-price,.offer-section--banner .offer-btn{grid-column:auto;grid-row:auto}.team-editorial-head{grid-template-columns:1fr;gap:1rem}.team-feature-photo{min-height:420px}
}
@media(max-width:540px){.gallery-showcase{grid-template-columns:1fr}.gallery-showcase-i0{grid-column:auto}.gallery-fullbleed{grid-template-columns:repeat(5,82vw);padding-left:1rem;padding-right:1rem}.hours-section--compact .hours-list,.hours-section--brief .hours-list{grid-template-columns:1fr}.stats-band .stats-grid{grid-template-columns:1fr 1fr}.stats-band .stat-item:nth-child(2n){border-right:0}.team-feature-photo{min-height:340px}}

/* v1.207 — section polish + navigation variety */
/* Transparent header is in document flow: hero must not reserve a second phantom header. */
.hdr-type-transparent .hero,.has-topbar.hdr-type-transparent .hero{padding-top:0}
/* CTA banner uses secondary/dark surface; never inherit on-primary from orange/light primary. */
.cta-section.cta-banner .section-title,.cta-section.cta-banner .section-text,.cta-section.cta-banner .section-eyebrow{color:#fff!important}.cta-section.cta-banner .section-text{opacity:.76}
/* Navigation families — same header structure, genuinely different interaction language. */
.site-nav a:not(.btn)::after{display:none}
body.nav-style-clean .site-header .site-nav a:not(.btn){border-radius:0;background:transparent!important;padding-left:.6rem;padding-right:.6rem;opacity:.78;transition:opacity .2s,transform .2s}
body.nav-style-clean .site-header .site-nav a:not(.btn):hover,body.nav-style-clean .site-header .site-nav a:not(.btn).active{opacity:1;transform:translateY(-1px);background:transparent!important}
body.nav-style-underline .site-header .site-nav a:not(.btn){position:relative;border-radius:0;background:transparent!important}
body.nav-style-underline .site-header .site-nav a:not(.btn)::after{display:block;content:'';position:absolute;left:.875rem;right:.875rem;bottom:.25rem;height:2px;background:currentColor;transform:scaleX(0);transform-origin:left;opacity:0;transition:transform .25s,opacity .25s}
body.nav-style-underline .site-header .site-nav a:not(.btn):hover::after,body.nav-style-underline .site-header .site-nav a:not(.btn).active::after{transform:scaleX(1);opacity:.9}
body.nav-style-pill .site-header .site-nav a:not(.btn){border-radius:999px;padding:.55rem .95rem;background:transparent!important}
body.nav-style-pill .site-header .site-nav a:not(.btn):hover,body.nav-style-pill .site-header .site-nav a:not(.btn).active{background:color-mix(in srgb,currentColor 10%,transparent)!important}
body.nav-style-frame .site-header .site-nav a:not(.btn){border:1px solid transparent;border-radius:4px;background:transparent!important;padding:.5rem .85rem}
body.nav-style-frame .site-header .site-nav a:not(.btn):hover,body.nav-style-frame .site-header .site-nav a:not(.btn).active{border-color:color-mix(in srgb,currentColor 40%,transparent);background:transparent!important}
body.nav-style-marker .site-header .site-nav a:not(.btn){position:relative;border-radius:0;background:transparent!important;padding:.5rem .65rem}
body.nav-style-marker .site-header .site-nav a:not(.btn)::after{display:block;content:'';position:absolute;width:5px;height:5px;border-radius:50%;background:currentColor;left:50%;bottom:.05rem;transform:translateX(-50%) scale(0);opacity:0;transition:.2s}
body.nav-style-marker .site-header .site-nav a:not(.btn):hover::after,body.nav-style-marker .site-header .site-nav a:not(.btn).active::after{transform:translateX(-50%) scale(1);opacity:1}
/* Expandable services: align detail copy with service title and give long content real measure. */
.svc-rich-list{max-width:none}.svc-rich-item summary{grid-template-columns:3rem minmax(0,1fr) auto;padding:1.55rem 0}.svc-rich-body{gap:clamp(1.5rem,4vw,3.5rem);padding:0 0 2rem 4rem}.svc-rich-body.no-media{display:block}.svc-rich-body.no-media .svc-rich-copy-wrap{width:min(100%,960px)}.svc-rich-body.has-media{grid-template-columns:minmax(240px,.72fr) minmax(0,1.55fr)}.svc-rich-copy{max-width:90ch;line-height:1.8}.svc-rich-copy-wrap{min-width:0}
/* About cards need interior breathing room even in editorial/bare families. */
.about-vcard{padding:1.45rem 1.35rem 1.5rem}
/* Gallery 2: deterministic masonry grid; no column-flow blank half page. */
.gallery-masonry{display:grid;columns:auto;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(170px,18vw,270px);gap:1rem}.gallery-masonry .gallery-item{margin:0;height:100%;break-inside:auto}.gallery-masonry .gallery-item img{height:100%;object-fit:cover}.gallery-masonry .gallery-item:nth-child(4n+1){grid-row:span 2}.gallery-masonry.gallery-count-2 .gallery-item{grid-row:span 1}.gallery-masonry.gallery-count-3 .gallery-item:first-child{grid-row:span 2}
/* Gallery 4: controlled mosaic; four images no longer leave an accidental empty quadrant. */
.gallery-mosaic{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:clamp(150px,16vw,240px);gap:1rem}.gallery-mosaic .gallery-item{grid-column:auto;grid-row:auto;height:100%}.gallery-mosaic .gallery-item img{width:100%;height:100%;object-fit:cover}.gallery-mosaic .gallery-item:first-child{grid-column:span 2;grid-row:span 2}.gallery-mosaic.gallery-count-4 .gallery-item:last-child{grid-column:1/-1;aspect-ratio:3/1;max-height:300px}
/* CTA cover radius is governed only by the shared --radius token. Sharp means truly sharp. */
.cta-cover{border-radius:var(--radius)!important}
body.radius-sharp .cta-cover{border-radius:0!important}
/* Modern map/location icon treatment. */
.map-ico{width:2.15rem;height:2.15rem;display:grid;place-items:center;border-radius:50%;background:var(--chip-bg);color:var(--primary)}.map-ico svg{width:1rem;height:1rem;stroke-width:1.8}.map-row{align-items:center}
/* Hours — three new modern families. */
.hours-section--schedule .hours-card{background:transparent;border:0;box-shadow:none;padding:0}.hours-section--schedule .hours-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.hours-section--schedule .hours-row{display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;padding:1.35rem;border-right:1px solid var(--border);border-radius:0}.hours-section--schedule .hours-day{font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.hours-section--schedule .hours-val{font-family:var(--font-head);font-size:1.15rem}
.hours-section--editorial .hours-wrap{display:grid;grid-template-columns:minmax(240px,.72fr) minmax(0,1.28fr);gap:clamp(2rem,7vw,7rem);align-items:start}.hours-section--editorial .section-header{position:sticky;top:110px;text-align:left}.hours-section--editorial .hours-card{margin:0;background:transparent;border:0;border-top:1px solid var(--border);border-radius:0;padding:0;box-shadow:none}.hours-section--editorial .hours-row{padding:1.05rem 0;border-bottom:1px solid var(--border);border-radius:0}
.hours-section--panel .hours-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.8fr);gap:clamp(2rem,6vw,5rem);align-items:center}.hours-section--panel .section-header{text-align:left}.hours-section--panel .hours-card{margin:0;background:var(--secondary);color:var(--on-secondary);border:0;padding:clamp(1.5rem,3vw,2.5rem);box-shadow:0 22px 55px rgba(0,0,0,.16)}.hours-section--panel .hours-row{border-bottom:1px solid color-mix(in srgb,var(--on-secondary) 15%,transparent);border-radius:0;padding:.85rem 0}.hours-section--panel .hours-status{background:color-mix(in srgb,var(--on-secondary) 10%,transparent)!important;color:var(--on-secondary)!important}
/* Partner/logo families. */
.logos-head{margin-bottom:2rem}.logos-strip{display:flex;align-items:center;justify-content:space-between;gap:clamp(1.25rem,4vw,4rem);padding:1.4rem 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);overflow:auto}.logos-strip .logo-item{flex:0 0 auto;min-width:120px;max-width:180px;filter:grayscale(1);opacity:.62;transition:.2s}.logos-strip .logo-item:hover{filter:none;opacity:1}.logos-strip img{max-height:52px;width:auto;object-fit:contain}
.logos-spotlight{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;background:var(--border);border:1px solid var(--border)}.logos-spotlight .logo-item{min-height:150px;background:var(--surface);display:grid;place-items:center;padding:2rem;transition:background .2s,transform .2s}.logos-spotlight .logo-item:hover{background:var(--chip-bg);transform:translateY(-2px)}.logos-spotlight img{max-height:64px;max-width:80%;object-fit:contain}
.logos-mono{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;border-top:1px solid var(--border)}.logos-mono .logo-item{min-height:120px;display:grid;place-items:center;padding:1.5rem;border-bottom:1px solid var(--border);filter:grayscale(1);opacity:.7}.logos-mono img{max-height:48px;max-width:78%;object-fit:contain}
/* Stats with photography. */
.stats-photo{background:var(--bg);color:var(--text);padding:clamp(4rem,8vw,8rem) 0}.stats-photo-shell{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2rem,6vw,6rem);align-items:stretch}.stats-photo-media{min-height:520px;overflow:hidden;border-radius:var(--radius);background:var(--surface-2)}.stats-photo-media img{width:100%;height:100%;object-fit:cover}.stats-photo-content{display:flex;flex-direction:column;justify-content:center}.stats-photo .stats-header{text-align:left;margin:0 0 2rem}.stats-photo .stats-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--border)}.stats-photo .stat-item{padding:1.5rem 1.2rem 1.5rem 0;border-bottom:1px solid var(--border);border-right:1px solid var(--border)}.stats-photo .stat-item:nth-child(2n){border-right:0;padding-left:1.2rem}.stats-photo .stat-value{color:var(--text)}.stats-photo--overlay .stats-photo-shell{position:relative;display:block;min-height:620px}.stats-photo--overlay .stats-photo-media{position:absolute;inset:0;border-radius:var(--radius)}.stats-photo--overlay .stats-photo-media::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,15,20,.82),rgba(8,15,20,.2))}.stats-photo--overlay .stats-photo-content{position:relative;z-index:2;color:#fff;min-height:620px;width:min(620px,70%);padding:clamp(2rem,5vw,5rem)}.stats-photo--overlay .section-title,.stats-photo--overlay .section-text,.stats-photo--overlay .stat-value,.stats-photo--overlay .stat-label{color:#fff}.stats-photo--overlay .stats-grid{border-color:rgba(255,255,255,.25)}.stats-photo--overlay .stat-item{border-color:rgba(255,255,255,.2)}
/* Hero slider: pravi 50/50 fixed-copy layout. Copy i media su dva odvojena
   panela; samo slike u desnom panelu ulaze u slideshow. */
.hero-slider--fixedsplit{position:relative;background:var(--bg);color:var(--text);overflow:hidden}
.hero-slider--fixedsplit .hsfs-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:min(82vh,860px)}
.hero-slider--fixedsplit .hsfs-copy{display:flex;align-items:center;min-width:0;background:var(--bg)}
.hero-slider--fixedsplit .hsfs-copy-inner{width:100%;max-width:720px;padding:clamp(3.5rem,7vw,7rem) clamp(2rem,5vw,5.5rem) clamp(3.5rem,7vw,7rem) max(24px,calc((100vw - var(--container))/2))}
.hero-slider--fixedsplit .hslide-eyebrow{color:var(--primary);margin-bottom:1.1rem}
.hero-slider--fixedsplit .hero-title{color:var(--text);font-size:calc(clamp(3rem,6vw,6.2rem) * var(--type-scale));line-height:.98;max-width:10ch;text-shadow:none;margin:0 0 1.25rem}
.hero-slider--fixedsplit .hero-text{color:var(--muted);font-size:1.1rem;line-height:1.75;max-width:40rem;margin:0 0 2rem}
.hero-slider--fixedsplit .hero-text :is(p,ul,ol){margin:.75rem 0}.hero-slider--fixedsplit .hero-text :is(ul,ol){padding-left:1.25rem}
.hero-slider--fixedsplit .hsfs-media{position:relative;min-width:0;overflow:hidden;background:var(--surface-2)}
.hero-slider--fixedsplit .hsfs-slide{position:absolute;inset:0;opacity:0;transition:opacity .75s ease;pointer-events:none}
.hero-slider--fixedsplit .hsfs-slide.is-active{opacity:1;pointer-events:auto;z-index:1}
.hero-slider--fixedsplit .hsfs-slide img{width:100%;height:100%;object-fit:cover;display:block}
.hero-slider--fixedsplit .hsfs-placeholder{width:100%;height:100%;min-height:520px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;color:var(--muted);font-size:2rem;background:var(--surface-2)}
.hero-slider--fixedsplit .hsfs-placeholder span{font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.hero-slider--fixedsplit .hsfs-media .hslide-arrow{z-index:4}.hero-slider--fixedsplit .hsfs-media .hslide-dots{z-index:4;left:0;right:0;justify-content:center}
.hero-slider--fixedsplit .hsfs-media .hslide-dot{background:rgba(255,255,255,.55);box-shadow:0 1px 5px rgba(0,0,0,.16)}.hero-slider--fixedsplit .hsfs-media .hslide-dot.is-active{background:#fff}
.hero-slider--fixedsplit.hero-slider--reverse .hsfs-copy{order:2}.hero-slider--fixedsplit.hero-slider--reverse .hsfs-media{order:1}
.hero-slider--fixedsplit.hero-slider--reverse .hsfs-copy-inner{padding-left:clamp(2rem,5vw,5.5rem);padding-right:max(24px,calc((100vw - var(--container))/2))}
@media(max-width:900px){.hero-slider--fixedsplit .hsfs-shell{grid-template-columns:1fr;min-height:0}.hero-slider--fixedsplit .hsfs-copy,.hero-slider--fixedsplit.hero-slider--reverse .hsfs-copy{order:1}.hero-slider--fixedsplit .hsfs-media,.hero-slider--fixedsplit.hero-slider--reverse .hsfs-media{order:2;min-height:clamp(360px,65vw,620px)}.hero-slider--fixedsplit .hsfs-copy-inner,.hero-slider--fixedsplit.hero-slider--reverse .hsfs-copy-inner{max-width:none;padding:clamp(3rem,10vw,5rem) max(20px,5vw)}.hero-slider--fixedsplit .hero-title{font-size:calc(clamp(2.7rem,11vw,4.8rem) * var(--type-scale));max-width:12ch}}
/* Slider families */
.hero-slider--imagecycle .hslide-c--ghost{visibility:hidden}.hero-slider--imagecycle .hslide-ovl{background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.1))}
.hero-slider--copycycle .hslide-ovl{background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.18))}.hero-slider--copycycle .hslide-c{max-width:720px}
.hero-slider--horizontal{overflow:hidden}.hero-slider--horizontal .hslider-track{display:flex;min-height:min(82vh,860px);transition:transform .75s cubic-bezier(.16,1,.3,1);will-change:transform}.hero-slider--horizontal .hslide{position:relative!important;inset:auto!important;flex:0 0 100%;width:100%;min-height:min(82vh,860px);opacity:1!important;pointer-events:auto!important}.hero-slider--horizontal .hslide-c{transform:none!important;opacity:1!important}
@media(max-width:820px){.svc-rich-body,.svc-rich-body.has-media{grid-template-columns:1fr;padding-left:0}.svc-rich-item summary{grid-template-columns:2.2rem minmax(0,1fr) auto}.gallery-masonry{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.gallery-mosaic{grid-template-columns:1fr 1fr;grid-auto-rows:180px}.gallery-mosaic .gallery-item:first-child{grid-column:1/-1;grid-row:span 2}.gallery-mosaic.gallery-count-4 .gallery-item:last-child{grid-column:1/-1;aspect-ratio:2/1}.hours-section--editorial .hours-wrap,.hours-section--panel .hours-wrap,.stats-photo-shell{grid-template-columns:1fr}.hours-section--editorial .section-header{position:static}.stats-photo-media{min-height:360px}.stats-photo--overlay .stats-photo-content{width:100%}.logos-strip{justify-content:flex-start}}
@media(max-width:540px){.gallery-masonry,.gallery-mosaic{grid-template-columns:1fr;grid-auto-rows:auto}.gallery-masonry .gallery-item,.gallery-masonry .gallery-item:nth-child(4n+1),.gallery-mosaic .gallery-item,.gallery-mosaic .gallery-item:first-child,.gallery-mosaic.gallery-count-4 .gallery-item:last-child{grid-column:auto;grid-row:auto;aspect-ratio:4/3;max-height:none}.stats-photo .stats-grid{grid-template-columns:1fr}.stats-photo .stat-item,.stats-photo .stat-item:nth-child(2n){border-right:0;padding-left:0}.team-avatar{width:124px;height:124px}}