@media (max-width: 640px) {
  body.home-page,
  body.home-page .mobile-home {
    background: #000;
    color: #fff;
  }

  body.home-page .site-header::after {
    height: 5rem;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.92), rgba(0, 0, 0, 0));
  }

  body.home-page .brand-text strong {
    color: #fff;
    max-width: 9.7rem;
    font-size: calc(0.72rem + 5px);
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
  }

  body.home-page .menu-toggle {
    border-radius: 999px;
  }

  body.home-page .nav-links {
    background: rgba(12, 12, 12, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 24px;
  }

  body.home-page .nav-links a {
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, 0.12);
    font-size: calc(0.86rem + 5px);
  }

  body.home-page .mobile-hero-panel {
    position: relative;
    background: #000;
    border-bottom: 0;
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.62);
  }

  body.home-page .mobile-hero-bg {
    filter: saturate(0.76) contrast(1.12) brightness(0.62);
    opacity: 0.82;
  }

  body.home-page .mobile-hero-overlay {
    background:
      linear-gradient(180deg, rgba(0, 0, 0, 0.54) 0%, rgba(0, 0, 0, 0.35) 31%, rgba(0, 0, 0, 0.16) 54%, rgba(0, 0, 0, 0.92) 100%),
      linear-gradient(90deg, rgba(0, 0, 0, 0.56), rgba(0, 0, 0, 0.02) 62%);
  }

  body.home-page .mobile-hero-content {
    position: absolute;
    z-index: 4;
    top: 5.2rem;
    left: 0;
    right: 0;
    padding: 0 1.15rem;
    transform: none !important;
  }

  body.home-page .mobile-hero-content h1 {
    width: min(96vw, 25rem) !important;
    max-width: none !important;
    margin: 0 0 0.95rem !important;
    font-size: clamp(2rem, 8.9vw, 2.5rem) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.045em;
    text-wrap: balance;
    text-shadow: 0 3px 18px rgba(0, 0, 0, 0.92);
  }

  body.home-page .mobile-outline-button {
    min-width: 8.4rem;
    min-height: calc(1.55rem + 10px);
    padding: 0.42rem 1.18rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.22);
    border-color: rgba(255, 255, 255, 0.9);
    color: #fff;
    font-size: calc(0.72rem + 5px);
    font-weight: 800;
  }

  body.home-page .mobile-featured-card {
    margin-left: 0.42rem;
    margin-right: 0.42rem;
    padding: 1.25rem 1rem 1.32rem;
    background: linear-gradient(180deg, #101010, #050505);
    border: 0;
    border-radius: calc(1.05rem + 5px);
    box-shadow:
      0 14px 42px rgba(0, 0, 0, 0.62),
      inset 0 1px 0 rgba(255, 255, 255, 0.08),
      inset 0 -1px 0 rgba(255, 255, 255, 0.04);
  }

  body.home-page .mobile-product-frame {
    margin-bottom: 0.55rem;
    border-radius: calc(0.85rem + 5px);
    background:
      radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 1), rgba(246, 246, 246, 0.96) 58%, rgba(235, 235, 235, 0.88) 100%);
    overflow: hidden;
    border: 0;
    box-shadow:
      0 10px 28px rgba(0, 0, 0, 0.32),
      inset 0 0 28px rgba(0, 0, 0, 0.05);
  }

  body.home-page .mobile-product-frame img {
    filter: drop-shadow(0 10px 16px rgba(0, 0, 0, 0.18));
  }

  body.home-page .mobile-product-arrow {
    font-size: calc(1.35rem + 5px);
  }

  body.home-page .mobile-black-button,
  body.home-page .mobile-white-button {
    background: #fff;
    color: #000;
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 999px;
    font-size: calc(0.64rem + 5px);
    font-weight: 900;
  }

  body.home-page .mobile-copy-block-light,
  body.home-page .mobile-services-block,
  body.home-page .mobile-soft-blue,
  body.home-page .mobile-black-tail {
    background: #000;
    color: #fff;
  }

  body.home-page .mobile-copy-block,
  body.home-page .mobile-services-block {
    padding-left: 1.15rem;
    padding-right: 1.15rem;
  }

  body.home-page .mobile-copy-block-light,
  body.home-page .mobile-services-block,
  body.home-page .mobile-image-break {
    border-top: 0;
    border-bottom: 0;
    box-shadow:
      inset 0 22px 24px -28px rgba(255, 255, 255, 0.35),
      inset 0 -22px 24px -28px rgba(255, 255, 255, 0.35);
  }

  body.home-page .mobile-copy-block h2,
  body.home-page .mobile-services-block h2 {
    color: #fff;
    font-size: calc(1.52rem + 5px);
    line-height: 1.04;
  }

  body.home-page .mobile-copy-block p,
  body.home-page .mobile-services-block p {
    width: min(100%, 19rem);
    color: rgba(255, 255, 255, 0.78);
    font-size: calc(0.84rem + 5px);
    line-height: 1.34;
  }

  body.home-page .mobile-image-break img {
    filter: contrast(1.1) saturate(0.82) brightness(0.74);
  }

  body.home-page .mobile-soft-blue {
    min-height: auto;
    padding: 2rem 1.15rem 1.3rem;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 18%),
      #000;
    box-shadow: inset 0 22px 28px -30px rgba(255, 255, 255, 0.45);
  }

  body.home-page .mobile-soft-blue::before,
  body.home-page .mobile-soft-blue::after {
    display: block;
    white-space: pre-line;
  }

  body.home-page .mobile-soft-blue::before {
    content: "Ardi Rent & Service\A Renta de cámaras, lentes y soporte de producción en Puerto Rico.\A WhatsApp: 939-366-1442\A Email: ardirentservice@gmail.com";
    padding-bottom: 1.25rem;
    color: rgba(255, 255, 255, 0.82);
    font-size: calc(0.82rem + 5px);
    line-height: 1.35;
  }

  body.home-page .mobile-soft-blue::first-line {
    color: #fff;
    font-family: "Space Grotesk", "Manrope", system-ui, sans-serif;
    font-size: calc(1.35rem + 5px);
    font-weight: 800;
    letter-spacing: -0.04em;
  }

  body.home-page .mobile-soft-blue::after {
    content: "Servicios\A • Renta de cámaras y lentes\A • Fotografía y video\A • Podcast y livestream\A • Producción audiovisual";
    padding: 1.1rem 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.8);
    font-size: calc(0.82rem + 5px);
    line-height: 1.45;
  }

  body.home-page .mobile-black-tail {
    min-height: auto;
    padding: 0 1.15rem 2rem;
    color: rgba(255, 255, 255, 0.52);
    font-size: calc(0.72rem + 5px);
  }

  body.home-page .mobile-black-tail::before {
    content: "© Ardi Rent & Service LLC. Camera rentals, production services, and visual storytelling.";
  }
}
