:root{
  --green:#1eb53a; --dark:#0b2e13; --ink:#1a1a1a; --muted:#3a4a3f;
  --card:#ffffff; --line:#1eb53a;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink); background:#fff; min-height:100vh; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:#157a29}
.bg{position:fixed; top:0; right:0; bottom:0; left:0; z-index:-2;
  background:url("/assets/bg.jpg") center/cover no-repeat; opacity:.85}
.veil{position:fixed; top:0; right:0; bottom:0; left:0; z-index:-1; background:rgba(255,255,255,.30)}

/* containers */
main{max-width:900px; margin:0 auto; padding:26px 18px 44px}
main.home-main{max-width:540px; padding:28px 18px 40px}

/* top logo on inner pages (links home) */
.toplogo{display:block; width:64px; height:64px; margin:0 auto 18px}
.toplogo img{width:100%; height:100%; display:block}

/* shared footer */
.foot{text-align:center; margin-top:22px}
.foot span{display:inline-block; background:#fff; border:1px solid rgba(30,181,58,.35);
  border-radius:999px; padding:7px 16px; font-size:13px; color:var(--muted);
  box-shadow:0 4px 14px rgba(11,46,19,.14)}
.foot span a{color:#157a29; text-decoration:none; font-weight:600}
.foot span a:hover{text-decoration:underline}

/* ---- homepage card ---- */
.home .card{background:var(--card); border:3px solid var(--line); border-radius:14px;
  padding:22px 20px; box-shadow:0 10px 30px rgba(11,46,19,.18)}
.home .logo{display:block; width:172px; height:172px; margin:0 auto 14px}
.home h1{margin:0 0 10px; text-align:center; text-transform:uppercase; font-weight:900;
  letter-spacing:.01em; line-height:1.04; color:var(--dark);
  font-size:clamp(27px,7.2vw,40px)}
.home .sub{margin:0 auto 18px; max-width:30em; text-align:center; color:var(--muted);
  font-size:16px}
.home ul.points{list-style:none; margin:0 auto 22px; padding:0; display:grid; gap:9px;
  max-width:21em}
.home ul.points li{position:relative; padding-left:30px; font-weight:600; font-size:16px}
.home ul.points li::before{content:""; position:absolute; left:0; top:5px; width:16px; height:16px;
  border-radius:50%; background:var(--green);
  box-shadow:inset 0 0 0 4px #fff, 0 0 0 1px var(--green)}
.home .cta{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px}
.home .btn{flex:1 1 200px; display:block; text-align:center; padding:14px 16px;
  border-radius:10px; font-weight:800; font-size:16px; text-decoration:none; letter-spacing:.01em}
.home .btn-green{background:#157a29; color:#fff}
.home .btn:active{transform:translateY(1px)}
.home .links{text-align:center; font-size:14px; color:var(--muted)}
.home .links a{color:#157a29; text-decoration:none; font-weight:600; white-space:nowrap}
.home .links a:hover{text-decoration:underline}
.home .links span{opacity:.5; padding:0 6px}

/* ---- exploding hamburger menu ---- */
.burger{position:fixed; top:16px; right:16px; z-index:100; width:48px; height:48px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:#fff; border:2px solid var(--green); border-radius:50%;
  box-shadow:0 4px 14px rgba(11,46,19,.25); cursor:pointer; padding:0}
.burger span{display:block; width:22px; height:3px; margin:2.5px 0; border-radius:2px; background:var(--green);
  transition:transform .35s cubic-bezier(.68,-0.55,.27,1.55), opacity .2s}
body.nav-open .burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}
body.nav-open .burger span:nth-child(2){opacity:0; transform:scaleX(.2)}
body.nav-open .burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.menu{position:fixed; top:0; right:0; bottom:0; left:0; z-index:90; background:#0b2e13;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
  opacity:0; visibility:hidden; transition:opacity .28s ease; overflow-y:auto; padding:40px 0}
body.nav-open .menu{opacity:1; visibility:visible}
.menu .menu-logo{display:block; width:90px; height:90px; margin:auto auto 16px}
.menu .menu-logo img{width:100%; height:100%; display:block; opacity:0; transform:scale(.5);
  transition:opacity .4s, transform .5s cubic-bezier(.2,.9,.3,1.4)}
body.nav-open .menu .menu-logo img{opacity:1; transform:none; transition-delay:.04s}
.menu-links{display:flex; flex-direction:column; align-items:center; gap:8px; margin-bottom:auto}
.menu-links a, .menu-links summary{color:#fff; text-transform:uppercase; font-weight:900; letter-spacing:.02em;
  text-decoration:none; font-size:clamp(20px,5.6vw,28px); padding:5px 10px; cursor:pointer; list-style:none}
.menu-links summary::-webkit-details-marker{display:none}
.menu-links > *{opacity:0; transform:translateY(26px) scale(.6);
  transition:opacity .4s ease, transform .5s cubic-bezier(.2,.9,.3,1.45), color .15s}
body.nav-open .menu-links > *{opacity:1; transform:none}
body.nav-open .menu-links > *:nth-child(1){transition-delay:.10s}
body.nav-open .menu-links > *:nth-child(2){transition-delay:.15s}
body.nav-open .menu-links > *:nth-child(3){transition-delay:.20s}
body.nav-open .menu-links > *:nth-child(4){transition-delay:.25s}
body.nav-open .menu-links > *:nth-child(5){transition-delay:.30s}
body.nav-open .menu-links > *:nth-child(6){transition-delay:.35s}
body.nav-open .menu-links > *:nth-child(7){transition-delay:.40s}
body.nav-open .menu-links > *:nth-child(8){transition-delay:.45s}
body.nav-open .menu-links > *:nth-child(9){transition-delay:.50s}
body.nav-open .menu-links > *:nth-child(10){transition-delay:.55s}
body.nav-open .menu-links > *:nth-child(11){transition-delay:.60s}
body.nav-open .menu-links > *:nth-child(12){transition-delay:.65s}
body.nav-open .menu-links > *:nth-child(13){transition-delay:.70s}
body.nav-open .menu-links > *:nth-child(14){transition-delay:.75s}
.menu-links a:hover, .menu-links summary:hover{color:var(--green)}
.menu-links a:active{transform:scale(.96)}
.particle{position:fixed; width:9px; height:9px; border-radius:50%; margin:-4px 0 0 -4px;
  pointer-events:none; z-index:96}

:focus-visible{outline:3px solid var(--green); outline-offset:2px}

@media (prefers-reduced-motion: reduce){
  .burger span,.menu,.menu .menu-logo img,.menu-links > *{transition:none !important}
  .menu-links > *,.menu .menu-logo img{transform:none !important; opacity:1 !important}
}

/* ============================================================
   Responsive layer for inline-styled content pages (main.page)
   Scoped so the homepage (.home / main.home-main) is untouched.
   ============================================================ */

/* never let a long word push the layout wider than the screen */
main.page{ overflow-wrap:break-word; }
main.page h1, main.page h2, main.page h3,
main.page p, main.page li, main.page a, main.page div{ overflow-wrap:break-word; }

/* responsive card grids: cap the track at 100% so single columns
   never overflow on Fold-class (~280px) screens */
main.page [style*="minmax(280px, 1fr)"]{
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 280px), 1fr)) !important;
}

/* tablet portrait / large phone */
@media (max-width:600px){
  main.page{ padding-left:14px; padding-right:14px; }
}

/* phones */
@media (max-width:480px){
  main.page h1{ font-size:27px !important; letter-spacing:.4px !important; line-height:1.12 !important; }
  main.page h2{ font-size:20px !important; letter-spacing:.4px !important; line-height:1.2 !important; }
  main.page h3{ font-size:17px !important; }
  main.page{ padding-left:12px; padding-right:12px; }
  /* let the two renewal cards shrink and stack cleanly */
  main.page [style*="min-width: 240px"]{ min-width:0 !important; }
}

/* small phones, Galaxy Fold cover, older SE */
@media (max-width:380px){
  main.page h1{ font-size:23px !important; }
  main.page h2{ font-size:18px !important; }
  main.page{ padding-left:10px; padding-right:10px; }
  /* claw back inner padding on the biggest cards so text gets room */
  main.page [style*="padding: 25px"],
  main.page [style*="padding: 18px 25px"],
  main.page [style*="padding: 22px 25px"],
  main.page [style*="padding: 32px 25px"],
  main.page [style*="padding: 36px 25px"],
  main.page [style*="padding: 30px 25px"],
  main.page [style*="padding: 28px 25px"],
  main.page [style*="padding: 24px 25px"],
  main.page [style*="padding: 35px 20px"],
  main.page [style*="padding: 18px 20px"],
  main.page [style*="padding: 13px 26px"]{
    padding-left:16px !important; padding-right:16px !important;
  }
}

/* homepage side padding on the narrowest screens, for parity */
@media (max-width:380px){
  main.home-main{ padding-left:12px; padding-right:12px; }
}

/* Homepage Get started expanding CTA */
.home .gs{flex:1 1 100%}
.home .gs-summary{list-style:none; cursor:pointer}
.home .gs-summary::-webkit-details-marker{display:none}
.home .gs-summary::after{content:"\25BE"; margin-left:8px; font-size:14px; display:inline-block; transition:transform .2s ease}
.home details[open] .gs-summary::after{transform:rotate(180deg)}
.home .gs-options{margin-top:10px}
.home .gs-options .btn + .btn{margin-top:10px}
@media (prefers-reduced-motion: no-preference){
  .home details[open] .gs-options{animation:gsPop .22s ease-out both}
}
@keyframes gsPop{from{opacity:0; transform:translateY(-6px) scale(.98)} to{opacity:1; transform:none}}

/* Skip link */
.skip-link{position:absolute; left:8px; top:-52px; z-index:200; background:#0b2e13; color:#fff;
  padding:10px 16px; border-radius:8px; font-weight:800; text-decoration:none; transition:top .15s ease}
.skip-link:focus{top:8px}
main[tabindex]:focus{outline:none}

/* Menu Get started dropdown */
.menu-gs{display:flex; flex-direction:column; align-items:center}
.menu-gs > summary::after{content:"\25BE"; margin-left:8px; font-size:.62em; display:inline-block; transition:transform .2s ease; vertical-align:middle}
.menu-gs[open] > summary::after{transform:rotate(180deg)}
.menu-gs-options{display:flex; flex-direction:column; align-items:center; gap:4px; margin-top:8px}
.menu-gs-options a{font-size:clamp(15px,4vw,19px); font-weight:800}
@media (prefers-reduced-motion: no-preference){
  .menu-gs[open] .menu-gs-options{animation:gsPop .22s ease-out both}
}

/* ---- homepage: Common questions dropdown ---- */
.home .btn-outline{background:#fff; color:#157a29; box-shadow:inset 0 0 0 2px #157a29}
.home .q-list{margin-top:10px; text-align:left}
.home .q-list details{border-top:1px solid rgba(30,181,58,.3); padding:11px 2px}
.home .q-list details:last-child{border-bottom:1px solid rgba(30,181,58,.3)}
.home .q-list summary{list-style:none; cursor:pointer; font-weight:700; font-size:15px; color:#157a29; padding-right:24px; position:relative}
.home .q-list summary::-webkit-details-marker{display:none}
.home .q-list summary::after{content:"+"; position:absolute; right:2px; top:0; font-weight:700; color:#157a29}
.home .q-list details[open] summary::after{content:"\2212"}
.home .q-list p{margin:8px 0 0; color:var(--muted); font-size:14.5px; line-height:1.55}