/* TeachWiz V8.5 homepage sections
   The shared V8 stylesheet remains untouched for hubs and inner pages. */

.v84 {
  --v84-night: #07182c;
  --v84-night-deep: #030b16;
  --v84-card: #102943;
  --v84-card-solid: #0c223a;
  --v84-blue: #254c73;
  --v84-ink: #142a47;
  --v84-gold: #d7ad4e;
  --v84-gold-light: #f4d98f;
  --v84-cream: #fbfaf7;
  --v84-warm: #f2efe8;
  --v84-line: rgba(20, 42, 71, .13);
  --v84-ease: cubic-bezier(.2, .78, .2, 1);
  --v84-max: 1740px;
  background: var(--v84-cream);
  color: var(--v84-ink);
  overflow-x: hidden;
}

.v84 .container { width: min(calc(100% - 64px), 1380px); }

/* Header */
.v84 .site-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 80;
  height: 88px;
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  box-shadow: none;
  transition: background .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.v84 .site-header .header-inner {
  width: min(calc(100% - 64px), var(--v84-max));
  max-width: none;
  height: 88px;
}

.v84 .site-header.scrolled {
  position: fixed;
  height: 76px;
  background: rgba(251, 250, 247, .96);
  border-color: rgba(20, 42, 71, .1);
  box-shadow: 0 12px 36px rgba(8, 25, 45, .08);
  backdrop-filter: blur(16px);
}

.v84 .site-header.scrolled .header-inner { height: 76px; }
.v84 .site-header:not(.scrolled) .brand-logo-dark { display: none !important; }
.v84 .site-header:not(.scrolled) .brand-logo-light {
  display: block !important;
  filter: brightness(0) invert(1) drop-shadow(0 5px 16px rgba(0, 0, 0, .22)) !important;
}
.v84 .site-header:not(.scrolled) .site-nav > a:not(.btn) { color: rgba(255, 255, 255, .82); }
.v84 .site-header:not(.scrolled) .site-nav > a:not(.btn):hover { color: #fff; }
.v84 .site-header:not(.scrolled) .lang-switch {
  color: #fff;
  background: rgba(255, 255, 255, .06);
  border-color: rgba(255, 255, 255, .22);
}
.v84 .site-header .btn-small {
  min-height: 42px;
  padding: 0 18px;
  color: var(--v84-night);
  background: var(--v84-gold-light);
  border-color: transparent;
  box-shadow: 0 10px 28px rgba(215, 173, 78, .14);
}

/* Homepage rhythm after the hero */
.v84 main > .section { padding: clamp(88px, 8vw, 128px) 0; }
.v84 main > .section::after { content: ""; position: absolute; left: 50%; bottom: 0; width: min(88%, 1200px); height: 1px; background: linear-gradient(90deg, transparent, rgba(20, 42, 71, .1), transparent); transform: translateX(-50%); }
.v84 .section .container { width: min(calc(100% - 64px), 1380px); max-width: 1380px; }
.v84 .section-head { max-width: 900px; margin: 0 auto 54px; text-align: left; }
.v84 .section-head .eyebrow,
.v84 .video-copy .eyebrow,
.v84 .two-col .eyebrow,
.v84 .regional-card .eyebrow,
.v84 .insight-card .eyebrow,
.v84 .final-cta-card .eyebrow { color: #8a6b27; font-size: 11px; letter-spacing: .17em; }
.v84 .section h2,
.v84 .section-head h2,
.v84 .two-col h2 { color: var(--v84-ink); font-size: clamp(40px, 4.6vw, 68px); line-height: 1.01; letter-spacing: -.055em; }
.v84 .section p { color: rgba(20, 42, 71, .64); font-size: 16px; line-height: 1.65; }
.v84 .strong { font-weight: 800; }

.v84-video-section { background: var(--v84-cream) !important; }
.v84-video-section::before { content: ""; position: absolute; top: 0; left: 12%; width: 1px; height: 78px; background: linear-gradient(var(--v84-gold), transparent); }
.v84-video-section .video-container { max-width: 1380px !important; }
.v84-video-section .video-copy { max-width: 920px; margin: 0 0 44px; text-align: left; }
.v84-video-section .video-copy h2 { font-size: clamp(40px, 4.6vw, 68px); }
.v84-video-section .video-frame-large { width: 100%; padding: 12px; border: 1px solid rgba(244, 217, 143, .18); border-radius: 22px; background: linear-gradient(145deg, var(--v84-card), var(--v84-night-deep)); box-shadow: 0 34px 90px rgba(7, 24, 44, .2); }

.v84 .full-cycle-section { background: var(--v84-warm); }
.v84 .cycle-track { gap: 0; border: 1px solid var(--v84-line); border-radius: 22px; overflow: hidden; background: rgba(255, 255, 255, .7); box-shadow: 0 26px 70px rgba(20, 42, 71, .08); }
.v84 .cycle-step { min-height: 310px; padding: 34px 30px; border: 0; border-right: 1px solid var(--v84-line); border-radius: 0; background: transparent; box-shadow: none; }
.v84 .cycle-step:last-child { border-right: 0; }
.v84 .cycle-step::before { content: ""; position: absolute; top: 0; left: 0; width: 0; height: 3px; background: var(--v84-gold); transition: width .35s ease; }
.v84 .cycle-step:hover::before { width: 100%; }
.v84 .cycle-step h3 { margin-top: 54px; font-size: 24px; letter-spacing: -.02em; }
.v84 .cycle-step p { font-size: 15px; }
.v84 .cycle-index { background: transparent; border-color: rgba(215, 173, 78, .5); }
.v84 .cycle-arrow { display: none; }
.v84 .cycle-note { margin-top: 22px; padding: 22px 26px; border-radius: 14px; background: var(--v84-ink); }

.v84 #solutions { background: var(--v84-night); color: #fff; border: 0; }
.v84 #solutions::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 82% 18%, rgba(37, 76, 115, .36), transparent 35%); pointer-events: none; }
.v84 #solutions .container { position: relative; z-index: 1; }
.v84 #solutions .section-head h2,
.v84 #solutions .section-head p { color: #fff; }
.v84 #solutions .section-head p { color: rgba(255, 255, 255, .62); }
.v84 #solutions .section-head .eyebrow { color: var(--v84-gold-light); }
.v84 .solution-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; }
.v84 .solution-card { position: relative; min-height: 290px; padding: 30px; color: #fff; border: 1px solid rgba(255, 255, 255, .1); border-radius: 16px; background: rgba(255, 255, 255, .035); box-shadow: none; overflow: hidden; }
.v84 .solution-card::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: linear-gradient(90deg, var(--v84-gold), transparent); transform: scaleX(0); transform-origin: left; transition: transform .3s ease; }
.v84 .solution-card:hover { transform: translateY(-4px); border-color: rgba(244, 217, 143, .26); background: rgba(255, 255, 255, .06); box-shadow: 0 22px 54px rgba(0, 0, 0, .18); }
.v84 .solution-card:hover::after { transform: scaleX(1); }
.v84 .solution-card h3 { margin-top: 28px; color: #fff; font-size: 23px; }
.v84 .solution-card p { color: rgba(255, 255, 255, .58); font-size: 14.5px; }
.v84 .solution-card b,
.v84 #solutions .text-link { color: var(--v84-gold-light); }

.v84 #services { background: #fff; }
.v84 .v8-service-grid { grid-template-columns: repeat(3, 1fr); gap: 16px; }
.v84 .v8-service-card { min-height: 300px; padding: 32px; border: 1px solid var(--v84-line); border-radius: 16px; background: #fff; box-shadow: none; }
.v84 .v8-service-card:hover { border-color: rgba(215, 173, 78, .4); transform: translateY(-3px); box-shadow: 0 24px 60px rgba(20, 42, 71, .1); }
.v84 .v8-service-card.featured { grid-column: span 2; color: #fff; background: linear-gradient(135deg, var(--v84-ink), var(--v84-blue)); }
.v84 .v8-service-card.featured h3 { color: #fff; }
.v84 .v8-service-card.featured p { color: rgba(255, 255, 255, .76); }
.v84 .v8-service-card.featured b { color: var(--v84-gold-light); }
.v84 .v8-service-card.featured > span { color: var(--v84-gold-light); }
.v84 .v8-service-card h3 { margin-top: 44px; font-size: 27px; letter-spacing: -.03em; }
.v84 .v8-service-card p { font-size: 15px; line-height: 1.58; }

.v84 .audience-section { background: var(--v84-warm); }
.v84 .audience-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--v84-line); border-bottom: 1px solid var(--v84-line); }
.v84 .audience-card { min-height: 210px; padding: 34px 30px; border: 0; border-right: 1px solid var(--v84-line); border-radius: 0; background: transparent; }
.v84 .audience-card:nth-child(even), .v84 .audience-card:last-child { border-right: 0; }
.v84 .audience-card:nth-child(n+3) { border-top: 1px solid var(--v84-line); }
.v84 .audience-card h3 { font-size: 25px; letter-spacing: -.025em; }

.v84 .pattern-section { background: #fff; }
.v84 .pattern-section::before { opacity: .16; filter: grayscale(1); }
.v84 .process-grid { gap: 14px; }
.v84 .process-card { min-height: 250px; padding: 30px; border: 1px solid var(--v84-line); border-radius: 16px; background: rgba(255, 255, 255, .88); box-shadow: 0 18px 44px rgba(20, 42, 71, .05); }
.v84 .process-card > span { width: 46px; height: 46px; background: var(--v84-ink); color: var(--v84-gold-light); }
.v84 .process-card h3 { margin-top: 35px; }

.v84 .academy { background: linear-gradient(135deg, var(--v84-night-deep), var(--v84-ink) 74%, #183c65); }
.v84 .academy::before { background: radial-gradient(circle at 18% 22%, rgba(215, 173, 78, .16), transparent 30%), radial-gradient(circle at 82% 18%, rgba(62, 124, 179, .18), transparent 32%); }
.v84 .academy h2 { color: #fff; }
.v84 .academy p { color: rgba(255, 255, 255, .7); }
.v84 .academy .eyebrow { color: var(--v84-gold-light); }
.v84 .academy .two-col { grid-template-columns: .9fr 1.1fr; gap: 78px; }
.v84 .academy .check-list li { color: rgba(255, 255, 255, .9); }
.v84 .academy-map { position: relative; padding: 14px 0 0 34px; color: #fff; }
.v84 .academy-map::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: linear-gradient(transparent, rgba(244, 217, 143, .72) 18%, rgba(244, 217, 143, .22) 82%, transparent); }
.v84 .academy-map-head { min-height: 58px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; border-bottom: 1px solid rgba(255, 255, 255, .2); }
.v84 .academy-map-head span { color: rgba(255, 255, 255, .58); font-size: 12px; font-weight: 800; letter-spacing: .14em; }
.v84 .academy-map-head strong { color: var(--v84-gold-light); font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.v84 .academy-map-stages { margin: 0; padding: 0; list-style: none; }
.v84 .academy-map-stages li { position: relative; min-height: 124px; display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; align-items: center; gap: 20px; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.v84 .academy-map-stages li::before { content: ""; position: absolute; left: -34px; top: 50%; width: 34px; height: 1px; background: rgba(244, 217, 143, .42); }
.v84 .academy-map-index { width: 45px; aspect-ratio: 1; display: grid; place-items: center; color: var(--v84-night-deep); border-radius: 50%; background: var(--v84-gold-light); font-size: 12px; font-weight: 800; box-shadow: 0 0 0 7px rgba(215, 173, 78, .08); }
.v84 .academy-map-stages b { display: block; color: #fff; font-size: clamp(19px, 1.55vw, 24px); line-height: 1.2; letter-spacing: -.025em; }
.v84 .academy-map-stages small { display: block; margin-top: 7px; color: rgba(255, 255, 255, .68); font-size: 14px; line-height: 1.45; }
.v84 .academy-map-stages em { color: rgba(244, 217, 143, .72); font-size: 12px; font-style: normal; font-weight: 800; letter-spacing: .12em; }
.v84 .academy-map-outcomes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 18px; background: rgba(255, 255, 255, .13); }
.v84 .academy-map-outcomes span { min-height: 44px; display: grid; place-items: center; padding: 8px 10px; color: rgba(255, 255, 255, .66); background: rgba(3, 11, 22, .46); font-size: 12px; font-weight: 800; letter-spacing: .04em; text-align: center; text-transform: uppercase; }

.v84 .regional-section { padding: 44px 0 !important; background: var(--v84-warm); }
.v84 .regional-card { display: grid; grid-template-columns: .85fr 1.15fr; gap: 60px; padding: 46px 52px; border: 0; border-left: 3px solid var(--v84-gold); border-radius: 0; background: transparent; }

.v84 .insight-section { background: #fff; }
.v84 .insight-card { grid-template-columns: 1.08fr .92fr; gap: 70px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.v84 .insight-copy h2 { font-size: clamp(40px, 4.2vw, 66px); }
.v84 .insight-quote { min-height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 52px; border-radius: 18px; background: var(--v84-ink); }
.v84 .insight-quote blockquote { font-size: clamp(25px, 2.4vw, 36px); }

.v84 .knowledge-home { background: var(--v84-warm); }
.v84 .knowledge-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; }
.v84 .knowledge-card { min-height: 285px; padding: 30px; border: 1px solid var(--v84-line); border-radius: 16px; background: rgba(255, 255, 255, .72); box-shadow: none; }
.v84 .knowledge-card:hover { background: #fff; border-color: rgba(215, 173, 78, .38); box-shadow: 0 22px 54px rgba(20, 42, 71, .08); }
.v84 .knowledge-card h3 { margin-top: 28px; font-size: 23px; }

.v84 .partner-section { background: #fff; }
.v84 .partner-section .two-col { gap: 76px; }
.v84 .partner-card { padding: 46px; border: 1px solid var(--v84-line); border-radius: 18px; background: var(--v84-cream); box-shadow: none; }
.v84 .client-logo { height: 100px; border: 1px solid var(--v84-line); border-radius: 12px; box-shadow: none; }

.v84 .final-cta-v8 { padding: 70px 0 92px !important; background: var(--v84-night-deep); }
.v84 .final-cta-v8::after { display: none; }
.v84 .final-cta-card { padding: 54px 58px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 20px; background: linear-gradient(135deg, rgba(255, 255, 255, .055), rgba(37, 76, 115, .28)); box-shadow: 0 28px 80px rgba(0, 0, 0, .25); }
.v84 .final-cta-card h2 { color: #fff; }
.v84 .final-cta-card p { color: rgba(255, 255, 255, .64); }
.v84 .final-cta-card .eyebrow { color: var(--v84-gold-light); }

.v84 .site-footer { background: var(--v84-night-deep); border-top: 1px solid rgba(215, 173, 78, .2); }

.v84 .v8-reveal { transform: translateY(22px); opacity: 0; transition: opacity .72s var(--v84-ease), transform .72s var(--v84-ease); }
.v84 .v8-reveal.is-visible { transform: none; opacity: 1; }

@keyframes v84-copy-in { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes v84-panel-in { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes v84-impact-in { 0% { opacity: 0; transform: translateY(12px) scale(.94); } 68% { opacity: 1; transform: translateY(0) scale(1.025); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes v84-draw-path { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes v84-calm-line { to { opacity: .27; } }
@keyframes v84-calm-glow { to { opacity: .045; } }
@keyframes v84-rail-draw { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes v84-aurora-one { to { transform: translate3d(-34px, 30px, 0) rotate(18deg) scale(1.08); } }
@keyframes v84-aurora-two { to { transform: translate3d(36px, -24px, 0) scale(1.12); } }

@media (max-width: 1040px) {
  .v84 .cycle-track,
  .v84 .solution-grid,
  .v84 .v8-service-grid,
  .v84 .knowledge-grid { grid-template-columns: repeat(2, 1fr); }
  .v84 .cycle-step { border-bottom: 1px solid var(--v84-line); }
  .v84 .cycle-step:nth-child(2n) { border-right: 0; }
  .v84 .audience-grid { grid-template-columns: 1fr; }
  .v84 .audience-card { border-right: 0; border-bottom: 1px solid var(--v84-line); }
  .v84 .academy .two-col,
  .v84 .insight-card,
  .v84 .partner-section .two-col { grid-template-columns: 1fr; gap: 52px; }
}

@media (max-width: 860px) {
  .v84 .site-nav { top: 76px; }
}

@media (max-width: 700px) {
  .v84 .container,
  .v84 .section .container { width: calc(100% - 32px); }
  .v84 .site-header { height: 70px; }
  .v84 .site-header .header-inner { width: calc(100% - 32px); height: 70px; }
  .v84 .site-header.scrolled,
  .v84 .site-header.scrolled .header-inner { height: 70px; }
  .v84 .site-nav { top: 70px; }
  .v84 main > .section { padding: 76px 0; }
  .v84 .section-head { margin-bottom: 36px; }
  .v84 .section h2,
  .v84 .section-head h2,
  .v84 .two-col h2 { font-size: 36px; }
  .v84-video-section .video-copy { margin-bottom: 28px; }
  .v84-video-section .video-frame-large { padding: 7px; border-radius: 16px; }
  .v84 .cycle-track,
  .v84 .solution-grid,
  .v84 .v8-service-grid,
  .v84 .knowledge-grid { grid-template-columns: 1fr; }
  .v84 .cycle-step { min-height: 245px; border-right: 0; }
  .v84 .v8-service-card.featured { grid-column: auto; }
  .v84 .regional-card { grid-template-columns: 1fr; gap: 22px; padding: 34px 20px; }
  .v84 .academy-map { padding-left: 22px; }
  .v84 .academy-map-head { min-height: 52px; }
  .v84 .academy-map-head span { max-width: 175px; }
  .v84 .academy-map-stages li { min-height: 112px; grid-template-columns: 44px minmax(0, 1fr); gap: 15px; }
  .v84 .academy-map-stages li::before { left: -22px; width: 22px; }
  .v84 .academy-map-index { width: 38px; }
  .v84 .academy-map-stages b { font-size: 18px; }
  .v84 .academy-map-stages small { font-size: 13px; }
  .v84 .academy-map-stages em { display: none; }
  .v84 .academy-map-outcomes { grid-template-columns: repeat(3, 1fr); }
  .v84 .academy-map-outcomes span { min-height: 48px; padding-inline: 5px; font-size: 12px; letter-spacing: 0; }
  .v84 .insight-quote { padding: 34px 26px; }
  .v84 .partner-card { padding: 30px 22px; }
  .v84 .final-cta-card { padding: 36px 26px; align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .v84-motes { display: none; }
  .v84 *,
  .v84 *::before,
  .v84 *::after { animation-duration: .001ms !important; animation-delay: 0ms !important; transition-duration: .001ms !important; }
  .v84 .v8-reveal { opacity: 1 !important; transform: none !important; }
}