/* Linea Vitae – stil stranice */
:root{
  --pozadina:#FAE2E2;
  --roza:#EBA6CA;
  --roza-tamna:#D98BB5;
  --roza-svijetla:#F4C9DD;
  --plava:#1F1E5D;
  --plava-meka:#4b4170;
  --ljubicasta:#6b5a8e;
  --bijela:#FFFFFF;
  --serif:'Lora',Georgia,serif;
  --sans:'Nunito Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --sirina:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--pozadina);color:var(--plava);font-family:var(--sans);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--plava)}
a:hover{color:#4a3f8f}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.15;margin:0}
p{margin:0}
[hidden]{display:none!important}
.skriveno{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.preskoci{position:absolute;left:-999px;top:8px;background:var(--plava);color:#fff;padding:10px 16px;border-radius:999px;z-index:50}
.preskoci:focus{left:16px}
:focus-visible{outline:3px solid var(--roza-tamna);outline-offset:3px;border-radius:6px}

/* okvir */
.stranica{position:relative;overflow:hidden;min-height:100vh}
.sadrzaj{position:relative;z-index:1}
.omot{width:100%;max-width:var(--sirina);margin:0 auto;padding:0 24px}

/* glava s drvetom u pozadini */
.glava{position:absolute;z-index:0;width:min(680px,90vw);aspect-ratio:420/490;pointer-events:none}
.glava img{width:100%;height:100%;opacity:.1;animation:disanje 8s ease-in-out infinite;transform-origin:50% 60%}
.glava--desno{right:-40px;top:90px}
.glava--lijevo{left:-60px;top:140px}
.glava--sredina{left:50%;margin-left:min(-340px,-45vw);top:140px}
@keyframes disanje{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
.list{position:absolute;opacity:0;animation:letA 11s ease-in-out infinite}
.list svg{display:block}
.list.b{animation-name:letB}.list.c{animation-name:letC}
.list.t1{animation-delay:-1.4s}.list.t2{animation-delay:-2.8s}.list.t3{animation-delay:-4.2s}.list.t4{animation-delay:-5.6s}.list.t5{animation-delay:-7s}.list.t6{animation-delay:-8.4s}.list.t7{animation-delay:-9.8s}
@keyframes letA{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.3)}12%{opacity:.75}75%{opacity:.45}100%{opacity:0;transform:translate(240px,-280px) rotate(120deg) scale(1.1)}}
@keyframes letB{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.3)}12%{opacity:.75}75%{opacity:.45}100%{opacity:0;transform:translate(-220px,-260px) rotate(-100deg) scale(1)}}
@keyframes letC{0%{opacity:0;transform:translate(0,0) rotate(0) scale(.3)}12%{opacity:.75}75%{opacity:.4}100%{opacity:0;transform:translate(340px,-60px) rotate(160deg) scale(1.1)}}

/* zaglavlje */
.zaglavlje{position:relative;z-index:5}
.zaglavlje .omot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:22px;padding-bottom:22px}
.marka{display:flex;align-items:center;gap:12px;text-decoration:none}
.marka img{width:40px;height:47px}
.marka span{font-family:var(--serif);font-size:26px;font-weight:600}
.izbornik{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:15px;font-weight:600}
.izbornik a{text-decoration:none;padding:10px 15px;border-radius:999px;transition:background .3s ease}
.izbornik a[aria-current="page"]{background:rgba(235,166,202,.55)}
.izbornik a.kontakt-gumb{border:1.5px solid var(--plava)}
.izbornik a.kontakt-gumb[aria-current="page"]{background:var(--plava);color:#fff}
.izbornik-gumb{display:none;align-items:center;gap:8px;min-height:44px;padding:8px 16px;border:1.5px solid var(--plava);border-radius:999px;background:transparent;color:var(--plava);font:inherit;font-weight:700;cursor:pointer}
.izbornik-gumb .crte{display:inline-flex;flex-direction:column;gap:4px}
.izbornik-gumb .crte i{display:block;width:18px;height:2px;background:currentColor;border-radius:2px}

/* opći elementi */
.oznaka{font-size:14px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--ljubicasta)}
.gumb{display:inline-flex;align-items:center;justify-content:center;min-height:48px;text-decoration:none;padding:15px 28px;border-radius:999px;font-weight:700;border:1.5px solid var(--plava);background:rgba(255,255,255,.4);color:var(--plava);font-family:var(--sans);font-size:16px;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease}
.gumb:hover{transform:translateY(-2px)}
.gumb--puni{background:var(--plava);color:#fff}
.gumb--puni:hover{color:#fff}
.puls{animation:puls 3.5s ease-in-out infinite}
@keyframes puls{0%,100%{box-shadow:0 0 0 0 rgba(235,166,202,.7)}50%{box-shadow:0 0 0 12px rgba(235,166,202,0)}}
.status{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.7);font-size:14px;font-weight:700;align-self:flex-start}
.tocka{width:9px;height:9px;border-radius:50%;background:var(--roza-tamna);flex:0 0 9px}
.sekcija{padding:70px 0}
.naslov-sekcije{font-size:clamp(32px,4.4vw,50px);text-align:center}
.uvod{max-width:620px;margin:14px auto 0;text-align:center;font-size:18px}
.karta{background:rgba(255,255,255,.82);border-radius:26px;padding:clamp(24px,3.4vw,38px)}
.karta--tamna{background:var(--plava);color:#fff}
.karta--tamna a{color:#fff}
.karta--roza{background:var(--roza)}
.mreza{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.podizanje{transition:transform .35s ease,box-shadow .35s ease}
.podizanje:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(31,30,93,.12)}
.pojava{opacity:0;animation:pojava 1.3s ease-out forwards}
.p1{animation-delay:.2s}.p2{animation-delay:.7s}.p3{animation-delay:1.2s}.p4{animation-delay:1.7s}
@keyframes pojava{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* naslovnica */
.junak .omot{display:flex;flex-direction:column;gap:24px;padding-top:clamp(40px,8vw,100px);padding-bottom:40px}
.junak h1{font-size:clamp(38px,5.4vw,62px);max-width:820px;line-height:1.12}
.junak .podnaslov{font-size:clamp(17px,1.6vw,20px);max-width:600px}
.gumbi{display:flex;flex-wrap:wrap;gap:14px;margin-top:6px}
.linija-zivota{display:block;width:100%;height:120px}
.linija-zivota path{stroke-dasharray:2400;stroke-dashoffset:2400;animation:crtanje 6s .6s ease-out forwards}
@keyframes crtanje{to{stroke-dashoffset:0}}
.ulaz{display:flex;flex-direction:column;gap:10px;text-decoration:none}
.ulaz strong{font-family:var(--serif);font-size:30px;font-weight:600}
.ulaz em{font-style:normal;font-weight:700;margin-top:6px}
.disanje{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(30px,7vw,80px)}
.disanje .tekst{max-width:440px;display:flex;flex-direction:column;gap:14px}
.disanje h2{font-size:clamp(32px,4vw,46px)}
.krug{position:relative;width:300px;height:300px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.krug .obrub{position:absolute;inset:0;border-radius:50%;border:1.5px dashed var(--roza-tamna)}
.krug .kugla{position:absolute;width:280px;height:280px;border-radius:50%;background:var(--roza);opacity:.75;transform:scale(.62);transition:transform 1s ease}
.krug .rijec{position:absolute;font-family:var(--serif);font-size:28px;font-style:italic}
.krug .udah,.krug .izdah{opacity:0}
.krug.dise .kugla{animation:dah 10s ease-in-out infinite}
.krug.dise .spremni{opacity:0}
.krug.dise .udah{animation:udah 10s ease-in-out infinite}
.krug.dise .izdah{animation:izdah 10s ease-in-out infinite}
@keyframes dah{0%,100%{transform:scale(.62)}40%,50%{transform:scale(1)}}
@keyframes udah{0%,38%{opacity:1}44%,96%{opacity:0}100%{opacity:1}}
@keyframes izdah{0%,38%{opacity:0}44%,96%{opacity:1}100%{opacity:0}}

/* o meni */
.o-meni{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(40px,7vw,90px);padding-top:clamp(30px,6vw,80px)}
.portret{position:relative;width:min(360px,80vw);aspect-ratio:360/445;margin:0 auto}
.portret .okvir{position:absolute;inset:-18px;border:1.5px dashed var(--roza-tamna);border-radius:999px 999px 44px 44px;animation:disanje 8s ease-in-out infinite}
.portret .mrlja{position:absolute;left:-30px;bottom:-24px;width:44%;aspect-ratio:1;border-radius:50%;background:var(--roza);opacity:.7}
.portret img{position:relative;width:100%;height:100%;object-fit:cover;object-position:50% 40%;border-radius:999px 999px 32px 32px}
.o-meni .tekst{flex:1 1 420px;min-width:0;max-width:640px;display:flex;flex-direction:column;gap:18px}
.o-meni h1{font-size:clamp(38px,4.6vw,54px)}
.citat{font-family:var(--serif);font-size:clamp(21px,2.2vw,25px);line-height:1.45;font-style:italic;border-top:1px solid var(--roza);padding-top:20px}
.popis{list-style:none;margin:0;padding:20px 0 0;border-top:1px solid var(--roza);display:flex;flex-direction:column;gap:10px}
.popis li{display:flex;gap:12px;align-items:baseline}
.popis li::before{content:"";flex:0 0 8px;height:8px;border-radius:50%;background:var(--roza-tamna);transform:translateY(-2px)}

/* kako mogu pomoći */
.logo-karte{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));margin-top:30px}
.logo-karte h2{font-size:30px;font-weight:600;margin-bottom:12px}
.logo-karte p+p{margin-top:12px}
.razdjelnik{display:block;margin:34px auto 0}
.teme{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:1000px;margin:26px auto 0}
.tema{min-height:46px;padding:11px 20px;border-radius:999px;border:1.5px solid var(--plava);background:rgba(255,255,255,.65);color:var(--plava);font:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:all .3s ease}
.tema:hover{transform:translateY(-2px)}
.tema[aria-selected="true"]{background:var(--plava);color:#fff}
.odgovor{max-width:780px;margin:26px auto 0;background:rgba(255,255,255,.8);border-radius:28px;padding:clamp(26px,4vw,42px) clamp(24px,5vw,56px)}
.odgovor .misao{font-family:var(--serif);font-size:clamp(22px,2.6vw,30px);line-height:1.4;font-style:italic}
.odgovor .dno{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--roza);padding-top:18px;margin-top:18px}
.odgovor .dno a{font-weight:700;text-decoration:none;padding:10px 0}
.js .panel[hidden]{display:none}
.no-js .panel{margin-bottom:18px}
.usluga h3{font-size:32px;font-weight:600;margin:8px 0 10px}
.usluga .mala{font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--ljubicasta)}
.karta--tamna .mala{color:var(--roza-svijetla)}
.napomena{text-align:center;margin-top:24px}

/* cjenik */
.cijena{font-family:var(--serif);font-size:44px;font-weight:600;margin-top:14px}
.trajanje{font-size:14px;color:var(--plava-meka)}
.karta--tamna .trajanje{color:var(--roza-svijetla)}
.koraci{position:relative;display:flex;flex-direction:column;gap:32px;padding-left:52px;max-width:760px;margin:34px auto 0}
.koraci::before{content:"";position:absolute;left:17px;top:8px;bottom:8px;width:2px;background:var(--plava);opacity:.35}
.korak{position:relative}
.korak .broj{position:absolute;left:-52px;top:0;width:36px;height:36px;border-radius:50%;background:var(--roza);display:flex;align-items:center;justify-content:center;font-weight:700}
.korak h3{font-family:var(--sans);font-size:20px;font-weight:700;margin-bottom:4px}

/* pitanja */
.pitanja{max-width:900px;margin:30px auto 0;display:flex;flex-direction:column;gap:14px}
.pitanje{background:rgba(255,255,255,.82);border-radius:22px;transition:background .3s ease}
.pitanje[open]{background:#fff}
.pitanje summary{list-style:none;cursor:pointer;padding:22px clamp(20px,3vw,30px);display:flex;align-items:center;justify-content:space-between;gap:18px;font-family:var(--serif);font-size:clamp(19px,2vw,23px);font-weight:500}
.pitanje summary::-webkit-details-marker{display:none}
.pitanje summary::after{content:"+";flex:0 0 36px;height:36px;border-radius:50%;background:var(--pozadina);display:flex;align-items:center;justify-content:center;font-family:var(--sans);font-size:22px;transition:transform .35s ease}
.pitanje[open] summary::after{transform:rotate(45deg);background:var(--roza)}
.pitanje p{padding:0 clamp(20px,3vw,30px) 24px;animation:pojava .5s ease-out}

/* kontakt */
.kontakt{display:flex;flex-wrap:wrap;align-items:flex-start;gap:40px;padding-top:clamp(30px,5vw,70px)}
.kontakt .glavno{flex:999 1 520px;min-width:0;display:flex;flex-direction:column;gap:22px}
.kontakt h1{font-size:clamp(34px,4.2vw,50px)}
.obavijest{display:flex;gap:14px;align-items:flex-start;background:rgba(255,255,255,.75);border-radius:20px;padding:18px 22px;font-size:16px}
.obavijest .tocka{margin-top:8px}
.obrazac{background:rgba(255,255,255,.92);border-radius:30px;padding:clamp(26px,4vw,46px)}
.obrazac fieldset{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.obrazac legend,.obrazac .pitanje-polja{font-family:var(--serif);font-size:clamp(26px,3vw,34px);padding:0;margin-bottom:6px}
.obrazac input[type=text],.obrazac input[type=email],.obrazac textarea{width:100%;font:inherit;font-size:17px;padding:15px 18px;border:1.5px solid #D9C4D6;border-radius:14px;color:var(--plava);background:#FFFAFC}
.obrazac textarea{resize:vertical;min-height:120px}
.izbori{display:flex;flex-wrap:wrap;gap:12px}
.izbor{position:relative}
.izbor input{position:absolute;opacity:0;width:1px;height:1px}
.izbor span{display:inline-flex;align-items:center;min-height:48px;padding:12px 24px;border:1.5px solid var(--plava);border-radius:999px;background:var(--pozadina);font-weight:700;cursor:pointer;transition:all .25s ease}
.izbor input:checked+span{background:var(--plava);color:#fff}
.izbor input:focus-visible+span{outline:3px solid var(--roza-tamna);outline-offset:3px}
.korak-br{font-size:14px;color:var(--ljubicasta);font-weight:700;margin-bottom:10px}
.akcije{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:8px}
.tekst-gumb{background:none;border:0;color:var(--plava);font:inherit;text-decoration:underline;cursor:pointer;padding:10px 0}
.sitno{font-size:14px;color:var(--plava-meka)}
.js .obrazac fieldset.korak-obrasca{display:none}
.js .obrazac fieldset.korak-obrasca.aktivan{display:flex;animation:pojava .6s ease-out}
.no-js .korak-br,.no-js .tekst-gumb,.no-js .dalje{display:none}
.no-js .obrazac fieldset+fieldset{margin-top:28px}
.zamka{position:absolute;left:-5000px}
.hvala{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.hvala img{width:64px;height:75px;animation:disanje 8s ease-in-out infinite}
.hvala p:first-of-type{font-family:var(--serif);font-size:clamp(26px,3vw,34px)}
.greska{background:#fff;border:1.5px solid var(--roza-tamna);border-radius:16px;padding:14px 18px}
.kontakt aside{flex:1 1 300px;margin-top:clamp(0px,8vw,150px);background:var(--plava);color:#fff;border-radius:30px;padding:36px;display:flex;flex-direction:column;gap:16px}
.kontakt aside a{color:#fff}
.kontakt aside .ime{font-family:var(--serif);font-size:28px;font-weight:600}
.kontakt aside .vrsta{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--roza-svijetla)}

/* privatnost */
.pravni{max-width:820px;margin:0 auto;padding-top:50px}
.pravni .karta{display:flex;flex-direction:column;gap:14px}
.pravni h1{font-size:clamp(34px,4vw,46px)}
.pravni h2{font-size:24px;font-weight:600;margin-top:16px}
.pravni ul{margin:0;padding-left:22px}

/* podnožje */
.podnozje{position:relative;z-index:2;padding:30px 0 46px}
.hitno{display:flex;gap:14px;align-items:flex-start;background:rgba(255,255,255,.7);border-radius:18px;padding:16px 22px;font-size:15px;margin-bottom:32px}
.hitno .tocka{background:var(--plava);margin-top:8px}
.podnozje .redak{display:flex;flex-wrap:wrap;justify-content:space-between;gap:26px;border-top:1px solid var(--roza);padding-top:28px;font-size:14px}
.podnozje .redak>div,.podnozje nav{display:flex;flex-direction:column;gap:4px}
.podnozje .marka span{font-size:24px}
.podnozje .marka small{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}

/* mobitel */
@media (max-width:900px){
  .izbornik-gumb{display:inline-flex}
  .izbornik{display:none;position:absolute;left:16px;right:16px;top:calc(100% - 6px);flex-direction:column;align-items:stretch;gap:4px;background:#fff;border-radius:22px;padding:12px;box-shadow:0 20px 50px rgba(31,30,93,.15)}
  .izbornik.otvoren{display:flex}
  .izbornik a{padding:13px 16px;font-size:17px}
  .no-js .izbornik{display:flex;position:static;box-shadow:none;background:transparent;flex-direction:row;flex-wrap:wrap}
  .no-js .izbornik-gumb{display:none}
  .zaglavlje .omot{flex-wrap:wrap}
}
@media (max-width:600px){
  body{font-size:16px}
  .omot{padding:0 16px}
  .sekcija{padding:50px 0}
  .glava{opacity:.8}
  .glava--desno{right:-120px;top:120px}
  .glava--lijevo{left:-140px}
  .krug{width:250px;height:250px}
  .krug .kugla{width:232px;height:232px}
  .gumbi .gumb{width:100%}
  .cijena{font-size:38px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .pojava,.list{opacity:1}
  .list{display:none}
  .linija-zivota path{stroke-dashoffset:0}
}
