:root {
    color-scheme: light;
    --navy: #102e40;
    --ink: #173a4b;
    --muted: #536975;
    --teal: #087f82;
    --teal-dark: #06696c;
    --mint: #edf6f3;
    --line: #d7e4e4;
    --paper: #fff;
    --radius: 16px;
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    color: var(--ink);
    background: var(--paper);
    font-synthesis: none;
}
* {
    box-sizing: border-box;
}
body {
    margin: 0;
}
a {
    color: var(--teal-dark);
    text-underline-offset: 4px;
}
button,
summary,
a {
    -webkit-tap-highlight-color: transparent;
}
a,
button,
summary {
    touch-action: manipulation;
}
img {
    max-width: 100%;
    height: auto;
    display: block;
}
h1,
h2,
h3,
h4,
p,
figure {
    margin: 0;
}
h1,
h2,
h3,
h4 {
    color: var(--navy);
}
h1 {
    font-size: clamp(40px, 4.5vw, 68px);
    line-height: 1.07;
    letter-spacing: -0.052em;
    font-weight: 650;
}
h1 em {
    font-style: normal;
    color: var(--teal);
}
h2 {
    font-size: clamp(30px, 3.2vw, 44px);
    line-height: 1.15;
    letter-spacing: -0.038em;
    font-weight: 650;
}
h3 {
    font-size: 23px;
    line-height: 1.3;
    letter-spacing: -0.022em;
}
p {
    font-size: 16px;
    line-height: 1.75;
    color: var(--muted);
}
p + p {
    margin-top: 20px;
}
strong {
    font-weight: 650;
}
::selection {
    background: #bde9e3;
    color: var(--navy);
}
:focus-visible {
    outline: 3px solid #ab5800;
    outline-offset: 5px;
}
html {
    scroll-padding-top: 100px;
}
.wrap {
    width: calc(100% - 96px);
    max-width: 1320px;
    margin-inline: auto;
}
.skip-link {
    position: fixed;
    top: -100px;
    left: 16px;
    z-index: 100;
    padding: 14px 20px;
    background: white;
}
.skip-link:focus {
    top: 8px;
}
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    min-height: 50px;
    padding: 14px 22px;
    border: 1px solid var(--teal);
    border-radius: 7px;
    background: var(--teal);
    color: white;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    transition:
        background 0.16s,
        box-shadow 0.16s;
}
.button:hover {
    background: var(--teal-dark);
    box-shadow: 0 5px 16px #12334716;
}
.button-small {
    padding: 11px 16px;
    min-height: 44px;
    font-size: 14px;
    gap: 12px;
}
.button-outline {
    background: transparent;
    color: var(--navy);
    border-color: #8ba4ad;
}
.button-outline:hover {
    background: var(--mint);
}
.button-light {
    background: white;
    color: var(--navy);
    border-color: white;
    flex-shrink: 0;
}
.button-light:hover {
    background: #e5f6f1;
}
.text-link {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    min-height: 44px;
    padding-block: 10px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
}
.text-link:hover {
    text-decoration: underline;
}
.actions {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-top: 28px;
}
.eyebrow {
    display: block;
    color: var(--teal-dark);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 20px;
}
.site-header {
    position: sticky;
    top: 0;
    background: #fffffff5;
    backdrop-filter: blur(16px);
    z-index: 30;
    border-bottom: 1px solid #dce7e6;
}
.header-row {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}
.brand {
    display: inline-flex;
    align-items: center;
    min-height: 48px;
    flex-shrink: 0;
}
.brand img {
    width: 176px;
    height: auto;
}
.desktop-nav {
    display: flex;
    align-items: center;
    gap: 24px;
}
.desktop-nav > a:not(.button) {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    text-decoration: none;
    color: var(--ink);
    font-size: 14px;
    font-weight: 550;
    white-space: nowrap;
}
.desktop-nav > a:not(.button):hover,
.desktop-nav > a:not(.button)[aria-current] {
    color: var(--teal);
    text-decoration: underline;
    text-underline-offset: 8px;
}
.button-signin {
    background: var(--navy);
    border-color: var(--navy);
    white-space: nowrap;
}
.mobile-menu {
    display: none;
}
.hero {
    background: linear-gradient(115deg, #f5f8f4 0%, #f0f7f5 54%, #e1f0ec 100%);
    overflow: hidden;
    padding: 84px 0 68px;
}
.hero-grid {
    display: grid;
    grid-template-columns: 0.86fr 1.14fr;
    align-items: center;
    gap: 40px;
}
.hero h1 {
    font-size: clamp(42px, 4.3vw, 62px);
}
.lead {
    font-size: 19px;
    line-height: 1.7;
    max-width: 690px;
    margin-top: 28px;
}
.hero .lead {
    max-width: 480px;
}
.hero-tagline {
    margin-top: 32px;
    font-size: 13px;
    color: #45616a;
}
.hero-product {
    min-width: 0;
}
.product-figure {
    margin: 0;
}
.product-window {
    border: 1px solid #b8cfd0;
    border-radius: 12px;
    background: white;
    overflow: hidden;
    box-shadow: 0 28px 64px -25px #173c4555;
}
.product-top {
    background: var(--navy);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 15px 20px;
    color: #d6e8ec;
    font-size: 11px;
}
.product-top > span:first-of-type {
    margin-left: auto;
}
.product-avatar {
    height: 28px;
    width: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #d9eee8;
    color: var(--navy);
    font-size: 10px;
    flex-shrink: 0;
}
.product-body {
    padding: 24px;
    background: #f5f8fa;
}
.product-identity {
    display: flex;
    align-items: center;
    gap: 20px;
    background: white;
    border: 1px solid #dce6ea;
    border-radius: 10px;
    padding: 20px;
}
.portrait-monogram {
    flex: 0 0 66px;
    width: 66px;
    height: 80px;
    border-radius: 8px;
    background: linear-gradient(140deg, #dceee3, #e6e3d4);
    display: grid;
    place-items: center;
    font-family: Georgia, serif;
    font-size: 30px;
    color: #396359;
}
.tiny-label {
    display: block;
    font-size: 9px;
    letter-spacing: 0.13em;
    font-weight: 650;
    color: #536b76;
    margin-bottom: 8px;
}
.product-identity h3 {
    font-size: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    letter-spacing: -0.02em;
}
.product-identity p {
    font-size: 11px;
    margin-top: 7px;
}
.status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    max-width: 100%;
    padding: 4px 8px;
    border-radius: 20px;
    background: #e1f5ec;
    color: #166349;
    font-size: 9px;
    font-weight: 600;
    white-space: nowrap;
    letter-spacing: 0;
}
.status-blue {
    background: #e7eff8;
    color: #294f70;
}
.status-yellow {
    background: #fff1cc;
    color: #79540a;
}
.identity-facts {
    display: flex;
    gap: 32px;
    font-size: 10px;
    margin-top: 14px;
    color: #244857;
}
.identity-facts small {
    display: block;
    color: #536b76;
    font-size: 9px;
    margin-bottom: 4px;
}
.product-tabs {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ccdfe2;
    padding-top: 22px;
    font-size: 10px;
    color: #4c6777;
    gap: 10px;
}
.product-tabs span {
    padding: 0 2px 10px;
}
.product-tabs .selected {
    border-bottom: 2px solid var(--teal);
    color: var(--teal-dark);
    font-weight: 650;
}
.product-content {
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    gap: 16px;
    padding-top: 18px;
}
.mini-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
    font-size: 9px;
    color: var(--muted);
}
.mini-heading h4 {
    font-size: 12px;
}
.schedule-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 0;
    border-top: 1px solid #dce6eb;
    font-size: 10px;
}
.time {
    font-size: 9px;
    color: #60717d;
}
.schedule-row strong {
    font-size: 10px;
    display: block;
}
.schedule-row small {
    font-size: 9px;
    display: block;
    color: #5e7280;
    margin-top: 5px;
}
.schedule-row .status {
    margin-left: auto;
    font-size: 8px;
    padding: 3px 5px;
}
.product-note {
    border: 1px solid #d7e6df;
    background: #eaf3ed;
    border-radius: 7px;
    padding: 14px;
}
.product-note strong {
    font-size: 19px;
    line-height: 1.2;
    letter-spacing: -0.025em;
    display: block;
}
.product-note p {
    font-size: 9px;
    line-height: 1.5;
    margin-top: 12px;
}
.mini-progress {
    display: flex;
    gap: 5px;
    margin-top: 18px;
}
.mini-progress span {
    height: 4px;
    width: 22%;
    background: #5c978b;
    border-radius: 4px;
}
.mini-progress span:last-child {
    background: #c6dcd3;
}
figcaption,
.caption {
    font-size: 12px;
    line-height: 1.6;
    color: #557078;
    margin-top: 16px;
}
figcaption {
    text-align: right;
}
.audience-strip {
    padding: 12px 0;
    background:
        radial-gradient(ellipse at 75% 0%, #087b80 0%, transparent 65%),
        linear-gradient(110deg, #102e40, #075760);
    border-top: 1px solid #3db9b466;
    border-bottom: 1px solid #0c5f68;
    box-shadow: inset 0 1px 0 #b3fff015;
}
.audience-strip .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.audience-strip p {
    font-size: 13px;
    color: #d2edec;
}
.audience-strip .wrap > div {
    display: flex;
    align-items: center;
    gap: 28px;
    flex-wrap: wrap;
}
.audience-strip a {
    color: #ffffff;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}
.audience-strip a:hover {
    color: #c5fff0;
    text-decoration: underline;
    text-underline-offset: 5px;
}
.audience-strip a:focus-visible {
    outline: 2px solid #a6ffe5;
    outline-offset: 4px;
    border-radius: 4px;
}
.audience-strip span {
    color: #74efcd;
    font-size: 14px;
}
.section {
    padding: 96px 0;
}
.section-tint {
    background: #f3f7f6;
}
.section-heading {
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    align-items: end;
    gap: 70px;
    margin-bottom: 48px;
}
.section-heading p {
    max-width: 370px;
}
.feature-columns {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 48px;
    margin-top: 44px;
}
.feature-columns article {
    border-top: 1px solid #b9ccce;
    padding-top: 28px;
}
.feature-number {
    display: block;
    color: var(--teal-dark);
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.08em;
    margin-bottom: 24px;
}
.feature-columns h3 {
    margin-bottom: 18px;
}
.feature-columns p {
    font-size: 15px;
}
.feature-columns .text-link {
    margin-top: 20px;
}
.split-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 96px;
    align-items: center;
}
.split-section h2 + p {
    margin-top: 24px;
}
.lead-small {
    font-size: 19px;
    line-height: 1.65;
}
.workflow {
    list-style: none;
    counter-reset: steps;
    padding: 0;
    margin: 32px 0 0;
}
.workflow li {
    counter-increment: steps;
    position: relative;
    padding: 0 0 26px 50px;
}
.workflow li:last-child {
    padding-bottom: 0;
}
.workflow li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 9px;
    width: 12px;
    height: 12px;
    border: 2px solid var(--teal);
    border-radius: 50%;
    background: #c9eee4;
}
.workflow strong {
    font-size: 17px;
}
.workflow p {
    font-size: 14px;
    margin-top: 7px;
}
.housing-preview {
    background: white;
    border: 1px solid #c9ddda;
    border-radius: var(--radius);
    padding: 32px;
    box-shadow: 0 20px 40px -26px #284e5b55;
}
.preview-caption {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 28px;
}
.preview-caption .eyebrow {
    margin: 0;
    font-size: 10px;
}
.housing-preview h3 {
    font-size: 28px;
    margin-bottom: 8px;
}
.housing-preview > p {
    font-size: 14px;
}
.bed-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 28px 0;
}
.bed-grid > div {
    padding: 22px;
    border: 1px solid #d3e1e5;
    border-radius: 9px;
    background: #f7fafb;
}
.bed-grid span {
    display: block;
    font-size: 10px;
    color: #536975;
    letter-spacing: 0.12em;
}
.bed-grid strong {
    display: block;
    font-size: 21px;
    margin: 10px 0 16px;
}
.bed-grid .status {
    font-size: 11px;
}
.preview-foot {
    font-size: 12px;
    color: #416776;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}
.principle-list article {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding: 24px 0;
    border-bottom: 1px solid var(--line);
}
.principle-list article:first-child {
    padding-top: 0;
}
.principle-list article > span {
    color: var(--teal);
    font-size: 12px;
    line-height: 30px;
}
.principle-list h3 {
    font-size: 21px;
    margin-bottom: 10px;
}
.principle-list p {
    font-size: 15px;
}
.faq-grid {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 96px;
}
.faq-grid h2 + p {
    margin-top: 24px;
}
.faq-grid .text-link {
    margin-top: 20px;
}
.faq details {
    border-bottom: 1px solid #bacecc;
}
.faq summary {
    position: relative;
    cursor: pointer;
    list-style: none;
    padding: 24px 40px 24px 0;
    min-height: 64px;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.55;
}
.faq summary::-webkit-details-marker {
    display: none;
}
.faq summary:after {
    content: "+";
    position: absolute;
    right: 8px;
    top: 20px;
    font-size: 24px;
    font-weight: 400;
    color: var(--teal);
}
.faq details[open] summary:after {
    content: "−";
}
.faq details p {
    padding: 0 30px 24px 0;
    font-size: 15px;
}
.closing {
    padding: 66px 0;
    background: var(--navy);
    color: white;
}
.closing-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 48px;
}
.closing .eyebrow {
    color: #91d8cd;
    margin-bottom: 14px;
    font-size: 11px;
}
.closing h2 {
    color: white;
    font-size: clamp(28px, 3vw, 39px);
}
.closing p {
    color: #c2d4dc;
    margin-top: 18px;
}
.site-footer {
    padding: 60px 0 0;
    background: #fff;
}
.footer-grid {
    display: grid;
    grid-template-columns: 1.25fr 0.8fr 1.35fr 1fr 1.1fr;
    gap: 40px;
    padding-bottom: 48px;
}
.footer-brand p {
    font-size: 13px;
    line-height: 1.7;
    margin-top: 20px;
}
.site-footer nav h2 {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    line-height: 1.5;
    margin-bottom: 16px;
}
.site-footer nav a {
    display: flex;
    align-items: center;
    min-height: 44px;
    width: fit-content;
    font-size: 13px;
    text-decoration: none;
    color: var(--muted);
    line-height: 1.5;
}
.site-footer nav a:hover {
    color: var(--teal);
    text-decoration: underline;
}
.footer-bottom {
    border-top: 1px solid var(--line);
    padding: 24px 0;
    display: flex;
    justify-content: center;
    text-align: center;
    gap: 24px;
    font-size: 11px;
    color: var(--muted);
    line-height: 1.6;
}
.page-hero {
    background: linear-gradient(110deg, #f5f8f4, #edf6f3);
    padding: 80px 0;
}
.page-hero h1 {
    max-width: 1080px;
}
.page-hero .button {
    margin-top: 30px;
}
.page-hero .lead {
    max-width: 760px;
}
.centered {
    text-align: center;
}
.centered h1,
.centered .lead {
    margin-inline: auto;
}
.pill {
    display: inline-flex;
    align-items: center;
    padding: 10px 16px;
    margin-top: 28px;
    font-size: 12px;
    background: #dfede8;
    color: #28594f;
    border-radius: 30px;
}
.product-showcase {
    max-width: 980px;
    margin-top: 64px;
}
.product-showcase .product-body {
    padding: 32px;
}
.product-showcase .product-content {
    grid-template-columns: 1.8fr 1fr;
}
.product-showcase .schedule-row {
    padding: 22px 0;
}
.product-showcase .schedule-row strong {
    font-size: 13px;
}
.product-showcase .product-identity h3 {
    font-size: 25px;
}
.capability-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 40px;
}
.capability {
    padding: 32px 0;
    border-top: 1px solid #bccfd0;
    scroll-margin-top: 104px;
}
.capability h3 {
    font-size: 22px;
    margin-bottom: 12px;
}
.capability p {
    font-size: 15px;
}
.check-list {
    list-style: none;
    margin: 24px 0 0;
    padding: 0;
}
.check-list li {
    position: relative;
    padding-left: 26px;
    font-size: 14px;
    line-height: 1.65;
    margin-top: 12px;
    color: var(--muted);
}
.check-list li:before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--teal);
    font-weight: 700;
}
.section-navy {
    background: var(--navy);
}
.section-navy h2,
.section-navy h3 {
    color: white;
}
.section-navy .eyebrow {
    color: #94d8ce;
}
.section-navy p {
    color: #c5d8df;
}
.navy-points article + article {
    border-top: 1px solid #37525f;
    margin-top: 26px;
    padding-top: 26px;
}
.navy-points h3 {
    font-size: 20px;
    margin-bottom: 8px;
}
.navy-points p {
    font-size: 15px;
}
.availability {
    max-width: 860px;
}
.availability h2 {
    margin-bottom: 28px;
}
.availability .text-link {
    margin-top: 20px;
}
.audience-grid {
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    gap: 96px;
    align-items: center;
}
.audience-grid h2 {
    margin-bottom: 24px;
}
.audience-grid.reverse :is(.audience-art, .audience-photo) {
    order: 2;
}
.audience-grid.reverse {
    grid-template-columns: 1.15fr 0.85fr;
}
.audience-art {
    min-height: 470px;
    border-radius: 18px;
    padding: 40px;
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.audience-art > span {
    font-size: 15px;
    color: #406b5d;
    letter-spacing: 0.1em;
}
.audience-art > strong {
    font-size: 38px;
    line-height: 1.12;
    letter-spacing: -0.04em;
    margin-top: auto;
    position: relative;
    color: #264a41;
}
.art-recovery {
    background: #e2eee2;
}
.art-mental {
    background: #dfeaf1;
}
.art-mental > strong {
    color: #294a60;
}
.art-supported {
    background: #f0eadd;
}
.art-supported > strong {
    color: #635641;
}
.house-mark {
    height: 140px;
    width: 165px;
    border: 3px solid #709b86;
    position: absolute;
    top: 152px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
}
.house-mark:before {
    content: "";
    position: absolute;
    width: 113px;
    height: 113px;
    border-top: 3px solid #709b86;
    border-left: 3px solid #709b86;
    transform: rotate(45deg);
    top: -60px;
    background: #e2eee2;
}
.house-mark i {
    height: 35px;
    width: 30px;
    background: #8aaf98;
    z-index: 1;
}
.connection-mark {
    position: absolute;
    width: 200px;
    height: 170px;
    left: 50%;
    transform: translateX(-50%);
    top: 125px;
}
.connection-mark i {
    position: absolute;
    width: 98px;
    height: 98px;
    border: 2px solid #719bb1;
    border-radius: 50%;
    left: 0;
    top: 0;
}
.connection-mark i:nth-child(2) {
    left: 85px;
    top: 0;
}
.connection-mark i:nth-child(3) {
    left: 44px;
    top: 70px;
}
.steps-mark {
    position: absolute;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    height: 200px;
    display: flex;
    gap: 10px;
    align-items: end;
}
.steps-mark i {
    width: 60px;
    height: 70px;
    border-radius: 30px 30px 0 0;
    background: #c5b898;
}
.steps-mark i:nth-child(2) {
    height: 120px;
    background: #b3a885;
}
.steps-mark i:nth-child(3) {
    height: 170px;
    background: #978e6b;
}
.scenario {
    border-left: 2px solid #85b8ab;
    padding: 4px 0 4px 20px;
    margin: 28px 0 16px;
}
.scenario p {
    font-size: 14px;
}
.note-panel {
    background: #eff5f4;
    border: 1px solid #d1e2dd;
    border-radius: 10px;
    padding: 24px 28px;
    margin-bottom: 64px;
}
.note-panel > strong {
    font-size: 16px;
}
.note-panel p {
    font-size: 14px;
    margin-top: 8px;
}
.pricing-section {
    padding: 64px 0;
    background: linear-gradient(180deg, #edf6f3 0%, #fff 75%);
}
.pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}
.price-card {
    border: 1px solid #cddcde;
    border-radius: 14px;
    background: white;
    padding: 32px;
    box-shadow: 0 10px 20px -16px #143c4566;
}
.price-card .eyebrow {
    font-size: 10px;
    margin-bottom: 12px;
}
.price-card h2 {
    font-size: 30px;
}
.price-card > p {
    font-size: 14px;
    margin-top: 12px;
}
.price-highlight {
    border: 2px solid var(--teal);
    padding: 31px;
}
.price {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 28px 0;
}
.price > strong {
    font-size: 52px;
    letter-spacing: -0.05em;
    color: var(--navy);
}
.price > span {
    font-size: 12px;
    line-height: 1.6;
    color: var(--muted);
}
.price-card .check-list {
    border-top: 1px solid var(--line);
    padding-top: 12px;
    min-height: 175px;
}
.price-card .button {
    display: flex;
    margin-top: 24px;
}
.enterprise-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    padding: 36px 0;
}
.enterprise-row h2 {
    font-size: 22px;
    margin-bottom: 6px;
}
.enterprise-row p {
    font-size: 14px;
}
.pricing-section .note-panel {
    margin-bottom: 0;
}
.table-scroll {
    max-width: 100%;
    overflow-x: auto;
    border: 1px solid #cbdcdd;
    border-radius: 12px;
    background: #fff;
}
.pricing-table {
    border-collapse: collapse;
    width: 100%;
    min-width: 620px;
    text-align: left;
}
.pricing-table caption {
    text-align: left;
    font-size: 13px;
    color: var(--muted);
    padding: 22px 24px;
    caption-side: bottom;
}
.pricing-table th,
.pricing-table td {
    padding: 22px 24px;
    border-bottom: 1px solid var(--line);
    font-size: 15px;
}
.pricing-table thead {
    background: var(--navy);
    color: white;
}
.pricing-table th {
    font-weight: 600;
}
.pricing-table td {
    font-size: 18px;
    color: var(--navy);
}
.pricing-table tr:last-child {
    background: #eef7f3;
}
.pricing-table thead tr:last-child {
    background: var(--navy);
}
.table-note {
    font-size: 13px;
    max-width: 1000px;
    margin-top: 24px;
}
.about-grid {
    display: grid;
    grid-template-columns: 0.7fr 1.3fr;
    gap: 100px;
    align-items: center;
}
.about-grid h2 {
    margin-bottom: 28px;
}
.founder-panel {
    padding: 44px;
    background: var(--navy);
    border-radius: 16px;
    color: white;
}
.founder-panel .eyebrow {
    color: #a1dcd2;
    font-size: 11px;
}
.founder-panel > strong {
    display: flex;
    align-items: baseline;
    gap: 16px;
    font-size: 140px;
    line-height: 1.2;
    letter-spacing: -0.06em;
}
.founder-panel > strong > span {
    font-size: 28px;
    letter-spacing: -0.03em;
    font-weight: 400;
}
.founder-panel p {
    font-size: 17px;
    color: #c5d8df;
}
.founder-rule {
    border-top: 1px solid #52707a;
    margin: 38px 0 24px;
}
.founder-panel > span:last-child {
    font-size: 13px;
    color: #bddbdc;
}
.contact-section {
    padding-top: 64px;
}
.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1.1fr;
    gap: 88px;
}
.contact-primary {
    padding: 40px;
    background: #edf5f1;
    border: 1px solid #d7e6df;
    border-radius: 16px;
}
.contact-primary p {
    margin-top: 24px;
}
.contact-primary .button {
    margin-top: 28px;
}
.contact-email {
    display: flex;
    align-items: center;
    min-height: 44px;
    width: fit-content;
    font-size: 17px;
    font-weight: 600;
    margin-top: 20px;
    overflow-wrap: anywhere;
}
.contact-primary .caption {
    font-size: 12px;
    margin-top: 12px;
}
.contact-secondary article + article {
    border-top: 1px solid var(--line);
    margin-top: 44px;
    padding-top: 36px;
}
.contact-secondary h2 {
    font-size: 28px;
    margin-bottom: 20px;
}
.contact-secondary .feature-number {
    font-size: 11px;
    margin-bottom: 16px;
}
.contact-secondary .actions {
    gap: 16px;
}
.contact-bottom {
    border-top: 1px solid var(--line);
    padding: 28px 0 48px;
}
.contact-bottom p {
    font-size: 14px;
    max-width: 930px;
}
.compact {
    padding: 64px 0;
}
.compact h1 {
    font-size: 48px;
    margin-bottom: 24px;
}
.legal-copy {
    max-width: 860px;
    padding: 64px 0 88px;
}
.legal-copy h2 {
    font-size: 26px;
    margin: 36px 0 16px;
    letter-spacing: -0.025em;
}
.legal-copy > h2:first-child {
    margin-top: 0;
}
.legal-copy h3 {
    font-size: 20px;
    margin: 28px 0 14px;
}
.legal-copy p,
.legal-copy li {
    font-size: 16px;
    line-height: 1.85;
    color: var(--muted);
}
.legal-copy li + li {
    margin-top: 12px;
}
.legal-copy .note-panel {
    margin-bottom: 36px;
}
.legal-copy a,
.faq a,
.note-panel a {
    overflow-wrap: anywhere;
}
@media (min-width: 1600px) {
    .hero {
        padding: 104px 0 88px;
    }
    .hero-grid {
        gap: 56px;
    }
    .hero h1 {
        font-size: 66px;
    }
    .hero .product-window {
        transform: rotate(-1deg);
    }
    .section {
        padding: 110px 0;
    }
    .header-row {
        min-height: 96px;
    }
    .desktop-nav {
        gap: 32px;
    }
}
@media (max-width: 1199px) {
    .wrap {
        width: calc(100% - 64px);
    }
    .desktop-nav {
        gap: 18px;
    }
    .brand img {
        width: 156px;
    }
    .hero-grid {
        gap: 30px;
    }
    .product-body {
        padding: 16px;
    }
    .product-identity {
        padding: 16px;
        gap: 12px;
    }
    .product-content {
        grid-template-columns: 1fr;
    }
    .product-note {
        display: none;
    }
    .product-identity h3 {
        font-size: 18px;
    }
    .section-heading {
        gap: 40px;
    }
    .split-section,
    .faq-grid,
    .audience-grid,
    .about-grid {
        gap: 56px;
    }
    .feature-columns {
        gap: 28px;
    }
    .contact-grid {
        gap: 40px;
    }
    .price-card {
        padding: 26px;
    }
    .price-highlight {
        padding: 25px;
    }
}
@media (max-width: 1119px) {
    .desktop-nav {
        display: none;
    }
    .header-row {
        min-height: 76px;
    }
    .mobile-menu {
        display: block;
    }
    .mobile-menu summary {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 14px;
        min-height: 44px;
        padding: 10px 14px;
        border: 1px solid #a6bfc2;
        border-radius: 6px;
        cursor: pointer;
        font-size: 14px;
        list-style: none;
    }
    .mobile-menu summary::-webkit-details-marker {
        display: none;
    }
    .menu-icon {
        width: 17px;
        height: 12px;
        border-top: 2px solid var(--navy);
        border-bottom: 2px solid var(--navy);
        position: relative;
    }
    .menu-icon:after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 4px;
        border-top: 2px solid var(--navy);
    }
    .mobile-menu[open] summary {
        background: var(--mint);
    }
    .mobile-menu nav {
        position: absolute;
        top: calc(100% - 1px);
        left: 0;
        right: 0;
        background: white;
        border-top: 1px solid var(--line);
        border-bottom: 1px solid var(--line);
        padding: 20px 32px 28px;
        box-shadow: 0 20px 24px #102e4015;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px 24px;
        max-height: calc(100dvh - 76px);
        overflow: auto;
    }
    .mobile-menu nav > a {
        display: flex;
        align-items: center;
        padding: 12px 16px;
        min-height: 48px;
        text-decoration: none;
        font-size: 16px;
        color: var(--ink);
        border-radius: 5px;
        line-height: 1.5;
    }
    .mobile-menu nav > a:hover,
    .mobile-menu nav > a[aria-current] {
        background: var(--mint);
        color: var(--teal-dark);
    }
    .mobile-menu nav > .button {
        color: white;
    }
    .mobile-menu nav > .button:hover {
        background: var(--teal-dark);
        color: white;
    }
    .hero {
        padding: 64px 0;
    }
    .hero h1 {
        font-size: 44px;
    }
    .hero .lead {
        font-size: 17px;
    }
    .hero .actions {
        gap: 12px;
    }
    .hero .button,
    .hero .text-link {
        font-size: 14px;
    }
    .hero .product-top > span:first-of-type {
        display: none;
    }
    .hero .portrait-monogram {
        flex-basis: 50px;
        width: 50px;
        height: 65px;
    }
    .hero .identity-facts {
        gap: 16px;
    }
    .audience-strip .wrap {
        flex-direction: column;
        gap: 8px;
    }
    .audience-strip .wrap > div {
        gap: 20px;
    }
    .capability-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0 32px;
    }
    .audience-art {
        min-height: 430px;
        padding: 28px;
    }
    .audience-art > strong {
        font-size: 31px;
    }
    .audience-grid,
    .audience-grid.reverse {
        gap: 48px;
    }
    .contact-grid {
        gap: 32px;
    }
    .footer-brand {
        grid-column: 1 / -1;
    }
    .footer-grid {
        gap: 26px;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .price-card {
        padding: 24px;
    }
    .price-highlight {
        padding: 23px;
    }
    .price {
        gap: 10px;
    }
    .price > strong {
        font-size: 44px;
    }
    .price-card .button {
        font-size: 13px;
        padding-inline: 12px;
        gap: 10px;
    }
}
@media (max-width: 899px) {
    .pricing-section {
        padding: 48px 0;
    }
    h1 {
        font-size: 48px;
    }
    .hero-grid {
        grid-template-columns: 1fr;
        gap: 44px;
    }
    .hero-copy {
        max-width: 650px;
    }
    .hero h1 {
        font-size: 56px;
    }
    .hero .lead {
        font-size: 19px;
        max-width: 620px;
    }
    .hero-product {
        max-width: 720px;
    }
    .product-content {
        grid-template-columns: 1.7fr 1fr;
    }
    .product-note {
        display: block;
    }
    .product-top > span:first-of-type {
        display: block;
    }
    .hero .product-top > span:first-of-type {
        display: block;
    }
    .hero .portrait-monogram {
        width: 66px;
        flex-basis: 66px;
        height: 80px;
    }
    .hero .product-identity h3 {
        font-size: 22px;
    }
    .hero .product-body {
        padding: 24px;
    }
    .section {
        padding: 72px 0;
    }
    .section-heading {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .section-heading p {
        max-width: 580px;
    }
    .feature-columns {
        gap: 24px;
    }
    .feature-columns h3 {
        font-size: 21px;
    }
    .feature-columns p {
        font-size: 14px;
    }
    .feature-columns .text-link {
        font-size: 13px;
        gap: 8px;
    }
    .split-section,
    .faq-grid {
        gap: 40px;
        grid-template-columns: 1fr;
    }
    .housing-preview {
        max-width: 610px;
    }
    .principle-list {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0;
    }
    .faq-grid {
        grid-template-columns: 0.8fr 1.2fr;
    }
    .closing-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 28px;
    }
    .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 32px;
    }
    .page-hero {
        padding: 64px 0;
    }
    .audience-grid,
    .audience-grid.reverse {
        grid-template-columns: 0.75fr 1.25fr;
        gap: 32px;
    }
    .audience-art {
        min-height: 480px;
        padding: 24px;
    }
    .audience-art > strong {
        font-size: 27px;
    }
    .audience-grid.reverse :is(.audience-art, .audience-photo) {
        order: 0;
    }
    .audience-grid h2 {
        font-size: 32px;
    }
    .pricing-grid {
        gap: 16px;
    }
    .price-card {
        padding: 22px 18px;
    }
    .price-highlight {
        padding: 21px 17px;
    }
    .price-card .check-list {
        min-height: 202px;
    }
    .price-card .check-list li {
        font-size: 13px;
    }
    .price > strong {
        font-size: 40px;
    }
    .price {
        flex-wrap: wrap;
        gap: 4px;
    }
    .price > span {
        font-size: 11px;
    }
    .enterprise-row h2 {
        font-size: 20px;
    }
    .about-grid {
        grid-template-columns: 0.75fr 1.25fr;
        gap: 40px;
    }
    .founder-panel {
        padding: 28px;
    }
    .founder-panel > strong {
        font-size: 110px;
    }
    .contact-grid {
        grid-template-columns: 1fr;
    }
    .contact-primary {
        max-width: 700px;
    }
    .contact-secondary {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }
    .contact-secondary article + article {
        border-top: 0;
        border-left: 1px solid var(--line);
        padding: 0 0 0 32px;
        margin: 0;
    }
}
@media (max-width: 599px) {
    .pricing-section {
        padding: 32px 0 40px;
    }
    .wrap {
        width: calc(100% - 40px);
    }
    .header-row {
        min-height: 72px;
        gap: 20px;
    }
    .brand img {
        width: 148px;
    }
    .mobile-menu nav {
        grid-template-columns: 1fr;
        padding: 16px 20px 24px;
        gap: 4px;
        max-height: calc(100dvh - 72px);
    }
    .mobile-menu nav > .button {
        margin-top: 8px;
    }
    .hero {
        padding: 48px 0 36px;
    }
    .hero h1 {
        font-size: 42px;
    }
    .eyebrow {
        font-size: 10px;
        letter-spacing: 0.11em;
        margin-bottom: 18px;
    }
    .hero .lead,
    .lead {
        font-size: 17px;
        line-height: 1.65;
        margin-top: 24px;
    }
    .hero-tagline {
        font-size: 12px;
        margin-top: 24px;
    }
    .hero-grid {
        gap: 36px;
    }
    .actions {
        gap: 12px;
        margin-top: 24px;
    }
    .hero .actions {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }
    .product-top {
        padding: 12px 14px;
    }
    .product-top > span:first-of-type,
    .hero .product-top > span:first-of-type {
        display: none;
    }
    .hero .product-body,
    .product-body,
    .product-showcase .product-body {
        padding: 12px;
    }
    .product-identity {
        padding: 12px;
        gap: 12px;
        align-items: flex-start;
    }
    .hero .portrait-monogram,
    .portrait-monogram {
        width: 42px;
        flex-basis: 42px;
        height: 56px;
        font-size: 24px;
    }
    .hero .product-identity h3,
    .product-identity h3,
    .product-showcase .product-identity h3 {
        font-size: 17px;
        gap: 7px;
    }
    .product-identity p {
        font-size: 10px;
        line-height: 1.5;
    }
    .tiny-label {
        font-size: 8px;
    }
    .identity-facts {
        gap: 14px;
        font-size: 9px;
        flex-wrap: wrap;
        margin-top: 10px;
    }
    .identity-facts small {
        font-size: 8px;
    }
    .product-tabs {
        font-size: 9px;
        gap: 5px;
        padding-top: 18px;
    }
    .product-content,
    .product-showcase .product-content {
        grid-template-columns: 1fr;
        padding-top: 14px;
    }
    .product-note {
        display: none;
    }
    .schedule-row,
    .product-showcase .schedule-row {
        padding: 13px 0;
    }
    .product-showcase .schedule-row strong {
        font-size: 10px;
    }
    .schedule-row .status {
        font-size: 8px;
    }
    .product-top img {
        width: 100px;
    }
    .product-window {
        box-shadow: 0 20px 32px -25px #173c4544;
    }
    figcaption {
        font-size: 10px;
        margin-top: 12px;
    }
    .audience-strip {
        padding: 12px 0;
    }
    .audience-strip .wrap {
        align-items: flex-start;
        gap: 14px;
    }
    .audience-strip .wrap > div {
        gap: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
    .audience-strip span {
        display: none;
    }
    .audience-strip a {
        font-size: 14px;
        min-height: 44px;
    }
    .section {
        padding: 56px 0;
    }
    h2 {
        font-size: 31px;
    }
    h3 {
        font-size: 23px;
    }
    .section-heading {
        margin-bottom: 32px;
        gap: 20px;
    }
    .feature-columns {
        grid-template-columns: 1fr;
        gap: 32px;
        margin-top: 32px;
    }
    .feature-columns article {
        padding-top: 24px;
    }
    .feature-columns h3 {
        font-size: 24px;
    }
    .feature-columns h3 br {
        display: none;
    }
    .feature-columns p {
        font-size: 15px;
    }
    .feature-number {
        margin-bottom: 18px;
        font-size: 11px;
    }
    .feature-columns .text-link {
        font-size: 15px;
        margin-top: 12px;
    }
    .split-section {
        gap: 36px;
    }
    .housing-preview {
        padding: 24px;
    }
    .housing-preview h3 {
        font-size: 26px;
    }
    .bed-grid {
        gap: 12px;
    }
    .bed-grid > div {
        padding: 16px;
    }
    .preview-caption {
        margin-bottom: 24px;
    }
    .preview-caption .eyebrow {
        font-size: 9px;
        letter-spacing: 0.08em;
    }
    .preview-foot {
        font-size: 11px;
    }
    .workflow li {
        padding-left: 44px;
    }
    .lead-small {
        font-size: 18px;
    }
    .principle-list article {
        gap: 20px;
    }
    .faq-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .faq summary {
        font-size: 15px;
        padding: 20px 32px 20px 0;
    }
    .faq details p {
        padding-right: 8px;
    }
    .closing {
        padding: 44px 0;
    }
    .closing h2 {
        font-size: 30px;
    }
    .closing p {
        font-size: 15px;
    }
    .closing-row {
        gap: 24px;
    }
    .site-footer {
        padding-top: 40px;
    }
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px 20px;
        padding-bottom: 36px;
    }
    .footer-brand {
        grid-column: 1/-1;
    }
    .footer-brand p {
        margin-top: 12px;
    }
    .site-footer nav h2 {
        font-size: 10px;
        letter-spacing: 0.07em;
        min-height: 30px;
        margin-bottom: 8px;
    }
    .site-footer nav a {
        font-size: 12px;
        min-height: 44px;
    }
    .footer-bottom {
        flex-direction: column;
        gap: 10px;
        font-size: 11px;
    }
    .page-hero {
        padding: 48px 0;
    }
    h1,
    .page-hero h1 {
        font-size: 40px;
    }
    .page-hero h1 br {
        display: none;
    }
    .centered {
        text-align: left;
    }
    .pill {
        font-size: 11px;
        padding: 10px 12px;
    }
    .product-showcase {
        margin-top: 36px;
    }
    .capability-grid {
        grid-template-columns: 1fr;
    }
    .capability {
        padding: 28px 0;
    }
    .capability h3 {
        font-size: 24px;
    }
    .capability .feature-number {
        margin-bottom: 14px;
    }
    .check-list li {
        font-size: 15px;
    }
    .availability h2 {
        margin-bottom: 20px;
    }
    .audience-grid,
    .audience-grid.reverse {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .audience-art {
        min-height: 300px;
        padding: 28px;
    }
    .audience-art > strong {
        font-size: 30px;
        max-width: 55%;
    }
    .house-mark {
        left: 73%;
        top: 122px;
        width: 105px;
        height: 95px;
    }
    .house-mark:before {
        width: 71px;
        height: 71px;
        top: -39px;
    }
    .house-mark i {
        width: 16px;
        height: 24px;
    }
    .house-mark i:last-child {
        display: none;
    }
    .connection-mark {
        left: 74%;
        top: 90px;
        transform: translateX(-50%) scale(0.7);
    }
    .steps-mark {
        left: 73%;
        top: 56px;
        transform: translateX(-50%) scale(0.65);
    }
    .audience-grid h2 {
        font-size: 30px;
    }
    .scenario {
        margin-top: 24px;
    }
    .note-panel {
        padding: 22px;
        margin-bottom: 40px;
    }
    .pricing-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .price-card,
    .price-highlight {
        padding: 28px;
    }
    .price-card .eyebrow {
        margin-bottom: 8px;
    }
    .price-card .check-list {
        min-height: 0;
    }
    .price {
        flex-wrap: nowrap;
        gap: 16px;
        margin: 20px 0;
    }
    .price > strong {
        font-size: 52px;
    }
    .price-card .check-list li {
        font-size: 15px;
    }
    .price-card .button {
        font-size: 15px;
    }
    .enterprise-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
        padding: 28px 0;
    }
    .pricing-table th,
    .pricing-table td {
        padding: 18px;
        font-size: 14px;
    }
    .pricing-table caption {
        font-size: 12px;
        padding: 18px;
    }
    .about-grid {
        grid-template-columns: 1fr;
        gap: 36px;
    }
    .founder-panel {
        padding: 32px;
    }
    .founder-panel > strong {
        font-size: 110px;
    }
    .founder-rule {
        margin: 28px 0 20px;
    }
    .contact-primary {
        padding: 26px;
    }
    .contact-primary h2 {
        font-size: 32px;
    }
    .contact-secondary {
        grid-template-columns: 1fr;
        gap: 32px;
    }
    .contact-secondary article + article {
        border-left: 0;
        border-top: 1px solid var(--line);
        padding: 32px 0 0;
    }
    .contact-secondary .actions {
        gap: 8px;
    }
    .contact-email {
        font-size: 15px;
    }
    .contact-primary .button {
        font-size: 14px;
        gap: 12px;
    }
    .contact-bottom {
        padding: 24px 0 32px;
    }
    .compact h1 {
        font-size: 37px;
    }
    .legal-copy {
        padding: 40px 0 56px;
    }
    .legal-copy h2 {
        font-size: 24px;
    }
    .legal-copy p,
    .legal-copy li {
        font-size: 15px;
    }
    .legal-copy ul {
        padding-left: 22px;
    }
}
@media (prefers-reduced-motion: reduce) {
    * {
        scroll-behavior: auto !important;
        transition: none !important;
    }
}

/* Public photographic heroes share one geometry across all page templates. */
.marketing-hero {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    height: 600px;
    min-height: 600px;
    padding: 56px 0;
    overflow: hidden;
    background-color: #092936;
    color: white;
}
.marketing-hero .hero-copy {
    width: 55%;
    max-width: 660px;
    position: relative;
}
.marketing-hero h1 {
    font-size: clamp(42px, 4.4vw, 64px);
    font-weight: 650;
    line-height: 1.1;
    letter-spacing: -0.038em;
    color: #fff;
    margin: 0;
    max-width: 100%;
}
.marketing-hero .lead {
    color: #edf5f7;
    font-size: 18px;
    line-height: 1.65;
    max-width: 560px;
    margin-top: 24px;
}
.marketing-hero .button {
    margin-top: 0;
}
.marketing-hero .text-link {
    color: white;
}
.photo-hero {
    background-image:
        linear-gradient(
            90deg,
            rgba(5, 28, 39, 0.94) 0%,
            rgba(5, 28, 39, 0.86) 35%,
            rgba(5, 28, 39, 0.43) 60%,
            rgba(5, 28, 39, 0.04) 85%
        ),
        var(--hero-image);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}
.hero-home {
    --hero-image: none;
}
.hero-what-it-does {
    --hero-image: url("/images/marketing/wellstay-what-it-does.webp");
}
.hero-who-its-for {
    --hero-image: url("/images/marketing/wellstay-who-its-for.webp");
}
.hero-about {
    --hero-image: url("/images/marketing/wellstay-about.webp");
}
.hero-contact {
    --hero-image: url("/images/marketing/wellstay-contact.webp");
}
.brand-hero {
    background:
        radial-gradient(ellipse at 85% 20%, #146967 0, transparent 48%),
        linear-gradient(125deg, #092936, #163d4b);
}
.brand-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 480px;
    height: 480px;
    border: 1px solid #85e6d52e;
    border-radius: 50%;
    right: -120px;
    top: 10px;
    box-shadow:
        0 0 0 80px #85e6d509,
        0 0 0 160px #85e6d507;
    pointer-events: none;
}
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    max-width: 100%;
    padding: 9px 15px;
    margin-bottom: 24px;
    color: #dcfff4;
    background: #10594f;
    border: 1px solid #75d9bb9c;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.5;
    letter-spacing: 0.045em;
    box-shadow:
        inset 0 1px 0 #ffffff12,
        0 5px 20px #001c2426;
}
.hero-badge::before {
    content: "";
    height: 6px;
    width: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #8ef2be;
    box-shadow: 0 0 0 4px #8ef2be15;
}
.hero-detail {
    display: block;
    color: #c4e4de;
    font-size: 13px;
    line-height: 1.7;
    margin-top: 28px;
}
.button-demo,
.desktop-nav > a.button-demo,
.mobile-menu nav > a.button-demo {
    color: #fff;
    background: linear-gradient(135deg, #078286, #06646d);
    border: 1px solid #219c9d;
    border-radius: 9px;
    text-decoration: none;
    box-shadow:
        inset 0 1px 0 #ffffff35,
        0 5px 14px #033d4521;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease;
}
.button-demo:hover,
.button-demo:focus-visible,
.desktop-nav > a.button-demo:hover,
.desktop-nav > a.button-demo:focus-visible,
.mobile-menu nav > a.button-demo:hover {
    color: #fff;
    background: linear-gradient(135deg, #08767c, #054b57);
    text-decoration: none;
    box-shadow:
        inset 0 1px 0 #ffffff40,
        0 9px 23px #022f4238;
    transform: translateY(-2px);
}
.button-demo:active {
    transform: translateY(0);
}
.button-arrow {
    display: inline-grid;
    place-items: center;
    width: 25px;
    height: 25px;
    margin: -3px -4px -3px 0;
    border-radius: 50%;
    background: #ffffff1c;
    font-size: 17px;
    transition:
        transform 0.2s ease,
        background 0.2s ease;
}
.button-demo:hover .button-arrow {
    transform: translate(1px, -1px);
    background: #ffffff2c;
}
.product-introduction .split-section {
    grid-template-columns: 0.8fr 1.2fr;
    gap: 64px;
}
.product-introduction .product-content {
    grid-template-columns: 1fr;
}
.product-introduction .product-note {
    display: none;
}
.product-introduction h2 {
    font-size: 36px;
}
.workflow li {
    padding-left: 32px;
}
.principle-list article {
    gap: 0;
}
.audience-art > strong {
    margin-top: auto;
}
@keyframes hero-arrive {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@media (prefers-reduced-motion: no-preference) {
    .hero-copy > * {
        animation: hero-arrive 0.55s cubic-bezier(0.2, 0.65, 0.3, 1) both;
    }
    .hero-copy > h1 {
        animation-delay: 0.06s;
    }
    .hero-copy > .lead {
        animation-delay: 0.12s;
    }
    .hero-copy > .actions,
    .hero-copy > .hero-detail {
        animation-delay: 0.18s;
    }
}
@media (min-width: 1120px) and (max-width: 1279px) {
    .desktop-nav {
        gap: 17px;
    }
    .desktop-nav .button-demo {
        gap: 12px;
        padding-inline: 12px;
    }
    .header-row {
        gap: 20px;
    }
}
@media (max-width: 899px) {
    .marketing-hero {
        height: auto;
        min-height: 560px;
        padding: 56px 0;
    }
    .marketing-hero .hero-copy {
        width: 75%;
        max-width: 610px;
    }
    .marketing-hero h1 {
        font-size: 48px;
    }
    .photo-hero {
        background-image:
            linear-gradient(
                90deg,
                rgba(5, 28, 39, 0.94),
                rgba(5, 28, 39, 0.78) 55%,
                rgba(5, 28, 39, 0.36)
            ),
            var(--hero-image);
    }
    .product-introduction .split-section {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}
@media (max-width: 599px) {
    .hero-home {
        --hero-image: url("/images/marketing/home-hero-bg-mobile.webp");
    }
    .marketing-hero {
        min-height: 560px;
        height: auto;
        padding: 44px 0;
    }
    .marketing-hero .hero-copy {
        width: 100%;
    }
    .marketing-hero h1 {
        font-size: 39px;
        line-height: 1.12;
    }
    .marketing-hero .lead {
        font-size: 17px;
        margin-top: 22px;
    }
    .hero-badge {
        font-size: 11px;
        padding: 8px 13px;
        margin-bottom: 22px;
    }
    .marketing-hero .actions {
        gap: 12px;
    }
    .marketing-hero .actions > .text-link {
        font-size: 14px;
    }
    .photo-hero {
        background-image:
            linear-gradient(90deg, rgba(5, 28, 39, 0.9), rgba(5, 28, 39, 0.8)),
            var(--hero-image);
    }
    .product-introduction h2 {
        font-size: 31px;
    }
    .brand-hero::after {
        right: -330px;
    }
}

.audience-photo {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 18px;
    box-shadow: 0 16px 40px rgba(9, 41, 54, 0.12);
}

/* Organization navigation and audience pages share the public brand system. */
.audience-icon {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    display: block;
}
.audience-nav {
    position: relative;
}
.audience-nav > summary {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 44px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
    white-space: nowrap;
}
.audience-nav > summary::-webkit-details-marker {
    display: none;
}
.audience-nav > summary > svg {
    width: 16px;
    height: 16px;
    transition: transform 0.18s ease;
}
.audience-nav[open] > summary > svg {
    transform: rotate(180deg);
}
.audience-nav > summary:hover,
.audience-nav-current {
    color: var(--teal-dark);
}
.audience-nav-panel {
    position: absolute;
    z-index: 40;
    left: -16px;
    top: calc(100% + 8px);
    width: 330px;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 40px #102e4020;
}
.audience-nav-panel a {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    padding: 12px;
    border-radius: 8px;
    color: var(--navy);
    font-size: 14px;
    line-height: 1.45;
    text-decoration: none;
}
.audience-nav-panel a:hover,
.audience-nav-panel a[aria-current] {
    color: var(--teal-dark);
    background: #eaf6f3;
}
.audience-nav-panel .audience-icon {
    width: 28px;
    height: 28px;
    flex-basis: 28px;
    color: #087f82;
}
.audience-strip.audience-selector {
    padding: 12px 0;
    background: linear-gradient(110deg, #102e40, #125366 55%, #076e70);
}
.audience-strip.audience-selector .wrap {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    align-items: center;
    gap: 24px;
}
.audience-selector #audience-selector-title {
    font-size: 16px;
    line-height: 1.5;
    font-weight: 600;
    color: #fff;
}
.audience-strip.audience-selector .audience-options {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.audience-selector .audience-options a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    min-height: 76px;
    border: 1px solid #ffffff40;
    border-radius: 10px;
    background: #ffffff0d;
    text-decoration: none;
    transition:
        background 0.18s ease,
        border-color 0.18s ease,
        transform 0.18s ease;
}
.audience-selector .audience-options a:hover {
    background: #ffffff1f;
    border-color: #84e5d7;
    transform: translateY(-2px);
}
.audience-selector .audience-options span {
    display: block;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
}
.audience-selector .audience-icon {
    color: #84e5d7;
}
.audience-section-title {
    max-width: 760px;
    margin-bottom: 36px;
}
.audience-section-title h2 {
    margin-bottom: 16px;
}
.audience-section-title p {
    margin-bottom: 0;
}
.audience-feature-grid,
.audience-preview-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}
.audience-feature-grid article {
    padding: 28px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
}
.audience-feature-grid h3,
.audience-preview h3 {
    font-size: 22px;
    line-height: 1.3;
}
.audience-feature-grid p {
    margin: 16px 0 0;
}
.audience-more {
    margin-top: 28px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.audience-preview {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 32px #102e4009;
    scroll-margin-top: 110px;
}
.audience-preview > img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: contain;
    background: #102e40;
}
.audience-preview-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 28px;
}
.audience-preview-title {
    display: flex;
    align-items: center;
    gap: 12px;
}
.audience-preview-title h3 {
    margin: 0;
}
.audience-preview-title .audience-icon {
    color: #087f82;
}
.audience-preview p {
    margin: 20px 0;
}
.audience-preview .text-link {
    margin-top: auto;
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 12px;
    line-height: 1.5;
}
.audience-preview .text-link > span {
    flex-shrink: 0;
}
.audience-shared-note {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: start;
}
.audience-roadmap {
    background: #102e40;
    color: #dfebee;
}
.audience-roadmap h2,
.audience-roadmap h3 {
    color: #fff;
}
.audience-roadmap p,
.audience-roadmap li {
    color: #dfebee;
}
.audience-availability {
    display: inline-flex;
    align-items: center;
    border: 1px solid #7fd6cd66;
    border-radius: 99px;
    padding: 8px 14px;
    margin-bottom: 20px;
    color: #a1f0e4;
    background: #ffffff08;
    font-size: 13px;
    font-weight: 600;
}
.audience-roadmap .audience-feature-grid article {
    background: #ffffff07;
    border-color: #ffffff26;
}
.audience-roadmap ul {
    padding-left: 20px;
    margin: 20px 0 0;
}
.audience-roadmap li {
    padding-left: 4px;
    margin: 12px 0;
    font-size: 16px;
    line-height: 1.65;
}
.audience-roadmap li::marker {
    color: #81e4d7;
}
.audience-boundary {
    max-width: 960px;
    font-size: 14px;
    line-height: 1.75;
    margin: 32px 0 0;
}
.audience-demo {
    text-align: center;
}
.audience-demo .wrap {
    max-width: 850px;
}
.audience-demo p {
    max-width: 650px;
    margin: 20px auto 28px;
}
.audience-demo .audience-more {
    display: flex;
    width: fit-content;
    margin: 20px auto 0;
}
@media (max-width: 1119px) {
    .mobile-menu .audience-nav {
        grid-column: 1 / -1;
    }
    .mobile-menu .audience-nav > summary {
        justify-content: space-between;
        min-height: 48px;
        padding: 12px 16px;
        border: 0;
        border-radius: 6px;
        background: transparent;
        font-size: 16px;
    }
    .mobile-menu .audience-nav[open] > summary {
        background: #eaf6f3;
        color: var(--teal-dark);
    }
    .mobile-menu .audience-nav-panel {
        position: static;
        width: 100%;
        padding: 8px;
        margin-top: 4px;
        border: 0;
        box-shadow: none;
        background: #f4f8f9;
    }
    .audience-strip.audience-selector .wrap {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .audience-selector #audience-selector-title {
        text-align: center;
    }
    .audience-selector .audience-options a {
        min-height: 72px;
    }
    .audience-feature-grid,
    .audience-preview-grid {
        gap: 16px;
    }
    .audience-preview-content,
    .audience-feature-grid article {
        padding: 24px;
    }
}
@media (max-width: 899px) {
    .audience-feature-grid,
    .audience-preview-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .audience-preview {
        display: grid;
        grid-template-columns: 38% minmax(0, 1fr);
    }
    .audience-preview > img {
        height: 100%;
        aspect-ratio: auto;
    }
    .audience-shared-note {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}
@media (max-width: 599px) {
    .audience-strip.audience-selector .audience-options {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .audience-selector .audience-options a {
        flex-direction: column;
        justify-content: center;
        gap: 8px;
        min-height: 60px;
        padding: 16px;
        text-align: center;
    }
    .audience-selector #audience-selector-title {
        text-align: center;
    }
    .audience-preview {
        display: flex;
    }
    .audience-preview > img {
        height: auto;
        aspect-ratio: 3 / 2;
    }
    .audience-section-title {
        margin-bottom: 28px;
    }
    .audience-demo .button {
        white-space: normal;
    }
}

/* The illustration separates organization identity from the resident profile. */
.product-organization {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    min-width: 0;
}
.product-organization > span {
    line-height: 1.4;
}
.product-top .organization-avatar {
    display: block;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 50%;
    object-fit: cover;
    object-position: 85% center;
    border: 1px solid #87bdbd;
}
.resident-portrait {
    display: block;
    width: 72px;
    height: 72px;
    flex: 0 0 72px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #dce6ea;
}
@media (max-width: 599px) {
    .product-top {
        gap: 10px;
    }
    .product-organization {
        gap: 8px;
    }
    .product-organization > span {
        font-size: 10px;
        max-width: 90px;
    }
    .resident-portrait {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }
}

.marketing-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    vertical-align: -0.2em;
}
.button-arrow .marketing-icon {
    width: 16px;
    height: 16px;
}

/* Public contact form */
.contact-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: 64px;
    align-items: start;
}
.contact-intro h2 {
    max-width: 440px;
}
.contact-promise {
    border-left: 4px solid #087f82;
    background: linear-gradient(120deg, #e5f6f4, #f5fafb);
    padding: 24px;
    margin: 32px 0;
    border-radius: 0 16px 16px 0;
}
.contact-response {
    display: inline-flex;
    color: #07585c;
    font-size: 14px;
    font-weight: 700;
}
.public-contact-form {
    min-width: 0;
    padding: 32px;
    border: 1px solid #cbdde4;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 16px 48px #102e400a;
}
.public-contact-form h2 {
    font-size: 28px;
    margin: 0 0 8px;
}
.public-contact-form fieldset {
    border: 0;
    padding: 0;
    margin: 0;
    min-width: 0;
}
.contact-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 20px;
}
.contact-fields label {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-weight: 600;
    font-size: 14px;
    color: #173749;
    min-width: 0;
}
.contact-fields input,
.contact-fields select,
.contact-fields textarea {
    width: 100%;
    min-height: 48px;
    border: 1px solid #8da8b6;
    border-radius: 8px;
    padding: 12px;
    background: #fff;
    color: #173749;
    font: inherit;
    font-weight: 400;
}
.contact-fields input:focus,
.contact-fields select:focus,
.contact-fields textarea:focus {
    outline: 3px solid #a9e7df;
    outline-offset: 2px;
    border-color: #087f82;
}
.contact-fields [aria-invalid="true"] {
    border-color: #b52d3e;
}
.contact-fields textarea {
    resize: vertical;
}
.contact-field-wide {
    grid-column: 1/-1;
}
.contact-form-status {
    color: #173749;
    font-weight: 600;
    margin: 16px 0;
}
.contact-form-status:empty {
    display: none;
}
.contact-trap {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
}
.contact-submit {
    margin-top: 8px;
}
.public-contact-form button:disabled {
    opacity: 0.65;
    cursor: wait;
}
.contact-fields .caption {
    font-weight: 400;
}
.contact-thank-you {
    min-height: 65vh;
    display: flex;
    align-items: center;
}
.contact-thank-you .wrap {
    max-width: 920px;
}
.contact-thank-you h1 {
    margin-top: 24px;
}
.contact-thank-you .actions {
    margin-top: 32px;
}
@media (max-width: 1000px) {
    .contact-form-grid {
        gap: 32px;
        grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
    }
    .contact-fields {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 700px) {
    .contact-form-grid {
        grid-template-columns: 1fr;
    }
    .public-contact-form {
        padding: 24px;
        border-radius: 16px;
    }
    .contact-promise {
        margin: 24px 0;
    }
    .contact-submit {
        width: 100%;
        justify-content: space-between;
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Home: a compact view of the connected parts of residential care. */
.moving-parts-heading {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
    align-items: center;
    gap: 48px;
}
.moving-parts {
    width: 100%;
    max-width: 440px;
    justify-self: start;
}
.moving-parts svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}
.moving-parts-lines {
    stroke: #c8deda;
}
.moving-parts-signals {
    stroke: #0ba7a5;
    stroke-dasharray: 9 110;
    stroke-dashoffset: 10;
    opacity: 0;
}
.moving-parts-nodes circle {
    fill: #eef8f5;
    stroke: #c5e3db;
    stroke-width: 1;
}
.moving-parts-icons {
    color: #087f82;
}
.moving-parts-labels {
    font-size: 16px;
    font-weight: 600;
    fill: var(--ink);
}
.moving-parts-hub {
    fill: var(--navy);
}
.moving-parts-brand {
    font-size: 17px;
    font-weight: 700;
    fill: white;
    letter-spacing: -0.5px;
}
.moving-parts-brand tspan {
    fill: #39d4cb;
}
.moving-parts-center {
    transform-box: fill-box;
    transform-origin: center;
}
@media (prefers-reduced-motion: no-preference) {
    .moving-parts.is-visible .moving-parts-signals {
        animation: moving-parts-connect 4.8s linear infinite;
    }
    .product-introduction .product-window {
        animation: resident-profile-float 7s ease-in-out infinite;
    }
    .moving-parts.is-visible .moving-parts-center {
        animation: moving-parts-arrival 4.8s linear infinite;
    }
}
@keyframes moving-parts-arrival {
    0%,
    76%,
    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 0 transparent);
    }
    88% {
        transform: scale(1.035);
        filter: drop-shadow(0 0 7px #19c7bfa6);
    }
    94% {
        transform: scale(1.015);
        filter: drop-shadow(0 0 4px #19c7bf66);
    }
}
@keyframes resident-profile-float {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-8px);
    }
}
@keyframes moving-parts-connect {
    from {
        stroke-dashoffset: 10;
        opacity: 1;
    }
    to {
        stroke-dashoffset: -109;
        opacity: 1;
    }
}
@media (max-width: 899px) {
    .moving-parts-heading {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .moving-parts {
        justify-self: center;
        max-width: 400px;
    }
}

/* Home capability cards: teal through navy, with consistently readable copy. */
.feature-columns.home-feature-cards {
    gap: 24px;
}
.home-feature-cards article {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 32px;
    border: 0;
    border-radius: 20px;
    background: #066a70;
    color: #fff;
    box-shadow: 0 12px 28px rgb(16 46 64 / 8%);
}
.home-feature-cards article:nth-child(2) {
    background: #164c61;
}
.home-feature-cards article:nth-child(3) {
    background: #102e40;
}
.home-feature-cards .feature-number {
    color: #c6f4eb;
    margin-bottom: 20px;
}
.home-feature-cards h3 {
    color: #fff;
    font-size: 26px;
    line-height: 1.25;
    margin-bottom: 16px;
}
.home-feature-cards p {
    color: #e7f2f2;
    font-size: 16px;
    line-height: 1.65;
    margin-bottom: 24px;
}
.home-feature-cards .text-link {
    margin-top: auto;
    min-height: 44px;
    color: #fff;
    font-size: 15px;
    align-items: center;
}
.home-feature-cards .text-link:hover {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 5px;
}
.home-feature-cards .text-link:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 5px;
    border-radius: 4px;
}
@media (max-width: 899px) {
    .feature-columns.home-feature-cards {
        grid-template-columns: 1fr;
    }
    .home-feature-cards article {
        padding: 28px;
    }
}

/* Home FAQs: equal column and item gaps also preserve the mobile seam. */
.home-faq-heading {
    max-width: 740px;
    margin: 0 auto 48px;
    text-align: center;
}
.home-faq-heading p {
    max-width: 620px;
    margin: 20px auto 0;
}
.home-faq-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 24px;
    align-items: start;
}
.home-faq-column {
    display: grid;
    gap: 12px;
    min-width: 0;
}
.home-faq .faq details {
    border: 0;
    border-radius: 6px;
    background: var(--navy);
    color: #fff;
}
.home-faq .faq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 24px;
    min-height: 68px;
    color: #fff;
    font-size: 16px;
    line-height: 1.5;
    border-radius: 6px;
}
.home-faq .faq summary::after,
.home-faq .faq details[open] summary::after {
    content: none;
}
.home-faq .faq summary:hover {
    background: rgb(255 255 255 / 5%);
}
.home-faq .faq summary:focus-visible {
    outline: 3px solid #087f82;
    outline-offset: 3px;
}
.home-faq .faq details p {
    padding: 0 24px 24px;
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: #e7f2f2;
}
.home-faq .faq-toggle {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    color: #81e4d7;
}
.home-faq details[open] .faq-toggle-vertical {
    display: none;
}
@media (max-width: 899px) {
    .home-faq-columns {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .home-faq-heading {
        margin-bottom: 32px;
    }
}
@media (max-width: 599px) {
    .home-faq .faq summary {
        padding: 20px;
        gap: 16px;
    }
    .home-faq .faq details p {
        padding: 0 20px 20px;
    }
}

/* Google permits hiding the badge when the visible disclosure accompanies the form. */
body:has([data-recaptcha-site-key]) .grecaptcha-badge {
    visibility: hidden;
}
.public-contact-form .recaptcha-notice {
    margin-top: 16px;
    font-size: 12px;
    line-height: 1.6;
}

.site-header.is-scrolled-away {
    transform: translateY(-100%);
}
@media (prefers-reduced-motion: no-preference) {
    .site-header {
        transition: transform 0.22s ease;
    }
}

/* Home section introductions are centered on phones; working content keeps its alignment. */
@media (max-width: 599px) {
    body:has(.hero-home) .hero-copy > :is(h1, .lead),
    body:has(.hero-home)
        .split-section
        > div:first-child
        > :is(.eyebrow, h2, p),
    body:has(.hero-home)
        .moving-parts-heading
        > div:last-child
        > :is(.eyebrow, h2, p),
    body:has(.hero-home) .closing-row > div > :is(.eyebrow, h2, p),
    body:has(.hero-home) #audience-selector-title {
        text-align: center;
    }
    body:has(.hero-home) .hero-copy .actions {
        justify-content: center;
        margin-top: 32px;
    }
    body:has(.hero-home) .split-section {
        row-gap: 32px;
    }
    body:has(.hero-home) .split-section > div:first-child > p + .text-link {
        display: flex;
        width: fit-content;
        margin: 32px auto 0;
    }
    body:has(.hero-home) .workflow {
        margin-top: 32px;
    }
    body:has(.hero-home) .moving-parts-heading {
        margin-bottom: 32px;
    }
    body:has(.hero-home) .home-feature-cards {
        margin-top: 0;
    }
    body:has(.hero-home) .closing-row {
        align-items: center;
        gap: 32px;
    }
    body:has(.hero-home) .audience-selector .wrap {
        gap: 16px;
    }
}

/* Homepage property preview: scoped away from app/auth and other marketing heroes. */
.property-hero.marketing-hero {
    height: auto;
    min-height: 660px;
    padding: 64px 0 80px;
    background:
        radial-gradient(ellipse at 100% 0%, #2a8e9e66, transparent 65%),
        linear-gradient(145deg, #071e29 0%, #023347 55%, #174957 100%);
}
.property-hero::before,
.property-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 620px;
    aspect-ratio: 1;
    border-radius: 50%;
    border: 1px solid #ffffff12;
    box-shadow:
        0 0 0 64px #ffffff03,
        0 0 0 128px #ffffff03;
    pointer-events: none;
}
.property-hero::before {
    top: -340px;
    right: -100px;
}
.property-hero::after {
    bottom: -540px;
    left: -220px;
    width: 800px;
}
.property-hero .property-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 5vw, 80px);
    align-items: center;
}
.property-hero.marketing-hero .hero-copy {
    width: 100%;
    max-width: 590px;
}
.property-hero.marketing-hero h1 {
    font-size: clamp(38px, 4vw, 60px);
}
.property-hero .actions {
    gap: 20px;
    flex-wrap: wrap;
}
.hero-property {
    min-width: 0;
    width: 100%;
    max-width: 580px;
    margin: 0;
    position: relative;
    color: #143544;
    background: #fff;
    border: 1px solid #d7e7eb;
    border-radius: 6px;
    box-shadow:
        0 28px 65px #00151f66,
        0 0 0 8px #ffffff06;
}
.hp-appbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 20px;
    border-radius: 5px 5px 0 0;
    background: #023347;
    color: #dbecef;
    font-size: 11px;
}
.hp-appbar img {
    width: 116px;
    height: auto;
}
.hp-content {
    padding: 24px;
}
.hp-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.hp-eyebrow {
    font-size: 10px;
    letter-spacing: 0.1em;
    color: #4b6876;
    font-weight: 650;
}
.hero-property h2 {
    color: #143544;
    font-size: 24px;
    letter-spacing: -0.025em;
    line-height: 1.2;
    margin: 6px 0;
}
.hero-property .hp-title p {
    color: #526b76;
    font-size: 12px;
    margin: 0;
}
.hp-ready {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    padding: 5px 8px;
    color: #16624e;
    background: #e9f5ef;
    border-radius: 6px;
    font-size: 11px;
    white-space: nowrap;
}
.hp-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin: 22px 0;
}
.hp-stats > div {
    display: flex;
    flex-direction: column;
    padding: 12px 16px;
    background: #f0f5f6;
    border-radius: 6px;
}
.hp-stats strong {
    font-size: 26px;
    line-height: 1.2;
    font-weight: 650;
}
.hp-stats span {
    font-size: 11px;
    margin-top: 3px;
    color: #48616d;
}
.hp-stats .hp-open {
    background: #e4f3f1;
    color: #16624e;
}
.hp-stats .hp-open span {
    color: #16624e;
}
.hp-resident-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 8px;
    border-bottom: 1px solid #e1eaed;
}
.hp-resident-heading h3 {
    font-size: 14px;
    margin: 0;
    color: #143544;
}
.hp-resident-heading > span {
    color: #526b76;
    font-size: 11px;
}
.hp-resident {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #e8eef0;
}
.hp-resident img {
    width: 42px;
    height: 42px;
    object-fit: cover;
    border-radius: 50%;
    flex-shrink: 0;
}
.hp-resident > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}
.hp-resident strong {
    font-size: 13px;
    font-weight: 650;
}
.hp-resident div span {
    font-size: 11px;
    color: #526b76;
}
.hp-resident b,
.hp-footer b {
    padding: 0 4px;
    font-weight: 400;
}
.hp-active {
    margin-left: auto;
    color: #19634f;
    font-size: 10px;
    background: #eaf5ef;
    border-radius: 6px;
    padding: 3px 7px;
}
.hp-footer {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    font-size: 10px;
    color: #526b76;
    padding-top: 12px;
}
.hero-property figcaption {
    position: absolute;
    top: calc(100% + 14px);
    width: 100%;
    text-align: center;
    color: #c5dce2;
    font-size: 10px;
    line-height: 1.4;
}
@media (max-width: 899px) {
    .property-hero .property-hero-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .property-hero.marketing-hero {
        padding: 48px 0 72px;
    }
    .hero-property {
        max-width: 580px;
        justify-self: center;
    }
    .property-hero.marketing-hero .hero-copy {
        max-width: 650px;
    }
}
@media (max-width: 599px) {
    .property-hero.marketing-hero h1 {
        font-size: 38px;
    }
    .hp-content {
        padding: 16px;
    }
    .hero-property h2 {
        font-size: 21px;
    }
    .hp-stats > div {
        padding: 10px;
    }
    .hp-appbar {
        padding: 12px 16px;
    }
    .hp-footer {
        flex-wrap: wrap;
    }
    .property-hero .actions {
        gap: 12px;
    }
}

/* Alternative homepage map illustration; app-style callouts, no map provider requests. */
.hm-toolbar {
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #dce6e9;
}
.hm-toolbar > div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.hm-toolbar strong {
    font-size: 16px;
}
.hm-toolbar div span {
    font-size: 11px;
    color: #526b76;
}
.hm-toolbar b {
    padding: 0 3px;
    font-weight: 400;
}
.hm-map-label {
    color: #146170;
    background: #e8f3f4;
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 10px;
    white-space: nowrap;
}
.hm-canvas {
    position: relative;
    height: 370px;
    overflow: hidden;
    background: #eeeae2;
}
.hm-streets {
    position: absolute;
    width: 100%;
    height: 100%;
    inset: 0;
}
.hm-marker {
    position: absolute;
    width: 44%;
    max-width: 190px;
    padding: 9px 10px;
    background: white;
    color: #143544;
    border: 1px solid #bacdd3;
    border-radius: 6px;
    box-shadow: 0 3px 8px #193e452e;
}
.hm-marker::after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    bottom: -6px;
    left: calc(50% - 5px);
    background: white;
    border-right: 1px solid #bacdd3;
    border-bottom: 1px solid #bacdd3;
    transform: rotate(45deg);
}
.hm-marker > div {
    display: flex;
    gap: 5px;
    align-items: center;
}
.hm-marker svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: #247a88;
}
.hm-marker strong {
    font-size: 12px;
    line-height: 1.5;
    white-space: nowrap;
}
.hm-marker > span {
    display: block;
    font-size: 11px;
    margin-top: 2px;
    color: #526b76;
}
.hm-marker b {
    color: #143544;
    font-weight: 650;
}
.hm-marker-1 {
    left: 5%;
    top: 7%;
}
.hm-marker-2 {
    right: 4%;
    top: 24%;
}
.hm-marker-3 {
    left: 5%;
    top: 41%;
}
.hm-marker-4 {
    right: 4%;
    top: 60%;
}
.hm-marker-5 {
    left: 5%;
    top: 78%;
}
.hm-north {
    position: absolute;
    right: 14px;
    top: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #526b76;
    background: #ffffffdd;
    padding: 3px 7px;
    border-radius: 6px;
    line-height: 1;
    font-size: 22px;
}
.hm-north small {
    font-size: 8px;
    margin-top: 3px;
}
.hm-summary {
    padding: 14px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
}
.hm-summary > span {
    margin-left: auto;
    color: #16624e;
}
.hm-portraits {
    display: flex;
    padding-right: 4px;
}
.hm-portraits img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid white;
    margin-right: -6px;
}
@media (max-width: 599px) {
    .hm-toolbar {
        padding: 14px 12px;
    }
    .hm-toolbar strong {
        font-size: 15px;
    }
    .hm-toolbar div span {
        font-size: 10px;
    }
    .hm-map-label {
        display: none;
    }
    .hm-canvas {
        height: 370px;
    }
    .hm-marker {
        padding: 7px 6px;
    }
    .hm-marker strong {
        font-size: 10px;
    }
    .hm-marker > span {
        font-size: 9px;
    }
    .hm-marker svg {
        width: 13px;
        height: 13px;
    }
    .hm-marker > div {
        gap: 3px;
    }
    .hm-marker-1,
    .hm-marker-3,
    .hm-marker-5 {
        left: 3%;
    }
    .hm-marker-2,
    .hm-marker-4 {
        right: 3%;
    }
    .hm-summary {
        padding: 12px;
        gap: 8px;
        font-size: 11px;
        flex-wrap: wrap;
    }
    .hm-portraits img {
        width: 26px;
        height: 26px;
    }
}

/* Product preview floats beside the hero copy in a complete browser frame. */
.browser-hero.marketing-hero {
    min-height: 560px;
    padding: 64px 0;
}
.browser-hero .property-hero-grid {
    display: block;
}
.browser-hero.marketing-hero .hero-copy {
    width: 43%;
    max-width: 580px;
    z-index: 1;
}
.hero-browser {
    position: absolute;
    left: 49%;
    bottom: -30px;
    width: min(1100px, 64vw);
    margin: 0;
    overflow: hidden;
    border: 1px solid #b7cbd5;
    border-radius: 12px;
    box-shadow:
        0 24px 54px #00131d55,
        0 8px 18px #00131d26;
    background: #f4f9fa;
}
.hero-browser-bar {
    height: 36px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 14px;
    background: #e9f0f3;
    border-bottom: 1px solid #d0dce1;
    color: #526874;
}
.browser-dots {
    display: flex;
    gap: 5px;
    width: 50px;
}
.browser-dots i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #b6c8cf;
}
.browser-dots i:first-child {
    background: #db9891;
}
.browser-dots i:nth-child(2) {
    background: #dcc386;
}
.browser-dots i:last-child {
    background: #8dbbad;
}
.browser-address {
    text-align: center;
    border-radius: 6px;
    background: #ffffffb8;
    font-size: 10px;
    line-height: 22px;
    width: 50%;
    margin: auto;
}
.browser-bar-spacer {
    width: 50px;
}
.hero-browser-screen {
    display: block;
    width: 100%;
    height: auto;
}
@media (min-width: 1600px) {
    .browser-hero.marketing-hero {
        min-height: 600px;
    }
}
@media (max-width: 899px) {
    .browser-hero.marketing-hero {
        padding: 48px 0;
        min-height: 0;
    }
    .browser-hero.marketing-hero .hero-copy {
        width: 100%;
        max-width: 650px;
    }
    .hero-browser {
        position: relative;
        width: 100%;
        max-width: none;
        left: 0;
        bottom: auto;
        margin-top: 38px;
    }
}
@media (max-width: 599px) {
    .browser-hero.marketing-hero {
        padding-top: 40px;
    }
    .hero-browser {
        width: 100%;
        margin-top: 32px;
        bottom: auto;
    }
    .hero-browser-bar {
        height: 28px;
        padding: 0 10px;
        gap: 8px;
    }
    .browser-address {
        font-size: 8px;
        line-height: 18px;
    }
    .browser-dots,
    .browser-bar-spacer {
        width: 30px;
    }
    .browser-dots {
        gap: 4px;
    }
    .browser-dots i {
        width: 5px;
        height: 5px;
    }
}
.hero-screen-wrap {
    position: relative;
    container-type: inline-size;
}
.hero-screen-user {
    position: absolute;
    z-index: 1;
    right: 1.8%;
    top: 1.2%;
    display: flex;
    align-items: center;
    gap: 0.55cqw;
    color: white;
    font-size: 0.73cqw;
    line-height: 1;
}
.hero-screen-user > span {
    display: grid;
    place-items: center;
    width: 1.8cqw;
    height: 1.8cqw;
    border-radius: 50%;
    background: #247d8c;
    border: 1px solid #87b3bc;
    font-size: 0.65cqw;
}
.hero-screen-user strong {
    font-weight: 600;
}
.hero-screen-user b {
    font-size: 1cqw;
    font-weight: 400;
}
@media (min-width: 900px) {
    .hero-browser {
        left: auto;
        right: max(48px, calc((100% - 1320px) / 2));
        width: min(680px, 46vw);
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
    }
    .browser-hero.marketing-hero .hero-copy {
        width: 46%;
    }
}
.hero-map-credit {
    position: absolute;
    bottom: 8px;
    right: 8px;
    padding: 2px 5px;
    background: #ffffffed;
    color: #46616d;
    border-radius: 3px;
    font-size: 8px;
    line-height: 1.4;
}
.hero-map-credit a {
    color: inherit;
}
@media (max-width: 899px) {
    .hero-map-credit {
        bottom: 8px;
        font-size: 7px;
    }
}
@media (max-width: 599px) {
    .hero-map-credit {
        bottom: 6px;
        font-size: 6px;
    }
}

@keyframes hero-browser-float {
    0%, 100% { translate: 0 0; }
    50% { translate: 0 -6px; }
}
@media (prefers-reduced-motion: no-preference) {
    .hero-browser { animation: hero-browser-float 7s ease-in-out infinite; }
}

/* Public feature catalog: visible lists, shared across all audience pages. */
.feature-jumps { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:24px 0 32px; padding:16px; background:#edf4f6; border:1px solid #d4e2e7; border-radius:6px; }
.feature-jumps > span { font-size:12px; font-weight:700; text-transform:uppercase; color:#48626d; margin-right:8px; }
.feature-jumps a { display:flex; align-items:center; min-height:44px; padding:8px 12px; background:#fff; color:#063747; border-radius:6px; font-size:14px; font-weight:600; text-decoration:none; }
.feature-jumps a:hover,.feature-jumps a:focus-visible { background:#063747; color:#fff; }
.feature-category { scroll-margin-top:112px; margin:0 0 32px; border:1px solid #d4e2e7; border-radius:6px; overflow:hidden; background:#fff; }
.feature-category-heading { display:flex; align-items:center; gap:12px; padding:18px 24px; background:#063747; color:#fff; }
.feature-category-heading h3 { color:inherit; margin:0; font-size:21px; }
.feature-category-icon { display:flex; color:#80c6ce; }
.feature-list-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0 28px; padding:8px 24px; }
.feature-list-item { display:flex; gap:12px; min-width:0; padding:22px 0; border-bottom:1px solid #e3ecef; }
.feature-list-item h4 { font-size:16px; line-height:1.4; margin:0 0 6px; color:#063747; }
.feature-list-item p { font-size:14px; line-height:1.6; margin:0; color:#49616b; }
.feature-check { color:#197887; font-size:18px; font-weight:700; line-height:1.4; flex-shrink:0; }
.feature-status { display:inline-block; background:#fff0d2; color:#714400; padding:3px 7px; border-radius:6px; font-size:11px; font-weight:700; margin:0 0 6px; }
.feature-footnote { font-size:13px; color:#49616b; margin:20px 0; max-width:900px; }
.specialty-feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.specialty-feature-grid > article { border:1px solid #d4e2e7; border-top:3px solid #258b99; border-radius:6px; background:#fff; padding:24px; min-width:0; }
.specialty-feature-grid h3 { font-size:21px; margin:0 0 12px; }
.specialty-feature-grid p,.specialty-feature-grid li { font-size:14px; }
.specialty-feature-grid .audience-icon { width:32px; height:32px; color:#197887; margin-bottom:16px; }
.home-feature-links { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.home-feature-links a { display:flex; flex-direction:column; gap:10px; background:#fff; padding:24px; border:1px solid #d4e2e7; border-radius:6px; text-decoration:none; color:#063747; }
.home-feature-links a:hover { border-color:#258b99; box-shadow:0 8px 24px #06374712; }
.home-feature-links strong { font-size:19px; }
.home-feature-links span { font-size:14px; line-height:1.6; color:#49616b; }
@media(max-width:1100px) { .feature-list-grid,.home-feature-links { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:899px) { .specialty-feature-grid { grid-template-columns:1fr; } }
@media(max-width:599px) { .feature-list-grid,.home-feature-links { grid-template-columns:1fr; } .feature-category-heading { padding:16px; } .feature-category-heading h3 { font-size:19px; } .feature-list-grid { padding:0 16px; } .feature-jumps { gap:6px; padding:12px; } .feature-jumps a { flex:1 1 45%; font-size:13px; } .feature-jumps > span { flex-basis:100%; } }

.core-only-price { display:flex; flex-direction:column; gap:5px; border-top:1px solid #d4e2e7; padding-top:20px; margin-top:24px; font-size:14px; color:#063747; }
.core-only-price span { font-size:12px; color:#49616b; }
.pricing-section .price-card { border-radius:6px; display:flex; flex-direction:column; }
.pricing-section .price-card .check-list { flex:1; }

/* Public product hierarchy and feature comparison. */
.package-path { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.package-path > a { display:block; padding:28px; border:1px solid #ccdfe3; border-top:4px solid #298f9d; border-radius:6px; background:#fff; color:#063747; text-decoration:none; }
.package-path > a:hover { background:#f0f8f8; border-color:#298f9d; }
.package-step { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:6px; background:#063747; color:white; font-weight:700; margin-bottom:16px; }
.package-path h3 { font-size:26px; margin-bottom:12px; }
.package-path strong { font-size:14px; }
.package-path p { margin:12px 0 20px; font-size:15px; }
.package-explanation { margin-top:28px; padding:22px 24px; background:#edf5f6; border-left:4px solid #298f9d; border-radius:6px; line-height:1.7; }
.core-feature-table { width:100%; border-collapse:separate; border-spacing:0; background:white; border:1px solid #ccdfe3; border-radius:6px; overflow:hidden; }
.core-feature-table thead { background:#063747; color:white; }
.core-feature-table th,.core-feature-table td { padding:24px; text-align:left; vertical-align:top; }
.core-feature-table thead th { padding:18px 24px; }
.core-feature-table tbody th { width:20%; font-size:18px; color:#063747; background:#f5f9fa; }
.core-feature-table tbody tr + tr > * { border-top:1px solid #d6e3e6; }
.core-table-features { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 24px; }
.core-table-features .feature-list-item { padding:0; border:0; }
.core-table-features p { font-size:14px; }
.core-included { white-space:nowrap; color:#146b5d; font-weight:700; font-size:14px; }
#core-features,#program-modules,#specialties,.core-feature-table tr { scroll-margin-top:110px; }
@media(max-width:900px) { .package-path { gap:14px; } .package-path > a { padding:20px; } .package-path h3 { font-size:22px; } .core-feature-table th,.core-feature-table td { padding:18px; } }
@media(max-width:640px) { .package-path { grid-template-columns:1fr; } .core-feature-table,.core-feature-table tbody,.core-feature-table tr,.core-feature-table th,.core-feature-table td { display:block; width:100%; } .core-feature-table thead { display:none; } .core-feature-table tbody th { width:100%; background:#063747; color:white; } .core-table-features { grid-template-columns:1fr; } .core-feature-table .core-included { padding-top:0; } .package-explanation { padding:18px; } }

/* Larger step labels on the product overview only. */
#core-features > .wrap > .audience-section-title > .eyebrow,
#program-modules > .wrap > .audience-section-title > .eyebrow,
.platform-addons .audience-section-title > .eyebrow { font-size:clamp(18px, 1.5vw, 22px); line-height:1.4; letter-spacing:.035em; margin-bottom:14px; }

/* Homepage preview follows the live Residents card, without shared app overrides. */
.marketing-resident-preview {
    width: min(100%, 384px);
    margin: 0 auto;
}
.marketing-resident-card {
    overflow: hidden;
    border: 1px solid #d3e2e6;
    border-radius: 6px;
    background: #fff;
    color: #123340;
    box-shadow: 0 16px 40px -20px rgb(2 51 71 / 25%);
}
.marketing-resident-identity {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: #eef4f4;
}
.marketing-resident-identity img {
    width: 72px;
    height: 72px;
    flex: 0 0 72px;
    object-fit: cover;
    border: 1px solid #8aa8b3;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgb(23 44 66 / 14%);
}
.marketing-resident-identity h3 {
    margin: 0;
    font-size: 18px;
    line-height: 1.4;
    font-weight: 600;
    overflow-wrap: anywhere;
}
.marketing-resident-details {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 16px;
    font-size: 14px;
    line-height: 1.4;
}
.marketing-resident-details dt { margin-bottom: 4px; color: #496674; }
.marketing-resident-details dd { margin: 0; }
.marketing-resident-property { display: flex; align-items: center; gap: 2px; color: #167685; }
.marketing-resident-property svg { width: 18px; height: 18px; flex-shrink: 0; }
.marketing-resident-property strong { font-weight: 600; }
.marketing-resident-bed { display: flex; align-items: center; gap: 8px; }
.marketing-resident-bed svg { width: 12px; height: 12px; color: #496674; }
.marketing-resident-preview figcaption { margin-top: 12px; text-align: center; font-size: 12px; line-height: 1.5; color: #496674; }