/* ===== Cash.Land Header & Primary Nav ===== */

/* Prevent layout shift when locking body scroll for the mobile drawer */
html { scrollbar-gutter: stable; }

/* Skip link for a11y */
.skip-link{
  position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus,
.skip-link:focus-visible{
  left:12px; top:12px; width:auto; height:auto; overflow:visible;
  background:#000; color:#fff; padding:8px 12px; border-radius:6px; z-index:10000; outline:2px solid #fff;
}

/* Header (logo + call text) */
.custom-header{ position:relative; z-index:1; }
.custom-header .header-inner{
  max-width:1200px; margin:0 auto; padding:50px 0;
  display:flex; justify-content:space-between; align-items:center; gap:15px;
}
.site-logo img{ width:100%; max-width:260px; height:auto; vertical-align:middle; }
.custom-header .call-text{ text-align:right; font-size:1.05rem; line-height:1.6; }
.custom-header .call-text span{ color:#000; font-weight:500; }
.custom-header .call-text a{
  color:var(--accent-dark, #0e7f23); font-weight:800; text-decoration:none; font-size:1.3rem; transition:color .2s, text-decoration .2s;
}
.custom-header .call-text a:hover{ color:var(--accent, #1dbd3d); text-decoration:underline; }

/* Nav wrapper (brand gradient) */
nav.main-nav-wrapper{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  position:relative; z-index:9999;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.08), 0 1px 0 rgba(0,0,0,.08);
  background-image:linear-gradient(180deg, #0E7F23 0%, #0B6A1D 100%);
  border-bottom:1px solid #69f169b3; 
}
.main-nav-inner{
  max-width:1200px; margin:0 auto; padding:14px 16px;
  display:flex; justify-content:center; align-items:center; flex-wrap:wrap;
}

/* Hover polish */
.main-nav-wrapper a:hover{ color:#caffbf;  text-decoration:none; }

/* Hamburger button */
.menu-toggle{
  position:relative; display:none;
  width:44px; height:44px; min-width:44px; min-height:44px; border-radius:9999px;
  border:1px solid #2ba000; background:rgba(255,255,255,.10); color:#fff; cursor:pointer;
  box-shadow:0 8px 18px rgba(0,0,0,.25); font-size:0; line-height:1;
}
.menu-toggle:hover,
.menu-toggle:focus{ background:rgba(255,255,255,.15); outline:2px solid var(--mint, #1DFD5C); outline-offset:2px; }

/* Hamburger bars */
.menu-toggle{ --bar-w:20px; --bar-h:2px; --bar-gap:6px; }
.menu-toggle{
  background-image:linear-gradient(currentColor, currentColor);
  background-repeat:no-repeat; background-size:var(--bar-w) var(--bar-h); background-position:50% 50%;
}
.menu-toggle::before,
.menu-toggle::after{
  content:""; position:absolute; left:50%; top:50%;
  width:var(--bar-w); height:var(--bar-h); background:currentColor;
  transform-origin:50% 50%; transition:transform .18s ease, opacity .18s ease;
}
.menu-toggle::before{ transform:translate(-50%, calc(-50% - var(--bar-gap))); }
.menu-toggle::after { transform:translate(-50%, calc(-50% + var(--bar-gap))); }

/* Animate to X */
.menu-toggle[aria-expanded="true"]{ background-size:0 0; }
.menu-toggle[aria-expanded="true"]::before{ transform:translate(-50%, -50%) rotate(45deg); }
.menu-toggle[aria-expanded="true"]::after { transform:translate(-50%, -50%) rotate(-45deg); }

@media (prefers-reduced-motion:reduce){
  .menu-toggle, .menu-toggle::before, .menu-toggle::after{ transition:none; }
}

/* Menu base */
.main-menu{
  display:flex; gap:27px; flex-wrap:wrap; align-items:center;
  list-style:none; margin:0; padding:0;
  justify-content:flex-start;
}
.main-menu > li{ list-style:none; text-shadow:0 1px 1px rgba(0,0,0,.25); letter-spacing:.02rem; }
.main-menu a{
  color:#fff; text-decoration:none; font-weight:800; font-size:1.08rem;
  padding:8px 12px; border-radius:8px; transition:background .25s, color .25s, border-color .25s;
}
.main-menu a:hover{ background:rgba(255,255,255,.12); }
.main-menu a[aria-current="page"]{ border-bottom:2px solid #caffbf; }

/* Dropdown (desktop) */
.has-sub{ position:relative; }
.has-sub > .top-link{ font-size:1.25rem; padding-right:26px; position:relative; }
.has-sub > .top-link::after{
  content:"▾"; position:absolute; right:8px; top:50%; transform:translateY(-45%); font-size:.8em; opacity:.9;
}
.has-sub .sub{
  position:absolute; left:0; top:100%; min-width:240px; padding:10px; margin-top:11px; 
  display:none; z-index:99; list-style:none;
}
.has-sub .sub a{
  display:block; margin:0 0 8px 0; padding:12px; border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(135deg, #0f8f2b, #0e6a1b);
  color:#fff; font-weight:800; font-size:1.05rem;
}
.has-sub .sub a:hover{ color:#caffbf; }
.has-sub:hover > .sub,
.has-sub:focus-within > .sub{ display:block; }
.sub-toggle{ display:none; }

/* CTA in menu */
li.menu-cta > a{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; border-radius:10px; cursor:pointer;
  font-weight:700; letter-spacing:.2px;  color:#fff;
  background:linear-gradient(180deg, var(--cl-brand-500, #1dbd3d), var(--cl-brand-700, #0e7f23));
  box-shadow:0 10px 24px rgba(0,0,0,.15); text-decoration:none; border:2px solid #cfe9d6; padding: 8px 25px;
}
li.menu-cta > a:hover{ 
  filter:brightness(1.05);
  transform:translateY(-1px);
  text-decoration:none;
  color:#fff;
  background:linear-gradient(180deg,#17b238,#0c721f);
}
li.menu-cta > a:focus-visible{ outline:3px solid var(--cl-focus, #ffcf4d); outline-offset:2px; border-radius:12px; }

/* Desktop guards + CTA to right on desktop */
@media (min-width:769px){
  .menu-toggle{ display:none; }
  .main-menu{ display:flex; }
  .has-sub::after{ content:""; position:absolute; left:0; right:0; top:100%; height:10px; }
  .main-menu .menu-cta{ margin-left:auto; }
}

/* Focus styling */
.main-nav-wrapper a:focus-visible,
.main-nav-wrapper button:focus-visible{ outline:2px solid var(--mint, #1DFD5C); outline-offset:2px; border-radius:8px; }

/* Minor responsive polish */
@media (max-width:1220px){
  .custom-header{ position:relative; z-index:1; }
  .custom-header .header-inner{ padding:40px 16px; }
}

/* Header tweaks mobile */
@media (max-width:768px){
  .custom-header .header-inner{ 
    flex-direction:column; align-items:center; text-align:center; padding:20px 16px;
  }
  .custom-header .call-text{ text-align:center; }
  .custom-header .call-text a{ font-size:1.25rem; color:#0d32c6; font-weight:600; line-height:3; margin-right: 25px; }
}

/* Emoji tint */
.emoji { color:green; }

/* Desktop layout balance */
@media (min-width:769px){
  .main-nav-inner { justify-content:flex-start; }
  .main-menu { width:100%; flex:1 1 auto; }
  .main-menu > li.menu-cta { margin-left:auto; }
}

/* =======================
   MOBILE DRAWER (merged)
   ======================= */
@media (max-width:768px){
  .menu-toggle{ display:inline-flex; align-items:center; justify-content:center; margin:6px auto 8px; position:sticky; top:6px; z-index:10001; }
  .main-nav-inner{ flex-direction:column; position:relative; }

  .main-menu{
    display:none; flex-direction:column; align-items:stretch;
    width:100%; margin-top:6px; gap:0; flex-wrap:nowrap;
    padding-inline-start:40px; padding-inline-end:40px;
  }
  body.nav-open .main-menu, .main-menu.show{ display:flex; }

  .main-menu > li{
    border-top:1px solid rgba(255,255,255,.05);
    border-radius:12px; margin:0;
  }
  .main-menu a{
    display:block; width:100%;
    padding-block:14px; padding-inline:12px;
    white-space:normal; word-break:break-word; line-height:1.25;
  }
  .main-menu > li + li { margin-top:6px; }

  .sub-toggle{
    display:block; position:absolute; right:6px; top:50%; transform:translateY(-50%);
    width:36px; height:36px; border:none; background:transparent; color:#fff; cursor:pointer; line-height:1; padding:0; z-index:2;
  }
  .sub-toggle::before{ content:"▸"; font-size:1rem; }
  .has-sub.open .sub-toggle::before{ content:"▾"; }
  .has-sub .sub{ position:static; display:none; box-shadow:none; margin:0; padding:6px; border-radius:10px; }
  .has-sub.open .sub{ display:block; }
  nav.main-nav-wrapper .has-sub.always-open .sub{ display:block; border-top:none; }
  nav.main-nav-wrapper .has-sub.always-open .sub-toggle{ display:none; }

  li.menu-cta > a{
    width:100%; margin:2rem 0 1.5rem; 
    box-shadow:1px 9px 26px rgba(0,0,0,.04);
  }

  /* Drawer overlay + scroll lock */
  .nav-overlay{
    position:fixed; inset:0; background:rgba(0,0,0,.4);
    opacity:0; pointer-events:none; transition:opacity .2s ease; z-index:9998;
  }
  body.nav-open .nav-overlay{ opacity:1; pointer-events:auto; }

  body.nav-open nav.main-nav-wrapper{
    min-height:100vh;
    background-image:linear-gradient(180deg,#0E7F23 0%, #0B6A1D 100%);
    background-size:cover;
  }
  body.nav-open .main-nav-inner{
    display:flex; flex-direction:column; align-items:center;
  }
  body.nav-open #main-menu{
    flex:1 1 auto; overflow-y:auto; padding-bottom:3rem;
    position:relative; z-index:10000;
    max-height:calc(100vh - 140px);
    -webkit-overflow-scrolling:touch; touch-action:pan-y;
    margin-top: 25px;
  }

  .main-menu > .pulse { animation:pulse 5s infinite ease-in-out; }
  nav.main-nav-wrapper{ box-shadow:none; }
  #main-menu { overflow:hidden; }
  li.menu-cta { border-top:none; overflow:hidden; border-radius:12px; }
}

/* Utility safety */
html, body { overflow-x:hidden; }





/* === Mobile menu inset + CTA fix (Cash.Land optimized) === */
@media (max-width: 768px){



  /* Prevent "Get a Cash Offer for Your Land" from breaking awkwardly */
  li.menu-cta > a{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    white-space: normal;          /* allow wrapping if needed */
    word-break: keep-all;
    text-wrap: balance;           /* nicer multi-line balance */
    font-size: clamp(15px, 3.9vw, 17px);
    line-height: 1.2;
    padding: 18px 14px;
    min-height: 48px;             /* solid tap target */
  }
}

/* Optional ultra-small screen tweak (Pixel 8 or smaller) */
@media (max-width: 400px){
  li.menu-cta > a{
    font-size: 15px;
    line-height: 1.18;
  }
}


