.guide-page { background: #061427; }
.guide-notice { background: linear-gradient(90deg, #b62532, var(--red)); }
.guide-header { grid-template-columns: minmax(164px, 218px) minmax(0, 1fr) 44px; }
.header-back { justify-self: end; color: var(--cyan); font-size: 24px; text-decoration: none; }
.guide-progress { position: sticky; z-index: 20; top: 0; height: 3px; background: rgba(255,255,255,.08); }
.guide-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--red), var(--cyan)); transition: width .08s linear; }

.guide-hero { position: relative; min-height: 760px; padding: 88px 5vw 82px; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(420px, .78fr); gap: 7vw; align-items: center; overflow: hidden; background: radial-gradient(circle at 73% 42%, rgba(33,212,253,.09), transparent 28%), linear-gradient(128deg, var(--navy) 0 59%, #0a2140 59%); }
.guide-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .22; background: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 54px 54px; mask-image: linear-gradient(90deg, #000, transparent 78%); }
.guide-hero > * { position: relative; min-width: 0; }
.guide-hero h1 { max-width: 880px; margin: 0; font: 900 clamp(68px, 7.6vw, 118px)/.78 var(--display); letter-spacing: -.05em; text-transform: uppercase; }
.guide-hero h1 em { color: var(--red); font-style: normal; }
.guide-hero__subtitle { margin: 30px 0 0; color: var(--white); font: 900 clamp(24px, 2.2vw, 35px)/1.05 var(--display); text-transform: uppercase; }
.guide-hero__promise { max-width: 710px; margin: 18px 0 28px; color: #bdcbd9; font-size: 16px; line-height: 1.7; }
.guide-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.button--plain { min-height: 44px; padding: 0 18px; border: 0; background: transparent; color: var(--cyan); font: 900 10px var(--display); letter-spacing: .09em; text-transform: uppercase; cursor: pointer; }
.guide-slogan { max-width: 700px; margin: 30px 0 0; padding-top: 18px; border-top: 1px solid var(--rule); color: #7188a3; font-size: 10px; line-height: 1.55; letter-spacing: .08em; text-transform: uppercase; }

.guide-hero__board { min-height: 510px; position: relative; overflow: hidden; border: 1px solid rgba(33,212,253,.34); background: #07182e; box-shadow: 22px 22px 0 rgba(224,68,74,.1); }
.guide-hero__board::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, transparent 0 87px, rgba(243,245,247,.11) 88px 89px), linear-gradient(90deg, transparent 49.8%, rgba(243,245,247,.15) 50%, transparent 50.2%); }
.guide-hero__board::after { content: ""; position: absolute; left: 8%; right: 8%; bottom: 20%; height: 1px; background: var(--red); box-shadow: 0 0 15px rgba(224,68,74,.55); }
.field-mark { position: absolute; color: rgba(255,255,255,.055); font: 900 110px/1 var(--display); }
.field-mark--20 { left: 4%; top: 7%; } .field-mark--40 { right: 3%; top: 38%; }
.guide-hero__board .player { position: absolute; z-index: 3; width: 38px; height: 38px; display: grid; place-items: center; border: 2px solid var(--white); border-radius: 50%; color: var(--white); font: 900 12px var(--display); font-style: normal; }
.player--a { left: 13%; bottom: 14%; } .player--b { left: 41%; bottom: 14%; } .player--c { right: 13%; bottom: 14%; } .player--q { left: calc(50% - 19px); bottom: 4%; border-color: var(--red) !important; background: var(--red); }
.guide-hero__board .route { position: absolute; z-index: 2; bottom: 22%; width: 3px; background: var(--cyan); transform-origin: bottom; box-shadow: 0 0 10px rgba(33,212,253,.38); }
.guide-hero__board .route::after { content: ""; position: absolute; top: -4px; left: -3px; width: 7px; height: 7px; border-top: 2px solid var(--cyan); border-right: 2px solid var(--cyan); transform: rotate(-45deg); }
.guide-hero__board .route--a { left: 18%; height: 170px; transform: rotate(28deg); }
.guide-hero__board .route--b { left: 47%; height: 238px; }
.guide-hero__board .route--c { right: 18%; height: 190px; transform: rotate(-31deg); }
.guide-hero__board > b { position: absolute; z-index: 4; left: 25px; top: 20px; color: var(--cyan); font: 900 75px/.8 var(--display); }
.guide-hero__board > small { position: absolute; z-index: 4; left: 95px; top: 39px; color: var(--steel); font: 900 9px var(--display); letter-spacing: .15em; }
.guide-hero__board > strong { position: absolute; z-index: 4; right: 25px; top: 23px; color: var(--white); font: 900 18px/.95 var(--display); text-align: right; }

.guide-manifesto { padding: 48px 5vw; display: grid; grid-template-columns: minmax(320px, .9fr) minmax(0, 1.25fr) auto; gap: 5vw; align-items: end; border-block: 1px solid var(--rule); background: #030e1b; }
.guide-manifesto > * { min-width: 0; }
.guide-manifesto h2 { margin: 0; font: 900 clamp(36px, 4vw, 60px)/.88 var(--display); text-transform: uppercase; }
.guide-manifesto > p { margin: 0; color: var(--steel); font-size: 13px; line-height: 1.75; }
.guide-manifesto > a { color: var(--cyan); font: 900 9px var(--display); letter-spacing: .09em; text-decoration: none; text-transform: uppercase; white-space: nowrap; }

.guide-paths { padding: 92px 5vw 105px; background: #0a2140; }
.guide-section-heading { max-width: 1440px; margin: 0 auto 42px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 40px; align-items: end; }
.guide-section-heading h2 { margin: 0; font: 900 clamp(48px, 5.4vw, 78px)/.88 var(--display); letter-spacing: -.035em; text-transform: uppercase; }
.guide-path-grid { max-width: 1440px; margin: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; border: 1px solid var(--rule); background: var(--rule); }
.guide-path-card { min-height: 250px; padding: 27px; display: flex; flex-direction: column; background: var(--navy); color: var(--white); text-decoration: none; }
.guide-path-card span { color: var(--red); font: 900 30px/1 var(--display); }
.guide-path-card h3 { margin: auto 0 8px; font: 900 29px/.98 var(--display); text-transform: uppercase; }
.guide-path-card p { min-height: 55px; margin: 0; color: var(--steel); font-size: 12px; line-height: 1.55; }
.guide-path-card b { margin-top: 20px; padding-top: 15px; border-top: 1px solid var(--rule); color: var(--cyan); font: 900 9px var(--display); letter-spacing: .1em; text-transform: uppercase; }
.guide-path-card:hover { background: #10335d; }

.guide-reading { padding: 110px 5vw 125px; display: grid; grid-template-columns: minmax(230px, 310px) minmax(0, 1fr); gap: 7vw; align-items: start; background: var(--white); color: var(--navy); }
.guide-reading > * { min-width: 0; }
.guide-index { position: sticky; top: 32px; }
.guide-index h2 { margin: 0 0 24px; font: 900 44px/.9 var(--display); text-transform: uppercase; }
.guide-index nav { border-top: 1px solid #d3dbe3; }
.guide-index nav a { padding: 10px 0; display: grid; grid-template-columns: 29px minmax(0, 1fr); gap: 8px; border-bottom: 1px solid #d3dbe3; color: #617086; font-size: 10px; line-height: 1.3; text-decoration: none; }
.guide-index nav a span { color: var(--red); font-weight: 900; }
.guide-index nav a.active, .guide-index nav a:hover { color: var(--navy); font-weight: 900; }
.guide-index__pdf { margin-top: 24px; padding: 20px; display: flex; flex-direction: column; border: 1px solid var(--navy); background: var(--navy); color: white; text-decoration: none; }
.guide-index__pdf span { color: var(--cyan); font: 900 8px var(--display); letter-spacing: .12em; }
.guide-index__pdf strong { margin: 22px 0 16px; font: 900 22px/1 var(--display); text-transform: uppercase; }
.guide-index__pdf small { color: var(--red); font-weight: 900; text-transform: uppercase; }

.guide-modules { max-width: 970px; }
.guide-loading { min-height: 420px; display: grid; place-content: center; text-align: center; color: #718095; }
.guide-loading span { width: 36px; height: 36px; margin: auto; border: 3px solid #ccd5de; border-top-color: var(--red); border-radius: 50%; animation: guide-spin .75s linear infinite; }
@keyframes guide-spin { to { transform: rotate(360deg); } }
.guide-module { padding: 0 0 84px; scroll-margin-top: 28px; border-bottom: 1px solid #cfd8e1; }
.guide-module + .guide-module { padding-top: 84px; }
.guide-module__header { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 23px; align-items: start; }
.guide-module__number { width: 74px; height: 74px; display: grid; place-items: center; background: var(--red); color: white; font: 900 27px var(--display); }
.guide-module__header h2 { margin: 0; font: 900 clamp(43px, 5vw, 72px)/.86 var(--display); letter-spacing: -.035em; text-transform: uppercase; overflow-wrap: anywhere; }
.guide-module__intro { margin: 27px 0 20px; color: #40536b; font-size: 17px; line-height: 1.72; }
.guide-objective { margin: 0 0 34px; padding: 19px 22px; display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 18px; border-left: 4px solid var(--cyan); background: var(--navy); color: white; }
.guide-objective b { color: var(--cyan); font: 900 9px var(--display); letter-spacing: .12em; }
.guide-objective p { margin: 0; color: #d3dce6; font-size: 12px; line-height: 1.6; }
.guide-module__section { margin-top: 34px; }
.guide-module__section h3 { margin: 0 0 9px; font: 900 28px/1 var(--display); text-transform: uppercase; }
.guide-module__section > p { margin: 0; color: #42546b; font-size: 14px; line-height: 1.75; }
.guide-module__section ul { margin: 18px 0 0; padding: 0; list-style: none; }
.guide-module__section li { position: relative; padding: 11px 0 11px 26px; border-top: 1px solid #d8dfe6; color: #20374f; font-size: 13px; line-height: 1.55; }
.guide-module__section li::before { content: "→"; position: absolute; left: 0; color: var(--red); font-weight: 900; }
.guide-terms { margin-top: 37px; }
.guide-terms > p { color: var(--red); font: 900 9px var(--display); letter-spacing: .12em; }
.guide-terms dl { display: grid; grid-template-columns: 160px minmax(0, 1fr); margin: 0; border-top: 1px solid #ccd6df; }
.guide-terms dt, .guide-terms dd { margin: 0; padding: 13px; border-bottom: 1px solid #ccd6df; }
.guide-terms dt { color: var(--navy); font-weight: 900; }
.guide-terms dd { border-left: 1px solid #ccd6df; color: #4e6075; font-size: 12px; line-height: 1.5; }
.guide-takeaway { margin-top: 29px; padding: 20px 22px; border-left: 4px solid var(--red); background: #e9edf1; }
.guide-takeaway span { color: var(--red); font: 900 9px var(--display); letter-spacing: .12em; }
.guide-takeaway p { margin: 8px 0 0; color: var(--navy); font-weight: 800; line-height: 1.55; }

.guide-sources { padding: 105px 5vw; display: grid; grid-template-columns: minmax(300px, .8fr) minmax(0, 1.2fr); gap: 8vw; background: #07182e; }
.guide-sources header h2 { margin: 0; font: 900 clamp(48px, 5.4vw, 78px)/.88 var(--display); text-transform: uppercase; }
.guide-sources header > p:last-child { max-width: 620px; color: var(--steel); font-size: 13px; line-height: 1.7; }
#guide-source-grid { border-top: 1px solid var(--rule); }
.guide-source { padding: 21px 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; border-bottom: 1px solid var(--rule); color: white; text-decoration: none; }
.guide-source strong { display: block; margin-bottom: 6px; font: 900 16px/1.1 var(--display); text-transform: uppercase; }
.guide-source p { margin: 0; color: var(--steel); font-size: 11px; line-height: 1.55; }
.guide-source span { align-self: center; color: var(--cyan); font-size: 18px; }

.guide-finale { padding: 70px 5vw; display: grid; grid-template-columns: 180px minmax(0, 1fr) auto; gap: 5vw; align-items: center; background: var(--navy); border-top: 1px solid var(--rule); }
.guide-finale img { width: 180px; }
.guide-finale p { margin: 0 0 6px; color: var(--cyan); font: 900 9px var(--display); letter-spacing: .13em; }
.guide-finale h2 { margin: 0; font: 900 clamp(37px, 4vw, 60px)/.88 var(--display); text-transform: uppercase; }

@media (max-width: 1100px) {
  .guide-header .menu-toggle { display: block; margin-left: auto; }
  .guide-header nav { position: relative; }
  .guide-header nav ul { display: none; position: absolute; z-index: 40; top: 35px; right: 0; width: 235px; padding: 15px; flex-direction: column; gap: 0; background: var(--blue); border: 1px solid var(--rule); }
  .guide-header nav ul.open { display: flex; }
  .guide-header nav a { display: block; padding: 12px; }
  .guide-hero { grid-template-columns: 1fr; }
  .guide-hero__board { max-width: 760px; }
  .guide-manifesto { grid-template-columns: 1fr; align-items: start; }
  .guide-reading { grid-template-columns: 230px minmax(0, 1fr); gap: 5vw; }
  .guide-finale { grid-template-columns: 150px minmax(0, 1fr); }
  .guide-finale .button { grid-column: 2; justify-self: start; }
}
@media (max-width: 820px) {
  .guide-path-grid { grid-template-columns: 1fr; }
  .guide-path-card { min-height: 210px; }
  .guide-reading { grid-template-columns: 1fr; }
  .guide-index { position: static; }
  .guide-index nav { display: grid; grid-template-columns: repeat(2, 1fr); border-left: 1px solid #d3dbe3; }
  .guide-index nav a { padding: 11px; border-right: 1px solid #d3dbe3; }
  .guide-index__pdf { max-width: 360px; }
  .guide-sources { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .guide-header { grid-template-columns: 170px 1fr; }
  .guide-hero, .guide-paths, .guide-reading, .guide-sources, .guide-finale { padding-left: 18px; padding-right: 18px; }
  .guide-hero { min-height: 0; padding-top: 66px; padding-bottom: 70px; background: var(--navy); }
  .guide-hero h1 { font-size: clamp(49px, 15.5vw, 66px); overflow-wrap: normal; }
  .guide-hero__board { min-height: 390px; }
  .guide-hero__board .route--b { height: 180px; }
  .guide-hero__board .route--a, .guide-hero__board .route--c { height: 130px; }
  .guide-manifesto { padding: 44px 18px; }
  .guide-section-heading { grid-template-columns: 1fr; }
  .guide-index nav { grid-template-columns: 1fr; }
  .guide-module__header { grid-template-columns: 54px minmax(0, 1fr); gap: 14px; }
  .guide-module__number { width: 54px; height: 54px; font-size: 20px; }
  .guide-module__header h2 { font-size: clamp(36px, 11.5vw, 48px); }
  .guide-objective, .guide-terms dl { grid-template-columns: 1fr; }
  .guide-terms dd { border-left: 0; padding-top: 0; }
  .guide-actions { align-items: stretch; }
  .guide-actions .button, .guide-actions button { width: 100%; justify-content: center; text-align: center; }
  .guide-finale { grid-template-columns: 1fr; }
  .guide-finale .button { grid-column: auto; }
}
@media print {
  .demo-notice, .site-header, .guide-progress, .guide-actions, .guide-index, .guide-finale, footer, .nfla-glossary-button { display: none !important; }
  .guide-page, .guide-hero, .guide-paths, .guide-reading, .guide-sources { background: white !important; color: #061a32 !important; }
  .guide-hero { min-height: auto; padding: 20mm; display: block; }
  .guide-hero h1, .guide-hero__subtitle, .guide-section-heading h2, .guide-sources header h2 { color: #061a32 !important; }
  .guide-hero__board, .guide-paths, .guide-manifesto { display: none; }
  .guide-reading, .guide-sources { display: block; padding: 12mm 18mm; }
  .guide-module { break-before: page; }
  .guide-module__section, .guide-terms, .guide-takeaway { break-inside: avoid; }
  .guide-source { color: #061a32; }
}
@media (prefers-reduced-motion: reduce) { .guide-loading span { animation: none; } .guide-progress span { transition: none; } }