:root {
    --bg: #f4f7fb;
    --bg-soft: #edf2fa;

    --navy: #08112f;
    --navy-2: #101b43;

    --surface: #ffffff;
    --surface-dark: #0d1737;

    --text: #111a31;
    --muted: #667189;

    --border: #dfe5ef;

    --blue: #356cff;
    --blue-dark: #1f4ee8;
    --cyan: #29d7e7;
    --purple: #8b61ff;

    --green: #26d980;

    --radius-sm: 12px;
    --radius: 18px;
    --radius-lg: 28px;

    --shadow:
        0 18px 50px rgba(8, 17, 47, .08);

    --shadow-heavy:
        0 35px 80px rgba(8, 17, 47, .18);
}


/* ============================================================
   RESET
============================================================ */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;

    background: var(--bg);
    color: var(--text);

    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    line-height: 1.5;

    overflow-x: hidden;
}

body,
button,
input {
    font: inherit;
}

img,
svg {
    max-width: 100%;
}

a {
    color: inherit;
}

button {
    border: 0;
}

.container {
    width: min(
        1180px,
        calc(100% - 42px)
    );

    margin-inline: auto;
}


/* ============================================================
   HEADER
============================================================ */

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;

    border-bottom:
        1px solid rgba(223, 229, 239, .82);

    background:
        rgba(255, 255, 255, .92);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);
}

.header-inner {
    min-height: 78px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;
}


/* ============================================================
   BRAND
============================================================ */

.brand {
    display: inline-flex;
    align-items: center;

    gap: 11px;

    text-decoration: none;

    flex: 0 0 auto;
}

.brand-mark {
    position: relative;

    width: 44px;
    height: 44px;

    display: grid;
    place-items: center;

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            var(--blue),
            var(--purple)
        );

    color: #fff;

    font-weight: 900;
    font-size: 17px;

    letter-spacing: -.06em;

    box-shadow:
        0 10px 24px rgba(53, 108, 255, .24);
}

.brand-dot {
    position: absolute;

    top: -2px;
    right: -2px;

    width: 11px;
    height: 11px;

    border: 3px solid #fff;
    border-radius: 50%;

    background: var(--green);
}

.brand-copy {
    display: flex;
    flex-direction: column;

    line-height: 1.05;
}

.brand-copy strong {
    font-size: 22px;
    font-weight: 850;

    letter-spacing: -.045em;
}

.brand-copy small {
    margin-top: 5px;

    color: var(--muted);

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .04em;
    text-transform: uppercase;
}


/* ============================================================
   NAV
============================================================ */

.main-nav {
    display: flex;
    align-items: center;

    gap: 5px;
}

.main-nav > a {
    padding: 10px 11px;

    border-radius: 10px;

    color: #25304a;

    text-decoration: none;

    font-size: 14px;
    font-weight: 700;

    transition:
        background .15s ease,
        color .15s ease,
        transform .15s ease;
}

.main-nav > a:hover {
    background: var(--bg-soft);
    color: var(--blue);
}

.main-nav .nav-cta {
    margin-left: 8px;

    padding:
        11px
        17px;

    background: var(--navy);
    color: #fff;

    box-shadow:
        0 9px 22px rgba(8, 17, 47, .13);
}

.main-nav .nav-cta:hover {
    background: var(--blue);
    color: #fff;

    transform:
        translateY(-1px);
}


/* ============================================================
   MOBILE BUTTON
============================================================ */

.menu-toggle {
    width: 46px;
    height: 46px;

    display: none;

    padding: 0;

    border-radius: 12px;

    background: var(--bg-soft);

    cursor: pointer;
}

.menu-toggle span {
    width: 20px;
    height: 2px;

    display: block;

    margin:
        4px
        auto;

    border-radius: 999px;

    background: var(--navy);

    transition:
        transform .2s ease,
        opacity .2s ease;
}

.menu-toggle.is-open span:nth-child(1) {
    transform:
        translateY(6px)
        rotate(45deg);
}

.menu-toggle.is-open span:nth-child(2) {
    opacity: 0;
}

.menu-toggle.is-open span:nth-child(3) {
    transform:
        translateY(-6px)
        rotate(-45deg);
}


/* ============================================================
   HERO
============================================================ */

.hero-home {
    position: relative;

    overflow: hidden;

    padding:
        104px
        0
        90px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f5f8ff 100%
        );
}

.hero-home::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(53, 108, 255, .25),
            transparent
        );
}

.hero-glow {
    position: absolute;

    pointer-events: none;

    border-radius: 50%;

    filter: blur(8px);
}

.hero-glow-one {
    width: 560px;
    height: 560px;

    right: -210px;
    top: -250px;

    background:
        radial-gradient(
            circle,
            rgba(139, 97, 255, .16),
            transparent 68%
        );
}

.hero-glow-two {
    width: 500px;
    height: 500px;

    left: -320px;
    bottom: -350px;

    background:
        radial-gradient(
            circle,
            rgba(41, 215, 231, .14),
            transparent 68%
        );
}

.hero-layout {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, 1.08fr)
        minmax(380px, .92fr);

    align-items: center;

    gap: 80px;
}

.hero-kicker {
    display: inline-flex;
    align-items: center;

    gap: 9px;

    margin-bottom: 24px;

    color: var(--blue);

    font-size: 13px;
    font-weight: 850;

    letter-spacing: .12em;
}

.online-pulse {
    position: relative;

    width: 9px;
    height: 9px;

    border-radius: 50%;

    background: var(--green);

    box-shadow:
        0 0 0 5px rgba(38, 217, 128, .12);
}

.hero-home h1 {
    max-width: 720px;

    margin: 0;

    color: var(--navy);

    font-size:
        clamp(
            52px,
            7.3vw,
            88px
        );

    line-height: .96;

    letter-spacing: -.065em;
}

.hero-home h1 span {
    display: block;

    background:
        linear-gradient(
            90deg,
            var(--blue),
            var(--purple)
        );

    -webkit-background-clip: text;
    background-clip: text;

    color: transparent;
}

.hero-description {
    max-width: 650px;

    margin:
        30px
        0
        0;

    color: var(--muted);

    font-size:
        clamp(
            19px,
            2vw,
            23px
        );

    line-height: 1.55;
}

.hero-description strong {
    color: var(--navy);
    font-weight: 800;
}

.hero-actions {
    margin-top: 34px;

    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 12px;
}

.button {
    min-height: 52px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    padding:
        0
        21px;

    border-radius: 14px;

    text-decoration: none;

    font-size: 15px;
    font-weight: 800;

    transition:
        transform .15s ease,
        box-shadow .15s ease;
}

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

.button-primary {
    background:
        linear-gradient(
            135deg,
            var(--blue),
            #527eff
        );

    color: #fff;

    box-shadow:
        0 14px 30px rgba(53, 108, 255, .25);
}

.button-secondary {
    border: 1px solid var(--border);

    background: #fff;

    color: var(--navy);
}

.hero-trust {
    margin-top: 38px;

    display: flex;
    align-items: center;

    gap: 22px;
}

.hero-trust > div:not(.hero-trust-separator) {
    display: flex;
    flex-direction: column;
}

.hero-trust strong {
    color: var(--navy);

    font-size: 18px;
    font-weight: 850;
}

.hero-trust span {
    margin-top: 2px;

    color: var(--muted);

    font-size: 12px;
}

.hero-trust-separator {
    width: 1px;
    height: 34px;

    background: var(--border);
}


/* ============================================================
   HERO VISUAL
============================================================ */

.hero-visual {
    position: relative;

    min-height: 520px;

    display: grid;
    place-items: center;
}

.conversation-card {
    position: relative;
    z-index: 3;

    width: min(
        100%,
        430px
    );

    padding: 25px;

    border:
        1px solid
        rgba(255, 255, 255, .75);

    border-radius: 28px;

    background:
        rgba(255, 255, 255, .9);

    box-shadow:
        var(--shadow-heavy);

    backdrop-filter:
        blur(20px);

    transform:
        rotate(1.5deg);
}

.conversation-head {
    padding-bottom: 19px;

    display: flex;
    align-items: center;

    gap: 13px;

    border-bottom:
        1px solid var(--border);
}

.conversation-avatars {
    display: flex;
}

.conversation-avatars span {
    width: 34px;
    height: 34px;

    display: grid;
    place-items: center;

    margin-left: -7px;

    border: 3px solid #fff;
    border-radius: 50%;

    color: #fff;

    font-size: 11px;
    font-weight: 850;
}

.conversation-avatars span:first-child {
    margin-left: 0;
    background: var(--blue);
}

.conversation-avatars span:nth-child(2) {
    background: var(--purple);
}

.conversation-avatars span:nth-child(3) {
    background: #ee6ca7;
}

.conversation-head > div:last-child {
    display: flex;
    flex-direction: column;
}

.conversation-head strong {
    font-size: 14px;
}

.conversation-head small {
    color: var(--muted);
    font-size: 11px;
}

.message-row {
    margin-top: 18px;

    display: flex;
    align-items: flex-end;

    gap: 9px;
}

.message-row.own {
    justify-content: flex-end;
}

.message-avatar {
    width: 30px;
    height: 30px;

    flex: 0 0 auto;

    display: grid;
    place-items: center;

    border-radius: 10px;

    background: var(--navy);
    color: #fff;

    font-size: 10px;
    font-weight: 850;
}

.message-row.own .message-avatar {
    background: var(--blue);
}

.message-bubble {
    max-width: 78%;

    padding:
        11px
        13px;

    border-radius:
        14px
        14px
        14px
        4px;

    background: var(--bg-soft);
}

.message-row.own .message-bubble {
    border-radius:
        14px
        14px
        4px
        14px;

    background:
        rgba(53, 108, 255, .1);
}

.message-bubble strong {
    display: block;

    margin-bottom: 2px;

    font-size: 11px;
}

.message-bubble p {
    margin: 0;

    font-size: 13px;
}

.conversation-input {
    margin-top: 22px;

    min-height: 48px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding:
        0
        12px
        0
        16px;

    border:
        1px solid var(--border);

    border-radius: 13px;

    color: #a0a9ba;

    font-size: 12px;
}

.conversation-input strong {
    width: 31px;
    height: 31px;

    display: grid;
    place-items: center;

    border-radius: 9px;

    background: var(--blue);
    color: #fff;
}

.social-orbit {
    position: absolute;

    z-index: 4;

    padding:
        9px
        13px;

    border:
        1px solid
        rgba(223, 229, 239, .85);

    border-radius: 999px;

    background: #fff;

    color: var(--navy);

    box-shadow: var(--shadow);

    font-size: 12px;
    font-weight: 800;
}

.orbit-one {
    top: 50px;
    right: -10px;

    transform:
        rotate(6deg);
}

.orbit-two {
    bottom: 85px;
    left: -15px;

    transform:
        rotate(-7deg);
}

.orbit-three {
    top: 155px;
    left: -35px;

    transform:
        rotate(-4deg);
}


/* ============================================================
   SECTION GENERAL
============================================================ */

.section-label {
    display: inline-block;

    margin-bottom: 8px;

    color: var(--blue);

    font-size: 12px;
    font-weight: 850;

    letter-spacing: .13em;
}

.section-title-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;
}

.section-title-row h2,
.discover-intro h2,
.why-copy h2 {
    margin: 0;

    color: var(--navy);

    font-size:
        clamp(
            32px,
            4.5vw,
            52px
        );

    line-height: 1.05;

    letter-spacing: -.045em;
}

.section-title-row > a {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    color: var(--blue);

    text-decoration: none;

    font-size: 14px;
    font-weight: 800;
}


/* ============================================================
   POPULAR
============================================================ */

.popular-section {
    padding:
        58px
        0
        64px;

    background: #fff;
}

.popular-scroll {
    margin-top: 25px;

    display: flex;
    flex-wrap: wrap;

    gap: 10px;
}

.popular-pill {
    min-height: 45px;

    display: inline-flex;
    align-items: center;

    gap: 7px;

    padding:
        0
        15px;

    border:
        1px solid var(--border);

    border-radius: 999px;

    background: var(--surface);

    color: #2b3650;

    text-decoration: none;

    font-size: 14px;
    font-weight: 750;

    transition:
        border .15s ease,
        color .15s ease,
        transform .15s ease,
        box-shadow .15s ease;
}

.popular-pill:hover {
    border-color:
        rgba(53, 108, 255, .36);

    color: var(--blue);

    transform:
        translateY(-2px);

    box-shadow:
        0 8px 20px rgba(8, 17, 47, .07);
}

.popular-pill .hash {
    color: var(--blue);
    font-weight: 900;
}


/* ============================================================
   CHAT
============================================================ */

.live-chat-section {
    position: relative;

    padding:
        88px
        0
        100px;

    overflow: hidden;

    background: var(--navy);
    color: #fff;
}

.live-chat-section::before {
    content: "";

    position: absolute;

    top: -240px;
    right: -120px;

    width: 600px;
    height: 600px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(53, 108, 255, .25),
            transparent 65%
        );
}

.chat-title-row {
    position: relative;
    z-index: 2;

    margin-bottom: 28px;
}

.chat-title-row .section-label {
    color: var(--cyan);
}

.chat-title-row h2 {
    color: #fff;
}

.chat-title-row p {
    max-width: 650px;

    margin:
        12px
        0
        0;

    color:
        rgba(255, 255, 255, .65);

    font-size: 16px;
}

.live-indicator {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    padding:
        9px
        13px;

    border:
        1px solid
        rgba(255, 255, 255, .12);

    border-radius: 999px;

    background:
        rgba(255, 255, 255, .06);

    color:
        rgba(255, 255, 255, .8);

    font-size: 12px;
    font-weight: 750;
}

.live-indicator span {
    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: var(--green);

    box-shadow:
        0 0 0 4px
        rgba(38, 217, 128, .12);
}

.browser-shell {
    position: relative;
    z-index: 2;

    overflow: hidden;

    border:
        1px solid
        rgba(255, 255, 255, .13);

    border-radius: 24px;

    background: #fff;

    box-shadow:
        0 35px 80px
        rgba(0, 0, 0, .3);
}

.browser-topbar {
    min-height: 54px;

    display: grid;

    grid-template-columns:
        1fr
        auto
        1fr;

    align-items: center;

    padding:
        0
        18px;

    background: #f7f9fd;

    border-bottom:
        1px solid var(--border);
}

.browser-dots {
    display: flex;
    gap: 6px;
}

.browser-dots i {
    width: 10px;
    height: 10px;

    border-radius: 50%;

    background: #d6dce7;
}

.browser-dots i:first-child {
    background: #ff6b69;
}

.browser-dots i:nth-child(2) {
    background: #ffbf45;
}

.browser-dots i:nth-child(3) {
    background: #31ca67;
}

.browser-room {
    display: inline-flex;
    align-items: center;

    gap: 5px;

    color: var(--navy);

    font-size: 13px;
    font-weight: 850;
}

.room-hash {
    color: var(--blue);
}

.browser-brand {
    justify-self: end;

    color: var(--muted);

    font-size: 11px;
    font-weight: 750;
}

.chat-frame {
    width: 100%;

    overflow: hidden;

    background: #fff;
}

.chat-frame iframe {
    width: 100%;
    height: min(740px, 78vh);

    min-height: 620px;

    display: block;

    border: 0;
}

.chat-note {
    position: relative;
    z-index: 2;

    margin:
        17px
        0
        0;

    color:
        rgba(255, 255, 255, .48);

    text-align: center;

    font-size: 12px;
}


/* ============================================================
   DISCOVER
============================================================ */

.discover-section {
    padding:
        105px
        0;

    background: var(--bg);
}

.discover-intro {
    max-width: 730px;

    margin-bottom: 42px;
}

.discover-intro > p {
    max-width: 610px;

    margin:
        17px
        0
        0;

    color: var(--muted);

    font-size: 17px;
}

.category-grid {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 16px;
}

.category-card {
    min-height: 270px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 24px;

    border:
        1px solid var(--border);

    border-radius: 22px;

    background: #fff;

    text-decoration: none;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.category-card:hover {
    transform:
        translateY(-5px);

    border-color:
        rgba(53, 108, 255, .28);

    box-shadow: var(--shadow);
}

.category-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.category-icon {
    min-width: 47px;
    height: 47px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding:
        0
        10px;

    border-radius: 14px;

    background:
        rgba(53, 108, 255, .09);

    color: var(--blue);

    font-size: 14px;
    font-weight: 900;
}

.category-card.lgtb .category-icon {
    background:
        linear-gradient(
            135deg,
            rgba(139, 97, 255, .14),
            rgba(53, 108, 255, .11)
        );

    color: var(--purple);
}

.category-card.adult .category-icon {
    background:
        rgba(8, 17, 47, .08);

    color: var(--navy);
}

.category-arrow {
    color: #a1aabb;

    font-size: 18px;
}

.category-card h3 {
    margin:
        30px
        0
        0;

    color: var(--navy);

    font-size: 23px;

    letter-spacing: -.03em;
}

.category-card p {
    margin:
        9px
        0
        0;

    color: var(--muted);

    font-size: 14px;
    line-height: 1.6;
}

.category-count {
    margin-top: 25px;

    display: flex;
    align-items: baseline;

    gap: 6px;
}

.category-count strong {
    color: var(--blue);

    font-size: 25px;
}

.category-count span {
    color: var(--muted);

    font-size: 12px;
}


/* ============================================================
   WHY
============================================================ */

.why-section {
    padding:
        20px
        0
        110px;
}

.why-panel {
    display: grid;

    grid-template-columns:
        .9fr
        1.1fr;

    gap: 70px;

    padding:
        56px;

    border-radius: 30px;

    background:
        linear-gradient(
            135deg,
            var(--navy),
            #111f4c
        );

    color: #fff;

    box-shadow: var(--shadow);
}

.why-copy .section-label {
    color: var(--cyan);
}

.why-copy h2 {
    color: #fff;
}

.why-features {
    display: grid;
    gap: 5px;
}

.why-features article {
    display: grid;

    grid-template-columns:
        43px
        1fr;

    gap: 16px;

    padding:
        17px
        0;

    border-bottom:
        1px solid
        rgba(255, 255, 255, .09);
}

.why-features article:last-child {
    border-bottom: 0;
}

.why-features article > span {
    color: var(--cyan);

    font-size: 12px;
    font-weight: 850;
}

.why-features h3 {
    margin: 0;

    font-size: 17px;
}

.why-features p {
    margin:
        5px
        0
        0;

    color:
        rgba(255, 255, 255, .6);

    font-size: 13px;
}


/* ============================================================
   EXISTING LANDING / HUB SUPPORT
============================================================ */

.hero,
.room-head,
.hub-head {
    padding:
        70px
        0
        44px;
}

.room-head,
.hub-head {
    background:
        linear-gradient(
            180deg,
            #fff,
            #f6f8fd
        );

    border-bottom:
        1px solid var(--border);
}

.room-head h1,
.hub-head h1 {
    max-width: 900px;

    margin: 0;

    color: var(--navy);

    font-size:
        clamp(
            42px,
            6vw,
            70px
        );

    line-height: .98;

    letter-spacing: -.055em;
}

.eyebrow {
    margin:
        0
        0
        11px;

    color: var(--blue);

    font-size: 12px;
    font-weight: 850;

    letter-spacing: .12em;
}

.room-intro {
    max-width: 760px;

    margin:
        20px
        0
        0;

    color: var(--muted);

    font-size:
        clamp(
            18px,
            2vw,
            22px
        );

    line-height: 1.55;
}

.breadcrumbs {
    margin-bottom: 27px;

    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 8px;

    color: var(--muted);

    font-size: 13px;
}

.breadcrumbs a {
    color: var(--blue);
    text-decoration: none;
}

.room-category-link {
    margin-top: 20px;

    display: flex;
    gap: 6px;

    color: var(--muted);

    font-size: 13px;
}

.room-category-link a {
    color: var(--blue);

    font-weight: 750;
    text-decoration: none;
}

.draft-content,
.directory {
    padding:
        62px
        0;
}

.content-column {
    max-width: 780px;
}

.content-column h2 {
    margin: 0;

    font-size:
        clamp(
            29px,
            4vw,
            42px
        );

    letter-spacing: -.04em;
}

.content-column p {
    color: var(--muted);

    line-height: 1.75;
}

.draft-badge {
    display: inline-flex;

    padding:
        8px
        12px;

    border-radius: 999px;

    background: var(--bg-soft);

    color: var(--blue) !important;

    font-size: 12px;
    font-weight: 750;
}

.result-count {
    margin-top: 18px;

    color: var(--blue);

    font-weight: 850;
}

.rooms-grid,
.related-grid {
    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 13px;
}

.room-card,
.related-card {
    min-width: 0;

    padding: 18px;

    border:
        1px solid var(--border);

    border-radius: 16px;

    background: #fff;

    text-decoration: none;

    transition:
        transform .15s ease,
        border-color .15s ease,
        box-shadow .15s ease;
}

.room-card:hover,
.related-card:hover {
    transform:
        translateY(-3px);

    border-color:
        rgba(53, 108, 255, .3);

    box-shadow:
        0 12px 30px
        rgba(8, 17, 47, .07);
}

.room-card strong,
.related-card strong {
    display: block;

    color: var(--navy);

    font-size: 16px;
}

.room-card span,
.related-card span {
    display: block;

    margin-top: 6px;

    color: var(--muted);

    font-size: 12px;
}

.related-section {
    padding:
        62px
        0;
}

.back-to-directory {
    padding:
        0
        0
        80px;
}

.directory-button {
    display: inline-flex;

    padding:
        12px
        17px;

    border:
        1px solid var(--border);

    border-radius: 12px;

    background: #fff;

    color: var(--blue);

    text-decoration: none;

    font-size: 13px;
    font-weight: 800;
}

.directory-groups {
    display: grid;

    gap: 70px;
}

.directory-group-head {
    margin-bottom: 21px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 30px;
}

.directory-group-head h2 {
    margin: 0;

    color: var(--navy);

    font-size: 31px;

    letter-spacing: -.035em;
}

.directory-group-head p {
    margin:
        5px
        0
        0;

    color: var(--muted);
}

.directory-group-head > a {
    color: var(--blue);

    font-size: 13px;
    font-weight: 800;
}

.hub-navigation {
    padding:
        0
        0
        90px;
}

.hub-nav-grid {
    display: grid;

    grid-template-columns:
        repeat(
            6,
            minmax(0, 1fr)
        );

    gap: 10px;
}

.hub-nav-grid a {
    padding:
        14px
        11px;

    border:
        1px solid var(--border);

    border-radius: 12px;

    background: #fff;

    text-align: center;
    text-decoration: none;

    font-size: 13px;
    font-weight: 750;
}


/* ============================================================
   FOOTER
============================================================ */

.site-footer {
    padding:
        70px
        0
        24px;

    background: #050b21;
    color: #fff;
}

.footer-main {
    display: grid;

    grid-template-columns:
        1.65fr
        repeat(
            3,
            1fr
        );

    gap: 60px;
}

.footer-logo .brand-dot {
    border-color: #050b21;
}

.footer-logo .brand-copy small {
    color:
        rgba(255, 255, 255, .45);
}

.footer-brand > p {
    max-width: 310px;

    margin:
        22px
        0
        0;

    color:
        rgba(255, 255, 255, .52);

    font-size: 13px;
    line-height: 1.7;
}

.footer-column {
    display: flex;
    flex-direction: column;

    gap: 10px;
}

.footer-column > strong {
    margin-bottom: 5px;

    color: #fff;

    font-size: 13px;
}

.footer-column a {
    color:
        rgba(255, 255, 255, .55);

    text-decoration: none;

    font-size: 13px;

    transition:
        color .15s ease;
}

.footer-column a:hover {
    color: #fff;
}

.footer-bottom {
    margin-top: 58px;

    padding-top: 22px;

    display: flex;
    justify-content: space-between;

    gap: 20px;

    border-top:
        1px solid
        rgba(255, 255, 255, .09);

    color:
        rgba(255, 255, 255, .35);

    font-size: 11px;
}


/* ============================================================
   TABLET
============================================================ */

@media (max-width: 1000px) {

    .menu-toggle {
        display: block;
    }

    .main-nav {
        position: absolute;

        top: calc(100% + 1px);
        left: 20px;
        right: 20px;

        display: none;
        flex-direction: column;
        align-items: stretch;

        gap: 3px;

        padding: 12px;

        border:
            1px solid var(--border);

        border-radius: 16px;

        background: #fff;

        box-shadow:
            0 20px 45px
            rgba(8, 17, 47, .14);
    }

    .main-nav.is-open {
        display: flex;
    }

    .main-nav > a {
        padding:
            12px
            13px;
    }

    .main-nav .nav-cta {
        margin:
            5px
            0
            0;

        text-align: center;
    }

    .hero-layout {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .hero-visual {
        min-height: 460px;
    }

    .category-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .why-panel {
        grid-template-columns: 1fr;

        gap: 35px;
    }

    .rooms-grid,
    .related-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }

    .hub-nav-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }

    .footer-main {
        grid-template-columns:
            1.4fr
            repeat(
                3,
                1fr
            );

        gap: 30px;
    }

}


/* ============================================================
   MOBILE
============================================================ */

@media (max-width: 700px) {

    .container {
        width:
            min(
                100% - 26px,
                1180px
            );
    }

    .header-inner {
        min-height: 68px;
    }

    .brand-mark {
        width: 40px;
        height: 40px;
    }

    .brand-copy strong {
        font-size: 20px;
    }

    .brand-copy small {
        display: none;
    }

    .main-nav {
        left: 13px;
        right: 13px;
    }


    /* HERO */

    .hero-home {
        padding:
            70px
            0
            55px;
    }

    .hero-home h1 {
        font-size:
            clamp(
                47px,
                15vw,
                67px
            );
    }

    .hero-description {
        margin-top: 23px;

        font-size: 18px;
    }

    .hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .button {
        width: 100%;
    }

    .hero-trust {
        gap: 14px;

        justify-content: space-between;
    }

    .hero-trust-separator {
        height: 30px;
    }

    .hero-trust strong {
        font-size: 16px;
    }

    .hero-trust span {
        font-size: 10px;
    }


    /* HERO CHAT CARD */

    .hero-visual {
        min-height: 390px;

        margin-top: 15px;
    }

    .conversation-card {
        width: calc(100% - 10px);

        padding: 19px;

        border-radius: 22px;

        transform: none;
    }

    .orbit-one {
        top: 5px;
        right: 1px;
    }

    .orbit-two {
        left: 0;
        bottom: 5px;
    }

    .orbit-three {
        display: none;
    }


    /* POPULAR */

    .popular-section {
        padding:
            46px
            0;
    }

    .section-title-row {
        align-items: flex-start;
        flex-direction: column;

        gap: 14px;
    }

    .popular-scroll {
        width: calc(
            100vw - 13px
        );

        margin-right: -13px;

        flex-wrap: nowrap;

        overflow-x: auto;

        padding-right: 13px;
        padding-bottom: 5px;

        scrollbar-width: none;
    }

    .popular-scroll::-webkit-scrollbar {
        display: none;
    }

    .popular-pill {
        flex: 0 0 auto;
    }


    /* CHAT */

    .live-chat-section {
        padding:
            64px
            0
            72px;
    }

    .browser-shell {
        border-radius: 15px;
    }

    .browser-topbar {
        min-height: 47px;

        grid-template-columns:
            auto
            1fr;

        gap: 10px;

        padding:
            0
            12px;
    }

    .browser-room {
        justify-self: end;
    }

    .browser-brand {
        display: none;
    }

    .chat-frame iframe {
        height: 72vh;
        min-height: 560px;
    }


    /* DISCOVER */

    .discover-section {
        padding:
            75px
            0;
    }

    .category-grid {
        grid-template-columns: 1fr;
    }

    .category-card {
        min-height: 220px;
    }


    /* WHY */

    .why-section {
        padding:
            0
            0
            75px;
    }

    .why-panel {
        padding:
            34px
            24px;

        border-radius: 22px;
    }


    /* LANDINGS */

    .room-head,
    .hub-head {
        padding:
            48px
            0
            35px;
    }

    .room-head h1,
    .hub-head h1 {
        font-size:
            clamp(
                40px,
                13vw,
                58px
            );
    }

    .rooms-grid,
    .related-grid {
        grid-template-columns: 1fr;
    }

    .directory-group-head {
        align-items: flex-start;
        flex-direction: column;

        gap: 8px;
    }

    .hub-nav-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    /* FOOTER */

    .site-footer {
        padding-top: 52px;
    }

    .footer-main {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            38px
            25px;
    }

    .footer-brand {
        grid-column:
            1
            / -1;
    }

    .footer-bottom {
        align-items: flex-start;
        flex-direction: column;

        margin-top: 40px;
    }

}


/* ============================================================
   VERY SMALL
============================================================ */

@media (max-width: 420px) {

    .footer-main {
        grid-template-columns: 1fr;
    }

    .footer-brand {
        grid-column: auto;
    }

}

/* ESRED HOME V2 START */

.esred-home{
    background:
        radial-gradient(circle at top left, rgba(93, 109, 255, .14), transparent 28%),
        radial-gradient(circle at top right, rgba(46, 211, 255, .12), transparent 22%),
        #f6f8ff;
    color:#0a1330;
}

.esred-home,
.esred-home h1,
.esred-home h2,
.esred-home h3,
.esred-home h4,
.esred-home p,
.esred-home a,
.esred-home button,
.esred-home input{
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.esred-home .container{
    width:min(1180px, calc(100% - 32px));
    margin:0 auto;
}

.esred-eyebrow{
    display:inline-block;
    font-size:.76rem;
    letter-spacing:.14em;
    font-weight:800;
    color:#4e6bff;
    text-transform:uppercase;
    margin-bottom:14px;
}

.esred-hero{
    padding:72px 0 42px;
}

.esred-hero-grid{
    display:grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
    gap:48px;
    align-items:center;
}

.esred-hero-copy h1{
    margin:0 0 18px;
    font-size: clamp(2.5rem, 5vw, 5rem);
    line-height:.96;
    letter-spacing:-.055em;
    font-weight:900;
    max-width: 700px;
    color:#0a1330;
}

.esred-hero-copy h1 span{
    display:block;
    color:#596dff;
}

.esred-lead{
    max-width:680px;
    font-size:1.12rem;
    line-height:1.8;
    color:#57617c;
    margin:0 0 26px;
}

.esred-lead strong{
    color:#0a1330;
}

.esred-hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin:0 0 28px;
}

.esred-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:54px;
    padding:0 24px;
    border-radius:16px;
    font-weight:800;
    text-decoration:none;
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.esred-btn:hover{
    transform:translateY(-2px);
}

.esred-btn-primary{
    background:linear-gradient(135deg, #4f6fff 0%, #3858f5 100%);
    color:#fff;
    box-shadow:0 16px 40px rgba(56, 88, 245, .24);
}

.esred-btn-secondary{
    background:#fff;
    color:#0a1330;
    border:1px solid rgba(10, 19, 48, .12);
    box-shadow:0 10px 24px rgba(13, 25, 60, .06);
}

.esred-kpis{
    display:flex;
    flex-wrap:wrap;
    gap:24px;
}

.esred-kpi{
    min-width:88px;
    padding-right:20px;
    border-right:1px solid rgba(10, 19, 48, .10);
}

.esred-kpi:last-child{
    border-right:0;
    padding-right:0;
}

.esred-kpi strong{
    display:block;
    font-size:1.35rem;
    line-height:1;
    font-weight:900;
    color:#0a1330;
    margin-bottom:6px;
}

.esred-kpi span{
    display:block;
    font-size:.92rem;
    color:#68738f;
}

.esred-hero-visual{
    position:relative;
}

.esred-chat-preview{
    position:relative;
    background:linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(245,248,255,.98) 100%);
    border:1px solid rgba(89, 109, 255, .10);
    border-radius:28px;
    box-shadow:0 26px 70px rgba(16, 30, 84, .12);
    overflow:hidden;
    padding:0;
}

.esred-chat-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:16px 18px;
    border-bottom:1px solid rgba(10, 19, 48, .08);
    background:rgba(255,255,255,.82);
}

.esred-chat-dots{
    display:flex;
    gap:6px;
}

.esred-chat-dots span{
    width:10px;
    height:10px;
    border-radius:999px;
    display:block;
    background:#d7deef;
}

.esred-chat-dots span:nth-child(1){background:#ff7b78;}
.esred-chat-dots span:nth-child(2){background:#ffd15f;}
.esred-chat-dots span:nth-child(3){background:#44d37f;}

.esred-chat-room{
    font-weight:900;
    color:#0a1330;
}

.esred-chat-state{
    font-size:.85rem;
    color:#4ea56c;
    font-weight:700;
}

.esred-chat-body{
    padding:22px 20px 8px;
    display:flex;
    flex-direction:column;
    gap:18px;
    min-height:270px;
}

.esred-msg{
    display:flex;
    align-items:flex-start;
    gap:12px;
}

.esred-msg.right{
    justify-content:flex-end;
}

.esred-msg .avatar{
    width:38px;
    height:38px;
    border-radius:999px;
    display:grid;
    place-items:center;
    font-size:.92rem;
    font-weight:800;
    color:#fff;
    background:linear-gradient(135deg, #7a70ff 0%, #ff61c7 100%);
    flex:0 0 38px;
}

.esred-msg .avatar.alt{
    background:linear-gradient(135deg, #3f6dff 0%, #2ec7ff 100%);
}

.esred-msg .avatar.dark{
    background:#0b1535;
}

.esred-msg .bubble{
    max-width:300px;
    background:#f1f4fb;
    border-radius:18px;
    padding:14px 16px;
    box-shadow:0 10px 26px rgba(10, 19, 48, .05);
}

.esred-msg .bubble strong{
    display:block;
    font-size:.9rem;
    color:#0a1330;
    margin-bottom:6px;
}

.esred-msg .bubble p{
    margin:0;
    font-size:.98rem;
    line-height:1.5;
    color:#51607e;
}

.esred-chat-input{
    border-top:1px solid rgba(10, 19, 48, .08);
    padding:16px 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    background:#fff;
}

.esred-chat-input span{
    color:#97a1bc;
}

.esred-chat-input button{
    width:42px;
    height:42px;
    border-radius:14px;
    border:0;
    cursor:pointer;
    background:linear-gradient(135deg, #4f6fff 0%, #3858f5 100%);
    color:#fff;
    font-size:1rem;
    font-weight:900;
    box-shadow:0 12px 28px rgba(56, 88, 245, .25);
}

.esred-float-badge{
    position:absolute;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:0 14px;
    border-radius:999px;
    background:#fff;
    color:#0b1535;
    border:1px solid rgba(10, 19, 48, .08);
    box-shadow:0 12px 24px rgba(10, 19, 48, .08);
    font-size:.84rem;
    font-weight:800;
}

.esred-float-badge.top{ top:18px; right:-18px; }
.esred-float-badge.mid{ top:95px; left:-16px; }
.esred-float-badge.low{ bottom:26px; left:-10px; }

.esred-popular-strip{
    padding:12px 0 48px;
}

.esred-section-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:18px;
    margin-bottom:22px;
}

.esred-section-head.inline h2,
.esred-section-head h2{
    margin:0;
    font-size:clamp(2rem, 3vw, 3rem);
    line-height:1.02;
    letter-spacing:-.045em;
    font-weight:900;
    color:#0a1330;
}

.esred-section-head p{
    margin:10px 0 0;
    color:#66738e;
    font-size:1.02rem;
}

.esred-more-link{
    color:#4f6fff;
    font-weight:800;
    text-decoration:none;
    white-space:nowrap;
}

.esred-chip-grid{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.esred-chip{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-height:46px;
    padding:0 16px;
    border-radius:999px;
    text-decoration:none;
    background:#fff;
    border:1px solid rgba(10, 19, 48, .08);
    box-shadow:0 10px 18px rgba(18, 28, 67, .05);
    color:#213057;
    font-weight:700;
}

.esred-chip .dot{
    width:9px;
    height:9px;
    border-radius:999px;
    background:#39d98a;
    box-shadow:0 0 0 4px rgba(57, 217, 138, .12);
}

.esred-live{
    padding:34px 0 52px;
}

.esred-live-wrap{
    background:linear-gradient(135deg, #07133c 0%, #0d1f68 100%);
    border-radius:34px;
    padding:34px;
    box-shadow:0 28px 70px rgba(7, 19, 60, .18);
    display:grid;
    grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
    gap:30px;
    align-items:start;
}

.esred-live-copy h2{
    color:#fff;
    margin:0 0 14px;
    font-size:clamp(2rem, 3vw, 3.4rem);
    line-height:1.02;
    letter-spacing:-.045em;
    font-weight:900;
}

.esred-live-copy p{
    margin:0 0 20px;
    font-size:1.04rem;
    line-height:1.8;
    color:rgba(255,255,255,.78);
}

.esred-live-list{
    padding:0;
    margin:0;
    list-style:none;
    display:flex;
    flex-direction:column;
    gap:12px;
}

.esred-live-list li{
    position:relative;
    padding-left:26px;
    color:#dce5ff;
    line-height:1.6;
}

.esred-live-list li::before{
    content:"";
    width:10px;
    height:10px;
    border-radius:999px;
    background:#39d98a;
    position:absolute;
    left:0;
    top:.5em;
}

.esred-live-frame{
    background:#fff;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 18px 40px rgba(0, 0, 0, .12);
    min-height:560px;
}

.esred-frame-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:16px 18px;
    border-bottom:1px solid rgba(10, 19, 48, .08);
    font-weight:800;
    color:#0a1330;
}

.esred-frame-top span{
    font-size:.85rem;
    font-weight:700;
    color:#677590;
}

.esred-live-frame iframe{
    display:block;
    width:100%;
    min-height:500px;
    border:0;
    background:#fff;
}

.esred-categories{
    padding:24px 0 56px;
}

.esred-category-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:20px;
}

.esred-category-card{
    background:rgba(255,255,255,.88);
    border:1px solid rgba(10, 19, 48, .08);
    border-radius:24px;
    box-shadow:0 18px 44px rgba(16, 30, 84, .06);
    padding:24px;
    display:flex;
    flex-direction:column;
    gap:18px;
    min-height:230px;
}

.esred-category-icon{
    width:54px;
    height:54px;
    border-radius:18px;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg, rgba(79,111,255,.15) 0%, rgba(46,199,255,.14) 100%);
    color:#4f6fff;
    font-size:.92rem;
    font-weight:900;
}

.esred-category-content h3{
    margin:0 0 10px;
    font-size:1.5rem;
    line-height:1.12;
    font-weight:900;
    color:#0a1330;
}

.esred-category-content p{
    margin:0;
    font-size:.98rem;
    line-height:1.7;
    color:#66738e;
}

.esred-category-bottom{
    margin-top:auto;
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.esred-category-bottom strong{
    font-size:1.6rem;
    color:#4f6fff;
    line-height:1;
    font-weight:900;
}

.esred-category-bottom span{
    color:#7e89a4;
    font-weight:700;
    margin-right:auto;
}

.esred-category-bottom a{
    text-decoration:none;
    font-weight:800;
    color:#0a1330;
}

.esred-benefits{
    padding:18px 0 56px;
}

.esred-benefits-panel{
    background:linear-gradient(135deg, #07133c 0%, #081a58 70%, #1130a3 100%);
    border-radius:32px;
    padding:36px;
    display:grid;
    grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
    gap:28px;
    align-items:start;
    box-shadow:0 26px 60px rgba(7, 19, 60, .16);
}

.esred-benefits-copy h2{
    margin:0;
    color:#fff;
    font-size:clamp(2rem, 3vw, 3.4rem);
    line-height:1.02;
    letter-spacing:-.045em;
    font-weight:900;
}

.esred-benefits-list{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.benefit-item{
    display:grid;
    grid-template-columns:54px 1fr;
    gap:16px;
    align-items:start;
    padding-bottom:18px;
    border-bottom:1px solid rgba(255,255,255,.12);
}

.benefit-item:last-child{
    border-bottom:0;
    padding-bottom:0;
}

.benefit-item > span{
    color:#1de0ff;
    font-size:.92rem;
    font-weight:900;
}

.benefit-item strong{
    display:block;
    color:#fff;
    font-size:1.15rem;
    margin-bottom:6px;
}

.benefit-item p{
    margin:0;
    color:rgba(255,255,255,.78);
    line-height:1.7;
}

.esred-final-cta{
    padding:6px 0 82px;
}

.esred-final-card{
    background:linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(247,249,255,.98) 100%);
    border:1px solid rgba(10, 19, 48, .08);
    border-radius:30px;
    padding:36px;
    box-shadow:0 20px 48px rgba(16, 30, 84, .08);
    text-align:center;
}

.esred-final-card h2{
    margin:0 0 14px;
    font-size:clamp(2rem, 3vw, 3.2rem);
    line-height:1.02;
    letter-spacing:-.045em;
    font-weight:900;
    color:#0a1330;
}

.esred-final-card p{
    max-width:700px;
    margin:0 auto 24px;
    color:#66738e;
    font-size:1.04rem;
    line-height:1.8;
}

@media (max-width: 1100px){
    .esred-hero-grid,
    .esred-live-wrap,
    .esred-benefits-panel{
        grid-template-columns:1fr;
    }

    .esred-hero{
        padding-top:54px;
    }

    .esred-float-badge.top{
        right:10px;
    }

    .esred-float-badge.mid,
    .esred-float-badge.low{
        left:10px;
    }
}

@media (max-width: 860px){
    .esred-category-grid{
        grid-template-columns:1fr 1fr;
    }

    .esred-live-frame{
        min-height:480px;
    }

    .esred-live-frame iframe{
        min-height:420px;
    }
}

@media (max-width: 640px){
    .esred-home .container{
        width:min(100% - 22px, 100%);
    }

    .esred-hero{
        padding:38px 0 28px;
    }

    .esred-lead{
        font-size:1rem;
    }

    .esred-kpis{
        gap:14px;
    }

    .esred-kpi{
        border-right:0;
        padding-right:0;
        min-width:unset;
    }

    .esred-section-head,
    .esred-section-head.inline{
        flex-direction:column;
        align-items:flex-start;
    }

    .esred-category-grid{
        grid-template-columns:1fr;
    }

    .esred-live-wrap,
    .esred-benefits-panel,
    .esred-final-card{
        padding:22px;
    }

    .esred-chat-preview{
        border-radius:22px;
    }

    .esred-chat-body{
        min-height:220px;
    }

    .esred-msg .bubble{
        max-width:250px;
    }

    .esred-float-badge{
        display:none;
    }
}

/* ESRED HOME V2 END */

/* ESRED ROOMS HUBS V2 START */

.esred-room-v2,
.esred-hub-v2{
    background:#f6f8ff;
    color:#0a1330;
}

.roomv2-breadcrumbs{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:9px;
    margin:0 0 30px;
    color:#8a94aa;
    font-size:.84rem;
}

.roomv2-breadcrumbs a{
    color:#526aff;
    font-weight:700;
    text-decoration:none;
}


/* ROOM HERO */

.roomv2-hero{
    padding:58px 0 68px;
    background:
        radial-gradient(circle at 88% 10%,rgba(92,104,255,.16),transparent 28%),
        radial-gradient(circle at 5% 85%,rgba(39,204,255,.10),transparent 28%),
        linear-gradient(180deg,#fff 0%,#f5f7ff 100%);
    border-bottom:1px solid rgba(10,19,48,.06);
}

.roomv2-hero-grid{
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(290px,.75fr);
    gap:55px;
    align-items:center;
}

.roomv2-copy h1{
    max-width:850px;
    margin:0;
    color:#08112f;
    font-size:clamp(3rem,6vw,5.4rem);
    line-height:.95;
    letter-spacing:-.06em;
    font-weight:900;
}

.roomv2-lead{
    max-width:760px;
    margin:23px 0 0;
    color:#65718a;
    font-size:1.12rem;
    line-height:1.8;
}

.roomv2-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:29px;
}

.roomv2-benefits{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:18px;
    margin-top:26px;
    color:#647088;
    font-size:.85rem;
    font-weight:700;
}

.roomv2-benefits > span{
    display:inline-flex;
    align-items:center;
    gap:7px;
}

.roomv2-benefits i{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#39da88;
    box-shadow:0 0 0 4px rgba(57,218,136,.11);
}

.roomv2-adult{
    padding:5px 9px;
    border-radius:999px;
    background:#0b1535;
    color:#fff;
}


/* ROOM SIDE */

.roomv2-side{
    padding:27px;
    border:1px solid rgba(10,19,48,.08);
    border-radius:26px;
    background:rgba(255,255,255,.92);
    box-shadow:0 24px 65px rgba(17,31,87,.10);
}

.roomv2-side-label{
    display:block;
    margin-bottom:12px;
    color:#818ca3;
    font-size:.7rem;
    font-weight:850;
    letter-spacing:.14em;
}

.roomv2-channel{
    overflow-wrap:anywhere;
    color:#08112f;
    font-size:clamp(2rem,4vw,3.1rem);
    line-height:1;
    letter-spacing:-.05em;
    font-weight:900;
}

.roomv2-channel b{
    margin-right:4px;
    color:#546cff;
}

.roomv2-side p{
    margin:19px 0;
    color:#69758d;
    line-height:1.7;
}

.roomv2-side > a{
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 16px;
    border-radius:14px;
    background:#eef1ff;
    color:#405cf0;
    text-decoration:none;
    font-weight:800;
}


/* CHAT */

.roomv2-chat{
    padding:70px 0;
    background:
        radial-gradient(circle at 90% 10%,rgba(57,88,255,.22),transparent 32%),
        #071132;
    color:#fff;
}

.roomv2-chat .esred-eyebrow{
    color:#28d8e8;
}

.roomv2-chat-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:25px;
    margin-bottom:25px;
}

.roomv2-chat-heading h2{
    margin:0;
    color:#fff;
    font-size:clamp(2rem,4vw,3.5rem);
    line-height:1;
    letter-spacing:-.045em;
    font-weight:900;
}

.roomv2-online{
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 13px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:999px;
    background:rgba(255,255,255,.06);
    color:rgba(255,255,255,.76);
    font-size:.8rem;
    font-weight:700;
}

.roomv2-online span{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#38db89;
    box-shadow:0 0 0 4px rgba(56,219,137,.12);
}

.roomv2-browser{
    overflow:hidden;
    border:1px solid rgba(255,255,255,.11);
    border-radius:25px;
    background:#fff;
    box-shadow:0 34px 85px rgba(0,0,0,.28);
}

.roomv2-browser-top{
    min-height:54px;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:15px;
    padding:0 18px;
    border-bottom:1px solid #e3e8f0;
    background:#f8f9fc;
    color:#111a31;
}

.roomv2-dots{
    display:flex;
    gap:6px;
}

.roomv2-dots i{
    width:10px;
    height:10px;
    border-radius:50%;
    background:#d4dae5;
}

.roomv2-dots i:first-child{background:#ff706e;}
.roomv2-dots i:nth-child(2){background:#ffc44d;}
.roomv2-dots i:nth-child(3){background:#38cd72;}

.roomv2-browser-top strong{
    font-size:.88rem;
}

.roomv2-browser-top > span{
    justify-self:end;
    color:#7d879c;
    font-size:.73rem;
    font-weight:700;
}

.roomv2-browser iframe{
    display:block;
    width:100%;
    height:min(760px,78vh);
    min-height:620px;
    border:0;
}


/* STEPS */

.roomv2-simple{
    padding:76px 0 48px;
}

.roomv2-steps{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:17px;
}

.roomv2-steps article{
    min-height:210px;
    padding:25px;
    border:1px solid rgba(10,19,48,.08);
    border-radius:22px;
    background:#fff;
    box-shadow:0 14px 36px rgba(16,30,84,.045);
}

.roomv2-steps article > span{
    color:#5670ff;
    font-size:.77rem;
    font-weight:900;
}

.roomv2-steps h3{
    margin:34px 0 8px;
    color:#08112f;
    font-size:1.3rem;
    font-weight:900;
}

.roomv2-steps p{
    margin:0;
    color:#69758e;
    line-height:1.7;
}


/* RELATED */

.roomv2-related{
    padding:42px 0 72px;
}

.roomv2-related-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:13px;
}

.roomv2-related-card{
    min-width:0;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:17px;
    border:1px solid rgba(10,19,48,.08);
    border-radius:17px;
    background:#fff;
    box-shadow:0 10px 28px rgba(12,25,70,.04);
    text-decoration:none;
    transition:.16s ease;
}

.roomv2-related-card:hover{
    transform:translateY(-3px);
    border-color:rgba(80,106,255,.28);
    box-shadow:0 14px 32px rgba(12,25,70,.08);
}

.roomv2-hash{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:#edf1ff;
    color:#5068ff;
    font-weight:900;
}

.roomv2-related-card strong{
    display:block;
    overflow:hidden;
    color:#101934;
    font-size:.92rem;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.roomv2-related-card small{
    display:block;
    overflow:hidden;
    margin-top:4px;
    color:#8993a8;
    font-size:.71rem;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.roomv2-related-card > b{
    color:#6074ff;
}


/* EDITORIAL */

.roomv2-editorial{
    padding:0 0 90px;
}

.roomv2-editorial-box{
    display:grid;
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    gap:50px;
    padding:35px;
    border:1px solid rgba(10,19,48,.07);
    border-radius:28px;
    background:linear-gradient(135deg,#fff,#f1f4ff);
}

.roomv2-editorial-box h2{
    margin:0;
    color:#08112f;
    font-size:clamp(2rem,3vw,3rem);
    line-height:1;
    letter-spacing:-.04em;
    font-weight:900;
}

.roomv2-editorial-box > p{
    align-self:center;
    margin:0;
    color:#68748d;
    line-height:1.8;
}


/* HUB HERO */

.hubv2-hero{
    padding:58px 0 67px;
    background:
        radial-gradient(circle at 90% 5%,rgba(89,105,255,.17),transparent 29%),
        linear-gradient(180deg,#fff,#f4f6ff);
    border-bottom:1px solid rgba(10,19,48,.06);
}

.hubv2-hero-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end;
    gap:45px;
}

.hubv2-hero h1{
    max-width:850px;
    margin:0;
    color:#08112f;
    font-size:clamp(3rem,6vw,5.3rem);
    line-height:.95;
    letter-spacing:-.06em;
    font-weight:900;
}

.hubv2-hero p{
    max-width:760px;
    margin:23px 0 0;
    color:#68748d;
    font-size:1.1rem;
    line-height:1.8;
}

.hubv2-counter{
    min-width:195px;
    padding:25px;
    border-radius:24px;
    background:#081334;
    color:#fff;
    box-shadow:0 20px 48px rgba(8,19,52,.15);
}

.hubv2-counter strong{
    display:block;
    color:#7180ff;
    font-size:3rem;
    line-height:1;
    font-weight:900;
    letter-spacing:-.05em;
}

.hubv2-counter span{
    display:block;
    margin-top:8px;
    color:rgba(255,255,255,.66);
    font-size:.84rem;
}


/* HUB DIRECTORY */

.hubv2-directory{
    padding:69px 0;
}

.hubv2-tools{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
}

.hubv2-tools h2,
.hubv2-explore h2{
    margin:0;
    color:#08112f;
    font-size:clamp(2rem,3.5vw,3.2rem);
    line-height:1;
    letter-spacing:-.045em;
    font-weight:900;
}

.hubv2-search{
    width:min(100%,360px);
    display:flex;
    flex-direction:column;
    gap:7px;
}

.hubv2-search > span{
    color:#7d879e;
    font-size:.7rem;
    font-weight:850;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.hubv2-search input{
    width:100%;
    height:50px;
    padding:0 16px;
    border:1px solid rgba(10,19,48,.11);
    border-radius:14px;
    outline:0;
    background:#fff;
    color:#111a31;
    box-shadow:0 8px 24px rgba(11,24,66,.04);
}

.hubv2-search input:focus{
    border-color:#6075ff;
    box-shadow:0 0 0 4px rgba(96,117,255,.09);
}

.hubv2-results{
    margin:22px 0 24px;
    color:#8993a8;
    font-size:.85rem;
}

.hubv2-results strong{
    color:#526aff;
}

.hubv2-room-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}

.hubv2-room{
    min-width:0;
    min-height:83px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:15px;
    border:1px solid rgba(10,19,48,.08);
    border-radius:17px;
    background:#fff;
    box-shadow:0 8px 24px rgba(13,27,75,.035);
    text-decoration:none;
    transition:.16s ease;
}

.hubv2-room:hover{
    transform:translateY(-3px);
    border-color:rgba(82,107,255,.28);
    box-shadow:0 14px 32px rgba(13,27,75,.08);
}

.hubv2-hash{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:#edf1ff;
    color:#536bff;
    font-weight:900;
}

.hubv2-room strong{
    display:block;
    overflow:hidden;
    color:#111a31;
    font-size:.92rem;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.hubv2-room small{
    display:block;
    overflow:hidden;
    margin-top:4px;
    color:#8a94a9;
    font-size:.7rem;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.hubv2-room > b{
    color:#667aff;
}

.hubv2-groups{
    display:grid;
    gap:64px;
}

.hubv2-group-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:21px;
}

.hubv2-group-head > div > span{
    color:#566eff;
    font-size:.71rem;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.hubv2-group-head h2{
    margin:5px 0 4px;
    color:#08112f;
    font-size:2rem;
    letter-spacing:-.035em;
}

.hubv2-group-head p{
    margin:0;
    color:#7c879e;
}

.hubv2-group-head > a{
    color:#526aff;
    font-size:.83rem;
    font-weight:800;
    text-decoration:none;
}

.hubv2-empty{
    padding:40px 0;
    text-align:center;
    color:#7b869d;
}


/* HUB CATEGORY LINKS */

.hubv2-explore{
    padding:5px 0 90px;
}

.hubv2-explore h2{
    margin-bottom:27px;
}

.hubv2-category-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:13px;
}

.hubv2-category-grid a{
    position:relative;
    min-height:145px;
    display:flex;
    flex-direction:column;
    padding:21px;
    border:1px solid rgba(10,19,48,.08);
    border-radius:20px;
    background:#fff;
    box-shadow:0 10px 28px rgba(13,27,75,.04);
    text-decoration:none;
}

.hubv2-category-grid strong{
    color:#101934;
    font-size:1.17rem;
}

.hubv2-category-grid span{
    max-width:240px;
    margin-top:8px;
    color:#7b869d;
    font-size:.83rem;
    line-height:1.55;
}

.hubv2-category-grid b{
    position:absolute;
    right:20px;
    bottom:18px;
    color:#5a70ff;
}


/* SILO VARIATIONS */

.silo-lgtb .roomv2-hero{
    background:
        radial-gradient(circle at 88% 10%,rgba(213,73,255,.13),transparent 28%),
        radial-gradient(circle at 8% 85%,rgba(47,193,255,.11),transparent 28%),
        linear-gradient(180deg,#fff,#f7f5ff);
}

.silo-adultos .roomv2-hero{
    background:
        radial-gradient(circle at 88% 10%,rgba(118,64,255,.17),transparent 29%),
        linear-gradient(180deg,#fff,#f6f3ff);
}


/* RESPONSIVE */

@media(max-width:1050px){

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

    .roomv2-side{
        max-width:620px;
    }

    .roomv2-related-grid,
    .hubv2-room-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

}

@media(max-width:820px){

    .hubv2-hero-grid{
        grid-template-columns:1fr;
        align-items:start;
    }

    .hubv2-counter{
        width:100%;
        min-width:0;
    }

    .hubv2-tools{
        align-items:flex-start;
        flex-direction:column;
    }

    .hubv2-search{
        width:100%;
        max-width:none;
    }

    .roomv2-related-grid,
    .hubv2-room-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .roomv2-steps,
    .hubv2-category-grid{
        grid-template-columns:1fr;
    }

    .roomv2-editorial-box{
        grid-template-columns:1fr;
        gap:20px;
    }

}

@media(max-width:620px){

    .roomv2-hero,
    .hubv2-hero{
        padding:38px 0 48px;
    }

    .roomv2-copy h1,
    .hubv2-hero h1{
        font-size:clamp(2.7rem,14vw,4.15rem);
    }

    .roomv2-lead,
    .hubv2-hero p{
        font-size:1rem;
    }

    .roomv2-actions{
        flex-direction:column;
    }

    .roomv2-actions .esred-btn{
        width:100%;
    }

    .roomv2-chat{
        padding:47px 0;
    }

    .roomv2-chat-heading{
        align-items:flex-start;
        flex-direction:column;
    }

    .roomv2-browser{
        border-radius:16px;
    }

    .roomv2-browser-top{
        grid-template-columns:auto 1fr;
    }

    .roomv2-browser-top strong{
        justify-self:end;
    }

    .roomv2-browser-top > span{
        display:none;
    }

    .roomv2-browser iframe{
        height:72vh;
        min-height:560px;
    }

    .roomv2-related-grid,
    .hubv2-room-grid{
        grid-template-columns:1fr;
    }

    .hubv2-group-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .hubv2-directory{
        padding:49px 0;
    }

}

/* ESRED ROOMS HUBS V2 END */

/* ESRED WEBCHAT V3 START */

.esred-webchat-v3{
    position:relative;
    overflow:hidden;
    padding:82px 0 84px;
    background:
        radial-gradient(
            circle at 85% 0%,
            rgba(67,92,255,.30),
            transparent 32%
        ),
        radial-gradient(
            circle at 10% 100%,
            rgba(26,210,229,.12),
            transparent 30%
        ),
        #071132;
    color:#fff;
}

.esred-webchat-v3::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.025),
            transparent 30%
        );
}


.webchat-v3-heading{
    position:relative;
    z-index:2;

    display:flex;
    align-items:flex-end;
    justify-content:space-between;

    gap:45px;

    margin-bottom:34px;
}


.webchat-v3-copy{
    max-width:760px;
}


.esred-webchat-v3 .esred-eyebrow{
    color:#28dbea;
}


.webchat-v3-copy h2{
    margin:0;

    color:#fff;

    font-size:
        clamp(
            2.7rem,
            5vw,
            4.8rem
        );

    line-height:.95;

    letter-spacing:-.055em;

    font-weight:900;
}


.webchat-v3-copy h2 span{
    display:block;

    color:#7f91ff;
}


.webchat-v3-copy p{
    max-width:670px;

    margin:
        21px
        0
        0;

    color:
        rgba(255,255,255,.69);

    font-size:1.06rem;

    line-height:1.8;
}


.webchat-v3-actions{
    flex:0 0 auto;

    display:flex;
    flex-direction:column;

    align-items:flex-end;

    gap:12px;
}


.webchat-v3-status{
    display:inline-flex;
    align-items:center;

    gap:9px;

    padding:
        9px
        14px;

    border:
        1px solid
        rgba(255,255,255,.12);

    border-radius:999px;

    background:
        rgba(255,255,255,.07);

    color:
        rgba(255,255,255,.8);

    font-size:.8rem;
    font-weight:750;
}


.webchat-v3-status > span{
    width:8px;
    height:8px;

    border-radius:50%;

    background:#39dd8a;

    box-shadow:
        0 0 0 4px
        rgba(57,221,138,.13);
}


.webchat-v3-other{
    display:inline-flex;
    align-items:center;

    gap:10px;

    color:#fff;

    text-decoration:none;

    font-size:.86rem;
    font-weight:800;
}


.webchat-v3-other b{
    color:#7d91ff;

    font-size:1rem;
}


/* ============================================================
   WEBCHAT PRINCIPAL
============================================================ */

.webchat-v3-browser{
    position:relative;
    z-index:2;

    width:100%;

    overflow:hidden;

    border:
        1px solid
        rgba(255,255,255,.14);

    border-radius:28px;

    background:#fff;

    box-shadow:
        0 35px 100px
        rgba(0,0,0,.34);
}


.webchat-v3-toolbar{
    min-height:58px;

    display:grid;

    grid-template-columns:
        1fr
        auto
        1fr;

    align-items:center;

    gap:20px;

    padding:
        0
        20px;

    border-bottom:
        1px solid
        #e1e6ef;

    background:#f8f9fd;

    color:#101934;
}


.webchat-v3-dots{
    display:flex;

    gap:7px;
}


.webchat-v3-dots i{
    width:11px;
    height:11px;

    border-radius:50%;

    background:#d6dce6;
}


.webchat-v3-dots i:first-child{
    background:#ff706c;
}


.webchat-v3-dots i:nth-child(2){
    background:#ffc64e;
}


.webchat-v3-dots i:nth-child(3){
    background:#38cc70;
}


.webchat-v3-room{
    display:flex;
    align-items:center;

    gap:5px;

    font-size:.93rem;
    font-weight:900;
}


.webchat-v3-room span{
    color:#5570ff;
}


.webchat-v3-brand{
    justify-self:end;

    color:#818ba0;

    font-size:.75rem;
}


.webchat-v3-brand strong{
    color:#101934;
}


.webchat-v3-frame{
    width:100%;

    background:#fff;
}


.webchat-v3-frame iframe{
    display:block;

    width:100%;

    height:760px;

    border:0;

    background:#fff;
}


/* ============================================================
   BENEFICIOS BAJO CHAT
============================================================ */

.webchat-v3-features{
    position:relative;
    z-index:2;

    display:grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0,1fr)
        );

    margin-top:22px;

    overflow:hidden;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius:20px;

    background:
        rgba(255,255,255,.045);
}


.webchat-v3-features > div{
    min-width:0;

    display:grid;

    grid-template-columns:
        auto
        1fr;

    column-gap:11px;

    padding:
        18px
        20px;

    border-right:
        1px solid
        rgba(255,255,255,.08);
}


.webchat-v3-features > div:last-child{
    border-right:0;
}


.webchat-v3-features .check{
    grid-row:
        1
        / 3;

    width:29px;
    height:29px;

    display:grid;
    place-items:center;

    border-radius:50%;

    background:
        rgba(55,218,136,.13);

    color:#3ee193;

    font-size:.78rem;

    font-weight:900;
}


.webchat-v3-features strong{
    color:#fff;

    font-size:.86rem;
}


.webchat-v3-features small{
    margin-top:2px;

    color:
        rgba(255,255,255,.48);

    font-size:.72rem;
}


/* ============================================================
   TABLET
============================================================ */

@media(max-width:900px){

    .webchat-v3-heading{
        align-items:flex-start;
        flex-direction:column;

        gap:24px;
    }


    .webchat-v3-actions{
        align-items:flex-start;

        flex-direction:row;

        flex-wrap:wrap;
    }


    .webchat-v3-features{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }


    .webchat-v3-features > div:nth-child(2){
        border-right:0;
    }


    .webchat-v3-features > div:nth-child(-n+2){
        border-bottom:
            1px solid
            rgba(255,255,255,.08);
    }

}


/* ============================================================
   MOBILE
============================================================ */

@media(max-width:620px){

    .esred-webchat-v3{
        padding:
            58px
            0
            62px;
    }


    .webchat-v3-copy h2{
        font-size:
            clamp(
                2.5rem,
                13vw,
                3.6rem
            );
    }


    .webchat-v3-copy p{
        font-size:.98rem;
    }


    .webchat-v3-actions{
        flex-direction:column;

        align-items:flex-start;
    }


    .webchat-v3-browser{
        border-radius:17px;
    }


    .webchat-v3-toolbar{
        min-height:49px;

        grid-template-columns:
            auto
            1fr;

        padding:
            0
            13px;
    }


    .webchat-v3-room{
        justify-self:end;
    }


    .webchat-v3-brand{
        display:none;
    }


    .webchat-v3-frame iframe{
        height:76vh;

        min-height:650px;
    }


    .webchat-v3-features{
        grid-template-columns:1fr;
    }


    .webchat-v3-features > div{
        border-right:0;

        border-bottom:
            1px solid
            rgba(255,255,255,.08);
    }


    .webchat-v3-features > div:last-child{
        border-bottom:0;
    }

}

/* ESRED WEBCHAT V3 END */

/* ESRED EDITORIAL CONTENT V1 START */

.roomseo-content{
    padding:78px 0 28px;
    background:#fff;
}

.roomseo-article{
    width:min(860px,100%);
    margin:0 auto;
}

.roomseo-section{
    padding:0 0 54px;
}

.roomseo-section + .roomseo-section{
    padding-top:8px;
}

.roomseo-section h2{
    margin:0 0 20px;
    color:#08112f;
    font-size:clamp(2rem,3.6vw,3rem);
    line-height:1.06;
    letter-spacing:-.045em;
    font-weight:900;
}

.roomseo-section p{
    margin:0 0 18px;
    color:#4f5b74;
    font-size:1.06rem;
    line-height:1.9;
}

.roomseo-section p:last-child{
    margin-bottom:0;
}

.roomseo-section a{
    color:#4562f2;
    font-weight:750;
    text-decoration-thickness:1px;
    text-underline-offset:3px;
}

.roomseo-section strong{
    color:#111a31;
    font-weight:800;
}

.roomseo-section ul{
    margin:20px 0 0;
    padding:0 0 0 23px;
}

.roomseo-section li{
    margin:9px 0;
    color:#4f5b74;
    line-height:1.75;
}


/* FAQ */

.roomseo-faq{
    margin-top:20px;
    padding:48px 0 58px;
    border-top:1px solid #e8ebf2;
}

.roomseo-faq h2{
    margin:0 0 28px;
    color:#08112f;
    font-size:clamp(2rem,3.6vw,3rem);
    line-height:1.06;
    letter-spacing:-.045em;
    font-weight:900;
}

.roomseo-faq-list{
    display:grid;
    gap:11px;
}

.roomseo-faq details{
    border:1px solid #e2e7f0;
    border-radius:17px;
    background:#f8f9fd;
    overflow:hidden;
}

.roomseo-faq summary{
    position:relative;
    padding:20px 55px 20px 20px;
    color:#101934;
    font-size:1rem;
    font-weight:800;
    cursor:pointer;
    list-style:none;
}

.roomseo-faq summary::-webkit-details-marker{
    display:none;
}

.roomseo-faq summary::after{
    content:"+";
    position:absolute;
    top:50%;
    right:20px;
    transform:translateY(-50%);
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:9px;
    background:#e9edff;
    color:#4f68fa;
    font-size:1.1rem;
    font-weight:900;
}

.roomseo-faq details[open] summary::after{
    content:"−";
}

.roomseo-faq details p{
    margin:0;
    padding:0 20px 21px;
    color:#5b6680;
    line-height:1.75;
}


@media(max-width:620px){

    .roomseo-content{
        padding:58px 0 15px;
    }

    .roomseo-section{
        padding-bottom:43px;
    }

    .roomseo-section p{
        font-size:1rem;
        line-height:1.82;
    }

}

/* ESRED EDITORIAL CONTENT V1 END */

/* ESRED_HOME_SEO_START */

.home-seo-content {
    width: min(1180px, calc(100% - 32px));
    margin: 56px auto 32px;
}

.home-seo-content h2 {
    margin-top: 0;
    margin-bottom: 16px;
    line-height: 1.2;
}

.home-seo-content p {
    line-height: 1.75;
}

.home-seo-intro,
.home-seo-section,
.home-seo-faq,
.home-seo-cta {
    margin: 0 0 28px;
}

.home-seo-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin: 28px 0;
}

.home-seo-card,
.home-seo-section,
.home-seo-faq,
.home-seo-cta {
    padding: 26px;
    border: 1px solid rgba(127,127,127,.22);
    border-radius: 18px;
}

.home-seo-content a {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.home-seo-faq details {
    padding: 15px 0;
    border-bottom: 1px solid rgba(127,127,127,.20);
}

.home-seo-faq details:last-child {
    border-bottom: 0;
}

.home-seo-faq summary {
    cursor: pointer;
    font-weight: 700;
}

.home-seo-cta {
    text-align: center;
}

.home-seo-button {
    display: inline-block;
    padding: 13px 22px;
    border-radius: 999px;
    font-weight: 700;
}

@media (max-width: 760px) {
    .home-seo-grid {
        grid-template-columns: 1fr;
    }

    .home-seo-content {
        width: min(100% - 22px, 1180px);
        margin-top: 36px;
    }

    .home-seo-card,
    .home-seo-section,
    .home-seo-faq,
    .home-seo-cta {
        padding: 20px;
    }
}

/* ESRED_HOME_SEO_END */

/* ESRED HOME CTA V2 */

.home-seo-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;

    margin: 40px 0 10px;
    padding: 34px 40px;

    background:
        radial-gradient(circle at 85% 20%, rgba(59,130,246,.22), transparent 32%),
        linear-gradient(135deg, #071a3d 0%, #0c2754 100%);

    border: 0 !important;
    border-radius: 22px;

    color: #fff;
    text-align: left;

    box-shadow: 0 16px 40px rgba(7,26,61,.14);
}

.home-seo-cta-text {
    max-width: 760px;
}

.home-seo-cta-kicker {
    display: inline-block;
    margin-bottom: 8px;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: .10em;

    color: #a9c7ff;
}

.home-seo-cta h2 {
    margin: 0 0 8px;
    color: #fff;

    font-size: clamp(25px, 3vw, 34px);
    line-height: 1.15;
}

.home-seo-cta p {
    margin: 0;
    max-width: 720px;

    color: rgba(255,255,255,.82);
    line-height: 1.65;
}

.home-seo-button {
    flex: 0 0 auto;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-width: 175px;

    padding: 14px 21px;

    background: #fff;
    color: #071a3d !important;

    border-radius: 12px;

    font-weight: 800;
    text-decoration: none !important;
    white-space: nowrap;

    box-shadow: 0 8px 20px rgba(0,0,0,.12);

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.home-seo-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}

.home-seo-button span {
    font-size: 20px;
    line-height: 1;
}

@media (max-width: 760px) {

    .home-seo-cta {
        flex-direction: column;
        align-items: flex-start;

        gap: 22px;
        padding: 26px 22px;
    }

    .home-seo-button {
        width: 100%;
    }
}

/* END ESRED HOME CTA V2 */


/* ESRED CHAT ANCHOR */
#chat {
    scroll-margin-top: 110px;
}
/* END ESRED CHAT ANCHOR */

/* ESRED LEGAL PAGES START */

.legal-page {
    width: min(100% - 32px, 1040px);
    margin: 48px auto 70px;
}

.legal-document {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, .10);
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 18px 55px rgba(15, 23, 42, .07);
}

.legal-document-header {
    padding: 42px 46px 34px;
    border-bottom: 1px solid rgba(15, 23, 42, .08);
}

.legal-kicker {
    display: block;
    margin-bottom: 10px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
    opacity: .58;
}

.legal-document-header h1 {
    margin: 0;
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.1;
}

.legal-document-content {
    padding: 38px 46px 48px;
}

.legal-document-content h2 {
    margin: 42px 0 14px;
    font-size: clamp(21px, 2.3vw, 27px);
    line-height: 1.25;
}

.legal-document-content h2:first-child {
    margin-top: 0;
}

.legal-document-content p {
    margin: 0 0 18px;
    line-height: 1.78;
}

.legal-document-content a {
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.legal-list {
    margin: 0 0 22px;
    padding-left: 25px;
}

.legal-list li {
    margin: 8px 0;
    line-height: 1.65;
}

@media (max-width: 720px) {

    .legal-page {
        width: min(100% - 20px, 1040px);
        margin-top: 26px;
    }

    .legal-document-header {
        padding: 28px 22px 24px;
    }

    .legal-document-content {
        padding: 26px 22px 34px;
    }

    .legal-document-content h2 {
        margin-top: 34px;
    }
}

/* ESRED LEGAL PAGES END */

/* ESRED BRAND IMAGE */
.esred-brand-image {
    width: 34px;
    height: 34px;
    display: block;
    flex: 0 0 34px;
    object-fit: cover;
    border-radius: 9px;
}

/* ESRED BRAND FIX START */

.esred-brand-image {
    width: 34px;
    height: 34px;
    display: block;
    flex: 0 0 34px;
    object-fit: cover;
    border-radius: 9px;
    margin-right: 12px;
}

/* Ajuste fino del bloque de marca */
.site-brand,
.brand,
.header-brand,
a[class*="brand"],
a[class*="logo"] {
    align-items: center;
}

/* ESRED BRAND FIX END */

/* ESRED HUBS V3 START */

/* =========================================================
   BASE
   ========================================================= */

.esred-hub-v2 {
    --hub-ink: #0d1737;
    --hub-muted: #66718b;
    --hub-blue: #5368ff;
    --hub-purple: #744df2;
    --hub-line: rgba(20, 33, 70, .09);
    --hub-card: #ffffff;
    --hub-soft: #f5f7ff;

    color: var(--hub-ink);
    background: #f7f8fd;
}


/* =========================================================
   HERO
   ========================================================= */

.esred-hub-v2 .hubv2-hero {
    position: relative;
    overflow: hidden;
    padding: 54px 0 62px;
    background:
        radial-gradient(
            circle at 88% 20%,
            rgba(94, 86, 255, .16),
            transparent 32%
        ),
        radial-gradient(
            circle at 10% 0%,
            rgba(64, 212, 255, .11),
            transparent 27%
        ),
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f8f9ff 54%,
            #f0f2ff 100%
        );
    border-bottom: 1px solid var(--hub-line);
}

.esred-hub-v2 .hubv2-hero::before {
    content: "";
    position: absolute;
    width: 320px;
    height: 320px;
    right: -130px;
    top: -165px;
    border-radius: 50%;
    border: 1px solid rgba(82, 101, 255, .12);
}

.esred-hub-v2 .hubv2-hero::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    right: 70px;
    bottom: -115px;
    border-radius: 50%;
    background: rgba(108, 76, 245, .055);
    pointer-events: none;
}

.esred-hub-v2 .roomv2-breadcrumbs {
    position: relative;
    z-index: 2;
    margin-bottom: 33px;
    font-size: 12px;
    font-weight: 650;
    color: #8891a6;
}

.esred-hub-v2 .roomv2-breadcrumbs a {
    color: var(--hub-blue);
    text-decoration: none;
}

.esred-hub-v2 .hubv2-hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 70px;
    align-items: center;
}

.esred-hub-v2 .esred-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 13px;
    color: var(--hub-blue);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .13em;
}

.esred-hub-v2 .esred-eyebrow::before {
    content: "";
    width: 18px;
    height: 2px;
    border-radius: 10px;
    background: linear-gradient(
        90deg,
        var(--hub-blue),
        var(--hub-purple)
    );
}

.esred-hub-v2 .hubv2-hero h1 {
    max-width: 780px;
    margin: 0;
    color: var(--hub-ink);
    font-size: clamp(46px, 5.6vw, 78px);
    line-height: .98;
    letter-spacing: -.045em;
}

.esred-hub-v2 .hubv2-hero p {
    max-width: 710px;
    margin: 22px 0 0;
    color: var(--hub-muted);
    font-size: 16px;
    line-height: 1.75;
}


/* =========================================================
   CONTADOR
   ========================================================= */

.esred-hub-v2 .hubv2-counter {
    position: relative;
    min-width: 190px;
    padding: 27px 29px 25px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            #101b45,
            #091432
        );
    box-shadow:
        0 20px 50px rgba(13, 23, 55, .18),
        inset 0 1px 0 rgba(255,255,255,.09);
}

.esred-hub-v2 .hubv2-counter::before {
    content: "#";
    position: absolute;
    right: 16px;
    top: 2px;
    color: rgba(255,255,255,.055);
    font-size: 78px;
    font-weight: 900;
    line-height: 1;
}

.esred-hub-v2 .hubv2-counter::after {
    content: "";
    position: absolute;
    width: 68px;
    height: 68px;
    right: -25px;
    bottom: -26px;
    border-radius: 50%;
    background: #5266ff;
    opacity: .28;
    filter: blur(1px);
}

.esred-hub-v2 .hubv2-counter strong {
    position: relative;
    z-index: 2;
    display: block;
    margin-bottom: 4px;
    color: #6575ff;
    font-size: 43px;
    line-height: 1;
    letter-spacing: -.045em;
}

.esred-hub-v2 .hubv2-counter span {
    position: relative;
    z-index: 2;
    color: rgba(255,255,255,.82);
    font-size: 11px;
    font-weight: 700;
}


/* =========================================================
   DIRECTORIO
   ========================================================= */

.esred-hub-v2 .hubv2-directory {
    padding: 66px 0 90px;
    background:
        linear-gradient(
            180deg,
            #f8f9ff 0%,
            #f4f6fd 100%
        );
}

.esred-hub-v2 .hubv2-tools {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(310px, 390px);
    gap: 45px;
    align-items: end;
    margin-bottom: 14px;
}

.esred-hub-v2 .hubv2-tools h2,
.esred-hub-v2 .hubv2-explore h2 {
    margin: 0;
    color: var(--hub-ink);
    font-size: clamp(31px, 3.4vw, 47px);
    line-height: 1.08;
    letter-spacing: -.035em;
}


/* =========================================================
   BUSCADOR
   ========================================================= */

.esred-hub-v2 .hubv2-search {
    position: relative;
    display: block;
    padding: 14px 16px 16px;
    border: 1px solid var(--hub-line);
    border-radius: 17px;
    background: rgba(255,255,255,.88);
    box-shadow:
        0 12px 35px rgba(18, 29, 62, .07);
    backdrop-filter: blur(12px);
}

.esred-hub-v2 .hubv2-search > span {
    display: block;
    margin: 0 0 7px 3px;
    color: #7b849c;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.esred-hub-v2 .hubv2-search::after {
    content: "⌕";
    position: absolute;
    right: 29px;
    bottom: 25px;
    color: #7a84a0;
    font-size: 19px;
    pointer-events: none;
}

.esred-hub-v2 .hubv2-search input {
    width: 100%;
    height: 48px;
    padding: 0 46px 0 16px;
    outline: none;
    border: 1px solid rgba(17, 29, 64, .10);
    border-radius: 11px;
    background: #f8f9fc;
    color: var(--hub-ink);
    font: inherit;
    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

.esred-hub-v2 .hubv2-search input:focus {
    border-color: rgba(82, 104, 255, .46);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(82,104,255,.08);
}

.esred-hub-v2 .hubv2-results {
    margin: 17px 0 30px;
    color: #8992a7;
    font-size: 12px;
}

.esred-hub-v2 .hubv2-results strong {
    color: var(--hub-blue);
}


/* =========================================================
   BLOQUES DE CATEGORÍAS
   ========================================================= */

.esred-hub-v2 .hubv2-groups {
    display: grid;
    gap: 28px;
}

.esred-hub-v2 .hubv2-group {
    position: relative;
    padding: 29px;
    overflow: hidden;
    border: 1px solid var(--hub-line);
    border-radius: 25px;
    background: rgba(255,255,255,.72);
    box-shadow:
        0 14px 40px rgba(20, 32, 68, .055);
}

.esred-hub-v2 .hubv2-group::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background:
        linear-gradient(
            180deg,
            var(--hub-blue),
            var(--hub-purple)
        );
    opacity: .72;
}

.esred-hub-v2 .hubv2-group-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 25px;
    margin-bottom: 21px;
    padding-bottom: 19px;
    border-bottom: 1px solid rgba(18,31,68,.075);
}

.esred-hub-v2 .hubv2-group-head > div > span {
    display: inline-block;
    margin-bottom: 6px;
    color: var(--hub-blue);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.esred-hub-v2 .hubv2-group-head h2 {
    margin: 0;
    color: var(--hub-ink);
    font-size: 27px;
    line-height: 1.15;
    letter-spacing: -.025em;
}

.esred-hub-v2 .hubv2-group-head p {
    margin: 5px 0 0;
    color: #7a849b;
    font-size: 12px;
}

.esred-hub-v2 .hubv2-group-head > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid rgba(82,104,255,.15);
    border-radius: 10px;
    background: #f4f6ff;
    color: var(--hub-blue);
    font-size: 11px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    transition:
        transform .18s ease,
        background .18s ease,
        color .18s ease,
        box-shadow .18s ease;
}

.esred-hub-v2 .hubv2-group-head > a:hover {
    transform: translateY(-2px);
    background: var(--hub-blue);
    color: white;
    box-shadow: 0 10px 22px rgba(82,104,255,.18);
}


/* =========================================================
   TARJETAS DE SALA
   ========================================================= */

.esred-hub-v2 .hubv2-room-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px;
}

.esred-hub-v2 .hubv2-room {
    position: relative;
    min-width: 0;
    min-height: 76px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    padding: 12px 13px;
    overflow: hidden;
    border: 1px solid rgba(20,33,70,.09);
    border-radius: 15px;
    background: #ffffff;
    color: var(--hub-ink);
    text-decoration: none;
    box-shadow: 0 4px 13px rgba(13,23,55,.025);
    transition:
        transform .20s ease,
        border-color .20s ease,
        box-shadow .20s ease;
}

.esred-hub-v2 .hubv2-room::before {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 2px;
    background:
        linear-gradient(
            90deg,
            var(--hub-blue),
            var(--hub-purple)
        );
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .22s ease;
}

.esred-hub-v2 .hubv2-room:hover {
    transform: translateY(-3px);
    border-color: rgba(82,104,255,.22);
    box-shadow: 0 13px 27px rgba(20,33,70,.09);
}

.esred-hub-v2 .hubv2-room:hover::before {
    transform: scaleX(1);
}

.esred-hub-v2 .hubv2-hash {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background:
        linear-gradient(
            135deg,
            #f1f4ff,
            #e9edff
        );
    color: var(--hub-blue);
    font-size: 15px;
    font-weight: 800;
    transition:
        transform .18s ease,
        background .18s ease;
}

.esred-hub-v2 .hubv2-room:hover .hubv2-hash {
    transform: scale(1.05);
    background:
        linear-gradient(
            135deg,
            #e7ebff,
            #e8e3ff
        );
}

.esred-hub-v2 .hubv2-room strong {
    display: block;
    overflow: hidden;
    margin-bottom: 3px;
    color: #111a36;
    font-size: 13px;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.esred-hub-v2 .hubv2-room small {
    display: block;
    overflow: hidden;
    color: #8a93a7;
    font-size: 10px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.esred-hub-v2 .hubv2-room > b {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    color: var(--hub-blue);
    font-size: 15px;
    font-weight: 600;
    transition:
        transform .18s ease,
        background .18s ease;
}

.esred-hub-v2 .hubv2-room:hover > b {
    transform: translateX(2px);
    background: #f0f2ff;
}


/* =========================================================
   HUB INDIVIDUAL / ENLACES A OTROS HUBS
   ========================================================= */

.esred-hub-v2 .hubv2-explore {
    margin-top: 48px;
    padding-top: 38px;
    border-top: 1px solid var(--hub-line);
}

.esred-hub-v2 .hubv2-category-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 12px;
    margin-top: 22px;
}

.esred-hub-v2 .hubv2-category-grid a {
    position: relative;
    min-height: 105px;
    padding: 19px 20px;
    overflow: hidden;
    border: 1px solid var(--hub-line);
    border-radius: 17px;
    background: white;
    color: var(--hub-ink);
    text-decoration: none;
    box-shadow: 0 7px 22px rgba(17,29,64,.035);
    transition:
        transform .20s ease,
        box-shadow .20s ease,
        border-color .20s ease;
}

.esred-hub-v2 .hubv2-category-grid a:hover {
    transform: translateY(-3px);
    border-color: rgba(82,104,255,.22);
    box-shadow: 0 15px 30px rgba(17,29,64,.08);
}

.esred-hub-v2 .hubv2-category-grid a::after {
    content: "";
    position: absolute;
    width: 80px;
    height: 80px;
    right: -36px;
    bottom: -42px;
    border-radius: 50%;
    background: rgba(82,104,255,.065);
}

.esred-hub-v2 .hubv2-category-grid strong {
    display: block;
    margin-bottom: 6px;
    font-size: 17px;
}

.esred-hub-v2 .hubv2-category-grid span {
    color: #7a849b;
    font-size: 11px;
    line-height: 1.45;
}

.esred-hub-v2 .hubv2-category-grid b {
    position: absolute;
    right: 16px;
    top: 15px;
    color: var(--hub-blue);
    font-weight: 700;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .esred-hub-v2 .hubv2-room-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .esred-hub-v2 .hubv2-category-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}


@media (max-width: 820px) {

    .esred-hub-v2 .hubv2-hero {
        padding: 38px 0 44px;
    }

    .esred-hub-v2 .hubv2-hero-grid {
        grid-template-columns: 1fr;
        gap: 27px;
    }

    .esred-hub-v2 .hubv2-counter {
        width: 100%;
        min-width: 0;
    }

    .esred-hub-v2 .hubv2-tools {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .esred-hub-v2 .hubv2-search {
        width: 100%;
    }

    .esred-hub-v2 .hubv2-room-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .esred-hub-v2 .hubv2-group {
        padding: 23px;
    }
}


@media (max-width: 560px) {

    .esred-hub-v2 .hubv2-hero h1 {
        font-size: 42px;
    }

    .esred-hub-v2 .hubv2-directory {
        padding: 44px 0 65px;
    }

    .esred-hub-v2 .hubv2-room-grid,
    .esred-hub-v2 .hubv2-category-grid {
        grid-template-columns: 1fr;
    }

    .esred-hub-v2 .hubv2-group {
        padding: 18px;
        border-radius: 19px;
    }

    .esred-hub-v2 .hubv2-group-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 13px;
    }

    .esred-hub-v2 .hubv2-room {
        min-height: 70px;
    }
}

/* ESRED HUBS V3 END */