/* Extracted inline declarations from index.html */
.tc-inline-index-1 { margin-top:12px !important; justify-content:center !important; }
.tc-inline-index-2 { margin-bottom:36px !important; }
.tc-inline-index-3 { margin-top:16px !important; text-align:right !important; }
.tc-inline-index-4 { max-width:760px !important; margin:0 auto !important; }
.tc-inline-index-5 { margin-top:28px !important; }

/* The Travel Cafe — balanced mobile homepage refinement.
   This stylesheet is loaded last on index.html only. */
@media (max-width: 699px) {
  /* Header: retain a comfortable, accessible menu control. */
  .site-header .container {
    padding: 12px 18px;
    gap: 12px;
  }
  .brand img.logo-mark { height: 46px; }
  .mobile-nav { padding: 8px 18px 18px; }

  /* Hero: preserve the photograph behind the editorial text panel. */
  .home-hero .hero-photo-full {
    height: 420px;
    min-height: 0;
    max-height: none;
    object-position: center center;
  }
  .home-hero .hero-overlay-text .container {
    max-width: none;
    margin-left: 0;
    padding: 0 18px;
  }
  .home-hero .hero-overlay-card {
    max-width: 440px;
    padding: 17px 18px 16px;
  }
  .home-hero .hero-overlay-card h1 {
    font-size: clamp(1.82rem, 7.3vw, 2.18rem);
    line-height: 1.12;
    margin-bottom: 10px;
  }
  .home-hero .hero-overlay-card p {
    font-size: 0.89rem;
    line-height: 1.5;
    margin-bottom: 0;
  }

  /* Featured trips: a little less scrolling, without shrinking tap targets. */
  .section.section-warm:not(.home-final-invitation) {
    padding-top: 42px;
    padding-bottom: 44px;
  }
  .section.section-warm:not(.home-final-invitation) > .container,
  .home-final-invitation > .container { padding-left: 20px; padding-right: 20px; }
  .section-heading.tc-inline-index-2 { margin-bottom: 22px !important; }
  .section-heading h2 { font-size: clamp(1.42rem, 5.5vw, 1.7rem); }
  .section-heading p { font-size: 0.91rem; line-height: 1.5; }
  .card-grid { gap: 20px; }
  .card .card-img { aspect-ratio: 16 / 10; }
  .card .card-body { padding: 16px 17px 18px; }
  .card .card-body h3 { font-size: 1.1rem; line-height: 1.25; }
  .card .card-body p.desc { font-size: 0.88rem; line-height: 1.5; margin-bottom: 12px; }
  .tc-inline-index-3 { margin-top: 20px !important; }

  /* Closing invitation: compact, but still inviting. */
  .home-final-invitation { padding-top: 38px; padding-bottom: 42px; }
  .home-final-invitation h2 { font-size: clamp(1.55rem, 6.1vw, 1.85rem); }
  .home-final-invitation p { font-size: 0.92rem; line-height: 1.55; }
  .tc-inline-index-5 { margin-top: 17px !important; }
  .home-final-invitation .btn { max-width: 100%; white-space: normal; text-align: center; justify-content: center; padding: 12px 21px; font-size: 0.9rem; }

  /* Footer: preserve link legibility and comfortable touch spacing. */
  .site-footer { padding-top: 32px; padding-bottom: 22px; }
  .site-footer .container { padding-left: 20px; padding-right: 20px; }
  .footer-grid { gap: 18px; }
  .footer-col h5 {
    margin: 0 0 7px;
    display: flex;
    align-items: center;
    gap: 9px;
  }
  /* Mobile-only editorial rule before each footer navigation heading. */
  .footer-col h5::before {
    content: "";
    display: block;
    flex: 0 0 22px;
    width: 22px;
    height: 1px;
    background-color: #b9a98a;
  }
  .footer-col ul { gap: 5px; }
  .footer-col ul a { display: inline-block; padding: 3px 0; }
  .footer-bottom { margin-top: 22px; }
  .footer-bottom .legal-links { gap: 8px 16px; }
}

/* Very narrow phones: keep the overlay fully inside the viewport. */
@media (max-width: 359px) {
  .home-hero .hero-overlay-text .container { padding: 0 12px; }
  .home-hero .hero-overlay-card { padding: 16px; }
  .home-hero .hero-overlay-card h1 { font-size: 1.8rem; }
  .home-hero .hero-overlay-card p { font-size: 0.87rem; }
}