/*
 * Componentes añadidos a la web estática (ver PLAN-WEB.md).
 * Paleta de la marca: negro, blanco, lila #DBCFFF, lima #C6FF00.
 */
:root {
    --si4-lila: #DBCFFF;
    --si4-lima: #C6FF00;
    --si4-ease: cubic-bezier(.65, 0, .35, 1);
}

/* ---------- Botones cápsula (mismo estilo que ENVIAR) ---------- */
.si4-pill {
    display: inline-flex; align-items: center; justify-content: center; gap: .5em;
    font-family: "Archivo", sans-serif; font-size: 14px; font-weight: 500; line-height: 1;
    text-transform: uppercase; letter-spacing: .04em; text-decoration: none;
    padding: 11px 20px !important; border-radius: 100px !important;
    background: #000 !important; color: #fff !important; border: 1px solid #fff !important;
    cursor: pointer; transition: background-color .25s, color .25s, transform .25s;
}
.si4-pill:hover, .si4-pill:focus-visible { background: #fff !important; color: #000 !important; }
.si4-pill--lime { color: var(--si4-lima) !important; }
.si4-pill--lime:hover, .si4-pill--lime:focus-visible { background: var(--si4-lima) !important; color: #000 !important; border-color: var(--si4-lima) !important; }
.si4-pill:focus-visible { outline: 2px solid var(--si4-lima); outline-offset: 3px; }

/* ---------- Aviso de cookies ---------- */
.si4-consent {
    position: fixed; left: 55px; bottom: 125px; z-index: 10000;
    width: min(440px, calc(100vw - 32px));
    padding: 26px 26px 22px; box-sizing: border-box;
    background: #000; color: #fff; border: 1px solid #fff; border-radius: 25px;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
    font-family: "Archivo", sans-serif;
    opacity: 0; transform: translateY(16px) scale(.98); pointer-events: none;
    transition: opacity .45s var(--si4-ease), transform .45s var(--si4-ease);
}
.si4-consent.is-open { opacity: 1; transform: none; pointer-events: auto; }
.si4-consent__title {
    margin: 0 0 10px !important; font-size: 22px !important; line-height: 1.1 !important;
    font-weight: 600 !important; color: var(--si4-lila) !important; text-transform: none;
}
.si4-consent__text { margin: 0 0 18px !important; font-size: 14px !important; line-height: 1.45 !important; font-weight: 300 !important; color: #fff !important; }
.si4-consent__text a { color: var(--si4-lima) !important; font-size: inherit !important; text-decoration: underline; }
.si4-consent__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.si4-consent__actions .si4-pill { flex: 1 1 0; }
.si4-consent__link {
    flex-basis: 100%; background: none !important; border: 0 !important; padding: 6px 0 0 !important;
    color: #fff !important; font: 300 13px/1 "Archivo", sans-serif; text-decoration: underline;
    text-underline-offset: 3px; cursor: pointer; text-align: left;
}
.si4-consent__prefs { margin: 0 0 18px; border-top: 1px solid rgba(255,255,255,.25); }
.si4-consent__prefs[hidden] { display: none; }
.si4-consent__row {
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.25); cursor: pointer;
}
.si4-consent__row strong { display: block; font-size: 14px; font-weight: 600; margin-bottom: 3px; color: #fff; }
.si4-consent__row span { display: block; font-size: 12.5px; font-weight: 300; line-height: 1.35; color: rgba(255,255,255,.75); }
.si4-consent__always { flex: none; font-size: 12px !important; color: var(--si4-lima) !important; text-transform: uppercase; letter-spacing: .05em; }

.si4-switch {
    appearance: none; -webkit-appearance: none; flex: none; position: relative;
    width: 46px; height: 26px; margin: 0; border-radius: 100px; cursor: pointer;
    background: rgba(255,255,255,.25) !important; border: 1px solid #fff !important;
    transition: background-color .25s;
}
.si4-switch::after {
    content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px;
    border-radius: 50%; background: #fff; transition: transform .25s var(--si4-ease), background-color .25s;
}
.si4-switch:checked { background: var(--si4-lima) !important; border-color: var(--si4-lima) !important; }
.si4-switch:checked::after { transform: translateX(20px); background: #000; }
.si4-switch:focus-visible { outline: 2px solid var(--si4-lima); outline-offset: 3px; }

@media (max-width: 768px) {
    .si4-consent { left: 16px; right: 16px; bottom: 16px; width: auto; padding: 22px 20px 18px; }
    .si4-consent__title { font-size: 19px !important; }
}

/* ---------- Páginas legales ---------- */
.si4-legal .elementor-widget-theme-post-content > .elementor-widget-container {
    max-width: 760px; margin: 0 auto !important; padding: 40px 24px 80px; box-sizing: content-box;
}
.si4-legal .elementor-widget-theme-post-content p,
.si4-legal .elementor-widget-theme-post-content li {
    font-size: 17px !important; line-height: 1.7 !important; font-weight: 300; margin: 0 0 1.1em !important;
}
.si4-legal .elementor-widget-theme-post-content ul { padding-left: 1.2em; margin: 0 0 1.4em; }
.si4-legal .elementor-widget-theme-post-content li { margin-bottom: .5em !important; }
.si4-legal .elementor-widget-theme-post-content a {
    font-size: inherit !important; line-height: inherit !important; overflow-wrap: anywhere;
    text-decoration: underline; text-underline-offset: 3px;
}
.si4-legal-h {
    font-family: "Archivo", sans-serif !important; font-size: 22px !important; line-height: 1.2 !important;
    font-weight: 700 !important; text-transform: none; margin: 2.2em 0 .7em !important; letter-spacing: -.01em;
}
.si4-legal-h strong { font-weight: inherit; }
.si4-legal .elementor-widget-theme-post-content .si4-legal-h:first-child { margin-top: 0 !important; }

.si4-cookie-info { margin: 0 0 3em; padding-bottom: 2em; border-bottom: 1px solid currentColor; }
.si4-table-wrap { overflow-x: auto; margin: 1.2em 0 1.4em; }
.si4-table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.45; }
.si4-table th, .si4-table td { text-align: left; vertical-align: top; padding: 10px 12px 10px 0; border-bottom: 1px solid rgba(127,127,127,.35); }
.si4-table th { font-weight: 600; text-transform: uppercase; font-size: 12px; letter-spacing: .06em; }
@media (max-width: 768px) {
    .si4-legal .elementor-widget-theme-post-content p,
    .si4-legal .elementor-widget-theme-post-content li { font-size: 16px !important; }
    .si4-legal-h { font-size: 19px !important; }
}

/* ---------- 4. CONTACTAR en móvil: se esconde al bajar ---------- */
@media (max-width: 768px) {
    #form-trigger-v6 { transition: transform .45s var(--si4-ease), opacity .35s ease; }
    html.si4-hide-cta #form-trigger-v6 { transform: translateY(160%) !important; opacity: 0; pointer-events: none; }
}

/* ---------- 7. Siguiente proyecto ---------- */
.si4-next { padding: 90px 55px 110px; }
.si4-next__link {
    display: grid; grid-template-columns: 1fr minmax(0, 46%); align-items: end; gap: 48px;
    padding-top: 28px; border-top: 1px solid currentColor; color: inherit !important; text-decoration: none !important;
}
.si4-next__eyebrow {
    display: block; font: 400 14px/1 "Archivo", sans-serif; text-transform: uppercase; letter-spacing: .12em;
    margin-bottom: 22px; opacity: .7;
}
.si4-next__title {
    display: block; font: 200 clamp(48px, 8vw, 120px)/.95 "Archivo", sans-serif; letter-spacing: -.02em;
    transition: transform .6s var(--si4-ease);
}
.si4-next__arrow {
    display: inline-block; margin-top: 26px; font: 200 56px/1 "Archivo", sans-serif;
    transition: transform .6s var(--si4-ease);
}
.si4-next__media { display: block; overflow: hidden; aspect-ratio: 3 / 2; background: rgba(127,127,127,.15); }
.si4-next__media img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; transition: transform .9s var(--si4-ease); }
.si4-next__link:hover .si4-next__title { transform: translateX(14px); }
.si4-next__link:hover .si4-next__arrow { transform: translateX(28px); color: var(--si4-lima); }
.si4-next__link:hover .si4-next__media img { transform: scale(1.05); }
.si4-next__link:focus-visible { outline: 2px solid var(--si4-lima); outline-offset: 8px; }
@media (max-width: 768px) {
    .si4-next { padding: 60px 20px 90px; }
    .si4-next__link { grid-template-columns: 1fr; gap: 24px; }
    .si4-next__arrow { font-size: 40px; margin-top: 14px; }
}

/* ---------- 8. Etiqueta del cursor ---------- */
#si4-cursor-label {
    position: fixed; left: 0; top: 0; z-index: 999999; pointer-events: none;
    font: 500 11px/1 "Archivo", sans-serif; text-transform: uppercase; letter-spacing: .14em;
    color: #fff; mix-blend-mode: difference; white-space: nowrap;
    opacity: 0; transition: opacity .2s ease;
}
#si4-cursor-label.is-on { opacity: 1; }

/* ---------- 9. Transiciones entre páginas ---------- */
@view-transition { navigation: auto; }
::view-transition-group(si4-hero) { animation-duration: .7s; animation-timing-function: var(--si4-ease); }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .35s; }
@media (prefers-reduced-motion: reduce) {
    @view-transition { navigation: none; }
}

/* ---------- 6. Formulario por pasos ---------- */
.si4-steps fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.si4-steps fieldset[hidden] { display: none; }
.si4-step.is-active { animation: si4-step-in .45s var(--si4-ease); }
@keyframes si4-step-in { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }
.si4-step__title {
    display: block; padding: 0; margin: 0 0 28px; color: var(--si4-lila);
    font: 200 clamp(26px, 4vw, 40px)/1.05 "Archivo", sans-serif; letter-spacing: -.01em;
}
.si4-steps__progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 0 0 10px; }
.si4-steps__progress span { height: 3px; border-radius: 3px; background: rgba(255,255,255,.22); transition: background-color .4s; }
.si4-steps__progress span.is-done { background: var(--si4-lima); }
.si4-steps__count { margin: 0 0 22px !important; font: 400 12px/1 "Archivo", sans-serif !important; letter-spacing: .12em; color: rgba(255,255,255,.6) !important; }
.si4-label { font-size: 16px; font-weight: bold; margin: 0 0 20px; color: #fff; text-transform: uppercase; }
.si4-optional { font-weight: 400; font-size: 10px; opacity: .6; text-transform: uppercase; }
.si4-steps .jmg-group label { text-transform: uppercase; }
.si4-steps__nav { display: flex; justify-content: flex-end; gap: 10px; }
.si4-steps__nav [hidden] { display: none !important; }
.si4-steps__back { color: #fff !important; margin-right: auto; }
.si4-steps__back:hover { color: #000 !important; }
.si4-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 30px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.25); font: 300 13px/1.3 "Archivo", sans-serif; }
.si4-quick__label { color: rgba(255,255,255,.7); }
.si4-quick__link { color: var(--si4-lima) !important; text-decoration: underline; text-underline-offset: 3px; }
.si4-quick__link[hidden] { display: none; }
.si4-months .btn-check input { display: none; }
@media (max-width: 768px) {
    .si4-step__title { margin-bottom: 18px; }
    .si4-label { font-size: 11px; margin-bottom: 8px; }
    .si4-quick { margin-top: 20px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .si4-step.is-active { animation: none; } }
.si4-quick a, .si4-consent a, .si4-next a, .si4-legal .si4-table a { font-size: inherit !important; font-weight: inherit; line-height: inherit !important; }

/* ---------- 11. Accesibilidad ---------- */
.si4-sr-only {
    position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important;
    margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important;
}
.si4-skip {
    position: fixed; left: 16px; top: -100px; z-index: 1000000;
    padding: 12px 20px; border-radius: 100px; background: var(--si4-lima); color: #000 !important;
    font: 600 14px/1 "Archivo", sans-serif !important; text-decoration: none;
    transition: top .2s;
}
.si4-skip:focus { top: 16px; outline: 2px solid #000; outline-offset: 2px; }
/* foco visible solo al navegar con teclado */
a:focus-visible, button:focus-visible, summary:focus-visible, [role="button"]:focus-visible,
input:focus-visible, textarea:focus-visible, .elementor-menu-toggle:focus-visible {
    outline: 2px solid var(--si4-lima) !important; outline-offset: 3px !important;
}
#contenido:focus { outline: none; }
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important; animation-iteration-count: 1 !important;
        transition-duration: .01ms !important; scroll-behavior: auto !important;
    }
}

/* ---------- Componentes que antes dibujaba el JS de Elementor (si4-site.js) ---------- */
/* Carruseles */
.si4-carousel { overflow: hidden; position: relative; touch-action: pan-y; }
.si4-carousel > .swiper-wrapper {
    display: flex; flex-wrap: nowrap; transition-property: transform;
    transition-timing-function: ease; will-change: transform;
}
.si4-carousel > .swiper-wrapper > .swiper-slide { flex: 0 0 auto; position: relative; user-select: none; }
.si4-carousel img { -webkit-user-drag: none; }
/* Galerías masonry */
.si4-masonry { position: relative; display: block !important; }
.si4-masonry > .e-gallery-item { position: absolute !important; top: 0; left: 0; margin: 0 !important; overflow: hidden; }
.si4-masonry .e-gallery-image {
    width: 100%; height: 100% !important; padding: 0 !important;
    background-size: cover; background-position: center center; background-repeat: no-repeat;
    opacity: 0; transition: opacity .35s ease;
}
.si4-masonry .e-gallery-image.e-gallery-image-loaded { opacity: 1; }
/* Efecto de rotación */
.elementor-motion-effects-element { transition: transform var(--e-transform-transition-duration, 100ms); }