.nightwire-page {
  --wire: #ff5b39;
  --ink: #171411;
}

.nightwire-page .product-eyebrow {
  margin-bottom: 1.25rem;
  color: var(--wire);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.product-hero, .nightwire-section, .policy-section {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 7rem var(--gutter);
}

.product-hero { display: grid; grid-template-columns: 1.2fr .8fr; gap: 4rem; align-items: center; }
.product-name { font: 300 clamp(3.5rem, 8vw, 6.5rem)/.92 var(--font-serif); letter-spacing: -.03em; margin-bottom: 1.75rem; }
.product-name em { color: var(--wire); font-style: italic; }
.product-tagline { max-width: 50ch; color: var(--text-mid); font-size: 1rem; line-height: 1.85; }
.hero-actions { display: flex; align-items: center; gap: 1.25rem; margin-top: 2.5rem; flex-wrap: wrap; }
.button { display: inline-block; padding: .85rem 1.3rem; background: var(--ink); color: var(--cream); text-decoration: none; font-size: .76rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }
.checkout-button { border: 0; font-family: var(--font-sans); cursor: pointer; }
.checkout-button:disabled { cursor: not-allowed; opacity: .48; }
.text-link { color: var(--text-mid); font-size: .78rem; text-underline-offset: 4px; }

.console-card { background: var(--ink); color: #f7f1e8; padding: 2rem; box-shadow: 16px 16px 0 var(--sand); font-family: var(--font-sans); }
.console-brand { display: flex; justify-content: space-between; color: var(--wire); font-size: .72rem; font-weight: 500; letter-spacing: .13em; }
.waveform { height: 84px; margin: 2rem 0; background: repeating-linear-gradient(90deg, transparent 0 5px, rgba(255,91,57,.85) 5px 7px), linear-gradient(transparent 48%, #75665e 49% 51%, transparent 52%); clip-path: polygon(0 40%,5% 20%,10% 42%,15% 5%,20% 33%,25% 15%,30% 45%,35% 8%,40% 30%,45% 18%,50% 48%,55% 10%,60% 28%,65% 3%,70% 35%,75% 12%,80% 42%,85% 8%,90% 30%,95% 18%,100% 40%,100% 62%,95% 82%,90% 70%,85% 94%,80% 60%,75% 88%,70% 65%,65% 97%,60% 72%,55% 90%,50% 52%,45% 82%,40% 70%,35% 92%,30% 55%,25% 85%,20% 67%,15% 95%,10% 58%,5% 80%,0 60%); }
.console-readout { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #514944; }
.console-readout span { padding: .8rem; background: var(--ink); font-size: .58rem; letter-spacing: .1em; color: #9e9189; }
.console-readout b { display: block; margin-top: .25rem; color: #f7f1e8; font-size: .9rem; }

.nightwire-section + .nightwire-section { padding-top: 0; }
.nightwire-section h2, .policy-section h2 { font: 400 clamp(1.8rem, 3.5vw, 2.5rem)/1.2 var(--font-serif); margin-bottom: 1.5rem; }
.section-intro { max-width: 62ch; color: var(--text-mid); line-height: 1.85; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 3rem; background: var(--sand); }
.feature { padding: 2rem; background: var(--cream); }
.feature b { display: block; margin-bottom: .65rem; font-family: var(--font-serif); font-size: 1.25rem; font-weight: 500; }
.feature p { color: var(--text-mid); font-size: .84rem; line-height: 1.75; }
.pricing-wrap { background: var(--cream-dark); }
.pricing-card { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 3rem; border-top: 1px solid var(--sand); border-bottom: 1px solid var(--sand); padding: 3rem 0; }
.price { font: 400 3.5rem/1 var(--font-serif); }
.price small { font: 300 .8rem var(--font-sans); color: var(--text-light); }
.fine-print { margin-top: .7rem; color: var(--text-light); font-size: .78rem; }

.policy-hero { padding-bottom: 4rem; }
.policy-section { padding-top: 0; max-width: 760px; }
.policy-section h2 { margin-top: 3rem; font-size: 1.65rem; }
.policy-section h3 { margin: 2rem 0 .65rem; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--brown-warm); }
.policy-section p, .policy-section li { color: var(--text-mid); font-size: .91rem; line-height: 1.85; }
.policy-section p { margin-bottom: 1rem; }
.policy-section ul { padding-left: 1.25rem; margin-bottom: 1rem; }
.policy-meta { color: var(--text-light); font-size: .78rem; }
.legal-links { display: flex; gap: 1rem; flex-wrap: wrap; }
.download-options { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--sand); margin-top: 2rem; }
.download-option { background: var(--cream); padding: 2rem; }
.download-option .button { margin-top: 1rem; }
.learn-callout { display: grid; grid-template-columns: .4fr 1fr; gap: 3rem; align-items: start; }
.learn-callout .button { margin-top: 2rem; }

.course-header { max-width: 880px; margin: 0 auto; padding: 5.5rem var(--gutter) 4.5rem; }
.course-header h1 { font: 400 clamp(2.8rem, 6vw, 4.8rem)/1 var(--font-serif); letter-spacing: -.03em; margin-bottom: 1.4rem; }
.course-header > p:not(.product-eyebrow) { max-width: 68ch; color: var(--text-mid); line-height: 1.85; }
.course-meta { display: flex; gap: 2.5rem; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--sand); color: var(--text-light); font-size: .75rem; }
.course-meta b { margin-right: .35rem; color: var(--ink); font: 500 1.25rem var(--font-serif); }
.before-you-start { max-width: 880px; margin: 0 auto; padding: 4rem var(--gutter); display: grid; grid-template-columns: .65fr 1fr; gap: 4rem; }
.before-you-start h2, .shortcut-section h2, .guide-finale h2 { font: 400 clamp(2rem, 4vw, 3.2rem)/1.1 var(--font-serif); }
.setup-checklist { display: grid; gap: 1.2rem; }
.setup-checklist p { display: grid; grid-template-columns: 2rem 1fr; gap: .8rem; color: var(--text-mid); font-size: .85rem; line-height: 1.65; }
.setup-checklist span { display: grid; place-items: center; width: 1.7rem; height: 1.7rem; border: 1px solid var(--wire); color: var(--wire); font-size: .68rem; }
.course-layout { max-width: var(--max-width); margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: 210px minmax(0, 820px); gap: clamp(2.5rem, 6vw, 7rem); align-items: start; }
.course-nav { position: sticky; top: 2rem; padding: 2rem 0; border-top: 2px solid var(--ink); }
.course-nav > p { margin-bottom: 1rem; color: var(--text-light); font-size: .65rem; letter-spacing: .12em; text-transform: uppercase; }
.course-nav ol { list-style: none; padding: 0; }
.course-nav li { border-top: 1px solid var(--sand); }
.course-nav a { display: flex; gap: .75rem; padding: .9rem 0; color: var(--text-mid); font-size: .75rem; line-height: 1.35; text-decoration: none; }
.course-nav a:hover { color: var(--wire); }
.course-nav a span { color: var(--wire); font-size: .65rem; }
.course-nav .course-keymap { margin-top: 1rem; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
.lesson-stream { border-top: 1px solid var(--sand); }
.lesson { padding: 5rem 0; border-bottom: 1px solid var(--sand); display: grid; grid-template-columns: 1fr 220px; gap: 3rem; align-items: start; scroll-margin-top: 2rem; }
.lesson-number { grid-column: 1 / -1; color: var(--wire); font: 500 .68rem var(--font-sans); letter-spacing: .12em; text-transform: uppercase; }
.lesson-copy h2 { margin-bottom: 1.5rem; font: 400 clamp(1.9rem, 3.5vw, 2.7rem)/1.15 var(--font-serif); }
.lesson-copy > p:not(.product-eyebrow) { color: var(--text-mid); line-height: 1.85; margin-bottom: 1rem; }
kbd { display: inline-block; min-width: 1.8em; padding: .16rem .42rem; border: 1px solid #b9ada4; border-bottom-width: 2px; border-radius: 3px; background: #f8f1e8; color: var(--ink); font: 500 .72rem var(--font-sans); text-align: center; }
.exercise { margin-top: 2rem; padding: 1.25rem 1.4rem; border-left: 3px solid var(--wire); background: var(--cream-dark); }
.exercise b { display: block; margin-bottom: .4rem; color: var(--wire); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
.exercise p { color: var(--text-mid); font-size: .83rem; line-height: 1.7; }
.key-cluster { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .7rem 1rem; padding: 1.5rem; background: var(--ink); }
.key-cluster span { color: #afa49b; font-size: .72rem; letter-spacing: .04em; }
.shortcut-section, .guide-finale { max-width: var(--max-width); margin: 0 auto; padding: 7rem var(--gutter); }
.shortcut-section { margin-top: 6rem; background: var(--cream-dark); max-width: none; }
.shortcut-section > * { max-width: calc(var(--max-width) - 2 * var(--gutter)); margin-left: auto; margin-right: auto; }
.shortcut-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin-top: 3rem; background: var(--sand); }
.shortcut-grid article { padding: 2rem; background: var(--cream); }
.shortcut-grid h3 { margin-bottom: 1.5rem; font: 500 1.25rem var(--font-serif); }
.shortcut-grid dl { display: grid; grid-template-columns: auto 1fr; gap: .9rem 1rem; align-items: center; }
.shortcut-grid dt, .shortcut-grid dd { margin: 0; }
.shortcut-grid dd { color: var(--text-mid); font-size: .76rem; }
.guide-finale { text-align: center; }
.guide-finale .section-intro { margin: 1.5rem auto 0; }
.guide-finale .text-link { display: inline-block; margin-top: 2rem; }

@media (max-width: 720px) {
  .nightwire-page:not(.guide-page) .nav-links li:nth-child(3),
  .nightwire-page:not(.guide-page) .nav-links li:nth-child(4) { display: none; }
  .guide-page nav { align-items: center; }
  .guide-page .nav-links { gap: 0; }
  .guide-page .nav-links li:not(:first-child) { display: none; }
  .product-hero { grid-template-columns: 1fr; padding: 5rem var(--gutter); }
  .console-card { margin-right: 12px; }
  .feature-grid { grid-template-columns: 1fr; }
  .pricing-card { grid-template-columns: 1fr; align-items: start; }
  .learn-callout, .before-you-start, .course-layout, .lesson { grid-template-columns: 1fr; }
  .course-header { padding-top: 4rem; }
  .course-meta { gap: 1rem; flex-wrap: wrap; }
  .before-you-start { gap: 2rem; }
  .course-nav { position: static; padding-bottom: 0; }
  .course-nav ol { display: grid; grid-template-columns: 1fr 1fr; }
  .course-nav li:nth-child(even) { padding-left: 1rem; }
  .shortcut-grid { grid-template-columns: 1fr; }
  .lesson { gap: 1.5rem; padding-top: 4rem; padding-bottom: 4rem; }
  .key-cluster { margin-top: .5rem; }
}
