/* ARREGLA CASA · HEADER */

:root {
    --ac-header-height: 76px;
    --ac-white: #f7f7f4;
    --ac-dark: #11110f;
    --ac-line: rgba(255,255,255,.22);
}

.ac-header {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 1000;
    width: 100%;
    height: var(--ac-header-height);
    padding: 0 clamp(20px,4vw,64px);
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    color: var(--ac-white);
    background: linear-gradient(to bottom,rgba(10,10,9,.28),rgba(10,10,9,.03));
    border-bottom: 1px solid transparent;
    transition: .35s ease;
}

.ac-header.is-scrolled {
    height: 64px;
    background: rgba(17,17,15,.56);
    border-bottom-color: rgba(255,255,255,.11);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.ac-header__brand {
    justify-self: start;
    display: inline-flex;
    align-items: center;
}

.ac-header__brand img {
    width: 58px;
    height: 42px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.ac-header__claim {
    display: flex;
    align-items: center;
    gap: 14px;
    font: 400 10px/1 Arial,Helvetica,sans-serif;
    letter-spacing: .22em;
    white-space: nowrap;
}

.ac-header__claim i {
    width: 34px;
    height: 1px;
    background: var(--ac-line);
}

.ac-menu-button {
    justify-self: end;
    display: inline-flex;
    align-items: center;
    gap: 14px;
    padding: 10px 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.ac-menu-button__text {
    font-size: 10px;
    letter-spacing: .22em;
}

.ac-menu-button__icon {
    position: relative;
    width: 28px;
    height: 12px;
}

.ac-menu-button__icon i {
    position: absolute;
    right: 0;
    width: 28px;
    height: 1px;
    background: currentColor;
    transition: width .25s ease;
}

.ac-menu-button__icon i:first-child { top: 2px; }
.ac-menu-button__icon i:last-child { bottom: 2px; width: 18px; }
.ac-menu-button:hover .ac-menu-button__icon i:last-child { width: 28px; }

.ac-menu {
    position: fixed;
    inset: 0;
    z-index: 1200;
    visibility: hidden;
    pointer-events: none;
}

.ac-menu.is-open {
    visibility: visible;
    pointer-events: auto;
}

.ac-menu__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.36);
    opacity: 0;
    transition: opacity .35s ease;
}

.ac-menu.is-open .ac-menu__backdrop { opacity: 1; }

.ac-menu__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: min(520px,92vw);
    height: 100%;
    padding: 28px clamp(28px,5vw,58px) 34px;
    display: flex;
    flex-direction: column;
    background: rgba(247,247,244,.97);
    color: var(--ac-dark);
    transform: translateX(100%);
    transition: transform .42s cubic-bezier(.76,0,.24,1);
    box-shadow: -30px 0 80px rgba(0,0,0,.08);
}

.ac-menu.is-open .ac-menu__panel { transform: translateX(0); }

.ac-menu__top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(17,17,15,.12);
    font-size: 10px;
    letter-spacing: .22em;
}

.ac-menu__close {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    border: 0;
    background: none;
    color: inherit;
    font-size: 10px;
    letter-spacing: .18em;
    cursor: pointer;
}

.ac-menu__close i {
    font-style: normal;
    font-size: 23px;
    font-weight: 200;
}

.ac-menu__nav {
    display: flex;
    flex-direction: column;
    margin-top: clamp(34px,7vh,78px);
}

.ac-menu__nav a {
    display: grid;
    grid-template-columns: 44px 1fr;
    align-items: baseline;
    gap: 10px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(17,17,15,.10);
    color: inherit;
    text-decoration: none;
}

.ac-menu__nav a span {
    font-size: 9px;
    letter-spacing: .12em;
    opacity: .42;
}

.ac-menu__nav a strong {
    font-size: clamp(23px,3vw,34px);
    font-weight: 300;
    letter-spacing: -.025em;
    transition: transform .25s ease;
}

.ac-menu__nav a:hover strong { transform: translateX(8px); }

.ac-menu__bottom {
    margin-top: auto;
    display: flex;
    justify-content: space-between;
    gap: 30px;
    align-items: end;
    padding-top: 24px;
    border-top: 1px solid rgba(17,17,15,.12);
}

.ac-menu__bottom p {
    max-width: 250px;
    margin: 0;
    font-size: 12px;
    line-height: 1.55;
    opacity: .62;
}

.ac-menu__bottom a {
    color: inherit;
    text-decoration: none;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .16em;
    white-space: nowrap;
}

body.ac-menu-open { overflow: hidden; }

@media (max-width: 760px) {
    .ac-header {
        height: 66px;
        grid-template-columns: 1fr 1fr;
        padding-inline: 18px;
    }

    .ac-header__claim { display: none; }
    .ac-header__brand img { width: 50px; height: 36px; }
    .ac-menu__panel { width: 100%; }

    .ac-menu__bottom {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Panel cristal: sustituye el antiguo panel opaco */
.ac-menu__backdrop { background:rgba(5,5,5,.42); backdrop-filter:blur(3px); }
.ac-menu__panel { background:rgba(20,20,19,.84); color:#f7f4ef; border-left:1px solid rgba(255,255,255,.19); backdrop-filter:blur(26px); -webkit-backdrop-filter:blur(26px); box-shadow:-25px 0 65px rgba(0,0,0,.18); overflow-y:auto; overscroll-behavior:contain; }
.ac-menu__top,.ac-menu__nav a,.ac-menu__bottom { border-color:rgba(255,255,255,.18); }
.ac-menu__nav a span { opacity:.55; }
.ac-menu__nav a strong { font-weight:300; }
.ac-menu__bottom p { opacity:.7; }
.ac-menu__close:focus-visible,.ac-menu__nav a:focus-visible,.ac-menu-button:focus-visible { outline:2px solid #fff; outline-offset:5px; }
@media(max-width:760px) { .ac-menu__panel { width:min(100%,430px); padding:22px 25px 28px; } .ac-menu__nav { margin-top:25px; } .ac-menu__nav a { padding:13px 0; } .ac-menu__nav a strong { font-size:clamp(23px,6vw,30px); } .ac-menu__bottom { margin-top:35px; } }
@media(max-height:600px) { .ac-menu__nav { margin-top:18px; } .ac-menu__nav a { padding:10px 0; } .ac-menu__bottom { margin-top:24px; } }