@keyframes isoFadeUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.iso-reveal > section { animation: isoFadeUp 0.55s cubic-bezier(0.16, 1, 0.3, 1) both; }
.iso-reveal > section:nth-child(2) { animation-delay: 0.08s; }
@media (prefers-reduced-motion: reduce) { .iso-reveal > section { animation: none; } }

/* Mobile/tablet pass for the ISOKÖNIG marketing site.
   The screens use inline styles, so these rules use !important to override them. */

@media (max-width: 1024px) {
  div[style*="grid-template-columns: repeat(4"] { grid-template-columns: repeat(2, 1fr) !important; }
  div[style*="grid-template-columns: repeat(3"] { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 900px) {
  section[style*="grid-template-columns: minmax(0,1fr) 320px"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns: minmax(0,380px) minmax(0,1fr)"] { grid-template-columns: 1fr !important; }
  div[style*="minmax(0,380px)"] > div[style*="position: sticky"] { position: static !important; }
  aside[style*="position: sticky"] { position: static !important; }
}

@media (max-width: 768px) {
  html { -webkit-text-size-adjust: 100%; }

  /* all multi-column grids stack */
  div[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }

  /* section padding */
  div[style*="padding: 80px 40px"] { padding: 48px 20px !important; }
  div[style*="padding: 64px 40px"] { padding: 40px 20px !important; }
  div[style*="padding: 56px 40px"] { padding: 36px 20px !important; }
  section[style*="padding: 64px 40px"] { padding: 40px 20px !important; }
  div[style*="padding: 56px 40px 40px"] { padding: 32px 20px 28px !important; }
  div[style*="padding: 0 40px 64px"] { padding: 0 20px 40px !important; }
  footer { padding: 40px 20px 24px !important; }

  /* headings */
  h1 { font-size: clamp(30px, 8vw, 40px) !important; line-height: 1.1 !important; }
  h2 { font-size: clamp(24px, 6.5vw, 32px) !important; line-height: 1.15 !important; }

  /* hero */
  section[style*="min-height: 640px"] { height: auto !important; min-height: 560px !important; }
  div[style*="padding: 0 40px"][style*="justify-content: center"] { padding: 0 20px !important; }

  /* header: hide phone + divider, tighten */
  header > div:first-child { padding: 0 26px 0 14px !important; gap: 10px !important; }
  header > div:first-child a[href^="tel:"],
  header > div:first-child > div[style*="width: 1px"] { display: none !important; }
  header > div:first-child img { height: 42px !important; }
  header > div:nth-child(2) { padding: 0 12px !important; gap: 8px !important; }
  header button { padding: 9px 12px !important; font-size: 12px !important; }

  /* buttons and CTA rows wrap full width */
  button[style*="font-size: var(--fs-body-lg)"] { width: 100% !important; }
  div[style*="display: flex"][style*="gap: 14px"] { flex-wrap: wrap !important; }

  /* images and media */
  image-slot { height: auto !important; min-height: 220px !important; }
  section[style*="position: relative"] image-slot { min-height: 100% !important; }

  /* whatsapp fab: icon-sized so it doesn't cover content */
  a[href^="https://wa.me"] { right: 14px !important; bottom: 14px !important; padding: 12px 16px !important; font-size: 13px !important; }
}

@media (max-width: 480px) {
  div[style*="padding: 80px 40px"] { padding: 40px 16px !important; }
  footer { padding: 32px 16px 20px !important; }
  a[href^="https://wa.me"] span { display: none !important; }
}

/* --- mobile centering + overflow pass --- */
@media (max-width: 768px) {
  html, body { overflow-x: hidden !important; }
  img, image-slot, svg, video { max-width: 100% !important; }

  /* every horizontal 40px section gutter -> 20px */
  [style*="padding: 0 40px"], [style*="padding: 0px 40px"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding: 56px 40px"] { padding: 36px 20px !important; }
  [style*="padding: 64px 40px"] { padding: 40px 20px !important; }
  [style*="padding: 72px 40px"] { padding: 44px 20px !important; }
  [style*="padding: 80px 40px"] { padding: 48px 20px !important; }
  [style*="padding: 40px 48px"], [style*="padding: 44px 48px"] { padding: 28px 22px !important; }

  /* rounded dark CTA blocks */
  [style*="border-radius: 32px"] { border-radius: 20px !important; }

  /* service/material detail hero: let the title breathe instead of clipping */
  section[style*="height: 380px"] { height: auto !important; min-height: 300px !important; }
  section[style*="height: 380px"] > div[style*="position: relative"] { padding: 120px 20px 28px !important; }

  /* two-column flex rows stack */
  div[style*="display: flex"][style*="gap: 56px"] { flex-direction: column !important; gap: 28px !important; }
  div[style*="display: flex"][style*="gap: 36px"] { gap: 20px !important; }

  /* fixed-height media scales down */
  img[style*="height: 420px"] { height: 240px !important; }
  img[style*="height: 340px"], img[style*="height: 320px"] { height: 220px !important; }

  /* nothing may force the page wider than the screen */
  [style*="min-width: 280px"], [style*="min-width: 260px"] { min-width: 0 !important; }
}

@media (max-width: 480px) {
  [style*="padding: 56px 40px"] { padding: 32px 16px !important; }
  [style*="padding: 64px 40px"], [style*="padding: 72px 40px"], [style*="padding: 80px 40px"] { padding: 36px 16px !important; }
  [style*="padding: 0 40px"], [style*="padding: 0px 40px"] { padding-left: 16px !important; padding-right: 16px !important; }
  [style*="padding: 40px 48px"], [style*="padding: 44px 48px"] { padding: 24px 18px !important; }
}

@media (max-width: 900px) {
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  [style*="position: sticky"] { position: static !important; }
}
@media (max-width: 1024px) and (min-width: 901px) {
  section[style*="320px"][style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
}

@media (max-width: 768px) { .iso-hide-mobile { display: none !important; } }

@media (max-width: 768px) {
  section[style*="min-height: 640px"] > div[style*="justify-content: center"] { justify-content: flex-end !important; padding-bottom: 96px !important; }
}

@media (max-width: 768px) {
  section[style*="min-height: 640px"] { min-height: 660px !important; }
  section[style*="min-height: 640px"] div[style*="justify-content: center"] { justify-content: flex-end !important; padding-bottom: 56px !important; }
}

@media (max-width: 768px) {
  .iso-hero-inner { justify-content: flex-end !important; padding-bottom: 15vh !important; }
}

@media (max-width: 768px) {
  .iso-hero-inner.iso-hero-inner {
    min-height: 56vh !important;
    height: auto !important;
    justify-content: center !important;
    padding: 0 20px !important;
  }
}
