/* PAGE HERO */
    .page-hero {
      padding: 5rem 0 4rem;
      background: var(--paper-2)
    }

    .page-hero-inner {
      max-width: var(--max);
      margin: 0 auto;
      padding: 0 2.5rem;
      display: grid;
      grid-template-columns:1fr 1fr;
      gap: 4rem;
      align-items: center;
      position: relative;
      z-index: 1
    }

    .page-hero-eyebrow {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 1.5rem;
      opacity: 0;
      animation: riseIn 0.6s ease 0.1s forwards
    }

    .page-hero-eyebrow-line {
      width: 28px;
      height: 1px;
      background: var(--blue)
    }

    .page-hero h1 {
      font-size: clamp(2.4rem, 4vw, 4.2rem);
      margin-bottom: 1.5rem;
      opacity: 0;
      animation: riseIn 0.6s ease 0.2s forwards
    }

    .page-hero h1 em {
      font-style: italic;
      color: var(--blue)
    }

    .page-hero-sub {
      font-size: 1.05rem;
      color: var(--ink-2);
      line-height: 1.8;
      max-width: 480px;
      margin-bottom: 2rem;
      opacity: 0;
      animation: riseIn 0.6s ease 0.3s forwards
    }

    .page-hero-actions {
      display: flex;
      gap: 1rem;
      flex-wrap: wrap;
      opacity: 0;
      animation: riseIn 0.6s ease 0.4s forwards
    }

    /* HERO RIGHT: schedule preview widget */
    .schedule-preview {
      opacity: 0;
      animation: riseIn 0.7s ease 0.3s forwards
    }

    .schedule-card {
      background: var(--paper);
      border: 1px solid var(--paper-3);
      border-radius: var(--r-lg);
      overflow: hidden;
      box-shadow: 0 16px 48px rgba(16, 25, 66, 0.09), 0 4px 12px rgba(16, 25, 66, 0.05)
    }

    .schedule-bar {
      background: var(--paper-2);
      border-bottom: 1px solid var(--paper-3);
      padding: 0.75rem 1.25rem;
      display: flex;
      align-items: center;
      gap: 0.75rem
    }

    .schedule-dots {
      display: flex;
      gap: 5px
    }

    .schedule-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%
    }

    .schedule-title {
      font-size: 0.7rem;
      font-weight: 500;
      color: var(--ink-3);
      letter-spacing: 0.04em
    }

    .schedule-body {
      padding: 1.25rem
    }

    .schedule-week {
      display: grid;
      grid-template-columns:90px repeat(5, 1fr);
      gap: 1px;
      background: var(--paper-3);
      border-radius: var(--r);
      overflow: hidden;
      margin-bottom: 0.875rem;
      font-size: 0.7rem
    }

    .schedule-cell {
      background: var(--paper);
      padding: 0.5rem 0.375rem;
      text-align: center
    }

    .schedule-cell.header {
      background: var(--paper-2);
      font-weight: 600;
      color: var(--ink-2);
      font-size: 0.65rem;
      letter-spacing: 0.04em
    }

    .schedule-cell.name {
      text-align: left;
      font-weight: 500;
      color: var(--heading);
      padding-left: 0.625rem;
      background: var(--paper-2)
    }

    .schedule-shift {
      border-radius: 3px;
      padding: 2px 5px;
      font-size: 0.65rem;
      font-weight: 500;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis
    }

    .shift-morning {
      background: var(--blue-pale);
      color: var(--blue)
    }

    .shift-afternoon {
      background: var(--teal-pale);
      color: var(--teal)
    }

    .shift-evening {
      background: var(--amber-pale);
      color: var(--amber)
    }

    .shift-off {
      background: var(--paper-2);
      color: var(--ink-4);
      font-size: 0.62rem
    }

    .schedule-meta {
      display: grid;
      grid-template-columns:1fr 1fr;
      gap: 0.625rem;
      margin-top: 0.875rem
    }

    .schedule-meta-item {
      background: var(--paper-2);
      border-radius: var(--r);
      padding: 0.625rem 0.75rem
    }

    .schedule-meta-label {
      font-size: 0.65rem;
      color: var(--ink-3);
      margin-bottom: 2px
    }

    .schedule-meta-val {
      font-size: 0.85rem;
      font-weight: 600;
      color: var(--heading)
    }

    .schedule-meta-val.green {
      color: var(--forest)
    }

    .schedule-meta-val.blue {
      color: var(--blue)
    }

    .schedule-footer {
      border-top: 1px solid var(--paper-3);
      padding: 0.75rem 1.25rem;
      display: flex;
      align-items: center;
      gap: 0.5rem
    }

    .schedule-status-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #4ade80;
      animation: pulse-s 2.5s ease infinite;
      flex-shrink: 0
    }

    @keyframes pulse-s {
      0%, 100% {
        opacity: 1
      }
      50% {
        opacity: 0.3
      }
    }

    .schedule-status-text {
      font-size: 0.68rem;
      color: var(--ink-3)
    }

    /* PROBLEM BAND */
    .problem-band {
      padding: 5rem 0;
      background: var(--night)
    }

    .problem-band-layout {
      display: grid;
      grid-template-columns:1fr 1fr;
      gap: 5rem;
      align-items: start
    }

    .problem-left h2 {
      font-size: clamp(1.9rem, 3vw, 2.8rem);
      color: #fff;
      margin-bottom: 1.25rem
    }

    .problem-left h2 em {
      font-style: italic;
      color: var(--blue-2)
    }

    .problem-left p {
      font-size: 1rem;
      color: rgba(255, 255, 255, 0.65);
      line-height: 1.8;
      margin-bottom: 1.5rem
    }

    .problem-cards {
      display: flex;
      flex-direction: column;
      gap: 12px
    }

    .problem-card {
      background: rgba(255, 255, 255, 0.04);
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: var(--r-lg);
      padding: 1.5rem;
      display: grid;
      grid-template-columns:36px 1fr;
      gap: 1rem;
      align-items: start
    }

    .problem-card-num {
      font-family: var(--serif);
      font-size: 1.5rem;
      font-weight: 900;
      color: rgba(255, 255, 255, 0.2);
      line-height: 1
    }

    .problem-card-title {
      font-size: 0.88rem;
      font-weight: 600;
      color: #fff;
      margin-bottom: 0.375rem
    }

    .problem-card-body {
      font-size: 0.82rem;
      color: rgba(255, 255, 255, 0.55);
      line-height: 1.7
    }

    /* FEATURES GRID */
    .features-section {
      padding: 6rem 0
    }

    .features-header {
      text-align: center;
      max-width: 640px;
      margin: 0 auto 4rem
    }

    .features-header h2 {
      font-size: clamp(2rem, 3.5vw, 3rem);
      margin-bottom: 1rem
    }

    .features-header p {
      font-size: 1rem;
      color: var(--ink-2);
      line-height: 1.8
    }

    .features-grid {
      display: grid;
      grid-template-columns:repeat(3, 1fr);
      gap: 1.5rem
    }

    .feature-card {
      background: var(--paper-2);
      border-radius: var(--r-lg);
      padding: 2rem
    }

    .feature-icon {
      width: 44px;
      height: 44px;
      border-radius: var(--r);
      background: var(--blue-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1.25rem;
      color: var(--blue)
    }

    .feature-card h3 {
      font-family: var(--serif);
      font-size: 1.05rem;
      font-weight: 700;
      color: var(--heading);
      margin-bottom: 0.625rem
    }

    .feature-card p {
      font-size: 0.85rem;
      color: var(--ink-2);
      line-height: 1.75
    }

    /* TOOL CARD */
    .tools-section {
      padding: 6rem 0;
      background: var(--paper-2)
    }

    .tools-layout {
      display: grid;
      grid-template-columns:1fr 1fr;
      gap: 5rem;
      align-items: start
    }

    .tools-intro h2 {
      font-size: clamp(2rem, 3vw, 2.8rem);
      margin-bottom: 1.25rem
    }

    .tool-cards {
      display: flex;
      flex-direction: column;
      gap: 1rem
    }

    .tool-card {
      background: var(--paper);
      border: 1px solid var(--paper-3);
      border-radius: var(--r-lg);
      padding: 1.5rem
    }

    .tool-card-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 0.75rem
    }

    .tool-card-name {
      font-family: var(--serif);
      font-weight: 700;
      font-size: 1rem;
      color: var(--heading)
    }

    .tool-card-badge {
      font-size: 0.62rem;
      font-weight: 500;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      padding: 3px 9px;
      border-radius: 999px
    }

    .badge-partner {
      background: var(--forest-pale);
      color: var(--forest)
    }

    .badge-impl {
      background: var(--blue-pale);
      color: var(--blue)
    }

    .tool-card-desc {
      font-size: 0.83rem;
      color: var(--ink-2);
      line-height: 1.75;
      margin-bottom: 1rem
    }

    .tool-card-link {
      font-size: 0.82rem;
      color: var(--blue);
      font-weight: 500
    }

    .tool-card-link:hover {
      text-decoration: underline
    }

    /* INDUSTRIES / WHO SECTION */
    .who-section {
      padding: 6rem 0
    }

    .who-header {
      text-align: center;
      max-width: 600px;
      margin: 0 auto 3.5rem
    }

    .who-header h2 {
      font-size: clamp(2rem, 3.5vw, 3rem);
      margin-bottom: 1rem
    }

    .who-header p {
      font-size: 1rem;
      color: var(--ink-2);
      line-height: 1.8
    }

    .who-grid {
      display: grid;
      grid-template-columns:repeat(3, 1fr);
      gap: 1.5rem
    }

    .who-card {
      border: 1px solid var(--paper-3);
      border-radius: var(--r-lg);
      padding: 1.75rem;
      background: var(--paper)
    }

    .who-icon {
      width: 44px;
      height: 44px;
      border-radius: var(--r);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1.25rem;
      color: var(--blue);
      background: var(--blue-pale)
    }

    .who-card h3 {
      font-family: var(--serif);
      font-weight: 700;
      font-size: 1rem;
      color: var(--heading);
      margin-bottom: 0.625rem
    }

    .who-card p {
      font-size: 0.83rem;
      color: var(--ink-2);
      line-height: 1.7
    }

    /* CTA */
    .cta-section {
      background: var(--night);
      padding: 6rem 0;
      text-align: center
    }

    .cta-section .display {
      font-size: clamp(2rem, 3.5vw, 3rem);
      color: #fff;
      margin-bottom: 1.25rem
    }

    .cta-section .display em {
      font-style: italic;
      color: var(--blue-2)
    }

    .cta-sub {
      font-size: 1rem;
      color: rgba(255, 255, 255, 0.65);
      max-width: 560px;
      margin: 0 auto 2.5rem;
      line-height: 1.8
    }

    .cta-actions {
      display: flex;
      justify-content: center;
      gap: 1rem;
      flex-wrap: wrap
    }

    /* RESPONSIVE */
    @media (max-width: 900px) {
      .page-hero-inner {
        grid-template-columns:1fr;
        gap: 2.5rem
      }

      .schedule-preview {
        display: none
      }

      .problem-band-layout {
        grid-template-columns:1fr;
        gap: 3rem
      }

      .features-grid {
        grid-template-columns:1fr 1fr
      }

      .tools-layout {
        grid-template-columns:1fr;
        gap: 3rem
      }

      .who-grid {
        grid-template-columns:1fr 1fr
      }
    }

    @media (max-width: 600px) {
      .features-grid, .who-grid {
        grid-template-columns:1fr
      }

      .inner, .page-hero-inner {
        padding-left: 1.25rem;
        padding-right: 1.25rem
      }

      .nav-links {
        display: none
      }
    }