@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#20304b;--muted:#64728b;--pink:#ef4667;--yellow:#ffe28a;--line:#e8edf4;--paper:#fff;--bg:#f7f9fd}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);font-family:Nunito,system-ui,sans-serif;color:var(--ink);line-height:1.6}button,a{ -webkit-tap-highlight-color:transparent}a{color:inherit}button{font:inherit;cursor:pointer}.container{max-width:1280px;padding:0 24px;margin:auto}.skip-link{position:absolute;left:-9999px;top:5px;background:#fff;padding:8px;z-index:999}.skip-link:focus{left:5px}.site-header{background:#fff;box-shadow:0 2px 16px #25334a0c;position:relative;z-index:5}.topbar{min-height:115px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;align-items:center;gap:13px;text-decoration:none}.brand img{width:67px;height:100px;object-fit:contain}.brand strong{font-size:clamp(23px,3vw,34px);font-weight:900;line-height:1.05;letter-spacing:-1.5px;display:block}.brand em{color:var(--pink);font-style:normal}.brand small{display:block;font-weight:700;color:var(--muted);font-size:12px;margin-top:6px}.header-contact{display:flex;gap:22px;align-items:center}.header-contact a{text-decoration:none;font-weight:800;font-size:14px}.header-contact a:hover{color:var(--pink)}.main-nav{background:#20304b}.nav-inner{display:flex;flex-wrap:wrap;align-items:center;gap:0 2px}.nav-inner a{padding:14px 11px;text-decoration:none;font-size:13px;font-weight:800;color:#fff;white-space:nowrap;border-radius:3px}.nav-inner a:hover,.nav-inner a:focus-visible{background:#ffffff21}.nav-home{color:#ffe28a!important}.menu-toggle{display:none}.hero{background:radial-gradient(circle at 80% 10%,#ffe9b0 0,#fff3d5 27%,transparent 58%),linear-gradient(125deg,#fff,#fff9ef);overflow:hidden}.hero-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:340px}.hero-copy{padding:42px 0}.eyebrow{display:inline-block;color:#d93d5c;text-transform:uppercase;font-weight:900;letter-spacing:1.5px;font-size:12px}.hero h1{font-size:clamp(34px,4.4vw,60px);line-height:1.12;max-width:720px;letter-spacing:-2px;margin:12px 0 15px;font-weight:900}.hero h1 span{color:var(--pink)}.hero p{font-size:18px;color:#55637a;margin:0 0 25px}.hero-cta{display:inline-flex;gap:12px;background:var(--pink);color:white;text-decoration:none;padding:13px 22px;border-radius:12px;font-weight:900}.hero-cta:hover{background:#cf2c4f}.hero-mascot{max-height:290px;width:auto;object-fit:contain;filter:drop-shadow(0 16px 15px #d7b59c55);flex-shrink:0}.calendar-section{padding:56px 0 70px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.section-heading h2{font-size:clamp(29px,3vw,43px);line-height:1.15;letter-spacing:-1px;margin:7px 0}.section-heading p{color:var(--muted);margin:0}.slider-controls{display:flex;gap:10px}.slider-controls button{border:1px solid var(--line);background:white;color:var(--ink);border-radius:13px;width:52px;height:52px;font-size:35px;line-height:1;box-shadow:0 4px 14px #1c2a4810}.slider-controls button:hover{background:var(--pink);color:#fff}.calendar-window{overflow:hidden;outline-offset:4px}.calendar-track{display:flex;gap:22px;transition:transform .5s ease;will-change:transform}.calendar-card{margin:0;flex:0 0 calc((100% - 22px)/2);min-width:0;background:white;padding:14px;border:1px solid var(--line);border-radius:20px;box-shadow:0 12px 34px #23324e10}.calendar-open{display:block;border:0;background:white;padding:0;width:100%;position:relative;border-radius:12px;overflow:hidden}.calendar-open img{display:block;width:100%;height:auto;aspect-ratio:600/735;object-fit:contain;background:#fff}.zoom-hint{position:absolute;bottom:10px;right:10px;background:#20304be6;color:white;padding:7px 12px;font-size:12px;font-weight:800;border-radius:8px;opacity:0;transition:opacity .2s}.calendar-open:hover .zoom-hint,.calendar-open:focus-visible .zoom-hint{opacity:1}.calendar-card figcaption{text-align:center;font-size:17px;font-weight:900;padding:12px 0 3px}.slider-dots{display:flex;justify-content:center;gap:7px;margin-top:20px;flex-wrap:wrap}.slider-dots button{width:10px;height:10px;padding:0;border-radius:99px;border:0;background:#cfd6e2}.slider-dots button.active{width:28px;background:var(--pink)}.calendar-status{font-size:13px;text-align:center;color:var(--muted);margin-top:14px}.lightbox[hidden]{display:none}.lightbox{position:fixed;inset:0;z-index:1000;background:#0a1426ed;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px 20px 65px}.lightbox img{max-width:100%;max-height:calc(100vh - 125px);object-fit:contain;background:white}.lightbox-close{position:absolute;top:12px;right:18px;border:0;background:transparent;color:#fff;font-size:44px}.lightbox-caption{color:#fff;font-weight:800;margin:12px}.inner-hero{background:linear-gradient(115deg,#fff1d0,#fff);padding:38px 0}.inner-hero h1{font-size:clamp(32px,4vw,48px);margin:5px 0}.placeholder{padding-top:45px;padding-bottom:100px}.footer{background:#1b2941;color:#dfe7f3;padding-top:44px}.footer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.footer h3{color:white;margin:0 0 14px}.footer p{margin:0 0 7px}.footer a{text-decoration:none}.footer a:hover{color:#ffe28a}.footer-bottom{border-top:1px solid #ffffff20;margin-top:35px;padding-top:18px;padding-bottom:20px;font-size:13px;color:#aebcd0}
@media(max-width:900px){.header-contact{display:none}.menu-toggle{display:flex;gap:8px;align-items:center;background:#f5f7fb;border:1px solid var(--line);padding:10px 14px;border-radius:10px;font-weight:900}.main-nav{display:none}.main-nav.open{display:block}.nav-inner{display:flex;flex-direction:column;align-items:stretch;padding-top:10px;padding-bottom:10px}.nav-inner a{padding:12px 15px;border-bottom:1px solid #ffffff20}.hero-mascot{max-height:220px}.hero-inner{min-height:280px}}
@media(max-width:680px){.container{padding-left:16px;padding-right:16px}.topbar{min-height:92px}.brand img{height:79px;width:53px}.brand strong{font-size:24px}.brand small{font-size:10px}.menu-toggle span{display:none}.hero-inner{min-height:0}.hero-copy{padding:36px 0}.hero h1{letter-spacing:-1px}.hero p{font-size:15px}.hero-mascot{width:85px;max-height:160px}.calendar-section{padding:35px 0 48px}.section-heading{align-items:center}.section-heading p{font-size:14px}.slider-controls button{width:40px;height:42px;font-size:29px}.calendar-track{gap:14px}.calendar-card{flex-basis:100%;padding:8px;border-radius:14px}.calendar-card figcaption{font-size:16px}.footer-grid{grid-template-columns:1fr;gap:24px}.footer{padding-top:32px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.calendar-track{transition:none}}

/* Fotografija škole na početnoj stranici; originalni GIF ostaje u headeru */
.hero-inner{position:relative;isolation:isolate;min-height:385px}
.hero-copy{position:relative;z-index:2;max-width:690px}
.hero-photo{position:absolute;right:0;top:0;bottom:0;width:55%;background:url('/assets/skola-djeca.jpg') center center/cover no-repeat;z-index:0;border-radius:0 0 0 80px}
.hero-inner:before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,#fff9ed 0%,#fff9edf2 34%,#fff9edb0 53%,transparent 78%);pointer-events:none}
@media(max-width:700px){.hero-inner{min-height:400px;align-items:flex-start}.hero-copy{padding:35px 0 170px}.hero-photo{width:100%;top:auto;height:225px;bottom:0;background-position:center 35%;border-radius:0}.hero-inner:before{background:linear-gradient(180deg,#fff9ef 0%,#fff9ef 36%,#fff9efd0 58%,transparent 100%)}.hero h1{font-size:clamp(30px,8vw,43px)}}

/* Naslovnica: koncept s djecom i školom, bez GIF-a u hero sekciji */
.hero-school{background:#fff7ec}
.hero-school .hero-inner{max-width:none;min-height:520px;padding-left:max(24px,calc((100vw - 1232px)/2));padding-right:0}
.hero-school .hero-copy{max-width:600px;width:53%;padding:65px 30px 65px 0}
.hero-school .hero-photo{width:57%;background-position:center 42%;border-radius:0}
.hero-school .hero-inner:before{background:linear-gradient(90deg,#fff7ec 0%,#fff7ec 33%,#fff7eceb 43%,#fff7ec77 55%,transparent 70%)}
.hero-school .eyebrow{color:#d93636;font-size:12px}
.hero-school h1{font-size:clamp(38px,4.3vw,66px);line-height:1.12;letter-spacing:-2px;color:#132c51;margin:16px 0 20px}
.hero-school h1 span{color:#132c51}
.hero-school p{font-size:clamp(17px,1.7vw,23px);line-height:1.55;max-width:535px;color:#39465a}
.hero-school .hero-cta{background:#e52227;border-radius:12px;padding:15px 25px;font-size:17px;box-shadow:0 12px 24px #e5222722}
.hero-school .hero-cta:hover{background:#b9161c}
.hero-benefits{background:white;border-bottom:1px solid #e9edf2}
.benefits-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-top:35px;padding-bottom:35px}
.benefit{display:flex;align-items:flex-start;gap:18px;padding:12px 25px;border-right:1px solid #e5e8ee}
.benefit:first-child{padding-left:0}.benefit:last-child{border-right:0;padding-right:0}
.benefit-icon{font-size:38px;line-height:1.2;flex-shrink:0}
.benefit strong{font-size:19px;line-height:1.3;color:#132c51;display:block;margin-bottom:6px}
.benefit p{font-size:15px;color:#576273;line-height:1.5;margin:0}
@media(max-width:900px){.hero-school .hero-inner{min-height:440px;padding-left:24px}.hero-school .hero-copy{width:57%;padding:55px 20px 55px 0}.hero-school .hero-photo{width:55%}.benefit{padding:12px 15px;gap:10px}.benefit strong{font-size:16px}.benefit-icon{font-size:28px}}
@media(max-width:680px){.hero-school .hero-inner{min-height:0;padding:0 16px 225px;display:block}.hero-school .hero-copy{width:100%;max-width:none;padding:35px 0 25px}.hero-school .hero-photo{width:100%;height:225px;top:auto;bottom:0;background-position:center 40%}.hero-school .hero-inner:before{background:linear-gradient(180deg,#fff7ec 0%,#fff7ec 48%,#fff7ecb0 61%,transparent 82%)}.hero-school h1{font-size:clamp(32px,8vw,46px);letter-spacing:-1px}.hero-school p{font-size:16px}.hero-school .hero-cta{font-size:15px;padding:13px 18px}.benefits-grid{grid-template-columns:1fr;padding-top:12px;padding-bottom:12px}.benefit,.benefit:first-child,.benefit:last-child{padding:16px 4px;border-right:0;border-bottom:1px solid #e5e8ee}.benefit:last-child{border-bottom:0}.benefit strong{font-size:17px}.benefit-icon{font-size:32px}}

/* Ispravak naslovnice: fotografija i tri prednosti */
.hero-school .hero-inner{position:relative;display:flex;align-items:center;min-height:520px;isolation:isolate}
.hero-school .hero-copy{position:relative;z-index:2;flex:0 0 53%;max-width:680px}
.hero-school .hero-photo{position:absolute;z-index:0;right:0;top:0;bottom:0;width:59%;height:100%;overflow:hidden}
.hero-school .hero-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.hero-school .hero-inner::before{z-index:1;pointer-events:none}
.hero-benefits .benefits-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:0;align-items:stretch}
.hero-benefits .benefit{display:flex!important;flex-direction:row!important;align-items:flex-start;min-width:0}
@media(max-width:680px){
.hero-school .hero-inner{display:block;min-height:0;padding-bottom:235px}
.hero-school .hero-copy{width:100%;max-width:none}
.hero-school .hero-photo{top:auto;bottom:0;left:0;width:100%;height:235px}
.hero-school .hero-inner::before{z-index:1}
.hero-benefits .benefits-grid{grid-template-columns:1fr!important}
}
