/* Stomatoloska ordinacija Arsenovic — vlastiti stil.
 *
 * Ucitava se POSLJEDNJI, poslije sekcijskih stilova i brend.css.
 * Ne dira raspored: nigdje ne pise display, grid-template-*, position,
 * inset, align-*, justify-* ni text-align na klasama sekcija.
 * Mijenja samo boju, pismo, razmak, zaobljenje, sjenku i kadar slike.
 *
 * Paleta je iz plakata same ordinacije (zlatna, slonovaca, topla crna);
 * cetiri vrijednosti stoje u sekcije/tokens.css.
 */

/* ============================================================
   1. TEMELJ
   ============================================================ */

:root {
  /* Visina zaglavlja pod DRUGIM imenom — sekcijski --header-h se ne
     smije vezati sam na sebe, to je ciklus koji tiho padne u auto. */
  --head-h: 74px;

  --ar-ink:        #191410;
  --ar-ink-soft:   #2c241c;
  --ar-text:       #33291f;
  --ar-muted:      #6b5f51;
  --ar-canvas:     #fbf8f3;
  --ar-canvas-alt: #f4eee4;
  --ar-surface:    #ffffff;
  --ar-cream:      #f4ecdd;
  --ar-gold:       #ac8a4e;
  --ar-gold-dk:    #7f612f;
  --ar-gold-lt:    #d9c295;
  --ar-on-dark:    #f7f1e6;
  --ar-on-dark-mu: rgba(247, 241, 230, 0.76);
  --ar-line:       rgba(25, 20, 16, 0.13);
  --ar-line-2:     rgba(25, 20, 16, 0.26);
  --ar-line-dark:  rgba(247, 241, 230, 0.22);
  --ar-wa:         #0e7a6d;
  --ar-wa-dk:      #0a6055;
}

@media (max-width: 900px) { :root { --head-h: 62px; } }

html {
  /* Kotva ne smije zavrsiti ispod ljepljive trake. */
  scroll-padding-top: calc(var(--head-h) + 16px);
  background: var(--ar-canvas);
}

body {
  margin: 0;
  background: var(--ar-canvas);
  color: var(--ar-text);
  font-family: 'Inter Variable', Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* clip klipuje a NE pravi scroll kontejner — sticky ostaje ziv. */
  overflow-x: clip;
}

img, video { max-width: 100%; }

/* ============================================================
   2. JEDNO PISMO NA CIJELOM SAJTU
   Nunito za naslove, Inter za tekst — svaka sekcija nosi svoje
   varijable, pa se one samo preusmjere na isto mjesto.
   ============================================================ */

.sec-aperta-header,
.sec-atelier-hero,
.sec-anker-services,
.sec-anker-referenzen,
.sec-atelier-parallax,
.sec-aperta-about,
.sec-bloom-results,
.sec-fundament-instagram,
.sec-anker-faq,
.sec-anker-cta,
.sec-anker-footer {
  --ff-display: 'Nunito Variable', Nunito, ui-rounded, 'Segoe UI', system-ui, sans-serif;
  --ff-body: 'Inter Variable', Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-family: var(--ff-body);
}

/* ============================================================
   3. JEDNA PALETA NA CIJELOM SAJTU
   Neutrali koje brend.css ne vezuje (spisak je u TOKENI.md)
   prevezuju se ovdje, za sve sekcije odjednom.
   ============================================================ */

.sec-aperta-header,
.sec-atelier-hero,
.sec-anker-services,
.sec-anker-referenzen,
.sec-atelier-parallax,
.sec-aperta-about,
.sec-bloom-results,
.sec-fundament-instagram,
.sec-anker-faq,
.sec-anker-cta,
.sec-anker-footer {
  --c-bg:          var(--ar-canvas);
  --c-bg-alt:      var(--ar-canvas-alt);
  --c-white:       var(--ar-surface);
  --c-surface:     var(--ar-cream);
  --c-surface-warm: var(--ar-cream);
  --c-ink:         var(--ar-ink);
  --c-ink-soft:    var(--ar-ink-soft);
  --c-ink-70:      rgba(25, 20, 16, 0.70);
  --c-ink-12:      rgba(25, 20, 16, 0.12);
  --c-ink-06:      rgba(25, 20, 16, 0.06);
  --c-text:        var(--ar-text);
  --c-text-muted:  var(--ar-muted);
  --c-text-invert: var(--ar-on-dark);
  --c-on-dark:     var(--ar-on-dark);
  --c-on-dark-mu:  var(--ar-on-dark-mu);
  --c-line:        var(--ar-line);
  --c-line-strong: var(--ar-line-2);
  --c-line-dark:   var(--ar-line-dark);
  --c-line-invert: var(--ar-line-dark);
  --c-star:        var(--ar-gold);
  --c-whatsapp:    var(--ar-wa);
  --c-whatsapp-dk: var(--ar-wa-dk);

  /* brend.css ne vezuje --c-accent svugdje (hero i parallax dobiju
     samo --c-gold), pa se veze i ovdje — inace var() padne na unset. */
  --c-accent:      var(--ar-gold);
  --c-accent-dk:   var(--ar-gold-dk);
  --c-accent-lt:   var(--ar-gold-lt);
  --c-accent-soft: var(--ar-cream);
  --c-accent-tint: var(--ar-cream);
  --c-gold:        var(--ar-gold);
  --c-gold-dk:     var(--ar-gold-dk);
  --c-gold-soft:   var(--ar-cream);
  --c-primary:     var(--ar-ink);
  --c-primary-dk:  #0f0c09;
  --c-primary-lt:  #6f6357;
  --c-primary-08:  rgba(25, 20, 16, 0.08);
  --c-primary-14:  rgba(25, 20, 16, 0.14);
  --c-primary-16:  rgba(25, 20, 16, 0.16);
}

/* Naizmjenicne trake — ritam sajta, ne sekcije. */
.band { background: var(--ar-canvas); }
.band[data-band='3'],
.band[data-band='7'],
.band[data-band='9'] { background: var(--ar-canvas-alt); }
.band[data-band='2'],
.band[data-band='5'],
.band[data-band='10'],
.band[data-band='11'] { background: var(--ar-ink); }

/* ============================================================
   4. TIPOGRAFSKI RITAM
   ============================================================ */

.sec-aperta-header h1, .sec-atelier-hero h1,
.sec-aperta-header h2, .sec-atelier-hero h2, .sec-anker-services h2,
.sec-anker-referenzen h2, .sec-atelier-parallax h2, .sec-aperta-about h2,
.sec-bloom-results h2, .sec-fundament-instagram h2, .sec-anker-faq h2,
.sec-anker-cta h2, .sec-anker-footer h2,
.sec-anker-services h3, .sec-anker-referenzen h3, .sec-aperta-about h3,
.sec-anker-faq h3, .sec-anker-footer h3, .sec-fundament-instagram h3 {
  font-family: var(--ff-display);
  letter-spacing: -0.015em;
}

.sec-atelier-hero .hero h1,
.sec-atelier-parallax .plx__title { font-weight: 700; }

.sec-anker-services .u-label,
.sec-anker-referenzen .u-label,
.sec-aperta-about .u-label,
.sec-bloom-results .u-label,
.sec-fundament-instagram .u-label,
.sec-anker-faq .u-label,
.sec-anker-cta .u-label,
.sec-atelier-hero .hero__label,
.sec-atelier-parallax .u-marker {
  font-family: var(--ff-body);
  letter-spacing: 0.15em;
  font-weight: 700;
}

/* ============================================================
   5. ZAGLAVLJE
   .site-head je sticky, ali mu je roditelj sama sekcija — visoka
   koliko i traka. Ljepljivost zato ide na traku sastavljaca, koja
   je u <main> i traje kroz cijelu stranicu.
   ============================================================ */

.band[data-band='1'] {
  position: sticky;
  top: 0;
  z-index: 100;
}

.sec-aperta-header .site-head {
  background: rgba(251, 248, 243, 0.93);
  border-bottom: 1px solid transparent;
}
.sec-aperta-header .site-head.is-stuck {
  border-bottom-color: var(--ar-line);
  box-shadow: 0 10px 30px -24px rgba(25, 20, 16, 0.6);
}

.sec-aperta-header .brand__mark { color: var(--ar-gold); }
.sec-aperta-header .brand__tx strong {
  font-size: 1.16rem;
  font-weight: 800;
  color: var(--ar-ink);
}
.sec-aperta-header .brand__tx small {
  color: var(--ar-muted);
  letter-spacing: 0.09em;
  font-size: 0.63rem;
}
.sec-aperta-header .site-nav a { font-weight: 600; letter-spacing: 0.005em; }
.sec-aperta-header .site-nav a:hover,
.sec-aperta-header .site-nav a.is-current {
  color: var(--ar-ink);
  border-bottom-color: var(--ar-gold);
}
.sec-aperta-header .head-cta {
  background: var(--ar-ink);
  color: var(--ar-on-dark);
  border-color: var(--ar-ink);
  border-radius: 999px;
  font-weight: 700;
}
.sec-aperta-header .head-cta:hover { background: var(--ar-gold-dk); border-color: var(--ar-gold-dk); }
.sec-aperta-header .burger { border-color: var(--ar-line-2); color: var(--ar-ink); border-radius: 12px; }
.sec-aperta-header .menu { background: var(--ar-canvas); border-top-color: var(--ar-line); }
.sec-aperta-header .menu a { color: var(--ar-ink); border-bottom-color: var(--ar-line); font-weight: 600; }
.sec-aperta-header .menu li:last-child a { color: var(--ar-gold-dk); }

/* Ljepljiva traka se u templatu pojavi tek poslije 400 px skrola, a u
   njoj je jedini WhatsApp na telefonu. transform nije zakljucan. */
.sec-aperta-header .mobile-bar { transform: none; }
.sec-aperta-header .mobile-bar__i { border-radius: 999px; font-weight: 700; }
.sec-aperta-header .mobile-bar__i--call { background: var(--ar-ink); color: var(--ar-on-dark); }
.sec-aperta-header .mobile-bar__i--wa { background: var(--ar-wa); color: #fff; }

/* Sekcija zaglavlja ne nosi sadrzaj — prazan pojas ispod trake se gasi. */
@media (max-width: 900px) {
  .sec-aperta-header { padding-bottom: 0; }
}

/* ============================================================
   6. HERO
   Zaglavlje je U TOKU (ljepljiva traka), pa hero ne smije cuvati
   mjesto za njega — templatov padding-top bi ostavio prazan pojas.
   ============================================================ */

.sec-atelier-hero { --header-h: 0px; }

.sec-atelier-hero .hero { background: var(--ar-ink); }
.sec-atelier-hero .hero__media :is(img, video) { object-position: 62% 32%; }

.sec-atelier-hero .hero__scrim {
  background:
    linear-gradient(180deg, rgba(20, 16, 12, 0.52) 0%, rgba(20, 16, 12, 0.16) 32%, rgba(20, 16, 12, 0.72) 76%, rgba(20, 16, 12, 0.93) 100%),
    linear-gradient(96deg, rgba(20, 16, 12, 0.80) 0%, rgba(20, 16, 12, 0.36) 48%, transparent 74%);
}

.sec-atelier-hero .hero__label { color: var(--ar-gold-lt); }
.sec-atelier-hero .hero h1 .u-em { color: var(--ar-gold-lt); font-style: normal; }
.sec-atelier-hero .hero__lead { color: rgba(247, 241, 230, 0.86); }
.sec-atelier-hero .hero__meta span { color: var(--ar-gold-lt); letter-spacing: 0.13em; }
.sec-atelier-hero .hero__meta strong { font-weight: 700; white-space: normal; }
.sec-atelier-hero .hero__meta a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

.sec-atelier-hero .u-btn--ivory {
  background: var(--ar-gold);
  color: var(--ar-ink);
  border-color: var(--ar-gold);
  font-weight: 800;
}
.sec-atelier-hero .u-btn--ivory:hover { background: var(--ar-gold-lt); border-color: var(--ar-gold-lt); }
.sec-atelier-hero .hero__ghost { font-weight: 700; }

/* ---------- Hero na telefonu: slika je svoj blok, tekst ispod ----------
   .hero__media je apsolutan sa inset: -8% 0 (zakljucano). Zadata visina
   iskljuci donju ivicu, a margin-top se DODAJE na top i tako ponisti
   onih -8%. Zato je i min-height heroja fiksan: da -8% bude poznat broj. */
@media (max-width: 760px) {
  .sec-atelier-hero .hero {
    min-height: 880px;
    padding-block: 0 28px;
  }
  .sec-atelier-hero .hero__media {
    height: 260px;
    margin-top: 70px;           /* 8% od 880 — tacno ponisti inset: -8% */
    transform: none !important; /* parallax skripta pise transform inline */
  }
  .sec-atelier-hero .hero__media img { object-position: 58% 26%; }
  .sec-atelier-hero .hero__scrim { background: none; }
  .sec-atelier-hero .hero__inner { padding-block-start: 286px; }
  .sec-atelier-hero .hero__lead { font-size: 1rem; }
  .sec-atelier-hero .hero__cta { gap: 10px; }
  .sec-atelier-hero .hero__meta { padding-top: 22px; }
}

/* Nizak telefon (375x667): dugmad u jedan red, sve malo zbijenije.
   flex nije zakljucan — flex-direction i order jesu. */
@media (max-width: 640px) and (max-height: 720px) {
  .sec-atelier-hero .hero { min-height: 810px; }
  .sec-atelier-hero .hero__media { height: 200px; margin-top: 65px; } /* 8% od 810 */
  .sec-atelier-hero .hero__inner { padding-block-start: 202px; }
  .sec-atelier-hero .hero__copy > * + * { margin-top: 12px; }
  .sec-atelier-hero .hero__cta { padding-top: 2px; }
  .sec-atelier-hero .hero__cta .u-btn { min-height: 50px; }
  .sec-atelier-hero .hero h1 { font-size: 1.9rem; }
  .sec-atelier-hero .hero__lead { font-size: 0.93rem; }
  .sec-atelier-hero .hero__meta { padding-top: 18px; }
  .sec-atelier-hero .hero__meta li { padding-bottom: 10px; margin-bottom: 10px; }
}

/* ============================================================
   7. USLUGE
   ============================================================ */

.sec-anker-services .u-section--alt { background: transparent; }
.sec-anker-services .u-label { color: var(--ar-gold-dk); }
.sec-anker-services .u-head h2 { color: var(--ar-ink); }
.sec-anker-services .u-head p { color: var(--ar-muted); }

.sec-anker-services .u-tabcard {
  background: var(--ar-surface);
  border-color: var(--ar-line);
  border-radius: 20px;
  box-shadow: 0 22px 44px -38px rgba(25, 20, 16, 0.55);
}
.sec-anker-services .u-tab {
  background: var(--ar-ink);
  color: var(--ar-on-dark);
  font-weight: 700;
  letter-spacing: 0.04em;
}
.sec-anker-services .u-tab--jade { background: var(--ar-gold); color: var(--ar-ink); }
.sec-anker-services .u-tab--line { background: var(--ar-cream); color: var(--ar-ink); border-color: var(--ar-gold); }
.sec-anker-services .sit__ic { color: var(--ar-gold-dk); background: var(--ar-cream); }
.sec-anker-services .sit h3 { color: var(--ar-ink); }
.sec-anker-services .sit p { color: var(--ar-text); }
.sec-anker-services .sit__first { color: var(--ar-muted); border-top: 1px solid var(--ar-line); padding-top: 14px; }
.sec-anker-services .sit__first span { color: var(--ar-gold-dk); font-weight: 700; }

/* ============================================================
   8. OCJENE
   ============================================================ */

.sec-anker-referenzen .u-label,
.sec-anker-referenzen .u-label--jade { background: var(--ar-cream); color: var(--ar-gold-dk); }
.sec-anker-referenzen .u-head h2 { color: var(--ar-ink); }
.sec-anker-referenzen .u-head p { color: var(--ar-muted); }
.sec-anker-referenzen .u-stars { color: var(--ar-gold); }

.sec-anker-referenzen .gsum {
  background: var(--ar-surface);
  border-color: var(--ar-line);
  border-radius: 20px;
}
.sec-anker-referenzen .gsum__score strong { font-family: var(--ff-display); color: var(--ar-ink); }
.sec-anker-referenzen .gsum__meta { color: var(--ar-muted); }
.sec-anker-referenzen .gsum__link { color: var(--ar-gold-dk); font-weight: 700; }

.sec-anker-referenzen .rcard {
  background: var(--ar-surface);
  border-color: var(--ar-line);
  border-radius: 20px;
  box-shadow: 0 22px 44px -38px rgba(25, 20, 16, 0.5);
  /* Recenzija je jedna, a mreza ima tri stupca — kartica u jednoj trecini
     izgleda kao da su druge dvije ispale. Sirina nije zakljucano svojstvo,
     pa se kartica razvuce preko dva stupca i cita se kao izdvojen citat.
     U jednom stupcu (ispod 680 px) se vraca na punu sirinu. */
  width: calc(200% + clamp(20px, 2.6vw, 32px));
  max-width: none;
  font-size: 1.0625rem;
}
@media (max-width: 680px) {
  .sec-anker-referenzen .rcard { width: 100%; font-size: 1rem; }
}
.sec-anker-referenzen .rcard__tr p { color: var(--ar-text); }
.sec-anker-referenzen .rcard__who { color: var(--ar-ink); font-weight: 700; }
.sec-anker-referenzen .rcard__src { color: var(--ar-muted); }
.sec-anker-referenzen .u-tab { background: var(--ar-gold); color: var(--ar-ink); font-weight: 700; }

/* ============================================================
   9. PARALAKSA
   ============================================================ */

.sec-atelier-parallax .plx__scrim {
  background:
    linear-gradient(180deg, rgba(20, 16, 12, 0.62) 0%, rgba(20, 16, 12, 0.44) 45%, rgba(20, 16, 12, 0.76) 100%);
}
.sec-atelier-parallax .plx__panel {
  background: rgba(20, 16, 12, 0.68);
  border: 1px solid var(--ar-line-dark);
  border-radius: 24px;
}
.sec-atelier-parallax .u-marker { color: var(--ar-gold-lt); }
.sec-atelier-parallax .plx__title { color: var(--ar-on-dark); }
.sec-atelier-parallax .plx__title .u-em { color: var(--ar-gold-lt); font-style: normal; }
.sec-atelier-parallax .plx__lead { color: var(--ar-on-dark-mu); }
.sec-atelier-parallax .plx__sig-name { color: var(--ar-on-dark); font-family: var(--ff-display); font-weight: 700; }
.sec-atelier-parallax .plx__sig-role { color: var(--ar-gold-lt); }
.sec-atelier-parallax .plx__arch { border-color: var(--ar-line-dark); }

/* Ispod 900 px templat trazi 90vh, a ispod 620 px 84svh — cijeli ekran
   za jedan citat, i bez gornje granice na visokom prozoru.
   min-height nije zakljucano svojstvo. */
@media (max-width: 900px) {
  .sec-atelier-parallax .plx { min-height: min(90vh, 760px); }
}
@media (max-width: 760px) {
  .sec-atelier-parallax .plx { min-height: min(84svh, 600px); }
  .sec-atelier-parallax .plx__panel { padding: 26px 20px; border-radius: 18px; }
}

/* ============================================================
   10. O NAMA
   ============================================================ */

.sec-aperta-about .u-label { color: var(--ar-gold-dk); }
.sec-aperta-about .u-arc { background: var(--ar-cream); }
.sec-aperta-about h2 { color: var(--ar-ink); }
.sec-aperta-about .abt__copy p { color: var(--ar-text); }

/* Okvir se prilagodi slici, ne slika okviru. */
.sec-aperta-about .abt__media img {
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: 50% 30%;
  border-radius: 22px;
}
.sec-aperta-about .abt__media figcaption { color: var(--ar-muted); }

.sec-aperta-about .abt__facts { border-top: 1px solid var(--ar-line); padding-top: 20px; }
.sec-aperta-about .abt__facts dt { color: var(--ar-gold-dk); letter-spacing: 0.13em; font-weight: 700; }
.sec-aperta-about .abt__facts dd { color: var(--ar-ink); font-family: var(--ff-display); font-weight: 700; }

/* Templat ovdje nema karticu nego blok sa linijom na vrhu, pa nema ni
   bocni padding. Kad se blok prefarba u plohu, tekst stoji na samoj
   ivici — padding nije zakljucano svojstvo. */
.sec-aperta-about .promise {
  background: var(--ar-cream);
  border: 1px solid var(--ar-line);
  border-radius: 22px;
  padding: clamp(26px, 3.2vw, 40px);
}
.sec-aperta-about .promise h3 { color: var(--ar-ink); margin: 0; }
.sec-aperta-about .promise__grid { margin-top: clamp(20px, 2.4vw, 28px); }
.sec-aperta-about .promise__grid p { color: var(--ar-text); margin: 0; }

/* ============================================================
   11. PRIJE / POSLIJE
   ============================================================ */

.sec-bloom-results .ba { background: transparent; }
.sec-bloom-results .u-label { color: var(--ar-gold-dk); }
.sec-bloom-results .ba__head h2 { color: var(--ar-ink); max-width: 26ch; }
.sec-bloom-results .ba__head p { color: var(--ar-muted); }

.sec-bloom-results .batab { background: var(--ar-surface); border-color: var(--ar-line-2); color: var(--ar-text); }
.sec-bloom-results .batab:hover { background: var(--ar-cream); border-color: var(--ar-gold); }
.sec-bloom-results .batab.is-on { background: var(--ar-ink); border-color: var(--ar-ink); color: var(--ar-on-dark); }

.sec-bloom-results .cmp { border-radius: 22px; background: var(--ar-cream); }
.sec-bloom-results .cmp__tag { background: rgba(20, 16, 12, 0.78); color: var(--ar-on-dark); border-radius: 999px; font-weight: 700; }
.sec-bloom-results .cmp__line i::before,
.sec-bloom-results .cmp__line i::after { border-color: var(--ar-ink); }

.sec-bloom-results .ba__note {
  margin: 14px auto 0;
  max-width: 62ch;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--ar-muted);
}

/* ============================================================
   12. INSTAGRAM
   ============================================================ */

.sec-fundament-instagram .ig { background: transparent; }
.sec-fundament-instagram .u-label { color: var(--ar-gold-dk); }
.sec-fundament-instagram .u-head h2 { color: var(--ar-ink); }
.sec-fundament-instagram .u-head p { color: var(--ar-muted); }

.sec-fundament-instagram .ig__profile {
  background: var(--ar-surface);
  border: 1px solid var(--ar-line);
  border-radius: 999px;
}
.sec-fundament-instagram .ig__profile-ic { color: var(--ar-gold-dk); }
.sec-fundament-instagram .ig__profile-tx strong { color: var(--ar-ink); font-family: var(--ff-display); font-weight: 700; }
.sec-fundament-instagram .ig__profile-tx small { color: var(--ar-muted); }

/* Okvir se prilagodi slici: templat crta uspravnu plocu 9:16 za reel,
   a ovdje su kvadratne objave sa Instagrama. aspect-ratio nije zakljucano. */
.sec-fundament-instagram .reel__link {
  aspect-ratio: 1 / 1;
  border-radius: 18px;
  background: var(--ar-cream);
  box-shadow: 0 22px 44px -38px rgba(25, 20, 16, 0.55);
}
/* Tamni preliv preko donje polovine je postojao zbog natpisa na plocici;
   natpisa nema, pa nema ni razloga da fotografija bude zatamnjena. */
.sec-fundament-instagram .reel__link::after { background: none; }

/* U dva stupca treca plocica ide u svoj red na pola sirine i ostane uz
   lijevu ivicu — cita se kao da je ispala iz mreze. margin nije
   zakljucan, pa se centrira. */
@media (max-width: 820px) {
  .sec-fundament-instagram .ig__grid li:last-child { margin-inline: auto; }
}

/* U jednom stupcu templat mrezu suzi na 320 px i ostavi je uz lijevu
   ivicu — na telefonu se to cita kao pomjeren raspored. */
@media (max-width: 560px) {
  .sec-fundament-instagram .ig__grid { max-width: none; }
}

/* ============================================================
   13. PITANJA
   ============================================================ */

.sec-anker-faq .faq { background: transparent; }
/* overflow: hidden na .faq pravi scroll kontejner i gasi sticky bocnu
   kolonu; clip klipuje isto, a kontejner ne pravi. */
.sec-anker-faq .faq { overflow: clip; }
.sec-anker-faq .u-label { color: var(--ar-gold-dk); }
.sec-anker-faq .u-head h2 { color: var(--ar-ink); }
.sec-anker-faq .u-head p { color: var(--ar-muted); }

/* Lista je `max-width: 56rem` uz lijevu ivicu kontejnera od 1140 px, pa
   desna trecina sekcije ostaje prazna. margin i max-width nisu
   zakljucani — cijeli blok pitanja se centrira kao jedan stubac.
   Uz to: linija na vrhu liste je bila razdjelnik izmedju redova; sad su
   redovi kartice, pa ta linija visi sama. */
.sec-anker-faq .faq__head,
.sec-anker-faq .faq__list,
.sec-anker-faq .faq__more { max-width: 56rem; margin-inline: auto; }
.sec-anker-faq .faq__list { border-top: 0; }

.sec-anker-faq .qa {
  background: var(--ar-surface);
  border: 1px solid var(--ar-line);
  border-radius: 16px;
  /* Red je u templatu bio preko cijele sirine, izmedju dvije linije, pa
     dugme ima `padding: sp-4 0`. U kartici bi tekst i znak +/- stajali
     na samoj ivici. */
  padding-inline: clamp(18px, 2vw, 26px);
}
.sec-anker-faq .qa + .qa { margin-top: 10px; }
.sec-anker-faq .qa__q button { color: var(--ar-ink); font-family: var(--ff-display); font-weight: 700; }
.sec-anker-faq .qa__sign { color: var(--ar-gold-dk); }
.sec-anker-faq .qa__in p { color: var(--ar-text); }
.sec-anker-faq .qa__in a { color: var(--ar-gold-dk); font-weight: 600; }
.sec-anker-faq .faq__more { color: var(--ar-muted); }
.sec-anker-faq .faq__more a { color: var(--ar-gold-dk); font-weight: 700; }

/* ============================================================
   14. KONTAKT
   ============================================================ */

.sec-anker-cta .cta { background: var(--ar-ink); }
.sec-anker-cta .u-dark { color: var(--ar-on-dark); }
.sec-anker-cta .u-label { background: rgba(247, 241, 230, 0.10); color: var(--ar-gold-lt); }
.sec-anker-cta .cta__copy h2 { color: var(--ar-on-dark); }
.sec-anker-cta .cta__copy p { color: var(--ar-on-dark-mu); }

.sec-anker-cta .cta__act {
  background: rgba(247, 241, 230, 0.07);
  border: 1px solid var(--ar-line-dark);
  border-radius: 22px;
}
.sec-anker-cta .u-tab--line { background: transparent; border-color: var(--ar-gold-lt); color: var(--ar-gold-lt); }
.sec-anker-cta .u-btn--wa { background: var(--ar-wa); border-color: var(--ar-wa); color: #fff; font-weight: 800; }
.sec-anker-cta .u-btn--wa:hover { background: var(--ar-wa-dk); border-color: var(--ar-wa-dk); }
.sec-anker-cta .u-btn--white { background: var(--ar-on-dark); border-color: var(--ar-on-dark); color: var(--ar-ink); font-weight: 800; }
.sec-anker-cta .u-btn--white:hover { background: var(--ar-gold-lt); border-color: var(--ar-gold-lt); }
.sec-anker-cta .cta__ready { color: var(--ar-on-dark-mu); }
.sec-anker-cta .cta__ready li::marker { color: var(--ar-gold-lt); }

/* ============================================================
   15. PODNOZJE
   ============================================================ */

.sec-anker-footer { background: var(--ar-ink); }
.sec-anker-footer .ftr { background: var(--ar-ink); color: var(--ar-on-dark); }
.sec-anker-footer .ftr__mark { color: var(--ar-gold-lt); }
.sec-anker-footer .ftr__logo-tx strong { color: var(--ar-on-dark); font-family: var(--ff-display); font-weight: 800; }
.sec-anker-footer .ftr__logo-tx small { color: var(--ar-gold-lt); letter-spacing: 0.1em; }
.sec-anker-footer .ftr__blurb { color: var(--ar-on-dark-mu); }
.sec-anker-footer .ftr__col h3 { color: var(--ar-gold-lt); letter-spacing: 0.14em; font-size: 0.72rem; text-transform: uppercase; }
.sec-anker-footer .ftr__col a { color: var(--ar-on-dark); }
.sec-anker-footer .ftr__col a:hover { color: var(--ar-gold-lt); }
.sec-anker-footer .ftr__contact address { color: var(--ar-on-dark); font-style: normal; }
.sec-anker-footer .ftr__row { margin: 8px 0 0; }
.sec-anker-footer .ftr__ig,
.sec-anker-footer .ftr__map,
.sec-anker-footer .ftr__mail { text-decoration: underline; text-underline-offset: 3px; }
.sec-anker-footer .ftr__hours th { color: var(--ar-on-dark-mu); font-weight: 500; padding-right: 18px; }
.sec-anker-footer .ftr__hours td { color: var(--ar-on-dark); }
.sec-anker-footer .ftr__hint { color: var(--ar-on-dark-mu); }
.sec-anker-footer .ftr__bar { border-top: 1px solid var(--ar-line-dark); color: var(--ar-on-dark-mu); }
.sec-anker-footer .ftr__top-btn { color: var(--ar-gold-lt); font-weight: 700; }
.sec-anker-footer .ftr__ig { color: var(--ar-on-dark); }

/* Ljepljiva traka na telefonu ne smije pokriti dno podnozja. */
@media (max-width: 900px) {
  .sec-anker-footer .ftr { padding-bottom: calc(32px + 78px); }
}

/* ============================================================
   16. OTKRIVANJE
   Sigurnosna mreza je u assets/js/site.js — ovdje samo prelaz.
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}