/* Gora Studio — responsive. Los estilos de la web son inline; aquí solo se adaptan a tablet y móvil. */
html, body { overflow-x: clip; }

/* ---------- TABLET ---------- */
@media (max-width: 1100px) {
  [style*="margin: 0px 100px;"] { margin: 0 40px !important; }
  [style*="margin: 0px 100px 8rem;"] { margin: 0 40px 8rem !important; }
  [style*="margin: 90px 100px 0px;"] { margin: 90px 40px 0 !important; }
  [style*="margin: 16rem 100px 10rem;"] { margin: 10rem 40px 8rem !important; }
  [style*="margin: 120px 100px 0px;"] { margin: 120px 40px 0 !important; }
  [style*="margin: 160px 100px 200px;"] { margin: 120px 40px 160px !important; }
  [style*="margin: 160px 100px 0px;"] { margin: 120px 40px 0 !important; }
  [style*="padding: 100px;"] { padding: 80px 40px !important; }
  [style*="padding: 100px 100px 60px;"] { padding: 90px 40px 48px !important; }
  [style*="padding: 160px 100px 0px;"] { padding: 140px 40px 0 !important; }
  [style*="padding: 0px 100px;"] { padding: 0 40px !important; }
  [style*="padding: 160px 60px 0px;"] { padding: 140px 40px 0 !important; }
  [style*="padding: 20px 60px 0px;"] { padding: 20px 40px 0 !important; }
  [style*="padding: 64px 80px 16px;"] { padding: 64px 40px 16px !important; }
  [style*="margin: 40px -60px 0px;"] { margin: 40px -40px 0 !important; }
  [style*="left: 60px;"][style*="position: absolute"] { left: 40px !important; }
  [style*="width: 918px;"] { width: auto !important; height: auto !important; }
  [style*="grid-template-columns: 0.6fr 0.6fr;"] { column-gap: 3rem !important; }
  [style*="width: 427px;"], [style*="width: 426px;"] { width: 100% !important; }
  [style*="height: 348px;"] { height: auto !important; }
  [style*="grid-template-columns: 168px minmax(0px, 1.5fr)"] { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) auto !important; }
  [style*="grid-template-columns: 168px minmax(0px, 1.5fr)"] > [style*="width: 168px;"] { display: none !important; }
  [style*="font-size: 64px;"] { font-size: 52px !important; line-height: 1.08 !important; }
  [style*="font-size: 60px;"] { font-size: 48px !important; line-height: 1.1 !important; }
  [style*="font-size: 55px;"] { font-size: 44px !important; line-height: 1.08 !important; }
}

/* ---------- MÓVIL ---------- */
@media (max-width: 767px) {
  /* Márgenes laterales */
  [style*="margin: 0px 100px;"] { margin: 0 20px !important; }
  [style*="margin: 0px 100px 8rem;"] { margin: 0 20px 5rem !important; }
  [style*="margin: 90px 100px 0px;"] { margin: 72px 20px 0 !important; }
  [style*="margin: 16rem 100px 10rem;"] { margin: 6rem 20px 5rem !important; }
  [style*="margin: 120px 100px 0px;"] { margin: 88px 20px 0 !important; }
  [style*="margin: 160px 100px 200px;"] { margin: 88px 20px 120px !important; }
  [style*="margin: 160px 100px 0px;"] { margin: 88px 20px 0 !important; }
  [style*="margin: 160px 0px 200px;"] { margin: 88px 0 120px !important; }
  [style*="margin: 140px auto 200px;"], [style*="margin: 120px auto 200px;"], [style*="margin: 80px auto 200px;"] { margin: 56px auto 120px !important; }
  [style*="padding: 100px;"] { padding: 64px 20px !important; }
  [style*="padding: 100px 100px 60px;"] { padding: 72px 20px 32px !important; gap: 48px !important; }
  [style*="padding: 160px 100px 0px;"] { padding: 112px 20px 0 !important; }
  [style*="padding: 0px 100px;"] { padding: 0 20px !important; }
  [style*="padding: 160px 60px 0px;"] { padding: 112px 20px 0 !important; }
  [style*="padding: 20px 60px 0px;"] { padding: 18px 20px 0 !important; }
  [style*="padding: 64px 80px 16px;"] { padding: 64px 20px 16px !important; }
  [style*="padding: 150px 0px 0px;"] { padding: 110px 0 0 !important; }
  [style*="padding: 110px 0px 140px;"] { padding: 96px 0 80px !important; }
  [style*="padding: 110px 0px 120px;"] { padding: 96px 0 72px !important; }
  [style*="padding: 56px 48px 48px;"] { padding: 32px 20px !important; }
  [style*="padding: 48px;"] { padding: 28px 20px !important; }
  [style*="margin: 40px -60px 0px;"] { margin: 32px -20px 0 !important; }
  [style*="left: 60px;"][style*="position: absolute"] { left: 20px !important; }
  [style*="width: 95%;"] { width: calc(100% - 40px) !important; }

  /* Rejillas a una columna */
  [style*="grid-template-columns: 30% 1fr;"],
  [style*="grid-template-columns: 25% 1fr;"],
  [style*="grid-template-columns: 40% 1fr;"],
  [style*="grid-template-columns: minmax(0px, 40%) minmax(0px, 1fr);"],
  [style*="grid-template-columns: 0.6fr 0.6fr;"],
  [style*="grid-template-columns: minmax(200px, 260px) minmax(0px, 1fr);"],
  [style*="grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr);"],
  [style*="grid-template-columns: 1fr 0.5fr;"],
  [style*="grid-template-columns: 3fr 2fr 1fr 0.5fr;"],
  [style*="grid-template-columns: minmax(0px, 220px) 1fr 56px;"] { grid-template-columns: minmax(0, 1fr) !important; row-gap: 24px !important; column-gap: 0 !important; }
  [style*="grid-template-columns: 0.6fr 0.6fr;"] { row-gap: 3rem !important; }
  [style*="grid-template-columns: repeat(3, minmax(0px, 1fr));"] { grid-template-columns: minmax(0, 1fr) !important; height: auto !important; margin-left: 0 !important; margin-top: 64px !important; gap: 12px !important; }
  [style*="grid-template-columns: repeat(3, minmax(0px, 1fr));"] > * { min-height: 200px; }
  [style*="margin-left: calc(30% + 24px)"] { margin-left: 0 !important; }
  [style*="grid-template-columns: repeat(auto-fit, minmax(max(260px"] { grid-template-columns: minmax(0, 1fr) !important; }
  [style*="justify-self: end"] { justify-self: stretch !important; }

  /* Índices laterales (artículo y páginas legales) */
  [style*="grid-template-columns: 25% 1fr;"] > aside { display: none !important; }
  [style*="position: sticky"][style*="top: 90px;"] { position: static !important; }

  /* Tipografía */
  [style*="font-size: 64px;"] { font-size: 38px !important; line-height: 1.1 !important; }
  [style*="line-height: 70px;"] { line-height: 1.1 !important; }
  [style*="font-size: 60px;"] { font-size: 36px !important; line-height: 1.12 !important; }
  [style*="font-size: 55px;"] { font-size: 32px !important; line-height: 1.12 !important; }
  [style*="font-size: 44px;"] { font-size: 30px !important; line-height: 1.15 !important; }
  [style*="font-size: 40px;"][style*="line-height: 44px"] { font-size: 28px !important; line-height: 1.15 !important; }
  [style*="font-size: 3rem;"] { font-size: 2.2rem !important; line-height: 1.1 !important; }
  [style*="line-height: 54px;"] { line-height: 1.12 !important; }
  [style*="font-size: 35px;"] { font-size: 26px !important; line-height: 1.2 !important; }
  [style*="font-size: 9rem;"] { font-size: 4.2rem !important; }
  [style*="height: 9.45rem;"] { height: 4.4rem !important; }
  [style*="font-size: 3.5rem;"] { font-size: 1.9rem !important; }
  [style*="width: 918px;"] { width: auto !important; height: auto !important; }

  /* Espaciados verticales grandes */
  [style*="gap: 160px;"], [style*="gap: 140px;"], [style*="gap: 112px;"] { gap: 64px !important; }
  [style*="gap: 80px;"] { gap: 40px !important; }
  [style*="margin-bottom: -140px;"] { display: none !important; }
  [style*="margin-top: 200px;"][style*="margin-bottom: 200px;"] { margin-top: 96px !important; margin-bottom: 96px !important; }
  [style*="margin-top: 8rem;"] { margin-top: 4rem !important; }
  [style*="margin-top: 111px;"] { margin-top: 48px !important; }
  [style*="margin-top: 110px;"][style*="margin-bottom: 110px;"] { margin-top: 48px !important; margin-bottom: 72px !important; }
  [style*="margin-top: 120px;"] { margin-top: 72px !important; }
  [style*="margin-top: 80px;"] { margin-top: 48px !important; }
  [style*="height: 520px;"] { height: auto !important; }
  [style*="height: 460px;"] { height: 260px !important; }

  /* HERO de Home / landings — móvil: menú, imágenes, título, online/contacto */
  [style*="grid-template-columns: 30% 40% 15% 15%;"] { grid-template-columns: 1fr 1fr !important; grid-template-rows: auto auto auto auto 1fr !important; row-gap: 0 !important; padding-bottom: 28px !important; }
  [style*="grid-template-columns: 30% 40% 15% 15%;"] > [style*="grid-area: 1 / 1 / 2 / 2;"] { grid-area: 1 / 1 / 2 / 3 !important; }
  [style*="grid-template-columns: 30% 40% 15% 15%;"] > [style*="grid-area: 2 / 2 / 3 / 3;"] { grid-area: 2 / 1 / 3 / 3 !important; height: 340px !important; margin-top: 72px !important; align-self: start !important; }
  [style*="grid-template-columns: 30% 40% 15% 15%;"] > [style*="grid-area: 2 / 1 / 3 / 2;"] { grid-area: 3 / 1 / 4 / 3 !important; padding-top: 32px !important; }
  [style*="grid-template-columns: 30% 40% 15% 15%;"] > [style*="grid-area: 2 / 3 / 3 / 4;"] { grid-area: 4 / 1 / 5 / 2 !important; padding-top: 28px !important; }
  [style*="grid-template-columns: 30% 40% 15% 15%;"] > [style*="grid-area: 2 / 4 / 3 / 5;"] { grid-area: 4 / 2 / 5 / 3 !important; padding-top: 28px !important; }
  [style*="grid-template-columns: 30% 40% 15% 15%;"] > [style*="grid-area: 3 / 1 / 4 / 2;"] { grid-area: 5 / 1 / 6 / 3 !important; align-self: end !important; }
  [style*="grid-template-columns: 30% 40% 15% 15%;"] br { display: none; }
  [role="status"] [style*="white-space: nowrap"] { width: auto !important; max-width: 100% !important; }

  /* Servicios de la Home: imagen fija -> en flujo */
  [style*="position: sticky"][style*="top: 3rem;"] { position: relative !important; top: 0 !important; }
  [style*="width: 427px;"], [style*="width: 426px;"], [style*="width: 258px;"] { width: 100% !important; }
  [style*="height: 348px;"] { height: auto !important; }
  [style*="width: 22rem;"] { width: 70vw !important; }

  /* Carruseles */
  [style*="width: min(70vh, 60vw)"] { width: 80vw !important; }
  [style*="width: min(50vh, 42vw)"] { width: 62vw !important; }
  [style*="gap: 4rem;"][style*="will-change: transform"] { gap: 1.5rem !important; margin-top: 40px !important; }
  /* Proyectos: filtros, tarjetas cuadradas apiladas y CTA al final */
  [data-screen-label="Proyectos v2"] { row-gap: 8px !important; }
  [data-screen-label="Proyectos v2"] > aside { display: contents !important; }
  [data-screen-label="Proyectos v2"] > aside > :first-child { order: 1; padding: 4px 0 24px; }
  [data-screen-label="Proyectos v2"] > [style*="grid-template-columns: repeat(auto-fit"] { order: 2; grid-template-columns: minmax(0, 1fr) !important; }
  [data-screen-label="Proyectos v2"] > aside > :last-child { order: 3; margin-top: 56px; padding: 0 2px; }
  [data-screen-label="Proyectos v2"] a[style*="min-height: 420px"] { min-height: 0 !important; aspect-ratio: 1 / 1; }
  /* Servicios: pestañas como botones apilados a todo el ancho */
  [data-screen-label="Lista servicios"] [style*="margin-left: calc(30% + 24px)"] { margin-top: 48px !important; }
  [data-screen-label="Lista servicios"] [style*="border-bottom: 1px solid"][style*="display: flex"] { flex-direction: column !important; gap: 8px !important; border-bottom: 0 !important; }
  [data-screen-label="Lista servicios"] button[style*="flex: 1"] { flex: none !important; width: 100% !important; display: flex !important; align-items: center !important; gap: 8px !important; padding: 14px 16px !important; border-radius: 6px !important; background: #ececea !important; font-size: 17px !important; color: #000 !important; transition: background-color .25s ease, color .25s ease !important; }
  [data-screen-label="Lista servicios"] button[style*="flex: 1"] > span[style*="position: absolute"] { display: none !important; }
  [data-screen-label="Lista servicios"] button[style*="flex: 1"]::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: #c7f998; outline: .5px solid #00000030; opacity: 0; transition: opacity .25s ease; }
  [data-screen-label="Lista servicios"] button[style*="flex: 1"]:has(> span[style*="scaleX(1)"]) { background: #000 !important; color: #fff !important; }
  [data-screen-label="Lista servicios"] button[style*="flex: 1"]:has(> span[style*="scaleX(1)"])::before { opacity: 1; animation: goraBlink 1.2s ease-in-out infinite; }
  [data-screen-label="Proyectos"] > [style*="position: sticky"] > [style*="min-height: 0px"] { flex: none !important; align-items: flex-start !important; }
  [style*="gap: 4rem;"][style*="will-change: transform"] > div > a[style*="aspect-ratio"] { aspect-ratio: 1 / 1 !important; }
  [style*="width: min(70vh, 60vw)"], [style*="width: min(50vh, 42vw)"] { width: 74vw !important; }
  [data-hero-slot] { width: 42vw !important; }

  /* Proyecto individual: portada + ficha */
  [style*="height: calc(-290px + 100vh)"] { height: auto !important; min-height: 0 !important; aspect-ratio: 1 / 1; }
  [style*="height: calc(-290px + 100vh)"] [data-pj-slide] { width: 100% !important; }
  [style*="height: calc(-290px + 100vh)"] [data-pj-slide] > img { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important; }
  [style*="padding: 64px 16px 32px;"] { padding: 64px 12px 24px !important; gap: 20px !important; }
  [style*="grid-template-columns: 168px minmax(0px, 1.5fr)"] { grid-template-columns: 1fr 1fr !important; gap: 20px 16px !important; }
  [style*="grid-template-columns: 168px minmax(0px, 1.5fr)"] > [style*="width: 168px;"] { display: none !important; }
  [style*="grid-template-columns: 168px minmax(0px, 1.5fr)"] > :nth-child(2) { grid-column: 1 / -1; }

  /* Footer */
  [style*="padding: 4rem 2rem 0px;"] { padding: 3rem 20px 0 !important; gap: 3rem !important; }
  [style*="gap: 5.5rem;"] { gap: 2.5rem !important; width: 100% !important; }
  [style*="grid-template-columns: repeat(3, max-content);"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: 1.5rem !important; }
  [style*="font-size: 20vw;"] { font-size: 28vw !important; }
  /* Footer: redes alineadas a la izquierda y debajo, en lista, políticas y botones */
  [data-screen-label="Footer"] [style*="justify-content: flex-end; align-items: flex-start; column-gap: 1rem;"] { justify-content: flex-start !important; }
  [data-screen-label="Footer"] [style*="justify-content: space-between; align-items: center; gap: 1rem;"] { flex-direction: column !important; align-items: flex-start !important; gap: 1.5rem !important; }
  [data-screen-label="Footer"] [style*="justify-content: space-between; align-items: center; gap: 1rem;"] > div { flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-content: flex-start !important; gap: .6rem !important; }
  [data-screen-label="Footer"] [style*="width: 1px; height: 1.25rem;"] { display: none !important; }
  [data-screen-label="Footer"] [style*="justify-content: space-between; align-items: center; gap: 1rem;"] a { font-size: .875rem !important; }

  /* Popups, notificaciones */
  [style*="top: 58px;"][style*="width: 22%;"] { width: calc(100vw - 24px) !important; min-width: 0 !important; }
  [style*="width: min(320px, -32px + 100vw)"] { top: 72px !important; right: 12px !important; width: calc(100vw - 24px) !important; }
  /* Menú / conversación: abiertos, centrados en pantalla */
  nav[style*="top: 16px; left: 50%; transform: translateX(-50%)"] { left: 0 !important; right: 0 !important; transform: none !important; justify-content: center !important; pointer-events: none; }
  nav[style*="top: 16px; left: 50%; transform: translateX(-50%)"] > * { pointer-events: auto; }
  nav [style*="position: absolute; top: 0px; left: 0px;"][style*="width: min(440px, 92vw)"] { position: fixed !important; top: 16px !important; left: 12px !important; width: calc(100vw - 24px) !important; }
}

/* Pantallas táctiles: sin cursor personalizado */
@media (hover: none) {
  [style*="cursor: none"] { cursor: auto !important; }
}

/* ===== Ajustes propios (scripts/overrides.css), se añaden al final de responsive.css al generar la web ===== */
@media (max-width: 767px) {
  /* Notificaciones: ocultas en móvil en toda la web (el aviso de cookies sigue visible) */
  [data-gora-notif] { display: none !important; }

  /* Cabecera de Home / Donostia / Pamplona en filas apiladas:
     1) imágenes  2) encabezado (H1 + texto)  3) resto de textos y enlaces (Online, Contacta conmigo, ©) */
  [data-gora-hero] {
    display: flex !important; flex-direction: column !important; align-items: stretch !important;
    height: auto !important; min-height: 100dvh !important; position: relative !important; overflow: hidden !important;
    gap: 0 !important; padding: 18px 20px 32px !important;
  }
  [data-gora-hero] > [data-hero-cell] { grid-area: auto !important; width: auto !important; }
  [data-gora-hero] > [data-hero-cell="logo"] { order: 0; }
  [data-gora-hero] > [data-hero-cell="images"] { order: 1; flex: none !important; height: 320px !important; margin-top: 56px !important; }
  [data-gora-hero] > [data-hero-cell="title"] { order: 2; padding-top: 40px !important; }
  [data-gora-hero] > [data-hero-cell="online"] { order: 3; padding-top: 32px !important; }
  [data-gora-hero] > [data-hero-cell="contact"] { order: 4; padding-top: 24px !important; }
  [data-gora-hero] > [data-hero-cell="copy"] { order: 5; margin-top: auto !important; padding-top: 32px !important; }
  [data-gora-hero] br { display: none; }

  /* Artículo del blog: gráficos legibles en móvil */
  /* 1) Columnas (38% / 54% / 81%): se mantienen 3 columnas, más bajas y con cifras más pequeñas */
  [data-gora-chart="columnas"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; height: 340px !important; gap: 8px !important; margin-top: 8px !important; }
  [data-gora-chart="columnas"] > * { min-height: 0 !important; }
  [data-gora-chart="columnas"] > * > :first-child { padding-left: 10px !important; font-size: 13px !important; }
  [data-gora-chart="columnas"] > * > :last-child { padding-top: 24px !important; min-height: 0 !important; }
  [data-gora-chart="columnas"] > * > :last-child > :first-child { padding: 0 0 8px 10px !important; font-size: 30px !important; }
  /* 2) Barras: etiqueta y % en una línea, barra debajo */
  [data-gora-chart="barras"] > * { grid-template-columns: minmax(0, 1fr) auto !important; row-gap: 8px !important; column-gap: 12px !important; }
  [data-gora-chart="barras"] > * > :nth-child(2) { grid-column: 1 / -1 !important; grid-row: 2 !important; }
  [data-gora-chart="barras"] > * > :nth-child(3) { grid-column: 2 !important; grid-row: 1 !important; }
  /* 3) Paleta: cada color en su fila, con su porcentaje */
  [data-gora-chart="paleta"] { grid-template-columns: minmax(0, 1fr) !important; height: auto !important; row-gap: 0 !important; }
  [data-gora-chart="paleta"] > * { min-height: 52px !important; border-radius: 0 !important; }
  [data-gora-chart="paleta"] > :first-child { border: 1px solid #e6e4e0 !important; border-bottom: 0 !important; border-radius: 6px 6px 0 0 !important; }
  [data-gora-chart="paleta"] > :last-child { border-radius: 0 0 6px 6px !important; }
  [data-gora-chart="paleta"] > :last-child::before { content: "Acento\00a0·\00a0"; }
}