.host-page{
    width:min(100%,80rem);
    margin:0 auto;
    padding:0 1.25rem;
    display:flex;
    flex-direction:column;
    gap:1.75rem;
}

.host-page__section{
    display:flex;
    flex-direction:column;
    gap:1.1rem;
}

.host-section-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:1rem;
}

.host-section-title{
    margin:0 0 .45rem;
    font-size:clamp(1.7rem,3vw,2.25rem);
    line-height:1.08;
}

.host-section-subtitle{
    margin:0;
    color:#cfd4e6;
    line-height:1.65;
    max-width:42rem;
}

.host-hero-panel{
    display:grid;
    grid-template-columns:minmax(0,1.18fr) minmax(280px,.82fr);
    gap:1rem;
    align-items:stretch;
}

.host-hero-panel__content,
.host-hero-panel__card,
.host-comparison-card{
    position:relative;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.08);
    border-radius:1.35rem;
}

.host-hero-panel__content,
.host-hero-panel__card{
    overflow:hidden;
}

.host-comparison-card{
    overflow:visible;
}

.host-hero-panel__content{
    padding:1.35rem 1.45rem;
    min-width:0;
}

.host-hero-panel__card{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:.95rem;
    padding:1.25rem 1.35rem;
}

.host-comparison-card{
    padding:1.3rem 1.35rem;
}

.host-page__eyebrow{
    display:inline-flex;
    align-items:center;
    max-width:100%;
    padding:.5rem .8rem;
    border-radius:999px;
    background:rgba(87,80,218,.16);
    color:#d7d3ff;
    font-size:.72rem;
    line-height:1.35;
    letter-spacing:.09em;
    text-transform:uppercase;
    margin-bottom:.85rem;
}

.host-page__title{
    margin:0 0 .75rem;
    font-size:clamp(1.9rem,3.4vw,2.7rem);
    line-height:1.03;
}

.host-page__subtitle{
    margin:0;
    color:#d9dbea;
    line-height:1.62;
    font-size:.98rem;
    max-width:42rem;
}

.host-page__bullets{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.65rem;
    margin-top:1rem;
    max-width:46rem;
}

.host-page__bullets span{
    display:flex;
    align-items:flex-start;
    min-width:0;
    padding:.75rem .9rem;
    border-radius:1rem;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.08);
    color:#f1f3fb;
    font-size:.92rem;
    line-height:1.5;
}

.host-hero-panel__card h2{
    margin:0;
    font-size:1.18rem;
    line-height:1.15;
}

.host-hero-panel__card p{
    margin:0;
    color:#d0d5e6;
    line-height:1.62;
}

.host-page__cta{
    width:100%;
}

.host-page__plans{
    padding:0;
}

.host-page__plans .plan{
    min-height:100%;
}

.host-comparison-card__header{
    display:flex;
    justify-content:space-between;
    gap:1rem;
    align-items:flex-start;
    margin-bottom:1rem;
}

.host-comparison-card__header h2{
    margin:.1rem 0 .45rem;
    font-size:clamp(1.5rem,2.6vw,2rem);
    line-height:1.08;
}

.host-comparison-card__header p{
    margin:0;
    color:#cfd4e6;
    line-height:1.65;
    max-width:38rem;
}

.host-comparison-card__tabs{
    display:flex;
    gap:.6rem;
    flex-wrap:wrap;
    justify-content:flex-end;
}

.host-tab-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:2.85rem;
    padding:.72rem .95rem;
    border-radius:.95rem;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.04);
    color:#fff;
    cursor:pointer;
    transition:.2s ease;
    text-decoration:none;
    text-align:center;
    line-height:1.3;
}

.host-tab-button--active,
.host-tab-button:hover{
    background:rgba(87,80,218,.18);
    border-color:rgba(87,80,218,.3);
}

.host-comparison-grid{
    display:grid;
    grid-template-columns:minmax(220px,1.15fr) repeat(4,minmax(110px,1fr));
    gap:.75rem;
}

.host-comparison-grid+.host-comparison-grid{
    margin-top:.75rem;
}

.host-comparison-grid__cell{
    min-height:4.1rem;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:.85rem .95rem;
    border-radius:1rem;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.07);
    color:#fff;
}

.host-comparison-grid__cell img.icon{
    width:20px;
    height:20px;
}

.host-comparison-grid__cell--feature{
    justify-content:flex-start;
    text-align:left;
    color:#eef1fb;
    font-weight:600;
    gap:.5rem;
}

.host-comparison-grid__cell--plan{
    flex-direction:column;
    gap:.35rem;
    background:rgba(255,255,255,.045);
    border-color:rgba(255,255,255,.09);
}

.host-comparison-grid--head{
    position:sticky;
    top:6.6rem;
    z-index:20;
    margin-bottom:.75rem;
    padding:.35rem;
    border-radius:1.15rem;
    background:rgba(17,17,17,.96);
    border:1px solid rgba(255,255,255,.08);
    backdrop-filter:blur(12px);
    box-shadow:0 16px 36px rgba(0,0,0,.28);
}

.host-comparison-grid--head .host-comparison-grid__cell{
    min-height:4.5rem;
    background:rgba(255,255,255,.04);
    border-color:rgba(255,255,255,.09);
}

.host-comparison-grid--head .host-comparison-grid__cell--feature{
    background:rgba(255,255,255,.055);
}

.tooltip2{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    width:18px;
    height:18px;
    border-radius:999px;
    background:rgba(255,255,255,.08);
    font-size:11px;
    position:relative;
    margin-left:8px;
    cursor:help;
}

.tooltip2__text{
    position:absolute;
    left:50%;
    bottom:120%;
    transform:translateX(-50%);
    min-width:230px;
    max-width:min(22rem,calc(100vw - 2rem));
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    background:#0f1320;
    color:#fff;
    padding:10px 12px;
    border-radius:12px;
    border:1px solid rgba(255,255,255,.08);
    line-height:1.45;
    z-index:4;
}

.tooltip2:hover .tooltip2__text{
    opacity:1;
    visibility:visible;
}

@media (max-width:1180px){
    .host-page{
        gap:1.5rem;
    }

    .host-hero-panel{
        grid-template-columns:1fr;
    }

    .host-comparison-card__header{
        flex-direction:column;
    }

    .host-comparison-card__tabs{
        justify-content:flex-start;
    }

    .host-page__title{
        max-width:16ch;
    }
}

@media (max-width:980px){
    .host-page{
        padding:0 1rem;
    }

    .host-hero-panel__content,
    .host-hero-panel__card,
    .host-comparison-card{
        padding:1.15rem;
        border-radius:1.2rem;
    }

    .host-page__bullets{
        grid-template-columns:1fr;
        max-width:none;
    }

    .host-comparison-grid{
        grid-template-columns:minmax(200px,1fr) repeat(4,minmax(120px,1fr));
        overflow-x:auto;
        padding-bottom:.2rem;
    }
}

@media (max-width:720px){
    .host-page{
        gap:1.25rem;
        padding:0 .85rem;
    }

    .host-page__eyebrow{
        width:100%;
        justify-content:center;
        text-align:center;
        padding:.48rem .7rem;
        font-size:.66rem;
    }

    .host-page__title{
        font-size:clamp(1.65rem,8vw,2.15rem);
        max-width:none;
    }

    .host-page__subtitle,
    .host-section-subtitle,
    .host-comparison-card__header p,
    .host-hero-panel__card p{
        font-size:.93rem;
        line-height:1.56;
    }

    .host-page__bullets span{
        padding:.72rem .82rem;
        font-size:.88rem;
    }

    .host-tab-button{
        width:100%;
    }

    .host-comparison-grid{
        display:flex;
        flex-direction:column;
        overflow:visible;
    }

    .host-comparison-grid__cell{
        justify-content:flex-start;
        text-align:left;
        min-height:auto;
    }

    .host-comparison-grid__cell--plan,
    .host-comparison-grid--head{
        display:none;
    }

    .tooltip2__text{
        left:auto;
        right:0;
        transform:none;
    }
}
