@import url('https://fonts.googleapis.com/css2?family=Asap:wght@400;500;600;700&display=swap');

.baby-gym-page{--gym-cream:#fff6e4;--gym-gold:#c9960c;--gym-ink:#4a3816;--gym-yellow:#ffc637;background:var(--gym-cream);color:#3c3118;font-family:'Asap',sans-serif;line-height:1.45}
.baby-gym-page h1,.baby-gym-page h2,.baby-gym-page h3{font-family:'Asap',sans-serif;font-weight:700;letter-spacing:0}
.gym-wrap{width:min(1080px,calc(100% - 64px));margin-inline:auto}

.gym-hero{position:relative;height:clamp(260px,34vw,420px);overflow:hidden;background:#f3e2b0}
.gym-hero img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.gym-hero::after{content:'';position:absolute;left:0;bottom:-1px;width:100%;height:28px;background:url('../images/gym-wave.svg') repeat-x center bottom/128px 28px;pointer-events:none}

.gym-intro{background:var(--gym-cream);padding:34px 0 8px}
.gym-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 18px;color:#b8860b;font-size:15px;font-weight:500}
.gym-breadcrumb a:hover{text-decoration:underline}
.gym-manage{margin-left:auto;padding:6px 12px;border:1px solid #d7b45a;border-radius:999px;color:#8a6408;font-size:13px;font-weight:700}
.gym-manage:hover{background:#fff3cc;text-decoration:none}
.gym-intro h1{margin:0 0 14px;color:var(--gym-gold);font-size:52px;line-height:1.1}
.gym-intro .gym-wrap>p{max-width:760px;margin:0;font-size:18px;line-height:1.55;color:#3f3420}
.gym-feature-divider{width:min(1080px,calc(100% - 64px));height:16px;margin:38px auto 65px;background:url('../images/gym-feature-wave.svg') repeat-x left center / 120px 16px}

.gym-features{width:min(1080px,calc(100% - 64px));margin:0 auto 54px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.gym-features article{position:relative;isolation:isolate;display:grid;grid-template-rows:80px 120px auto;justify-items:center;align-content:start;gap:24px;min-height:570px;text-align:center;padding:48px 32px 56px;border:0;background:transparent}.gym-features .gym-feature-outline{position:absolute;z-index:-1;inset:0;width:100%;height:100%;pointer-events:none;user-select:none}
.gym-features svg{width:80px;height:80px;margin:0}
.gym-feature-icon{width:80px;height:80px;margin:0;border-radius:0;object-fit:contain}
.gym-features h2{display:flex;align-items:center;justify-content:center;margin:0;max-width:250px;min-height:120px;color:#956c00;font-size:27px;line-height:1.45}
.gym-features p{margin:0;max-width:280px;font-size:18px;line-height:1.55;color:#181710;overflow-wrap:anywhere}

.gym-classes-band{position:relative;background:#ffdf92;padding:48px 0 90px}
.gym-classes-band::before{content:'';position:absolute;top:-29px;left:0;width:100%;height:30px;background:url('../images/gym-classes-wave.svg?v=5') repeat-x center bottom/160px 30px;pointer-events:none}.gym-classes-band::after{content:'';position:absolute;bottom:-1px;left:0;width:100%;height:30px;background:url('../images/gym-classes-bottom-wave.svg') repeat-x center bottom/160px 30px;pointer-events:none}
.gym-classes h2{margin:0;padding:18px 20px 44px;text-align:center;color:#8e6702;font-size:clamp(30px,2.7vw,48px);background:transparent}
.gym-classes .gallery-carousel{margin:0}
.gym-classes .gallery-viewport{overflow:hidden;touch-action:pan-y;scroll-snap-type:none}
.gym-track{--card:28vw;--gap:2vw;display:flex;align-items:flex-start;gap:var(--gap);width:max-content;margin-left:calc((100vw - (var(--card) * 3 + var(--gap) * 2)) / 2 - var(--card) - var(--gap));padding:0}
.gym-class{position:relative;isolation:isolate;flex:none;width:var(--card);padding:0 clamp(18px,2vw,38px) 32px;border-radius:0;background:none;text-align:center;color:#fff;overflow:visible}
.gym-class::before{content:'';position:absolute;z-index:-1;inset:clamp(62px,7.5vw,150px) 0 0;background:#c79500;mask:url('../images/organic-card.svg') center / 100% 100% no-repeat;-webkit-mask:url('../images/organic-card.svg') center / 100% 100% no-repeat}
.gym-class img{display:block;width:100%;height:auto;aspect-ratio:430 / 260;object-fit:cover;border-radius:26px}
.gym-class-placeholder{width:100%;aspect-ratio:430 / 260;border-radius:26px;background:#ead18d}
.gym-class img,.gym-class-placeholder{transform-origin:center center}
.gym-class-tilt-left img,.gym-class-tilt-left .gym-class-placeholder{transform:rotate(-1.8deg)}
.gym-class-tilt-right img,.gym-class-tilt-right .gym-class-placeholder{transform:rotate(1.8deg)}
.gym-class h3{margin:20px 0 6px;font-size:clamp(18px,1.3vw,25px);line-height:1.3;font-weight:700;color:#ffe192}
.gym-class p{margin:0;font-size:clamp(14px,1.1vw,20px);font-weight:500;line-height:1.4;color:#fff}
.gym-arrows{display:flex;justify-content:center;align-items:center;gap:30px;margin-top:38px}
.gym-arrows button{display:grid;place-items:center;width:48px;height:44px;padding:0;border:0;background:none;color:#6a5018}
.gym-arrows button:hover{color:#3d2c08}
.gym-arrows svg{width:44px;height:24px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}

.gym-cta{position:relative;overflow:hidden;background:#ffd66a;padding:44px 0 56px;text-align:center}
.gym-cta-card{position:relative;isolation:isolate;overflow:hidden;width:calc(100% - 7vw);padding:64px 32px 70px;border-radius:34px;background:#fff5da;min-height:370px}
.gym-cta-card::before,.gym-cta-card::after{content:'';position:absolute;z-index:-1;pointer-events:none;user-select:none}
.gym-cta-card::before{width:clamp(220px,24vw,410px);height:110%;left:-4%;bottom:-18%;background:url('../images/baby-gym/cta-fan.svg') left bottom / contain no-repeat}
.gym-cta-card::after{width:clamp(240px,23vw,400px);aspect-ratio:1;right:-3%;top:-12%;background:#ffebb2;mask:url('../images/baby-gym/personalized-care.svg') center / contain no-repeat;-webkit-mask:url('../images/baby-gym/personalized-care.svg') center / contain no-repeat;transform:rotate(12deg)}
.gym-cta-copy{position:relative;max-width:1040px;margin-inline:auto}
.gym-cta h2{margin:0 0 34px;color:#654900;font-size:clamp(30px,2.7vw,48px);line-height:1.25}
.gym-cta p{max-width:740px;margin:0 auto 24px;font-size:clamp(18px,1.5vw,24px);line-height:1.5;color:#17150e}
.gym-cta-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:20px}
.gym-cta-actions a{display:inline-flex;align-items:center;justify-content:center;min-width:168px;min-height:52px;padding:10px 28px;border:0;border-radius:999px;color:#fff5da;font-size:20px;font-weight:700}
.gym-visit{background:#cb9400}.gym-visit:hover{background:#b48200}
.gym-contact{background:#956c00}.gym-contact:hover{background:#795800}
.gym-cta-actions a:focus-visible{outline:3px solid #654900;outline-offset:4px}

.baby-gym-page .footer-app{display:none}
.baby-gym-page .footer-yellow{padding-top:0}.baby-gym-page .footer-yellow::before{display:none}
.baby-gym-page .footer-information{padding-top:100px}

@media(max-width:900px){
    .gym-intro h1{font-size:42px}
    .gym-features{gap:16px}
    .gym-features article{padding:40px 22px;min-height:540px}
    .gym-features h2{font-size:23px}
    .gym-class{padding:0 16px 22px}
    .gym-cta h2{font-size:32px}
}
@media(max-width:760px){
    .gym-wrap,.gym-features,.gym-feature-divider{width:calc(100% - 40px)}
    .gym-hero{height:220px}
    .gym-intro{padding-top:24px}
    .gym-intro h1{font-size:36px}
    .gym-intro .gym-wrap>p{font-size:16px}
    .gym-features{grid-template-columns:1fr;gap:28px;margin-bottom:36px}.gym-feature-divider{margin:30px auto 36px}.gym-features article{min-height:420px;padding:38px 32px 46px;grid-template-rows:80px auto auto;gap:24px}.gym-features h2{min-height:0;font-size:26px;max-width:260px}
    .gym-features p{max-width:none}
    .gym-classes h2{font-size:30px;padding:14px 16px 28px}
    .gym-classes-band{padding:26px 0 66px}
    .gym-track{--card:min(300px,76vw);--gap:18px;margin-left:calc((100vw - var(--card)) / 2 - var(--card) - var(--gap))}
    .gym-class{padding:0 14px 18px}
    .gym-class::before{inset:52px 0 0}
    .gym-class img{border-radius:18px}
    .gym-class h3{font-size:16px}
    .gym-cta{padding:28px 0 36px}
    .gym-cta-card{width:calc(100% - 32px);padding:40px 24px;min-height:0;border-radius:24px}
    .gym-cta h2{font-size:28px;margin-bottom:24px}
    .gym-cta p{font-size:18px}
    .gym-cta-actions{gap:12px}
    .gym-cta-actions a{min-width:120px;font-size:17px;padding:10px 20px}
    .gym-cta-card::before{left:-120px;bottom:-30%;opacity:.55}
    .gym-cta-card::after{right:-140px;top:-80px;opacity:.55}
    .baby-gym-page .footer-information{padding-top:70px}
}