@import url(http://fonts.googleapis.com/css?family=Muli:400,300);
/* 
font-family: 'Muli', sans-serif;
*/

@charset "UTF-8";
/* CSS Document */

/* Typography */
body {}
p, li {font-size: 20px; color: #3f2f29; line-height: 24px;font-family: "Open Sans", Arial, Helvetica, sans-serif;}
p {margin: 0 0 30px 0;}
h1, h2, h3, h4, h5 {color: #e24821; margin: 0 0 25px 0; font-family: 'Muli', sans-serif; }
a {color: #e24821; }
a:hover {color; color: #3f2f29;}
h2 {font-size: 20px; font-weight: bold;}
h3 {font-size: 20px; color:#3f2f29;}
h5 {font-size: 14px; font-weight: bold;}
#formtable {width: 90%; color:#ffffff; margin:20px 20px 20px 20px; border-spacing: 10px; border-collapse: separate;}
#formtable2 {width: 475px;}
#listtable {width: 45%; border-spacing: 7px; border-collapse: separate;font-size: 20px; color: #3f2f29; line-height: 24px;font-family: "Open Sans", Arial, Helvetica, sans-serif;}
#about {margin-top: 0px; width: ;font-size: 20px; color: #3f2f29; line-height: 24px;font-family: "Open Sans", Arial, Helvetica, sans-serif; text-align:left;}
#about .callnumber {line-height:1.275em!important;}
#about h2 {color:#93aa46; font-size:24px; font-weight:bold;}
#about h4 {color:#3f2f29; }
#about p {color: #696969; font-size:16px; font-family: Open Sans;}
#top {background-image:url(images/iStock_000073331895_Double.jpg); background-repeat:no-repeat;}
#top p {float:left; width: 60%;}
#bottom {background-image:url(images/f7db750e-baby_0ji0c10hu06h00602r.jpg); background-repeat:no-repeat; height:200px;}
#bottom2 {float: right; width: 45%; margin: 20px 80px 0 50px; color:#559b88; font-size:16px;}
.line3 {margin-top:5px;}
input, textarea {
	width: 100%;     
	background-color: #fff;
    color: #000;
    box-shadow: inset 0px 2px 3px #dddddd;
    -webkit-box-shadow: inset 0px 2px 3px #dddddd;
    -moz-box-shadow: inset 0px 2px 3px #dddddd;
    border-radius: 5px;}
.button {
	margin-top: 10px; 
	color:#ffffff; 
	width:100%; 
	height:40px; 
	text-align:center; 
	background-color: #f7941d;
    background: -webkit-linear-gradient(#f7941d,#d75305);
    background: -moz-linear-gradient(#f7941d,#d75305);
    background: -ms-linear-gradient(#f7941d,#d75305);
    background: -o-linear-gradient(#f7941d,#d75305);
    background: linear-gradient(#f7941d,#d75305);
    box-shadow: inset 0px 1px 0px #ffbb6a,inset 0 -1px 2px #a33f03;
    text-shadow: 1px 1px #521601;
	font-size: 24px; 
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
	border:none; 
	border-radius: 5px;}
	
#liner {
	margin-left: auto;
    margin-right: auto;
    width: 100%;
    height: 8px;
	background: rgb(147 170 70 / 16%);}

h2.page-title {font-size: 40px; font-weight:bold; line-height: 38px;}

#header h2, #header h3, #header h5 { margin: 0 0 5px 0;}
#header .thankyou {margin-top:-20px;}

/* nav */
.navWrap {background: #94ab47;}
.navbar {border:0; margin: 0;}
.navbar li a {font-size: 18px; font-weight: bold; color: #fff; padding-bottom: 10px; padding-top: 7px; text-align: center; padding-right:20px;}
.nav > li > a:hover {background: none; color: #f7e456;}
.navbar {min-height: inherit;}
.navbar li.active a {}
.navbar-header {text-align: center;}
.navbar-toggle {float: none;}
.navbar-toggle .icon-bar {background: #fff;}

#header {background: #e2e7cc url(images/header-gradient.gif) repeat-y center;
}
#header .logo img {margin: 0 auto 15px auto;}
#header .header-hand {background: url(images/header-hand.png) no-repeat; width: 208px; height: 168px;}
#header .header-text {margin-top: 47px; text-align: center; margin-bottom: ;}
#header .free-kit {color: #f7e456; font-size: 26px; font-weight: bold; text-align: center; display: block; clear: both;}
#header .free-kit span {color: #fff; text-transform: uppercase;}

/* home content */

.callouts {padding-top: 15px; text-align: center;}

/* PRE FOOTER */

.preFooterWrap {background: #3f2f29; padding: 50px 0;}
.preFooterWrap h3 {color: #fff; text-transform: uppercase; text-align: center; font-size: 30px; font-weight: normal; margin-bottom:20px;}
.preFooterWrap h4 {color: #f7e878;}
.preFooterWrap p {font-size: 18px; margin: 0 0 10px 0;}
.preFooterWrap .testimonial { color: #fff; font-family: 'Muli', sans-serif; background: url(images/quotes.png) no-repeat top left; padding: 0 0 0 20px; font-weight: 300; line-height: normal;}
.preFooterWrap .testimonial em {font-size: 14px; font-style: normal; display: block;}
.preFooterWrap a.more {color: #a5715e; text-decoration:underline; font-size: 14px;}
.preFooterWrap .video {margin-bottom: 15px;}
.preFooterWrap .video iframe {height: 450px;}

/* FOOTER */
	
#footer {background: url(images/bg-footer.gif); padding: 40px 0 60px 0; text-align: center;}
#footer p {color: #fff; font-size: 14px; line-height: normal; font-family: 'Muli', sans-serif;}
#footer a, #footer span {color: #f7e878; }
#footer .tagline h2, #footer .tagline h3,#footer .tagline h5 {margin: 0 0 5px 0; color: #fff; font-size: 18px;}
#footer .tagline h3 {font-weight: normal; font-size: 14px;}
#footer .tagline h5 {font-weight: normal; font-size: 12px;}

/* RESPONSIVE */
.container {max-width: 1140px; width: 100%; }

@media all and (min-width: 768px)  and (max-width: 980px) {


}
@media all and (min-width: 768px) {
#header .logo img {margin: 0 0 15px 0;}
#header .header-text {text-align: right;}
.home .callouts {margin-top: -40px; }
#footer {text-align: left;}
#footer .tagline h2, #footer .tagline h3,#footer .tagline h5 {text-align: right;}


}
@media all and (min-width: 980px) {
#header .free-kit {position: absolute; right: 0; padding: 10px 20px; background: #94ab47;}
.home .page-title {}
.home h2.page-title .line2 {display: block; padding-left: 45px;}
.home h2.page-title .line3 {display: block; padding-left: 90px;}
}
@media all and (min-width: 980px) and (max-width: 1100px) {
.home .page-title {font-size: 28px;}

}
@media all and (min-width: 1000px) {


}

@media all and (max-width: 768px) {
	#bottom {background-image:none;}
	#bottom2 {width:90%; margin:10px 20px;}
	#formtable2 {width: 100%;}
	#formtable {margin:10px 0;border-spacing: 10px;}
	#listtable {width:80%;}
	#top p {float:left; width: 100%;}
p, li {font-size: 20px;}
#about p {font-size:20px;}	
#about h4 {font-size:24px;}
}

/* === HERO: text 50% left over background image (right) === */
#top{
  position: relative;
  background: url(images/iStock_000073331895_Double.jpg) no-repeat right center;
  background-size: cover;
  padding: 32px 0 24px;
}

/* Soft white panel over the left half for readability */
#top::before{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0.98) 0%,
    rgba(255,255,255,0.98) 50%,
    rgba(255,255,255,0.60) 60%,
    rgba(255,255,255,0.00) 75%
  );
  pointer-events: none;
}

/* Make the hero copy a true 50% column on the left */
#top .page-title,
#top p,
#top #listtable{
  position: relative;        /* above the gradient */
  z-index: 1;
  width: 50%;
  float: left;
  text-align: left;
  margin: 0 0 14px 0;
}

/* Ensure the benefits table matches 50% and looks tidy */
#top #listtable{
  width: 50% !important;     /* override older 45% rule */
  border-collapse: separate;
}
#top #listtable td{ padding: 6px 10px; }

/* Clear the floats so the #top section wraps the content height */
#top::after{ content:""; display:block; clear:both; }

/* Hide the empty first page-title (it's just   in your HTML) */
#top h2.page-title:first-child{ display:none; }

/* Mobile: stack full width and simplify the gradient */
@media (max-width: 768px){
  #top{
    background-position: center top;
    background-size: cover;
    padding: 24px 0 16px;
  }
  #top .page-title,
  #top p,
  #top #listtable{
    width: 100%;
    float: none;
  }
  #top::before{
    background: linear-gradient(
      180deg,
      rgba(255,255,255,0.98) 0%,
      rgba(255,255,255,0.00) 60%
    );
  }
}
/* Stack hero text on the left column (50%) */
#top .page-title{
  width: 50%;
  float: left;
}

/* Make everything after the heading start on a new line in the same 50% column */
#top p,
#top #listtable{
  width: 100% !important;
  float: left;
  clear: left;              /* <-- ensures it sits below the heading */
  text-align: left;
  margin: 0 0 14px 0;
}

/* (optional) tighten spacing between items a touch */
#top #listtable td{ padding: 6px 10px; }

/* ========== HERO: 50% left text over right-side background ========== */
#top{
  position: relative;
  background: url(images/iStock_000073331895_Double.jpg) no-repeat right center;
  background-size: cover;
  padding: 32px 0 24px;
}

/* readability blend from white (left) into the photo (right) */
#top::before{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0.98) 0%,
    rgba(255,255,255,0.98) 50%,
    rgba(255,255,255,0.60) 60%,
    rgba(255,255,255,0.00) 75%
  );
  pointer-events:none;
}

/* wrap hero copy in a true left column */
.hero-left{
  width: 50%;
  float: left;
  position: relative; /* above gradient */
  z-index: 1;
  text-align: left;
}
#top h2.page-title:first-child{ display:none; } /* hide the &nbsp; title */

/* Make table use the column width (not 45%) */
.hero-left #listtable{ width: 100% !important; border-collapse: separate; }
.hero-left #listtable td{ padding: 6px 10px; }

/* clear floats so section height equals content height */
#top::after{ content:""; display:block; clear:both; }

/* ========== Hip CTA under bullets ========== */
.consult-cta{ margin: 8px 0 14px 0; }
.consult-eyebrow{
  margin: 0 0 8px 0;
  font-size: 16px;
  letter-spacing: .02em;
  color: #6b6b6b;
}
.consult-actions{ display: flex; gap: 10px; flex-wrap: wrap; }
.cta{
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 14px; border-radius: 999px; text-decoration: none;
  font-weight: 700; line-height: 1;
	font-size: 20px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}
.cta.call{ background:#fff; color:#e24821; }
.cta.text{ background:#005ea5; color:#fff; border-color:transparent; }
.cta:hover{ filter: brightness(1.03); }
.cta:active{ transform: translateY(1px); }
.cta .cta-label{ text-transform: uppercase; font-size:12px; opacity:.9; }
.consult-subcopy{     display: block;
    margin-top: 21px;
    color: #8a8a8a; }

/* Mobile: stack the hero column and simplify the gradient */
@media (max-width: 768px){
  .hero-left{ width: 100%; float: none; }
  #top{
    padding: 24px 0 16px;
    background-position: center top;
  }
  #top::before{
    background: linear-gradient(
      180deg,
      rgba(255,255,255,0.98) 0%,
      rgba(255,255,255,0.00) 55%
    );
  }
}

/* --- FIX: stack hero content and push CTA below --- */

/* Stop legacy floats inside the hero */
#top p{ float:none !important; width:auto !important; }

/* Inside the 50% left column, everything should be block-level and full-width */
.hero-left > *{
  float: none !important;
  width: 100% !important;
}

/* Keep the CTA firmly below the bullets */
.hero-left .consult-cta{
  clear: both;     /* ensures it starts below any prior floats */
  margin-top: 8px;
}

/* Tidy the list spacing */
.hero-left #listtable{ margin-top: 8px; }
/* --- FIX 1: Bring the big headline back and keep it at the top --- */
.hero-left h2.page-title{
  display: block !important;
  visibility: visible !important;
  color: #e24821;
  font-size: 47px;
  line-height: 1.1;
  margin: 0 0 14px 0;
}
/* make the paragraph/list start under the headline */
.hero-left p,
.hero-left #listtable{
  clear: left;                 /* prevents sitting alongside the H2 */
}

/* --- FIX 2: Make the left column wider on desktop (table will follow) --- */
@media (min-width: 992px){
  .hero-left{ width: 54% !important; }  /* was 50% */
}
/* inside that column, let the list/table use the full column width */
.hero-left #listtable{ width: 100% !important; }

/* optional: slightly larger type/spacing in the list so it fills the space nicely */
.hero-left #listtable td{ padding: 8px 12px; }

/* --- FIX 3: Make the blue form a little wider --- */
/* increase the panel’s max width; keep mobile 100% */
#formtable2{
  width: 100% !important;
  max-width: 560px;            /* was ~475px */
  margin-left: auto;
  margin-right: 0;             /* right-align in its column */
}
/* if you want just a touch more width on very large screens, bump it up */
@media (min-width: 1200px){
  #formtable2{ max-width: 700px; }
}

/* safety: legacy float that hid/shifted things */
#top p{ float: none !important; width: auto !important; }

/* Make the inner form column span the full right side */
.row.callouts > .col-sm-6{
  width: 100% !important;
  float: none !important;
}

/* Widen the blue panel */
#formtable2{
  width: 100% !important;
  max-width: 640px !important;   /* try 640–680 if you want more */
  margin-left: auto;
  margin-right: 0;                /* keep it right-aligned */
}

/* Optional: give it a touch more on very large screens */
@media (min-width: 1200px){
  #formtable2{ max-width: 680px !important; }
}

/* Keep inner content comfy without wasting width */
#formtable{ width: 94%; } /* was 90% */
/* ===== Pull-quote styling in the About section =====
   Targets the last paragraph in #about (the Ashley quote) */
#about p:last-of-type strong em{
  display: block;
  position: relative;
  font-style: italic;
  font-weight: 700;
  font-size: clamp(18px, 2.1vw, 20px);
  line-height: 1.6;
  color: #93aa46;

  /* card look */
  background: #fff;
  padding: 18px 22px 18px 58px;
  margin: 12px auto 0;
  border-left: 6px solid #93aa46;          /* brand green accent */
  border-radius: 8px;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  max-width: 680px;                         /* keeps it tidy on wide screens */
}

/* big decorative opening quote */
#about p:last-of-type strong em::before{
  content: "“";
  position: absolute;
  left: 16px;
  top: -10px;
  font-size: 64px;
  line-height: 1;
  color: rgba(147,170,70,.85);
  font-family: 'Muli', serif;
}

/* faint closing quote for style */
#about p:last-of-type strong em::after{
  content: "”";
  position: absolute;
  right: 12px;
  bottom: -28px;
  font-size: 52px;
  line-height: 1;
  color: rgba(147,170,70,.30);
  font-family: 'Muli', serif;
}

/* small-screen polish */
@media (max-width: 768px){
  #about p:last-of-type strong em{
    padding-left: 48px;
    max-width: 100%;
  }
  #about p:last-of-type strong em::before{ font-size: 52px; top: -6px; }
  #about p:last-of-type strong em::after{ font-size: 44px; bottom: -22px; }
}

/* ===== Mobile polish (phones & small tablets) ===== */
@media (max-width: 767.98px){
  /* container breathing room */
  .container{ padding-left:16px; padding-right:16px; }

  /* hero block spacing + image fade */
  #top{ padding:16px 0 8px; background-position:center top; }
  #top::before{
    background: linear-gradient(
      180deg,
      rgba(255,255,255,0.98) 0%,
      rgba(255,255,255,0.95) 55%,
      rgba(255,255,255,0.85) 100%
    );
  }

  /* left column fills width on mobile */
  .hero-left{ width:100% !important; float:none !important; }

  /* headline size + spacing */
  .hero-left h2.page-title{
    font-size: 30px !important;     /* was huge on mobile */
    line-height: 1.15;
    margin: 4px 0 10px 0;
  }

  /* intro paragraph + list spacing */
  .hero-left p{ margin: 8px 0 10px; }
  .hero-left #listtable{
    width:100% !important;
    margin: 6px 0 8px;
  }
  .hero-left #listtable td{ padding: 6px 8px; }

  /* CTA: stack and go full width with comfy touch targets */
  .consult-cta{ margin-top: 10px; }
  .consult-actions{ display:block; }
  .consult-actions .cta{
    display:block;
    width:100%;
    text-align:center;
    padding:12px 14px;
    margin:0 0 8px 0;
  }
  .consult-subcopy{ margin-top: 4px; }

  /* About section spacing after hero */
  #about{ margin-top: 14px; }
  #about h2{ margin: 8px 0; }
}
/* Wider checkmark gutter on mobile */
@media (max-width: 767.98px){
  /* give the icon column real room */
 #top #listtable{ width:100% !important; }
  #listtable td{ vertical-align: top; }
  #listtable td:first-child{
    width: 52px !important;      /* was ~28px */
    padding-right: 12px;
  }
  #listtable td:first-child img{
    width: 32px;                  /* slightly larger check */
    height: auto;
    display: block;
    margin-top: 4px;              /* aligns with first text line */
  }
  /* let the text cell use everything else */
  #listtable td:nth-child(2){
    width: calc(100% - 52px) !important;
  }
}
/* ===== Modernize the blue form fields ===== */

/* Labels (the text before each input) */
#formtable td{
  color: #e8f1fb;              /* softer white on blue */
  font-weight: 600;
  font-size: 14px;
  line-height: 1.2;
  padding-top: 8px;            /* a little breathing room between rows */
}

/* Inputs/Textareas */
#formtable input,
#formtable textarea,
#formtable select{
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  box-sizing: border-box;
  background: #fff;
  color: #1f2d3d;
  border: 1px solid #d6dde5;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 16px;
  line-height: 1.2;
  height: 48px;                /* modern field height */
  box-shadow: none;            /* remove old inset shadow */
  transition: border-color .15s ease, box-shadow .15s ease;
}

/* Textarea specifics */
#formtable textarea{
  min-height: 120px;
  height: auto;
  line-height: 1.5;
  resize: vertical;
}

/* Focus state */
#formtable input:focus,
#formtable textarea:focus,
#formtable select:focus{
  outline: none;
  border-color: #2c7acb;                          /* blue focus ring */
  box-shadow: 0 0 0 3px rgba(0,94,165,.22);
}

/* Placeholder color (optional) */
#formtable ::placeholder{
  color: #9aa8b6;
}

/* Button: a bit taller & rounder (keeps your gradient) */
#formtable .button,
#button{
  min-height: 52px;
  font-size: 20px;
  border-radius: 10px;
  letter-spacing: .2px;
}

/* reCAPTCHA spacing */
.g-recaptcha{ margin: 10px 0 12px; }

/* Panel inner width a smidge roomier */
#formtable{ width: 94%; }  /* was 90% */

/* Mobile polish for fields */
@media (max-width: 767.98px){
  #formtable input,
  #formtable textarea,
  #formtable select{ font-size: 16px; height: 46px; }
  #formtable textarea{ min-height: 110px; }
}

/* Keep the submit button's original orange gradient */
#formtable .button,
#button{
  background: -webkit-linear-gradient(#f7941d,#d75305) !important;
  background: -moz-linear-gradient(#f7941d,#d75305) !important;
  background: -ms-linear-gradient(#f7941d,#d75305) !important;
  background: -o-linear-gradient(#f7941d,#d75305) !important;
  background: linear-gradient(#f7941d,#d75305) !important;
  box-shadow: inset 0 1px 0 #ffbb6a, inset 0 -1px 2px #a33f03 !important;
  color: #fff !important;
  border: none !important;
}

/* Optional: don't alter color on hover */
#formtable .button:hover,
#button:hover{
  filter: none !important;
}
/* ===== Mobile header spacing fix ===== */
@media (max-width: 767.98px){
  /* Pull the call/text block up and tighten vertical rhythm */
  #header .header-text{
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    text-align: center;
  }
  #header .header-text h3,
  #header .header-text h2,
  #header .header-text h5{
    margin: 2px 0 !important;
    line-height: 1.2;
  }

  /* Slightly reduce the logo’s bottom margin so everything sits closer */
  #header .logo img{
    margin: 8px auto 6px auto !important;
  }

  /* Optional: slim the green divider a touch on mobile */
  #liner{ height: 10px; }
}
/* ===== Center the fields inside the blue form on mobile ===== */
@media (max-width: 767.98px){
  /* Make the outer blue cell padding even on both sides */
  #formtable2 > tbody > tr > td{
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  /* Center the inner form block and cap its width */
  #formtable{
    width: 100% !important;
    max-width: 520px;          /* tweak 480–560 to taste */
    margin: 0 auto !important; /* <-- centers the fields stack */
  }

  /* Inputs already full-width; just ensure consistent look */
  #formtable input,
  #formtable textarea,
  #formtable select{
    width: 100%;
    display: block;
  }

  /* Center reCAPTCHA and submit area nicely */
  #formtable .g-recaptcha{ display: block; margin: 10px auto 12px; }
  #formtable .button{ display: block; width: 100%; max-width: 520px; margin: 0 auto; }
}
/* Radio/checkbox cleanups so they don't inherit text field styles */
#formtable input[type="radio"],
#formtable input[type="checkbox"]{
  width: auto !important;
  height: auto !important;
  box-shadow: none !important;
  border: none !important;
  margin: 0;
}

/* Horizontal layout + spacing for the new role chooser */
.role-choice{
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.role-choice .choice{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #fff;           /* readable on the blue panel */
  font-weight: 600;
}

/* Stack nicely on phones */
@media (max-width: 767.98px){
  .role-choice{ gap: 12px; }
}
/* Fix radios/checkboxes made non-interactive by generic input styles */
#formtable input[type="radio"],
#formtable input[type="checkbox"]{
  -webkit-appearance: auto !important;  /* restore default */
  appearance: auto !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 6px 0 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  cursor: pointer;
  vertical-align: middle;
}

/* Optional: nicer hit-area with label */
.role-choice .choice{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.role-choice .choice input{ margin-right: 6px; }
/* Tiny gap between label text and the field */
#formtable td > input,
#formtable td > textarea,
#formtable td > select{
  margin-top: 8px;   /* tweak to 6–10px to taste */
}

/* Keep the radio group nicely spaced under its label */
#formtable .role-choice{ 
  margin-top: 8px; 
}
/* Spacing between labels and fields (keeps things tidy) */
#formtable td > input,
#formtable td > textarea,
#formtable td > select{
  margin-top: 8px;
}

/* Consent block styling */
.sms-consent{
  margin-top: 6px;
  color: #ffffff; /* readable on blue panel */
}
.sms-consent .consent-label{
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-weight: 700;
  margin-bottom: 6px;
}
.sms-consent .consent-label input[type="checkbox"]{
  /* ensure checkbox is clickable (overrides “modern input” styles) */
  -webkit-appearance: checkbox !important;
  appearance: checkbox !important;
  width: auto !important;
  height: auto !important;
  margin-top: 2px !important;
}

.sms-consent .legal-copy{
  font-size: 13px;
  line-height: 1.4;
  color: #e8f1fb;
}
.sms-consent .legal-copy a{ color: #f7e878; text-decoration: underline; }

/* Radios/checkboxes stay native/clickable */
#formtable input[type="radio"],
#formtable input[type="checkbox"]{
  -webkit-appearance: auto !important;
  appearance: auto !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 6px 0 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  cursor: pointer;
}
/* CONSENT: title line + one paragraph that starts with the checkbox */
.consent-wrap{
  text-align: left;           /* override any centered parent td */
  color: #fff;                /* keep your panel color */
  font-size: 14px;
  line-height: 1.4;
  margin: 0 0 8px 0;
}

.consent-title{
  margin: 0 0 6px 0;          /* small space under the heading */
  font-weight: 500;
}

.consent-line{
  display: inline-flex;       /* checkbox + paragraph on one line */
  align-items: flex-start;
	font-size: 14px;font-weight: normal;
  gap: 8px;
  margin: 0;
}

.consent-line input[type="checkbox"]{
  margin-top: 2px;            /* align box with first line of text */
  flex: none;
}

.consent-line span{
  display: inline;            /* keeps it as one flowing paragraph */
}

/* Small screens still look fine; no changes necessary */
@media (max-width: 480px){
  .consent-line{ align-items: flex-start; }
}
/* CONSENT: all white, not bold; links restored */
.consent-wrap {
  text-align: left;
  color: #ffffff;
  font-size: 14px;
  line-height: 1.4;
  margin: 0 0 8px 0;
}
.consent-title {
  margin: 0 0 6px 0;
  font-weight: 400;            /* no bold */
  color: #ffffff!important;
}
.consent-line{
  display: inline-flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
}
.consent-line input[type="checkbox"]{
  margin-top: 2px;
  flex: none;
}
.consent-line span{
  display: inline;
  color: #ffffff;              /* all white text */
}

/* kill any leftover <strong> weight just in case */
.consent-wrap strong{ font-weight: 400; }

/* link color + underline so they stand out on blue panel */
.consent-wrap a{
  color: #f7e878!important;              /* same yellow used elsewhere */
  text-decoration: underline;
}

/* small screens */
@media (max-width: 480px){
  .consent-line{ align-items: flex-start; }
}

/* === TYPOGRAPHY NORMALIZATION (append at end) ===================== */

/* Base body copy (desktop) */
html { font-size: 100%; }
body {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  font-size: 18px;            /* unified body size */
  line-height: 1.55;          /* comfy reading */
  color: #3f2f29;
}

/* Paragraphs & list items everywhere */
p, li {
  font-size: 18px !important;      /* overrides earlier 20px */
  line-height: 1.55 !important;
  color: #3f2f29;
  margin-bottom: 18px;              /* more even rhythm */
}

/* Keep CTA buttons the same (no change to your .cta sizing) */

/* Hero bullets table uses body size */
#listtable,
#listtable td {
  font-size: 18px !important;
  line-height: 1.55 !important;
}

/* About section body matches body size */
#about p {
  font-size: 18px !important;
  line-height: 1.55 !important;
  color: #696969;                    /* keep your muted tone */
}

/* Form labels & help text—match body size for consistency */
#formtable td {
  font-size: 16px !important;        /* slightly smaller label */
  line-height: 1.4 !important;
  color: #e8f1fb;
}

/* Inputs keep 16px already; ensure placeholders match */
#formtable ::placeholder { font-size: 16px; }

/* SMS consent paragraph (already set); just ensure consistency */
.consent-wrap,
.consent-line span,
.sms-consent .legal-copy {
  font-size: 14px !important;
  line-height: 1.45 !important;
}

/* Footer small text stays small */
#footer p { font-size: 14px !important; }

/* Mobile tuning */
@media (max-width: 767.98px){
  body { font-size: 17px; }          /* slight downscale on phones */
  p, li { margin-bottom: 14px; }
  #listtable td { padding: 6px 8px; }/* already present; keeps tidy */
}
/* ===== Vertical rhythm (sections & headings) ===== */
:root{
  --rhythm-1: 8px;
  --rhythm-2: 12px;
  --rhythm-3: 16px;
  --rhythm-4: 24px;
  --rhythm-5: 32px;
  --rhythm-6: 48px;
}

/* Global paragraph/list spacing */
p, li { margin-bottom: var(--rhythm-4); }

/* Headings spacing */
h1,h2,h3,h4,h5 { margin: 0 0 var(--rhythm-4) 0; }

/* Major sections */
#top        { padding: var(--rhythm-6) 0 var(--rhythm-4); }
#about      { margin-top: var(--rhythm-5); }
.callouts   { padding-top: var(--rhythm-4); }
#footer     { padding-top: var(--rhythm-6); }

/* Table list spacing (hero checks) */
#listtable  { margin-top: var(--rhythm-3); }
#listtable td { padding: 6px 10px; }

/* Form rows: a little breathing room */
#formtable td { padding-top: var(--rhythm-2); }
#formtable td > input,
#formtable td > textarea,
#formtable td > select { margin-top: var(--rhythm-2); }

/* Mobile tweaks */
@media (max-width: 767.98px){
  #top       { padding: var(--rhythm-4) 0 var(--rhythm-3); }
  #about     { margin-top: var(--rhythm-4); }
  .callouts  { padding-top: var(--rhythm-3); }
  #footer    { padding-top: var(--rhythm-5); }
}
/* ===== Focus visibility everywhere (keyboard users) ===== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid #f7e456;  /* brand yellow */
  outline-offset: 2px;
}

/* Make links on dark backgrounds more obvious on hover */
#footer a:hover,
#footer a:focus { text-decoration: underline; }

/* Ensure placeholder contrast a bit darker */
::placeholder { color: #7c8996; }

/* Checkbox / radio are easy to hit */
#formtable input[type="checkbox"],
#formtable input[type="radio"]{
  transform: scale(1.1);
}

/* Improve body copy contrast in the About block (slightly darker) */
#about p { color: #565656; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  * { animation: none !important; transition: none !important; }
}
/* ===== Footer layout polish (no HTML changes) ===== */

/* Turn ONLY the footer row into a flexible, even 3-column layout */
#footer .row{
  display: flex;
  flex-wrap: wrap;
  gap: 24px 40px;              /* row gap | column gap */
  align-items: flex-start;
}

/* Neutralize Bootstrap floats just in the footer and let flex drive widths */
#footer .row > [class*="col-"]{
  float: none !important;
  flex: 1 1 260px;             /* 3 columns on wide, 1–2 on smaller */
  max-width: 420px;            /* prevents a super-wide middle column */
}

/* Typography & spacing inside footer */
#footer h2, #footer h3, #footer h5{ margin: 0 0 6px 0; }
#footer p{ margin: 0 0 8px 0; }
#footer a{ color: #f7e878; text-decoration: none; }
#footer a:hover, #footer a:focus{ text-decoration: underline; }

/* On narrow screens: center and stack */
@media (max-width: 768px){
  #footer .row{ justify-content: center; text-align: center; }
  #footer .row > [class*="col-"]{
    flex: 1 1 100%;
    max-width: 620px;
  }
}

/* Optional: moderate vertical padding if the rhythm made it too tall */
#footer{ padding-top: 32px; padding-bottom: 48px; }