/* Common site-wide styles: header, footer, base layout */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;color:#1b1f2a;background:#f7f8fb}
html { scroll-behavior: smooth; }

.container{width:min(1200px,92%);margin:0 auto}
.center{text-align:center}

/* Header */
.site-header{background:#0a1f57;color:#fff;position:sticky;top:0;z-index:100;box-shadow:0 2px 8px rgba(0,0,0,.2)}
/* Homepage: translucent header over hero, solid on scroll */
.page-home .site-header{background:rgba(10,31,87,.85);backdrop-filter:saturate(120%) blur(4px)}
.page-home.scrolled .site-header{background:#0a1f57;backdrop-filter:none}
.nav-grid{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0}
.brand-link{display:flex;align-items:center;gap:8px;color:#e6eeff;text-decoration:none}
.brand img{height:34px}
.brand-text{display:flex;flex-direction:column;line-height:1.05}
.brand-title{font-weight:800;font-size:15px;color:#e6eeff}
.brand-sub{font-size:11px;color:#cfe2ff}
@media (max-width: 1024px){.brand-sub{display:none}}
.nav{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
@media (min-width: 900px){.nav{flex-wrap:nowrap}}
.nav-link{color:#e6eeff;text-decoration:none;font-weight:500;padding:10px 12px;border-radius:6px}
.nav-link:hover{color:#fff;background:#0c2a7a}
.nav-link.active{background:transparent;color:#fff;border-bottom:2px solid #facc15}
.nav-link:focus-visible,.brand-link:focus-visible{outline:2px solid #facc15;outline-offset:2px}
/* Header CTA */
.nav-cta{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(90deg,#0ea5e9,#0c2a7a);color:#fff;padding:8px 12px;border-radius:10px;text-decoration:none;font-weight:600}
.nav-cta:hover{background:linear-gradient(90deg,#0284c7,#0a1f57)}
.nav-item{position:relative;display:flex;align-items:center}
.nav-contact .contact-popup{position:absolute;left:0;top:calc(100% + 8px);background:#fff;color:#0f172a;border:1px solid #e5e7eb;border-radius:10px;box-shadow:0 10px 24px rgba(0,0,0,.15);min-width:280px;max-width:360px;padding:10px 12px;display:none;opacity:0;visibility:hidden;transform:translateY(-8px);transition:transform .18s ease,opacity .18s ease}
.nav-contact .contact-popup:before{content:"";position:absolute;top:-7px;left:16px;width:14px;height:14px;background:#fff;border-left:1px solid #e5e7eb;border-top:1px solid #e5e7eb;transform:rotate(45deg)}
.nav-contact:hover .contact-popup,
.nav-contact:focus-within .contact-popup{display:block;opacity:1;visibility:visible;transform:translateY(0);transition-delay:0s;pointer-events:auto}
.contact-list{list-style:none;margin:0;padding:0}
.contact-item{padding:8px 4px;border-bottom:1px solid #f0f2f7}
.contact-item:last-child{border-bottom:0}
.contact-label{display:block;font-size:.85rem;color:#64748b;margin-bottom:2px}
.contact-item a{color:#1e40af;text-decoration:none}
.contact-item a:hover{text-decoration:underline}

/* Mobile navigation */
.nav-toggle{display:none;appearance:none;background:transparent;border:0;color:#e6eeff;padding:8px;cursor:pointer;border-radius:8px}
.nav-toggle:focus-visible{outline:2px solid #facc15;outline-offset:2px}
.nav-toggle .bar{display:block;width:22px;height:2px;background:#e6eeff;margin:5px 0;border-radius:2px}
.nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);opacity:0;visibility:hidden;transition:opacity .2s ease;pointer-events:none;z-index:1000}
.nav-overlay.open{opacity:1;visibility:visible;pointer-events:auto}
@media (max-width:900px){
  .nav-toggle{display:inline-grid}
  .nav{position:fixed;top:0;right:0;height:100vh;width:78vw;max-width:360px;background:#0a1f57;box-shadow:-2px 0 12px rgba(0,0,0,.25);padding:16px;gap:8px;flex-direction:column;align-items:stretch;transform:translateX(100%);transition:transform .2s ease;z-index:1001}
  .nav.is-open{transform:translateX(0)}
  .nav-grid{gap:6px}
  /* Prevent desktop contact hover behavior on mobile */
  .nav-contact .contact-popup{position:static;display:none;opacity:1;visibility:visible;transform:none;border:none;box-shadow:none;padding:0;margin:0}
}

/* Footer */
.site-footer{background:radial-gradient(1600px 240px at 15% 0%,#eef6ff,transparent 60%),radial-gradient(1200px 240px at 85% 0%,#eaf3ff,transparent 60%),linear-gradient(180deg,#f8fbff,#ecf3ff);color:#334155;position:relative;z-index:1;border-top:4px solid #facc15}
.footer-bottom .footer-back-to-top{margin-left:8px}
.site-footer h4{margin:0 0 8px;font-size:18px;color:#0f172a}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.footer-brand img{height:44px}
.footer-brand .brand-lines{line-height:1.1}
.footer-brand .name{font-weight:700}
.footer-brand .org{font-size:12px;color:#64748b}
.footer-title{display:flex;align-items:center;gap:8px}
.footer-title .icon{font-size:14px}
.footer-title .icon.orange{color:#f97316}
.footer-title .icon.purple{color:#7c3aed}
.footer-title .icon.blue{color:#2563eb}
.footer-grid{padding:36px 0;display:grid;gap:26px}
@media (min-width:900px){.footer-grid{grid-template-columns:1fr 1fr 1fr}}
.footer-grid>div{background:#fff;border:1px solid #e9eef8;border-radius:12px;box-shadow:0 6px 16px rgba(20,24,38,.06);padding:16px}
.site-footer a{color:#1e40af;text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.footer-gallery{display:flex;gap:8px;flex-wrap:wrap}
.footer-gallery img{width:120px;border-radius:6px}
.footer-bottom{background:#e9f0fb;text-align:center;padding:14px;font-size:13px;color:#64748b}

/* Global messages (Django messages framework) */
.messages{width:min(1200px,92%);margin:12px auto}
.alert{border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;margin:8px 0;background:#fff;color:#0f172a;box-shadow:0 4px 12px rgba(20,24,38,.06)}
.alert.success{background:#ecfdf5;border-color:#a7f3d0;color:#065f46}
.alert.error{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.alert.warning{background:#fffbeb;border-color:#fde68a;color:#92400e}
.alert.info{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}