//style.css
/* ========== Theme Tokens ========== */
:root{
  --navy:#0d1117;      /* solid dark navy (match logo background) */
  --navy-2:#1e2a44;    /* optional accent used in hero gradient */
  --gold:#FFD447;
  --ink:#0b1220;       /* dark text on white */
  --muted:#475569;     /* body copy on white */
  --radius:16px;
  --shadow:0 10px 25px rgba(0,0,0,.15);
}

*{ box-sizing:border-box }
html,body{ height:100% }
html{ scroll-behavior:smooth }
body{
  margin:0;
  font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  color:#e5e7eb;
  background:#000; /* page base; sections override */
}

/* =========================
   NAVIGATION BAR
   ========================= */
.topbar{
  position:fixed; inset:0 0 auto 0; height:64px;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 16px;
  background:var(--navy);
  border-bottom:1px solid rgba(255,255,255,.08);
  z-index:1000;
}
.topbar .brand{ display:flex; align-items:center; gap:.5rem; }
.topbar .brand-logo{ display:block; height:40px; width:auto; }
.brand-logo--slim{ height:44px; width:auto; display:block; filter:drop-shadow(0 3px 10px rgba(0,0,0,.35)); }
.topbar .brand-text{ display:none !important; }

.nav-links{ display:none; align-items:center; gap:.75rem; }
.topbar .nav-links a{
  color:#fff; margin-left:1rem; text-decoration:none; font-weight:500;
}
.topbar .nav-links a:hover,
.topbar .nav-links a[aria-current="page"]{ color:var(--gold); }

.topbar .button.small{
  background:var(--gold); color:#000; border-radius:var(--radius);
  padding:.4rem .9rem; font-size:.85rem; margin-left:1rem; text-decoration:none;
  box-shadow:0 10px 26px rgba(255,212,71,.28);
}
.topbar .button.small:hover{ background:#fff; color:#000; }

.hamburger{
  display:inline-flex; flex-direction:column; justify-content:center; gap:5px;
  width:42px; height:42px; padding:0; border:none; background:transparent; cursor:pointer;
}
.hamburger span{
  display:block; width:22px; height:2px; background:#fff; border-radius:2px;
  transition:transform .2s ease, opacity .2s ease, width .2s ease;
}
.hamburger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); width:22px; }
.hamburger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamburger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); width:22px; }

@media (min-width:992px){
  .nav-links{ display:flex; }
  .hamburger{ display:none; }
  .brand-logo--slim{ height:52px; }
  .topbar{ height:72px; }
}

/* =========================
   MOBILE MENU
   ========================= */
[hidden]{ display:none !important; }
.menu-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:900; }
.menu-panel{
  position:fixed; inset:64px 0 0 auto; width:min(320px,86vw); height:calc(100dvh - 64px);
  background:#000; border-left:1px solid rgba(255,255,255,.08); box-shadow:-18px 0 28px rgba(0,0,0,.35);
  padding:1rem; z-index:950; display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform .22s ease;
}
body.menu-open #mobileMenu{ transform:translateX(0); }
body.menu-open #menuBackdrop{ display:block !important; }
body.menu-open{ overflow:hidden; }

.menu-nav{ display:flex; flex-direction:column; gap:.5rem; width:100%; }
.menu-panel a{
  color:#fff; margin-bottom:1rem; text-decoration:none; font-size:1rem;
  padding:.8rem .9rem; border-radius:10px;
}
.menu-panel a:hover,
.menu-panel a[aria-current="page"]{ color:var(--gold); }

/* Hide scroll cue on mobile */
@media (max-width: 768px) {
  .scroll-cue {
    display: none !important;
  }
}

/* =========================
   HERO
   ========================= */
.hero {
  padding-top: 100px;        /* keep clear of topbar */
  padding-bottom: 60px;      /* breathing room below */
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 1rem;
  text-align: center;
  background: #0d1117;       /* dark navy */
  color: #e5e7eb;
  min-height: auto;          /* remove full-screen lock */
}

.hero-logo-full {
  width: 90vw;               /* fills most of the screen width on mobile */
  max-width: 600px;          /* cap size so it doesn’t get huge */
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 12px 28px rgba(0,0,0,.45));
  margin-top: -20px;         /* optional: pull slightly up if too low */
}

/* Larger screens (desktop/laptops) */
@media (min-width: 992px) {
  .hero-logo-full {
    max-width: 900px;        /* bigger on desktops */
    width: 70vw;             /* but not edge-to-edge */
  }
}
/* =========================
   LIGHT CONTENT
   ========================= */
.light{ background:#fff; color:var(--ink); -webkit-font-smoothing:auto; text-rendering:optimizeSpeed; }
.section-block{
  max-width:1100px; margin:0 auto;
  padding:clamp(1rem,2.2vw,1.75rem) clamp(1rem,2.6vw,1.85rem);
  border-bottom:1px solid #eef2f7;
}
.section-block.slim{ max-width:900px; }
h2{ margin:0 0 .5rem; color:#0b1220; font-size:clamp(1.25rem,1.2vw + 1rem,1.6rem); }
.section-block p{ margin:.5rem 0 0; color:var(--muted); line-height:1.65; }
.why{ font-weight:600; color:#0b1220; }

/* =========================
   FOOTER (match logo background)
   ========================= */
footer {
  background: var(--navy, #0d1117);
  padding: 2rem 1rem;
  text-align: center;
  font-size: 0.95rem;
}

/* Default muted text (off-white/grayish) */
.footer-copy,
.footer-vet {
  color: #d1d5db; /* soft off-white/gray */
  margin: 0.35rem 0;
}

/* Info + Social clickable links = gold */
.footer-info a,
.footer-social a {
  color: var(--gold, #FFD447);
  text-decoration: none;
  margin: 0 0.3rem;
}

.footer-info a:hover,
.footer-social a:hover {
  text-decoration: underline;
}

/* Social label */
.footer-social {
  margin-top: 0.75rem;
  font-weight: 600;
}

.footer-social span {
  margin-right: 0.25rem;
  color: #d1d5db; /* keep "Follow us:" off-white */
}

/* =========================
   FINAL OVERRIDES
   ========================= */
.light,
.light .section-block,
.light .section-block p,
.light p{
  color:#0b1220 !important;
  -webkit-font-smoothing:auto !important;
  text-rendering:optimizeSpeed !important;
}
.light h2{ color:#0b1220 !important; }
.nav-links .button{
  background:#FFD447 !important;
  color:#1b2234 !important;
  box-shadow:0 10px 26px rgba(255,212,71,.28) !important;
}

/* ===== HARD PRODUCTION OVERRIDES (keep these last) ===== */
/* Ensure topbar/footer always match the logo navy even if something else overrides earlier */
.topbar { background:#0d1117 !important; }
footer  { background:#0d1117 !important; }

/* ===== HARD OVERRIDE: Footer Links Always Gold ===== */
footer a,
footer a:link,
footer a:visited,
footer a:hover,
footer a:active,
footer a:focus {
  color: #FFD447 !important;        /* Force gold */
  text-decoration: none !important;
  font-weight: 600 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  outline: none !important;
}

/* Hover effect: underline only */
footer a:hover,
footer a:focus {
  text-decoration: underline !important;
}