:root{
  --navy:#1C3A85;
  --navy-dark:#132a63;
  --gold:#FFBC28;
  --body:#727272;
  --muted:#70787E;
  --bg:#EDEEEF;
  --serif:'Raleway',sans-serif;
  --sans:'Manrope',sans-serif;
  --btn:'Montserrat',sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--body);font-family:var(--sans);font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased}
img,video{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
h1,h2,h3{font-family:var(--serif);color:var(--navy);margin:0;text-transform:uppercase;font-weight:800}
p{margin:0}
.eyebrow{font-family:var(--serif);font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--gold)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--navy);color:#fff;font-family:var(--btn);font-weight:700;font-size:14px;line-height:1;padding:15px 30px;border:1px solid var(--navy);border-radius:25px;transition:background .25s,transform .25s}
.btn:hover{background:var(--navy-dark);transform:translateY(-1px)}
.btn--lg{font-family:var(--serif);font-size:18px;padding:16px 34px}
.btn--gold{background:#fff;color:var(--navy);border-color:#fff}
.btn--gold:hover{background:var(--navy);color:#fff;border-color:#fff}
.btn--ghost{background:transparent;border-color:rgba(255,255,255,.7)}

/* HEADER */
.site-header{position:absolute;inset:0 0 auto 0;z-index:10;height:96px;display:flex;align-items:center}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%}
.logo{width:150px;flex:0 0 auto}
.logo img{width:100%;display:block}

.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav a{font-family:var(--serif);font-size:16px;color:#E4E4E4;padding:12px 14px;white-space:nowrap}
.nav a:hover,.nav a.is-active{color:#fff}
.nav a.is-active{font-weight:800;text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:8px}
.nav a:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:4px}
.site-header .btn{margin-left:12px;padding:13px 22px;font-size:13px;white-space:nowrap}
.burger{display:none;background:none;border:0;color:#fff;font-size:26px;cursor:pointer}

/* HERO */
.hero{position:relative;min-height:760px;display:flex;align-items:center;overflow:hidden;background:#0b1733}
.hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(9,17,38,.9) 0%,rgba(9,17,38,.74) 45%,rgba(9,17,38,.44) 100%)}
.hero .wrap{position:relative;z-index:2;width:100%;padding-top:160px;padding-bottom:90px}
.hero h1{color:#fff;font-size:60px;line-height:1.06;margin:18px 0 24px;max-width:940px}
.hero p{color:#EDEDED;font-size:17px;font-weight:300;max-width:740px;line-height:1.7}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero__note{display:inline-flex;align-items:center;gap:10px;margin-top:26px;color:#EADFC4;font-size:13px;font-family:var(--serif);font-weight:600;letter-spacing:.4px}
.hero__note span{width:34px;height:1px;background:var(--gold);display:inline-block}

/* 6 BLOQUES */
.process{background:#fff;padding:110px 0 90px}
.process__head{max-width:820px;margin:0 auto;text-align:center}
.process h2{font-size:44px;line-height:1.12;margin-top:14px}
.process__sub{font-family:var(--serif);font-size:18px;color:var(--muted);margin-top:18px}
.grid6{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:60px}
.grid6--five{grid-template-columns:repeat(3,1fr)}
.step{background:#fff;border:1px solid #E3E5E8;display:flex;flex-direction:column;transition:box-shadow .3s,transform .3s}
.step:hover{box-shadow:0 18px 45px rgba(15,30,65,.12);transform:translateY(-3px)}
.step__img{position:relative;overflow:hidden;aspect-ratio:4/3;background:#dfe2e6}
.step__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.step:hover .step__img img{transform:scale(1.05)}
.step__num{position:absolute;left:16px;top:16px;width:44px;height:44px;display:grid;place-items:center;background:var(--navy);color:#fff;font-family:var(--serif);font-weight:700;font-size:17px;z-index:1}
.step__body{padding:26px 24px 30px}
.step h3{font-size:20px;line-height:1.32;color:var(--navy)}

/* FEATURE */
.why{background:#fff;padding:20px 0 110px}
.why__wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:0;align-items:stretch;background:#F7F8F9}
.why__wrap--solo{grid-template-columns:1fr;background:#fff}
.why__text{padding:70px 64px}
.why__wrap--solo .why__text{padding:0}
.why h2{font-size:36px;line-height:1.16;max-width:620px}
.why__sub{font-family:var(--serif);font-size:17px;color:var(--muted);margin-top:16px;max-width:640px}
.why__list{list-style:none;margin:38px 0 0;padding:0;display:grid;gap:26px}
.why__wrap--solo .why__list{grid-template-columns:1fr 1fr;gap:32px 48px}
.why__list li{display:flex;align-items:flex-start;gap:18px}
.why__list img{width:52px;height:52px;flex:0 0 auto;object-fit:contain}
.why__list strong{display:block;font-family:var(--serif);font-size:18px;font-weight:700;color:var(--navy);line-height:1.4}
.why__list small{font-family:var(--serif);font-size:15px;color:var(--muted);line-height:1.55;display:block;margin-top:4px}
.why__photo{background-size:cover;background-position:center;background-repeat:no-repeat;min-height:100%}

/* FOOTER (réplica del original, fondo azul Riferez) */
.site-footer{background:var(--navy);color:#fff;padding:64px 0 56px}
.bottom_footer{width:100%}
.footer-box{display:flex;align-items:flex-start;font-size:19px;line-height:34px;gap:40px}
.footer-box-left{width:40%}
.footer-box-center{width:40%}
.footer-box-right{width:20%}
#address{font-style:normal;color:#fff;display:block;width:100%}
.rg-footer-legal__links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.rg-footer-social{list-style:none;margin:0 0 8px;padding:0}
.rg-footer-insta-icon{width:26px;height:26px;display:block}
.rg-footer-insta-link{display:inline-block;opacity:.9;transition:opacity .2s}
.rg-footer-insta-link:hover{opacity:1}
.rg-footer-legal__link{background:none;border:0;padding:0;margin:0;font:inherit;color:rgba(255,255,255,.82);text-align:left;cursor:pointer;transition:color .2s}
.rg-footer-legal__link:hover{color:#fff}
#mail{color:rgba(255,255,255,.82)}
#mail:hover{color:#fff}
.footer-box-right>div{color:rgba(255,255,255,.82)}

/* FOOTER: VISIBILIDAD GARANTIZADA
   Se elimina la dependencia de la animación para mostrar el contenido. */
#address,
.footer-box-center,
.footer-box-right {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

/* Estado animado: visible y en posición */
#address.animated,
.footer-box-center.animated,
.footer-box-right.animated {
    opacity: 1;
    transform: translateY(0);
}

/* Stagger escalonado (opcional, como riferez.com) */
.footer-box-center.animated { transition-delay: 0.15s; }
.footer-box-right.animated { transition-delay: 0.3s; }


/* MODAL CONTACTO */
.rg-contact-modal{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:24px}
.rg-contact-modal.is-open{display:flex}
.rg-contact-modal__backdrop{position:absolute;inset:0;background:rgba(9,17,38,.72)}
.rg-contact-modal__dialog{position:relative;background:#fff;color:var(--body);width:min(640px,100%);max-height:90vh;overflow:auto;padding:44px 44px 36px;border-radius:2px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.rg-contact-modal__title{font-size:26px;line-height:1.2}
.rg-contact-modal__subtitle{font-family:var(--serif);font-size:16px;color:var(--muted);margin:8px 0 24px}
.rg-contact-modal__close{position:absolute;right:18px;top:18px;width:34px;height:34px;background:none;border:0;cursor:pointer}
.rg-contact-modal__close-line{position:absolute;left:6px;top:16px;width:22px;height:2px;background:var(--navy);display:block}
.rg-contact-modal__close-line:first-child{transform:rotate(45deg)}
.rg-contact-modal__close-line:last-child{transform:rotate(-45deg)}
.rg-contact-form{display:grid;gap:16px;font-family:var(--sans);font-size:14px}
.rg-contact-form label{display:block;font-family:var(--serif);font-weight:600;color:var(--navy);font-size:14px;margin-bottom:6px}
.rg-contact-form__required{color:#C0392B}
.rg-contact-form input,.rg-contact-form select,.rg-contact-form textarea{width:100%;padding:12px 14px;border:1px solid #D7DBE2;background:#fff;font-family:var(--sans);font-size:15px;color:#333;border-radius:2px}
.rg-contact-form input:focus,.rg-contact-form select:focus,.rg-contact-form textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 2px rgba(28,58,133,.12)}
.rg-contact-form textarea{min-height:120px;resize:vertical}
.rg-contact-form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.rg-contact-form__actions{display:flex;gap:12px;margin-top:6px}
.rg-contact-btn{padding:13px 26px;font-family:var(--serif);font-weight:700;font-size:15px;border-radius:25px;border:1px solid var(--navy);cursor:pointer}
.rg-contact-btn--primary{background:var(--navy);color:#fff}
.rg-contact-btn--primary:hover{background:#16306e}
.rg-contact-btn--secondary{background:transparent;color:var(--navy)}
/* Match the contact dialog used on the home page. */
.rg-contact-modal{z-index:100050;align-items:flex-start;justify-content:center;padding:0 16px;overflow-y:auto}
body.contact-modal-open{overflow:hidden}
.rg-contact-modal__backdrop{position:fixed;background:rgba(0,26,89,.58);backdrop-filter:blur(3px)}
.rg-contact-modal__dialog{width:min(620px,100%);max-height:calc(91vh - 24px);margin:9vh auto 24px;padding:24px;overflow-y:auto;background:#fff;border:2px solid #001A59;border-radius:12px;box-shadow:0 30px 70px rgba(0,20,68,.28);color:#001A59}
.rg-contact-modal__title{margin:0 0 6px;font-size:34px;line-height:1.1;font-weight:700;color:#001A59;text-transform:none}
.rg-contact-modal__subtitle{font-family:var(--serif);font-size:17px;color:rgba(0,26,89,.78);margin:0 0 22px;line-height:1.35}
.rg-contact-modal__close{right:12px;top:12px;width:42px;height:42px;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:linear-gradient(160deg,#0b2d7d 0%,#001A59 100%);box-shadow:0 8px 18px rgba(0,26,89,.32)}
.rg-contact-modal__close:focus-visible{outline:2px solid rgba(0,26,89,.45);outline-offset:2px}
.rg-contact-modal__close-line{left:11px;top:19px;width:17px;height:2px;border-radius:2px;background:#fff}
.rg-contact-form{gap:14px;font-family:var(--serif);line-height:1.4}
.rg-contact-form label{font-family:var(--serif);font-weight:700;color:#001A59}
.rg-contact-form__required{color:#b3261e}
.rg-contact-form input,.rg-contact-form select,.rg-contact-form textarea{border:1px solid rgba(0,26,89,.35);border-radius:8px;font-family:var(--serif);font-size:16px;color:#001A59}
.rg-contact-form input:focus,.rg-contact-form select:focus,.rg-contact-form textarea:focus{outline:2px solid rgba(0,26,89,.35);border-color:#001A59;box-shadow:none}
.rg-contact-form textarea{min-height:150px}
.rg-contact-form__row{gap:14px}
.rg-contact-form__actions{gap:10px;margin-top:0;align-items:center}
.rg-contact-btn{padding:11px 18px;font-family:var(--serif);border:0;border-radius:8px}
.rg-contact-btn--primary{background:#001A59}
.rg-contact-btn--secondary{background:#e8edf8;color:#001A59}
.rg-contact-btn[disabled]{opacity:.6;cursor:not-allowed}
.rg-contact-form__status{margin:2px 0 0;min-height:20px;font-size:14px;color:#001A59}
.rg-contact-form__status.is-error{color:#b3261e}
.rg-contact-form__status.is-success{color:#0b7d34}
.quote{background:var(--navy);color:#fff;padding:100px 0}
.quote .wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center}
.quote h2{color:#fff;font-size:36px;line-height:1.16;max-width:620px;margin-top:14px}
.quote p{font-family:var(--serif);color:#D7DCEC;font-size:17px;margin-top:18px;max-width:540px}
.quote__card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);padding:34px 32px}
.quote__card h3{color:#fff;font-size:20px;margin-bottom:10px;letter-spacing:.3px}
.quote__card p{font-size:15px;margin:0 0 22px;color:#C9D1E6}
.quote__card .btn{width:100%}

/* FOOTER antiguo eliminado: se usa el bloque .footer-box de arriba */

@media (max-width:1180px){
  .nav a{font-size:15px;padding:12px 10px}
  .site-header .btn{padding:12px 16px;font-size:12px}
  .hero h1{font-size:48px}
  .grid6{grid-template-columns:repeat(2,1fr)}
  .why__wrap{grid-template-columns:1fr}
  .why__photo{min-height:340px;order:-1}
  .quote .wrap{grid-template-columns:1fr}
}
@media (max-width:860px){
  .wrap{padding:0 22px}
  .nav,.site-header .btn{display:none}
  .burger{display:block;margin-left:auto}
  .site-header{height:80px}
  .logo{width:118px}
  .hero{min-height:0}
  .hero .wrap{padding-top:130px;padding-bottom:70px}
  .hero h1{font-size:2.15rem}
  .hero p{font-size:15.5px}
  .process{padding:70px 0}
  .process h2{font-size:28px}
  .process__sub{font-size:16px}
  .grid6,.grid6--five{grid-template-columns:1fr;gap:18px;margin-top:36px}
  .why{padding-bottom:70px}
  .why__text{padding:40px 26px}
  .why__wrap--solo .why__text{padding:0}
  .why h2{font-size:26px}
  .why__wrap--solo .why__list{grid-template-columns:1fr;gap:24px}
  .quote{padding:70px 0}
  .quote h2{font-size:26px}
  .why__list img{width:44px;height:44px}
  .footer-box{flex-direction:column;font-size:16px;line-height:28px;gap:26px}
  .footer-box-left,.footer-box-center,.footer-box-right{width:100%}
  .rg-contact-modal__dialog{margin-top:24px;max-height:calc(100vh - 48px);padding:20px 18px 18px}
  .rg-contact-modal__title{font-size:28px;margin-right:42px}
  .rg-contact-modal__subtitle{font-size:15px}
  .rg-contact-form__row{grid-template-columns:1fr}
  .rg-contact-form__actions{flex-direction:column;align-items:stretch}
}



/* ==========================================================
   Popup de textos legales (iframe) - reutilizable
   Uso: <link rel="stylesheet" href="legal-modal.css">
   ========================================================== */

/* Contenedor a pantalla completa */
.rg-legal-modal {
    position: fixed;
    inset: 0;
    z-index: 100060;
    display: none;
}
.rg-legal-modal.is-open {
    display: block;
}

/* Fondo oscuro con blur */
.rg-legal-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 10, 16, 0.64);
    backdrop-filter: blur(4px);
}

/* Caja blanca */
.rg-legal-modal__dialog {
    position: relative;
    max-width: 900px;
    max-height: 88vh;
    margin: 6vh auto 0;
    background: #ffffff;
    border: 2px solid #001A59;
    border-radius: 12px;
    box-shadow: 0 30px 70px rgba(0, 20, 68, 0.28);
    color: #001A59;
    padding: 22px 24px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

/* Título */
.rg-legal-modal__title {
    margin: 0 42px 10px 0;
    font-family: inherit;
    font-size: 30px;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #001A59;
}

/* Botón cerrar (X dibujada con dos líneas) */
.rg-legal-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 999px;
    background: linear-gradient(160deg, #0b2d7d 0%, #001A59 100%);
    box-shadow: 0 8px 18px rgba(0, 26, 89, 0.32);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.rg-legal-modal__close:focus-visible {
    outline: 2px solid rgba(0, 26, 89, 0.45);
    outline-offset: 2px;
}
.rg-legal-modal__close-line {
    position: absolute;
    width: 17px;
    height: 2px;
    border-radius: 2px;
    background: #ffffff;
}
.rg-legal-modal__close-line:first-child { transform: rotate(45deg); }
.rg-legal-modal__close-line:last-child  { transform: rotate(-45deg); }

/* Zona del contenido (donde va el iframe) */
.rg-legal-modal__content {
    overflow: hidden;
    min-height: 60vh;
    font-size: 15px;
    line-height: 1.6;
}

/* Iframe: reseteos por si la landing tiene estilos globales para iframe */
.rg-legal-modal__frame {
    display: block;
    width: 100%;
    height: 60vh;
    border: 0;
    background: #ffffff;
    position: relative;
    top: auto;
    left: auto;
    opacity: 1;
    visibility: visible;
    z-index: 1;
    transform: none;
}

/* Bloqueo de scroll de la página y cursor normal mientras está abierto */
body.legal-modal-open {
    overflow: hidden;
}
body.legal-modal-open,
body.legal-modal-open .rg-legal-modal,
body.legal-modal-open .rg-legal-modal * {
    cursor: auto !important;
}
/* Solo si la landing tiene cursor personalizado (.cursor) */
body.legal-modal-open .cursor {
    display: none !important;
}

/* Móvil */
@media (max-width: 760px) {
    .rg-legal-modal__dialog {
        margin: 5vh 12px 0;
        max-height: 90vh;
        padding: 18px;
    }
    .rg-legal-modal__title {
        font-size: 24px;
    }
}


/* ==========================================================
   POPUP TRABAJA CON NOSOTROS
   ========================================================== */

.rg-jobs-modal {
    position: fixed;
    inset: 0;
    z-index: 100070;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 25px;
	background: transparent !important
}

.rg-jobs-modal.is-open {
    display: flex !important;
}

.rg-jobs-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(8, 10, 16, .72);
    backdrop-filter: blur(4px);
}

.rg-jobs-modal__frame {
    position: relative;
    z-index: 2;
    display: block;
    width: min(1000px, 100%); /* Puedes reducir este ancho si la caja del formulario es más pequeña, ej: min(600px, 100%) */
    height: 90vh;
    border: 0;
    opacity: 1;
    visibility: visible;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    /* que no cree stacking context propio */
    isolation: auto;
}

.rg-jobs-modal__close {
    position: absolute;
    z-index: 3;
    top: 3vh;
    right: max(calc((100vw - 1000px) / 2 - 15px), 15px);
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: #1C3A85;
    color: #fff;
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
}

body.jobs-modal-open {
    overflow: hidden !important;
}

@media (max-width: 760px) {
    .rg-jobs-modal {
        padding: 10px;
    }

    .rg-jobs-modal__frame {
        width: 100%;
        height: 94vh;
    }

    .rg-jobs-modal__close {
        top: 12px;
        right: 18px;
    }
}
