/* Fluid layouts and mobile-first reading, layered over the campaign design. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{min-width:0}
main,section,article,figure,.profile-description,.institute-description{min-width:0}
h1,h2,h3,h4,p,li,summary{overflow-wrap:break-word}
img{max-width:100%}
.button{max-width:100%;min-height:48px;white-space:normal;text-align:center}
.button>span{flex:0 0 auto}
.institute-heading,.profile-heading,.section-heading,.testimonials-heading{margin-left:auto;margin-right:auto;text-align:center}
.institute-heading h2,.profile-heading h2{margin-inline:auto}
.faq-section>h2{text-align:center}
.faq-list{margin-inline:auto}
.testimonial-cards{align-items:stretch}
.testimonial-card{text-align:center}
.review-quote{margin-inline:auto}
.review-more summary{min-height:44px;justify-content:center;gap:12px}
.carousel-arrow,.carousel-pause{width:44px;height:44px;flex:0 0 44px}
.campaign-dot{position:relative;width:44px;height:44px;flex:0 0 44px;background:transparent;border-radius:0}
.campaign-dot.is-active{width:44px;background:transparent}
.campaign-dot:after{content:"";position:absolute;top:18px;left:18px;width:8px;height:8px;background:#6e91a9;border-radius:8px}
.campaign-dot.is-active:after{left:10px;width:24px;background:var(--orange)}
.campaign-controls{gap:2px}
:focus-visible{outline-offset:3px}
dialog{max-height:calc(100dvh - 32px);overflow-y:auto;text-align:center}
.dialog-summary{overflow-wrap:anywhere}
.dialog-close{width:44px;height:44px}
@media(min-width:701px) and (max-width:1100px){
 .campaign-slide{height:auto;min-height:480px;display:grid;grid-template-columns:52% 48%;align-items:center;padding:25px 28px}
 .campaign-copy,.person-right .campaign-copy,.person-left .campaign-copy{grid-row:1;grid-column:1;width:auto;padding:0;margin:0;align-items:center;text-align:center}
 .person-left .campaign-copy{grid-column:2}
 .campaign-photo,.person-right .campaign-photo,.person-left .campaign-photo{position:relative;grid-column:2;grid-row:1;width:100%;height:430px;left:auto;right:auto;bottom:auto}
 .person-left .campaign-photo{grid-column:1}
 .campaign-copy h1,.person-right .campaign-copy h1{font-size:clamp(27px,3.3vw,36px);letter-spacing:-1px}
 .campaign-copy .black-label{font-size:19px}
 .campaign-combo{font-size:18px}
 .campaign-pack{font-size:14px;line-height:1.6;max-width:340px}
 .campaign-price,.person-right .campaign-price{width:auto;justify-content:center;gap:6px}
 .campaign-price>strong,.person-right .campaign-price>strong{font-size:82px;letter-spacing:-4px}
 .campaign-price sup,.person-right .campaign-price sup{font-size:38px;letter-spacing:-2px}
 .campaign-copy .purchase-button{font-size:14px;min-width:0;width:100%;max-width:330px;gap:10px;padding-inline:15px;justify-content:center}
 .campaign-photo>p,.person-left .campaign-photo>p{font-size:12px;max-width:100%;white-space:normal;bottom:0}
}
@media(max-width:900px){
 .wrap{width:calc(100% - 40px);max-width:680px}
 .header-content{max-width:100%;gap:16px;min-height:82px}
 .header-content nav{display:none}
 .header-cta{font-size:12px;min-height:44px;padding:10px 14px}
 .header-content .brand,.footer-content .brand{width:170px;height:59px}
 .header-content .brand-logo-window,.footer-content .brand-logo-window{width:170px;height:59px}
 .header-content .brand-logo-window img,.footer-content .brand-logo-window img{width:453px;max-width:none;left:-141px;top:-64px}
 .institute-section,.specialists-section,.curriculum-section,.testimonials-section,.faq-section{padding-block:52px}
 .institute-heading,.profile-heading,.section-heading,.testimonials-heading{margin-bottom:28px;max-width:640px}
 .institute-heading h2,.profile-heading h2,.section-heading h2,.testimonials-heading h2,.final-offer h2,.faq-section h2{font-size:clamp(27px,4.5vw,35px);line-height:1.25;letter-spacing:-.7px}
 .section-label{font-size:11px;line-height:1.7;letter-spacing:.6px}
 .institute-presentation{grid-template-columns:minmax(0,1fr);gap:26px}
 .team-photo{text-align:center;width:100%;max-width:640px;margin-inline:auto}
 .team-photo img{width:100%;height:auto;aspect-ratio:1.5;max-height:none;object-position:center}
 .team-photo figcaption{font-size:12px;line-height:1.7}
 .institute-description{text-align:center;max-width:610px;margin-inline:auto}
 .institute-description p{font-size:16px;line-height:1.85}
 .institute-description .button{font-size:14px;justify-content:center;gap:12px;width:100%;max-width:420px}
 .professor-profiles{gap:26px}
 .professor-profile,.professor-profile.profile-reverse{display:flex;flex-direction:column;align-items:center;gap:26px;padding:24px;text-align:center}
 .profile-photo,.profile-reverse .profile-photo{order:0;width:100%;max-width:390px;height:auto;aspect-ratio:4/4.3}
 .profile-description{padding:0;max-width:540px}
 .profile-description h3{font-size:28px;line-height:1.25;letter-spacing:-.6px}
 .profile-description>p{font-size:16px;line-height:1.85}
 .profile-description .specialty{font-size:12px!important}
 .profile-description h4{font-size:16px;margin-top:24px}
 .profile-description .button{font-size:14px;gap:12px;justify-content:center;width:100%;max-width:420px}
 .content-options{grid-template-columns:minmax(0,1fr);gap:26px}
 .course-detail{text-align:center;padding:28px}
 .course-detail>h3{font-size:28px;line-height:1.25}
 .course-detail>p,.course-detail .course-benefit{font-size:16px!important;line-height:1.8!important}
 .course-detail>h4{font-size:18px;margin-block:26px 18px}
 .course-detail ul{gap:14px}
 .course-detail li,.included-pack .curriculum li{padding-left:0;font-size:15px;line-height:1.8}
 .course-detail li:before{content:none}
 .curriculum summary,.included-pack .curriculum summary{font-size:14px;min-height:48px;padding:14px 15px;gap:10px;display:grid;grid-template-columns:minmax(0,1fr) 20px}
 .curriculum summary>span{font-size:24px;text-align:center}
 .included-pack{padding:22px;margin-block:24px}
 .included-pack h4{font-size:21px;line-height:1.4}
 .included-pack>p{font-size:15px;line-height:1.8}
 .pack-label{font-size:11px}
 .course-decision{flex-direction:column;justify-content:center;gap:10px;margin-block:24px 18px}
 .course-decision>p{font-size:14px;line-height:1.7}
 .course-decision>p>span{font-size:12px}
 .course-decision>strong{font-size:34px;line-height:1.3}
 .course-detail>.purchase-button{font-size:14px;min-height:52px;justify-content:center;gap:12px;padding:14px 16px}
 .testimonials-heading>p:last-child{font-size:16px;line-height:1.8}
 .testimonial-cards{grid-template-columns:minmax(0,1fr);gap:20px}
 .testimonial-card{min-height:0;padding:28px}
 .testimonial-card .review-context{font-size:11px;min-height:0;line-height:1.7}
 .testimonials-section .testimonial-card blockquote,.testimonial-card .review-more>p{font-size:16px;line-height:1.85}
 .review-more summary{font-size:14px;gap:14px}
 .testimonial-card .review-author{font-size:16px;margin-top:20px}
 .final-offer{padding-block:48px}
 .final-offer p{font-size:16px;line-height:1.85}
 .final-actions{flex-direction:column;gap:14px}
 .final-actions .button{font-size:14px;justify-content:center;gap:12px;width:100%;max-width:440px;min-height:52px}
 .faq-list{gap:14px;width:100%}
 .faq-list details{padding-inline:20px;text-align:center}
 .faq-list summary{font-size:15px;display:grid;grid-template-columns:minmax(0,1fr) 20px;gap:12px}
 .faq-list details p{font-size:15px;line-height:1.85}
 .footer-content{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:18px;padding-block:28px}
 .footer-content>p,.footer-content>a:last-child{font-size:13px;width:auto}
 dialog{padding:34px 22px 24px}
 dialog h2{font-size:25px;line-height:1.3;padding:0}
 .dialog-summary>span,.pending-copy{font-size:15px;line-height:1.8}
 .dialog-return{font-size:14px;gap:12px}
}
.campaign-offer-info {
  display: contents;
}

.campaign-frame {
  touch-action: pan-y pinch-zoom;
}

@media (max-width: 700px), (hover: none) and (pointer: coarse) {
  .campaign-controls {
    display: none;
  }

  .campaign-note {
    margin: 12px auto 0;
  }
}

@media (max-width: 700px) {
  .campaign-section {
    padding: 12px 10px 20px;
  }

  .campaign-frame {
    display: grid;
    max-width: 540px;
    border-radius: 16px;
  }

  .campaign-frame .campaign-slide {
    grid-area: 1 / 1;
    display: grid;
    grid-template-columns: minmax(0, .44fr) minmax(0, .56fr);
    grid-template-rows: auto auto auto auto 1fr auto;
    align-items: center;
    column-gap: 8px;
    row-gap: 9px;
    height: auto;
    min-height: 0;
    padding: clamp(15px, 4.3vw, 26px);
    background: radial-gradient(ellipse at 85% 75%, #155c85, #002b46 72%);
  }

  /* Keep the frame stable as the two offers rotate. */
  .campaign-frame .campaign-slide[hidden] {
    display: grid !important;
    visibility: hidden;
    pointer-events: none;
  }

  .campaign-slide:before {
    display: none;
  }

  .campaign-copy,
  .person-right .campaign-copy,
  .person-left .campaign-copy {
    display: contents;
  }

  .campaign-copy .black-label,
  .campaign-copy h1,
  .campaign-combo {
    grid-column: 1 / -1;
    margin: 0;
    text-align: center;
  }

  .campaign-copy .black-label {
    grid-row: 1;
    font-size: clamp(15px, 4.3vw, 21px);
    line-height: 1.25;
  }

  .campaign-copy h1 {
    grid-row: 2;
    min-height: 0;
    max-width: 100%;
    font-size: clamp(22px, 6.2vw, 32px);
    line-height: 1.1;
    letter-spacing: -.035em;
  }

  .campaign-copy h1 br,
  .campaign-copy h1 > span:before {
    display: none;
  }

  .campaign-copy h1 > span {
    display: block;
    margin-top: 4px;
    font-size: .72em;
  }

  .campaign-combo {
    grid-row: 3;
    font-size: clamp(13px, 3.8vw, 18px);
    line-height: 1.3;
  }

  .campaign-offer-info {
    display: contents;
  }

  .campaign-pack {
    grid-area: 4 / 1 / 5 / -1;
    margin: 0 auto;
    max-width: 37ch;
    min-height: 0;
    font-size: clamp(13px, 3.5vw, 16px);
    line-height: 1.45;
    text-align: center;
    text-wrap: pretty;
  }

  .campaign-price,
  .person-right .campaign-price {
    grid-area: 5 / 1;
    display: grid;
    grid-template-columns: auto auto;
    justify-content: center;
    align-items: start;
    gap: 1px 3px;
    width: auto;
    margin: 0;
    text-align: center;
  }

  .campaign-price > span {
    grid-column: 1 / -1;
    align-self: auto;
    padding: 0;
    font-size: 10px;
    line-height: 1.2;
  }

  .campaign-price > small {
    grid-column: 1;
    grid-row: 2;
    align-self: start;
    padding-top: 6px;
    font-size: clamp(12px, 3.6vw, 16px);
    line-height: 1;
  }

  .campaign-price > strong,
  .person-right .campaign-price > strong {
    grid-column: 2;
    grid-row: 2;
    font-size: clamp(41px, 13.6vw, 72px);
    line-height: 1;
    letter-spacing: -.065em;
    white-space: nowrap;
  }

  .campaign-price sup,
  .person-right .campaign-price sup {
    font-size: .47em;
    letter-spacing: -.04em;
    top: 3px;
  }

  .campaign-frame .campaign-slide .campaign-photo {
    grid-area: 5 / 2;
    position: relative;
    inset: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    align-self: end;
    width: 100%;
    height: clamp(190px, 55vw, 270px);
    margin: 0;
    pointer-events: none;
  }

  .campaign-frame .campaign-slide .campaign-photo img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center bottom;
    filter: none;
    -webkit-mask-image: linear-gradient(to bottom, #000 0 74%, transparent 99%);
    mask-image: linear-gradient(to bottom, #000 0 74%, transparent 99%);
  }

  .campaign-photo:before {
    display: none;
  }

  .campaign-frame .campaign-slide .campaign-photo > p {
    position: absolute;
    inset: auto 0 0;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0 2px;
    background: none;
    overflow: visible;
    white-space: normal;
    text-align: center;
    font-size: clamp(10px, 2.8vw, 13px);
    line-height: 1.25;
  }

  .campaign-copy .purchase-button {
    position: relative;
    grid-area: 6 / 1 / 7 / -1;
    inset: auto;
    min-width: 0;
    width: 100%;
    max-width: none;
    min-height: 48px;
    margin: 4px 0 0;
    padding: 11px 12px;
    gap: 8px;
    justify-content: center;
    font-size: clamp(12px, 3.6vw, 15px);
    z-index: 4;
  }

  .campaign-note {
    max-width: 460px;
    padding-inline: 6px;
    font-size: 12px;
    line-height: 1.65;
  }
}
@media(max-width:400px){
 .wrap{width:calc(100% - 32px)}
 .header-content{gap:10px;min-height:78px}
 .header-content .brand{width:148px;height:52px}
 .header-content .brand-logo-window{width:148px;height:52px}
 .header-content .brand-logo-window img{width:395px;left:-123px;top:-56px}
 .header-cta{font-size:11px;padding:9px 12px;max-width:145px;white-space:normal}
 .campaign-section{padding-inline:10px}
 .institute-section,.specialists-section,.curriculum-section,.testimonials-section,.faq-section{padding-block:44px}
 .professor-profile,.professor-profile.profile-reverse,.course-detail,.testimonial-card{padding:20px}
 .profile-description h3,.course-detail>h3{font-size:25px}
 .profile-description>p,.institute-description p{font-size:15px}
 .included-pack{padding:16px}
 .included-pack h4{font-size:19px}
 .curriculum summary,.included-pack .curriculum summary{font-size:13px;padding:13px 11px}
 .institute-description .button,.profile-description .button,.course-detail>.purchase-button,.final-actions .button{font-size:13px;gap:8px;padding-inline:12px}
 .testimonials-section .testimonial-card blockquote,.testimonial-card .review-more>p{font-size:15px}
 .faq-list details{padding-inline:16px}
}
@media(prefers-reduced-motion:reduce){.campaign-dot:after{transition:none}}
