/* ==========================================================
   EXPODOGs · IDENTIDAD CORPORATIVA 2026
   Responsive 100% · UTF-8 · 6 idiomas
   Sin top.php / left.php / right.php
   ========================================================== */
:root{
    --navy:#042a55;
    --navy2:#001f43;
    --blue:#0a4b88;
    --red:#d9060f;
    --gold:#f4b529;
    --text:#17202a;
    --muted:#68717a;
    --line:#d9dee3;
    --soft:#f6f8fa;
    --white:#fff;
}
*,:before,:after{box-sizing:border-box}
html,body{width:100%;max-width:100%;margin:0;padding:0;overflow-x:hidden}
html{-webkit-text-size-adjust:100%}
body{background:#f7f8fa;color:var(--text);font-family:Arial,Helvetica,sans-serif;font-size:14px;line-height:1.42}
img,video,iframe,object,embed,svg{max-width:100%;height:auto}
input,select,textarea,button{font:inherit}
a{color:inherit}
.exp-skip-link{position:absolute;left:-9999px}
.exp-skip-link:focus{left:8px;top:8px;z-index:99999;background:#fff;padding:8px}

/* ===== CABECERA · FIEL A LA REFERENCIA CORPORATIVA =====
   Referencia visual: 1536 x 479 px.
   Zona hero: aprox. 314 px.
   La curva inferior se pinta como una SEGUNDA CAPA del mismo fondo:
   así podemos conservar a la vez las siluetas y toda la curva sin
   deformar la imagen original.
   ========================================================== */
.exp-corporate-header{
    width:100%;
    background:var(--navy2);
}
.exp-hero{
    position:relative;
    width:100%;
    height:314px;
    min-height:314px;
    overflow:hidden;
    display:grid;
    grid-template-columns:34% minmax(0,1fr) 19%;
    grid-template-areas:"logo copy poster";
    align-items:center;
    gap:20px;
    padding:0 26px 38px 18px;
    background-color:#06365d;

    /*
     * CAPA 1: azul + siluetas.
     * No se usa cover ni 100% 100%.
     * La imagen conserva exactamente su proporción.
     */
    background-image:url("../img/fondo_cabecera_expodogs.png");
    background-repeat:no-repeat;
    background-size:100% auto;
    background-position:center 19%;
}

/*
 * CAPA 2: recupera íntegramente la curva roja/blanca del mismo archivo.
 * Es una banda independiente superpuesta en el pie del hero.
 * No se deforma: background-size sigue siendo 100% auto.
 */
.exp-hero:after{
    content:"";
    position:absolute;
    z-index:2;
    left:0;
    right:0;
    bottom:0;
    height:118px;
    pointer-events:none;
    /*
     * [CORP-BANDA-01]
     * Banda recortada directamente de la imagen original.
     * Se independiza del fondo de siluetas para que nunca desaparezca.
     */
    background-image:url("../img/banda_corporativa.png");
    background-repeat:no-repeat;
    background-size:100% 100%;
    background-position:center bottom;
}

/* Degradado mínimo: sólo mejora la lectura, sin ocultar las siluetas. */
.exp-hero:before{
    content:"";
    position:absolute;
    z-index:1;
    inset:0;
    pointer-events:none;
    background:linear-gradient(90deg,rgba(0,20,44,.02) 0%,rgba(0,20,44,.00) 58%,rgba(0,20,44,.08) 100%);
}

.exp-hero-logo,
.exp-hero-copy,
.exp-hero-poster{
    position:relative;
    z-index:3;
    min-width:0;
}

/* Logo: posición/tamaño equivalente al ejemplo. */
.exp-hero-logo{
    grid-area:logo;
    align-self:center;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    padding-bottom:35px;
}
.exp-hero-logo a{
    display:block;
    width:100%;
}
.exp-hero-logo img{
    display:block;
    width:min(100%,500px);
    max-width:500px;
    max-height:175px;
    margin:0;
    object-fit:contain;
    object-position:left center;
}

/* Bloque INFORMACIÓN centrado, como la referencia. */
.exp-hero-copy{
    grid-area:copy;
    align-self:center;
    justify-self:center;
    width:100%;
    max-width:630px;
    padding:0 6px 39px;
    text-align:center;
}
.exp-hero-kicker{
    display:inline-block;
    position:relative;
    margin:0 0 12px;
    padding:0 8px 8px;
    color:#fff;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(38px,4.15vw,64px);
    font-weight:700;
    line-height:.92;
    letter-spacing:-.025em;
    text-shadow:0 3px 7px rgba(0,0,0,.48);
}
.exp-hero-kicker:after{
    content:"";
    position:absolute;
    left:4%;
    right:4%;
    bottom:0;
    height:3px;
    background:linear-gradient(90deg,transparent,#e00a13 12%,#ff2530 50%,#e00a13 88%,transparent);
    box-shadow:0 0 8px rgba(255,20,25,.55);
}
.exp-hero-copy h1{
    margin:0 auto;
    max-width:100%;
    color:#f1d69e;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(20px,2.25vw,35px);
    font-weight:700;
    line-height:1.02;
    letter-spacing:.005em;
    text-transform:uppercase;
    text-shadow:0 2px 4px rgba(0,0,0,.48);
}
.exp-hero-subtitle{
    min-height:21px;
    margin:5px auto 0;
    color:#f1d69e;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(13px,1.18vw,19px);
    font-weight:700;
    line-height:1.1;
    letter-spacing:.11em;
    text-transform:uppercase;
    text-shadow:0 2px 4px rgba(0,0,0,.40);
}

/* Cartel dinámico: misma escala, inclinación y caída visual. */
.exp-hero-poster{
    grid-area:poster;
    align-self:start;
    justify-self:center;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding-top:8px;
    padding-bottom:0;
}
.exp-hero-poster a{
    display:block;
    transform:rotate(2.15deg);
    transform-origin:50% 12%;
}
.exp-hero-poster img{
    display:block;
    width:min(100%,240px);
    max-width:240px;
    height:282px;
    max-height:282px;
    object-fit:contain;
    border:2px solid rgba(245,219,161,.80);
    background:#fff;
    box-shadow:0 10px 20px rgba(0,0,0,.44);
    transition:opacity .22s ease,transform .22s ease;
}
.exp-hero-poster img.changing{
    opacity:.12;
    transform:scale(.985);
}

/* ===== IDIOMAS ===== */
.exp-language-bar{
    width:100%;
    background:linear-gradient(180deg,#083c70,#022753);
    border-bottom:1px solid rgba(255,255,255,.72);
}
.exp-language-inner{
    width:calc(100% - 80px);
    max-width:none;
    min-height:52px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:42px;
}
.exp-language-inner a{
    position:relative;
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:52px;
    color:#fff;
    text-decoration:none;
    font-size:14px;
    font-weight:700;
}
.exp-language-inner a:after{
    content:"";
    position:absolute;
    left:0;right:0;bottom:0;
    height:3px;
    background:transparent;
}
.exp-language-inner a.active{color:#ffd24a}
.exp-language-inner a.active:after{background:var(--red)}
.exp-language-flag{
    display:block;
    flex:0 0 auto;
    width:30px;
    height:20px;
    object-fit:cover;
    border-radius:1px;
    box-shadow:0 0 0 1px rgba(255,255,255,.22),0 1px 3px rgba(0,0,0,.28);
}

/* ===== USUARIO ===== */
.exp-user-bar{
    width:100%;
    background:linear-gradient(180deg,#062f5d,#03264f);
    border-bottom:1px solid rgba(255,255,255,.70);
}
.exp-user-inner{
    width:calc(100% - 80px);
    max-width:none;
    min-height:56px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}
.exp-user-identity{
    min-width:0;
    display:flex;
    align-items:center;
    gap:7px;
    color:#fff;
}
.exp-user-icon{font-size:13px;color:#fff}
.exp-user-identity small{
    color:#fff;
    font-size:13px;
    font-weight:700;
}
.exp-user-identity strong{
    min-width:0;
    overflow:hidden;
    color:#ffd24a;
    font-size:13px;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.exp-user-logout{
    flex:0 0 auto;
    color:#ffd24a;
    text-decoration:none;
    font-size:13px;
    font-weight:800;
}

/* ===== NAV ===== */
.exp-nav-shell{width:100%;background:linear-gradient(180deg,#073866,#00234a)}
.exp-menu{
    width:calc(100% - 80px);
    max-width:none;
    min-height:58px;
    margin:0 auto;
    display:flex;
    align-items:stretch;
    justify-content:space-between;
    gap:8px;
}
.exp-menu a{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-width:0;
    padding:0 12px;
    color:#fff;
    text-decoration:none;
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
}
.exp-menu a:hover{background:rgba(255,255,255,.05)}
.exp-menu a.active:after{
    content:"";
    position:absolute;
    left:8px;right:8px;bottom:0;
    height:4px;
    background:var(--red);
}
.exp-nav-icon{font-size:18px}
.exp-menu-toggle{display:none}

/* ===== HOME ===== */
.exp-main{width:100%;min-width:0}
.corp-home{
    width:min(1470px,calc(100% - 64px));
    margin:24px auto 42px;
    display:grid;
    grid-template-columns:minmax(250px,315px) minmax(500px,1fr) minmax(280px,390px);
    gap:18px;
    align-items:start;
}
.corp-column{min-width:0}
.corp-card{
    min-width:0;
    margin:0 0 16px;
    padding:18px 20px;
    border:1px solid #dde1e5;
    border-radius:12px;
    background:#fff;
    box-shadow:0 2px 7px rgba(0,0,0,.035);
}
.corp-title{
    margin:0 0 13px;
    color:#092f5f;
    font-size:20px;
    line-height:1.1;
    font-weight:800;
}
.corp-register{text-align:center}
.corp-register p{margin:0 0 14px;font-size:14px}
.corp-register-icon{margin:5px auto 16px;color:#0b3e76;font-size:52px;line-height:1}
.corp-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:38px;
    padding:7px 20px;
    border:0;
    border-radius:5px;
    background:linear-gradient(180deg,#0d437c,#022d62);
    color:#fff!important;
    text-decoration:none!important;
    font-size:13px;
    font-weight:800;
    cursor:pointer;
}
.corp-btn.red{background:linear-gradient(180deg,#e00912,#c30008)}
.corp-btn.outline{background:#fff;color:#0a3f7c!important;border:1px solid #0a3f7c}
.corp-btn.wide{width:100%}
.corp-login label{display:block;margin-bottom:9px}
.corp-login input{
    width:100%!important;
    min-height:38px!important;
    margin:0!important;
    padding:8px 11px!important;
    border:1px solid #ccd3d9!important;
    border-radius:5px!important;
    background:#fff!important;
    font-size:13px!important;
}
.corp-login .forgot{display:block;margin-top:9px;color:#064ea2;text-align:center;text-decoration:none;font-size:12px}
.corp-error{margin-bottom:8px;padding:7px 9px;border-radius:5px;background:#fff0ef;color:#a92520;font-size:12px}

/* Exposiciones */
.corp-shows{padding:18px 22px}
.corp-tabs{
    display:flex;
    align-items:flex-end;
    gap:8px;
    margin:0 0 8px;
    border-bottom:1px solid #cdd5db;
}
.corp-tab{
    min-height:38px;
    display:flex;
    align-items:center;
    padding:7px 24px;
    border-radius:7px 7px 0 0;
    background:#edf3f7;
    color:#0a376a;
    font-size:12px;
    font-weight:800;
}
.corp-tab.active{background:linear-gradient(180deg,#0b477f,#033063);color:#fff}
.corp-show-row{
    display:grid;
    grid-template-columns:78px minmax(0,1fr) 130px;
    gap:16px;
    align-items:center;
    padding:13px 0;
    border-bottom:1px solid #e2e5e8;
}
.corp-show-row:last-of-type{border-bottom:0}
.corp-show-poster{
    width:78px;height:78px;
    overflow:hidden;
    border-radius:4px;
    background:#edf1f4;
}
.corp-show-poster img{width:100%;height:100%;object-fit:cover}
.corp-show-info{min-width:0}
.corp-show-info h3{
    margin:0 0 6px;
    color:#0f151b;
    font-size:14px;
    line-height:1.25;
    font-weight:800;
}
.corp-show-meta{display:grid;gap:3px;color:#555f67;font-size:12px}
.corp-show-meta span:before{display:inline-block;width:18px;color:#9aa3aa}
.corp-show-date:before{content:"▣"}
.corp-show-place:before{content:"⌖"}
.corp-show-action{text-align:right}
.corp-shows-footer{text-align:center;padding-top:13px}
.corp-empty{padding:24px;text-align:center;color:#7a838a}

/* News */
.corp-news-list{margin:0;padding:0;list-style:none}
.corp-news-list li{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:12px;
    padding:13px 0;
    border-bottom:1px solid #e1e4e7;
}
.corp-news-list a{color:#171b20;text-decoration:none;font-size:13px}
.corp-news-list time{color:#d10a12;font-size:11px;font-weight:700;white-space:nowrap}
.corp-news-more{display:inline-block;margin-top:14px;color:#064ea2;text-decoration:none;font-size:12px}
.corp-source{
    display:flex;
    align-items:center;
    gap:18px;
    min-height:90px;
}
.corp-source-mark{
    width:62px;height:62px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:3px solid #f2c324;
    border-radius:50%;
    color:#0c3f76;
    font-size:22px;
    font-weight:900;
}
.corp-source strong{font-size:15px}


/* Legislación y calendarios */
.corp-resource-card{padding-bottom:12px}
.corp-resource-list{
    margin:0;
    padding:0;
    list-style:none;
}
.corp-resource-list li{
    border-bottom:1px solid #e1e5e8;
}
.corp-resource-list li:last-child{border-bottom:0}
.corp-resource-list a{
    display:grid;
    grid-template-columns:36px minmax(0,1fr) auto;
    gap:10px;
    align-items:center;
    min-height:52px;
    padding:9px 0;
    color:#17202a;
    text-decoration:none;
}
.corp-resource-list a:hover .corp-resource-copy strong{color:#064e97}
.corp-country-code{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:24px;
    border-radius:4px;
    background:#073d72;
    color:#fff;
    font-size:10px;
    font-weight:800;
    letter-spacing:.05em;
}
.corp-resource-copy{
    min-width:0;
    display:block;
}
.corp-resource-copy strong{
    display:block;
    color:#17202a;
    font-size:12px;
    line-height:1.25;
}
.corp-resource-copy small{
    display:block;
    margin-top:2px;
    color:#6b747c;
    font-size:10px;
    line-height:1.25;
}
.corp-resource-arrow{
    color:#0a4b88;
    font-size:16px;
    font-weight:700;
}

/* Tablet */
@media(max-width:1100px){
    .exp-hero{
        height:286px;
        min-height:286px;
        grid-template-columns:35% minmax(0,1fr) 18%;
        gap:12px;
        padding:0 18px 34px 15px;
        background-size:auto 610px;
        background-position:42% 18%;
    }
    .exp-hero:after{
        height:105px;
        background-image:url("../img/banda_corporativa.png");
        background-size:100% 100%;
        background-position:center bottom;
    }
    .exp-hero-logo{padding-bottom:32px}
    .exp-hero-logo img{max-width:390px;max-height:145px}
    .exp-hero-copy{padding-bottom:35px}
    .exp-hero-poster img{width:190px;height:240px;max-height:240px}
    .exp-language-inner,.exp-user-inner,.exp-menu{width:calc(100% - 32px)}
    .corp-home{
        width:calc(100% - 28px);
        grid-template-columns:280px minmax(0,1fr);
    }
    .corp-right{grid-column:1/-1;display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
}

/* Mobile */
@media(max-width:760px){
    .exp-hero{
        height:248px;
        min-height:248px;
        grid-template-columns:minmax(0,1fr) 92px;
        grid-template-areas:
          "logo poster"
          "copy copy";
        align-items:start;
        gap:2px 8px;
        padding:10px 10px 31px;
        background-size:auto 520px;
        background-position:36% 16%;
    }
    .exp-hero:after{
        height:78px;
        background-image:url("../img/banda_corporativa.png");
        background-size:100% 100%;
        background-position:center bottom;
    }
    .exp-hero-logo{
        grid-area:logo;
        align-self:start;
        padding:7px 0 0;
    }
    .exp-hero-logo img{
        width:min(78vw,330px);
        max-height:96px;
        object-position:left top;
    }
    .exp-hero-copy{
        grid-area:copy;
        align-self:start;
        padding:0 4px 28px;
    }
    .exp-hero-kicker{
        margin-bottom:6px;
        padding-bottom:5px;
        font-size:27px;
    }
    .exp-hero-copy h1{font-size:17px}
    .exp-hero-subtitle{font-size:10px}
    .exp-hero-poster{
        grid-area:poster;
        align-self:start;
        padding-top:0;
    }
    .exp-hero-poster img{
        width:84px;
        height:118px;
        max-height:118px;
    }
    .exp-language-inner{
        width:100%;
        min-height:48px;
        justify-content:space-around;
        gap:0;
        padding:0 5px;
    }
    .exp-language-inner a{min-height:48px;gap:4px;font-size:11px}
    .exp-language-flag{width:26px;height:17px}
    .exp-user-inner{
        width:100%;
        min-height:54px;
        padding:7px 10px;
    }
    .exp-user-identity{display:grid;grid-template-columns:auto 1fr;gap:1px 6px}
    .exp-user-icon{grid-row:1/3}
    .exp-user-identity small{font-size:10px}
    .exp-user-identity strong{font-size:11px}
    .exp-user-logout{font-size:10px}
    .exp-nav-shell{padding:6px}
    .exp-menu-toggle{
        display:flex;
        width:100%;
        min-height:44px;
        align-items:center;
        justify-content:center;
        border:1px solid rgba(255,255,255,.24);
        border-radius:5px;
        background:#063460;
        color:#fff;
        font-weight:800;
    }
    .exp-menu{display:none;width:100%;min-height:0;padding-top:5px}
    .exp-menu.open{display:grid;grid-template-columns:1fr 1fr}
    .exp-menu a{min-height:43px;padding:7px;font-size:11px;white-space:normal;text-align:center}
    .corp-home{
        width:100%;
        margin:10px 0 24px;
        padding:0 7px;
        display:flex;
        flex-direction:column;
        gap:0;
    }
    .corp-column{width:100%}
    .corp-right{display:block}
    .corp-card{padding:15px;margin-bottom:9px;border-radius:9px}
    .corp-title{font-size:17px}
    .corp-show-row{
        grid-template-columns:62px minmax(0,1fr);
        gap:10px;
        padding:11px 0;
    }
    .corp-show-poster{width:62px;height:70px}
    .corp-show-action{grid-column:1/-1;text-align:left}
    .corp-show-action .corp-btn{width:100%}
    .corp-tabs{overflow-x:auto}
    .corp-tab{flex:0 0 auto;padding:7px 13px;font-size:10px}
}
@media(max-width:390px){
    .exp-hero{grid-template-columns:minmax(0,1fr) 78px}
    .exp-hero-poster img{width:72px;height:102px;max-height:102px}
    .exp-language-inner a{font-size:10px}
    .exp-language-flag{width:24px;height:16px}
}