/* Phone-only refinements. Desktop and tablet layouts remain unchanged. */
@media (max-width: 600px) {
  .home-page .hero > img { object-position: 52% 50%; }
  .home-page .hero-content > .hero-lead { display: none; }

  body:not(.hirondelles-page):not(.erythrone-page) .page-hero {
    background-position: center, 46% 46%;
  }
  body .page-hero.accommodations-hero {
    background-position: center, 28% 42%;
  }
  .about-hero > img { object-position: 52% 50%; }
  .craft-image img {
    min-height: 0;
    height: auto;
    aspect-ratio: 4 / 3;
    object-position: 48% 48%;
  }

  .eco-grid { gap: 16px; background: transparent; border: 0; }
  .eco-grid article {
    min-height: 0;
    padding: 24px;
    color: var(--green);
    background: #fff;
    border-top: 3px solid var(--gold);
    border-radius: 2px 18px 2px 18px;
    box-shadow: 0 12px 28px rgba(12,18,10,.15);
  }
  .eco-grid h3 { color: var(--green); }
  .eco-grid p { color: var(--muted); }
  .eco-grid p strong { color: var(--green); }
  .eco-grid img.eco-icon { background: #fff; }

  .mobile-activities-heading {
    font-size: clamp(23px, 6.2vw, 28px);
    text-wrap: balance;
  }
}

/* Tablet-only refinements, including iPad landscape. */
@media (min-width: 601px) and (max-width: 1366px) {
  .home-page .hero-content {
    width: 100%;
    max-width: 1100px;
    padding-inline: clamp(28px, 6vw, 72px);
  }
  .home-page .hero h1 {
    max-width: none;
    font-size: clamp(40px, 6.4vw, 68px);
    line-height: 1.08;
  }
  .home-page .proofs strong {
    font-size: clamp(14px, 1.5vw, 18px);
    line-height: 1.2;
    white-space: normal;
  }
  .home-page .proofs span { font-size: 12px; line-height: 1.35; }
  .home-page .proofs > div { padding: 20px 12px; min-width: 0; }
  .clos-hero ~ .section .room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .clos-hero ~ .section .room-grid h3 {
    font-size: 20px;
    line-height: 1.2;
    overflow-wrap: anywhere;
    hyphens: auto;
  }
  .clos-hero ~ .section .room-grid > article { min-width: 0; }
}
@media (min-width: 1001px) and (max-width: 1366px) {
  .clos-hero ~ .section .room-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}