:root{
--dark-bg: #000;
--muted: #71767b;
--card-gradient-start: #1a1b2e;
--card-gradient-end: #0c0d17;
}

html,body{
height:100%;
margin:0;
background:var(--dark-bg);
color:#fff;
font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}


.site-header{
height: 80vh;
min-height: 420px;
background-image: url('zgeTuV.jpg');
background-size: cover;
background-position: center;
position: relative;
overflow: hidden;
}


.site-header::before{
content:"";
position:absolute;
inset:0;
background: rgba(0,0,0,0.65);
z-index:1;
}


.site-header .navbar,
.header-content{
position:relative;
z-index:2;
}


.header-content{
display:flex;
align-items:center;
justify-content:center;
height: calc(80vh - 100px);
padding-top: 1rem;
padding-bottom: 2rem;
}


.header-content h1{
line-height:1.05;
}


.email-box{
width: 100%;
max-width: 640px;
margin: 0 auto;
}


.img-fluid{
display:block;
width:100%;
height:auto;
border-radius: 8px;
}


.kids-card{
padding: 1.5rem;
border-radius: 12px;
background: linear-gradient(145deg, var(--card-gradient-start), var(--card-gradient-end) 60%);
box-shadow: 0 8px 25px rgba(0,0,0,0.45);
display:flex;
flex-direction:column;
gap:1rem;
color:#fff;
transition: transform .25s ease;
}

.kids-card h3{
font-size:1.05rem;
margin:0;
font-weight:600;
}

.kids-card p{
margin:0;
font-size:0.95rem;
line-height:1.35rem;
opacity:0.95;
color: #ddd;
}

.kids-card i{
margin-left:auto;
font-size:1.25rem;
color:#ddd;
}

/* subtle hover */
.kids-card:hover{
transform: translateY(-6px);
}


.accordion-button{
background: #111;
color: #fff;
}
.accordion-button:not(.collapsed){
background:#1a1a1a;
color:#fff;
}


footer a{
color:var(--muted);
text-decoration: underline;
}


.accordion-item, .accordion-button, .accordion-body{
border-radius: 6px;
border: none;
}

@media (max-width: 991px){
.site-header{ height: 70vh; }
.header-content{ height: auto; padding-top: 2.5rem; padding-bottom: 3rem; }
}

@media (max-width: 768px){
.site-header{ height: 60vh; min-height: 520px; }
.header-content h1{ font-size: 1.9rem; }
.kids-card{ padding: 1rem; }
}


main, footer{
margin: 0;
padding-left: 0;
padding-right: 0;
}


button:focus, a:focus{
outline: 3px solid rgba(255,0,0,0.12);
outline-offset: 2px;
}

@media (max-width: 420px){
.site-header{
background-position: center 30%;
}
}