/* Layout fixes added on top of the copied site. Desktop look is unchanged except the hero now fills its box. */

/* Hero: the theme sets images to height:auto, so the background photo stopped short and left a pale bar.
   Make it fill the hero at every width, with a navy fallback, and remove the 10px side strips. */
.hero { background-color: #071d3d; }
.hero .hero-img { height: 100% !important; min-height: 100%; width: 100%; object-fit: cover; }
.e-con:has(> .elementor-widget .hero), .e-con:has(.hero) { padding-left: 0 !important; padding-right: 0 !important; }

html { overflow-x: clip; }
img, video, iframe { max-width: 100%; }

@media (max-width: 768px) {
  /* Hero: comfortable padding, photo crop that keeps the skyline, full-width buttons */
  .hero { min-height: 0; }
  .hero .hero-img { object-position: 65% center; }
  .hero-content { padding: 96px 20px 48px !important; text-align: left; }
  .hero-content h1 { font-size: clamp(1.55rem, 7vw, 2rem) !important; line-height: 1.2; }
  .hero-content p, .hero-sub { font-size: 16px !important; line-height: 1.65; }
  .hero-btns { flex-direction: column; align-items: stretch; width: 100%; gap: 12px; }
  .hero-btns a, .hero .btn, .hero .btn-outline { display: block; width: 100%; text-align: center; padding: 16px 20px; }

  /* Section padding and type */
  .sec-white, .sec-navy, .sec-deep, .sec-cream, .sec-gray { padding-left: 20px !important; padding-right: 20px !important; }
  .sec-white, .sec-navy, .sec-deep, .sec-cream, .sec-gray { padding-top: 56px !important; padding-bottom: 56px !important; }
  .sec-title { font-size: clamp(1.6rem, 7vw, 2rem) !important; }
  .sec-body, .intro-para { font-size: 16px !important; }

  /* Buttons and tap targets */
  .btn, .btn-outline { display: block; width: 100%; text-align: center; padding: 16px 20px; box-sizing: border-box; }
  a, button { min-height: 0; }
  .hdr-nav>a, .mob-nav a { min-height: 44px; display: flex; align-items: center; }

  /* Wide content scrolls inside itself instead of widening the page */
  table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  pre, code { white-space: pre-wrap; word-break: break-word; }
  iframe { width: 100% !important; }

  /* Grids collapse to one column */
  .promise-inner, .what-cards, .testimonials-grid, .footer-grid { grid-template-columns: 1fr !important; }
  .hero-stats { flex-direction: column; }
  .hero-stat { border-right: 0 !important; border-bottom: 1px solid rgba(201,168,76,.2); min-width: 0; }
}

/* Top-right button reads the same on every page */
.ast-builder-html-element a[href="/book-a-consultation/"] b { text-transform: uppercase; }
