/* Footer uses its own scoped tokens and fluid spacing. */
.commerce-footer {
  clear: both;
  --footer-text: var(--color_font);
  --footer-muted: var(--color_font_secondary, #555);
  --footer-line: var(--color_border);
  background: var(--color_background);
  color: var(--footer-text);
  border-top: 1px solid var(--footer-line);
  padding: clamp(2rem, 4vw, 4rem) 0 0;
  font-size: .875rem;
  line-height: 1.65;
}
.commerce-footer a { color: var(--footer-text); text-decoration: none; transition: color .2s, background .2s; }
.home .commerce-footer { border-top: 0; }
.commerce-footer a:hover { color: var(--color_base); }
.commerce-footer a:focus-visible { outline: 2px solid var(--color_base); outline-offset: 5px; border-radius: 4px; }
.commerce-footer h2, .commerce-footer h3 { color: var(--footer-text); margin: 0; }
.commerce-footer h3 { font-size: .875rem; font-weight: 600; margin-bottom: 1.25rem; }
.commerce-footer p { color: var(--footer-muted); margin: .625rem 0 0; }
.footer-help { position: relative; overflow: hidden; isolation: isolate; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem 2.5rem; background: var(--gradient_brand); color: #fff; border-radius: 1.25rem; padding: clamp(1.75rem, 4vw, 3rem) clamp(1.5rem, 4vw, 3.5rem); }
.footer-help::after { content: ''; position: absolute; z-index: -1; right: clamp(-2rem, 2vw, 2rem); bottom: -35%; width: clamp(14rem, 28vw, 26rem); aspect-ratio: 1; background: url('../images/brand/icon-white.svg') center / contain no-repeat; opacity: .14; pointer-events: none; }
.footer-help > div:first-child { position: relative; }
.footer-help-actions { position: relative; display: flex; flex-flow: row wrap; align-items: center; justify-content: center; gap: .75rem; flex-shrink: 0; padding-left: clamp(1.5rem, 3vw, 3rem); border-left: 1px solid rgba(255, 255, 255, .35); }
.commerce-footer .footer-contact-button-secondary { display: inline-flex; align-items: center; justify-content: center; min-height: 3rem; padding: .875rem 1.5rem; border: 2px solid #fff; border-radius: var(--border_radius_pill); color: #fff; font-weight: 700; transition: background-color var(--transition_default), color var(--transition_default); }
.commerce-footer .footer-contact-button-secondary:hover { background: rgba(255, 255, 255, .18); color: #fff; }
.commerce-footer .footer-contact-button-secondary:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.footer-help-reply { flex-basis: 100%; text-align: center; font-size: .75rem; color: rgba(255, 255, 255, .85); }
.commerce-footer .footer-help-channels { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.25rem; }
.commerce-footer .footer-help-channels li { display: inline-flex; align-items: center; gap: .5rem; margin: 0; padding: .375rem .875rem; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .32); border-radius: var(--border_radius_pill); color: #fff; font-size: .8125rem; line-height: 1.4; overflow-wrap: anywhere; }
.footer-help p { color: rgba(255, 255, 255, .92); max-width: 42ch; }
.footer-eyebrow { display: block; color: #fff; font-size: .75rem; letter-spacing: .12em; font-weight: 600; margin-bottom: .625rem; }
.commerce-footer .footer-help h2 { color: #fff; font-size: clamp(1.625rem, 2.6vw, 2.25rem); font-weight: 700; letter-spacing: -.02em; line-height: 1.15; }
.commerce-footer .footer-contact-button { display: inline-flex; align-items: center; justify-content: center; gap: 1rem; background: #fff; color: var(--color_base); border-radius: var(--border_radius_pill); padding: .9375rem 1.5rem; min-height: 3rem; font-weight: 700; flex-shrink: 0; box-shadow: 0 4px 16px rgba(0, 0, 0, .18); transition: background-color var(--transition_default), box-shadow var(--transition_default), transform var(--transition_default); }
.commerce-footer .footer-contact-button:hover { background: var(--color_base); color: #fff; box-shadow: 0 6px 24px rgba(0, 0, 0, .28); }
.commerce-footer .footer-contact-button:active { transform: scale(.97); }
.commerce-footer .footer-contact-button:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.footer-contact-button span { transition: transform var(--transition_default); }
.footer-contact-button:hover span { transform: translate(2px, -2px); }
.footer-contact-button .bi { font-size: 1.25rem; line-height: 1; }
.commerce-footer-grid { display: grid; grid-template-columns: 1.4fr .85fr .85fr 1.2fr; gap: clamp(1.5rem, 3vw, 3.5rem); padding: clamp(2.5rem, 4vw, 4rem) 0; }
.commerce-footer-grid > * { min-width: 0; }
.commerce-footer-wordmark { display: inline-block; }
.commerce-footer-wordmark img { display: block; width: auto; height: 3rem; max-width: 100%; }

.commerce-footer-brand p { margin-top: 1rem; }
.commerce-footer ul { list-style: none; margin: 0; padding: 0; }
.commerce-footer li { margin: 0 0 .625rem; }
.commerce-footer nav a { color: var(--footer-muted); display: inline-block; padding: .125rem 0; }
.footer-group > summary { list-style: none; cursor: default; }
.footer-group > summary::-webkit-details-marker { display: none; }
.footer-group > summary h3 { margin: 0 0 1.25rem; }
.commerce-footer-support > a { display: block; overflow-wrap: anywhere; margin-bottom: .5rem; }
.footer-support-note { display: block; margin-top: 1rem; font-size: .75rem; color: var(--footer-muted); }
.commerce-footer-social { display: flex; gap: .5rem; margin-top: 1.25rem; }
.commerce-footer-social:empty { display: none; }
.commerce-footer-social a { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border: 1px solid var(--footer-line); border-radius: .625rem; }
.commerce-footer-payments { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem 1.25rem; border-top: 1px solid var(--footer-line); padding: 1.25rem 0; }
.footer-payments-label { font-weight: 700; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--footer-muted); }
.commerce-footer-payment-methods { display: flex; flex-wrap: wrap; gap: .5rem; }
.commerce-footer-payment-methods span { border: 1px solid var(--footer-line); padding: .375rem .75rem; border-radius: var(--border_radius_pill); font-size: .75rem; }
/* Rodapé legal: links de políticas centralizados em cima, linha legal única embaixo */
.commerce-footer-bottom { display: flex; flex-direction: column; align-items: center; gap: 1rem; border-top: 1px solid var(--footer-line); padding: 1.75rem 0 2rem; text-align: center; }
.footer-policy-links ul { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.75rem; }
.footer-policy-links li { margin: 0; }
.commerce-footer-bottom .footer-policy-links a { color: var(--footer-text); font-size: .875rem; padding: 0; }
.commerce-footer-bottom .footer-policy-links a:hover { color: var(--color_base); }
.commerce-footer .footer-legal-line { display: flex; flex-wrap: wrap; justify-content: center; margin: 0; font-size: .75rem; line-height: 1.6; color: var(--footer-muted); }
.footer-legal-line span + span::before { content: '·'; margin: 0 .625rem; opacity: .6; }
/* Desktop largo: botões lado a lado numa linha só; a frase sai do fluxo para
   que eles fiquem no centro vertical do banner. */
@media (min-width: 1025px) {
 .footer-help-actions { align-self: stretch; flex-wrap: nowrap; }
 .footer-help-actions > a { white-space: nowrap; }
 .footer-help-reply { position: absolute; left: clamp(1.5rem, 3vw, 3rem); right: 0; top: calc(50% + 2.25rem); flex-basis: auto; }
}
@media (min-width: 576px) and (max-width: 1024px) {
 .footer-help { flex-wrap: wrap; }
 .footer-help-actions { width: 100%; padding: 1.25rem 0 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .35); }
}
@media (max-width: 1024px) { .commerce-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575px) {
 .footer-help { flex-direction: column; align-items: flex-start; }
 .commerce-footer .footer-contact-button, .commerce-footer .footer-contact-button-secondary { flex: 1 1 10rem; width: auto; }
 .footer-help::after { bottom: -20%; right: -3rem; }
 .footer-help-actions { width: 100%; max-width: none; padding-left: 0; border-left: 0; padding-top: 1.25rem; border-top: 1px solid rgba(255, 255, 255, .35); }
 .commerce-footer-brand, .commerce-footer-support { grid-column: 1 / -1; }
 .commerce-footer-grid { gap: 2rem 1rem; }
}
/* Payment flags used independently in the product's payment panel. */
.product-tab-panel-payment .payment-list { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; padding: 0; list-style: none; }
.product-tab-panel-payment .payment-form { margin: 0; }
.product-tab-panel-payment .payment-form img { width: 45px; height: 32px; object-fit: contain; }

/* Mobile: alvos de toque de 44px (WCAG 2.5.5 / HIG), contraste do banner e
   área segura do iOS. Os links tinham 23-27px de altura. */
@media (max-width: 767px) {
 .commerce-footer nav a,
 .commerce-footer-support > a,
 .commerce-footer .footer-policy-links a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0; }
 .commerce-footer li { margin: 0; }
 .commerce-footer h3 { margin-bottom: .5rem; }
 .commerce-footer-support > a { display: flex; margin-bottom: 0; }
 .commerce-footer-social a { width: 2.75rem; height: 2.75rem; }
 .footer-policy-links ul { gap: 0 1.25rem; }
 .commerce-footer-bottom { padding-bottom: calc(2rem + env(safe-area-inset-bottom)); }
 /* Banner: texto fica sobre o azul (topo) e os botões sobre o verde/amarelo (base). */
 .footer-help { background: linear-gradient(170deg, #1D4ED8 0%, #1D4ED8 30%, #2EA8AA 75%, #C8D44A 100%); }
 .commerce-footer .footer-help-channels li { background: rgba(10, 10, 10, .32); border-color: rgba(255, 255, 255, .4); }
 .footer-help-reply { color: #0A0A0A; font-weight: 700; }
 .commerce-footer .footer-contact-button-secondary { background: rgba(10, 10, 10, .4); border-color: #fff; }
}

/* Desktop: grupos sempre abertos, título não clicável. */
@media (min-width: 768px) {
 .footer-group > summary { pointer-events: none; }
}
/* Mobile: acordeão de uma coluna, título de 48px com chevron. */
@media (max-width: 767px) {
 .commerce-footer-grid { grid-template-columns: minmax(0, 1fr); gap: 0; padding-bottom: 1rem; }
 .commerce-footer-brand { padding-bottom: 1.5rem; }
 .commerce-footer-grid > nav, .commerce-footer-grid > .commerce-footer-support { border-top: 1px solid var(--footer-line); }
 .footer-group > summary { display: flex; align-items: center; justify-content: space-between; min-height: 3rem; cursor: pointer; }
 .footer-group > summary h3 { margin: 0; }
 .footer-group > summary::after { content: ''; width: .5rem; height: .5rem; margin-right: .25rem; border: solid var(--footer-muted); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform var(--transition_default); }
 .footer-group[open] > summary::after { transform: rotate(-135deg); }
 .footer-group > summary:focus-visible { outline: 2px solid var(--color_base); outline-offset: 2px; border-radius: 4px; }
 .footer-group[open] { padding-bottom: .75rem; }
}