.training-slide{
  inset:0 -4% -4%;
  background-position:center 16%;
  -webkit-mask-image:none;
  mask-image:none;
}

.training-slide{animation:training-crossfade var(--hero-cycle,24s) linear infinite,training-ken-burns var(--hero-ken-burns,12s) ease-in-out infinite alternate}.slide-one{background-image:var(--hero-image-1)!important;animation-delay:0s,0s}.slide-two{background-image:var(--hero-image-2)!important;animation-delay:calc(var(--hero-slide-duration,6s) * -1),calc(var(--hero-slide-duration,6s) / -3)}.slide-three{background-image:var(--hero-image-3)!important;animation-delay:calc(var(--hero-slide-duration,6s) * -2),calc(var(--hero-slide-duration,6s) / -1.2)}.slide-four{background-image:var(--hero-image-4)!important;animation-delay:calc(var(--hero-slide-duration,6s) * -3),calc(var(--hero-slide-duration,6s) / -0.75)}.hero-image-space:before{animation-duration:var(--wave-duration,32s)}

@media(max-width:700px){
  .training-slide{
    inset:0 -4% -4%;
    background-position:center 16%;
  }
}

.page-home .site-header:not(.is-scrolled){
  background:transparent;
  border-color:transparent;
  box-shadow:none;
  backdrop-filter:none;
}

.hero-image-space{
  background:#0c406a;
}

.page-home .site-header:not(.is-scrolled) nav a{
  color:#fff!important;
  text-shadow:none!important;
}

.page-home .site-header:not(.is-scrolled) nav a:hover{
  color:#fff!important;
}

@media(min-width:701px){
  .page-home .site-header:not(.is-scrolled) #main-nav{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
  }

  .page-home .site-header:not(.is-scrolled) #main-nav a{
    color:#fff!important;
    font-size:15px;
  }
}

.hero{
  --training-image-height:295px;
  padding-top:246px;
}

.hero-image-space:after{
  background:linear-gradient(180deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.48) 26%,rgba(0,0,0,0) 52%,transparent 100%);
}

.hero-image-space:before{
  content:"";
  position:absolute;
  z-index:2;
  right:auto;
  bottom:-1px;
  left:0;
  width:200%;
  height:18px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 18' preserveAspectRatio='none'%3E%3Cpath fill='%23f8fcff' d='M0 6C120 6 180 12 360 11S620 1 720 2s180 11 360 9 240-5 360-5v12H0Z'/%3E%3C/svg%3E") left bottom/50% 100% repeat-x;
  pointer-events:none;
  will-change:transform;
  animation:hero-wave-flow 32s linear infinite;
  filter:drop-shadow(0 7px 7px rgba(7,85,170,.2));
}

@keyframes hero-wave-flow{
  to{transform:translateX(-50%)}
}

.hero .kicker{
  color:var(--blue);
  text-shadow:0 1px 10px rgba(255,255,255,.94);
}

@media(max-width:700px){
  .hero{
    --training-image-height:270px;
    padding-top:224px;
  }

  .hero-image-space:after{
    background:linear-gradient(180deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.48) 26%,rgba(0,0,0,0) 52%,transparent 100%);
  }

  .page-home .site-header:not(.is-scrolled) nav.open{
    background:#fff;
  }

  .page-home .site-header:not(.is-scrolled) nav.open a{
    color:var(--navy)!important;
    text-shadow:none!important;
  }

  .site-header #main-nav.open{
    background:#fff!important;
  }

  .site-header #main-nav.open a{
    color:var(--navy)!important;
    visibility:visible!important;
    opacity:1!important;
    text-shadow:none!important;
  }
}

@media(max-width:520px){
  .hero{
    --training-image-height:250px;
    padding-top:210px;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-image-space:before{animation:none;filter:none}
}

/* On desktop, copy begins below the training photo rather than over it. */
@media(min-width:701px){
  .hero{padding-top:calc(var(--training-image-height) + 34px)}
}

/* Desktop only: continue the active hero slide beneath the copy, under a light readable wash. */
@media(min-width:701px){
  .page-home .hero{background:transparent}
  .page-home .hero-image-space{height:100%}
  .page-home .hero-image-space:after{
    background:linear-gradient(180deg,rgba(0,0,0,.9) 0,rgba(0,0,0,.48) 105px,rgba(0,0,0,0) 245px,rgba(248,252,255,.82) calc(var(--training-image-height) + 12px),rgba(255,255,255,.84) 100%);
  }
  .page-home .hero-image-space:before{top:calc(var(--training-image-height) - 6px);bottom:auto}
  .page-home .hero-image-space:before{opacity:.26}\n  .page-home .hero-grid{z-index:3}
}

.page-courses .courses.home-only{
  display:block!important;
}

.modal.open .backdrop{
  animation:modal-backdrop-in 240ms ease-out both;
}

.modal.open .modal-box{
  animation:modal-box-in 420ms cubic-bezier(.2,.82,.22,1) both;
}

@keyframes modal-backdrop-in{
  from{opacity:0}
  to{opacity:1}
}

@keyframes modal-box-in{
  from{opacity:0;transform:translateY(20px) scale(.94)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

@media(prefers-reduced-motion:reduce){
  .modal.open .backdrop,.modal.open .modal-box{animation:none}
}

@media(prefers-reduced-motion:no-preference){
  body.is-transitioning main{
    animation:page-scale-out-up 500ms cubic-bezier(.4,0,.2,1) both;
  }

  body.is-entering main{
    animation:page-scale-in-up 550ms cubic-bezier(.2,.8,.2,1) both;
  }
}

@keyframes page-scale-out-up{
  from{opacity:1;transform:scale(1)}
  to{opacity:.9;transform:scale(1.03)}
}

@keyframes page-scale-in-up{
  from{opacity:.9;transform:scale(1.03)}
  to{opacity:1;transform:scale(1)}
}

@media(prefers-reduced-motion:no-preference){
  main.page-outgoing{
    position:absolute;
    left:0;
    right:0;
    z-index:3;
    width:100%;
    transform-origin:center top;
    pointer-events:none;
  }

  main.page-outgoing.is-scaling{
    opacity:1;
    transform:scale(1.03);
    transition:transform 500ms cubic-bezier(.4,0,.2,1);
  }

  main.page-incoming{
    position:relative;
    z-index:1;
    opacity:0;
    transform:scale(1.018);
    transform-origin:center top;
  }

  main.page-incoming.is-revealing{
    opacity:1;
    transform:scale(1);
    transition:opacity 550ms cubic-bezier(.2,.8,.2,1),transform 550ms cubic-bezier(.2,.8,.2,1);
  }

  main.page-outgoing.is-crossfading{
    opacity:0;
    transition:opacity 500ms cubic-bezier(.2,.8,.2,1);
  }
}

@media(prefers-reduced-motion:no-preference){
  ::view-transition-old(root),::view-transition-new(root){
    animation-duration:1050ms;
    animation-fill-mode:both;
    animation-timing-function:cubic-bezier(.22,.75,.22,1);
  }

  ::view-transition-old(root){
    animation-name:dansales-view-out;
    z-index:2;
  }

  ::view-transition-new(root){
    animation-name:dansales-view-in;
    z-index:1;
  }
}

@keyframes dansales-view-out{
  0%{opacity:1;transform:scale(1)}
  47.6%{opacity:1;transform:scale(1.03)}
  100%{opacity:0;transform:scale(1.03)}
}

@keyframes dansales-view-in{
  0%,47.6%{opacity:1;transform:scale(1.018)}
  100%{opacity:1;transform:scale(1)}
}

/* The desktop translucent section follows the same smooth wave, rather than a straight edge. */
@media(min-width:701px){
  .page-home .hero-image-space:after{background:linear-gradient(180deg,rgba(0,0,0,.9) 0,rgba(0,0,0,.48) 105px,rgba(0,0,0,0) 245px,rgba(0,0,0,0) 100%)}
  .page-home .hero:after{content:"";position:absolute;z-index:2;inset:0;width:auto;height:auto;border:0;border-radius:0;box-shadow:none;background:rgba(249,253,255,.83);pointer-events:none}
  .page-home .hero-image-space:before{opacity:.26}\n  .page-home .hero-grid{z-index:3}
  @supports ((-webkit-mask-image:linear-gradient(#000,#000)) or (mask-image:linear-gradient(#000,#000))){
    .page-home .hero:after{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 1000' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0 390C120 390 180 410 360 404S620 364 720 370s190 36 360 27 240-25 360-14v617H0Z'/%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 1000' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0 390C120 390 180 410 360 404S620 364 720 370s190 36 360 27 240-25 360-14v617H0Z'/%3E%3C/svg%3E");mask-repeat:no-repeat;mask-size:100% 100%}
  }
}

/* Mobile home composition: carry the copy lower and reserve a little room above Android navigation. */
@media(max-width:700px){
  .page-home .hero{min-height:calc(100svh + 48px);padding-bottom:max(5px,env(safe-area-inset-bottom,0px))}
  .page-home .hero-copy{padding-top:24px}
  .page-home .hero .stats{padding-bottom:max(2px,env(safe-area-inset-bottom,0px))}
}
@media(max-width:520px){.page-home .hero{min-height:calc(100svh + 44px)}}

/* Incoming content follows navigation direction after the clean crossfade. */
@media(prefers-reduced-motion:no-preference){
main.page-text-slide-up .hero-copy,main.page-text-slide-up .hero-box,main.page-text-slide-up .section-title,main.page-text-slide-up .course-grid,main.page-text-slide-up .about-grid,main.page-text-slide-up .about-overview,main.page-text-slide-up .about-director,main.page-text-slide-up .steps,main.page-text-slide-up .contact-grid,main.page-text-slide-up .cta-inner,main.page-text-slide-up .testimonial-grid{animation:dansales-content-slide-up 700ms cubic-bezier(.18,.82,.24,1) both}
}
@keyframes dansales-content-slide-up{from{opacity:0;transform:translate3d(0,28px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
/* Keep the translucent wave behind every piece of hero content. */
@media(min-width:701px){.page-home .hero-grid{position:relative!important;z-index:10!important}}
/* Use a grid-owned layer so the curved translucent wash can never cover the hero copy. */
@media(min-width:701px){
  .page-home .hero:after{display:none}
  .page-home .hero-image-space:before{display:none}
  .page-home .hero-grid{isolation:isolate}
  .page-home .hero-grid:before{content:"";position:absolute;z-index:-1;top:-54px;bottom:-86px;left:50%;width:100vw;transform:translateX(-50%);background:rgba(249,253,255,.83);pointer-events:none}
  @supports ((-webkit-mask-image:linear-gradient(#000,#000)) or (mask-image:linear-gradient(#000,#000))){
    .page-home .hero-grid:before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 1000' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0 35C120 35 180 57 360 49S620 6 720 14s190 39 360 31 240-26 360-15v970H0Z'/%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 1000' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0 35C120 35 180 57 360 49S620 6 720 14s190 39 360 31 240-26 360-15v970H0Z'/%3E%3C/svg%3E");mask-repeat:no-repeat;mask-size:100% 100%}
  }
}

/* Keep more of the training photograph visible before the mobile wave begins. */
@media(max-width:700px){
  .page-home .hero{--training-image-height:315px;padding-top:269px}
}
@media(max-width:520px){
  .page-home .hero{--training-image-height:290px;padding-top:244px}
}

/* Remove the decorative blue halo behind the home-page course panel. */
.page-home .hero:before{display:none}

/* Course cards keep their dimensional surface without a blue ambient glow. */
.course-grid .card{box-shadow:none}
@media(hover:hover){.course-grid .card.reveal-item.is-visible:hover{box-shadow:none}}

/* Keep the public Academy footer centred across desktop and mobile. */
footer .footer-inner{justify-content:center;text-align:center;flex-direction:column}
footer .footer-inner a{color:#f6c94c;font-weight:700;text-decoration:none}
footer .footer-inner a:hover{color:#fff;text-decoration:underline}

/* Keep the floating contact control present without masking the page beneath it. */
.whatsapp{width:62px;height:62px;right:20px;bottom:20px;background:rgba(37,211,102,.10);border:1px solid rgba(37,211,102,.52);color:#1fa854;box-shadow:0 8px 20px rgba(18,118,62,.12)}
.whatsapp:hover{background:rgba(37,211,102,.18);color:#168844}
.whatsapp .whatsapp-mark{position:relative;z-index:1;width:22px;height:22px}
.whatsapp .whatsapp-ring-text{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;fill:currentColor;transform-origin:50% 50%;will-change:transform}
.whatsapp .whatsapp-ring-text text{font:800 7px/1 "DM Sans",Arial,sans-serif;letter-spacing:.48px}

/* Desktop home: one uninterrupted training image, with readable copy layered directly on it. */
@media(min-width:701px){
  .page-home .hero{min-height:720px;padding:148px 0 74px;background:#062b53}
  .page-home .hero-image-space{height:100%}
  .page-home .hero-image-space:before,.page-home .hero-grid:before{display:none!important}
  .page-home .hero-image-space:after{background:linear-gradient(90deg,rgba(1,22,48,.88) 0%,rgba(1,28,59,.76) 42%,rgba(1,29,59,.38) 71%,rgba(1,29,59,.2) 100%)!important}
  .page-home .hero-grid{position:relative!important;z-index:3!important;isolation:auto!important}
  .page-home .hero .kicker{color:#9edcff;text-shadow:none}
  .page-home .hero h1{color:#fff;text-shadow:0 3px 18px rgba(0,0,0,.24)}
  .page-home .hero h1 span{color:#56c7ff}
  .page-home .hero-copy>p,.page-home .hero .stats small{color:#e0effa}
  .page-home .hero .stats{margin-top:35px}.page-home .hero .stats strong{color:#fff}
  .page-home .hero-box{background:rgba(3,36,73,.7);border-color:rgba(177,223,247,.32);box-shadow:0 24px 52px rgba(0,0,0,.2);backdrop-filter:blur(7px)}
  .page-home .hero-box .dmsa,.page-home .hero-box h2{color:#fff}.page-home .hero-box p,.page-home .hero-box .check{color:#e0effa}.page-home .hero-box .check{border-color:rgba(202,230,246,.19)}
  .page-home .course-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* The home page is a curated preview; the Courses route keeps every programme. */
.course-more{display:flex;justify-content:center;margin-top:34px}.page-home .course-grid .card:nth-child(n+5){display:none}
@media(max-width:700px){.page-home .course-grid .card:nth-child(n+5){display:none}}

/* Testimonials retain the Academy's clean, premium card language. */
.testimonials{background:linear-gradient(145deg,#f4faff 0%,#fff 56%,#fff9eb 100%)}.testimonial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.testimonial{display:flex;min-height:244px;flex-direction:column;padding:27px;border:1px solid rgba(149,189,218,.52);border-radius:19px;background:rgba(255,255,255,.9);box-shadow:0 10px 25px rgba(8,58,104,.055)}.testimonial>p{margin:0;color:#395775;font-size:14px;line-height:1.72}.testimonial-person{display:flex;align-items:center;gap:11px;margin-top:auto;padding-top:22px}.testimonial-person>b{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:linear-gradient(135deg,#0877c9,#0755aa);color:#fff;font:800 14px Manrope,sans-serif}.testimonial-person span{display:grid;gap:1px}.testimonial-person strong{color:var(--navy);font:800 13px Manrope,sans-serif}.testimonial-person small{color:var(--muted);font-size:11px}.testimonial-wide{grid-column:2/span 1;background:linear-gradient(145deg,#fff,#f3faff)}
@media(max-width:900px){.testimonial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.testimonial-wide{grid-column:auto}}@media(max-width:620px){.testimonial-grid{grid-template-columns:1fr}.testimonial{min-height:0}.course-more{margin-top:27px}}

/* Mobile uses the same full-image hero language as desktop, with a compact rotating testimonial stack. */
@media(max-width:700px){
  .page-home .hero{min-height:max(100svh,680px);padding:118px 0 28px;background:#062b53}
  .page-home .hero-image-space{inset:0;width:100%;height:100%;margin:0;border-radius:0}
  .page-home .hero-image-space:before{display:none!important}
  .page-home .hero-image-space:after{background:linear-gradient(180deg,rgba(1,22,48,.84) 0%,rgba(1,28,59,.68) 38%,rgba(1,28,59,.42) 72%,rgba(1,28,59,.58) 100%)!important}
  .page-home .hero-grid{position:relative;z-index:3}.page-home .hero-copy{padding-top:0}
  .page-home .hero .kicker{color:#9edcff;text-shadow:none}.page-home .hero h1{color:#fff;text-shadow:0 3px 18px rgba(0,0,0,.25)}.page-home .hero h1 span{color:#56c7ff}
  .page-home .hero-copy>p,.page-home .hero .stats small{color:#e4f0fa}.page-home .hero .stats{border-color:rgba(224,241,253,.35)}.page-home .hero .stats strong{color:#fff}
}
@media(max-width:620px){
  .testimonial-carousel-window{width:100%;overflow:hidden}.testimonial-grid{display:flex!important;gap:0!important;will-change:transform}.testimonial-grid.testimonial-track-moving{transition:transform 680ms cubic-bezier(.22,.8,.24,1)}.testimonial{display:flex!important;flex:0 0 100%;min-height:246px;margin:0}.testimonial>p{font-size:13px;line-height:1.58}.testimonial-person{padding-top:16px}
}

/* Shared Academy page heroes: the interior pages retain the same living training imagery as Home. */
.page-hero{display:none;position:relative;min-height:318px;overflow:hidden;background:#062b53}.page-hero-images{position:absolute;inset:0;overflow:hidden}.page-hero-images:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(1,23,50,.62),rgba(1,34,68,.42) 55%,rgba(1,32,65,.22))}.page-hero-copy{position:relative;z-index:2;display:none;padding-top:135px}.page-hero-copy .kicker{margin-bottom:11px;color:#a7e0ff;text-shadow:none}.page-hero-copy h1{max-width:790px;margin:0;color:#fff;font:800 clamp(35px,4.5vw,58px)/1.05 Manrope,sans-serif;letter-spacing:-.05em}.page-hero-copy p{max-width:620px;margin:13px 0 0;color:#e4f1fa;font-size:17px}.page-courses .page-courses-copy,.page-about .page-about-copy,.page-how .page-how-copy,.page-contact .page-contact-copy{display:block}body:not(.page-home) .page-hero{display:block}
@media(max-width:700px){.page-hero{min-height:265px}.page-hero-copy{padding-top:115px}.page-hero-copy h1{font-size:clamp(32px,9vw,43px)}.page-hero-copy p{max-width:390px;margin-top:10px;font-size:14px;line-height:1.55}.page-hero-images:after{background:linear-gradient(90deg,rgba(1,23,50,.68),rgba(1,34,68,.44) 72%,rgba(1,32,65,.20))}}

/* Eight-image rotation, a lower hero composition, and one clear title per inner page. */
.slide-five{background-image:var(--hero-image-5)!important;animation-delay:calc(var(--hero-slide-duration,6s) * -4),calc(var(--hero-slide-duration,6s) / -0.63)}.slide-six{background-image:var(--hero-image-6)!important;animation-delay:calc(var(--hero-slide-duration,6s) * -5),calc(var(--hero-slide-duration,6s) / -0.53)}.slide-seven{background-image:var(--hero-image-7)!important;animation-delay:calc(var(--hero-slide-duration,6s) * -6),calc(var(--hero-slide-duration,6s) / -0.45)}.slide-eight{background-image:var(--hero-image-8)!important;animation-delay:calc(var(--hero-slide-duration,6s) * -7),calc(var(--hero-slide-duration,6s) / -0.39)}@keyframes training-crossfade{0%,10.5%{opacity:1}12.5%,87.5%{opacity:0}100%{opacity:1}}
.page-hero{min-height:360px}.page-hero-copy{padding-top:184px}.page-courses .courses .section-title .kicker,.page-courses .courses .section-title h2,.page-about .about-grid>div:first-child,.page-how .how-page .section-title,.page-contact .contact-grid>div>.kicker,.page-contact .contact-grid>div>h2{display:none}.page-courses .courses .section-title{margin-bottom:22px}.page-about .about-grid,.page-contact .contact-grid{align-items:start}
body:not(.page-home) .site-header{position:fixed;top:0;left:0;right:0;width:100%;background:rgba(4,32,64,.12);border-color:rgba(218,239,255,.2);backdrop-filter:blur(9px) saturate(1.15);transition:background .28s ease,border-color .28s ease,box-shadow .28s ease}body:not(.page-home) .site-header:not(.is-scrolled) .brand-word,body:not(.page-home) .site-header:not(.is-scrolled) .brand-subtitle,body:not(.page-home) .site-header:not(.is-scrolled) nav a{color:#fff;text-shadow:0 2px 11px rgba(0,0,0,.45)}body:not(.page-home) .site-header:not(.is-scrolled) .menu-toggle{border-color:rgba(255,255,255,.42);background:rgba(3,28,57,.2);color:#fff}body:not(.page-home) .site-header:not(.is-scrolled) .menu-icon,body:not(.page-home) .site-header:not(.is-scrolled) .menu-icon:before,body:not(.page-home) .site-header:not(.is-scrolled) .menu-icon:after{background:#fff}body:not(.page-home) .site-header:not(.is-scrolled) .nav-button{background:rgba(255,255,255,.94);color:var(--deep-blue);box-shadow:0 7px 16px rgba(0,0,0,.18)}body:not(.page-home) .site-header.is-scrolled{background:rgba(255,255,255,.96);border-color:rgba(7,85,170,.12);box-shadow:0 5px 18px rgba(5,45,83,.1)}
@media(max-width:700px){.page-hero{min-height:300px}.page-hero-copy{padding-top:158px}.page-courses .courses .section-title{margin-bottom:12px}}

/* Inner-page hero sits behind the full mobile header; the familiar drawer control is always present. */
body:not(.page-home) main{padding-top:0!important}@media(max-width:700px){body:not(.page-home) .site-header .menu-toggle{position:relative;z-index:32;display:grid!important;place-items:center;flex:0 0 auto}body:not(.page-home) .site-header .nav{gap:12px}}

/* Phone-safe controls: keep both actions fully inside the visible viewport. */
@media(max-width:700px){
  /* Restore the original mobile header, animated drawer and WhatsApp placement. */
  html,body{max-width:100%;overflow-x:hidden!important}
  .site-header{z-index:20!important}
  .site-header .menu-toggle{position:relative!important;top:auto!important;right:auto!important;z-index:auto!important;display:grid!important;place-items:center!important}
  .site-header #main-nav.open{position:absolute!important;z-index:30!important;top:76px!important;left:0!important;right:0!important;width:auto!important;max-width:none!important;display:flex!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;transform:translateY(0) scale(1)!important;background:#fff!important}
  .whatsapp{position:fixed!important;z-index:15!important;right:20px!important;bottom:20px!important}
}

/* Revert to the approved layout before the inner-page frosted-title-bar experiment. */
body:not(.page-home) .site-header{position:fixed;top:0;left:0;right:0;width:auto;background:transparent;border-color:transparent;backdrop-filter:none;box-shadow:none}
body:not(.page-home) .site-header:not(.is-scrolled) .brand-word,body:not(.page-home) .site-header:not(.is-scrolled) .brand-subtitle,body:not(.page-home) .site-header:not(.is-scrolled) nav a{color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.38)}
body:not(.page-home) .site-header.is-scrolled{background:rgba(255,255,255,.94);border-color:rgba(7,85,170,.12);box-shadow:0 5px 18px rgba(12,57,100,.08)}
body:not(.page-home) main{padding-top:112px!important}
.page-hero{min-height:318px}.page-hero-copy{padding-top:135px}
.page-courses .courses .section-title .kicker,.page-courses .courses .section-title h2,.page-about .about-grid>div:first-child,.page-how .how-page .section-title,.page-contact .contact-grid>div>.kicker,.page-contact .contact-grid>div>h2{display:block}
.page-courses .courses .section-title{margin-bottom:45px}
@media(max-width:700px){body:not(.page-home) main{padding-top:76px!important}.page-hero{min-height:265px}.page-hero-copy{padding-top:115px}.page-courses .courses .section-title{margin-bottom:45px}}

@media(max-width:700px){html,body{overflow-x:clip!important;width:100%;max-width:100%}.site-header,.site-header .nav,main,.hero,.page-hero,footer{max-width:100%!important}}

@media(max-width:700px){
  .site-header .nav{position:relative!important}
  .site-header .menu-toggle{position:absolute!important;top:15px!important;right:14px!important;left:auto!important;z-index:31!important}
  .page-home .hero{padding-top:175px!important}
  .whatsapp{right:18px!important;bottom:-38px!important;transform:translateY(62px)!important}
}

/* Public Academy pages: the hero owns the page title, so the repeated white-section heading is omitted. */
.page-courses .courses .section-title h2,.page-about .about-grid h2,.page-how .how-page .section-title h2,.page-contact .contact-grid h2{display:none}

/* Restore the prior white-content heading layout. */
.page-courses .courses .section-title .kicker,.page-courses .courses .section-title h2,.page-how .how-page .section-title,.page-about .about-grid>div:first-child,.page-contact .contact-grid>div>.kicker,.page-contact .contact-grid>div>h2{display:block}.page-courses .courses .section-title{margin-bottom:45px}.page-about .about-grid{grid-template-columns:1fr 1fr}
@media(max-width:900px){.page-about .about-grid{grid-template-columns:1fr}}

/* Footer credit stays discreet, while the legal line never breaks in the middle. */
.footer-copyright{white-space:nowrap}.footer-credit{margin-top:7px!important;font-size:10px!important;letter-spacing:.01em;opacity:.82}.footer-credit a{white-space:nowrap}

/* The WhatsApp action remains visible above every fixed header, hero, and transition layer. */
.whatsapp{z-index:60!important;background:rgba(37,211,102,.18)!important;border-color:rgba(37,211,102,.78)!important}.whatsapp .whatsapp-mark{position:relative;z-index:2;filter:drop-shadow(0 1px 1px rgba(255,255,255,.35))}@media(max-width:700px){.site-header .nav{position:relative}.site-header .menu-toggle{position:absolute!important;z-index:42;top:15px;right:14px;display:grid!important;place-items:center}.whatsapp{right:15px!important;bottom:max(80px,calc(16px + env(safe-area-inset-bottom)))!important}}

/* Inner public pages only: content begins close to its hero, and the hero remains the sole title. */
.page-courses .courses,.page-about .about-page,.page-how .how-page,.page-contact .contact-page{padding-top:44px}.page-courses .courses .section-title h2,.page-about .about-grid h2,.page-how .how-page .section-title h2,.page-contact .contact-grid h2{display:none!important}
@media(max-width:700px){.page-courses .courses,.page-about .about-page,.page-how .how-page,.page-contact .contact-page{padding-top:32px}}

/* Keep the inner-hero titles clean; their section labels remain in the white content area. */
.page-courses .page-hero-copy .kicker,.page-about .page-hero-copy .kicker,.page-how .page-hero-copy .kicker,.page-contact .page-hero-copy .kicker{display:none}.page-about .about-page{padding-top:18px}
@media(max-width:700px){.page-about .about-page{padding-top:18px}}

/* About copy begins immediately after the hero instead of vertically centring in the spare page height. */
.page-about .about-page{align-items:flex-start;min-height:0!important;padding-top:18px!important}

/* Inner pages: header is transparent at the top and turns white only after scrolling. */
body.page-courses .site-header:not(.is-scrolled),body.page-about .site-header:not(.is-scrolled),body.page-how .site-header:not(.is-scrolled),body.page-contact .site-header:not(.is-scrolled){background:transparent!important;border-color:transparent!important;box-shadow:none!important;backdrop-filter:none!important}

/* The inner-page hero must sit directly beneath the transparent header. */
body:not(.page-home) main{padding-top:0!important}

/* Inner pages only: a shallow, shaded diagonal bevel carries the image into the page. */
body:not(.page-home) .page-hero::after{
  content:"";
  position:absolute;
  z-index:3;
  right:0;
  bottom:-1px;
  left:0;
  height:64px;
  pointer-events:none;
  background:#fff;
  transform:skewY(-.55deg);
  transform-origin:center;
}
body:not(.page-home) .page-hero::before{
  content:"";
  position:absolute;
  z-index:4;
  right:-2%;
  bottom:29px;
  left:-2%;
  height:24px;
  pointer-events:none;
  background:linear-gradient(to bottom,rgba(7,25,43,0) 0%,rgba(7,25,43,.82) 100%);
  transform:skewY(-.55deg);
  transform-origin:center;
}

/* The image itself finishes on the same shallow slant; no opaque layer covers the bevel. */
body:not(.page-home) .page-hero{clip-path:polygon(0 0,100% 0,100% calc(100% - 24px),0 100%)}
body:not(.page-home) .page-hero::after{display:none}
body:not(.page-home) .page-hero::before{right:-2%;bottom:5px;left:-2%;height:18px;transform:skewY(-.95deg)}
body:not(.page-home) .page-hero{min-height:370px}
@media(max-width:700px){body:not(.page-home) .page-hero{min-height:330px;clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),0 100%)}body:not(.page-home) .page-hero::before{bottom:3px;height:14px;transform:skewY(-.95deg)}}
body:not(.page-home) .page-hero-copy{z-index:4}
@media(max-width:700px){body:not(.page-home) .page-hero::after{height:52px}}

/* Keep the title and subtitle comfortably above the new gold edge. */
body:not(.page-home) .page-hero-copy{padding-top:145px}
@media(max-width:700px){body:not(.page-home) .page-hero-copy{padding-top:118px}}

body:not(.page-home) .page-hero{min-height:366px}
@media(max-width:700px){body:not(.page-home) .page-hero{min-height:340px}}

/* Inner-page images hold for four seconds, then crossfade for exactly two seconds. */
body:not(.page-home) .page-hero .training-slide{animation:inner-page-crossfade 48s linear infinite,training-ken-burns var(--hero-ken-burns,12s) ease-in-out infinite alternate}
body:not(.page-home) .page-hero .slide-one{animation-delay:0s,0s}
body:not(.page-home) .page-hero .slide-two{animation-delay:-6s,-2s}
body:not(.page-home) .page-hero .slide-three{animation-delay:-12s,-5s}
body:not(.page-home) .page-hero .slide-four{animation-delay:-18s,-8s}
body:not(.page-home) .page-hero .slide-five{animation-delay:-24s,-10s}
body:not(.page-home) .page-hero .slide-six{animation-delay:-30s,-12s}
body:not(.page-home) .page-hero .slide-seven{animation-delay:-36s,-14s}
body:not(.page-home) .page-hero .slide-eight{animation-delay:-42s,-16s}
@keyframes inner-page-crossfade{0%,8.333%{opacity:1}12.5%,95.833%{opacity:0}100%{opacity:1}}

/* Footer remains within the viewport at every width. */
.footer-copyright{white-space:normal!important;overflow-wrap:anywhere}
.footer-rights{white-space:nowrap}
.footer-meta{max-width:100%;overflow-wrap:anywhere}
.footer-credit{order:3}
.certificate-verify-link{display:inline-flex;align-items:center;gap:5px;margin-top:10px;color:#086fbb;font-size:12px;font-weight:800;text-decoration:none}.certificate-verify-link:hover{text-decoration:underline;color:#064f88}

/* Branded feedback dialog replaces browser-native alert boxes. */
.status-box{text-align:center;padding:35px 34px 30px}.status-box .close{top:10px}.status-icon{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 16px;border-radius:50%;background:#e9f8ef;color:#087a45;font:800 27px/1 Manrope,sans-serif;box-shadow:0 0 0 8px rgba(8,122,69,.08)}.status-icon.error{background:#fff0f0;color:#a33131;box-shadow:0 0 0 8px rgba(163,49,49,.07)}.status-box h2{margin:0;color:var(--navy);font:800 28px/1.15 Manrope,sans-serif}.status-box p{max-width:390px;margin:12px auto 23px;color:var(--muted);line-height:1.6}.status-box .btn{min-width:128px}.status-box .kicker{margin-bottom:10px}
@media(max-width:520px){.status-box{padding:31px 22px 25px}.status-box h2{font-size:24px}}

/* Mobile public navigation: a compact floating drawer with soft card edges. */
@media(max-width:700px){
  .site-header #main-nav.open{
    top:calc(100% + 8px)!important;
    left:12px!important;
    right:12px!important;
    width:auto!important;
    padding:10px!important;
    border:1px solid rgba(176,211,235,.82)!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.98)!important;
    box-shadow:0 18px 42px rgba(3,35,67,.22),0 3px 10px rgba(7,85,170,.08)!important;
    overflow:hidden!important;
  }
  .site-header #main-nav.open a{
    margin:1px 0!important;
    padding:11px 14px!important;
    border-radius:11px!important;
    color:var(--navy)!important;
    font-size:14px!important;
    transition:background-color .2s ease,color .2s ease,transform .2s ease!important;
  }
  .site-header #main-nav.open a:hover,
  .site-header #main-nav.open a:focus-visible{
    background:#edf7ff!important;
    color:var(--deep-blue)!important;
    transform:translateX(3px);
    outline:none;
  }
}

/* Performance: skip layout/paint work for sections that are below the first viewport. */
.courses,.testimonials,.cta,.how-page,.contact-page,.about-page{content-visibility:auto;contain-intrinsic-size:600px}

/* The browser already composites opacity/transform animations; avoid reserving a
   full GPU layer for every one of the eight high-resolution hero images. */
.training-slide{will-change:auto}
.training-slide.slide-one,.training-slide.slide-two{will-change:opacity,transform}

@media(prefers-reduced-motion:reduce){
  .courses,.testimonials,.cta,.how-page,.contact-page,.about-page{content-visibility:visible}
}

/* About page director profile and company registration details. */
.page-about .about-overview{max-width:920px}
.about-overview p{margin:0 0 17px;color:var(--muted)}
.page-about .about-director{width:100%;margin:clamp(34px,5vw,64px) 0 8px}
.director-profile-card{display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr);align-items:start;gap:clamp(26px,4.6vw,58px);padding:clamp(20px,3.7vw,42px);border:1px solid #d8e7f2;border-radius:24px;background:linear-gradient(145deg,#fff 0%,#fafdff 100%);box-shadow:0 18px 46px rgba(12,54,94,.08)}
.director-photo-wrap{position:relative;overflow:hidden;margin:0;border:1px solid rgba(8,119,201,.12);border-radius:19px;background:#f3f6fb;box-shadow:0 12px 28px rgba(8,46,98,.1)}
.director-photo{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;object-position:center 42%}
.director-profile-copy{min-width:0;padding-top:4px}
.director-profile-copy>.kicker{margin-bottom:11px}
.director-profile-copy h2{margin:0;color:var(--navy);font:800 clamp(29px,3.2vw,40px)/1.12 Manrope,sans-serif;letter-spacing:-.045em}
.director-role{margin:8px 0 23px;color:var(--blue);font-size:14px;font-weight:800}
.director-biography p{margin:0 0 15px;color:#526981;font-size:15px;line-height:1.78}
.director-registration{margin:23px 0 0;padding:0;border:0;border-radius:0;background:transparent;color:#526981;font:400 14px/1.7 'DM Sans',Arial,sans-serif;text-align:justify}
@media(max-width:900px){.director-profile-card{grid-template-columns:minmax(210px,.7fr) minmax(0,1.3fr);gap:24px;padding:22px}.director-biography p{font-size:14px}}
@media(max-width:700px){.page-about .about-director{margin-top:30px}.director-profile-card{grid-template-columns:1fr;gap:22px;padding:17px;border-radius:19px}.director-photo-wrap{width:min(100%,390px);margin-inline:auto}.director-photo{aspect-ratio:1/1}.director-profile-copy{padding:0 2px 2px}.director-profile-copy h2{font-size:clamp(27px,8vw,34px)}.director-role{margin:8px 0 18px}.director-biography p{font-size:14px;line-height:1.72}.director-registration{margin-top:19px;font-size:14px}}
@media(max-width:380px){.director-profile-card{padding:13px}.director-registration{padding:12px}}

/* Readable paragraph alignment and plain legal registration details on About. */
.page-about .about-overview p,.page-about .director-biography p,.page-about .director-registration{text-align:justify;text-justify:inter-word}
.page-about .director-registration{padding:0!important;border:0!important;border-radius:0!important;background:none!important;font-weight:400!important}

/* Inner-page hero image finishes on a straight horizontal edge. */
body:not(.page-home) .page-hero{clip-path:none!important}
body:not(.page-home) .page-hero::before,body:not(.page-home) .page-hero::after{display:none!important;content:none!important}

/* Testimonials move as a horizontal carousel on desktop as well as mobile. */
.testimonial-carousel-window{width:100%;overflow:hidden}
.testimonial-grid{display:flex!important;flex-wrap:nowrap;align-items:stretch;gap:17px;width:100%;will-change:transform}
.testimonial-grid.testimonial-track-moving{transition:transform 680ms cubic-bezier(.22,.8,.24,1)}
.testimonial{flex:0 0 calc((100% - 34px)/3);grid-column:auto;min-width:0}
@media(max-width:900px){.testimonial{flex-basis:calc((100% - 17px)/2)}}
@media(max-width:620px){.testimonial-grid{gap:0!important}.testimonial{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.testimonial-carousel-window{overflow-x:auto}.testimonial-grid{transform:none!important;will-change:auto}.testimonial-grid.testimonial-track-moving{transition:none}}
.page-home .home-how{display:block;min-height:0;padding-top:84px;padding-bottom:84px;scroll-margin-top:86px}
@media(max-width:700px){.page-home .home-how{padding-top:58px;padding-bottom:58px;scroll-margin-top:72px}}

/* About-page copy is intentionally editorial and left aligned. */
.page-about .about-overview p,
.page-about .director-biography p,
.page-about .director-registration{
  text-align:left;
  text-justify:auto;
}