/* Mobile-first refinements layered over the original visual system. */
html,
body {
  max-width: 100%;
}

button,
a,
summary {
  touch-action: manipulation;
}

@media (max-width: 760px) {
  html { scroll-padding-top: 88px; }
  body { font-size: 15px; }
  .wrap { width: min(100% - 30px, 680px); }

  .nav-inner {
    min-height: 74px;
    height: auto;
    gap: 10px;
    padding-block: 8px;
  }
  .nav .brand { min-width: 0; flex: 1; }
  .nav .brand span { min-width: 0; }
  .nav .brand-logo { width: 42px; height: 42px; }
  .nav .brand b {
    font-size: clamp(17px, 5.2vw, 20px);
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .nav .brand small {
    display: block;
    max-width: 190px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 7px;
    letter-spacing: 1px;
  }
  .menu-toggle {
    min-width: 72px;
    min-height: 44px;
    padding: 8px 11px;
    border-radius: 4px;
    white-space: nowrap;
  }
  .nav-links {
    top: 100%;
    padding: 12px 15px 18px;
    box-shadow: 0 16px 32px rgba(16, 46, 44, .12);
  }
  .nav-links.open { gap: 0; }
  .nav-links a {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 7px 5px;
    border-bottom: 1px solid var(--line);
  }
  .nav-links a:last-child { border-bottom: 0; }

  .letter-entry { height: 420svh; }
  .letter-recede { min-height: 600px; }
  .invitation {
    width: calc(100% - 16px);
    height: calc(100% - 16px);
    padding: 44px 22px 22px;
  }
  .letter-kicker { max-width: 88%; margin-bottom: 10px; }
  .letter-ornament { font-size: 20px; }
  .invitation h1 {
    font-size: clamp(31px, 9.5vw, 38px);
    line-height: 1.42;
    margin: 6px 0;
  }
  .invitation h2 {
    font-size: clamp(19px, 5.8vw, 22px);
    line-height: 1.6;
    margin-bottom: 8px;
  }
  .letter-description { font-size: 13px; line-height: 1.82; }
  .letter-condition {
    font-size: 11px;
    line-height: 1.65;
    margin: 8px 0 13px;
  }
  .stamp-cta { min-width: 178px; min-height: 50px; }
  .letter-scroll { margin-top: 14px; }

  .section { padding: 50px 0; }
  .section-head { margin-bottom: 28px; }
  .section-head h2,
  h2 {
    font-size: clamp(27px, 8vw, 34px);
    line-height: 1.55;
  }
  .section-head p { font-size: 14px; line-height: 1.9; }
  .guide-grid { grid-template-columns: 1fr; gap: 12px; }
  .guide-card { min-height: 0; padding: 22px; }
  .guide-card h3 { margin-top: 12px; font-size: 19px; }
  .card-link { margin-top: 18px; }

  .celebration-hero { min-height: 560px; }
  .celebration-copy { padding-block: 235px 44px; }
  .celebration-copy h2 { font-size: clamp(34px, 10vw, 40px); }

  .feature-service,
  .service-list,
  .service-card,
  .package-card,
  .destination,
  .contact-box { padding-inline: 22px; }
  .feature-service .latin { font-size: 42px; }
  .feature-service h3 { font-size: 25px; line-height: 1.65; }
  .service-card { min-height: 215px; }
  .service-index { margin-bottom: 20px; }

  .timeline { grid-template-columns: 1fr; gap: 24px; }
  .step { padding-top: 18px; }
  .editorial-banner { padding: 24px 21px; }
  .cost-row { padding-block: 17px; }
  .faq-list summary {
    min-height: 48px;
    display: flex;
    align-items: center;
    line-height: 1.75;
  }
  .faq-list summary::after {
    top: 50%;
    transform: translateY(-50%);
  }

  .contact-inner { gap: 22px; }
  .contact-box { padding-block: 24px; }
  .contact-box .btn { width: 100%; min-height: 48px; }
  .contact-number { padding: 15px; }
  .phone-link { font-size: 18px; }
  .channel-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .channel { min-height: 46px; justify-content: center; }

  .footer { padding-top: 40px; }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; }
  .footer-grid > div:first-child { grid-column: auto; }
  .footer-links a {
    display: flex;
    align-items: center;
    min-height: 42px;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
  }
  .fine span { display: block; margin-top: 8px; }

  .topline {
    padding: 8px 15px;
    font-size: 12px;
    line-height: 1.65;
  }
  .article-hero { padding: 32px 0 34px; }
  .article-hero h1 {
    font-size: clamp(28px, 8.6vw, 36px);
    line-height: 1.5;
    margin: 18px 0 12px;
  }
  .article-hero p,
  .article-body p,
  .article-body li { font-size: 15px; line-height: 1.95; }
  .article-shell { padding: 22px 0 60px; }
  .toc { padding: 17px 19px; }
  .toc a {
    min-height: 42px;
    display: flex;
    align-items: center;
    margin-top: 4px;
    border-bottom: 1px solid var(--line);
  }
  .article-body section { margin-bottom: 36px; }
  .article-body h2 {
    font-size: clamp(23px, 7vw, 28px);
    line-height: 1.6;
  }
  .table-wrap {
    margin-inline: -15px;
    padding-inline: 15px;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }
  table { min-width: 590px; }
  th,
  td {
    min-width: 0;
    padding: 13px;
    line-height: 1.8;
  }
  .callout { padding: 18px; }
}

@media (max-width: 380px) {
  .wrap { width: calc(100% - 24px); }
  .nav .brand-logo { width: 38px; height: 38px; }
  .nav .brand small { display: none; }
  .menu-toggle { min-width: 68px; padding-inline: 8px; }
  .invitation { padding: 38px 18px 18px; }
  .letter-description { font-size: 12px; }
  .channel-actions { grid-template-columns: 1fr; }
}

@media (max-width: 760px) and (max-height: 700px) {
  .invitation { padding-top: 30px; }
  .letter-kicker,
  .letter-scroll { display: none; }
  .letter-ornament { font-size: 18px; }
  .invitation h1 { font-size: 30px; }
  .invitation h2 { font-size: 18px; }
}