:root {
      --pink: #F61E98;
      --red: #F5241F;
      --orange: #F47621;
      --yellow: #FCD827;
      --green: #93C83D;
	  --pinegreen: #5C947C;
      --blue: #458CCB;
      --purple: #9E5FA2;
	  --lightpurple: #7E669C;
	  --darkpurple: #484F7F;
	  --darkestpurple: #434A73;
      --lavender: #807FB0;
	  --cherry: #F95245;
	  --gold: #B0A96E;
	  --brown: #898561;
      --max-width: 1440px;
      --header-height: 100px;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    body {
      font-family: Arial, sans-serif;
      color: #333;
      background: #fff;
    }

    img {
      max-width: 100%;
      display: block;
    }

    a {
      text-decoration: none;
    }
	
	a.bluelink {
      color: #458CCB;
	}
	
	a.bluelink:hover {
      color: #67A4D7;		
	}
	
	@font-face {
		font-family: 'CuteDino';
		src: url('../fonts/cutedino.woff2') format('woff2'),
		font-weight: normal;
		font-style: normal;
	}
	
	@font-face {
		font-family: 'ThisBlog';
		src: url('../fonts/thisblog.woff2') format('woff2'),
		font-weight: normal;
		font-style: normal;
	}
	
	@font-face {
		font-family: 'LoveYaLikeASister';
		src: url('../fonts/loveyalikeasister.woff2') format('woff2'),
		font-weight: normal;
		font-style: normal;
	}
	
	@font-face {
		font-family: 'KGMidnightMemories';
		src: url('../fonts/KGMidnightMemories.woff2') format('woff2'),
		font-weight: normal;
		font-style: normal;
	}

.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  padding: 0 18px;
  transition: all .3s ease;
}

.site-header.scrolled .logo-wrap,
.site-header.scrolled .nav-wrap {
  height: 80px;
}

.site-header.scrolled .nav-tab {
  height: 70px;
}

.site-header.scrolled .nav-tab.active,
.site-header.scrolled .nav-tab:hover {
  height: 85px;
}

    .header-inner {
      max-width: var(--max-width);
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 24px;
    }

    .logo-wrap,
    .nav-wrap {
      height: var(--header-height);
      background: #fff;
      border-radius: 0 0 28px 28px;
      display: flex;
      align-items: center;
    }

    .logo-wrap {
      padding: 0 34px;
    }

    .logo img {
      width: 350px;
      max-width: 100%;
    }

    .nav-wrap {
      padding: 0 12px;
    }

    .desktop-nav {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      height: 100%;
    }

    .nav-tab {
      height: 86px;
      min-width: 145px;
      padding: 0 22px;
      border-radius: 0 0 24px 24px;
      color: #fff;
      font-weight: 800;
      font-size: 1.35rem;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      transition: 0.25s ease;
    }

    .nav-tab img {
      width: 30px;
      height: 30px;
      object-fit: contain;
    }

    .nav-tab.active,
    .nav-tab:hover {
      height: 112px;
      filter: brightness(1.08);
    }

    .home { background: var(--orange); }
    .about { background: var(--yellow); }
    .program { background: var(--green); }
    .facilities { background: var(--blue); }
    .contact { background: var(--purple); }

    .mobile-menu-button {
      display: none;
      width: 74px;
      height: 74px;
      border: 0;
      border-radius: 0 0 18px 18px;
      background: #fff;
      cursor: pointer;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      gap: 7px;
    }

    .mobile-menu-button span {
      width: 38px;
      height: 6px;
      border-radius: 999px;
      background: var(--green);
      transition: 0.25s ease;
    }

    .mobile-menu-button.open span:nth-child(1) {
      transform: rotate(45deg) translate(9px, 9px);
    }

    .mobile-menu-button.open span:nth-child(2) {
      opacity: 0;
    }

    .mobile-menu-button.open span:nth-child(3) {
      transform: rotate(-45deg) translate(9px, -9px);
    }

    .mobile-nav-overlay {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.35);
      z-index: 90;
      padding: 110px 18px 0;
    }

    .mobile-nav-panel {
      max-width: 390px;
      margin: 0 auto;
      background: #fff;
      border-radius: 14px;
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .mobile-nav-panel .nav-tab {
      width: 100%;
      height: 68px;
      min-width: 0;
      justify-content: flex-start;
      border-radius: 10px;
      font-size: 1.8rem;
    }

    .mobile-nav-panel .nav-tab:hover {
      height: 68px;
    }

    .mobile-nav-overlay.open {
      display: block;
    }

	
/*--- MAIN HERO ---*/
.hero, .hero-program, .hero-facilities, .hero-facilities1, .hero-facilities2 {
  position: relative;
  min-height: 680px;
  background:
    linear-gradient(to right, rgba(0,0,0,.35), rgba(0,0,0,.05)),
    url("../img/hero-classroom.webp") right center / cover no-repeat;

  background-attachment: fixed;
  display: flex;
  align-items: center;
  padding: 150px 20px 100px;
  overflow: hidden;
}

.hero-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      90deg,
      rgba(36, 15, 47, 0.9),
      rgba(48, 20, 62, 0.68) 43%,
      rgba(48, 20, 62, 0.08) 76%
    ),
    linear-gradient(
      0deg,
      rgba(24, 7, 34, 0.3),
      transparent 45%
    );
}

.hero-shade-green {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      90deg,
      rgba(15, 47, 28, 0.9),
      rgba(20, 62, 37, 0.68) 43%,
      rgba(20, 62, 37, 0.08) 76%
    ),
    linear-gradient(
      0deg,
      rgba(7, 34, 18, 0.3),
      transparent 45%
    );
}

.hero-shade-blue {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      90deg,
      rgba(15, 28, 47, 0.9),
      rgba(20, 37, 62, 0.68) 43%,
      rgba(20, 37, 62, 0.08) 76%
    ),
    linear-gradient(
      0deg,
      rgba(7, 18, 34, 0.3),
      transparent 45%
    );
}

.hero-inner {
  position: relative;
  z-index: 2;
}

.hero-program {
	background:
    linear-gradient(to right, rgba(0,0,0,.35), rgba(0,0,0,.05)),
    url("../img/hero-program.webp") right center / cover no-repeat;
}

.hero-facilities {
	background:
    linear-gradient(to right, rgba(0,0,0,.35), rgba(0,0,0,.05)),
    url("../img/hero-locations.webp") right center / cover no-repeat;
}

.hero-facilities1 {
	background:
    linear-gradient(to right, rgba(0,0,0,.35), rgba(0,0,0,.05)),
    url("../img/hero-facilities.webp") right center / cover no-repeat;
}

.hero-facilities2 {
	background:
    linear-gradient(to right, rgba(0,0,0,.35), rgba(0,0,0,.05)),
    url("../img/hero-facilities2.webp") right center / cover no-repeat;
}

/*--- ABOUT HERO ---*/

.about-page-hero {
  background:
    #FFFFFF
    url("../img/city-bg.webp")
    center bottom / cover
    no-repeat
    fixed;
  padding: 115px 20px 0;
  overflow: hidden;
  z-index: 2;
}

.about-hero-inner {
  max-width: 1000px;
  margin: 0 auto;
  padding-top: 80px;
}

.about-hero-img {
  width: 100%;
  max-width: 600px;
  height: auto;
  margin: 0 auto;
  display: block;
}

.welcome_img {
background-color: #a1ecff;
background:
  url("../img/welcome.png") center bottom / contain no-repeat,
  linear-gradient(
    180deg,
    rgba(161, 236, 255, 1) 0%,
    rgba(255, 255, 255, 1) 79%,
    rgba(255, 255, 255, 1) 100%
  );
}

.bg_bubbles { 
	background: #F9F7DB; 
	background-image: url('../img/bubbles.webp');
	}
	
.bg_rainbow { 
	background: #FFF; 
	background: url("../img/rainbow.webp") center center / contain no-repeat;
	}
	
.bg_kinder {
	background: #FCFAE8;
	background: url("../img/kinder-bg.webp") center center / cover no-repeat;
	}	

.bg_sky {
	background: #ffffff;
	background: radial-gradient(circle, rgba(255, 255, 255, 1) 38%, rgba(217, 240, 255, 1) 100%);
	}	
.bg_sky p {
	line-height: 1.6;
	}	
.bg_sky a:not(.button) {
    color: #458CCB;
    font-weight: 600;
	}

.bg_spring_fade_radial {
background: #75b06f;
background: radial-gradient(circle, rgba(117, 176, 111, 1) 0%, rgba(147, 207, 141, 1) 100%);
	}
	
.bg_sunset {
background: #fada96;
background: linear-gradient(180deg, rgba(250, 218, 150, 1) 0%, rgba(255, 232, 189, 1) 69%, rgba(255, 245, 225, 1) 86%, rgba(255, 255, 255, 1) 100%);
	}	
	
.bg_sunray {
background: #FFFDDB;
background: linear-gradient(180deg, rgba(255, 253, 219, 1) 6%, rgba(252, 252, 235, 1) 50%, rgba(255, 253, 219, 1) 94%);
}

.bg_lime_fade_radial {
	background: #ffffff;
	background: radial-gradient(circle, rgba(255, 255, 255, 1) 38%, rgba(225, 255, 217, 1) 100%);
	}
	
.bg_sandpaper_fade {
	background: #ebe0c5;
	background: linear-gradient(180deg, rgba(235, 224, 197, 1) 0%, rgba(227, 197, 166, 1) 100%);
}

.bg_skin_fade_radial {
	background: #fff9cf;
	background: radial-gradient(circle,rgba(255, 249, 207, 1) 0%, rgba(227, 166, 166, 1) 94%);
	}
	
.bg_koolaid_fade {
	background: #b8659b;
	background: radial-gradient(circle, rgba(184, 101, 155, 1) 0%, rgba(165, 5, 111, 1) 94%);
}

.bg_grape_radial {
	background-color: #947bb3;

	background-image:
		url('../img/bg-academic.webp'),
		radial-gradient(
			circle,
			rgba(148, 123, 179, 1) 16%,
			rgba(126, 102, 156, 1) 100%
		);

	background-repeat:
		repeat,
		no-repeat;
		
	background-size:
		350px 350px,
		cover;
}

.bg_socialization {
	background-color: #458CCB;

	background-image:
		url('../img/bg-social.webp'),
		radial-gradient(
			circle,
			rgba(69, 140, 203, 1) 16%,
			rgba(54, 116, 171, 1) 100%
		);

	background-repeat:
		repeat,
		no-repeat;
		
	background-size:
		350px 350px,
		cover;
}

.bg_exercise {
	background-color: #7DB877;

	background-image:
		url('../img/bg-exercise.webp'),
		radial-gradient(
			circle,
			rgba(125, 184, 119, 1) 16%,
			rgba(101, 158, 96, 1) 100%
		);

	background-repeat:
		repeat,
		no-repeat;
		
	background-size:
		350px 350px,
		cover;
}

.bg_arts {
	background-color: #AE697F;

	background-image:
		url('../img/bg-arts.webp'),
		radial-gradient(
			circle,
			rgba(174, 105, 127, 1) 16%,
			rgba(146, 84, 105, 1) 100%
		);

	background-repeat:
		repeat,
		no-repeat;
		
	background-size:
		350px 350px,
		cover;
}

.bg_independence {
	background-color: #D09668;

	background-image:
		url('../img/bg-independence.webp'),
		radial-gradient(
			circle,
			rgba(208, 150, 104, 1) 16%,
			rgba(178, 124, 82, 1) 100%
		);

	background-repeat:
		repeat,
		no-repeat;
		
	background-size:
		350px 350px,
		cover;
}

.bg_snacks {
	background-color: #64BA9D;

	background-image:
		url('../img/bg-snacks.webp'),
		radial-gradient(
			circle,
			rgba(100, 186, 157, 1) 16%,
			rgba(78, 157, 131, 1) 100%
		);

	background-repeat:
		repeat,
		no-repeat;
		
	background-size:
		350px 350px,
		cover;
}

.bg_guts_radial {
background: #b56982;
background: radial-gradient(circle, rgba(181, 105, 130, 1) 16%, rgba(157, 103, 120, 1) 100%);	
}

.bg_water_fade_radial {
background: #7d71f0;
background: radial-gradient(circle, rgba(125, 113, 240, 1) 0%, rgba(178, 167, 252, 1) 83%);
}

.bg_holiday_fade_radial {
background: #FFF;
background: radial-gradient(circle, rgba(255, 255, 255, 1) 49%, rgba(255, 255, 199, 1) 100%);
}
	
.bg_hot_fade_radial {
background: #797557;
background: linear-gradient(0deg, rgba(121, 117, 87, 1) 16%, rgba(201, 198, 183, 1) 100%);
}

.bg_haze {
background: #A8D0DA;
background: linear-gradient(180deg, rgba(168, 208, 218, 1) 6%, rgba(208, 234, 242, 1) 50%, rgba(168, 208, 218, 1) 94%);		
}

@media (max-width: 900px) {
	
	.hero-content h1 {
		padding: 80px 0;
	}
	
	.program-img {
		width: 100%;
		display: flex;
		justify-content: center; /* Aligns horizontally */
		align-items: center;     /* Aligns vertically */
	}
	.program-img img {
		max-height: 140px;
	}
}

/*--- FACILITIES HERO ---*/

.facilities-page-hero {
background: #FFFFFF url("../img/clouds2.webp") center / cover no-repeat fixed;
  padding: 115px 20px 0;

  display: flex;
  justify-content: center;
  align-items: center;
}	

.facilities-hero-inner {
  max-width: 1000px;
  margin: 0 auto;
}

.facilities-hero-img {
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 0 auto;
  display: block;
}

/*--- CONTACT HERO ---*/

.contact-page-hero {
  width: 100%;
  min-height: 100vh;
  height: auto;

  background:
    #FFFFFF
    url("../img/city-bg.webp")
    center top / cover
    no-repeat
    fixed;

  display: flex;
  flex-direction: column;      /* <-- Add this */
  align-items: center;         /* Center children horizontally */
  justify-content: flex-start; /* Start at the top */

  padding: 135px 20px 60px;

  overflow: visible;
}

.contact-hero-inner {
  max-width: 1000px;
  margin: 0 auto;
}

.contact-hero-img {
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 0 auto;
  display: block;
}

.contact-page-header {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.contact-page-header h1, .contact-page-header h2, .contact-page-header h3 {
	  font-family: 'KGMidnightMemories', sans-serif;
      line-height: 1.05;
      font-weight: 700;
      margin-bottom: 20px;	
	  color: #574C8E;
}

.contact-page-header h1 {
      font-size: 2.3rem;
}

.contact-page-header h2 {
      font-size: 2rem;
}

.contact-page-header h3 {
      font-size: 1.7rem;
}

@media (max-width: 900px) {
	.contact-page-header {
    width: 100%;
    margin-top: -40px;
	}
}


/*--- HERO Helpers ---*/

    .hero-inner {
      max-width: var(--max-width);
      width: 100%;
      margin: 0 auto;
    }

    .hero-content {
      max-width: 760px;
      text-align: center;
      color: #fff;
    }
	
    .subpage_hero-content {
      text-align: center;
    }

    .hero h1, .hero-program h1, .hero-facilities h1, .hero-facilities1 h1, .hero-facilities2 h1 {
	  font-family: 'CuteDino', sans-serif;
      font-size: clamp(2.2rem, 5vw, 4.7rem);
      line-height: 1.05;
      font-weight: 100;
      text-shadow: 4px 4px 0 rgba(0,0,0,.25);
      margin-bottom: 42px;
    }
	
	.hero h4, .hero-content p, .hero-program h4, .hero-facilities h4, .hero-facilities1 h4, .hero-facilities2 h4  {
		font-family: 'KGMidnightMemories', sans-serif; 
		font-size: 1.6rem; 
        line-height: 1.05;
		font-weight: 700; 
		color: #FFFFFF;
		margin-top: 30px; 			
	}
	
	.subpage_hero h3 {
		font-family: 'KGMidnightMemories', sans-serif; 
		font-size: 4.5rem; 
        line-height: 1.05;
		font-weight: 700; 
		color: var(--darkpurple);
		text-shadow:
    0 0 5px #fff,
    0 0 10px #fff,
    0 0 20px #fff,
    0 0 40px #fff,
    0 0 80px #fff;
		margin-top: 30px; 
	}

    .tour-button {
      display: inline-block;
      background: var(--yellow);
      color: #000;
      border: 6px solid #fff;
      border-radius: 6px;
      padding: 18px 30px;
      font-size: clamp(1.2rem, 3vw, 2rem);
      font-weight: 900;
      box-shadow: 0 4px 8px rgba(0,0,0,.25);
      transition: 0.25s ease;
    }

    .tour-button:hover {
      transform: translateY(-3px);
      filter: brightness(1.05);
    }

/*--- CONTENT ---*/		

.content{
	max-width: 1200px; 
	margin: 0 auto;	
	display: inline-block; 
	transition: transform 0.3s ease; 
	}
	
/* Give facility review widgets a stable width before they initialize. */
.content.facility-reviews {
	display: block;
	width: 100%;
}

.inner-content {
	max-width: 800px;
	margin: 0 auto;	
	display: inline-block; 
}

/* Keep location maps within the available width, including on phones. */
.location-directions {
  width: 100%;
}

.location-directions .inner-content {
  display: block;
}

.location-map {
  display: block;
  width: 100%;
  max-width: 600px;
  height: auto;
  aspect-ratio: 4 / 3;
  min-height: 280px;
  margin: 0 auto;
  border: 0;
}
	
p {
	font-size: 1.5rem; 
	font-weight: 200;		
	}	

/* Basic lists share paragraph typography; custom lists keep their own styles. */
ul:not([class]) {
    list-style: disc outside;
    margin: 1em 0;
    padding-left: 1.5em;
    text-align: left;
    font-size: 1.5rem;
    font-weight: 200;
}

ul:not([class]) > li {
    text-align: left;
}
	
a {
	font-weight: 600;
	color: #FFFF00;
	text-decoration: none;
	}
	
	
/*--- BUTTONS ---*/	
	
.button {
    margin-top: 30px;
    font-size: 1.5rem;
    font-weight: 600;
    padding: 12px 28px;
    border-radius: 12px;
    border: 4px solid #FFF;

    display: inline-flex;
    align-items: center;
    gap: 8px;
	transition: transform 0.3s ease; 
}

button.button {
  font-family: inherit;
  line-height: 1.2;
  appearance: none;
}

button.button:disabled {
  cursor: wait;
  opacity: 0.75;
  transform: none;
}

.button:hover {
    cursor: pointer;
    filter: brightness(1.1);
	transform: scale(1.1); 
}

.button-yellow {
    color: #000;
    background-color: var(--yellow);
}

.button-green {
    color: #FFF;
    background-color: var(--green);
}

.button-pinegreen {
    color: #FFF;
    background-color: var(--pinegreen);
}

.button-blue {
    color: #FFF;
    background-color: var(--blue);
	border: 4px solid #A8C9E4;
}

.button-darkblue {
    color: #FFF;
    background-color: #2F7EBB;
	border: 4px solid #A8C9E4;
}

.button-brown {
    color: #FFF;
    background-color: var(--brown);
	border: 4px solid #C6C3AC;
}

.button-purple {
    color: #FFF;
    background-color: var(--purple);
}

.button-orange {
    color: #FFF;
    background-color: var(--orange);
}

.button-darkorange {
    color: #FFF;
    background-color: #F28332;
	border: 4px solid #E09858;
}

.button-holiday {
    color: #FFF;
    background-color: var(--orange);
	border: 4px solid #FCEB8A;
}

.button-gold {
    color: #FFF;
    background-color: var(--gold);
}

.button-red {
    color: #FFF;
    background-color: var(--red);
}

.button-pink {
    color: #FFF;
    background-color: var(--pink);
}

.button-cherry {
    color: #FFF;
    background-color: var(--cherry);
}

/*--- SOCIAL BUTTONS ---*/

.social-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.social-button {
    width: 72px;
    height: 72px;
    background: #FFFFFF;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: transform 0.3s ease, filter 0.3s ease;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

.social-button:hover {
    transform: scale(1.1);
    filter: brightness(1.05);
}

.social-button img {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

/*--- ZIG ZAG ---*/

	.zigzag {
	  position: absolute;
	  left: 0;
	  width: 100%;
	  height: 28px;
	  transform: translateY(1%);
	}
	
	.zigzag-relative {
	  position: relative;
	  bottom: 0;
	  left: 0;
	  width: 100%;
	  height: 28px;
	  transform: translateY(1%);
	}	
	
	.zigzag-darkpurple {
	  background:
	  linear-gradient(135deg, transparent 50%, var(--darkpurple) 50%) 0 0 / 28px 28px,
	  linear-gradient(225deg, transparent 50%, var(--darkpurple) 50%) 0 0 / 28px 28px;
	}
	
	.zigzag-lightpurple {
	  background:
	  linear-gradient(135deg, transparent 50%, var(--darkpurple) 50%) 0 0 / 28px 28px,
	  linear-gradient(225deg, transparent 50%, var(--darkpurple) 50%) 0 0 / 28px 28px;
	}
	
	.zigzag-white {
	  background:
	  linear-gradient(135deg, transparent 50%, #FFFBE0 50%) 0 0 / 28px 28px,
	  linear-gradient(225deg, transparent 50%, #FFFBE0 50%) 0 0 / 28px 28px;
	}
	
	.white-section .zigzag-white, .lightpurple-section .zigzag-lightpurple {
	  bottom: 0;
	  z-index: 1;
	}
	
/*--- SECTIONS ---*/	

    .section {
      width: 100%;
      padding: 60px 20px;
    }

    .section.photo-permission-section {
      padding-top: 0;
      padding-bottom: 20px;
    }

    .photo-permission-section p {
      margin: 0;
      font-size: 0.95rem;
      font-style: italic;
    }

    .section-inner {
      max-width: var(--max-width);
      margin: 0 auto;
    }
	
	.section-inner h2 {
		
	  font-family: 'KGMidnightMemories', sans-serif;
      font-size: 2.5rem;
      line-height: 1.05;
      font-weight: 300;
      text-shadow: 2px 2px 0 rgba(0,0,0,.25);
      margin-bottom: 42px;  	
	  color: #000;
	}
	
    .section-fancy {
	    text-align: center;
    }
	
    .section-fancy h2 {
	  font-family: 'CuteDino', sans-serif;
	  font-size: 1.6rem; 
	  font-weight: 100;
	  line-height: 1.5;
	  margin-bottom: 20px;
    }	
	
    .section-fancy h3 {
	  font-family: KGMidnightMemories, sans-serif; 
	  font-size: 2.2rem; 
	  font-weight: 500;
	  line-height: 1.5;
	  margin-bottom: 20px;
    }
	
    .section-fancy h4 {
	  font-family: KGMidnightMemories, sans-serif; 
	  font-size: 1.4rem; 
	  font-weight: 600;
	  line-height: 1.5;
	  margin-bottom: 20px;
    }
	
    .section-fancy h6 {
	  font-family: KGMidnightMemories, sans-serif; 
	  font-size: 1.2rem; 
	  font-weight: 600;
	  line-height: 1.5;
    }
	
    .section-fancy p, .section-fancy a {
	  font-family: KGMidnightMemories, sans-serif; 
	  font-size: 1.5rem; 
    }

    .section-fancy ul:not([class]) {
      font-family: KGMidnightMemories, sans-serif;
    }
	
	.section-fancy-link a:hover {
		transform: scale(1.2); 
	}
	
	.border-black {
	    border: 5px solid #CCCCCC;
		border-radius: 24px;
		padding: 10px;
		background-color: #FFF;
	    text-align: center;
		color: #444;
	}
	
/*--- ABOUT ---*/		
	
	.about-versus {
	    text-align: center;
		background: #ffff00;
		position: relative;
	    overflow: hidden;
	}	
	
	.about-advantages {
	    text-align: center;
		background: #ffffff;
  background-image: url('../img/clouds.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
		position: relative;
	    overflow: hidden;
		padding-bottom: 80px;
	}
	
/*--- ABOUT ADVANTAGES LIST ---*/

.advantages-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  max-width: 1150px;
  margin: 0 auto;
}

.advantage-item {
  display: flex;
  align-items: center;
  gap: 22px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 24px;
  padding: 24px;
  text-align: left;
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
}

.advantage-icon-wrap {
  width: 82px;
  height: 82px;
  min-width: 82px;
  border: 10px solid var(--blue);
  border-radius: 22px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.advantage-icon {
  width: 50px;
  height: 50px;
  object-fit: contain;
}

.advantage-text h4 {
  font-size: 1.6rem;
  line-height: 1.1;
  margin-bottom: 10px;
  color: #000;
}

.advantage-text p {
  font-family: Arial, sans-serif;
  font-size: 1.1rem;
  line-height: 1.5;
  font-weight: 400;
  color: #333;
}

.advantage-pink { border-color: var(--pink); }
.advantage-orange { border-color: var(--orange); }
.advantage-green { border-color: var(--green); }
.advantage-blue { border-color: var(--blue); }
.advantage-purple { border-color: var(--purple); }
.advantage-yellow { border-color: var(--yellow); }

@media (max-width: 900px) {
  .advantages-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .advantage-item {
    flex-direction: column;
    text-align: center;
    padding: 24px 18px;
  }

  .advantage-icon-wrap {
    margin-bottom: 4px;
  }
}

	.about-story {
	    text-align: center;
		background: #EEAECA;
  background-image: url('../img/clouds.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
		position: relative;
	    overflow: hidden;
	}		
	
	.about-ratios {
	    text-align: center;
		background: var(--yellow);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
		position: relative;
	    overflow: hidden;
	}	
	
	.about-safety {
	    text-align: center;
		background: #FD1D1D;
		background: linear-gradient(90deg, rgba(253, 29, 29, 1) 10%, rgba(252, 176, 69, 1) 90%);
		position: relative;
	    overflow: hidden;
	}		
	
/*--- INTRO SECTION ---*/

    .intro-section {
      background: var(--darkpurple);
	  background: linear-gradient(180deg, rgba(72, 79, 127, 1) 7%, rgba(126, 102, 156, 1) 92%);    
	  color: #FFF;
      text-align: center;
	  position: relative;
	  padding-bottom: 60px;
	  overflow: hidden;
	}
	
	.intro-section .section-inner {
	  position: relative;
	  z-index: 2;
	}

    .intro-section h3 {
      font-size: 2.5rem;
      line-height: 1.05;
	  margin-bottom: 40px;
    }
	
/*--- WHITE SECTION ---*/	

    .blank-section {
      background: #ffffff;
      text-align: center;
	  position: relative;
	  overflow: hidden;
	  padding-bottom: 90px;	  
    }

    .white-section {
      background: #ffffff;
	  background: linear-gradient(360deg,rgba(255, 255, 255, 1) 71%, rgba(219, 247, 255, 1) 100%);
      text-align: center;
	  position: relative;
	  overflow: hidden;
	  padding-bottom: 90px;	  
    }
	
    .lightpurple-section {
      background: var(--lightpurple);

background: linear-gradient(0deg, rgba(126, 102, 156, 1) 15%, rgba(139, 116, 166, 1) 50%, rgba(126, 102, 156, 1) 85%);
      text-align: center;
	  position: relative;
	  overflow: hidden;
	  padding-bottom: 90px;	  
    }
	


	.white-section .section-inner, .lightpurple-section .section-inner {
	  position: relative;
	  z-index: 2;
	}

    .feature-grid-3 {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
    }
	
    .feature-grid-2 {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 28px;
    }

    .feature-card {
      background: #f6f6f6;
      border-radius: 24px;
      padding: 34px;
      font-size: 1.15rem;
      line-height: 1.5;
    }
		
/*--- IMAGE FEATURE CARDS ---*/

.image-feature-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}

.image-feature-card {
  overflow: hidden;
  border: 12px solid #9E5FA2;
  border-radius: 16px;
}

.image-feature-card-image {
  display: block;
  width: 100%;
  aspect-ratio: 5 / 3;
  object-fit: cover;
  border-radius: 12px 12px 0 0;
}

.image-feature-card-body {
  background: #f6f6f6;
  padding: 18px 34px 34px 34px;
  font-size: 1.15rem;
  line-height: 1.5;
  border-radius: 0 0 12px 12px;
}

.image-feature-card-body h3 {
	  font-family: 'KGMidnightMemories', sans-serif;
      font-size: 2.2rem;
      line-height: 1.05;
      font-weight: 600;
	  color: #7C517F;
      margin-bottom: 18px;
}

.image-feature-card-body h4 {
	  font-family: arial, sans-serif;
      font-size: 1rem;
      line-height: 1.05;
      font-weight: 700;	
	  color: #000;
      margin-bottom: 12px;
}

.image-feature-card-body p {
	color: #555;
	font-weight: 600;
	font-size: 1.4rem;
}

@media (max-width: 900px) {
  .image-feature-grid-2 {
    grid-template-columns: 1fr;
  }
}

/*--- TWO-COLUMN SECTION LAYOUTS ---*/

.section-split-50,
.section-split-25-75,
.section-split-75-25,
.section-split-34-66,
.section-split-66-34 {
  display: grid;
  width: 100%;
  gap: 28px;
  align-items: center;
}

/* Equal columns */
.section-split-50 {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

/* Left 25% / Right 75% */
.section-split-25-75 {
  grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
}

/* Left 75% / Right 25% */
.section-split-75-25 {
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
}

/* Left 34% / Right 66% */
.section-split-34-66 {
  grid-template-columns: minmax(0, 34fr) minmax(0, 66fr);
}

/* Left 66% / Right 34% */
.section-split-66-34 {
  grid-template-columns: minmax(0, 66fr) minmax(0, 34fr);
}

/* Shared inner column helpers */
.section-left,
.section-right {
  min-width: 0;
  width: 100%;
}

/* Stack columns on tablets and phones */
@media (max-width: 900px) {
  .section-split-50,
  .section-split-25-75,
  .section-split-75-25,
  .section-split-34-66,
  .section-split-66-34 {
    grid-template-columns: 1fr;
  }
}

/*--- THREE-COLUMN SECTION LAYOUTS ---*/

.section-split-33-34-33,
.section-split-25-50-25 {
  display: grid;
  width: 100%;
  gap: 28px;
  align-items: center;
}

/* Left 33% / Middle 34% / Right 33% */
.section-split-33-34-33 {
  grid-template-columns:
    minmax(0, 33fr)
    minmax(0, 34fr)
    minmax(0, 33fr);
}

/* Left 25% / Middle 50% / Right 25% */
.section-split-25-50-25 {
  grid-template-columns:
    minmax(0, 1fr)
    minmax(0, 2fr)
    minmax(0, 1fr);
}

/* Shared inner-column helpers */
.section-left,
.section-middle,
.section-right {
  width: 100%;
  min-width: 0;
}

/* Stack all columns on tablets and phones */
@media (max-width: 900px) {
  .section-split-33-34-33,
  .section-split-25-50-25 {
    grid-template-columns: 1fr;
  }
}
	
/*--- GALLERY SECTION ---*/

    .gallery-section {
      background: #B8F3A6;
      text-align: center;
    }

    .gallery-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 26px;
    }

    .gallery-grid a {
      border-radius: 18px;
      overflow: hidden;
      box-shadow: 0 8px 18px rgba(0,0,0,.18);
      transition: 0.25s ease;
    }

    .gallery-grid a:hover {
      transform: translateY(-5px);
    }

    .gallery-grid img {
      width: 100%;
      aspect-ratio: 4 / 3;
      object-fit: cover;
    }
	
/*--- PARALLAX SECTION ---*/	

/* Reusable parallax section */
.parallax-section {
  position: relative;
  min-height: 360px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #aaa;
}

.h300 {
  height: 200px;
}

.parallax-bg {
  position: absolute;
  top: -33%;
  left: 0;
  width: 100%;
  height: 160%;
  background-image: var(--parallax-image);
  background-size: cover;
  background-position: center;
  z-index: 1;
  transform: translateY(0);
  will-change: transform;
}

.parallax-section::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--parallax-overlay, rgba(0,0,0,.35));
  z-index: 2;
}

.parallax-section .section-inner {
  position: relative;
  z-index: 3;
  color: white;
  text-align: center;
}

/*---

.parallax-section .section-inner h3 {
	font-family: KGMidnightMemories, sans-serif; 
    font-size: 3rem;
	text-shadow:
		0 0 5px #000,
		0 0 10px #000,
		0 0 20px #000,
		0 0 40px #000,
		0 0 80px #000;
}

.parallax-section .section-inner p {
	font-family: KGMidnightMemories, sans-serif; 
    font-size: 1.5rem;
	text-shadow:
		0 0 5px #000,
		0 0 10px #000,
		0 0 20px #000,
		0 0 40px #000,
		0 0 80px #000;
}

.parallax-section h2,
.parallax-section h3 {
  font-size: clamp(2.2rem, 5vw, 4.5rem);
  margin-bottom: 20px;
}

.parallax-section p {
  font-size: 1.4rem;
  max-width: 820px;
  margin: 30px auto 0;
  line-height: 1.5;
}

---*/	

/*--- COLORED SECTIONS ---*/

    .green-section {
		background: var(--green);
		color: #fff;
		text-align: center;
    }

    .blue-section {
		background: #458CCB;
		background: linear-gradient(0deg, rgba(69, 140, 203, 1) 0%, rgba(69, 140, 203, 1) 15%, rgba(78, 152, 217, 1) 47%, rgba(78, 152, 217, 1) 63%, rgba(69, 140, 203, 1) 87%, rgba(69, 140, 203, 1) 100%);
		color: #fff;
		text-align: center;
		position: relative;
	}

	.blue-section > .zigzag {
	  top: 0;
	  bottom: auto;
	  left: 0;
	  width: 100%;
	  height: 28px;
	  transform: translateY(-100%);
	  z-index: 2;
	  pointer-events: none;
	}
	
	.purple-gradient-section {
		background: #484F7F;
		background: linear-gradient(180deg, rgba(72, 79, 127, 1) 1%, rgba(128, 103, 157, 1) 100%);
	}
	
	
    .lightpurple-section {
		background: var(--lightpurple);
		color: #fff;
		text-align: center;
    }	
	
    .darkpurple-section {
		background: var(--darkpurple);
		color: #fff;
		text-align: center;
    }	
	
    .darkestpurple-section {
		background: var(--darkestpurple);
		color: #fff;
		text-align: center;
    }	
	
	.yellow-section {
	    text-align: center;
		background: #FFF485;
		background: linear-gradient(0deg, rgba(255, 244, 133, 1) 0%, rgba(255, 212, 133, 1) 22%, rgba(255, 244, 133, 1) 60%, rgba(255, 251, 224, 1) 100%);
	}
	
/*--- WAVE --- */

.wave-divider, .wave2-divider, .wave3-divider, .wave-divider-white {
  position: relative;
  width: 100%;
  height: 60px;
  margin-bottom: -60px;
  z-index: 3;
  overflow: hidden;
  pointer-events: none;
}

.wave-divider svg, .wave2-divider svg, .wave3-divider svg, .wave-divider-white svg {
  display: block;
  width: 100%;
  height: 60px;
}

.wave-divider path {
  fill: #FFF385;
}

/* Match the bottom of the Fully licensed background to the tour wave. */
.facilities-wave path {
  fill: #FFFDDB;
}

.wave2-divider path {
  fill: #458CCB;
}

.wave3-divider path {
  fill: #FFF6C7;
}

.wave-divider-white path {
  fill: #FFFFFF;
}

/* Continue the enrollment background down to the call-to-action wave. */
.enrollment-wave path {
  fill: #F6F4E8;
}

/*--- MOBILE ---*/	

    @media (max-width: 1180px) {
      .nav-tab {
        min-width: 118px;
        font-size: 1.05rem;
        padding: 0 14px;
      }

      .logo img {
        width: 280px;
      }
    }

    @media (max-width: 900px) {
      .site-header {
        padding: 0 10px;
      }

      .header-inner {
        align-items: flex-start;
      }

      .logo-wrap {
        height: 66px;
        padding: 0 16px;
        border-radius: 0 0 16px 16px;
      }

      .logo img {
        width: 190px;
      }

      .nav-wrap {
        display: none;
      }

      .mobile-menu-button {
        display: flex;
      }

      .hero {
        min-height: 500px;
        padding: 90px 20px 70px;
        align-items: center;
      }

      .hero-content {
        max-width: 100%;
      }

      .hero h1 {
        margin-bottom: 24px;
      }
	  
  .about-page-hero {
    padding: 75px 0 0;
  }

  .about-hero-inner {
    max-width: none;
  }

  .about-hero-img {
    width: 100%;
    max-width: none;
  }

      .feature-grid-3, .feature-grid-2, 
      .gallery-grid {
        grid-template-columns: 1fr;
      }

      .parallax-section {
        background-attachment: scroll;
      }
    }

    @media (max-width: 480px) {
      .hero {
        min-height: 470px;
      }
	  
	.welcome_img {
	background-color: #a1ecff;
	background:
	  url("../img/welcome_sm.png") center bottom / contain no-repeat,
	  linear-gradient(
		180deg,
		rgba(161, 236, 255, 1) 0%,
		rgba(255, 255, 255, 1) 79%,
		rgba(255, 255, 255, 1) 100%
	  );
	  height: 160px;
	}
	
	.subpage_hero h2 {
	  font-size: 4rem;
	}

      .tour-button {
        padding: 13px 20px;
        border-width: 4px;
      }

      .section {
        padding: 65px 16px;
      }
	 
    }
	
	.button-wrap {
		font-family: KGMidnightMemories, sans-serif; font-size: 2.5rem;
	}
	
/*--- CONTACT / INQUIRY FORM CSS ---*/		

*, *::before, *::after {
  box-sizing: border-box;
}

.glass {
  width: 100%;
  max-width: 600px;
  height: auto;

  font-family: Arial, sans-serif;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;

  padding: 20px 0px 45px;

  background: rgba(255, 255, 255, 0.45);
  border-radius: 10px;
  box-shadow: 0 8px 32px rgba(31, 38, 135, 0.37);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);

  position: relative;
}

.glass .button img {
  width: 24px;
  height: 24px;
  max-width: none;
  flex: 0 0 24px;
  object-fit: contain;
  border-radius: 0;
  margin: 0;
}

.form-group, .toggle_wrap {
  position: relative;
  width: 100%;
  margin-bottom: 20px;
}

.toggle_wrap {
  background-color: inherit;
  height: 90px;
}

form {
  width: 100%;
  max-width: 400px;
}

.error {
	border: 2px solid #D33A0D;
}

input {
  width: 100%;
  padding: 12px 10px;
  border: 2px solid #6B5BA8;
  border-radius: 4px;
  font-size: 16px;
  outline: none;
  transition: border-color 0.3s ease;
}

select {
  width: 100%;
  padding: 12px 10px;
  border: 2px solid #6B5BA8;
  border-radius: 4px;
  font-size: 16px;
  outline: none;
  color: #6B5BA8;
}

/* ✅ Floating labels ONLY for form-group fields */
.form-group > label {
  position: absolute;
  left: 10px;
  top: 12px;
  font-size: 16px;
  color: #6B5BA8;
  background: #FFF;
  padding: 0 5px;
  transition: all 0.3s ease;
  pointer-events: none;
}

.form-group input:focus + label,
.form-group input:not(:placeholder-shown) + label {
  top: -8px;
  left: 8px;
  font-size: 14px;
  color: #6B5BA8;
}

/* ===========================
   Mobile refinement you asked for
   glass = full width
   form gets 5px side padding
   =========================== */

@media (max-width: 410px) {
  .glass {
    width: 100%;
    max-width: none;     /* ✅ truly full width on small screens */
    padding: 20px 0;     /* ✅ no side padding on glass */
    margin: 0;   /* ✅ 10px on left & right */
    width: auto;      /* ✅ allow margin to work properly */
  }
  
  .glass img {
	margin-left: 10px;
	margin-right: 10px;
}

  .glass > form {
    width: 100%;
    max-width: none;     /* ✅ let it fill */
    padding: 0 20px;      /* ✅ 5px each side */
    margin: 0;
  }

  /* Prevent horizontal overflow caused by negative margins */
  .toggle_wrap {
    margin-left: 0;
    margin-right: 0;
  }

  .title {
    margin-bottom: 20px;
  }
}

.notice-purple p, .notice-orange p {
	color: #FFF;
	font-weight: 500;
}

.orange {
	color: #D53E01;
}

.notice {
	width: 100%;
	padding: 0 15px 0 15px;
	border-radius: 10px;
	margin-bottom: 20px;	
}	

.notice-purple {
	border: 2px solid #6B5BA8;
	background-color: #8477BD;	
}	

.notice-orange {
	border: 2px solid #DB3D0C;
	background-color: #F18E14;	
}	

/* Mon-Fri Buttons */

.weekday-checkbox-container {
  display: flex;
  width: 100%;
  justify-content: space-around;
  color: #6B5BA8;
  font-weight: 600;
}

.weekday-checkbox-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-grow: 1;
  padding: 5px;
}

.weekday-checkbox {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 30px;
  height: 30px;
  border: 2px solid #6B5BA8;
  background-color: white;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.weekday-checkbox:checked {
  background-color: #8477BD;
}

.weekday-checkbox:checked::after {
  content: '✓';
  font-size: 20px;
  color: white;
}

.weekday-checkbox-item label {
  margin-bottom: 5px;
  text-align: center;
}

/* Progress indicator container */
.progress-indicator {
  display: flex;
  justify-content: center;
  gap: 8px;
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
}

/* Dots */
.dot {
  width: 12px;
  height: 12px;
  background-color: #ccc;
  border-radius: 50%;
  transition: background-color 0.3s ease;
}

.dot.active {
  background-color: #6B5BA8;
}

/* ===========================
   Gender Toggle (PLAIN CSS)
   Matches your HTML structure
   =========================== */

.toggle_wrap {
  width: 100%;
  height: 45px;
  margin-top: 0;
  margin-left: 0; /* if this causes overflow on mobile, set to 0 in your mobile media query */
}

/* ✅ Toggle label must be clickable and NOT absolute */
.toggle_wrap label {
  position: static;
  pointer-events: auto;
  background: transparent;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Hide the checkbox */
.toggle_wrap .input {
  display: none;
}

/* Toggle track */
.toggle_wrap .toggle-wrapper {
  position: relative;
  width: 90px;
  height: 45px;
  border: 2px solid #6B5BA8;
  background-color: #eaeaea;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 8px 14px 0 rgba(0, 0, 0, 0.12);
}

/* Toggle knob */
.toggle_wrap .selector {
  width: 30px;
  height: 30px;
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
  background-color: #EF39A4; /* Female color */
  transition: left 0.25s ease, background-color 0.25s ease;
  border-radius: 50%;
}

/* Label text container */
.toggle_wrap .notification {
  margin: 0;
  padding-left: 10px;
  font-size: 1em;
  color: #6B5BA8;
}

/* Default text */
.toggle_wrap .selected::before {
  content: "Child is Female";
}

/* Checked state: move knob + change color + change text */
.toggle_wrap .input:checked + .toggle-wrapper .selector {
  left: calc(100% - 40px);
  background-color: #3957ee; /* Male color */
}

.toggle_wrap .input:checked ~ .notification .selected::before {
  content: "Child is Male";
}

@media (max-width: 410px) {
  .toggle_wrap {
    margin-left: 0;
    margin-right: 0;
  }
}

textarea {
  width: 100%;
  max-width: 100%;
  height: 120px;          /* starting height */
  max-height: 200px;      /* cap at 200px */
  padding: 12px 10px;
  border: 2px solid #6B5BA8;
  border-radius: 4px;
  font-size: 16px;
  outline: none;
  resize: vertical;       /* ✅ only resizable by height */
  overflow: auto;
  font-family: inherit;   /* matches the rest of the form */
}

/* optional: match your focus behavior */
textarea:focus {
  border-color: #6B5BA8;
}

.form-group textarea:focus + label,
.form-group textarea:not(:placeholder-shown) + label {
  top: -8px;
  left: 8px;
  font-size: 14px;
  color: #6B5BA8;
}

.glass h1 {
  display: block;
  font-family: Arial, sans-serif;
  font-size: 1.3em;
  margin-top: 0.83em;
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
  color: #6B5BA8;
}

.glass h2 {
  display: block;
  font-family: Arial, sans-serif;
  font-size: 1.3em;
  margin-top: 1em;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  color: #6B5BA8;
}

.glass h3 {
  display: block;
  font-family: Arial, sans-serif;
  font-size: 1.1em;
  font-weight: 500;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  color: #6B5BA8;
}

@media (max-width: 410px) {
	.glass h1, .glass h2, .glass h3 {
		margin-left: 20px;
		margin-right: 20px;
	}
}

.glass hr {
	border: 2px solid #8477BD;
	margin: 25px 0;
}

.glass p {
    font-family: Arial, sans-serif;
    font-size: 1em;	
	font-weight: 600;
	color: #6B5BA8;
	text-align: justify;
	text-justify: inter-word;
}

/* Schedule Tour calendar and time picker */
.tour-form-card {

  box-sizing: border-box;
}

.tour-form-card form {
  width: 100%;
  margin: 0 auto;
}

.tour-form-intro {
  margin: -4px 0 24px;
  text-align: center;
}

.tour-picker-section {
  min-width: 0;
  margin: 0 0 26px;
  padding: 0;
  border: 0;
}

.tour-picker-section > legend {
  width: 100%;
  margin-bottom: 12px;
  color: #350640;
  font-size: 1.05rem;
  font-weight: 700;
}

.tour-calendar {
  padding: 18px;
  border: 2px solid #ddd;
  border-radius: 14px;
  background: rgba(255, 255, 255, .86);
  transition: border-color .18s ease, box-shadow .18s ease;
}

.tour-calendar.has-error,
.tour-time-picker.has-error .tour-time-options {
  border-color: #d33a0d;
  box-shadow: 0 0 0 3px rgba(211, 58, 13, .12);
}

.tour-calendar-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin-bottom: 12px;
}

.tour-calendar-navigation button {
  padding: 4px;
  border: 0;
  background: transparent;
  color: #6B5BA8;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.tour-calendar-navigation button:hover:not(:disabled),
.tour-calendar-navigation button:focus-visible {
  color: #350640;
  text-decoration: underline;
}

.tour-calendar-navigation button:disabled {
  color: #aaa;
  cursor: default;
}

.tour-calendar-divider { color: #bbb; }

.tour-calendar-month {
  margin: 0 0 16px;
  color: #350640;
  font-size: clamp(1.3rem, 4vw, 1.75rem);
  text-align: center;
  padding-bottom: 10px;
}

.tour-calendar-weekdays,
.tour-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 7px;
}

.tour-calendar-weekdays { margin-bottom: 7px; }

.tour-calendar-weekdays span {
  color: #666;
  font-size: .78rem;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
}

.tour-calendar-day,
.tour-calendar-spacer { aspect-ratio: 1 / 1; }

.tour-calendar-day {
  display: grid;
  place-items: center;
  min-width: 0;
  padding: 0;
  border: 2px solid #dedede;
  border-radius: 9px;
  background: #fff;
  color: #333;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .15s ease, background-color .15s ease, color .15s ease, transform .15s ease;
}

.tour-calendar-day:hover:not(:disabled) {
  border-color: #888;
  transform: translateY(-1px);
}

.tour-calendar-day:focus-visible,
.tour-time-option:focus-visible {
  outline: 3px solid rgba(108, 51, 120, .3);
  outline-offset: 2px;
}

.tour-calendar-day.is-today:not(.is-selected) { border-color: #b992c2; }

.tour-calendar-day.is-selected,
.tour-calendar-day.is-selected:hover {
  border-color: #6B5BA8;
  background: #6B5BA8;
  color: #fff;
}

.tour-calendar-day:disabled {
  border-color: #eee;
  background: #f6f6f6;
  color: #bbb;
  cursor: not-allowed;
}

.tour-picker-help {
  margin: 9px 0 0;
  color: #666;
  font-size: .85rem;
}

.tour-selection {
  margin: 10px 0 0;
  color: #555;
  font-size: .93rem;
}

.tour-selection strong { color: #6c3378; }

.tour-time-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 12px;
  border: 2px solid transparent;
  border-radius: 14px;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.tour-time-option {
  min-height: 48px;
  padding: 9px 8px;
  border: 2px solid #dedede;
  border-radius: 10px;
  background: #fff;
  color: #333;
  font: inherit;
  font-weight: 500;
  font-size: .8rem;
  cursor: pointer;
  transition: border-color .15s ease, background-color .15s ease, color .15s ease, transform .15s ease;
}

.tour-time-option:hover {
  border-color: #888;
  transform: translateY(-1px);
}

.tour-time-option.is-selected,
.tour-time-option.is-selected:hover {
  border-color: #6B5BA8;
  background: #6B5BA8;
  color: #fff;
}

.tour-location-field { margin-top: 34px; }
.tour-submit-wrap { text-align: center; }

.tour-form-message {
  min-height: 24px;
  margin-top: 14px;
  text-align: center;
}

.tour-form-message.is-error { color: #d33a0d; }
.tour-form-message.is-success { color: #287a3f; }

@media (max-width: 640px) {
  .tour-form-card { width: 100%; }
  .tour-calendar { padding: 12px 8px; }
  .tour-calendar-weekdays,
  .tour-calendar-grid { gap: 4px; }
  .tour-calendar-day { border-radius: 7px; font-size: .9rem; }
  .tour-time-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tour-calendar-navigation { gap: 5px; }
  .tour-calendar-navigation button { font-size: .86rem; }
}

@media (max-width: 390px) {
  .tour-calendar-weekdays span { font-size: .66rem; }
  .tour-calendar-day { font-size: .8rem; }
}


.footer-contact {
  display: grid;
  gap: 12px;
  width: fit-content;
  max-width: 100%;
  margin: 30px auto 0;
  font-family: KGMidnightMemories, sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
}

.footer-contact-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font-weight: inherit;
  text-align: left;
}

.footer-contact-row img {
  display: block;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  object-fit: contain;
}

.footer-contact-row span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.parent-portal-link {
	margin: 0 auto;
	padding: 20px 0;
}

.parent-portal-link a {
	color: #FFFFFF;
    display: block;
    font-family: 'CuteDino', sans-serif;
	font-weight: 100;
    font-size: 1.3em;	
	transition: transform 0.3s ease;
}

.footer-link a {
	color: #FFFFFF;
    display: block;
    font-family: Arial, sans-serif;
    font-size: 1em;	
	transition: transform 0.3s ease;
}

.parent-portal-link a:hover, .footer-link a:hover {
	color: #FFFF00;
}

.footer-bottom-container {
	margin: 0;
	padding: 20px;
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  display: grid;
  grid-template-columns: 1fr 1fr;
  max-width: 600px;
  margin: 0 auto;
  padding: 0;
}

.footer-bottom-left {
  text-align: left;
}

.footer-bottom-right {
  text-align: right;
}

@media (hover: none) and (pointer: coarse) {
  .hero {
    background-attachment: scroll;
  }
}

ul.check-list {
    list-style: none;
    width: fit-content;
    max-width: 100%;
    margin: 20px auto 0;
    padding: 0;
    text-align: left;
}

ul.check-list > li {
	position: relative;
	padding-left: 2em;
	font-family: KGMidnightMemories, sans-serif;
	font-size: 1.6rem;
	font-weight: 600;
	line-height: 1.5;
	margin-bottom: 20px;
}

ul.check-list > li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.25em;
	width: 1em;
	height: 1em;
	background: url("../img/check.webp") center / contain no-repeat;
}

/*--- HOMEPAGE PRESCHOOL BENEFITS ---*/

.benefits-inner {
  max-width: 1040px;
  margin: 0 auto;
}

.preschool-benefits h2 {
  color: #797557;
}

.preschool-benefits .benefits-intro {
  margin: 12px 0 28px;
  text-align: center;
}

.benefits-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.benefits-grid .benefit-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  min-width: 0;
  margin: 0;
  padding: 28px 20px;
  border: 1px solid #d9d4bd;
  border-radius: 20px;
  background: #fffdf6;
  box-shadow: 0 5px 14px rgba(86, 77, 48, .06);
  color: #48483c;
  font-size: 1.4rem;
  line-height: 1.4;
  text-align: center;
}

/* Override the site's default checklist marker for these cards only. */
.benefits-grid .benefit-card::before {
  content: none;
}

.benefit-card:nth-child(3n + 2) {
  background: #f5f0fa;
  border-color: #d9cde4;
}

.benefit-card:nth-child(3n) {
  background: #eef7f4;
  border-color: #c8ddd3;
}

.benefit-card .benefit-icon {
  display: block;
  width: 100px;
  height: 100px;
  flex: 0 0 100px;
  object-fit: contain;
}

@media (min-width: 768px) {
  .benefits-grid {
    max-width: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/*--- HOMEPAGE TUITION CARDS (COMPACT) ---*/

.tuition-pricing {
  width: 100%;
  max-width: 980px;
  margin: 0 auto 0;
}

.tuition-pricing h2 {
  color: var(--darkpurple);
  margin-bottom: 20px;
}

.tuition-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.tuition-card {
  --tuition-accent: var(--blue);
  --tuition-ink: #28618f;
  min-width: 0;
  overflow: hidden;
  border: 3px solid var(--tuition-accent);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(67, 74, 115, .10);
  text-align: center;
}

.tuition-card-purple {
  --tuition-accent: var(--purple);
  --tuition-ink: #7c447f;
}

.tuition-card-green {
  --tuition-accent: var(--green);
  --tuition-ink: #456b20;
}

.tuition-card h3 {
  margin: 0;
  padding: 12px;
  background: var(--tuition-accent);
  color: #fff;
  font-family: 'KGMidnightMemories', sans-serif;
  font-size: clamp(1.35rem, 2.2vw, 1.6rem);
  font-weight: 600;
  line-height: 1.3;
}

.tuition-card-green h3 {
  color: #243d0b;
}

.tuition-card-body {
  padding: 16px 18px;
}

.tuition-breakdown {
  padding-bottom: 12px;
  margin: 0 0 12px;
  border-bottom: 2px dashed #e3e1e8;
  font-family: Arial, sans-serif;
  font-size: .95rem;
  line-height: 1.5;
}

.tuition-breakdown > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  text-align: left;
}

.tuition-breakdown > div + div {
  margin-top: 5px;
}

.tuition-breakdown dd {
  flex-shrink: 0;
  margin: 0;
  font-weight: 700;
}

.tuition-reduction {
  color: #456b20;
}

.tuition-card .tuition-parent-label {
  margin: 0 0 4px;
  color: #555;
  font-family: Arial, sans-serif;
  font-size: .95rem;
  font-weight: 400;
  line-height: 1.5;
}

.tuition-card .tuition-parent-fee {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  margin: 0;
  color: var(--tuition-ink);
  font-family: Arial, sans-serif;
  line-height: 1.2;
}

.tuition-parent-fee strong {
  font-size: clamp(2.4rem, 3.6vw, 2.8rem);
  font-weight: 800;
}

.tuition-parent-fee span {
  color: #555;
  font-size: .9rem;
  font-weight: 400;
}

.tuition-card .tuition-daily-rate {
  margin: 10px 0 0;
  color: #555;
  font-family: Arial, sans-serif;
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.5;
}

.tuition-daily-rate span {
  font-size: .85rem;
}

.tuition-pricing .tuition-ccfri-note {
  margin: 16px 0 0;
  color: #555;
  font-family: Arial, sans-serif;
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.6;
}

@media (max-width: 760px) {
  .tuition-grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: 380px;
    margin: 0 auto;
    gap: 14px;
  }

  .tuition-card h3 {
    font-size: 1.5rem;
  }
}

/* Preschool eligibility calculator: independent of contact form styling. */
.eligibility-calculator {
  box-sizing: border-box;
  max-width: 600px;
  margin: 24px auto;
  padding: 28px 20px;
  border-radius: 20px;
  background: #e6f3fb;
  color: #34556d;
  text-align: center;
}

.eligibility-calculator [hidden] { display: none !important; }
.eligibility-form { width: 100%; max-width: none; margin: 0; }
.eligibility-fields { min-width: 0; margin: 0; padding: 0; border: 0; }
.eligibility-fields legend {
  width: 100%;
  margin-bottom: 14px;
  padding: 0;
  font-size: 1.15rem;
  font-weight: 700;
}
.eligibility-controls {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr) minmax(0, 1.15fr) auto;
  align-items: center;
  gap: 8px;
}
.eligibility-select {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
  min-height: 44px;
  padding: 9px 6px;
  border: 1px solid #83abc7;
  border-radius: 7px;
  background: #fff;
  color: #34556d;
  font: 16px Arial, sans-serif;
}
.eligibility-go {
  min-height: 44px;
  padding: 9px 14px;
  border: 0;
  border-radius: 7px;
  background: #286594;
  color: #fff;
  font: bold 16px Arial, sans-serif;
  cursor: pointer;
}
.eligibility-go:hover { background: #204f75; }
.eligibility-go:disabled { opacity: .65; cursor: wait; }
.eligibility-calculator :focus-visible,
.eligibility-toddler-info summary:focus-visible { outline: 3px solid #286594; outline-offset: 3px; }
.eligibility-calculator .eligibility-age {
  margin: 0 0 10px;
  color: #286594;
  font-size: clamp(1.6rem, 5vw, 2.2rem);
  font-weight: 700;
  line-height: 1.3;
}
.eligibility-calculator .eligibility-message,
.eligibility-calculator .eligibility-error,
.eligibility-toddler-info p {
  margin: 0;
  color: #34556d;
  font: 1rem/1.6 Arial, sans-serif;
  text-align: center;
}
.eligibility-calculator .eligibility-error { margin-top: 14px; color: #a32a1c; }
.eligibility-calculator .button-wrap { margin-top: 0; }
.eligibility-calculator .eligibility-reset,
.eligibility-calculator .eligibility-toddler-link {
  display: block;
  width: fit-content;
  margin: 14px auto 0;
  color: #286594;
  font: 1rem/1.5 Arial, sans-serif;
  text-decoration: underline;
}
.eligibility-calculator .eligibility-reset { font-size: .85rem; }
.eligibility-toddler-info { max-width: 600px; margin: 0 auto; scroll-margin-top: 100px; }
.eligibility-toddler-info summary { color: #286594; cursor: pointer; }
.eligibility-toddler-info p { margin-top: 12px; }
@media (max-width: 400px) {
  .eligibility-calculator { padding: 24px 10px; }
  .eligibility-controls { gap: 4px; }
  .eligibility-select { padding-inline: 2px; }
  .eligibility-go { padding-inline: 10px; }
}

.about-toggle-section[hidden] {
    display: none !important;
}

			.inner-content .enrollment-timeline {
				--marker-size: 44px;
				list-style: none;
				max-width: 560px;
				margin: 28px auto 0;
				padding: 0;
				text-align: left;
			}
			.enrollment-timeline > li {
				position: relative;
				display: grid;
				grid-template-columns: var(--marker-size) minmax(0, 1fr);
				gap: 16px;
				/* Reset the site's general checklist spacing. */
				margin: 0;
				padding: 0 0 24px;
			}
			.enrollment-timeline > li:last-child { padding-bottom: 0; }
			.enrollment-timeline > li::before { content: none; }
			.enrollment-timeline > li:not(:last-child)::before {
				content: "";
				position: absolute;
				left: calc(var(--marker-size) / 2 - 1px);
				top: calc(var(--marker-size) / 2);
				bottom: calc(var(--marker-size) / -2);
				width: 2px;
				height: auto;
				background: #bfd0ce;
			}
			.enrollment-timeline .enrollment-icon {
				position: relative;
				display: grid;
				place-items: center;
				box-sizing: border-box;
				width: var(--marker-size);
				height: var(--marker-size);
				border: 1px solid #a9c3c6;
				border-radius: 50%;
				background: #fffdf6;
				color: #51869F;
			}
			.enrollment-icon svg { display: block; width: 24px; height: 24px; }
			.enrollment-timeline .enrollment-copy { padding-top: 7px; }
			.enrollment-timeline h3 {
				margin: 0 0 5px;
				color: #3d697d;
				font-size: 1.3rem;
				font-weight: 600;
				line-height: 1.35;
				overflow-wrap: anywhere;
			}
			.enrollment-timeline p {
				margin: 0;
				color: #596466;
				font-family: Arial, sans-serif;
				font-size: .9375rem;
				font-weight: 400;
				line-height: 1.55;
			}
			@media (max-width: 480px) {
				.inner-content .enrollment-timeline { --marker-size: 40px; margin-top: 22px; }
				.enrollment-timeline > li { gap: 12px; padding-bottom: 20px; }
				.enrollment-timeline h3 { font-size: 1.15rem; }
				.enrollment-timeline .enrollment-copy { padding-top: 5px; }
			}

				/* Share one sky background across the timeline and the wave above the blue section. */
				.morning-sky .morning-wave {
					width: 100%; height: 60px; margin-bottom: -1px;
					overflow: hidden; pointer-events: none;
				}
				.morning-sky .morning-wave svg { display: block; width: 100%; height: 60px; }
				.morning-sky .morning-wave path { fill: #458CCB; }
				.morning-walkthrough { width: 100%; max-width: 720px; margin: 0 auto; }
				.morning-walkthrough .morning-intro {
					max-width: 580px; margin: 0 auto 32px; color: #2B5F8B;
					font-size: 1.35rem; line-height: 1.6;
				}
				.morning-walkthrough .morning-timeline {
					list-style: none; margin: 0; padding: 0; text-align: left;
				}
				.morning-walkthrough .morning-step {
					--morning-accent: #2B5F8B; --morning-tint: #eaf4fc;
					position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr);
					gap: 20px; margin: 0; padding: 0 0 22px;
				}
				.morning-walkthrough .morning-step:nth-child(3n + 2) {
					--morning-accent: #72538a; --morning-tint: #f3edf8;
				}
				.morning-walkthrough .morning-step:nth-child(3n) {
					--morning-accent: #416f53; --morning-tint: #edf6e9;
				}
				/* Replace the shared stylesheet's checklist markers with a connecting line. */
				.morning-walkthrough .morning-step::before { content: none; }
				.morning-walkthrough .morning-step:not(:last-child)::before {
					content: ""; position: absolute; left: 27px; top: 28px; bottom: -28px;
					width: 2px; height: auto; background: #c6dae8;
				}
				.morning-walkthrough .morning-step:last-child { padding-bottom: 0; }
				.morning-walkthrough .morning-icon {
					position: relative; display: grid; place-items: center; width: 56px; height: 56px;
					border: 2px solid #fff; border-radius: 50%; background: var(--morning-tint);
					color: var(--morning-accent); box-shadow: 0 0 0 1px #d4e2eb;
				}
				.morning-walkthrough .morning-icon svg {
					display: block; width: 28px; height: 28px; fill: none; stroke: currentColor;
					stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
				}
				.morning-walkthrough .morning-card {
					min-width: 0; padding: 20px 24px; border: 1px solid #dce8ef;
					border-radius: 18px; background: #fff; box-shadow: 0 4px 14px rgba(43, 95, 139, .05);
				}
				.morning-walkthrough .morning-card time {
					display: inline-block; margin-bottom: 8px; padding: 4px 10px; border-radius: 8px;
					background: var(--morning-tint); color: var(--morning-accent);
					font: 700 .875rem/1.4 Arial, sans-serif; white-space: nowrap;
				}
				.morning-walkthrough .morning-card h3 {
					margin: 0 0 6px; color: var(--morning-accent); font-size: 1.65rem;
					font-weight: 600; line-height: 1.3;
				}
				.morning-walkthrough .morning-card p {
					margin: 0; color: #495d6d; font: 400 1rem/1.65 Arial, sans-serif;
				}
				@media (max-width: 480px) {
					.morning-walkthrough .morning-step { grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding-bottom: 18px; }
					.morning-walkthrough .morning-step:not(:last-child)::before { left: 19px; top: 20px; bottom: -20px; }
					.morning-walkthrough .morning-icon { width: 40px; height: 40px; }
					.morning-walkthrough .morning-icon svg { width: 22px; height: 22px; }
					.morning-walkthrough .morning-card { padding: 16px; }
					.morning-walkthrough .morning-card h3 { font-size: 1.4rem; }
				}
				
				/* Share one sky background across the timeline and the wave above the blue section. */
				.afternoon-sky .afternoon-wave {
					width: 100%; height: 60px; margin-bottom: -1px;
					overflow: hidden; pointer-events: none;
				}
				.afternoon-sky .afternoon-wave svg { display: block; width: 100%; height: 60px; }
				.afternoon-sky .afternoon-wave path { fill: #458CCB; }
				.afternoon-walkthrough { width: 100%; max-width: 720px; margin: 0 auto; }
				.afternoon-walkthrough .afternoon-intro {
					max-width: 580px; margin: 0 auto 32px; color: #2B5F8B;
					font-size: 1.35rem; line-height: 1.6;
				}
				.afternoon-walkthrough .afternoon-timeline {
					list-style: none; margin: 0; padding: 0; text-align: left;
				}
				.afternoon-walkthrough .afternoon-step {
					--afternoon-accent: #2B5F8B; --afternoon-tint: #eaf4fc;
					position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr);
					gap: 20px; margin: 0; padding: 0 0 22px;
				}
				.afternoon-walkthrough .afternoon-step:nth-child(3n + 2) {
					--afternoon-accent: #72538a; --afternoon-tint: #f3edf8;
				}
				.afternoon-walkthrough .afternoon-step:nth-child(3n) {
					--afternoon-accent: #416f53; --afternoon-tint: #edf6e9;
				}
				/* Replace the shared stylesheet's checklist markers with a connecting line. */
				.afternoon-walkthrough .afternoon-step::before { content: none; }
				.afternoon-walkthrough .afternoon-step:not(:last-child)::before {
					content: ""; position: absolute; left: 27px; top: 28px; bottom: -28px;
					width: 2px; height: auto; background: #c6dae8;
				}
				.afternoon-walkthrough .afternoon-step:last-child { padding-bottom: 0; }
				.afternoon-walkthrough .afternoon-icon {
					position: relative; display: grid; place-items: center; width: 56px; height: 56px;
					border: 2px solid #fff; border-radius: 50%; background: var(--afternoon-tint);
					color: var(--afternoon-accent); box-shadow: 0 0 0 1px #d4e2eb;
				}
				.afternoon-walkthrough .afternoon-icon svg {
					display: block; width: 28px; height: 28px; fill: none; stroke: currentColor;
					stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
				}
				.afternoon-walkthrough .afternoon-card {
					min-width: 0; padding: 20px 24px; border: 1px solid #dce8ef;
					border-radius: 18px; background: #fff; box-shadow: 0 4px 14px rgba(43, 95, 139, .05);
				}
				.afternoon-walkthrough .afternoon-card time {
					display: inline-block; margin-bottom: 8px; padding: 4px 10px; border-radius: 8px;
					background: var(--afternoon-tint); color: var(--afternoon-accent);
					font: 700 .875rem/1.4 Arial, sans-serif; white-space: nowrap;
				}
				.afternoon-walkthrough .afternoon-card h3 {
					margin: 0 0 6px; color: var(--afternoon-accent); font-size: 1.65rem;
					font-weight: 600; line-height: 1.3;
				}
				.afternoon-walkthrough .afternoon-card p {
					margin: 0; color: #495d6d; font: 400 1rem/1.65 Arial, sans-serif;
				}
				@media (max-width: 480px) {
					.afternoon-walkthrough .afternoon-step { grid-template-columns: 40px minmax(0, 1fr); gap: 12px; padding-bottom: 18px; }
					.afternoon-walkthrough .afternoon-step:not(:last-child)::before { left: 19px; top: 20px; bottom: -20px; }
					.afternoon-walkthrough .afternoon-icon { width: 40px; height: 40px; }
					.afternoon-walkthrough .afternoon-icon svg { width: 22px; height: 22px; }
					.afternoon-walkthrough .afternoon-card { padding: 16px; }
					.afternoon-walkthrough .afternoon-card h3 { font-size: 1.4rem; }
				}
.ccfri-discount-table {
  width: 100%;
  max-width: 340px;
  margin: 0 auto 20px;
  border: 1px solid #77688C;
  border-collapse: collapse;
  color: #77688C;
}

.ccfri-discount-table th,
.ccfri-discount-table td {
  padding: 8px 10px;
  border: 1px solid #77688C;
  text-align: left;
}

