/* =========================================================================
   RENTAS E INVERSIONES ARAUCO — Responsive
   La base se diseña primero para escritorio y aquí se adapta la estructura
   (no solo los tamaños) a tablet y teléfono.
   ========================================================================= */

/* ---------------------------------------------- ≤ 1200px (escritorio pequeño) */
@media (max-width: 1200px) {
    .sitio-footer__rejilla {
        grid-template-columns: 1.5fr 1fr 1fr;
    }

    .sitio-footer__contacto { grid-column: 1 / -1; }
}

/* ---------------------------------------------------------- ≤ 1024px (tablet) */
@media (max-width: 1024px) {
    :root {
        --seccion-y: 76px;
        --contenedor: 100%;
    }

    .rejilla--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
    .rejilla--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }

    .galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .galeria__item--ancho { grid-column: span 2; aspect-ratio: 16 / 7; }

    .datos { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .bloque-texto {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .bloque-texto__imagen { aspect-ratio: 16 / 9; }

    .contacto-rejilla {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .formulario { padding: 32px; }
}

/* -------------------------------------------- ≤ 900px (tablet vertical / menú) */
@media (max-width: 900px) {
    :root {
        --header-alto: 92px;
    }

    /* La navegación horizontal se sustituye por el panel móvil */
    .nav-desktop { display: none; }
    .btn-header  { display: none; }
    .hamburguesa { display: block; }

    .marca__img { height: 68px; }

    .sitio-header__inner { justify-content: space-between; }

    .hero { min-height: 84vh; }
    .hero__inner { padding-block: 64px; }
    .hero--interno { min-height: 46vh; }

    .sitio-footer__rejilla {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 40px 32px;
    }

    .sitio-footer__contacto { grid-column: 1 / -1; }

    .cta-final {
        flex-direction: column;
        align-items: flex-start;
    }

    .datos { grid-template-columns: 1fr; gap: 18px; }
}

/* ------------------------------------------------------ ≤ 768px (tablet pequeña) */
@media (max-width: 768px) {
    :root {
        --seccion-y: 64px;
        --radio-lg: 18px;
    }

    body { font-size: 1rem; }

    .seccion__cabecera { margin-bottom: 40px; }

    .rejilla,
    .rejilla--2,
    .rejilla--3,
    .rejilla--4 {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .galeria { grid-template-columns: 1fr; gap: 16px; }
    .galeria__item,
    .galeria__item--ancho { grid-column: auto; aspect-ratio: 4 / 3; }

    .tarjeta__cuerpo { padding: 22px 22px 24px; }
    .tarjeta:hover { transform: none; }
    .tarjeta:hover .tarjeta__media img { transform: none; }

    .tarjeta-clara { padding: 26px 22px; }
    .tarjeta-clara:hover { transform: none; }

    .formulario { padding: 26px 22px; border-radius: var(--radio); }
    .formulario__rejilla { grid-template-columns: 1fr; gap: 18px; }

    .formulario__pie {
        flex-direction: column;
        align-items: stretch;
    }

    .formulario__pie .btn { width: 100%; }

    .hero__acciones .btn { width: 100%; }
    .hero__acciones { gap: 12px; }

    .contacto-tarjeta { padding: 20px; }
}

/* ----------------------------------------------------------- ≤ 640px (teléfono) */
@media (max-width: 640px) {
    .contenedor { padding-inline: 20px; }

    :root { --header-alto: 84px; }

    .hero {
        min-height: auto;
        padding-top: calc(var(--header-alto) + 24px);
    }

    .hero__inner { padding-block: 48px 56px; }

    .hero__texto { margin-bottom: 32px; }

    .sitio-footer { padding-block: 56px 28px; }

    .sitio-footer__rejilla {
        grid-template-columns: 1fr;
        gap: 36px;
        padding-bottom: 36px;
    }

    .sitio-footer__legal {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .marca__img { height: 62px; }

    .icono-enlace { width: 42px; height: 42px; }
    .hamburguesa { width: 46px; height: 46px; }

    .menu-movil { padding: 28px 20px 24px; }
    .menu-movil__enlace { font-size: 1.25rem; padding: 14px 4px; }

    .aviso__acciones { flex-direction: column; }
    .aviso__acciones .btn { width: 100%; }
}

/* --------------------------------------------------------- ≤ 400px (muy pequeño) */
@media (max-width: 400px) {
    .hero__nombre { font-size: 2.5rem; }
    .btn { padding: 15px 22px; font-size: .875rem; }
    .marca__img { height: 60px; }
}