/* All color, font and type values live in theme.css. */
body { font-family: var(--font-body); font-size: var(--type-body); line-height: var(--line-body); }
body h1, body .hero h1, body .platform-hero h1, body .demo-pitch h1, body .narrow-page h1 { font-family: var(--font-heading); font-size: var(--type-h1); font-weight: var(--weight-heading); line-height: var(--line-heading); letter-spacing: normal; }
body h2, body .split h2, body .closing h2, body .privacy-panel h2, body .analysis-case h2 { font-size: var(--type-h2); font-weight: var(--weight-heading); line-height: 1.12; }
body h3, body .card h3, body .resident-cards .card h3, body .scope-columns h3, body .platform-parts h3 { font-size: var(--type-card); line-height: 1.22; }
body p, body .split p:not(.eyebrow):not(.footnote):not(.tiny):not(.fineprint), body .card p, body .platform-parts p, body .resident-cards .card p, body .subhead, body .hero-copy .subhead, body .demo-page .demo-pitch p.subhead { font-size: var(--type-body); line-height: var(--line-body); }
body .eyebrow, body .tiny, body .badge, body .illustrative-label, body .fineprint, body .footnote, body .demo-note, body .breadcrumbs, body .product-label, body .person-role, body .person p, body .case-facts span, body .benefit-bar .category-note, body .ecosystem-names > span { font-size: var(--type-small); line-height: var(--line-body); }
body .eyebrow { letter-spacing: .08em; margin-bottom: 18px; }
body .section { padding-block: var(--section-space); }
body .hero { padding-block: var(--hero-space); }
body .section-heading { margin-bottom: 30px; }
body .button, body .text-link, body .site-nav, body .site-nav .button, body .footer-links, body .footer-brand p { font-size: var(--type-nav); }
body .button { white-space: normal; text-align: left; min-height: 54px; gap: 18px; }
body .text-link { line-height: 1.45; text-underline-offset: 5px; }
a, button { transition: color .18s, background-color .18s, border-color .18s, transform .18s; }
a:hover { text-decoration: underline; text-underline-offset: 5px; }
a.button:hover, a.hero-door:hover { text-decoration: none; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--focus); outline-offset: 5px; }
.button:hover .icon, .text-link:hover .icon, .hero-door:hover .hero-door-arrow { transform: translateX(4px); }
.button .icon, .text-link .icon, .hero-door-arrow { transition: transform .18s; }
.site-nav { gap: 24px; }
.header-inner { gap: 24px; }
.band { width: 100%; }
.band-sage { background: var(--sage-dark); color: var(--on-dark); }
.band-dark { background: var(--ink); color: var(--on-dark); }
.band-sage p, .band-dark p, .band-sage .person p, .band-dark .person p, .band-sage .eyebrow, .band-dark .eyebrow { color: var(--on-dark-muted); }
.band .text-link { border-color: var(--on-dark-line); }
.band .button { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.band .card, .band .panel { color: var(--ink); background: var(--paper); }
.band .card p, .band .panel p { color: var(--muted); }
.band .card .eyebrow { color: var(--muted); }
.band .illustrative-label { color: var(--on-dark-muted); }
.band .browser-moment .illustrative-label { color: var(--muted); }
.closing { width: 100%; max-width: none; border-radius: 0; margin-block: 0; padding: var(--section-space) max(20px, calc((100vw - var(--max)) / 2)); }
.closing > div { max-width: 820px; }
.closing p:not(.eyebrow) { color: var(--on-dark-muted); }
.site-footer { background: var(--ink); color: var(--on-dark); border-color: var(--on-dark-line); }
.site-footer p, .site-footer .eyebrow, .site-footer .footer-bottom { color: var(--on-dark-muted); }
.site-footer .footer-bottom { border-color: var(--on-dark-line); font-size: var(--type-small); }
.site-footer .footer-links { gap: 14px; }
.site-footer a:hover { color: var(--on-dark); }
.team-grid, .team-grid.compact { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 32px; }
.person, .compact .person { display: flex; gap: 20px; align-items: flex-start; }
.person > img, .compact .person > img { width: 96px; height: 96px; border-radius: 50%; flex-shrink: 0; object-fit: cover; margin: 0; }
.person h3, .compact .person h3 { font-size: var(--type-card); }
.person p, .compact .person p { font-size: var(--type-small); line-height: 1.5; }
.person .person-role { font-size: var(--type-small); text-transform: none; letter-spacing: normal; }
.team-grid.compact .person > img { width: 72px; height: 72px; }
.compact .person:last-child { grid-column: auto; }
.matter-inline-logo { display: inline-block; width: 70px; height: auto; vertical-align: middle; margin-left: 8px; background: var(--paper); border-radius: 5px; padding: 5px 7px; }
.band .matter-inline-logo { background: var(--paper); }
.visual-slot { min-width: 0; position: relative; }
.visual-slot .slot-image { width: 100%; height: auto; border-radius: var(--radius); }
.proof-section .installation-photo { overflow: hidden; border-radius: var(--radius); background: var(--stone); }
.proof-section .installation-photo img { width: 100%; height: auto; }
.system-diagram .diagram-node strong { font-size: var(--type-small); }
.system-diagram .diagram-node span, .assistant-side { font-size: var(--type-small); }
.diagram-node { min-width: 0; }
.diagram-node strong { overflow-wrap: anywhere; }
.scope-columns li, .timeline p, .timeline h3, .faq summary, .faq-answer, .search-copy { font-size: var(--type-body); }
.timeline h3 { font-size: var(--type-card); }
.form-panel h2 { font-size: var(--type-card); }
.field input, .field select, .field textarea, .field > span:first-child, .consent, .form-panel > p, .form-notice, .form-panel button, .property-details > summary, .booking-placeholder { font-size: var(--type-small); }
.consent a { text-decoration: underline; }
.portfolio-summary > span, .unit-row, .unit-row strong, .unit-row small, .unit-row .status, .unit-row .status-alert, .handoff-row, .handoff-row strong, .dashboard-bottom, .browser-bar, .browser-moment > .illustrative-label, .phone-header .tiny, .alert-moment .tiny, .alert-moment strong, .alert-moment p, .voice-command { font-size: var(--type-small) !important; }
.portfolio-summary { grid-template-columns: 1fr; }
.browser-content { padding: 28px; }
.phone-frame { width: 320px; }
.browser-bar { flex-wrap: wrap; }
.unit-row, .handoff-row { flex-wrap: wrap; }
.phone-moment { position: static; }
.phone-header strong { font-size: var(--type-card); }
.cloud-labels > span, .building-caption, .product-figure figcaption, .hero-product-note, .demo-list li, .analysis-total span { font-size: var(--type-small); }
.card { min-height: 0; padding: 32px; }
.cards.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.legal-page p { font-size: var(--type-legal); }
.legal-page h2 { font-size: var(--type-card); }
.legal-text { font-size: var(--type-legal); }
.longevity-visual { padding: 34px; border: 1px solid var(--on-dark-line); border-radius: var(--radius); }
.longevity-bars { display: grid; gap: 25px; }
.longevity-row { display: grid; grid-template-columns: 110px 1fr; gap: 20px; align-items: center; font-size: var(--type-small); }
.longevity-track { height: 20px; }
.longevity-track i { display: block; height: 100%; background: var(--on-dark); border-radius: 8px; }
.longevity-row:nth-child(2) i { opacity: .72; }
.longevity-row:nth-child(3) i { opacity: .5; }
.longevity-row:nth-child(4) i { opacity: .83; }
.demo-home-art { background: var(--stone); color: var(--ink); border-radius: var(--radius); padding: 24px; }
.demo-home-art > svg { width: 100%; height: auto; }
.home-roof, .home-room-line { fill: none; stroke: var(--muted); stroke-width: 3; }
.home-wall { fill: var(--paper); stroke: var(--muted); stroke-width: 2; }
.home-door, .home-thermostat { fill: var(--sage-dark); }
.home-window { fill: var(--stone); stroke: var(--muted); stroke-width: 2; }
.home-light { fill: var(--olive); }
.demo-home-controls { display: flex; justify-content: center; gap: 28px; font-size: var(--type-small); flex-wrap: wrap; }
.demo-home-controls > span { display: flex; gap: 9px; align-items: center; }
.demo-home-art .illustrative-label { color: var(--muted); }
.resident-footer { padding-bottom: 35px; }
@media (max-width: 1100px) {
  .team-grid, .team-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .person { flex-direction: column; }
  .site-nav { gap: 17px; }
  .site-nav .button { padding-inline: 16px; }
}
@media (max-width: 900px) {
  .mobile-menu-button { display: block; }
  .site-nav { display: none; position: absolute; top: 88px; left: 0; right: 0; padding: 24px; background: var(--paper); flex-direction: column; align-items: stretch; border-bottom: 1px solid var(--line); box-shadow: var(--shadow-soft); }
  .site-nav[data-open=true] { display: flex; }
  .site-nav > a:not(.button) { padding-block: 12px; }
  .site-nav > a[aria-current=page]:not(.button):after { display: none; }
  .timeline { grid-template-columns: 1fr; }
  .timeline li:not(:last-child):before { display: none; }
  .timeline li { display: grid; grid-template-columns: 50px 1fr; gap: 6px 20px; }
  .timeline-icon { grid-row: 1 / 3; }
  .timeline h3 { margin-block: 8px; }
}
@media (max-width: 800px) {
  .container { width: calc(100% - 40px); }
  .header-inner { height: 74px; }
  .site-nav { top: 74px; }
  .split, .open-design { display: flex; flex-direction: column; gap: 34px; align-items: stretch; }
  .platform-parts { grid-template-columns: 1fr; gap: 32px; }
  .platform-parts article { display: block; }
  .platform-parts article > .icon { margin-bottom: 18px; }
  .system-diagram { display: flex; flex-direction: column; gap: 20px; }
  .system-diagram .connector { width: 1px; height: 25px; }
  .system-diagram .connector:after { top: auto; bottom: 0; right: -3px; transform: rotate(135deg); }
  .assistant-side { width: 100%; text-align: center; }
  .cards.two, .cards.three, .cards.four { grid-template-columns: 1fr; }
  .closing { padding-inline: 20px; align-items: flex-start; flex-direction: column; gap: 28px; }
  .footer-main { gap: 34px; }
  .team-grid, .team-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .compact .person { flex-direction: column; }
  .person > img, .compact .person > img { width: 82px; height: 82px; }
  .longevity-visual { padding: 25px; }
  .longevity-row { grid-template-columns: 85px 1fr; gap: 12px; }
  .scope-columns { grid-template-columns: 1fr; }
  .portfolio-summary { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .header-inner { height: 69px; }
  .site-nav { top: 69px; }
  .team-grid .person h3 { font-size: var(--type-body); }
  .footer-bottom { font-size: var(--type-small); }
  .card { padding: 28px; }
  .body-large { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *:before, *:after { animation: none !important; transition: none !important; }
  .button:hover .icon, .text-link:hover .icon, .hero-door:hover .hero-door-arrow { transform: none; }
}

/* Keep inherited emphasis lines at the body size, including mobile. */
body .closing-line { font-size: var(--type-body) !important; }

.card { border: 1px solid transparent; transition: border-color .18s, background-color .18s; }
.card:hover, .card:focus-within { border-color: var(--olive); }
.hero-door:focus-visible { border-color: var(--ink); outline-color: var(--focus); }

.band .form-panel { background: var(--stone); color: var(--ink); }
.band .form-panel p, .band .form-panel .muted { color: var(--muted); }
.band .form-panel .field, .band .form-panel .consent, .band .form-panel .consent a { color: var(--ink); }
