/*==================================================
  PAGE HEADER (HERO INTERNO)
  QPERTINO | Premium Dark
==================================================*/

.page-header{
    position:relative;
    min-height:500px;
    display:flex;
    align-items:center;
    background:var(--primary);
    overflow:hidden;
    padding:170px 0 95px;
}

.page-background{
    position:absolute;
    inset:0;
    z-index:0;
}

.page-background img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transform:scale(1.03);
    filter:brightness(.78) contrast(1.08) saturate(.9);
}

/*=====================================
OVERLAY
=====================================*/

.page-overlay{
    position:absolute;
    inset:0;
    z-index:1;

    background:
        linear-gradient(
            90deg,
            rgba(5,5,5,.92) 0%,
            rgba(10,10,10,.82) 38%,
            rgba(10,10,10,.60) 68%,
            rgba(10,10,10,.72) 100%
        );
}

.page-header .container{
    position:relative;
    z-index:2;
}

.page-header-content{
    max-width:760px;
}

/*=====================================
TAG
=====================================*/

.page-header-content .section-tag{

    display:inline-block;

    margin-bottom:24px;

    color:var(--gold);

    font-size:.82rem;

    font-weight:700;

    letter-spacing:5px;

    text-transform:uppercase;
}

/*=====================================
TITLE
=====================================*/

.page-header-content h1{

    font-family:"Cormorant Garamond",serif;

    font-size:clamp(3rem,5vw,4.8rem);

    font-weight:600;

    color:var(--heading);

    line-height:1.08;

    margin-bottom:22px;

    text-shadow:
        0 3px 15px rgba(0,0,0,.35);
}

/*=====================================
TEXT
=====================================*/

.page-header-content p{

    max-width:680px;

    margin-bottom:34px;

    color:var(--text);

    font-size:1.12rem;

    line-height:1.9;

    text-shadow:
        0 2px 8px rgba(0,0,0,.25);
}

/*=====================================
BREADCRUMB
=====================================*/

.breadcrumb{

    display:flex;

    align-items:center;

    gap:12px;

    font-size:.92rem;

    color:var(--text-muted);
}

.breadcrumb a{

    color:var(--text-light);

    transition:var(--transition);
}

.breadcrumb a:hover{

    color:var(--gold);
}

.breadcrumb .active{

    color:var(--gold);
}

/*=====================================
RESPONSIVE
=====================================*/

@media (max-width:992px){

    .page-header{

        min-height:440px;

        padding:150px 0 80px;
    }

}

@media (max-width:768px){

    .page-header{

        min-height:370px;

        padding:125px 0 60px;
    }

    .page-header-content{

        max-width:100%;
    }

    .page-header-content h1{

        line-height:1.12;
    }

    .page-header-content p{

        font-size:1rem;

        line-height:1.8;
    }

}
/* RESTAURAR IMÁGENES DE CABECERA CON SUPERPOSICIÓN OSCURA */
.page-header {
    background-color: transparent !important;
    position: relative;
    z-index: 1;
}

/* Capa de contraste para que la imagen se vea oscura/elegante y el texto destaque */
.page-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        180deg, 
        rgba(10, 10, 12, 0.75) 0%, 
        rgba(10, 10, 12, 0.95) 100%
    ) !important;
    z-index: -1;
}