/* ============================================================
 Talk the Talk English - custom styles
 Tailwind utilities cover the base; this file adds the
 brand-specific components, transitions and motifs.
 ============================================================ */

:root {
 --cobalt: #0A3DFF;
 --fuchsia: #D81B72;
 --teal: #0097A7;
 --ink: #0A0A0A;
 --charcoal: #1F1F23;
 --cool: #F2F4F8;
 --icy: #C7D8FF;
}

html { scroll-behavior: smooth; }
body { font-feature-settings: "ss01", "cv11"; }

/* Selection */
::selection { background: var(--cobalt); color: #fff; }

/* ---------- Header ---------- */
#site-header {
 background: #F2F4F8;
 backdrop-filter: none;
 -webkit-backdrop-filter: none;
 border-bottom: 1px solid transparent;
 color: var(--ink);
 padding-top: 18px;
 padding-bottom: 18px;
}
#site-header.scrolled {
 background: #F2F4F8;
 border-bottom-color: var(--icy);
 box-shadow: none;
 color: var(--ink);
}

#site-header > .max-w-7xl {
 height: auto;
 min-height: 46px;
 justify-content: flex-start;
}

#site-header + main {
 padding-top: 82px !important;
}

#site-header nav.hidden.lg\:flex {
 gap: 1.75rem;
 margin-left: clamp(2rem, 4vw, 4.5rem);
}

#site-header > .max-w-7xl > .flex.items-center.gap-3 {
 margin-left: auto;
}

@media (min-width: 1024px) {
 #site-header > .max-w-7xl {
 height: auto;
 min-height: 46px;
 }

 #site-header + main {
 padding-top: 82px !important;
 }
}

.nav-link {
 position: relative;
 padding-bottom: 4px;
}
.nav-link::after {
 content: "";
 position: absolute;
 left: 0; right: 0; bottom: 0;
 height: 2px;
 background: var(--cobalt);
 transform: scaleX(0);
 transform-origin: left center;
 transition: transform .25s ease;
}
.nav-link:hover::after,
.nav-link.active::after { transform: scaleX(1); }

/* ---------- Reusable logo block ---------- */
.brand-logo {
 display: inline-block;
 min-width: 0;
 color: var(--ink);
 text-decoration: none;
 white-space: nowrap;
}

.brand-logo__text {
 display: inline-flex;
 flex-direction: column;
 align-items: center;
 min-width: 0;
 line-height: 1;
}

.brand-logo__main {
 display: block;
 font-family: "Bebas Neue", sans-serif;
 font-size: 26px;
 line-height: 0.9;
 letter-spacing: 0.03em;
 color: #0A0A0A;
}

.brand-logo__sub {
 display: block;
 margin-top: 5px;
 font-family: "Sora", sans-serif;
 font-size: 8px;
 font-weight: 700;
 letter-spacing: 0.28em;
 color: #0A3DFF;
 line-height: 1;
 text-align: center;
}

.brand-logo--header .brand-logo__main {
 font-size: 34px;
}

.brand-logo--header .brand-logo__sub {
 margin-top: 6px;
 font-size: 9px;
}

.footer .brand-logo,
.brand-logo--footer {
 display: inline-block;
}

.footer .brand-logo__main,
.brand-logo--footer .brand-logo__main {
 font-family: "Bebas Neue", sans-serif;
 font-size: 26px;
 line-height: 0.9;
 letter-spacing: 0.03em;
 color: #F2F4F8;
}

.footer .brand-logo__sub,
.brand-logo--footer .brand-logo__sub {
 margin-top: 5px;
 font-family: "Sora", sans-serif;
 font-size: 8px;
 font-weight: 700;
 letter-spacing: 0.28em;
 color: #3D63FF;
 line-height: 1;
 text-align: center;
}

@media (max-width: 639px) {
 .brand-logo__main {
 font-size: 22px;
 }

 .brand-logo__sub {
 margin-top: 5px;
 font-size: 7px;
 letter-spacing: 0.24em;
 }

 .brand-logo--header .brand-logo__main {
 font-size: 28px;
 }

 .brand-logo--header .brand-logo__sub {
 margin-top: 5px;
 font-size: 7px;
 }

 .footer .brand-logo,
 .brand-logo--footer {
 display: inline-block;
 }

 .footer .brand-logo__main,
 .brand-logo--footer .brand-logo__main {
 font-size: 22px;
 }

 .footer .brand-logo__sub,
 .brand-logo--footer .brand-logo__sub {
 font-size: 7px;
 }
}

.mobile-link {
 display: block;
 padding: 12px 4px;
 color: var(--charcoal);
 border-bottom: 1px solid var(--icy);
}
.mobile-link:last-child { border-bottom: 0; }

/* ---------- Rebranded hero ---------- */
.hero-rebrand {
 min-height: calc(100svh - 76px);
 background:
 radial-gradient(circle at 92% 30%, rgba(10, 61, 255, 0.20) 0 15%, transparent 16%),
 radial-gradient(circle at 0% 72%, rgba(10, 61, 255, 0.18) 0 11%, transparent 12%),
 linear-gradient(135deg, #050505 0%, #0a0a0a 54%, #101116 100%);
 color: #fff;
}
.hero-rebrand > .max-w-7xl {
 padding-top: 88px;
}
.hero-rebrand .grid {
 align-items: flex-start;
}
.hero-dot-field {
 position: absolute;
 top: 120px;
 left: 26px;
 width: 150px;
 height: 150px;
 opacity: .42;
 background-image: radial-gradient(rgba(255,255,255,.92) 1.4px, transparent 1.5px);
 background-size: 11px 11px;
 mask-image: radial-gradient(circle, #000 0 55%, transparent 72%);
}
.hero-dot-field-right {
 top: 118px;
 left: auto;
 right: 7%;
 width: 170px;
 height: 170px;
 opacity: .34;
 background-image: radial-gradient(rgba(255,255,255,.95) 1.2px, transparent 1.4px);
 background-size: 12px 12px;
 mask-image: linear-gradient(135deg, transparent 0 12%, #000 28% 72%, transparent 92%);
}
.hero-square {
 position: absolute;
 right: 38%;
 top: 42%;
 width: 48px;
 height: 48px;
 border: 2px solid var(--teal);
 border-radius: 10px;
 transform: rotate(14deg);
 opacity: .42;
}
.hero-badge {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 padding: 8px 15px;
 border: 1px solid rgba(199,216,255,.55);
 border-radius: 999px;
 color: rgba(255,255,255,.86);
 font-size: 12px;
 letter-spacing: .16em;
 text-transform: uppercase;
}
.hero-badge span {
 width: 9px;
 height: 9px;
 border-radius: 999px;
 background: var(--cobalt);
 box-shadow: 0 0 0 3px rgba(0,151,167,.14);
}
.hero-title {
 font-family: "Bebas Neue", system-ui, sans-serif;
 font-size: clamp(58px, 5.85vw, 96px);
 line-height: 1.01;
 color: #fff;
 letter-spacing: 0;
 text-transform: uppercase;
 max-width: 780px;
 text-shadow: 0 0 16px rgba(255,255,255,.14);
}
.hero-title span {
 display: block;
}
.hero-title em {
 color: var(--cobalt);
 font-style: normal;
 text-shadow: 0 0 18px rgba(0,151,167,.18);
}
.hero-sub {
 color: rgba(255,255,255,.72);
 max-width: 680px;
 font-size: clamp(18px, 1.55vw, 23px);
 line-height: 1.55;
}
.hero-primary,
.hero-secondary {
 min-height: 52px;
 width: 320px;
}
.hero-secondary {
 color: var(--cobalt);
 border-color: var(--cobalt);
}
.hero-secondary:hover {
 border-color: var(--cobalt);
}
.hero-cta-stack {
 align-items: center;
 flex-direction: column;
 gap: 3px;
 justify-content: center;
 line-height: 1.15;
 min-height: 68px;
 padding-bottom: 10px;
 padding-top: 10px;
 text-align: center;
}
.hero-cta-stack span {
 display: block;
 font-size: 0.92rem;
 line-height: 1.2;
 max-width: 100%;
}
.hero-cta-stack small {
 display: block;
 font-size: 0.72rem;
 font-weight: 500;
 line-height: 1.25;
 max-width: 100%;
 opacity: .76;
}
.homepage-cta-band {
 padding: 28px 24px;
}
.homepage-cta-inner {
 margin-inline: auto;
 max-width: 80rem;
}
.homepage-cta-actions {
 display: flex;
 flex-wrap: wrap;
 gap: 16px;
 justify-content: center;
 width: 100%;
}
.homepage-cta-actions .hero-primary,
.homepage-cta-actions .hero-secondary {
 flex: 1 1 0;
 width: 100%;
}
.about-copy .homepage-cta-band {
 padding: 28px 0;
}
.about-copy .homepage-cta-inner {
 margin-inline: 0;
}
.story-button {
 background: #fff;
 border: 0;
 color: #0A0A0A;
}
.story-button:hover {
 background: #0A0A0A;
 color: #fff;
}
.hero-portrait-wrap {
 position: relative;
 min-height: auto;
 display: flex;
 flex-direction: column;
 align-items: center;
 padding-top: 54px;
}
.hero-portrait-ring {
 position: relative;
 margin-left: 0;
 transform: translateX(-260px);
 width: min(340px, 82vw);
 aspect-ratio: 1;
 border-radius: 999px;
 border: 2px solid var(--cobalt);
 box-shadow: 0 0 0 16px rgba(199,216,255,.14), 0 30px 80px rgba(10,61,255,.24);
 overflow: hidden;
 background: var(--ink);
 z-index: 2;
}
.hero-portrait-img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: 50% 18%;
 filter: contrast(1.04) saturate(.96) brightness(.92);
}
.hero-signature {
 position: relative;
 right: auto;
 bottom: auto;
 transform: translateX(-242px);
 margin-top: 22px;
 z-index: 4;
 display: flex;
 align-items: center;
 gap: 14px;
 padding: 0;
 border: 0;
 border-radius: 0;
 background: transparent;
 box-shadow: none;
 backdrop-filter: none;
}
.hero-signature span {
 font-family: "Bebas Neue", system-ui, sans-serif;
 color: #fff;
 font-weight: 400;
 font-size: 42px;
 line-height: .9;
 letter-spacing: 0;
}
.hero-signature i {
 display: block;
 width: 2px;
 height: 46px;
 background: rgba(255,255,255,.86);
}
.hero-signature small {
 color: rgba(255,255,255,.9);
 font-size: 14px;
 line-height: 1.25;
 white-space: nowrap;
}
.hero-stairs {
 position: absolute;
 right: 12px;
 bottom: 10px;
 width: 180px;
 height: 118px;
 border-radius: 999px 0 0 999px;
 border-left: 12px solid rgba(255,255,255,.24);
 border-top: 12px solid rgba(255,255,255,.42);
 transform: rotate(-12deg);
 opacity: .5;
 z-index: 1;
 pointer-events: none;
}
.hero-stairs::after {
 content: "";
 position: absolute;
 right: 10px;
 bottom: 18px;
 width: 116px;
 height: 64px;
 background: repeating-linear-gradient(0deg, rgba(255,255,255,.52) 0 3px, transparent 3px 12px);
 transform: skewX(-16deg);
 opacity: .65;
}
.hero-info-strip {
 position: absolute;
 top: 148px;
 right: -232px;
 z-index: 5;
 width: min(455px, 100%);
 margin: 0 !important;
 background: transparent;
 backdrop-filter: none;
 border-top: 1px solid rgba(255,255,255,.16);
 border-bottom: 1px solid rgba(255,255,255,.16);
 display: grid;
 grid-template-columns: 1fr;
}
.hero-info-item {
 display: grid;
 grid-template-columns: 40px minmax(0, 1fr);
 gap: 16px;
 align-items: flex-start;
 padding: 22px 16px;
 border-right: 0;
 border-bottom: 1px solid rgba(255,255,255,.14);
}
.hero-info-item:last-child { border-bottom: 0; }
.hero-info-icon {
 width: 40px;
 height: 40px;
 border-radius: 999px;
 color: var(--cobalt);
 background: rgba(255,255,255,.06);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 flex-shrink: 0;
}
.hero-info-icon svg {
 width: 22px;
 height: 22px;
}
.hero-info-icon.fuchsia { color: var(--fuchsia); }
.hero-info-icon.teal { color: var(--teal); }
.hero-info-item p {
 color: #fff;
 font-weight: 600;
 max-width: 330px;
 font-size: 14px;
 line-height: 1.38;
}
.hero-info-item span {
 display: block;
 margin-top: 8px;
 color: rgba(255,255,255,.55);
 max-width: 330px;
 font-size: 12px;
 line-height: 1.48;
}
.hero-refrain {
 width: max-content;
 max-width: 100%;
 margin: 84px 0 0;
 padding: 18px 0 2px;
 border-top: 1px solid rgba(199,216,255,.5);
 text-align: left;
 color: rgba(255,255,255,.7);
 font-size: 15px;
 letter-spacing: .4em;
 text-transform: uppercase;
}

@media (max-width: 1450px) and (min-width: 1024px) {
 #site-header .max-w-7xl { height: 58px; }
 main { padding-top: 82px !important; }
 .hero-rebrand > .max-w-7xl {
 padding-top: 58px;
 padding-bottom: 18px;
 }
 .hero-badge {
 padding: 6px 13px;
 font-size: 10px;
 }
 .hero-title.mt-8 { margin-top: 18px; }
 .hero-title {
 font-size: clamp(56px, 4.75vw, 78px);
 line-height: .965;
 max-width: 760px;
 }
 .hero-sub.mt-7 { margin-top: 14px; }
 .hero-sub {
 max-width: 610px;
 font-size: 18px;
 line-height: 1.38;
 }
 .hero-sub + .mt-8 { margin-top: 16px; }
 .hero-primary,
 .hero-secondary {
 min-height: 46px;
 padding: 10px 20px;
 }
 .hero-portrait-wrap {
 min-height: 382px;
 padding-top: 42px;
 }
 .hero-portrait-ring {
 width: 305px;
 transform: translateX(-214px);
 }
 .hero-signature {
 transform: translateX(-198px);
 margin-top: 18px;
 padding: 12px 18px;
 gap: 12px;
 }
 .hero-signature span {
 font-size: 36px;
 }
 .hero-signature i {
 height: 38px;
 }
 .hero-signature small {
 font-size: 12px;
 }
 .hero-stairs {
 width: 108px;
 height: 70px;
 right: 18px;
 bottom: 12px;
 border-left-width: 8px;
 border-top-width: 8px;
 }
 .hero-square {
 right: 39%;
 top: 43%;
 width: 42px;
 height: 42px;
 }
 .hero-dot-field-right { top: 96px; right: 6%; width: 130px; height: 130px; }
 .hero-info-strip {
 top: 132px;
 right: -214px;
 width: 430px;
 }
 .hero-info-item {
 grid-template-columns: 34px minmax(0, 1fr);
 padding: 17px 14px;
 gap: 13px;
 }
 .hero-info-icon {
 width: 32px;
 height: 32px;
 }
 .hero-info-icon svg {
 width: 18px;
 height: 18px;
 }
 .hero-info-item p {
 max-width: 310px;
 font-size: 13px;
 line-height: 1.36;
 }
 .hero-info-item span {
 max-width: 310px;
 font-size: 11px;
 line-height: 1.42;
 }
 .hero-refrain {
 width: max-content;
 max-width: 100%;
 margin-top: 68px;
 padding-top: 16px;
 font-size: 12px;
 letter-spacing: .3em;
 }
}

@media (min-width: 1024px) and (max-height: 820px) {
 #site-header .max-w-7xl { height: 58px; }
 main { padding-top: 82px !important; }
 .hero-rebrand > .max-w-7xl {
 padding-top: 48px;
 padding-bottom: 14px;
 }
 .hero-badge {
 padding: 5px 12px;
 font-size: 9px;
 }
 .hero-title.mt-8 { margin-top: 14px; }
 .hero-title {
 font-size: clamp(52px, 4.25vw, 71px);
 line-height: .955;
 max-width: 720px;
 }
 .hero-sub.mt-7 { margin-top: 12px; }
 .hero-sub {
 font-size: 17px;
 line-height: 1.33;
 max-width: 570px;
 }
 .hero-sub + .mt-8 { margin-top: 12px; }
 .hero-primary,
 .hero-secondary {
 min-height: 36px;
 padding: 7px 15px;
 font-size: 12px;
 }
 .hero-sub + .mt-8 + .mt-7,
 .hero-rebrand .text-sm.text-white\/60 {
 margin-top: 10px;
 font-size: 11px;
 }
 .hero-portrait-wrap {
 min-height: 334px;
 padding-top: 34px;
 }
 .hero-portrait-ring {
 width: 278px;
 transform: translateX(-190px);
 border-width: 2px;
 box-shadow: 0 0 0 14px rgba(199,216,255,.14), 0 24px 58px rgba(10,61,255,.22);
 }
 .hero-signature {
 transform: translateX(-174px);
 margin-top: 16px;
 padding: 10px 15px;
 gap: 10px;
 }
 .hero-signature span {
 font-size: 32px;
 }
 .hero-signature i {
 height: 34px;
 }
 .hero-signature small {
 font-size: 11px;
 }
 .hero-stairs {
 width: 100px;
 height: 66px;
 right: 20px;
 bottom: 10px;
 }
 .hero-square {
 display: block;
 right: 39%;
 top: 45%;
 width: 38px;
 height: 38px;
 }
 .hero-dot-field-right { top: 82px; width: 110px; height: 110px; }
 .hero-info-strip {
 top: 122px;
 right: -204px;
 width: 410px;
 }
 .hero-info-item {
 grid-template-columns: 32px minmax(0, 1fr);
 padding: 15px 13px;
 gap: 12px;
 }
 .hero-info-icon {
 width: 30px;
 height: 30px;
 }
 .hero-info-icon svg {
 width: 16px;
 height: 16px;
 }
 .hero-info-item p {
 max-width: 292px;
 font-size: 12px;
 line-height: 1.34;
 }
 .hero-info-item span {
 max-width: 292px;
 font-size: 10px;
 line-height: 1.4;
 }
 .hero-refrain {
 width: max-content;
 max-width: 100%;
 margin-top: 62px;
 padding-top: 14px;
 font-size: 11px;
 letter-spacing: .25em;
 }
}

.hero-refrain .blue { color: var(--cobalt); }
.hero-refrain .pink { color: var(--fuchsia); }
.hero-refrain .teal { color: var(--teal); }

@media (max-width: 1023px) {
 .hero-rebrand { min-height: auto; }
 .hero-title { font-size: clamp(48px, 14vw, 78px); }
 .hero-portrait-wrap {
 min-height: 430px;
 display: flex;
 flex-direction: column;
 align-items: center;
 }
 .hero-portrait-ring { margin: 0 auto; transform: none; width: min(330px, 82vw); }
 .hero-signature {
 position: relative;
 left: auto;
 right: auto;
 bottom: auto;
 transform: none;
 margin-top: 18px;
 width: fit-content;
 max-width: min(420px, calc(100vw - 48px));
 }
 .hero-stairs { right: 8%; }
 .hero-stripes { display: none; }
 .hero-info-strip {
 position: static;
 background: transparent;
 backdrop-filter: none;
 width: min(560px, 100%);
 margin: 28px auto 0 !important;
 grid-template-columns: 1fr 1fr;
 }
 .hero-info-item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.14); }
 .hero-info-item:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.18); }
 .hero-refrain { letter-spacing: .28em; line-height: 2; }
}

@media (max-width: 640px) {
 .hero-badge { font-size: 10px; letter-spacing: .12em; }
 .hero-title { font-size: clamp(43px, 15vw, 62px); }
 .hero-primary,
 .hero-secondary {
 width: 100%;
 }
 .hero-signature {
 gap: 10px;
 padding: 12px 14px;
 }
 .hero-signature span {
 font-size: 32px;
 }
 .hero-signature i {
 height: 34px;
 }
 .hero-signature small {
 font-size: 11px;
 white-space: normal;
 max-width: 180px;
 }
 .hero-info-strip { grid-template-columns: 1fr; }
 .hero-info-item,
 .hero-info-item:nth-child(odd),
 .hero-info-item:nth-child(2) {
 border-right: 0;
 border-bottom: 1px solid rgba(255,255,255,.18);
 }
 .hero-info-item:last-child { border-bottom: 0; }
}

/* ---------- Buttons ---------- */
.btn-primary {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 8px;
 padding: 12px 22px;
 background: var(--cobalt);
 color: #fff;
 font-weight: 600;
 border-radius: 10px;
 transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
 box-shadow: 0 6px 24px -8px rgba(10, 61, 255, 0.5);
 white-space: nowrap;
}
.btn-primary:hover {
 background: #0a32d6;
 transform: translateY(-1px);
 box-shadow: 0 10px 28px -8px rgba(10, 61, 255, 0.6);
}
.btn-primary:active { transform: translateY(0); }

.btn-outline {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 8px;
 padding: 11px 22px;
 background: transparent;
 color: var(--cobalt);
 font-weight: 600;
 border-radius: 10px;
 border: 2px solid var(--cobalt);
 transition: background .2s ease, color .2s ease;
 white-space: nowrap;
}
.btn-outline:hover { background: var(--cobalt); color: #fff; }

/* ---------- Package cards ---------- */
.package-card {
 background: #fff;
 border: 1px solid #e6e9f1;
 border-radius: 18px;
 padding: 24px;
 transition: background .25s ease, border-color .25s ease, transform .2s ease, box-shadow .2s ease;
 display: flex;
 flex-direction: column;
}
.package-card:hover {
 background: var(--icy);
 border-color: var(--cobalt);
 transform: translateY(-4px);
 box-shadow: 0 24px 40px -24px rgba(10, 61, 255, 0.35);
}
.package-card ul {
 margin-bottom: 24px;
}
.package-card .package-cta {
 margin-top: auto;
}

.tag-fuchsia {
 font-size: 10px;
 font-weight: 700;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 color: var(--fuchsia);
 background: rgba(216, 27, 114, 0.08);
 padding: 4px 10px;
 border-radius: 999px;
}

ul.text-charcoal\/80 li.check,
.check {
 position: relative;
 padding-left: 22px;
 list-style: none;
}
.check::before {
 content: "";
 position: absolute;
 left: 0; top: 6px;
 width: 14px; height: 14px;
 background: var(--cobalt);
 -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'><polyline points='20 6 9 17 4 12'/></svg>") center/contain no-repeat;
 mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'><polyline points='20 6 9 17 4 12'/></svg>") center/contain no-repeat;
}

/* ---------- Pain points ---------- */
.pain-box {
 position: relative;
 background: rgba(255, 255, 255, 0.04);
 border: 1px solid rgba(255, 255, 255, 0.08);
 border-left: 3px solid var(--teal);
 border-radius: 12px;
 padding: 28px 26px;
 transition: background .25s ease, transform .25s ease;
}
.pain-box:nth-child(1),
.pain-box:nth-child(2),
.pain-box:nth-child(3) {
 border-left-color: var(--teal);
}
.pain-box:hover {
 background: rgba(255, 255, 255, 0.07);
 transform: translateY(-3px);
}

/* ---------- Segment cards ---------- */
.segment-card {
 display: block;
 background: #fff;
 border: 1px solid #e6e9f1;
 border-radius: 18px;
 padding: 28px;
 transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.segment-card:hover {
 transform: translateY(-4px);
 border-color: var(--cobalt);
 box-shadow: 0 24px 40px -24px rgba(10, 61, 255, 0.35);
}
.seg-icon {
 width: 52px; height: 52px;
 border-radius: 14px;
 background: var(--icy);
 color: var(--cobalt);
 display: inline-flex;
 align-items: center;
 justify-content: center;
}
.explore-link {
 display: inline-block;
 margin-top: 18px;
 color: var(--cobalt);
 font-weight: 600;
 font-size: 14px;
}

/* ---------- Resource and inner page cards ---------- */
.resource-grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(0, 1fr));
 gap: 24px;
}
.resource-card,
.inner-card,
.day-card {
 background: #fff;
 border: 1px solid #e6e9f1;
 border-radius: 18px;
 padding: 28px;
 transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.day-card {
 display: flex;
 flex-direction: column;
 height: 100%;
}
.resource-card:hover,
.inner-card:hover,
.day-card:hover {
 transform: translateY(-3px);
 border-color: var(--cobalt);
 box-shadow: 0 24px 40px -24px rgba(10, 61, 255, 0.25);
}
.resource-card h3,
.inner-card h3,
.day-card h3 {
 margin-top: 18px;
 font-family: "Bebas Neue", system-ui, sans-serif;
 font-size: 2rem;
 line-height: 1;
 color: var(--ink);
}
.resource-card p,
.inner-card p,
.day-card p {
 margin-top: 12px;
 color: rgba(31, 31, 35, .78);
 line-height: 1.65;
}
.category-chips {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
}
.category-chip {
 display: inline-flex;
 align-items: center;
 border: 1px solid rgba(10, 61, 255, .22);
 background: rgba(199, 216, 255, .35);
 color: var(--ink);
 border-radius: 999px;
 padding: 8px 13px;
 font-size: 12px;
 font-weight: 700;
 letter-spacing: .08em;
 text-transform: uppercase;
}
.inner-hero {
 background:
 radial-gradient(circle at 92% 0%, rgba(10,61,255,.14), transparent 30%),
 radial-gradient(circle at 8% 100%, rgba(0,151,167,.10), transparent 30%),
 var(--ink);
 color: #fff;
 position: relative;
 overflow: hidden;
}
.inner-hero::before {
 content: "";
 position: absolute;
 inset: 0;
 opacity: .16;
 background-image: radial-gradient(circle, rgba(255,255,255,.45) 1.2px, transparent 1.2px);
 background-size: 18px 18px;
 mask-image: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
}
.inner-hero > div {
 position: relative;
}
.inner-label {
 display: inline-flex;
 align-items: center;
 gap: 8px;
 border: 1px solid rgba(199,216,255,.5);
 border-radius: 999px;
 padding: 7px 14px;
 color: var(--icy);
 font-size: 12px;
 font-weight: 700;
 text-transform: uppercase;
 letter-spacing: .22em;
}
.inner-label::before {
 content: "";
 width: 8px;
 height: 8px;
 border-radius: 999px;
 background: var(--cobalt);
}
.inner-section {
 padding: 80px 0;
}
.inner-section-dark {
 background: var(--ink);
 color: #fff;
}
.inner-section-dark .inner-card,
.inner-section-dark .day-card {
 background: rgba(255,255,255,.04);
 border-color: rgba(255,255,255,.12);
}
.inner-section-dark .inner-card h3,
.inner-section-dark .day-card h3,
.inner-section-dark .resource-card h3 {
 color: #fff;
}
.inner-section-dark .inner-card p,
.inner-section-dark .day-card p {
 color: rgba(255,255,255,.72);
}
.timeline-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
 gap: 24px;
 width: 100%;
 max-width: 100%;
 box-sizing: border-box;
 overflow: visible;
}
.timeline-grid .day-card {
 --day-card-glow: rgba(10, 61, 255, 0.2);
 --day-card-glow-soft: rgba(0, 151, 167, 0.14);
 --day-card-top-light: rgba(255, 255, 255, 0.12);
 background:
 linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,0) 34%),
 radial-gradient(circle at 50% -18%, var(--day-card-top-light), transparent 48%),
 rgba(255,255,255,.045);
 border-color: rgba(255,255,255,.13);
 box-shadow:
 inset 0 1px 0 rgba(255,255,255,.11),
 0 18px 42px -34px rgba(0,0,0,.72);
 isolation: isolate;
 overflow: visible;
 position: relative;
 width: 100%;
 max-width: 100%;
 min-width: 0;
 box-sizing: border-box;
}
.timeline-grid .day-card::before,
.timeline-grid .day-card::after {
 content: "";
 pointer-events: none;
 position: absolute;
}
.timeline-grid .day-card::before {
 background:
 linear-gradient(90deg, transparent, rgba(242,244,248,.16), transparent),
 radial-gradient(circle at 18% 0%, rgba(10,61,255,.13), transparent 42%),
 radial-gradient(circle at 82% 0%, rgba(0,151,167,.11), transparent 38%);
 border-radius: inherit;
 inset: 1px;
 opacity: .72;
 z-index: 0;
}
.timeline-grid .day-card::after {
 background:
 radial-gradient(ellipse at 50% 60%, var(--day-card-glow), transparent 62%),
 radial-gradient(ellipse at 18% 74%, var(--day-card-glow-soft), transparent 56%);
 border-radius: 999px;
 bottom: -18px;
 filter: blur(18px);
 height: 48px;
 left: 12%;
 opacity: .42;
 right: 12%;
 transform: translateZ(0);
 transition: opacity .25s ease, transform .25s ease, filter .25s ease;
 z-index: -1;
}
.timeline-grid .day-card:nth-child(2) {
 --day-card-glow: rgba(0, 151, 167, 0.22);
 --day-card-glow-soft: rgba(10, 61, 255, 0.13);
}
.timeline-grid .day-card:nth-child(3) {
 --day-card-glow: rgba(10, 61, 255, 0.18);
 --day-card-glow-soft: rgba(216, 27, 114, 0.08);
}
.timeline-grid .day-card:nth-child(4) {
 --day-card-glow: rgba(0, 151, 167, 0.18);
 --day-card-glow-soft: rgba(216, 27, 114, 0.075);
}
.timeline-grid .day-card:nth-child(5) {
 --day-card-glow: rgba(10, 61, 255, 0.2);
 --day-card-glow-soft: rgba(0, 151, 167, 0.13);
}
.timeline-grid .day-card > * {
 position: relative;
 z-index: 1;
}
.inner-section-dark .timeline-grid .day-card:hover {
 background:
 linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,0) 36%),
 radial-gradient(circle at 50% -18%, rgba(242,244,248,.15), transparent 50%),
 rgba(255,255,255,.062);
 border-color: rgba(255,255,255,.18);
 box-shadow:
 inset 0 1px 0 rgba(255,255,255,.16),
 0 28px 54px -34px rgba(0,0,0,.8),
 0 18px 44px -32px rgba(10,61,255,.32);
 transform: translateY(-4px);
}
.timeline-grid .day-card:hover::after {
 filter: blur(20px);
 opacity: .62;
 transform: translateY(-1px);
}
.timeline-grid .day-card-top {
 min-width: 0;
}
.timeline-grid .day-card h3,
.timeline-grid .day-card p,
.timeline-grid .day-card li,
.timeline-grid .explore-link,
.timeline-grid .tag-fuchsia {
 max-width: 100%;
 white-space: normal;
 overflow-wrap: anywhere;
}
.day-card ul {
 margin-top: 14px;
 display: grid;
 gap: 7px;
 color: rgba(31,31,35,.78);
 font-size: 14px;
}
.day-card-expressions {
 line-height: 1.5;
}
.inner-section-dark .day-card-expressions {
 color: rgba(242,244,248,.72);
}
.day-card-footer {
 margin-top: auto;
 padding-top: 18px;
}
.day-card-footer .explore-link {
 margin-top: 0;
}
.lesson-flow-strip {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 margin-top: 28px;
}
.lesson-flow-strip span {
 display: inline-flex;
 align-items: center;
 min-height: 34px;
 border: 1px solid rgba(199,216,255,.24);
 border-radius: 999px;
 padding: 8px 13px;
 color: rgba(242,244,248,.76);
 background: rgba(255,255,255,.045);
 font-size: 11px;
 font-weight: 800;
 letter-spacing: .16em;
 text-transform: uppercase;
}
.timeline-grid .day-card {
 padding: 24px;
}
.timeline-grid .day-card-top p {
 font-size: 15px;
 line-height: 1.55;
}
.challenge-day-page .placeholder-grid {
 display: grid;
 grid-template-columns: repeat(5, minmax(0, 1fr));
 gap: 18px;
}
.placeholder-card {
 min-height: 170px;
}

.challenge-anchor-card {
 color: inherit;
 display: block;
 text-decoration: none;
}

.lesson-overview-grid {
 align-items: stretch;
}

.challenge-day-page .lesson-overview-grid {
 grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lesson-overview-card {
 border-color: rgba(199, 216, 255, 0.9);
 box-shadow: 0 14px 34px rgba(15, 23, 42, 0.055);
 display: flex;
 flex-direction: column;
 height: 100%;
 min-height: 230px;
 padding: 22px;
 transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.lesson-overview-card:hover,
.lesson-overview-card:focus-visible {
 border-color: rgba(10, 61, 255, 0.28);
 box-shadow: 0 18px 42px rgba(10, 61, 255, 0.1);
 outline: none;
 transform: translateY(-2px);
}

.mobile-learning-path-compact,
.mobile-learning-path-toggle {
 display: none;
}

/* OVERVIEW CARD ICON SYSTEM */
.lesson-overview-icon {
 align-items: center;
 border-radius: 999px;
 color: #fff;
 display: inline-flex;
 height: 46px;
 justify-content: center;
 margin-bottom: 18px;
 width: 46px;
}

.lesson-overview-icon svg {
 height: 22px;
 width: 22px;
}

.lesson-overview-icon--cobalt {
 background: var(--cobalt);
 box-shadow: 0 12px 28px rgba(10, 61, 255, 0.16);
}

.lesson-overview-icon--teal {
 background: var(--teal);
 box-shadow: 0 12px 28px rgba(0, 151, 167, 0.16);
}

.lesson-overview-icon--fuchsia {
 background: var(--fuchsia);
 box-shadow: 0 12px 28px rgba(216, 27, 114, 0.16);
}

.lesson-overview-card .tag-fuchsia {
 align-self: flex-start;
}

.lesson-overview-card h3 {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(1.9rem, 2vw, 2.25rem);
 letter-spacing: 0;
 line-height: 0.98;
 margin-top: 0.95rem;
 text-transform: uppercase;
}

.lesson-overview-card p {
 color: rgba(31, 31, 35, 0.72);
 font-size: 0.94rem;
 line-height: 1.55;
 margin-top: 0.75rem;
}

.lesson-start-transition,
.lesson-stage-transition {
 display: none;
}

.lesson-anchor-section {
 scroll-margin-top: 110px;
}

.lesson-section {
 border-color: rgba(199, 216, 255, 0.82);
 border-radius: 24px;
 padding: clamp(28px, 4vw, 42px);
}

/* Base lesson section layout */
.section-header {
 align-items: flex-start;
 display: grid;
 gap: 22px;
 grid-template-columns: 64px minmax(0, 1fr);
}

.section-icon {
 align-items: center;
 border-radius: 999px;
 color: #fff;
 display: inline-flex;
 height: 64px;
 justify-content: center;
 width: 64px;
}

.section-icon svg {
 height: 28px;
 width: 28px;
}

.section-icon--cobalt {
 background: var(--cobalt);
 box-shadow: 0 16px 34px rgba(10, 61, 255, 0.18);
}

.section-icon--teal {
 background: var(--teal);
 box-shadow: 0 16px 34px rgba(0, 151, 167, 0.18);
}

.section-icon--fuchsia {
 background: var(--fuchsia);
 box-shadow: 0 16px 34px rgba(216, 27, 114, 0.18);
}

.section-kicker {
 display: inline-flex;
}

.section-title {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(2.25rem, 3.15vw, 2.75rem);
 line-height: 0.98;
 margin-top: 0.8rem;
 text-transform: uppercase;
}

.section-description {
 color: rgba(31, 31, 35, 0.76);
 font-size: clamp(1.05rem, 1.55vw, 1.375rem);
 line-height: 1.45;
 margin-top: 1rem;
 max-width: 780px;
}

.section-helper-text {
 color: rgba(31, 31, 35, 0.58);
 font-size: 0.96rem;
 line-height: 1.55;
 margin-top: 0.7rem;
 max-width: 780px;
}

.coming-tomorrow-card {
 align-items: flex-start;
 background:
 linear-gradient(135deg, rgba(10, 61, 255, 0.07), rgba(0, 151, 167, 0.07)),
 #fff;
 border-color: rgba(10, 61, 255, 0.18);
 border-radius: 24px;
 display: grid;
 gap: 22px;
 grid-template-columns: auto minmax(0, 1fr);
 overflow: hidden;
 padding: clamp(26px, 4vw, 40px);
}

/* COMING TOMORROW MARKER SYSTEM */
.coming-tomorrow-marker {
 align-items: center;
 background: linear-gradient(135deg, var(--cobalt), var(--teal));
 border-radius: 16px;
 box-shadow: 0 14px 30px rgba(10, 61, 255, 0.12);
 color: #fff;
 display: inline-flex;
 font-family: "Bebas Neue", sans-serif;
 font-size: 2.1rem;
 height: 64px;
 justify-content: center;
 line-height: 1;
 width: 64px;
}

.coming-tomorrow-card ul {
 display: grid;
 gap: 0.55rem;
 margin-top: 1.25rem;
}

.coming-tomorrow-card li {
 color: rgba(31, 31, 35, 0.76);
 font-size: 0.96rem;
 line-height: 1.45;
 padding-left: 1.3rem;
 position: relative;
}

.coming-tomorrow-card li::before {
 background: var(--teal);
 border-radius: 999px;
 content: "";
 height: 0.45rem;
 left: 0;
 position: absolute;
 top: 0.55rem;
 width: 0.45rem;
}

.coming-tomorrow-cta {
 align-items: center;
 background: var(--cobalt);
 border-radius: 999px;
 box-shadow: 0 12px 28px rgba(10, 61, 255, 0.16);
 color: #fff;
 display: inline-flex;
 font-size: 0.86rem;
 font-weight: 800;
 margin-top: 1.35rem;
 padding: 0.75rem 1.1rem;
}

.day-one-quiz-intro {
 background: transparent;
 border: 0;
 box-shadow: none;
 padding: 0;
 scroll-margin-top: 110px;
}

.day-one-quiz-intro::before {
 display: none;
}

.day-one-quiz-intro__shell {
 background: #f7f9fc;
 border: 1px solid rgba(10, 61, 255, 0.16);
 border-radius: 24px;
 box-shadow: 0 12px 34px rgba(15, 23, 42, 0.045);
 margin: 40px auto 56px;
 max-width: 1180px;
 padding: clamp(22px, 2.6vw, 34px);
}

.day-one-quiz-intro__header {
 align-items: center;
 display: grid;
 gap: 22px;
 grid-template-columns: minmax(72px, 86px) minmax(0, 1fr);
}

.day-one-quiz-intro__badge {
 min-height: 86px;
 position: relative;
}

.day-one-quiz-intro__dots {
 background-image: radial-gradient(circle, rgba(0, 151, 167, 0.42) 1.7px, transparent 1.7px);
 background-size: 12px 12px;
 bottom: -6px;
 height: 54px;
 left: -2px;
 opacity: 0.85;
 position: absolute;
 width: 82px;
}

.day-one-quiz-intro__quote {
 align-items: center;
 background: var(--cobalt);
 border-radius: 999px;
 box-shadow: 0 0 0 17px rgba(10, 61, 255, 0.08), 0 18px 36px rgba(10, 61, 255, 0.18);
 color: #fff;
 display: inline-flex;
 height: clamp(76px, 6.5vw, 88px);
 justify-content: center;
 position: relative;
 width: clamp(76px, 6.5vw, 88px);
 z-index: 1;
}

.day-one-quiz-intro__quote svg {
 height: 58%;
 width: 58%;
}

.day-one-quiz-intro__pill {
 align-items: center;
 background: rgba(216, 27, 114, 0.1);
 border-radius: 999px;
 color: var(--fuchsia);
 display: inline-flex;
 font-size: 0.75rem;
 font-weight: 800;
 gap: 0.5rem;
 letter-spacing: 0.22em;
 padding: 0.55rem 1rem;
 text-transform: uppercase;
}

.day-one-quiz-intro__pill svg {
 height: 1rem;
 width: 1rem;
}

.day-one-quiz-intro__brief {
 border-left: 3px solid var(--cobalt);
 margin-top: 1rem;
 max-width: 760px;
 padding-left: 1rem;
}

.day-one-quiz-intro__brief p,
.day-one-quiz-intro__brief li {
 color: rgba(31, 31, 35, 0.74);
 font-size: 0.94rem;
 line-height: 1.55;
}

.day-one-quiz-intro__brief p {
 margin-top: 0.45rem;
}

.day-one-quiz-intro__brief ul {
 display: grid;
 gap: 0.25rem;
 list-style: disc;
 margin: 0.55rem 0 0.55rem 1.1rem;
}

.day-one-quiz-intro__grid {
 display: grid;
 gap: 20px;
 grid-template-columns: 1fr;
 margin-top: clamp(22px, 2.4vw, 28px);
}

.day-one-quiz-intro__card {
 border: 1px solid var(--icy);
 border-radius: 20px;
 min-height: 0;
 padding: 24px;
}

.day-one-quiz-intro__card--focus {
 background: #f2fbfd;
}

.day-one-quiz-intro__card--practice {
 background: #fff;
}

/* INTRO CARD ICON SYSTEM */
.day-one-quiz-intro__card-icon {
 align-items: center;
 border-radius: 999px;
 color: #fff;
 display: inline-flex;
 height: 50px;
 justify-content: center;
 width: 50px;
}

.day-one-quiz-intro__card-icon svg {
 height: 27px;
 width: 27px;
}

.day-one-quiz-intro__card-icon--teal {
 background: var(--teal);
 box-shadow: 0 12px 30px rgba(0, 151, 167, 0.22);
}

.day-one-quiz-intro__card-icon--fuchsia {
 background: var(--fuchsia);
 box-shadow: 0 12px 30px rgba(216, 27, 114, 0.2);
}

.day-one-quiz-intro__card-header {
 align-items: flex-start;
 display: flex;
 gap: 18px;
}

.day-one-quiz-intro__card-header .day-one-quiz-intro__card-icon {
 flex: 0 0 auto;
 margin-top: 0.05rem;
}

.day-one-quiz-intro__card-title {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: 1.85rem;
 font-weight: 400;
 letter-spacing: 0;
 line-height: 1;
 margin: 2.25rem 0 0;
 text-transform: uppercase;
}

.day-one-quiz-intro__card-header .day-one-quiz-intro__card-title {
 flex: 1 1 auto;
 margin-top: 0;
 min-width: 0;
}

.day-one-quiz-intro__card p {
 color: rgba(31, 31, 35, 0.76);
 font-size: 0.96rem;
 line-height: 1.56;
 margin-top: 1rem;
}

.day-one-quiz-intro__card ul {
 color: rgba(31, 31, 35, 0.82);
 font-size: 0.96rem;
 line-height: 1.5;
 margin-top: 1rem;
}

.day-one-quiz-intro__card li {
 align-items: flex-start;
 border-top: 1px solid var(--icy);
 display: flex;
 gap: 0.85rem;
 padding: 0.68rem 0;
}

.day-one-quiz-intro__card li:first-child {
 border-top: 0;
}

.day-one-quiz-intro__card li span:first-child {
 align-items: center;
 border: 2px solid var(--fuchsia);
 border-radius: 999px;
 color: var(--fuchsia);
 display: inline-flex;
 flex: 0 0 auto;
 font-size: 0.85rem;
 font-weight: 800;
 height: 28px;
 justify-content: center;
 line-height: 1;
 margin-top: 0.05rem;
 width: 28px;
}

.day-one-quiz-intro__visual {
 align-self: start;
 background: linear-gradient(135deg, #111827, #172235 48%, #0b1020);
 border-radius: 20px;
 height: clamp(220px, 21vw, 260px);
 min-height: 220px;
 overflow: hidden;
 position: relative;
 box-shadow: 0 16px 38px rgba(10, 61, 255, 0.12);
}

.day-one-quiz-intro__visual::before {
 background:
 linear-gradient(135deg, rgba(242, 244, 248, 0.3), rgba(199, 216, 255, 0.34)),
 radial-gradient(circle at 52% 32%, rgba(242, 244, 248, 0.24), transparent 38%);
 content: "";
 inset: 0;
 mix-blend-mode: color;
 pointer-events: none;
 position: absolute;
 z-index: 1;
}

.day-one-quiz-intro__visual::after {
 background:
 linear-gradient(135deg, rgba(242, 244, 248, 0.3), rgba(199, 216, 255, 0.2) 46%, rgba(10, 61, 255, 0.08)),
 radial-gradient(circle at 76% 18%, rgba(199, 216, 255, 0.26), transparent 42%);
 content: "";
 inset: 0;
 mix-blend-mode: screen;
 pointer-events: none;
 position: absolute;
 z-index: 2;
}

.day-one-quiz-intro__visual img {
 display: block;
 filter: contrast(0.78) saturate(0.58) brightness(1.14) hue-rotate(14deg);
 height: 100%;
 inset: 0;
 object-fit: cover;
 object-position: center 34%;
 position: absolute;
 width: 100%;
}

.day-one-quiz-intro__visual .visual-cobalt,
.day-one-quiz-intro__visual .visual-fuchsia,
.day-one-quiz-intro__visual .visual-teal,
.day-one-quiz-intro__visual .visual-arch,
.day-one-quiz-intro__visual .visual-steps,
.day-one-quiz-intro__visual .visual-dots,
.day-one-quiz-intro__visual .visual-star,
.day-one-quiz-intro__visual .visual-speech,
.day-one-quiz-intro__visual .visual-stripes {
 position: absolute;
}

.visual-cobalt {
 background: var(--cobalt);
 border-bottom-left-radius: 90px;
 height: 175px;
 right: -58px;
 top: -62px;
 width: 175px;
}

.visual-fuchsia {
 background: var(--fuchsia);
 border-top-right-radius: 100%;
 bottom: -56px;
 height: 170px;
 left: -46px;
 width: 170px;
}

.visual-teal {
 background: var(--teal);
 border-top-left-radius: 56px;
 bottom: -28px;
 height: 148px;
 right: -25px;
 width: 148px;
}

.visual-arch {
 background: var(--cool);
 border-radius: 999px 999px 0 0;
 height: 230px;
 left: 50%;
 top: 28px;
 transform: translateX(-50%);
 width: 172px;
}

.visual-steps {
 background: repeating-linear-gradient(170deg, #858b96 0 9px, #202632 9px 21px);
 bottom: 0;
 height: 144px;
 left: 50%;
 opacity: 0.95;
 transform: translateX(-50%);
 width: 225px;
}

.visual-dots {
 background-image: radial-gradient(circle, rgba(242, 244, 248, 0.8) 2px, transparent 2px);
 background-size: 14px 14px;
 height: 112px;
 opacity: 0.85;
 right: 44px;
 top: 112px;
 width: 142px;
}

.visual-star {
 color: var(--fuchsia);
 height: 82px;
 left: 30px;
 top: 30px;
 width: 82px;
}

.visual-star::before,
.visual-star::after {
 background: currentColor;
 content: "";
 height: 3px;
 left: 0;
 position: absolute;
 top: 50%;
 width: 100%;
}

.visual-star::after {
 transform: rotate(90deg);
}

.visual-star {
 background:
 linear-gradient(45deg, transparent 48%, currentColor 48% 52%, transparent 52%),
 linear-gradient(-45deg, transparent 48%, currentColor 48% 52%, transparent 52%);
}

.visual-speech {
 align-items: center;
 background: var(--teal);
 border-radius: 999px;
 box-shadow: 0 14px 36px rgba(0, 151, 167, 0.35);
 display: inline-flex;
 gap: 12px;
 height: 88px;
 justify-content: center;
 right: 80px;
 top: 128px;
 width: 132px;
 z-index: 4;
}

.visual-speech i {
 background: #fff;
 border-radius: 999px;
 display: block;
 height: 13px;
 width: 13px;
}

.visual-person {
 bottom: 0;
 color: rgba(0, 0, 0, 0.82);
 position: absolute;
 z-index: 3;
}

.visual-person-left {
 height: 250px;
 left: 34px;
 width: 218px;
}

.visual-person-right {
 height: 236px;
 right: 36px;
 width: 190px;
}

.visual-stripes {
 background: repeating-linear-gradient(135deg, #f2f4f8 0 9px, #0a0a0a 9px 18px);
 bottom: 0;
 height: 76px;
 right: 0;
 width: 128px;
 z-index: 5;
}

.day-one-quiz-intro__info {
 align-items: flex-start;
 background: rgba(255, 255, 255, 0.78);
 border: 1px solid rgba(199, 216, 255, 0.68);
 border-radius: 16px;
 display: flex;
 gap: 0.78rem;
 margin-top: 22px;
 padding: 0.9rem 1.2rem;
}

.day-one-quiz-intro__info span {
 align-items: center;
 background: rgba(0, 151, 167, 0.12);
 border-radius: 999px;
 color: var(--teal);
 display: inline-flex;
 flex: 0 0 auto;
 font-size: 0.78rem;
 font-weight: 800;
 height: 30px;
 justify-content: center;
 width: 30px;
}

.day-one-quiz-intro__info span svg {
 height: 16px;
 width: 16px;
}

.day-one-quiz-intro__info p {
 color: rgba(31, 31, 35, 0.82);
 font-size: 0.93rem;
 line-height: 1.55;
 padding-top: 0.15rem;
}

@media (min-width: 800px) {
 .day-one-quiz-intro__grid {
 grid-template-columns: 1fr 1fr;
 }

 .day-one-quiz-intro__visual {
 grid-column: 1 / -1;
 }
}

@media (min-width: 1100px) {
 .day-one-quiz-intro__header {
 align-items: center;
 grid-template-columns: minmax(72px, 86px) minmax(0, 1.85fr) minmax(280px, 1fr);
 }

 .day-one-quiz-intro__grid {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .day-one-quiz-intro__visual {
 grid-column: auto;
 min-height: 260px;
 }

 .day-one-quiz-intro__card {
 min-height: 280px;
 }
}

@media (max-width: 799px) {
 .day-one-quiz-intro__header {
 grid-template-columns: 1fr;
 text-align: center;
 }

 .day-one-quiz-intro__badge {
 min-height: 72px;
 }

 .day-one-quiz-intro__dots {
 left: 50%;
 transform: translateX(-45%);
 }

 .day-one-quiz-intro__quote {
 height: 66px;
 width: 66px;
 }

 .day-one-quiz-intro__heading p {
 margin-left: auto;
 margin-right: auto;
 }

 .day-one-quiz-intro__visual {
 height: clamp(180px, 42vw, 200px);
 min-height: 180px;
 }

 .visual-person-left {
 left: 12px;
 }

 .visual-person-right {
 right: 10px;
 }
}

@media (max-width: 520px) {
 .day-one-quiz-intro__shell {
 margin-top: 32px;
 padding: 24px 18px;
 }

 .day-one-quiz-intro__card {
 padding: 20px 18px;
 }

 .day-one-quiz-intro__info {
 gap: 0.9rem;
 padding: 1rem;
 }

 .day-one-quiz-intro__visual {
 height: clamp(160px, 48vw, 190px);
 min-height: 160px;
 }

 .visual-arch {
 height: 180px;
 width: 136px;
 }

 .visual-speech {
 right: 38px;
 top: 96px;
 transform: scale(0.78);
 }

 .visual-person-left {
 height: 196px;
 width: 170px;
 }

 .visual-person-right {
 height: 190px;
 width: 150px;
 }
}

.expressions-intro-section {
 background: #f7f9fc;
 border: 1px solid rgba(10, 61, 255, 0.14);
 border-radius: 24px;
 box-shadow: 0 12px 34px rgba(15, 23, 42, 0.045);
 padding: clamp(28px, 4vw, 44px);
 scroll-margin-top: 120px;
}

.expressions-intro-section:hover {
 border-color: rgba(10, 61, 255, 0.14);
 box-shadow: 0 12px 34px rgba(15, 23, 42, 0.045);
 transform: none;
}

.expressions-intro-header {
 align-items: center;
 display: grid;
 gap: 24px;
 grid-template-columns: minmax(86px, 104px) minmax(0, 1fr);
}

.expressions-intro-badge {
 min-height: 86px;
 position: relative;
}

.expressions-intro-icon {
 align-items: center;
 background: linear-gradient(135deg, var(--fuchsia), var(--cobalt));
 border-radius: 999px;
 box-shadow: 0 0 0 18px rgba(216, 27, 114, 0.08), 0 18px 36px rgba(216, 27, 114, 0.17);
 color: #fff;
 display: inline-flex;
 height: 86px;
 justify-content: center;
 position: relative;
 width: 86px;
 z-index: 1;
}

.expressions-intro-icon svg {
 height: 58%;
 width: 58%;
}

.expressions-intro-pill {
 align-items: center;
 background: rgba(216, 27, 114, 0.1);
 border-radius: 999px;
 color: var(--fuchsia);
 display: inline-flex;
 font-size: 0.75rem;
 font-weight: 800;
 letter-spacing: 0.18em;
 padding: 0.52rem 0.95rem;
 text-transform: uppercase;
}

.expression-accordion {
 display: grid;
 gap: 14px;
}

.expression-accordion-item {
 background: #fff;
 border: 1px solid var(--icy);
 border-radius: 18px;
 overflow: hidden;
 transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.expression-accordion-item.is-open {
 border-color: rgba(10, 61, 255, 0.26);
 box-shadow: 0 16px 36px -28px rgba(10, 61, 255, 0.35);
}

.expression-accordion-trigger {
 align-items: center;
 background: transparent;
 border: 0;
 color: var(--ink);
 cursor: pointer;
 display: flex;
 gap: 18px;
 justify-content: space-between;
 padding: 20px clamp(18px, 3vw, 28px);
 text-align: left;
 width: 100%;
}

.expression-accordion-trigger:hover,
.expression-accordion-trigger:focus-visible {
 background: rgba(10, 61, 255, 0.035);
 outline: none;
}

.expression-accordion-trigger:focus-visible {
 box-shadow: inset 0 0 0 2px var(--cobalt);
}

.expression-accordion-title {
 display: block;
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(1.85rem, 2.4vw, 2.45rem);
 line-height: 0.95;
}

.expression-accordion-purpose {
 color: rgba(31, 31, 35, 0.68);
 display: block;
 font-size: 0.94rem;
 line-height: 1.45;
 margin-top: 0.35rem;
}

.expression-accordion-chev {
 border-bottom: 2px solid var(--fuchsia);
 border-right: 2px solid var(--fuchsia);
 flex: 0 0 auto;
 height: 12px;
 transform: rotate(45deg);
 transition: transform 0.2s ease;
 width: 12px;
}

.expression-accordion-item.is-open .expression-accordion-chev {
 transform: rotate(225deg);
}

.expression-accordion-panel {
 border-top: 1px solid var(--icy);
 padding: 0 clamp(18px, 3vw, 28px) 24px;
}

.expression-detail-list {
 display: grid;
 gap: 14px;
 padding-top: 20px;
}

.expression-detail-list div {
 background: rgba(242, 244, 248, 0.72);
 border: 1px solid rgba(199, 216, 255, 0.62);
 border-radius: 14px;
 padding: 14px 16px;
}

.expression-detail-list dt {
 color: var(--ink);
 font-size: 0.78rem;
 font-weight: 800;
 letter-spacing: 0.12em;
 text-transform: uppercase;
}

.expression-detail-list dd {
 color: rgba(31, 31, 35, 0.78);
 font-size: 0.95rem;
 line-height: 1.62;
 margin-top: 0.35rem;
}

.expression-practice-subsection {
 background: linear-gradient(135deg, rgba(0, 151, 167, 0.09), rgba(242, 244, 248, 0.96));
 border: 1px solid rgba(0, 151, 167, 0.22);
 border-radius: 24px;
 box-shadow: 0 14px 34px rgba(0, 151, 167, 0.07);
 padding: clamp(26px, 4vw, 42px);
}

@media (min-width: 641px) {
 .challenge-day-page .practice-stage {
 margin-top: 44px;
 }
}

.practice-stage-header {
 align-items: center;
 display: grid;
 gap: 24px;
 grid-template-columns: minmax(86px, 104px) minmax(0, 1fr);
}

.practice-stage-badge {
 min-height: 86px;
}

.practice-stage-icon {
 align-items: center;
 background: linear-gradient(135deg, var(--teal), var(--cobalt));
 border-radius: 999px;
 box-shadow: 0 0 0 18px rgba(0, 151, 167, 0.09), 0 18px 36px rgba(0, 151, 167, 0.18);
 color: #fff;
 display: inline-flex;
 height: 86px;
 justify-content: center;
 width: 86px;
}

.practice-stage-icon svg {
 height: 62%;
 width: 62%;
}

.practice-stage-grid {
 display: grid;
 gap: 20px;
 margin-top: 24px;
}

.practice-stage-card {
 background: #fff;
 border: 1px solid rgba(199, 216, 255, 0.82);
 border-radius: 18px;
 padding: clamp(20px, 3vw, 28px);
}

.practice-stage-card--model {
 border-color: rgba(10, 61, 255, 0.2);
}

.practice-stage-banner {
 aspect-ratio: 21 / 7;
 border-radius: 18px;
 margin-top: 18px;
 max-height: 260px;
 overflow: hidden;
 position: relative;
 width: 100%;
}

.practice-stage-banner::after {
 background:
 linear-gradient(135deg, rgba(242, 244, 248, 0.26), rgba(199, 216, 255, 0.24)),
 radial-gradient(circle at 74% 18%, rgba(199, 216, 255, 0.2), transparent 44%);
 content: "";
 inset: 0;
 mix-blend-mode: screen;
 pointer-events: none;
 position: absolute;
 z-index: 1;
}

.practice-stage-banner img {
 display: block;
 filter: contrast(0.86) saturate(0.78) brightness(1.06) hue-rotate(8deg);
 height: 100%;
 object-fit: cover;
 object-position: center 25%;
 width: 100%;
}

.challenge-day-page .practice-stage-banner img.day-four-practice-banner-image {
 object-position: center 60%;
 transform: scale(0.93);
 transform-origin: center center;
}

.day-five-review-intro {
 align-items: center;
 display: grid;
 gap: clamp(24px, 4vw, 44px);
 grid-template-columns: minmax(0, 1fr) minmax(240px, 320px);
}

.day-five-review-copy {
 min-width: 0;
}

.day-five-review-visual {
 border-radius: 18px;
 justify-self: end;
 margin: 0;
 max-width: 320px;
 overflow: hidden;
 position: relative;
 width: min(100%, 320px);
}

.day-five-review-visual::after {
 background:
 linear-gradient(135deg, rgba(242, 244, 248, 0.2), rgba(199, 216, 255, 0.18)),
 radial-gradient(circle at 18% 18%, rgba(10, 61, 255, 0.08), transparent 38%),
 radial-gradient(circle at 82% 72%, rgba(0, 151, 167, 0.1), transparent 42%);
 content: "";
 inset: 0;
 mix-blend-mode: screen;
 pointer-events: none;
 position: absolute;
}

.day-five-review-visual img {
 aspect-ratio: 16 / 10;
 display: block;
 height: auto;
 object-fit: contain;
 width: 100%;
}

@media (max-width: 900px) {
 .day-five-review-intro {
 grid-template-columns: minmax(0, 1fr) minmax(200px, 260px);
 }

 .day-five-review-visual {
 max-width: 260px;
 }
}

@media (max-width: 640px) {
 .day-five-review-intro {
 gap: 22px;
 grid-template-columns: 1fr;
 }

 .day-five-review-visual {
 justify-self: center;
 max-width: 260px;
 width: min(100%, 260px);
 }
}

.practice-stage-card-label {
 color: var(--teal);
 font-size: 0.78rem;
 font-weight: 800;
 letter-spacing: 0.14em;
 text-transform: uppercase;
}

.practice-response-helper {
 color: rgba(31, 31, 35, 0.72);
 font-size: 0.94rem;
 line-height: 1.55;
 margin-top: 0.75rem;
}

.practice-response-input {
 background: rgba(242, 244, 248, 0.72);
 border: 1px solid rgba(199, 216, 255, 0.95);
 border-radius: 16px;
 color: var(--ink);
 font: inherit;
 line-height: 1.55;
 margin-top: 1rem;
 min-height: 170px;
 padding: 16px;
 resize: vertical;
 transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
 width: 100%;
}

.practice-response-input:focus {
 background: #fff;
 border-color: var(--teal);
 box-shadow: 0 0 0 4px rgba(0, 151, 167, 0.12);
 outline: none;
}

.practice-response-input::placeholder {
 color: rgba(31, 31, 35, 0.42);
}

.practice-response-count {
 color: rgba(31, 31, 35, 0.52);
 font-size: 0.78rem;
 line-height: 1.4;
 margin-top: 0.55rem;
 text-align: right;
}

.practice-response-reveal {
 margin-top: 1rem;
}

.practice-model-response {
 border-top: 1px solid rgba(199, 216, 255, 0.82);
 margin-top: 1.25rem;
 max-height: 420px;
 opacity: 1;
 overflow: hidden;
 padding-top: 1.25rem;
 transform: translateY(0);
 transition: max-height 0.26s ease, opacity 0.22s ease, transform 0.22s ease, padding-top 0.22s ease, margin-top 0.22s ease;
}

.practice-model-response.is-collapsed {
 margin-top: 0;
 max-height: 0;
 opacity: 0;
 padding-top: 0;
 transform: translateY(-6px);
}

.expression-audio-lab {
 margin-top: 24px;
}

.expression-audio-intro {
 color: var(--ink);
 font-size: 1.08rem;
 font-weight: 800;
 letter-spacing: 0.02em;
}

.expression-audio-helper {
 color: rgba(31, 31, 35, 0.58);
 font-size: 0.88rem;
 line-height: 1.55;
 margin-top: 0.35rem;
}

.expression-audio-list {
 border: 1px solid rgba(199, 216, 255, 0.82);
 border-radius: 18px;
 margin-top: 20px;
 overflow: hidden;
}

.expression-audio-row {
 align-items: flex-start;
 background: rgba(242, 244, 248, 0.58);
 display: grid;
 gap: 12px 16px;
 grid-template-columns: auto minmax(0, 1fr);
 padding: 18px;
}

.expression-audio-row + .expression-audio-row {
 border-top: 1px solid rgba(199, 216, 255, 0.72);
}

.expression-audio-badge {
 align-items: center;
 color: var(--cobalt);
 display: inline-flex;
 font-size: 1rem;
 font-weight: 800;
 justify-content: center;
 line-height: 1.5;
 min-width: 1.2rem;
 text-shadow: 0 4px 12px rgba(10, 61, 255, 0.22);
}

.expression-audio-row p {
 color: var(--ink);
 font-size: 1.1rem;
 font-weight: 700;
 line-height: 1.5;
}

.expression-audio-actions {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 grid-column: 2;
 margin-top: 0.15rem;
}

.audio-practice-button {
 align-items: center;
 background: #fff;
 border: 1px solid rgba(216, 27, 114, 0.24);
 border-radius: 999px;
 color: var(--fuchsia);
 display: inline-flex;
 font-size: 0.78rem;
 font-weight: 800;
 gap: 0.38rem;
 letter-spacing: 0.02em;
 padding: 0.62rem 1rem;
}

.audio-practice-button.is-playing {
 background: rgba(10, 61, 255, 0.08);
 border-color: rgba(10, 61, 255, 0.38);
 box-shadow: 0 10px 24px rgba(10, 61, 255, 0.12);
 color: var(--cobalt);
}

/* AUDIO CONTROL ICON SYSTEM */
.audio-control-icon {
 align-items: center;
 background: var(--fuchsia);
 border-radius: 999px;
 color: #fff;
 display: inline-flex;
 height: 24px;
 justify-content: center;
 width: 24px;
}

.audio-control-icon svg {
 height: 14px;
 width: 14px;
}

.audio-practice-button--natural {
 border-color: rgba(0, 151, 167, 0.24);
 color: var(--teal);
}

.audio-practice-button--natural .audio-control-icon {
 background: var(--teal);
}

.expression-audio-error {
 color: var(--fuchsia);
 font-weight: 700;
}

.speaking-task-grid {
 display: grid;
 gap: 18px;
 margin-top: 28px;
}

.speaking-task-grid--single {
 max-width: 980px;
}

.speaking-task-card {
 background: rgba(242, 244, 248, 0.66);
 border: 1px solid rgba(199, 216, 255, 0.82);
 border-radius: 18px;
 padding: clamp(20px, 3vw, 28px);
}

.speaking-task-card--primary {
 background:
 linear-gradient(135deg, rgba(0, 151, 167, 0.08), rgba(255, 255, 255, 0.92)),
 #fff;
 border-color: rgba(0, 151, 167, 0.22);
}

.speaking-task-card--secondary {
 background:
 linear-gradient(135deg, rgba(10, 61, 255, 0.06), rgba(255, 255, 255, 0.95)),
 #fff;
}

.lesson-card-title,
.speaking-task-card h4 {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(1.68rem, 2.08vw, 2.05rem);
 line-height: 0.98;
 margin: 0 0 0.15rem;
 text-transform: uppercase;
}

.speaking-task-card p {
 color: rgba(31, 31, 35, 0.76);
 font-size: 0.98rem;
 line-height: 1.62;
 margin-top: 1rem;
}

.speaking-task-card ul {
 display: grid;
 gap: 0.55rem;
 margin-top: 1rem;
}

.speaking-task-card li {
 color: rgba(31, 31, 35, 0.76);
 font-size: 0.95rem;
 line-height: 1.5;
 padding-left: 1.35rem;
 position: relative;
}

.speaking-task-card li::before {
 background: var(--teal);
 border-radius: 999px;
 content: "";
 height: 0.44rem;
 left: 0;
 position: absolute;
 top: 0.52rem;
 width: 0.44rem;
}

.speaking-task-expression-list li::before {
 background: transparent;
 color: var(--cobalt);
 content: "\2713";
 font-size: 0.92rem;
 font-weight: 800;
 height: auto;
 top: 0;
 width: auto;
}

.speaking-task-label {
 color: var(--ink) !important;
 font-weight: 800;
}

.speaking-task-closing {
 border-top: 1px solid rgba(199, 216, 255, 0.82);
 color: var(--ink) !important;
 font-weight: 800;
 padding-top: 1rem;
}

.speaking-recorder {
 background:
 linear-gradient(135deg, rgba(255,255,255,.94), rgba(242,244,248,.78)),
 radial-gradient(circle at 14% 0%, rgba(10,61,255,.08), transparent 38%),
 radial-gradient(circle at 88% 100%, rgba(0,151,167,.1), transparent 42%);
 border: 1px solid rgba(199, 216, 255, 0.78);
 border-radius: 18px;
 margin-top: 1.6rem;
 padding: clamp(18px, 3vw, 24px);
}

.speaking-recorder__header {
 align-items: flex-start;
 display: flex;
 gap: 1rem;
 justify-content: space-between;
}

.speaking-recorder__header h5 {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(1.45rem, 2vw, 1.8rem);
 letter-spacing: 0;
 line-height: 1;
 margin: 0;
 text-transform: uppercase;
}

.speaking-recorder__header p,
.speaking-recorder__message {
 color: rgba(31, 31, 35, 0.66);
 font-size: 0.86rem;
 line-height: 1.5;
 margin-top: 0.45rem;
}

.speaking-recorder__status {
 align-items: center;
 background: rgba(255,255,255,.78);
 border: 1px solid rgba(199,216,255,.82);
 border-radius: 999px;
 color: rgba(31,31,35,.74);
 display: inline-flex;
 flex: 0 0 auto;
 font-size: 0.78rem;
 font-weight: 800;
 gap: 0.48rem;
 letter-spacing: 0.08em;
 padding: 0.48rem 0.72rem;
 text-transform: uppercase;
}

.speaking-recorder__dot {
 background: var(--teal);
 border-radius: 999px;
 box-shadow: 0 0 0 4px rgba(0,151,167,.12);
 height: 8px;
 width: 8px;
}

.speaking-recorder.is-recording .speaking-recorder__dot {
 animation: recorder-pulse 1.1s ease-in-out infinite;
 background: var(--fuchsia);
 box-shadow: 0 0 0 4px rgba(216,27,114,.12);
}

.speaking-recorder__wave {
 align-items: center;
 display: flex;
 gap: 7px;
 height: 34px;
 margin-top: 1.05rem;
}

.speaking-recorder__wave span {
 background: linear-gradient(180deg, rgba(10,61,255,.68), rgba(0,151,167,.54));
 border-radius: 999px;
 display: block;
 height: 10px;
 opacity: 0.52;
 width: 3px;
}

.speaking-recorder__wave span:nth-child(2) { height: 18px; }
.speaking-recorder__wave span:nth-child(3) { height: 26px; }
.speaking-recorder__wave span:nth-child(4) { height: 16px; }
.speaking-recorder__wave span:nth-child(5) { height: 22px; }

.speaking-recorder.is-recording .speaking-recorder__wave span {
 animation: recorder-wave 0.92s ease-in-out infinite;
}

.speaking-recorder.is-recording .speaking-recorder__wave span:nth-child(2) { animation-delay: .08s; }
.speaking-recorder.is-recording .speaking-recorder__wave span:nth-child(3) { animation-delay: .16s; }
.speaking-recorder.is-recording .speaking-recorder__wave span:nth-child(4) { animation-delay: .24s; }
.speaking-recorder.is-recording .speaking-recorder__wave span:nth-child(5) { animation-delay: .32s; }

.speaking-recorder__actions {
 display: flex;
 flex-wrap: wrap;
 gap: 0.72rem;
 margin-top: 1rem;
}

.speaking-recorder__button {
 align-items: center;
 border: 1px solid transparent;
 border-radius: 999px;
 cursor: pointer;
 display: inline-flex;
 font-size: 0.86rem;
 font-weight: 800;
 justify-content: center;
 min-height: 42px;
 padding: 0.7rem 1rem;
 transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease, background .2s ease;
}

.speaking-recorder__button:disabled {
 cursor: not-allowed;
 opacity: 0.42;
}

.speaking-recorder__button:not(:disabled):hover {
 transform: translateY(-1px);
}

.speaking-recorder__button--record {
 background: var(--cobalt);
 box-shadow: 0 12px 24px -16px rgba(10,61,255,.7);
 color: #fff;
}

.speaking-recorder__button--stop,
.speaking-recorder__button--delete {
 background: rgba(216,27,114,.1);
 border-color: rgba(216,27,114,.22);
 color: var(--fuchsia);
}

.speaking-recorder__button--play {
 background: rgba(0,151,167,.1);
 border-color: rgba(0,151,167,.22);
 color: var(--teal);
}

.speaking-recorder__button--stop:not(:disabled):hover,
.speaking-recorder__button--delete:not(:disabled):hover {
 background: rgba(216,27,114,.14);
 box-shadow: 0 12px 24px -18px rgba(216,27,114,.45);
}

.speaking-recorder__button--play:not(:disabled):hover {
 background: rgba(0,151,167,.14);
 box-shadow: 0 12px 24px -18px rgba(0,151,167,.42);
}

@keyframes recorder-pulse {
 0%, 100% { transform: scale(1); }
 50% { transform: scale(1.28); }
}

@keyframes recorder-wave {
 0%, 100% { transform: scaleY(.72); }
 50% { transform: scaleY(1.08); }
}

@media (max-width: 640px) {
 .speaking-recorder__header {
 align-items: flex-start;
 flex-direction: column;
 }

 .speaking-recorder__actions {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .speaking-recorder__button {
 width: 100%;
 }
}

.reflection-task-card {
 background:
 linear-gradient(135deg, rgba(216, 27, 114, 0.06), rgba(255, 255, 255, 0.95)),
 #fff;
 border: 1px solid rgba(216, 27, 114, 0.16);
 border-radius: 18px;
 display: grid;
 gap: 20px;
 margin-top: 28px;
 padding: clamp(20px, 3vw, 28px);
}

.reflection-task-label {
 color: var(--ink);
 font-size: 0.82rem;
 font-weight: 800;
 letter-spacing: 0.12em;
 text-transform: uppercase;
}

.reflection-bullet-list {
 display: grid;
 gap: 0.7rem;
 margin-top: 1rem;
}

.reflection-bullet-list li {
 color: rgba(31, 31, 35, 0.76);
 font-size: 0.96rem;
 line-height: 1.5;
 padding-left: 1.45rem;
 position: relative;
}

.reflection-bullet-list li::before {
 background: var(--cobalt);
 border-radius: 999px;
 content: "";
 height: 0.42rem;
 left: 0;
 position: absolute;
 top: 0.58rem;
 width: 0.42rem;
}

.reflection-bullet-list--fuchsia li::before {
 background: var(--fuchsia);
}

.reflection-bullet-list--cobalt li::before {
 background: var(--cobalt);
}

.reflection-closing {
 border-top: 1px solid rgba(216, 27, 114, 0.16);
 color: var(--ink) !important;
 font-weight: 800;
 padding-top: 1rem;
}

@media (min-width: 900px) {
 .practice-stage-grid {
 align-items: stretch;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .expression-audio-row {
 grid-template-columns: auto minmax(0, 1fr);
 }

 .expression-audio-actions {
 justify-content: flex-start;
 }

 .speaking-task-grid {
 align-items: start;
 grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
 }

 .speaking-task-grid--single {
 grid-template-columns: minmax(0, 1fr);
 }

 .reflection-task-card {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .reflection-closing {
 grid-column: 1 / -1;
 }
}

.day-one-quiz-app {
 margin: 40px auto 0;
 max-width: 980px;
 scroll-margin-top: 120px;
}

.day-one-quiz-card {
 --quiz-accent: var(--cobalt);
 background:
 radial-gradient(circle at 96% 0, rgba(10, 61, 255, 0.1), transparent 34%),
 linear-gradient(180deg, #fff, #f7f9fc);
 border: 1px solid rgba(10, 61, 255, 0.16);
 border-radius: 22px;
 box-shadow: 0 16px 46px rgba(15, 23, 42, 0.075);
 padding: clamp(22px, 3vw, 34px);
}

.day-one-quiz-card--cobalt {
 --quiz-accent: var(--cobalt);
}

.day-one-quiz-card--teal {
 --quiz-accent: var(--teal);
}

.day-one-quiz-card--fuchsia {
 --quiz-accent: var(--fuchsia);
}

.day-one-quiz-header {
 align-items: center;
 display: grid;
 gap: 18px;
 grid-template-columns: auto minmax(0, 1fr) auto;
}

.day-one-quiz-icon {
 align-items: center;
 background: var(--quiz-accent);
 border-radius: 999px;
 box-shadow: 0 0 0 10px color-mix(in srgb, var(--quiz-accent) 12%, transparent), 0 16px 34px color-mix(in srgb, var(--quiz-accent) 20%, transparent);
 color: #fff;
 display: inline-flex;
 height: 56px;
 justify-content: center;
 width: 56px;
}

.day-one-quiz-icon svg {
 height: 28px;
 width: 28px;
}

.day-one-quiz-kicker {
 color: var(--quiz-accent);
 font-size: 0.74rem;
 font-weight: 800;
 letter-spacing: 0.18em;
 text-transform: uppercase;
}

.day-one-quiz-skill {
 color: rgba(31, 31, 35, 0.72);
 font-size: 0.88rem;
 font-weight: 800;
 line-height: 1.4;
 margin-top: 0.55rem;
}

.day-one-quiz-title {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(1.95rem, 3vw, 2.32rem);
 font-weight: 400;
 letter-spacing: 0;
 line-height: 0.98;
 margin-top: 0.25rem;
 text-transform: uppercase;
}

.day-one-quiz-count {
 color: rgba(31, 31, 35, 0.62);
 font-size: 0.9rem;
 font-weight: 800;
 white-space: nowrap;
}

.day-one-quiz-progress {
 background: rgba(199, 216, 255, 0.7);
 border-radius: 999px;
 height: 8px;
 margin-top: 22px;
 overflow: hidden;
}

.day-one-quiz-progress span {
 background: linear-gradient(90deg, var(--quiz-accent), color-mix(in srgb, var(--quiz-accent) 62%, #ffffff));
 border-radius: inherit;
 display: block;
 height: 100%;
 transition: width 0.25s ease;
}

.day-one-quiz-context {
 background: rgba(242, 244, 248, 0.82);
 border: 1px solid var(--icy);
 border-radius: 16px;
 display: grid;
 gap: 16px;
 margin-top: 24px;
 padding: 18px;
}

.day-one-quiz-label {
 color: var(--quiz-accent);
 font-size: 0.72rem;
 font-weight: 800;
 letter-spacing: 0.16em;
 text-transform: uppercase;
}

.day-one-quiz-context p,
.day-one-quiz-feedback p {
 color: rgba(31, 31, 35, 0.78);
 font-size: 0.96rem;
 line-height: 1.62;
}

.day-one-quiz-options {
 display: grid;
 gap: 12px;
 margin-top: 22px;
}

.day-one-quiz-option {
 align-items: flex-start;
 background: #fff;
 border: 1.5px solid rgba(199, 216, 255, 0.95);
 border-radius: 16px;
 box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
 color: var(--ink);
 cursor: pointer;
 display: grid;
 gap: 14px;
 grid-template-columns: auto minmax(0, 1fr);
 padding: 16px 18px;
 text-align: left;
 transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, background 0.18s ease;
 width: 100%;
}

.day-one-quiz-option:hover,
.day-one-quiz-option:focus-visible {
 border-color: var(--quiz-accent);
 box-shadow: 0 12px 30px color-mix(in srgb, var(--quiz-accent) 16%, transparent);
 outline: none;
 transform: translateY(-1px);
}

.day-one-quiz-option.is-selected {
 background: color-mix(in srgb, var(--quiz-accent) 7%, #ffffff);
 border-color: var(--quiz-accent);
}

.day-one-quiz-option.is-correct {
 background: color-mix(in srgb, var(--quiz-accent) 9%, #ffffff);
 border-color: var(--quiz-accent);
}

.day-one-quiz-option.is-incorrect {
 background: rgba(216, 27, 114, 0.055);
 border-color: rgba(216, 27, 114, 0.56);
}

.day-one-quiz-option[disabled] {
 cursor: default;
}

.day-one-quiz-letter {
 align-items: center;
 background: var(--cool);
 border: 1px solid var(--icy);
 border-radius: 999px;
 color: var(--quiz-accent);
 display: inline-flex;
 flex: 0 0 auto;
 font-size: 0.85rem;
 font-weight: 900;
 height: 34px;
 justify-content: center;
 width: 34px;
}

.day-one-quiz-option.is-selected .day-one-quiz-letter {
 background: var(--quiz-accent);
 border-color: var(--quiz-accent);
 color: #fff;
}

.day-one-quiz-option.is-correct .day-one-quiz-letter {
 background: var(--quiz-accent);
 border-color: var(--quiz-accent);
 color: #fff;
}

.day-one-quiz-option.is-incorrect .day-one-quiz-letter {
 background: var(--fuchsia);
 border-color: var(--fuchsia);
 color: #fff;
}

.day-one-quiz-actions {
 align-items: center;
 display: flex;
 flex-wrap: wrap;
 gap: 12px;
 margin-top: 22px;
}

.day-one-quiz-actions .btn-primary,
.day-one-quiz-actions .btn-outline {
 min-width: 180px;
}

.day-one-quiz-actions button:disabled {
 cursor: not-allowed;
 opacity: 0.45;
 transform: none;
}

.day-one-quiz-action {
 background: var(--quiz-accent);
 box-shadow: 0 12px 30px -10px color-mix(in srgb, var(--quiz-accent) 72%, transparent);
}

.day-one-quiz-action:hover {
 background: color-mix(in srgb, var(--quiz-accent) 84%, #000);
}

.day-one-quiz-feedback {
 background: #0a0a0a;
 border: 1px solid rgba(199, 216, 255, 0.22);
 border-radius: 18px;
 color: #fff;
 margin-top: 24px;
 padding: 20px;
}

.day-one-quiz-feedback p {
 color: rgba(242, 244, 248, 0.82);
}

.day-one-quiz-feedback-grid {
 display: grid;
 gap: 14px;
 margin-top: 16px;
}

.day-one-quiz-feedback-item {
 background: rgba(255, 255, 255, 0.06);
 border: 1px solid rgba(255, 255, 255, 0.09);
 border-radius: 14px;
 padding: 14px;
}

.day-one-quiz-feedback-item strong {
 color: #fff;
 display: block;
 font-size: 0.82rem;
 letter-spacing: 0.11em;
 margin-bottom: 0.35rem;
 text-transform: uppercase;
}

.day-one-quiz-feedback-item.best {
 border-color: rgba(0, 151, 167, 0.5);
}

.day-one-quiz-complete {
 align-items: center;
 box-sizing: border-box;
 display: grid;
 gap: 18px;
 justify-items: center;
 max-width: 100%;
 overflow-wrap: break-word;
 padding: clamp(26px, 4vw, 42px) 20px;
 scroll-margin-top: 80px;
 text-align: center;
 width: 100%;
}

.day-one-quiz-complete-icon {
 align-items: center;
 background: linear-gradient(135deg, var(--cobalt), var(--teal));
 border-radius: 999px;
 box-shadow: 0 0 0 12px rgba(10, 61, 255, 0.08), 0 16px 34px rgba(10, 61, 255, 0.18);
 color: #fff;
 display: inline-flex;
 height: 70px;
 justify-content: center;
 width: 70px;
}

.day-one-quiz-complete h4 {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(2.35rem, 8vw, 4.3rem);
 line-height: 0.95;
}

.day-one-quiz-complete p {
 color: rgba(31, 31, 35, 0.78);
 line-height: 1.6;
}

.day-one-quiz-score {
 background: rgba(10, 61, 255, 0.08);
 border: 1px solid rgba(10, 61, 255, 0.16);
 border-radius: 999px;
 color: var(--cobalt);
 font-weight: 800;
 padding: 0.65rem 1.05rem;
}

.quiz-result .btn-primary {
 max-width: 100%;
 overflow-wrap: anywhere;
 text-align: center;
 white-space: normal;
}

@media (min-width: 760px) {
 .day-one-quiz-context {
 grid-template-columns: 1fr 1fr;
 }

 .day-one-quiz-feedback-grid {
 grid-template-columns: 1fr 1fr;
 }

 .day-one-quiz-feedback-item.best {
 grid-column: 1 / -1;
 }
}

@media (max-width: 640px) {
 .day-one-quiz-app {
 margin-top: 32px;
 }

 .day-one-quiz-header {
 align-items: flex-start;
 gap: 15px;
 grid-template-columns: 48px minmax(0, 1fr);
 }

 .day-one-quiz-header > div {
 min-width: 0;
 }

 .day-one-quiz-icon {
 box-shadow: 0 10px 22px color-mix(in srgb, var(--quiz-accent) 14%, transparent);
 height: 48px;
 width: 48px;
 }

 .day-one-quiz-icon svg {
 height: 22px;
 width: 22px;
 }

 .day-one-quiz-count {
 display: none;
 }

 .day-one-quiz-option {
 padding: 14px;
 }

 .day-one-quiz-complete {
 padding: 32px 20px;
 }

 .quiz-result .btn-primary {
 justify-content: center;
 width: 100%;
 }

 .day-one-quiz-actions .btn-primary,
 .day-one-quiz-actions .btn-outline {
 justify-content: center;
 width: 100%;
 }
}

/* SECTION HEADER SYSTEM */
.challenge-day-page .section-header,
.challenge-day-page .day-one-quiz-intro__header,
.challenge-day-page .expressions-intro-header,
.challenge-day-page .practice-stage-header,
.challenge-day-page .coming-tomorrow-card {
 align-items: flex-start;
 display: grid;
 gap: 22px;
 grid-template-columns: 64px minmax(0, 1fr);
}

.challenge-day-page .day-one-quiz-intro__badge,
.challenge-day-page .expressions-intro-badge,
.challenge-day-page .practice-stage-badge {
 min-height: 64px;
}

.challenge-day-page .section-icon,
.challenge-day-page .day-one-quiz-intro__quote.section-icon,
.challenge-day-page .expressions-intro-icon.section-icon,
.challenge-day-page .practice-stage-icon.section-icon,
.challenge-day-page .coming-tomorrow-marker.section-icon {
 align-items: center;
 border-radius: 999px;
 display: inline-flex;
 height: 64px;
 justify-content: center;
 width: 64px;
}

.challenge-day-page .section-icon svg,
.challenge-day-page .day-one-quiz-intro__quote.section-icon svg,
.challenge-day-page .expressions-intro-icon.section-icon svg,
.challenge-day-page .practice-stage-icon.section-icon svg {
 height: 28px;
 width: 28px;
}

.challenge-day-page .section-kicker,
.challenge-day-page .day-one-quiz-intro__pill.section-kicker,
.challenge-day-page .expressions-intro-pill.section-kicker {
 align-items: center;
 border-radius: 999px;
 display: inline-flex;
 font-size: 0.75rem;
 font-weight: 800;
 letter-spacing: 0.18em;
 line-height: 1;
 min-height: 32px;
 padding: 0.52rem 0.95rem;
 text-transform: uppercase;
}

.challenge-day-page .section-title,
.challenge-day-page .day-one-quiz-intro__heading .section-title,
.challenge-day-page .expressions-intro-copy .section-title,
.challenge-day-page .practice-stage-copy .section-title,
.challenge-day-page .coming-tomorrow-card .section-title {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: 2.75rem;
 font-weight: 400;
 letter-spacing: 0;
 line-height: 0.98;
 margin-top: 0.8rem;
 text-transform: uppercase;
}

.challenge-day-page .section-description,
.challenge-day-page .day-one-quiz-intro__heading .section-description,
.challenge-day-page .expressions-intro-copy .section-description,
.challenge-day-page .practice-stage-copy .section-description,
.challenge-day-page .coming-tomorrow-card .section-description {
 color: rgba(31, 31, 35, 0.76);
 font-size: 1.375rem;
 line-height: 1.45;
 margin-top: 1rem;
 max-width: 780px;
}

.challenge-day-page .day-one-quiz-intro__header .day-one-quiz-intro__visual {
 grid-column: 1 / -1;
}

/* Phrase Quiz intro special variant:
 desktop = icon + text + illustration;
 mobile = icon + text, illustration below. */
@media (min-width: 1100px) {
 .challenge-day-page .day-one-quiz-intro__header {
 align-items: center;
 grid-template-columns: 64px minmax(0, 1.85fr) minmax(280px, 1fr);
 }

 .challenge-day-page .day-one-quiz-intro__header .day-one-quiz-intro__visual {
 grid-column: auto;
 }
}

/* MOBILE HEADER SYSTEM */
@media (max-width: 799px) {
 .challenge-day-page .section-header,
 .challenge-day-page .day-one-quiz-intro__header,
 .challenge-day-page .expressions-intro-header,
 .challenge-day-page .practice-stage-header,
 .challenge-day-page .coming-tomorrow-card {
 align-items: flex-start;
 gap: 15px;
 grid-template-columns: 48px minmax(0, 1fr);
 text-align: left;
 }

 .challenge-day-page .day-one-quiz-intro__header .day-one-quiz-intro__visual,
 .challenge-day-page .coming-tomorrow-card .coming-tomorrow-points,
 .challenge-day-page .coming-tomorrow-card .btn-primary {
 grid-column: 1 / -1;
 }

 .challenge-day-page .section-icon,
 .challenge-day-page .day-one-quiz-intro__quote.section-icon,
 .challenge-day-page .expressions-intro-icon.section-icon,
 .challenge-day-page .practice-stage-icon.section-icon,
 .challenge-day-page .coming-tomorrow-marker.section-icon {
 height: 48px;
 width: 48px;
 }

 .challenge-day-page .section-icon svg,
 .challenge-day-page .day-one-quiz-intro__quote.section-icon svg,
 .challenge-day-page .expressions-intro-icon.section-icon svg,
 .challenge-day-page .practice-stage-icon.section-icon svg {
 height: 22px;
 width: 22px;
 }

 .challenge-day-page .day-one-quiz-intro__badge,
 .challenge-day-page .expressions-intro-badge,
 .challenge-day-page .practice-stage-badge {
 min-height: 48px;
 }

 .challenge-day-page .day-one-quiz-intro__dots {
 display: none;
 }

 .challenge-day-page .section-icon,
 .challenge-day-page .day-one-quiz-intro__quote.section-icon,
 .challenge-day-page .expressions-intro-icon.section-icon,
 .challenge-day-page .practice-stage-icon.section-icon,
 .challenge-day-page .coming-tomorrow-marker.section-icon {
 box-shadow: 0 10px 22px rgba(10, 61, 255, 0.12);
 }

 .challenge-day-page .section-icon--teal,
 .challenge-day-page .practice-stage-icon.section-icon--teal {
 box-shadow: 0 10px 22px rgba(0, 151, 167, 0.12);
 }

 .challenge-day-page .section-icon--fuchsia,
 .challenge-day-page .expressions-intro-icon.section-icon--fuchsia {
 box-shadow: 0 10px 22px rgba(216, 27, 114, 0.12);
 }

 .challenge-day-page .coming-tomorrow-marker.section-icon {
 font-size: 1.55rem;
 }

 .challenge-day-page .day-one-quiz-intro__heading p {
 margin-left: 0;
 margin-right: 0;
 }

 .challenge-day-page .section-header-copy,
 .challenge-day-page .day-one-quiz-intro__heading,
 .challenge-day-page .expressions-intro-copy,
 .challenge-day-page .practice-stage-copy,
 .challenge-day-page .coming-tomorrow-content {
 min-width: 0;
 }
}

@media (max-width: 640px) {
 .challenge-day-page .section-title,
 .challenge-day-page .day-one-quiz-intro__heading .section-title,
 .challenge-day-page .expressions-intro-copy .section-title,
 .challenge-day-page .practice-stage-copy .section-title,
 .challenge-day-page .coming-tomorrow-card .section-title {
 font-size: 2.35rem;
 }

 .challenge-day-page .day-one-quiz-intro__card-title {
 font-size: 1.65rem;
 }

 .challenge-day-page .section-description,
 .challenge-day-page .day-one-quiz-intro__heading .section-description,
 .challenge-day-page .expressions-intro-copy .section-description,
 .challenge-day-page .practice-stage-copy .section-description,
 .challenge-day-page .coming-tomorrow-card .section-description {
 font-size: 1.05rem;
 }
}

.challenge-day-nav {
 display: flex;
 flex-wrap: wrap;
 gap: 14px;
 align-items: center;
 justify-content: space-between;
 border-top: 1px solid #e6e9f1;
 border-bottom: 1px solid #e6e9f1;
 padding: 24px 0;
}
.challenge-mini-nav {
 background: rgba(242, 244, 248, 0.88);
 border-bottom: 1px solid rgba(10, 61, 255, 0.1);
 border-top: 1px solid rgba(242, 244, 248, 0.36);
 box-shadow: 0 18px 40px -34px rgba(10, 10, 10, 0.32);
 overflow-x: auto;
 position: sticky;
 top: 56px;
 z-index: 35;
 -webkit-overflow-scrolling: touch;
}

.challenge-mini-nav__scroller {
 align-items: center;
 display: flex;
 gap: 0.6rem;
 margin: 0 auto;
 max-width: 80rem;
 min-width: max-content;
 padding: 0.7rem 1.5rem;
}

.challenge-mini-nav__link {
 align-items: center;
 background: rgba(255, 255, 255, 0.82);
 border: 1px solid rgba(199, 216, 255, 0.72);
 border-radius: 999px;
 color: rgba(31, 31, 35, 0.78);
 display: inline-flex;
 font-size: 0.82rem;
 font-weight: 800;
 justify-content: center;
 min-height: 2.25rem;
 padding: 0.55rem 1rem;
 text-decoration: none;
 transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease, color 180ms ease, transform 180ms ease;
 white-space: nowrap;
}

.challenge-mini-nav__link:hover,
.challenge-mini-nav__link:focus-visible {
 background: #fff;
 border-color: rgba(10, 61, 255, 0.28);
 box-shadow: 0 12px 24px -18px rgba(10, 61, 255, 0.45);
 color: var(--ink);
 transform: translateY(-1px);
}

.challenge-mini-nav__link.is-current {
 background: var(--cobalt);
 border-color: var(--cobalt);
 box-shadow: 0 16px 30px -18px rgba(10, 61, 255, 0.7);
 color: #fff;
}

.challenge-review-header {
 margin-bottom: 1.35rem;
 max-width: 48rem;
}

.challenge-review-header p {
 color: rgba(31, 31, 35, 0.72);
 font-size: 1rem;
 line-height: 1.65;
 margin-top: 0.65rem;
}

.challenge-review-title {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(2.25rem, 4vw, 3.5rem);
 line-height: 0.98;
 margin-top: 0.7rem;
 text-transform: uppercase;
}

.challenge-expression-bank,
.challenge-bottom-map {
 background:
 radial-gradient(circle at 8% 0%, rgba(10, 61, 255, 0.08), transparent 30%),
 linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(242, 244, 248, 0.92));
 border: 1px solid rgba(10, 61, 255, 0.12);
 border-radius: 24px;
 box-shadow: 0 24px 60px -46px rgba(10, 10, 10, 0.42);
 margin-bottom: 1.5rem;
 padding: clamp(1.25rem, 3vw, 2rem);
}

.challenge-expression-bank__list {
 display: grid;
 gap: 0.75rem;
}

.challenge-expression-bank details {
 background: rgba(255, 255, 255, 0.84);
 border: 1px solid rgba(199, 216, 255, 0.72);
 border-radius: 16px;
 padding: 0.15rem 1rem 0.15rem 1.35rem;
}

.challenge-expression-bank summary {
 color: var(--ink);
 cursor: pointer;
 font-size: 0.9rem;
 font-weight: 800;
 list-style-position: inside;
 padding: 0.9rem 0;
 text-transform: uppercase;
}

.challenge-expression-bank summary::marker {
 color: var(--teal);
}

.challenge-expression-bank ul {
 border-top: 1px solid rgba(199, 216, 255, 0.62);
 color: rgba(31, 31, 35, 0.76);
 display: grid;
 font-size: 0.94rem;
 gap: 0.55rem;
 line-height: 1.55;
 padding: 0.85rem 0 1rem 1.1rem;
}

.challenge-bottom-map__grid {
 display: grid;
 gap: 0.9rem;
 grid-template-columns: repeat(5, minmax(0, 1fr));
}

.challenge-bottom-map__card {
 --challenge-map-glow: rgba(10, 61, 255, 0.18);
 --challenge-map-glow-soft: rgba(0, 151, 167, 0.11);
 --challenge-map-top-light: rgba(242, 244, 248, 0.12);
 background:
 linear-gradient(180deg, rgba(255,255,255,0.09), transparent 38%),
 radial-gradient(circle at 50% -20%, var(--challenge-map-top-light), transparent 48%),
 rgba(10, 10, 10, 0.94);
 border: 1px solid rgba(242, 244, 248, 0.12);
 border-radius: 18px;
 box-shadow:
 inset 0 1px 0 rgba(255, 255, 255, 0.1),
 0 18px 42px -34px rgba(0, 0, 0, 0.72);
 box-sizing: border-box;
 color: #fff;
 display: flex;
 flex-direction: column;
 gap: 0.65rem;
 isolation: isolate;
 min-height: 9rem;
 overflow: visible;
 padding: 1rem;
 position: relative;
 text-decoration: none;
 transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.challenge-bottom-map__card::before {
 background:
 linear-gradient(90deg, transparent, rgba(242, 244, 248, 0.14), transparent),
 radial-gradient(circle at 18% 0%, rgba(10, 61, 255, 0.13), transparent 42%),
 radial-gradient(circle at 82% 0%, rgba(0, 151, 167, 0.11), transparent 38%);
 border-radius: inherit;
 content: "";
 inset: 1px;
 opacity: 0.68;
 pointer-events: none;
 position: absolute;
 z-index: 0;
}

.challenge-bottom-map__card::after {
 background:
 radial-gradient(ellipse at 50% 60%, var(--challenge-map-glow), transparent 62%),
 radial-gradient(ellipse at 18% 74%, var(--challenge-map-glow-soft), transparent 56%);
 border-radius: 999px;
 bottom: -16px;
 content: "";
 filter: blur(16px);
 height: 42px;
 left: 12%;
 opacity: 0.38;
 pointer-events: none;
 position: absolute;
 right: 12%;
 transform: translateZ(0);
 transition: opacity 180ms ease, transform 180ms ease, filter 180ms ease;
 z-index: -1;
}

.challenge-bottom-map__card:nth-child(2) {
 --challenge-map-glow: rgba(0, 151, 167, 0.18);
 --challenge-map-glow-soft: rgba(10, 61, 255, 0.1);
}

.challenge-bottom-map__card:nth-child(3) {
 --challenge-map-glow: rgba(10, 61, 255, 0.16);
 --challenge-map-glow-soft: rgba(216, 27, 114, 0.06);
}

.challenge-bottom-map__card:nth-child(4) {
 --challenge-map-glow: rgba(0, 151, 167, 0.16);
 --challenge-map-glow-soft: rgba(216, 27, 114, 0.055);
}

.challenge-bottom-map__card:nth-child(5) {
 --challenge-map-glow: rgba(10, 61, 255, 0.18);
 --challenge-map-glow-soft: rgba(0, 151, 167, 0.1);
}

.challenge-bottom-map__card span {
 color: var(--icy);
 font-size: 0.75rem;
 font-weight: 800;
 letter-spacing: 0.08em;
 position: relative;
 text-transform: uppercase;
}

.challenge-bottom-map__card strong {
 font-size: 0.98rem;
 line-height: 1.35;
 margin-top: auto;
 position: relative;
}

.challenge-bottom-map__card:hover,
.challenge-bottom-map__card:focus-visible {
 background:
 linear-gradient(180deg, rgba(255,255,255,0.12), transparent 40%),
 radial-gradient(circle at 50% -20%, rgba(242, 244, 248, 0.16), transparent 50%),
 rgba(10, 10, 10, 0.965);
 border-color: rgba(10, 61, 255, 0.45);
 box-shadow:
 inset 0 1px 0 rgba(255, 255, 255, 0.14),
 0 24px 48px -34px rgba(10, 10, 10, 0.82);
 transform: translateY(-2px);
}

.challenge-bottom-map__card:hover::after,
.challenge-bottom-map__card:focus-visible::after {
 filter: blur(18px);
 opacity: 0.58;
 transform: translateY(3px) scale(1.04);
}

.challenge-bottom-map__card.is-current {
 --challenge-map-glow: rgba(10, 61, 255, 0.26);
 --challenge-map-glow-soft: rgba(0, 151, 167, 0.17);
 --challenge-map-top-light: rgba(242, 244, 248, 0.18);
 border-color: rgba(10, 61, 255, 0.9);
 box-shadow:
 inset 0 1px 0 rgba(255, 255, 255, 0.17),
 0 26px 52px -34px rgba(10, 61, 255, 0.72);
}

.challenge-bottom-map__card.is-current::after {
 opacity: 0.62;
 transform: translateY(2px) scale(1.05);
}

.challenge-bottom-map__card.is-current span::after {
 background: var(--fuchsia);
 border-radius: 999px;
 box-shadow: 0 0 18px rgba(216, 27, 114, 0.32);
 content: "";
 height: 0.42rem;
 position: absolute;
 right: -0.2rem;
 top: -0.2rem;
 width: 0.42rem;
}

.challenge-bottom-map__actions {
 align-items: center;
 display: flex;
 flex-wrap: wrap;
 gap: 0.9rem;
 margin-top: 1.4rem;
}
.cta-panel {
 border-radius: 22px;
 background: var(--ink);
 color: #fff;
 padding: 34px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 24px;
}

@media (max-width: 1023px) {
 .challenge-bottom-map__grid {
 grid-template-columns: repeat(3, minmax(0, 1fr));
 }

 .resource-grid,
 .challenge-day-page .placeholder-grid {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }
}

@media (min-width: 1024px) {
 .challenge-mini-nav {
 top: 68px;
 }
}

@media (max-width: 767px) {
 .challenge-day-path-section h2 {
 text-align: center;
 }

 .challenge-day-path-section .section-description {
 margin-left: auto;
 margin-right: auto;
 text-align: center;
 }

 .mobile-learning-path-compact {
 align-items: center;
 color: rgba(31, 31, 35, 0.74);
 display: flex;
 flex-wrap: wrap;
 font-size: 0.78rem;
 font-weight: 800;
 gap: 0.45rem;
 justify-content: center;
 letter-spacing: 0.04em;
 margin-left: auto;
 margin-right: auto;
 margin-top: 1.4rem;
 max-width: 340px;
 text-align: center;
 text-transform: uppercase;
 }

 .mobile-learning-path-compact span {
 align-items: center;
 display: inline-flex;
 }

 .mobile-learning-path-compact span:not(:last-child)::after {
 color: var(--teal);
 content: ">";
 margin-left: 0.45rem;
 }

 .mobile-learning-path-toggle {
 align-items: center;
 background: #fff;
 border: 1px solid rgba(199, 216, 255, 0.9);
 border-radius: 999px;
 color: var(--cobalt);
 display: flex;
 font-size: 0.82rem;
 font-weight: 800;
 justify-content: center;
 margin-left: auto;
 margin-right: auto;
 margin-top: 1.1rem;
 min-height: 42px;
 padding: 0.7rem 1rem;
 text-transform: uppercase;
 }

 .mobile-learning-path-toggle:focus-visible {
 outline: 3px solid rgba(10, 61, 255, 0.28);
 outline-offset: 3px;
 }

 .challenge-day-page .lesson-overview-grid[data-learning-path-cards] {
 display: none;
 margin-top: 1.2rem;
 }

 .challenge-day-page .lesson-overview-grid[data-learning-path-cards].is-open {
 display: grid;
 }

 .challenge-day-page .lesson-overview-card {
 min-height: 150px;
 padding: 18px;
 }

 .challenge-mini-nav {
 top: 56px;
 }

 .challenge-mini-nav__scroller {
 padding-left: 1rem;
 padding-right: 1rem;
 }

 .challenge-bottom-map__grid {
 grid-template-columns: 1fr;
 }

 .challenge-bottom-map__card {
 min-height: 6.75rem;
 }
}

@media (max-width: 640px) {
 .resource-grid,
 .challenge-day-page .placeholder-grid {
 grid-template-columns: 1fr;
 }
 .timeline-grid {
 grid-template-columns: 1fr;
 gap: 18px;
 }
 .timeline-grid .day-card {
 padding: 22px;
 }
 .challenge-day-nav {
 align-items: stretch;
 flex-direction: column;
 }
 .challenge-day-nav .btn-primary,
 .challenge-day-nav .btn-outline,
 .challenge-day-nav .explore-link {
 width: 100%;
 justify-content: center;
 }
 .challenge-bottom-map__actions {
 align-items: stretch;
 flex-direction: column;
 }
 .challenge-bottom-map__actions .btn-primary,
 .challenge-bottom-map__actions .btn-outline {
 justify-content: center;
 width: 100%;
 }
 .cta-panel {
 align-items: stretch;
 flex-direction: column;
 }
 .cta-panel .btn-primary,
 .cta-panel .btn-outline {
 width: 100%;
 }
}

/* FLOATING LESSON MAP */
.floating-lesson-map {
 display: none;
}

@media (max-width: 767px) {
 .floating-lesson-map {
 align-items: flex-end;
 bottom: calc(18px + env(safe-area-inset-bottom, 0px));
 display: flex;
 flex-direction: column;
 gap: 10px;
 pointer-events: none;
 position: fixed;
 right: 18px;
 z-index: 60;
 }

 .floating-lesson-map__button,
 .floating-lesson-map__panel {
 pointer-events: auto;
 }

 .floating-lesson-map__button {
 align-items: center;
 background: var(--ink);
 border: 1px solid rgba(199, 216, 255, 0.24);
 border-radius: 999px;
 box-shadow: 0 16px 34px rgba(10, 10, 10, 0.24);
 color: #fff;
 display: inline-flex;
 font-size: 0.78rem;
 font-weight: 800;
 justify-content: center;
 letter-spacing: 0.08em;
 min-height: 46px;
 padding: 0.85rem 1.1rem;
 text-transform: uppercase;
 }

 .floating-lesson-map__button::after {
 color: var(--teal);
 content: "^";
 font-size: 0.95rem;
 margin-left: 0.55rem;
 }

 .floating-lesson-map.is-open .floating-lesson-map__button::after {
 content: "x";
 }

 .floating-lesson-map__button:focus-visible,
 .floating-lesson-map__panel a:focus-visible {
 outline: 3px solid rgba(10, 61, 255, 0.34);
 outline-offset: 3px;
 }

 .floating-lesson-map__panel {
 background:
 radial-gradient(circle at 100% 0, rgba(10, 61, 255, 0.1), transparent 34%),
 linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(242, 244, 248, 0.98));
 border: 1px solid rgba(199, 216, 255, 0.86);
 border-radius: 18px;
 box-shadow: 0 18px 46px rgba(15, 23, 42, 0.22);
 display: grid;
 gap: 6px;
 max-width: calc(100vw - 36px);
 min-width: min(260px, calc(100vw - 36px));
 padding: 10px;
 }

 .floating-lesson-map__panel[hidden] {
 display: none;
 }

 .floating-lesson-map__panel a {
 align-items: center;
 border-radius: 12px;
 color: var(--ink);
 display: flex;
 font-size: 0.9rem;
 font-weight: 800;
 justify-content: space-between;
 padding: 0.76rem 0.82rem;
 text-decoration: none;
 }

 .floating-lesson-map__panel a::after {
 color: var(--cobalt);
 content: ">";
 font-weight: 900;
 }

 .floating-lesson-map__panel a:hover,
 .floating-lesson-map__panel a:focus-visible {
 background: rgba(10, 61, 255, 0.07);
 }
}

/* ---------- Editorial brand direction pass ---------- */
.section-kicker {
 font-size: 12px;
 font-weight: 800;
 letter-spacing: .24em;
 text-transform: uppercase;
 color: var(--cobalt);
}

.editorial-section,
.challenge-strip {
 position: relative;
 overflow: hidden;
 background:
 radial-gradient(circle at 92% 10%, rgba(10,61,255,.20), transparent 28%),
 linear-gradient(135deg, var(--ink), #111217 72%, #071038);
 color: #fff;
}
.editorial-section::before,
.challenge-strip::before,
.resource-gallery::before,
.about-editorial::before {
 content: "";
 position: absolute;
 width: 190px;
 height: 190px;
 opacity: .18;
 background-image: radial-gradient(circle, rgba(255,255,255,.95) 1.15px, transparent 1.25px);
 background-size: 12px 12px;
 pointer-events: none;
}
.challenge-strip::before {
 right: 18%;
 top: 12px;
}
.challenge-strip::after {
 content: """;
 position: absolute;
 right: 7%;
 top: -26px;
 font-family: Georgia, serif;
 font-size: 150px;
 line-height: 1;
 color: rgba(10,61,255,.42);
 pointer-events: none;
}
.icon-badge {
 width: 52px;
 height: 52px;
 border-radius: 999px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
}
.icon-badge-teal {
 background: var(--teal);
 color: #fff;
 box-shadow: 0 0 0 8px rgba(0,151,167,.13);
}

.hero-rebrand {
 background:
 radial-gradient(circle at 92% 30%, rgba(10, 61, 255, 0.22) 0 15%, transparent 16%),
 radial-gradient(circle at 0% 72%, rgba(10, 61, 255, 0.16) 0 11%, transparent 12%),
 linear-gradient(135deg, #020202 0%, #0a0a0a 58%, #101116 100%);
}
.hero-rebrand::after {
 content: "";
 position: absolute;
 right: 7%;
 top: 18%;
 width: 88px;
 height: 170px;
 background:
 linear-gradient(var(--fuchsia), var(--fuchsia)) top/100% 48% no-repeat,
 linear-gradient(var(--teal), var(--teal)) bottom/100% 52% no-repeat;
 opacity: .82;
 border-radius: 4px;
 pointer-events: none;
}
.hero-line {
 font-size: clamp(22px, 2.1vw, 32px);
 color: #fff;
 font-weight: 600;
}
.hero-portrait-wrap::before {
 content: "";
 position: absolute;
 width: 130px;
 height: 38px;
 right: 10%;
 top: 20%;
 background: repeating-linear-gradient(135deg, #fff 0 7px, transparent 7px 16px);
 opacity: .9;
 transform: rotate(0deg);
 z-index: 1;
}
.hero-portrait-wrap::after {
 content: """;
 position: absolute;
 right: 3%;
 top: 3%;
 font-family: Georgia, serif;
 font-size: 132px;
 line-height: 1;
 color: var(--cobalt);
 opacity: .85;
 z-index: 1;
}
.hero-stairs {
 opacity: .45;
 border-color: rgba(242,244,248,.44);
}

/* Homepage premium editorial hero refinement */
.hero-rebrand {
 min-height: calc(100svh - 68px);
 background:
 radial-gradient(circle at 58% 42%, rgba(10, 61, 255, 0.18), transparent 28%),
 radial-gradient(circle at 78% 26%, rgba(0, 151, 167, 0.13), transparent 24%),
 radial-gradient(circle at 0% 72%, rgba(10, 61, 255, 0.14) 0 11%, transparent 12%),
 linear-gradient(135deg, #020202 0%, #0a0a0a 58%, #101116 100%);
}

.hero-rebrand::before {
 content: "";
 position: absolute;
 left: 43%;
 top: 28%;
 width: 34%;
 height: 38%;
 border-top: 1px solid rgba(199, 216, 255, 0.22);
 border-right: 1px solid rgba(0, 151, 167, 0.18);
 border-radius: 0 999px 0 0;
 box-shadow: 0 -18px 54px rgba(10, 61, 255, 0.08);
 opacity: 0.7;
 pointer-events: none;
}

.hero-rebrand::after {
 right: 6%;
 top: 16%;
 width: 168px;
 height: 168px;
 background:
 radial-gradient(circle at 74% 18%, rgba(216, 27, 114, 0.82) 0 4px, transparent 5px),
 radial-gradient(circle at 25% 72%, rgba(0, 151, 167, 0.28), transparent 34%),
 radial-gradient(circle at 50% 50%, rgba(10, 61, 255, 0.26), transparent 58%);
 border: 1px solid rgba(199, 216, 255, 0.18);
 border-radius: 999px;
 box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 24px 70px rgba(10, 61, 255, 0.12);
 opacity: .72;
}

.hero-line {
 max-width: 760px;
 font-size: clamp(24px, 2.25vw, 34px);
 line-height: 1.22;
}

.hero-sub {
 max-width: 700px;
}

.hero-portrait-wrap::before {
 width: 158px;
 height: 112px;
 right: 2%;
 top: 13%;
 background-image: radial-gradient(circle, rgba(242,244,248,.78) 1.1px, transparent 1.2px);
 background-size: 12px 12px;
 border-radius: 28px;
 mask-image: radial-gradient(circle at 50% 50%, #000 0 48%, transparent 74%);
 opacity: .28;
 transform: rotate(-4deg);
}

.hero-portrait-wrap::after {
 content: "";
 right: 4%;
 top: 8%;
 width: 92px;
 height: 70px;
 border: 3px solid rgba(10, 61, 255, 0.76);
 border-radius: 24px 24px 24px 8px;
 box-shadow:
 18px 22px 0 -15px rgba(0, 151, 167, 0.8),
 0 0 28px rgba(10, 61, 255, 0.14);
 opacity: .72;
}

.hero-stairs {
 right: 3%;
 bottom: 9%;
 width: 210px;
 height: 118px;
 border-left: 0;
 border-top: 1px solid rgba(199, 216, 255, 0.32);
 border-right: 1px solid rgba(0, 151, 167, 0.2);
 border-radius: 999px 999px 0 0;
 opacity: .58;
 transform: rotate(-8deg);
}

.hero-stairs::after {
 right: 22px;
 bottom: 28px;
 width: 128px;
 height: 72px;
 background-image: radial-gradient(circle, rgba(0,151,167,.74) 1.15px, transparent 1.25px);
 background-size: 13px 13px;
 opacity: .24;
 transform: none;
}

.brand-light-section {
 position: relative;
 overflow: hidden;
}
.brand-light-section::before {
 content: "";
 position: absolute;
 left: 0;
 top: 18%;
 width: 170px;
 height: 170px;
 background: var(--cobalt);
 border-radius: 0 999px 999px 0;
 opacity: .08;
 pointer-events: none;
}
.segment-card {
 position: relative;
 overflow: hidden;
}
.segment-card::after {
 content: "";
 position: absolute;
 right: 0;
 bottom: 0;
 width: 46px;
 height: 46px;
 background: linear-gradient(135deg, transparent 50%, rgba(10,61,255,.12) 50%);
}
.segment-card:nth-child(3n) .seg-icon,
.segment-card:nth-child(5n) .seg-icon {
 color: var(--teal);
}
.segment-card:nth-child(4n) .seg-icon,
.segment-card:nth-child(6n) .seg-icon {
 color: var(--fuchsia);
}

.package-card[data-package="private"] {
 border-color: rgba(10,61,255,.45);
 box-shadow: inset 0 0 0 1px rgba(10,61,255,.10);
}
.package-card[data-package="private"] h3 {
 color: var(--cobalt);
}

.resource-gallery {
 position: relative;
 overflow: hidden;
}
.resource-gallery::before {
 right: 4%;
 top: 16%;
 opacity: .12;
 background-image: radial-gradient(circle, rgba(10,61,255,.9) 1.15px, transparent 1.25px);
}
.resource-card {
 position: relative;
 min-height: 260px;
 overflow: hidden;
}
.resource-icon {
 width: 44px;
 height: 44px;
 border-radius: 50%;
 display: block;
 margin-top: 18px;
 margin-bottom: 18px;
 background:
 radial-gradient(circle at 50% 50%, #fff 0 3px, transparent 4px),
 var(--cobalt);
 box-shadow: 0 0 0 8px rgba(10,61,255,.08);
}
.resource-card:nth-child(2) .resource-icon,
.resource-card:nth-child(5) .resource-icon { background: linear-gradient(135deg, var(--teal), #0c6b74); }
.resource-card:nth-child(3) .resource-icon,
.resource-card:nth-child(6) .resource-icon { background: linear-gradient(135deg, var(--fuchsia), #9d164f); }
.resource-feature {
 background:
 radial-gradient(circle at 96% 0%, rgba(10,61,255,.34), transparent 38%),
 var(--ink);
 color: #fff;
}
.resource-feature h3,
.resource-feature p {
 color: #fff;
}
.resource-feature p {
 opacity: .76;
}
.resource-feature .explore-link {
 color: #fff;
}
.resource-feature::after {
 content: "";
 position: absolute;
 right: -18px;
 bottom: -18px;
 width: 96px;
 height: 96px;
 border-radius: 999px;
 background: var(--cobalt);
 opacity: .9;
}

.about-editorial {
 background:
 radial-gradient(circle at 6% 10%, rgba(10,61,255,.22), transparent 28%),
 linear-gradient(135deg, var(--ink), #111217 68%, #071038);
 color: #fff;
}
.about-editorial::before {
 right: 5%;
 top: 14%;
}
.about-editorial .section-kicker,
.about-editorial .text-cobalt {
 color: var(--icy);
}
.about-editorial h2 {
 color: #fff;
}
.about-grid {
 display: grid;
 grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
 gap: 64px;
 align-items: center;
}
.about-visual {
 display: flex;
 justify-content: center;
}
.about-editorial .about-copy p {
 color: rgba(255,255,255,.78);
}
.about-quote {
 color: rgba(255,255,255,.78);
 font-style: italic;
}
.about-story-link {
 color: var(--cobalt);
 display: inline-block;
 font-size: 0.95rem;
 font-weight: 700;
 margin-top: 18px;
 text-decoration: none;
}
.about-story-link:hover {
 color: #fff;
}
.about-editorial .brand-statement {
 max-width: 720px;
 font-family: "Bebas Neue", system-ui, sans-serif;
 font-size: clamp(34px, 4vw, 56px);
 line-height: .98;
 color: #fff;
}
.about-photo::before {
 content: "";
 position: absolute;
 inset: -18px;
 border: 1px solid rgba(199,216,255,.34);
 border-radius: 999px;
 pointer-events: none;
}
.about-photo::after {
 content: "";
 position: absolute;
 right: -10px;
 bottom: 34px;
 width: 46px;
 height: 46px;
 background: var(--fuchsia);
 border-radius: 6px;
 opacity: .78;
 pointer-events: none;
 z-index: 2;
}
.about-photo {
 position: relative;
 width: min(100%, 360px);
 aspect-ratio: 1;
 border-radius: 999px;
 border: 3px solid var(--cobalt);
 background: rgba(199,216,255,.22);
 overflow: visible;
}
.about-photo-img {
 position: relative;
 z-index: 1;
 width: 100%;
 height: 100%;
 display: block;
 object-fit: cover;
 object-position: center top;
 border-radius: 999px;
}
.about-editorial .cred {
 background: rgba(255,255,255,.06);
 border-color: rgba(255,255,255,.14);
 color: #fff;
 min-height: 118px;
 display: flex;
 flex-direction: column;
 justify-content: center;
}
.about-editorial .cred-num {
 color: var(--cobalt);
}
.about-editorial .cred-label {
 color: var(--icy);
}

footer.bg-charcoal {
 background:
 radial-gradient(circle at 92% 0%, rgba(10,61,255,.16), transparent 26%),
 var(--ink);
 position: relative;
 overflow: hidden;
 color: rgba(242, 244, 248, 0.72);
}
footer.bg-charcoal .text-white\/60,
footer.bg-charcoal .text-white\/50,
footer.bg-charcoal p {
 color: rgba(242, 244, 248, 0.72);
}
footer.bg-charcoal .brand-logo__main {
 color: #F2F4F8;
}
footer.bg-charcoal .brand-logo__sub {
 color: #3D63FF;
}
footer.bg-charcoal::before {
 content: "";
 position: absolute;
 right: 5%;
 top: 22px;
 width: 130px;
 height: 130px;
 opacity: .15;
 background-image: radial-gradient(circle, rgba(255,255,255,.92) 1.1px, transparent 1.2px);
 background-size: 12px 12px;
}

.inner-hero {
 min-height: 520px;
 display: grid;
 align-items: center;
}
.inner-hero > div {
 display: grid;
 grid-template-columns: minmax(0, 1.05fr) minmax(280px, .7fr);
 gap: 56px;
 align-items: center;
}
.inner-hero > div > * {
 grid-column: 1;
}
.inner-hero > div::after {
 content: none;
 grid-column: 2;
 grid-row: 1 / span 10;
 min-height: 300px;
 border-radius: 24px;
 background:
 linear-gradient(90deg, transparent 0 54%, rgba(216,27,114,.9) 54% 72%, rgba(0,151,167,.9) 72% 100%),
 radial-gradient(circle at 38% 42%, rgba(10,61,255,.95) 0 28%, transparent 29%),
 radial-gradient(circle at 82% 12%, rgba(255,255,255,.18) 0 3px, transparent 4px),
 rgba(255,255,255,.05);
 border: 1px solid rgba(255,255,255,.12);
 box-shadow: 0 28px 80px -50px rgba(10,61,255,.9);
}
.inner-visual {
 grid-column: 2;
 grid-row: 1 / span 10;
 min-height: 320px;
 border-radius: 24px;
 border: 1px solid rgba(255,255,255,.14);
 background:
 radial-gradient(circle at 24% 18%, rgba(10,61,255,.75), transparent 28%),
 radial-gradient(circle at 90% 18%, rgba(216,27,114,.38), transparent 20%),
 linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
 position: relative;
 padding: 28px;
 overflow: hidden;
 color: #fff;
 box-shadow: 0 28px 80px -50px rgba(10,61,255,.9);
}
.inner-visual::before {
 content: "";
 position: absolute;
 right: 0;
 top: 0;
 width: 74px;
 height: 146px;
 background:
 linear-gradient(var(--fuchsia), var(--fuchsia)) top/100% 48% no-repeat,
 linear-gradient(var(--teal), var(--teal)) bottom/100% 52% no-repeat;
 opacity: .9;
}
.inner-visual::after {
 content: """;
 position: absolute;
 right: 26px;
 bottom: -12px;
 font-family: Georgia, serif;
 font-size: 116px;
 line-height: 1;
 color: var(--cobalt);
 opacity: .8;
}
.visual-card-stack {
 position: relative;
 z-index: 2;
 width: min(260px, 78%);
 border: 1px solid rgba(255,255,255,.18);
 border-radius: 16px;
 background: rgba(10,10,10,.74);
 padding: 18px;
 backdrop-filter: blur(10px);
 box-shadow: 0 22px 50px -34px rgba(0,0,0,.95);
}
.visual-card-stack + .visual-card-stack {
 margin-top: 18px;
}
.visual-card-offset {
 margin-left: auto;
}
.visual-card-stack span {
 display: block;
 color: var(--icy);
 text-transform: uppercase;
 letter-spacing: .18em;
 font-size: 10px;
 font-weight: 800;
}
.visual-card-stack strong {
 display: block;
 margin-top: 8px;
 font-family: "Bebas Neue", system-ui, sans-serif;
 font-size: 28px;
 line-height: 1;
 letter-spacing: .02em;
}
.visual-card-stack i {
 display: block;
 margin-top: 18px;
 height: 5px;
 width: 72%;
 background: linear-gradient(90deg, var(--cobalt), var(--teal));
 border-radius: 99px;
}
.visual-bubble {
 position: absolute;
 left: 24px;
 bottom: 24px;
 width: 64px;
 color: var(--teal);
 z-index: 1;
}
.challenge-atmosphere {
 min-height: 390px;
 border: 0;
 border-radius: 0;
 background: transparent;
 box-shadow: none;
 isolation: isolate;
 overflow: visible;
 transform: none;
}
.challenge-atmosphere::before {
 content: "";
 position: absolute;
 inset: -44px -70px -50px -70px;
 background:
 radial-gradient(circle at 24% 22%, rgba(10,61,255,.22), transparent 28%),
 radial-gradient(circle at 68% 34%, rgba(0,151,167,.13), transparent 26%),
 radial-gradient(circle at 82% 78%, rgba(216,27,114,.12), transparent 25%),
 radial-gradient(circle, rgba(242,244,248,.24) 1.1px, transparent 1.4px) 0 0 / 18px 18px;
 opacity: .58;
 z-index: 0;
}
.challenge-atmosphere::after {
 display: none;
}
.challenge-word {
 position: absolute;
 z-index: 2;
 font-family: "Bebas Neue", system-ui, sans-serif;
 font-size: clamp(54px, 7.2vw, 96px);
 line-height: .9;
 letter-spacing: .03em;
 text-transform: uppercase;
 color: rgba(242,244,248,.10);
 text-shadow: 0 0 26px rgba(10,61,255,.16);
 user-select: none;
}
.challenge-word--speak {
 left: -18px;
 top: -8px;
 color: rgba(242,244,248,.11);
}
.challenge-word--clarify {
 left: auto;
 right: -42px;
 top: 34px;
 color: rgba(199,216,255,.10);
}
.challenge-word--respond {
 left: -4px;
 top: 158px;
 bottom: auto;
 color: rgba(0,151,167,.12);
}
.challenge-word--connect {
 right: -54px;
 bottom: 12px;
 color: rgba(216,27,114,.11);
}
.challenge-line-map {
 position: absolute;
 inset: 28px -58px 24px -44px;
 z-index: 3;
 width: calc(100% + 102px);
 height: calc(100% - 52px);
 color: rgba(199,216,255,.30);
}
.challenge-progress-markers {
 position: absolute;
 left: 52%;
 bottom: 28px;
 transform: translateX(-50%);
 z-index: 5;
 display: flex;
 align-items: center;
 gap: 10px;
}
.challenge-progress-markers span {
 width: 30px;
 height: 30px;
 border-radius: 999px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 border: 1px solid rgba(242,244,248,.28);
 background: rgba(10,10,10,.22);
 color: rgba(242,244,248,.64);
 font-size: 11px;
 font-weight: 800;
 box-shadow: 0 0 18px rgba(10,61,255,.10);
}
.challenge-progress-markers span:nth-child(2),
.challenge-progress-markers span:nth-child(4) {
 border-color: rgba(0,151,167,.52);
 color: var(--teal);
}
.challenge-progress-markers span:nth-child(5) {
 border-color: rgba(216,27,114,.54);
 color: var(--fuchsia);
}
.challenge-speech {
 position: absolute;
 z-index: 4;
 opacity: .64;
 filter: drop-shadow(0 14px 22px rgba(0,0,0,.28));
}
.challenge-speech--one {
 left: 42px;
 top: 118px;
 width: 76px;
 color: var(--teal);
}
.challenge-speech--two {
 right: 18px;
 bottom: 92px;
 width: 74px;
 color: var(--cobalt);
}
.challenge-atmosphere .challenge-speech--two circle {
 fill: var(--fuchsia);
}
.challenge-hero {
 min-height: auto;
}
.challenge-hero > div {
 display: block;
 min-height: clamp(350px, 44vw, 500px);
 padding-top: clamp(54px, 7vw, 82px);
 padding-bottom: clamp(52px, 6vw, 76px);
}
.challenge-hero > div > :not(.challenge-atmosphere) {
 position: relative;
 z-index: 2;
}
.challenge-hero .challenge-atmosphere {
 position: absolute;
 top: 0;
 bottom: 0;
 left: 50%;
 width: 100vw;
 height: 100%;
 min-height: 0;
 grid-column: auto;
 grid-row: auto;
 pointer-events: none;
 z-index: 1;
 padding: 0;
 opacity: .82;
 transform: translateX(-50%);
}
.challenge-hero .challenge-atmosphere::before {
 inset: 0;
 background:
 radial-gradient(circle at 12% 24%, rgba(10,61,255,.18), transparent 24%),
 radial-gradient(circle at 72% 18%, rgba(10,61,255,.20), transparent 25%),
 radial-gradient(circle at 44% 72%, rgba(0,151,167,.15), transparent 24%),
 radial-gradient(circle at 90% 78%, rgba(216,27,114,.15), transparent 23%),
 radial-gradient(circle, rgba(242,244,248,.28) 1px, transparent 1.28px) 0 0 / 14px 14px,
 radial-gradient(circle, rgba(199,216,255,.16) 1px, transparent 1.35px) 8px 9px / 26px 26px;
 opacity: .72;
}
.challenge-hero .challenge-atmosphere::after {
 display: block;
 content: "";
 position: absolute;
 inset: 9% 6% 10% auto;
 width: min(36vw, 520px);
 aspect-ratio: 1;
 border-radius: 999px;
 border: 1px solid rgba(199,216,255,.09);
 background:
 radial-gradient(circle at 50% 0%, rgba(242,244,248,.13) 1px, transparent 1.3px) 0 0 / 24px 24px,
 radial-gradient(circle at 28% 70%, rgba(0,151,167,.10), transparent 34%),
 radial-gradient(circle at 72% 34%, rgba(216,27,114,.09), transparent 30%),
 radial-gradient(circle at 50% 50%, rgba(10,61,255,.08), transparent 42%);
 opacity: .62;
}
.challenge-hero .challenge-word {
 opacity: .72;
 text-shadow: none;
}
.challenge-hero .challenge-word--speak {
 left: 2%;
 top: -5%;
 font-size: clamp(78px, 10.5vw, 150px);
 color: rgba(10,61,255,.20);
}
.challenge-hero .challenge-word--clarify {
 right: -4%;
 top: 2%;
 font-size: clamp(104px, 15vw, 220px);
 color: rgba(199,216,255,.19);
}
.challenge-hero .challenge-word--respond {
 left: 8%;
 top: auto;
 bottom: 8%;
 font-size: clamp(96px, 13vw, 190px);
 color: rgba(0,151,167,.19);
}
.challenge-hero .challenge-word--connect {
 right: -8%;
 bottom: -14%;
 font-size: clamp(132px, 19vw, 280px);
 color: rgba(216,27,114,.17);
}
.challenge-hero .challenge-line-map {
 inset: 16% 7% 16% 34%;
 width: 58%;
 height: 68%;
 color: rgba(199,216,255,.13);
}
.challenge-hero .challenge-speech {
 opacity: .28;
 filter: none;
}
.challenge-hero .challenge-speech--one {
 left: 62%;
 top: 30%;
 width: 58px;
}
.challenge-hero .challenge-speech--two {
 right: 14%;
 bottom: 30%;
 width: 56px;
}
.challenge-hero .challenge-progress-markers {
 left: auto;
 right: 7%;
 bottom: 18%;
 transform: none;
 opacity: .42;
}
.challenge-hero .challenge-progress-markers span {
 width: 24px;
 height: 24px;
 font-size: 10px;
 background: rgba(10,10,10,.14);
}
.brand-dot-grid {
 position: absolute;
 right: 58px;
 bottom: 70px;
 width: 118px;
 height: 118px;
 opacity: .28;
 background-image: radial-gradient(circle, rgba(255,255,255,.88) 1.2px, transparent 1.3px);
 background-size: 11px 11px;
}
.free-resources-hero {
 min-height: auto;
}
.free-resources-hero > div {
 grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr);
 gap: 48px;
 align-items: center;
 padding-top: 88px;
 padding-bottom: 88px;
}
.free-resources-hero .inner-visual {
 grid-column: 2;
 grid-row: 1 / span 8;
 align-self: center;
 width: 100%;
 min-height: 300px;
 margin: 0;
}
.progress-dots {
 position: relative;
 z-index: 2;
 display: flex;
 gap: 8px;
 margin-bottom: 20px;
}
.progress-dots span {
 width: 34px;
 height: 34px;
 border-radius: 999px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 background: var(--cobalt);
 color: #fff;
 font-weight: 800;
 font-size: 12px;
}
.progress-dots span:nth-child(2),
.progress-dots span:nth-child(4) {
 background: var(--teal);
}
.progress-dots span:nth-child(5) {
 background: var(--fuchsia);
}
.education-mockup::before {
 background:
 linear-gradient(var(--teal), var(--teal)) top/100% 48% no-repeat,
 linear-gradient(var(--fuchsia), var(--fuchsia)) bottom/100% 52% no-repeat;
}
.coaching-mockup {
 background:
 radial-gradient(circle at 24% 18%, rgba(10,61,255,.70), transparent 28%),
 radial-gradient(circle at 80% 80%, rgba(199,216,255,.16), transparent 24%),
 linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
.inner-card {
 position: relative;
}
.cta-panel {
 background:
 radial-gradient(circle at 94% 0%, rgba(10,61,255,.28), transparent 34%),
 var(--ink);
}

@media (max-width: 1023px) {
 .hero-rebrand::after,
 .hero-portrait-wrap::before,
 .hero-portrait-wrap::after {
 opacity: .45;
 transform: scale(.74);
 }
 .inner-hero > div {
 grid-template-columns: 1fr;
 }
 .inner-visual {
 grid-column: 1;
 grid-row: auto;
 min-height: 240px;
 }
 .free-resources-hero > div {
 grid-template-columns: 1fr;
 gap: 32px;
 padding-top: 72px;
 padding-bottom: 72px;
 }
 .free-resources-hero .inner-visual {
 grid-column: 1;
 grid-row: auto;
 max-width: 560px;
 }
 .about-grid {
 grid-template-columns: 1fr;
 gap: 44px;
 }
 .about-visual {
 justify-content: flex-start;
 }
 .about-photo {
 width: min(78vw, 320px);
 }
}

@media (max-width: 640px) {
 .hero-title {
 font-size: clamp(58px, 20vw, 86px);
 }
 .hero-line {
 font-size: 21px;
 }
 .hero-rebrand::after {
 right: -18px;
 top: 58%;
 }
 .challenge-strip::after {
 display: none;
 }
 .inner-hero {
 min-height: auto;
 }
 .inner-visual {
 min-height: 220px;
 padding: 20px;
 }
 .challenge-atmosphere {
 min-height: 260px;
 transform: none;
 }
 .challenge-atmosphere::after {
 display: none;
 }
 .challenge-word {
 font-size: clamp(38px, 12vw, 52px);
 }
 .challenge-word--speak {
 left: 8px;
 top: 4px;
 }
 .challenge-word--clarify {
 left: auto;
 right: 2px;
 top: 44px;
 }
 .challenge-word--respond {
 left: 14px;
 right: auto;
 top: 138px;
 bottom: auto;
 }
 .challenge-word--connect {
 left: auto;
 right: 4px;
 bottom: 26px;
 }
 .challenge-speech--one {
 left: 28px;
 top: 114px;
 width: 64px;
 }
 .challenge-speech--two {
 right: 28px;
 bottom: 58px;
 width: 64px;
 }
 .challenge-progress-markers {
 left: 50%;
 bottom: 18px;
 transform: translateX(-50%);
 gap: 7px;
 }
 .challenge-progress-markers span {
 width: 26px;
 height: 26px;
 }
 .challenge-hero .challenge-word--speak {
 left: 3%;
 top: 0;
 font-size: clamp(58px, 18vw, 74px);
 }
 .challenge-hero .challenge-word--clarify {
 right: -10%;
 top: 10%;
 font-size: clamp(66px, 22vw, 92px);
 }
 .challenge-hero .challenge-word--respond {
 left: 4%;
 top: auto;
 bottom: 18%;
 font-size: clamp(60px, 20vw, 82px);
 }
 .challenge-hero .challenge-word--connect {
 right: -16%;
 bottom: -4%;
 font-size: clamp(72px, 26vw, 108px);
 }
 .challenge-hero .challenge-line-map {
 inset: 18% 4% 18% 16%;
 width: 82%;
 height: 64%;
 }
 .challenge-hero .challenge-atmosphere::after {
 width: 82vw;
 right: -24vw;
 top: 16%;
 opacity: .36;
 }
 .challenge-hero .challenge-speech {
 opacity: .22;
 }
 .challenge-hero .challenge-progress-markers {
 opacity: .32;
 }
 .free-resources-hero > div {
 padding-top: 56px;
 padding-bottom: 56px;
 }
 .about-photo {
 width: min(74vw, 260px);
 }
 .about-photo::after {
 right: -6px;
 bottom: 28px;
 width: 36px;
 height: 36px;
 }
 .visual-card-stack { width: 86%; }
 .visual-card-stack strong { font-size: 24px; }
 .brand-dot-grid { opacity: .18; }
}

/* ---------- Homepage hero mobile correction ---------- */
@media (max-width: 1023px) {
 .hero-rebrand {
 min-height: auto;
 }
 .hero-rebrand > .max-w-7xl {
 padding-top: 56px;
 padding-bottom: 44px;
 }
 .hero-rebrand .grid {
 gap: 34px;
 align-items: start;
 }
 .hero-title {
 max-width: 680px;
 font-size: clamp(52px, 9vw, 76px);
 line-height: .98;
 }
 .hero-title.mt-8 {
 margin-top: 22px;
 }
 .hero-line {
 font-size: clamp(21px, 4vw, 28px);
 line-height: 1.25;
 }
 .hero-sub {
 max-width: 620px;
 font-size: 17px;
 line-height: 1.5;
 }
 .hero-sub.mt-7 {
 margin-top: 18px;
 }
 .hero-sub + .mt-8 {
 margin-top: 24px;
 }
 .hero-primary,
 .hero-secondary {
 width: auto;
 min-width: 210px;
 max-width: 100%;
 min-height: 48px;
 }
 .hero-portrait-wrap {
 min-height: auto;
 padding-top: 4px;
 max-width: 430px;
 margin-inline: auto;
 }
 .hero-portrait-ring {
 width: min(300px, 72vw);
 transform: none;
 }
 .hero-portrait-img {
 object-position: center top;
 }
 .hero-signature {
 transform: none;
 margin-top: 16px;
 max-width: min(100%, calc(100vw - 48px));
 justify-content: center;
 }
 .hero-stairs {
 width: 120px;
 height: 78px;
 right: 2%;
 bottom: 58px;
 }
 .hero-square,
 .hero-dot-field-right {
 display: none;
 }
 .hero-rebrand::after,
 .hero-portrait-wrap::before,
 .hero-portrait-wrap::after {
 opacity: .28;
 transform: scale(.62);
 }
 .hero-refrain {
 margin-top: 34px;
 }
 .challenge-strip {
 border-top: 1px solid rgba(199,216,255,.22);
 }
}

@media (max-width: 640px) {
 .hero-rebrand > .max-w-7xl {
 padding-top: 36px;
 padding-bottom: 34px;
 }
 .hero-badge {
 max-width: 100%;
 font-size: 10px;
 letter-spacing: .11em;
 }
 .hero-title {
 font-size: clamp(44px, 13vw, 58px);
 line-height: .98;
 }
 .hero-title.mt-8 {
 margin-top: 18px;
 }
 .hero-line {
 font-size: 20px;
 }
 .hero-sub {
 font-size: 15px;
 line-height: 1.55;
 }
 .hero-sub + .mt-8 {
 flex-direction: column;
 gap: 12px;
 }
 .hero-primary,
 .hero-secondary {
 width: 100%;
 min-width: 0;
 min-height: 48px;
 white-space: normal;
 text-align: center;
 }
 .hero-cta-stack {
 min-height: 64px;
 padding-bottom: 10px;
 padding-top: 10px;
 }
 .hero-cta-stack span {
 font-size: 0.92rem;
 }
 .hero-cta-stack small {
 font-size: 0.68rem;
 line-height: 1.25;
 }
 .hero-portrait-wrap {
 max-width: 300px;
 }
 .hero-portrait-ring {
 width: min(236px, 66vw);
 box-shadow: 0 0 0 10px rgba(199,216,255,.12), 0 20px 48px rgba(10,61,255,.20);
 }
 .hero-signature {
 gap: 8px;
 margin-top: 14px;
 }
 .hero-signature span {
 font-size: 28px;
 }
 .hero-signature i {
 height: 30px;
 }
 .hero-signature small {
 max-width: 178px;
 white-space: normal;
 font-size: 10px;
 line-height: 1.35;
 }
 .hero-stairs {
 display: none;
 }
 .hero-refrain {
 margin-top: 28px;
 padding-top: 14px;
 font-size: 10px;
 letter-spacing: .18em;
 line-height: 1.9;
 }
}

/* ---------- Testimonials ---------- */
.testimonial-card {
 position: relative;
 background: #fff;
 border: 1px solid #e6e9f1;
 border-radius: 18px;
 padding: 28px;
 overflow: hidden;
 transition: transform .25s ease, box-shadow .25s ease;
}
.testimonial-card:hover {
 transform: translateY(-3px);
 box-shadow: 0 24px 40px -24px rgba(10, 61, 255, 0.25);
}
.testimonial-card::before {
 content: """;
 position: absolute;
 top: -36px;
 right: -10px;
 font-family: Georgia, serif;
 font-size: 220px;
 line-height: 1;
 color: rgba(216, 27, 114, 0.10);
 pointer-events: none;
}
.testimonial-card .stars { color: #f5b301; letter-spacing: 2px; }
.testimonial-card .quote {
 font-style: italic;
 color: var(--charcoal);
 line-height: 1.55;
 position: relative;
 z-index: 1;
}
.testimonial-card .avatar {
 width: 44px; height: 44px;
 border-radius: 999px;
 background: var(--icy);
 color: var(--cobalt);
 font-weight: 700;
 display: flex; align-items: center; justify-content: center;
 font-size: 14px;
}
.testimonial-card .result {
 display: inline-block;
 margin-top: 14px;
 font-weight: 700;
 font-size: 13px;
 color: var(--cobalt);
}

.carousel-btn {
 width: 44px; height: 44px;
 border-radius: 999px;
 border: 2px solid var(--cobalt);
 color: var(--cobalt);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 transition: background .2s, color .2s, transform .15s;
}
.carousel-btn:hover { background: var(--cobalt); color: #fff; }
.carousel-btn:active { transform: scale(.95); }

/* ---------- About credentials ---------- */
.cred {
 background: #fff;
 border: 1px solid var(--icy);
 border-radius: 14px;
 padding: 18px 20px;
 text-align: left;
}
.cred-num {
 font-family: "Bebas Neue", sans-serif;
 font-size: 36px;
 line-height: 1;
 color: var(--cobalt);
 letter-spacing: 0.02em;
}
.cred-label {
 font-size: 12px;
 text-transform: uppercase;
 letter-spacing: 0.12em;
 color: var(--charcoal);
 margin-top: 6px;
}

/* ---------- FAQ ---------- */
.faq-item { padding: 0; }
.faq-item button {
 width: 100%;
 text-align: left;
 padding: 20px 0;
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 16px;
 font-size: 17px;
 color: var(--ink);
 font-weight: 500;
}
.faq-item button .chev {
 width: 28px; height: 28px;
 border-radius: 999px;
 border: 1.5px solid var(--cobalt);
 color: var(--cobalt);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 transition: transform .25s ease, background .2s;
 flex-shrink: 0;
}
.faq-item.open button .chev {
 transform: rotate(45deg);
 background: var(--cobalt);
 color: #fff;
}
.faq-item .answer {
 max-height: 0;
 overflow: hidden;
 transition: max-height .35s ease;
}
.faq-item .answer-inner {
 padding-bottom: 22px;
 font-size: 15px;
 color: rgba(31, 31, 35, 0.85);
 line-height: 1.65;
 max-width: 60ch;
}
.faq-item.open .answer { max-height: 400px; }

/* ---------- Contact form ---------- */
.field span {
 display: block;
 font-size: 12px;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: var(--charcoal);
 margin-bottom: 6px;
 font-weight: 600;
}
.field input,
.field select,
.field textarea {
 width: 100%;
 border: 1.5px solid #d8dce6;
 border-radius: 10px;
 padding: 12px 14px;
 font-family: inherit;
 font-size: 15px;
 color: var(--charcoal);
 background: #fff;
 transition: border-color .15s, box-shadow .15s;
}
.field input:focus,
.field select:focus,
.field textarea:focus {
 outline: none;
 border-color: var(--cobalt);
 box-shadow: 0 0 0 4px rgba(10, 61, 255, 0.12);
}
.field textarea { resize: vertical; min-height: 110px; }

.contact-item {
 display: flex;
 align-items: center;
 gap: 12px;
 font-size: 15px;
 width: 100%;
 transition: color .2s;
}
.contact-item:hover { color: #fff; }
.contact-item:nth-child(2) svg {
 color: var(--teal);
}
.contact-item:nth-child(3) svg {
 color: var(--fuchsia);
}

/* ---------- Modal ---------- */
#modal.open { display: block; }
#modal .pkg-detail h3 { font-family: "Bebas Neue", sans-serif; }

#modal-body .modal-cta-actions {
 display: flex;
 flex-wrap: wrap;
 gap: 16px;
}

#modal-body .modal-cta-actions .btn-primary,
#modal-body .modal-cta-actions .btn-outline,
#modal-body #consultation-form .btn-primary {
 box-sizing: border-box;
 max-width: 100%;
 text-align: center;
 white-space: normal;
 overflow-wrap: anywhere;
 align-items: center;
 justify-content: center;
}

@media (max-width: 640px) {
 #modal-body .modal-cta-actions {
  flex-direction: column;
  width: 100%;
 }

 #modal-body .modal-cta-actions .btn-primary,
 #modal-body .modal-cta-actions .btn-outline,
 #modal-body #consultation-form .btn-primary {
  display: flex;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  min-height: 64px;
  padding: 16px 20px;
  line-height: 1.25;
 }
}


.session-block {
 display: flex;
 gap: 16px;
 align-items: flex-start;
 padding: 18px;
 border: 1px solid var(--icy);
 border-radius: 14px;
 background: var(--cool);
}
.session-block .num {
 width: 38px; height: 38px;
 border-radius: 999px;
 background: var(--cobalt);
 color: #fff;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-weight: 700;
 flex-shrink: 0;
}
.session-block:nth-child(even) .num {
 background: var(--teal);
}

/* ---------- Reveal-on-scroll ---------- */
.reveal {
 opacity: 0;
 transform: translateY(16px);
 transition: opacity .6s ease, transform .6s ease;
}
.reveal.in {
 opacity: 1;
 transform: none;
}

/* ---------- Accessibility ---------- */
@media (prefers-reduced-motion: reduce) {
 *, *::before, *::after {
 animation-duration: 0.001ms !important;
 transition-duration: 0.001ms !important;
 scroll-behavior: auto !important;
 }
}

/* ---------- Misc ---------- */
.no-scroll { overflow: hidden; }

/* ---------- Day 1 mobile overflow fixes ---------- */
html,
body {
 overflow-x: hidden;
}

.challenge-day-page,
.challenge-day-page *,
.challenge-day-page *::before,
.challenge-day-page *::after {
 box-sizing: border-box;
}

.challenge-day-page {
 width: 100%;
 max-width: 100%;
 overflow-x: clip;
}

@supports not (overflow: clip) {
 .challenge-day-page {
 overflow-x: hidden;
 }
}

.challenge-day-page .inner-card,
.challenge-day-page .lesson-overview-grid,
.challenge-day-page .lesson-overview-card,
.challenge-day-page .day-one-quiz-intro,
.challenge-day-page .day-one-quiz-intro__shell,
.challenge-day-page .day-one-quiz-intro__grid,
.challenge-day-page .day-one-quiz-intro__card,
.challenge-day-page .day-one-quiz-intro__visual,
.challenge-day-page .day-one-quiz-intro__info,
.challenge-day-page .day-one-quiz-app,
.challenge-day-page .day-one-quiz-card,
.challenge-day-page .day-one-quiz-context,
.challenge-day-page .day-one-quiz-feedback,
.challenge-day-page .day-one-quiz-feedback-item,
.challenge-day-page .day-one-quiz-option,
.challenge-day-page .day-one-quiz-complete,
.challenge-day-page .expressions-intro-section,
.challenge-day-page .expression-accordion,
.challenge-day-page .expression-accordion-item,
.challenge-day-page .practice-stage,
.challenge-day-page .practice-stage-grid,
.challenge-day-page .practice-stage-card,
.challenge-day-page .practice-stage-banner,
.challenge-day-page .lesson-section,
.challenge-day-page .expression-audio-lab,
.challenge-day-page .expression-audio-list,
.challenge-day-page .expression-audio-row,
.challenge-day-page .speaking-task-grid,
.challenge-day-page .speaking-task-card,
.challenge-day-page .reflection-task-card,
.challenge-day-page .coming-tomorrow-card,
.challenge-day-page .cta-panel {
 min-width: 0;
 max-width: 100%;
}

.challenge-day-page .section-header > *,
.challenge-day-page .day-one-quiz-intro__header > *,
.challenge-day-page .expressions-intro-header > *,
.challenge-day-page .practice-stage-header > *,
.challenge-day-page .day-one-quiz-header > *,
.challenge-day-page .day-one-quiz-option > *,
.challenge-day-page .expression-accordion-trigger > *,
.challenge-day-page .expression-audio-row > *,
.challenge-day-page .coming-tomorrow-card > * {
 min-width: 0;
}

.challenge-day-page .section-kicker,
.challenge-day-page .tag-fuchsia,
.challenge-day-page .day-one-quiz-intro__pill,
.challenge-day-page .day-one-quiz-kicker,
.challenge-day-page .day-one-quiz-skill,
.challenge-day-page .day-one-quiz-count {
 max-width: 100%;
 white-space: normal;
 overflow-wrap: anywhere;
}

.challenge-day-page .section-title,
.challenge-day-page .lesson-card-title,
.challenge-day-page .day-one-quiz-title,
.challenge-day-page .day-one-quiz-complete h4,
.challenge-day-page .expression-accordion-title,
.challenge-day-page .expression-accordion-purpose,
.challenge-day-page .practice-stage-card h4,
.challenge-day-page .coming-tomorrow-card h3 {
 overflow-wrap: anywhere;
}

.challenge-day-page .btn-primary,
.challenge-day-page .btn-outline,
.challenge-day-page .day-one-quiz-action,
.challenge-day-page .coming-tomorrow-cta,
.challenge-day-page .audio-practice-button,
.challenge-day-page .practice-reveal-button {
 max-width: 100%;
 white-space: normal;
 text-align: center;
}

.challenge-day-page .day-one-quiz-actions,
.challenge-day-page .expression-audio-actions {
 min-width: 0;
 max-width: 100%;
 flex-wrap: wrap;
}

.challenge-day-page .practice-response-input,
.challenge-day-page textarea,
.challenge-day-page input {
 max-width: 100%;
}

#newsletter,
#newsletter input,
#newsletter button {
 max-width: 100%;
 min-width: 0;
}

@media (max-width: 640px) {
 .challenge-day-page .day-one-quiz-intro__shell {
 padding-inline: 20px;
 }

 .challenge-day-page .day-one-quiz-intro__brief {
 border-left: 0;
 padding-left: 0;
 }

 .challenge-day-page .day-one-quiz-card,
 .challenge-day-page .day-one-quiz-complete,
 .challenge-day-page .lesson-section,
 .challenge-day-page .practice-stage,
 .challenge-day-page .expressions-intro-section {
 width: 100%;
 }

 .challenge-day-page .practice-stage {
 background: transparent;
 border: 0;
 border-radius: 0;
 box-shadow: none;
 padding: 0;
 }

 .challenge-day-page .practice-stage-header {
 gap: 14px;
 margin-bottom: 18px;
 }

 .challenge-day-page .practice-stage-badge {
 min-height: 48px;
 }

 .challenge-day-page .practice-stage-icon.section-icon {
 height: 48px;
 width: 48px;
 }

 .challenge-day-page .practice-stage-icon.section-icon svg {
 height: 22px;
 width: 22px;
 }

 .challenge-day-page .practice-stage-grid {
 display: block;
 margin-top: 18px;
 width: 100%;
 }

 .challenge-day-page .practice-stage-card {
 width: 100%;
 max-width: 100%;
 padding: 22px 18px;
 }

 .challenge-day-page .practice-stage-card + .practice-stage-card {
 margin-top: 16px;
 }

 .challenge-day-page .practice-stage-banner {
 aspect-ratio: 2 / 1;
 border-radius: 14px;
 margin-top: 36px;
 max-height: 180px;
 }

 .challenge-day-page .practice-stage-banner::before {
 background: linear-gradient(90deg, rgba(10, 61, 255, 0.08), rgba(0, 151, 167, 0.28), rgba(10, 61, 255, 0.08));
 content: "";
 height: 1px;
 left: 0;
 position: absolute;
 right: 0;
 top: -18px;
 }

 .challenge-day-page .expression-detail-list div {
 background: transparent;
 border: 0;
 border-top: 1px solid rgba(199, 216, 255, 0.58);
 border-radius: 0;
 padding: 14px 0;
 }

 .challenge-day-page .expression-detail-list div:first-child {
 border-top: 0;
 padding-top: 0;
 }

 .challenge-day-page .reflection-task-card {
 background: rgba(242, 244, 248, 0.68);
 border-color: rgba(216, 27, 114, 0.12);
 border-radius: 16px;
 margin-top: 20px;
 padding: 20px 18px;
 }

 .challenge-day-page .lesson-start-transition,
 .challenge-day-page .lesson-stage-transition {
 align-items: center;
 color: var(--cobalt);
 display: flex;
 font-size: 0.72rem;
 font-weight: 800;
 gap: 0.7rem;
 justify-content: center;
 letter-spacing: 0.18em;
 margin-top: 24px;
 text-transform: uppercase;
 }

 .challenge-day-page .lesson-start-transition span,
 .challenge-day-page .lesson-stage-transition span {
 flex: 0 0 auto;
 text-align: center;
 }

 .challenge-day-page .lesson-start-transition::before,
 .challenge-day-page .lesson-start-transition::after,
 .challenge-day-page .lesson-stage-transition::before,
 .challenge-day-page .lesson-stage-transition::after {
 background: linear-gradient(90deg, rgba(10, 61, 255, 0.08), rgba(0, 151, 167, 0.36));
 content: "";
 flex: 1 1 auto;
 height: 1px;
 }

 .challenge-day-page .lesson-start-transition::after,
 .challenge-day-page .lesson-stage-transition::after {
 background: linear-gradient(90deg, rgba(0, 151, 167, 0.36), rgba(10, 61, 255, 0.08));
 }

 .challenge-day-page .lesson-stage-transition--practice {
 margin-bottom: 20px;
 margin-top: 28px;
 }

 .challenge-day-page .lesson-stage-transition--practice + .practice-stage {
 margin-top: 0;
 }

 .challenge-day-page .day-one-quiz-intro__info {
 gap: 0.58rem;
 padding: 0.62rem 0.72rem;
 }

 .challenge-day-page .day-one-quiz-intro__info span {
 background: rgba(0, 151, 167, 0.12);
 color: var(--teal);
 font-size: 0.7rem;
 height: 24px;
 width: 24px;
 }

 .challenge-day-page .day-one-quiz-intro__info p {
 font-size: 0.92rem;
 font-weight: 400;
 line-height: 1.45;
 padding-top: 0;
 }

 .challenge-day-path-section > div {
 padding-bottom: 1rem;
 }

 .challenge-day-lesson-section > div {
 padding-top: 1rem;
 }

 .challenge-day-footer-section > div {
 padding-top: 1.5rem;
 }

 .challenge-day-footer-section .cta-panel {
 margin-top: 2rem;
 }

 .challenge-day-page .practice-response-input {
 border-radius: 13px;
 padding: 14px;
 }

 .challenge-day-page .day-one-quiz-option {
 width: 100%;
 }

 .challenge-day-page .day-one-quiz-actions .btn-primary,
 .challenge-day-page .day-one-quiz-actions .btn-outline,
 .challenge-day-page .day-one-quiz-action,
 .challenge-day-page .audio-practice-button,
 .challenge-day-page .practice-reveal-button {
 width: 100%;
 }

 #newsletter {
 flex-direction: column;
 }

 #newsletter button {
 width: 100%;
 }
}

/* FREE RESOURCES LEARNING CONSTELLATION HERO */
.free-resources-hero {
 background:
 radial-gradient(circle at 14% 18%, rgba(10, 61, 255, 0.24), transparent 28%),
 radial-gradient(circle at 84% 22%, rgba(0, 151, 167, 0.18), transparent 30%),
 radial-gradient(circle at 68% 88%, rgba(199, 216, 255, 0.12), transparent 34%),
 linear-gradient(135deg, #0f1324 0%, #111b35 52%, #0a0a0a 100%);
 overflow: hidden;
 position: relative;
}

.free-resources-hero::before {
 background:
 radial-gradient(circle, rgba(242, 244, 248, 0.26) 1.25px, transparent 1.25px),
 radial-gradient(ellipse at 76% 44%, transparent 0 35%, rgba(199, 216, 255, 0.18) 35.4% 35.9%, transparent 36.3% 100%),
 radial-gradient(ellipse at 88% 58%, transparent 0 44%, rgba(0, 151, 167, 0.14) 44.5% 45%, transparent 45.5% 100%);
 background-position: 0 0, center, center;
 background-size: 20px 20px, 100% 100%, 100% 100%;
 content: "";
 inset: 0;
 opacity: 0.42;
 pointer-events: none;
 position: absolute;
}

.free-resources-hero::after {
 background:
 radial-gradient(circle at 47% 73%, rgba(216, 27, 114, 0.34) 0 2px, transparent 3px),
 radial-gradient(circle at 58% 64%, rgba(10, 61, 255, 0.58) 0 4px, transparent 5px),
 radial-gradient(circle at 68% 52%, rgba(0, 151, 167, 0.58) 0 4px, transparent 5px),
 radial-gradient(circle at 79% 40%, rgba(199, 216, 255, 0.58) 0 3px, transparent 4px),
 radial-gradient(circle at 89% 30%, rgba(216, 27, 114, 0.32) 0 2px, transparent 3px),
 radial-gradient(circle at 76% 36%, rgba(10, 61, 255, 0.2) 0 54px, transparent 56px),
 radial-gradient(circle at 86% 76%, rgba(0, 151, 167, 0.14) 0 74px, transparent 76px),
 radial-gradient(circle at 46% 18%, rgba(242, 244, 248, 0.06) 0 96px, transparent 98px);
 content: "";
 inset: 0;
 pointer-events: none;
 position: absolute;
}

.free-resources-hero > div {
 position: relative;
 z-index: 1;
}

.free-resources-hero .resource-mockup {
 color: rgba(242, 244, 248, 0.82);
 display: none;
}

@media (max-width: 1023px) {
 .free-resources-hero .resource-mockup {
 display: none;
 }
}

@media (max-width: 640px) {
 .free-resources-hero {
 background:
 radial-gradient(circle at 18% 16%, rgba(10, 61, 255, 0.16), transparent 30%),
 radial-gradient(circle at 86% 24%, rgba(0, 151, 167, 0.12), transparent 32%),
 linear-gradient(135deg, #0f1324 0%, #111b35 58%, #0a0a0a 100%);
 }

 .free-resources-hero::before {
 opacity: 0.28;
 }

 .free-resources-hero::after {
 opacity: 0.42;
 }
}

@media (max-width: 1023px) {
 .hero-rebrand::before {
 left: 18%;
 top: 42%;
 width: 58%;
 height: 26%;
 opacity: 0.32;
 }

 .hero-rebrand::after {
 opacity: 0.32;
 right: -28px;
 top: 52%;
 transform: scale(0.72);
 }
}

@media (max-width: 640px) {
 .hero-rebrand::before,
 .hero-rebrand::after {
 opacity: 0.18;
 }

 .hero-line {
 font-size: clamp(21px, 7vw, 29px);
 }
}

/* Homepage hero overlap fix: protected copy and portrait columns */
@media (min-width: 1024px) {
 .hero-rebrand .grid {
 align-items: center;
 column-gap: clamp(3.5rem, 6vw, 6rem);
 grid-template-columns: minmax(0, 650px) minmax(360px, 1fr);
 justify-content: space-between;
 }

 .hero-rebrand .grid > div {
 grid-column: auto !important;
 min-width: 0;
 }

 .hero-rebrand .grid > div:first-child {
 max-width: 650px;
 position: relative;
 z-index: 3;
 }

 .hero-title,
 .hero-line,
 .hero-sub {
 max-width: 100%;
 }

 .hero-portrait-wrap {
 align-items: center;
 justify-self: center;
 min-width: 360px;
 padding-top: 36px;
 position: relative;
 z-index: 2;
 }

 .hero-portrait-ring,
 .hero-signature {
 transform: none;
 }

 .hero-signature {
 align-self: center;
 max-width: 100%;
 }
}

@media (min-width: 1024px) and (max-width: 1380px) {
 .hero-rebrand .grid {
 column-gap: 3.25rem;
 grid-template-columns: minmax(0, 600px) minmax(340px, 0.9fr);
 }

 .hero-rebrand .grid > div:first-child {
 max-width: 600px;
 }

 .hero-line {
 font-size: clamp(22px, 2vw, 30px);
 }

 .hero-sub {
 font-size: clamp(17px, 1.35vw, 21px);
 }

 .hero-portrait-wrap {
 min-width: 340px;
 }
}

@media (max-width: 1023px) {
 .hero-rebrand .grid > div:first-child {
 max-width: 720px;
 }

 .hero-portrait-ring,
 .hero-signature {
 transform: none;
 }
}

/* INTERVIEW PLAYBOOK PAGE */
.resource-card-link {
 color: inherit;
 display: block;
 text-decoration: none;
}

.resource-card-link:focus-visible {
 outline: 3px solid rgba(10, 61, 255, 0.45);
 outline-offset: 4px;
}

.lead-magnet-panel {
 align-items: center;
 background:
 radial-gradient(circle at 92% 0%, rgba(10, 61, 255, 0.14), transparent 34%),
 linear-gradient(135deg, #0a0a0a 0%, #111827 100%);
 border-radius: 24px;
 color: #fff;
 display: grid;
 gap: clamp(1.75rem, 3.5vw, 3rem);
 grid-template-columns: minmax(0, 1.05fr) minmax(420px, 0.95fr);
 overflow: hidden;
 padding: clamp(1.5rem, 3.4vw, 2.75rem);
}

.lead-magnet-panel__copy {
 align-self: center;
 min-width: 0;
}

.lead-magnet-panel__copy p {
 color: rgba(255, 255, 255, 0.76);
 line-height: 1.7;
 margin-top: 1rem;
 max-width: 46rem;
}

.lead-magnet-form,
.lead-magnet-panel .ml-embedded {
 background: #fff;
 border: 1px solid rgba(199, 216, 255, 0.32);
 border-radius: 18px;
 box-shadow: 0 24px 50px rgba(10, 10, 10, 0.22);
 color: var(--charcoal);
 display: grid;
 gap: 1rem;
 justify-self: end;
 max-width: 540px;
 min-width: 0;
 overflow: hidden;
 padding: clamp(1rem, 2vw, 1.35rem);
 width: 100%;
}

.lead-magnet-form .btn-primary {
 width: 100%;
}

.lead-magnet-panel .ml-embedded * {
 max-width: 100%;
}

.lead-magnet-panel .ml-embedded [id^="mlb2-"].ml-form-embedContainer {
 display: block !important;
 width: 100% !important;
}

.lead-magnet-panel .ml-embedded .ml-form-embedWrapper,
.lead-magnet-panel .ml-embedded .ml-form-embedWrapper.embedDefault,
.lead-magnet-panel .ml-embedded .ml-form-embedWrapper.embedForm,
.lead-magnet-panel .ml-embedded .ml-form-embedWrapper.embedPopup {
 border: 0 !important;
 border-radius: 12px !important;
 box-shadow: none !important;
 display: block !important;
 max-width: 100% !important;
 width: 100% !important;
}

.lead-magnet-panel .ml-embedded .ml-form-embedBody,
.lead-magnet-panel .ml-embedded .ml-form-successBody {
 padding: 14px 14px 0 !important;
}

.lead-magnet-panel .ml-embedded .ml-form-embedContent,
.lead-magnet-panel .ml-embedded .ml-form-successContent {
 margin-bottom: 12px !important;
}

.lead-magnet-panel .ml-embedded .ml-form-embedContent h4,
.lead-magnet-panel .ml-embedded .ml-form-successContent h4 {
 font-size: clamp(1.35rem, 2.1vw, 1.65rem) !important;
 line-height: 1.12 !important;
 margin-bottom: 8px !important;
}

.lead-magnet-panel .ml-embedded .ml-form-embedContent p,
.lead-magnet-panel .ml-embedded .ml-form-successContent p {
 font-size: 0.88rem !important;
 line-height: 1.45 !important;
 margin-bottom: 0 !important;
}

.lead-magnet-panel .ml-embedded .ml-form-fieldRow {
 margin-bottom: 10px !important;
}

.lead-magnet-panel .ml-embedded input.form-control {
 font-size: 0.92rem !important;
 height: 44px !important;
 line-height: 1.2 !important;
 padding: 10px 12px !important;
}

.lead-magnet-panel .ml-embedded .ml-form-embedSubmit {
 margin: 12px 0 0 !important;
}

.lead-magnet-panel .ml-embedded .ml-form-embedSubmit button {
 min-height: 46px !important;
 padding: 11px 16px !important;
 width: 100% !important;
}

.lead-magnet-form__note {
 color: rgba(31, 31, 35, 0.62);
 font-size: 0.82rem;
 line-height: 1.5;
}

@media (max-width: 900px) {
 .lead-magnet-panel {
 border-radius: 18px;
 grid-template-columns: 1fr;
 padding: clamp(1rem, 5vw, 1.5rem);
 }

 .lead-magnet-panel .ml-embedded {
 justify-self: stretch;
 max-width: none;
 }
}

@media (max-width: 480px) {
 .lead-magnet-panel {
 gap: 1.1rem;
 }

 .lead-magnet-panel__copy p {
 line-height: 1.55;
 margin-top: 0.75rem;
 }

 .lead-magnet-panel .ml-embedded {
 padding: 0.8rem;
 }

 .lead-magnet-panel .ml-embedded .ml-form-embedBody,
 .lead-magnet-panel .ml-embedded .ml-form-successBody {
 padding: 10px 10px 0 !important;
 }

 .lead-magnet-panel .ml-embedded .ml-form-embedContent,
 .lead-magnet-panel .ml-embedded .ml-form-successContent {
 margin-bottom: 9px !important;
 }

 .lead-magnet-panel .ml-embedded .ml-form-embedContent h4,
 .lead-magnet-panel .ml-embedded .ml-form-successContent h4 {
 font-size: 1.2rem !important;
 margin-bottom: 6px !important;
 }

 .lead-magnet-panel .ml-embedded .ml-form-embedContent p,
 .lead-magnet-panel .ml-embedded .ml-form-successContent p {
 font-size: 0.8rem !important;
 line-height: 1.38 !important;
 }

 .lead-magnet-panel .ml-embedded .ml-form-fieldRow {
 margin-bottom: 8px !important;
 }

 .lead-magnet-panel .ml-embedded input.form-control {
 height: 42px !important;
 padding: 9px 11px !important;
 }

 .lead-magnet-panel .ml-embedded .ml-form-embedSubmit {
 margin-top: 10px !important;
 }
}

.playbook-hero {
 background:
 radial-gradient(circle at 86% 14%, rgba(10, 61, 255, 0.08), transparent 28%),
 linear-gradient(135deg, #ffffff 0%, #f7f9fd 48%, #edf1f8 100%);
 overflow: hidden;
 padding: clamp(4rem, 8vw, 7.5rem) 0 clamp(3.5rem, 7vw, 6.5rem);
 position: relative;
}

.playbook-hero::after {
 background: rgba(10, 61, 255, 0.1);
 bottom: -24%;
 content: "";
 height: 56%;
 position: absolute;
 right: -18%;
 transform: rotate(-10deg);
 width: 54%;
}

.playbook-hero__grid {
 align-items: center;
 display: grid;
 gap: clamp(2rem, 5vw, 5rem);
 grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
 position: relative;
 z-index: 1;
}

.playbook-hero__copy h1 {
 color: var(--ink);
 font-size: clamp(5rem, 12vw, 11rem);
 letter-spacing: 0.01em;
 margin-top: 1.3rem;
 max-width: 760px;
}

.playbook-hero__sub {
 color: var(--ink);
 font-size: clamp(1.25rem, 2.5vw, 1.75rem);
 line-height: 1.32;
 margin-top: 1.5rem;
 max-width: 610px;
}

.playbook-hero__text {
 color: rgba(31, 31, 35, 0.74);
 font-size: 1.05rem;
 line-height: 1.7;
 margin-top: 1.2rem;
 max-width: 590px;
}

.playbook-actions {
 align-items: center;
 display: flex;
 flex-wrap: wrap;
 gap: 0.9rem;
 margin-top: 2rem;
}

.playbook-cover {
 background: #ffffff;
 border: 1px solid rgba(10, 10, 10, 0.08);
 box-shadow: 0 24px 70px rgba(10, 10, 10, 0.12);
 padding: 0.8rem;
}

.playbook-cover img {
 aspect-ratio: 4 / 5.65;
 display: block;
 height: auto;
 object-fit: cover;
 width: 100%;
}

.playbook-section {
 padding: clamp(4rem, 7vw, 6rem) 0;
}

.section-kicker {
 color: var(--cobalt);
 display: inline-block;
 font-size: 0.82rem;
 font-weight: 800;
 letter-spacing: 0.16em;
 text-transform: uppercase;
}

.playbook-card-grid {
 display: grid;
 gap: 1rem;
 grid-template-columns: repeat(5, minmax(0, 1fr));
 margin-top: 1.8rem;
}

.playbook-card,
.playbook-for__cards article {
 background: #ffffff;
 border: 1px solid rgba(10, 10, 10, 0.08);
 color: var(--ink);
 font-size: 0.98rem;
 font-weight: 650;
 line-height: 1.45;
 min-height: 150px;
 padding: 1.3rem;
}

.playbook-card::before,
.playbook-for__cards article::before {
 background: var(--cobalt);
 content: "";
 display: block;
 height: 4px;
 margin-bottom: 1rem;
 width: 46px;
}

.playbook-for {
 align-items: start;
 display: grid;
 gap: clamp(2rem, 5vw, 4.5rem);
 grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
}

.playbook-for p {
 color: rgba(31, 31, 35, 0.76);
 font-size: clamp(1.2rem, 2vw, 1.55rem);
 line-height: 1.55;
 margin-top: 1.2rem;
}

.playbook-for__cards {
 display: grid;
 gap: 1rem;
 grid-template-columns: repeat(3, minmax(0, 1fr));
}

.playbook-for__cards article {
 min-height: 130px;
}

.playbook-final-cta {
 align-items: center;
}

.playbook-final-cta p {
 max-width: 700px;
}

@media (max-width: 1023px) {
 .playbook-hero__grid,
 .playbook-for {
 grid-template-columns: 1fr;
 }

 .playbook-cover {
 max-width: 420px;
 }

 .playbook-card-grid {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }

 .playbook-for__cards {
 grid-template-columns: repeat(3, minmax(0, 1fr));
 }
}

@media (max-width: 640px) {
 .playbook-hero {
 padding-bottom: 3rem;
 padding-top: 3.5rem;
 }

 .playbook-hero::after {
 opacity: 0.5;
 }

 .playbook-hero__copy h1 {
 font-size: clamp(4rem, 22vw, 5.4rem);
 }

 .playbook-actions,
 .playbook-actions .btn-primary,
 .playbook-actions .btn-outline,
 .playbook-final-cta .btn-primary {
 width: 100%;
 }

 .playbook-card-grid,
 .playbook-for__cards {
 grid-template-columns: 1fr;
 }

 .playbook-card,
 .playbook-for__cards article {
 min-height: 0;
 }
}

/* ---------- Audit fixes: mobile containment, links and card alignment ---------- */
*,
*::before,
*::after {
 box-sizing: border-box;
}

img,
svg,
video,
canvas {
 max-width: 100%;
}

.btn-primary,
.btn-outline,
.btn-outline-light {
 max-width: 100%;
}

.resource-card,
.segment-card,
.package-card,
.inner-card,
.day-card,
.playbook-card,
.playbook-for__cards article,
.lesson-overview-card {
 min-width: 0;
}

.resource-card,
.segment-card {
 display: flex;
 flex-direction: column;
 height: 100%;
}

.resource-card .explore-link,
.segment-card .explore-link,
.day-card-footer,
.package-card .package-cta {
 margin-top: auto;
}

.resource-card .explore-link,
.segment-card .explore-link {
 padding-top: 18px;
}

.resource-card h3,
.segment-card h3,
.inner-card h3,
.day-card h3,
.playbook-card,
.playbook-for__cards article,
.lesson-overview-card h3 {
 overflow-wrap: anywhere;
}

.contact-item[aria-disabled="true"] {
 cursor: default;
}

@media (max-width: 767px) {
 body {
 overflow-x: hidden;
 }

 #site-header > .max-w-7xl {
 min-width: 0;
 }

 main,
 section,
 header,
 footer,
 .hero-rebrand,
 .inner-hero,
 .playbook-hero,
 .challenge-day-page {
 max-width: 100%;
 overflow-x: clip;
 }

 @supports not (overflow: clip) {
 main,
 section,
 header,
 footer,
 .hero-rebrand,
 .inner-hero,
 .playbook-hero,
 .challenge-day-page {
 overflow-x: hidden;
 }
 }

 .hero-rebrand > .max-w-7xl,
 .inner-hero > div,
 .playbook-hero .max-w-7xl,
 .challenge-day-page .mx-auto,
 .resource-gallery .mx-auto,
 .mx-auto.max-w-7xl,
 .mx-auto.max-w-4xl,
 .mx-auto.max-w-3xl {
 min-width: 0;
 max-width: 100%;
 width: 100%;
 }

 .hero-rebrand .grid,
 .inner-hero .grid,
 .playbook-hero__grid,
 .challenge-strip .flex,
 .resource-gallery .flex,
 #packages .grid,
 #who .grid,
 #contact .grid {
 min-width: 0;
 width: 100%;
 }

 .hero-rebrand .grid > *,
 .inner-hero .grid > *,
 .playbook-hero__grid > *,
 .challenge-strip .flex > *,
 .resource-gallery .flex > *,
 #packages .grid > *,
 #who .grid > *,
 #contact .grid > * {
 min-width: 0;
 max-width: 100%;
 }

 .hero-title {
 font-size: clamp(36px, 11.5vw, 50px) !important;
 line-height: 0.98;
 max-width: 100%;
 }

 .hero-title span,
 .hero-line,
 .hero-sub,
 .font-display,
 section h1,
 section h2,
 section h3,
 .inner-hero h1,
 .inner-hero p,
 .playbook-hero__copy,
 .playbook-hero__copy h1,
 .playbook-hero__sub,
 .playbook-hero__text,
 .challenge-day-page .section-description {
 max-width: 100%;
 overflow-wrap: anywhere;
 white-space: normal;
 }

 .hero-badge,
 .hero-title,
 .hero-line,
 .hero-sub,
 .hero-rebrand h1,
 .hero-rebrand h2,
 .hero-rebrand p,
 .challenge-strip p,
 .challenge-strip .font-display,
 #packages h2,
 #packages p,
 .resource-gallery h2,
 .resource-gallery p,
 .free-resources-hero h1,
 .free-resources-hero p,
 .playbook-hero h1,
 .playbook-hero p,
 .challenge-day-page .inner-hero h1,
 .challenge-day-page .inner-hero p {
 max-width: calc(100vw - 48px) !important;
 }

 .hero-title,
 .hero-title span,
 .hero-line,
 #packages h2,
 .resource-gallery h2,
 .inner-hero h1,
 .playbook-hero h1,
 .challenge-day-page .inner-hero h1 {
 word-break: break-word;
 }

 .hero-line {
 font-size: clamp(18px, 5.4vw, 22px) !important;
 line-height: 1.28;
 }

 .hero-sub {
 font-size: 15px;
 line-height: 1.55;
 }

 .hero-primary,
 .hero-secondary,
 .challenge-strip .btn-primary,
 .free-resources-hero .btn-primary,
 .playbook-actions .btn-primary,
 .playbook-actions .btn-outline,
 .playbook-final-cta .btn-primary,
 .cta-panel .btn-primary,
 .cta-panel .btn-outline {
 width: 100%;
 white-space: normal;
 text-align: center;
 }

 .hero-refrain {
 width: 100%;
 letter-spacing: 0.16em;
 line-height: 1.7;
 overflow-wrap: break-word;
 }

 .inner-hero h1 {
 font-size: clamp(2.55rem, 12vw, 3.55rem) !important;
 line-height: 0.98;
 }

 .inner-hero .text-xl,
 .inner-hero p {
 font-size: 1rem;
 line-height: 1.55;
 }

 .category-chips {
 max-width: 100%;
 }

 .category-chip {
 max-width: 100%;
 white-space: normal;
 overflow-wrap: anywhere;
 }

 .resource-grid,
 .timeline-grid,
 .playbook-card-grid,
 .playbook-for__cards {
 grid-template-columns: 1fr !important;
 }

 .resource-card,
 .segment-card,
 .package-card,
 .inner-card,
 .day-card {
 width: 100%;
 }

 .resource-card h3,
 .inner-card h3,
 .day-card h3 {
 font-size: clamp(1.65rem, 9vw, 2rem);
 line-height: 1.02;
 }

 .challenge-strip > div,
 .challenge-strip .flex.items-center,
 .challenge-strip .flex.items-center > div:last-child {
 min-width: 0;
 width: 100%;
 }

 .challenge-strip .font-display {
 font-size: clamp(1.45rem, 9vw, 1.9rem);
 line-height: 1.05;
 }

 .challenge-strip p {
 overflow-wrap: anywhere;
 }

 .hero-signature {
 width: 100%;
 }

 .hero-signature small {
 min-width: 0;
 overflow-wrap: anywhere;
 }

 .playbook-hero {
 padding-top: 3rem;
 }

 .playbook-hero__copy h1 {
 font-size: clamp(2.9rem, 14vw, 4rem) !important;
 line-height: 0.95;
 }

 .playbook-hero__sub {
 font-size: clamp(1.05rem, 6vw, 1.35rem);
 }

 .playbook-cover {
 width: 100%;
 max-width: 100%;
 }

 .playbook-card,
 .playbook-for__cards article {
 min-height: 0;
 }

 .challenge-day-page .inner-hero h1 {
 font-size: clamp(2.45rem, 11vw, 3.35rem) !important;
 }

 .challenge-word {
 max-width: 100%;
 overflow: hidden;
 }

 .challenge-mini-nav {
 max-width: 100%;
 }

 .challenge-mini-nav__scroller {
 padding-inline: 1rem;
 }

 .mobile-learning-path-compact {
 flex-wrap: wrap;
 white-space: normal;
 }

 .mobile-learning-path-compact span {
 overflow-wrap: anywhere;
 }
}

@media (min-width: 768px) and (max-width: 1023px) {
 .hero-title,
 .inner-hero h1,
 .playbook-hero__copy h1,
 .challenge-day-page .inner-hero h1 {
 max-width: 100%;
 }

 .resource-grid,
 .timeline-grid {
 grid-template-columns: repeat(2, minmax(0, 1fr));
 }
}

/* ---------- Professional Communication Audit ---------- */
.audit-page-hero {
 background: linear-gradient(135deg, #050505 0%, #0a0a0a 56%, #101116 100%);
 color: #fff;
 overflow: hidden;
 position: relative;
}

.audit-page-hero::after {
 background: radial-gradient(circle, rgba(10,61,255,.22), transparent 68%);
 content: "";
 height: 260px;
 position: absolute;
 right: -90px;
 top: -90px;
 width: 260px;
}

.audit-page-hero__content {
 max-width: 760px;
 position: relative;
 z-index: 1;
}

.audit-intro {
 color: rgba(255,255,255,.78);
 font-size: clamp(1.05rem, 1.4vw, 1.25rem);
 line-height: 1.7;
 max-width: 680px;
}

.audit-intro p + p {
 margin-top: 1rem;
}

.audit-time {
 color: #fff;
 display: inline-flex;
 font-size: 0.95rem;
 font-weight: 700;
 letter-spacing: 0.02em;
}

.audit-hero-subtitle {
 color: rgba(255,255,255,.78);
 font-size: clamp(1.05rem, 1.7vw, 1.35rem);
 font-weight: 400;
 line-height: 1.55;
 max-width: 620px;
}

.audit-benefits {
 display: grid;
 gap: 16px;
 grid-template-columns: repeat(3, minmax(0, 1fr));
}

.audit-benefit {
 align-items: flex-start;
 background: var(--cool);
 border: 1px solid #e6e9f1;
 border-radius: 18px;
 display: flex;
 gap: 12px;
 padding: 20px;
}

.audit-benefit span {
 color: var(--cobalt);
 font-weight: 800;
}

.audit-benefit p {
 color: rgba(31,31,35,.82);
 font-weight: 600;
 line-height: 1.5;
}

.tally-embed-wrap {
 background: #fff;
 border: 0;
 border-radius: 0;
 overflow: hidden;
 width: 100%;
}

.tally-embed-wrap iframe {
 display: block;
 min-height: 760px;
 width: 100%;
}

.audit-cta-block {
 align-items: center;
 background: var(--cool);
 border: 1px solid #e6e9f1;
 border-radius: 18px;
 display: flex;
 gap: 24px;
 justify-content: space-between;
 padding: 24px;
}

.audit-cta-block--light {
 background: #fff;
}

.audit-cta-block h3 {
 color: var(--ink);
 font-family: "Bebas Neue", sans-serif;
 font-size: clamp(2rem, 3vw, 2.6rem);
 line-height: 1;
}

.audit-cta-block p {
 color: rgba(31,31,35,.78);
 line-height: 1.65;
 margin-top: 8px;
 max-width: 680px;
}

.package-guidance-block {
 text-align: center;
}

.package-guidance-block p {
 margin-inline: auto;
}

.audit-cta-block .btn-primary {
 flex: 0 0 auto;
}

@media (max-width: 767px) {
 .audit-benefits {
 grid-template-columns: 1fr;
 }

 .audit-cta-block {
 align-items: stretch;
 flex-direction: column;
 }

 .audit-cta-block .btn-primary {
 justify-content: center;
 width: 100%;
 }

 .tally-embed-wrap iframe {
 min-height: 820px;
 }
}

@media (max-width: 640px) {
 .homepage-cta-band {
 padding: 24px 20px;
 }

 .homepage-cta-inner {
 border-radius: 0;
 padding: 0;
 }

 .homepage-cta-actions {
 align-items: stretch;
 flex-direction: column;
 gap: 12px;
 }

 .homepage-cta-actions .hero-primary,
 .homepage-cta-actions .hero-secondary {
 width: 100%;
 }

 .about-copy .homepage-cta-band {
 padding-top: 24px;
 }
}

/* ---------- Homepage CTA consistency lock ---------- */
.hero-rebrand .hero-cta-stack,
.homepage-cta-actions .hero-cta-stack {
 align-items: center;
 justify-content: center;
 min-height: 68px;
 text-align: center;
}

.hero-rebrand .hero-secondary,
.homepage-cta-actions .hero-secondary {
 background: transparent;
 border-color: var(--cobalt);
 color: var(--cobalt);
}

.hero-rebrand .hero-secondary:hover,
.homepage-cta-actions .hero-secondary:hover {
 background: var(--cobalt);
 border-color: var(--cobalt);
 color: #fff;
}

.homepage-cta-inner {
 background: transparent;
 border-radius: 0;
 box-shadow: none;
 padding: 0;
}

.homepage-cta-band {
 align-items: center;
 display: flex;
 justify-content: center;
 padding-block: 22px;
}

.about-copy .homepage-cta-band {
 padding-block: 22px;
 padding-inline: 0;
}

.pain-cta-slot .homepage-cta-band {
 padding: 48px 0 0;
}

@media (min-width: 641px) {
 .homepage-cta-actions {
  flex-wrap: nowrap;
 }

 .homepage-cta-actions .hero-primary,
 .homepage-cta-actions .hero-secondary {
 flex: 1 1 0;
 width: 100%;
 }
}

@media (max-width: 640px) {
 .homepage-cta-band {
  padding-block: 20px;
 }

 .about-copy .homepage-cta-band {
  padding-block: 20px;
  padding-inline: 0;
 }

 .pain-cta-slot .homepage-cta-band {
  padding-top: 36px;
 }

 .hero-rebrand .hero-primary,
 .hero-rebrand .hero-secondary,
 .homepage-cta-actions .hero-primary,
 .homepage-cta-actions .hero-secondary {
 width: 100%;
 }
}

.story-button,
.story-button.btn-outline {
 background: #fff;
 border: 0;
 color: #0A0A0A;
}

.story-button:hover,
.story-button.btn-outline:hover {
 background: #0A0A0A;
 border: 0;
 color: #fff;
}

/* ---------- Homepage hero refinement ---------- */
.hero-rebrand .hero-square,
.hero-rebrand::after,
.hero-portrait-wrap::before,
.hero-portrait-wrap::after,
.hero-stairs,
.hero-signature {
 display: none;
}

.hero-rebrand .grid {
 align-items: center;
}

.hero-line {
 color: rgba(255,255,255,.88);
 font-size: clamp(21px, 1.9vw, 28px);
 font-weight: 400;
 line-height: 1.38;
 max-width: 690px;
}

.hero-audit-link {
 color: var(--cobalt);
 display: inline-block;
 font-size: 0.95rem;
 font-weight: 600;
 line-height: 1.45;
 margin-top: 18px;
 opacity: .92;
 text-decoration: none;
}

.hero-audit-link:hover {
 color: #fff;
}

.hero-rebrand .hero-primary {
 width: 282px;
}

.hero-rebrand .hero-primary.hero-cta-stack {
 min-height: 56px;
 padding-bottom: 8px;
 padding-top: 8px;
}

.hero-portrait-wrap {
 justify-content: center;
 min-height: 0;
 padding-top: 0;
}

.hero-portrait-ring {
 transform: none;
 width: min(410px, 88vw);
}

.hero-refrain {
 border-top-color: rgba(199,216,255,.36);
 margin: 64px auto 0;
 max-width: 100%;
 text-align: center;
 width: fit-content;
}

@media (min-width: 1024px) {
 .hero-rebrand .grid {
 column-gap: clamp(4rem, 7vw, 7rem);
 grid-template-columns: minmax(0, 610px) minmax(410px, 1fr);
 }

 .hero-rebrand .grid > div:first-child {
 max-width: 610px;
 }

 .hero-portrait-wrap {
 min-width: 410px;
 }
}

@media (max-width: 1023px) {
 .hero-portrait-ring {
 width: min(360px, 76vw);
 }

 .hero-refrain {
 margin-top: 38px;
 }
}

@media (max-width: 640px) {
 .hero-rebrand .hero-primary {
 max-width: 100%;
 width: 282px;
 }

 .hero-audit-link {
 font-size: 0.88rem;
 margin-top: 14px;
 }

 .hero-line {
 font-size: clamp(19px, 5.4vw, 22px) !important;
 line-height: 1.4;
 }

 .hero-portrait-ring {
 width: min(280px, 72vw);
 }

 .hero-refrain {
 margin-top: 30px;
 }
}