/* Responsive layer: desktop remains unchanged above 1100px. */
@media (max-width:1100px) {
  .scene.scene-auralis {height:auto!important;min-height:0!important;padding:0 0 42px!important}
  .scene.scene-auralis header {position:relative!important;inset:auto!important;align-items:center!important;flex-wrap:wrap;gap:18px;padding:20px 22px!important}
  .scene.scene-auralis header .brand {font-size:36px!important}
  .scene.scene-auralis header nav {display:flex!important;flex:1 1 100%;flex-wrap:wrap;gap:4px!important;justify-content:flex-start}
  .scene.scene-auralis header nav button {display:inline-flex!important;min-height:44px;font-size:14px!important;line-height:1.3!important;padding:10px 12px!important}
  .scene.scene-auralis h1 {position:relative!important;inset:auto!important;margin:30px 22px!important;font-size:clamp(38px,7vw,76px)!important;white-space:normal!important;line-height:1.02!important}
  .scene.scene-auralis .eye {position:relative!important;inset:auto!important;transform:none!important;width:100%!important;height:clamp(190px,38vw,390px)!important;min-height:0!important;margin:28px 0!important}
  .scene.scene-auralis .copy {position:relative!important;inset:auto!important;width:auto!important;max-width:650px!important;padding:0 22px!important;font-size:18px!important;line-height:1.5!important}
  .pulso-content > .section-nav {gap:6px!important;padding:8px 16px!important;justify-content:flex-start!important;overflow-x:auto!important;white-space:nowrap!important;scrollbar-width:thin}
  .pulso-content > .section-nav a {flex-shrink:0;min-height:44px;font-size:14px!important}
  .pulso-content .chapter-section,.pulso-content .examples-section {scroll-margin-top:76px}
  .pulso-content .section-lead,.contact-layout > *, .pricing-stage,.what-stage {min-width:0}
  .pulso-content .section-lead h2 {font-size:clamp(36px,6vw,66px)!important;line-height:1.06!important;max-width:100%!important;overflow-wrap:break-word}
  #ejemplos.examples-section .case-data ul {grid-template-columns:1fr!important}
  #ejemplos.examples-section .case-data li {font-size:16px!important;line-height:1.5!important}
  #ejemplos.examples-section .case-data h4 {font-size:14px!important}
  #contacto input,#contacto textarea,#chat-dialog #chat-input {font-size:16px!important}
  #contacto button,#chat-dialog button,.gallery-controls button,.new-footer a {min-height:44px!important}
  #chat-dialog #chat-close {width:44px!important;height:44px!important}
  #chat-dialog.pulso-chat-v2 {max-height:calc(100dvh - 24px)!important}
}
@media (max-width:850px) {
  .pulso-content .chapter-section {padding:64px 22px!important}
  #hacemos .what-stages,#fases .pricing-stages,.contact-layout,.faq-section {grid-template-columns:minmax(0,1fr)!important}
  #hacemos .what-stage {padding:24px!important;min-height:0!important}
  #hacemos .what-stage h3,#fases .pricing-stage h3 {font-size:30px!important;line-height:1.15!important;overflow-wrap:break-word}
  #hacemos .what-stage p,#fases .pricing-stage p {font-size:16px!important;line-height:1.5!important}
  #metodo .method-step {grid-template-columns:28px minmax(0,1fr)!important;gap:12px!important}
  #metodo .method-step h3 {font-size:28px!important}
  #metodo .method-step p,#metodo .method-step small {grid-column:2!important;font-size:16px!important;line-height:1.5!important}
  #ejemplos.examples-section .case-frame {width:min(340px,calc(100vw - 48px))!important;margin-left:0!important;height:var(--mobile-card-height,480px)!important;top:24px!important}
  #ejemplos.examples-section .gallery {height:calc(var(--mobile-card-height,480px) + 64px)!important}
  #ejemplos.examples-section .case-painting {height:100%!important;padding:22px!important;overflow:visible!important}
  #ejemplos.examples-section .case-business {white-space:normal!important;word-break:normal!important;font-size:14px!important;line-height:1.35!important;width:auto!important}
  #ejemplos.examples-section .case-painting > strong {font-size:27px!important;line-height:1.12!important}
  #ejemplos.examples-section .case-copy {display:block!important;-webkit-line-clamp:unset!important;max-height:none!important;font-size:16px!important;line-height:1.5!important;overflow:visible!important}
  #ejemplos.examples-section .case-detail {grid-template-columns:minmax(0,1fr)!important}
  #ejemplos.examples-section .case-detail > div:first-child h3 {font-size:30px!important;line-height:1.12!important;max-width:none!important}
  #ejemplos.examples-section .case-detail > div:first-child > p:not(.overline) {font-size:16px!important}
  #ejemplos.examples-section .examples-universal-note {grid-template-columns:minmax(0,1fr)!important;gap:10px}
  #preguntas .faq-list summary {font-size:19px!important;line-height:1.4!important;min-height:44px}
  #preguntas .faq-list details p {font-size:16px!important;line-height:1.55!important}
  #contacto .contact-layout {gap:28px!important;margin-top:36px!important}
  #contacto h2 {font-size:clamp(36px,7vw,60px)!important;line-height:1.08!important}
  #contacto .contact-chat-button {width:auto!important;max-width:100%!important;min-width:170px}
  .new-footer {flex-wrap:wrap!important;gap:20px!important;padding:30px 22px calc(30px + env(safe-area-inset-bottom))!important}
  .new-footer > span {font-size:54px!important}
  #hacemos .toolbelt-marquee,#metodo .method-build-marquee,#preguntas .faq-pulso-marquee {width:calc(100% + 44px)!important;margin-left:-22px!important;margin-right:-22px!important;margin-bottom:-64px!important}
  #chat-dialog.pulso-chat-v2 {top:var(--chat-mobile-top,12px)!important;left:12px!important;transform:none!important;width:calc(100% - 24px)!important;height:var(--chat-mobile-height,calc(100dvh - 24px))!important;max-height:var(--chat-mobile-height,calc(100dvh - 24px))!important}
  #chat-dialog .chat-top {padding:16px!important;gap:12px!important}
  #chat-dialog #chat-log {padding:16px!important;overscroll-behavior:contain}
  #chat-dialog #chat-log p {max-width:94%!important;font-size:16px!important;overflow-wrap:anywhere}
  #chat-dialog .chat-prompts {padding:8px 16px!important}
  #chat-dialog .chat-prompts button {font-size:14px!important}
  #chat-dialog #chat-form {padding:8px 16px!important}
  #chat-dialog #chat-contact {padding:10px 16px!important}
}
@media (max-width:380px) {
  .scene.scene-auralis header nav button {padding:8px!important;font-size:13px!important}
  .pulso-content .section-lead h2 {font-size:36px!important}
  #ejemplos.examples-section .case-painting {padding:18px!important}
}
@media (max-height:500px) and (max-width:850px) {
  #chat-dialog .chat-top p {display:none!important}
  #chat-dialog .chat-top {padding:8px 16px!important}
  #chat-dialog #chat-contact {padding:6px 16px!important}
}

/* v91 — desktop and large tablets (>850 px): the active example is centred
   (an old margin-left of -200px pushed it off-centre) and every card is as tall
   as the longest text instead of a fixed 472 px with a hollow bottom. */
@media (min-width:851px) {
  #ejemplos.examples-section .case-frame {margin-left:0!important;height:var(--card-h,472px)!important}
  #ejemplos.examples-section .case-painting {height:100%!important}
  #ejemplos.examples-section .gallery {height:calc(var(--card-h,472px) + 118px)!important}
}
/* Headlines break into even lines at every width */
.pulso-content h2 {text-wrap:balance}
/* Phones held sideways: menu jumps land the heading just under the sticky bar */
@media (max-height:500px) and (max-width:1100px) {
  .pulso-content .chapter-section,.pulso-content .examples-section {scroll-margin-top:12px!important}
}