/* Shared tablet and mobile alignment. Desktop layout remains unchanged. */
@media (max-width: 1080px) {
  main section,
  main article,
  main aside,
  .section-heading,
  .itin-heading,
  .application-heading,
  .checklist-copy,
  .services-copy,
  .story-copy,
  .visit-copy,
  .contact-copy,
  .legal-content,
  .legal-toc,
  .error-card {
    text-align: center;
  }

  .service-card,
  .step,
  .contact-card,
  .contact-box,
  .value-card,
  .story-mark,
  .service-list article,
  .process-card,
  .option-card,
  .detail-card,
  .detail-points article,
  .document-item,
  .faq-item,
  .itin-summary,
  .plate-service-card,
  .requirement-grid article,
  .review-card {
    text-align: center;
  }

  main h1,
  main h2,
  main h3,
  main p,
  main .eyebrow,
  main .detail-disclaimer,
  main .visit-intro,
  main .legal-updated {
    margin-left: auto;
    margin-right: auto;
  }

  main .button,
  main button:not(.language-toggle):not(.language-option),
  .hero-actions,
  .hero-buttons,
  .itin-actions,
  .certification-actions,
  .detail-center,
  .center-action,
  .trust-row,
  .itin-trust,
  .trust-note,
  .contact-action-label,
  .error-actions,
  .footer-legal,
  .social-links {
    justify-content: center;
  }

  .card-icon,
  .value-icon,
  .summary-icon,
  .mini-icon,
  .contact-icon,
  .service-icon,
  .step-number,
  .error-icon,
  .detail-card .card-icon {
    margin-left: auto;
    margin-right: auto;
  }

  main ul,
  main ol,
  .summary-list,
  .check-list,
  .document-list {
    margin-left: auto;
    margin-right: auto;
  }

  .summary-list li,
  .check-list li,
  .contact-list > a,
  .contact-list > span,
  .contact-method,
  .document-item,
  .payment-steps article,
  .selected-summary,
  .secure-note {
    text-align: center;
    justify-content: center;
  }

  .document-item > div,
  .payment-steps article > div,
  .selected-summary > div,
  .secure-note > div {
    text-align: center;
  }

  .product-top,
  .review-top,
  .review-source,
  .hours-line,
  .map-badge {
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .map-badge {
    align-items: center;
  }

  .contact-form label,
  .application-form label,
  .field {
    text-align: center;
  }

  .contact-form input,
  .contact-form select,
  .contact-form textarea,
  .application-form input,
  .application-form select,
  .application-form textarea {
    text-align: center;
  }

  .footer-main,
  .footer-brand,
  .footer-main > div,
  .footer-note,
  .footer-title,
  .footer-bottom-row {
    text-align: center;
  }

  .footer-logo,
  .footer-brand img {
    margin-left: auto;
    margin-right: auto;
  }

  .footer-links a,
  .footer-contact a,
  .footer-contact address,
  .social-button {
    justify-content: center;
    text-align: center;
  }

  .footer-contact address {
    align-items: center;
  }
}

@media (max-width: 760px) {
  main .button,
  main button:not(.language-toggle):not(.language-option) {
    text-align: center;
  }

  .check-list li,
  .document-item,
  .secure-note {
    justify-items: center;
  }

  .hours-line {
    flex-direction: column;
    gap: 7px;
  }

  /* Compact, exactly centered heading groups for the mobile visit details. */
  .visit-row {
    display: block;
    padding: 12px 0;
  }

  .visit-row > div {
    display: block;
  }

  .visit-icon-desktop {
    display: none;
  }

  .visit-mobile-heading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    margin: 0 auto 6px;
  }

  .visit-mobile-heading .visit-icon-mobile {
    position: static;
    display: grid;
    flex: 0 0 27px;
    place-items: center;
    margin: 0;
    width: 27px;
    height: 27px;
    border-radius: 8px;
  }

  .visit-mobile-heading .visit-icon-mobile svg {
    width: 14px;
    height: 14px;
  }

  .visit-mobile-heading .visit-label {
    position: static;
    display: block;
    margin: 0;
    font-size: 9px;
    line-height: 1;
  }

  .visit-icon {
    width: 30px;
    height: 30px;
    border-radius: 9px;
  }

  .visit-icon svg {
    width: 15px;
    height: 15px;
  }

  .visit-value,
  .visit-link,
  .hours-line,
  .contact-boxes {
    width: 100%;
  }

  .visit-link {
    justify-content: center;
    margin-top: 0;
  }

  .visit-intro {
    margin-bottom: 20px;
  }

  .contact-boxes {
    gap: 6px;
  }

  .phone-contact {
    min-height: 0;
  }

  .contact-box {
    padding: 10px 12px;
  }

  /* Center the experience panel and the complete Why section on phones. */
  .why-panel,
  .why-inner,
  .why-copy,
  .why-copy > p,
  .mini-stat {
    text-align: center !important;
  }

  .why-number,
  .why-overline,
  .why-inner h3,
  .why-inner > p,
  .why-copy .kicker,
  .why-copy h2,
  .why-copy > p {
    margin-left: auto;
    margin-right: auto;
  }

  .check-list li {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    text-align: center;
  }

  .check-list li::after {
    content: "";
    width: 44px;
  }

  /* Center every visible part of the Google reviews section on phones. */
  .reviews,
  .reviews-heading,
  .reviews-heading .section-heading,
  .reviews-carousel,
  .review-card,
  .review-top > div,
  .review-text {
    text-align: center !important;
  }

  .reviews-heading .section-heading,
  .google-link,
  .review-text {
    margin-left: auto;
    margin-right: auto;
  }

  .reviews-heading {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .reviews-heading .section-heading {
    display: flex;
    width: 100%;
    max-width: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .reviews-heading .kicker,
  .reviews-heading h2,
  .reviews-heading p {
    display: block;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center !important;
  }

  .reviews-heading .google-link {
    align-self: center;
    justify-self: center;
  }

  .review-top {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    align-items: center;
    gap: 10px;
    padding-right: 0;
  }

  .review-top::after {
    content: "";
    width: 42px;
  }
}

/* Slightly smaller title only on the Personal Insurance page. */
.personal-insurance-page .itin-hero h1 {
  font-size: clamp(42px, 4.4vw, 56px);
}

@media (max-width: 700px) {
  .personal-insurance-page .itin-hero h1 {
    font-size: 36px;
  }
}

@media (max-width: 430px) {
  .personal-insurance-page .itin-hero h1 {
    font-size: 34px;
  }
}