/* HAB Mobile Run 01 / 2026-09-19
   Mobile architecture and UX layer. Desktop V2.1 remains the reference. */

.hab-mobile-view-switch,
.hab-mobile-route-switch,
.hab-mobile-rail-hint,
.hab-mobile-disclosure > summary {
  display: none;
}

@media (max-width: 767px) {
  :root {
    --hab-mobile-gutter: clamp(16px, 5.1vw, 22px);
    --hab-vs-container: calc(100% - (var(--hab-mobile-gutter) * 2));
    --hab-mobile-section: clamp(44px, 12vw, 52px);
    --hab-mobile-radius: 15px;
  }

  html { scroll-padding-top: 76px; }

  body.hab-mobile-run01 #main-content > .section:not(.hab-hero):not(.rvp-energy-link-section) {
    padding-block: var(--hab-mobile-section);
  }

  body.hab-mobile-run01 #main-content section[id] { scroll-margin-top: 82px; }

  body.hab-mobile-run01 #main-content .hab-section-title,
  body.hab-mobile-run01 #main-content .contract-scan-copy .hab-section-title,
  body.hab-mobile-run01 #main-content .contact-decision-section .contact-intro .hab-section-title {
    max-width: 24ch;
    margin-bottom: 14px;
    font-size: clamp(27px, 7.55vw, 31px);
    line-height: 1.09;
    letter-spacing: -.041em;
    text-wrap: balance;
  }

  body.hab-mobile-run01 #main-content .signature-heading,
  body.hab-mobile-run01 #main-content .section-head,
  body.hab-mobile-run01 #main-content .services-head {
    margin-bottom: 22px;
  }

  body.hab-mobile-run01 #main-content .signature-heading .lead,
  body.hab-mobile-run01 #main-content .signature-heading .lede,
  body.hab-mobile-run01 #main-content .section-head .lead,
  body.hab-mobile-run01 #main-content .lead,
  body.hab-mobile-run01 #main-content .lede {
    font-size: 15px;
    line-height: 1.62;
  }

  body.hab-mobile-run01 #main-content .eyebrow {
    margin-bottom: 10px;
    font-size: 9.5px;
    letter-spacing: .14em;
  }

  body.hab-mobile-run01 #main-content button,
  body.hab-mobile-run01 #main-content a,
  body.hab-mobile-run01 .hab-footer a {
    -webkit-tap-highlight-color: transparent;
  }

  /* Contractscan: mobile shows one reading surface at a time. */
  body.hab-mobile-run01 #main-content .contract-scan-section { padding-top: 48px; }
  body.hab-mobile-run01 #main-content .contract-scan-layout { gap: 18px; }
  body.hab-mobile-run01 #main-content .contract-scan-copy .lead { margin-bottom: 18px; }
  body.hab-mobile-run01 #main-content .contract-scan-controls { gap: 6px; }
  body.hab-mobile-run01 #main-content .contract-scan-trigger {
    min-height: 58px;
    padding: 10px 9px;
    border-radius: 9px;
  }
  body.hab-mobile-run01 #main-content .contract-scan-trigger__copy strong {
    font-size: 11.5px;
    line-height: 1.35;
  }
  body.hab-mobile-run01 #main-content .contract-scan-console__workspace {
    display: block;
    padding: 11px;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-view-switch {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    margin: 0 0 10px;
    padding: 4px;
    border: 1px solid rgba(174, 205, 244, .2);
    border-radius: 10px;
    background: rgba(255,255,255,.055);
  }
  body.hab-mobile-run01 #main-content .hab-mobile-view-switch button {
    min-height: 44px;
    padding: 8px 10px;
    border: 0;
    border-radius: 7px;
    color: #b8cae2;
    background: transparent;
    font: 650 11px/1.3 Inter, Arial, sans-serif;
    cursor: pointer;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-view-switch button[aria-selected="true"] {
    color: #071a34;
    background: #fff;
    box-shadow: 0 5px 14px rgba(0, 9, 24, .18);
  }
  body.hab-mobile-run01 #main-content .contract-scan-console[data-mobile-contract-view="document"] [data-mobile-pane="advice"],
  body.hab-mobile-run01 #main-content .contract-scan-console[data-mobile-contract-view="advice"] [data-mobile-pane="document"] {
    display: none !important;
  }
  body.hab-mobile-run01 #main-content .contract-document,
  body.hab-mobile-run01 #main-content .contract-advisor-panel {
    min-height: 0;
    border-radius: 11px;
  }
  body.hab-mobile-run01 #main-content .contract-document { padding: 17px 15px; }
  body.hab-mobile-run01 #main-content .contract-advisor-panel { padding: 21px 18px; }
  body.hab-mobile-run01 #main-content .contract-advisor-panel p { max-width: 36ch; }
  body.hab-mobile-run01 #main-content .contract-scan-console__footer { padding-block: 10px; }

  /* Services retain the successful photography, with tighter hierarchy. */
  body.hab-mobile-run01 #main-content .services-section { padding-block: 48px; }
  body.hab-mobile-run01 #main-content .service-row { padding-block: 18px; }
  body.hab-mobile-run01 #main-content .service-row h3 { font-size: 19px; }
  body.hab-mobile-run01 #main-content .service-row p { margin-top: 5px; }
  body.hab-mobile-run01 #main-content .service-row--accent {
    margin-top: 18px;
    padding: 190px 21px 23px;
  }
  body.hab-mobile-run01 #main-content .service-row--accent::before { height: 236px; }
  body.hab-mobile-run01 #main-content .service-row--accent h3 { font-size: 27px; }

  /* Trust and responsibility flow. */
  body.hab-mobile-run01 #main-content .trust-layout { gap: 22px; }
  body.hab-mobile-run01 #main-content .trust-media { height: 260px; }
  body.hab-mobile-run01 #main-content .trust-list { margin-top: 16px; }
  body.hab-mobile-run01 #main-content .trust-list li { padding-block: 12px; }

  body.hab-mobile-run01 #main-content .transparency-section { padding-block: 44px; }
  body.hab-mobile-run01 #main-content .transparency-strip { gap: 16px; }
  body.hab-mobile-run01 #main-content .transparency-strip .hab-section-title { font-size: 27px; }
  body.hab-mobile-run01 #main-content .transparency-strip__items {
    position: relative;
    padding-left: 2px;
  }
  body.hab-mobile-run01 #main-content .transparency-strip__items::after {
    position: absolute;
    top: 24px;
    bottom: 24px;
    left: 12px;
    width: 1px;
    content: "";
    background: #bed0e7;
  }
  body.hab-mobile-run01 #main-content .transparency-strip__items article {
    position: relative;
    z-index: 1;
    grid-template-columns: 28px minmax(0,1fr);
    gap: 3px 10px;
    padding: 13px 0;
    border-top: 0;
  }
  body.hab-mobile-run01 #main-content .transparency-strip__items span {
    display: grid;
    grid-row: 1 / 3;
    place-items: center;
    width: 24px;
    height: 24px;
    margin: 0;
    border: 1px solid #9db9dc;
    border-radius: 50%;
    color: #0c5fd7;
    background: #f3f6fa;
    font-size: 9px;
  }
  body.hab-mobile-run01 #main-content .transparency-strip__items strong { font-size: 14.5px; }
  body.hab-mobile-run01 #main-content .transparency-strip__items p { font-size: 13px; }

  /* Reviews: one editorial card per mobile frame, horizontally discoverable. */
  body.hab-mobile-run01 #main-content .reviews-section { padding-block: 46px; overflow: hidden; }
  body.hab-mobile-run01 #main-content .reviews-heading { margin-bottom: 18px; }
  body.hab-mobile-run01 #main-content .reviews-heading .hab-section-title { font-size: 28px; }
  body.hab-mobile-run01 #main-content .review-grid[data-mobile-review-rail] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 87%;
    grid-template-columns: none;
    gap: 12px;
    width: calc(100% + var(--hab-mobile-gutter));
    margin-right: calc(var(--hab-mobile-gutter) * -1);
    padding: 0 var(--hab-mobile-gutter) 8px 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
    scrollbar-width: none;
  }
  body.hab-mobile-run01 #main-content .review-grid[data-mobile-review-rail]::-webkit-scrollbar { display: none; }
  body.hab-mobile-run01 #main-content .review-grid[data-mobile-review-rail] .review-card {
    min-height: 300px;
    padding: 22px;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
  body.hab-mobile-run01 #main-content .review-card blockquote {
    margin-block: 16px 20px;
    font-size: 16px;
    line-height: 1.58;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-rail-hint {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 8px 0 0;
    color: #61728a;
    font-size: 10px;
    letter-spacing: .03em;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-rail-hint::after { content: "→"; color: #1261d8; }
  body.hab-mobile-run01 #main-content .review-note { margin-top: 13px; }

  /* Intake: keep one step at a time, reduce dead space around the step. */
  body.hab-mobile-run01 #main-content .intake-section { padding-block: 46px; }
  body.hab-mobile-run01 #main-content .intake-layout { gap: 22px; }
  body.hab-mobile-run01 #main-content .intake-intro p { max-width: 35ch; }
  body.hab-mobile-run01 #main-content .intake-intro ul { margin-top: 15px; gap: 7px 13px; }
  body.hab-mobile-run01 #main-content .intake-progress button {
    min-height: 48px;
    padding: 9px 3px;
    font-size: 9px;
  }
  body.hab-mobile-run01 #main-content .intake-step { padding: 22px 17px; }
  body.hab-mobile-run01 #main-content .intake-step h2 { font-size: 23px; line-height: 1.18; }
  body.hab-mobile-run01 #main-content .choice-grid { gap: 9px; }
  body.hab-mobile-run01 #main-content .choice-radio span { min-height: 52px; padding: 13px 12px; }
  body.hab-mobile-run01 #main-content .intake-actions { margin-top: 22px; }

  /* How it works: active content only, secondary expectations disclosed on demand. */
  body.hab-mobile-run01 #main-content .how-route-section,
  body.hab-mobile-run01 #main-content .how-scenario-section,
  body.hab-mobile-run01 #main-content .how-prepare-section { padding-block: 48px; }
  body.hab-mobile-run01 #main-content .how-route-rail { gap: 5px; padding: 10px; }
  body.hab-mobile-run01 #main-content .how-route-tab { min-height: 54px; padding: 9px; }
  body.hab-mobile-run01 #main-content .how-route-panel { padding: 19px 17px; }
  body.hab-mobile-run01 #main-content .how-route-field { padding: 13px 0; }
  body.hab-mobile-run01 #main-content .how-route-field h3 { font-size: 16px; }
  body.hab-mobile-run01 #main-content .how-route-field p { font-size: 12.5px; }
  body.hab-mobile-run01 #main-content .hab-mobile-disclosure { display: block; margin-top: 16px; border-top: 1px solid #cbd9e9; }
  body.hab-mobile-run01 #main-content .hab-mobile-disclosure > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 52px;
    padding: 10px 0;
    color: #0b2a50;
    font: 700 12px/1.4 Inter, Arial, sans-serif;
    list-style: none;
    cursor: pointer;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-disclosure > summary::-webkit-details-marker { display: none; }
  body.hab-mobile-run01 #main-content .hab-mobile-disclosure > summary span:last-child {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border: 1px solid #a9c1df;
    border-radius: 50%;
    color: #0b5ed5;
    font-size: 18px;
    font-weight: 400;
    transition: transform .18s ease;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-disclosure[open] > summary span:last-child { transform: rotate(45deg); }
  body.hab-mobile-run01 #main-content .hab-mobile-expectation .how-expect-strip {
    margin: 0;
    padding: 2px 0 8px;
    gap: 8px;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-expectation .how-expect-strip article {
    grid-template-columns: 46px minmax(0,1fr);
    gap: 9px;
  }
  body.hab-mobile-run01 #main-content .how-scenario-tabs { gap: 6px; }
  body.hab-mobile-run01 #main-content .how-scenario-tabs button { min-height: 58px; padding: 10px; }
  body.hab-mobile-run01 #main-content .how-scenario-workspace > header { min-height: 42px; padding: 10px 16px; }
  body.hab-mobile-run01 #main-content .how-scenario-panel { padding: 14px; }
  body.hab-mobile-run01 #main-content .how-scenario-path section { min-height: 0; padding: 11px 0; }
  body.hab-mobile-run01 #main-content .how-scenario-path h3 { font-size: 16px; }
  body.hab-mobile-run01 #main-content .how-scenario-path p { font-size: 12.5px; }
  body.hab-mobile-run01 #main-content .how-prepare-media { min-height: 240px; }
  body.hab-mobile-run01 #main-content .how-prepare-list { gap: 0; }
  body.hab-mobile-run01 #main-content .how-prepare-list li { min-height: 48px; padding-block: 13px; }
  body.hab-mobile-run01 #main-content .how-cta-section { padding-block: 38px; }

  /* About: preserve the strong content, reduce dashboard-like bulk. */
  body.hab-mobile-run01 #main-content .about-why-section,
  body.hab-mobile-run01 #main-content .about-compass-section,
  body.hab-mobile-run01 #main-content .about-standard-section,
  body.hab-mobile-run01 #main-content .about-trust-section { padding-block: 48px; }
  body.hab-mobile-run01 #main-content .about-compass-tabs { gap: 6px; }
  body.hab-mobile-run01 #main-content .about-compass-tab { min-height: 60px; padding: 10px; }
  body.hab-mobile-run01 #main-content .about-compass-panel { padding: 20px 18px; }
  body.hab-mobile-run01 #main-content .about-compass-panel h3 { font-size: 19px; }
  body.hab-mobile-run01 #main-content .about-standard-track { gap: 6px; }
  body.hab-mobile-run01 #main-content .about-standard-track button { min-height: 58px; padding: 9px; }
  body.hab-mobile-run01 #main-content .about-standard-panel { padding: 22px 19px; }
  body.hab-mobile-run01 #main-content .about-standard-outcomes { padding: 18px; }
  body.hab-mobile-run01 #main-content .about-trust-list { gap: 0; }
  body.hab-mobile-run01 #main-content .about-trust-list > div { padding-block: 13px; }
  body.hab-mobile-run01 #main-content .about-cta-section { padding-block: 38px; }

  /* Reclamevrij+: compact chapters, one active state at a time. */
  body.hab-mobile-run01 #main-content .rvp-benefits,
  body.hab-mobile-run01 #main-content .rvp-noise-section,
  body.hab-mobile-run01 #main-content .rvp-steps-section,
  body.hab-mobile-run01 #main-content .rvp-metrics,
  body.hab-mobile-run01 #main-content .rvp-faq,
  body.hab-mobile-run01 #main-content .rvp-rustline-section,
  body.hab-mobile-run01 #main-content .rvp-cta { padding-block: 48px; }
  body.hab-mobile-run01 #main-content .rvp-benefits-layout { gap: 22px; }
  body.hab-mobile-run01 #main-content .rvp-benefit-list article { padding: 12px 0; }
  body.hab-mobile-run01 #main-content .rvp-demo-stage { min-height: 205px; }
  body.hab-mobile-run01 #main-content .rvp-noise-devices { margin-bottom: 12px; }
  body.hab-mobile-run01 #main-content .rvp-noise-workspace { gap: 11px; }
  body.hab-mobile-run01 #main-content .rvp-noise-visual {
    min-height: 168px;
    padding: 16px 14px;
    grid-template-columns: 112px minmax(0,1fr);
  }
  body.hab-mobile-run01 #main-content .rvp-noise-hotspots { margin: 12px 12px 0; }
  body.hab-mobile-run01 #main-content .rvp-noise-detail .signature-panel { padding: 17px 16px; }
  body.hab-mobile-run01 #main-content .rvp-noise-panel-title { margin-bottom: 12px; font-size: 20px; }
  body.hab-mobile-run01 #main-content .rvp-noise-detail dl > div { padding-block: 11px; }
  body.hab-mobile-run01 #main-content .rvp-step-flow { gap: 14px; }
  body.hab-mobile-run01 #main-content .rvp-step { padding-top: 15px; }
  body.hab-mobile-run01 #main-content .rvp-step h3 { font-size: 18px; }
  body.hab-mobile-run01 #main-content .rvp-step p { font-size: 13px; }
  body.hab-mobile-run01 #main-content .rvp-metric-shell { gap: 22px; }
  body.hab-mobile-run01 #main-content .rvp-metric-card { min-height: 112px; padding: 18px 16px; }
  body.hab-mobile-run01 #main-content .rvp-metric-card strong { font-size: 28px; }
  body.hab-mobile-run01 #main-content .rvp-faq-grid summary { min-height: 56px; padding-block: 16px; }

  body.hab-mobile-run01 #main-content .rvp-rustline { gap: 12px; padding: 10px; }
  body.hab-mobile-run01 #main-content .rvp-rustline-options button { min-height: 46px; }
  body.hab-mobile-run01 #main-content .hab-demo-play { min-height: 44px; }
  body.hab-mobile-run01 #main-content .hab-mobile-route-switch {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    padding: 5px 9px 0;
    background: #071c38;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-route-switch button {
    min-height: 44px;
    padding: 8px 9px;
    border: 1px solid #29486f;
    border-radius: 8px 8px 0 0;
    color: #aec4e0;
    background: #0a2346;
    font: 650 10.5px/1.3 Inter, Arial, sans-serif;
    cursor: pointer;
  }
  body.hab-mobile-run01 #main-content .hab-mobile-route-switch button[aria-selected="true"] {
    color: #061a35;
    border-color: #ffbd1a;
    background: #ffbd1a;
  }
  body.hab-mobile-run01 #main-content .rvp-rustline-routes { display: block; padding: 10px; }
  body.hab-mobile-run01 #main-content .rvp-rustline[data-mobile-route="busy"] [data-mobile-route-pane="calm"],
  body.hab-mobile-run01 #main-content .rvp-rustline[data-mobile-route="calm"] [data-mobile-route-pane="busy"] {
    display: none !important;
  }
  body.hab-mobile-run01 #main-content .rvp-rustline-route {
    min-height: 0;
    padding: 16px 14px;
  }
  body.hab-mobile-run01 #main-content .rvp-rustline-route > div { min-height: 0; margin-bottom: 12px; }
  body.hab-mobile-run01 #main-content .rvp-rustline-route ol {
    height: auto;
    min-height: 0;
    gap: 7px;
    padding-left: 20px;
  }
  body.hab-mobile-run01 #main-content .rvp-rustline-route ol li {
    min-height: 48px;
    padding: 9px 10px;
    font-size: 11.5px;
  }
  body.hab-mobile-run01 #main-content .rvp-rustline-route--calm ol { min-height: 110px; }
  body.hab-mobile-run01 #main-content .rvp-rustline-console > footer { padding: 11px 13px; }
  body.hab-mobile-run01 #main-content .rvp-cta-box { padding-top: 198px; }
  body.hab-mobile-run01 #main-content .rvp-cta-box::before { height: 250px; }

  /* Contact: form sooner, smaller dead zones, unchanged fields/endpoints. */
  body.hab-mobile-run01 #main-content .contact-decision-section { padding-block: 46px; }
  body.hab-mobile-run01 #main-content .contact-decision-grid { gap: 18px; }
  body.hab-mobile-run01 #main-content .contact-intro .lede { margin-bottom: 10px; }
  body.hab-mobile-run01 #main-content .contact-intro__signal { margin-top: 12px; }
  body.hab-mobile-run01 #main-content .contact-expectation { margin-top: 12px; }
  body.hab-mobile-run01 #main-content .contact-expectation > summary { min-height: 46px; }
  body.hab-mobile-run01 #main-content .contact-form-flagship { padding: 0 18px 20px; }
  body.hab-mobile-run01 #main-content .contact-form__topline {
    min-height: 50px;
    margin: 0 -18px 19px;
    padding: 10px 18px;
  }
  body.hab-mobile-run01 #main-content .contact-form-flagship .field-grid { gap: 14px; }
  body.hab-mobile-run01 #main-content .contact-form-flagship .field { gap: 6px; }
  body.hab-mobile-run01 #main-content .contact-form-flagship input:not([type="checkbox"]),
  body.hab-mobile-run01 #main-content .contact-form-flagship select { min-height: 50px; padding-block: 11px; }
  body.hab-mobile-run01 #main-content .contact-form-flagship textarea { min-height: 112px; }
  body.hab-mobile-run01 #main-content .contact-form-flagship .checkbox-field { padding-block: 2px; }
  body.hab-mobile-run01 #main-content .contact-form-flagship .form-actions { margin-top: 18px; padding-top: 18px; }

  /* Footer: compact destination, not a second sitemap. */
  body.hab-mobile-run01 .hab-footer__stage {
    gap: 20px 18px;
    padding: 31px 0 22px;
  }
  body.hab-mobile-run01 .hab-footer__logo { width: 164px; margin-bottom: 12px; }
  body.hab-mobile-run01 .hab-footer__brand > p { margin-bottom: 14px; font-size: 12px; line-height: 1.55; }
  body.hab-mobile-run01 .hab-footer__cta { min-height: 44px; width: fit-content; padding-inline: 15px; }
  body.hab-mobile-run01 .hab-footer__group h2 { margin-bottom: 5px; }
  body.hab-mobile-run01 .hab-footer__group a { min-height: 44px; padding-block: 7px; }
  body.hab-mobile-run01 .hab-footer__contact { grid-row: 3; padding-top: 3px; }
  body.hab-mobile-run01 .hab-footer__bottom {
    padding: 15px 0 calc(18px + env(safe-area-inset-bottom));
    line-height: 1.45;
  }
}

@media (max-width: 359px) {
  :root { --hab-mobile-gutter: 16px; }
  body.hab-mobile-run01 #main-content .hab-section-title,
  body.hab-mobile-run01 #main-content .contract-scan-copy .hab-section-title,
  body.hab-mobile-run01 #main-content .contact-decision-section .contact-intro .hab-section-title {
    font-size: 26px;
  }
  body.hab-mobile-run01 #main-content .contract-scan-trigger { min-height: 56px; padding-inline: 8px; }
  body.hab-mobile-run01 #main-content .contract-scan-trigger__copy strong { font-size: 10.5px; }
  body.hab-mobile-run01 #main-content .review-grid[data-mobile-review-rail] { grid-auto-columns: 92%; }
  body.hab-mobile-run01 #main-content .how-route-tab strong,
  body.hab-mobile-run01 #main-content .about-standard-track button strong { font-size: 10px; }
  body.hab-mobile-run01 #main-content .rvp-noise-visual { grid-template-columns: 96px minmax(0,1fr); gap: 12px; }
  body.hab-mobile-run01 #main-content .rvp-device-outline { transform: scale(.9); }
  body.hab-mobile-run01 .hab-footer__stage { gap-inline: 14px; }
}

@media (min-width: 768px) and (max-width: 1024px) {
  body.hab-mobile-run01 .hab-footer__stage { row-gap: 28px; }
  body.hab-mobile-run01 #main-content .signature-heading .hab-section-title { text-wrap: balance; }
}

@media (prefers-reduced-motion: reduce) {
  body.hab-mobile-run01 #main-content .hab-mobile-disclosure > summary span:last-child { transition: none; }
  body.hab-mobile-run01 #main-content .review-grid[data-mobile-review-rail] { scroll-behavior: auto; }
}
