/* =========================================================
   CLANDELERO — ESTILOS GENERALES
   Nota: se mantienen las clases utilizadas por el feed.
========================================================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --color-bg: #f4f5f7;
    --color-card: #ffffff;
    --color-primary: #f0441f;
    --color-primary-dark: #d93616;
    --color-accent: #f5a014;
    --color-text: #171923;
    --color-text-light: #697386;
    --color-muted: #8b93a7;
    --color-border: #e4e7ec;
    --color-success: #198754;
    --color-error: #c93636;
    --radius: 14px;
    --shadow: 0 10px 30px rgba(18, 24, 40, .08);
    --shadow-soft: 0 4px 16px rgba(18, 24, 40, .06);
    --font-main: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-main);
    background: var(--color-bg);
    color: var(--color-text);
    line-height: 1.6;
    padding-top: 76px;
    -webkit-font-smoothing: antialiased;
}

a {
    color: inherit;
}

button,
input,
textarea {
    font: inherit;
}

/* =========================================================
   NAVBAR
========================================================= */

.navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 76px;
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid rgba(228, 231, 236, .8);
    box-shadow: 0 3px 18px rgba(18, 24, 40, .06);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    z-index: 1000;
}

.nav-content {
    width: min(1160px, calc(100% - 40px));
    min-height: 76px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.nav-logo {
    flex: 0 0 auto;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.5px;
    color: var(--color-primary);
    text-decoration: none;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}

.nav-links a {
    padding: 9px 12px;
    border-radius: 9px;
    text-decoration: none;
    color: #343a49;
    font-size: 14px;
    font-weight: 600;
    transition: background .2s ease, color .2s ease, transform .2s ease;
}

.nav-links a:hover {
    background: #f2f4f8;
    color: var(--color-primary);
}

.nav-links .nav-login,
.nav-login {
    padding: 9px 16px;
    background: var(--color-primary);
    color: #fff !important;
    border-radius: 10px;
    font-weight: 700;
    box-shadow: 0 5px 14px rgba(240, 68, 31, .2);
}

.nav-links .nav-login:hover,
.nav-login:hover {
    background: var(--color-primary-dark);
    color: #fff !important;
    transform: translateY(-1px);
}

.hamburger {
    display: none;
    width: 42px;
    height: 42px;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: #fff;
    color: var(--color-primary);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.desktop-only {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* =========================================================
   LANDING / INDEX
========================================================= */

.landing-body {
    min-height: 100vh;
    padding-top: 76px;
    background: #11141c;
}

.welcome-page {
    min-height: calc(100vh - 76px);
    display: flex;
    align-items: stretch;
}

.welcome-hero {
    position: relative;
    isolation: isolate;
    width: 100%;
    min-height: calc(100vh - 76px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 70px 24px;
    overflow: hidden;
    background:
        linear-gradient(120deg, rgba(12, 16, 26, .82), rgba(34, 29, 65, .60)),
        url('/assets/welcome-bg.jpg') center center / cover no-repeat;
}

.welcome-hero::before {
    content: "";
    position: absolute;
    width: 460px;
    height: 460px;
    right: -150px;
    top: -180px;
    border-radius: 50%;
    background: rgba(245, 160, 20, .20);
    filter: blur(10px);
    z-index: -1;
}

.welcome-hero::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    left: -150px;
    bottom: -180px;
    border-radius: 50%;
    background: rgba(240, 68, 31, .22);
    filter: blur(10px);
    z-index: -1;
}

.welcome-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(9, 12, 20, .72), rgba(9, 12, 20, .28));
    z-index: -1;
}

.welcome-card {
    width: min(920px, 100%);
    padding: 58px 64px;
    text-align: left;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 28px;
    background: rgba(15, 18, 28, .48);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .28);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.welcome-eyebrow,
.auth-kicker {
    display: inline-block;
    margin-bottom: 15px;
    color: #d56a50;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
}

.welcome-card h1 {
    font-size: clamp(48px, 8vw, 88px);
    line-height: .98;
    letter-spacing: -4px;
    font-weight: 850;
    margin-bottom: 22px;
}

.welcome-card h1 span {
    color: #f05a36;
}

.welcome-subtitle {
    max-width: 700px;
    color: rgba(255, 255, 255, .84);
    font-size: clamp(17px, 2vw, 21px);
    line-height: 1.65;
}

.welcome-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 34px;
}

.btn-primary,
.btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    text-decoration: none;
    font-weight: 750;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
}

.btn-primary {
    background: var(--color-primary);
    color: #fff;
    padding: 10px 18px;
    border-radius: 9px;
    box-shadow: 0 7px 18px rgba(240, 68, 31, .18);
}

.btn-primary:hover {
    background: var(--color-primary-dark);
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(240, 68, 31, .25);
}

.btn-secondary {
    background: rgba(255, 255, 255, .08);
    color: #fff;
    padding: 10px 18px;
    border: 1px solid rgba(255, 255, 255, .30);
    border-radius: 9px;
}

.btn-secondary:hover {
    background: rgba(255, 255, 255, .15);
    border-color: rgba(255, 255, 255, .48);
    transform: translateY(-1px);
}

.btn-large {
    min-height: 48px;
    padding: 12px 22px;
    border-radius: 11px;
    font-size: 15px;
}

.welcome-features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 46px;
    padding-top: 26px;
    border-top: 1px solid rgba(255, 255, 255, .14);
}

.welcome-feature {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.feature-icon {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: rgba(255, 255, 255, .10);
    color: #ef8068;
    font-size: 18px;
}

.welcome-feature strong,
.welcome-feature small {
    display: block;
}

.welcome-feature strong {
    font-size: 14px;
}

.welcome-feature small {
    margin-top: 1px;
    color: rgba(255, 255, 255, .60);
    font-size: 12px;
}

/* =========================================================
   LOGIN / REGISTRO
========================================================= */

.auth-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 10% 15%, rgba(240, 68, 31, .10), transparent 28%),
        radial-gradient(circle at 90% 85%, rgba(245, 160, 20, .08), transparent 30%),
        var(--color-bg);
}

.auth-page {
    width: min(100%, 560px);
    margin: 0 auto;
    min-height: calc(100vh - 76px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 42px 20px 60px;
}

.auth-card {
    width: 100%;
    padding: 38px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(228, 231, 236, .9);
    border-radius: 22px;
    box-shadow: var(--shadow);
}

.auth-card-register {
    max-width: 520px;
}

.auth-heading {
    margin-bottom: 25px;
}

.auth-heading .auth-kicker {
    color: var(--color-primary);
    margin-bottom: 8px;
    letter-spacing: 1.5px;
}

.auth-heading h1 {
    margin-bottom: 7px;
    color: var(--color-text);
    font-size: 32px;
    line-height: 1.15;
    letter-spacing: -.8px;
}

.auth-heading p {
    color: var(--color-text-light);
    font-size: 15px;
}

.form-message {
    margin-bottom: 20px;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
}

.form-message.error {
    color: #9e2d2d;
    background: #fff1f1;
    border: 1px solid #ffd6d6;
}

.form-message.success {
    color: #176c46;
    background: #ecf9f1;
    border: 1px solid #cceedd;
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.form-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.form-field label {
    color: #303746;
    font-size: 13px;
    font-weight: 750;
}

.form-field label span {
    color: var(--color-muted);
    font-weight: 500;
}

.field-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-field input[type="text"],
.form-field input[type="email"],
.form-field input[type="password"] {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    color: var(--color-text);
    background: #fff;
    border: 1px solid #dfe3ea;
    border-radius: 10px;
    outline: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.form-field input[type="text"]::placeholder,
.form-field input[type="email"]::placeholder,
.form-field input[type="password"]::placeholder {
    color: #a2a9b8;
}

.form-field input[type="text"]:focus,
.form-field input[type="email"]:focus,
.form-field input[type="password"]:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 4px rgba(240, 68, 31, .11);
}

.form-field input[type="file"] {
    width: 100%;
    padding: 10px;
    color: #51596b;
    background: #fafbfc;
    border: 1px dashed #cfd5df;
    border-radius: 10px;
    cursor: pointer;
}

.form-field input[type="file"]::file-selector-button {
    margin-right: 10px;
    padding: 7px 11px;
    border: 0;
    border-radius: 7px;
    background: #eef1f7;
    color: #333b4d;
    font-weight: 650;
    cursor: pointer;
}

.field-help {
    color: var(--color-muted);
    font-size: 12px;
}

.auth-submit {
    width: 100%;
    min-height: 50px;
    margin-top: 4px;
    border-radius: 11px;
    font-size: 15px;
}

.auth-footer {
    margin-top: 25px;
    padding-top: 21px;
    border-top: 1px solid #edf0f4;
    text-align: center;
    color: var(--color-text-light);
    font-size: 14px;
}

.auth-footer a {
    color: var(--color-primary);
    font-weight: 750;
    text-decoration: none;
}

.auth-footer a:hover {
    text-decoration: underline;
}

/* =========================================================
   FEED — CLASES EXISTENTES CONSERVADAS
========================================================= */

.page .card {
    background: var(--color-card);
    padding: 30px;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    max-width: 420px;
    margin: 0 auto;
}

.page .card button {
    width: 100%;
}

.layout {
    display: grid;
    grid-template-columns: 260px 1fr 320px;
    gap: 16px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px;
}

@media (max-width: 900px) {
    .layout {
        grid-template-columns: 1fr;
    }
}

.sidebar {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.side-link {
    display: block;
    padding: 8px 12px;
    border-radius: 6px;
    text-decoration: none;
    color: #333;
}

.side-link:hover {
    background: #f0f0f0;
}

.side-publish {
    margin-top: 8px;
    padding: 10px 12px;
    border-radius: 20px;
    border: none;
    background: #f0441f;
    color: #fff;
    cursor: pointer;
}

.side-bottom {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.side-link-small {
    font-size: 13px;
    color: #666;
    text-decoration: none;
}

.card {
    background: #fff;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    overflow: visible !important;
}

.create-post-card {
    padding: 20px;
}

.feed-input {
    width: 100%;
    padding: 12px;
    border-radius: 10px;
    border: 1px solid #ddd;
    margin-bottom: 10px;
}

.feed-actions-row {
    display: flex;
    gap: 10px;
    align-items: center;
}

.post-card {
    padding: 20px;
}

.post-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.post-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
}

.post-user-name {
    font-size: 16px;
    font-weight: 600;
}

.post-meta {
    font-size: 13px;
    color: #777;
}

.post-text {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 15px;
    white-space: normal;
    overflow-wrap: break-word;
}

.post-image {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}

.post-footer {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}

.like-btn,
.comment-toggle,
.send-comment {
    border: none;
    border-radius: 16px;
    padding: 6px 10px;
    cursor: pointer;
    background: #fff1e9;
    color: #234;
    font-size: 13px;
}

.comments-panel {
    margin-top: 12px;
    padding: 12px;
    background: #f5f5f5;
    border-radius: 8px;
}

.comments-list {
    margin-bottom: 10px;
}

.comment-item {
    background: #fff;
    padding: 8px 10px;
    border-radius: 6px;
    margin-bottom: 8px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.comments-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.comment-text {
    min-height: 60px;
    padding: 8px;
    border-radius: 6px;
    border: 1px solid #ccc;
    resize: vertical;
}

.right-panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.chat-fab {
    position: fixed;
    right: 16px;
    bottom: 16px;
    background: #f0441f;
    color: #fff;
    padding: 10px 14px;
    border-radius: 20px;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    font-size: 14px;
}

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

@media (max-width: 760px) {
    body {
        padding-top: 68px;
    }

    .navbar,
    .nav-content {
        min-height: 68px;
    }

    .nav-content {
        width: min(100% - 24px, 1160px);
    }

    .nav-logo {
        font-size: 20px;
    }

    .hamburger {
        display: grid;
        place-items: center;
        margin-left: auto;
    }

    .desktop-only {
        display: none !important;
    }

    .nav-links {
        display: none;
        position: absolute;
        top: calc(100% + 8px);
        left: 12px;
        right: 12px;
        margin: 0;
        padding: 10px;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        background: rgba(255, 255, 255, .98);
        border: 1px solid var(--color-border);
        border-radius: 14px;
        box-shadow: var(--shadow);
    }

    .nav-links.active {
        display: flex;
    }

    .nav-links a,
    .nav-links .nav-login {
        width: 100%;
        text-align: center;
    }

    .welcome-page,
    .welcome-hero {
        min-height: calc(100vh - 68px);
    }

    .welcome-hero {
        padding: 30px 15px;
        background-position: center;
    }

    .welcome-card {
        padding: 38px 25px;
        border-radius: 22px;
    }

    .welcome-card h1 {
        font-size: clamp(44px, 15vw, 68px);
        letter-spacing: -3px;
    }

    .welcome-subtitle {
        font-size: 16px;
    }

    .welcome-buttons {
        flex-direction: column;
    }

    .welcome-buttons .btn-large {
        width: 100%;
    }

    .welcome-features {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-top: 32px;
    }

    .auth-page {
        min-height: calc(100vh - 68px);
        padding: 25px 14px 40px;
        align-items: flex-start;
    }

    .auth-card {
        margin-top: 10px;
        padding: 27px 21px;
        border-radius: 18px;
    }

    .auth-heading h1 {
        font-size: 28px;
    }
}

@media (max-width: 420px) {
    .welcome-card {
        padding: 32px 20px;
    }

    .welcome-eyebrow {
        font-size: 10px;
        letter-spacing: 1.4px;
    }

    .auth-card {
        padding: 24px 18px;
    }
}

/* =========================================================
   PERFIL / CAMBIO DE AVATAR
========================================================= */

.profile-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 12% 16%, rgba(240, 68, 31, .09), transparent 28%),
        radial-gradient(circle at 88% 82%, rgba(245, 160, 20, .07), transparent 30%),
        var(--color-bg);
}

.profile-page {
    width: min(100% - 40px, 760px);
    min-height: calc(100vh - 76px);
    margin: 0 auto;
    padding: 54px 0 70px;
}

.profile-card,
.avatar-card {
    width: 100%;
    padding: 42px;
    background: rgba(255, 255, 255, .97);
    border: 1px solid rgba(228, 231, 236, .95);
    border-radius: 24px;
    box-shadow: var(--shadow);
}

.profile-heading {
    margin-bottom: 30px;
}

.profile-kicker {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--color-primary);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.7px;
}

.profile-heading h1 {
    margin-bottom: 7px;
    font-size: 34px;
    line-height: 1.15;
    letter-spacing: -.9px;
}

.profile-heading p {
    color: var(--color-text-light);
    font-size: 15px;
}

.profile-main {
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 26px;
    background: linear-gradient(135deg, #f8f9ff, #f5f6fb);
    border: 1px solid #e7eaf4;
    border-radius: 18px;
}

.profile-avatar-wrap {
    flex: 0 0 auto;
    padding: 4px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--color-primary), var(--color-accent));
    box-shadow: 0 12px 28px rgba(240, 68, 31, .18);
}

.profile-avatar {
    display: block;
    width: 126px;
    height: 126px;
    object-fit: cover;
    border: 5px solid #fff;
    border-radius: 50%;
    background: #eef1f6;
}

.profile-identity h2 {
    margin-bottom: 4px;
    font-size: 27px;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.profile-role {
    color: var(--color-text-light);
    font-size: 14px;
}

.profile-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 20px;
}

.profile-detail {
    min-width: 0;
    padding: 17px 18px;
    background: #fafbfc;
    border: 1px solid #e9ecf1;
    border-radius: 13px;
}

.profile-detail-label {
    display: block;
    margin-bottom: 4px;
    color: var(--color-muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.profile-detail strong {
    display: block;
    color: #313747;
    font-size: 14px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.profile-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid #edf0f4;
}

.profile-action-primary,
.profile-action-secondary {
    min-height: 46px;
    padding: 11px 18px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 750;
}

.profile-action-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #4b5363;
    background: #f4f5f7;
    border: 1px solid #e0e4ea;
    text-decoration: none;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.profile-action-secondary:hover {
    background: #eceff3;
    border-color: #d5dae2;
    transform: translateY(-1px);
}

.avatar-page {
    width: min(100% - 40px, 650px);
}

.avatar-current {
    display: flex;
    align-items: center;
    gap: 17px;
    margin-bottom: 28px;
    padding: 18px;
    background: #f8f9fc;
    border: 1px solid #e7eaf0;
    border-radius: 15px;
}

.avatar-current-image {
    width: 78px;
    height: 78px;
    flex: 0 0 78px;
    object-fit: cover;
    border: 4px solid #fff;
    border-radius: 50%;
    box-shadow: var(--shadow-soft);
}

.avatar-current-label {
    display: block;
    margin-bottom: 2px;
    color: var(--color-muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.avatar-current strong {
    display: block;
    font-size: 17px;
    overflow-wrap: anywhere;
}

.avatar-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.avatar-form .form-field input[type="file"] {
    min-height: 58px;
    padding: 12px;
    background: #fafbfc;
    border: 1px dashed #cbd2dc;
}

.avatar-submit {
    width: 100%;
    min-height: 50px;
    border-radius: 11px;
    font-size: 15px;
}

.avatar-footer {
    margin-top: 24px;
    padding-top: 21px;
    border-top: 1px solid #edf0f4;
}

.back-link {
    color: var(--color-primary);
    font-size: 14px;
    font-weight: 750;
    text-decoration: none;
}

.back-link:hover {
    text-decoration: underline;
}

@media (max-width: 760px) {
    .profile-page {
        width: min(100% - 28px, 760px);
        min-height: calc(100vh - 68px);
        padding: 28px 0 45px;
    }

    .profile-card,
    .avatar-card {
        padding: 27px 21px;
        border-radius: 19px;
    }

    .profile-heading h1 {
        font-size: 29px;
    }

    .profile-main {
        flex-direction: column;
        text-align: center;
        padding: 24px 18px;
    }

    .profile-avatar {
        width: 112px;
        height: 112px;
    }

    .profile-details {
        grid-template-columns: 1fr;
    }

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

    .profile-action-primary,
    .profile-action-secondary {
        width: 100%;
    }
}

/* ===== V6: perfiles enlazados, likes y chat ===== */
.post-avatar-link { display:inline-flex; flex:0 0 auto; border-radius:50%; }
.post-avatar-link:focus-visible, .post-author-link:focus-visible { outline:3px solid rgba(240,68,31,.25); outline-offset:3px; }
.post-author-link { color:var(--color-text); font-weight:750; text-decoration:none; }
.post-author-link:hover { color:var(--color-primary); text-decoration:underline; }
.like-btn { transition:transform .15s ease, background .2s ease, color .2s ease, opacity .2s ease; }
.like-btn:hover { transform:translateY(-1px); }
.like-btn.is-liked { background:#ffe9ee; color:#be2145; }
.like-btn:disabled { opacity:.6; cursor:wait; }

.chat-page { width:min(100% - 32px, 820px); margin:0 auto; padding:32px 0 56px; }
.chat-card { background:var(--color-card); border:1px solid var(--color-border); border-radius:20px; box-shadow:var(--shadow); overflow:hidden; }
.chat-header { padding:16px 20px; border-bottom:1px solid var(--color-border); background:#fafbfc; }
.chat-user-link { display:inline-flex; align-items:center; gap:12px; color:inherit; text-decoration:none; }
.chat-avatar { width:48px; height:48px; border-radius:50%; object-fit:cover; }
.chat-user-link span { display:block; color:var(--color-muted); font-size:12px; }
.chat-user-link strong { display:block; font-size:16px; }
.chat-messages { min-height:380px; max-height:58vh; overflow-y:auto; padding:20px; background:#f7f8fb; }
.chat-loading, .chat-empty { padding:40px 16px; text-align:center; color:var(--color-muted); }
.chat-bubble-row { display:flex; margin:8px 0; }
.chat-bubble-row.mine { justify-content:flex-end; }
.chat-bubble-row.theirs { justify-content:flex-start; }
.chat-bubble { max-width:min(76%, 540px); padding:10px 13px 8px; border-radius:16px; background:#fff; border:1px solid #e4e7ec; box-shadow:0 1px 2px rgba(0,0,0,.04); }
.chat-bubble-row.mine .chat-bubble { background:#fff3ec; border-color:#ffd9cc; }
.chat-bubble p { margin:0; overflow-wrap:anywhere; }
.chat-bubble time { display:block; margin-top:5px; color:var(--color-muted); font-size:10px; text-align:right; }
.chat-form { display:flex; align-items:flex-end; gap:10px; padding:16px 20px; border-top:1px solid var(--color-border); background:#fff; }
.chat-form textarea { flex:1; min-height:48px; max-height:130px; resize:vertical; padding:12px 14px; border:1px solid #d8dde6; border-radius:12px; font:inherit; }
.chat-form button { min-height:48px; }
.chat-card > .form-error { margin:0 20px 16px; }
@media (max-width:600px) { .chat-page{width:min(100% - 20px,820px);padding-top:18px}.chat-messages{min-height:360px;padding:14px}.chat-form{padding:12px;gap:8px}.chat-bubble{max-width:88%}.chat-form button{padding-left:13px;padding-right:13px} }


/* ===== V7: especialidad artística ===== */
.auth-form select {
    width: 100%;
    min-height: 48px;
    padding: 11px 42px 11px 13px;
    border: 1px solid #d8dde6;
    border-radius: 10px;
    background: #fff;
    color: var(--color-text);
    font: inherit;
    font-size: 14px;
    appearance: auto;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.auth-form select:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(240,68,31,.12);
}
.post-specialty {
    display: inline-flex;
    width: fit-content;
    margin-top: 2px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #fff1e9;
    color: #a9472f !important;
    font-size: 11px !important;
    font-weight: 700;
    line-height: 1.55;
}
.profile-role {
    display: inline-block;
    margin-top: 4px;
    color: var(--color-primary);
    font-weight: 700;
}


/* =========================================================
   CENTRO DE CHAT V9
   Inspirado en una interfaz de mensajería limpia y profesional.
========================================================= */

.chat-center-body {
    background: #f4f6f9;
}

.chat-center-body .chat-center {
    width: min(calc(100% - 30px), 1320px);
    height: calc(100vh - 105px);
    min-height: 620px;
    margin: 14px auto 20px;
    display: grid;
    grid-template-columns: 360px minmax(0, 1fr);
    overflow: hidden;
    background: #fff;
    border: 1px solid #e2e6ec;
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(28, 38, 55, .09);
}

.chat-sidebar {
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-right: 1px solid #e5e8ed;
}

.chat-sidebar-heading {
    padding: 25px 22px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.chat-sidebar-heading h1 {
    margin: 0;
    color: #151921;
    font-size: 29px;
    line-height: 1.1;
    letter-spacing: -.8px;
}

.chat-sidebar-subtitle {
    display: block;
    margin-top: 5px;
    color: #8a93a2;
    font-size: 12px;
}

.chat-count {
    min-width: 31px;
    height: 31px;
    padding: 0 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #d94b28;
    background: #fff1e8;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.chat-search-wrap {
    position: relative;
    padding: 8px 18px 14px;
}

.chat-search-icon {
    position: absolute;
    left: 32px;
    top: 50%;
    transform: translateY(-56%);
    color: #596273;
    font-size: 24px;
    line-height: 1;
    pointer-events: none;
}

.chat-search {
    width: 100%;
    height: 48px;
    padding: 0 14px 0 48px;
    color: #2c3441;
    background: #fff;
    border: 1px solid #dfe4ea;
    border-radius: 13px;
    outline: none;
    font: inherit;
    font-size: 13px;
    box-shadow: 0 2px 7px rgba(30, 43, 60, .04);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.chat-search:focus {
    border-color: #f19a80;
    box-shadow: 0 0 0 3px rgba(75, 145, 225, .11);
}

.chat-sidebar-list {
    min-height: 0;
    overflow-y: auto;
    padding: 0 10px 12px;
}

.chat-contact {
    width: 100%;
    min-height: 78px;
    padding: 11px 12px;
    display: flex;
    gap: 12px;
    align-items: center;
    color: inherit;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 13px;
    transition: background .16s ease, border-color .16s ease;
}

.chat-contact + .chat-contact {
    border-top-color: #f0f2f5;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.chat-contact:hover {
    background: #fffaf7;
}

.chat-contact.active {
    background: #fff2eb;
    border-color: #ffe1d5;
}

/* Muy específico para impedir que estilos generales de imágenes agranden el avatar. */
.chat-center img.chat-contact-avatar,
.chat-center .chat-contact-avatar {
    display: block !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    max-width: 52px !important;
    max-height: 52px !important;
    flex: 0 0 52px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    object-position: center !important;
    aspect-ratio: 1 / 1 !important;
    background: #edf0f4;
}

.chat-contact-main {
    min-width: 0;
    flex: 1;
}

.chat-contact-name-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.chat-contact-name-row strong {
    min-width: 0;
    overflow: hidden;
    color: #171c24;
    font-size: 14px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chat-contact-name-row time {
    flex: 0 0 auto;
    color: #8e98a8;
    font-size: 10px;
}

.chat-contact-specialty {
    display: block;
    margin-top: 2px;
    overflow: hidden;
    color: #7d8898;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chat-contact-preview {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: #424b5a;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chat-contact[hidden] {
    display: none !important;
}

.chat-sidebar-empty {
    margin: 12px 8px;
    padding: 22px 18px;
    color: #707b8c;
    background: #f8fafc;
    border: 1px dashed #dce2e9;
    border-radius: 13px;
    text-align: center;
}

.chat-sidebar-empty strong {
    display: block;
    margin-bottom: 5px;
    color: #202631;
    font-size: 14px;
}

.chat-sidebar-empty p {
    margin: 0;
    font-size: 12px;
    line-height: 1.45;
}

.chat-conversation-panel {
    min-width: 0;
    min-height: 0;
    background: #fff;
}

.chat-conversation {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto auto;
}

.chat-conversation-header {
    min-height: 92px;
    padding: 16px 25px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: #fff;
    border-bottom: 1px solid #e6e9ee;
}

.chat-conversation-user {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 13px;
    color: inherit;
    text-decoration: none;
}

/* Avatar del encabezado: siempre pequeño, redondo y tipo feed. */
.chat-center img.chat-conversation-avatar,
.chat-center .chat-conversation-avatar {
    display: block !important;
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    min-height: 54px !important;
    max-width: 54px !important;
    max-height: 54px !important;
    flex: 0 0 54px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    object-position: center !important;
    aspect-ratio: 1 / 1 !important;
    background: #edf0f4;
    box-shadow: 0 0 0 1px #e1e5eb;
}

.chat-conversation-user span {
    min-width: 0;
}

.chat-conversation-user strong,
.chat-conversation-user small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chat-conversation-user strong {
    color: #121720;
    font-size: 22px;
    line-height: 1.15;
}

.chat-conversation-user small {
    margin-top: 4px;
    color: #7d8796;
    font-size: 13px;
    font-weight: 500;
}

.chat-profile-link {
    flex: 0 0 auto;
    padding: 10px 16px;
    color: #d94b28;
    background: #fff;
    border: 1px solid #e55430;
    border-radius: 11px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 750;
    transition: background .18s ease, color .18s ease;
}

.chat-profile-link:hover {
    color: #fff;
    background: #e55430;
}

.chat-center-messages {
    min-height: 0;
    max-height: none;
    padding: 28px 28px 20px;
    overflow-y: auto;
    background: #fff;
}

.chat-bubble-row {
    display: flex;
    margin: 7px 0;
}

.chat-bubble-row.mine {
    justify-content: flex-end;
}

.chat-bubble-row.theirs {
    justify-content: flex-start;
}

.chat-bubble {
    width: fit-content;
    max-width: min(72%, 620px);
    padding: 11px 14px 8px;
    border-radius: 17px;
    box-shadow: none;
}

.chat-bubble-row.theirs .chat-bubble {
    color: #212732;
    background: #f0f2f5;
    border-bottom-left-radius: 7px;
}

.chat-bubble-row.mine .chat-bubble {
    color: #1e2b3a;
    background: #fff0e8;
    border-bottom-right-radius: 7px;
}

.chat-bubble p {
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.chat-bubble time {
    display: block;
    margin-top: 5px;
    color: #7f8b9c;
    font-size: 10px;
    text-align: right;
}

.chat-empty,
.chat-loading {
    width: fit-content;
    margin: 30px auto;
    padding: 10px 14px;
    color: #808999;
    background: #f5f7f9;
    border-radius: 999px;
    font-size: 12px;
}

.chat-center-form {
    padding: 14px 22px 18px;
    background: #fff;
    border-top: 1px solid #eef0f3;
}

.chat-composer {
    min-height: 56px;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 50px;
    align-items: center;
    gap: 6px;
    padding: 5px 6px 5px 9px;
    background: #fff;
    border: 1px solid #dce2e8;
    border-radius: 18px;
    box-shadow: 0 3px 12px rgba(26, 39, 58, .05);
}

.chat-composer-emoji {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    color: #374353;
    border: 1px solid #e1e5ea;
    border-radius: 50%;
    font-size: 19px;
    user-select: none;
}

.chat-center-form .chat-composer textarea,
.chat-center-form textarea#chatText {
    width: 100%;
    min-height: 38px;
    max-height: 120px;
    margin: 0;
    padding: 9px 6px;
    color: #252d38;
    background: transparent;
    border: 0;
    border-radius: 0;
    outline: 0;
    resize: none;
    box-shadow: none;
    font: inherit;
    font-size: 14px;
    line-height: 20px;
}

.chat-center-form textarea#chatText::placeholder {
    color: #9aa4b2;
}

.chat-send-button {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    color: #fff;
    background: #3b91df;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    box-shadow: 0 4px 11px rgba(59, 145, 223, .25);
    transition: transform .16s ease, background .16s ease;
}

.chat-send-button:hover {
    background: #287dcc;
    transform: translateY(-1px);
}

.chat-send-button:disabled {
    cursor: wait;
    opacity: .55;
    transform: none;
}

.chat-center-error {
    margin: 0 22px 14px;
}

.chat-welcome-panel {
    height: 100%;
    padding: 40px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #747f8f;
    text-align: center;
}

.chat-welcome-icon {
    width: 72px;
    height: 72px;
    margin-bottom: 18px;
    display: grid;
    place-items: center;
    background: #fff2eb;
    border-radius: 22px;
    font-size: 34px;
}

.chat-welcome-panel h2 {
    margin: 0 0 8px;
    color: #1e2530;
    font-size: 25px;
}

.chat-welcome-panel p {
    max-width: 430px;
    margin: 0;
    font-size: 14px;
}

.chat-discover-btn {
    margin-top: 20px;
    text-decoration: none;
}

@media (max-width: 900px) {
    .chat-center-body .chat-center {
        width: min(calc(100% - 18px), 760px);
        height: auto;
        min-height: 0;
        grid-template-columns: 1fr;
        margin-top: 9px;
        overflow: visible;
    }

    .chat-sidebar {
        border-right: 0;
        border-bottom: 1px solid #e5e8ed;
    }

    .chat-sidebar-list {
        max-height: 270px;
    }

    .chat-conversation-panel {
        min-height: 540px;
    }

    .chat-conversation {
        height: 70vh;
        min-height: 540px;
    }
}

@media (max-width: 560px) {
    .chat-center-body .chat-center {
        width: 100%;
        margin: 0;
        border-left: 0;
        border-right: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .chat-sidebar-heading {
        padding: 18px 15px 10px;
    }

    .chat-sidebar-heading h1 {
        font-size: 24px;
    }

    .chat-search-wrap {
        padding: 7px 12px 11px;
    }

    .chat-search-icon {
        left: 25px;
    }

    .chat-sidebar-list {
        max-height: 220px;
        padding-left: 6px;
        padding-right: 6px;
    }

    .chat-conversation-header {
        min-height: 76px;
        padding: 11px 13px;
    }

    .chat-center img.chat-conversation-avatar,
    .chat-center .chat-conversation-avatar {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        min-height: 46px !important;
        max-width: 46px !important;
        max-height: 46px !important;
        flex-basis: 46px !important;
    }

    .chat-conversation-user strong {
        font-size: 17px;
    }

    .chat-profile-link {
        display: none;
    }

    .chat-center-messages {
        padding: 17px 12px;
    }

    .chat-bubble {
        max-width: 84%;
    }

    .chat-center-form {
        padding: 10px;
    }

    .chat-composer {
        grid-template-columns: 38px minmax(0, 1fr) 44px;
    }

    .chat-send-button {
        width: 40px;
        height: 40px;
    }
}

/* =========================================================
   FEED V10 — TARJETAS COMPACTAS TIPO RED SOCIAL
   Mantiene intactos los hooks JS de likes y comentarios.
========================================================= */

body.feed-body,
body:has(.feed-container) {
    background: #f3f5f8;
}

.feed-container {
    width: min(calc(100% - 32px), 1120px);
    margin: 0 auto;
    padding: 28px 0 56px;
    display: grid;
    grid-template-columns: minmax(0, 720px) 300px;
    justify-content: center;
    align-items: start;
    gap: 24px;
}

.feed-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.feed-sidebar {
    position: sticky;
    top: 98px;
}

.sidebar-card,
.create-post-card,
.feed-post-card {
    background: #fff;
    border: 1px solid #e3e7ed;
    border-radius: 18px;
    box-shadow: 0 7px 24px rgba(28, 38, 55, .065);
}

.sidebar-card {
    padding: 20px;
}

.sidebar-card h3 {
    margin: 0 0 7px;
    font-size: 16px;
}

.sidebar-card p {
    margin: 0;
    color: #6e7685;
    font-size: 13px;
    line-height: 1.5;
}

.create-post-card {
    padding: 20px;
}

.create-post-card h2 {
    margin: 0 0 14px;
    font-size: 18px;
    letter-spacing: -.2px;
}

.post-textarea {
    width: 100%;
    min-height: 96px;
    padding: 14px 15px;
    border: 1px solid #d9dee7;
    border-radius: 13px;
    background: #f8f9fb;
    color: var(--color-text);
    font: inherit;
    font-size: 14px;
    line-height: 1.5;
    resize: vertical;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.post-textarea:focus {
    outline: none;
    background: #fff;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(240,68,31,.12);
}

.post-form-actions {
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.feed-post-card {
    padding: 0;
    overflow: hidden !important;
}

.feed-post-card .post-header {
    margin: 0;
    padding: 16px 18px 13px;
    display: flex;
    align-items: center;
    gap: 11px;
}

.feed-post-card .post-avatar-link {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    overflow: hidden;
    border-radius: 50%;
}

.feed-post-card .post-avatar {
    display: block;
    width: 44px !important;
    height: 44px !important;
    max-width: 44px !important;
    max-height: 44px !important;
    border-radius: 50%;
    object-fit: cover;
    background: #eef1f5;
}

.feed-post-card .post-author {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.25;
}

.feed-post-card .post-author-link {
    max-width: 100%;
    overflow: hidden;
    color: #1d2430;
    font-size: 14px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.feed-post-card .post-specialty {
    margin: 3px 0 0;
    padding: 1px 7px;
    font-size: 10px !important;
}

.feed-post-card .post-author > span:last-child {
    margin-top: 4px;
    color: #8a92a0;
    font-size: 10px;
}

.post-content {
    min-width: 0;
}

.feed-post-card .post-text {
    margin: 0;
    padding: 2px 18px 15px;
    color: #2e3440;
    font-size: 14px;
    line-height: 1.52;
    white-space: normal;
    overflow-wrap: anywhere;
}

.feed-post-card .post-image-wrap {
    width: 100%;
    max-height: 560px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #eef1f4;
    border-top: 1px solid #edf0f3;
    border-bottom: 1px solid #edf0f3;
}

.feed-post-card .post-image {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 560px !important;
    object-fit: contain;
    border-radius: 0;
    box-shadow: none;
    background: #eef1f4;
}

.feed-post-card .post-actions {
    margin: 0;
    padding: 8px 12px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    background: #fff;
}

.feed-post-card .like-btn,
.feed-post-card .comment-toggle {
    min-height: 42px;
    padding: 8px 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #5d6675;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background .16s ease, color .16s ease, transform .16s ease;
}

.feed-post-card .like-btn:hover,
.feed-post-card .comment-toggle:hover {
    background: #f3f5f8;
    transform: none;
}

.feed-post-card .like-btn.is-liked {
    background: #fff0f3;
    color: #c02a4d;
}

.feed-post-card .action-icon {
    font-size: 16px;
    line-height: 1;
}

.feed-post-card .like-btn .action-icon {
    font-size: 18px;
}

.feed-post-card .action-count {
    min-width: 22px;
    padding: 1px 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #edf0f4;
    color: #677080;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
}

.feed-post-card .like-btn.is-liked .action-count {
    background: #ffdfe6;
    color: #b52345;
}

.feed-post-card .comments-panel {
    margin: 0;
    padding: 14px 16px 16px;
    background: #f7f8fa;
    border-top: 1px solid #e7eaf0;
    border-radius: 0;
}

.feed-post-card .comments-list {
    margin: 0 0 12px;
}

.feed-post-card .comment-item {
    margin-bottom: 8px;
    padding: 9px 11px;
    background: #fff;
    border: 1px solid #e6e9ee;
    border-radius: 11px;
    box-shadow: none;
}

.feed-post-card .comment-meta {
    margin-bottom: 3px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.feed-post-card .comment-meta strong {
    color: #303744;
    font-size: 12px;
}

.feed-post-card .comment-meta span {
    color: #9299a6;
    font-size: 9px;
}

.feed-post-card .comment-item p {
    margin: 0;
    color: #454d5b;
    font-size: 12px;
    line-height: 1.45;
}

.feed-post-card .comment-form {
    display: flex;
    align-items: flex-end;
    gap: 9px;
}

.feed-post-card .comment-text {
    min-height: 42px;
    max-height: 120px;
    flex: 1;
    padding: 10px 12px;
    border: 1px solid #d8dde6;
    border-radius: 11px;
    background: #fff;
    font: inherit;
    font-size: 12px;
    resize: vertical;
}

.feed-post-card .send-comment {
    min-height: 42px;
    padding: 9px 13px;
    border-radius: 10px;
    background: var(--color-primary);
    color: #fff;
    font-weight: 750;
}

@media (max-width: 980px) {
    .feed-container {
        width: min(calc(100% - 28px), 760px);
        grid-template-columns: minmax(0, 720px);
    }

    .feed-sidebar {
        display: none;
    }
}

@media (max-width: 620px) {
    .feed-container {
        width: 100%;
        padding: 10px 0 34px;
        gap: 10px;
    }

    .create-post-card,
    .feed-post-card {
        border-left: 0;
        border-right: 0;
        border-radius: 0;
        box-shadow: 0 2px 10px rgba(28,38,55,.045);
    }

    .create-post-card {
        padding: 15px;
    }

    .feed-post-card .post-header {
        padding: 13px 14px 11px;
    }

    .feed-post-card .post-text {
        padding: 1px 14px 13px;
    }

    .feed-post-card .post-image-wrap,
    .feed-post-card .post-image {
        max-height: 480px !important;
    }

    .feed-post-card .post-actions {
        padding-left: 8px;
        padding-right: 8px;
    }

    .feed-post-card .action-label {
        font-size: 12px;
    }

    .feed-post-card .comments-panel {
        padding: 12px;
    }
}


/* =========================================================
   SEGUIDORES / SIGUIENDO — V11
========================================================= */

.profile-social-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 22px 0;
    overflow: hidden;
    background: #f8f9fb;
    border: 1px solid var(--color-border);
    border-radius: 14px;
}

.profile-social-stat {
    padding: 16px 10px;
    text-align: center;
    border-right: 1px solid var(--color-border);
}

.profile-social-stat:last-child {
    border-right: 0;
}

.profile-social-stat strong {
    display: block;
    color: var(--color-text);
    font-size: 20px;
    line-height: 1.1;
}

.profile-social-stat span {
    display: block;
    margin-top: 4px;
    color: var(--color-text-light);
    font-size: 12px;
    font-weight: 650;
}

.follow-form {
    margin: 0;
}

.follow-button {
    min-height: 44px;
    padding: 10px 18px;
    border-radius: 10px;
    border: 1px solid transparent;
    font: inherit;
    font-weight: 750;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.follow-button.is-following {
    color: #4e586a;
    background: #f4f5f7;
    border-color: #dfe3e8;
}

.follow-button.is-following:hover {
    color: #b42318;
    background: #fff5f4;
    border-color: #f0c7c3;
}

@media (max-width: 560px) {
    .profile-social-stats {
        margin: 17px 0;
    }

    .profile-social-stat {
        padding: 13px 6px;
    }

    .profile-social-stat strong {
        font-size: 18px;
    }

    .profile-social-stat span {
        font-size: 11px;
    }

    .follow-form,
    .follow-button {
        width: 100%;
    }
}


/* =========================================================
   SEGUIR DESDE EL FEED — V11.1
   La acción pertenece al autor, por eso se sitúa en la cabecera
   de la tarjeta y no junto a Me gusta / Comentar.
========================================================= */

.feed-post-card .post-header {
    position: relative;
}

.feed-post-card .post-author {
    flex: 1 1 auto;
}

.feed-follow-form {
    margin: 0 0 0 auto;
    flex: 0 0 auto;
}

.feed-follow-button {
    min-width: 82px;
    min-height: 34px;
    padding: 7px 12px;
    color: var(--color-primary);
    background: #fff1e9;
    border: 1px solid #d9e1ff;
    border-radius: 999px;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.feed-follow-button:hover {
    background: #e3e9ff;
    border-color: #c8d3ff;
}

.feed-follow-button.is-following {
    color: #596273;
    background: #f5f6f8;
    border-color: #dfe3e8;
}

.feed-follow-button.is-following:hover {
    color: #b42318;
    background: #fff5f4;
    border-color: #f0c7c3;
}

.feed-follow-button.is-following:hover::after {
    content: " · Dejar";
}

@media (max-width: 520px) {
    .feed-follow-button {
        min-width: 72px;
        padding: 7px 10px;
        font-size: 11px;
    }

    .feed-follow-button.is-following:hover::after {
        content: "";
    }
}


/* V11.2 — contador de seguidores junto a Seguir */
.feed-followers-count {
    display: inline-flex;
    align-items: center;
    margin-right: 8px;
    color: #7a8290;
    font-size: 12px;
    font-weight: 650;
    white-space: nowrap;
}

.feed-follow-wrap,
.post-follow-action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
}

@media (max-width: 520px) {
    .feed-followers-count {
        margin-right: 4px;
        font-size: 11px;
    }
}


/* V11.3 — mostrar seguidores también en publicaciones propias */
.post-header .feed-followers-count {
    margin-left: auto;
}


/* =========================================================
   AJUSTES + NOTIFICACIONES — V12
========================================================= */

.settings-page,
.notifications-page {
    width: min(calc(100% - 32px), 860px);
    margin: 28px auto 60px;
}

.settings-header,
.notifications-header {
    margin-bottom: 18px;
}

.settings-header h1,
.notifications-header h1 {
    margin: 3px 0 6px;
    font-size: clamp(28px, 4vw, 38px);
    letter-spacing: -.8px;
}

.settings-header p,
.notifications-header p {
    margin: 0;
    color: var(--color-text-light);
}

.settings-kicker {
    color: var(--color-primary);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.settings-stack {
    display: grid;
    gap: 16px;
}

.settings-card,
.notifications-card,
.private-profile-card {
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 18px;
    box-shadow: var(--shadow);
}

.settings-card {
    padding: 20px;
}

.settings-card-title {
    display: flex;
    gap: 13px;
    align-items: flex-start;
    margin-bottom: 8px;
}

.settings-card-title h2 {
    margin: 0;
    font-size: 18px;
}

.settings-card-title p {
    margin: 4px 0 0;
    color: var(--color-text-light);
    font-size: 13px;
}

.settings-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    background: #fff1e9;
    border-radius: 11px;
    color: var(--color-primary);
    font-weight: 800;
}

.settings-icon.danger {
    color: #b42318;
    background: #fff1f0;
}

.setting-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 17px 2px;
    border-top: 1px solid var(--color-border);
    cursor: pointer;
}

.setting-row > span:first-child {
    min-width: 0;
}

.setting-row strong,
.setting-row small {
    display: block;
}

.setting-row strong {
    font-size: 14px;
}

.setting-row small {
    max-width: 610px;
    margin-top: 4px;
    color: var(--color-text-light);
    font-size: 12px;
    line-height: 1.45;
}

.switch {
    position: relative;
    width: 46px;
    height: 26px;
    flex: 0 0 46px;
}

.switch input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.switch-slider {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background: #d8dde6;
    transition: .2s ease;
}

.switch-slider::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    left: 3px;
    top: 3px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,.18);
    transition: .2s ease;
}

.switch input:checked + .switch-slider {
    background: var(--color-primary);
}

.switch input:checked + .switch-slider::after {
    transform: translateX(20px);
}

.settings-savebar {
    display: flex;
    justify-content: flex-end;
    padding: 2px 0 8px;
}

.danger-card {
    margin-top: 24px;
    border-color: #f0d0cc;
}

.delete-account-details {
    border-top: 1px solid var(--color-border);
    padding-top: 14px;
}

.delete-account-details summary {
    color: #b42318;
    font-size: 13px;
    font-weight: 750;
    cursor: pointer;
}

.delete-account-panel {
    margin-top: 15px;
    padding: 16px;
    background: #fff8f7;
    border-radius: 12px;
}

.delete-account-panel > p {
    margin-top: 0;
    color: #6f4a46;
    font-size: 13px;
}

.delete-account-form {
    display: grid;
    gap: 12px;
}

.delete-account-form label span {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 700;
}

.delete-account-form input {
    width: 100%;
    padding: 11px 12px;
    border: 1px solid #d9dde5;
    border-radius: 9px;
    font: inherit;
}

.danger-button {
    justify-self: start;
    padding: 11px 15px;
    border: 0;
    border-radius: 9px;
    color: #fff;
    background: #b42318;
    font-weight: 750;
    cursor: pointer;
}

.notifications-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.secondary-button {
    padding: 9px 12px;
    color: #4e586a;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 9px;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.notifications-card {
    overflow: hidden;
}

.notification-item {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 14px 17px;
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid var(--color-border);
    transition: background .18s ease;
}

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

.notification-item:hover {
    background: #f8f9fb;
}

.notification-item.is-unread {
    background: #f3f6ff;
}

.notification-avatar {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 50%;
    object-fit: cover;
    background: #eef0f4;
}

.notification-content {
    min-width: 0;
    flex: 1;
}

.notification-content strong,
.notification-content span,
.notification-content time {
    display: block;
}

.notification-content strong {
    font-size: 13px;
}

.notification-content span {
    margin-top: 2px;
    color: #525c6c;
    font-size: 13px;
}

.notification-content time {
    margin-top: 4px;
    color: #9299a5;
    font-size: 10px;
}

.notification-dot {
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border-radius: 50%;
    background: var(--color-primary);
}

.notifications-empty {
    padding: 54px 24px;
    text-align: center;
    color: var(--color-text-light);
}

.notifications-empty > div {
    font-size: 34px;
}

.notifications-empty h2 {
    margin: 10px 0 4px;
    color: var(--color-text);
    font-size: 20px;
}

.notifications-empty p {
    margin: 0;
    font-size: 13px;
}

.nav-notifications {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

.nav-badge {
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #e5484d;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

.private-profile-page {
    width: min(calc(100% - 32px), 620px);
    margin: 60px auto;
}

.private-profile-card {
    padding: 42px 28px;
    text-align: center;
}

.private-profile-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 15px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: #fff1e9;
    color: var(--color-primary);
    font-size: 28px;
}

.private-profile-card h1 {
    margin: 0 0 8px;
}

.private-profile-card p {
    margin: 0 auto 22px;
    color: var(--color-text-light);
}

.profile-action-disabled {
    display: inline-flex;
    align-items: center;
    padding: 10px 14px;
    color: #858d9b;
    background: #f4f5f7;
    border: 1px solid #e1e4e9;
    border-radius: 9px;
    font-size: 12px;
    font-weight: 700;
}

.chat-disabled-notice {
    margin: 14px 18px;
    padding: 13px 15px;
    color: #697180;
    background: #f3f4f6;
    border: 1px solid #e1e4e9;
    border-radius: 10px;
    font-size: 13px;
    text-align: center;
}

@media (max-width: 640px) {
    .settings-page,
    .notifications-page {
        width: min(calc(100% - 20px), 860px);
        margin-top: 18px;
    }

    .settings-card {
        padding: 16px;
    }

    .setting-row {
        gap: 14px;
    }

    .notifications-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .notifications-header form,
    .notifications-header .secondary-button {
        width: 100%;
    }

    .notification-item {
        padding: 12px;
    }
}


/* V12.1 — aviso de mensajería desactivada */
.chat-disabled-notice a {
    color: var(--color-primary);
    font-weight: 750;
    text-decoration: none;
}

.chat-disabled-notice a:hover {
    text-decoration: underline;
}


/* =========================================================
   GESTIÓN DE SESIONES — V12.2
========================================================= */

.security-card {
    margin-top: 24px;
}

.sessions-list {
    margin-top: 8px;
    border-top: 1px solid var(--color-border);
}

.session-row {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 15px 2px;
    border-bottom: 1px solid var(--color-border);
}

.session-row.is-current {
    background: linear-gradient(90deg, rgba(238,242,255,.65), rgba(255,255,255,0));
}

.session-device-icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #f1f3f7;
    color: #5d6675;
    font-size: 18px;
}

.session-main {
    min-width: 0;
    flex: 1;
}

.session-title-line {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.session-main strong {
    font-size: 13px;
}

.session-main small {
    display: block;
    margin-top: 3px;
    color: var(--color-text-light);
    font-size: 11px;
}

.current-session-badge {
    display: inline-flex;
    align-items: center;
    min-height: 20px;
    padding: 3px 7px;
    border-radius: 999px;
    background: #eaf7ef;
    color: #247447;
    font-size: 10px;
    font-weight: 800;
}

.session-close-button {
    padding: 8px 10px;
    border: 1px solid #e2e5ea;
    border-radius: 8px;
    background: #fff;
    color: #687181;
    font: inherit;
    font-size: 11px;
    font-weight: 750;
    cursor: pointer;
}

.session-close-button:hover {
    color: #b42318;
    border-color: #efc8c4;
    background: #fff7f6;
}

.close-other-sessions {
    display: flex;
    justify-content: flex-end;
    margin-top: 14px;
}

.password-details {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--color-border);
}

.password-details summary {
    color: var(--color-primary);
    font-size: 13px;
    font-weight: 750;
    cursor: pointer;
}

.password-change-form {
    display: grid;
    gap: 12px;
    margin-top: 14px;
    padding: 16px;
    border-radius: 12px;
    background: #f8f9fb;
}

.password-change-form label span {
    display: block;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 700;
}

.password-change-form input {
    width: 100%;
    padding: 11px 12px;
    border: 1px solid #d9dde5;
    border-radius: 9px;
    font: inherit;
    background: #fff;
}

.password-change-form .btn-primary {
    justify-self: start;
}

@media (max-width: 560px) {
    .session-row {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .session-row form {
        width: 100%;
        padding-left: 53px;
    }

    .session-close-button {
        width: 100%;
    }
}


/* =========================================================
   USUARIO ACTUAL EN AJUSTES — V12.3
========================================================= */

.settings-current-user {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 18px;
    padding: 15px 17px;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 16px;
    box-shadow: var(--shadow);
}

.settings-current-user-avatar-link {
    display: block;
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border-radius: 50%;
    overflow: hidden;
}

.settings-current-user-avatar {
    width: 54px;
    height: 54px;
    display: block;
    object-fit: cover;
    border-radius: 50%;
    background: #eef0f4;
}

.settings-current-user-info {
    min-width: 0;
    flex: 1;
}

.settings-current-user-label,
.settings-current-user-email {
    display: block;
    color: var(--color-text-light);
}

.settings-current-user-label {
    margin-bottom: 2px;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .35px;
    text-transform: uppercase;
}

.settings-current-user-name {
    display: inline-block;
    max-width: 100%;
    color: var(--color-text);
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.settings-current-user-name:hover {
    color: var(--color-primary);
}

.settings-current-user-email {
    margin-top: 3px;
    font-size: 11px;
    overflow-wrap: anywhere;
}

.settings-current-user-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 25px;
    padding: 5px 9px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: #fff1e9;
    color: var(--color-primary);
    font-size: 10px;
    font-weight: 800;
}

@media (max-width: 520px) {
    .settings-current-user {
        padding: 13px 14px;
        gap: 12px;
    }

    .settings-current-user-avatar-link,
    .settings-current-user-avatar {
        width: 48px;
        height: 48px;
    }

    .settings-current-user-avatar-link {
        flex-basis: 48px;
    }

    .settings-current-user-name {
        font-size: 15px;
    }

    .settings-current-user-badge {
        display: none;
    }
}

/* =========================================================
   V13 — NUEVA PORTADA CLANDELERO
   Añadido al final para no alterar estilos estabilizados.
========================================================= */
.landing-v13 {
    background: #f4f1ec;
    color: #171923;
}

.landing-v13 .v13-home {
    overflow: hidden;
}

.v13-hero {
    position: relative;
    min-height: calc(100vh - 76px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    background:
        radial-gradient(circle at 82% 18%, rgba(143, 110, 255, .24), transparent 27%),
        radial-gradient(circle at 65% 72%, rgba(255, 157, 87, .15), transparent 28%),
        linear-gradient(135deg, #11131a 0%, #171827 55%, #21192d 100%);
    color: #fff;
    isolation: isolate;
}

.v13-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .22;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 64px 64px;
    mask-image: linear-gradient(to bottom, black 0%, transparent 92%);
}

.v13-hero-inner {
    width: min(1240px, calc(100% - 48px));
    margin: 0 auto;
    padding: 82px 0 94px;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
    align-items: center;
    gap: 70px;
}

.v13-hero-copy { position: relative; z-index: 2; }
.v13-eyebrow,
.v13-section-kicker {
    display: inline-block;
    color: #d56a50;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 2.2px;
}

.v13-hero h1 {
    max-width: 760px;
    margin: 18px 0 24px;
    font-size: clamp(58px, 7.7vw, 112px);
    line-height: .88;
    letter-spacing: -6px;
    font-weight: 850;
}

.v13-hero h1 span {
    color: #a797ff;
}

.v13-hero-text {
    max-width: 680px;
    color: rgba(255,255,255,.76);
    font-size: clamp(17px, 1.7vw, 21px);
    line-height: 1.65;
}

.v13-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 32px;
}

.v13-btn-light {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border: 1px solid rgba(255,255,255,.27);
    background: rgba(255,255,255,.07);
    text-decoration: none;
    font-weight: 750;
    transition: .2s ease;
}
.v13-btn-light:hover { background: rgba(255,255,255,.13); transform: translateY(-1px); }

.v13-guest-note {
    max-width: 650px;
    margin-top: 18px;
    color: rgba(255,255,255,.53);
    font-size: 12px;
    line-height: 1.55;
}

.v13-art-stage {
    position: relative;
    min-height: 500px;
    perspective: 1000px;
}

.v13-art-card {
    position: absolute;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.18);
    box-shadow: 0 30px 70px rgba(0,0,0,.28);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: transform .35s ease;
}

.v13-art-card-main {
    width: min(100%, 410px);
    height: 370px;
    top: 55px;
    left: 50%;
    transform: translateX(-50%) rotate(-3deg);
    padding: 34px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    border-radius: 30px;
    background:
        linear-gradient(to top, rgba(18,18,28,.82), rgba(18,18,28,.08)),
        radial-gradient(circle at 30% 25%, #fdba74, transparent 30%),
        radial-gradient(circle at 68% 44%, #8b5cf6, transparent 27%),
        linear-gradient(145deg, #20335b, #32214a 52%, #bf6b4b);
}
.v13-art-card-main::before {
    content: "";
    position: absolute;
    width: 180px; height: 180px;
    top: 55px; left: 55px;
    border: 25px solid rgba(255,255,255,.18);
    border-radius: 49% 51% 42% 58%;
    transform: rotate(20deg);
}
.v13-art-card-main strong { position: relative; font-size: 27px; line-height: 1.18; }
.v13-art-tag { position: relative; margin-bottom: 10px; color: #e0dcff; font-size: 10px; font-weight: 850; letter-spacing: 1.6px; }

.v13-art-card-top,
.v13-art-card-bottom {
    width: 165px;
    height: 155px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 23px;
    background: rgba(255,255,255,.10);
}
.v13-art-card-top { right: -8px; top: 0; transform: rotate(8deg); }
.v13-art-card-bottom { left: -8px; bottom: 7px; transform: rotate(-8deg); }
.v13-art-card-top span, .v13-art-card-bottom span { font-size: 40px; color: #f0a37f; }
.v13-art-card-top strong, .v13-art-card-bottom strong { font-size: 18px; }
.v13-art-orbit {
    position: absolute;
    width: 430px; height: 430px;
    left: 50%; top: 50%;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 50%;
    transform: translate(-50%,-50%);
    z-index: -1;
}
.v13-art-orbit::after {
    content: "";
    position: absolute;
    width: 9px; height: 9px;
    border-radius: 50%;
    background: #ef9c44;
    top: 52px; right: 45px;
    box-shadow: 0 0 28px #ef9c44;
}

.v13-hero-glow { position: absolute; border-radius: 50%; filter: blur(30px); z-index: -1; }
.v13-glow-one { width: 370px; height: 370px; right: 12%; top: 15%; background: rgba(91,71,180,.20); }
.v13-glow-two { width: 250px; height: 250px; left: 2%; bottom: 2%; background: rgba(229,113,65,.09); }

.v13-scroll-link {
    position: absolute;
    left: 50%; bottom: 22px;
    transform: translateX(-50%);
    color: rgba(255,255,255,.58);
    text-decoration: none;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .4px;
}
.v13-scroll-link span { margin-left: 7px; }

.v13-intro {
    padding: 110px 24px 120px;
    background: #f4f1ec;
}
.v13-section-heading {
    width: min(800px, 100%);
    margin: 0 auto 58px;
    text-align: center;
}
.v13-section-heading .v13-section-kicker,
.v13-disciplines .v13-section-kicker,
.v13-cta .v13-section-kicker { color: #6759ca; }
.v13-section-heading h2,
.v13-disciplines h2,
.v13-cta h2 {
    margin: 12px 0 15px;
    font-size: clamp(38px, 5vw, 64px);
    line-height: 1;
    letter-spacing: -2.8px;
}
.v13-section-heading p,
.v13-disciplines-copy p { color: #6d6c73; font-size: 16px; }

.v13-feature-grid {
    width: min(1160px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 18px;
}
.v13-feature-card {
    position: relative;
    min-height: 390px;
    padding: 34px;
    display: flex;
    flex-direction: column;
    border-radius: 26px;
    border: 1px solid rgba(22,24,35,.08);
    background: rgba(255,255,255,.7);
    box-shadow: 0 16px 45px rgba(36,32,47,.06);
    transition: transform .25s ease, box-shadow .25s ease;
}
.v13-feature-card:hover { transform: translateY(-6px); box-shadow: 0 24px 60px rgba(36,32,47,.10); }
.v13-feature-number { color: #99949c; font-size: 11px; font-weight: 800; }
.v13-feature-symbol {
    width: 68px; height: 68px;
    margin: 54px 0 24px;
    display: grid; place-items: center;
    border-radius: 20px;
    font-size: 28px;
}
.v13-feature-share .v13-feature-symbol { background: #ebe7ff; color: #6657d7; }
.v13-feature-connect .v13-feature-symbol { background: #ffe9da; color: #c56f38; }
.v13-feature-discover .v13-feature-symbol { background: #def0ec; color: #368478; }
.v13-feature-card h3 { margin-bottom: 10px; font-size: 29px; letter-spacing: -1px; }
.v13-feature-card p { color: #6e6d73; font-size: 14px; line-height: 1.65; }
.v13-feature-card a {
    margin-top: auto;
    padding-top: 28px;
    color: #27252d;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
}
.v13-feature-card a span { margin-left: 5px; }

.v13-disciplines {
    padding: 105px max(24px, calc((100% - 1160px)/2));
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 80px;
    align-items: center;
    background: #181921;
    color: #fff;
}
.v13-disciplines h2 { max-width: 570px; font-size: clamp(39px,4.7vw,62px); }
.v13-disciplines-copy p { max-width: 600px; color: rgba(255,255,255,.58); line-height: 1.7; }
.v13-discipline-cloud { display: flex; flex-wrap: wrap; gap: 12px; align-content: center; }
.v13-discipline-cloud span {
    padding: 14px 19px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.82);
    font-size: 14px;
    transition: .2s ease;
}
.v13-discipline-cloud span:hover { transform: translateY(-2px); background: rgba(167,151,255,.15); border-color: rgba(167,151,255,.40); }

.v13-cta {
    padding: 90px max(24px, calc((100% - 1160px)/2));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 45px;
    background: #e8e2ff;
}
.v13-cta h2 { max-width: 760px; margin-bottom: 0; font-size: clamp(36px,4.6vw,58px); }
.v13-cta-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 18px; }
.v13-text-link { color: #383149; font-size: 13px; font-weight: 800; text-decoration: none; }

.v13-reveal { opacity: 0; transform: translateY(22px); transition: opacity .65s ease, transform .65s ease; }
.v13-reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 980px) {
    .v13-hero-inner { grid-template-columns: 1fr; gap: 18px; padding-top: 70px; }
    .v13-art-stage { min-height: 420px; width: min(520px,100%); margin: 0 auto; }
    .v13-feature-grid { grid-template-columns: 1fr; }
    .v13-feature-card { min-height: 300px; }
    .v13-feature-symbol { margin-top: 35px; }
    .v13-disciplines { grid-template-columns: 1fr; gap: 45px; }
    .v13-cta { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 760px) {
    .landing-v13 { padding-top: 68px; }
    .v13-hero { min-height: calc(100vh - 68px); }
    .v13-hero-inner { width: min(100% - 30px,1240px); padding: 54px 0 82px; }
    .v13-hero h1 { margin-top: 14px; font-size: clamp(52px,17vw,78px); letter-spacing: -4px; }
    .v13-hero-actions { flex-direction: column; }
    .v13-hero-actions a { width: 100%; }
    .v13-art-stage { min-height: 345px; transform: scale(.92); transform-origin: center top; }
    .v13-art-card-main { width: 310px; height: 285px; padding: 25px; }
    .v13-art-card-main strong { font-size: 22px; }
    .v13-art-card-top,.v13-art-card-bottom { width: 125px; height: 120px; padding: 16px; }
    .v13-art-card-top { right: -2px; }
    .v13-art-card-bottom { left: -2px; }
    .v13-art-orbit { width: 330px; height: 330px; }
    .v13-intro { padding: 78px 15px 85px; }
    .v13-section-heading { margin-bottom: 36px; }
    .v13-feature-card { padding: 27px; border-radius: 21px; }
    .v13-disciplines { padding-top: 78px; padding-bottom: 78px; }
    .v13-cta { padding-top: 68px; padding-bottom: 68px; }
    .v13-cta-actions { width: 100%; flex-direction: column; align-items: stretch; }
    .v13-cta-actions .btn-primary { width: 100%; }
    .v13-text-link { text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
    .v13-reveal { opacity: 1; transform: none; transition: none; }
    .v13-feature-card, .v13-art-card, .v13-discipline-cloud span { transition: none; }
}


/* =========================================================
   V13.1 — MODO VISITANTE / MODAL DE ACCESO
========================================================= */
.guest-create-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border: 1px solid #dde3ee;
    background: linear-gradient(135deg, #ffffff, #f5f7ff);
}
.guest-create-card p { margin-top: 5px; color: var(--color-text-light); font-size: 14px; }
.guest-kicker { display: block; margin-bottom: 3px; color: var(--color-primary); font-size: 10px; font-weight: 850; letter-spacing: 1.3px; }
.guest-comment-cta { padding-top: 8px; }
.guest-comment-cta .btn-primary { width: 100%; }

.auth-gate {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.auth-gate.is-open { display: flex; }
.auth-gate-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 14, 24, .58);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
.auth-gate-dialog {
    position: relative;
    z-index: 1;
    width: min(100%, 510px);
    padding: 38px;
    border: 1px solid rgba(255,255,255,.75);
    border-radius: 24px;
    background: rgba(255,255,255,.98);
    box-shadow: 0 30px 90px rgba(10, 20, 40, .28);
    outline: none;
    animation: authGateIn .2s ease-out;
}
.auth-gate-close {
    position: absolute;
    top: 13px;
    right: 15px;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background: #f1f3f7;
    color: #4b5363;
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
}
.auth-gate-kicker { display: block; margin-bottom: 8px; color: var(--color-primary); font-size: 10px; font-weight: 850; letter-spacing: 1.5px; }
.auth-gate-dialog h2 { padding-right: 25px; font-size: clamp(26px, 5vw, 34px); line-height: 1.12; letter-spacing: -.7px; }
.auth-gate-dialog p { margin-top: 13px; color: var(--color-text-light); font-size: 15px; line-height: 1.6; }
.auth-gate-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin-top: 27px; }
.auth-gate-actions .btn-primary,
.auth-gate-actions .profile-action-secondary { min-height: 48px; }
.auth-gate-continue {
    width: 100%;
    margin-top: 13px;
    padding: 8px;
    border: 0;
    background: transparent;
    color: #687184;
    font-weight: 700;
    cursor: pointer;
}
.auth-gate-continue:hover { color: var(--color-primary); }
.auth-gate-open { overflow: hidden; }
@keyframes authGateIn { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }

@media (max-width: 620px) {
    .guest-create-card { align-items: stretch; flex-direction: column; }
    .auth-gate-dialog { padding: 31px 22px 24px; border-radius: 20px; }
    .auth-gate-actions { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .auth-gate-dialog { animation: none; } }

/* =========================================================
   V13.2 — PERFIL COMO MINI PORTAFOLIO
========================================================= */
.auto-link {
    color: var(--color-primary);
    font-weight: 650;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
    overflow-wrap: anywhere;
}
.auto-link:hover { color: var(--color-primary-dark); }
.chat-bubble .auto-link { color: #245fc3; }

.portfolio-profile-page { width: min(100% - 40px, 1080px); }
.portfolio-profile-card { padding: clamp(24px, 4vw, 46px); }
.portfolio-profile-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}
.portfolio-edit-shortcut { flex: 0 0 auto; }
.portfolio-hero {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 30px;
    padding: 30px;
    border: 1px solid #e6eaf2;
    border-radius: 22px;
    background: linear-gradient(135deg, #f8f9ff, #f4f7fb);
}
.portfolio-identity h2 { font-size: clamp(28px, 4vw, 38px); }
.portfolio-intro {
    max-width: 720px;
    margin-top: 14px;
    color: #3f4756;
    font-size: 16px;
    line-height: 1.7;
}
.portfolio-empty-inline { margin-top: 13px; color: var(--color-muted); font-size: 14px; }
.portfolio-about-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(240px, .7fr);
    gap: 18px;
    margin-top: 22px;
}
.portfolio-section,
.portfolio-meta-card {
    border: 1px solid #e7eaf0;
    border-radius: 18px;
    background: #fff;
}
.portfolio-section { padding: 26px; }
.portfolio-section-heading { margin-bottom: 18px; }
.portfolio-section-heading h2 { margin: 2px 0 0; font-size: 24px; letter-spacing: -.4px; }
.portfolio-section-heading p { margin-top: 5px; color: var(--color-text-light); font-size: 14px; }
.portfolio-section-kicker {
    color: var(--color-primary);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 1.4px;
}
.portfolio-rich-text { color: #3d4655; font-size: 15px; line-height: 1.78; overflow-wrap: anywhere; }
.portfolio-empty { color: var(--color-muted); font-size: 14px; line-height: 1.65; }
.portfolio-meta-card { padding: 8px 20px; background: #fafbfc; }
.portfolio-meta-card > div { padding: 17px 0; border-bottom: 1px solid #e9ecf1; }
.portfolio-meta-card > div:last-child { border-bottom: 0; }
.portfolio-meta-card span,
.portfolio-meta-card strong { display: block; }
.portfolio-meta-card span { margin-bottom: 4px; color: var(--color-muted); font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .5px; }
.portfolio-meta-card strong { color: #303746; font-size: 14px; overflow-wrap: anywhere; }
.portfolio-gallery-section { margin-top: 18px; }
.portfolio-gallery-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}
.portfolio-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}
.portfolio-item {
    overflow: hidden;
    border: 1px solid #e4e8ef;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(18, 24, 40, .05);
}
.portfolio-media-link { display: block; background: #f1f3f6; }
.portfolio-item img {
    display: block;
    width: 100%;
    height: 300px;
    object-fit: cover;
}
.portfolio-video-wrap { position: relative; aspect-ratio: 16 / 9; background: #111; }
.portfolio-video-wrap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.portfolio-item-copy { padding: 16px 17px 18px; }
.portfolio-item-copy h3 { margin: 0 0 7px; font-size: 16px; }
.portfolio-item-description { color: #596273; font-size: 13px; line-height: 1.6; }
.portfolio-youtube-link { display: inline-flex; margin-top: 10px; color: var(--color-primary); font-size: 12px; font-weight: 800; text-decoration: none; }
.portfolio-youtube-link:hover { text-decoration: underline; }
.portfolio-empty-gallery {
    min-height: 170px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 10px;
    padding: 28px;
    border: 1px dashed #d8dee8;
    border-radius: 15px;
    background: #fafbfc;
    color: var(--color-muted);
    text-align: center;
}
.portfolio-empty-gallery span { font-size: 30px; }
.portfolio-empty-gallery p { max-width: 560px; font-size: 14px; }
.portfolio-actions { flex-wrap: wrap; }

/* Editor del perfil / portafolio */
.profile-editor-page { width: min(100% - 40px, 920px); margin: 0 auto; padding: 48px 0 72px; }
.profile-editor-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}
.profile-editor-header h1 { margin-top: 4px; font-size: clamp(32px, 5vw, 44px); letter-spacing: -1px; }
.profile-editor-header p { max-width: 680px; margin-top: 7px; color: var(--color-text-light); }
.profile-editor-card {
    margin-top: 18px;
    padding: 30px;
    border: 1px solid #e3e7ee;
    border-radius: 21px;
    background: #fff;
    box-shadow: var(--shadow-soft);
}
.profile-editor-card-heading { margin-bottom: 25px; }
.profile-editor-card-heading h2 { margin-top: 3px; font-size: 26px; }
.profile-editor-specialty { margin-top: 3px; color: var(--color-primary); font-size: 13px; font-weight: 750; }
.profile-editor-form { display: flex; flex-direction: column; gap: 20px; }
.profile-editor-form .form-field textarea,
.profile-editor-form .form-field input[type="text"],
.profile-editor-form .form-field input[type="url"] {
    width: 100%;
    padding: 12px 13px;
    border: 1px solid #dfe3ea;
    border-radius: 11px;
    background: #fff;
    color: var(--color-text);
    font: inherit;
    outline: none;
    resize: vertical;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.profile-editor-form .form-field textarea:focus,
.profile-editor-form .form-field input[type="text"]:focus,
.profile-editor-form .form-field input[type="url"]:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 4px rgba(240,68,31,.1);
}
.char-counter { color: var(--color-muted); font-size: 11px; font-weight: 700; }
.portfolio-editor-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.portfolio-slot-badge { padding: 6px 10px; border-radius: 999px; background: #fff1e9; color: #a9472f; font-size: 11px; font-weight: 800; }
.portfolio-source-grid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: stretch; gap: 14px; }
.portfolio-source-card { padding: 18px; border: 1px solid #e1e5ec; border-radius: 14px; background: #fafbfc; }
.portfolio-source-card input[type="file"] { width: 100%; }
.portfolio-or { display: grid; place-items: center; color: var(--color-muted); font-size: 12px; font-weight: 800; }
.portfolio-limit-notice { padding: 16px; border-radius: 12px; background: #fff7e8; color: #76581b; font-size: 13px; }
.portfolio-manage-list { display: flex; flex-direction: column; gap: 9px; margin-top: 28px; padding-top: 22px; border-top: 1px solid #edf0f4; }
.portfolio-manage-item { display: grid; grid-template-columns: 72px minmax(0,1fr) auto; align-items: center; gap: 14px; padding: 10px; border: 1px solid #e8ebf0; border-radius: 13px; }
.portfolio-manage-preview { width: 72px; height: 58px; overflow: hidden; display: grid; place-items: center; border-radius: 9px; background: #edf0f4; }
.portfolio-manage-preview img { width: 100%; height: 100%; object-fit: cover; }
.portfolio-video-placeholder { font-size: 23px; color: #575f70; }
.portfolio-manage-copy { min-width: 0; }
.portfolio-manage-copy strong,
.portfolio-manage-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portfolio-manage-copy strong { font-size: 14px; }
.portfolio-manage-copy small { margin-top: 3px; color: var(--color-muted); font-size: 11px; }
.portfolio-delete-button { padding: 8px 11px; border: 1px solid #f0c8c8; border-radius: 9px; background: #fff7f7; color: #a63232; font: inherit; font-size: 12px; font-weight: 750; cursor: pointer; }
.portfolio-delete-button:hover { background: #ffeded; }

@media (max-width: 760px) {
    .portfolio-profile-page,
    .profile-editor-page { width: min(100% - 24px, 1080px); }
    .portfolio-profile-heading,
    .profile-editor-header,
    .portfolio-gallery-heading { flex-direction: column; }
    .portfolio-edit-shortcut { width: 100%; }
    .portfolio-hero { grid-template-columns: 1fr; justify-items: center; text-align: center; padding: 24px 18px; }
    .portfolio-intro { text-align: left; }
    .portfolio-about-grid { grid-template-columns: 1fr; }
    .portfolio-grid { grid-template-columns: 1fr; }
    .portfolio-item img { height: min(68vw, 340px); }
    .profile-editor-page { padding-top: 28px; }
    .profile-editor-card { padding: 23px 18px; }
    .portfolio-source-grid { grid-template-columns: 1fr; }
    .portfolio-or { min-height: 20px; }
    .portfolio-manage-item { grid-template-columns: 58px minmax(0,1fr); }
    .portfolio-manage-preview { width: 58px; height: 50px; }
    .portfolio-manage-item form { grid-column: 1 / -1; }
    .portfolio-delete-button { width: 100%; }
}

/* =========================================================
   V13.2.1 — Portafolio: imágenes completas, edición y visor
========================================================= */
.portfolio-media-link {
    width: 100%;
    aspect-ratio: 1 / 1;
    padding: 0;
    border: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: #eef0f2;
    cursor: zoom-in;
}
.portfolio-item .portfolio-media-link img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
}
.portfolio-manage-preview img {
    object-fit: contain;
    background: #eef0f2;
}

.portfolio-manage-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}
.portfolio-manage-actions form { margin: 0; }
.portfolio-edit-button {
    padding: 8px 11px;
    border: 1px solid #cfd7e6;
    border-radius: 9px;
    background: #f7f9fc;
    color: #33405a;
    font: inherit;
    font-size: 12px;
    font-weight: 750;
    cursor: pointer;
}
.portfolio-edit-button:hover { background: #edf2f8; }
.portfolio-edit-button[aria-expanded="true"] { background: #e9eef8; }
.portfolio-inline-edit {
    grid-column: 1 / -1;
    margin-top: 4px;
    padding: 18px;
    border-top: 1px solid #e8ebf0;
    border-radius: 0 0 10px 10px;
    background: #fafbfc;
}
.portfolio-inline-edit[hidden] { display: none !important; }
.portfolio-inline-edit .form-field + .form-field { margin-top: 14px; }
.portfolio-inline-edit-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}
.portfolio-inline-edit-actions .profile-action-secondary { cursor: pointer; }

body.portfolio-lightbox-open { overflow: hidden; }
.portfolio-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: none;
}
.portfolio-lightbox.is-open { display: block; }
.portfolio-lightbox-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 12, 18, .94);
}
.portfolio-lightbox-panel {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: minmax(52px, 8vw) minmax(0, 1fr) minmax(52px, 8vw);
    grid-template-rows: minmax(0, 1fr) auto;
    align-items: center;
    outline: none;
}
.portfolio-lightbox-figure {
    grid-column: 2;
    grid-row: 1;
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 34px 18px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
}
.portfolio-lightbox-figure img {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 105px);
    width: auto;
    height: auto;
    object-fit: contain;
    box-shadow: 0 12px 45px rgba(0,0,0,.35);
}
.portfolio-lightbox-figure figcaption {
    min-height: 20px;
    max-width: 900px;
    color: #f2f3f6;
    font-size: 13px;
    line-height: 1.4;
    text-align: center;
}
.portfolio-lightbox-close {
    position: absolute;
    top: 16px;
    right: 18px;
    z-index: 3;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 50%;
    background: rgba(20,22,28,.72);
    color: #fff;
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
}
.portfolio-lightbox-nav {
    z-index: 2;
    width: 48px;
    height: 58px;
    justify-self: center;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 14px;
    background: rgba(20,22,28,.66);
    color: #fff;
    font-size: 42px;
    line-height: 1;
    cursor: pointer;
}
.portfolio-lightbox-prev { grid-column: 1; grid-row: 1; }
.portfolio-lightbox-next { grid-column: 3; grid-row: 1; }
.portfolio-lightbox-nav:disabled { opacity: .22; cursor: default; }
.portfolio-lightbox-counter {
    grid-column: 1 / -1;
    grid-row: 2;
    min-height: 34px;
    padding: 6px 16px 12px;
    color: #d9dce3;
    font-size: 12px;
    text-align: center;
}

@media (max-width: 760px) {
    .portfolio-item .portfolio-media-link img { height: 100%; }
    .portfolio-manage-item { grid-template-columns: 58px minmax(0,1fr); }
    .portfolio-manage-actions { grid-column: 1 / -1; justify-content: stretch; }
    .portfolio-manage-actions > * { flex: 1; }
    .portfolio-manage-actions form { display: flex; }
    .portfolio-edit-button,
    .portfolio-delete-button { width: 100%; }
    .portfolio-inline-edit { padding: 16px 12px; }
    .portfolio-lightbox-panel { grid-template-columns: 52px minmax(0,1fr) 52px; }
    .portfolio-lightbox-figure { padding: 60px 6px 12px; }
    .portfolio-lightbox-figure img { max-height: calc(100vh - 135px); }
    .portfolio-lightbox-nav { width: 42px; height: 52px; font-size: 36px; }
    .portfolio-lightbox-close { top: 10px; right: 10px; }
}

/* =========================================================
   V13.2.2 — Corrección de encaje vertical y avisos de subida
========================================================= */
.portfolio-media-link {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background: #eef0f2;
}
.portfolio-item .portfolio-media-link > img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    image-orientation: from-image;
}
.portfolio-upload-warning {
    margin-top: 10px;
    padding: 10px 12px;
    border: 1px solid #efc7c7;
    border-radius: 10px;
    background: #fff5f5;
    color: #9a2f2f;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
}
.portfolio-upload-warning[hidden] { display: none !important; }


/* =========================================================
   V13.3 — CLANDELERO: PORTADA, HERO, TARJETAS Y NAVBAR
   Capa de overrides al final para preservar estilos previos.
========================================================= */
:root {
    --clan-orange: #f0441f;
    --clan-orange-dark: #d93616;
    --clan-amber: #f5a014;
    --clan-ink: #121820;
    --clan-cream: #f8f3eb;
    --clan-paper: #fffdf9;
    --clan-line: rgba(18, 24, 32, .10);
}

/* Navbar compartido: nueva identidad sin cambiar variables globales del resto del sitio. */
.navbar {
    background: rgba(255, 253, 249, .95);
    border-bottom-color: rgba(24, 27, 32, .08);
    box-shadow: 0 3px 18px rgba(48, 39, 26, .055);
}
.nav-content {
    width: min(1280px, calc(100% - 40px));
}
.nav-logo {
    width: clamp(185px, 20vw, 270px);
    padding: 5px 0;
    display: inline-flex;
    align-items: center;
}
.nav-logo img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 54px;
    object-fit: contain;
    object-position: left center;
}
.nav-links {
    gap: 2px;
}
.nav-links a {
    color: #272b31;
    font-size: 13px;
}
.nav-links a:hover {
    background: #fff1e9;
    color: var(--clan-orange-dark);
}
.nav-links .nav-login,
.nav-login {
    background: var(--clan-orange);
    border-radius: 999px;
    box-shadow: 0 7px 18px rgba(240, 68, 31, .18);
}
.nav-links .nav-login:hover,
.nav-login:hover {
    background: var(--clan-orange-dark);
}
.hamburger {
    color: var(--clan-orange);
    border-color: rgba(240, 68, 31, .18);
    background: #fffaf6;
}
.nav-coming-soon {
    opacity: .72;
}

/* Portada */
.landing-v13 {
    background: var(--clan-cream);
    color: var(--clan-ink);
}
.landing-v13 .v13-home {
    background: var(--clan-cream);
}

/* HERO claro. La imagen no contiene texto: todo el texto sigue siendo HTML. */
.v13-hero {
    min-height: calc(100vh - 76px);
    background:
        linear-gradient(90deg, rgba(255,253,249,.93) 0%, rgba(255,253,249,.78) 38%, rgba(255,253,249,.12) 72%),
        url('/images/fondo1.jpg') center center / cover no-repeat;
    color: var(--clan-ink);
}
.v13-hero::after {
    display: none;
}
.v13-hero-inner {
    width: min(1280px, calc(100% - 56px));
    padding: 68px 0 92px;
    grid-template-columns: minmax(0, .92fr) minmax(500px, 1.08fr);
    gap: 38px;
}
.v13-hero-copy {
    z-index: 5;
}
.v13-brand-lockup {
    margin-bottom: 28px;
}
.v13-brand-logo {
    display: block;
    width: min(410px, 82%);
    height: auto;
}
.v13-eyebrow,
.v13-section-kicker {
    color: #5a6069;
}
.v13-hero h1 {
    max-width: 650px;
    margin: 13px 0 22px;
    color: var(--clan-ink);
    font-size: clamp(55px, 6.3vw, 94px);
    line-height: .96;
    letter-spacing: -4.5px;
}
.v13-hero h1 span {
    color: var(--clan-orange);
}
.v13-hero-text {
    max-width: 610px;
    color: #53575d;
    font-size: clamp(17px, 1.45vw, 20px);
    line-height: 1.58;
}
.v13-hero-actions {
    margin-top: 28px;
}
.landing-v13 .btn-primary {
    background: var(--clan-orange);
    border-radius: 999px;
    box-shadow: 0 8px 20px rgba(240,68,31,.17);
}
.landing-v13 .btn-primary:hover {
    background: var(--clan-orange-dark);
    box-shadow: 0 12px 26px rgba(240,68,31,.22);
}
.v13-btn-light {
    color: #20242a;
    border: 1px solid rgba(240,68,31,.58);
    border-radius: 999px;
    background: rgba(255,253,249,.82);
}
.v13-btn-light:hover {
    background: #fff7f2;
    border-color: var(--clan-orange);
}
.v13-guest-note {
    color: #72757a;
}
.v13-scroll-link {
    color: #74777c;
}

/* Pastillas del hero */
.v13-art-stage {
    min-height: 520px;
}
.v13-art-orbit {
    width: 455px;
    height: 455px;
    border: 30px solid rgba(221, 204, 184, .16);
    opacity: .75;
}
.v13-art-orbit::after {
    display: none;
}
.v13-art-card {
    color: #18202a;
    border: 1px solid rgba(255,255,255,.82);
    background-color: rgba(255,255,255,.42);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    box-shadow: 0 22px 48px rgba(55, 48, 41, .11);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.v13-art-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    background: linear-gradient(145deg, rgba(255,255,255,.35), rgba(255,255,255,0) 46%);
}
.v13-art-card-copy {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}
.v13-art-card-main {
    width: min(100%, 430px);
    height: 340px;
    top: 92px;
    left: 47%;
    padding: 36px 34px;
    justify-content: flex-start;
    border-radius: 27px;
    background-image:
        linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.10)),
        url('/images/hero-1.jpg');
}
.v13-art-card-main::before {
    display: none;
}
.v13-art-card-main strong {
    position: relative;
    max-width: 340px;
    margin-top: 12px;
    color: #18202a;
    font-size: 23px;
    line-height: 1.23;
}
.v13-art-tag {
    margin-bottom: 0;
    color: #242a32;
    font-size: 10px;
    letter-spacing: 1.7px;
}
.v13-art-card-top,
.v13-art-card-bottom {
    justify-content: flex-start;
    color: #1b252e;
}
.v13-art-card-top {
    width: 190px;
    height: 205px;
    right: 1%;
    top: 15px;
    padding: 27px 22px;
    transform: rotate(5deg);
    background-image:
        linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.16)),
        url('/images/hero-3.jpg');
}
.v13-art-card-bottom {
    width: 185px;
    height: 195px;
    left: 2%;
    bottom: 3px;
    padding: 25px 21px;
    transform: rotate(-5deg);
    background-image:
        linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.18)),
        url('/images/hero-2.jpg');
}
.v13-art-card-top strong,
.v13-art-card-bottom strong {
    margin-top: 10px;
    color: #27313a;
    font-size: 15px;
    line-height: 1.43;
    font-weight: 550;
}
.v13-hero-glow {
    display: none;
}

/* Bloque Comparte / Conecta / Descubre */
.v13-intro {
    padding: 105px 24px 115px;
    background: #fbf8f3;
}
.v13-section-heading .v13-section-kicker,
.v13-disciplines .v13-section-kicker,
.v13-cta .v13-section-kicker {
    color: var(--clan-orange-dark);
}
.v13-feature-grid {
    gap: 22px;
}
.v13-feature-card {
    min-height: 500px;
    padding: 32px;
    overflow: hidden;
    justify-content: flex-end;
    border: 1px solid rgba(24, 27, 32, .08);
    background-color: #f5efe7;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    box-shadow: 0 18px 42px rgba(45,38,31,.08);
}
.v13-feature-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(35deg,
        rgba(255,253,249,.98) 0%,
        rgba(255,253,249,.93) 32%,
        rgba(255,253,249,.42) 62%,
        rgba(255,253,249,.08) 100%);
}
.v13-feature-card > * {
    position: relative;
    z-index: 1;
}
.v13-feature-share { background-image: url('/images/panel-comparte.jpg'); }
.v13-feature-connect { background-image: url('/images/panel-conecta.jpg'); }
.v13-feature-discover { background-image: url('/images/panel-descubre.jpg'); }
.v13-feature-card h3 {
    width: min(88%, 310px);
    margin-bottom: 10px;
    font-size: 35px;
    letter-spacing: -1.3px;
}
.v13-feature-card p {
    width: min(92%, 330px);
    color: #353a41;
    font-size: 14px;
    line-height: 1.55;
}
.v13-feature-card a {
    width: fit-content;
    margin-top: 22px;
    padding: 10px 14px;
    color: #171b21;
    background: rgba(255,255,255,.84);
    border: 1px solid rgba(20,24,30,.08);
    border-radius: 10px;
    box-shadow: 0 6px 18px rgba(40,35,29,.05);
}

/* Especialidades: sustituye la nube oscura por la familia gráfica 950x950. */
.v13-disciplines {
    padding: 105px max(24px, calc((100% - 1220px)/2));
    grid-template-columns: .62fr 1.38fr;
    gap: 58px;
    background: #f0ece5;
    color: var(--clan-ink);
}
.v13-disciplines h2 {
    max-width: 520px;
}
.v13-disciplines-copy p {
    max-width: 520px;
    color: #666a70;
}
.v13-discipline-gallery {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 13px;
}
.v13-discipline-gallery img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(40,34,27,.09);
    transition: transform .22s ease, box-shadow .22s ease;
}
.v13-discipline-gallery img:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 34px rgba(40,34,27,.13);
}

/* CTA final */
.v13-cta {
    background: #fff8f0;
    border-top: 1px solid rgba(240,68,31,.09);
}
.v13-text-link {
    color: #413b36;
}

/* Rebranding del modal de acceso */
.auth-gate-kicker {
    color: var(--clan-orange);
}

/* Responsive */
@media (max-width: 1080px) {
    .nav-logo { width: 205px; }
    .nav-links a { padding-left: 8px; padding-right: 8px; font-size: 12px; }
    .v13-hero-inner {
        grid-template-columns: minmax(0,.9fr) minmax(440px,1.1fr);
        gap: 20px;
    }
    .v13-art-card-main { width: 390px; }
    .v13-disciplines { grid-template-columns: 1fr; }
    .v13-disciplines-copy { max-width: 760px; }
}

@media (max-width: 980px) {
    .v13-hero {
        background-position: center top;
    }
    .v13-hero-inner {
        grid-template-columns: 1fr;
        gap: 18px;
        padding-top: 54px;
    }
    .v13-hero-copy {
        max-width: 760px;
    }
    .v13-art-stage {
        min-height: 500px;
        width: min(590px, 100%);
    }
    .v13-art-card-main { width: 430px; }
    .v13-feature-grid { grid-template-columns: 1fr; }
    .v13-feature-card {
        min-height: 430px;
        background-position: center 28%;
    }
    .v13-feature-card p { width: min(82%, 540px); }
    .v13-discipline-gallery { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 760px) {
    .landing-v13 { padding-top: 68px; }
    .nav-content { width: min(100% - 24px, 1280px); }
    .nav-logo { width: 185px; }
    .nav-links {
        background: rgba(255,253,249,.99);
    }

    .v13-hero {
        min-height: auto;
        background:
            linear-gradient(rgba(255,253,249,.84), rgba(255,253,249,.74)),
            url('/images/fondo1.jpg') center top / cover no-repeat;
    }
    .v13-hero-inner {
        width: min(100% - 30px, 1280px);
        padding: 42px 0 72px;
    }
    .v13-brand-lockup { margin-bottom: 22px; }
    .v13-brand-logo { width: min(330px, 92%); }
    .v13-hero h1 {
        margin-top: 12px;
        font-size: clamp(48px, 14vw, 68px);
        line-height: .97;
        letter-spacing: -3px;
    }
    .v13-hero-actions { flex-direction: column; }
    .v13-hero-actions a { width: 100%; }
    .v13-art-stage {
        min-height: 390px;
        width: 100%;
        transform: none;
    }
    .v13-art-card-main {
        width: min(80vw, 345px);
        height: 275px;
        top: 58px;
        left: 48%;
        padding: 25px;
    }
    .v13-art-card-main strong { font-size: 18px; }
    .v13-art-card-top {
        width: 135px;
        height: 150px;
        right: 0;
        top: 0;
        padding: 18px 15px;
    }
    .v13-art-card-bottom {
        width: 135px;
        height: 145px;
        left: 0;
        bottom: 0;
        padding: 18px 15px;
    }
    .v13-art-card-top strong,
    .v13-art-card-bottom strong {
        font-size: 12px;
        line-height: 1.35;
    }
    .v13-art-orbit {
        width: 310px;
        height: 310px;
        border-width: 22px;
    }
    .v13-scroll-link { display: none; }

    .v13-intro { padding: 76px 15px 82px; }
    .v13-feature-card {
        min-height: 440px;
        padding: 25px;
    }
    .v13-feature-card h3 { font-size: 31px; }
    .v13-feature-card p {
        width: 100%;
        max-width: 390px;
    }

    .v13-disciplines {
        padding-top: 76px;
        padding-bottom: 76px;
    }
    .v13-discipline-gallery {
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 10px;
    }
    .v13-discipline-gallery img { border-radius: 13px; }

    .v13-cta { padding-top: 66px; padding-bottom: 66px; }
}

@media (max-width: 480px) {
    .v13-art-stage { min-height: 345px; }
    .v13-art-card-main {
        width: min(78vw, 310px);
        height: 250px;
        padding: 21px;
    }
    .v13-art-card-main strong { font-size: 16px; }
    .v13-art-card-top,
    .v13-art-card-bottom {
        width: 120px;
        height: 132px;
        padding: 15px 13px;
    }
    .v13-discipline-gallery { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .v13-feature-card,
    .v13-art-card,
    .v13-discipline-gallery img {
        transition: none;
    }
}


/* =========================================================
   V13.3.1 — Corrección títulos de pastillas del hero
   Evita que reglas antiguas ".v13-art-card-top span" y
   ".v13-art-card-bottom span" agranden/coloreen el v13-art-tag.
========================================================= */
.v13-art-card-top .v13-art-tag,
.v13-art-card-bottom .v13-art-tag {
    display: block;
    margin: 0 0 8px;
    color: #242a32;
    font-size: 10px;
    line-height: 1.2;
    font-weight: 850;
    letter-spacing: 1.7px;
    text-transform: uppercase;
}


/* =========================================================
   V13.4 — CLANDELERO: PALETA GLOBAL
   Rebranding cromático de componentes compartidos.
   No altera estructura ni lógica de páginas.
========================================================= */
:root {
    --color-primary: #f0441f;
    --color-primary-dark: #d93616;
    --color-accent: #f5a014;
    --clan-orange: #f0441f;
    --clan-orange-dark: #d93616;
    --clan-amber: #f5a014;
    --clan-warm-soft: #fff1e9;
    --clan-warm-soft-2: #fff7f2;
    --clan-warm-border: #ffd9cc;
}

/* Botones y enlaces principales compartidos */
.btn-primary,
.nav-login,
.profile-action-primary,
.auth-submit,
.avatar-submit {
    background-color: var(--color-primary);
    color: #fff;
}
.btn-primary:hover,
.nav-login:hover,
.profile-action-primary:hover,
.auth-submit:hover,
.avatar-submit:hover {
    background-color: var(--color-primary-dark);
}

/* Estados de foco: naranja de marca, sin modificar accesibilidad */
input:focus,
textarea:focus,
select:focus,
button:focus-visible,
a:focus-visible {
    outline-color: rgba(240, 68, 31, .42);
}

/* Especialidades / chips anteriormente azules */
.post-specialty,
.portfolio-slot-badge {
    background: var(--clan-warm-soft);
    color: #a9472f !important;
}

/* Mensajes propios de chat: diferenciación cálida y suave */
.chat-bubble-row.mine .chat-bubble {
    background: #fff3ec;
    border-color: #ffd9cc;
}

/* Elementos activos de chat y búsqueda */
.chat-contact.active {
    background: #fff2eb;
    border-color: #ffe1d5;
}
.chat-contact:hover {
    background: #fffaf7;
}
.chat-count {
    color: #d94b28;
    background: #fff1e8;
}

/* Botones antiguos del feed que funcionaban como acciones de marca */
.side-publish,
.chat-fab {
    background: var(--color-primary);
}
.side-publish:hover,
.chat-fab:hover {
    background: var(--color-primary-dark);
}

/* Comentarios / controles suaves: neutrales cálidos en lugar de azul */
.like-btn,
.comment-toggle,
.send-comment {
    background: #fff1e9;
    color: #5d342b;
}
.like-btn.is-liked {
    /* Se conserva como estado semántico diferenciado. */
    background: #ffe9ee;
    color: #be2145;
}

/* Links de autor y navegación contextual */
.post-author-link:hover,
.back-link,
.auth-footer a {
    color: var(--color-primary);
}


/* =========================================================
   V13.5 — EXPLORAR ARTISTAS
========================================================= */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.explore-body {
    min-height: 100vh;
    background: #f8f3eb;
}

.explore-page {
    width: min(1280px, calc(100% - 40px));
    margin: 0 auto;
    padding: 58px 0 84px;
}

.explore-header {
    max-width: 760px;
    margin-bottom: 34px;
}
.explore-kicker {
    display: block;
    margin-bottom: 8px;
    color: var(--color-primary);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 1.8px;
}
.explore-header h1 {
    margin: 0;
    color: #15191f;
    font-size: clamp(42px, 5vw, 68px);
    line-height: 1;
    letter-spacing: -2.8px;
}
.explore-header p {
    margin-top: 14px;
    color: #686b70;
    font-size: 18px;
}

.explore-categories {
    display: grid;
    grid-template-columns: 112px repeat(6, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
    margin-bottom: 30px;
}
.explore-category-all,
.explore-category-card {
    min-width: 0;
    min-height: 150px;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(32,35,40,.09);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 7px 20px rgba(43,36,29,.055);
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.explore-category-all {
    display: grid;
    place-items: center;
    padding: 14px;
    color: #24272c;
    font-weight: 800;
}
.explore-category-all span {
    padding: 8px 12px;
    border-radius: 999px;
    background: #fff1e9;
}
.explore-category-card img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}
.explore-category-link {
    position: absolute;
    left: 12px;
    bottom: 11px;
    z-index: 2;
    padding: 6px 9px;
    border-radius: 8px;
    color: #171b20;
    background: rgba(255,255,255,.92);
    box-shadow: 0 4px 10px rgba(24,24,24,.06);
    font-size: 11px;
    font-weight: 800;
}
.explore-category-card:hover,
.explore-category-all:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(43,36,29,.10);
}
.explore-category-card.active,
.explore-category-all.active {
    border-color: rgba(240,68,31,.65);
    box-shadow: 0 0 0 3px rgba(240,68,31,.10), 0 12px 28px rgba(43,36,29,.08);
}

.explore-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 0 0 24px;
    padding: 18px;
    border: 1px solid rgba(32,35,40,.08);
    border-radius: 17px;
    background: rgba(255,255,255,.80);
}
.explore-search-form {
    min-width: 0;
    flex: 1;
    display: flex;
    gap: 9px;
}
.explore-search-form input[type="search"] {
    min-width: 0;
    flex: 1;
    height: 46px;
    padding: 0 15px;
    border: 1px solid #ddd8d1;
    border-radius: 11px;
    background: #fff;
    color: #262a30;
    font: inherit;
}
.explore-search-form .btn-primary {
    min-height: 46px;
}
.explore-clear {
    display: inline-flex;
    align-items: center;
    padding: 0 8px;
    color: #74777d;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}
.explore-order-form {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
}
.explore-order-form label {
    color: #70747a;
    font-size: 12px;
    font-weight: 700;
}
.explore-order-form select {
    height: 42px;
    padding: 0 34px 0 12px;
    border: 1px solid #ddd8d1;
    border-radius: 10px;
    background: #fff;
    color: #30343a;
    font: inherit;
    font-size: 13px;
}

.explore-results-heading {
    min-height: 34px;
    display: flex;
    align-items: center;
    margin-bottom: 14px;
    color: #7a7d82;
    font-size: 12px;
}
.explore-results-heading strong {
    margin-left: 8px;
    color: #2c3035;
}
.explore-results-heading small {
    margin-left: 6px;
}

.explore-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
.explore-artist-card {
    min-width: 0;
    display: grid;
    grid-template-columns: 82px minmax(0,1fr);
    gap: 16px;
    align-items: start;
    padding: 20px;
    border: 1px solid rgba(32,35,40,.08);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(42,36,30,.055);
    transition: transform .18s ease, box-shadow .18s ease;
}
.explore-artist-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 13px 30px rgba(42,36,30,.09);
}
.explore-artist-avatar-link {
    width: 82px;
    height: 82px;
    display: block;
    overflow: hidden;
    border-radius: 50%;
}
.explore-artist-avatar {
    display: block;
    width: 82px;
    height: 82px;
    object-fit: cover;
    border-radius: 50%;
    background: #ece8e2;
}
.explore-artist-copy {
    min-width: 0;
}
.explore-artist-copy h2 {
    margin: 0 0 4px;
    font-size: 18px;
    line-height: 1.2;
}
.explore-artist-copy h2 a {
    color: #171b20;
    text-decoration: none;
}
.explore-artist-copy h2 a:hover {
    color: var(--color-primary);
}
.explore-artist-specialty {
    display: inline-block;
    color: #a9472f;
    font-size: 11px;
    font-weight: 800;
}
.explore-artist-copy p {
    margin-top: 10px;
    display: -webkit-box;
    overflow: hidden;
    color: #656a71;
    font-size: 13px;
    line-height: 1.5;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
.explore-artist-copy p.is-muted {
    color: #9a9da1;
    font-style: italic;
}
.explore-page-link {
    grid-column: 1 / -1;
    justify-self: end;
    color: #272b30;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}
.explore-page-link:hover {
    color: var(--color-primary);
}

.explore-empty {
    padding: 54px 24px;
    text-align: center;
    border: 1px dashed #d9d3cb;
    border-radius: 18px;
    background: rgba(255,255,255,.65);
}
.explore-empty h2 {
    font-size: 24px;
}
.explore-empty p {
    margin: 8px auto 20px;
    max-width: 600px;
    color: #74777c;
}

@media (max-width: 1120px) {
    .explore-categories {
        grid-template-columns: repeat(4, minmax(0,1fr));
    }
    .explore-category-all {
        min-height: 130px;
    }
    .explore-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 760px) {
    .explore-page {
        width: min(100% - 24px, 1280px);
        padding-top: 34px;
    }
    .explore-header p {
        font-size: 16px;
    }
    .explore-categories {
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 9px;
    }
    .explore-category-all,
    .explore-category-card {
        min-height: 0;
        aspect-ratio: 1 / 1;
        border-radius: 13px;
    }
    .explore-tools {
        align-items: stretch;
        flex-direction: column;
        padding: 13px;
    }
    .explore-search-form {
        flex-wrap: wrap;
    }
    .explore-search-form input[type="search"] {
        flex-basis: calc(100% - 100px);
    }
    .explore-order-form {
        justify-content: space-between;
    }
    .explore-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 430px) {
    .explore-search-form input[type="search"] {
        flex-basis: 100%;
    }
    .explore-search-form .btn-primary {
        flex: 1;
    }
}
.v13-discipline-card {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 18px;
    text-decoration: none;
    color: inherit;
}

.v13-discipline-card img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.v13-discipline-explore {
    position: absolute;
    left: 18px;
    bottom: 16px;
    z-index: 3;

    padding: 5px 9px;
    border-radius: 7px;

    background: rgba(255, 255, 255, .90);
    color: #f0441f;

    font-size: 12px;
    font-weight: 800;
    line-height: 1;

    transition: transform .18s ease, background .18s ease;
}

.v13-discipline-card:hover .v13-discipline-explore {
    transform: translateX(3px);
    background: #fff;
}

.v13-discipline-card:hover img {
    transform: scale(1.015);
}
.v13-hero-explore {
    position: absolute;
    left: 50%;
    bottom: -42px;
    transform: translateX(-50%);
    z-index: 10;

    color: #f0441f;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.v13-hero-explore span {
    display: inline-block;
    margin-left: 5px;
    transition: transform .18s ease;
}

.v13-hero-explore:hover {
    text-decoration: underline;
}

.v13-hero-explore:hover span {
    transform: translateX(4px);
}
.v13-art-stage-link {
    position: absolute;
    inset: 0;
    z-index: 8;
    cursor: pointer;
}
.v13-art-stage {
    cursor: pointer;
}

/* V13.5.4 — Desplazamiento funcional de la tarjeta central del hero.
   PC: al pasar el ratón se desplaza un 20% de su propio ancho hacia la derecha.
   Móvil/tablet: el desplazamiento lo controla index.js mediante arrastre horizontal. */
.v13-art-stage {
    touch-action: pan-y;
}

@media (hover: hover) and (pointer: fine) {
    .v13-art-stage:hover .v13-art-card-main {
        transform: translateX(-30%) rotate(-3deg);
    }
}

@media (hover: none), (pointer: coarse) {
    .v13-art-card-main {
        --v13-card-drag-x: 0px;
        transform: translateX(calc(-50% + var(--v13-card-drag-x))) rotate(-3deg);
    }

    .v13-art-stage.is-dragging .v13-art-card-main {
        transition: none;
    }

    .v13-art-stage:not(.is-dragging) .v13-art-card-main {
        transition: transform .28s ease;
    }
}
/* =========================================================
   V13.6 — EVENTOS + TIPOS DE CUENTA + CAPTACIÓN VISITANTE
========================================================= */
.account-artist-field[hidden],
.account-entity-field[hidden] { display: none !important; }

.events-body,
.event-detail-body,
.event-form-body { background: #fffaf7; }

.events-page,
.event-detail-page,
.event-form-page {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: 54px 0 80px;
}

.events-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 28px;
}
.events-header h1,
.event-detail-content h1,
.event-form-card h1 {
    margin: 7px 0 10px;
    color: #242a32;
    font-size: clamp(34px, 5vw, 60px);
    line-height: 1.02;
}
.events-header p { margin: 0; max-width: 720px; color: #62666e; font-size: 17px; }
.events-create-btn { flex: 0 0 auto; }

.events-tools {
    background: #fff;
    border: 1px solid var(--clan-warm-border, #ffd9cc);
    border-radius: 22px;
    padding: 16px;
    box-shadow: 0 12px 35px rgba(31, 35, 40, .06);
}
.events-filter-form {
    display: grid;
    grid-template-columns: minmax(220px, 1.5fr) minmax(180px, 1fr) repeat(2, minmax(150px, .8fr)) minmax(190px, 1fr) auto auto;
    align-items: end;
    gap: 10px;
}
.events-filter-form input,
.events-filter-form select {
    width: 100%;
    min-height: 44px;
    border: 1px solid #ded8d4;
    border-radius: 12px;
    background: #fff;
    padding: 9px 11px;
    color: #242a32;
}
.events-filter-form label { display: grid; gap: 4px; color: #6c6a68; font-size: 12px; font-weight: 700; }
.events-results-heading { margin: 26px 2px 14px; color: #707070; }
.events-results-heading strong { color: #242a32; }

.events-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}
.event-card {
    overflow: hidden;
    border: 1px solid #eee1da;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 13px 32px rgba(30, 32, 36, .07);
}
.event-card-media {
    position: relative;
    display: block;
    aspect-ratio: 16/10;
    overflow: hidden;
    background: #f4ebe5;
}
.event-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.event-card:hover .event-card-media img { transform: scale(1.025); }
.event-card-placeholder {
    width: 100%; height: 100%; display: grid; place-items: center;
    padding: 24px; text-align: center; color: #6c5148; font-weight: 800;
    background: linear-gradient(135deg, #fff0e6, #ffe1d1 55%, #fff8f3);
}
.event-date-badge {
    position: absolute; top: 13px; left: 13px; width: 58px; height: 62px;
    display: grid; place-items: center; align-content: center;
    border-radius: 15px; background: rgba(255,255,255,.94); color: #242a32;
    box-shadow: 0 5px 18px rgba(0,0,0,.12); line-height: 1;
}
.event-date-badge strong { font-size: 24px; }
.event-date-badge small { margin-top: 4px; font-size: 10px; font-weight: 900; letter-spacing: 1px; }
.event-card-copy { padding: 20px; }
.event-type {
    display: inline-block; color: var(--clan-orange, #f0441f); font-size: 11px;
    font-weight: 900; letter-spacing: 1px; text-transform: uppercase;
}
.event-card-copy h2 { margin: 7px 0 10px; font-size: 22px; line-height: 1.12; }
.event-card-copy h2 a { color: #242a32; text-decoration: none; }
.event-meta, .event-place, .event-publisher { margin: 6px 0; color: #65686d; font-size: 14px; }
.event-publisher a { color: #242a32; font-weight: 700; }
.event-card-copy .explore-page-link { margin-top: 14px; }

.event-back { display: inline-flex; margin-bottom: 18px; color: #5c6066; text-decoration: none; font-weight: 700; }
.event-detail-card {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    overflow: hidden;
    border: 1px solid #eee0d8;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(31, 35, 40, .08);
}
.event-detail-image { min-height: 520px; background: #f2ece8; }
.event-detail-image img { width: 100%; height: 100%; object-fit: contain; display: block; background: #f6f2ef; }
.event-detail-content { padding: clamp(26px, 4vw, 52px); }
.event-detail-content h1 { font-size: clamp(36px, 4.5vw, 58px); }
.event-detail-primary { display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 18px 0 10px; color: #242a32; }
.event-detail-location { display: grid; gap: 4px; margin: 12px 0 20px; color: #5f6368; }
.event-detail-location strong { color: #242a32; font-size: 18px; }
.event-detail-price { display: inline-block; padding: 7px 11px; border-radius: 999px; background: var(--clan-warm-soft, #fff1e9); font-weight: 800; }
.event-detail-description { margin: 22px 0; color: #40444a; line-height: 1.7; white-space: normal; }
.event-external-link { display: inline-flex; }
.event-publisher-box { margin-top: 28px; padding: 16px 18px; border-radius: 16px; background: #fff7f2; display: grid; gap: 3px; }
.event-publisher-box > span, .event-publisher-box small { color: #77716e; font-size: 12px; }
.event-publisher-box a { color: #242a32; text-decoration: none; }
.event-owner-actions { display: flex; gap: 10px; margin-top: 20px; }
.danger-link, .danger-button { border-color: #c33 !important; }

.event-form-page { max-width: 940px; }
.event-form-card {
    background: #fff; border: 1px solid #eee0d8; border-radius: 26px;
    padding: clamp(24px, 4vw, 44px); box-shadow: 0 18px 45px rgba(31,35,40,.07);
}
.event-form { display: grid; gap: 18px; margin-top: 24px; }
.event-form-two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.event-form .form-field { display: grid; gap: 7px; }
.event-form .form-field label { font-weight: 800; color: #34383d; }
.event-form input,
.event-form select,
.event-form textarea {
    width: 100%; border: 1px solid #dcd7d4; border-radius: 12px; padding: 11px 12px;
    background: #fff; color: #242a32; font: inherit;
}
.event-form textarea { resize: vertical; }
.event-form-actions { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 8px; }
.event-delete-card { max-width: 650px; margin: 40px auto; }

.profile-events-section { margin-top: 28px; }
.profile-events-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.profile-events-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 14px; }
.profile-event-card { border: 1px solid #ece3de; border-radius: 16px; background: #fff; }
.profile-event-card > a { display: block; height: 100%; padding: 16px; color: inherit; text-decoration: none; }
.profile-event-card h3 { margin: 6px 0 10px; color: #242a32; line-height: 1.2; }
.profile-event-card p { margin: 4px 0; color: #696b70; font-size: 13px; }
.profile-event-more { display: inline-block; margin-top: 12px; color: var(--clan-orange, #f0441f); font-weight: 800; }

.feed-events-strip { margin: 0 0 24px; padding: 18px; border-radius: 20px; background: #fff8f3; border: 1px solid #ffe0d1; }
.feed-events-heading { display: flex; justify-content: space-between; gap: 16px; align-items: end; margin-bottom: 14px; }
.feed-events-heading h2 { margin: 4px 0 0; font-size: 22px; }
.feed-events-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.feed-event-card { overflow: hidden; border-radius: 14px; background: #fff; border: 1px solid #eee2dc; }
.feed-event-card-link { display: grid; grid-template-columns: 94px 1fr; min-height: 108px; color: inherit; text-decoration: none; }
.feed-event-card img { width: 94px; height: 100%; object-fit: cover; background: #f2ece8; }
.feed-event-card-link > div { padding: 12px; }
.feed-event-card h3 { margin: 4px 0 6px; font-size: 16px; line-height: 1.15; }
.feed-event-card p, .feed-event-card small { margin: 3px 0; font-size: 12px; color: #6c6d70; }

@media (max-width: 980px) {
    .events-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .events-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .event-detail-card { grid-template-columns: 1fr; }
    .event-detail-image { min-height: 0; max-height: 560px; }
    .profile-events-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
    .events-page, .event-detail-page, .event-form-page { width: min(100% - 22px, 1180px); padding-top: 28px; }
    .events-header { align-items: stretch; flex-direction: column; }
    .events-create-btn { width: 100%; text-align: center; }
    .events-filter-form, .event-form-two { grid-template-columns: 1fr; }
    .events-grid { grid-template-columns: 1fr; }
    .event-detail-content { padding: 24px 20px; }
    .event-owner-actions, .event-form-actions { flex-direction: column; align-items: stretch; }
    .profile-events-grid, .feed-events-grid { grid-template-columns: 1fr; }
    .feed-events-heading { align-items: flex-start; flex-direction: column; }
}

/* =========================================================
   V13.6.1 — Chat multimedia y gestión de conversaciones
========================================================= */
.chat-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.chat-actions-wrap {
    position: relative;
}

.chat-actions-button {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    padding: 0;
    color: #495465;
    background: #fff;
    border: 1px solid #dfe4ea;
    border-radius: 11px;
    cursor: pointer;
    font-size: 24px;
    line-height: 1;
}

.chat-actions-button:hover {
    background: #f6f7f9;
}

.chat-actions-menu {
    position: absolute;
    z-index: 40;
    top: calc(100% + 7px);
    right: 0;
    width: 210px;
    padding: 6px;
    background: #fff;
    border: 1px solid #e1e5eb;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(20, 27, 38, .14);
}

.chat-actions-menu[hidden],
.chat-emoji-picker[hidden],
.chat-attachment-preview[hidden] {
    display: none !important;
}

.chat-actions-menu button {
    width: 100%;
    padding: 10px 11px;
    color: #26303d;
    background: transparent;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    font: inherit;
    font-size: 13px;
}

.chat-actions-menu button:hover {
    background: #f4f6f8;
}

.chat-actions-menu button.danger {
    color: #b42318;
}

.chat-center-form {
    position: relative;
}

.chat-composer {
    grid-template-columns: 38px 38px minmax(0, 1fr) 50px;
}

.chat-composer-tool {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    padding: 0;
    color: #374353;
    background: #fff;
    border: 1px solid #e1e5ea;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    user-select: none;
}

.chat-composer-tool:hover {
    background: #f5f7f9;
}

.chat-file-input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.chat-emoji-picker {
    position: absolute;
    z-index: 35;
    left: 22px;
    bottom: 82px;
    width: min(330px, calc(100vw - 44px));
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 4px;
    padding: 10px;
    background: #fff;
    border: 1px solid #dde3e9;
    border-radius: 15px;
    box-shadow: 0 12px 32px rgba(20, 27, 38, .16);
}

.chat-emoji-option {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    font-size: 20px;
}

.chat-emoji-option:hover {
    background: #f1f3f6;
}

.chat-attachment-preview {
    min-height: 58px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 9px;
    padding: 8px 10px;
    background: #f7f8fa;
    border: 1px solid #e1e5ea;
    border-radius: 12px;
}

.chat-attachment-preview img {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    object-fit: cover;
    border-radius: 9px;
}

.chat-preview-file-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    flex: 0 0 48px;
    background: #fff;
    border: 1px solid #e0e5ea;
    border-radius: 9px;
    font-size: 21px;
}

.chat-preview-file-info {
    min-width: 0;
    flex: 1;
}

.chat-preview-file-info strong,
.chat-preview-file-info small {
    display: block;
}

.chat-preview-file-info strong {
    overflow: hidden;
    color: #27313e;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}

.chat-preview-file-info small {
    margin-top: 3px;
    color: #7e8897;
    font-size: 11px;
}

.chat-preview-remove {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    flex: 0 0 31px;
    padding: 0;
    color: #596575;
    background: #fff;
    border: 1px solid #dfe4ea;
    border-radius: 50%;
    cursor: pointer;
    font-size: 20px;
}

.chat-bubble {
    position: relative;
}

.chat-message-image {
    display: block;
    width: auto;
    max-width: min(320px, 100%);
    max-height: 360px;
    object-fit: contain;
    border-radius: 12px;
}

.chat-image-link {
    display: block;
    margin: -4px -6px 7px;
}

.chat-file-card {
    min-width: 230px;
    max-width: 330px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: -3px -4px 7px;
    padding: 10px;
    color: inherit;
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(110, 122, 139, .18);
    border-radius: 11px;
    text-decoration: none;
}

.chat-file-card:hover {
    background: #fff;
}

.chat-file-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    background: #f3f5f7;
    border-radius: 9px;
    font-size: 18px;
}

.chat-file-info {
    min-width: 0;
}

.chat-file-info strong,
.chat-file-info small {
    display: block;
}

.chat-file-info strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
}

.chat-file-info small {
    margin-top: 2px;
    color: #778293;
    font-size: 10px;
}

.chat-message-delete {
    position: absolute;
    top: -9px;
    right: -9px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    padding: 0;
    color: #6d7785;
    background: #fff;
    border: 1px solid #dfe4ea;
    border-radius: 50%;
    cursor: pointer;
    opacity: 0;
    font-size: 16px;
    line-height: 1;
    box-shadow: 0 2px 6px rgba(20,27,38,.08);
    transition: opacity .15s ease;
}

.chat-bubble-row.mine:hover .chat-message-delete,
.chat-message-delete:focus-visible {
    opacity: 1;
}

.chat-bubble-deleted {
    color: #8993a0 !important;
    background: #f5f6f8 !important;
    font-style: italic;
}

.chat-inline-action {
    padding: 0;
    color: #d94b28;
    background: transparent;
    border: 0;
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
}

@media (max-width: 720px) {
    .chat-profile-link {
        display: none;
    }

    .chat-conversation-header {
        padding-right: 14px;
    }

    .chat-composer {
        grid-template-columns: 36px 36px minmax(0, 1fr) 46px;
        gap: 3px;
        padding-left: 6px;
    }

    .chat-emoji-picker {
        left: 12px;
        bottom: 78px;
        grid-template-columns: repeat(7, 1fr);
    }

    .chat-message-image {
        max-width: min(250px, 100%);
        max-height: 300px;
    }

    .chat-file-card {
        min-width: 190px;
        max-width: 260px;
    }

    .chat-message-delete {
        opacity: 1;
    }
}

/* =========================================================
   V13.6.1a — Chat: adjunto en línea independiente
   Evita desbordamiento horizontal en móvil al mostrar la vista previa.
========================================================= */
.chat-center-form {
    display: block;
    width: 100%;
}

.chat-attachment-preview {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

@media (max-width: 720px) {
    .chat-attachment-preview {
        margin-bottom: 8px;
    }
}

/* =========================================================
   V13.6.2 — Sobre nosotros
========================================================= */
.about-body {
    margin: 0;
    background: #fffaf7;
    color: #242a32;
}

.about-page {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 48px 0 84px;
}

.about-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(220px, .75fr);
    gap: 48px;
    align-items: center;
    min-height: 390px;
    padding: clamp(42px, 6vw, 78px);
    background: linear-gradient(135deg, #fff1e9 0%, #fffaf7 52%, #fff6e9 100%);
    border: 1px solid #ffd9cc;
    border-radius: 34px;
    box-shadow: 0 22px 55px rgba(75, 39, 28, .08);
}

.about-hero::after {
    content: "";
    position: absolute;
    width: 330px;
    height: 330px;
    right: -80px;
    top: -110px;
    border-radius: 50%;
    background: rgba(245, 160, 20, .10);
}

.about-hero-copy,
.about-symbol {
    position: relative;
    z-index: 1;
}

.about-kicker {
    display: inline-block;
    margin-bottom: 14px;
    color: #d93616;
    font-size: 12px;
    line-height: 1.3;
    font-weight: 850;
    letter-spacing: 1.8px;
    text-transform: uppercase;
}

.about-hero h1,
.about-section h2,
.about-open-section h2,
.about-project-section h2,
.about-final-cta h2 {
    margin: 0;
    color: #242a32;
    letter-spacing: -.035em;
}

.about-hero h1 {
    font-size: clamp(48px, 7vw, 82px);
    line-height: .98;
}

.about-lead {
    max-width: 760px;
    margin: 28px 0 0;
    font-size: clamp(20px, 2.1vw, 27px);
    line-height: 1.45;
    color: #4b535d;
}

.about-lead strong {
    color: #242a32;
}

.about-symbol {
    display: grid;
    place-items: center;
}

.about-symbol img {
    display: block;
    width: min(270px, 92%);
    height: auto;
    aspect-ratio: auto;
    object-fit: contain;
    border-radius: 0;
    box-shadow: none;
    filter: drop-shadow(0 18px 18px rgba(74, 47, 25, .18));
}

.about-section {
    padding: 86px 28px 38px;
}

.about-section-heading {
    max-width: 850px;
    margin-bottom: 34px;
}

.about-section h2,
.about-open-section h2,
.about-project-section h2,
.about-final-cta h2 {
    font-size: clamp(34px, 4vw, 54px);
    line-height: 1.08;
}

.about-two-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 44px;
}

.about-two-columns p,
.about-open-copy p,
.about-project-section p,
.about-final-cta p {
    margin: 0;
    color: #5d6570;
    font-size: 17px;
    line-height: 1.75;
}

.about-values {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    padding: 34px 0 70px;
}

.about-value-card {
    min-height: 245px;
    padding: 30px;
    background: #fff;
    border: 1px solid #f0ded6;
    border-radius: 24px;
    box-shadow: 0 12px 30px rgba(49, 36, 30, .05);
}

.about-value-number {
    display: block;
    margin-bottom: 28px;
    color: #f0441f;
    font-size: 13px;
    font-weight: 850;
    letter-spacing: 1.3px;
}

.about-value-card h3 {
    margin: 0 0 12px;
    font-size: 28px;
    color: #242a32;
}

.about-value-card p {
    margin: 0;
    color: #66707b;
    font-size: 15.5px;
    line-height: 1.65;
}

.about-open-section {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) auto;
    gap: 44px;
    align-items: end;
    padding: clamp(38px, 5vw, 62px);
    background: #242a32;
    border-radius: 30px;
}

.about-open-section .about-kicker {
    color: #f5a014;
}

.about-open-section h2 {
    color: #fff;
}

.about-open-copy p {
    max-width: 820px;
    margin-top: 22px;
    color: #d9dde1;
}

.about-open-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 190px;
}

.about-open-section .profile-action-secondary {
    background: #fff;
    border-color: #fff;
    text-align: center;
}

.about-project-section {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 58px;
    align-items: start;
    padding: 82px 28px;
}

.about-project-section p {
    padding-top: 28px;
}

.about-final-cta {
    text-align: center;
    padding: 64px 30px;
    background: #fff1e9;
    border: 1px solid #ffd9cc;
    border-radius: 30px;
}

.about-final-cta p {
    max-width: 720px;
    margin: 20px auto 0;
}

.about-final-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 30px;
}

@media (max-width: 820px) {
    .about-page {
        width: min(100% - 24px, 1180px);
        padding-top: 24px;
    }

    .about-hero {
        grid-template-columns: 1fr;
        min-height: 0;
        gap: 30px;
        padding: 38px 28px;
        border-radius: 26px;
    }

    .about-symbol {
        justify-content: start;
    }

    .about-symbol img {
        width: 132px;
        height: auto;
        border-radius: 0;
        filter: drop-shadow(0 12px 12px rgba(74, 47, 25, .16));
    }

    .about-section {
        padding: 62px 10px 28px;
    }

    .about-two-columns,
    .about-values,
    .about-project-section,
    .about-open-section {
        grid-template-columns: 1fr;
    }

    .about-two-columns {
        gap: 18px;
    }

    .about-values {
        gap: 14px;
        padding-bottom: 54px;
    }

    .about-value-card {
        min-height: 0;
    }

    .about-open-section {
        gap: 30px;
        padding: 38px 26px;
    }

    .about-open-actions {
        width: 100%;
    }

    .about-project-section {
        gap: 12px;
        padding: 62px 10px;
    }

    .about-project-section p {
        padding-top: 0;
    }

    .about-final-cta {
        padding: 48px 24px;
    }
}


/* =========================================================
   V13.6.3 — MI PÁGINA + AVATAR EN NAVBAR
========================================================= */
.nav-links .nav-my-page {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.nav-user-avatar {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    background: #eef0f4;
    border: 1px solid rgba(0,0,0,.08);
}

@media (max-width: 760px) {
    .nav-links .nav-my-page {
        width: 100%;
    }
    .nav-user-avatar {
        width: 30px;
        height: 30px;
        flex-basis: 30px;
    }
}


/* =========================================================
   V13.6.3a — Sobre nosotros: logo 3D integrado
   El PNG transparente flota sobre el fondo; sin pastilla CSS.
========================================================= */


/* =========================================================
   Clandelero V13.6.5 — páginas y pie legal
   ========================================================= */
.site-legal-footer {
    margin-top: 52px;
    border-top: 1px solid rgba(25, 32, 45, .10);
    background: rgba(255, 255, 255, .78);
    color: #5f6878;
    font-size: .88rem;
}
.site-legal-footer-inner {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.site-legal-links { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.site-legal-links a { color: #4d586b; text-decoration: none; }
.site-legal-links a:hover, .site-legal-links a:focus-visible { color: #e44a21; text-decoration: underline; }
.legal-page { width: min(940px, calc(100% - 36px)); margin: 42px auto 70px; }
.legal-hero { margin-bottom: 24px; }
.legal-kicker { display: inline-block; margin-bottom: 8px; font-size: .78rem; font-weight: 800; letter-spacing: .12em; color: #e44a21; }
.legal-hero h1 { margin: 0 0 10px; font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.04; }
.legal-lead { margin: 0; max-width: 760px; color: #5f6878; font-size: 1.05rem; line-height: 1.65; }
.legal-card { background: #fff; border: 1px solid rgba(25, 32, 45, .10); border-radius: 22px; padding: clamp(24px, 5vw, 48px); box-shadow: 0 18px 55px rgba(31, 42, 62, .07); }
.legal-card h2 { margin: 34px 0 12px; font-size: 1.28rem; }
.legal-card h2:first-child { margin-top: 0; }
.legal-card h3 { margin: 24px 0 8px; font-size: 1.05rem; }
.legal-card p, .legal-card li { color: #3f4858; line-height: 1.72; }
.legal-card ul { padding-left: 1.3rem; }
.legal-card a { color: #d83d1b; }
.legal-data { margin: 18px 0; padding: 18px 20px; border-radius: 15px; background: #f7f8fa; }
.legal-data p { margin: 4px 0; }
.legal-note { margin-top: 32px; padding-top: 20px; border-top: 1px solid rgba(25,32,45,.10); color: #70798a; font-size: .9rem; }
@media (max-width: 640px) {
    .site-legal-footer-inner { width: min(100% - 28px, 1180px); padding: 22px 0; align-items: flex-start; flex-direction: column; }
    .site-legal-links { gap: 9px 16px; }
    .legal-page { width: min(100% - 24px, 940px); margin-top: 28px; }
    .legal-card { border-radius: 17px; padding: 22px 18px; }
}

/* =========================================================
   V13.6.6 — REGISTRO: EDAD Y ACEPTACIÓN LEGAL
========================================================= */
.register-legal-consent {
    margin: 2px 0 0;
    padding: 16px 17px 15px;
    border: 1px solid #e1e5eb;
    border-radius: 12px;
    background: #fafbfc;
}

.register-legal-consent legend {
    padding: 0 7px;
    color: #303746;
    font-size: 13px;
    font-weight: 800;
}

.register-legal-check {
    display: grid;
    grid-template-columns: 19px 1fr;
    gap: 10px;
    align-items: start;
    color: #424a59;
    font-size: 13px;
    line-height: 1.45;
    cursor: pointer;
}

.register-legal-check + .register-legal-check {
    margin-top: 11px;
}

.register-legal-check input[type="checkbox"] {
    width: 17px;
    height: 17px;
    margin: 2px 0 0;
    accent-color: var(--color-primary);
    cursor: pointer;
}

.register-legal-check a {
    color: var(--color-primary);
    font-weight: 750;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.register-legal-note {
    display: block;
    margin-top: 13px;
    padding-top: 12px;
    border-top: 1px solid #e7eaf0;
    color: var(--color-muted);
    font-size: 11px;
    line-height: 1.45;
}


/* =========================================================
   V13.9 — Acciones principales del perfil bajo el nombre
========================================================= */
.profile-quick-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    margin-top: 12px;
}
.profile-quick-actions .follow-form { margin: 0; }
.profile-quick-actions .follow-button,
.profile-quick-actions .profile-action-primary,
.profile-quick-actions .profile-action-disabled {
    min-height: 40px;
    padding: 8px 13px;
    font-size: 12px;
}
@media (max-width: 760px) {
    .profile-quick-actions { justify-content: center; }
}


/* =========================================================
   V13.9.1 — CHAT MÓVIL: COMPOSITOR FIJO EN LA BASE
========================================================= */
@media (max-width: 720px) {
    body:has(.chat-conversation) {
        padding-bottom: calc(var(--chat-mobile-composer-height, 76px) + env(safe-area-inset-bottom, 0px));
    }

    .chat-conversation .chat-center-form {
        position: fixed;
        z-index: 1200;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        margin: 0;
        padding: 8px max(10px, env(safe-area-inset-right, 0px)) calc(8px + env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
        background: rgba(255, 255, 255, .98);
        border-top: 1px solid #e4e8ed;
        box-shadow: 0 -8px 24px rgba(24, 34, 48, .09);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }

    .chat-conversation .chat-center-messages {
        padding-bottom: calc(var(--chat-mobile-composer-height, 76px) + 18px);
    }

    .chat-conversation .chat-emoji-picker {
        position: fixed;
        z-index: 1210;
        left: 10px;
        bottom: calc(var(--chat-mobile-composer-height, 76px) + 6px);
        width: min(330px, calc(100vw - 20px));
    }

    .chat-center-error {
        position: fixed;
        z-index: 1220;
        left: 12px;
        right: 12px;
        bottom: calc(var(--chat-mobile-composer-height, 76px) + 10px);
        margin: 0;
        box-shadow: 0 8px 24px rgba(24, 34, 48, .12);
    }
}

/* =========================================================
   V13.9.2 — ACCESO RÁPIDO A NOTIFICACIONES EN NAVBAR MÓVIL
========================================================= */
.nav-mobile-notification-shortcut {
    display: none;
}

@media (max-width: 760px) {
    .nav-mobile-notification-shortcut.has-news {
        display: flex;
    }

    .nav-mobile-notification-shortcut {
        position: relative;
        width: 38px;
        height: 38px;
        flex: 0 0 38px;
        margin-left: auto;
        margin-right: 7px;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        text-decoration: none;
        background: #fffaf6;
        border: 1px solid rgba(240, 68, 31, .18);
    }

    .nav-mobile-notification-shortcut + .hamburger {
        margin-left: 0;
    }

    .nav-mobile-notification-icon {
        width: 10px;
        height: 10px;
        overflow: hidden;
        border-radius: 50%;
        color: #b8bec8;
        font-size: 18px;
        line-height: 8px;
    }

    .nav-mobile-notification-shortcut.has-news .nav-mobile-notification-icon {
        color: var(--clan-orange, #f0441f);
    }

    .nav-mobile-notification-count {
        position: absolute;
        top: -5px;
        right: -5px;
        min-width: 19px;
        height: 19px;
        padding: 0 5px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: var(--clan-orange, #f0441f);
        color: #fff;
        border: 2px solid #fff;
        font-size: 9px;
        line-height: 1;
        font-weight: 800;
        box-sizing: border-box;
    }

    .nav-mobile-notification-count[hidden] {
        display: none !important;
    }
}

/* =========================================================
   V13.9.3 — COOKIES Y PREFERENCIAS
========================================================= */
.site-legal-link-button {
    appearance: none;
    padding: 0;
    border: 0;
    background: transparent;
    color: #4d586b;
    font: inherit;
    cursor: pointer;
}
.site-legal-link-button:hover,
.site-legal-link-button:focus-visible {
    color: #e44a21;
    text-decoration: underline;
}
.cookie-banner[hidden],
.cookie-modal[hidden] { display: none !important; }
.cookie-banner {
    position: fixed;
    z-index: 1200;
    left: 20px;
    right: 20px;
    bottom: 18px;
    width: min(1080px, calc(100% - 40px));
    margin: 0 auto;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    border: 1px solid rgba(28, 35, 48, .14);
    border-radius: 18px;
    background: rgba(255,255,255,.98);
    box-shadow: 0 18px 55px rgba(18, 27, 43, .18);
}
.cookie-banner-copy { min-width: 0; max-width: 680px; }
.cookie-banner-copy strong { display: block; margin-bottom: 5px; font-size: 1rem; color: #202735; }
.cookie-banner-copy p { margin: 0 0 4px; color: #586273; font-size: .86rem; line-height: 1.52; }
.cookie-banner-copy a { color: #c93e1d; font-size: .82rem; font-weight: 700; }
.cookie-banner-actions,
.cookie-modal-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.cookie-banner-actions { flex: 0 0 auto; justify-content: flex-end; }
.cookie-action {
    min-height: 40px;
    padding: 9px 13px;
    border-radius: 10px;
    border: 1px solid #cfd5de;
    background: #fff;
    color: #283241;
    font: inherit;
    font-size: .82rem;
    font-weight: 750;
    cursor: pointer;
}
.cookie-action:hover,
.cookie-action:focus-visible { border-color: #e44a21; outline: none; }
.cookie-action-main {
    border-color: #dfe2e8;
    background: #f6f7f9;
    color: #202735;
}
.cookie-action-main:hover,
.cookie-action-main:focus-visible { background: #eef0f3; }
.cookie-action-config,
.cookie-action-save {
    border-color: #e44a21;
    background: #e44a21;
    color: #fff;
}
.cookie-action-config:hover,
.cookie-action-config:focus-visible,
.cookie-action-save:hover,
.cookie-action-save:focus-visible { background: #c93e1d; color: #fff; }
.cookie-modal {
    position: fixed;
    z-index: 1250;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 20px;
}
.cookie-modal-backdrop { position: absolute; inset: 0; background: rgba(16, 22, 32, .56); }
.cookie-modal-dialog {
    position: relative;
    z-index: 1;
    width: min(620px, 100%);
    max-height: min(760px, calc(100vh - 40px));
    overflow: auto;
    padding: 28px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 26px 80px rgba(8, 16, 30, .28);
    outline: none;
}
.cookie-modal-close {
    position: absolute;
    top: 14px;
    right: 15px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: #f3f4f6;
    color: #424b59;
    font: inherit;
    font-size: 1.35rem;
    cursor: pointer;
}
.cookie-modal-kicker { display: inline-block; margin-bottom: 7px; color: #e44a21; font-size: .72rem; font-weight: 850; letter-spacing: .12em; }
.cookie-modal-dialog h2 { margin: 0 44px 8px 0; font-size: 1.65rem; }
.cookie-modal-intro,
.cookie-current-note { color: #5d6675; font-size: .88rem; line-height: 1.58; }
.cookie-preference-list { display: grid; gap: 10px; margin: 20px 0; }
.cookie-preference-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 15px 16px;
    border: 1px solid #e0e4ea;
    border-radius: 13px;
    background: #fff;
}
.cookie-preference-row.is-required { background: #f7f8fa; }
.cookie-preference-row span { min-width: 0; }
.cookie-preference-row strong,
.cookie-preference-row small { display: block; }
.cookie-preference-row strong { color: #222b39; font-size: .92rem; }
.cookie-preference-row small { margin-top: 3px; color: #697383; font-size: .78rem; line-height: 1.45; }
.cookie-preference-row input[type="checkbox"] { width: 20px; height: 20px; flex: 0 0 20px; accent-color: #e44a21; }
.cookie-current-note { margin: 0 0 18px; padding: 12px 14px; border-radius: 11px; background: #fff7f2; }
.cookie-modal-open { overflow: hidden; }
.cookie-inventory { width: 100%; border-collapse: collapse; margin: 16px 0 22px; font-size: .88rem; }
.cookie-inventory th,
.cookie-inventory td { padding: 11px 10px; text-align: left; vertical-align: top; border-bottom: 1px solid #e7e9ed; }
.cookie-inventory th { color: #2f3846; background: #f7f8fa; }
.cookie-inventory code { overflow-wrap: anywhere; }

@media (max-width: 760px) {
    .cookie-banner {
        left: 10px;
        right: 10px;
        bottom: 10px;
        width: calc(100% - 20px);
        padding: 16px;
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
        border-radius: 15px;
    }
    .cookie-banner-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .cookie-banner-actions .cookie-action-config { grid-column: 1 / -1; }
    .cookie-action { width: 100%; }
    .cookie-modal { padding: 10px; }
    .cookie-modal-dialog { max-height: calc(100vh - 20px); padding: 22px 17px; border-radius: 16px; }
    .cookie-modal-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .cookie-modal-actions .cookie-action-save { grid-column: 1 / -1; }
    .cookie-preference-row { padding: 13px; }
    .cookie-inventory { display: block; overflow-x: auto; white-space: normal; }
}

/* V14.1 — Denuncias y moderación */
.report-link, .feed-report-link, .comment-report-link { color:#7a828e; text-decoration:none; font-size:.78rem; font-weight:650; }
.report-link:hover, .feed-report-link:hover, .comment-report-link:hover { color:#b42318; text-decoration:underline; }
.profile-quick-actions .report-link { align-self:center; margin-left:4px; }
.feed-report-link { margin-left:auto; align-self:center; padding:7px 4px; }
.comment-inline-actions { display:flex; align-items:center; gap:12px; margin-top:4px; }
.comment-inline-actions .comment-reply-toggle { margin:0; }
.comment-report-link { display:inline-block; margin-top:4px; }
.report-page { width:min(760px,calc(100% - 28px)); margin:44px auto 80px; }
.report-card { background:#fff; border:1px solid #e2e5ea; border-radius:18px; padding:28px; box-shadow:0 14px 40px rgba(16,24,40,.08); }
.report-card h1 { margin:4px 0 10px; font-size:2rem; }
.report-card > p { color:#5f6876; line-height:1.55; }
.report-target { padding:12px 14px; background:#f7f8fa; border:1px solid #e4e7eb; border-radius:11px; color:#303846!important; overflow-wrap:anywhere; }
.report-form { display:grid; gap:18px; margin-top:20px; }
.report-form label { display:grid; gap:7px; font-weight:750; color:#303846; }
.report-form label span { color:#7b8491; font-size:.78rem; font-weight:500; }
.report-form select, .report-form textarea { width:100%; border:1px solid #d6dae0; border-radius:10px; padding:11px 12px; background:#fff; color:#252b34; font:inherit; }
.report-form textarea { resize:vertical; min-height:125px; }
.report-actions { display:flex; flex-wrap:wrap; gap:9px; }
.report-actions .secondary-button { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; }
@media (max-width:760px) { .report-page { margin-top:22px; } .report-card { padding:20px 16px; border-radius:14px; } .report-actions > * { flex:1 1 100%; } }

/* V14.1a — contraseña visible, aviso y respuesta de moderación */
.password-input-wrap { position:relative; width:100%; }
.password-input-wrap > input { width:100%; padding-right:48px !important; }
.password-visibility-toggle { position:absolute; right:7px; top:50%; transform:translateY(-50%); width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:8px; background:transparent; color:#525866; cursor:pointer; font-size:18px; line-height:1; z-index:2; }
.password-visibility-toggle:hover, .password-visibility-toggle:focus-visible { background:#f0f1f3; outline:none; }
@media (max-width:760px) { .password-visibility-toggle { display:inline-flex !important; } }

.feed-focus-banner { margin:0 0 16px; padding:12px 14px; border:1px solid #f0c7a2; border-radius:12px; background:#fff7ed; color:#6f431d; font-size:.92rem; }
.feed-focus-banner a { color:inherit; font-weight:750; }
.feed-focus-banner.is-missing { border-color:#e2e4e8; background:#f7f8fa; color:#626873; }

.moderation-notice-page { width:min(820px,calc(100% - 28px)); margin:34px auto 70px; }
.moderation-notice-card { background:#fff; border:1px solid #e2e4e8; border-radius:18px; padding:28px; box-shadow:0 14px 38px rgba(23,27,35,.08); }
.moderation-notice-kicker { display:block; color:#b42318; font-size:.74rem; letter-spacing:.1em; font-weight:800; }
.moderation-notice-card h1 { margin:7px 0 8px; font-size:clamp(1.65rem,5vw,2.25rem); }
.moderation-notice-intro { color:#636a75; line-height:1.55; }
.moderation-notice-warning { margin:20px 0; padding:16px 18px; background:#fff7ed; border:1px solid #f0c7a2; border-radius:12px; }
.moderation-notice-warning strong { color:#8a4510; }
.moderation-notice-warning p { margin:7px 0 0; line-height:1.5; }
.moderation-notice-details { display:grid; grid-template-columns:170px minmax(0,1fr); gap:10px 16px; margin:22px 0; }
.moderation-notice-details dt { color:#747b86; font-weight:700; }
.moderation-notice-details dd { margin:0; overflow-wrap:anywhere; }
.moderation-target-button { display:inline-flex; margin:0 0 20px; text-decoration:none; }
.moderation-response-box { border-top:1px solid #eceef1; padding-top:20px; display:grid; gap:16px; }
.moderation-response-status { margin:0; color:#146c45; font-weight:700; }
.moderation-review-details { border:1px solid #e0e3e7; border-radius:12px; padding:14px 16px; }
.moderation-review-details summary { cursor:pointer; font-weight:800; }
.moderation-review-details p { color:#636a75; }
.moderation-review-details form { display:grid; gap:10px; }
.moderation-review-details textarea { width:100%; min-height:120px; resize:vertical; border:1px solid #d5d8dd; border-radius:10px; padding:11px 12px; font:inherit; }
.moderation-appeal-status { padding:15px 16px; background:#f7f8fa; border:1px solid #e0e3e7; border-radius:12px; }
.moderation-appeal-status p { margin:8px 0; white-space:normal; }
.moderation-appeal-status small { color:#69707b; }
.moderation-admin-response { margin-top:13px; padding-top:13px; border-top:1px solid #dde0e5; }
.moderation-notice-foot { margin:22px 0 0; color:#6d7480; font-size:.9rem; }
.moderation-notice-foot a { color:inherit; }
@media (max-width:620px) { .moderation-notice-card { padding:20px 16px; } .moderation-notice-details { grid-template-columns:1fr; gap:4px; } .moderation-notice-details dd { margin-bottom:10px; } .moderation-target-button { width:100%; justify-content:center; } }

/* V14.1b — botones de acciones de moderación sobre fondo claro */
.moderation-notice-card .btn-secondary,
.moderation-review-details .btn-secondary {
    background: #ffffff;
    color: #252a33;
    border-color: #cfd4dc;
    box-shadow: 0 2px 8px rgba(23, 27, 35, .06);
}
.moderation-notice-card .btn-secondary:hover,
.moderation-notice-card .btn-secondary:focus-visible,
.moderation-review-details .btn-secondary:hover,
.moderation-review-details .btn-secondary:focus-visible {
    background: #f5f6f8;
    color: #171a20;
    border-color: #aeb5c0;
}
.moderation-review-details button.btn-secondary {
    width: fit-content;
    min-height: 42px;
}
@media (max-width:620px) {
    .moderation-review-details button.btn-secondary {
        width: 100%;
        justify-content: center;
    }
}

/* V14.2 — acciones secundarias discretas y etiquetas */
.content-more-menu{position:relative;margin-left:auto;display:inline-block}.content-more-menu summary{list-style:none;cursor:pointer;border:0;background:transparent;border-radius:999px;padding:2px 9px;font-size:20px;line-height:1;color:#667085}.content-more-menu summary::-webkit-details-marker{display:none}.content-more-menu summary:hover{background:#f1f3f5;color:#111}.content-more-popover{position:absolute;right:0;top:calc(100% + 5px);z-index:30;min-width:175px;padding:6px;background:#fff;border:1px solid #e2e5e9;border-radius:10px;box-shadow:0 10px 28px rgba(0,0,0,.12)}.content-more-popover a{display:block;padding:8px 10px;border-radius:7px;color:#333;text-decoration:none;font-size:13px;white-space:nowrap}.content-more-popover a:hover{background:#f5f6f7}.comment-item{position:relative}.comment-more-menu{position:absolute;right:6px;top:4px}.comment-inline-actions{padding-right:38px}.profile-more-menu{align-self:center}.hashtag-link{font-weight:700;text-decoration:none}.hashtag-link:hover{text-decoration:underline}

/* V14.2a — menús ··· del feed: alineación y popovers visibles */
.feed-post-card .post-actions{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) 42px;
    align-items:center;
    overflow:visible;
}
.feed-post-card .post-more-menu{
    margin-left:0;
    width:42px;
    justify-self:end;
    text-align:center;
}
.feed-post-card .post-more-menu > summary{
    width:38px;
    min-height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
}
/* La tarjeta del post usa overflow:hidden: desplegamos hacia arriba para no recortar el menú. */
.feed-post-card .post-more-menu .content-more-popover{
    top:auto;
    bottom:calc(100% + 5px);
}
.feed-post-card .comment-inline-actions{
    padding-right:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}
.feed-post-card .comment-more-menu{
    position:relative;
    right:auto;
    top:auto;
    margin:3px 0 0 auto;
    width:max-content;
    display:block;
}
.feed-post-card .comment-more-menu > summary{
    width:32px;
    height:26px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
    font-size:18px;
}
.feed-post-card .comment-more-menu .content-more-popover{
    top:auto;
    bottom:calc(100% + 4px);
}
@media (max-width:760px){
    .feed-post-card .post-actions{
        grid-template-columns:minmax(0,1fr) minmax(0,1fr) 38px;
    }
    .feed-post-card .post-more-menu{width:38px}
    .feed-post-card .post-more-menu > summary{width:34px}
}


/* V14.2b — descubrimiento social */
.feed-followers-count.social-list-trigger{border:0;background:transparent;cursor:pointer;text-decoration:none;padding:4px 2px}.feed-followers-count.social-list-trigger:hover{text-decoration:underline;color:var(--color-primary)}
.profile-social-stat{appearance:none;border:0;border-right:1px solid var(--color-border);background:transparent;font:inherit;cursor:pointer;width:100%}.profile-social-stat:hover,.profile-social-stat:focus-visible{background:#fff3ef;outline:none}.profile-social-stat:last-child{border-right:0}.profile-social-stat:hover span{color:var(--color-primary)}
.social-modal[hidden]{display:none}.social-modal{position:fixed;inset:0;z-index:2200;display:grid;place-items:center;padding:18px}.social-modal-backdrop{position:absolute;inset:0;background:rgba(15,18,28,.54);backdrop-filter:blur(3px)}.social-modal-panel{position:relative;width:min(560px,100%);max-height:min(76vh,720px);display:flex;flex-direction:column;background:#fff;border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.24);overflow:hidden}.social-modal-panel>header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding:20px 22px 15px;border-bottom:1px solid var(--color-border)}.social-modal-panel h2{font-size:21px;line-height:1.2}.social-modal-panel header p{margin-top:3px;color:var(--color-text-light);font-size:13px}.social-modal-close{border:0;background:#f3f4f6;width:36px;height:36px;border-radius:50%;font-size:24px;line-height:1;cursor:pointer}.social-modal-body{overflow:auto;padding:8px 14px 14px}.social-person-row{display:flex;align-items:center;gap:12px;padding:11px 5px;border-bottom:1px solid #edf0f3}.social-person-main{min-width:0;flex:1;display:flex;align-items:center;gap:11px;text-decoration:none}.social-person-main img{width:46px;height:46px;border-radius:50%;object-fit:cover;background:#eee}.social-person-main span{min-width:0}.social-person-main strong,.social-person-main small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.social-person-main small{margin-top:2px;color:var(--color-text-light);font-size:12px}.social-follow-button{flex:0 0 auto;border:1px solid #ffd0c5;background:#fff6f3;color:var(--color-primary);border-radius:999px;padding:7px 12px;font-weight:750;font-size:12px;cursor:pointer;text-decoration:none}.social-follow-button.is-following{color:#596273;background:#f3f4f6;border-color:#dfe3e8}.social-post-row{display:block;padding:13px 8px;border-bottom:1px solid #edf0f3;text-decoration:none}.social-post-row:hover{background:#f8f9fb}.social-post-row strong{display:block;font-size:14px}.social-post-row span{display:block;margin-top:4px;color:var(--color-text-light);font-size:12px}.social-modal-loading,.social-modal-empty{padding:28px 12px;text-align:center;color:var(--color-text-light)}body.social-modal-open{overflow:hidden}
@media(max-width:600px){.social-modal{padding:0;place-items:end center}.social-modal-panel{width:100%;max-height:82vh;border-radius:18px 18px 0 0}.social-modal-panel>header{padding:17px 16px 13px}.social-modal-body{padding:6px 10px 18px}.social-person-row{gap:8px}.social-person-main img{width:42px;height:42px}.social-follow-button{padding:7px 9px}.profile-social-stat{padding:12px 4px}}

/* V14.3 — UX de imágenes */
.image-upload-preview{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:12px}.image-upload-preview-item{min-width:0}.image-upload-preview-item img,.single-image-preview img{width:100%;height:100px;object-fit:cover;border-radius:10px;border:1px solid var(--color-border)}.image-upload-preview-item small,.single-image-preview small{display:block;margin-top:4px;color:var(--color-text-light);font-size:11px;overflow-wrap:anywhere}.single-image-preview{max-width:240px;margin-top:10px}.post-gallery{display:grid;gap:4px;border-radius:14px;overflow:hidden}.post-gallery-item{border:0;padding:0;background:#eee;cursor:zoom-in;min-height:0}.post-gallery-item .post-image{width:100%;height:100%;object-fit:cover;display:block}.post-gallery-1{grid-template-columns:1fr}.post-gallery-1 .post-gallery-item{max-height:680px}.post-gallery-2{grid-template-columns:1fr 1fr}.post-gallery-2 .post-gallery-item{height:360px}.post-gallery-3{grid-template-columns:1.35fr 1fr;grid-template-rows:1fr 1fr;height:480px}.post-gallery-3 .post-gallery-item:first-child{grid-row:1/3}.post-gallery-4,.post-gallery-5{grid-template-columns:1fr 1fr;height:480px}.post-gallery-5 .post-gallery-item:first-child{grid-row:span 2}.image-lightbox{position:fixed;inset:0;z-index:3000;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;padding:28px}.image-lightbox[hidden]{display:none}.image-lightbox img{max-width:96vw;max-height:92vh;object-fit:contain}.image-lightbox-close{position:fixed;top:18px;right:22px;border:0;background:rgba(255,255,255,.12);color:#fff;width:44px;height:44px;border-radius:50%;font-size:30px;cursor:pointer}.image-lightbox-open{overflow:hidden}.avatar-cropper{margin-top:14px}.avatar-crop-stage{width:min(280px,80vw);aspect-ratio:1;margin:0 auto 12px;border-radius:50%;overflow:hidden;position:relative;background:#e8e8e8;touch-action:none;cursor:grab;box-shadow:inset 0 0 0 3px rgba(240,68,31,.7)}.avatar-crop-stage img{position:absolute;width:100%;height:100%;object-fit:cover;transform-origin:center;user-select:none;pointer-events:none}.avatar-cropper label{display:flex;align-items:center;gap:10px;font-weight:700}.avatar-cropper input[type=range]{flex:1}@media(max-width:640px){.image-upload-preview{grid-template-columns:repeat(3,1fr)}.post-gallery-2 .post-gallery-item{height:240px}.post-gallery-3,.post-gallery-4,.post-gallery-5{height:340px}.image-lightbox{padding:12px}}

/* =========================================================
   V14.3a — espera de subida + selector cámara/galería
========================================================= */
.feed-image-pickers { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.upload-wait-overlay { position:fixed; inset:0; z-index:10000; display:grid; place-items:center; padding:24px; background:rgba(17,20,28,.68); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); }
.upload-wait-card { width:min(420px,100%); padding:28px 24px; border-radius:18px; background:#fff; color:var(--color-text); text-align:center; box-shadow:0 24px 70px rgba(0,0,0,.28); }
.upload-wait-card strong { display:block; margin-top:12px; font-size:20px; }
.upload-wait-card p { margin:7px 0 0; color:var(--color-text-light); line-height:1.45; }
.upload-wait-spinner { display:inline-block; width:38px; height:38px; border:4px solid #eceef2; border-top-color:var(--color-primary); border-radius:50%; animation:clandelero-upload-spin .8s linear infinite; }
.upload-wait-open { overflow:hidden; }
@keyframes clandelero-upload-spin { to { transform:rotate(360deg); } }
@media (max-width:640px) { .feed-image-pickers { width:100%; } .feed-image-picker { flex:1 1 calc(50% - 4px); min-width:0; } .upload-wait-card { padding:24px 18px; } }

/* V14.3b — navegación del visor de publicaciones */
.image-lightbox-nav{position:fixed;top:50%;transform:translateY(-50%);z-index:3002;width:52px;height:64px;border:0;border-radius:14px;background:rgba(255,255,255,.14);color:#fff;font-size:46px;line-height:1;cursor:pointer}.image-lightbox-prev{left:18px}.image-lightbox-next{right:18px}.image-lightbox-counter{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:3002;padding:6px 12px;border-radius:999px;background:rgba(0,0,0,.48);color:#fff;font-weight:700}.image-lightbox-nav[hidden]{display:none}@media(max-width:640px){.image-lightbox-nav{width:42px;height:54px;font-size:38px}.image-lightbox-prev{left:6px}.image-lightbox-next{right:6px}.image-lightbox-counter{bottom:10px}}

/* =========================================================
   V14.3d — Previsualización múltiple y espera de chat
========================================================= */
.chat-attachment-preview.chat-attachment-preview-multiple {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    align-items: stretch;
}
.chat-preview-item {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px;
    background: #fff;
    border: 1px solid #e1e5ea;
    border-radius: 10px;
}
.chat-preview-item img { width: 48px; height: 48px; flex: 0 0 48px; object-fit: cover; border-radius: 9px; }
.chat-preview-summary { grid-column: 1 / -1; color: #596575; font-size: 12px; }
@media (max-width: 720px) {
    .chat-attachment-preview.chat-attachment-preview-multiple { grid-template-columns: 1fr; max-height: 230px; overflow-y: auto; }
}

/* =========================================================
   V14.3e — CHAT MÓVIL: ocultar pie legal durante conversación
   El compositor está fijo en la base; el footer no aporta navegación
   útil dentro del chat y ocupa/solapa el espacio de conversación.
========================================================= */
@media (max-width: 720px) {
    body:has(.chat-conversation) .site-legal-footer {
        display: none !important;
    }
}

/* V14.4 — carga progresiva del feed */
.feed-infinite-status {
    min-height: 38px;
    padding: 10px 12px 18px;
    text-align: center;
    color: #667085;
    font-size: .92rem;
}
[data-feed-sentinel] { height: 1px; }


/* CLANDELERO V15.2 — especialidades complementarias */
.profile-specialties-form{margin-top:24px}
.profile-specialties-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:12px}
.profile-specialties-group{margin:0;padding:14px;border:1px solid rgba(0,0,0,.12);border-radius:14px}
.profile-specialties-group legend{padding:0 6px;font-weight:700}
.profile-specialty-option{display:flex;gap:9px;align-items:flex-start;margin:8px 0;cursor:pointer}
.profile-specialty-option input{margin-top:3px}
.profile-specialty-option:has(input:disabled){opacity:.5;cursor:not-allowed}
@media (max-width:640px){.profile-specialties-grid{grid-template-columns:1fr}}

/* CLANDELERO V15.2-R1 — especialidades en lista vertical */
.profile-specialties-grid{
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    align-items:start;
}
.profile-specialties-group{
    min-width:0;
}
.profile-specialties-group .profile-specialty-option{
    display:flex !important;
    width:100%;
    align-items:flex-start;
    gap:9px;
    margin:7px 0;
    line-height:1.35;
}
.profile-specialties-group .profile-specialty-option input{
    flex:0 0 auto;
    margin:2px 0 0;
}
.profile-specialties-group .profile-specialty-option span{
    display:block;
    min-width:0;
}
@media (min-width:900px){
    .profile-specialties-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:640px){
    .profile-specialties-grid{grid-template-columns:1fr;}
}
/* V16.2B — gestión de publicaciones propias desde perfil */
.social-post-ownrow{border-bottom:1px solid #edf0f4;padding:2px 0 10px}.social-post-ownrow .social-post-row{border-bottom:0}.social-post-manage{display:flex;gap:8px;padding:0 12px}.social-post-manage button,.social-post-editbox button{border:1px solid #d9dee7;border-radius:9px;background:#fff;padding:7px 11px;font:inherit;font-size:12px;font-weight:750;cursor:pointer}.social-post-manage .social-post-delete{color:#b42318}.social-post-editbox{padding:9px 12px}.social-post-editbox textarea{width:100%;min-height:92px;box-sizing:border-box;border:1px solid #d9dee7;border-radius:10px;padding:10px;font:inherit;resize:vertical}.social-post-editbox button{margin:8px 6px 0 0}.social-post-linked{display:block;padding:0 12px 7px;color:#7b8493}


/* V16.2C — aviso de novedades visible también en móvil */
.feed-new-pill{position:fixed;z-index:1200;top:82px;left:50%;transform:translateX(-50%);border:0;border-radius:999px;padding:9px 15px;background:#ff4a2b;color:#fff;font:inherit;font-size:13px;font-weight:800;box-shadow:0 8px 24px rgba(25,32,45,.18);cursor:pointer}
.feed-new-pill[hidden]{display:none!important}
@media(max-width:620px){.feed-new-pill{top:auto;bottom:82px;left:50%;max-width:calc(100vw - 28px);white-space:nowrap;padding:10px 16px}}
.editorial-edit-toggle{margin:10px 0 6px}

/* =========================================================
   CLANDELERO V16.2D — texto y gestión propia en Comunidad
========================================================= */
.feed-post-card .see-more{
    display:inline;
    margin:0 0 0 3px;
    padding:0;
    border:0;
    background:transparent;
    color:var(--color-primary,#ff4b2b);
    font:inherit;
    font-weight:700;
    cursor:pointer;
    text-decoration:none;
}
.feed-post-card .see-more:hover,.feed-post-card .see-more:focus-visible{text-decoration:underline;outline:none}
.post-owner-menu .content-more-popover{min-width:178px}
.post-owner-action{display:block;width:100%;padding:9px 12px;border:0;background:transparent;text-align:left;font:inherit;cursor:pointer;color:inherit;border-radius:8px}
.post-owner-action:hover{background:#f5f6f8}.post-owner-action.is-danger{color:#b42318}.post-owner-action.is-danger:hover{background:#fff1ef}
.feed-edit-overlay{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:18px;background:rgba(15,18,28,.52);backdrop-filter:blur(3px)}
.feed-edit-dialog{width:min(620px,100%);background:#fff;border-radius:18px;padding:20px;box-shadow:0 24px 80px rgba(0,0,0,.28)}
.feed-edit-dialog h3{margin:0 0 12px;font-size:20px}.feed-edit-dialog textarea{width:100%;min-height:180px;max-height:55vh;resize:vertical;border:1px solid #d9dde5;border-radius:12px;padding:13px 14px;font:inherit;line-height:1.5;box-sizing:border-box}
.feed-edit-dialog textarea:focus{outline:2px solid rgba(255,75,43,.18);border-color:var(--color-primary,#ff4b2b)}
.feed-edit-count{text-align:right;margin-top:5px;color:#7a8190;font-size:12px}.feed-edit-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:14px}
@media(max-width:620px){.feed-edit-overlay{align-items:end;padding:0}.feed-edit-dialog{border-radius:18px 18px 0 0;padding:18px 16px 22px}.feed-edit-dialog textarea{min-height:210px}.feed-edit-actions>*{flex:1}}

/* CLANDELERO V16.2E — pastilla de novedades compacta en móvil */
@media (max-width:620px){
  .feed-new-pill{
    top:auto !important;
    bottom:82px !important;
    left:50% !important;
    right:auto !important;
    width:auto !important;
    min-width:0 !important;
    max-width:calc(100vw - 28px) !important;
    height:auto !important;
    min-height:38px !important;
    max-height:44px !important;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:4px;
    padding:9px 15px !important;
    margin:0 !important;
    transform:translateX(-50%) !important;
    white-space:nowrap;
    line-height:1 !important;
    writing-mode:horizontal-tb !important;
    box-sizing:border-box;
  }
  .feed-new-pill[hidden]{display:none !important;}
}

/* CLANDELERO V16.3 — módulos administrables de Comunidad */
.feed-side-modules{display:flex;flex-direction:column;gap:16px}.feed-managed-module{overflow:hidden}.feed-module-image{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.feed-module-content{padding:0}.feed-module-image+.feed-module-content{padding:16px 18px 18px}.feed-managed-module h3{margin:4px 0 7px}.feed-module-kicker{display:block;font-size:10px;font-weight:800;letter-spacing:.12em;color:var(--color-primary);margin-bottom:5px}.feed-module-link{display:inline-block;margin-top:10px;font-size:13px;font-weight:700;text-decoration:none}.feed-module-style--destacado{background:#fff8f4;border-color:#ffd8c9}.feed-module-style--imagen .feed-module-image{aspect-ratio:4/3}.feed-mobile-module.feed-managed-module{margin:22px 0;padding:0;background:#fff;border:1px solid #e3e7ed;border-radius:16px;box-shadow:0 5px 18px rgba(28,38,55,.055);overflow:hidden}.feed-mobile-module .feed-module-content{padding:17px}.feed-mobile-module .feed-module-image+.feed-module-content{padding:15px 17px 17px}.feed-mobile-module h3{font-size:16px;margin:3px 0 6px}.feed-mobile-module p{font-size:13px;line-height:1.5;color:#6e7685;margin:0}.feed-mobile-module .feed-module-link{margin-top:9px}
.feed-sidebar .feed-managed-module{padding:0}.feed-sidebar .feed-managed-module .feed-module-content{padding:20px}.feed-sidebar .feed-managed-module .feed-module-image+.feed-module-content{padding:16px 18px 18px}

/* =========================================================
   V17.1A — correctiva identidad / controles de Comunidad
   ========================================================= */
.clandelero-ui-icon{
  width:18px;height:18px;display:block;fill:currentColor;flex:0 0 18px;
}
.feed-image-pickers{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.feed-image-picker{
  display:inline-flex !important;align-items:center;justify-content:center;gap:7px;
  min-width:132px;height:46px;padding:0 14px !important;white-space:nowrap;line-height:1.1;
}
.feed-image-picker .clandelero-ui-icon{display:block !important;width:18px !important;height:18px !important;min-width:18px;max-width:18px}
.feed-image-picker-text{display:inline-block;white-space:nowrap}
.feed-post-card .action-icon-comment{display:inline-flex;align-items:center;justify-content:center}
.feed-post-card .action-icon-comment .clandelero-ui-icon{width:17px;height:17px}

/* La especialidad principal manda visualmente; las complementarias explican el resultado. */
.explore-artist-specialty{
  display:block;color:#a9472f;font-size:12px;font-weight:850;line-height:1.35;margin-top:1px;
}
.explore-artist-secondary-specialties{
  display:block;margin-top:5px;color:#747b86;font-size:11.5px;font-weight:400;line-height:1.45;
}
.explore-artist-secondary-specialties strong{color:#69717d;font-weight:650}

/* Editar avatar desde Mi página (V17.1, se conserva). */
.profile-avatar-wrap{position:relative}
.profile-avatar-edit{position:absolute;left:50%;bottom:-13px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:5px;white-space:nowrap;padding:7px 10px;border:1px solid rgba(255,79,40,.22);border-radius:999px;background:#fff;color:#e84725;font-size:12px;font-weight:700;line-height:1;text-decoration:none;box-shadow:0 5px 16px rgba(32,39,54,.12);transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.profile-avatar-edit svg{width:15px;height:15px;fill:currentColor}
.profile-avatar-edit:hover{background:#fff7f4;box-shadow:0 7px 18px rgba(32,39,54,.16);transform:translateX(-50%) translateY(-1px)}
.portfolio-hero{overflow:visible}

@media (max-width:640px){
  .feed-image-pickers{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .feed-image-picker{min-width:0;width:100%;height:48px;padding:0 8px !important}
  .feed-image-picker .clandelero-ui-icon{width:18px !important;height:18px !important}
  .profile-avatar-edit{padding:7px 9px;font-size:11px}
  .explore-artist-secondary-specialties{font-size:11px}
}
@media (max-width:360px){
  .feed-image-picker{height:58px;flex-direction:column;gap:3px;white-space:normal;text-align:center}
  .feed-image-picker-text{white-space:normal;font-size:11px;line-height:1.05}
}

/* =========================================================
   V17.2 — PREFERENCIAS DE CORREO
========================================================= */
.settings-email-card .settings-icon-mail {
    font-size: 16px;
    font-weight: 850;
    letter-spacing: -.02em;
}
.settings-email-note {
    margin: 12px 0 0;
    padding: 11px 13px;
    border-radius: 10px;
    background: #f7f8fa;
    color: #687080;
    font-size: 12px;
    line-height: 1.5;
}


/* V17.2A · acceso directo a preferencias desde Notificaciones */
.notifications-settings-shortcut {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    font-size: 14px;
    color: #667085;
}
.notifications-settings-shortcut .notifications-settings-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 13px;
    text-decoration: none;
}
#notificaciones { scroll-margin-top: 90px; }

/* V17.5A — avatar: el JS controla tamaño/posición para que preview y recorte coincidan */
.avatar-crop-stage img{width:auto;height:auto;max-width:none;max-height:none;object-fit:fill;transform:none;}


/* V17.5G — legal simplificado */
.legal-inline-button{appearance:none;border:0;background:none;padding:0;color:#d83d1b;font:inherit;font-weight:700;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.legal-divider{border:0;border-top:1px solid rgba(25,32,45,.10);margin:42px 0}
.legal-cookie-config{cursor:pointer}
.legal-identity-modal[hidden]{display:none!important}.legal-identity-modal{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:20px}.legal-identity-backdrop{position:absolute;inset:0;background:rgba(18,23,33,.55);backdrop-filter:blur(3px)}.legal-identity-dialog{position:relative;width:min(520px,100%);max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:20px;padding:28px;box-shadow:0 24px 80px rgba(0,0,0,.24)}.legal-identity-dialog h2{margin:0 38px 14px 0}.legal-identity-close{position:absolute;right:16px;top:14px;width:36px;height:36px;border:0;border-radius:50%;background:#f1f3f6;color:#303746;font-size:25px;line-height:1;cursor:pointer}.legal-modal-open{overflow:hidden}@media(max-width:640px){.legal-identity-dialog{padding:23px 18px;border-radius:17px}}

/* V17.5G1 — botón Configurar cookies visible en páginas claras */
.legal-page .legal-cookie-config{
    background:#fff;
    color:#d83d1b;
    border:1px solid rgba(216,61,27,.45);
    box-shadow:none;
}
.legal-page .legal-cookie-config:hover,
.legal-page .legal-cookie-config:focus-visible{
    background:#fff4f0;
    color:#b83216;
    border-color:#d83d1b;
}