/* A compact mobile introduction; the desktop photographic hero is preserved. */
@media screen and (max-width: 700px) {
  html { scroll-padding-top: 80px; }
  section[id] { scroll-margin-top: 80px; }
  .utility-bar { display: none; }
  .site-header .header-inner { min-height: 68px; gap: 12px; }
  .site-header .brand { width: 148px; }
  .site-header .header-cta {
    display: inline-flex;
    min-height: 44px;
    margin-left: auto;
    padding: 10px 12px;
    font-size: .72rem;
    white-space: nowrap;
  }
  .site-header .menu-toggle {
    display: block;
    flex: none;
    width: 44px;
    height: 44px;
    padding: 10px;
    margin-left: 0;
  }
  .site-nav { max-height: calc(100svh - 68px); }

  .landing-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    height: auto;
    min-height: 0;
    background: #f5f7f3;
    color: var(--navy);
  }
  .landing-hero::after { display: none; }
  .landing-content {
    grid-column: 1;
    grid-row: 1;
    padding-top: 36px;
    padding-bottom: 30px;
  }
  .landing-eyebrow {
    max-width: none;
    margin-bottom: 16px;
    font-size: .57rem;
    line-height: 1.6;
    letter-spacing: .12em;
    color: var(--green);
  }
  .landing-hero h1 {
    max-width: none;
    font-size: clamp(2.4rem, 10.5vw, 3.4rem);
    line-height: 1.08;
    letter-spacing: -.045em;
    color: var(--navy);
  }
  .landing-intro {
    max-width: none;
    margin: 18px 0 23px;
    font-size: .93rem;
    line-height: 1.65;
    color: #4b605b;
  }
  .landing-cta {
    max-width: 100%;
    min-height: 48px;
    padding: 13px 18px;
    gap: 26px;
    font-size: .84rem;
    color: #fff;
    background: var(--navy);
    border-color: var(--navy);
  }
  .landing-cta:hover {
    color: #fff;
    background: #123f5b;
    border-color: #123f5b;
  }
  .landing-photo {
    position: relative;
    inset: auto;
    z-index: 0;
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    height: clamp(200px, 56vw, 300px);
    object-fit: cover;
    object-position: 75% 22%;
  }
  .landing-bottom {
    position: static;
    grid-column: 1;
    grid-row: 3;
    min-height: 58px;
    align-items: center;
    padding-top: 7px;
    padding-bottom: 7px;
    gap: 14px;
  }
  .landing-bottom > a {
    max-width: none;
    gap: 10px;
    font-size: .65rem;
    line-height: 1.45;
    color: #274d3b;
  }
  .landing-bottom > a:hover { color: var(--green); }
  .landing-bottom > span {
    max-width: 115px;
    padding: 0;
    font-size: .55rem;
    line-height: 1.5;
    text-align: right;
    white-space: normal;
    color: #61716a;
    background: transparent;
  }
}

@media screen and (max-width: 360px) {
  .site-header .header-cta { display: none; }
  .site-header .menu-toggle { margin-left: auto; }
  .landing-content { padding-top: 30px; padding-bottom: 26px; }
  .landing-hero h1 { font-size: 2.4rem; }
  .landing-intro { font-size: .88rem; }
  .landing-bottom { gap: 10px; }
  .landing-bottom > a { font-size: .6rem; }
  .landing-bottom > span { max-width: 100px; font-size: .52rem; }
}