:root{
  --imperial-blue: #002065ff;
  --true-cobalt: #052887ff;
  --ocean-deep: #2565B4ff;
  --twitter-blue: #2B73B6ff;
  --blue-grey: #729CC5ff;

  --bg: #fbfdff;
  --text: #061226;
  --muted: #6b7a91;
}

/* Base */
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}

/* Header */
header.site-header{position:fixed;top:0;left:0;width:100%;background:#fff;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:24px 40px;transition:all 220ms ease;box-shadow:0 1px 0 rgba(0,0,0,0.04)}
header.site-header .brand{display:flex;align-items:center;gap:14px}
.header-left{display:flex;align-items:center;gap:12px}
header.site-header img.logo{height:52px;transition:height 220ms ease}
nav.top-nav{display:flex;gap:12px;align-items:center}
nav.top-nav a{color:#111;text-decoration:none;font-weight:600;padding:6px 10px;border-radius:8px;transition:color 160ms ease,background 160ms ease}
nav.top-nav a:hover{color:var(--true-cobalt);background:rgba(37,101,180,0.06)}

/* Header right area (Donate button) */
.header-right{display:flex;align-items:center;gap:12px}

/* Button base */
.btn{display:flex;align-items:center;justify-content:center;padding:12px 24px;border-radius:0;font-weight:800;font-size:18px;line-height:1;text-decoration:none;cursor:pointer;min-height:48px}
.btn:focus{outline:3px solid rgba(37,101,180,0.18);outline-offset:3px}

/* Donate variant */
.btn-donate{background:var(--ocean-deep);color:#fff;border:none;box-shadow:0 10px 26px rgba(37,101,180,0.12);font-size:20px;font-weight:900;letter-spacing:0.2px}
.btn-donate:hover{background:var(--true-cobalt)}

@media (max-width:700px){
  .btn{padding:10px 16px;font-size:16px;min-height:44px}
  .btn-donate{font-size:18px}
}

/* removed header CTA styles (Dona removed) */


/* Shrink header on scroll */
header.site-header.shrink{padding:8px 22px;box-shadow:0 6px 24px rgba(2,32,77,0.08)}
header.site-header.shrink img.logo{height:38px}
/* On wide screens we hide the nav when header shrinks to save space; on small screens the nav remains accessible */
@media (min-width: 701px){
  header.site-header.shrink nav.top-nav{opacity:0;visibility:hidden;transform:translateY(-8px);pointer-events:none}
}

/* Respect user preference for reduced motion */
@media (prefers-reduced-motion: reduce){
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

/* Hero */
.hero{height:78vh;min-height:480px;background-image:
  linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.08)),
  url('../assets/Vista.jpg');
  background-position:center;background-size:cover;display:flex;align-items:center}
.hero .container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.hero-title{color:#000;font-size:clamp(36px,6vw,64px);letter-spacing:0.6px;font-weight:800;background:rgba(255,255,255,0.96);padding:12px 18px;border-radius:10px;display:inline-block;box-shadow:0 8px 24px rgba(2,32,77,0.06)}
.hero--dark-image .hero-title{color:#fff;background:rgba(0,0,0,0.55);text-shadow:0 8px 24px rgba(2,32,77,0.6)}
.hero--light-image .hero-title{color:#020617;text-shadow:none} 


/* Nav dropdowns */
.nav-item{position:relative}
.nav-btn{background:none;border:0;font-weight:800;color:#000;cursor:pointer;padding:8px 12px;border-radius:8px;font-size:14px;text-transform:uppercase;letter-spacing:0.6px}
.nav-btn:focus{outline:3px solid rgba(37,101,180,0.18);outline-offset:3px}
.nav-btn:hover{color:var(--true-cobalt);background:none}
.nav-item.open .nav-btn{color:var(--true-cobalt);background:none}
@media (max-width:700px){.nav-btn{font-size:13px}}
.submenu{position:absolute;top:calc(100% + 8px);left:0;background:#fff;border-radius:10px;padding:18px;min-width:520px;max-width:760px;box-shadow:0 12px 40px rgba(16,24,40,0.14);display:none}
.nav-item.open .submenu{display:block}
.submenu-primary{display:block;margin:0 0 12px 0;color:var(--true-cobalt);font-size:22px;font-weight:900;text-decoration:none;padding-bottom:6px;line-height:1.12;-webkit-text-stroke:0.9px rgba(2,32,77,0.14);text-shadow:0 1px 0 rgba(0,0,0,0.06), 0 2px 0 rgba(0,0,0,0.04);letter-spacing:-0.6px}
.submenu-primary:hover{color:#000}
.submenu-primary:focus{outline:3px solid rgba(2,40,135,0.12);outline-offset:3px}

/* Ensure primary submenu link is blue by default and turns black on hover (higher specificity) */
.submenu .submenu-primary{color:var(--true-cobalt)}
.submenu .submenu-primary:hover{color:#000}

/* Secondary links slightly smaller to emphasize primary */
.submenu .submenu-links a{font-size:14px}

@media (max-width:700px){
  .submenu-primary{font-size:18px}
}
.submenu .submenu-links{column-count:2;column-gap:28px}
.submenu a{display:block;color:var(--text);text-decoration:none;padding:6px 0;border-radius:6px}
.submenu a:hover{color:var(--true-cobalt)}
.submenu a:focus{outline:2px solid rgba(37,101,180,0.18);background:rgba(37,101,180,0.03)}

/* Info sections */
.info-section{display:flex;gap:24px;align-items:center;margin:48px auto;padding:24px;border-top:1px solid rgba(2,32,77,0.06);}
.info-section img{width:48%;height:320px;object-fit:cover;border-radius:10px}
.info-section .info-content{width:52%}
.info-section h2{color:var(--imperial-blue);margin-bottom:8px}
.info-section + .info-section{margin-top:28px}

/* Footer tweaks */
.footer-column strong{font-size:1.15rem;margin-bottom:10px;display:block}

/* Newsletter removed (footer simplified) */

/* Accessibility helper */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Sections */
.sections{max-width:1200px;margin:48px auto;padding:0 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
.card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 8px 28px rgba(16,24,40,0.06);transition:transform 160ms ease}
.card:hover{transform:translateY(-6px)}
.card h3{margin-bottom:10px;color:var(--imperial-blue)}
.card p{color:var(--muted);line-height:1.6}

/* Footer */
footer.site-footer{background:var(--imperial-blue);color:#e7f2ff;padding:72px 24px;margin-top:48px}
.site-footer .footer-inner{max-width:1200px;margin:0 auto;display:flex;gap:28px;flex-wrap:wrap;align-items:flex-start}
.footer-column{flex:1;min-width:180px}
.footer-links a{display:block;color:#e7f2ff;text-decoration:none;margin:8px 0}
.footer-links strong{display:block;margin-bottom:8px}
.footer-social{display:flex;gap:12px;margin-top:12px}
.footer-social a svg{width:22px;height:22px;fill:#e7f2ff;transition:transform 160ms ease}
.footer-social a:hover svg{transform:translateY(-3px)}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.06);margin-top:28px;padding-top:18px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}
.footer-bottom small{opacity:0.9}

/* Responsive tweaks */
@media (max-width:700px){
  header.site-header{padding:10px 16px}
  .header-left{gap:8px}
  nav.top-nav{gap:8px}
  .hero{min-height:420px}
  .submenu{left:0;right:auto;min-width:220px}
}
