/* Stickers page styles - minimal, leveraging base.css */

.page-hero {
  margin-block: var(--space-8);
  background: linear-gradient(135deg, rgba(20,184,166,0.08), rgba(217,70,239,0.08));
}
.hero-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: var(--space-8);
  align-items: center;
}
.hero-copy p { margin-block-end: var(--space-5); }
.hero-media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }

.section { margin-block: var(--space-12); }
.section--alt { background: var(--gray-50); padding-block: var(--space-10); }
.section-header { margin-block-end: var(--space-6); }

.media-card { display: grid; grid-template-columns: 1.1fr 1fr; gap: var(--space-6); align-items: center; }
.media-card--reverse { grid-template-columns: 1fr 1.1fr; }
.media-card__media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.media-card__body { display: grid; gap: var(--space-4); }

.feature-list { display: grid; gap: var(--space-3); }
.feature-list.columns { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: var(--space-4); margin-block-start: var(--space-4); }

.steps { display: grid; gap: var(--space-6); counter-reset: steps; }
.steps h3 { font-size: var(--fs-lg); margin: 0; }

.responsive-table { width: 100%; overflow-x: auto; }
.responsive-table table { width: 100%; border-collapse: collapse; }
.responsive-table th, .responsive-table td { text-align: left; padding: var(--space-3); border-bottom: 1px solid var(--color-border); }
.responsive-table thead th { background: var(--gray-100); font-weight: 700; }

.faq details { border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-4); margin-block: var(--space-3); background: var(--color-surface); }
.faq summary { cursor: pointer; font-weight: 700; }
.faq details[open] { box-shadow: var(--shadow-sm); }

.cta-band { text-align: center; }
.cta-band .card { padding-block: var(--space-10); }

/* Responsive */
@media (max-width: 900px) {
  .hero-grid, .media-card, .media-card--reverse { grid-template-columns: 1fr; }
}