:root {
    --background:#fff;
    --foreground:#263238;
    --card:#fff;
    --card-foreground:#263238;
    --popover:#fff;
    --popover-foreground:#263238;
    --primary:#153b63;
    --primary-foreground:#fff;
    --secondary:#f2f5f8;
    --secondary-foreground:#153b63;
    --muted:#f2f5f8;
    --muted-foreground:#586776;
    --accent:#eaf0f5;
    --accent-foreground:#153b63;
    --destructive:#b9343d;
    --border:#d6e0e8;
    --input:#93a6b8;
    --ring:#153b63;
    --radius:.5rem;
    --navy:#153b63;
    --red:#b9343d;
}

* {
    box-sizing:border-box;
}

html {
    scroll-behavior:smooth;
    scroll-padding-top:6.5rem;
}

body {
    margin:0;
    background:#fff;
    color:#263238;
    font-family:Arial,Helvetica,sans-serif;
    font-size:1rem;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
}

a {
    color:inherit;
    text-decoration:none;
}

button,a,label {
    -webkit-tap-highlight-color:transparent;
}

button {
    cursor:pointer;
}

button:disabled {
    cursor:not-allowed;
}

button,a {
    touch-action:manipulation;
}

button:focus-visible,a:focus-visible {
    outline:3px solid #b9343d;
    outline-offset:5px;
}

h1,h2,h3,h4,p {
    margin:0;
}

h1,h2,h3,h4 {
    color:var(--navy);
    line-height:1.15;
}

.container {
    width:min(1200px,calc(100% - 6rem));
    margin-inline:auto;
}

.section {
    padding-block:6.5rem;
}

.eyebrow {
    font-size:.75rem;
    font-weight:700;
    letter-spacing:.15em;
    color:#4c6275;
    display:flex;
    align-items:center;
    gap:.8rem;
    line-height:1.5;
}

.red-line {
    width:1.8rem;
    height:2px;
    background:var(--red);
}

.site-header {
    position:sticky;
    top:0;
    z-index:50;
    background:rgba(255,255,255,.97);
    border-bottom:1px solid #e5ebef;
}

.header-inner {
    min-height:94px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:2rem;
}

.brand {
    display:flex;
    align-items:center;
    gap:.7rem;
    flex-shrink:0;
}

.brand-mark {
    display:flex;
    width:42px;
    height:42px;
    align-items:center;
    justify-content:center;
    color:var(--navy);
}

.brand-mark svg {
    width:36px;
    height:36px;
    stroke-width:1.8;
}

.brand strong {
    display:block;
    font-size:1.52rem;
    letter-spacing:.035em;
    line-height:1.2;
    color:var(--navy);
}

.brand-period {
    color:var(--red);
}

.brand small {
    display:block;
    font-size:.75rem;
    line-height:1.5;
    margin-top:4px;
    color:#4a6073;
}

.nav {
    display:flex;
    align-items:center;
    gap:2rem;
    font-size:.875rem;
    font-weight:600;
}

.nav>a:not(.button):hover,.footer-nav a:hover {
    color:var(--red);
}

.button {
    display:inline-flex;
    justify-content:center;
    align-items:center;
    min-height:50px;
    padding:.8rem 1.4rem;
    border-radius:5px;
    font-size:.875rem;
    line-height:1.4;
    font-weight:600;
    transition:background .18s,transform .18s;
    white-space:normal;
    border:1px solid transparent;
}

.button:hover {
    transform:translateY(-1px);
}

.button-red {
    color:white;
    background:var(--red);
}

.button-red:hover {
    background:#a32933;
}

.button-navy {
    background:var(--navy);
    color:white;
}

.button-navy:hover {
    background:#0e2d4d;
}

.nav-cta {
    min-height:44px;
    padding:.7rem 1rem;
}

.menu-toggle {
    display:none;
}

.hero {
    display:grid;
    grid-template-columns:1.04fr 1fr;
    align-items:center;
    gap:4rem;
    padding-top:4.4rem;
    padding-bottom:5rem;
}

.hero-copy h1 {
    font-size:clamp(3.5rem,5.3vw,4.65rem);
    letter-spacing:-.055em;
    line-height:1.035;
    margin-top:1.4rem;
    font-weight:700;
}

.hero-copy h1 span {
    color:var(--red);
}

.hero-copy>p {
    max-width:420px;
    font-size:1.0625rem;
    line-height:1.8;
    color:#536171;
    margin-top:1.8rem;
}

.hero-actions {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:1.3rem;
    margin-top:1.8rem;
}

.text-link {
    font-size:.875rem;
    font-weight:600;
    padding-block:.6rem;
    border-bottom:1px solid #b8c4cd;
    color:var(--navy);
}

.text-link:hover {
    border-color:var(--red);
    color:var(--red);
}

.hero-proof {
    display:flex;
    flex-wrap:wrap;
    gap:1.25rem;
    margin-top:2.5rem;
    font-size:.8125rem;
    color:#536171;
}

.hero-proof span {
    display:flex;
    align-items:center;
    gap:.4rem;
}

.hero-proof svg {
    width:14px;
    height:14px;
    color:var(--navy);
}

.hero-visual {
    position:relative;
    height:500px;
    margin-top:1rem;
    padding-bottom:1.5rem;
}

.hero-visual>img {
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:48px 8px 48px 8px;
    background:#eaf0f5;
}

.image-caption {
    position:absolute;
    bottom:4rem;
    left:-2rem;
    background:white;
    border:1px solid #e1e8ed;
    box-shadow:0 12px 35px #153b6312;
    display:flex;
    gap:1rem;
    align-items:center;
    padding:1.35rem 1.6rem;
    border-radius:6px;
}

.caption-icon {
    color:var(--red);
    background:#fbf0f1;
    width:44px;
    height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
}

.caption-icon svg {
    width:23px;
}

.image-caption small {
    font-size:.75rem;
    letter-spacing:.12em;
    color:#607080;
    display:block;
    font-weight:700;
    margin-bottom:.4rem;
}

.image-caption strong {
    font-size:.9375rem;
    line-height:1.5;
    display:block;
    color:var(--navy);
}

.image-label {
    position:absolute;
    bottom:0;
    right:0;
    font-size:.75rem;
    letter-spacing:.12em;
    color:#526a7e;
}

.audience-band {
    background:#f4f7fa;
    border-block:1px solid #e5ebf0;
}

.audience-inner {
    min-height:91px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.5rem;
}

.audience-inner>span:not(.audience-label) {
    display:flex;
    align-items:center;
    gap:.75rem;
    color:var(--navy);
    font-weight:600;
    font-size:.9375rem;
}

.audience-inner svg {
    width:23px;
    stroke-width:1.5;
}

.audience-label {
    font-size:.75rem;
    letter-spacing:.12em;
    font-weight:700;
    color:#627385;
}

.audience-inner p {
    font-size:.8125rem;
    color:#647484;
}

.section-heading {
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:3rem;
    margin-bottom:2.5rem;
}

h2 {
    font-size:clamp(2.2rem,3.5vw,2.9rem);
    letter-spacing:-.045em;
    line-height:1.13;
}

h2 span {
    color:#65778a;
}

.section-heading h2 {
    margin-top:.9rem;
}

.section-heading>p {
    max-width:365px;
    color:#5c6b78;
    font-size:1rem;
    padding-bottom:.2rem;
}

.service-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    border-top:1px solid #dbe3e9;
    border-left:1px solid #dbe3e9;
}

.service-card {
    padding:2.15rem 1.9rem 1.3rem;
    border-right:1px solid #dbe3e9;
    border-bottom:1px solid #dbe3e9;
    transition:background .2s;
    display:flex;
    flex-direction:column;
}

.service-card:hover {
    background:#f7f9fb;
}

.service-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:1.6rem;
}

.service-icon {
    color:var(--navy);
    width:30px;
    height:30px;
    stroke-width:1.5;
}

.service-top span {
    font-size:.75rem;
    font-weight:500;
    color:#738597;
}

.service-card h3 {
    font-size:1.125rem;
    margin-bottom:.8rem;
    letter-spacing:-.02em;
}

.service-card>p {
    color:#5e6b77;
    font-size:1rem;
    line-height:1.7;
    flex:1;
}

.service-action {
    width:100%;
    background:none;
    border:0;
    border-top:1px solid #e6ebef;
    color:var(--navy);
    font-size:.875rem;
    font-weight:600;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:1rem 0 .25rem;
    margin-top:1.5rem;
    min-height:44px;
}

.service-action span {
    font-size:1.25rem;
    font-weight:400;
}

.service-action:hover {
    color:var(--red);
}

.selector-section {
    background:var(--navy);
    padding:5.8rem 0;
}

.selector-layout {
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:6rem;
    align-items:start;
}

.selector-intro {
    padding-top:1.4rem;
}

.selector-intro .eyebrow {
    color:#bdcddd;
}

.selector-intro h2 {
    color:white;
    font-size:clamp(2.5rem,4.3vw,3.6rem);
    margin-top:1.2rem;
    line-height:1.1;
}

.selector-intro h2 span {
    color:#a9c3dc;
}

.selector-intro>p {
    margin-top:1.6rem;
    color:#d0dce8;
    max-width:290px;
    font-size:1rem;
}

.selector-note {
    display:flex;
    gap:.9rem;
    border-top:1px solid #ffffff25;
    padding-top:1.5rem;
    margin-top:2.4rem;
    color:#d0dce8;
    font-size:.875rem;
    line-height:1.7;
}

.selector-note svg {
    width:24px;
    flex-shrink:0;
    color:#a9c3dc;
}

.selector-card {
    border-radius:10px;
    background:white;
    padding:2.3rem;
    min-width:0;
}

.step-top {
    display:flex;
    justify-content:space-between;
    gap:1rem;
    font-size:.75rem;
    color:#607386;
}

.step-top>span:first-child {
    font-weight:700;
    letter-spacing:.08em;
}

.selector-progress {
    margin:1rem 0 1.8rem;
    height:4px;
}

.step-content h3 {
    font-size:1.6rem;
    letter-spacing:-.035em;
    margin-bottom:.55rem;
}

.step-content h3:focus {
    outline:none;
}

.step-help {
    font-size:.875rem;
    color:#64717c;
    margin-bottom:1.4rem;
}

.choice-group {
    gap:.7rem;
}

.choice {
    display:flex;
    align-items:center;
    gap:.9rem;
    padding:1.05rem;
    border:1px solid #d9e1e9;
    border-radius:5px;
    cursor:pointer;
    transition:border-color .2s,background .2s;
    min-width:0;
}

.choice:hover {
    border-color:#6e8aa5;
    background:#f9fbfc;
}

.choice.selected {
    border-color:var(--navy);
    background:#f0f5f9;
    box-shadow:inset 0 0 0 1px var(--navy);
}

.choice:has(:focus-visible) {
    outline:3px solid #b9343d;
    outline-offset:3px;
}

.choice strong {
    display:block;
    color:var(--navy);
    font-size:.9375rem;
    font-weight:600;
    line-height:1.4;
}

.choice small {
    display:block;
    color:#5f6d7a;
    margin-top:.35rem;
    font-size:.875rem;
    line-height:1.5;
}

.choice-icon {
    color:var(--navy);
    width:26px;
    height:26px;
    flex-shrink:0;
    stroke-width:1.5;
}

.sector-choice>span {
    flex:1;
}

.need-choice {
    padding:.75rem 1rem;
}

.need-choice small {
    font-size:.875rem;
    margin-top:.2rem;
}

.step-actions {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin-top:1.8rem;
}

.step-actions>span {
    font-size:.75rem;
    color:#657585;
}

.back-button {
    font-size:.875rem;
    padding:0;
    min-height:44px;
}

.restart-button {
    font-size:.875rem;
    min-height:44px;
    white-space:normal;
}

.result-label {
    display:flex;
    gap:.5rem;
    align-items:center;
    color:#4f6d86;
    font-size:.75rem;
    font-weight:700;
    letter-spacing:.06em;
    margin-bottom:.8rem;
}

.result-label svg {
    width:16px;
    height:16px;
}

.result-tags {
    display:flex;
    flex-wrap:wrap;
    gap:.5rem;
    margin:1rem 0;
}

.result-tags span {
    background:#f0f4f8;
    color:#365873;
    font-size:.75rem;
    border-radius:4px;
    padding:.3rem .6rem;
}

.result>p {
    color:#5c6977;
    font-size:1rem;
}

.result h4 {
    font-size:.875rem;
    margin-top:1.4rem;
    margin-bottom:.7rem;
}

.result ul {
    list-style:none;
    padding:0;
    margin:0;
    display:grid;
    gap:.5rem;
    font-size:.875rem;
    color:#455866;
}

.result li {
    display:flex;
    gap:.6rem;
}

.result li svg {
    width:16px;
    height:16px;
    margin-top:4px;
    flex-shrink:0;
    color:var(--navy);
}

.first-step {
    background:#f1f5f9;
    padding:1rem 1.1rem;
    border-left:3px solid var(--red);
    margin-top:1.4rem;
}

.first-step strong {
    color:var(--navy);
    font-size:.875rem;
}

.first-step p {
    color:#4d6275;
    margin-top:.4rem;
    font-size:.875rem;
}

.result .result-scope {
    font-size:.875rem;
    margin-top:1rem;
}

.method-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:2rem;
    padding-top:.6rem;
}

.method-number {
    display:block;
    color:var(--red);
    font-size:1.65rem;
    font-weight:500;
    letter-spacing:-.04em;
    margin-bottom:1.4rem;
    padding-bottom:1rem;
    border-bottom:1px solid #dce3e9;
}

.method-item h3 {
    font-size:1.0625rem;
    line-height:1.35;
    margin-bottom:.8rem;
}

.method-item p {
    font-size:1rem;
    line-height:1.8;
    color:#5e6b77;
}

.agreement-line {
    background:#f4f7fa;
    padding:1.25rem 1.6rem;
    margin-top:2.5rem;
    display:flex;
    align-items:center;
    gap:1rem;
    border-radius:5px;
    font-size:.875rem;
    color:#657585;
}

.agreement-line svg {
    width:21px;
    color:var(--navy);
    flex-shrink:0;
}

.agreement-line strong {
    color:var(--navy);
}

.about-section {
    background:#f2f5f8;
    padding-block:5.8rem;
}

.about-heading {
    text-align:center;
    max-width:670px;
    margin:auto;
}

.about-heading .eyebrow {
    justify-content:center;
}

.about-heading h2 {
    margin-top:1rem;
}

.about-heading>p {
    color:#647482;
    max-width:520px;
    margin:1.4rem auto 0;
    font-size:1rem;
}

.purpose-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:2rem;
    margin-top:3rem;
}

.purpose-grid article {
    padding:2.5rem;
    border:1px solid #d8e2ea;
    background:white;
    border-radius:6px;
    position:relative;
    overflow:hidden;
}

.purpose-label {
    display:block;
    font-size:.75rem;
    letter-spacing:.12em;
    color:#657789;
    font-weight:700;
    margin-bottom:1rem;
    position:relative;
}

.purpose-grid h3 {
    font-size:1.65rem;
    letter-spacing:-.035em;
    line-height:1.25;
    position:relative;
}

.purpose-grid p {
    margin-top:1.3rem;
    color:#5b6b79;
    font-size:1rem;
    line-height:1.85;
    position:relative;
}

.purpose-grid .vision {
    background:var(--navy);
    border:1px solid var(--navy);
}

.vision h3 {
    color:white;
}

.vision p {
    color:#d4e0eb;
}

.vision .purpose-label {
    color:#bbd0e4;
}

.vision-year {
    position:absolute;
    font-size:7rem;
    font-weight:700;
    color:#ffffff07;
    right:1.5rem;
    top:.6rem;
    line-height:1;
    letter-spacing:-.06em;
}

.values-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    column-gap:2.3rem;
    row-gap:2.5rem;
    padding-top:.6rem;
}

.values-grid article {
    border-top:1px solid #dce4eb;
    padding-top:1.4rem;
}

.values-grid svg {
    width:24px;
    height:24px;
    color:var(--red);
    stroke-width:1.5;
}

.values-grid h3 {
    font-size:1rem;
    margin:1rem 0 .6rem;
}

.values-grid p {
    font-size:1rem;
    color:#60707d;
    line-height:1.75;
}

.closing {
    padding:3rem 3.5rem;
    border-radius:8px;
    background:#edf2f6;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:3rem;
    margin-bottom:5.5rem;
}

.closing h2 {
    margin-top:.8rem;
    font-size:2.3rem;
}

.closing p {
    font-size:1rem;
    color:#607180;
    max-width:410px;
    margin-top:1.2rem;
}

footer {
    border-top:1px solid #dfe7ee;
    padding-top:2.7rem;
    padding-bottom:1.3rem;
}

.footer-main {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:2rem;
    padding-bottom:2.5rem;
}

.footer-nav {
    display:flex;
    gap:2rem;
    font-size:.875rem;
    color:#5a6d7d;
}

.footer-bottom {
    border-top:1px solid #e6ecf1;
    padding-top:1.3rem;
    display:flex;
    justify-content:space-between;
    gap:1.5rem;
    font-size:.75rem;
    color:#62778a;
}

.footer-bottom>span:last-child {
    display:flex;
    gap:.45rem;
    align-items:center;
}

.footer-bottom svg {
    width:13px;
    height:13px;
}

.skip-link {
    position:fixed;
    top:-100px;
    left:1rem;
    padding:.8rem 1rem;
    background:white;
    color:var(--navy);
    z-index:100;
    border:2px solid var(--navy);
}

.skip-link:focus {
    top:1rem;
}

@media(min-width:1450px) {
    .container {
        width:min(1260px,calc(100% - 8rem));
    }
    .hero {
        gap:5rem;
    }
}

@media(max-width:1100px) {
    .container {
        width:calc(100% - 4rem);
    }
    .nav {
        gap:1.15rem;
    }
    .hero {
        gap:2rem;
    }
    .hero-visual {
        height:470px;
    }
    .hero-proof {
        gap:.75rem;
    }
    .selector-layout {
        gap:3rem;
    }
    .audience-inner p {
        display:none;
    }
    .service-card {
        padding:1.7rem 1.4rem 1.1rem;
    }
    .brand strong {
        font-size:1.3rem;
    }
    .method-grid {
        gap:1.5rem;
    }
}

@media(max-width:900px) {
    .header-inner {
        min-height:80px;
    }
    .menu-toggle {
        display:flex;
        justify-content:center;
        align-items:center;
        width:44px;
        height:44px;
        border:1px solid #d9e3eb;
        border-radius:5px;
        background:white;
        color:var(--navy);
    }
    .nav {
        display:none;
        position:absolute;
        top:100%;
        left:0;
        width:100%;
        background:white;
        border-bottom:1px solid #dce4eb;
        padding:1rem 2rem 1.5rem;
        box-shadow:0 15px 25px #153b630a;
    }
    .nav.is-open {
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:0;
    }
    .nav a:not(.button) {
        padding:.8rem 0;
    }
    .nav-cta {
        margin-top:.6rem;
    }
    .hero {
        padding-top:3rem;
        padding-bottom:3.5rem;
        gap:1.7rem;
    }
    .hero-copy h1 {
        font-size:3.2rem;
    }
    .hero-copy>p {
        font-size:1rem;
    }
    .hero-visual {
        height:430px;
    }
    .image-caption {
        left:-.7rem;
        padding:1rem;
        gap:.65rem;
        bottom:3rem;
    }
    .image-caption strong {
        font-size:.875rem;
    }
    .image-caption .caption-icon {
        width:34px;
        height:34px;
    }
    .hero-actions {
        gap:.8rem;
    }
    .hero-proof {
        margin-top:1.7rem;
    }
    .section {
        padding-block:4.5rem;
    }
    .service-grid {
        grid-template-columns:repeat(2,1fr);
    }
    .selector-layout {
        gap:2rem;
        grid-template-columns:.65fr 1fr;
    }
    .selector-card {
        padding:1.5rem;
    }
    .selector-intro h2 {
        font-size:2.7rem;
    }
    .section-heading>p {
        max-width:310px;
    }
    .method-grid,.values-grid {
        grid-template-columns:repeat(2,1fr);
    }
    .agreement-line {
        flex-wrap:wrap;
    }
    .purpose-grid {
        gap:1.3rem;
    }
    .purpose-grid article {
        padding:1.75rem;
    }
    .purpose-grid h3 {
        font-size:1.4rem;
    }
    .closing {
        padding:2.5rem;
    }
}

@media(max-width:650px) {
    html {
        scroll-padding-top:6rem;
    }
    .container {
        width:calc(100% - 2.5rem);
    }
    .brand-mark {
        width:32px;
        height:32px;
    }
    .brand-mark svg {
        width:30px;
        height:30px;
    }
    .brand strong {
        font-size:1.25rem;
    }
    .brand small {
        font-size:.75rem;
        max-width:220px;
        line-height:1.3;
    }
    .header-inner {
        gap:1rem;
        min-height:84px;
    }
    .nav {
        padding:1rem 1.25rem 1.5rem;
    }
    .hero {
        grid-template-columns:1fr;
        padding-top:2.8rem;
        gap:2.4rem;
        padding-bottom:2.3rem;
    }
    .hero-copy h1 {
        font-size:clamp(3.15rem,11vw,4rem);
        margin-top:1rem;
    }
    .hero-copy>p {
        margin-top:1.4rem;
    }
    .hero-actions {
        margin-top:1.5rem;
        gap:1rem;
    }
    .hero-proof {
        font-size:.8125rem;
        gap:1rem;
    }
    .hero-visual {
        height:330px;
        margin-top:0;
    }
    .hero-visual>img {
        border-radius:32px 5px 32px 5px;
    }
    .image-caption {
        left:.8rem;
        bottom:3rem;
        padding:1rem 1.15rem;
    }
    .image-caption strong {
        font-size:.875rem;
    }
    .image-label {
        font-size:.75rem;
    }
    .eyebrow {
        font-size:.75rem;
    }
    .audience-inner {
        flex-wrap:wrap;
        padding-block:1.35rem;
        gap:.8rem 1.8rem;
        min-height:0;
    }
    .audience-label {
        width:100%;
    }
    .audience-inner>span:not(.audience-label) {
        font-size:.875rem;
    }
    .audience-inner svg {
        width:20px;
    }
    .section {
        padding-block:3.6rem;
    }
    .section-heading {
        display:block;
        margin-bottom:2rem;
    }
    h2 {
        font-size:2.2rem;
    }
    .section-heading>p {
        max-width:none;
        margin-top:1.2rem;
    }
    .service-grid {
        grid-template-columns:1fr;
    }
    .service-card {
        padding:1.6rem;
    }
    .service-top {
        margin-bottom:1.2rem;
    }
    .service-card h3 {
        font-size:1.125rem;
    }
    .selector-section {
        padding-block:3.5rem;
    }
    .selector-layout {
        grid-template-columns:1fr;
        gap:2rem;
    }
    .selector-intro {
        padding-top:0;
    }
    .selector-intro h2 {
        font-size:2.7rem;
    }
    .selector-intro h2 br {
        display:none;
    }
    .selector-intro h2 span {
        display:block;
    }
    .selector-intro>p {
        max-width:none;
        margin-top:1.2rem;
    }
    .selector-note {
        margin-top:1.3rem;
        padding-top:1rem;
    }
    .selector-card {
        padding:1.5rem 1.2rem;
    }
    .step-content h3 {
        font-size:1.4rem;
    }
    .step-actions {
        gap:.7rem;
    }
    .step-actions .button {
        padding:.75rem 1rem;
    }
    .step-actions>span {
        max-width:105px;
        font-size:.75rem;
    }
    .choice {
        padding:.9rem;
    }
    .choice small {
        font-size:.875rem;
    }
    .need-choice {
        padding:.75rem .85rem;
    }
    .result .step-actions {
        flex-wrap:wrap;
    }
    .method-grid {
        gap:1.8rem 1.2rem;
    }
    .method-number {
        margin-bottom:1rem;
    }
    .method-item h3 {
        font-size:1rem;
    }
    .agreement-line {
        gap:.5rem .8rem;
        padding:1.2rem;
    }
    .agreement-line>span {
        width:100%;
    }
    .about-section {
        padding-block:3.6rem;
    }
    .about-heading {
        text-align:left;
    }
    .about-heading .eyebrow {
        justify-content:flex-start;
    }
    .about-heading>p {
        margin-top:1.2rem;
    }
    .purpose-grid {
        grid-template-columns:1fr;
        gap:1.1rem;
        margin-top:2rem;
    }
    .purpose-grid article {
        padding:1.8rem;
    }
    .purpose-grid h3 {
        font-size:1.65rem;
    }
    .values-grid {
        gap:2rem 1.4rem;
    }
    .closing {
        flex-direction:column;
        align-items:flex-start;
        gap:1.7rem;
        padding:2rem 1.5rem;
        margin-bottom:3.5rem;
    }
    .closing h2 {
        font-size:2rem;
    }
    .footer-main {
        flex-direction:column;
        align-items:flex-start;
        gap:1.8rem;
        padding-bottom:1.8rem;
    }
    .footer-nav {
        gap:1.4rem;
        font-size:.875rem;
        flex-wrap:wrap;
    }
    .footer-bottom {
        flex-direction:column;
        gap:.6rem;
    }
}

.brand>span:last-child {
    min-width:0;
}

h1,h2,h3,h4,p {
    overflow-wrap:anywhere;
}

.choice>span {
    min-width:0;
}

.step-top,.step-actions {
    flex-wrap:wrap;
}

.image-caption {
    max-width:calc(100% - 1.6rem);
}

.service-card,.method-item,.values-grid article {
    min-width:0;
}

.service-action {
    overflow-wrap:anywhere;
}

.restart-button {
    max-width:100%;
    flex-shrink:1;
}

@media(max-width:650px) {
    .container {
        width:calc(100% - 40px);
    }
    .brand {
        flex-shrink:1;
        min-width:0;
    }
    .brand-mark,.menu-toggle {
        flex-shrink:0;
    }
    .brand strong {
        overflow-wrap:anywhere;
    }
    .header-inner {
        padding-block:.5rem;
    }
    .site-header .brand small {
        display:none;
    }
    .method-grid,.values-grid {
        grid-template-columns:repeat(auto-fit,minmax(min(100%,8.5rem),1fr));
    }
    .selector-card {
        padding:24px 16px;
    }
    .choice {
        padding:14px 12px;
        gap:12px;
    }
    .choice strong,.choice small {
        overflow-wrap:anywhere;
    }
    .need-choice {
        padding:12px 14px;
    }
}

@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto;
    }
    * {
        transition:none!important;
        animation:none!important;
    }
}

/* Controles nativos: no requieren React ni bibliotecas externas. */
.antialiased {
    -webkit-font-smoothing:antialiased;
}

.radio-control {
    appearance:none;
    -webkit-appearance:none;
    margin:0;
    width:1rem;
    height:1rem;
    flex-shrink:0;
    border:1px solid #93a6b8;
    border-radius:50%;
    background:#fff;
    cursor:pointer;
}

.radio-control:checked {
    background:#153b63;
    box-shadow:inset 0 0 0 3px white;
    border-color:#153b63;
}

.radio-control:focus-visible {
    outline:3px solid #b9343d;
    outline-offset:4px;
}

.button:disabled {
    opacity:.5;
    cursor:not-allowed;
    transform:none;
}

.back-button {
    background:transparent;
    border:0;
    color:#153b63;
    font-weight:600;
}

.restart-button {
    background:white;
    border:1px solid #d6e0e8;
    border-radius:5px;
    color:#153b63;
    padding:.75rem 1rem;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    font-weight:600;
    line-height:1.4;
}

.restart-button svg {
    width:1rem;
    height:1rem;
    flex-shrink:0;
}

.selector-progress {
    background:#d9e4ed;
    border-radius:4px;
    overflow:hidden;
}

.selector-progress>span {
    display:block;
    height:100%;
    background:#153b63;
    transition:width .15s;
}

.choice-group {
    display:grid;
}

@media(prefers-reduced-motion:reduce) {
    .selector-progress>span {
        transition:none;
    }
}

/* Acciones de la sesión privada. */
.cuenta-privada {
    display:flex;
    flex-wrap:wrap;
    gap:20px;
    align-items:center;
    padding-bottom:24px;
    font-size:.8125rem;
}

.cuenta-privada a {
    color:var(--navy);
    text-decoration:underline;
}

.cuenta-privada form {
    margin:0;
}

.cuenta-privada button {
    font:inherit;
    color:var(--navy);
    background:transparent;
    border:1px solid #bac7d2;
    border-radius:4px;
    padding:8px 12px;
    cursor:pointer;
}

.cuenta-privada button:hover {
    background:#eef3f7;
}