.hero-copy{padding-block:clamp(49px,6vw,92px) clamp(38px,4.1vw,58px)}
.hero h1{font-size:clamp(3.15rem,5.45vw,6.1rem);line-height:.96;max-width:100%}
.hero-slogan{display:block}
.hero-keyword{display:block;font-size:1.63em;line-height:.79;letter-spacing:-.073em;margin-top:.07em;color:var(--ivory)}
.hero-keyword>span{color:var(--warm)}
.hero-copy>p:not(.eyebrow){max-width:43ch;margin-top:23px}
.hero-coordinate{margin-top:clamp(27px,3.2vw,54px)}

.hero-entry{display:none;position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none}
.entry-panel{position:absolute;inset-block:0;width:50.2%;background:var(--petrol)}
.entry-panel::after{content:"";position:absolute;inset:clamp(12px,2.05vw,32px);border:1px solid #c0e2e938}
.entry-left{left:0;background:#223d4e;border-right:1px solid #c0e2e969}
.entry-right{right:0}
.entry-emblem{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:11px;color:var(--blue)}
.entry-emblem svg{width:clamp(63px,8.5vw,130px)}
.entry-emblem span{font:760 .64rem/1.3 var(--ui);letter-spacing:.24em}
@media(prefers-reduced-motion:no-preference){
  .hero-opening .hero-entry{display:block;animation:opening-end .92s step-end forwards}
  .hero-opening .entry-left{animation:opening-left .86s cubic-bezier(.75,.05,.24,1) both}
  .hero-opening .entry-right{animation:opening-right .86s cubic-bezier(.75,.05,.24,1) both}
  .hero-opening .entry-emblem{animation:opening-emblem .6s ease-out both}
  .hero-opening .hero h1{animation-delay:.31s}
  .hero-opening .hero-copy>p:not(.eyebrow){animation-delay:.36s}
  .hero-opening .hero .actions{animation-delay:.42s}
}
@keyframes opening-left{0%,18%{transform:translateX(0)}100%{transform:translateX(-102%)}}
@keyframes opening-right{0%,18%{transform:translateX(0)}100%{transform:translateX(102%)}}
@keyframes opening-emblem{0%,23%{opacity:1;scale:1}100%{opacity:0;scale:1.1}}
@keyframes opening-end{to{visibility:hidden}}
.hero:focus-within .hero-entry{display:none}

.home-habits{background:var(--pale)}
.home-habits .section-heading{grid-template-columns:minmax(0,1.46fr) minmax(0,1fr)}
.home-habits .habit-tabs{margin-bottom:0}
.home-habits .habit-tab[aria-selected="true"]{background:var(--petrol);color:var(--ivory)}
.home-habits .habit-tab[aria-selected="true"] span,.home-habits .habit-tab[aria-selected="true"]:focus-visible{color:var(--blue);outline-color:var(--blue)}
.home-habits .habit-tab[aria-selected="true"]::after{background:var(--warm)}
.home-habits .habit-panel{
  position:relative;isolation:isolate;overflow:hidden;min-height:clamp(420px,39vw,560px);margin-bottom:0;
  display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);align-items:center;background:#203b4b;color:var(--ivory)
}
.home-habits .habit-words{position:relative;min-width:0;padding:clamp(24px,4vw,66px);z-index:1}
.home-habits .habit-words h3{font-size:clamp(2.25rem,4.45vw,5.25rem);color:var(--ivory)}
.home-habits .habit-refrain{color:var(--blue);font-size:.62em;margin-top:.16em}
.home-habits .habit-words>p{color:var(--ivory);line-height:1.65}
.home-habits .small-step{border-left:2px solid var(--warm);color:var(--ivory);background:#172d3bb8;padding:10px 11px 10px 13px;max-width:41ch}
.home-habits .small-step span{color:var(--blue)}
.home-habits .text-link{color:var(--ivory);border-color:var(--blue)}
.home-habits .text-link:hover{color:var(--blue);border-color:transparent}
.home-habits .habit-picture{
  position:absolute;inset:0 0 0 30%;min-height:0;z-index:0;background:var(--petrol);
}
.home-habits .habit-picture::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,#203b4b 0%,#203b4bdc 17%,#203b4b69 44%,transparent 76%)
}
.home-habits .habit-picture img{object-position:62% center}
.home-habits .habit-graphic{
  place-items:center end;padding:22px clamp(22px,6vw,100px) 22px 0;
  background:radial-gradient(ellipse at 73% 52%,#49868a8a,var(--petrol) 74%)
}
.home-habits .habit-graphic .portals{width:min(73%,540px);max-height:86%}
.home-habits .habit-number{z-index:1}
.home-habits .habit-panel :focus-visible{outline-color:var(--blue)}

.home-course-board{background:var(--petrol)}
.home-course-board .home-course-inner{grid-template-columns:minmax(0,.98fr) minmax(0,1.02fr);align-items:center;gap:var(--column-space)}
.home-course-board .home-course-inner>div:first-child{padding:clamp(31px,4.4vw,62px) 0}
.home-course-board .eyebrow{color:var(--blue);margin-bottom:13px}
.home-course-board h2{max-width:none;font-size:clamp(2.2rem,4.15vw,4.8rem)}
.home-course-types{margin:24px 0;padding:0;list-style:none;border-top:1px solid #c0e2e97a}
.home-course-types li{display:grid;grid-template-columns:2.35rem minmax(0,1fr);gap:12px;align-items:baseline;padding:15px 0;border-bottom:1px solid #c0e2e97a}
.home-course-types li>span{color:var(--blue);font:750 .69rem var(--ui);letter-spacing:.1em}
.home-course-types strong{font:480 clamp(1.34rem,2.1vw,2.3rem)/1.13 var(--serif);letter-spacing:-.023em;overflow-wrap:anywhere}
.home-course-types li p:not(.eyebrow){font-size:.86rem;margin:5px 0 0}

@media(max-width:1050px){
  .hero h1{font-size:clamp(3.05rem,5.95vw,5.6rem)}
}
@media(max-width:820px){
  .hero-copy{padding:36px 0 24px}
  .hero h1{font-size:clamp(2.36rem,7.7vw,4.7rem)}
  .hero-keyword{font-size:1.47em}
  .hero-copy>p:not(.eyebrow){margin-top:16px}
  .hero-coordinate{margin-top:21px}
  .home-habits .section-heading,.home-course-board .home-course-inner{grid-template-columns:minmax(0,1fr)}
  .home-habits .habit-panel{display:grid;grid-template-columns:minmax(0,1fr);align-items:stretch;min-height:0}
  .home-habits .habit-picture{position:relative;inset:auto;grid-row:1;min-height:clamp(155px,49vw,345px)}
  .home-habits .habit-picture::after{background:linear-gradient(0deg,#203b4bc0,transparent 50%)}
  .home-habits .habit-graphic{place-items:center;padding:0}
  .home-habits .habit-graphic .portals{width:auto;height:100%;max-height:clamp(130px,37vw,270px)}
  .home-habits .habit-words{padding:24px}
  .home-habits .habit-words h3{font-size:clamp(2.03rem,6.9vw,3.65rem)}
  .home-habits .habit-refrain{font-size:.68em}
  .home-course-board .home-course-inner{gap:0}
  .home-course-board .home-course-inner>div:first-child{padding-block:34px 10px}
  .home-course-types{margin:15px 0 33px}
}
@media(max-width:520px){
  .hero h1{font-size:clamp(2rem,11.05vw,3.3rem)}
  .hero-slogan,.hero-keyword{display:inline}
  .hero-slogan br{display:none}
  .hero-keyword{font-size:1em;line-height:inherit;letter-spacing:inherit}
  .home-habits .habit-words{padding:19px}
}
