/* Maplewood Sports Academy brand overrides: red #E01A21, charcoal #231F20 */
img[src*="mis-logo"] { height: 52px; width: auto; max-width: none; }
.footer-logo img[src*="mis-logo"], footer img[src*="mis-logo"] { max-height: 70px; }
.site-name span { color: #fff; }
::selection { background: #E01A21; color: #fff; }
/* white text on red buttons; white buttons keep charcoal text */
.cp-primary-btn:not(.white-btn) .btn-text,
.cp-primary-btn:not(.white-btn) .btn-text span.active { color: #fff; }
/* section tags: red box, white text */
.section-heading .sub-heading,
.section-heading.white-content .sub-heading { background: #E01A21; border-color: #E01A21; color: #fff; }
.section-heading .sub-heading .dot,
.section-heading.white-content .sub-heading .dot { background-color: #fff; }
/* white icons and text on red shapes */
.swiper-arrow .swiper-nav, .swiper-arrow .swiper-nav i,
.portfolio-item .bottom-content .arrow-icon, .portfolio-item .bottom-content .arrow-icon i,
.portfolio-inner-item .content .title-wrap .arrow-icon, .portfolio-inner-item .content .title-wrap .arrow-icon i,
.about-content-2 .author-feedback .author-list li.icon, .about-content-2 .author-feedback .author-list li.icon i,
.skill-item .icon, .skill-item .icon i,
.side-menu-wrapper .side-menu-close, .side-menu-wrapper .side-menu-close i,
.bg-theme-color, #scroll-percentage-value { color: #fff; }
.portfolio-item .bottom-content .arrow-icon img, .portfolio-inner-item .arrow-icon img, .skill-item .icon img { filter: brightness(0) invert(1); }
.mt-cursor, .mt-cursor * { color: #fff; }
.testimonial-section .rating-btn, .testimonial-section .rating-btn * { color: #fff; }
.subcribe-btn, .subcribe-btn i, .breadcum-content .sub-title li.inner-page, .breadcum-content .sub-title li.inner-page a,
.bg-theme-color, .bg-theme-color *:not(.cp-primary-btn.white-btn *),
.service-item-2 .accordion-button:not(.collapsed), .service-item-2 .accordion-button:not(.collapsed) *,
.service-item-2 .accordion-body:not(.collapsed), .service-item-2 .accordion-body:not(.collapsed) *,
.cp-primary-btn:not(.white-btn) { color: #fff !important; }
/* other red hover/active states */
.service-item-3.active .arrow-icon, .service-item-3:hover .arrow-icon,
.team-item .team-content .social-list li a:hover, .team-item-2 .social-list li a:hover,
.pricing-toggle .nav .nav-item .nav-link.active, .pricing-item:hover .pricing-btn,
.inner-pricing-item:hover, .inner-pricing-item:hover *,
.review-content-form .review-btn:hover, .submit-btn:hover, .cart-total-wrap .checkout-btn:hover,
.coupon-form .coupon-btn:hover, .comment-item .reply:hover, .sidebar-widget .sidebar-img-wrap .content .call-info .icon,
.footer-widget .footer-list-2 li:hover, .footer-widget .footer-list-2 li:hover *, .footer-widget .social-list li a:hover,
.copyright-area .copyright-content .social-list li a:hover, .mean-bar .mean-nav.mean-nav > ul li a.mean-expand.mean-clicked { color: #fff !important; }
/* replace the decorative Melo Drama accent font with the main heading font */
:root { --cp-ff-heading-2: 'Inter Tight', sans-serif; }
/* newsletter field: white instead of green */
.newsletter-form .form-control { background: #fff; color: #231F20; border-color: #fff; }
.newsletter-form .form-control::placeholder { color: #6b6b6b; }
/* logo keeps its proportions everywhere */
img[src*="mis-logo"] { width: auto !important; max-width: 100%; height: auto; max-height: 52px; object-fit: contain; }
/* side menu contact list: same font for all lines, long email wraps */
.side-menu-list li, .side-menu-list li p, .side-menu-list li a { font-family: var(--cp-ff-body); font-size: 16px; line-height: 1.5; }
.side-menu-list li a { overflow-wrap: anywhere; }
/* big footer wordmark on one line */
.footer-title { white-space: nowrap; font-size: clamp(40px, 9vw, 160px); }
/* scrolling footer name */
.footer-title.msa-marquee { overflow: hidden; white-space: nowrap; font-size: clamp(40px, 7vw, 130px); }
.msa-marquee .msa-track { display: inline-flex; gap: 0.5em; align-items: center; animation: msa-scroll 30s linear infinite; }
.msa-marquee .dot { color: #E01A21; font-size: 0.4em; }
@keyframes msa-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.footer-title.msa-marquee { width: 100vw; position: relative; left: 50%; margin-left: -50vw; max-width: none; }
.footer-section, .footer-wrapper { overflow-x: hidden; }
/* preloader: animated logo instead of text */
.site-name .preloader-logo { width: min(520px, 70vw) !important; height: auto !important; max-height: none !important; max-width: none; animation: msa-logo-in 1.2s cubic-bezier(.2,.8,.2,1) both, msa-logo-pulse 1.6s ease-in-out 1.2s infinite; }
@keyframes msa-logo-in { from { opacity: 0; transform: scale(.7) translateY(20px); filter: blur(8px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes msa-logo-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.04); } }
/* header logo sized like the template's so the menu stays on one line */
.header-logo img[src*="mis-logo"], .side-menu-logo img[src*="mis-logo"], .mobile-side-menu img[src*="mis-logo"] { max-height: 42px; }
.header .primary-header-inner .header-menu-wrap ul { flex-wrap: nowrap; white-space: nowrap; }
/* loading screen: logo only, no red bar shapes */
.preloader .preloader-gutters { display: none !important; }
.preloader .site-name { background-color: #231F20; }
/* page-header breadcrumb: normal pill buttons instead of big circles */
.breadcum-content .sub-title { gap: 12px; flex-wrap: wrap; }
.breadcum-content .sub-title li { width: auto; height: 52px; padding: 0 28px; border-radius: 50px; font-size: 16px; background: #fff; border: 1px solid #fff; }
.breadcum-content .sub-title li a { color: #231F20; }
.breadcum-content .sub-title li.inner-page { background-color: #E01A21; border-color: #E01A21; }
.breadcum-content .sub-title li.inner-page, .breadcum-content .sub-title li.inner-page a { color: #fff !important; }
.breadcum-content .sub-title li:hover { transform: translateY(-2px); }
/* gallery card titles on one line */
.portfolio-item .content .title, .portfolio-inner-item .content .title, .mansory-item .content .title { white-space: nowrap; }
/* round avatars (the template's were round cut-outs; ours are photos) */
.author-list li { overflow: hidden; }
.author-list li img, .clint-wrap .image img, .comment-item .comment-thumb img, .post-meta img, .author img, img[src*="author-img"], img[src*="clints-"], img[src*="comment-thumb"], img[src*="blog/author-1"], img[src*="quate-img"] { border-radius: 50%; object-fit: cover; width: 100%; height: 100%; aspect-ratio: 1 / 1; }
.hero-section .author-list li:not(:first-of-type) { margin-left: -14px; }
/* home hero slideshow: four photos crossfade with a slow zoom (24s loop) */
.msa-hero-slides { overflow: hidden; }
.msa-hero-slides .msa-slide { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; opacity: 0; animation: msa-slide 24s infinite; }
.msa-hero-slides .msa-slide:nth-child(1) { animation-delay: 0s; }
.msa-hero-slides .msa-slide:nth-child(2) { animation-delay: 6s; }
.msa-hero-slides .msa-slide:nth-child(3) { animation-delay: 12s; }
.msa-hero-slides .msa-slide:nth-child(4) { animation-delay: 18s; }
@keyframes msa-slide {
  0% { opacity: 0; transform: scale(1.08); }
  4% { opacity: 1; }
  25% { opacity: 1; }
  30% { opacity: 0; transform: scale(1); }
  100% { opacity: 0; transform: scale(1); }
}
.msa-slide-dots { position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%); z-index: 3; display: flex; gap: 10px; }
.msa-slide-dots span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.45); animation: msa-dot 24s infinite; }
.msa-slide-dots span:nth-child(2) { animation-delay: 6s; }
.msa-slide-dots span:nth-child(3) { animation-delay: 12s; }
.msa-slide-dots span:nth-child(4) { animation-delay: 18s; }
@keyframes msa-dot { 0%, 25% { background: #E01A21; width: 28px; border-radius: 6px; } 26%, 100% { background: rgba(255,255,255,.45); width: 10px; } }
@media (prefers-reduced-motion: reduce) { .msa-hero-slides .msa-slide, .msa-slide-dots span { animation: none; } .msa-hero-slides .msa-slide:first-child { opacity: 1; } }
/* sport pages */
.msa-level { background: #F8F5F5; border-radius: 16px; padding: 24px; height: 100%; border-top: 4px solid #E01A21; }
.msa-level-age { display: inline-block; background: #E01A21; color: #fff; font-size: 13px; font-weight: 600; padding: 4px 12px; border-radius: 20px; margin-bottom: 12px; }
.msa-level .title { font-size: 20px; margin-bottom: 8px; }
.msa-level p { font-size: 16px; margin: 0; }
.service-details-content .details-img img { border-radius: 16px; width: 100%; aspect-ratio: 424 / 250; object-fit: cover; }
.category-list li.active a { color: #E01A21; font-weight: 600; }
.msa-more { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; background: #E01A21; color: #fff !important; padding: 12px 24px; border-radius: 50px; font-weight: 600; font-size: 15px; }
.msa-more:hover { background: #231F20; }
/* hero: each slide has its own headline, line and button, in step with its photo (24s loop, 6s each) */
.msa-hero-captions { display: grid; }
.msa-hero-captions .msa-cap { grid-area: 1 / 1; opacity: 0; visibility: hidden; animation: msa-cap 24s infinite; }
.msa-hero-captions .msa-cap:nth-child(2) { animation-delay: 6s; }
.msa-hero-captions .msa-cap:nth-child(3) { animation-delay: 12s; }
.msa-hero-captions .msa-cap:nth-child(4) { animation-delay: 18s; }
@keyframes msa-cap {
  0% { opacity: 0; visibility: visible; transform: translateY(30px); }
  4% { opacity: 1; transform: none; }
  23% { opacity: 1; transform: none; }
  27% { opacity: 0; transform: translateY(-20px); visibility: visible; }
  28%, 100% { opacity: 0; visibility: hidden; }
}
.msa-cap-text { color: #fff; font-size: 20px; line-height: 1.5; max-width: 560px; margin: 24px 0 0; }
.msa-cap .msa-more { margin-top: 24px; }
@media (max-width: 767px) { .msa-cap-text { font-size: 16px; margin-top: 16px; } }
@media (prefers-reduced-motion: reduce) { .msa-hero-captions .msa-cap { animation: none; } .msa-hero-captions .msa-cap:first-child { opacity: 1; visibility: visible; } }
/* "Explore now" circle: the ring spins, the red arrow button in the middle stays still */
.hero-content .circle-btn, .hero-content-2 .btn-wrap .circle-btn { animation: none !important; position: relative; display: inline-block; }
.circle-btn img { animation: rotate360 10s linear infinite; }
.msa-circle-dot { position: absolute; left: 50%; top: 50%; width: 48px; height: 48px; margin: -24px 0 0 -24px; border-radius: 50%; background: #E01A21; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 20px; transition: transform .3s; }
.circle-btn:hover .msa-circle-dot { transform: scale(1.12); }
/* The reviews card is gone from the home hero (owner, 2026-11-05); the Explore Now circle
   takes its place on the right, and shows on phones too, at a smaller size. */
.msa-home-hero .hero-content .hero-inner-content { justify-content: flex-end; }
@media only screen and (max-width: 567px) {
  .hero-content .circle-btn { display: inline-block; width: 150px; height: 150px; }
  .hero-content .circle-btn img { width: 150px; height: 150px; }
  .hero-content .circle-btn .msa-circle-dot { width: 40px; height: 40px; margin: -20px 0 0 -20px; font-size: 17px; }
}
/* shorter home hero: fits one screen on a laptop */
.msa-home-hero .hero-content { padding: 150px 0 50px; }
.msa-home-hero .hero-content .title { font-size: 150px; line-height: 120px; }
.msa-home-hero .hero-content .hero-inner-content { margin-top: 40px; }
.msa-home-hero .hero-content .author-list-wrap { padding: 28px 32px; }
.msa-home-hero .msa-cap-text { margin-top: 18px; }
.msa-home-hero .msa-cap .msa-more { margin-top: 18px; }
@media (max-width: 1199px) { .msa-home-hero .hero-content .title { font-size: 120px; line-height: 100px; } }
@media (max-width: 767px) { .msa-home-hero .hero-content { padding: 130px 0 50px; } .msa-home-hero .hero-content .title { font-size: 72px; line-height: 64px; } .msa-home-hero .hero-content .hero-inner-content { margin-top: 30px; } }
/* header: logo left, menu centred, button right; no search, no divider */
@media (min-width: 992px) {
  .header .primary-header-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 24px; }
  .header .primary-header-inner .header-left-wrap { display: contents; }
  .header .primary-header-inner .header-left-wrap .header-logo { border-right: 0; padding-right: 0; justify-self: start; }
  .header .primary-header-inner .header-menu-wrap { justify-self: center; margin: 0; }
  .header .primary-header-inner .header-right-wrap { justify-self: end; }
}
/* card tags are labels, not buttons: no pill outline, so they don't look clickable */
.portfolio-item .bottom-content .list li, .portfolio-inner-item .list li { border: 0; padding: 0; background: none; cursor: default; font-size: 13px; letter-spacing: .04em; display: inline-flex; align-items: center; gap: 8px; }
.portfolio-item .bottom-content .list li::before, .portfolio-inner-item .list li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #E01A21; }
.portfolio-item .bottom-content .list, .portfolio-inner-item .list { gap: 16px; }
/* footer photo strip glides at a steady speed */
.footer-gallary-carousel .swiper-wrapper { transition-timing-function: linear !important; }
/* sport-page age cards: no red top edge */
.msa-level { border-top: 0; }
/* free-trial card: text at the bottom on a dark fade, readable over any photo */
.sidebar-cta { border-radius: 16px; overflow: hidden; }
.sidebar-cta::after { background: linear-gradient(to top, rgba(35,31,32,.95) 0%, rgba(35,31,32,.6) 45%, rgba(35,31,32,.05) 80%) !important; }
.sidebar-cta .sidebar-img { height: 420px; }
.sidebar-cta .sidebar-img img { object-fit: cover; }
.sidebar-cta .content { top: auto !important; bottom: 28px; left: 28px !important; right: 28px; transform: none !important; z-index: 2; }
.sidebar-cta .content .cta-title { font-size: 24px; line-height: 32px; margin-bottom: 18px; color: #fff; }
/* FAQ: open-question arrow is white on the red circle */
.faq-content .faq-accordion .accordion-item .accordion-button:not(.collapsed):after { color: #fff !important; }
/* newsletter heading: smaller, one line */
.footer-section .footer-top .title { font-size: 36px; line-height: 44px; }
@media (max-width: 767px) { .footer-section .footer-top .title { font-size: 28px; line-height: 36px; } }
/* Template style: Athlex tints its photo sections in its deep brand colour (dark green).
   The Maplewood equivalent is a deep red, used at the template's own strengths. */
:root { --msa-deep: 74, 8, 11; }
.breadcum-section::after { background: rgba(var(--msa-deep), 0.62) !important; }
.feature-section::after { background: rgba(var(--msa-deep), 0.93) !important; }
.membership-section::after { background: rgba(var(--msa-deep), 0.93) !important; }
.team-section::after { background: rgba(var(--msa-deep), 0.93) !important; }
.footer-section::after { background: rgba(var(--msa-deep), 0.95) !important; }
.service-section-2::after { background: rgba(var(--msa-deep), 0.9) !important; }
.skill-section::after { background: rgba(var(--msa-deep), 0.88) !important; }
.video-section::after { background: rgba(var(--msa-deep), 0.55) !important; }
.portfolio-item::after { background: linear-gradient(180deg, rgba(var(--msa-deep), 0) 39.23%, rgba(var(--msa-deep), 0.94) 77.03%) !important; }
.footer-img-item::after { background: rgba(var(--msa-deep), 0.5) !important; }
.post-standard-card.card-2 .image::after { background: rgba(var(--msa-deep), 0.46) !important; }
/* counting numbers keep the template's own typography (the odometer theme set its own line height) */
.num .odometer, .num .odometer .odometer-inside, .num .odometer .odometer-digit, .num .odometer .odometer-value { font: inherit !important; line-height: inherit !important; letter-spacing: inherit; vertical-align: baseline !important; }
.num .odometer.odometer-auto-theme, .num .odometer.odometer-theme-default { display: inline-block; line-height: inherit; }
.num { white-space: nowrap; }
/* page header keeps the template's height now that the circles are pills */
.breadcum-section .breadcum-content { padding-bottom: 168px; }
@media (max-width: 767px) { .breadcum-section .breadcum-content { padding-bottom: 70px; } }
/* reviews badge: red outline, black text */
.testimonial-section .rating-btn { background-color: transparent !important; border: 2px solid #E01A21; }
.testimonial-section .rating-btn, .testimonial-section .rating-btn * { color: #231F20 !important; }
/* hover: photos zoom gently inside their frames */
.image, .service-img, .service-img-2, .post-thumb, .details-img, .team-thumb, .sidebar-img, .service-details-img,
.image-1, .image-2, .about-img, .about-img-2, .faq-img, .blog-details-img, .footer-img-item .image, .portfolio-item .image { overflow: hidden; }
.image img, .service-img img, .service-img-2 img, .post-thumb img, .details-img img, .team-thumb img, .sidebar-img img, .service-details-img img,
.image-1 img, .image-2 img, .about-img img, .about-img-2 img, .faq-img img, .blog-details-img img, .footer-img-item .image img, .portfolio-item .image img {
  transition: transform .7s cubic-bezier(.2, .8, .2, 1), filter .7s ease; }
.image:hover img, .service-img:hover img, .service-img-2:hover img, .post-thumb:hover img, .details-img:hover img, .team-thumb:hover img, .sidebar-img:hover img, .service-details-img:hover img,
.image-1:hover img, .image-2:hover img, .about-img:hover img, .about-img-2:hover img, .faq-img:hover img, .blog-details-img:hover img, .footer-img-item:hover .image img, .portfolio-item:hover .image img,
.post-card:hover .post-thumb img, .team-item:hover .team-thumb img, .portfolio-inner-item:hover .image img, .service-item-3:hover .image img {
  transform: scale(1.08); filter: saturate(1.1); }
/* not on avatars, quote photos or icons */
.clint-wrap .image img, .blog-details-quate .image img, .author-list img, .comment-thumb img, .icon img { transform: none !important; filter: none !important; }
/* about section: photo fills the left column between the tag and the avatars */
.msa-about-photo { flex: 1; min-height: 320px; margin: 28px 40px 28px 0; border-radius: 16px; overflow: hidden; }
.msa-about-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1199px) { .msa-about-photo { flex: none; height: 420px; margin: 24px 0; } }
@media (max-width: 575px) { .msa-about-photo { height: 320px; } }
/* counting numbers (prices, counters): site font, enough line height so digits are never clipped */
.odometer, .odometer .odometer-inside, .odometer .odometer-digit, .odometer .odometer-digit-spacer,
.odometer .odometer-digit-inner, .odometer .odometer-ribbon, .odometer .odometer-ribbon-inner, .odometer .odometer-value {
  font-family: inherit !important; font-weight: inherit !important; }
.odometer.odometer-auto-theme, .odometer.odometer-theme-default { vertical-align: baseline !important; line-height: 1.25 !important; }
.odometer .odometer-digit, .odometer .odometer-digit-inner, .odometer .odometer-value { line-height: 1.25 !important; }
.price .odometer { padding-top: 2px; }
.num .odometer.odometer-auto-theme, .num .odometer .odometer-digit, .num .odometer .odometer-digit-inner, .num .odometer .odometer-value { line-height: inherit !important; }
/* fee cards: "AED", the amount and "/month" sit on one text baseline */
.pricing-item .price, .inner-pricing-item .price { align-items: baseline !important; gap: 6px; }
.pricing-item .price .odometer, .inner-pricing-item .price .odometer { padding-top: 0; }
/* sports ticker: red dot between each sport */
.running-text ul li::after { content: ""; display: inline-block; width: 0.18em; height: 0.18em; margin: 0 0.35em; border-radius: 50%; background: #E01A21; vertical-align: middle; transform: translateY(-0.12em); }
/* headings with tight line height hide anything outside their box: leave room for letter tails (p, g, y) without moving the layout */
.tz-itm-title, .section-title, .tz-sub-tilte { padding-bottom: 0.16em; margin-bottom: -0.16em; }
.tz-itm-title .line, .tz-itm-title > div, .section-title > div { padding-bottom: 0.08em; }
/* ---------- batch 1: new pages ---------- */
.msa-side-cta { background: #E01A21; color: #fff; border-radius: 16px; padding: 32px 28px; margin-top: 30px; }
.msa-side-cta h3 { color: #fff; font-size: 26px; line-height: 32px; margin-bottom: 10px; }
.msa-side-cta p { color: rgba(255,255,255,.9); margin-bottom: 18px; }
.msa-side-cta .msa-more { background: #fff; color: #231F20 !important; margin-top: 0; }
.msa-side-cta .msa-more:hover { background: #231F20; color: #fff !important; }
.msa-wa-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; color: #fff; font-weight: 600; font-size: 15px; }
.msa-wa-link i { font-size: 20px; }
.msa-wa-big { color: #231F20; margin-left: 20px; }
.msa-wa-big i { color: #E01A21; }
.msa-card { background: #F8F5F5; border-radius: 16px; padding: 14px 14px 22px; height: 100%; }
.msa-card .details-img { margin-bottom: 16px; border-radius: 12px; overflow: hidden; }
.msa-card .title { font-size: 20px; margin: 10px 0 8px; }
.msa-card p { font-size: 16px; margin: 0; }
.msa-schedule li, .msa-steps li { display: flex; gap: 16px; align-items: baseline; padding: 12px 0; border-bottom: 1px solid #eee; font-size: 17px; }
.msa-schedule li span { min-width: 64px; font-weight: 700; color: #E01A21; }
.msa-steps li span { flex: none; width: 32px; height: 32px; border-radius: 50%; background: #E01A21; color: #fff; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.msa-price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.msa-price-grid > div { border: 2px solid #E01A21; border-radius: 16px; padding: 22px; text-align: center; }
.msa-price-grid span { display: block; font-weight: 600; color: #231F20; }
.msa-price-grid strong { display: block; font-size: 34px; line-height: 1.25; color: #E01A21; margin: 6px 0; font-family: var(--cp-ff-heading); }
.msa-price-grid em { font-style: normal; font-size: 14px; color: #666; }
@media (max-width: 767px) { .msa-price-grid { grid-template-columns: 1fr; } }
.msa-tt-block { margin-top: 40px; }
.msa-tt-sport { font-size: 26px; margin-bottom: 14px; }
.msa-tt-sport a { color: #231F20; } .msa-tt-sport a:hover { color: #E01A21; }
.msa-table-wrap { overflow-x: auto; border-radius: 12px; border: 1px solid #eee; }
.msa-table { width: 100%; border-collapse: collapse; min-width: 560px; }
.msa-table th { background: #231F20; color: #fff; text-align: left; padding: 12px 16px; font-weight: 600; }
.msa-table td { padding: 12px 16px; border-top: 1px solid #eee; }
.msa-table tbody tr:nth-child(even) td { background: #F8F5F5; }
.msa-draft { background: #FFF4F4; border-left: 4px solid #E01A21; padding: 14px 18px; border-radius: 8px; color: #231F20; }
.msa-form .form-control { margin-bottom: 18px; }
.msa-trial-photo { height: 420px; margin: 0; }
.msa-page .faq-content { margin-top: 0; }
/* floating WhatsApp button on every page (bottom left; back-to-top stays bottom right) */
.msa-whatsapp { position: fixed; left: 24px; bottom: 24px; z-index: 999; width: 56px; height: 56px; border-radius: 50%; background: #E01A21; color: #fff !important; display: flex; align-items: center; justify-content: center; font-size: 28px; box-shadow: 0 6px 18px rgba(0,0,0,.25); transition: transform .3s; }
.msa-whatsapp:hover { transform: scale(1.08); }
/* footer legal links */
.msa-legal { display: flex; gap: 24px; flex-wrap: wrap; }
.msa-legal a { color: rgba(255,255,255,.8); } .msa-legal a:hover { color: #fff; }
/* ---- no clipped text, wherever the template uses tight line heights ---- */
/* counting numbers: digits get a full-height window (the template's 0.7 line height cut them),
   negative margins keep the counter blocks exactly where they were */
.num .odometer.odometer-auto-theme, .num .odometer.odometer-theme-default { line-height: 1.2 !important; margin: -0.25em 0 !important; vertical-align: baseline !important; }
.num .odometer .odometer-digit, .num .odometer .odometer-digit-inner, .num .odometer .odometer-value,
.num .odometer .odometer-ribbon, .num .odometer .odometer-ribbon-inner { line-height: 1.2 !important; }
/* scrolling footer name: room for the tails of p and y */
.footer-title.msa-marquee { line-height: 1.15 !important; padding: 0.06em 0 0.12em; }
.msa-marquee .msa-track { line-height: 1.15; }
/* sports ticker: a little air above and below the letters */
.running-text ul { padding: 0.06em 0; }
.running-text ul li { line-height: 0.9 !important; }
@media only screen and (max-width: 767px) { .running-text ul li { line-height: 0.95 !important; } }
/* ---- round 2 (2026-11-03) ---- */
/* card names show without hovering; hover still adds the blur and lifts the title */
.portfolio-inner-item .content { bottom: 92px; opacity: 1 !important; }
.portfolio-inner-item .list { opacity: 1; transform: none; }
.portfolio-inner-item.item-2::after { opacity: 1; visibility: visible; }
.portfolio-inner-item.item-2 .content { opacity: 1; bottom: 92px; }
.portfolio-inner-item:hover .content, .portfolio-inner-item.item-2:hover .content { bottom: 104px; }
.portfolio-item::after { opacity: 1; transform: none; visibility: visible; }
.portfolio-item .content { opacity: 1; visibility: visible; bottom: 40px; }
.portfolio-item-2 .content { opacity: 1; visibility: visible; transform: none; }
/* gallery: five photos per row */
@media (min-width: 1200px) { .msa-gallery-5 > .msa-col-5 { flex: 0 0 20%; max-width: 20%; } }
.msa-gallery-5 .portfolio-inner-item { height: 440px; }
.msa-gallery-5 .portfolio-inner-item .content { padding: 0 18px; bottom: 64px; }
.msa-gallery-5 .portfolio-inner-item:hover .content { bottom: 72px; }
.msa-gallery-5 .portfolio-inner-item .content .title-wrap .title { font-size: 20px; line-height: 26px; }
.msa-gallery-5 .portfolio-inner-item .content .title-wrap .arrow-icon { width: 40px; height: 40px; font-size: 15px; color: #fff; }
.msa-gallery-5 .portfolio-inner-item .list { padding: 0 18px; bottom: 20px; gap: 6px; }
.msa-gallery-5 .portfolio-inner-item .list li { font-size: 11px; padding: 7px 10px; }
@media only screen and (max-width: 767px) { .msa-gallery-5 .portfolio-inner-item { height: 400px; } }
/* reviews badge: our logo, dark text inside the white circle */
.testimonial-section-2 .circle-shape.msa-review-badge img { width: 150px; height: auto; }
.bg-theme-color .circle-shape.msa-review-badge span, .bg-theme-color .circle-shape.msa-review-badge .rating { color: #231F20 !important; }
.testimonial-section-2 .circle-shape.msa-review-badge span { font-size: 15px; line-height: 20px; margin: 10px 0 8px; text-align: center; }
.bg-theme-color .circle-shape.msa-review-badge .rating i { color: #E01A21 !important; }
/* trial banner: heading and button sit in the middle of the photo */
.video-section { display: flex; align-items: center; justify-content: center; }
.video-section > .container { width: 100%; }
.video-content { padding-top: 0; }
/* sports ticker runs edge to edge */
.running-text .container-fluid { padding-left: 0; padding-right: 0; max-width: none; }
/* white tick on the red counter circles */
.counter-item-2 .icon { color: #fff; }
/* about counters: digits get a full-height window */
.about-content .about-info-wrap .info-item .num, .about-content .about-info-wrap .info-item .num span,
.about-content .about-info-wrap .info-item .num .odometer * { line-height: 1.2 !important; }
.about-content .about-info-wrap .info-item .num { margin: -0.2em 0; }
/* news cards: author and date stay on one line each */
.post-card-2 .meta-tag li.tag, .post-card-2 .meta-tag li.date { white-space: nowrap; }
.post-card-2 .post-thumb a { display: block; }
/* article pages: booking card without a shared photo, recent posts as text */
.sidebar-cta.msa-cta-plain { background: #231F20; padding: 48px 36px; }
.sidebar-cta.msa-cta-plain::after { display: none; }
.sidebar-cta.msa-cta-plain .content { position: static; transform: none; }
.sidebar-post.msa-text-post { padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid rgba(35, 31, 32, 0.1); }
.sidebar-post.msa-text-post:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.sidebar-post.msa-text-post .post-content { padding-left: 0; }
.msa-gallery-5 .portfolio-inner-item .list { flex-wrap: nowrap; gap: 5px; padding: 0 14px; }
.msa-gallery-5 .portfolio-inner-item .list li { font-size: 10px; padding: 6px 8px; white-space: nowrap; letter-spacing: 0.02em; }
.msa-gallery-5 .portfolio-inner-item .content { padding: 0 14px; bottom: 58px; }
.msa-gallery-5 .portfolio-inner-item:hover .content { bottom: 64px; }
.msa-gallery-5 .portfolio-inner-item .content .title-wrap .arrow-icon { display: none; }

/* Home hero headings on one line and smaller (owner, 2026-11-05). The size follows the
   screen width so the longest one, "Play And Grow", still fits a phone without wrapping. */
.msa-home-hero .msa-hero-captions .title {
  white-space: nowrap;
  font-size: min(110px, calc((100vw - 40px) / 8.8));
  line-height: 1.05;
}
.msa-home-hero .msa-hero-captions .title span { display: inline; }

/* Phones: room under the footer's last line so the floating WhatsApp button never covers
   the Terms / Privacy / Safeguarding links (2026-11-05). */
@media (max-width: 767px) {
  .copyright-area { padding-bottom: 84px; }
}

/* Phones: page titles such as "Safeguarding" and "Basketball Academy" ran past the screen
   edge at 65px and were clipped. The size now follows the screen width so the longest word
   fits (2026-11-05). */
@media only screen and (max-width: 567px) {
  .breadcum-content .title { font-size: min(65px, 11.5vw); line-height: 1.05; }
}

/* Home hero: the heading, text and button sit lower on the photo, away from the menu
   (owner, 2026-11-05). On tablets and up the Explore Now circle is pinned to the bottom
   right, so moving the text down does not make the hero taller. */
@media (min-width: 768px) {
  .msa-home-hero .hero-content { position: relative; padding: 250px 0 70px; }
  .msa-home-hero .hero-content .hero-inner-content { position: absolute; right: 0; bottom: 50px; margin-top: 0; }
}
@media (max-width: 767px) {
  .msa-home-hero .hero-content { padding-top: 170px; }
}
/* ...but the hero keeps the height it had before (owner, 2026-11-05). Measured on the live
   page before the change: 826px from 1200px wide, 786px from 768px, 902px from 568px and
   736px on a 375px phone. */
.msa-home-hero .hero-content { min-height: 826px; }
@media (max-width: 1199px) { .msa-home-hero .hero-content { min-height: 786px; } }
@media (max-width: 767px)  { .msa-home-hero .hero-content { min-height: 902px; } }
@media (max-width: 567px)  { .msa-home-hero .hero-content { min-height: 736px; } }
/* Text further down (owner, 2026-11-05): the heading, line and button sit at the bottom
   of the hero instead of the middle, at every screen size. */
.msa-home-hero .hero-content { display: flex; flex-direction: column; justify-content: flex-end; }
@media (min-width: 768px) { .msa-home-hero .hero-content { padding-bottom: 80px; } }
