@font-face {
    font-family:Literata;
    src:url('fonts/Literata.woff2') format('woff2');
    font-weight:200 900;
    font-style:normal;
    font-display:swap
}
@font-face {
    font-family:Literata;
    src:url('fonts/Literata-Italic.woff2') format('woff2');
    font-weight:200 900;
    font-style:italic;
    font-display:swap
}
:root {
    color-scheme:light dark;
    --reading:Literata,Georgia,serif;
    --interface:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    --page-width:1240px;
    --gutter:clamp(24px,5vw,80px)
}
* {
    box-sizing:border-box
}
html {
    scroll-padding-top:32px
}
body {
    margin:0;
    background:var(--pageBackground);
    color:var(--primaryText);
    font-family:var(--interface);
    font-size:1rem;
    line-height:1.65;
    -webkit-font-smoothing:antialiased
}
a {
    color:inherit;
    text-underline-offset:5px
}
button {
    font:inherit
}
a,button,summary {
    -webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible,summary:focus-visible {
    outline:3px solid var(--accent);
    outline-offset:6px
}
img {
    display:block;
    max-width:100%;
    height:auto
}
h1,h2,h3,p,figure {
    margin:0
}
h1,h2,h3 {
    font-family:var(--reading);
    font-weight:400
}
h1,h2 {
    letter-spacing:-.055em;
    line-height:1.17
}
h2 {
    font-size:clamp(2.375rem,4.4vw,3.875rem)
}
h3 {
    letter-spacing:-.025em;
    font-size:1.625rem;
    line-height:1.4
}
em {
    font-weight:400;
    color:var(--accent)
}
p {
    color:var(--secondaryText)
}
.wrap {
    width:min(var(--page-width),calc(100% - var(--gutter)*2));
    margin-inline:auto
}
.eyebrow {
    display:flex;
    align-items:center;
    gap:15px;
    color:var(--accent);
    font-size:0.6875rem;
    line-height:1.5;
    font-weight:650;
    letter-spacing:.15em;
    text-transform:uppercase
}
.eyebrow>span:not(.small-rule) {
    color:var(--secondaryText)
}
.skip-link {
    position:fixed;
    top:12px;
    left:12px;
    z-index:10;
    padding:12px 20px;
    background:var(--primaryText);
    color:var(--pageBackground);
    transform:translateY(-160%)
}
.skip-link:focus {
    transform:translateY(0)
}
.site-header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:32px;
    border-bottom:1px solid var(--hairline);
    min-height:108px
}
.brand {
    display:inline-flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    font-family:var(--reading);
    color:var(--primaryText);
    font-size:1.9375rem;
    letter-spacing:-.055em;
    line-height:1
}
.brand img {
    border-radius:10px
}
.brand-period {
    color:var(--accent)
}
.site-header nav {
    display:flex;
    align-items:center;
    gap:36px;
    font-size:0.8125rem
}
.site-header nav a {
    display:inline-flex;
    align-items:center;
    gap:12px;
    min-height:44px;
    text-decoration:none
}
.site-header nav a:hover,.site-header nav [aria-current] {
    color:var(--accent)
}
.hero {
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:24px;
    padding-block:70px 64px
}
.hero-copy {
    position:relative;
    z-index:1;
    padding-block:15px
}
.small-rule {
    width:28px;
    height:1px;
    background:var(--accent)
}
.hero h1 {
    font-size:clamp(3.875rem,7.1vw,6.375rem);
    line-height:1.1;
    letter-spacing:-.065em;
    margin-block:26px
}
.hero h1 em {
    display:block;
    margin-top:4px
}
.hero-description {
    max-width:355px;
    font-size:1.0625rem;
    line-height:1.8
}
.hero-actions {
    display:flex;
    align-items:center;
    gap:22px;
    flex-wrap:wrap;
    margin-top:32px
}
.button {
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:38px;
    border:1px solid var(--accent);
    border-radius:4px;
    background:var(--accent);
    color:var(--onAccent);
    min-height:52px;
    padding:12px 24px;
    text-decoration:none;
    font-size:0.8125rem;
    font-weight:600
}
.button:hover {
    outline:1px solid var(--accent);
    outline-offset:3px
}
.availability {
    font-size:0.75rem;
    color:var(--secondaryText)
}
.pronunciation {
    display:flex;
    gap:12px;
    align-items:center;
    flex-wrap:wrap;
    font-size:0.6875rem;
    letter-spacing:.035em;
    margin-top:45px
}
.pronunciation>span:first-child {
    font-family:var(--reading);
    font-style:italic;
    font-size:0.875rem;
    color:var(--primaryText)
}
.hero-preview {
    padding-top:20px
}
.preview-pair {
    height:620px;
    max-width:550px;
    position:relative;
    margin-left:auto
}
.phone {
    display:block;
    overflow:hidden;
    border:6px solid var(--primaryText);
    outline:1px solid var(--swatchEdge);
    background:var(--surface);
    border-radius:40px;
    position:relative;
    width:258px;
    isolation:isolate
}
.phone img {
    width:100%;
    height:auto;
    transform:scale(1.008)
}
.phone:hover {
    outline:2px solid var(--accent);
    outline-offset:4px
}
.phone-back {
    position:absolute;
    right:0;
    top:0;
    width:245px;
    transform:rotate(8deg)
}
.phone-front {
    position:absolute;
    left:4%;
    top:63px;
    transform:rotate(-5deg)
}
.hero-preview figcaption {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    font-size:0.625rem;
    margin-top:12px;
    color:var(--secondaryText);
    letter-spacing:.025em
}
.caption-rule {
    width:20px;
    height:1px;
    background:var(--accent)
}
.principles-strip {
    border-block:1px solid var(--hairline)
}
.principles-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding-block:25px
}
.principles-inner>p {
    font-family:var(--reading);
    font-size:1.0625rem;
    line-height:1.5
}
.principles-inner strong {
    font-weight:400;
    color:var(--primaryText)
}
.principles-inner ul {
    display:flex;
    gap:clamp(24px,5vw,76px);
    list-style:none;
    padding:0;
    margin:0;
    color:var(--secondaryText);
    font-size:0.75rem
}
.principles-inner li {
    display:flex;
    align-items:center;
    gap:10px
}
.principles-inner li::before {
    content:'✓';
    color:var(--accent);
    font-size:0.875rem
}
.section-space {
    padding-block:100px
}
.section-heading {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px 60px;
    align-items:end
}
.section-heading .eyebrow {
    grid-column:1/-1
}
.section-heading>p:last-child {
    max-width:425px;
    padding-bottom:5px;
    line-height:1.9
}
.calendar-layout {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
    margin-top:58px
}
.calendar-preview {
    padding:44px 24px 25px;
    background:var(--wash);
    border-top:3px double var(--accent)
}
.phone-calendar {
    width:260px;
    margin-inline:auto;
    border-radius:36px
}
.calendar-preview figcaption {
    text-align:center;
    font-size:0.6875rem;
    color:var(--secondaryText);
    margin-top:24px
}
.calendar-copy>.eyebrow {
    margin-bottom:34px
}
.calendar-feature {
    display:flex;
    gap:22px;
    padding-block:28px;
    border-top:1px solid var(--hairline)
}
.feature-index {
    font-family:var(--reading);
    color:var(--accent);
    font-size:1.25rem;
    min-width:28px
}
.calendar-feature p {
    font-size:0.875rem;
    line-height:1.9;
    margin-block:14px 16px
}
.status-label {
    font-size:0.625rem;
    letter-spacing:.09em;
    text-transform:uppercase;
    color:var(--accent);
    display:inline-flex;
    gap:7px;
    align-items:center
}
.status-label::before {
    content:'✓';
    font-size:0.75rem
}
.calendar-note {
    font-size:0.75rem;
    line-height:1.9;
    margin:8px 0 22px;
    padding-left:50px
}
.text-link {
    display:inline-flex;
    align-items:center;
    gap:18px;
    min-height:44px;
    font-size:0.8125rem;
    color:var(--accent);
    text-decoration:none
}
.text-link:hover {
    text-decoration:underline
}
.promise-section {
    background:var(--wash);
    padding-block:86px
}
.promise-layout {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px
}
.promise-layout h2 {
    margin-top:25px
}
.promise-copy {
    padding-top:45px;
    max-width:440px
}
.large-copy {
    font-family:var(--reading);
    font-size:1.6875rem;
    line-height:1.6;
    color:var(--primaryText);
    letter-spacing:-.025em
}
.promise-copy>p:not(.large-copy) {
    font-size:0.875rem;
    line-height:1.9;
    margin-top:24px
}
.promise-copy .text-link {
    margin-top:18px
}
.development-heading {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:end
}
.development-heading h2 {
    margin-top:25px
}
.development-heading>p {
    max-width:410px;
    line-height:1.9;
    padding-bottom:6px
}
.roadmap {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    list-style:none;
    gap:40px;
    margin:60px 0 0;
    padding:0
}
.roadmap li {
    border-top:1px solid var(--accent);
    padding-top:20px
}
.roadmap-state {
    font-size:0.625rem;
    letter-spacing:.15em;
    text-transform:uppercase;
    color:var(--accent)
}
.roadmap h3 {
    margin-block:18px 14px
}
.roadmap p {
    font-size:0.8125rem;
    line-height:1.9;
    max-width:330px
}
.release-note {
    margin-top:35px;
    font-size:0.6875rem;
    letter-spacing:.025em
}
.questions-section {
    border-top:1px solid var(--hairline);
    display:grid;
    grid-template-columns:1fr 1.3fr;
    gap:65px;
    padding-block:76px
}
.questions-section h2 {
    font-size:2.5rem;
    margin-top:20px
}
.questions-list details {
    border-bottom:1px solid var(--hairline)
}
.questions-list summary {
    min-height:74px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:22px;
    font-size:0.875rem;
    cursor:pointer;
    list-style:none
}
.questions-list summary::-webkit-details-marker {
    display:none
}
.questions-list summary>span {
    font-size:1.5rem;
    font-weight:300;
    color:var(--accent)
}
.questions-list details[open] summary>span {
    transform:rotate(45deg)
}
.questions-list details p {
    font-size:0.8125rem;
    line-height:1.9;
    padding:0 30px 25px 0
}
.closing-section {
    text-align:center;
    border-top:1px solid var(--hairline);
    padding-block:80px 90px
}
.double-rule {
    width:52px;
    height:5px;
    border-block:1px solid var(--accent);
    margin:0 auto 24px
}
.closing-section .eyebrow {
    justify-content:center
}
.closing-section h2 {
    font-size:clamp(2.125rem,4vw,3rem);
    margin-block:20px
}
.closing-section p:not(.eyebrow) {
    font-size:0.875rem;
    line-height:1.9
}
.closing-section .text-link {
    margin-top:16px
}
.site-footer {
    border-top:1px solid var(--hairline);
    padding-block:28px 32px
}
.footer-top,.footer-bottom {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:24px
}
.footer-top>.brand {
    font-size:1.6875rem
}
.footer-top>p {
    font-family:var(--reading);
    font-style:italic;
    font-size:0.875rem
}
.footer-bottom {
    margin-top:24px
}
.footer-bottom p,.footer-bottom nav {
    font-size:0.625rem
}
.footer-bottom nav {
    display:flex;
    flex-wrap:wrap;
    gap:24px
}
.footer-bottom a {
    min-height:44px;
    display:inline-flex;
    align-items:center;
    text-decoration:none;
    color:var(--secondaryText)
}
.footer-bottom a:hover {
    color:var(--accent)
}
.independent {
    font-size:0.625rem;
    max-width:710px;
    margin-top:15px;
    line-height:1.8
}
.document {
    max-width:760px;
    padding-block:55px 100px;
    min-height:65vh
}
.document>.eyebrow {
    margin-top:50px
}
.document h1 {
    font-size:clamp(2.75rem,6vw,4.5rem);
    margin-block:22px 28px
}
.document-lead {
    font-family:var(--reading);
    font-size:1.4375rem;
    line-height:1.7;
    color:var(--primaryText)
}
.document h2 {
    font-size:1.6875rem;
    letter-spacing:-.025em;
    margin-block:40px 14px
}
.document p:not(.eyebrow):not(.document-lead) {
    line-height:1.9;
    margin-top:14px
}
.document p a {
    color:var(--accent)
}
.contact-address {
    display:inline-flex;
    align-items:center;
    gap:20px;
    min-height:44px;
    color:var(--accent);
    font-size:clamp(1.0625rem,4vw,1.5625rem);
    margin-top:28px;
    text-decoration:none
}
.screenshot-dialog {
    background:var(--pageBackground);
    color:var(--primaryText);
    border:1px solid var(--hairline);
    border-radius:12px;
    padding:0;
    max-width:calc(100vw - 32px);
    max-height:calc(100dvh - 32px);
    width:470px;
    overscroll-behavior:contain
}
.screenshot-dialog::backdrop {
    background:rgb(0 0 0 / .8)
}
.dialog-toolbar {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    position:sticky;
    top:0;
    background:var(--pageBackground);
    padding:10px 16px;
    border-bottom:1px solid var(--hairline)
}
.dialog-toolbar p {
    font-size:0.75rem;
    line-height:1.5
}
.dialog-close {
    background:transparent;
    border:1px solid var(--hairline);
    border-radius:4px;
    min-height:44px;
    padding:8px 12px;
    white-space:nowrap;
    color:var(--accent);
    font-size:0.75rem;
    cursor:pointer
}
.dialog-close span {
    margin-left:10px;
    font-size:1.25rem
}
.dialog-image {
    width:100%;
    height:auto
}
.screenshot-dialog:modal {
    display:block
}
@media(min-width:1500px) {
    .hero {
        padding-block:86px
    }
    .preview-pair {
        height:660px
    }
    .phone-back {
        width:265px
    }
    .phone-front {
        width:280px
    }
}
@media(max-width:1100px) {
    .preview-pair {
        height:550px
    }
    .phone-front {
        width:225px;
        left:0;
        top:85px
    }
    .phone-back {
        width:210px;
        right:1%
    }
    .hero-preview figcaption {
        flex-wrap:wrap;
        gap:7px
    }
    .hero {
        padding-block:55px
    }
    .hero h1 {
        font-size:clamp(3.875rem,7.5vw,5.125rem)
    }
    .hero-actions {
        gap:16px
    }
    .calendar-layout {
        gap:40px
    }
    .section-heading,.development-heading,.promise-layout {
        gap:40px
    }
    .calendar-feature h3 {
        font-size:1.4375rem
    }
    .calendar-feature {
        gap:15px
    }
    .calendar-note {
        padding-left:0
    }
}
@media(max-width:760px) {
    :root {
        --gutter:24px
    }
    .site-header {
        min-height:90px;
        gap:16px
    }
    .brand {
        font-size:1.6875rem;
        gap:6px
    }
    .brand img {
        width:38px;
        height:38px
    }
    .site-header nav {
        gap:20px;
        font-size:0.6875rem
    }
    .site-header nav a:last-child {
        display:none
    }
    .hero {
        grid-template-columns:1fr;
        padding-block:46px 40px;
        gap:30px
    }
    .hero-copy {
        padding:0
    }
    .hero h1 {
        font-size:clamp(4.125rem,12vw,5.5rem);
        margin-block:24px;
        line-height:1.07
    }
    .hero-description {
        max-width:370px;
        font-size:1rem
    }
    .hero-actions {
        margin-top:26px;
        gap:20px
    }
    .pronunciation {
        margin-top:28px
    }
    .hero-preview {
        padding:0;
        max-width:500px;
        width:100%;
        margin-inline:auto
    }
    .preview-pair {
        height:580px;
        max-width:430px;
        margin-inline:auto
    }
    .phone-front {
        left:6%;
        width:235px;
        top:65px
    }
    .phone-back {
        right:4%;
        width:220px;
        top:8px
    }
    .hero-preview figcaption {
        margin-top:6px
    }
    .principles-inner {
        padding-block:25px;
        align-items:start
    }
    .principles-inner>p {
        font-size:0.9375rem
    }
    .principles-inner ul {
        display:grid;
        gap:8px;
        font-size:0.6875rem
    }
    .section-space {
        padding-block:65px
    }
    .section-heading,.calendar-layout,.promise-layout,.development-heading,.questions-section {
        grid-template-columns:1fr;
        gap:25px
    }
    .section-heading .eyebrow {
        grid-column:auto
    }
    .section-heading>p:last-child {
        max-width:500px;
        font-size:0.875rem
    }
    .calendar-layout {
        margin-top:32px;
        gap:40px
    }
    .calendar-preview {
        padding-top:35px
    }
    .phone-calendar {
        width:240px
    }
    .calendar-copy>.eyebrow {
        margin-bottom:22px
    }
    .calendar-feature {
        padding-block:23px;
        gap:18px
    }
    .calendar-feature h3 {
        font-size:1.5rem
    }
    .calendar-note {
        font-size:0.75rem;
        margin-top:10px
    }
    .promise-section {
        padding-block:58px
    }
    .promise-copy {
        padding:0;
        max-width:none
    }
    .large-copy {
        font-size:1.5625rem
    }
    .development-heading>p {
        font-size:0.875rem;
        max-width:500px
    }
    .roadmap {
        grid-template-columns:1fr;
        gap:32px;
        margin-top:35px
    }
    .roadmap li {
        display:grid;
        grid-template-columns:100px 1fr;
        gap:8px 20px;
        padding-top:20px
    }
    .roadmap-state {
        padding-top:9px
    }
    .roadmap h3 {
        margin:0;
        font-size:1.5625rem
    }
    .roadmap p {
        grid-column:2;
        max-width:none
    }
    .release-note {
        font-size:0.625rem;
        line-height:1.8
    }
    .questions-section {
        padding-block:55px;
        gap:28px
    }
    .questions-section h2 {
        font-size:2.25rem;
        margin-top:14px
    }
    .questions-list summary {
        min-height:72px;
        font-size:0.8125rem
    }
    .closing-section {
        padding-block:60px
    }
    .footer-top {
        align-items:start
    }
    .footer-top>p {
        font-size:0.75rem;
        max-width:150px;
        text-align:right
    }
    .footer-bottom {
        display:block;
        margin-top:20px
    }
    .footer-bottom nav {
        gap:20px;
        margin-top:8px
    }
    .independent {
        margin-top:5px
    }
    .document {
        padding-block:30px 65px
    }
    .document>.eyebrow {
        margin-top:35px
    }
    .document-lead {
        font-size:1.3125rem
    }
}
@media(max-width:380px) {
    .site-header nav {
        gap:13px
    }
    .preview-pair {
        height:515px
    }
    .phone-front {
        width:207px;
        left:1%
    }
    .phone-back {
        width:195px;
        right:1%
    }
    .hero h1 {
        font-size:3.875rem
    }
    .caption-note {
        display:none
    }
    .availability {
        font-size:0.6875rem
    }
    .hero-actions {
        gap:12px
    }
    .roadmap li {
        grid-template-columns:80px 1fr;
        gap:10px
    }
}
@media(prefers-reduced-motion:no-preference) {
    html {
        scroll-behavior:smooth
    }
}
@media print {
    .site-header nav,.hero-actions,.screenshot-dialog,.site-footer nav {
        display:none
    }
    .wrap {
        width:100%
    }
    body {
        font-size:11pt;
        background:white;
        color:black
    }
    .hero {
        display:block
    }
    .hero-preview {
        max-width:300px;
        margin:30px auto
    }
    .preview-pair {
        height:470px
    }
    .phone-front {
        width:190px
    }
    .phone-back {
        width:175px
    }
    .section-space,.promise-section {
        padding-block:30px
    }
    .calendar-layout,.promise-layout,.development-heading,.section-heading {
        display:block
    }
    .calendar-preview {
        max-width:320px;
        margin:24px auto
    }
    .phone-calendar {
        width:190px
    }
    .questions-list details>p {
        display:block
    }
    .questions-section {
        display:block
    }
    a {
        color:inherit
    }
    .document {
        max-width:none;
        padding:20px
    }
    h1,h2,h3 {
        break-after:avoid
    }
    .roadmap li,figure {
        break-inside:avoid
    }
}
/* Text-only enlargement reflows navigation and long headings. */
h1,h2,h3 {
    overflow-wrap:anywhere
}
.site-header,.site-header nav,.footer-top,.footer-bottom,.dialog-toolbar {
    flex-wrap:wrap
}
.site-header {
    padding-block:14px
}
.dialog-toolbar p {
    flex:1;
    min-width:100px
}