html{overflow-x:clip}body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);text-wrap:pretty;overflow-x:clip}a{color:var(--color-accent-700)}a:hover{color:var(--color-accent-800)}img{display:block}[hidden]{display:none!important}.design-skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.design-skip:focus{position:absolute;z-index:100;background:#fff;padding:16px}button:focus-visible,a:focus-visible{outline:3px solid var(--color-accent-700);outline-offset:4px}[data-gallery-track]::-webkit-scrollbar{display:none}.design-intro p{margin:0}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.design-hover-0:hover{background: #b3c21f !important; color: #1d1d1b !important;}
.design-hover-1:hover{text-decoration: underline !important;}
.design-hover-2:hover{border-color: var(--color-accent) !important; transform: translateY(-2px) !important;}
.design-hover-3:hover{transform: translateY(-4px) !important; box-shadow: var(--shadow-md) !important;}
.design-hover-4:hover{border-color: var(--color-text) !important;}
.design-hover-5:hover{background: var(--color-accent-100) !important;}
.design-hover-6:hover{transform: rotate(0deg) scale(1.06) !important;}
.design-hover-7:hover{transform: rotate(-2deg) !important;}
.design-hover-8:hover{transform: translateY(-2px) !important; box-shadow: var(--shadow-md) !important;}

/* Native FAQ module: expandable questions in the site's existing palette. */
.faq-list{display:grid;gap:14px;max-width:900px;margin:0 0 20px}
.faq-item{background:var(--color-surface,#fff);border:2px solid transparent;border-radius:28px;box-shadow:var(--shadow-sm);transition:border-color .15s}
.faq-item:hover,.faq-item:focus-within{border-color:var(--color-accent-700)}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;list-style:none;cursor:pointer;font-size:17px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';font-size:26px;line-height:1;flex:none;color:var(--color-accent-700)}
.faq-item[open] summary::after{content:'−'}
.faq-item summary:focus-visible{outline:3px solid var(--color-accent-700);outline-offset:4px;border-radius:24px}
.faq-answer{padding:0 24px 24px;font-size:17px;line-height:1.7;overflow-wrap:anywhere}
.faq-answer>:first-child{margin-top:0}.faq-answer>:last-child{margin-bottom:0}

/* Collapsible navigation on phones and tablets; native CMS menu links are retained. */
.site-nav-panel{display:contents}
.site-nav-toggle{display:none;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:10px 16px;border:2px solid var(--color-text);border-radius:999px;background:transparent;color:var(--color-text);font:600 16px var(--font-body);cursor:pointer}
.site-nav-toggle:hover{background:var(--color-accent-100)}
.site-nav-toggle-icon{display:grid;gap:4px;width:20px}
.site-nav-toggle-icon span{display:block;width:20px;height:2px;background:currentColor;transition:transform .15s,opacity .15s}
.site-nav-toggle[aria-expanded="true"] .site-nav-toggle-icon span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.site-nav-toggle[aria-expanded="true"] .site-nav-toggle-icon span:nth-child(2){opacity:0}
.site-nav-toggle[aria-expanded="true"] .site-nav-toggle-icon span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
@media(max-width:900px){
 .site-nav{justify-content:space-between;gap:12px!important;padding:10px 20px!important}
 .site-nav-logo{flex:none}
 .site-nav-ready .site-nav-toggle:not([hidden]){display:inline-flex}
 .site-nav-panel{display:flex;flex-direction:column;align-items:stretch;gap:16px;flex-basis:100%;max-height:calc(100dvh - 116px);overflow-y:auto;overscroll-behavior:contain;padding:10px 4px 14px}
 .site-nav-links{flex-direction:column;align-items:stretch;gap:4px!important;flex:none!important}
 .site-nav-links a{display:flex;align-items:center;min-height:48px;box-sizing:border-box;padding:10px 16px;border-radius:16px;font-size:17px}
 .site-nav-links a:hover,.site-nav-links a:focus-visible{background:var(--color-accent-100)}
 .site-nav-panel .site-nav-apply{display:flex;align-items:center;justify-content:center;min-height:48px;box-sizing:border-box;align-self:flex-start;padding:12px 22px}
}
@media(max-width:360px){.site-nav{padding-inline:16px!important}.site-nav-toggle{padding-inline:12px}}

@media(max-width:360px){.site-nav-logo,.site-nav-logo img{width:168px!important}.site-nav{padding-inline:16px!important}}

/* BEGIN playful group hover trial */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .design-hover-3[data-group-age]{transition:transform .24s cubic-bezier(.2,.8,.3,1.2),box-shadow .24s ease!important}
 .design-hover-3[data-group-age] img{transition:transform .24s cubic-bezier(.2,.8,.3,1.2)}
 .design-hover-3[data-group-age]:hover{transform:translateY(-5px) rotate(-1.2deg) scale(1.01)!important}
 .design-hover-3[data-group-age]:nth-child(even):hover{transform:translateY(-5px) rotate(1.2deg) scale(1.01)!important}
 .design-hover-3[data-group-age]:hover img{transform:rotate(6deg) scale(1.04)}
 .design-hover-3[data-group-age]:nth-child(even):hover img{transform:rotate(-6deg) scale(1.04)}
}
@media(prefers-reduced-motion:reduce),(hover:none){.design-hover-3[data-group-age]:hover{transform:none!important}}
/* END playful group hover trial */

/* Mark the current primary section on desktop and inside the mobile menu. */
.site-nav-links .site-nav-link.active{color:var(--color-accent-700)!important;text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:6px}
@media(max-width:900px){.site-nav-links .site-nav-link.active{background:var(--color-accent-100)}}

/* Menu CTA uses the dominant lime colour sampled from the original logo. */
.site-nav-apply.design-hover-0:hover{background:#b6c526!important;border-color:#b6c526!important}

/* A small playful tilt for the age choices, matching the group cards. */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 [data-age]{transition:transform .2s cubic-bezier(.2,.8,.3,1.2),border-color .15s!important}
 [data-age].design-hover-2:hover{transform:translateY(-3px) rotate(-4deg) scale(1.04)!important}
 [data-age].design-hover-2:nth-child(even):hover{transform:translateY(-3px) rotate(4deg) scale(1.04)!important}
}
@media(prefers-reduced-motion:reduce),(hover:none){[data-age].design-hover-2:hover{transform:none!important}}

/* On small screens, place the age choices after the hero photographs. */
@media(max-width:900px){
 .home-hero{grid-template-columns:minmax(0,1fr)!important}
 .home-hero-intro{display:contents}
 .home-hero-copy{order:0}
 .home-hero-images{order:1}
 .home-hero-age{order:2;margin-top:0!important;max-width:none!important}
}
