/* site.css — zajednički side-menu i mobilna prilagodba za sve stranice Festorie. Uključi u : (Boje i font dolaze iz :root svake stranice.) */ /* hamburger gumb (skriven na desktopu) */ .menu-toggle{ display:none;background:none;border:none;cursor:pointer; flex-direction:column;gap:5px;padding:6px;z-index:120; } .menu-toggle span{width:24px;height:2px;background:var(--ink);display:block;transition:.3s} .menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)} .menu-toggle.open span:nth-child(2){opacity:0} .menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)} /* zatamnjenje pozadine kad je meni otvoren */ .menu-backdrop{ position:fixed;inset:0;background:rgba(21,48,42,.45); opacity:0;visibility:hidden;transition:.3s;z-index:100; } .menu-backdrop.open{opacity:1;visibility:visible} /* off-canvas side menu (izlazi s desne strane) */ .side-menu{ position:fixed;top:0;right:0;height:100%;width:300px;max-width:84vw; background:var(--ink);color:var(--paper); transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1); z-index:110;display:flex;flex-direction:column;padding:30px 26px; box-shadow:-20px 0 60px rgba(21,48,42,.3); } .side-menu.open{transform:translateX(0)} .side-menu .sm-logo{ font-weight:900;font-size:20px;letter-spacing:.12em;text-transform:uppercase; display:flex;align-items:center;gap:10px;margin-bottom:34px;text-decoration:none;color:var(--paper); } .side-menu .sm-logo .dot{width:9px;height:9px;background:var(--gold);border-radius:50%} .side-menu a.sm-link{ text-decoration:none;color:var(--paper); font-size:15px;font-weight:600;letter-spacing:.04em; padding:16px 0;border-bottom:1px solid #2a4940;transition:color .2s, padding-left .2s; } .side-menu a.sm-link:hover{color:var(--gold-soft);padding-left:6px} .side-menu .sm-cta{ margin-top:26px;background:var(--gold);color:var(--ink);text-align:center; padding:15px;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase; text-decoration:none;transition:background .2s; } .side-menu .sm-cta:hover{background:var(--gold-soft)} .side-menu .sm-foot{margin-top:auto;font-size:11px;color:#7e8f85;letter-spacing:.04em;padding-top:20px} .side-menu .sm-foot a{color:#9fb0a6;text-decoration:none;display:block;margin-top:6px} /* na mobitelu: sakrij desktop nav, pokaži hamburger */ @media(max-width:860px){ .nav, .nav-links{display:none !important} .menu-toggle{display:flex} } /* spriječi scroll tijela kad je meni otvoren */ body.menu-locked{overflow:hidden} /* ---- zajednički footer (ubacuje ga site.js na stranice bez footera) ---- */ .site-footer{max-width:1280px;margin:60px auto 0;padding:60px 28px 40px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;border-top:1px solid var(--line)} .site-footer .sf-logo{font-weight:900;font-size:20px;letter-spacing:.12em;text-transform:uppercase} .site-footer .sf-logo + p{font-size:13px;color:var(--muted);margin-top:14px;max-width:300px} .site-footer h4{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px} .site-footer a{display:block;text-decoration:none;color:var(--muted);font-size:13px;margin-bottom:10px;transition:color .2s} .site-footer a:hover{color:var(--ink)} .site-foot-bottom{max-width:1280px;margin:0 auto;padding:22px 28px 40px;font-size:11px;color:var(--muted);letter-spacing:.08em} @media(max-width:640px){ .site-footer{grid-template-columns:1fr;gap:30px} }