/* Premium PT Lead Gen Site (Neutral brand)
   - White background, dark typography, gold accents
   - Fast, mobile-first, SEO friendly
*/

:root{
  --bg:#ffffff;
  --panel:#ffffff;
  --text:#0b1220;
  --muted:#546172;
  --ink:#0b1220;
  --accent:#C7A357;
  --gold:#c7a357;
  --gold2:#e2c77a;
  --dark:#0b1220;
  --line:rgba(11,18,32,.10);
  --shadow:0 18px 50px rgba(11,18,32,.10);
  --radius:22px;
  --max:1140px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  line-height:1.6;
  background:
    radial-gradient(900px 500px at 10% -15%, rgba(199,163,87,.18), transparent 55%),
    radial-gradient(900px 500px at 95% 0%, rgba(17,24,39,.08), transparent 60%),
    var(--bg);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}

a{color:inherit; text-decoration:none}

.container{max-width:var(--max); margin:0 auto; padding:0 20px}

header{
  position:sticky; top:0; z-index:50;
  background: rgba(255,255,255,.90);
  backdrop-filter: blur(12px);
  border-bottom:1px solid var(--line);
}

.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0;
  gap:14px;
}

.logo{
  display:flex; align-items:center; gap:10px;
  font-weight:900; letter-spacing:-.2px;
}

.mark{
  display:inline-flex; width:14px; height:14px; border-radius:6px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
}

.badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 11px; border-radius:999px;
  border:1px solid rgba(199,163,87,.35);
  background: rgba(199,163,87,.10);
  color:var(--ink);
  font-size:12px;
  font-weight:800;
}

.navlinks{display:flex; gap:14px; align-items:center; flex-wrap:wrap}
.navlinks a{
  color:var(--muted); font-weight:750; font-size:14px;
  padding:9px 10px; border-radius:14px;
}
.navlinks a:hover{color:var(--text); background:rgba(11,18,32,.04)}

.cta{
  display:inline-flex; align-items:center; justify-content:center;
  padding:11px 15px; border-radius:16px; font-weight:900;
  background:linear-gradient(135deg, var(--accent), #0b1220);
  color:#fff;
  border:0;
  box-shadow: 0 14px 40px rgba(11,18,32,.14);
}
.cta:hover{filter:brightness(1.05)}
.cta.secondary{
  background: transparent;
  color:var(--text);
  border:1px solid var(--line);
  box-shadow:none;
}

.hero{
  padding:54px 0 24px;
}

.grid2{display:grid; grid-template-columns: 1.05fr .95fr; gap:22px; align-items:start}
@media (max-width: 980px){ .grid2{grid-template-columns:1fr} }

h1{
  font-size: 64px;
  line-height:1.06;
  margin:0 0 14px;
  letter-spacing:-1px;
  font-weight:950;
  font-family: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
}
@media (max-width: 520px){ h1{font-size:36px} }

p.lead{
  color:var(--muted);
  font-size:18px;
  margin:0 0 18px;
  max-width: 56ch;
}

.pillrow{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.pill{
  padding:9px 11px; border-radius:999px;
  background: rgba(11,18,32,.03);
  border:1px solid var(--line);
  color:var(--muted);
  font-weight:800; font-size:12px;
}

.kpis{display:flex; gap:12px; flex-wrap:wrap; margin:18px 0 0}
.kpi{
  padding:10px 12px; border-radius:16px;
  background: rgba(11,18,32,.03);
  border:1px solid var(--line);
  color:var(--muted);
  font-weight:800;
  font-size:13px;
}

.panel{
  background: rgba(255,255,255,.95);
  border:1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.formwrap{padding:18px}
.formwrap h2{margin:0 0 10px; font-size:18px; letter-spacing:-.2px}
.small{font-size:12px; color:var(--muted)}

.form{display:grid; gap:12px; margin-top:10px}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media (max-width: 520px){ .row2{grid-template-columns:1fr} }

label{font-size:12px; color:var(--muted); font-weight:850}

input, select, textarea{
  width:100%;
  padding:12px 12px;
  border-radius:16px;
  border:1px solid rgba(11,18,32,.14);
  background: rgba(255,255,255,.93);
  color:var(--text);
  outline:none;
}

textarea{min-height:92px; resize:vertical}

input:focus, select:focus, textarea:focus{
  border-color: rgba(199,163,87,.75);
  box-shadow: 0 0 0 5px rgba(199,163,87,.18);
}

.formactions{
  display:flex; gap:10px; align-items:center; justify-content:space-between; flex-wrap:wrap;
  margin-top:2px;
}

button{cursor:pointer}

.sections{padding:14px 0 44px}
.section{margin-top:18px; padding:22px}

.section h2{
  margin:0 0 10px;
  font-size:22px;
  letter-spacing:-.35px;
  font-weight:950;
  font-family: ui-serif, "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
}
.section p{margin:0 0 10px; color:var(--muted)}

.cards{display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; margin-top:14px}
@media (max-width: 980px){ .cards{grid-template-columns:1fr} }

.card{
  padding:16px; border-radius:18px;
  background: rgba(11,18,32,.02);
  border:1px solid var(--line);
}

.card h3{margin:0 0 6px; font-size: 18px; letter-spacing:-.2px}
.card p{margin:0; font-size:14px; color:var(--muted)}

.heroMedia{
  border-radius: 26px;
  overflow:hidden;
  border: 1px solid rgba(11,18,32,.10);
  box-shadow: 0 22px 70px rgba(11,18,32,.10);
  background: #fff;
}

.heroMedia img{
  width:100%;
  height:auto;
  display:block;
}

.list{display:grid; gap:10px; margin:12px 0 0}
.li{display:flex; gap:10px; align-items:flex-start; color:var(--muted)}
.dot{
  width:10px; height:10px; border-radius:50%;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  margin-top:7px; flex:0 0 10px
}

.split{display:grid; grid-template-columns: 1fr 1fr; gap:14px; margin-top:12px}
@media (max-width: 980px){ .split{grid-template-columns:1fr} }

.faq details{
  border:1px solid var(--line);
  border-radius:18px;
  background: rgba(11,18,32,.02);
  padding:12px 14px;
}
.faq details + details{margin-top:10px}
.faq summary{cursor:pointer; font-weight:900; color:var(--text)}

footer{
  border-top:1px solid var(--line);
  padding:26px 0;
  color:var(--muted);
  background: rgba(255,255,255,.72);
}

.footergrid{display:grid; grid-template-columns: 1.2fr .8fr; gap:14px}
@media (max-width: 980px){ .footergrid{grid-template-columns:1fr} }

.inline-links a{color:var(--muted); text-decoration:underline}

.notice{
  padding:12px 14px; border-radius:16px;
  border:1px solid rgba(11,18,32,.10);
  background: rgba(11,18,32,.02);
  color:var(--muted);
  font-size:13px;
}

hr.sep{border:0; border-top:1px solid var(--line); margin:18px 0}

/* Accessible skip link */
.skip{
  position:absolute; left:-999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip:focus{
  left:18px; top:10px; width:auto; height:auto; padding:10px 12px;
  background:#111827; color:#fff; border-radius:12px; z-index:9999;
}
/* Full-bleed hero background */
.heroWrap{
  position:relative;
  padding: 56px 0 26px;
  background: url("../img/hero-bg-premium.jpg") center/cover no-repeat;
  border-bottom: 1px solid var(--line);
}
.heroWrap::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.93) 0%, rgba(255,255,255,.95) 46%, rgba(255,255,255,.90) 62%, rgba(255,255,255,.82) 100%),
    radial-gradient(800px 500px at 15% 20%, rgba(199,163,87,.28), transparent 55%);
}
.heroWrap::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,.85) 70%, rgba(255,255,255,1));
  opacity:.65;
  pointer-events:none;
}
.heroInner{position:relative; z-index:2}
.heroContent{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 22px;
  align-items:start;
}
@media (max-width: 980px){ .heroContent{grid-template-columns:1fr} }

/* Bottom sticky lead capture bar */
.leadbar{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:80;
  background: rgba(255,255,255,.93);
  backdrop-filter: blur(14px);
  border-top: 1px solid var(--line);
  box-shadow: 0 -18px 50px rgba(11,18,32,.08);
}
.leadbarInner{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  padding: 12px 0;
}
.leadbarTitle{
  display:flex; flex-direction:column;
  gap:2px;
}
.leadbarTitle strong{
  font-weight:950; letter-spacing:-.3px;
}
.leadbarTitle span{
  font-size:12px; color:var(--muted); font-weight:750;
}
.leadbarForm{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.leadbarForm input{
  width: 220px;
  padding: 11px 12px;
  border-radius: 16px;
}
@media (max-width: 980px){
  .leadbarInner{flex-direction:column; align-items:stretch}
  .leadbarForm{justify-content:stretch}
  .leadbarForm input{width:100%}
}
/* Give page room so content isn't hidden behind bar */
body{ padding-bottom: 86px; }
@media (max-width: 980px){ body{ padding-bottom: 140px; } }


/* Leadbar quiz */
.leadbarForm select{
  width: 240px;
  padding: 11px 12px;
  border-radius: 16px;
  border: 1px solid rgba(11,18,32,.14);
  background: rgba(255,255,255,.93);
  color: var(--text);
  font-weight: 750;
  outline: none;
}
.leadbarForm select:focus{
  border-color: rgba(199,163,87,.75);
  box-shadow: 0 0 0 5px rgba(199,163,87,.18);
}
.leadbarStep{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end;
}
@media (max-width: 980px){
  .leadbarStep{justify-content:stretch}
  .leadbarForm select{width:100%}
}

/* Photo-forward premium layout */
.sectionTitle{
  display:flex; flex-direction:column; gap:6px; margin-bottom:12px;
}
.sectionTitle .eyebrow{
  font-size:12px; font-weight:950; letter-spacing:.18em; text-transform:uppercase;
  color: rgba(11,18,32,.55);
}
.sectionTitle h2{
  margin:0;
}
.sectionTitle p{
  margin:0;
  color:var(--muted);
  max-width: 72ch;
}

.photoCards{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 16px;
}
@media (max-width: 1100px){ .photoCards{grid-template-columns: repeat(2, 1fr);} }
@media (max-width: 620px){ .photoCards{grid-template-columns: 1fr;} }

.photoCard{
  border-radius: 20px;
  overflow:hidden;
  border:1px solid var(--line);
  background: rgba(255,255,255,.88);
  box-shadow: var(--shadow);
  display:flex;
  flex-direction:column;
  min-height: 320px;
}
.photoCard img{
  width:100%;
  height: 170px;
  object-fit: cover;
  display:block;
}
.photoCard .pcBody{
  padding: 14px 14px 16px;
}
.photoCard .pcBody strong{
  display:block;
  font-weight:950;
  letter-spacing:-.25px;
  margin-bottom:4px;
}
.photoCard .pcBody span{
  color:var(--muted);
  font-size: 13px;
  font-weight: 650;
}

.mediaSplit{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: stretch;
  margin-top: 16px;
}
@media (max-width: 980px){ .mediaSplit{grid-template-columns: 1fr;} }

.mediaPanel{
  border-radius: 24px;
  overflow:hidden;
  border:1px solid var(--line);
  background: rgba(255,255,255,.88);
  box-shadow: var(--shadow);
}
.mediaPanel img{
  width:100%;
  height: 360px;
  object-fit: cover;
  display:block;
}
@media (max-width: 980px){ .mediaPanel img{height: 280px;} }

.mediaPanel .mpBody{
  padding: 18px;
}
.mediaPanel .mpBody h3{
  margin:0 0 8px;
  font-weight:950;
  letter-spacing:-.25px;
  font-size: 18px;
}
.mediaPanel .mpBody p{
  margin:0;
  color:var(--muted);
}

.gallery{
  display:grid;
  grid-template-columns: 1.4fr .9fr .9fr;
  grid-auto-rows: 180px;
  gap: 12px;
  margin-top: 16px;
}
.gallery a{
  border-radius: 22px;
  overflow:hidden;
  border:1px solid var(--line);
  display:block;
  position:relative;
  background:#fff;
  box-shadow: var(--shadow);
}
.gallery img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
  transform: scale(1.02);
  transition: transform .35s ease;
}
.gallery a:hover img{ transform: scale(1.06); }

.gallery a.big{ grid-row: span 2; }
@media (max-width: 980px){
  .gallery{ grid-template-columns: 1fr 1fr; grid-auto-rows: 170px; }
  .gallery a.big{ grid-row: span 1; }
}
@media (max-width: 520px){
  .gallery{ grid-template-columns: 1fr; }
}

.trustStrip{
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
  margin-top: 16px;
}
.trustItem{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding: 12px 12px;
  border-radius: 18px;
  border:1px solid var(--line);
  background: rgba(11,18,32,.02);
  color: var(--muted);
  font-weight: 750;
  font-size: 13px;
}
.icon{
  width:18px;height:18px; flex:0 0 18px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  border-radius: 6px;
  margin-top:2px;
}

/* Lightbox modal */
.lightbox{
  position:fixed; inset:0;
  background: rgba(11,18,32,.75);
  display:none;
  align-items:center;
  justify-content:center;
  z-index: 120;
  padding: 20px;
}
.lightbox.open{ display:flex; }
.lightbox img{
  max-width: min(1100px, 96vw);
  max-height: 84vh;
  border-radius: 18px;
  box-shadow: 0 30px 100px rgba(0,0,0,.45);
  border: 1px solid rgba(255,255,255,.20);
}
.lightboxClose{
  position:absolute; top: 14px; right: 14px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
  color:#fff;
  padding: 10px 12px;
  border-radius: 14px;
  font-weight: 900;
}

/* Million-bucks polish */
:root{
  --ease:cubic-bezier(.2,.8,.2,1);
}

.glowline{
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(199,163,87,.55), transparent);
  margin: 18px 0;
}

.heroContent > div{
  animation: fadeUp .7s var(--ease) both;
}
.heroContent > div:nth-child(2){
  animation: fadeUp .85s var(--ease) both;
}
@keyframes fadeUp{
  from{ opacity:0; transform: translateY(10px); }
  to{ opacity:1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce){
  .heroContent > div{ animation:none !important; }
}

.cta{
  transition: transform .18s var(--ease), filter .18s var(--ease);
}
.cta:hover{ transform: translateY(-1px); }

/* Coach cards */
.coachGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 16px;
}
@media (max-width: 980px){ .coachGrid{ grid-template-columns: 1fr; } }

.coachCard{
  border-radius: 24px;
  overflow:hidden;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.90);
  box-shadow: var(--shadow);
  display:grid;
  grid-template-columns: 140px 1fr;
  gap: 14px;
  align-items:stretch;
}
@media (max-width: 520px){ .coachCard{ grid-template-columns: 1fr; } }

.coachCard img{
  width:100%;
  height:100%;
  min-height: 160px;
  object-fit: cover;
  display:block;
}
.coachBody{ padding: 14px 16px 16px; }
.coachBody h3{ margin:0 0 6px; font-weight:950; letter-spacing:-.25px; }
.coachBody p{ margin:0; color:var(--muted); font-size:14px; }
.tagrow{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.tag{
  font-size:12px;
  font-weight:850;
  color: rgba(11,18,32,.70);
  border:1px solid var(--line);
  background: rgba(11,18,32,.02);
  padding:6px 10px;
  border-radius:999px;
}

/* Results / outcomes */
.outcomes{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 16px;
  margin-top: 16px;
}
@media (max-width: 980px){ .outcomes{ grid-template-columns: 1fr; } }
.timeline{
  border:1px solid var(--line);
  border-radius: 22px;
  background: rgba(11,18,32,.02);
  padding: 16px;
}
.step{
  display:flex; gap:12px;
  padding: 12px 10px;
  border-radius: 18px;
}
.step + .step{ border-top:1px solid var(--line); border-radius:0; }
.step b{ display:block; font-weight:950; letter-spacing:-.2px; }
.step span{ color:var(--muted); font-size:13px; font-weight:650; }
.num{
  width:30px; height:30px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--gold), var(--gold2));
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-weight:950;
  flex:0 0 30px;
}
.quoteCard{
  border:1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.90);
  box-shadow: var(--shadow);
  padding: 16px;
}
.quoteCard p{ margin:0; color:var(--muted); }
.quoteCard strong{ color:var(--text); }

/* Sticky bottom quiz bar: slightly taller, more premium */
.leadbarTitle strong{ font-size: 14px; }
.leadbarTitle span{ font-size: 12px; }

/* Elevated header logo */
.logo{
  gap:12px;
}
.logo img{
  box-shadow: 0 14px 40px rgba(11,18,32,.10);
}

/* Animated underline for active hover */
.navlinks a{
  position:relative;
}
.navlinks a::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:7px;
  height:2px;
  border-radius:999px;
  background: linear-gradient(90deg, transparent, rgba(199,163,87,.9), transparent);
  transform: scaleX(0);
  transform-origin:center;
  transition: transform .22s var(--ease);
  opacity:.85;
}
.navlinks a:hover::after{ transform: scaleX(1); }

/* Reveal animations */
.reveal{
  opacity:0;
  transform: translateY(10px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
.reveal.in{
  opacity:1;
  transform: translateY(0);
}
@media (min-width: 820px){
  .logo .wordmark{ display:block !important; }
  .logo .wordmarkText{ display:none !important; }
}

/* Gold-forward brand touches */
.logoLink{display:flex; align-items:center; gap:12px; text-decoration:none}
.logoMark{width:34px; height:34px; border-radius:14px; box-shadow:0 18px 55px rgba(11,18,32,.18)}
.logoWordmark{height:28px; width:auto; display:none}
@media (min-width: 860px){ .logoWordmark{display:block} }

.heroWrap::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(900px 420px at 18% 30%, rgba(226,199,122,.09), transparent 60%),
              radial-gradient(900px 420px at 78% 20%, rgba(199,163,87,.08), transparent 62%);
  pointer-events:none;
}

.panel{
  border:1px solid rgba(199,163,87,.16);
}
.photoCard, .mediaPanel, .quoteCard, .timeline, .coachCard{
  border:1px solid rgba(199,163,87,.18) !important;
}
.pill{
  border:1px solid rgba(199,163,87,.18);
}
.navlinks a::after{
  background: linear-gradient(90deg, transparent, rgba(199,163,87,.95), transparent) !important;
}
.glowline{
  background: linear-gradient(90deg, transparent, rgba(199,163,87,.85), transparent) !important;
}
.leadbar{
  border-top:1px solid rgba(199,163,87,.28);
}
.leadbarForm input, .leadbarForm select{
  border:1px solid rgba(199,163,87,.28) !important;
}
/* Bigger type scale */
body{font-size:18px; line-height:1.6}
h1{font-size:64px}
@media (max-width: 980px){ h1{font-size:44px} }
h2{font-size:34px}
@media (max-width: 980px){ h2{font-size:28px} }
.lead{font-size:20px}
@media (max-width: 980px){ .lead{font-size:18px} }
/* Remove bubbles */
.pillrow{display:none !important}
.pill{display:none !important}
/* Infographic blocks */
.infographic{
  border-radius: 26px;
  overflow:hidden;
  border:1px solid rgba(199,163,87,.18);
  background:#fff;
  box-shadow: var(--shadow);
}
.infographic img{width:100%; height:auto; display:block}
/* Force logo visible */
.logoWordmark{display:block !important; height:28px; width:auto}
.logoMark{width:36px; height:36px; border-radius:14px}


/* Header polish */
.topInner{padding:12px 0}
.navlinks{display:flex; align-items:center; gap:14px}
.navlinks a{font-weight:800}
.navlinks a:not(.cta){opacity:.78}
.navlinks a:not(.cta):hover{opacity:1}
.cta{padding:10px 14px; border-radius:999px}
.cta.secondary{background:rgba(11,18,32,.06); color:rgba(11,18,32,.86); border:1px solid rgba(199,163,87,.18)}
.cta.secondary:hover{background:rgba(11,18,32,.08)}


/* Hero readability fix */
.heroWrap{position:relative}
.heroWrap::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(11,18,32,.34) 0%, rgba(11,18,32,.18) 38%, rgba(11,18,32,.08) 72%, rgba(11,18,32,.00) 100%);
  pointer-events:none;
}
.heroContent{position:relative; z-index:2}
.heroContent > div:first-child{
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(199,163,87,.22);
  border-radius: 34px;
  padding: 34px 34px 28px;
  box-shadow: 0 26px 80px rgba(11,18,32,.20);
  backdrop-filter: blur(10px) saturate(1.2);
  max-width: 560px;
}
.heroWrap h1{max-width: 12ch}
.heroWrap .lead{color: rgba(11,18,32,.78); max-width: 46ch}
@media (max-width: 980px){
  .heroWrap::after{background: linear-gradient(180deg, rgba(11,18,32,.26) 0%, rgba(11,18,32,.10) 50%, rgba(11,18,32,.00) 100%);}
  .heroContent > div:first-child{max-width:none}
}


/* Kill bubbles / chips */
.pillrow,.pill,.kpis,.trustStrip{display:none !important}
/* v17 polish */
.logoMark{width:38px; height:38px; border-radius:16px; box-shadow:0 14px 42px rgba(11,18,32,.16)}
.logoWordmark{height:24px; max-width:260px}
.topInner{padding:10px 0}
@media (min-width: 860px){ .logoWordmark{display:block} }
.heroWrap{background-position: right center !important}
.formwrap{border:1px solid rgba(199,163,87,.18)}
.formwrap .btnPrimary{background:linear-gradient(135deg, rgba(199,163,87,.92), rgba(11,18,32,.92)); color:#fff; border:1px solid rgba(255,255,255,.10); box-shadow:0 18px 46px rgba(11,18,32,.22);}
.formwrap input:focus,.formwrap select:focus,.formwrap textarea:focus{
  outline:none;
  border-color: rgba(199,163,87,.55);
  box-shadow:0 0 0 6px rgba(199,163,87,.14);
}
.microNote{margin-top:16px; font-weight:700; color: rgba(11,18,32,.72)}
.kpi{display:none !important}
/* Hero text card (clean) */
.heroTextCard{
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(199,163,87,.22);
  border-radius: 34px;
  padding: 34px 34px 28px;
  box-shadow: 0 26px 80px rgba(11,18,32,.20);
  backdrop-filter: blur(10px) saturate(1.2);
  max-width: 560px;
}
.heroMicro{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px}
.microTag{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(199,163,87,.18);
  background: rgba(255,255,255,.72);
  font-weight:800;
  font-size:12px;
  color: rgba(11,18,32,.78);
}
@media (max-width: 980px){
  .heroTextCard{max-width:none; padding:26px 22px 18px; border-radius:26px;}
}

.glowline{display:none !important}
/* Foundation onboarding */
.foundation{padding:34px 0 10px}
.foundationCard{
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.96));
  border: 1px solid rgba(199,163,87,.22);
  border-radius: 34px;
  box-shadow: 0 26px 80px rgba(11,18,32,.16);
  padding: 34px;
  overflow:hidden;
  position:relative;
}
.foundationCard:before{
  content:"";
  position:absolute;
  inset:-120px -120px auto auto;
  width:420px; height:420px;
  background: radial-gradient(circle at 30% 30%, rgba(199,163,87,.22), rgba(199,163,87,0) 60%);
  pointer-events:none;
}
.foundationHead{display:flex; flex-direction:column; gap:10px; max-width:780px}
.foundationBadge{
  align-self:flex-start;
  padding:10px 14px;
  border-radius:999px;
  font-weight:950;
  letter-spacing:.5px;
  color: rgba(11,18,32,.92);
  background: linear-gradient(135deg, rgba(199,163,87,.22), rgba(226,199,122,.22));
  border:1px solid rgba(199,163,87,.30);
}
.foundation h2{font-size: clamp(26px, 3vw, 40px); letter-spacing:-.8px; margin:0}
.foundationSub{margin:0; color: rgba(11,18,32,.72); font-weight:750; font-size:18px}
.foundationGrid{
  margin-top:22px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
.fItem{
  display:flex;
  gap:12px;
  padding:16px 16px;
  border-radius:22px;
  border:1px solid rgba(11,18,32,.08);
  background: rgba(255,255,255,.76);
}
.fIcon{
  width:32px; height:32px;
  border-radius:12px;
  display:grid; place-items:center;
  font-weight:950;
  color: rgba(11,18,32,.92);
  background: linear-gradient(135deg, rgba(199,163,87,.35), rgba(226,199,122,.22));
  border:1px solid rgba(199,163,87,.28);
  box-shadow: 0 14px 40px rgba(199,163,87,.14);
  flex:0 0 auto;
}
.fTitle{font-weight:950; font-size:18px; letter-spacing:-.2px}
.fDesc{margin-top:4px; color: rgba(11,18,32,.66); font-weight:700; font-size:15px}
.fNote{grid-column: span 1; align-items:center; justify-content:center; text-align:center}
.fNote .fTitle{font-size:16px}
.foundationCtas{margin-top:22px; display:flex; gap:12px; flex-wrap:wrap}
@media (max-width: 980px){
  .foundationCard{padding:24px}
  .foundationGrid{grid-template-columns: 1fr; }
}


/* Exact PNG logo */
.logoFull{
  height: 44px;
  width: auto;
  display:block;
  image-rendering: auto;
}
@media (max-width: 720px){
  .logoFull{height: 38px}
}


/* Header: clean brand lockup */
.top{background: rgba(255,255,255,0.92); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(199,163,87,.12)}
.topInner{padding: 14px 0; display:flex; align-items:center; justify-content:space-between; gap:18px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brandMark{height:44px; width:auto; display:block}
.brandName{font-weight:950; letter-spacing:-0.6px; color: rgba(11,18,32,.96); font-size:22px; line-height:1.05}
.brandSub{font-weight:900; letter-spacing:4px; color: rgba(84,97,114,.85); font-size:11px; margin-top:4px}
@media (max-width: 720px){
  .brandMark{height:40px}
  .brandName{font-size:18px}
  .brandSub{font-size:10px; letter-spacing:3.5px}
}


/* Header v2: fix logo crop + menu + readable CTA */
.top{background: rgba(255,255,255,0.92); backdrop-filter: blur(10px); border-bottom: 1px solid rgba(199,163,87,.14)}
.topInner{padding: 14px 0; display:flex; align-items:center; justify-content:space-between; gap:22px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brandMark{height:44px; width:auto; display:block}
.brandName{font-weight:950; letter-spacing:-0.6px; color: rgba(11,18,32,.96); font-size:22px; line-height:1.05}
.brandSub{font-weight:900; letter-spacing:4px; color: rgba(84,97,114,.85); font-size:11px; margin-top:4px}

.navlinks{display:flex; align-items:center; gap:16px; flex-wrap:wrap; justify-content:flex-end}
.navlinks a{font-weight:850; text-decoration:none; color: rgba(11,18,32,.84)}
.navlinks a:hover{color: rgba(11,18,32,.98)}
.navlinks a:not(.cta){opacity:.78}
.navlinks a:not(.cta):hover{opacity:1}

.cta{padding:11px 16px; border-radius:999px; font-weight:950; letter-spacing:-0.2px; border:1px solid transparent; display:inline-flex; align-items:center; gap:8px}
.cta.secondary{background: rgba(11,18,32,.06); color: rgba(11,18,32,.92); border-color: rgba(199,163,87,.20)}
.cta.secondary:hover{background: rgba(11,18,32,.08)}
.cta.primary{background: rgba(11,18,32,.94); color:#fff; border-color: rgba(199,163,87,.30); box-shadow: 0 18px 40px rgba(11,18,32,.18)}
.cta.primary:hover{background: rgba(11,18,32,.98)}
.cta.primary:focus{outline: 3px solid rgba(199,163,87,.35); outline-offset: 3px}

@media (max-width: 840px){
  .brandMark{height:40px}
  .brandName{font-size:18px}
  .brandSub{font-size:10px; letter-spacing:3.5px}
  .navlinks{gap:10px}
  .cta{padding:10px 14px}
}


/* CTA contrast override */
.cta.primary{
  background: linear-gradient(180deg, rgba(11,18,32,0.98) 0%, rgba(11,18,32,0.90) 100%) !important;
  color: #ffffff !important;
  border-color: rgba(199,163,87,.42) !important;
}
.cta.primary:hover{filter: brightness(1.05)}








/* SDPT header: big brand (3x) + clean nav */
.brandLogo{height:132px; width:auto; display:block}
.topInner{align-items:flex-end}
.navlinks{padding-bottom:12px}
@media (max-width: 1100px){
  .brandLogo{height:104px}
}
@media (max-width: 840px){
  .brandLogo{height:80px}
  .navlinks{padding-bottom:8px}
}
@media (max-width: 520px){
  .brandLogo{height:64px}
}
/* Make primary CTA always readable */
.cta.primary{
  background: linear-gradient(180deg, rgba(11,18,32,0.98) 0%, rgba(11,18,32,0.90) 100%) !important;
  color: #ffffff !important;
  border-color: rgba(199,163,87,.42) !important;
}


/* Quiz matcher */
.srOnlyField{position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; opacity:0 !important; pointer-events:none !important}
.quizWrap{display:block}
.quizTop{padding: 18px 18px 10px}
.quizTitle{font-weight: 950; font-size: 22px; letter-spacing: -0.4px; color: rgba(11,18,32,.96)}
.quizSub{margin-top:6px; color: rgba(66,78,94,.82); font-weight: 700}
.quizProg{margin-top: 12px; display:flex; align-items:center; gap:10px}
.quizProg .bar{flex:1; height: 10px; border-radius:999px; background: rgba(11,18,32,.08); overflow:hidden}
.quizProg .fill{height:100%; width:0%; border-radius:999px; background: linear-gradient(90deg, rgba(199,163,87,.95), rgba(11,18,32,.92)); transition: width .35s ease}
.quizProg .pct{min-width:44px; text-align:right; font-weight: 950; color: rgba(11,18,32,.85)}

.qgrid{display:grid; gap:14px; padding: 10px 18px 18px}
.qcard{background: rgba(255,255,255,.92); border: 1px solid rgba(199,163,87,.16); border-radius: 18px; padding: 14px 14px; box-shadow: 0 18px 45px rgba(11,18,32,.08); transform: translateY(0); transition: transform .25s ease, box-shadow .25s ease, opacity .25s ease, max-height .35s ease}
.qcard:hover{transform: translateY(-2px); box-shadow: 0 22px 55px rgba(11,18,32,.10)}
.qcard.is-hidden{display:none}
.qhead{display:grid; grid-template-columns: 38px 1fr; gap:12px; align-items:start}
.qnum{height: 30px; width: 30px; border-radius: 10px; display:grid; place-items:center; font-weight: 950; color: rgba(11,18,32,.9); background: rgba(199,163,87,.18); border: 1px solid rgba(199,163,87,.22)}
.qlabel{font-weight: 950; font-size: 18px; color: rgba(11,18,32,.96); letter-spacing: -0.25px}
.qhelp{margin-top: 4px; color: rgba(66,78,94,.78); font-weight: 700; font-size: 13px}

.opts{display:flex; flex-wrap:wrap; gap:10px; margin-top: 12px}
.opt{border-radius: 999px; border: 1px solid rgba(11,18,32,.10); background: rgba(11,18,32,.04); color: rgba(11,18,32,.92); padding: 11px 14px; font-weight: 950; cursor:pointer; transition: background .2s ease, transform .2s ease, border-color .2s ease}
.opt:hover{transform: translateY(-1px); background: rgba(11,18,32,.06); border-color: rgba(199,163,87,.22)}
.opt.active{background: rgba(11,18,32,.92); color: #fff; border-color: rgba(199,163,87,.45); box-shadow: 0 12px 30px rgba(11,18,32,.18)}

.qsummary{display:none; margin-top: 12px; padding: 10px 12px; border-radius: 14px; background: rgba(199,163,87,.08); border: 1px solid rgba(199,163,87,.16); align-items:center; gap:10px}
.qsummary.show{display:flex}
.sumLabel{font-weight: 900; color: rgba(11,18,32,.76)}
.sumVal{margin-left:auto; font-weight: 950; color: rgba(11,18,32,.92)}
.edit{margin-left: 10px; border: 0; background: transparent; color: rgba(11,18,32,.70); font-weight: 950; cursor:pointer; text-decoration: underline}
.edit:hover{color: rgba(11,18,32,.92)}
.qcard.is-done .opts{display:none}
.qcard.is-done{background: rgba(255,255,255,.86)}

.contactCard{background: rgba(255,255,255,.94); border: 1px solid rgba(199,163,87,.18); border-radius: 22px; padding: 18px; margin: 0 18px 22px; box-shadow: 0 22px 55px rgba(11,18,32,.10)}
.contactCard.is-hidden{display:none}
.contactTitle{font-weight: 950; font-size: 20px; letter-spacing: -0.3px; color: rgba(11,18,32,.96)}
.contactGrid{margin-top: 12px; display:grid; grid-template-columns: 1fr 1fr; gap: 12px}
.field label{display:block; font-weight: 900; color: rgba(11,18,32,.78); margin-bottom: 6px}
.inpt,.notesBox{width:100%; border-radius: 14px; border: 1px solid rgba(11,18,32,.12); padding: 12px 12px; font-weight: 800; background: rgba(255,255,255,.98)}
.notesBox{min-height: 90px}
.field.full{grid-column: 1 / -1}

.ctaRow{margin-top: 12px; display:flex; align-items:center; gap: 14px; flex-wrap:wrap}
.submitBtn{border-radius: 999px; padding: 12px 18px; font-weight: 950; color:#fff; border: 1px solid rgba(199,163,87,.42); background: linear-gradient(180deg, rgba(11,18,32,0.98) 0%, rgba(11,18,32,0.90) 100%); box-shadow: 0 18px 45px rgba(11,18,32,.18); cursor:pointer}
.submitBtn:hover{filter: brightness(1.04)}
.fineprint{color: rgba(66,78,94,.72); font-weight: 750}

@media (max-width: 760px){
  .contactGrid{grid-template-columns: 1fr}
}


/* Infographics */
.igWrap{margin-top: 10px}
.igHead h2{margin:0}
.igHead .muted{margin-top:6px}
.igGrid{display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin-top: 14px}
.igCard{border-radius: 18px; border: 1px solid rgba(199,163,87,.16); background: rgba(255,255,255,.92); box-shadow: 0 18px 45px rgba(11,18,32,.07); padding: 14px; display:flex; gap: 12px; align-items:flex-start}
.igIcon{height: 44px; width: 44px; border-radius: 14px; display:grid; place-items:center; background: rgba(199,163,87,.14); border: 1px solid rgba(199,163,87,.18); color: rgba(11,18,32,.92); flex: 0 0 auto}
.igIcon svg{height: 22px; width: 22px}
.igTitle{font-weight: 950; color: rgba(11,18,32,.95); letter-spacing: -0.2px}
.igText{margin-top: 4px; color: rgba(66,78,94,.78); font-weight: 750; font-size: 13px; line-height: 1.35}

@media (max-width: 980px){
  .igGrid{grid-template-columns: repeat(2, minmax(0,1fr))}
}
@media (max-width: 520px){
  .igGrid{grid-template-columns: 1fr}
}


/* Hero card (quiz focus) */
.heroWrap{position:relative; padding: 28px 0 34px}
.heroInner{padding-top: 12px}
.heroContent{display:flex; justify-content:center}
.heroCard{
  width: min(980px, 100%);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(199,163,87,.18);
  border-radius: 26px;
  box-shadow: 0 30px 85px rgba(11,18,32,.14);
  padding: 18px;
  backdrop-filter: blur(8px);
}
.heroEyebrow{
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(11,18,32,.58);
}
.heroHeader h1{margin-top: 10px; font-size: clamp(40px, 5vw, 64px); line-height: 0.98}
.heroHeader p{margin-top: 10px; font-size: 16px; font-weight: 750; color: rgba(66,78,94,.82)}
.heroHeader ul{margin-top: 12px}
.heroTrust{
  margin-top: 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 12px;
  border-radius: 18px;
  background: rgba(199,163,87,.10);
  border: 1px solid rgba(199,163,87,.14);
}
.trustItem{font-weight: 900; color: rgba(11,18,32,.78)}
.trustCall{
  font-weight: 950;
  color: rgba(11,18,32,.95);
  text-decoration: none;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(11,18,32,.12);
  background: rgba(255,255,255,.88);
}
.trustCall:hover{filter: brightness(1.02)}
.heroCard form{margin-top: 12px}
/* Make quiz fill the hero card */
.quizTop{padding: 14px 0 8px}
.qgrid{padding: 10px 0 0}
.contactCard{margin: 12px 0 0}
/* Mobile-first spacing */
@media (max-width: 760px){
  .heroCard{padding: 14px; border-radius: 22px}
  .heroHeader h1{font-size: 40px}
  .heroTrust{padding: 10px}
}


/* Hero emphasis */
.heroCard{animation: sdptFloatIn .55s ease-out both}
@keyframes sdptFloatIn{
  from{opacity:0; transform: translateY(12px)}
  to{opacity:1; transform: translateY(0)}
}
.quizTitle{font-size: 24px}
.quizSub{font-size: 15px}
.quizWrap{padding-top: 8px}
/* Make first question immediately visible and options bigger on mobile */
.opt{padding: 12px 16px; font-size: 14px}
@media (max-width: 520px){
  .opt{width: 100%; justify-content:center}
  .opts{gap: 10px}
  .qcard{padding: 12px}
}


/* Utilities */
.hidden{display:none !important}
.hp{display:none !important}
.srOnly{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

/* Quiz polish */
.heroCard{position:relative; overflow:hidden}
.heroCard:before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(800px 200px at 50% 0%, rgba(199,163,87,.18), transparent 60%);
  pointer-events:none;
}
.heroCard > *{position:relative}

.quizTop{padding: 16px 0 10px}
.quizTitle{display:flex; align-items:center; justify-content:space-between; gap:10px}
.quizTitle:after{content:""; display:none;}
.qcard{scroll-margin-top: 90px}
.qsummary{cursor:pointer}
.qsummary .sumVal{max-width: 50%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.opt{min-height: 44px}
.opt:active{transform: translateY(0px) scale(.99)}


/* Place trust bar after quiz */
.heroTrust.belowQuiz{margin-top: 14px}
/* Quiz should sit right under headline */
.heroHeader p{margin-bottom: 6px}
.heroCard form{margin-top: 8px}


/* Foundation program meta badges */
.foundationMeta{margin-top: 10px; display:flex; gap:10px; flex-wrap:wrap}
.badgeGold{
  display:inline-flex; align-items:center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(199,163,87,.14);
  border: 1px solid rgba(199,163,87,.22);
  color: rgba(11,18,32,.92);
  font-weight: 950;
}
.badgeSoft{
  display:inline-flex; align-items:center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(11,18,32,.05);
  border: 1px solid rgba(11,18,32,.08);
  color: rgba(11,18,32,.72);
  font-weight: 900;
}


/* Hero trust removed */
.heroCard form{margin-bottom: 6px}


/* Footer logo */
.footerLogo{display:flex; align-items:center; justify-content:flex-start; margin-bottom: 14px}
.footerLogo img{height: 46px; width:auto; display:block; filter: drop-shadow(0 10px 20px rgba(11,18,32,.14))}
@media (max-width: 520px){
  .footerLogo img{height: 42px}
}


/* Onboarding spacing */
.onboardingSection .panel{padding: 18px}
.onboardingSection .igHead h2{margin: 0; font-size: clamp(28px, 3.2vw, 40px); line-height:1.05}
.onboardingSection .igHead .muted{margin-top: 10px; max-width: 760px}
.onboardingSection .foundationMeta{margin-top: 14px}
.onboardingSection .badgeGold{font-size: 16px; padding: 10px 14px}
.onboardingSection .igGrid{
  margin-top: 16px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.onboardingSection .igCard{
  border-radius: 22px;
  padding: 18px;
}
.onboardingSection .igIcon{width: 44px; height: 44px; border-radius: 16px}
.onboardingSection .igTitle{font-size: 20px}
.onboardingSection .igText{font-size: 15px; line-height: 1.45}
@media (max-width: 860px){
  .onboardingSection .igGrid{grid-template-columns: 1fr}
}


/* Service Areas directory */
.areaGroups{display:flex; flex-direction:column; gap:18px}
.areaGrid{
  margin-top: 14px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.areaCard{
  display:block;
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(11,18,32,.08);
  background: rgba(255,255,255,.86);
  box-shadow: 0 16px 40px rgba(11,18,32,.08);
  text-decoration:none;
  transition: transform .15s ease, box-shadow .15s ease;
}
.areaCard:hover{transform: translateY(-2px); box-shadow: 0 22px 56px rgba(11,18,32,.12)}
.areaTitle{font-weight: 950; font-size: 18px; color: rgba(11,18,32,.92)}
.areaText{margin-top: 6px; color: rgba(11,18,32,.66); font-size: 14px; line-height: 1.45}
.areaMeta{margin-top: 10px; font-weight: 900; color: rgba(199,163,87,.95); font-size: 13px}
@media (max-width: 980px){.areaGrid{grid-template-columns: repeat(2, minmax(0, 1fr));}}
@media (max-width: 560px){.areaGrid{grid-template-columns: 1fr;} .areaCard{padding:14px}}


/* Mobile first polish */
@media (max-width: 860px){
  header .container{padding-left:16px; padding-right:16px}
  nav{gap:10px; flex-wrap:wrap; justify-content:flex-end}
  nav a{font-size:14px}
  .btn{padding: 11px 14px; border-radius: 999px}
  .heroWrap{padding: 34px 0 22px}
  .heroCard{padding: 16px}
  .heroHeader h1{font-size: clamp(28px, 7vw, 44px)}
  .heroHeader p{font-size: 16px}
  .quizSub{font-size: 14px}
  .optGrid{grid-template-columns: 1fr !important; gap:10px}
  .optBtn{padding: 14px 14px; font-size:16px}
  .fieldRow{grid-template-columns: 1fr !important; gap:10px}
  input, select, textarea{font-size:16px} /* avoids iOS zoom */
  .leadbar{padding-bottom: calc(env(safe-area-inset-bottom) + 14px)}
}
@media (max-width: 520px){
  .logo img{height: 46px}
  nav{justify-content:space-between}
  nav .btn{width: 100%; text-align:center}
  nav a:not(.btn){padding: 8px 10px}
  .panel{padding: 14px}
  .areaGrid{grid-template-columns: 1fr}
  footer{padding-bottom: calc(env(safe-area-inset-bottom) + 22px)}
}


/* Quiz tap targets fallback */
.quiz .options, .quizOptions{display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:10px}
.quiz button, .quiz .opt, .quiz .option{min-height: 48px}



/* Mobile dropdown nav */
nav{display:flex; align-items:center; gap:12px}
.navToggle{
  display:none;
  border: 1px solid rgba(11,18,32,.10);
  background: rgba(255,255,255,.80);
  padding: 10px 12px;
  border-radius: 999px;
  font-weight: 950;
  cursor:pointer;
}
.navMenu{display:flex; gap:12px; align-items:center}
.navCTA{white-space:nowrap}
@media (max-width: 860px){
  .logo img{height: 58px} /* bigger on mobile */
  .navToggle{display:inline-flex}
  .navMenu{
    position:absolute;
    left: 16px;
    right: 16px;
    top: calc(100% + 10px);
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap: 8px;
    padding: 12px;
    border-radius: 18px;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(11,18,32,.10);
    box-shadow: 0 22px 60px rgba(11,18,32,.14);
    backdrop-filter: blur(10px);
    z-index: 50;
  }
  header{position:sticky; top:0; z-index:60; background: rgba(255,255,255,.92); backdrop-filter: blur(10px)}
  header.navOpen .navMenu{display:flex}
  .navMenu a{
    padding: 12px 12px;
    border-radius: 14px;
    background: rgba(11,18,32,.03);
    border: 1px solid rgba(11,18,32,.06);
    font-weight: 900;
    text-decoration:none;
    color: rgba(11,18,32,.86);
  }
  .navMenu a:hover{background: rgba(11,18,32,.05)}
  nav{position:relative; flex-wrap:nowrap; justify-content:space-between; width:100%}
  .navCTA{padding: 11px 14px}
}
@media (max-width: 520px){
  .logo img{height: 64px}
  .navCTA{flex:1; text-align:center}
}







/* Leadbar CTA + buttons (polished + gamified) */
.leadbar{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 55;
  padding: 12px 16px calc(env(safe-area-inset-bottom) + 12px);
  background: linear-gradient(180deg, rgba(10,14,20,.00), rgba(10,14,20,.62));
  pointer-events:none;
}
.leadbarInner{
  max-width: 1100px;
  margin: 0 auto;
  pointer-events:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding: 14px 14px;
  border-radius: 22px;
  background: rgba(10,14,20,.86);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 22px 70px rgba(0,0,0,.38);
  backdrop-filter: blur(12px);
}
.leadbarCTA{display:flex; flex-direction:column; gap:8px; min-width: 0}
.leadbarCTATop{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.livePill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 950;
  font-size: 12px;
  color: rgba(255,255,255,.92);
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  position: relative;
}
.livePill:before{
  content:"";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(212,175,55,1);
  box-shadow: 0 0 0 0 rgba(212,175,55,.6);
  animation: sdptPulse 1.6s infinite;
}
@keyframes sdptPulse{
  0%{box-shadow: 0 0 0 0 rgba(212,175,55,.55)}
  70%{box-shadow: 0 0 0 10px rgba(212,175,55,0)}
  100%{box-shadow: 0 0 0 0 rgba(212,175,55,0)}
}
.leadbarTitle{
  font-weight: 950;
  letter-spacing: -0.02em;
  font-size: 16px;
  color: rgba(255,255,255,.94);
}
.leadbarSub{
  font-size: 13px;
  line-height: 1.35;
  color: rgba(255,255,255,.70);
  max-width: 640px;
}

.leadbarStat{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top: 2px;
}
.servedLabel{
  font-weight: 900;
  font-size: 12px;
  color: rgba(255,255,255,.62);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.servedValue{
  display:flex;
  align-items:baseline;
  gap:6px;
  font-weight: 950;
  letter-spacing: -0.02em;
  color: rgba(255,255,255,.92);
  font-size: 18px;
  position: relative;
}
.servedCount{font-variant-numeric: tabular-nums; color: rgba(212,175,55,1); font-size: 20px}
.servedPlus{opacity:.9}
.servedBump{
  position:absolute;
  right: -42px;
  top: -6px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 950;
  color: rgba(10,14,20,.92);
  background: rgba(212,175,55,1);
  transform: translateY(6px);
  opacity: 0;
  pointer-events:none;
}
.servedValue.bump .servedBump{
  opacity: 1;
  transform: translateY(0px);
  transition: opacity .18s ease, transform .18s ease;
}
.servedMeter{display:flex; flex-direction:column; gap:6px}
.servedMeterLabel{font-size: 12px; color: rgba(255,255,255,.60)}
.servedBar{
  width: min(420px, 70vw);
  height: 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.10);
}
.servedFill{
  height: 100%;
  width: 0%;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(212,175,55,1), rgba(255,210,90,1));
  transition: width .35s ease;
}

.leadbarActions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-shrink: 0;
}
.ctaBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 950;
  letter-spacing: -0.01em;
  text-decoration:none;
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 18px 44px rgba(0,0,0,.22);
  transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
  user-select:none;
  min-width: 128px;
}
.ctaBtn:hover{transform: translateY(-1px); box-shadow: 0 22px 60px rgba(0,0,0,.28)}
.ctaBtn:active{transform: translateY(0px) scale(.98); filter: brightness(0.98)}
.ctaText{
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.92);
}
.ctaEmail{
  background: linear-gradient(180deg, rgba(212,175,55,1), rgba(173,135,36,1));
  color: rgba(10,14,20,.94);
  border-color: rgba(255,255,255,.08);
}

@media (max-width: 860px){
  .leadbar{padding-left:12px; padding-right:12px}
  .leadbarInner{flex-direction:column; align-items:stretch}
  .leadbarActions{width:100%}
  .ctaBtn{flex:1; min-width: 0}
  .servedBar{width: 100%}
  .servedBump{right: 0; left: auto}
}


/* Leadbar excited polish */
.leadbar{background: linear-gradient(180deg, rgba(255,255,255,0), rgba(10,14,20,.42));}
.leadbarInner{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(212,175,55,.22);
  box-shadow: 0 18px 58px rgba(0,0,0,.30);
}
.leadbarInner:before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: 22px;
  pointer-events:none;
  background: radial-gradient(800px 120px at 20% 0%, rgba(212,175,55,.20), rgba(212,175,55,0)),
              radial-gradient(800px 120px at 80% 100%, rgba(212,175,55,.14), rgba(212,175,55,0));
  mix-blend-mode: screen;
  opacity: .9;
}
.leadbarInner{position:relative; overflow:hidden}
.leadbarTitle{font-size: 17px}
.servedCount{font-size: 22px}
.servedMeterLabel{font-weight: 900; letter-spacing: .06em; text-transform: uppercase}
.servedBar{height: 12px; border-color: rgba(212,175,55,.18); background: rgba(255,255,255,.08)}
.servedFill{
  background: linear-gradient(90deg, rgba(212,175,55,1), rgba(255,220,120,1));
  box-shadow: 0 0 0 0 rgba(212,175,55,.0);
}
/* Testimonials in leadbar */
.leadbarTestimonial{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  max-width: 560px;
}
.tQuote{
  font-size: 13px;
  line-height: 1.35;
  color: rgba(255,255,255,.86);
  font-weight: 800;
}
.tMeta{
  font-size: 12px;
  color: rgba(255,255,255,.62);
  font-weight: 800;
}
@media (max-width: 860px){
  .leadbarTestimonial{max-width: 100%}
}


/* Leadbar thin + light (dark text) */
.leadbar{
  padding: 10px 12px calc(env(safe-area-inset-bottom) + 10px) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.78)) !important;
}
.leadbarInner{
  padding: 10px 12px !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(212,175,55,.28) !important;
  box-shadow: 0 12px 40px rgba(10,14,20,.10) !important;
  backdrop-filter: blur(12px);
}
.leadbarInner:before{opacity:.55 !important}
.leadbarTitle{color: rgba(11,18,32,.90) !important; font-size: 15px !important}
.leadbarSub{color: rgba(11,18,32,.62) !important}
.servedLabel{color: rgba(11,18,32,.50) !important}
.servedValue{color: rgba(11,18,32,.86) !important; font-size: 16px !important}
.servedCount{color: rgba(173,135,36,1) !important; font-size: 18px !important}
.livePill{
  color: rgba(11,18,32,.74) !important;
  background: rgba(212,175,55,.14) !important;
  border-color: rgba(212,175,55,.25) !important;
}
.leadbarTestimonial{
  background: rgba(11,18,32,.03) !important;
  border-color: rgba(11,18,32,.08) !important;
}
.tQuote{color: rgba(11,18,32,.84) !important}
.tMeta{color: rgba(11,18,32,.56) !important}
.servedMeterLabel{color: rgba(11,18,32,.55) !important}
.servedBar{
  height: 10px !important;
  background: rgba(11,18,32,.06) !important;
  border-color: rgba(212,175,55,.20) !important;
}
.servedFill{
  background: linear-gradient(90deg, rgba(212,175,55,1), rgba(255,220,120,1), rgba(173,135,36,1)) !important;
  transition: width .9s cubic-bezier(.16,1,.3,1) !important;
}
.servedBump{
  background: rgba(212,175,55,1) !important;
  color: rgba(10,14,20,.94) !important;
}
.ctaText{
  background: rgba(11,18,32,.06) !important;
  color: rgba(11,18,32,.90) !important;
  border-color: rgba(11,18,32,.10) !important;
  box-shadow: 0 10px 26px rgba(10,14,20,.10) !important;
}
.ctaEmail{
  box-shadow: 0 14px 36px rgba(212,175,55,.22) !important;
}
@media (max-width: 860px){
  .leadbarInner{gap: 10px !important}
  .leadbarSub{display:none !important} /* keep it thin */
  .leadbarTestimonial{display:none !important} /* keep it thin on mobile */
  .leadbarActions{gap: 8px !important}
  .ctaBtn{padding: 11px 14px !important}
}


/* Leadbar simplified: big progress + CTAs */
.leadbar{
  position: fixed;
  left:0; right:0; bottom:0;
  z-index: 55;
  padding: 10px 12px calc(env(safe-area-inset-bottom) + 10px);
  background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.80));
  pointer-events:none;
}
.leadbarInner{
  max-width: 1100px;
  margin: 0 auto;
  pointer-events:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding: 10px 12px;
  border-radius: 18px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(212,175,55,.28);
  box-shadow: 0 14px 44px rgba(10,14,20,.10);
  backdrop-filter: blur(12px);
}
.leadbarMeterBlock{display:flex; flex-direction:column; gap:6px; min-width:0; flex:1}
.roadLabel{
  font-weight: 950;
  letter-spacing: -0.02em;
  color: rgba(11,18,32,.88);
  font-size: 14px;
}
.roadRow{display:flex; align-items:baseline; gap:6px}
.servedCount{
  font-weight: 950;
  font-size: 18px;
  color: rgba(173,135,36,1);
  font-variant-numeric: tabular-nums;
}
.servedPlus{font-weight: 950; color: rgba(11,18,32,.70)}
.servedBar{
  height: 12px;
  border-radius: 999px;
  background: rgba(11,18,32,.06);
  overflow:hidden;
  border: 1px solid rgba(212,175,55,.18);
}
.servedFill{
  height:100%;
  width: 0%;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(212,175,55,1), rgba(255,220,120,1), rgba(173,135,36,1));
  transition: width 1.1s cubic-bezier(.16,1,.3,1);
}
.leadbarMicro{
  font-size: 12px;
  color: rgba(11,18,32,.58);
  font-weight: 800;
  letter-spacing: -0.01em;
}
.leadbarActions{display:flex; gap:10px; align-items:center; flex-shrink:0}
.ctaBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 11px 14px;
  border-radius: 999px;
  font-weight: 950;
  text-decoration:none;
  border: 1px solid rgba(11,18,32,.10);
  box-shadow: 0 10px 26px rgba(10,14,20,.10);
  transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
  user-select:none;
  min-width: 116px;
}
.ctaBtn:hover{transform: translateY(-1px); box-shadow: 0 14px 36px rgba(10,14,20,.12)}
.ctaBtn:active{transform: translateY(0px) scale(.98); filter: brightness(.98)}
.ctaText{background: rgba(11,18,32,.06); color: rgba(11,18,32,.90)}
.ctaEmail{background: linear-gradient(180deg, rgba(212,175,55,1), rgba(173,135,36,1)); color: rgba(10,14,20,.94); border-color: rgba(212,175,55,.20)}
@media (max-width: 860px){
  .leadbarInner{flex-direction:column; align-items:stretch}
  .leadbarActions{width:100%}
  .ctaBtn{flex:1; min-width:0}
}


/* Leadbar bigger progress bar */
.roadLabel{font-size: 16px !important}
.servedCount{font-size: 22px !important}
.servedBar{height: 18px !important}
.leadbarInner{padding: 14px 14px !important}
.leadbarMeterBlock{gap: 8px !important}
.leadbarMicro{font-size: 13px !important}


/* Leadbar mega progress bar */
.leadbarInner{padding: 18px 18px !important; border-radius: 22px !important}
.roadLabel{font-size: 18px !important}
.servedCount{font-size: 28px !important}
.servedBar{height: 26px !important}
.leadbarMicro{font-size: 14px !important}
.ctaBtn{padding: 14px 18px !important; min-width: 140px !important}
@media (max-width: 860px){
  .servedBar{height: 24px !important}
  .servedCount{font-size: 26px !important}
  .roadLabel{font-size: 17px !important}
}


/* Leadbar MEGA sizing */
.leadbarInner{padding: 18px 16px !important; border-radius: 22px !important}
.roadLabel{font-size: 18px !important}
.servedCount{font-size: 28px !important}
.servedBar{height: 26px !important}
.leadbarMicro{font-size: 14px !important}
.ctaBtn{padding: 13px 16px !important; font-size: 15px !important}
@media (max-width: 860px){
  .servedBar{height: 22px !important}
  .servedCount{font-size: 26px !important}
}


/* Leadbar layout: make progress bar fill available space */
.leadbarInner{gap: 18px !important}
.leadbarMeterBlock{flex: 1 1 auto !important; width: 100% !important}
.servedBar{width: 100% !important; max-width: none !important}




/* Leadbar: barRow puts progress + buttons on same line (perfect alignment) */
.leadbarInner{
  align-items: stretch !important;
}
.barRow{
  display:flex;
  align-items:center;
  gap: 14px;
  width:100%;
}
.barRow .servedBar{
  flex: 1 1 auto;
  min-width: 180px;
}
.barRow .leadbarActions{
  flex: 0 0 auto;
  display:flex;
  gap: 10px;
  align-items:center;
}
@media (max-width: 860px){
  .barRow{flex-direction:column; align-items:stretch}
  .barRow .leadbarActions{width:100%}
  .barRow .ctaBtn{flex:1; min-width:0}
  .barRow .servedBar{width:100%}
}


/* Service areas CTA row */
.svcCtaRow{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:14px;
  margin-bottom:10px;
}










/* Quiz progress bar */
.qProgress{height:10px;border-radius:999px;background:rgba(14,20,30,.08);overflow:hidden}
.qProgressFill{height:100%;width:0%;border-radius:999px;transition:width 700ms ease;background:linear-gradient(90deg,#b98a2c,#f2d37a,#b98a2c)}
.qProgressLabel{font-weight:800;font-size:12px;color:rgba(11,18,32,.7)}


/* Leadbar: top row uses grid so label + count never wrap into dead space */
.leadbarMeterBlock{display:flex; flex-direction:column; gap: 12px !important}
.roadTopRow{
  display:grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 16px;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}
.roadTopRow .roadLabel{
  margin:0 !important;
  line-height: 1.05;
}
.roadTopRow .roadCount{
  display:flex;
  align-items: baseline;
  gap: 6px;
  justify-content: flex-end;
  margin:0 !important;
  white-space: nowrap;
}
@media (max-width: 560px){
  .roadTopRow{
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: start;
  }
  .roadTopRow .roadCount{justify-content:flex-start}
}


/* Booking modal */
.modal{position:fixed; inset:0; display:none; z-index:9999}
.modal.isOpen{display:block}
.modalBackdrop{position:absolute; inset:0; background:rgba(11,15,20,.42); backdrop-filter: blur(6px)}
.modalCard{
  position:relative;
  width:min(920px, calc(100% - 28px));
  margin: 6vh auto;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(199,163,87,.22);
  border-radius: 22px;
  box-shadow: 0 30px 90px rgba(0,0,0,.25);
  overflow:hidden;
}
.modalTop{
  display:flex; align-items:center; justify-content:space-between;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(14,20,30,.08);
}
.modalTitle{font-weight: 900; letter-spacing: -0.02em}
.modalClose{
  width: 38px; height: 38px; border-radius: 12px;
  border: 1px solid rgba(14,20,30,.12);
  background: rgba(255,255,255,.75);
  font-size: 22px; line-height: 1;
}
.modalBody{padding: 14px 18px 18px}
.modalHint{margin-bottom:10px}
.modalFrame{
  width:100%;
  aspect-ratio: 16/10;
  border-radius: 16px;
  overflow:hidden;
  border: 1px solid rgba(14,20,30,.10);
  background: rgba(255,255,255,.85);
}
#bookingFrame{width:100%; height:100%}
.modalActions{display:flex; justify-content:flex-end; margin-top:12px}
@media (max-width: 640px){
  .modalCard{margin: 4vh auto}
  .modalFrame{aspect-ratio: 10/14}
}


/* Service areas hero (clean, no confusing background UI) */
.heroWrap.areasHero{
  background: linear-gradient(135deg, rgba(255,255,255,1), rgba(255,255,255,.92));
}
.heroWrap.areasHero::before,
.heroWrap.areasHero::after{display:none}
.heroContent.single{grid-template-columns: 1fr}
.heroCard.wide{max-width: 920px}
.heroCtas{display:flex; gap:12px; flex-wrap:wrap; margin-top:14px}
.heroSearch{margin-top:14px}
.heroSearch input{
  width:100%;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(14,20,30,.12);
  background: rgba(255,255,255,.88);
  font-weight:700;
}
.areaGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}
.areaCard{
  display:block;
  padding: 16px 16px 14px;
  border-radius: 18px;
  border: 1px solid rgba(199,163,87,.22);
  background: rgba(255,255,255,.85);
  box-shadow: 0 18px 40px rgba(0,0,0,.06);
  transition: transform .16s ease, box-shadow .16s ease;
}
.areaCard:hover{transform: translateY(-2px); box-shadow: 0 26px 60px rgba(0,0,0,.10)}
.areaTitle{font-weight: 950; letter-spacing: -0.02em; text-transform: capitalize}
.areaSub{margin-top:6px; color: rgba(11,18,32,.72); font-weight:600}
.areaMeta{margin-top:10px; font-size: 12px; color: rgba(11,18,32,.55); font-weight:700}
@media (max-width: 980px){.areaGrid{grid-template-columns: repeat(2, minmax(0, 1fr));}}
@media (max-width: 560px){.areaGrid{grid-template-columns: 1fr;} .heroCard.wide{max-width: 100%}}


.faqGroupTitle{
  margin-top: 12px;
  margin-bottom: 8px;
  font-weight: 950;
  letter-spacing: -0.02em;
  color: rgba(11,18,32,.82);
}


/* Service areas hero tabs */
.heroTabs{display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:18px}
.pillBtn{display:inline-flex; align-items:center; justify-content:center; padding:12px 16px; border-radius:999px; font-weight:900; letter-spacing:.01em; text-decoration:none; border:1px solid rgba(12,18,32,.14); background:rgba(255,255,255,.86); color:var(--ink); box-shadow: 0 14px 30px rgba(12,18,32,.10)}
.pillBtn:hover{transform: translateY(-1px)}
.pillPrimary{background: linear-gradient(135deg, rgba(203,167,61,.98), rgba(17,22,34,.98)); color:#0b1220; border-color: rgba(203,167,61,.55)}
.pillGhost{background: rgba(255,255,255,.88); color: var(--ink)}
.heroSearch{display:none !important;}

/* Service Areas hero buttons */
.saBtn{min-width: 240px}
.saBtnPrimary{color: rgba(255,255,255,.98)!important; text-shadow: 0 1px 0 rgba(0,0,0,.15)}
.saBtnPrimary:hover{filter:brightness(1.02)}
.saBtnSecondary{background: rgba(255,255,255,.86)!important; color: rgba(11,18,32,.92)!important; border: 1px solid rgba(11,18,32,.10)!important}

/* Header booking CTA readability */
.btnSecondary{
  background: rgba(11,18,32,.92);
  color: rgba(255,255,255,.96);
  border: 1px solid rgba(255,255,255,.10);
}
.btnSecondary:hover{filter: brightness(1.05)}


/* Infographics (icon cards) */
.infographics h2{margin:0 0 10px}
.infographics .muted{margin:0 0 18px}
.infoGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}
@media (max-width: 980px){ .infoGrid{grid-template-columns: repeat(2, minmax(0,1fr));} }
@media (max-width: 560px){ .infoGrid{grid-template-columns: 1fr;} }

.infoCard{
  border-radius: 22px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(212,175,55,.18);
  padding: 16px 16px 14px;
  box-shadow: 0 20px 65px rgba(11,18,32,.08);
  position:relative;
  overflow:hidden;
}
.infoCard:before{
  content:"";
  position:absolute; inset:-1px;
  background: radial-gradient(540px 240px at 10% 0%, rgba(212,175,55,.22), transparent 55%);
  pointer-events:none;
}
.infoIcon{
  width: 46px; height: 46px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, rgba(212,175,55,.98), rgba(240,212,139,.98));
  box-shadow: 0 12px 28px rgba(11,18,32,.14);
  margin-bottom: 10px;
}
.infoIcon:after{
  content:"";
  width: 18px; height: 18px;
  border-radius: 6px;
  background: rgba(11,18,32,.90);
  -webkit-mask: var(--icon) center/contain no-repeat;
          mask: var(--icon) center/contain no-repeat;
}
.infoIcon.icon-target{--icon:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black"><path d="M12 2a10 10 0 100 20 10 10 0 000-20zm0 4a6 6 0 110 12 6 6 0 010-12zm0 3a3 3 0 100 6 3 3 0 000-6z"/></svg>');}
.infoIcon.icon-form{--icon:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black"><path d="M7 4h10v2H7V4zm-2 4h14v2H5V8zm2 4h10v2H7v-2zm-2 4h14v2H5v-2z"/></svg>');}
.infoIcon.icon-check{--icon:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black"><path d="M9 16.2l-3.5-3.5L4 14.2l5 5 12-12-1.5-1.5z"/></svg>');}
.infoIcon.icon-nutrition{--icon:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black"><path d="M11 2c0 6-4 7-4 12a6 6 0 0012 0c0-5-4-6-4-12h-4z"/></svg>');}
.infoIcon.icon-graph{--icon:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black"><path d="M3 3h2v18H3V3zm4 10h2v8H7v-8zm4-6h2v14h-2V7zm4 4h2v10h-2V11zm4-8h2v18h-2V3z"/></svg>');}
.infoIcon.icon-pin{--icon:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="black"><path d="M12 2a7 7 0 00-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 00-7-7zm0 9.5a2.5 2.5 0 110-5 2.5 2.5 0 010 5z"/></svg>');}

.infoTitle{font-weight: 950; font-size: 18px; margin: 2px 0 6px; color: rgba(11,18,32,.96)}
.infoDesc{color: rgba(11,18,32,.70); line-height:1.35; font-size: 14.5px}

/* Service Areas primary CTA */
.serviceCTA{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 14px 18px;
  border-radius: 999px;
  font-weight: 950;
  text-decoration:none;
  background: linear-gradient(135deg, rgba(212,175,55,1), rgba(240,212,139,1));
  color: rgba(10,14,20,.96);
  box-shadow: 0 18px 50px rgba(11,18,32,.18);
  border: 1px solid rgba(10,14,20,.08);
  margin-top: 14px;
}
.serviceCTA:hover{transform: translateY(-1px); filter: brightness(1.02)}


/* Ensure fixed leadbar never covers footer content */
:root{ --leadbar-h: 0px; }
body{ padding-bottom: calc(var(--leadbar-h) + env(safe-area-inset-bottom)); }


footer{ padding-bottom: calc(26px + var(--leadbar-h)); }
