/* Cohort Field hero and the live, HTML-rendered MomMirror app preview. */
.clinical-home .clinical-hero {
    background:
        radial-gradient(circle at 78% 43%, rgba(63, 201, 152, .075), transparent 32%),
        linear-gradient(145deg, #fffdfb 0%, #fff 54%, #fbfdfc 100%);
    min-height: 810px;
    overflow-x: clip;
}

.clinical-home .clinical-hero .hero-content {
    grid-template-columns: minmax(0, 1.03fr) minmax(430px, .97fr);
    gap: 34px;
    min-height: 720px;
}

.clinical-home .hero-cohort-visual {
    isolation: isolate;
    display: grid;
    place-items: center;
    width: calc(100% + 118px);
    min-height: 650px;
    margin-left: -45px;
    position: relative;
    overflow: visible;
    perspective: 1200px;
}

.hero-cohort-grid,
.hero-cohort-curve,
.hero-cohort-canvas,
.hero-cohort-fallback {
    pointer-events: none;
    position: absolute;
}

.hero-cohort-grid {
    z-index: -3;
    inset: 2% -8% 0 -9%;
    background-image:
        linear-gradient(rgba(78, 101, 109, .055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(78, 101, 109, .055) 1px, transparent 1px);
    background-size: 112px 112px, 112px 112px;
    -webkit-mask-image: radial-gradient(ellipse 82% 74% at 56% 54%, #000 35%, transparent 82%);
    mask-image: radial-gradient(ellipse 82% 74% at 56% 54%, #000 35%, transparent 82%);
}

.hero-cohort-curve {
    z-index: -1;
    inset: 4% -8% 0 -10%;
    width: 118%;
    height: 91%;
    overflow: visible;
    opacity: .58;
}

.hero-cohort-curve .cohort-confidence-band {
    fill: none;
    stroke: rgba(63, 201, 152, .06);
    stroke-width: 18;
}

.hero-cohort-curve .cohort-bell-line {
    fill: none;
    stroke: rgba(41, 184, 142, .62);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 1 12;
    animation: cohort-curve-flow 11s linear infinite;
}

.hero-cohort-curve .cohort-baseline {
    display: none;
}

.hero-cohort-canvas,
.hero-cohort-fallback {
    z-index: -2;
    inset: -1% -18% -8% -18%;
    width: 136%;
    height: 109%;
    -webkit-mask-image: radial-gradient(ellipse 91% 82% at 53% 52%, #000 52%, transparent 91%);
    mask-image: radial-gradient(ellipse 91% 82% at 53% 52%, #000 52%, transparent 91%);
}

.hero-cohort-canvas {
    opacity: 0;
    transition: opacity .8s ease;
}

.hero-cohort-canvas.is-ready {
    opacity: 1;
}

.hero-cohort-fallback {
    opacity: .58;
    background:
        radial-gradient(circle at 15% 64%, rgba(255, 137, 125, .19) 0 2px, transparent 3px),
        radial-gradient(circle at 78% 66%, rgba(63, 201, 152, .22) 0 2px, transparent 3px),
        radial-gradient(circle at 52% 52%, rgba(63, 201, 152, .12) 0 2px, transparent 3px);
    background-size: 31px 31px, 25px 25px, 19px 19px;
    -webkit-mask-image: radial-gradient(ellipse 84% 38% at 53% 56%, #000 8%, rgba(0, 0, 0, .7) 48%, transparent 100%);
    mask-image: radial-gradient(ellipse 84% 38% at 53% 56%, #000 8%, rgba(0, 0, 0, .7) 48%, transparent 100%);
}

.hero-cohort-canvas.is-ready + .hero-cohort-fallback {
    opacity: 0;
}

.hero-cohort-visual::after {
    content: "";
    z-index: 1;
    width: 270px;
    height: 42px;
    border-radius: 50%;
    background: rgba(50, 70, 74, .14);
    filter: blur(19px);
    position: absolute;
    bottom: 22px;
    left: 50%;
    transform: translateX(-44%);
}

/* Device shell */
.hero-live-phone {
    --phone-mint: #3fc998;
    --phone-mint-dark: #20b28c;
    --phone-copy: #4a8878;
    --phone-coral: #ff897d;
    z-index: 3;
    box-sizing: border-box;
    width: 292px;
    aspect-ratio: 1024 / 2016;
    container-type: inline-size;
    padding: 5px;
    border: 3px solid #070707;
    border-radius: 43px;
    background:
        linear-gradient(90deg, #473d3b 0%, #d8c5bc 2%, #544947 4%, #151313 7%, #050505 12% 88%, #171414 93%, #b6a69e 97%, #433a38 100%);
    box-shadow:
        0 35px 62px rgba(33, 51, 52, .2),
        0 12px 23px rgba(93, 71, 68, .17),
        inset 0 0 0 1px rgba(255, 255, 255, .16);
    position: relative;
    transform: translateX(14px) rotateY(-1.2deg);
    animation:
        cohort-phone-float 8s ease-in-out infinite,
        cohort-phone-heartbeat 4.6s ease-in-out infinite;
    will-change: transform, scale;
}

.hero-live-phone::before {
    content: "";
    z-index: 5;
    pointer-events: none;
    border-radius: inherit;
    border: 1px solid rgba(237, 220, 211, .62);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
    position: absolute;
    inset: -2px;
}

.hero-live-phone__screen {
    color: #17171a;
    width: 100%;
    height: 100%;
    border-radius: 10.7cqw;
    background: #fefaf7;
    display: grid;
    grid-template-rows: 10.2cqw 16cqw minmax(0, 1fr) 21.2cqw;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 0 .35cqw rgba(0, 0, 0, .1);
}

.hero-live-phone__screen::after {
    content: "";
    z-index: 20;
    pointer-events: none;
    border-radius: inherit;
    box-shadow: inset 0 0 1.4cqw rgba(37, 27, 27, .13);
    position: absolute;
    inset: 0;
}

.hero-live-phone__button {
    z-index: -1;
    width: 1.7cqw;
    border-radius: 1cqw 0 0 1cqw;
    background: linear-gradient(90deg, #72635e, #c8b8b0 42%, #493f3c);
    position: absolute;
    left: -2.45cqw;
}

.hero-live-phone__button--mute { top: 17cqw; height: 7cqw; }
.hero-live-phone__button--volume-up { top: 27cqw; height: 12.3cqw; }
.hero-live-phone__button--volume-down { top: 42cqw; height: 12.3cqw; }

.hero-live-phone__button--power {
    width: 1.7cqw;
    height: 22cqw;
    top: 34cqw;
    right: -2.45cqw;
    left: auto;
    border-radius: 0 1cqw 1cqw 0;
    background: linear-gradient(90deg, #493f3c, #c8b8b0 58%, #72635e);
}

/* iOS-style status bar */
.phone-status-bar {
    z-index: 2;
    font-family: "Nunito", sans-serif;
    font-size: 3.75cqw;
    font-weight: 850;
    display: grid;
    grid-template-columns: 1fr 25cqw 1fr;
    align-items: center;
    padding: .5cqw 5.4cqw 0;
    position: relative;
}

.phone-status-bar__time,
.phone-status-bar__network,
.phone-status-bar__network > span,
.phone-signal {
    display: flex;
    align-items: center;
}

.phone-status-bar__time { gap: 1cqw; }
.phone-status-bar__time svg { width: 4cqw; height: 4cqw; fill: #090909; }

.phone-status-bar__island {
    justify-self: center;
    width: 25cqw;
    height: 7.6cqw;
    border-radius: 999px;
    background: #000;
    position: relative;
}

.phone-status-bar__island i {
    opacity: .28;
    width: 1.25cqw;
    height: 1.25cqw;
    border-radius: 50%;
    background: #354246;
    position: absolute;
    top: 1.6cqw;
    right: 4.6cqw;
    box-shadow: 0 0 1cqw rgba(78, 130, 150, .4);
}

.phone-status-bar__network {
    justify-content: flex-end;
    gap: 1.25cqw;
    font-size: 3.55cqw;
}

.phone-status-bar__network b { font-weight: 800; }
.phone-signal { align-items: flex-end !important; gap: .65cqw; height: 3.8cqw; }
.phone-signal i { width: 1.1cqw; border-radius: .35cqw; background: #151515; display: block; }
.phone-signal i:first-child { height: 1.6cqw; }
.phone-signal i:nth-child(2) { height: 2.35cqw; }
.phone-signal i:nth-child(3) { height: 3.1cqw; opacity: .65; }
.phone-signal i:nth-child(4) { height: 3.8cqw; opacity: .3; }

.phone-battery {
    box-sizing: border-box;
    width: 8.7cqw;
    height: 4.2cqw;
    padding: .65cqw;
    border: .55cqw solid rgba(20, 20, 20, .32);
    border-radius: 1.1cqw;
    position: relative;
}

.phone-battery::after {
    content: "";
    width: .65cqw;
    height: 1.8cqw;
    border-radius: 0 .45cqw .45cqw 0;
    background: rgba(20, 20, 20, .28);
    position: absolute;
    top: .65cqw;
    right: -1.25cqw;
}

.phone-battery i { width: 74%; height: 100%; border-radius: .35cqw; background: #aaa; }

.phone-battery em {
    color: #fff;
    font-size: 2.15cqw;
    font-style: normal;
    font-weight: 900;
    line-height: 1;
    position: absolute;
    top: .45cqw;
    left: 1.15cqw;
}

/* App header */
.phone-app-bar {
    z-index: 1;
    background: rgba(255, 255, 255, .93);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1cqw 5.4cqw 0;
    box-shadow: 0 .5cqw 1.9cqw rgba(103, 80, 78, .045);
}

.hero-cohort-visual .phone-app-bar > img {
    width: 35.5cqw;
    max-width: none;
    height: auto;
    filter: none;
    transform: none;
}

.phone-app-bar__actions,
.phone-flower-count {
    display: flex;
    align-items: center;
}

.phone-app-bar__actions { gap: 5cqw; }
.phone-flower-count { gap: 1.3cqw; }
.phone-flower-count svg { width: 6.1cqw; height: 6.1cqw; fill: none; stroke: var(--phone-coral); stroke-width: 1.8; }
.phone-flower-count b { font: 750 4.25cqw/1 "Nunito", sans-serif; }
.phone-profile { width: 7.1cqw; height: 7.1cqw; fill: var(--phone-mint); }

/* App home content */
.phone-home-screen {
    min-height: 0;
    background:
        radial-gradient(circle at 50% 48%, rgba(255, 255, 255, .96) 0 18%, rgba(255, 255, 255, .52) 43%, transparent 69%),
        linear-gradient(175deg, #f9dad5 0%, #fff8f5 56%, #f8ddd9 100%);
    display: grid;
    grid-template-rows: 19cqw 20cqw 66cqw minmax(28cqw, auto) 15.5cqw;
    align-content: space-evenly;
    justify-items: center;
    position: relative;
    overflow: hidden;
}

.phone-home-screen::before {
    content: "";
    pointer-events: none;
    background: radial-gradient(ellipse at center, rgba(63, 201, 152, .075), transparent 62%);
    position: absolute;
    inset: 19cqw 0 27cqw;
}

.phone-week {
    width: 100%;
    padding: 3.4cqw 3.2cqw 1.6cqw;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .4cqw;
}

.phone-week__day {
    color: #727478;
    font-family: "Nunito", sans-serif;
    font-size: 3.25cqw;
    line-height: 1;
    display: grid;
    grid-template-rows: 10.6cqw 5cqw;
    justify-items: center;
    align-items: center;
    opacity: .68;
}

.phone-week__day i {
    font-style: normal;
    width: 10.2cqw;
    height: 10.2cqw;
    border-radius: 50%;
    background: rgba(255, 255, 255, .82);
    display: grid;
    place-items: center;
    font-family: "Lora", Georgia, serif;
    font-size: 4cqw;
    box-shadow: 0 .6cqw 2cqw rgba(102, 76, 72, .035);
}

.phone-week__day.has-entry {
    opacity: .88;
}

.phone-week__day.has-entry i {
    color: #4c675e;
    background: rgba(92, 214, 172, .38);
    box-shadow: 0 1cqw 3cqw rgba(63, 201, 152, .2);
}

.phone-week__day.is-today {
    color: var(--phone-mint);
    opacity: 1;
    font-weight: 800;
}

.phone-week__day.is-today i {
    color: #fff;
    background: var(--phone-mint);
    font-family: "Nunito", sans-serif;
    font-weight: 850;
    box-shadow: 0 1.5cqw 4.6cqw rgba(44, 194, 143, .45);
}

.phone-greeting {
    color: var(--phone-mint-dark);
    text-align: center;
    align-self: center;
    width: 91%;
    min-height: 18cqw;
    font-family: "Lora", Georgia, serif;
    line-height: 1.2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.phone-greeting span,
.phone-greeting strong {
    min-height: 7.6cqw;
    white-space: nowrap;
    display: block;
}

.phone-greeting span { font-size: 6.2cqw; font-weight: 430; }
.phone-greeting strong { font-size: 6.9cqw; font-weight: 720; }

.phone-greeting.is-typing [data-greeting-line]::after,
.phone-greeting.is-typing-name [data-name-line]::after {
    content: "|";
    display: inline-block;
    width: auto;
    height: auto;
    margin-left: .4cqw;
    background: none;
    vertical-align: .02em;
    animation: phone-caret 1s ease-in-out infinite alternate;
}

/* The mirror is a real WebGL surface with the original glass/star overlays. */
.phone-magic-mirror {
    z-index: 2;
    cursor: pointer;
    width: 66cqw;
    height: 66cqw;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background:
        radial-gradient(circle at 30% 22%, rgba(224, 255, 245, .6), transparent 22%),
        radial-gradient(circle at 67% 68%, rgba(0, 113, 85, .42), transparent 42%),
        conic-gradient(from 24deg, #42d7aa, #139a77, #5ee0b8, #188e70, #42d7aa);
    align-self: center;
    position: relative;
    touch-action: none;
    transform: translateZ(0);
    transition: transform .28s ease;
    filter: drop-shadow(0 2.2cqw 2.7cqw rgba(21, 154, 113, .23));
}

.phone-magic-mirror:hover { transform: scale(1.018); }
.phone-magic-mirror:active { transform: scale(.986); }
.phone-magic-mirror:focus-visible { outline: .7cqw solid rgba(255, 137, 125, .8); outline-offset: 1cqw; }

.phone-magic-mirror canvas {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
    position: absolute;
    inset: 0;
}

.hero-cohort-visual .phone-magic-mirror__glass {
    z-index: 3;
    pointer-events: none;
    opacity: 1;
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: cover;
    filter: none;
    position: absolute;
    inset: 0;
    transform: none;
}

.phone-magic-mirror__star-system {
    z-index: 5;
    pointer-events: none;
    width: 50%;
    height: 50%;
    position: absolute;
    top: 25%;
    left: 25%;
    overflow: visible;
}

.phone-magic-mirror__star-system.is-entering {
    animation: mirror-star-enter 1.2s linear both;
}

.phone-magic-mirror__star-wobble {
    width: 50%;
    height: 50%;
    position: absolute;
    top: 25%;
    left: 25%;
    animation: mirror-star-wobble 2.5s ease-in-out infinite alternate;
}

.phone-magic-mirror__star-glow {
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 229, 160, .62), rgba(255, 229, 160, 0) 70%);
    position: absolute;
    inset: -32%;
    animation: mirror-star-glow 1.8s ease-in-out infinite alternate;
}

.hero-cohort-visual .phone-magic-mirror__star {
    pointer-events: none;
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 1.3cqw 1.5cqw rgba(132, 95, 30, .22));
    position: relative;
    transform: none;
    animation: mirror-star-pulse 1.8s ease-in-out infinite alternate;
}

.phone-magic-mirror__star-particles {
    position: absolute;
    inset: 0;
    overflow: visible;
}

.phone-magic-mirror__star-particles i,
.phone-secret-overlay__particles i {
    width: var(--particle-size, 1.2cqw);
    height: var(--particle-size, 1.2cqw);
    border-radius: 50%;
    background: var(--particle-color, #ffe5a0);
    box-shadow: 0 0 var(--particle-size, 1.2cqw) color-mix(in srgb, var(--particle-color, #ffe5a0) 68%, transparent);
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform-origin: 0 0;
}

.phone-magic-mirror__star-particles i {
    animation: mirror-star-particle var(--particle-duration, 3.4s) linear var(--particle-delay, 0s) infinite;
}

.phone-magic-mirror.is-revealing .phone-magic-mirror__star-system {
    animation: mirror-star-explode .6s ease-out both;
}

.phone-magic-mirror.is-revealing .phone-magic-mirror__star-particles i {
    animation: mirror-star-particle-burst .6s ease-out var(--burst-delay, 0s) both;
}

.phone-magic-mirror__shine {
    z-index: 4;
    pointer-events: none;
    width: 27%;
    height: 18%;
    border-radius: 50%;
    background: rgba(255, 255, 255, .29);
    filter: blur(1.9cqw);
    position: absolute;
    top: 12%;
    left: 16%;
    transform: rotate(-28deg);
}

.phone-reflection-copy {
    z-index: 2;
    color: var(--phone-copy) !important;
    text-align: center !important;
    text-justify: auto !important;
    align-self: center;
    width: 68%;
    margin: 0 !important;
    font-family: "Lora", Georgia, serif !important;
    font-size: calc(4.55cqw * var(--fit-scale, 1)) !important;
    line-height: 1.23 !important;
}

.phone-checkin-button {
    z-index: 2;
    color: #fff;
    cursor: pointer;
    align-self: center;
    width: 72%;
    height: 15.2cqw;
    padding: 0 4cqw;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(180deg, #69dcb7 0%, #3fc998 100%);
    font-family: "Nunito", sans-serif;
    font-size: calc(5.8cqw * var(--fit-scale, 1));
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    position: relative;
    bottom: 10px;
    box-shadow:
        0 2.3cqw 4cqw rgba(58, 117, 99, .25),
        0 0 0 2.6cqw rgba(255, 255, 255, .22),
        inset 0 .5cqw .8cqw rgba(255, 255, 255, .24);
    transition: transform .22s ease, box-shadow .22s ease;
}

.phone-checkin-button:hover { transform: translateY(-.8cqw); box-shadow: 0 2.8cqw 5cqw rgba(58, 117, 99, .29), 0 0 0 2.6cqw rgba(255, 255, 255, .22); }
.phone-checkin-button:active { transform: translateY(0) scale(.985); }
.phone-checkin-button:focus-visible { outline: .7cqw solid rgba(255, 137, 125, .8); outline-offset: 1cqw; }

/* App bottom navigation */
.phone-bottom-bar {
    z-index: 3;
    background: rgba(237, 246, 236, .93);
    border-top: .35cqw solid rgba(62, 159, 128, .34);
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: center;
    padding: 1.6cqw 2cqw 2.2cqw;
    box-shadow: 0 -1.3cqw 3cqw rgba(68, 131, 110, .05);
}

.phone-bottom-bar span {
    color: rgba(49, 147, 120, .5);
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .75cqw;
    font-family: "Nunito", sans-serif;
}

.phone-bottom-bar svg {
    width: 7.1cqw;
    height: 7.1cqw;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.phone-bottom-bar span:first-child svg path { fill: none; }
.phone-bottom-bar b {
    max-width: 100%;
    font-size: 2.85cqw;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.phone-bottom-bar .is-active { color: #2f9278; }
.phone-bottom-bar .is-active b { font-weight: 750; }

/* The in-phone insight reveal follows the app's magical-star overlay. */
.phone-secret-overlay {
    z-index: 30;
    box-sizing: border-box;
    opacity: 0;
    background: rgba(22, 39, 35, .34);
    -webkit-backdrop-filter: blur(1.8cqw) saturate(.9);
    backdrop-filter: blur(1.8cqw) saturate(.9);
    display: grid;
    place-items: center;
    padding: 5cqw;
    position: absolute;
    inset: 0;
    transition: opacity .24s ease;
}

.phone-secret-overlay.is-visible { opacity: 1; }

.phone-secret-card {
    z-index: 2;
    box-sizing: border-box;
    color: #24332f;
    text-align: center;
    width: 86%;
    border: .35cqw solid rgba(255, 255, 255, .8);
    border-radius: 8.2cqw;
    background:
        linear-gradient(120deg, rgba(255, 255, 255, .96), rgba(232, 249, 242, .97) 43%, rgba(255, 255, 255, .96) 72%);
    background-size: 220% 100%;
    padding: 8.5cqw 7cqw 6.5cqw;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    transform: scale(.3);
    box-shadow:
        0 5cqw 12cqw rgba(12, 48, 37, .22),
        0 0 9cqw rgba(63, 201, 152, .27);
}

.phone-secret-overlay.is-visible .phone-secret-card {
    animation:
        phone-secret-enter .5s cubic-bezier(.18, 1.34, .36, 1) forwards,
        phone-secret-shimmer 3s ease-in-out .5s infinite alternate;
}

.phone-secret-card__close {
    color: rgba(38, 67, 59, .55);
    cursor: pointer;
    width: 7.6cqw;
    height: 7.6cqw;
    border: .3cqw solid rgba(58, 115, 96, .18);
    border-radius: 50%;
    background: rgba(255, 255, 255, .72);
    display: grid;
    place-items: center;
    font: 500 5.2cqw/1 "Nunito", sans-serif;
    position: absolute;
    top: 3.2cqw;
    right: 3.2cqw;
}

.phone-secret-card__date {
    color: rgba(41, 70, 62, .54);
    letter-spacing: .18cqw;
    text-transform: uppercase;
    min-height: 4.5cqw;
    font: 650 3.15cqw/1.2 "Lora", Georgia, serif;
}

.hero-cohort-visual .phone-secret-card__star {
    width: 22cqw;
    max-width: none;
    height: 22cqw;
    margin: 4.8cqw 0 3.8cqw;
    filter: drop-shadow(0 1.4cqw 2.2cqw rgba(164, 116, 24, .22));
    transform: none;
    animation: phone-secret-star 2.8s ease-in-out infinite alternate;
}

.phone-secret-card__label {
    color: #258d72 !important;
    text-align: center !important;
    text-justify: auto !important;
    margin: 0 0 4cqw !important;
    font: 760 3.35cqw/1.2 "Nunito", sans-serif !important;
    letter-spacing: .06cqw;
}

.phone-secret-card__loading {
    width: 100%;
    height: 25cqw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2.2cqw;
    transition: opacity .22s ease;
}

.phone-secret-card__loading i {
    width: 84%;
    height: 2.8cqw;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(63, 201, 152, .08), rgba(63, 201, 152, .32), rgba(63, 201, 152, .08));
    background-size: 220% 100%;
    animation: phone-secret-loading 1.5s linear infinite;
}

.phone-secret-card__loading i:nth-child(2) { width: 68%; animation-delay: -.25s; }
.phone-secret-card__loading i:nth-child(3) { width: 48%; animation-delay: -.5s; }

.phone-secret-card blockquote {
    color: rgba(33, 50, 45, .9);
    text-align: center !important;
    text-justify: auto !important;
    width: 100%;
    min-height: 25cqw;
    margin: 0 !important;
    font: 430 4.55cqw/1.52 "Lora", Georgia, serif !important;
    display: none;
}

.phone-secret-card blockquote::before { content: "“"; color: rgba(33, 50, 45, .4); }
.phone-secret-card blockquote::after { content: "”"; color: rgba(33, 50, 45, .4); }

.phone-secret-card__return {
    color: rgba(33, 50, 45, .38);
    cursor: pointer;
    opacity: 0;
    margin-top: 3.5cqw;
    padding: 1cqw 2cqw;
    border: 0;
    background: transparent;
    font: 650 3cqw/1.2 "Nunito", sans-serif;
    transition: opacity .28s ease;
}

.phone-secret-overlay.is-revealed .phone-secret-card__loading { display: none; }

.phone-secret-overlay.is-revealed .phone-secret-card blockquote {
    display: block;
    animation: phone-secret-copy-in .5s ease-out both;
}

.phone-secret-overlay.is-revealed .phone-secret-card__return { opacity: 1; }

.phone-secret-card__close:focus-visible,
.phone-secret-card__return:focus-visible {
    outline: .65cqw solid rgba(255, 137, 125, .82);
    outline-offset: .6cqw;
}

.phone-secret-overlay__particles {
    z-index: 1;
    pointer-events: none;
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.phone-secret-overlay__particles i {
    top: 43%;
    animation: phone-secret-spark var(--particle-duration, 2.8s) ease-out var(--particle-delay, 0s) infinite;
}

.hero-live-phone.has-secret { animation-play-state: paused; }

@keyframes cohort-phone-float {
    0%, 100% { transform: translateX(14px) translateY(0) rotateY(-.7deg); }
    50% { transform: translateX(14px) translateY(-3px) rotateY(.7deg); }
}

@keyframes cohort-phone-heartbeat {
    0%, 42%, 54%, 66%, 100% { scale: 1; }
    47% { scale: 1.014; }
    59% { scale: 1.022; }
}

@keyframes cohort-curve-flow {
    0% { stroke-dashoffset: 0; opacity: .62; }
    50% { opacity: .88; }
    100% { stroke-dashoffset: -78; opacity: .62; }
}

@keyframes mirror-star-enter {
    0% { opacity: 0; transform: translate(-9cqw, 7cqw) scale(.55); }
    14% { opacity: 1; }
    35% { transform: translate(5.4cqw, -4.2cqw) scale(1.05); }
    60% { transform: translate(-3.6cqw, 2.4cqw) scale(.98); }
    80% { transform: translate(1.8cqw, -1.2cqw) scale(1.01); }
    100% { opacity: 1; transform: translate(0, 0) scale(1); }
}

@keyframes mirror-star-wobble {
    0% { transform: rotate(-4.58deg); }
    100% { transform: rotate(4.58deg); }
}

@keyframes mirror-star-pulse {
    0% { transform: scale(.95); }
    100% { transform: scale(1.05); }
}

@keyframes mirror-star-glow {
    0% { opacity: .42; transform: scale(.95); }
    100% { opacity: .7; transform: scale(1.28); }
}

@keyframes mirror-star-particle {
    0% { opacity: 0; transform: rotate(var(--particle-angle)) translateX(1cqw) scale(.45); }
    14% { opacity: var(--particle-opacity, .75); }
    82% { opacity: .28; }
    100% { opacity: 0; transform: rotate(var(--particle-angle)) translateX(var(--particle-distance, 18cqw)) scale(.15); }
}

@keyframes mirror-star-explode {
    0% { opacity: 1; transform: scale(1) rotate(0); }
    100% { opacity: 0; transform: scale(3) rotate(180deg); }
}

@keyframes mirror-star-particle-burst {
    0% { opacity: var(--particle-opacity, .9); transform: rotate(var(--particle-angle)) translateX(2cqw) scale(.9); }
    100% { opacity: 0; transform: rotate(var(--particle-angle)) translateX(var(--particle-burst-distance, 33cqw)) scale(1.4); }
}

@keyframes phone-secret-enter {
    0% { opacity: 0; transform: scale(.3); }
    60% { opacity: 1; }
    100% { opacity: 1; transform: scale(1); }
}

@keyframes phone-secret-shimmer {
    0% { background-position: 0 50%; box-shadow: 0 5cqw 12cqw rgba(12, 48, 37, .2), 0 0 7cqw rgba(63, 201, 152, .2); }
    100% { background-position: 100% 50%; box-shadow: 0 5cqw 12cqw rgba(12, 48, 37, .22), 0 0 12cqw rgba(63, 201, 152, .38); }
}

@keyframes phone-secret-star {
    0% { transform: translateY(0) rotate(-2deg) scale(.97); }
    100% { transform: translateY(-1.2cqw) rotate(2deg) scale(1.04); }
}

@keyframes phone-secret-loading {
    0% { background-position: 100% 0; opacity: .55; }
    50% { opacity: 1; }
    100% { background-position: -100% 0; opacity: .55; }
}

@keyframes phone-secret-copy-in {
    0% { opacity: 0; transform: translateY(2.4cqw); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes phone-secret-spark {
    0% { opacity: 0; transform: rotate(var(--particle-angle)) translateX(5cqw) scale(.4); }
    18% { opacity: var(--particle-opacity, .7); }
    100% { opacity: 0; transform: rotate(var(--particle-angle)) translateX(var(--particle-distance, 42cqw)) scale(.1); }
}

@keyframes phone-caret {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@media (max-width: 1100px) {
    .clinical-home .clinical-hero .hero-content {
        grid-template-columns: minmax(0, 1fr) minmax(390px, .82fr);
        gap: 14px;
    }

    .clinical-home .hero-cohort-visual {
        width: calc(100% + 65px);
        margin-left: -35px;
    }

    .hero-live-phone { width: 278px; }
}

@media (max-width: 960px) {
    .clinical-home .clinical-hero { min-height: auto; }

    .clinical-home .clinical-hero .hero-content {
        grid-template-columns: 1fr;
        gap: 0;
        min-height: auto;
    }

    .clinical-home .hero-cohort-visual {
        width: min(680px, 100%);
        min-height: 625px;
        margin: -10px auto 55px;
    }

    .hero-live-phone { width: 292px; transform: none; }
    .hero-cohort-visual::after { transform: translateX(-50%); }

    @keyframes cohort-phone-float {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-3px); }
    }
}

@media (max-width: 700px) {
    .clinical-home .clinical-hero .hero-content { padding-top: 42px; }
    .clinical-home .clinical-hero .hero-copy { padding-top: 20px; }

    .clinical-home .hero-cohort-visual {
        min-height: 575px;
        margin-top: 2px;
    }

    .hero-live-phone { width: 270px; }
    .hero-cohort-grid { inset-inline: -24%; }
    .hero-cohort-canvas,
    .hero-cohort-fallback { inset-inline: -30%; width: 160%; }
    .hero-cohort-curve { inset-inline: -22%; width: 144%; }
}

@media (max-width: 480px) {
    .clinical-home .clinical-hero .hero-content { padding-top: 36px; }

    .clinical-home .hero-cohort-visual {
        width: calc(100% + 28px);
        min-height: 535px;
        margin: 5px -14px 45px;
    }

    .hero-live-phone { width: min(252px, 76vw); }
    .hero-cohort-visual::after { width: 220px; bottom: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .hero-live-phone,
    .hero-cohort-curve path,
    .phone-magic-mirror__star-system,
    .phone-magic-mirror__star-wobble,
    .phone-magic-mirror__star,
    .phone-magic-mirror__star-glow,
    .phone-magic-mirror__star-particles i,
    .phone-secret-card,
    .phone-secret-card__star,
    .phone-secret-card__loading i,
    .phone-secret-overlay__particles i,
    .phone-greeting.is-typing [data-greeting-line]::after,
    .phone-greeting.is-typing-name [data-name-line]::after {
        animation: none !important;
    }

    .phone-secret-overlay,
    .hero-cohort-canvas { transition: none; }

    .phone-secret-overlay.is-visible .phone-secret-card { transform: scale(1); }
}