/* GLOBAL-APT HOMEPAGE — FORMAL HERO ARRANGEMENT */

/* Desktop: approved two-column hero composition. */
@media screen and (min-width: 801px) {
  .hero {
    padding: 76px 0 55px !important;
  }

  .hero-content {
    display: grid !important;
    grid-template-columns: minmax(0, 1.53fr) minmax(360px, 1fr) !important;
    gap: 65px !important;
    align-items: start !important;
    padding-top: 0 !important;
  }

  .hero-copy {
    min-width: 0;
    padding-top: 20px;
  }

  .hero h1 {
    margin-top: 0 !important;
  }

  .hero-card {
    width: 100% !important;
    margin-top: 0 !important;
    padding: 38px !important;
  }

  .hero-card > img {
    width: 100% !important;
    height: 410px !important;
    object-fit: cover !important;
    object-position: center top !important;
    border-radius: 13px !important;
    border: 1px solid rgba(176, 141, 87, 0.55) !important;
    margin-bottom: 24px !important;
  }

  .hero-card-content > span {
    display: block;
    color: #d8b878;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    margin-bottom: 8px;
  }

  .hero-card h2 {
    margin-bottom: 8px !important;
  }

  .hero-card-content p {
    margin-bottom: 0 !important;
  }

  .hero-actions {
    display: flex !important;
    gap: 20px !important;
    margin-bottom: 0 !important;
  }

  .hero-trust {
    display: none !important;
  }
}

/* Medium/zoomed desktop: preserve the same composition without overlap. */
@media screen and (min-width: 801px) and (max-width: 1100px) {
  .hero-content {
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr) !important;
    gap: 35px !important;
  }

  .hero-card {
    padding: 28px !important;
  }

  .hero-card > img {
    height: 360px !important;
  }

  .hero h1 {
    font-size: clamp(42px, 5vw, 62px) !important;
    letter-spacing: -3px !important;
  }

  .hero-text {
    font-size: 17px !important;
  }

  .hero-trust {
    display: none !important;
  }
}

/* Mobile: let the existing mobile rules remain in control. */
@media screen and (max-width: 800px) {
  .hero {
    padding-top: 28px !important;
    padding-bottom: 45px !important;
  }

  .hero-content {
    display: block !important;
    padding-top: 0 !important;
  }

  .hero-copy {
    padding-top: 0;
  }

  .hero-card {
    margin-top: 35px !important;
  }

  .hero-card > img {
    width: 100% !important;
    height: 350px !important;
    object-fit: cover !important;
    object-position: center top !important;
    border-radius: 13px !important;
  }

  .hero-actions {
    display: flex !important;
  }

  .hero-trust {
    display: none !important;
  }
}