.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    width: 100%;
    background: var(--color-header-bg);
    backdrop-filter: blur(var(--space-12));
    border-bottom: 1px solid var(--color-border);
}

body.jeaz-header-static .site-header {
    position: relative;
}

body.jeaz-header-transparent .site-header {
    position: absolute;
    inset: 0 0 auto;
    background: transparent;
    border-bottom: 0;
    backdrop-filter: none;
}

body.jeaz-header-transparent .site-header,
body.jeaz-header-transparent .site-header a,
body.jeaz-header-transparent .site-brand {
    color: var(--color-heading);
}


.site-header__inner {
    min-height: var(--space-72);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16);
}

.site-brand {
    font-weight: 900;
    font-size: var(--font-size-body-lg);
    color: var(--color-neutral-900);
    justify-content: center;
    align-items: center;
    display: flex;
}

.site-brand img {
    max-height: var(--space-56);
    width: auto
}

.site-nav ul,
.lb-shortcode-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-nav > ul,
.site-menu {
    display: flex;
    align-items: center;
    gap: var(--space-24);
}

.site-nav a {
    font-weight: 700;
    color: var(--color-text)
}

body.jeaz-header-transparent .site-nav a {
    color: var(--color-heading);
}


.menu-toggle {
    display: none;
    border: 0;
    background: var(--color-surface-elevated);
    border-radius: var(--radius-8);
    padding: var(--space-4) var(--space-8);
    font-size: var(--font-size-h1)
}

.site-main {
    min-height: 70vh;
}

.hero {
    padding: var(--space-8) 0
}

.hero__inner {
    display: grid;
    gap: var(--space-32)
}

.hero__media img {
    border-radius: var(--radius-16);
    box-shadow: var(--shadow-sm);
    width: 100%;
    max-height: calc(var(--space-72) * 7.2);
    object-fit: cover
}

.hero--center {
    text-align: center
}

.archive-description {
    margin-top: calc(var(--space-32) * -1);
    margin-bottom: var(--space-32);
    color: var(--color-text-muted)
}

.entry-meta-box {
    display: flex;
    gap: var(--space-16);
    flex-wrap: wrap;
    margin-bottom: var(--space-32);
    color: var(--color-text-muted);
    font-size: var(--font-size-body-sm)
}

.entry-content {
    max-width: var(--container)
}

.entry-content a {
    color: var(--color-primary-600)
}

.section-header {
    margin-bottom: var(--space-32)
}

.related-posts {
    padding: var(--space-section) 0
}

.pagination-wrap {
    padding: var(--space-32) 0 var(--space-64)
}

.site-footer {
    margin-top: var(--space-section);
    padding: var(--space-32) 0;
    background: var(--color-footer-bg);
    color: var(--color-footer-text)
    
}

.site-footer__inner {
    display: flex;
    justify-content: space-between;
    gap: var(--space-16);
    flex-wrap: wrap
}

.site-footer ul {
    display: flex;
    gap: var(--space-16);
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
}

@media (max-width: 48rem) {

    .site-footer__inner {
        display: grid
    }
}
.hero__eyebrow {
    margin: 0;
    color: var(--color-primary-600);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: var(--font-size-caption);
}

.hero__title {
    margin: 0;
}

.hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-12) var(--space-16);
    color: var(--color-text-muted);
    font-size: var(--font-size-body-sm);
}

.hero__excerpt {
    max-width: calc(var(--space-72) * 10.5);
    color: var(--color-text-muted);
    font-size: var(--font-size-body-lg);
}

.hero__excerpt p {
    margin: 0;
}

/* =========================
   Search Form
========================= */
.search-form,
.search-page__form {
    display: flex;
    align-items: center;
    gap: var(--space-12);
    width: 100%;
    padding: var(--space-8);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-12);
    background: var(--color-glass-surface);
    backdrop-filter: blur(12px);
    box-shadow: var(--shadow-sm);
}

.search-form input[type="search"],
.search-page__form input[type="search"] {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    padding: var(--space-12) var(--space-16);
    font-family: var(--font-body);
    font-size: var(--font-size-body);
    color: var(--color-heading);
}

.search-form input[type="search"]::placeholder,
.search-page__form input[type="search"]::placeholder {
    color: var(--color-neutral-400);
}

.search-form button,
.search-page__form button {
    appearance: none;
    border: 0;
    border-radius: var(--radius-8);
    background: var(--color-primary-500);
    color: var(--color-on-primary);
    padding: var(--space-12) var(--space-16);
    font-family: var(--font-body);
    font-size: var(--font-size-body-sm);
    font-weight: 700;
    cursor: pointer;
    transition:
        background .2s ease,
        transform .2s ease;
}

.search-form button:hover,
.search-page__form button:hover,
.search-form button:focus-visible,
.search-page__form button:focus-visible {
    background: var(--color-primary-700);
    transform: translateY(-1px);
}

.search-page__header {
    max-width: calc(var(--space-72) * 11.4);
    margin-inline: auto;
    text-align: center;
}

.search-page__header .search-page__form {
    margin-top: var(--space-24);
}

@media (max-width: 48rem) {

    .search-form,
    .search-page__form {
        flex-direction: column;
        align-items: stretch;
    }

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


/* =========================
   Navigation Dropdowns
========================= */
.site-nav,
.site-menu,
.lb-shortcode-menu,
.site-menu .menu-item,
.lb-shortcode-menu .menu-item {
    position: relative;
}

.site-menu .menu-item-has-children > a,
.lb-shortcode-menu .menu-item-has-children > a {
    display: inline-flex;
    align-items: center;
    gap: var(--space-8);
}

.site-menu .menu-item-has-children > a::after,
.lb-shortcode-menu .menu-item-has-children > a::after {
    content: "";
    inline-size: 0.45em;
    block-size: 0.45em;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-15%) rotate(45deg);
    opacity: .75;
}

.site-menu .sub-menu,
.lb-shortcode-menu .sub-menu {
    position: absolute;
    top: calc(100% + var(--space-12));
    left: 0;
    z-index: 80;
    display: grid;
    gap: 0;
    min-width: 220px;
    max-width: min(320px, calc(100vw - (var(--space-24) * 2)));
    padding: var(--space-8);
    margin: 0;
    list-style: none;
    background: var(--color-header-bg-strong);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-12);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .14);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(var(--space-8));
    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease;
}

/* Bridge invisible para que no se cierre al mover el mouse hacia el dropdown */
.site-menu > .menu-item-has-children::after,
.lb-shortcode-menu > .menu-item-has-children::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: var(--space-16);
}

.site-menu .menu-item:hover > .sub-menu,
.site-menu .menu-item:focus-within > .sub-menu,
.site-menu .menu-item.is-submenu-open > .sub-menu,
.lb-shortcode-menu .menu-item:hover > .sub-menu,
.lb-shortcode-menu .menu-item:focus-within > .sub-menu,
.lb-shortcode-menu .menu-item.is-submenu-open > .sub-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.site-menu .sub-menu .sub-menu,
.lb-shortcode-menu .sub-menu .sub-menu {
    top: calc(var(--space-8) * -1);
    left: calc(100% + var(--space-12));
}

.site-menu .menu-item.is-submenu-flipped > .sub-menu,
.lb-shortcode-menu .menu-item.is-submenu-flipped > .sub-menu {
    left: auto;
    right: 0;
}

.site-menu .sub-menu .menu-item.is-submenu-flipped > .sub-menu,
.lb-shortcode-menu .sub-menu .menu-item.is-submenu-flipped > .sub-menu {
    left: auto;
    right: calc(100% + var(--space-12));
}

.site-menu .sub-menu a,
.lb-shortcode-menu .sub-menu a {
    display: flex;
    justify-content: space-between;
    gap: var(--space-16);
    width: 100%;
    padding: var(--space-12) var(--space-16);
    border-radius: var(--radius-8);
    color: var(--color-text);
    white-space: nowrap;
}

.site-menu .sub-menu a:hover,
.site-menu .sub-menu a:focus-visible,
.lb-shortcode-menu .sub-menu a:hover,
.lb-shortcode-menu .sub-menu a:focus-visible {
    color: var(--color-primary-700);
    background: var(--color-primary-50);
}

.submenu-toggle {
    display: none;
}

@media (max-width: 48rem) {
    .site-nav {
        max-height: calc(100vh - var(--space-96));
        overflow-y: auto;
    }

    .site-menu,
    .site-nav ul,
    .lb-shortcode-menu ul {
        display: grid;
        gap: var(--space-8);
    }

    .site-menu .menu-item-has-children,
    .lb-shortcode-menu .menu-item-has-children {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: var(--space-8);
    }

    .site-menu .menu-item-has-children > a::after,
    .lb-shortcode-menu .menu-item-has-children > a::after {
        display: none;
    }

    .submenu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        inline-size: var(--space-40);
        block-size: var(--space-40);
        border: 0;
        border-radius: var(--radius-8);
        background: var(--color-surface-elevated);
        color: var(--color-text);
        cursor: pointer;
        transition:
            background .18s ease,
            transform .18s ease;
    }

    .submenu-toggle::before {
        content: "";
        inline-size: .55em;
        block-size: .55em;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: translateY(-15%) rotate(45deg);
        transition: transform .18s ease;
    }

    .menu-item.is-submenu-open > .submenu-toggle::before {
        transform: translateY(15%) rotate(225deg);
    }

    .site-menu .sub-menu,
    .site-menu .sub-menu .sub-menu,
    .lb-shortcode-menu .sub-menu,
    .lb-shortcode-menu .sub-menu .sub-menu {
        position: static;
        grid-column: 1 / -1;
        display: grid;
        min-width: 0;
        max-width: none;
        width: 100%;
        padding: 0 0 0 var(--space-16);
        margin: 0;
        border: 0;
        border-left: 1px solid var(--color-neutral-100);
        border-radius: 0;
        box-shadow: none;
        background: transparent;
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
        max-height: 0;
        overflow: hidden;
        transition: max-height .24s ease;
    }

    .site-menu .menu-item.is-submenu-open > .sub-menu,
    .lb-shortcode-menu .menu-item.is-submenu-open > .sub-menu {
        max-height: 80vh;
    }

    .site-menu .sub-menu a,
    .lb-shortcode-menu .sub-menu a {
        white-space: normal;
        padding: var(--space-12);
    }
}





body.jeaz-menu-toggle-always .menu-toggle {
  display: inline-flex;
}

body[class*="jeaz-menu-toggle"] .site-nav.is-open {
  max-width: calc(100vw - (var(--space-16) * 2));
  width: 800px;

  display: block;
  position: absolute;

  right: var(--space-16);
  left: auto;

  top: var(--space-72);

  background: var(--color-surface-elevated);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-12);
  box-shadow: var(--shadow-sm);
  padding: var(--space-16);
  color: var(--color-text);
}

body[class*="jeaz-menu-toggle"] .site-nav.is-open ul {
  display: grid;
  gap: var(--space-8);
}

body[class*="jeaz-menu-toggle"] .site-nav.is-open .sub-menu {
  position: static;
  display: grid;
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  min-width: 0;
  max-width: none;
  width: 100%;
  max-height: 0;
  overflow: hidden;
  margin-top: 0;
  padding: 0 0 0 var(--space-16);
  background: transparent;
  border: 0;
  border-left: 1px solid var(--color-neutral-100);
  border-radius: 0;
  box-shadow: none;
  transition: max-height .24s ease, margin-top .24s ease, padding-top .24s ease, padding-bottom .24s ease;
}

body[class*="jeaz-menu-toggle"] .site-nav.is-open .menu-item.is-submenu-open > .sub-menu {
  max-height: 80vh;
  overflow: visible;
  margin-top: var(--space-8);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
}

.site-nav {
    display: flex;
}

.lb-shortcode-menu {
    display: flex;
}