/* ==========================================================================
   Calendar.co — „živi" sloj, deo 1: četkica.
   Logo-trougao se na početnoj iscrtava četkicom u tri poteza (zivo-cetkica.js),
   a isti potez četkice podvlači naslove poglavlja u boji tog poglavlja.
   ========================================================================== */

/* ─────────── udarni blok početne: tekst levo, naslikan znak desno ─────────── */
.udarni--cetkica{position:relative;text-align:left;overflow:hidden;padding-top:clamp(28px,5vw,72px);}
.cetkica-platno{
  position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;z-index:0;
}
.udarni--cetkica .okvir{position:relative;z-index:1;}

.udarni-red{display:grid;grid-template-columns:1fr;gap:8px;align-items:center;}
.udarni-znak{order:-1;height:clamp(190px,52vw,260px);}
.udarni--cetkica .udarni-tekst{max-width:640px;}
.udarni--cetkica .vodeci{margin-left:0;max-width:52ch;}
.udarni--cetkica h1{font-size:clamp(2.45rem,6.2vw,4.6rem);line-height:1.0;letter-spacing:-.035em;}

@media (min-width:980px){
  .udarni-red{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:24px;min-height:min(560px,68vh);}
  .udarni-znak{order:0;height:auto;align-self:stretch;}
}

/* reči naslova izlaze odozdo (zivo-cetkica.js ih umota) */
.rec{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em;}
.rec > span{display:inline-block;will-change:transform;}

/* Dok JS ne preuzme, tekst heroja je skriven — ali najkasnije posle 3 s se
   pokaže sam, da strana nikad ne ostane prazna ako skripta zakaže. */
html.js .udarni--cetkica .udarni-tekst > *,
html.js .udarni--cetkica .udarni-slika{opacity:0;animation:cc-pokazi .01s 3.2s forwards;}
@keyframes cc-pokazi{to{opacity:1;}}
@media (prefers-reduced-motion:reduce){
  html.js .udarni--cetkica .udarni-tekst > *,
  html.js .udarni--cetkica .udarni-slika{opacity:1;animation:none;}
}

/* snimak kalendara stoji u perspektivi i ispravlja se skrolom */
.udarni--cetkica .udarni-slika{perspective:1600px;margin-top:clamp(28px,4vw,48px);}
.udarni--cetkica .udarni-slika .okvir-slike{transform-origin:50% 0;will-change:transform;}

/* ─────────── potez četkice ispod naslova ─────────── */
.cetkica-potez{display:block;width:min(240px,62%);height:26px;margin:6px 0 0 -4px;pointer-events:none;}
.glava--sredina .cetkica-potez,
.zavrsni .cetkica-potez{margin-left:auto;margin-right:auto;}
.udarni .cetkica-potez{width:min(300px,70%);height:32px;margin-left:auto;margin-right:auto;}

/* ─────────── novi znak (AC) i natpis (Ai Calendarco) ─────────── */
.cc-natpis{display:block;height:34px;width:auto;}
.cc-logo-noga .cc-natpis{height:30px;}
@media (max-width:420px){ .cc-head .cc-natpis{height:28px;} }

.udarni-znak{position:relative;perspective:1200px;}
.ac-scena{position:relative;width:100%;height:100%;transform-style:preserve-3d;will-change:transform;}
.ac-znak{position:relative;display:block;width:100%;height:100%;overflow:visible;}
.ac-sjaj{
  position:absolute;inset:8% 4%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(92,80,255,.26),rgba(70,200,255,.12) 55%,transparent 75%);
  filter:blur(30px);opacity:0;transform:scale(.6);
}
html:not(.js) .ac-sjaj{opacity:1;transform:none;}
/* posle uvoda znak lagano diše */
.ac-gotov .ac-znak{animation:ac-lebdi 6s ease-in-out infinite;}
@keyframes ac-lebdi{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@media (prefers-reduced-motion:reduce){ .ac-gotov .ac-znak{animation:none;} .ac-sjaj{opacity:1;transform:none;} }