.elementor-8 .elementor-element.elementor-element-318edaa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-8 .elementor-element.elementor-element-f65b05a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-8 .elementor-element.elementor-element-0902383{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}/* Start custom CSS for html, class: .elementor-element-5cc3aa8 *//* ============================================================
   ROCKI REALTY HERO - DESKTOP IMPONENTE / RESPONSIVE / MODAL
   Rocki más grande en altura y con presencia fuerte en desktop
============================================================ */

.rocki-brutal-hero {
    position: relative;
    width: 100%;
    min-height: 100vh;
    min-height: 100svh;
    background-color: #ffffff;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    justify-content: center;
    isolation: isolate;
}

/* ============================================================
   VIDEO BACKGROUND
============================================================ */

.rocki-bg-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    filter: saturate(0.9) contrast(1) brightness(1.05);
    pointer-events: none;
}

/* ============================================================
   WHITE / CITY OVERLAY
============================================================ */

.rocki-studio-bg {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,0.86) 0%,
            rgba(255,255,255,0.74) 35%,
            rgba(255,255,255,0.52) 62%,
            rgba(255,255,255,0.62) 100%
        ),
        radial-gradient(
            circle at 24% 50%,
            rgba(255,255,255,0.96) 0%,
            rgba(255,255,255,0.58) 42%,
            rgba(255,255,255,0.30) 100%
        );
}

/* ============================================================
   LOGO
============================================================ */

.rocki-logo-wrap {
    position: absolute;
    top: clamp(18px, 3vh, 42px);
    left: 50%;
    transform: translateX(-50%);
    z-index: 20;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    pointer-events: auto;
}

.rocki-logo {
    display: block;
    width: clamp(125px, 8vw, 175px);
    height: auto;
    filter: drop-shadow(0 8px 24px rgba(0,0,0,0.08));
}

/* ============================================================
   ROCKI IMAGE SIDE - DESKTOP GRANDE EN ALTURA
============================================================ */

.rocki-realtor-container {
    position: relative;
    z-index: 4;
    width: 43vw;
    min-width: 430px;
    height: 100vh;
    height: 100svh;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: visible;
    padding-left: 0;
    box-sizing: border-box;
}

.rocki-half-body-img {
    position: absolute;
    bottom: -18px;
    left: 40%;
    display: block;

    /* MÁS ALTA EN DESKTOP */
    height: 82vh;
    height: 82svh;
    width: auto;

    max-width: none;
    max-height: none;
    object-fit: contain;
    object-position: bottom center;

    /* MÁS IMPONENTE */
    transform: translateX(-50%) scale(1.52);
    transform-origin: bottom center;

    filter: drop-shadow(0 32px 55px rgba(0,0,0,0.24));
    z-index: 5;
}

/* ============================================================
   CONTENT SIDE
============================================================ */

.rocki-content-container {
    position: relative;
    z-index: 6;
    width: 57vw;
    height: 100vh;
    height: 100svh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    padding-top: clamp(120px, 14vh, 175px);
    padding-bottom: clamp(35px, 5vh, 75px);
    padding-right: clamp(40px, 4.5vw, 90px);
    padding-left: 0;

    box-sizing: border-box;
}

/* GLASS TEXT BOX */
.rocki-text-block {
    width: 100%;
    max-width: 760px;
    padding: 2.5rem 3rem;
    border-left: 4px solid rgba(166,137,69,0.8);
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.66) 0%,
            rgba(255,255,255,0.38) 100%
        );
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 30px 70px rgba(0,0,0,0.02);
    box-sizing: border-box;
}

.rocki-tagline {
    font-family: 'Inter', sans-serif;
    font-size: clamp(0.85rem, 0.8vw, 1.05rem);
    text-transform: uppercase;
    letter-spacing: 5px;
    color: #A68945;
    font-weight: 700;
    display: block;
    margin-bottom: 0.8rem;
}

.rocki-title {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(2.3rem, 3.5vw, 4.8rem);
    line-height: 0.98;
    font-weight: 950;
    color: #172B54;
    text-transform: uppercase;
    letter-spacing: -2px;
    margin: 0 0 1.2rem 0;
}

.gold-text {
    background: linear-gradient(135deg, #8F7230 0%, #C7A85A 45%, #A68945 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.rocki-description {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.05rem, 1.1vw, 1.3rem);
    line-height: 1.6;
    color: #2d3748;
    font-weight: 450;
    margin: 0 0 1.8rem 0;
    max-width: 680px;
}

.rocki-btn-group {
    display: flex;
    width: 100%;
}

.rocki-btn-group a {
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    font-size: clamp(1rem, 1.1vw, 1.5rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding: 1.2rem 3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.btn-primary {
    background: #172B54;
    color: #ffffff;
    box-shadow: 0 12px 30px rgba(23, 43, 84, 0.22);
}

.btn-primary:hover {
    background: #A68945;
    color: #ffffff;
    transform: translateY(-4px);
    box-shadow: 0 16px 35px rgba(166, 137, 69, 0.35);
}

/* ============================================================
   DESKTOP NORMAL 1025px - 1500px
============================================================ */

@media (min-width: 1025px) and (max-width: 1500px) {
    .rocki-logo-wrap {
        top: 24px;
    }

    .rocki-logo {
        width: 145px;
    }

    .rocki-realtor-container {
        width: 43vw;
        min-width: 390px;
    }

    .rocki-half-body-img {
        left: 39%;
        bottom: -20px;

        /* MÁS ALTA EN LAPTOP / DESKTOP */
        height: 84vh;
        height: 84svh;

        transform: translateX(-50%) scale(1.58);
    }

    .rocki-content-container {
        width: 57vw;
        padding-top: 138px;
        padding-bottom: 42px;
        padding-right: 4vw;
        padding-left: 0;
    }

    .rocki-text-block {
        max-width: 740px;
        padding: 2.25rem 2.6rem;
    }
}

/* ============================================================
   LARGE DESKTOP 1501px+
============================================================ */

@media (min-width: 1501px) {
    .rocki-logo-wrap {
        top: clamp(22px, 3vh, 44px);
    }

    .rocki-logo {
        width: clamp(145px, 7vw, 180px);
    }

    .rocki-realtor-container {
        width: 43vw;
        min-width: 500px;
    }

    .rocki-half-body-img {
        left: 51%;
        bottom: -22px;

        /* MÁS ALTA EN PANTALLAS GRANDES */
        height: 87vh;
        height: 87svh;

        transform: translateX(-50%) scale(2.0);
    }

    .rocki-content-container {
        width: 57vw;
        padding-top: clamp(145px, 15vh, 190px);
        padding-right: 75px;
        padding-left: 0;
    }

    .rocki-text-block {
        max-width: 790px;
    }
}

/* ============================================================
   ULTRAWIDE 1900px+
============================================================ */

@media (min-width: 1900px) {
    .rocki-realtor-container {
        width: 44vw;
        min-width: 620px;
    }

    .rocki-half-body-img {
        left: 42%;
        bottom: -25px;

        /* MÁS ALTA EN ULTRAWIDE */
        height: 90vh;
        height: 90svh;

        transform: translateX(-50%) scale(1.62);
    }

    .rocki-content-container {
        width: 56vw;
        max-width: 1050px;
        padding-top: clamp(155px, 16vh, 210px);
    }

    .rocki-text-block {
        max-width: 820px;
    }
}

/* ============================================================
   PANTALLAS BAJITAS
============================================================ */

@media (max-height: 760px) and (min-width: 1025px) {
    .rocki-logo-wrap {
        top: 14px;
    }

    .rocki-logo {
        width: 125px;
    }

    .rocki-half-body-img {
        bottom: -15px;
        height: 80vh;
        height: 80svh;
        transform: translateX(-50%) scale(1.46);
    }

    .rocki-content-container {
        padding-top: 118px;
        padding-bottom: 28px;
    }

    .rocki-text-block {
        padding: 1.9rem 2.3rem;
    }

    .rocki-title {
        margin-bottom: 0.95rem;
    }

    .rocki-description {
        line-height: 1.5;
        margin-bottom: 1.3rem;
    }

    .rocki-btn-group a {
        padding: 1rem 2.6rem;
    }
}

/* ============================================================
   TABLETS
============================================================ */

@media (max-width: 1024px) {
    .rocki-brutal-hero {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        height: auto;
        min-height: 100vh;
        min-height: 100svh;
        padding: 3rem 6% 4rem;
        box-sizing: border-box;
    }

    .rocki-logo-wrap {
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        margin: 0 auto 2.5rem;
        order: 1;
    }

    .rocki-logo {
        width: 155px;
    }

    .rocki-realtor-container {
        order: 2;
        width: 100%;
        min-width: 0;
        height: auto;
        padding: 0;
        justify-content: center;
        align-items: flex-end;
        margin-bottom: 2rem;
        position: relative;
        overflow: visible;
    }

    .rocki-half-body-img {
        position: relative;
        left: auto;
        bottom: auto;
        width: auto;
        max-width: 82%;
        height: auto;
        max-height: 45vh;
        transform: scale(1);
        object-position: bottom center;
    }

    .rocki-content-container {
        order: 3;
        width: 100%;
        height: auto;
        padding: 0;
        justify-content: center;
        align-items: center;
    }

    .rocki-text-block {
        max-width: 760px;
        border-left: none;
        border-top: 4px solid #A68945;
        text-align: center;
        padding: 2.5rem 2rem;
        background: rgba(255,255,255,0.72);
    }

    .rocki-title {
        font-size: clamp(2.3rem, 6vw, 4rem);
        letter-spacing: -1.5px;
    }

    .rocki-description {
        font-size: clamp(1.05rem, 1.1vw, 1.3rem);
        line-height: 1.6;
        margin-left: auto;
        margin-right: auto;
    }

    .rocki-btn-group {
        justify-content: center;
    }

    .rocki-btn-group a {
        width: 100%;
        max-width: 480px;
        font-size: clamp(1rem, 1.1vw, 1.5rem);
        padding: 1.2rem 3rem;
    }
}

/* ============================================================
   MOBILE
============================================================ */

@media (max-width: 768px) {
    .rocki-brutal-hero {
        padding: 2.5rem 5% 3.5rem;
    }

    .rocki-logo {
        width: 135px;
    }

    .rocki-logo-wrap {
        margin-bottom: 1.7rem;
    }

    .rocki-realtor-container {
        margin-bottom: 1.6rem;
    }

    .rocki-half-body-img {
        max-width: 88%;
        max-height: 38vh;
    }

    .rocki-text-block {
        padding: 2.2rem 1.4rem;
    }

    .rocki-tagline {
        font-size: clamp(0.85rem, 0.8vw, 1.05rem);
        letter-spacing: 4px;
        margin-bottom: 0.8rem;
    }

    .rocki-title {
        font-size: clamp(2.1rem, 8.5vw, 3rem);
        line-height: 1;
        letter-spacing: -1px;
        margin-bottom: 1rem;
    }

    .rocki-description {
        font-size: clamp(1.05rem, 1.1vw, 1.3rem);
        line-height: 1.6;
    }

    .rocki-btn-group a {
        font-size: clamp(1rem, 1.1vw, 1.5rem);
        letter-spacing: 1.5px;
        padding: 1.1rem 1.6rem;
    }
}

@media (max-width: 480px) {
    .rocki-brutal-hero {
        padding: 2rem 4.5% 3rem;
    }

    .rocki-logo {
        width: 120px;
    }

    .rocki-half-body-img {
        max-width: 94%;
        max-height: 35vh;
    }

    .rocki-text-block {
        padding: 1.9rem 1.15rem;
    }

    .rocki-title {
        font-size: clamp(1.9rem, 9.2vw, 2.55rem);
    }

    .rocki-description {
        font-size: clamp(1.05rem, 1.1vw, 1.3rem);
        line-height: 1.55;
    }

    .rocki-btn-group a {
        font-size: clamp(0.95rem, 4vw, 1.15rem);
        padding: 1rem 1.25rem;
    }
}

/* ============================================================
   MODAL STYLES
============================================================ */

.rocki-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 43, 84, 0.85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: all 0.4s ease;
    padding: 20px;
    box-sizing: border-box;
}

.rocki-modal-overlay.is-active {
    opacity: 1;
    pointer-events: auto;
}

.rocki-modal-window {
    background: #ffffff;
    width: 100%;
    max-width: 550px;
    max-height: 92vh;
    overflow-y: auto;
    padding: 3rem;
    position: relative;
    border-top: 5px solid #A68945;
    transform: translateY(20px);
    transition: 0.4s ease;
    box-shadow: 0 30px 90px rgba(0,0,0,0.25);
    box-sizing: border-box;
}

.rocki-modal-overlay.is-active .rocki-modal-window {
    transform: translateY(0);
}

.rocki-modal-close {
    position: absolute;
    top: 1rem;
    right: 1.5rem;
    background: none;
    border: none;
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
    color: #172B54;
}

.rocki-modal-header {
    text-align: center;
    margin-bottom: 2rem;
}

.modal-tagline {
    color: #A68945;
    letter-spacing: 3px;
    font-size: 0.8rem;
    font-weight: 800;
    display: block;
    text-transform: uppercase;
}

.rocki-modal-header h2 {
    font-family: 'Montserrat', sans-serif;
    color: #172B54;
    margin: 0.35rem 0;
    font-weight: 900;
}

.rocki-modal-header p {
    margin: 0;
    color: #2d3748;
    font-family: 'Inter', sans-serif;
}

.wpcf7-form input:not([type="submit"]),
.wpcf7-form select,
.wpcf7-form textarea {
    width: 100%;
    padding: 0.85rem;
    margin-bottom: 1rem;
    border: 1px solid #dddddd;
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
}

.wpcf7-submit {
    width: 100%;
    background: #172B54;
    color: #ffffff;
    border: none;
    padding: 1rem;
    font-weight: 800;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: 0.3s ease;
}

.wpcf7-submit:hover {
    background: #A68945;
}

@media (max-width: 600px) {
    .rocki-modal-window {
        padding: 2.4rem 1.4rem;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f2802b3 *//* ============================================================
    ROCKI REALTY - CINEMATIC TEXTURE BLOCK (HOMOGENEOUS)
============================================================ */
.rocki-cinematic-wrapper {
    position: relative;
    padding: 10rem 8% 12rem 8%;
    background-color: #FFFFFF;
    overflow: hidden;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

.rocki-scraped-building-full {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('https://rockirealty.com/wp-content/uploads/2026/05/backyard-pool-in-a-verdant-garden-setting-in-a-mod-2026-03-18-06-34-28-utc-scaled.jpg');
    background-size: cover;
    background-position: center center;
    z-index: 1;
}

.rocki-blend-lens-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 350px;
    background: linear-gradient(to bottom, 
        #FFFFFF 0%, 
        rgba(255, 255, 255, 0.85) 25%, 
        rgba(255, 255, 255, 0.3) 60%, 
        transparent 100%
    );
    pointer-events: none;
    z-index: 2;
}

.rocki-container-split {
    max-width: 1440px;
    margin: 0 auto;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    z-index: 3;
}

.rocki-glass-panel {
    width: 100%;
    max-width: 780px; 
    padding: 4.5rem 4rem;
    background: rgba(15, 30, 62, 0.52); 
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-top: 1px solid rgba(255, 255, 255, 0.22);
    border-left: 1px solid rgba(255, 255, 255, 0.22);
    
    border-radius: 2px;
    box-shadow: 0 40px 90px rgba(0, 0, 0, 0.3);
    text-align: left;
    box-sizing: border-box;
}

.rocki-h2-title {
    font-family: 'Montserrat', sans-serif;
    font-size: clamp(2.5rem, 3.8vw, 5.2rem); 
    line-height: 0.98;
    font-weight: 950;
    color: #FFFFFF;
    text-transform: uppercase;
    margin: 0 0 2rem 0;
    letter-spacing: -2px;
}

.gold-text-glow {
    background: linear-gradient(135deg, #8F7230 0%, #C7A85A 45%, #A68945 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.rocki-p-desc, .rocki-p-desc-secondary {
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.1rem, 1.2vw, 1.4rem); 
    line-height: 1.65;
    color: #FFFFFF;
    font-weight: 450;
}

.rocki-p-desc {
    margin: 0 0 1.8rem 0;
    opacity: 0.95;
}

.rocki-p-desc-secondary {
    margin: 0 0 3rem 0;
    opacity: 0.78; 
}

.rocki-btn-luxury-sweep {
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    font-size: clamp(1.1rem, 1.2vw, 1.7rem); 
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding: 1.4rem 3.5rem;
    color: #FFFFFF;
    border: 1px solid #A68945;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    box-sizing: border-box;
}

.rocki-btn-luxury-sweep::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.25), transparent);
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.rocki-btn-luxury-sweep:hover::before {
    left: 100%;
}

.rocki-btn-luxury-sweep:hover {
    background-color: #A68945;
    box-shadow: 0 20px 40px rgba(166, 137, 69, 0.35);
    transform: translateY(-4px);
}

.rocki-visual-spacer-empty {
    width: 40%;
}

/* ============================================================
    ESTILOS DE TU MODAL ORIGINAL (CLASES ORIGINALES COMPLETAS)
============================================================ */
.rocki-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 43, 84, 0.85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    z-index: 999999; /* Se superpone correctamente en la pantalla actual */
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: all 0.4s ease;
    padding: 20px;
    box-sizing: border-box;
}

.rocki-modal-overlay.is-active {
    opacity: 1;
    pointer-events: auto;
}

.rocki-modal-window {
    background: #fff;
    width: 100%;
    max-width: 550px;
    padding: 3rem;
    position: relative;
    border-top: 5px solid #A68945;
    transform: translateY(20px);
    transition: 0.4s ease;
    box-shadow: 0 30px 60px rgba(0,0,0,0.3);
    box-sizing: border-box;
}

.rocki-modal-overlay.is-active .rocki-modal-window {
    transform: translateY(0);
}

.rocki-modal-close {
    position: absolute;
    top: 1rem;
    right: 1.5rem;
    background: none;
    border: none;
    font-size: 2.2rem;
    cursor: pointer;
    color: #172B54;
    line-height: 1;
}

.rocki-modal-header {
    text-align: center;
    margin-bottom: 2rem;
}

.modal-tagline {
    color: #A68945;
    letter-spacing: 3px;
    font-size: 0.8rem;
    font-weight: 800;
    display: block;
    text-transform: uppercase;
}

.rocki-modal-header h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 2rem;
    color: #172B54;
    margin: 0.5rem 0;
}

.rocki-modal-header p {
    font-family: 'Inter', sans-serif;
    color: #4b5563;
    margin: 0;
}

/* ============================================================
    ADAPTACIÓN RESPONSIVA
============================================================ */
@media (max-width: 1366px) {
    .rocki-h2-title {
        font-size: clamp(2.4rem, 3.6vw, 4.2rem);
    }
}

@media (max-width: 1024px) {
    .rocki-cinematic-wrapper {
        padding: 8rem 6% 10rem 6%;
    }
    .rocki-container-split {
        justify-content: center;
    }
    .rocki-glass-panel {
        max-width: 100%;
        padding: 4rem 3rem;
        text-align: center;
    }
    .rocki-visual-spacer-empty {
        display: none;
    }
    .rocki-btn-luxury-sweep {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .rocki-h2-title {
        font-size: clamp(2.1rem, 8.5vw, 3rem);
        letter-spacing: -1px;
    }
    .rocki-glass-panel {
        padding: 3rem 1.8rem;
    }
    .rocki-modal-window {
        padding: 2.5rem 1.5rem;
    }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-f60f149 *//* ================================
   ROCKI FINAL VAULT SECTION
================================ */

.rocki-final-vault {
    background-color: #0B1426 !important;
    background-image: radial-gradient(circle at 50% 50%, #172B54 0%, #070D1A 100%) !important;
    padding: 80px 40px !important;
    text-align: center !important;
    color: #ffffff !important;
    overflow: hidden !important;
}

/* Evita que Elementor meta fondos blancos dentro */
.rocki-final-vault .elementor-widget-container,
.rocki-final-vault .rocki-form-wrapper,
.rocki-final-vault form,
.rocki-final-vault .wpcf7 {
    background: transparent !important;
}

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

.rocki-header-center {
    max-width: 980px !important;
    margin: 0 auto 55px auto !important;
    text-align: center !important;
}

/* Misma vibra que los otros subtítulos del website */
.rocki-tag-gold {
    display: block !important;
    color: #A68945 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 7px !important;
    text-transform: uppercase !important;
    margin-bottom: 22px !important;
}

.rocki-title-white {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 900 !important;
    font-size: clamp(2.2rem, 5vw, 3.7rem) !important;
    line-height: 0.95 !important;
    letter-spacing: -1.5px !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    margin: 0 0 24px 0 !important;
}

.rocki-desc-silver {
    font-family: 'Montserrat', sans-serif !important;
    color: #BAC6DC !important;
    max-width: 720px !important;
    margin: 0 auto !important;
    font-size: 17px !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;
}

/* ================================
   FORM WRAPPER
================================ */

.rocki-form-wrapper {
    max-width: 750px !important;
    margin: 0 auto !important;
    text-align: left !important;
    background: transparent !important;
}

/* Contact Form 7 paragraphs */
.rocki-form-wrapper p {
    margin: 0 0 22px 0 !important;
    background: transparent !important;
}

/* Labels */
.rocki-form-wrapper label {
    color: #A68945 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    font-size: 12px !important;
    display: block !important;
    margin-bottom: 10px !important;
    background: transparent !important;
}

/* ================================
   INPUTS / TEXTAREA / SELECT
================================ */

.rocki-form-wrapper input:not([type="submit"]),
.rocki-form-wrapper textarea,
.rocki-form-wrapper select {
    width: 100% !important;
    background-color: rgba(7, 13, 26, 0.75) !important;
    color: #ffffff !important;
    border: 1px solid rgba(166, 137, 69, 0.45) !important;
    border-radius: 0 !important;
    padding: 17px 18px !important;
    margin-bottom: 24px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    outline: none !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
}

/* Focus elegante */
.rocki-form-wrapper input:not([type="submit"]):focus,
.rocki-form-wrapper textarea:focus,
.rocki-form-wrapper select:focus {
    background-color: rgba(11, 20, 38, 0.95) !important;
    border-color: #A68945 !important;
    box-shadow: 0 0 0 3px rgba(166, 137, 69, 0.18) !important;
    color: #ffffff !important;
}

/* Placeholder */
.rocki-form-wrapper input::placeholder,
.rocki-form-wrapper textarea::placeholder {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* Textarea */
.rocki-form-wrapper textarea {
    min-height: 140px !important;
    resize: vertical !important;
}

/* ================================
   SELECT CORRECTION
================================ */

/* El select cerrado */
.rocki-form-wrapper select {
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;

    background-image:
        linear-gradient(45deg, transparent 50%, #A68945 50%),
        linear-gradient(135deg, #A68945 50%, transparent 50%) !important;
    background-position:
        calc(100% - 22px) 50%,
        calc(100% - 14px) 50% !important;
    background-size:
        8px 8px,
        8px 8px !important;
    background-repeat: no-repeat !important;

    padding-right: 50px !important;
}

/* Las opciones al abrir el dropdown */
.rocki-form-wrapper select option {
    background-color: #0B1426 !important;
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    padding: 12px !important;
}

/* Opción deshabilitada o placeholder */
.rocki-form-wrapper select option:disabled {
    color: rgba(255, 255, 255, 0.45) !important;
}

/* Para Firefox */
.rocki-form-wrapper select:-moz-focusring {
    color: transparent !important;
    text-shadow: 0 0 0 #ffffff !important;
}

/* ================================
   CONTACT FORM 7 SPANS
================================ */

.rocki-form-wrapper .wpcf7-form-control-wrap {
    display: block !important;
    background: transparent !important;
}

/* Mensajes de error */
.rocki-form-wrapper .wpcf7-not-valid-tip {
    color: #ffb3b3 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    margin-top: -16px !important;
    margin-bottom: 18px !important;
    background: transparent !important;
}

/* Respuesta del formulario */
.rocki-form-wrapper .wpcf7-response-output {
    color: #ffffff !important;
    border: 1px solid rgba(166, 137, 69, 0.6) !important;
    background: rgba(166, 137, 69, 0.12) !important;
    padding: 18px !important;
    margin: 25px 0 0 0 !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* ================================
   SUBMIT BUTTON
================================ */

.rocki-form-wrapper .wpcf7-submit {
    width: 100% !important;
    background: #A68945 !important;
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    padding: 22px !important;
    border: 1px solid #A68945 !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    transition: all 0.35s ease !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.28) !important;
}

.rocki-form-wrapper .wpcf7-submit:hover {
    background: #ffffff !important;
    color: #0B1426 !important;
    border-color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 22px 45px rgba(0, 0, 0, 0.38) !important;
}

/* Loader */
.rocki-form-wrapper .wpcf7-spinner {
    background-color: #A68945 !important;
}

/* ================================
   MOBILE
================================ */

@media (max-width: 768px) {
    .rocki-final-vault {
        padding: 65px 22px !important;
    }

    .rocki-tag-gold {
        font-size: 10px !important;
        letter-spacing: 5px !important;
        margin-bottom: 18px !important;
    }

    .rocki-title-white {
        font-size: 2.25rem !important;
        line-height: 1 !important;
        letter-spacing: -1px !important;
    }

    .rocki-desc-silver {
        font-size: 15px !important;
        line-height: 1.6 !important;
    }

    .rocki-form-wrapper input:not([type="submit"]),
    .rocki-form-wrapper textarea,
    .rocki-form-wrapper select {
        font-size: 14px !important;
        padding: 15px 16px !important;
    }
}/* End custom CSS */