/* Shared mobile pillar / quick-action strips — stacked layout (max-width: 768px) */

@media (max-width: 768px) {
  .abt-pillars,
  .cnt-pillars,
  .sav-pillars,
  .blg-pillars,
  .cmp-pillars,
  .trk-pillars,
  .pay-pillars,
  .prv-pillars,
  .trm-pillars {
    margin-top: -14px;
    padding-bottom: 16px;
    overflow-x: clip;
  }

  .abt-pillars .container,
  .cnt-pillars .container,
  .sav-pillars .container,
  .blg-pillars .container,
  .cmp-pillars .container,
  .trk-pillars .container,
  .pay-pillars .container,
  .prv-pillars .container,
  .trm-pillars .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .abt-pillar-bar,
  .cnt-pillar-bar,
  .sav-pillar-bar,
  .blg-pillar-bar,
  .cmp-pillar-bar,
  .trk-pillar-bar,
  .pay-pillar-bar,
  .prv-pillar-bar,
  .trm-pillar-bar {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0;
    overflow: visible;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    box-shadow: 0 4px 16px rgba(22, 33, 62, 0.06);
  }

  .abt-pillar,
  .cnt-pillar,
  .sav-pillar,
  .blg-pillar,
  .cmp-pillar,
  .trk-pillar,
  .pay-pillar,
  .prv-pillar,
  .trm-pillar {
    display: flex !important;
    align-items: center;
    gap: 14px;
    width: 100%;
    max-width: 100%;
    flex: none !important;
    box-sizing: border-box;
    padding: 16px;
    border-right: none !important;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    text-decoration: none;
    color: inherit;
    scroll-snap-align: none;
  }

  .abt-pillar:last-child,
  .cnt-pillar:last-child,
  .sav-pillar:last-child,
  .blg-pillar:last-child,
  .cmp-pillar:last-child,
  .trk-pillar:last-child,
  .pay-pillar:last-child,
  .prv-pillar:last-child,
  .trm-pillar:last-child {
    border-bottom: none;
  }

  .sav-pillar > i,
  .blg-pillar > i,
  .cmp-pillar > i,
  .trk-pillar > i,
  .pay-pillar > i,
  .prv-pillar > i,
  .trm-pillar > i,
  .abt-pillar-icon,
  .cnt-pillar-icon {
    width: 40px;
    height: 40px;
    min-width: 40px;
    font-size: 0.95rem;
    flex-shrink: 0;
  }

  .abt-pillar-text,
  .cnt-pillar-text,
  .sav-pillar > span,
  .blg-pillar > span,
  .cmp-pillar > span,
  .trk-pillar > span,
  .pay-pillar > span,
  .prv-pillar > span,
  .trm-pillar > span {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    flex: 1;
  }

  .abt-pillar-text strong,
  .cnt-pillar-text strong,
  .sav-pillar strong,
  .blg-pillar strong,
  .cmp-pillar strong,
  .trk-pillar strong,
  .pay-pillar strong,
  .prv-pillar strong,
  .trm-pillar strong {
    font-size: 0.82rem;
  }

  .abt-pillar-text em,
  .cnt-pillar-text em,
  .sav-pillar em,
  .blg-pillar em,
  .cmp-pillar em,
  .trk-pillar em,
  .pay-pillar em,
  .prv-pillar em,
  .trm-pillar em {
    font-size: 0.72rem;
  }

  /* Homepage quick actions */
  body.home-page .hp-quick {
    padding: 0 0 28px;
    overflow-x: clip;
  }

  body.home-page .hp-quick .container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  body.home-page .hp-quick-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0;
    overflow: visible;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0 !important;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px;
    box-shadow: 0 4px 16px rgba(22, 33, 62, 0.06);
    scrollbar-width: none;
  }

  body.home-page .hp-quick-item {
    display: flex !important;
    align-items: center;
    gap: 14px;
    flex: none !important;
    width: 100%;
    max-width: 100%;
    padding: 16px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 0;
    box-shadow: none;
    text-decoration: none;
    color: inherit;
    scroll-snap-align: none;
  }

  body.home-page .hp-quick-item:last-child {
    border-bottom: none;
  }

  body.home-page .hp-quick-icon {
    width: 40px;
    height: 40px;
    min-width: 40px;
    font-size: 0.95rem;
    flex-shrink: 0;
  }

  body.home-page .hp-quick-text {
    min-width: 0;
    flex: 1;
  }
}

@media (max-width: 480px) {
  .sav-pillar,
  .blg-pillar,
  .cmp-pillar,
  .trk-pillar,
  .pay-pillar,
  .prv-pillar,
  .trm-pillar,
  .abt-pillar,
  .cnt-pillar,
  body.home-page .hp-quick-item {
    flex: none !important;
    width: 100%;
    max-width: 100%;
  }
}