/* ==========================================================================
   MOBILE / RESPONSIVE — Multifranquicias Holding
   Solo adaptaciones para pantallas < 780px y refinamientos tablet.
   NO modifica el diseño desktop.
   ========================================================================== */

/* ─── GLOBAL OVERRIDES ─── */

@media (max-width: 779px) {
  :root {
    --page-margin: 20px;
  }

  body {
    overflow-x: hidden;
  }

  /* ── Header ── */
  .d-header-inner {
    padding: 10px 16px;
  }

  .d-logo {
    height: 28px;
  }

  #mobile-menu {
    background: #fff;
    padding: 16px 20px 20px;
  }

  #mobile-menu .nav-link {
    font-size: 14px;
    padding: 8px 0;
  }

  /* ── Hero / First View ── */
  .d-first-view {
    min-height: calc(100vh - var(--preview-height));
    min-height: calc(100dvh - var(--preview-height));
  }

  /* ── Stats Slider ── */
  #stats-slider-content.d-stats,
  .d-stats {
    padding: 16px 0;
    gap: 10px;
  }

  .d-number {
    font-size: 42px;
  }

  .d-label {
    font-size: 12px;
  }

  .d-text {
    font-size: 13px;
  }

  .d-btn {
    font-size: 11px !important;
    height: 32px !important;
    padding: 0 18px !important;
  }

  /* ── News Cards ── */
  .d-noticias-inner {
    padding: 28px 0 28px 20px;
  }

  .d-noticias-title {
    font-size: 22px;
    margin-left: 0;
    margin-bottom: 16px;
  }

  .d-news-card {
    height: 320px;
    border-radius: 20px;
  }

  .d-news-card--main {
    width: 85%;
  }

  .d-news-card--side {
    width: calc(30% - 12px);
    border-radius: 20px 0 0 20px;
  }

  .d-card-main-inner {
    padding: 16px 20px;
  }

  .d-badge {
    width: 130px;
    height: 30px;
    font-size: 12px;
    margin-left: 10px;
    margin-top: 16px;
  }

  .d-card-titulo {
    left: 24px;
    top: 90px;
    font-size: 16px !important;
    max-width: 220px;
  }

  .d-card-main-inner .d-leer-mas {
    left: 24px;
    bottom: 24px;
  }

  .d-leer-mas {
    font-size: 12px !important;
  }

  .d-leer-mas-arrow {
    width: 14px;
    height: 14px;
  }

  /* ── Noticias reveal bg ── */
  .d-noticias-reveal {
    padding-bottom: calc(60vh - var(--hh, 0px));
  }

  /* ── Footer ── */
  .d-footer {
    padding-top: 24px;
  }

  .d-footer-topline,
  .d-footer-bottomline {
    margin: 0 20px;
    width: auto;
  }

  .d-footer-body {
    flex-direction: column;
    gap: 24px;
    padding: 24px 20px;
    width: auto;
  }

  .d-footer-brand {
    flex: none;
    width: 100%;
    transform: none;
  }

  .d-footer-brand .d-footer-tagline {
    max-width: 100% !important;
    width: auto !important;
    font-size: 15px !important;
  }

  .d-footer-cols-center {
    flex-direction: column;
    gap: 24px;
    padding-left: 0;
    transform: none;
  }

  .d-footer-right {
    margin-left: 0;
    align-items: flex-start;
    transform: none;
  }

  .d-footer-legal {
    text-align: left;
    max-width: 100%;
    font-size: 12px !important;
  }

  .d-footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 16px 20px;
    transform: none;
    width: auto;
  }

  .d-footer-bottom-links {
    flex-wrap: wrap;
    gap: 8px 16px;
  }

  .d-footer-bottom-links a,
  .d-footer-bottom-links .d-footer-disabled {
    font-size: 12px !important;
  }

  .d-footer-copy-group {
    margin-left: 0;
    flex-wrap: wrap;
    gap: 8px;
  }

  .d-footer-copy {
    font-size: 12px !important;
    padding-right: 0;
  }

  /* ── Shared form responsive (inline-styled grids) ── */
  [style*="grid-template-columns: 1fr 1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Franchise form flex container (title + form side by side) */
  #quiero-franquiciar>div[style*="display:flex"],
  #quiero-franquiciar>div[style*="display: flex"],
  section[style*="display:flex"][style*="gap: 80px"],
  section[style*="display:flex"][style*="gap:80px"] {
    flex-direction: column !important;
    gap: 24px !important;
  }

  #quiero-franquiciar,
  section[id="quiero-franquiciar"] {
    padding: 40px 20px !important;
  }

  /* reCAPTCHA + submit row */
  #quiero-franquiciar div[style*="display:flex"][style*="justify-content:space-between"] {
    flex-direction: column !important;
    gap: 16px !important;
    align-items: flex-start !important;
  }

  #quiero-franquiciar div[style*="display:flex"][style*="gap:16px"] {
    flex-direction: column !important;
    gap: 12px !important;
  }

  /* reCAPTCHA scaling on small screens */
  .g-recaptcha {
    transform: scale(0.85);
    transform-origin: left top;
  }
}

/* ─────────────────────────────────────────────────────
   FOOTER HOME — MOCKUP MOBILE
───────────────────────────────────────────────────── */
@media (max-width: 779px) {
  .d-footer {
    --footer-mockup-margin: max(17px, env(safe-area-inset-left));
  }

  .d-footer::before {
    display: none;
  }

  .d-footer-topline {
    display: none !important;
  }

  .d-footer-body {
    position: relative;
    gap: 0;
    padding: 22px 0 0;
    margin-left: var(--footer-mockup-margin);
    margin-right: max(17px, env(safe-area-inset-right));
  }

  .d-footer-brand {
    order: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 13px;
  }

  .d-footer-brand img,
  .d-footer-logo {
    width: 44px;
    height: 44px;
  }

  .d-footer-brand .d-footer-tagline {
    max-width: 205px !important;
    font-size: 14px !important;
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: .01em;
  }

  /* Las redes se conservan como elementos del DOM, pero ocupan la cabecera del mockup. */
  .d-footer-right {
    display: contents;
  }

  .d-footer-socials {
    position: absolute;
    top: 22px;
    right: 0;
    display: flex;
    gap: 9px;
    transform: none;
  }

  .d-social-icon {
    width: 32px;
    height: 32px;
  }

  .d-footer-legal {
    order: 2;
    align-self: flex-start;
    width: 100%;
    max-width: 300px;
    margin: 20px 0 23px;
    font-size: 11px !important;
    line-height: 1.55;
    color: rgba(255, 255, 255, .68);
    text-align: left;
  }

  .d-footer-cols-center {
    order: 3;
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    padding: 0;
    border-top: 1px solid rgba(255, 255, 255, .16);
  }

  .d-footer-col {
    position: relative;
    gap: 13px;
    padding: 20px 0 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .16);
  }

  .d-footer-heading {
    margin: 0 0 6px;
    font-size: 12px !important;
  }

  .d-footer-heading::after {
    content: '⌃';
    position: absolute;
    top: 18px;
    right: 2px;
    color: rgba(255, 255, 255, .5);
    font-family: Arial, sans-serif;
    font-size: 15px;
    line-height: 1;
  }

  .d-footer-link {
    font-size: 13px !important;
    color: rgba(255, 255, 255, .86);
  }

  .d-footer-bottomline {
    display: none !important;
  }

  .d-footer-bottom {
    gap: 24px;
    padding: 25px 0 max(25px, env(safe-area-inset-bottom));
    margin-left: var(--footer-mockup-margin);
    margin-right: max(17px, env(safe-area-inset-right));
  }

  .d-footer-bottom-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: initial;
    gap: 16px 20px;
    text-align: left;
  }

  .d-footer-bottom-links a,
  .d-footer-bottom-links .d-footer-disabled {
    font-size: 11px !important;
    line-height: 1.25;
    color: rgba(255, 255, 255, .58);
  }

  .d-footer-copy-group {
    display: flex;
    justify-content: flex-start;
    gap: 7px;
    flex-wrap: wrap;
  }

  .d-footer-copy {
    font-size: 10px !important;
    color: rgba(255, 255, 255, .5);
  }

  .d-footer-arqons {
    height: 16px;
    max-width: none;
  }
}

/* ─────────────────────────────────────────────────────
   FOOTER — COMPOSICIÓN MOBILE
───────────────────────────────────────────────────── */
@media (max-width: 779px) {
  .d-footer {
    --footer-edge-space: 28px;
    --footer-content-edge: 48px;
    padding: 0;
    position: relative;
  }

  /* Separador superior anclado al footer: evita que el div vacío se colapse. */
  .d-footer::before {
    content: '';
    position: absolute;
    top: var(--footer-edge-space);
    left: max(20px, env(safe-area-inset-left));
    right: max(20px, env(safe-area-inset-right));
    height: 1px;
    background: rgba(255, 255, 255, .7);
    z-index: 1;
  }

  .d-footer-topline {
    display: none !important;
  }

  .d-footer-bottomline {
    display: block !important;
    width: auto;
    margin-left: max(20px, env(safe-area-inset-left));
    margin-right: max(20px, env(safe-area-inset-right));
    height: 1px !important;
    min-height: 1px;
    background-color: rgba(255, 255, 255, .7) !important;
    transform: none !important;
    opacity: 1 !important;
  }

  .d-footer-body,
  .d-footer-bottom {
    width: auto;
    margin-left: max(20px, env(safe-area-inset-left));
    margin-right: max(20px, env(safe-area-inset-right));
  }

  .d-footer-body {
    display: flex;
    flex-direction: column;
    gap: 28px;
    padding: var(--footer-content-edge) 0 12px;
  }

  .d-footer-brand {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 38px;
    transform: none;
  }

  .d-footer-brand img,
  .d-footer-logo {
    width: 46px;
    height: auto;
  }

  .d-footer-brand .d-footer-tagline {
    max-width: min(250px, calc(100vw - 116px)) !important;
    margin: 0;
    font-size: 14px !important;
    line-height: 1.32;
    letter-spacing: .06em;
  }

  .d-footer-cols-center {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 28px 20px;
    padding: 0;
    transform: none;
  }

  .d-footer-col {
    min-width: 0;
    gap: 7px;
  }

  .d-footer-heading {
    margin-bottom: 3px;
    font-size: 12px !important;
  }

  .d-footer-link {
    font-size: 13px !important;
    line-height: 1.3;
  }

  .d-footer-right {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    width: 100%;
    gap: 14px;
    margin: 0;
  }

  .d-footer-socials {
    gap: 10px;
    align-self: start;
    transform: none;
  }

  .d-social-icon {
    width: 32px;
    height: 32px;
  }

  .d-footer-legal {
    max-width: none;
    margin: 0;
    font-size: 12px !important;
    line-height: 1.55;
    align-self: center;
    text-align: left;
  }

  .d-footer-bottom {
    gap: 18px;
    padding: 16px 0 max(var(--footer-content-edge), env(safe-area-inset-bottom));
  }

  .d-footer-bottom-links {
    display: flex;
    justify-content: center;
    width: 100%;
    gap: 8px 14px;
    line-height: 1.35;
    text-align: center;
  }

  .d-footer-bottom-links a,
  .d-footer-bottom-links .d-footer-disabled,
  .d-footer-copy {
    font-size: 11px !important;
  }

  .d-footer-copy-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 8px;
    flex-wrap: nowrap;
  }

  .d-footer-copy {
    white-space: nowrap;
    font-size: clamp(9px, 2.75vw, 11px) !important;
    line-height: 1.2;
  }

  .d-footer-arqons {
    height: clamp(16px, 4.5vw, 18px);
    max-width: 34vw;
    object-fit: contain;
  }
}

/* ─────────────────────────────────────────────────────
   HOME — COMPOSICIÓN MOBILE
   Esta capa queda al final para aislar por completo la portada móvil.
───────────────────────────────────────────────────── */
@media (max-width: 779px) {

  /* El encabezado queda deliberadamente bajo y respeta el área segura. */
  body>header {
    min-height: 48px;
  }

  .d-header-inner {
    min-height: 48px;
    padding: max(8px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 8px max(16px, env(safe-area-inset-left));
  }

  .d-logo {
    height: clamp(25px, 7vw, 28px);
  }

  #mobile-menu-btn {
    width: 32px;
    height: 32px;
    margin-right: -4px;
  }

  /* El video siempre llega a ambos bordes y conserva su recorte vertical. */
  .d-first-view {
    min-height: min(70svh, 560px);
    min-height: min(70dvh, 560px);
  }

  .d-hero,
  #hero,
  #hero-video {
    width: 100%;
  }

  #hero-video {
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
  }

  /* Cifras: una única columna centrada, CTA y paginación debajo. */
  #stats-slider {
    min-height: 0;
    padding: clamp(22px, 6vw, 30px) max(20px, env(safe-area-inset-right)) clamp(20px, 5vw, 26px) max(20px, env(safe-area-inset-left)) !important;
  }

  #stats-slider-content.d-stats,
  #stats-slider-content {
    width: min(100%, 430px) !important;
    gap: 10px;
    padding: 0 !important;
  }

  #stats-slider .d-number {
    font-size: clamp(52px, 15vw, 64px);
    line-height: .92;
  }

  #stats-slider .d-label {
    margin-top: 7px;
    font-size: clamp(12px, 3.4vw, 14px);
    line-height: 1.2;
    white-space: normal;
  }

  #stats-slider .d-copy {
    gap: 11px;
  }

  #stats-slider .d-text {
    font-size: clamp(12px, 3.4vw, 14px);
    line-height: 1.35;
  }

  #stats-slider .d-btn {
    min-width: 164px;
    height: 34px !important;
    padding-inline: 20px !important;
    font-size: 11px !important;
  }

  /* Tailwind las oculta hasta desktop; aquí vuelven a formar la paginación móvil. */
  #stats-dots.d-dots {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 3px auto 0 !important;
  }

  #stats-dots .stat-dot {
    width: 7px;
    height: 7px;
  }

  /* Noticias: un solo foco visual de ancho fluido; la siguiente queda fuera del viewport. */
  #noticias .d-noticias-inner {
    padding: clamp(28px, 8vw, 36px) 3vw clamp(32px, 8vw, 42px) max(20px, env(safe-area-inset-left));
  }

  #noticias .d-noticias-title {
    margin: 0 0 18px;
    font-size: clamp(20px, 5.8vw, 24px);
    line-height: 1.1;
  }

  #noticias .d-news-viewport {
    padding-right: max(1vw, env(safe-area-inset-right));
  }

  #noticias .d-news-track {
    gap: 16px;
  }

  #noticias .d-news-card,
  #noticias .d-news-card--main {
    width: 100%;
    height: clamp(300px, 82vw, 350px);
    border-radius: 22px;
  }

  #noticias .d-news-card--side {
    width: 30%;
    height: clamp(300px, 82vw, 350px);
    border-radius: 22px 0 0 22px;
  }

  #noticias .d-card-main-inner {
    padding: 0;
  }

  #noticias .d-badge {
    width: fit-content;
    min-width: 0;
    height: 28px;
    margin: 18px 0 0 18px;
    padding: 0 15px;
    font-size: 10px;
  }

  #noticias .d-card-titulo {
    top: auto;
    bottom: 57px;
    left: 20px;
    max-width: min(75%, 270px);
    font-size: clamp(17px, 4.6vw, 20px) !important;
    line-height: 1.24;
  }

  #noticias .d-card-main-inner .d-leer-mas {
    left: 20px;
    bottom: 20px;
  }

  #noticias .d-leer-mas {
    font-size: 11px !important;
  }

  #noticias .d-leer-mas-arrow {
    width: 15px;
    height: 15px;
  }

  /* La imagen mantiene el tratamiento de portada aunque la tarjeta sea vertical. */
  #noticias .d-news-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .d-noticias-reveal {
    padding-bottom: 0;
  }
}

/* ─────────────────────────────────────────────────────
   SOBRE NOSOTROS
───────────────────────────────────────────────────── */

@media (max-width: 779px) {

  /* Scroll-linked panels: stack vertically — disable scroll-locking */
  .sn-spacer {
    height: auto !important;
    display: none !important;
  }

  .sn-stage {
    position: relative !important;
    height: auto !important;
    display: flex;
    flex-direction: column;
    z-index: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }

  .sn-stage.sn-hidden {
    display: flex !important;
  }

  .sn-panel {
    position: relative !important;
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: auto;
  }

  .sn-half {
    height: auto !important;
    min-height: 0;
    transform: none;
  }

  .sn-half--img {
    height: 50vw;
    min-height: 200px;
  }

  .sn-half--img img {
    opacity: 1 !important;
  }

  .sn-half--text>* {
    opacity: 1 !important;
    transform: none !important;
  }

  .sn-panel {
    opacity: 1 !important;
  }

  .sn-half--text {
    padding: 32px 24px !important;
    padding-top: 32px !important;
  }

  .sn-title {
    font-size: 24px;
    margin-bottom: 12px;
  }

  .sn-desc {
    font-size: 14px !important;
  }

  /* Nuestra Historia: make static instead of sticky scroll */
  #nh-container {
    height: auto !important;
  }

  .nh-section {
    position: relative !important;
    top: auto !important;
    height: auto !important;
    min-height: auto !important;
    padding: 24px 20px 40px !important;
    overflow: visible !important;
  }

  .nh-heading {
    position: static !important;
    margin-bottom: 20px;
    font-size: 20px;
  }

  .nh-body {
    grid-template-columns: 1fr !important;
    gap: 24px;
  }

  .nh-left {
    transform: none !important;
    margin-top: 0;
  }

  .nh-year {
    font-size: 48px !important;
  }

  .nh-brand {
    font-size: 18px !important;
  }

  .nh-desc {
    font-size: 14px !important;
    max-width: 100% !important;
  }

  .nh-divider {
    display: none !important;
  }

  .nh-right {
    justify-content: center;
  }

  .nh-img {
    max-height: 40vh;
    max-width: 80%;
  }

  .nh-dots {
    flex-direction: row;
    height: auto;
    padding: 16px 0;
  }

  .sn-below {
    z-index: auto !important;
  }

  /* Stats in sobre-nosotros */
  .sn-stats {
    flex-direction: column !important;
    gap: 24px !important;
    padding: 32px 20px !important;
  }

  .sn-stat-number {
    font-size: 48px !important;
  }

  .sn-stat-label {
    font-size: 14px !important;
  }

  /* Reveal section */
  .sn-reveal {
    height: 40vh;
  }
}

/* ─────────────────────────────────────────────────────
   NUESTRAS MARCAS
───────────────────────────────────────────────────── */

@media (max-width: 779px) {
  .nm-hero-inner {
    grid-template-columns: 1fr !important;
  }

  .nm-img-wrap {
    max-width: 100%;
    height: auto;
  }

  .nm-slide {
    max-width: 100%;
  }

  .nm-brand-bar {
    overflow: hidden;
  }

  .nm-brand-item {
    padding: 0 24px !important;
    font-size: 12px !important;
    height: 48px !important;
  }

  /* Brand detail overlay */
  .nm-brand-detail {
    flex-direction: column !important;
  }

  .nm-brand-detail>div:first-child {
    width: 100% !important;
    padding: 24px 20px !important;
  }

  .nm-brand-detail .nm-brand-photos {
    width: 100% !important;
  }

  .nm-brand-photos img {
    width: 100% !important;
    height: auto !important;
  }
}

/* ─────────────────────────────────────────────────────
   CHINAWOK
───────────────────────────────────────────────────── */

@media (max-width: 779px) {
  #cw-outer {
    height: auto !important;
  }

  #cw-sticky {
    position: relative !important;
    top: auto !important;
    height: auto !important;
    min-height: auto !important;
  }

  #cw-info {
    position: relative !important;
    width: 100% !important;
    padding: 32px 20px !important;
    left: auto !important;
    top: auto !important;
  }

  /* Photos: stack as scrollable row */
  #cw-photos-wrap {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  #cw-photos-inner {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    padding: 0 20px !important;
  }

  .cw-photo {
    width: 75vw !important;
    height: 50vw !important;
    flex-shrink: 0 !important;
  }

  #cw-hint {
    display: none !important;
  }

  /* Stats */
  #cw-stats {
    padding: 32px 20px !important;
  }

  #cw-stats-top {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
    max-height: none !important;
  }

  #cw-stats-left {
    padding: 24px 0 !important;
  }

  #cw-count-wrap {
    flex-direction: column !important;
    gap: 16px !important;
  }

  /* Formatos: from 7-col to 2-col */
  .cw-formato-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
  }

  .cw-formato-divider {
    display: none !important;
  }

  #cw-formatos {
    padding: 32px 20px !important;
  }

  /* Reveal */
  .cw-reveal {
    height: 40vh;
  }
}

/* ─────────────────────────────────────────────────────
   NUESTRA GENTE
───────────────────────────────────────────────────── */

@media (max-width: 779px) {

  /* Culture hero section */
  .cu-left {
    flex: none !important;
    width: 100% !important;
    padding: 32px 20px !important;
  }

  .cu-title {
    font-size: 24px !important;
  }

  .cu-right {
    width: 100% !important;
    height: 50vw !important;
    min-height: 200px;
  }

  /* Culture cards: already handled by 900px breakpoint in the page, reinforce */
  .cu-card {
    grid-template-columns: 1fr !important;
    height: auto !important;
    margin-bottom: 24px !important;
  }

  .cu-card-text {
    padding: 24px 20px !important;
  }

  .cu-card-img {
    height: 50vw !important;
    min-height: 200px;
  }

  /* Historias carousel: 1 card visible */
  .historia-card {
    flex: 0 0 85% !important;
    min-width: 260px !important;
  }

  .hi-desc {
    white-space: normal !important;
    overflow: visible !important;
  }

  .hi-section {
    padding: 32px 20px !important;
  }

  .hi-head {
    flex-direction: column !important;
    gap: 12px !important;
    align-items: flex-start !important;
  }

  /* Stats area */
  #stats-outer {
    height: auto !important;
  }

  /* KPIs fade */
  #stats-slider-content>* {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ─────────────────────────────────────────────────────
   QUIERO FRANQUICIAR
───────────────────────────────────────────────────── */

@media (max-width: 779px) {

  /* Hero */
  .qf-hero {
    height: 50vh !important;
    min-height: 280px;
  }

  .qf-hero-content {
    padding: 0 20px !important;
  }

  .qf-hero-title {
    font-size: 28px;
  }

  .qf-hero-sub {
    font-size: 14px;
    margin-bottom: 20px;
  }

  /* Scroll-linked "¿Por qué?": make static stacked panels */
  .qf-wrapper {
    height: auto !important;
  }

  .qf-stage {
    position: relative !important;
    height: auto !important;
    overflow: visible !important;
  }

  .qf-stage-inner {
    overflow: visible !important;
  }

  .qf-panels-track {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    will-change: auto !important;
  }

  .qf-img-half img[data-parallax] {
    transform: none !important;
    will-change: auto !important;
  }

  .qf-panel {
    width: 100% !important;
    height: auto !important;
    grid-template-columns: 1fr !important;
    min-height: auto;
  }

  .qf-section-label {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    padding: 32px 20px 0;
    font-size: 20px;
  }

  .qf-text-half {
    padding: 24px 20px !important;
  }

  .qf-img-half {
    height: 50vw;
    min-height: 200px;
    overflow: hidden;
  }

  .qf-img-half img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .qf-number {
    font-size: 42px;
  }

  .qf-item-desc {
    font-size: 14px;
  }

  .qf-progress-dots {
    display: none !important;
  }

  /* Brand wipe section: make static stacked */
  .nm-wrapper {
    height: auto !important;
  }

  .nm-stage {
    position: relative !important;
    height: auto !important;
    overflow: visible !important;
  }

  .nm-stage-inner {
    display: flex;
    flex-direction: column;
  }

  .nm-track {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    height: auto !important;
  }

  .nm-panel {
    position: relative !important;
    clip-path: none !important;
    height: 60vw !important;
    min-height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .nm-product {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    height: 70% !important;
    max-width: 70% !important;
  }

  .nm-divider {
    display: none !important;
  }

  .nm-info-layer {
    position: relative !important;
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .nm-brand-info {
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    opacity: 1 !important;
    padding: 16px 20px;
    max-width: 100% !important;
    width: 100% !important;
    background: #272022;
  }

  .nm-left-overlay {
    position: relative !important;
    width: 100% !important;
    padding: 24px 20px !important;
    background: #272022;
  }

  .nm-main-title {
    font-size: 20px;
  }

  /* "Nos Adaptamos" section: make static */
  .na-wrapper {
    height: auto !important;
  }

  .na-stage {
    position: relative !important;
    height: auto !important;
    min-height: 100vh;
    overflow: visible !important;
  }

  .na-title {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    padding: 32px 20px 16px;
    font-size: 20px;
  }

  .na-circle {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: 80vw !important;
    height: 80vw !important;
    margin: 24px auto;
  }

  .na-vline,
  .na-hline {
    display: none !important;
  }

  .na-quad {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    opacity: 1 !important;
    padding: 20px !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
  }

  /* ¿Dónde podrás participar? */
  .dp-grid {
    grid-template-columns: 1fr 1fr !important;
    width: 90% !important;
  }

  .dp-title {
    padding: 0 20px !important;
    font-size: 20px !important;
  }

  /* Form section */
  #quiero-franquiciar-form {
    padding: 40px 20px !important;
  }
}

/* ─────────────────────────────────────────────────────
   IMPACTO
───────────────────────────────────────────────────── */

@media (max-width: 779px) {
  .im-mercados {
    padding: 32px 20px !important;
  }

  .im-inner {
    grid-template-columns: 1fr !important;
    transform: none !important;
    gap: 24px !important;
  }

  .im-title {
    font-size: 22px !important;
  }

  .im-map-wrap {
    width: 100% !important;
    margin-left: 0 !important;
    transform: none !important;
  }

  .im-list {
    transform: none !important;
    padding: 0 !important;
  }

  .im-callout {
    display: none !important;
  }

  /* Scroll-linked panels: static */
  .ip-spacer {
    height: auto !important;
    display: block;
  }

  .ip-stage {
    position: relative !important;
    height: auto !important;
    display: flex;
    flex-direction: column;
  }

  .ip-panel,
  .ip-panel-static {
    position: relative !important;
    grid-template-columns: 1fr !important;
    height: auto !important;
    opacity: 1 !important;
  }

  .ip-half {
    height: auto !important;
  }

  .ip-half--img {
    height: 50vw !important;
    min-height: 200px;
  }

  .ip-half--img img {
    transform: none !important;
  }

  .ip-half--text {
    padding: 24px 20px !important;
  }
}

/* ─────────────────────────────────────────────────────
   OPORTUNIDADES / ENVIAR CV
───────────────────────────────────────────────────── */

@media (max-width: 779px) {
  .page-pm {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 100px !important;
  }

  .left-title {
    width: 100% !important;
    position: static !important;
    margin-bottom: 16px;
  }

  .list-body {
    flex-direction: column !important;
  }

  .filters-row {
    grid-template-columns: 1fr !important;
  }

  .white-card,
  .dark-card {
    padding: 20px !important;
  }

  /* Job listing */
  .job-row {
    flex-direction: column !important;
    gap: 8px !important;
    align-items: flex-start !important;
  }

  .job-meta {
    flex-wrap: wrap !important;
    gap: 4px 8px !important;
  }

  /* Apply form grids */
  .form-grid {
    grid-template-columns: 1fr !important;
  }

  .col-span-2 {
    grid-column: span 1 !important;
  }

  /* Apply view */
  .apply-body {
    flex-direction: column !important;
    gap: 16px !important;
  }

  .apply-meta-chip {
    font-size: 12px !important;
  }

  /* CV bar */
  .cv-bar {
    flex-direction: column !important;
    gap: 12px !important;
    padding: 16px 20px !important;
  }

  .cv-bar-text {
    font-size: 14px !important;
  }

  /* CV shift override */
  .cv-shift {
    padding-left: 20px !important;
  }

  /* Upload box */
  .upload-box,
  .upload-box-dark {
    padding: 24px 16px !important;
  }

  /* Page header */
  .page-header {
    font-size: 22px !important;
  }
}

/* ─────────────────────────────────────────────────────
   LEGAL PAGES (libro, privacidad, cookies, términos)
───────────────────────────────────────────────────── */

@media (max-width: 779px) {
  .lg-hero {
    padding: 60px 20px 32px !important;
  }

  .lg-title {
    font-size: 24px !important;
  }

  .lg-body {
    padding: 24px 20px !important;
  }
}

/* ─────────────────────────────────────────────────────
   TABLET REFINEMENTS (780-939px)
───────────────────────────────────────────────────── */

@media (min-width: 780px) and (max-width: 939px) {
  /* Stats slider: already has grid from 780px breakpoint in styles.css */

  /* Form grids: keep 2-col */
  [style*="grid-template-columns:1fr 1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr 1fr"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* Franchise form: reduce gap */
  #quiero-franquiciar>div[style*="gap: 80px"],
  #quiero-franquiciar>div[style*="gap:80px"] {
    gap: 32px !important;
  }

  /* Quiero Franquiciar scroll panels */
  .qf-text-half {
    padding-left: 40px !important;
  }

  .qf-section-label {
    left: 40px !important;
  }

  /* Chinawok */
  #cw-info {
    padding-left: 40px !important;
  }

  .cw-formato-grid {
    grid-template-columns: repeat(4, auto) !important;
  }
}

/* ─────────────────────────────────────────────────────
   SMALL PHONE (320px)
───────────────────────────────────────────────────── */

@media (max-width: 374px) {
  .d-number {
    font-size: 36px;
  }

  .d-noticias-title {
    font-size: 18px;
  }

  .d-news-card {
    height: 260px;
  }

  .d-badge {
    width: 110px;
    height: 26px;
    font-size: 10px;
  }

  .qf-hero-title {
    font-size: 24px;
  }

  .qf-number {
    font-size: 36px;
  }

  .dp-grid {
    grid-template-columns: 1fr !important;
  }

  .g-recaptcha {
    transform: scale(0.75);
  }

  .sn-title {
    font-size: 20px;
  }

  .na-circle {
    width: 85vw !important;
    height: 85vw !important;
  }

  .cw-photo {
    width: 85vw !important;
  }
}

/* ─────────────────────────────────────────────────────
   FORCE VISIBILITY FOR SCROLL-ANIMATED ELEMENTS
   On mobile, scroll-linked animations are disabled, so
   all content should be visible immediately.
───────────────────────────────────────────────────── */

@media (max-width: 779px) {

  .mf-fade,
  .idx-fade,
  .sn-panel .sn-half--img img,
  .sn-panel .sn-half--text>*,
  #qf-why-wrapper .qf-section-label,
  #qf-why-wrapper .qf-panel .qf-item-wrap>*,
  #qf-why-wrapper .qf-panel .qf-img-half,
  #donde-participar .dp-title,
  #donde-participar .dp-item,
  .cw-fade-in,
  .im-fade-in,
  .nm-fade,
  .cu-in,
  .cu-title,
  .cu-value,
  .cu-desc,
  .ng-in,
  .im-title,
  .im-desc,
  .im-btn,
  .ip-panel,
  .ip-half--text>*,
  .ip-half--img img,
  .sn-title,
  .sn-desc,
  .lg-title,
  .lg-updated,
  .hi-head,
  .historia-card,
  .d-text,
  [class*="fade"] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ─────────────────────────────────────────────────────
   PREVENT HORIZONTAL OVERFLOW
───────────────────────────────────────────────────── */

@media (max-width: 779px) {
  html {
    overflow-x: hidden;
  }

  img,
  video {
    max-width: 100%;
    height: auto;
  }

  /* Don't apply to images inside specific containers that need different sizing */
  .sn-half--img img,
  .ip-half--img img,
  .cu-card-img img,
  .qf-img-half img,
  .nm-panel img,
  .d-news-card img,
  .d-hero img,
  .qf-hero-bg,
  .na-circle img {
    max-width: none;
  }
}

/* =========================================================
   CENTRADO 100% DEL BLOQUE DE ESTADÍSTICAS — MOBILE
   ========================================================= */

@media (max-width: 779px) {

  #stats-slider {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }

  #stats-slider-content.d-stats,
  #stats-slider-content {
    width: 100% !important;
    max-width: 100% !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-inline: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    text-align: center !important;
  }

  #stats-slider .d-figure {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    margin: 0 auto !important;
  }

  #stats-slider .d-number,
  #stats-slider .d-label {
    width: 100% !important;
    display: block !important;
    text-align: center !important;
  }

  #stats-slider .d-copy {
    width: 100% !important;
    max-width: 100% !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 auto !important;
    padding: 0 !important;

    text-align: center !important;
  }

  #stats-slider .d-text {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    text-align: center !important;
  }

  #stats-slider .d-btn {
    margin-left: auto !important;
    margin-right: auto !important;
    align-self: center !important;
  }

  /* =========================================================
   FADE DE CAMBIO DE ESTADÍSTICAS — MOBILE
   ========================================================= */

  @media (max-width: 779px) {

    #stats-slider-content .d-figure,
    #stats-slider-content .d-copy {
      transition:
        opacity 0.45s ease,
        transform 0.45s ease;
    }

    #stats-slider-content.stats-changing .d-figure,
    #stats-slider-content.stats-changing .d-copy {
      opacity: 0;
      transform: translateY(8px);
    }

    #stats-slider-content.stats-changing {
      pointer-events: none;
    }

  }
}

/* Capa final: mockup del footer, aislada a teléfonos. */
@media (max-width: 779px) {
  .d-footer {
    --footer-mockup-margin: max(17px, env(safe-area-inset-left));
  }

  .d-footer::before,
  .d-footer-topline,
  .d-footer-bottomline {
    display: none !important;
  }

  .d-footer-body {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 22px 0 0;
    margin-left: var(--footer-mockup-margin);
    margin-right: max(17px, env(safe-area-inset-right));
  }

  .d-footer-brand {
    order: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 13px;
    transform: none;
  }

  .d-footer-brand img,
  .d-footer-logo {
    width: 44px;
    height: 44px;
  }

  .d-footer-brand .d-footer-tagline {
    max-width: 205px !important;
    margin: 0;
    font-size: 14px !important;
    font-weight: 700;
    line-height: 1.28;
    letter-spacing: .01em;
  }

  .d-footer-right {
    display: contents;
  }

  .d-footer-socials {
    position: absolute;
    top: 22px;
    right: 0;
    display: flex;
    gap: 9px;
    transform: none;
  }

  .d-social-icon {
    width: 32px;
    height: 32px;
  }

  .d-footer-legal {
    order: 2;
    width: 100%;
    max-width: 300px;
    margin: 20px 0 23px;
    font-size: 11px !important;
    line-height: 1.55;
    color: rgba(255, 255, 255, .68);
    text-align: left;
  }

  .d-footer-cols-center {
    order: 3;
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    padding: 0;
    transform: none;
    border-top: 1px solid rgba(255, 255, 255, .16);
  }

  .d-footer-col {
    position: relative;
    gap: 13px;
    padding: 20px 0 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .16);
  }

  .d-footer-heading {
    margin: 0 0 6px;
    font-size: 12px !important;
  }

  .d-footer-heading {
    cursor: pointer;
  }

  .d-footer-heading::after {
    content: '⌃';
    position: absolute;
    top: 18px;
    right: 2px;
    color: rgba(255, 255, 255, .5);
    font: 15px/1 Arial, sans-serif;
  }

  .d-footer-link {
    font-size: 13px !important;
    color: rgba(255, 255, 255, .86);
  }

  .d-footer-col.is-collapsed {
    padding-bottom: 19px;
  }

  .d-footer-col.is-collapsed .d-footer-link {
    display: none;
  }

  .d-footer-col.is-collapsed .d-footer-heading {
    margin-bottom: 0;
  }

  .d-footer-col.is-collapsed .d-footer-heading::after {
    transform: rotate(180deg);
  }

  .d-footer-bottom {
    gap: 24px;
    padding: 25px 0 max(25px, env(safe-area-inset-bottom));
    margin-left: var(--footer-mockup-margin);
    margin-right: max(17px, env(safe-area-inset-right));
  }

  .d-footer-bottom-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: initial;
    width: 100%;
    gap: 16px 20px;
    text-align: left;
  }

  .d-footer-bottom-links a,
  .d-footer-bottom-links .d-footer-disabled {
    font-size: 11px !important;
    line-height: 1.25;
    color: rgba(255, 255, 255, .58);
  }

  .d-footer-copy-group {
    justify-content: space-between;
    width: 100%;
    gap: 6px;
    flex-wrap: nowrap;
  }

  .d-footer-copy {
    white-space: nowrap;
    font-size: clamp(8.5px, 2.5vw, 10px) !important;
    color: rgba(255, 255, 255, .5);
  }

  .d-footer-powered {
    flex: 0 0 auto;
  }

  .d-footer-arqons {
    height: 16px;
    max-width: 29vw;
  }
}

/* =========================================================
   FOOTER MOBILE — ALINEACIÓN DE TEXTOS
   ========================================================= */

@media (max-width: 779px) {

  /* Contenedor principal */
  .d-footer-body {
    align-items: flex-start !important;
  }

  /* Texto "Creamos experiencias..." */
  .d-footer-brand {
    width: 100% !important;
    align-items: flex-start !important;
  }

  .d-footer-brand .d-footer-tagline {
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
  }

  /* Bloque de redes + información */
  .d-footer-right {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  /* Redes siguen arriba a la derecha */
  .d-footer-socials {
    position: absolute !important;
    top: 22px !important;
    right: 0 !important;
  }

  /* INFORMACIÓN — misma alineación que el tagline */
  .d-footer-legal {
    width: 100% !important;
    max-width: 300px !important;

    margin: 0 !important;
    padding: 0 !important;

    text-align: left !important;
    align-self: flex-start !important;

    font-size: 11px !important;
    line-height: 1.55 !important;
  }
}

/* =========================================================
   FOOTER MOBILE — ALINEACIÓN CORRECTA
   ========================================================= */

@media (max-width: 779px) {

  .d-footer-body {
    position: relative !important;
  }

  /* Logo + Creamos */
  .d-footer-brand {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 13px !important;
  }

  .d-footer-brand .d-footer-tagline {
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    max-width: 205px !important;
  }

  /* Redes: arriba a la derecha */
  .d-footer-socials {
    position: absolute !important;
    top: 22px !important;
    right: 0 !important;
    display: flex !important;
    gap: 9px !important;
    z-index: 5 !important;
  }

  /* NO mover el bloque de redes + legal */
  .d-footer-right {
    display: contents !important;
  }

  /* Texto legal:
       debajo del tagline y alineado a la izquierda */
  .d-footer-legal {
    position: relative !important;

    width: 100% !important;
    max-width: 300px !important;

    margin: 20px 0 23px !important;
    padding: 0 !important;

    text-align: left !important;
    align-self: flex-start !important;

    font-size: 11px !important;
    line-height: 1.55 !important;
  }
}

@media (max-width: 779px) {

  .d-footer-copy-group {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px !important;
    flex-wrap: nowrap !important;
    text-align: center !important;
    margin: 0 auto !important;
  }

  .d-footer-copy {
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  .d-footer-arqons {
    margin: 0 !important;
    height: 16px !important;
    width: auto !important;
    flex-shrink: 0 !important;
  }

}