:root {
    --hcpc-primary: #E2C48E;
    --hcpc-primary-hover: #F8D189;
    --hcpc-dark: #0B1014;
    --hcpc-black: #000000;
    --hcpc-panel: #11181E;
    --hcpc-card: #161D24;
    --hcpc-text: #C2C2C2;
    --hcpc-light: #FFFFFF;
    --hcpc-muted: #999999;
    --hcpc-border: rgba(226, 196, 142, 0.22);
    --hcpc-green: #4CAF50;
    /* Fondo vivo violeta (site-wide) */
    --hcpc-viol-base: #20112e;
    --hcpc-viol: #631b81;
    --hcpc-lilac: #c79bff;
}

/* =========================================
   COLOR GLOBAL DE TITULARES — y SOLO el color.
   Aqui vivio una decada la escala vieja (h1 32, movil 26): la retiro
   HC_TIPO_V1, que ahora es el UNICO sitio del sitio donde se decide un
   tamano de titular (al final de este archivo). Si esta regla vuelve a
   llevar un font-size, la escala global deja de mandar en esta pagina.
   ========================================= */

h1, h2, h3 {
    color: var(--hcpc-primary) !important;
}

/* =========================================
   LC_HC_LIVE_BG_V1 — FONDO VIOLETA VIVO, GLOBAL (#631b81)
   El mismo cielo cambiante detrás de TODAS las páginas.
   ========================================= */
html {
    /* base violeta oscuro: evita el parpadeo negro mientras cargan las capas */
    background: var(--hcpc-viol-base);
}
body {
    background: transparent;
    color: var(--hcpc-text);
    position: relative;
}
/* Capa 1 — auroras violeta que derivan y respiran (movimiento visible) */
body::before {
    content: "";
    position: fixed;
    inset: -25%;
    z-index: -2;
    pointer-events: none;
    background:
        radial-gradient(55% 50% at 22% 18%, #7a2a9e 0%, transparent 60%),
        radial-gradient(50% 48% at 82% 26%, #631b81 0%, transparent 58%),
        radial-gradient(58% 58% at 68% 88%, #3d1a72 0%, transparent 60%),
        radial-gradient(48% 44% at 12% 82%, #8e2fb0 0%, transparent 58%),
        linear-gradient(160deg, #25102f, #1a0b26 60%, #160a20);
    filter: saturate(1.08);
    animation: hcpcSky 18s ease-in-out infinite;
    will-change: transform;
}
/* Capa 2 — reflejo IRIDISCENTE que gira: el "perelив" claramente visible */
body::after {
    content: "";
    position: fixed;
    inset: -60%;
    z-index: -1;
    pointer-events: none;
    opacity: .55;
    mix-blend-mode: screen;
    background: conic-gradient(from 0deg,
        transparent 0%,
        rgba(199,155,255,.55) 12%,
        transparent 26%,
        rgba(255,120,210,.42) 44%,
        transparent 58%,
        rgba(228,200,140,.38) 74%,
        transparent 88%,
        transparent 100%);
    filter: blur(80px);
    animation: hcpcSpin 26s linear infinite;
    will-change: transform;
}
@keyframes hcpcSky {
    0%,100% { transform: translate3d(0,0,0) scale(1); }
    50%     { transform: translate3d(7%,-7%,0) scale(1.14); }
}
@keyframes hcpcSpin {
    to { transform: rotate(360deg); }
}
/* Solo en teléfonos pequeños congelamos (batería); tablet y escritorio SÍ se mueven */
@media (max-width: 600px) {
    body::before, body::after { animation: none; }
}
@media (prefers-reduced-motion: reduce) {
    body::before, body::after { animation: none; }
}

.hcpc-site-header {
    background: var(--hcpc-black);
    border-bottom: 1px solid var(--hcpc-border);
}

.hcpc-header-top {
    background: #d5d0d0;
}

.hcpc-header-brand {
    width: min(1440px, calc(100% - 24px));
    min-height: 78px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hcpc-brand-link {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    color: #333300;
    text-decoration: none;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(28px, 4vw, 48px);
    line-height: 1;
}

.hcpc-brand-link:hover {
    color: #5c4920;
}

.hcpc-brand-mark {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: linear-gradient(135deg, #F8D189, #E2C48E);
    color: #0B1014;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 18px;
    font-weight: 700;
    box-shadow: 0 4px 14px rgba(0,0,0,0.22);
}

.hcpc-header-bottom {
    background: #000000;
}

.hcpc-header-bottom-inner {
    width: min(1440px, calc(100% - 24px));
    min-height: 66px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 18px;
    align-items: center;
}

.hcpc-main-nav {
    justify-self: center;
}

.hcpc-menu,
.hcpc-footer-menu {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: center;
}

.hcpc-menu a,
.hcpc-footer-menu a {
    color: #f5f5f5;
    text-decoration: none;
    font-size: 18px;
}

.hcpc-menu a:hover,
.hcpc-footer-menu a:hover,
.hcpc-menu .current-menu-item > a,
.hcpc-menu .current_page_item > a,
.hcpc-footer-menu .current-menu-item > a,
.hcpc-footer-menu .current_page_item > a {
    color: var(--hcpc-primary);
}

.hcpc-menu-toggle {
    display: none;
    width: 46px;
    height: 46px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.hcpc-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin: 5px auto;
    background: var(--hcpc-primary);
    border-radius: 2px;
}

.hcpc-account-link {
    width: 46px;
    height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    perspective: 600px;
}

.hcpc-account-icon {
    width: 31px;
    height: 31px;
    object-fit: contain;
    transition: transform 0.7s ease;
}

.hcpc-account-link:hover .hcpc-account-icon {
    transform: rotateY(360deg);
}

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

.hcpc-home-hero {
    padding: 88px 0 62px;
    background:
        radial-gradient(circle at top right, rgba(226,196,142,0.16), transparent 34%),
        linear-gradient(180deg, #0B1014 0%, #050607 100%);
    border-bottom: 1px solid var(--hcpc-border);
}

.hcpc-kicker {
    margin: 0 0 12px;
    color: var(--hcpc-primary);
    text-transform: uppercase;
    letter-spacing: 1.6px;
    font-size: 13px;
}

.hcpc-home-hero h1 {
    max-width: 840px;
    margin: 0 0 18px;
    color: var(--hcpc-primary);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 6vw, 76px);
    line-height: 1.05;
}

.hcpc-hero-text {
    max-width: 700px;
    margin: 0 0 30px;
    color: var(--hcpc-text);
    font-size: 19px;
    line-height: 1.6;
}

.hcpc-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.hcpc-btn,
.hcpc-btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 12px 24px;
    border-radius: 999px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
}

.hcpc-btn {
    background: var(--hcpc-primary);
    color: var(--hcpc-dark);
    border: 0;
}

.hcpc-btn:hover {
    background: var(--hcpc-primary-hover);
    color: var(--hcpc-dark);
}

.hcpc-btn-secondary {
    background: transparent;
    color: var(--hcpc-primary);
    border: 1px solid var(--hcpc-primary);
}

.hcpc-btn-secondary:hover {
    background: var(--hcpc-primary);
    color: var(--hcpc-dark);
}

.hcpc-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    padding: 44px 0;
}

.hcpc-card {
    background: var(--hcpc-card);
    border: 1px solid var(--hcpc-border);
    border-radius: 20px;
    padding: 26px;
    box-shadow: 0 18px 50px rgba(0,0,0,0.32);
}

.hcpc-card-icon {
    color: var(--hcpc-primary);
    font-size: 13px;
    letter-spacing: 1px;
}

.hcpc-card h2 {
    color: var(--hcpc-primary);
    font-family: Georgia, "Times New Roman", serif;
}

.hcpc-page {
    padding: 60px 0;
}

.hcpc-error-card {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
    background: var(--hcpc-panel);
    border: 1px solid var(--hcpc-border);
    border-radius: 28px;
    padding: 44px;
}

.hcpc-error-code {
    color: var(--hcpc-primary);
    font-size: 92px;
    font-family: Georgia, "Times New Roman", serif;
    line-height: 1;
}

.hcpc-site-footer {
    background: #000000;
    border-top: 1px solid var(--hcpc-border);
}

.hcpc-footer-inner {
    width: min(1440px, calc(100% - 24px));
    min-height: 68px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.hcpc-footer-left {
    color: var(--hcpc-primary);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
}

.hcpc-footer-menu-toggle {
    display: none;
    width: 46px;
    height: 46px;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.hcpc-footer-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin: 5px auto;
    background: var(--hcpc-primary);
    border-radius: 2px;
}

@media (max-width: 900px) {
    .hcpc-header-bottom-inner {
        grid-template-columns: auto 1fr auto;
    }

    .hcpc-menu-toggle {
        display: inline-block;
    }

    .hcpc-main-nav {
        display: none;
        grid-column: 1 / -1;
        justify-self: stretch;
        padding: 0 0 14px;
    }

    body.hcpc-menu-open .hcpc-main-nav {
        display: block;
    }

    .hcpc-menu {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .hcpc-menu a {
        display: block;
        padding: 14px 0;
        border-top: 1px solid rgba(255,255,255,0.08);
    }

    .hcpc-feature-grid {
        grid-template-columns: 1fr;
    }

    .hcpc-footer-inner {
        flex-direction: column;
        align-items: flex-start;
        padding: 18px 0;
    }

    .hcpc-footer-menu-toggle {
    display: inline-block;
}

.hcpc-footer-menu {
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
}

body.hcpc-footer-menu-open .hcpc-footer-menu {
    display: flex;
}

body.hcpc-menu-open .hcpc-footer-menu {
    display: flex;
}

    .hcpc-footer-menu a {
        display: block;
        padding: 10px 0;
    }
}

/* =========================
   ROTATING BRAND COIN
   ========================= */

.hcpc-brand-coin {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    perspective: 1000px;
    overflow: hidden;
}

.hcpc-brand-coin-spinner {
    position: relative;
    width: 42px;
    height: 42px;
    display: block;
    transform-style: preserve-3d;
    animation: hcpc-brand-coin-rotate 4s linear infinite;
}

.hcpc-brand-coin-img {
    position: absolute;
    inset: 0;
    width: 42px !important;
    height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
    display: block;
    object-fit: contain;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.hcpc-brand-coin-front {
    transform: translateZ(1px);
}

.hcpc-brand-coin-back {
    transform: rotateY(180deg) translateZ(1px);
}

@keyframes hcpc-brand-coin-rotate {
    from {
        transform: rotateY(0deg);
    }

    to {
        transform: rotateY(360deg);
    }
}

/* =========================
   SUBMENÚS (dropdown)
   ========================= */

/* Ocultar submenús por defecto siempre */
.hcpc-menu .sub-menu,
.hcpc-menu ul,
.hcpc-footer-menu .sub-menu,
.hcpc-footer-menu ul {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Submenú abierto */
.hcpc-menu .menu-item-has-children.hcpc-open > .sub-menu,
.hcpc-menu .menu-item-has-children.hcpc-open > ul,
.hcpc-footer-menu .menu-item-has-children.hcpc-open > .sub-menu,
.hcpc-footer-menu .menu-item-has-children.hcpc-open > ul {
    display: block;
}

/* Indicador de flecha en ítems con hijos */
.hcpc-menu .menu-item-has-children > a,
.hcpc-footer-menu .menu-item-has-children > a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}

.hcpc-menu .menu-item-has-children > a::after,
.hcpc-footer-menu .menu-item-has-children > a::after {
    content: '';
    display: inline-block;
    width: 7px;
    height: 7px;
    border-right: 2px solid var(--hcpc-primary);
    border-bottom: 2px solid var(--hcpc-primary);
    transform: rotate(45deg);
    transition: transform 0.25s ease;
    margin-top: -3px;
    flex-shrink: 0;
}

.hcpc-menu .menu-item-has-children.hcpc-open > a::after,
.hcpc-footer-menu .menu-item-has-children.hcpc-open > a::after {
    transform: rotate(-135deg);
    margin-top: 3px;
}

/* Estilos del submenú en móvil/base */
.hcpc-menu .sub-menu a,
.hcpc-footer-menu .sub-menu a {
    padding-left: 18px;
    font-size: 16px;
    color: var(--hcpc-muted);
}

.hcpc-menu .sub-menu a:hover,
.hcpc-footer-menu .sub-menu a:hover {
    color: var(--hcpc-primary);
}

/* Desktop: dropdown flotante */
@media (min-width: 901px) {
    .hcpc-menu .menu-item-has-children,
    .hcpc-footer-menu .menu-item-has-children {
        position: relative;
    }

    .hcpc-menu .menu-item-has-children.hcpc-open > .sub-menu,
    .hcpc-menu .menu-item-has-children.hcpc-open > ul,
    .hcpc-footer-menu .menu-item-has-children.hcpc-open > .sub-menu,
    .hcpc-footer-menu .menu-item-has-children.hcpc-open > ul {
        display: block;
        position: absolute;
        top: calc(100% + 10px);
        left: 50%;
        transform: translateX(-50%);
        min-width: 220px;
        background: var(--hcpc-panel);
        border: 1px solid var(--hcpc-border);
        border-radius: 12px;
        box-shadow: 0 18px 50px rgba(0,0,0,0.46);
        padding: 8px 0;
        z-index: 9999;
    }

    .hcpc-menu .sub-menu a,
    .hcpc-footer-menu .sub-menu a {
        display: block;
        padding: 10px 20px;
        font-size: 15px;
        color: var(--hcpc-text);
        border-top: 0;
        white-space: nowrap;
    }

    .hcpc-menu .sub-menu a:hover,
    .hcpc-footer-menu .sub-menu a:hover {
        color: var(--hcpc-primary);
        background: rgba(226,196,142,0.07);
    }
}
.hcpc-telegram-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	margin-left: 15px;
	background: #D4AF37; /* Золотой цвет */
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	font-weight: 500;
	border-radius: 5px;
	transition: background 0.2s ease, transform 0.15s ease;
	white-space: nowrap;
}

.hcpc-telegram-btn:hover {
	background: #B8941F; /* Тёмный золотой при наведении */
	transform: translateY(-1px);
}

.hcpc-telegram-btn:active {
	transform: translateY(0);
}

.tg-icon {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	fill: currentColor; /* Иконка наследует цвет текста */
}

/* Адаптив для мобильных */
@media (max-width: 768px) {
	.hcpc-footer-left {
		flex-wrap: wrap;
		gap: 10px;
	}
	
	.hcpc-telegram-btn {
		margin-left: 0;
		width: 100%;
		justify-content: center;
	}
}

/* =========================================
   FULL WIDTH ONLY FOR MAIN PAGE CONTENT
   Header/footer are untouched
========================================= */

.hcpc-site-main,
.hcp-site-main{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
}

.hcpc-site-main .hcpc-container,
.hcp-site-main .hcp-container{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
}

.hcpc-site-main .hcpc-page,
.hcp-site-main .hcp-page{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
}

.hcpc-site-main .hcpc-content,
.hcp-site-main .hcp-content{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;

    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
}

/* Убираем ограничение 520px только внутри main */
.hcp-site-main .hcp-content input,
.hcp-site-main .hcp-content textarea,
.hcp-site-main .hcp-content select,
.hcpc-site-main .hcpc-content input,
.hcpc-site-main .hcpc-content textarea,
.hcpc-site-main .hcpc-content select{
    max-width:none !important;
}
/* =========================================
   LC_HC_RADAR_V1 — PORTADA RADAR (robot Spline + tablas vivas)
   Todo transparente: se ve el fondo violeta global por debajo.
   ========================================= */
@property --hcpc-ang { syntax:'<angle>'; inherits:false; initial-value:0deg; }

.hcpc-radar { position:relative; padding:44px 0 18px; background:transparent; }
.hcpc-radar-head { text-align:center; max-width:760px; margin:0 auto; }
.hcpc-radar-eyebrow {
    display:inline-flex; align-items:center; gap:8px;
    font-family:ui-monospace,Menlo,monospace; font-size:11.5px; letter-spacing:.16em; text-transform:uppercase;
    color:#e6d8ff; padding:6px 13px; border-radius:999px;
    background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(8px);
    margin-bottom:16px;
}
.hcpc-radar-eyebrow .live { width:7px; height:7px; border-radius:50%; background:var(--hcpc-lilac); box-shadow:0 0 10px var(--hcpc-lilac); animation:hcpcBlink 1.8s ease-in-out infinite; }
.hcpc-radar-head h1 {
    font-size:clamp(28px,4.6vw,52px) !important; font-weight:800 !important; letter-spacing:-.03em; line-height:1.04;
    margin:0 0 14px !important; color:var(--hcpc-light) !important; text-wrap:balance;
}
.hcpc-radar-head h1 .g { background:linear-gradient(92deg,#E4C88C,#f3b8e6 55%,#c79bff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hcpc-radar-head p { color:var(--hcpc-text); font-size:16px; line-height:1.6; max-width:52ch; margin:0 auto; }
.hcpc-radar-actions { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:22px; }

.hcpc-radar-stage { position:relative; min-height:560px; margin-top:34px; }
/* Prожектор (estilo demo): haz de luz suave desde arriba-izquierda que aparece al cargar */
.hcpc-spot { position:absolute; left:50%; top:44%; width:520px; height:520px; z-index:3; pointer-events:none;
    transform:translate(-50%,-50%);
    background:radial-gradient(circle, rgba(255,255,255,.24), rgba(214,196,255,.10) 40%, transparent 66%);
    filter:blur(22px); opacity:0; animation:hcpcSpot 1.8s ease .2s forwards;
    transition:left .12s linear, top .12s linear; will-change:left,top; }
@keyframes hcpcSpot { from { opacity:0; } to { opacity:1; } }
.hcpc-radar-glow { position:absolute; left:50%; top:52%; width:440px; height:440px; transform:translate(-50%,-50%); border-radius:50%;
    background:radial-gradient(circle,rgba(228,200,140,.16),rgba(199,155,255,.12) 45%,transparent 68%); filter:blur(8px); z-index:1; pointer-events:none; }
.hcpc-ring { position:absolute; left:50%; top:52%; transform:translate(-50%,-50%); border-radius:50%; pointer-events:none; z-index:2; }
.hcpc-ring.a { width:360px; height:360px; border:1px solid rgba(255,255,255,.07); }
.hcpc-ring.b { width:250px; height:250px; border:1px dashed rgba(199,155,255,.30); animation:hcpcSpinR 34s linear infinite; }
@keyframes hcpcSpinR { to { transform:translate(-50%,-50%) rotate(360deg); } }

.hcpc-robot { position:absolute; left:50%; top:52%; transform:translate(-50%,-50%); width:clamp(230px,25vw,330px); height:clamp(320px,36vw,460px); z-index:6; }
.hcpc-robot .ph { position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; }
.hcpc-robot .ph .orb { position:absolute; width:130px; height:130px; border-radius:50%;
    background:radial-gradient(circle at 34% 30%,#fff2cf,#E4C88C 45%,#8e2fb0); box-shadow:0 0 60px rgba(199,155,255,.5); filter:blur(2px); opacity:.5; z-index:0; animation:hcpcFloatR 6s ease-in-out infinite; }
.hcpc-robot .ph svg { position:relative; z-index:1; animation:hcpcFloatR 6s ease-in-out infinite; }
.hcpc-robot spline-viewer { position:relative; z-index:2; width:100%; height:100%; display:block; }
.hcpc-robot.is-loaded .ph { opacity:0; transition:opacity 1.2s ease .3s; }
@keyframes hcpcFloatR { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-12px); } }

.hcpc-natsy-chip { display:none; }

/* --- Tablas vivas --- */
.hcpc-ocard {
    position:absolute; transform:translate(-50%,-50%); z-index:7; width:250px; border-radius:16px; padding:14px 18px;
    background:rgba(38,18,54,.55); border:1px solid var(--hcpc-border); backdrop-filter:blur(16px); overflow:hidden;
    box-shadow:0 22px 46px -26px rgba(0,0,0,.7); animation:hcpcEdge 6s ease-in-out infinite;
}
.hcpc-ocard::after { content:""; position:absolute; top:0; bottom:0; left:0; width:45%; z-index:3; pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent); animation:hcpcSheen 5.5s ease-in-out infinite; }
.hcpc-ocard::before { content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none; opacity:0; transition:opacity .35s; z-index:4;
    background:conic-gradient(from var(--hcpc-ang),transparent 0 60%,#E4C88C 74%,#c79bff 86%,transparent 100%);
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; animation:hcpcConic 5s linear infinite; }
.hcpc-ocard:hover::before { opacity:1; }
@keyframes hcpcConic { to { --hcpc-ang:360deg; } }
.hcpc-ocard .oc-top { display:flex; align-items:center; gap:9px; margin-bottom:9px; position:relative; z-index:2; }
.hcpc-ocard .oc-ic { width:32px; height:32px; border-radius:9px; display:grid; place-items:center; background:rgba(228,200,140,.12); border:1px solid rgba(228,200,140,.28); color:var(--hcpc-primary); flex:none; }
.hcpc-ocard .oc-ic svg { width:17px; height:17px; }
.hcpc-ocard .oc-k { font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--hcpc-muted); }
.hcpc-ocard .oc-v { font-weight:800; font-size:26px; letter-spacing:-.02em; line-height:1; color:var(--hcpc-light); font-variant-numeric:tabular-nums; position:relative; z-index:2; }
.hcpc-ocard .oc-v em { font-style:normal; background:linear-gradient(92deg,#E4C88C,#c79bff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hcpc-ocard .oc-meta { font-size:11.5px; color:var(--hcpc-muted); margin-top:5px; position:relative; z-index:2; }
.hcpc-ocard .spark { display:flex; align-items:flex-end; gap:3px; height:22px; margin-top:9px; position:relative; z-index:2; }
.hcpc-ocard .spark i { width:5px; border-radius:2px; background:linear-gradient(180deg,#E4C88C,#c79bff); transform-origin:bottom; animation:hcpcBar 1.7s ease-in-out infinite; }
/* 4 tablas FLANQUEANDO al robot (2 izq, 2 der): el centro queda libre y el robot se ve entero */
.p-n { left:15%; top:27%; } .p-e { left:85%; top:27%; } .p-w { left:16%; top:73%; } .p-s { left:84%; top:73%; }

@keyframes hcpcBlink { 0%,100% { opacity:1; } 50% { opacity:.4; } }
@keyframes hcpcSheen { 0% { transform:translateX(-140%) skewX(-16deg); } 55%,100% { transform:translateX(320%) skewX(-16deg); } }
@keyframes hcpcBar { 0%,100% { transform:scaleY(.35); } 50% { transform:scaleY(1); } }
@keyframes hcpcEdge { 0%,100% { box-shadow:0 22px 46px -26px rgba(0,0,0,.7),0 0 0 1px rgba(228,200,140,.08) inset; } 50% { box-shadow:0 22px 46px -26px rgba(0,0,0,.7),0 0 22px -2px rgba(199,155,255,.30) inset; } }

/* --- Segunda sección: paneles del portal --- */
.hcpc-panels { padding:20px 0 62px; margin-top:24px; background:transparent; }
.hcpc-panels-title { text-align:center; color:var(--hcpc-primary) !important; margin:0 0 22px !important; }
.hcpc-panels-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.hcpc-live-card { position:relative; overflow:hidden; padding:26px; border-radius:18px;
    background:rgba(38,18,54,.42); border:1px solid var(--hcpc-border); backdrop-filter:blur(16px);
    box-shadow:0 22px 46px -30px rgba(0,0,0,.7); transition:transform .3s cubic-bezier(.2,.7,.2,1),border-color .3s; }
.hcpc-live-card::after { content:""; position:absolute; top:0; bottom:0; left:0; width:40%; pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent); animation:hcpcSheen 7s ease-in-out infinite; }
.hcpc-live-card:hover { transform:translateY(-4px); border-color:rgba(228,200,140,.45); }
.hcpc-live-card .lc-ic { display:inline-grid; place-items:center; width:44px; height:44px; border-radius:12px;
    background:rgba(228,200,140,.12); border:1px solid rgba(228,200,140,.28); color:var(--hcpc-primary); margin-bottom:14px; position:relative; z-index:2; }
.hcpc-live-card .lc-ic svg { width:22px; height:22px; }
.hcpc-live-card h3 { color:var(--hcpc-light) !important; margin:0 0 8px !important; font-size:19px !important; position:relative; z-index:2; }
.hcpc-live-card p { color:var(--hcpc-text); font-size:14px; line-height:1.6; margin:0; position:relative; z-index:2; }
.hcpc-live-card .lc-bar { position:absolute; left:0; bottom:0; height:3px; width:0; background:linear-gradient(90deg,#E4C88C,#c79bff); transition:width .6s cubic-bezier(.2,.7,.2,1); }
.hcpc-live-card:hover .lc-bar { width:100%; }

/* --- MOVIL: el circulo se vuelve rejilla; robot fuera (ni se descarga) --- */
@media (max-width: 899px) {
    .hcpc-radar-stage { min-height:auto; margin-top:16px; }
    .hcpc-ring, .hcpc-robot, .hcpc-radar-glow { display:none !important; }
    .hcpc-natsy-chip { display:flex; align-items:center; gap:11px; margin:0 0 14px; padding:11px 13px; border-radius:15px;
        background:rgba(38,18,54,.5); border:1px solid var(--hcpc-border); backdrop-filter:blur(12px); }
    .hcpc-natsy-chip .orb { position:relative; width:38px; height:38px; border-radius:50%; flex:none;
        background:radial-gradient(circle at 34% 30%,#fff2cf,#E4C88C 45%,#8e2fb0); box-shadow:0 0 16px rgba(199,155,255,.6); }
    .hcpc-natsy-chip .tx b { font-size:13px; color:var(--hcpc-light); }
    .hcpc-natsy-chip .tx span { display:block; font-size:11.5px; color:var(--hcpc-muted); margin-top:1px; }
    .hcpc-ocards { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
    .hcpc-ocard { position:static; transform:none; width:auto; animation:none; }
    .hcpc-ocard::after { display:none; }
    .hcpc-ocard:hover { transform:none; }
    .hcpc-panels-grid { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) {
    .hcpc-ring.b, .hcpc-ocard, .hcpc-ocard::after, .hcpc-ocard .spark i, .hcpc-robot .ph .orb, .hcpc-robot .ph svg, .hcpc-live-card::after, .hcpc-radar-eyebrow .live { animation:none !important; }
    .hcpc-spot { animation:none !important; opacity:1 !important; }
}

/* =========================================================
   LC_HC_HEADER_V1 — cabecera y pie modernos, en tono violeta
   (cristal translúcido: se ve el fondo #631b81 por debajo)
   ========================================================= */
.hcpc-hdr { position:sticky; top:0; z-index:1000; background:transparent;
    border-bottom:1px solid rgba(226,196,142,.26); box-shadow:0 10px 40px -24px rgba(0,0,0,.8); }
/* El cristal va en el pseudo-elemento: si 'backdrop-filter' estuviera en .hcpc-hdr,
   atraparía el popup fijo de GTranslate (position:fixed) y lo descolocaría. */
.hcpc-hdr::before { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
    background:rgba(28,13,42,.62); backdrop-filter:blur(16px); }
.hcpc-hdr-inner { width:min(1280px, calc(100% - 28px)); margin:0 auto; min-height:66px;
    display:flex; align-items:center; justify-content:space-between; gap:16px; }

/* marca + moneda giratoria */
.hcpc-hdr-brand { display:inline-flex; align-items:center; gap:12px; text-decoration:none; }
.hcpc-brand-coin { width:40px; height:40px; flex:none; perspective:600px; }
.hcpc-brand-coin-spinner { position:relative; width:100%; height:100%; transform-style:preserve-3d; animation:hcpcCoin 6s linear infinite; }
.hcpc-brand-coin-img { position:absolute; inset:0; width:40px; height:40px; border-radius:50%; backface-visibility:hidden; object-fit:cover; box-shadow:0 0 16px rgba(199,155,255,.4); }
.hcpc-brand-coin-back { transform:rotateY(180deg); }
@keyframes hcpcCoin { to { transform:rotateY(360deg); } }
.hcpc-hdr-title { font-size:clamp(16px,2.3vw,21px); font-weight:600; letter-spacing:.01em; color:#f3ecfb; }
.hcpc-hdr-title b { background:linear-gradient(90deg,#E4C88C,#f3b8e6,#c79bff); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* herramientas (derecha) */
.hcpc-hdr-tools { display:flex; align-items:center; gap:12px; }
/* Contraste: sobre el fondo morado del sitio los pills al 6/14% de blanco eran casi
   invisibles en móvil. Fondo oscuro + borde DORADO + icono claro → se ven en cualquier fondo. */
.hcpc-hdr-account { display:inline-grid; place-items:center; width:40px; height:40px; border-radius:12px; color:#f6eecf; text-decoration:none;
    background:rgba(0,0,0,.32); border:1px solid rgba(228,200,140,.55); transition:.25s; }
.hcpc-hdr-account svg { width:21px; height:21px; }
.hcpc-hdr-account:hover { background:rgba(228,200,140,.18); border-color:rgba(228,200,140,.75); color:#E4C88C; }

/* Botón del huésped — la única pieza RELLENA de la cabecera.
   Las demás son pastillas con borde: al rellenar esta en dorado sobre texto
   oscuro, el ojo va aquí primero sin tener que hacerla más grande ni gritar.
   Misma altura y mismo radio que el resto, para que no rompa la fila. */
.hcpc-hdr-guest { display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 14px; border-radius:12px;
    background:linear-gradient(135deg,#E4C88C,#f0dcae); color:#2b1a3d; font-weight:700; font-size:14px;
    text-decoration:none; border:1px solid rgba(228,200,140,.9); white-space:nowrap; transition:.25s; }
.hcpc-hdr-guest:hover { background:linear-gradient(135deg,#f0dcae,#fdf1cf); color:#2b1a3d; transform:translateY(-1px); }
.hcpc-hdr-guest svg { width:19px; height:19px; display:block; }

/* En pantallas estrechas se queda solo el icono: el texto empujaba el idioma y
   el menú fuera de la fila, y una cabecera en dos líneas se ve rota. */
@media (max-width:520px) {
    .hcpc-hdr-guest { padding:0 11px; }
    .hcpc-hdr-guest-tx { display:none; }
}

/* GTranslate — MISMA técnica que Las Casas: píldora blanca + texto oscuro */
.hcpc-hdr-lang .gtranslate_wrapper { display:inline-flex; align-items:center; justify-content:center; height:40px;
    background:rgba(0,0,0,.32); border:1px solid rgba(228,200,140,.55); border-radius:12px; padding:0 11px; line-height:1; transition:.25s; }
.hcpc-hdr-lang .gtranslate_wrapper:hover { background:rgba(228,200,140,.14); border-color:rgba(228,200,140,.45); }
.hcpc-hdr-lang img.gt_flag, .hcpc-hdr-lang .gt-current-lang img { vertical-align:middle; }
/* SOLO la bandera en el disparador. CLAVE: font-size:0 únicamente en el enlace
   disparador (hijo directo > a). El popup de idiomas vive DENTRO del wrapper y
   sus nombres son <span>: si aplicáramos font-size:0 en general, se ocultarían
   (justo el bug de "no se ven los idiomas"). */
.hcpc-hdr-lang .gtranslate_wrapper > a,
.hcpc-hdr-lang .gtranslate_wrapper > a * { font-size:0 !important; line-height:1 !important; }
.hcpc-hdr-lang .gtranslate_wrapper > a img { width:22px !important; height:auto !important; vertical-align:middle !important; margin:0 !important; }

/* menú desplegable (botón hamburguesa) */
.hcpc-hm { position:relative; }
.hcpc-hm-trigger { display:inline-flex; align-items:center; gap:9px; cursor:pointer; list-style:none; padding:9px 14px; border-radius:12px;
    color:#f6eecf; font-weight:600; font-size:14px; background:rgba(0,0,0,.32); border:1px solid rgba(228,200,140,.55); transition:.25s; }
.hcpc-hm-trigger::-webkit-details-marker { display:none; }
.hcpc-hm-trigger::marker { content:""; }
.hcpc-hm-trigger:hover { background:rgba(228,200,140,.14); border-color:rgba(228,200,140,.45); }
.hcpc-burger { width:20px; height:14px; position:relative; flex:none; }
.hcpc-burger span { position:absolute; left:0; right:0; height:2px; border-radius:2px; background:currentColor; transition:.3s; }
.hcpc-burger span:nth-child(1) { top:0; }
.hcpc-burger span:nth-child(2) { top:6px; }
.hcpc-burger span:nth-child(3) { top:12px; }
.hcpc-hm[open] .hcpc-burger span:nth-child(1) { top:6px; transform:rotate(45deg); }
.hcpc-hm[open] .hcpc-burger span:nth-child(2) { opacity:0; }
.hcpc-hm[open] .hcpc-burger span:nth-child(3) { top:6px; transform:rotate(-45deg); }
.hcpc-hm[open] .hcpc-hm-trigger { background:rgba(228,200,140,.16); border-color:rgba(228,200,140,.5); color:#E4C88C; }

.hcpc-hm-pop { position:absolute; right:0; top:calc(100% + 10px); width:272px; padding:8px; border-radius:16px; z-index:60;
    background:rgba(26,12,38,.97); border:1px solid rgba(226,196,142,.28); backdrop-filter:blur(18px);
    box-shadow:0 30px 70px -30px rgba(0,0,0,.85); animation:hcpcPop .28s cubic-bezier(.2,.7,.2,1); }
.hcpc-hm-pop::before { content:""; position:absolute; top:-6px; right:22px; width:12px; height:12px; transform:rotate(45deg);
    background:rgba(26,12,38,.97); border-left:1px solid rgba(226,196,142,.28); border-top:1px solid rgba(226,196,142,.28); }
@keyframes hcpcPop { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:none; } }

.hcpc-mi { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:11px; text-decoration:none; color:#f3ecfb; font-size:14px; font-weight:500;
    transition:background .2s, transform .2s; opacity:0; transform:translateX(-8px); animation:hcpcMi .4s cubic-bezier(.2,.7,.2,1) forwards; }
.hcpc-hm-pop .hcpc-mi:nth-child(1) { animation-delay:.03s; }
.hcpc-hm-pop .hcpc-mi:nth-child(2) { animation-delay:.06s; }
.hcpc-hm-pop .hcpc-mi:nth-child(3) { animation-delay:.09s; }
.hcpc-hm-pop .hcpc-mi:nth-child(4) { animation-delay:.12s; }
.hcpc-hm-pop .hcpc-mi:nth-child(5) { animation-delay:.15s; }
.hcpc-hm-pop .hcpc-mi:nth-child(6) { animation-delay:.18s; }
.hcpc-hm-pop .hcpc-mi:nth-child(7) { animation-delay:.21s; }
@keyframes hcpcMi { to { opacity:1; transform:none; } }
.hcpc-mi:hover { background:rgba(255,255,255,.07); transform:translateX(2px); }
.hcpc-mi-ic { width:34px; height:34px; flex:none; display:grid; place-items:center; border-radius:10px; color:#fff; box-shadow:0 6px 16px -8px rgba(0,0,0,.6); }
.hcpc-mi-ic svg { width:17px; height:17px; }
.hcpc-mi-tx { flex:1; }
.hcpc-mi-tx small { color:#b9a9cf; font-weight:400; }
.hcpc-mi:nth-child(1) .hcpc-mi-ic { background:linear-gradient(135deg,#E4C88C,#c79a4a); }
.hcpc-mi:nth-child(2) .hcpc-mi-ic { background:linear-gradient(135deg,#8e2fb0,#c79bff); }
.hcpc-mi:nth-child(3) .hcpc-mi-ic { background:linear-gradient(135deg,#3a6ff0,#7aa0ff); }
.hcpc-mi:nth-child(4) .hcpc-mi-ic { background:linear-gradient(135deg,#33B79C,#7fe0c9); }
.hcpc-mi:nth-child(5) .hcpc-mi-ic { background:linear-gradient(135deg,#c94a7a,#ff9ed8); }
.hcpc-mi:nth-child(6) .hcpc-mi-ic { background:linear-gradient(135deg,#E4C88C,#8e2fb0); }
.hcpc-mi:nth-child(7) .hcpc-mi-ic { background:linear-gradient(135deg,#229ED9,#59c2ef); }
/* 2026-07-28: el menú pasó de 7 a 11 entradas y las reglas se quedaban en la 7ª,
   así que las cuatro de Telegram salían como una flecha suelta, sin su cuadro.
   Cada una con su color: son cuatro canales distintos, no cuatro veces el mismo. */
.hcpc-mi:nth-child(8)  .hcpc-mi-ic { background:linear-gradient(135deg,#e0653f,#ff9f7a); }
.hcpc-mi:nth-child(9)  .hcpc-mi-ic { background:linear-gradient(135deg,#2f9e5e,#7fe0a5); }
.hcpc-mi:nth-child(10) .hcpc-mi-ic { background:linear-gradient(135deg,#4b46c9,#9a95ff); }
.hcpc-mi:nth-child(11) .hcpc-mi-ic { background:linear-gradient(135deg,#0f8f9e,#57d8e6); }
/* Colchón por si mañana se añaden más: sin esto volverían a salir desnudas. */
.hcpc-mi:nth-child(n+12) .hcpc-mi-ic { background:linear-gradient(135deg,#6b6b6b,#a8a8a8); }

/* pie de página */
.hcpc-ftr { margin-top:44px; background:rgba(24,11,36,.66); backdrop-filter:blur(14px); border-top:1px solid rgba(226,196,142,.26); }
.hcpc-ftr-inner { width:min(1280px, calc(100% - 28px)); margin:0 auto; min-height:70px; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; padding:16px 0; }
.hcpc-ftr-brand { display:inline-flex; align-items:center; gap:10px; color:#f3ecfb; font-size:15px; }
.hcpc-ftr-brand b { color:#E4C88C; }
.hcpc-ftr-dot { width:14px; height:14px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#fff2cf,#E4C88C 45%,#8e2fb0); box-shadow:0 0 12px rgba(199,155,255,.5); }
.hcpc-ftr-nav { flex:1; display:flex; justify-content:center; }
.hcpc-ftr-menu { margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:20px; align-items:center; }
.hcpc-ftr-menu a { color:#cbbfe0; text-decoration:none; font-size:14px; transition:.2s; }
.hcpc-ftr-menu a:hover { color:#E4C88C; }
/* .hcpc-ftr-tg (boton de Telegram del pie) retirado el 2026-08-02 junto con su
   marcado en footer.php: apuntaba al canal del sitio antiguo. Se borra tambien
   el estilo — CSS de algo que ya no existe solo sirve para confundir al que
   busque de donde sale un boton que no ve. */
.hcpc-ftr-copy { text-align:center; color:#8f80a8; font-size:12px; padding:0 0 18px; }

/* ═══════════════════════════════════════════════════════════════════════
   HC_FOOTER_4COLS_V1 (2026-08-03) — pie de 4 columnas + 3 pastillas.
   Mismo planteamiento que el pie de las-casas: en escritorio las cuatro
   columnas siempre abiertas; en el móvil se pliegan en acordeón para que
   el pie no se coma media pantalla.
   Sin emojis: los signos son SVG dibujados en la plantilla.
   ═══════════════════════════════════════════════════════════════════════ */
.hcpc-fwrap { width:min(1280px, calc(100% - 28px)); margin:0 auto; padding:34px 0 20px; }
.hcpc-fcols { display:flex; flex-wrap:wrap; gap:26px 30px; }
.hcpc-fcol { flex:1 1 210px; min-width:180px; }
.hcpc-ftitle {
    margin:0 0 10px; font-weight:700; letter-spacing:.02em; color:#E4C88C; font-size:14px;
    display:flex; align-items:center; justify-content:space-between; gap:8px;
}
.hcpc-fchevron { display:none; flex:0 0 auto; color:#E4C88C; transition:transform .25s ease; }
.hcpc-flist { list-style:none; margin:0; padding:0; }
.hcpc-flist li { margin:0 0 2px; }
.hcpc-flist a {
    display:block; padding:8px 6px; border-radius:8px; color:#cbbfe0;
    text-decoration:none; font-size:14px; line-height:1.35;
    transition:background .2s ease, color .2s ease;
}
.hcpc-flist a:hover, .hcpc-flist a:focus-visible { background:rgba(226,196,142,.12); color:#E4C88C; }

/* Las tres pastillas: lo único que se pide desde el pie. */
.hcpc-fpill { display:flex; justify-content:center; align-items:stretch; gap:8px; flex-wrap:wrap; padding:18px 12px 4px; }
.hcpc-fpill-btn {
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    /* 44 px: medida de dedo, no de letra. */
    min-height:44px; padding:10px 20px; border-radius:999px;
    text-decoration:none; font-weight:800; font-size:14px; line-height:1.2;
    background:linear-gradient(180deg,#F0D9AA,#DCB472); color:#1a1024;
    transition:filter .2s ease, transform .2s ease;
}
.hcpc-fpill-btn:hover, .hcpc-fpill-btn:focus-visible { filter:brightness(1.06); transform:translateY(-2px); color:#1a1024; }
/* La tercera sale del sitio: se distingue sin gritar. */
.hcpc-fpill-btn--fuera { background:transparent; color:#E4C88C; border:1px solid rgba(226,196,142,.55); }
.hcpc-fpill-btn--fuera:hover, .hcpc-fpill-btn--fuera:focus-visible { background:rgba(226,196,142,.12); color:#E4C88C; }

/* Móvil: acordeón, una columna, encabezados tocables. */
@media (max-width:768px) {
    .hcpc-fwrap { padding:22px 0 14px; }
    .hcpc-fcols { gap:0; flex-direction:column; }
    .hcpc-fcol { flex:1 1 100%; min-width:0; border-top:1px solid rgba(255,255,255,.10); }
    .hcpc-fcol:first-child { border-top:0; }
    .hcpc-ftitle { cursor:pointer; padding:15px 4px; margin:0; -webkit-user-select:none; user-select:none; }
    .hcpc-fchevron { display:inline-block; }
    .hcpc-flist { max-height:0; overflow:hidden; transition:max-height .3s ease; }
    .hcpc-fcol.is-open .hcpc-flist { max-height:1200px; padding-bottom:8px; }
    .hcpc-fcol.is-open .hcpc-fchevron { transform:rotate(180deg); }
    .hcpc-flist a { padding:11px 6px; }
    .hcpc-fpill { gap:6px; padding:14px 8px 4px; }
    /* Las tres se reparten el ancho; el rótulo puede partirse dentro del botón. */
    .hcpc-fpill-btn { flex:1 1 0; min-width:0; padding:8px 10px; text-align:center; }
}

/* Escritorio: siempre desplegado, sin signo de plegar. */
@media (min-width:769px) {
    .hcpc-flist { max-height:none; }
    .hcpc-fchevron { display:none; }
    .hcpc-ftitle { cursor:default; }
}

/* GTranslate popup — se adjunta al BODY, estilo global claro y legible */
.gt_options, .gt_popup, [class*="gt-popup"], [class*="gt_popup"], [id*="gt-popup"], [id*="gt_popup"] { background:#fff !important; }
.gt_options, .gt_options *, .gt_popup, .gt_popup *, [class*="gt-popup"], [class*="gt-popup"] *, [class*="gt_popup"], [class*="gt_popup"] *, [id*="gt-popup"] *, [id*="gt_popup"] *, .gt-lang-code { color:#333 !important; }
.gt_options a:hover, .gt_popup a:hover, [class*="gt-popup"] a:hover { background:#f2f2f2 !important; color:#111 !important; }

/* GTranslate SOLO en la cabecera: el del FOOTER es un elemento de menú
   (<li class="menu-item-gtranslate ...>) → lo ocultamos. */
li.menu-item-gtranslate, .menu-item-gtranslate { display: none !important; }

/* El popup de idiomas de ps.js YA se centra solo (position:fixed; top/left:50%).
   Con el backdrop-filter fuera de .hcpc-hdr, se centra en la pantalla.
   Fondo BLANCO + texto oscuro para que los idiomas se lean.
   (Nada de box-shadow gigante: el popup no se quita del DOM al cerrarse,
    sólo se mueve fuera de pantalla, y una sombra enorme oscurecería todo.) */
/* Popup de idiomas: dejamos el estilo POR DEFECTO del plugin (fondo claro + texto
   oscuro = legible). NO forzamos color/fondo: al hacerlo entrábamos en guerra de
   especificidad con el <style> que el plugin inyecta en runtime y el texto quedaba
   invisible (blanco sobre blanco). Solo redondeamos y lo dejamos por encima. */
html body [class*="gt_container-"] {
    border-radius: 14px !important;
    max-width: 92vw !important;
    max-height: 82vh !important;
    box-shadow: 0 26px 70px -18px rgba(0,0,0,.55) !important;
    z-index: 100000 !important;
}

/* responsive */
@media (max-width:640px) {
    .hcpc-hm-word { display:none; }
    .hcpc-hdr-title { font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:40vw; }
    .hcpc-hdr-inner { gap:10px; }
    .hcpc-hdr-tools { gap:8px; }
    .hcpc-hm-pop { width:min(86vw,272px); }
    .hcpc-ftr-inner { justify-content:center; text-align:center; }
    .hcpc-ftr-nav { order:3; width:100%; }
}
@media (max-width:430px) {
    /* Móvil estrecho: sólo la moneda como marca, todo cabe holgado */
    .hcpc-hdr-title { display:none; }
    .hcpc-hdr-account { width:38px; height:38px; }
}
@media (prefers-reduced-motion:reduce) {
    .hcpc-brand-coin-spinner, .hcpc-hm-pop, .hcpc-mi { animation:none !important; }
    .hcpc-mi { opacity:1; transform:none; }
}

/* ===== LC_HC_NAV_V1 — barra de menú horizontal (Main Menu) bajo la cabecera ===== */
.hcpc-hdr-nav { position:relative; background:rgba(20,9,32,.5); border-top:1px solid rgba(255,255,255,.06); }
.hcpc-hdr-nav-inner { width:min(1280px,calc(100% - 28px)); margin:0 auto; display:flex; justify-content:center; }
.hcpc-nav-menu { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:center; gap:4px; }
.hcpc-nav-menu li { position:relative; }
.hcpc-nav-menu a { display:inline-flex; align-items:center; gap:7px; padding:13px 15px; color:#e7dcf5; text-decoration:none; font-size:14.5px; font-weight:500; border-radius:9px; transition:.2s; }
.hcpc-nav-menu a:hover, .hcpc-nav-menu .current-menu-item > a, .hcpc-nav-menu li:hover > a { color:#E4C88C; background:rgba(255,255,255,.05); }
.hcpc-nav-menu .menu-item-has-children > a::after { content:""; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg) translateY(-2px); opacity:.7; }
.hcpc-nav-menu .sub-menu { list-style:none; margin:0; padding:6px; position:absolute; left:0; top:calc(100% + 6px); min-width:230px; z-index:70;
    background:rgba(26,12,38,.98); border:1px solid rgba(226,196,142,.28); border-radius:14px; backdrop-filter:blur(18px);
    box-shadow:0 24px 60px -26px rgba(0,0,0,.85); opacity:0; visibility:hidden; transform:translateY(-6px); transition:.22s; }
.hcpc-nav-menu li:hover > .sub-menu, .hcpc-nav-menu li:focus-within > .sub-menu { opacity:1; visibility:visible; transform:none; }
.hcpc-nav-menu .sub-menu li { width:100%; }
.hcpc-nav-menu .sub-menu a { padding:10px 12px; border-radius:9px; font-size:14px; color:#f3ecfb; width:100%; }
.hcpc-nav-menu .sub-menu a:hover { background:rgba(255,255,255,.07); color:#E4C88C; }

/* ===== Menú dentro del dropdown hamburguesa (móvil) ===== */
.hcpc-hm-menu { list-style:none; margin:0; padding:0; }
.hcpc-hm-menu > li > a, .hcpc-hm-menu .sub-menu a { display:flex; align-items:center; gap:10px; padding:11px 12px; border-radius:11px; color:#f3ecfb; text-decoration:none; font-size:14px; font-weight:500; transition:.2s; }
.hcpc-hm-menu > li > a { opacity:0; transform:translateX(-8px); animation:hcpcMi .4s cubic-bezier(.2,.7,.2,1) forwards; }
.hcpc-hm-menu a::before { content:""; width:7px; height:7px; border-radius:50%; flex:none; background:linear-gradient(135deg,#E4C88C,#c79bff); }
.hcpc-hm-menu a:hover, .hcpc-hm-menu .current-menu-item > a { background:rgba(255,255,255,.07); color:#E4C88C; }
.hcpc-hm-menu .sub-menu { list-style:none; margin:2px 0 4px; padding:0 0 0 16px; }
.hcpc-hm-menu .sub-menu a { font-size:13.5px; }
.hcpc-hm-menu .sub-menu a::before { width:5px; height:5px; background:#c79bff; }
.hcpc-hm-menu > li:nth-child(1) > a { animation-delay:.03s; }
.hcpc-hm-menu > li:nth-child(2) > a { animation-delay:.06s; }
.hcpc-hm-menu > li:nth-child(3) > a { animation-delay:.09s; }
.hcpc-hm-menu > li:nth-child(4) > a { animation-delay:.12s; }
.hcpc-hm-menu > li:nth-child(5) > a { animation-delay:.15s; }
.hcpc-hm-menu > li:nth-child(6) > a { animation-delay:.18s; }

/* ===== Barra horizontal (Main Menu) SOLO en escritorio; el dropdown con iconos
   se muestra SIEMPRE. En móvil el dropdown añade además el Main Menu completo. ===== */
.hcpc-hm-wp { display:none; }
@media (max-width:899px) {
    .hcpc-hdr-nav { display:none; }
    .hcpc-hm-wp { display:block; margin-top:8px; padding-top:8px; border-top:1px solid rgba(255,255,255,.12); }
}
@media (prefers-reduced-motion:reduce) { .hcpc-hm-menu > li > a { animation:none !important; opacity:1; transform:none; } }


/* ══════════════════════════════════════════════════════════════════════
   HC_TIPO_V1 (2026-07-29, orden del dueño) — LA TIPOGRAFIA DEL SITIO.
   DOS variantes y solo dos: MOVIL y ESCRITORIO. La misma escala que manda
   en las-casas (LC_TIPO_V1, en su tema hijo): los dos sitios son del mismo
   dueño y el visitante pasa de uno a otro.

   VIVE EN EL TEMA, no en un plugin, por orden expresa del dueño: el tema
   es el unico que carga en TODAS las paginas, con plugin o sin el. Una
   primera version de esta escala estuvo en hotelscasa-listing.css (el css
   del plugin de anuncios) y era un parche: cualquier pagina sin ese plugin
   quedaba fuera. Aquel bloque ya no existe — si alguien lo reencuentra en
   una copia vieja, este es el que vale.

   Los tamaños que habia eran de hace una decada, cuando los telefonos eran
   otros: el titular de la pagina de anuncios ocupaba media pantalla antes
   del primer anuncio.

        ┌──────────────────┬──────────┬──────────────┐
        │                  │  MOVIL   │  ESCRITORIO  │
        ├──────────────────┼──────────┼──────────────┤
        │ h1               │   13 px  │    32 px     │
        │ h2               │   12 px  │    24 px     │
        │ h3               │ 11.5 px  │    18 px     │
        │ h4 h5 h6         │   11 px  │    15 px     │
        │ subtitulo        │ 11.5 px  │    16 px     │
        │ texto corriente  │ 11.5 px  │    16 px     │
        │ campos (iOS)     │   16 px  │    16 px     │
        └──────────────────┴──────────┴──────────────┘

   Va con !important a proposito y es la unica manera de que funcione: los
   titulares de cada bloque llevan clase propia y una clase siempre le gana
   a la etiqueta — sin !important esta escala no pintaria nada y habria que
   volver a perseguir tamanos archivo por archivo. El corte esta en 768 px,
   el mismo que en las-casas.
   ══════════════════════════════════════════════════════════════════════ */

/* ── VARIANTE MOVIL ──────────────────────────────────────────────────── */
@media (max-width: 768px) {

    h1, .h1     { font-size: 13px !important;   line-height: 1.25 !important; }
    h2, .h2     { font-size: 12px !important;   line-height: 1.30 !important; }
    h3, .h3     { font-size: 11.5px !important; line-height: 1.30 !important; }
    h4, h5, h6  { font-size: 11px !important;   line-height: 1.30 !important; }

    /* El parrafo pegado a un titular es su subtitulo: un peldano por
       debajo, nunca al mismo nivel. */
    h1 + p,
    h2 + p      { font-size: 11.5px !important; line-height: 1.4 !important; }

    /* Titulares con clase propia (el hero del radar, las tarjetas live):
       una clase le gana a la etiqueta, asi que sin nombrarlos aqui se
       quedarian gigantes en el movil. En escritorio conservan su tamano de
       diseno — la queja del dueño es el movil. */
    .hcpc-radar-head h1 { font-size: 15px !important; }
    .hcpc-live-card h3  { font-size: 11.5px !important; }

    /* El texto corriente TAMBIEN entra: un parrafo de 15 px al lado de un
       h1 de 13 invierte la jerarquia — el titular parece pie de foto. */
    body        { font-size: 11.5px !important; }

    /* LOS CAMPOS NO. Con menos de 16 px, iOS hace zoom solo al tocarlos y
       descoloca la pagina entera. Unica excepcion, y con motivo. */
    input, select, textarea { font-size: 16px !important; }

    h1, h2, h3  { margin-top: 0 !important; margin-bottom: 6px !important; }
}

/* ── VARIANTE ESCRITORIO ─────────────────────────────────────────────── */
@media (min-width: 769px) {

    h1, .h1     { font-size: 32px !important; line-height: 1.2 !important; }
    h2, .h2     { font-size: 24px !important; line-height: 1.25 !important; }
    h3, .h3     { font-size: 18px !important; line-height: 1.3 !important; }
    h4, h5, h6  { font-size: 15px !important; line-height: 1.35 !important; }

    h1 + p,
    h2 + p      { font-size: 16px !important; line-height: 1.5 !important; }

    h1, h2, h3  { margin-top: 0 !important; margin-bottom: 12px !important; }
}


/* ══════════════════════════════════════════════════════════════════════
   HC_MOVIL_GUARD_V1 (2026-07-29) — EL MOVIL NO SE DESBORDA.
   En el movil se veia la pagina salida del marco: fondo violeta a la
   derecha, tarjetas cortadas, la barra de busqueda medio fuera. Bastaba un
   solo elemento mas ancho que la pantalla (una tabla del tablero, una
   imagen con ancho fijo) para descolocarlo todo. Misma guardia que en el
   tema de las-casas: se prohibe el desplazamiento horizontal y se obliga a
   los anchos a caber.
   ══════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

    html, body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    img, video, iframe {
        max-width: 100% !important;
        height: auto !important;
    }

    /* La vista «Tabla» del tablero: una tabla no encoge por debajo de su
       contenido — si no cabe, que se deslice DENTRO de su propia caja, no
       arrastrando la pagina entera. */
    table {
        display: block;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* ── EL ZUM DEL iPHONE (2026-08-02) ──────────────────────────────────
       Faltaba, y es el fallo que mas se nota de todos.

       Safari en iPhone amplia la pagina AL TOCAR un campo cuya letra mide
       menos de 16px. Y al salir del campo no vuelve: la web se queda
       agrandada y torcida, con medio contenido fuera del marco. El visitante
       cree que la web esta rota, y no lo esta — es una regla del navegador.

       Pasa justo en lo primero que se toca: el buscador de la portada y el
       de /alojamiento/, las dos paginas mas visitadas desde el movil.

       16px exactos es el umbral: con 15.9px amplia igual.

       Fuera quedan casillas, botones y deslizadores: no reciben texto, y
       cambiarles el tamano les deforma la caja.

       `!important` porque hay que ganar a la regla del plugin que puso 14px,
       y el orden de carga de las hojas no esta garantizado (LiteSpeed las
       combina). */
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]),
    select,
    textarea {
        font-size: 16px !important;
    }

    /* Un correo largo, un enlace con parametros o una referencia de reserva
       son UNA sola palabra para el navegador: no la parte, y empuja el bloque
       hasta salirse. Se ve en confirmaciones, facturas y en el chat.
       `break-word` parte solo cuando no queda otra, no a mitad de cualquier
       palabra normal. */
    body {
        overflow-wrap: break-word;
    }
}