/**
 * index2 — Tipografía + fondo papel.
 * Desktop y mobile: capa .hh-fixed-papel-bg (position:fixed). Evita background-attachment:fixed en body (Safari iOS).
 */

 html:has(body.hh-index2){
    background-color: #faf8f5;
}

body.hh-index2{
    --cb-text: #4a4a4a;
    --cb-heading: #16232a;
    --cb-muted: #8a8275;
    --cb-accent-gold: #d4a84b;
    --cb-link-hover: #c9a24d;
    --cb-font-title: "Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --hh-index2-bg-image: url("../images/oldpaper.png");
    position: relative;
    background-color: #faf8f5;
    background-image: none;
    color: var(--cb-text);
}

.hh-fixed-papel-bg{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    min-height: -webkit-fill-available;
    z-index: 0;
    pointer-events: none;
    background-color: #faf8f5;
    background-image: var(--hh-index2-bg-image);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
}

body.hh-index2 .hh-papel-scroll-parallax{
    background: transparent none !important;
    background-color: transparent !important;
    overflow: visible;
}

body.hh-index2 .hh-papel-scroll-parallax .about-style1-area,
body.hh-index2 .hh-papel-scroll-parallax .about-style1-area .container,
body.hh-index2 .hh-papel-scroll-parallax .about-style1-area .row,
body.hh-index2 .hh-papel-scroll-parallax .about-style1-text-box{
    background-color: transparent !important;
}

body.hh-index2 .courses-style1-area .layer-outer{
    display: none;
}

:where(body.hh-index2) a:not(.hh-footer a):not(.btn-one):not(.production-card__zoom):not(.video-popup):not(.mobile-menu a){
    color: #070606;
}
:where(body.hh-index2) a:not(.hh-footer a):not(.btn-one):not(.production-card__zoom):not(.video-popup):not(.mobile-menu a):hover{
    color: var(--cb-link-hover);
}

:where(body.hh-index2) h1,
:where(body.hh-index2) h2,
:where(body.hh-index2) h3,
:where(body.hh-index2) h4,
:where(body.hh-index2) h5,
:where(body.hh-index2) h6{
    color: var(--cb-heading);
    font-family: var(--cb-font-title);
}
body.hh-index2 h2{
    font-weight: 600 !important;
}

body.hh-index2 .clr-white,
body.hh-index2 .clr-white h2,
body.hh-index2 .clr-white h3{
    color: var(--cb-heading) !important;
}

body.hh-index2 .sec-title .big-title h2{
    color: var(--cb-heading);
    font-family: var(--cb-font-title);
}

body.hh-index2 .about-style1-area h2,
body.hh-index2 .about-style1-area .title h2 strong{
    color: var(--cb-heading);
}
body.hh-index2 .about-style1-area p,
body.hh-index2 .about-style1-text-box .inner-contant p{
    color: var(--cb-text);
}
body.hh-index2 .about-style1-text-box .inner-contant h3{
    color: var(--cb-muted);
}

/* About (#about-us): cuadrícula 2×2 sobre papel editorial */
body.hh-index2 .hh-about-quad{
    padding-top: clamp(2.75rem, 8vw, 5.75rem);
    padding-bottom: clamp(2rem, 5vw, 3.75rem);
}
body.hh-index2 .hh-about-quad__grid > [class*="col-"]{
    margin-bottom: 2rem;
}
body.hh-index2 .hh-about-quad__grid > [class*="col-"]:last-child{
    margin-bottom: 0;
}
@media (min-width: 992px){
    body.hh-index2 .hh-about-quad__grid > [class*="col-"]:nth-last-child(-n + 2){
        margin-bottom: 0;
    }
    body.hh-index2 .hh-about-quad__grid > [class*="col-"]:nth-child(1),
    body.hh-index2 .hh-about-quad__grid > [class*="col-"]:nth-child(2){
        margin-bottom: 2.75rem;
    }
    body.hh-index2 .hh-about-quad__grid > [class*="col-"]:nth-child(odd) .hh-about-tile{
        padding-right: clamp(0.85rem, 2.25vw, 1.85rem);
    }
    body.hh-index2 .hh-about-quad__grid > [class*="col-"]:nth-child(even) .hh-about-tile{
        padding-left: clamp(0.85rem, 2.25vw, 1.85rem);
    }
}
body.hh-index2 .hh-about-tile{
    margin: 0;
    padding: 0;
    height: 100%;
    text-align: left;
}
body.hh-index2 .hh-about-tile__title{
    font-family: var(--cb-font-title);
    font-size: clamp(1.4rem, 1.85vw, 1.25rem);
    font-weight: 700;
    line-height: 1.35;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--cb-heading);
    margin: 0;
}
@media (min-width: 992px){
    body.hh-index2 .hh-about-tile__title{
        font-size: clamp(1.2rem, 1.75vw, 1.5rem);
        line-height: 1.32;
    }
}
body.hh-index2 .hh-about-tile__rule{
    border: 0;
    border-top: 1px solid rgba(22, 35, 42, 0.75);
    margin: 14px 0 16px;
    opacity: 1;
}
body.hh-index2 .hh-about-tile__text{
    font-family: "Playfair Display", Georgia, "Times New Roman", serif;
    font-size: clamp(1.2rem, 1.05vw, 1.0625rem);
    line-height: 1.65;
    color: var(--cb-text);
    margin: 0;
    font-weight: 400;
}
body.hh-index2 .hh-about-quad__cta-row{
    margin-top: clamp(0.85rem, 2.25vw, 1.65rem);
    padding-bottom: clamp(1.5rem, 4vw, 2rem);
}

/* Imágenes 1–4.webp: misma grilla 2×2 que About — sustituí TITLE / texto en cada celda */
body.hh-index2 .hh-image-quad-area{
    padding-top: clamp(0.85rem, 3vw, 2rem);
    padding-bottom: clamp(2rem, 5vw, 3.5rem);
}
body.hh-index2 .hh-image-quad__grid > [class*="col-"]{
    margin-bottom: 2rem;
}
body.hh-index2 .hh-image-quad__grid > [class*="col-"]:last-child{
    margin-bottom: 0;
}
@media (min-width: 992px){
    body.hh-index2 .hh-image-quad__grid > [class*="col-"]:nth-last-child(-n + 2){
        margin-bottom: 0;
    }
    body.hh-index2 .hh-image-quad__grid > [class*="col-"]:nth-child(1),
    body.hh-index2 .hh-image-quad__grid > [class*="col-"]:nth-child(2){
        margin-bottom: 2.75rem;
    }
    body.hh-index2 .hh-image-quad__grid > [class*="col-"]:nth-child(odd) .hh-media-tile{
        padding-right: clamp(0.85rem, 2.25vw, 1.85rem);
    }
    body.hh-index2 .hh-image-quad__grid > [class*="col-"]:nth-child(even) .hh-media-tile{
        padding-left: clamp(0.85rem, 2.25vw, 1.85rem);
    }
    /* Desktop: imágenes ~15% más chicas (85% del ancho de la celda) */
    body.hh-index2 .hh-image-quad-area .hh-media-tile__figure{
        width: 85%;
        max-width: 85%;
        margin-left: 0;
        margin-right: auto;
    }
}
body.hh-index2 .hh-media-tile{
    margin: 0;
    text-align: left;
    height: 100%;
    display: flex;
    flex-direction: column;
}
body.hh-index2 .hh-media-tile__figure{
    margin: 0 0 1rem;
    padding: 0;
    overflow: hidden;
    border-radius: 4px;
    background: rgba(22, 35, 42, 0.06);
    aspect-ratio: 4 / 3;
}
body.hh-index2 .hh-media-tile__figure img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}
body.hh-index2 .hh-media-tile__body{
    flex: 1 1 auto;
}
body.hh-index2 .hh-media-tile__title{
    font-family: var(--cb-font-title);
    font-size: clamp(1rem, 1.85vw, 1.25rem);
    font-weight: 700;
    line-height: 1.35;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: 0;
    color: var(--cb-heading);
}
@media (min-width: 992px){
    body.hh-index2 .hh-media-tile__title{
        font-size: clamp(1.15rem, 1.65vw, 1.4rem);
    }
}
body.hh-index2 .hh-media-tile__rule{
    border: 0;
    border-top: 1px solid rgba(22, 35, 42, 0.75);
    margin: 12px 0 14px;
    opacity: 1;
    width: 460px;
}
body.hh-index2 .hh-media-tile__text{
    font-family: "Playfair Display", Georgia, "Times New Roman", serif;
    font-size: clamp(0.95rem, 1.05vw, 1.0625rem);
    line-height: 1.62;
    color: var(--cb-text);
    margin: 0;
    font-weight: 400;
}
@media (min-width: 768px){
    body.hh-index2 .hh-image-quad-area .hh-media-tile__figure img{
        margin: 0 !important;
    }
}

body.hh-index2 .doc-brand-area .doc-brand-area__title .big-title h2,
body.hh-index2 .doc-pillar-card__title{
    color: var(--cb-heading) !important;
    font-family: var(--cb-font-title);
}
body.hh-index2 .doc-brand-intro,
body.hh-index2 .doc-pillar-card p,
body.hh-index2 .doc-brand-area > .container p{
    color: #000000 !important;
}
body.hh-index2 .doc-pillar-card__icon--fa{
    color: #212121;
}

body.hh-index2 .hh-deliverables__item{
    background: rgb(255 232 189 / 45%);
    border-color: rgb(193 155 80);
}

body.hh-index2 .hh-deliverables__title{
    color: var(--cb-heading);
    font-family: var(--cb-font-title);
}
body.hh-index2 .hh-deliverables__desc{
    color: var(--cb-muted);
}
body.hh-index2 .doc-pillar-card__mountain-peak{
    border-bottom-color: #212121;
}
body.hh-index2 .doc-pillar-card__mountain-flag{
    color: #212121;
}

body.hh-index2 .hh-global-presence__hero-title-line{
    color: var(--cb-heading) !important;
}
body.hh-index2 .hh-global-presence__hero-title-line--accent{
    color: var(--cb-muted);
}
body.hh-index2 .hh-global-presence__hero-sub{
    color: var(--cb-text);
}
body.hh-index2 .hh-global-presence__sub-rule-title{
    color: #b67703;
    font-size: 18px;
}
body.hh-index2 .hh-global-presence__dist-icon-wrap{
    color: var(--cb-heading);
}
body.hh-index2 .hh-global-presence__dist-label{
    color: var(--cb-text);
}
body.hh-index2 .hh-global-presence__footer-banner-light{
    color: var(--cb-heading);
}
body.hh-index2 .hh-global-presence__footer-banner-accent{
    color: #27252a;
}

/* International distribution: contraste sobre papel claro (style.css usa #f7f4ee / #f0ebe3 para tema oscuro) */
body.hh-index2 #international-distribution{
    position: relative;
    z-index: 2;
}
body.hh-index2 #international-distribution .hh-global-presence--distribution-only{
    position: relative;
    z-index: 1;
}
body.hh-index2 #international-distribution .hh-global-presence__hero-title-line{
    color: var(--cb-heading) !important;
}
body.hh-index2 #international-distribution .hh-global-presence__sub-rule-title{
    color: #b67703 !important;
}
body.hh-index2 #international-distribution .hh-global-presence__sub-rule-line{
    background: linear-gradient(90deg, rgba(182, 119, 3, 0.22), rgba(22, 35, 42, 0.32), rgba(182, 119, 3, 0.22));
}
body.hh-index2 #international-distribution .hh-global-presence__sub-rule-dot{
    background: #a66802;
    box-shadow: 0 0 8px rgba(182, 119, 3, 0.45);
}
body.hh-index2 #international-distribution .hh-global-presence__dist-icon-wrap{
    color: var(--cb-heading) !important;
}
body.hh-index2 #international-distribution .hh-global-presence__dist-label{
    color: var(--cb-text) !important;
    font-size: clamp(0.7rem, 2.8vw, 0.85rem);
}
body.hh-index2 #international-distribution .hh-global-presence__dist-item{
    border-right-color: rgba(22, 35, 42, 0.14);
}
@media (max-width: 767px){
    body.hh-index2 #international-distribution .hh-global-presence__dist-item{
        border-bottom-color: rgba(22, 35, 42, 0.1);
    }

body.hh-index2 .hh-media-tile__rule{
width:100%
}

.doc-brand-area__title.sec-title {padding-bottom:0}

.courses-style1-area {margin-top:-10% !important}
body.hh-index2 .hh-about-tile__title {font-size:18px}

}

body.hh-index2 .doc-content-hub__title-line--light{
    color: var(--cb-heading);
}
body.hh-index2 .doc-content-hub__title-line--accent{
    color: #b67703;
}
body.hh-index2 .doc-content-hub__tagline{
    color: var(--cb-muted);
}
body.hh-index2 .doc-content-hub__lede{
    color: var(--cb-text);
}
body.hh-index2 .doc-content-hub__accent{
    color: #b67703;
}
body.hh-index2 .doc-content-hub__callout{
    background: rgb(255 232 189 / 45%);
    border-color: none;
    border: 1px solid #b67703;
}
body.hh-index2 .doc-content-hub__callout-text{
    color: var(--cb-text);
}
.doc-content-hub__callout img{
    border-radius: 0;
}
body.hh-index2 .doc-content-hub__hub{
    background: radial-gradient(circle at 38% 32%, rgb(83 83 81 / 98%) 0%, #000000 72%);
    box-shadow:
        0 0 0 1px rgba(243, 185, 105, 0.45),
        0 10px 32px rgba(22, 35, 42, 0.12);
}
body.hh-index2 .doc-content-hub__hub-sub{
    color: var(--cb-accent-gold);
}
body.hh-index2 .doc-content-hub__node-name{
    color: var(--cb-heading);
    font-family: var(--cb-font-title);
}
body.hh-index2 .doc-content-hub__node-meta{
    color: #1a1309;
}
body.hh-index2 .doc-content-hub__footer-strip{
    background: rgb(255 232 189 / 45%);
    border-color: rgba(243, 185, 105, 0.35);
    border: 1px solid #b67703;
}
body.hh-index2 .doc-content-hub__footer-strip p{
    color: var(--cb-text);
}
body.hh-index2 .doc-content-hub__footer-star{
    color: var(--cb-accent-gold);
}

body.hh-index2 .team-area h3,
body.hh-index2 .team-area .clr-white h2,
body.hh-index2 .team-area .clr-white h3{
    color: var(--cb-heading) !important;
    font-family: var(--cb-font-title);
}

body.hh-index2 .counter-number .count-title{
    color: var(--cb-heading);
}
body.hh-index2 .counter-text p{
    color: #793009;
    font-weight: 600;
}
body.hh-index2 .counter-section p.count-title{
    color: var(--cb-heading);
}
body.hh-index2 .count-plus{
    color: var(--cb-heading);
}

body.hh-index2 .home-contact-area{
    background: transparent none !important;
}
body.hh-index2 .home-contact-area .sec-title .big-title h2{
    color: var(--cb-heading) !important;
    font-family: var(--cb-font-title);
}
body.hh-index2 .home-contact-area__intro{
    color: var(--cb-text) !important;
}
body.hh-index2 .home-contact-form__group label{
    color: var(--cb-heading);
}
body.hh-index2 .home-contact-form .form-control{
    background: #fdfcfa;
    border-color: rgba(22, 35, 42, 0.2);
    color: var(--cb-heading);
}
body.hh-index2 .home-contact-form .form-control::placeholder{
    color: var(--cb-muted);
}
body.hh-index2 .home-contact-form .form-control:focus{
    background: #fffefb;
    color: var(--cb-heading);
    border-color: var(--cb-accent-gold);
}

/* Created by (#created-by): títulos Montserrat (style.css usa Noto en eyebrow y Playfair en nombres) */
body.hh-index2 .created-by-area__eyebrow{
    font-family: var(--cb-font-title);
    color: var(--cb-heading);
}
body.hh-index2 .created-by-area__name{
    font-family: var(--cb-font-title);
}

body.hh-index2 .sticky-header{
    box-shadow: 0 8px 24px rgba(22, 35, 42, 0.08);
    /* Una sola capa sólida: evita parches claros/oscuros (gradiente negro en .hh-header-bar vs fondo crema aquí) */
    background: #fdfcfa !important;
    background-image: none !important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
/* Misma pintura que .sticky-header (style.css forzaba negro en la barra interior) */
body.hh-index2 .sticky-header .container-fluid.hh-header-bar{
    background: #000000 !important;
    background-image: none !important;
}
body.hh-index2 .sticky-header .outer-box{
    background: transparent !important;
}
/* Desktop: barra sobre hero/contenido sin fondo opaco */
@media (min-width: 992px){
    body.hh-index2 .sticky-header{
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
    }
    body.hh-index2 .sticky-header .container-fluid.hh-header-bar{
        background: transparent !important;
        background-image: none !important;
    }
    body.hh-index2 .main-header.header-style-one .sticky-header{
        box-shadow: none !important;
    }
    /* Legible también sobre fondos claros al hacer scroll */
    body.hh-index2 .main-header.header-style-one .sticky-header .main-menu .navigation > li > a{
        text-shadow:
            0 0 1px rgba(0, 0, 0, 0.9),
            0 1px 4px rgba(0, 0, 0, 0.55),
            0 0 18px rgba(0, 0, 0, 0.35);
    }
    body.hh-index2 .sticky-header .hh-header-brand .logo a img{
        filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.65)) drop-shadow(0 0 10px rgba(0, 0, 0, 0.4));
    }
    /* Contraste sobre barra transparente / hero (solo desktop; en móvil el menú horizontal va oculto) */
    body.hh-index2 .main-header.header-style-one .sticky-header .main-menu .navigation > li > a{
        color: #ffffff !important;
    }
    body.hh-index2 .main-header.header-style-one .sticky-header .main-menu .navigation > li > a:hover{
        color: var(--cb-link-hover) !important;
    }
}
body.hh-index2 .sticky-header .mobile-nav-toggler .icon-bar{
    background: #ffffff !important;
}

/* Desktop: al hacer scroll hacia abajo se oculta la barra (el JS no aplica en móvil por esta media query) */
@media (min-width: 992px){
    body.hh-header-hidden-scroll:not(.mobile-menu-visible) .main-header.header-style-one .sticky-header{
        transform: translate3d(0, -100%, 0) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

body.hh-index2 .mobile-menu .navigation li > a{
    color: #ffffff !important;
}
body.hh-index2 .mobile-menu .navigation li > a:hover{
    color: rgba(255, 255, 255, 0.88) !important;
}

body.hh-index2 .doc-pillar-card {
    position: relative;
    padding: 2rem 1.75rem 1.85rem;
    background: linear-gradient(155deg, #71592e2b 0%, rgb(14 13 13 / 10%) 100%);
    border: none;
    border-radius: 4px;
    transition: border-color 0.35s ease, transform 0.35s ease, box-shadow 0.35s ease;
    text-align: center;
}

body.hh-index2 .hh-global-presence__cell--marquee{
    background: rgb(255 232 189 / 45%);
    border: none;
    border-radius: 8px;
}

.hh-global-presence__block {/* margin-bottom:150px; */}

/* responsive.css pone .sticky-header { display:none } hasta 991px; el fix de header-style-one solo estaba en ≤767px */
@media (max-width: 991px){
body.hh-index2 .created-by-area__eyebrow {font-size: 28px;margin: 0 !important;}
    body.hh-index2 .main-header.header-style-one .sticky-header{
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        /* Barra fija estable al scroll (Safari iOS: transición en transform/opacity suele “temblar”) */
        transition: none !important;
        transform: translate3d(0, 0, 0) !important;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
    body.hh-index2 .main-header.header-style-one .sticky-header .container-fluid.hh-header-bar{
        padding-top: max(0.5rem, env(safe-area-inset-top, 0px));
        padding-bottom: 0.5rem;
    }
    /* Solo logo + hamburguesa: ocultar columnas de navegación desktop clonadas en sticky */
    body.hh-index2 .main-header.header-style-one .sticky-header .hh-header-nav-slot--left{
        display: none !important;
    }
    body.hh-index2 .main-header.header-style-one .sticky-header .hh-header-nav-slot--right .main-menu{
        display: none !important;
    }
}
