/* Shared readable typography for every storefront information page.
   This file is loaded after page-specific styles so the visual hierarchy
   remains identical even when an individual page has a unique layout. */
:is(.shipping-page, .contact-page) {
  --info-copy: 15px;
  --info-secondary: 14px;
  --info-card-title: 15px;
  --info-action-weight: 550;
  color: #263449;
  font-size: var(--info-copy);
  font-weight: 400;
}

:is(.shipping-page, .contact-page)
  :is(.shipping-breadcrumb, .contact-breadcrumb) {
  font-size: 14px;
  font-weight: 450;
  line-height: 1.5;
}
:is(.shipping-page, .contact-page)
  :is(.shipping-kicker, .shipping-section-kicker, .contact-kicker) {
  font-size: 14px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: 0.035em;
}
:is(.shipping-page, .contact-page)
  :is(.shipping-hero h1, .terms-masthead h1, .contact-hero h1) {
  color: #111827;
  font-size: var(--site-h1) !important;
  font-weight: 700 !important;
  line-height: 1.16 !important;
  letter-spacing: -0.025em !important;
}
:is(.shipping-page, .contact-page)
  :is(.shipping-hero p, .terms-masthead p, .contact-hero p) {
  color: #5f6d82;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.65;
}
:is(.shipping-page, .contact-page)
  :is(.shipping-hero-actions a, .contact-submit) {
  font-size: 14px;
  font-weight: var(--info-action-weight);
}

/* Intro cards and the sticky page index. */
.shipping-page .shipping-options small {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.025em;
}
.shipping-page .shipping-options h2 {
  font-size: var(--info-card-title);
  font-weight: 600;
  line-height: 1.4;
}
.shipping-page .shipping-options p {
  font-size: var(--info-secondary);
  font-weight: 400;
  line-height: 1.55;
}
.shipping-page .shipping-nav > strong {
  font-size: 14px;
  font-weight: 600;
}
.shipping-page .shipping-nav > a {
  font-size: 14px;
  font-weight: 450;
  line-height: 1.45;
}
.shipping-page .shipping-nav > a span {
  font-size: 14px;
  font-weight: 550;
}
.shipping-page .shipping-nav > a.is-active {
  font-weight: 600;
}
.shipping-page .shipping-nav-help :is(small, p, a) {
  font-size: 14px;
  line-height: 1.5;
}
.shipping-page .shipping-nav-help small {
  font-weight: 600;
  letter-spacing: 0.025em;
}
.shipping-page .shipping-nav-help a {
  font-weight: 550;
}

/* Content cards, tables, notes and FAQ. */
.shipping-page .shipping-section h2 {
  font-size: 24px;
  font-weight: 650;
  line-height: 1.25;
  letter-spacing: -0.018em;
}
.shipping-page
  :is(
    .shipping-section > p,
    .shipping-section li,
    .shipping-section td,
    .shipping-section th,
    .shipping-section summary,
    .shipping-section details p,
    .shipping-faq p,
    .shipping-faq summary
  ) {
  font-size: 15px;
  font-weight: 400;
  line-height: 1.62;
}
.shipping-page
  :is(
    .shipping-section h3,
    .shipping-steps strong,
    .shipping-factors strong,
    .shipping-method-grid strong,
    .shipping-tracking-card strong,
    .policy-two-column h3,
    .policy-checklist strong,
    .policy-contact-card strong
  ) {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}
.shipping-page .shipping-zone-badge {
  font-size: 14px;
  font-weight: 600;
}
.shipping-page
  :is(
    .shipping-steps p,
    .shipping-steps small,
    .shipping-factors p,
    .shipping-factors small,
    .shipping-method-grid p,
    .shipping-method-grid small,
    .shipping-tracking-card p,
    .shipping-tracking-card small,
    .policy-two-column p,
    .policy-two-column li,
    .policy-checklist li,
    .policy-checklist small,
    .policy-route-grid p,
    .policy-route-grid a,
    .policy-contact-card p,
    .policy-contact-card a,
    .policy-warning p
  ) {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
}
.shipping-page
  :is(.shipping-tracking-card a, .policy-contact-card a, .policy-route-grid a) {
  font-weight: 550;
}

/* FAQ must read as a separate destination, not as another white content card. */
.shipping-page .shipping-faq {
  margin-top: 34px;
  padding: 30px;
  border-color: #bfd1ed;
  background: linear-gradient(135deg, #f3f7fe 0, #fff 48%);
  box-shadow: 0 14px 34px rgba(42, 69, 108, 0.07);
}
.shipping-page .shipping-faq > div:first-child {
  align-self: start;
  padding: 22px;
  border: 1px solid #d4e1f4;
  background: #eaf2ff;
}
.shipping-page .shipping-faq h2 {
  font-size: 24px;
  font-weight: 650;
  line-height: 1.25;
}
.shipping-page .shipping-faq-list {
  border-top-color: #cbd8ea;
}
.shipping-page .shipping-faq details {
  border-bottom-color: #d5e0ee;
}
.shipping-page .shipping-faq summary {
  padding: 18px 5px;
  color: #26364c;
  font-size: 15px;
  font-weight: 600 !important;
  line-height: 1.45;
}
.shipping-page .shipping-faq details[open] summary {
  color: #245fcf;
}
.shipping-page .shipping-faq details p {
  padding: 0 34px 18px 5px;
  color: #53647a;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.62;
}

/* Page-specific feature panels. */
.payment-page .payment-hero-panel :is(small, li, p),
.payment-page .payment-security-strip :is(small, p),
.warranty-page .warranty-case-card :is(small, span, dt, dd, p),
.returns-page .returns-period-card :is(small, span, p),
.terms-page .terms-masthead aside :is(small, span, em),
.terms-page
  :is(
    .terms-priority-note p,
    .terms-rule-list p,
    .terms-numbered p,
    .terms-definitions span,
    .terms-company-grid strong,
    .terms-company-grid a,
    .terms-deadline-flow small,
    .terms-withdrawal-form p,
    .terms-withdrawal-form small,
    .terms-remedy-grid p,
    .terms-authority-link
  ) {
  font-size: 14px !important;
  font-weight: 400;
  line-height: 1.55;
}
.payment-page .payment-hero-panel strong {
  font-size: 16px;
  font-weight: 550;
}
.warranty-page .warranty-case-card strong,
.returns-page .returns-period-card strong,
.terms-page .terms-masthead aside strong {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.45;
}
.terms-page .terms-masthead aside small {
  font-weight: 600;
  letter-spacing: 0.025em;
}
.terms-page .terms-clause {
  font-size: 14px;
  font-weight: 600;
}
.terms-page .terms-document .shipping-section h2 {
  font-size: 23px;
  font-weight: 650;
}
.returns-page .policy-two-column article.is-business > span {
  font-size: 14px;
  font-weight: 600;
}
.terms-page .terms-company-grid :is(small, label),
.terms-page .terms-withdrawal-form :is(span, strong, small),
.terms-page .policy-contact-card :is(small, span) {
  font-size: 14px !important;
  line-height: 1.5;
}
.terms-page .terms-contact-final span {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}
.terms-page .terms-contact-final {
  border: 1px solid #cbdcf3;
  background: #f3f7fd;
  box-shadow: none;
}
.terms-page .terms-contact-final span {
  color: #64758b;
}
.terms-page .terms-contact-final strong {
  margin-top: 4px;
  color: #29394f;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.45;
}
.terms-page .terms-contact-final a {
  border: 1px solid #9ab6e3;
  background: #fff;
  color: #28599f;
  font-size: 14px;
  font-weight: 550;
  box-shadow: none;
}
.terms-page .terms-contact-final a:hover {
  border-color: #2a66eb;
  background: #edf4ff;
}

/* Contact page. */
.contact-page .contact-hero-status :is(strong, small) {
  font-size: 14px;
  line-height: 1.45;
}
.contact-page .contact-hero-status strong {
  font-weight: 600;
}
.contact-page .contact-action small {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.025em;
}
.contact-page .contact-action strong {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}
.contact-page .contact-action em {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}
.contact-page .contact-section-head h2 {
  font-size: 20px;
  font-weight: 650;
}
.contact-page .contact-section-head p {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}
.contact-page .contact-field > span {
  font-size: 14px;
  font-weight: 600;
}
.contact-page
  :is(
    .contact-field > small,
    .contact-counter,
    .contact-consent strong,
    .contact-consent small
  ) {
  font-size: 14px;
  line-height: 1.5;
}
.contact-page .contact-consent strong {
  font-weight: 600;
}
.contact-page .contact-info-card h3 {
  font-size: 15px;
  font-weight: 600;
}
.contact-page
  :is(
    .contact-info-row span,
    .contact-info-row strong,
    .contact-hours > span,
    .contact-timezone,
    .contact-company small,
    .contact-company strong,
    .contact-addresses small,
    .contact-addresses strong,
    .contact-addresses p > span,
    .contact-note strong,
    .contact-note span,
    .contact-form-alert strong,
    .contact-form-alert small
  ) {
  font-size: 14px;
  line-height: 1.5;
}
.contact-page
  :is(
    .contact-info-row span,
    .contact-company small,
    .contact-addresses small
  ) {
  font-weight: 500;
  letter-spacing: 0.025em;
}
.contact-page
  :is(
    .contact-info-row strong,
    .contact-company strong,
    .contact-addresses strong,
    .contact-note strong,
    .contact-form-alert strong
  ) {
  font-weight: 600;
}
.contact-page .contact-addresses small {
  font-size: 12px !important;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.045em;
}
.contact-page .contact-addresses strong {
  font-size: 14px !important;
  font-weight: 500;
  line-height: 1.5;
}
.contact-page .contact-addresses p > span {
  font-size: 14px !important;
  font-weight: 400;
  line-height: 1.5;
}

@media (max-width: 700px) {
  :is(.shipping-page, .contact-page)
    :is(.shipping-hero h1, .terms-masthead h1, .contact-hero h1) {
    font-size: var(--site-h1) !important;
  }
  .shipping-page .shipping-section h2 {
    font-size: 22px;
  }
  .shipping-page table :is(th, td) {
    font-size: 14px !important;
    line-height: 1.5;
  }
  .shipping-page .shipping-faq {
    padding: 18px 16px;
  }
  .shipping-page .shipping-faq > div:first-child {
    padding: 18px;
  }
}

/* Localised labels can be considerably longer than their English source.
   Keep the sticky page index and policy cards inside their grid tracks. */
.shipping-page .shipping-nav {
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
}
.shipping-page .shipping-nav > *,
.shipping-page .shipping-nav-help,
.shipping-page .shipping-nav-help > * {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}
.shipping-page .shipping-nav > a {
  align-items: flex-start;
  overflow-wrap: anywhere;
}
.shipping-page .shipping-nav > a > span {
  flex: 0 0 auto;
}
.shipping-page .shipping-nav-help :is(small, p, a),
.shipping-page :is(.policy-two-column, .policy-route-grid, .policy-checklist) :is(article, div, h3, p, li, strong, small) {
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal;
}
.shipping-page .shipping-nav-help > a {
  height: auto;
  min-height: 40px;
  padding: 8px 12px;
  overflow-wrap: anywhere;
  white-space: normal !important;
}
.shipping-page .policy-route-grid a {
  width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 40px;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  overflow-wrap: anywhere;
  white-space: normal !important;
}
