:root{
	--sky: #bff3f2;
	--aqua: #9eeaf4;
	--blue: #3f86ff;
	--deep-blue: #2344b8;
	--purple: #b44cff;
	--hot-pink: #ff4fd8;
	--magenta: #ff2abf;
	--yellow: #ffd44d;
	--gold: #ffbf1f;
	--orange: #ff9432;
	--lime: #b9eb1c;
	--green: #67d44a;
	--ink: #1c1f2c;
	--card: #ffffff;
	--shadow: 0 18px 40px rgba(31, 37, 89, 0.18);
	--shadow-strong: 0 25px 60px rgba(26, 28, 60, 0.28);
	--radius-xl: 28px;
	--radius-lg: 20px;
	--radius-md: 14px;
	--stroke-dark: #24314d;
}

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

html{
	scroll-behavior:smooth;
}

body{
	margin:0;
	font-family:'Fredoka', system-ui, sans-serif;
	color:var(--ink);
	background:
		radial-gradient(circle at top left, rgba(255,255,255,.85), transparent 30%),
		linear-gradient(180deg, #e6fcff 0%, #dbf6ff 24%, #fdfcff 100%);
}

body.modal-open{
	overflow:hidden;
}

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

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

button,
input,
select,
textarea{
	font:inherit;
}

.container{
	width:min(1200px, calc(100% - 32px));
	margin:0 auto;
}

.page-wrap{
	overflow:hidden;
}

/* Topbar */
.topbar{
	position:sticky;
	top:0;
	z-index:50;
	background:rgba(255,255,255,.8);
	backdrop-filter:blur(14px);
	border-bottom:1px solid rgba(35,68,184,.08);
}

.topbar-inner{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:20px;
	padding:12px 0;
}

.brand-link{
	display:flex;
	align-items:center;
	gap:12px;
	min-width:0;
}

.brand-logo{
	width:58px;
	height:auto;
	filter:drop-shadow(0 6px 12px rgba(0,0,0,.12));
}

.brand-text{
	font-family:'Baloo 2', cursive;
	font-weight:800;
	font-size:1.2rem;
	color:var(--deep-blue);
}

.top-actions{
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-end;
	gap:10px;
}

.pill{
	padding:10px 14px;
	border-radius:999px;
	background:#fff;
	border:3px solid var(--stroke-dark);
	box-shadow:0 6px 0 rgba(36,49,77,.15);
	font-weight:700;
	transition:transform .18s ease, box-shadow .18s ease;
}

.pill:hover{
	transform:translateY(-2px);
	box-shadow:0 10px 0 rgba(36,49,77,.12);
}

.pill-call{
	background:linear-gradient(180deg, var(--yellow), var(--orange));
}

/* Hero */
.hero{
	position:relative;
	padding:54px 0 40px;
}

.hero-bg-shapes{
	position:absolute;
	border-radius:50%;
	filter:blur(8px);
	opacity:.42;
	pointer-events:none;
}

.shape-1{
	width:280px;
	height:280px;
	background:radial-gradient(circle, var(--hot-pink), transparent 68%);
	top:20px;
	left:-60px;
}

.shape-2{
	width:360px;
	height:360px;
	background:radial-gradient(circle, var(--yellow), transparent 70%);
	top:160px;
	right:-100px;
}

.shape-3{
	width:260px;
	height:260px;
	background:radial-gradient(circle, var(--aqua), transparent 70%);
	bottom:-40px;
	left:40%;
}

.hero-grid{
	display:grid;
	grid-template-columns:1.05fr .95fr;
	gap:42px;
	align-items:center;
	position:relative;
	z-index:2;
}

.eyebrow{
	display:inline-block;
	background:#fff;
	border:3px solid var(--stroke-dark);
	border-radius:999px;
	padding:10px 18px;
	font-weight:700;
	box-shadow:0 8px 0 rgba(36,49,77,.12);
	margin-bottom:18px;
}

.hero-title{
	font-family:'Luckiest Guy', cursive;
	font-size: clamp(2.2rem, 5.4vw, 4.4rem);
	line-height: .96;
	letter-spacing:1px;
	color:var(--black);
	-webkit-text-stroke: 2px var(--stroke-dark);
	paint-order: stroke fill;
	text-shadow:
		0 2px 0 rgba(255,255,255,.9),
		0 6px 14px rgba(0,0,0,.14);
}

.hero-title span{
	display:block;
	color:var(--blue);
	-webkit-text-stroke: 2px var(--deep-blue);
	paint-order: stroke fill;
	text-shadow:
		0 2px 0 rgba(255,255,255,.9),
		0 6px 14px rgba(0,0,0,.14);
}

.hero-subtitle{
	font-size:1.15rem;
	line-height:1.7;
	max-width:650px;
	margin:20px 0 0;
	background:rgba(255,255,255,.72);
	border:3px solid rgba(36,49,77,.1);
	border-radius:24px;
	padding:18px 20px;
	box-shadow:var(--shadow);
}

.hero-buttons{
	display:flex;
	flex-wrap:wrap;
	gap:14px;
	margin-top:24px;
}

.cta-btn{
	appearance:none;
	border:none;
	cursor:pointer;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:56px;
	padding:14px 24px;
	border-radius:18px;
	font-family:'Baloo 2', cursive;
	font-weight:800;
	font-size:1.08rem;
	border:3px solid var(--stroke-dark);
	box-shadow:0 8px 0 rgba(36,49,77,.15);
	transition:transform .18s ease, box-shadow .18s ease;
}

.cta-btn:hover{
	transform:translateY(-2px);
	box-shadow:0 12px 0 rgba(36,49,77,.12);
}

.cta-primary{
	color:#fff;
	background:linear-gradient(135deg, var(--magenta), var(--purple));
}

.cta-secondary{
	color:var(--ink);
	background:linear-gradient(135deg, var(--lime), var(--yellow));
}

.hero-mini{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-top:24px;
}

.mini-badge{
	background:#fff;
	border:2px solid rgba(36,49,77,.16);
	border-radius:999px;
	padding:10px 14px;
	font-weight:700;
	box-shadow:0 8px 18px rgba(36,49,77,.08);
}

.hero-image-wrap{
	position:relative;
}

.hero-image-card{
	position:relative;
	background:linear-gradient(180deg, #fff, #f2feff);
	border:4px solid var(--stroke-dark);
	border-radius:36px;
	padding:16px;
	box-shadow:var(--shadow-strong);
	transform:rotate(-1.8deg);
}

.hero-image{
	border-radius:24px;
	width:100%;
	min-height:420px;
	object-fit:cover;
	border:4px solid rgba(36,49,77,.12);
}

.hero-image-burst{
	position:absolute;
	border-radius:50%;
	z-index:-1;
}

.burst-a{
	width:160px;
	height:160px;
	background:radial-gradient(circle, rgba(255,79,216,.8), transparent 68%);
	top:-34px;
	right:-32px;
}

.burst-b{
	width:180px;
	height:180px;
	background:radial-gradient(circle, rgba(185,235,28,.75), transparent 70%);
	bottom:-40px;
	left:-34px;
}

/* Quick strip */
.quick-strip{
	padding:10px 0 12px;
}

.quick-strip-grid{
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:16px;
}

.quick-card{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:6px;
	padding:20px;
	background:#fff;
	border-radius:24px;
	border:3px solid var(--stroke-dark);
	box-shadow:var(--shadow);
	min-height:140px;
	transition:transform .18s ease;
}

.quick-card:hover{
	transform:translateY(-4px) rotate(-.5deg);
}

.quick-button-reset{
	width:100%;
	border:none;
	text-align:left;
	cursor:pointer;
}

.quick-card:nth-child(1){ background:linear-gradient(180deg, #fff0ad, #ffe585); }
.quick-card:nth-child(2){ background:linear-gradient(180deg, #ffe2fb, #ffbdf1); }
.quick-card:nth-child(3){ background:linear-gradient(180deg, #e7fff0, #c6f7d4); }
.quick-card:nth-child(4){ background:linear-gradient(180deg, #e3f7ff, #c2ebff); }

.quick-icon{
	font-size:2rem;
}

.quick-title{
	font-family:'Baloo 2', cursive;
	font-weight:800;
	font-size:1.2rem;
}

.quick-text{
	color:#39445b;
	font-weight:600;
}

/* Sections */
.section{
	padding:72px 0;
}

.section-head{
	max-width:840px;
	margin:0 auto 34px;
	text-align:center;
}

.section-head h2{
	margin:0 0 12px;
	font-family:'Baloo 2', cursive;
	font-size:clamp(2rem, 4vw, 3.2rem);
	line-height:1;
	color:var(--deep-blue);
}

.section-head p{
	margin:0;
	font-size:1.08rem;
	line-height:1.7;
	color:#3b4b68;
}

/* Values */
.value-grid{
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:18px;
}

.value-card{
	background:#fff;
	border:3px solid rgba(36,49,77,.12);
	border-radius:26px;
	padding:26px 20px;
	box-shadow:var(--shadow);
}

.value-card:nth-child(1){ transform:rotate(-1deg); }
.value-card:nth-child(2){ transform:rotate(.8deg); }
.value-card:nth-child(3){ transform:rotate(-.7deg); }
.value-card:nth-child(4){ transform:rotate(1deg); }

.value-icon{
	font-size:2rem;
	margin-bottom:12px;
}

.value-card h3{
	margin:0 0 10px;
	font-family:'Baloo 2', cursive;
	font-size:1.45rem;
	color:var(--deep-blue);
}

.value-card p{
	margin:0;
	line-height:1.65;
	color:#3f4c64;
}

/* Programs */
.programs{
	background:
		radial-gradient(circle at top left, rgba(255,212,77,.26), transparent 26%),
		radial-gradient(circle at bottom right, rgba(180,76,255,.14), transparent 26%),
		linear-gradient(180deg, #f8feff 0%, #eefcff 100%);
}

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

.program-card{
	overflow:hidden;
	background:#fff;
	border-radius:28px;
	border:4px solid var(--stroke-dark);
	box-shadow:var(--shadow-strong);
}

.program-card img{
	width:100%;
	height:230px;
	object-fit:cover;
}

.program-content{
	padding:20px;
}

.program-content h3{
	margin:0 0 10px;
	font-family:'Baloo 2', cursive;
	font-size:1.5rem;
	line-height:1.05;
	color:var(--deep-blue);
}

.program-content p{
	margin:0;
	line-height:1.65;
	color:#44516c;
}

.tilt-a{ transform:rotate(-1deg); }
.tilt-b{ transform:rotate(1deg); }
.tilt-c{ transform:rotate(-.8deg); }
.tilt-d{ transform:rotate(.8deg); }
.tilt-e{ transform:rotate(-1deg); }
.tilt-f{ transform:rotate(1deg); }

/* Excitement band */
.excitement-band{
	position:relative;
}

.excitement-grid{
	display:grid;
	grid-template-columns:1.1fr .9fr;
	gap:24px;
	align-items:center;
}

.excitement-copy{
	background:linear-gradient(135deg, #ffffff, #f4fcff);
	border:4px solid var(--stroke-dark);
	border-radius:32px;
	padding:30px;
	box-shadow:var(--shadow-strong);
}

.excitement-copy h2{
	margin:0 0 12px;
	font-family:'Baloo 2', cursive;
	font-size:clamp(2rem, 4vw, 3rem);
	line-height:1;
	color:var(--hot-pink);
}

.excitement-copy p{
	margin:0;
	line-height:1.75;
	font-size:1.06rem;
}

.facts-panel{
	display:grid;
	grid-template-columns:repeat(2, 1fr);
	gap:14px;
}

.fact-pill{
	background:#fff;
	border:3px solid var(--stroke-dark);
	border-radius:24px;
	padding:20px 16px;
	text-align:center;
	font-family:'Baloo 2', cursive;
	font-weight:800;
	box-shadow:var(--shadow);
}

.fact-pill:nth-child(1){ background:#ffe9f9; }
.fact-pill:nth-child(2){ background:#fff4c6; }
.fact-pill:nth-child(3){ background:#e6fff0; }
.fact-pill:nth-child(4){ background:#e7f5ff; }
.fact-pill:nth-child(5){ background:#f2e8ff; }
.fact-pill:nth-child(6){ background:#fff0e3; }

/* Footer */
.footer{
	padding:30px 0 50px;
	background:#1d2f68;
	color:#fff;
	margin-top:24px;
}

.footer-grid{
	display:grid;
	grid-template-columns:1fr auto;
	gap:30px;
	align-items:start;
}

.footer-brand{
	display:inline-flex;
	align-items:center;
	gap:12px;
	font-family:'Baloo 2', cursive;
	font-weight:800;
	font-size:1.25rem;
}

.footer-brand img{
	width:52px;
}

.footer-copy{
	margin:12px 0 0;
	max-width:520px;
	color:rgba(255,255,255,.86);
	line-height:1.7;
}

.footer-links{
	display:grid;
	gap:10px;
	justify-items:end;
}

.footer-links a,
.footer-button-link{
	color:#fff;
	background:none;
	border:none;
	cursor:pointer;
	font-weight:700;
	text-align:right;
}

.footer-button-link{
	padding:0;
}

/* Modal */
.modal-overlay{
	position:fixed;
	inset:0;
	background:rgba(18, 24, 42, .66);
	display:none;
	align-items:center;
	justify-content:center;
	padding:22px;
	z-index:200;
}

.modal-overlay.is-open{
	display:flex;
}

.modal-shell{
	position:relative;
	width:min(840px, 100%);
	max-height:90vh;
	overflow:auto;
	background:linear-gradient(180deg, #ffffff, #f5fcff);
	border:4px solid var(--stroke-dark);
	border-radius:30px;
	box-shadow:0 30px 80px rgba(0,0,0,.35);
	padding:28px;
}

.map-shell{
	width:min(980px, 100%);
}

.modal-close{
	position:absolute;
	top:14px;
	right:14px;
	width:48px;
	height:48px;
	border-radius:50%;
	border:3px solid var(--stroke-dark);
	background:#fff;
	cursor:pointer;
	font-size:1.8rem;
	font-weight:800;
	line-height:1;
	box-shadow:0 8px 18px rgba(0,0,0,.15);
}

.modal-header{
	display:flex;
	align-items:center;
	gap:16px;
	padding-right:54px;
	margin-bottom:18px;
}

.modal-logo-link img{
	width:78px;
	filter:drop-shadow(0 8px 14px rgba(0,0,0,.14));
}

.modal-header h2{
	margin:0 0 6px;
	font-family:'Baloo 2', cursive;
	font-size:2rem;
	line-height:1;
	color:var(--deep-blue);
}

.modal-header p{
	margin:0;
	color:#49556f;
	line-height:1.6;
}

.alert{
	border-radius:16px;
	padding:14px 16px;
	margin-bottom:18px;
	font-weight:700;
}

.alert-success{
	background:#e8fff0;
	border:2px solid #7ecb92;
	color:#1d6c38;
}

.alert-error{
	background:#fff0f0;
	border:2px solid #e18d8d;
	color:#9c3030;
}

.contact-form{
	margin-top:8px;
}

.form-grid{
	display:grid;
	grid-template-columns:repeat(2, 1fr);
	gap:16px;
}

.form-group{
	display:grid;
	gap:8px;
}

.form-group-full{
	grid-column:1 / -1;
}

.form-group label{
	font-weight:800;
	color:#263656;
}

.form-group input,
.form-group select,
.form-group textarea{
	width:100%;
	border:3px solid rgba(36,49,77,.15);
	border-radius:16px;
	background:#fff;
	padding:14px 16px;
	outline:none;
	transition:border-color .15s ease, box-shadow .15s ease;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
	border-color:var(--blue);
	box-shadow:0 0 0 4px rgba(63,134,255,.14);
}

.modal-actions{
	display:flex;
	flex-wrap:wrap;
	gap:14px;
	margin-top:20px;
}

.map-frame-wrap{
	overflow:hidden;
	border-radius:22px;
	border:3px solid rgba(36,49,77,.14);
	box-shadow:var(--shadow);
}

.hp-field{
	position:absolute !important;
	left:-9999px !important;
	width:1px !important;
	height:1px !important;
	overflow:hidden !important;
}

/* Responsive */
@media (max-width: 1100px){
	.hero-grid,
	.excitement-grid{
		grid-template-columns:1fr;
	}

	.hero-copy{
		order:1;
	}

	.hero-image-wrap{
		order:2;
	}

	.quick-strip-grid,
	.value-grid,
	.program-grid{
		grid-template-columns:repeat(2, 1fr);
	}
}

@media (max-width: 760px){
	.container{
		width:min(100% - 20px, 100%);
	}

	.topbar-inner,
	.footer-grid{
		grid-template-columns:1fr;
		display:grid;
	}

	.top-actions,
	.footer-links{
		justify-content:flex-start;
		justify-items:start;
	}

	.brand-text{
		font-size:1.02rem;
	}

	.hero{
		padding-top:28px;
	}

	.hero-title,
	.hero-title span{
		-webkit-text-stroke:2.6px var(--stroke-dark);
	}

	.hero-image{
		min-height:280px;
	}

	.quick-strip-grid,
	.value-grid,
	.program-grid,
	.facts-panel,
	.form-grid{
		grid-template-columns:1fr;
	}

	.section{
		padding:56px 0;
	}

	.hero-subtitle{
		font-size:1rem;
	}

	.modal-shell{
		padding:22px 16px 18px;
		border-radius:24px;
	}

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

	.modal-logo-link img{
		width:60px;
	}

	.modal-header h2{
		font-size:1.5rem;
	}
}

.pill-call-alt{
	background:linear-gradient(180deg, var(--aqua), var(--blue));
	color:#10224f;
}

.program-card.poster-trigger{
	appearance:none;
	border:4px solid var(--stroke-dark);
	text-align:left;
	padding:0;
	cursor:pointer;
	font:inherit;
}

.program-card.poster-trigger:hover{
	transform:translateY(-6px) rotate(0deg);
}

.teachers-section{
	background:
		radial-gradient(circle at top right, rgba(255,79,216,.12), transparent 24%),
		radial-gradient(circle at bottom left, rgba(185,235,28,.15), transparent 26%),
		linear-gradient(180deg, #fffdf8 0%, #f8fcff 100%);
}

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

.teacher-card{
	background:#fff;
	border:4px solid var(--stroke-dark);
	border-radius:28px;
	box-shadow:var(--shadow-strong);
	overflow:hidden;
}

.teacher-a{ transform:rotate(-1deg); }
.teacher-b{ transform:rotate(.8deg); }
.teacher-c{ transform:rotate(-.8deg); }

.teacher-photo-wrap{
	padding:20px 20px 0;
}

.teacher-photo{
	width:100%;
	aspect-ratio: 4 / 5.35;
	object-fit:cover;
	object-position:center top;
	border-radius:22px;
	background:linear-gradient(180deg, #f6fdff, #eef8ff);
	border:3px solid rgba(36,49,77,.12);
}

.teacher-content{
	padding:20px;
}

.teacher-content h3{
	margin:0 0 10px;
	font-family:'Baloo 2', cursive;
	font-size:1.65rem;
	color:var(--deep-blue);
}

.teacher-content p{
	margin:0;
	line-height:1.7;
	color:#44516c;
}

.poster-shell{
	width:min(760px, 100%);
}

.poster-modal-card{
	background:#fff;
	border:3px solid rgba(36,49,77,.12);
	border-radius:22px;
	overflow:hidden;
	box-shadow:var(--shadow);
}

.poster-modal-image{
	width:100%;
	height:auto;
	display:block;
	object-fit:contain;
	background:#fff;
}

.poster-contact-bar{
	display:flex;
	flex-wrap:wrap;
	gap:14px;
	margin-top:18px;
}

@media (max-width: 1100px){
	.teacher-grid{
		grid-template-columns:1fr;
	}
}