/* Shared readability and mobile navigation for the two RUTEN pages. */
.ruten-page { font-size: 16px; }
.ruten-page p,
.ruten-page li,
.ruten-page dd { font-size: 16px; }
.ruten-page .mono,
.ruten-page .section-label,
.ruten-page .brand small,
.ruten-page .header-nav a,
.ruten-page .header-cta,
.ruten-page .hero-kicker,
.ruten-page .hero-wide-tagline,
.ruten-page .ruten-note,
.ruten-page .ruten-contact-note,
.ruten-page .cycle-tag,
.ruten-page .cycle-center span,
.ruten-page .cycle-node-top > .mono:not(.cycle-number),
.ruten-page .ruten-cycle figcaption > span,
.ruten-page .ruten-invest-grid .invest-example,
.ruten-page .area-label,
.ruten-page .ruten-area-diagram > p,
.ruten-page .model-banner > .mono,
.ruten-page .ruten-contact-options span,
.ruten-page .site-footer > p,
.ruten-page .site-footer .footer-nav a { font-size: 14px; }
.ruten-page .cycle-number { font-size: 40px; }
.ruten-page .ruten-service-grid .service-number,
.ruten-page .ruten-invest-grid .mono { font-size: 14px; }
.ruten-page .ruten-service-grid li,
.ruten-page .ruten-service-grid .service-summary,
.ruten-page .ruten-outcome-grid li span,
.ruten-page .ruten-process-grid .mono,
.ruten-page .area-path > span:not(.area-arrow),
.ruten-page .area-path b,
.ruten-page .ruten-cycle figcaption strong,
.ruten-page .faq-list details > p { font-size: 16px; }
.ruten-page .faq-list summary { font-size: 17px; }
.ruten-page .hero-wide .hero-brand-type { font-size: 14px; }
.ruten-page .hero-wide .hero-lead,
.ruten-page .hero-wide-purpose { font-size: 16px; }
.ruten-page .button,
.ruten-page .hero-wide .button { font-size: 14px; }
.ruten-page .hero-wide-visual figcaption > span:not(.mono) { font-size: 16px; }
@media (max-width: 600px) {
  .ruten-page .cycle-number { font-size: 34px; }
  .ruten-page .site-header .brand small { max-width: none; white-space: nowrap; }
}
@media (max-width: 380px) {
  .ruten-page .site-header .brand { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-content: center; gap: 2px 8px; min-width: 0; padding-right: 8px; }
  .ruten-page .site-header .brand > span { display: contents; }
  .ruten-page .site-header .brand small { grid-column: 1 / -1; grid-row: 1; }
  .ruten-page .site-header .brand img { grid-column: 1; grid-row: 2; }
  .ruten-page .site-header .brand b { grid-column: 2; grid-row: 2; }
  .ruten-page .site-header .header-cta { padding-inline: 8px; }
}

/* The existing navigation becomes a non-modal disclosure on mobile. */
.ruten-page .ruten-menu-toggle,
.ruten-page .site-header .header-nav .mobile-menu-contact { display: none; }
.ruten-page .ruten-menu-toggle[hidden] { display: none; }
.ruten-page .ruten-menu-toggle:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
@media (max-width: 1000px) {
  .ruten-page .site-header[data-mobile-menu="ready"] { grid-template-columns: minmax(0, 1fr) 52px; }
  .ruten-page .site-header[data-mobile-menu="ready"] > .header-cta { display: none; }
  .ruten-page .site-header[data-mobile-menu="ready"] .ruten-menu-toggle { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; align-self: center; width: 52px; min-height: 52px; margin: 0; padding: 5px 0; border: 0; border-radius: 4px; background: transparent; color: var(--ink); cursor: pointer; }
  .ruten-page .ruten-menu-label { font: 400 14px/1 var(--display); letter-spacing: .05em; }
  .ruten-page .ruten-menu-icon { display: grid; gap: 5px; width: 22px; }
  .ruten-page .ruten-menu-icon i { display: block; height: 1.5px; background: currentColor; }
  .ruten-page .ruten-menu-toggle[aria-expanded="true"] .ruten-menu-icon i:first-child { transform: translateY(6.5px) rotate(45deg); }
  .ruten-page .ruten-menu-toggle[aria-expanded="true"] .ruten-menu-icon i:nth-child(2) { opacity: 0; }
  .ruten-page .ruten-menu-toggle[aria-expanded="true"] .ruten-menu-icon i:last-child { transform: translateY(-6.5px) rotate(-45deg); }
  .ruten-page .site-header[data-mobile-menu="ready"] .header-nav { position: absolute; top: 100%; right: 0; left: 0; display: none; gap: 0; max-height: calc(100vh - 84px); max-height: calc(100dvh - 84px); overflow-y: auto; padding: 8px var(--pad) 24px; border-bottom: 1px solid var(--line); background: var(--paper); }
  .ruten-page .site-header[data-mobile-menu="ready"][data-menu-open] .header-nav { display: grid; }
  .ruten-page .site-header[data-mobile-menu="ready"] .header-nav a { display: flex; align-items: center; min-height: 52px; padding: 14px 4px; border-bottom: 1px solid var(--line); font-size: 16px; line-height: 1.5; }
  .ruten-page .site-header[data-mobile-menu="ready"] .header-nav a::after { display: none; }
  .ruten-page .site-header[data-mobile-menu="ready"] .header-nav .mobile-menu-contact { display: flex; justify-content: space-between; margin-top: 14px; padding-inline: 18px; border: 0; border-radius: 30px; background: var(--accent-panel); color: #fff; }
}

.ruten-page .ruten-mobile-fixed-cta { display: none; }
@media (max-width: 600px) {
  .ruten-page .site-footer { padding-bottom: calc(104px + env(safe-area-inset-bottom)); }
  .ruten-page .ruten-mobile-fixed-cta {
    position: fixed;
    z-index: 90;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 68px;
    padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
    background: var(--accent-panel);
    box-shadow: 0 -5px 24px rgba(0, 0, 0, .18);
    color: var(--white);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
  }
  .ruten-page .ruten-mobile-fixed-cta:focus-visible { outline: 3px solid var(--white); outline-offset: -7px; }
}
