:root{
	--primary:#0c7c86;
	--primary-dark:#095f67;
	--primary-light:#e8f8fa;
	--accent:#f8b84e;
	--bg:#f7fafc;
	--white:#fff;
	--text:#222;
	--text-light:#666;
	--border:#e5e7eb;
	--radius:18px;
	--shadow:0 10px 30px rgba(0,0,0,.08);
	--transition:.3s ease;
	--max-width:1200px;
}

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

html{
	scroll-behavior:smooth;
}

body{
	font-family:Inter,Segoe UI,Arial,sans-serif;
	background:var(--bg);
	color:var(--text);
	line-height:1.7;
	overflow-x:hidden;
}

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

a{
	color:inherit;
	text-decoration:none;
	transition:var(--transition);
}

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

button{
	border:none;
	cursor:pointer;
}

.container{
	width:min(92%,var(--max-width));
	margin:auto;
}

.section{
	padding:90px 0;
}

.section-title{
	text-align:center;
	margin-bottom:60px;
}

.section-title h2{
	font-size:clamp(2rem,5vw,3rem);
	margin-bottom:12px;
	color:var(--primary-dark);
}

.section-title p{
	max-width:700px;
	margin:auto;
	color:var(--text-light);
	font-size:1.05rem;
}

header{
	position:sticky;
	top:0;
	z-index:1000;
	background:rgba(255,255,255,.95);
	backdrop-filter:blur(12px);
	box-shadow:0 2px 20px rgba(0,0,0,.06);
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding:18px 7%;
}

.logo{
	font-size:1.7rem;
	font-weight:800;
	color:var(--primary);
	letter-spacing:.5px;
	margin-right:auto;
}

nav{
	display:flex;
	gap:28px;
	align-items:center;
}

nav a{
	font-weight:600;
	position:relative;
	padding:4px 0;
}

nav a::after{
	content:"";
	position:absolute;
	left:0;
	bottom:-4px;
	width:0;
	height:2px;
	background:var(--primary);
	transition:var(--transition);
}

nav a:hover::after{
	width:100%;
}

.hero{
	min-height:88vh;
	display:grid;
	place-items:center;
	text-align:center;
	padding:120px 20px;
	background:
	linear-gradient(rgba(0,0,0,.45),rgba(0,0,0,.45)),
	url("images/keke27.jpeg") center/cover;
	color:#fff;
}

.hero h1{
	font-size:clamp(3rem,8vw,5rem);
	margin-bottom:20px;
	line-height:1.1;
}

.hero p{
	max-width:720px;
	margin:auto;
	font-size:1.2rem;
	opacity:.95;
}

.hero .btn{
	margin-top:40px;
}

.btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:15px 34px;
	border-radius:999px;
	background:var(--primary);
	color:#fff;
	font-weight:700;
	box-shadow:0 10px 25px rgba(12,124,134,.25);
	transition:var(--transition);
}

.btn:hover{
	background:var(--primary-dark);
	transform:translateY(-4px);
	box-shadow:0 18px 35px rgba(12,124,134,.35);
}

.btn-primary{
	background:var(--primary);
}

.light-bg{
	background:var(--primary-light);
}

.services-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
	gap:30px;
	align-items:stretch;
}

.programme-card,
.pricing-grid .card{
	background:var(--white);
	border:1px solid var(--border);
	border-radius:var(--radius);
	padding:32px;
	box-shadow:var(--shadow);
	transition:var(--transition);
	position:relative;
	overflow:hidden;
}

.programme-card::before,
.pricing-grid .card::before{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:5px;
	background:var(--primary);
	transform:scaleX(0);
	transform-origin:left;
	transition:var(--transition);
}

.programme-card:hover,
.pricing-grid .card:hover{
	transform:translateY(-10px);
	box-shadow:0 18px 40px rgba(0,0,0,.12);
	border-color:var(--primary);
}

.programme-card:hover::before,
.pricing-grid .card:hover::before{
	transform:scaleX(1);
}

.programme-card h3{
	font-size:1.4rem;
	color:var(--primary-dark);
	margin-bottom:14px;
}

.programme-card p{
	color:var(--text-light);
	margin-bottom:12px;
}

.programme-card strong{
	color:var(--text);
}

.programme-card ul{
	list-style:none;
	margin-top:18px;
	display:grid;
	gap:10px;
}

.programme-card li{
	position:relative;
	padding-left:28px;
	color:var(--text-light);
}

.programme-card li::before{
	content:"✓";
	position:absolute;
	left:0;
	top:0;
	color:var(--primary);
	font-weight:700;
}

.pricing-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
	gap:35px;
	margin-top:20px;
}

.pricing-grid .card{
	text-align:center;
}

.pricing-grid h3{
	font-size:1.8rem;
	color:var(--primary-dark);
	margin-bottom:18px;
}

.pricing-grid h2{
	font-size:2.3rem;
	color:var(--primary);
	margin:12px 0;
}

.pricing-grid h4{
	font-size:1rem;
	text-transform:uppercase;
	letter-spacing:.08em;
	color:var(--text-light);
	margin-top:20px;
}

.pricing-grid p{
	color:var(--text-light);
	margin:8px 0;
}

.pricing-grid hr{
	border:none;
	height:1px;
	background:var(--border);
	margin:20px 0;
}

.programme-card.selected{
	border:2px solid var(--primary);
	box-shadow:0 20px 45px rgba(12,124,134,.2);
}

.programme-card.selected::before{
	transform:scaleX(1);
}

.programme-card.selected::after{
	content:"✓ Selected";
	position:absolute;
	top:18px;
	right:18px;
	background:var(--primary);
	color:#fff;
	font-size:.8rem;
	font-weight:700;
	padding:6px 12px;
	border-radius:999px;
}

.programme-card:hover h3{
	color:var(--primary);
}

.programme-card:hover li::before{
	transform:scale(1.2);
}

.programme-card,
.pricing-grid .card{
	animation:fadeUp .6s ease both;
}

@keyframes fadeUp{
	from{
		opacity:0;
		transform:translateY(35px);
	}
	to{
		opacity:1;
		transform:none;
	}
}

.booking-form{
	max-width:850px;
	margin:0 auto;
	background:var(--white);
	padding:40px;
	border-radius:var(--radius);
	box-shadow:var(--shadow);
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:24px;
}

.form-group{
	display:flex;
	flex-direction:column;
}

.form-group:nth-last-child(2),
.form-group:last-child{
	grid-column:1/-1;
}

.form-group label{
	font-weight:700;
	margin-bottom:8px;
	color:var(--primary-dark);
}

.form-group input,
.form-group select,
.form-group textarea{
	width:100%;
	padding:15px 18px;
	border:1px solid var(--border);
	border-radius:12px;
	background:#fff;
	color:var(--text);
	transition:var(--transition);
}

.form-group textarea{
	min-height:150px;
	resize:vertical;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
	outline:none;
	border-color:var(--primary);
	box-shadow:0 0 0 4px rgba(12,124,134,.15);
}

.form-group input:hover,
.form-group select:hover,
.form-group textarea:hover{
	border-color:var(--primary);
}

.btn-large{
	grid-column:1/-1;
	width:100%;
	font-size:1.05rem;
	padding:18px;
	margin-top:10px;
}

.cta-section{
	text-align:center;
	background:linear-gradient(135deg,var(--primary),var(--primary-dark));
	color:#fff;
}

.cta-section h2{
	color:#fff;
	margin-bottom:16px;
	font-size:2.4rem;
}

.cta-section p{
	max-width:650px;
	margin:0 auto 30px;
	opacity:.95;
}

.cta-section .btn{
	background:#fff;
	color:var(--primary);
}

.cta-section .btn:hover{
	background:var(--accent);
	color:#222;
}

.floating-whatsapp{
	position:fixed;
	right:24px;
	bottom:24px;
	width:64px;
	height:64px;
	border-radius:50%;
	background:#25D366;
	color:#fff;
	display:flex;
	align-items:center;
	justify-content:center;
	box-shadow:0 15px 35px rgba(37,211,102,.35);
	z-index:1000;
	transition:var(--transition);
}

.floating-whatsapp:hover{
	transform:translateY(-6px) scale(1.08);
	box-shadow:0 20px 45px rgba(37,211,102,.45);
}

.floating-whatsapp svg{
	width:30px;
	height:30px;
	fill:currentColor;
}

footer{
	background:#1d1d1d;
	color:#fff;
	text-align:center;
	padding:50px 20px;
}

footer p:first-child{
	font-size:1.2rem;
	font-weight:700;
	margin-bottom:8px;
}

footer p:last-child{
	opacity:.75;
}

@media(max-width:900px){

	.booking-form{
		grid-template-columns:1fr;
		padding:28px;
	}

	.form-group,
	.btn-large{
		grid-column:1;
	}

	header{
		flex-direction:column;
		gap:18px;
		padding:18px;
	}

	nav{
		flex-wrap:wrap;
		justify-content:center;
		gap:16px;
	}

	.hero{
		min-height:70vh;
		padding:100px 20px;
	}

	.hero h1{
		font-size:clamp(2.3rem,8vw,3.8rem);
	}
}

@media(max-width:600px){

	.section{
		padding:70px 0;
	}

	.services-grid,
	.pricing-grid{
		grid-template-columns:1fr;
	}

	.booking-form{
		padding:22px;
	}

	.floating-whatsapp{
		width:58px;
		height:58px;
		right:18px;
		bottom:18px;
	}

	.btn{
		width:100%;
	}
}

/* ---------- Animations ---------- */

@keyframes float{
	0%,100%{transform:translateY(0);}
	50%{transform:translateY(-8px);}
}

@keyframes fadeIn{
	from{
		opacity:0;
		transform:translateY(30px);
	}
	to{
		opacity:1;
		transform:none;
	}
}

.hero h1,
.hero p,
.hero .btn{
	animation:fadeIn .8s ease both;
}

.hero p{
	animation-delay:.15s;
}

.hero .btn{
	animation-delay:.3s;
}

.programme-card:nth-child(2){
	animation-delay:.08s;
}

.programme-card:nth-child(3){
	animation-delay:.16s;
}

.programme-card:nth-child(4){
	animation-delay:.24s;
}

.floating-whatsapp{
	animation:float 2.8s ease-in-out infinite;
}

/* ---------- Selection ---------- */

.programme-card{
	cursor:pointer;
}

.programme-card.selected{
	background:var(--primary-light);
	border-color:var(--primary);
	transform:translateY(-8px);
}

/* ---------- Inputs ---------- */

::placeholder{
	color:#999;
}

select{
	cursor:pointer;
}

input:invalid,
select:invalid{
	box-shadow:none;
}

/* ---------- Scrollbar ---------- */

::-webkit-scrollbar{
	width:10px;
}

::-webkit-scrollbar-track{
	background:#eef2f4;
}

::-webkit-scrollbar-thumb{
	background:var(--primary);
	border-radius:999px;
}

::-webkit-scrollbar-thumb:hover{
	background:var(--primary-dark);
}

/* ---------- Utilities ---------- */

.text-center{
	text-align:center;
}

.hidden{
	opacity:0;
	transform:translateY(40px);
	transition:.7s ease;
}

.show{
	opacity:1;
	transform:none;
}

.mt-1{margin-top:10px;}
.mt-2{margin-top:20px;}
.mt-3{margin-top:30px;}
.mt-4{margin-top:40px;}

.mb-1{margin-bottom:10px;}
.mb-2{margin-bottom:20px;}
.mb-3{margin-bottom:30px;}
.mb-4{margin-bottom:40px;}

/* ---------- Desktop ---------- */

@media(min-width:1200px){

	.container{
		width:min(90%,1250px);
	}

	.hero h1{
		font-size:5rem;
	}

	.hero p{
		font-size:1.3rem;
	}

	.programme-card{
		min-height:370px;
	}

}

/* ---------- Tablet ---------- */

@media(max-width:900px){

	header{
		position:relative;
	}

	.section-title{
		margin-bottom:40px;
	}

	.hero{
		text-align:center;
	}

}

/* ---------- Mobile ---------- */

@media(max-width:600px){

	body{
		font-size:.96rem;
	}

	.logo{
		font-size:1.45rem;
	}

	nav{
		flex-direction:column;
		gap:12px;
	}

	.hero{
		padding:90px 18px;
		min-height:65vh;
	}

	.hero h1{
		line-height:1.15;
	}

	.section-title h2{
		font-size:2rem;
	}

	.programme-card,
	.pricing-grid .card{
		padding:24px;
	}

	.booking-form{
		padding:20px;
		gap:18px;
	}

	.btn{
		padding:16px 20px;
	}

	footer{
		padding:40px 20px;
	}

}

/* ---------- Reduced Motion ---------- */

@media(prefers-reduced-motion:reduce){

	*{
		scroll-behavior:auto;
		animation:none!important;
		transition:none!important;
	}

}

.logo img{
	height:60px; /* Adjust as needed */
	width:auto;
	display:block;
}