/* Fondo general del sitio */
body {
    background: linear-gradient(
        135deg,
        #4B2E83 0%,
        #7B5EA7 40%,
        #C6B7E2 75%,
        #F5F2FA 100%
    );
    background-attachment: fixed;
    min-height: 100vh;
}

/* Capa difuminada para suavizar el fondo */
body::before {
    content: "";
    position: fixed;
    top: -20%;
    left: -20%;
    width: 140%;
    height: 140%;
    background: radial-gradient(
        circle at top left,
        rgba(198, 183, 226, 0.5),
        rgba(75, 46, 131, 0.4),
        rgba(245, 242, 250, 0.3)
    );
    filter: blur(80px);
    z-index: -1;
}

/* Tarjeta principal — única caja blanca */
#page.site {
    position: relative;
    background-color: rgba(255, 255, 255, 0.92);
    border-radius: 16px;
    padding: 32px 40px 32px 56px;
    overflow: visible;
}

/* Anillos tipo cuadernillo con agujero en el papel */
#page.site::before {
    content: "";
    position: absolute;
    top: 16px;
    left: -16px;
    width: 32px;
    height: calc(100% - 32px);
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="44"><line x1="16" y1="0" x2="16" y2="44" stroke="%238B5FBA" stroke-width="1.5" opacity="0.3"/><path d="M16,12 A10,10 0 0,1 16,32" fill="none" stroke="%234A2870" stroke-width="5" opacity="0.55"/><circle cx="16" cy="22" r="11" fill="rgba(160,120,210,0.12)"/><circle cx="16" cy="22" r="11" fill="none" stroke="rgba(80,40,120,0.18)" stroke-width="1.5"/><rect x="16" y="0" width="16" height="11" fill="white"/><rect x="16" y="33" width="16" height="11" fill="white"/><path d="M16,12 A10,10 0 0,0 16,32" fill="none" stroke="%232A0F50" stroke-width="8" opacity="0.18"/><path d="M16,12 A10,10 0 0,0 16,32" fill="none" stroke="%236B3FA0" stroke-width="5"/><path d="M16,12 A10,10 0 0,0 16,32" fill="none" stroke="%23C090E8" stroke-width="2.5"/><path d="M7,16 A10,10 0 0,0 7,28" fill="none" stroke="rgba(255,255,255,0.6)" stroke-width="2" stroke-linecap="round"/></svg>');
    background-size: 32px 44px;
    background-repeat: repeat-y;
    z-index: 10;
}

#page.site::after {
    display: none;
}

/* Eliminar fondos anidados */
.site-content,
.container,
.wrap {
    background-color: transparent;
    border-radius: 0;
    padding: 0;
}

/* Forzar full-width en todas las páginas */
.content-area {
    float: none !important;
    width: auto !important;
    padding-left: 0 !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
}


/* Aire extra entre header y contenido en páginas internas */
body:not(.home) .entry-header {
    margin-top: 32px;
}

body:not(.home) .entry-content {
    margin-top: 16px;
}

/* Texto */
body, p {
    color: #4A4A4A;
}

/* Enlaces */
a {
    color: #4B2E83;
}

a:hover {
    color: #7B5EA7;
}

.imagen-galia {
    border-radius: 50%;
    box-shadow:
        0 0 40px rgba(120, 60, 200, 0.55),
        0 0 90px rgba(160, 110, 240, 0.4);
}

.page-id-10 .entry-title {
    display: none;
    margin: 0;
    padding: 0;
}

.page-id-10 .entry-content {
    font-size: 18px;
    line-height: 1.75;
    color: #4a3b6a;
}

/* Primera línea de presentación con más peso visual */
.page-id-10 .entry-content > p:first-of-type {
    font-size: 20px;
    line-height: 1.6;
    color: #3b2a5a;
}

/* Imagen flotada en la home con texto envolvente */
.home-foto {
    float: left;
    width: 260px;
    height: 260px;
    object-fit: cover;
    margin: 8px 36px 24px 16px;
    shape-outside: circle(50%);
}

/* Clearfix sin overflow:hidden para no cortar el glow */
.page-id-10 .entry-content::after {
    content: "";
    display: table;
    clear: both;
}

@media (max-width: 600px) {
    .home-foto {
        float: none;
        display: block;
        margin: 0 auto 24px;
    }
}

.site-credit {
    display: none;
}

.site-info::after {
    content: "© 2026 Galia Glocer · Todos los derechos reservados";
    display: block;
    text-align: center;
    font-size: 14px;
    color: #6b5a8f;
}

/* Menú desktop: tamaño y posición */
@media screen and (min-width: 783px) {
    .main-navigation {
        font-size: 82% !important;
    }

    .main-navigation a {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }
}

@media screen and (min-width: 980px) {
    /* Acercar nav al logo reduciendo el ancho del branding */
    .header-side .site-branding {
        width: 26% !important;
        padding-right: 30px !important;
    }

    .header-side .main-navigation {
        width: 74% !important;
        vertical-align: middle !important;
        padding-left: 20px !important;
    }

    /* Reducir espacio entre header y contenido + separador tipo cuaderno */
    .site-top {
        margin-bottom: 28px !important;
        position: relative;
    }

    .site-top::after {
        content: "";
        display: block;
        position: absolute;
        bottom: -14px;
        left: 0;
        right: 0;
        height: 9px;
        background:
            linear-gradient(to right, transparent, rgba(107, 63, 160, 0.45) 12%, rgba(107, 63, 160, 0.45) 88%, transparent) 0 0 / 100% 1px no-repeat,
            linear-gradient(to right, transparent, rgba(107, 63, 160, 0.2) 12%, rgba(107, 63, 160, 0.2) 88%, transparent) 0 8px / 100% 1px no-repeat;
    }
}

/* Ocultar buscador (sin funcionalidad en sitio estático) */
.search-form,
.main-navigation .search-form,
.main-navigation .search-submit {
    display: none !important;
}

/* Menú hamburger mobile */
@media (max-width: 1024px) {
    .drawer-toggle.drawer-hamburger {
        background-color: rgba(210, 180, 255, 0.9) !important;
        border-radius: 50% !important;
        padding: 12px !important;
        width: 44px !important;
        height: 44px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .drawer-toggle.drawer-hamburger .drawer-hamburger-icon,
    .drawer-toggle.drawer-hamburger .drawer-hamburger-icon::before,
    .drawer-toggle.drawer-hamburger .drawer-hamburger-icon::after {
        background-color: #3b1d6b !important;
    }

    .drawer-toggle.drawer-hamburger.drawer-open {
        background-color: rgba(230, 200, 255, 0.95) !important;
    }

    #page.site {
        padding: 24px 20px 24px 44px;
    }
}
