/* ============================================================================
   IMPACT archetype — replication of Maestrooo "Impact" (raindrums.co.uk / solanly.com)
   Mood: premium editorial commerce. Geometric DIN-style type, green pill CTAs,
   soft 24px cards on flat shadows, colored footer anchor.
   Reference: https://raindrums.co.uk · https://solanly.com · theme src /tmp/theme-{raindrums,solanly}
   Palette source: settings_data.json (primary #00a341, footer #7069bc, badge #803cee)
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800;900&display=swap');

:root {
  --imp-primary:    #00a341;   /* green — ATC / primary */
  --imp-primary-d:  #018236;   /* hover darken */
  --imp-footer:     #7069bc;   /* purple footer anchor (solanly); raindrums uses #1373e5 */
  --imp-badge:      #803cee;   /* purple badge accent */
  --imp-gold:       #f0c417;   /* secondary highlight */
  --imp-ink:        #1a1a1a;   /* near-black text */
  --imp-bg:         #ffffff;
  --imp-surface:    #f6f6f7;   /* light section/chip bg */
  --imp-border:     #e6e6ea;
  --imp-muted:      #6b6b73;
  --imp-r-btn:      60px;      /* pill */
  --imp-r-card:     24px;
  --imp-r-input:    8px;
  --imp-shadow:     0 8px 18px rgba(20,20,20,0.08);
  --imp-shadow-lg:  0 16px 36px rgba(20,20,20,0.12);
  --imp-head:       'Archivo', -apple-system, system-ui, sans-serif;
  --imp-body:       'Archivo', -apple-system, system-ui, sans-serif;
}

/* ---- base ---- */
body, .ms-shell, .ms-wrap, .ms-main {
  font-family: var(--imp-body);
  background: var(--imp-bg);
  color: var(--imp-ink);
}
.ms-section-title, .ms-impact-section, .ms-collection-section { background: var(--imp-bg); }

/* ---- typography: geometric, oversized, tight tracking ---- */
h1, h2, h3,
.ms-section-title, .ms-impact-title, .ms-page-title,
.ms-hero-body, .ms-hero-full-content h1, .ms-card-title, .ms-footer-title,
.ms-brand-name, .pdp-title, .ms-collection-tile-title {
  font-family: var(--imp-head);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--imp-ink);
}
.ms-hero-full-content h1, .ms-hero-body { font-size: clamp(2.4rem, 5.2vw, 4.4rem); line-height: 1.02; letter-spacing: -0.03em; }
.ms-section-title, .ms-impact-title { font-size: clamp(1.7rem, 3vw, 2.6rem); line-height: 1.05; }
.pdp-title { font-size: clamp(1.5rem, 2.6vw, 2.1rem); line-height: 1.08; }
.ms-section-kicker, .ms-kicker, .ms-impact-kicker, .ms-card-category {
  font-family: var(--imp-head); font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.12em; font-size: 0.72rem; color: var(--imp-primary);
}

/* ---- header + nav ---- */
.ms-header, .ms-header-inner { background: var(--imp-bg); border-bottom: 1px solid var(--imp-border); }
.ms-brand-name { font-weight: 900; letter-spacing: -0.03em; color: var(--imp-ink); }
.ms-brand-tagline { color: var(--imp-muted); }
.ms-nav-link { color: var(--imp-ink); font-family: var(--imp-head); font-weight: 600; }
.ms-nav-link:hover { color: var(--imp-primary); }

/* ---- announcement topbar ---- */
.ms-topbar, .ms-topbar-inner { background: var(--imp-ink); color: #fff; }
.ms-topbar a, .ms-topbar-phone, .ms-topbar-trust-item { color: #fff; }
.ms-topbar-sep { opacity: 0.4; }

/* ---- buttons: green pill, reverse on hover ---- */
.ms-button, .ms-button-primary, .ms-card-btn, .ms-cookie-accept, .ms-page-btn,
.pdp-cta-primary, .pdp-sticky-cta, .pdp-sticky-bar-cta, .ms-newsletter-form button,
button[type="submit"] {
  background: var(--imp-primary);
  color: #fff;
  border: 2px solid var(--imp-primary);
  border-radius: var(--imp-r-btn);
  padding: 15px 34px;
  font-family: var(--imp-head);
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.ms-button:hover, .ms-button-primary:hover, .ms-card-btn:hover,
.pdp-cta-primary:hover, .pdp-sticky-bar-cta:hover, button[type="submit"]:hover {
  background: var(--imp-primary-d);
  border-color: var(--imp-primary-d);
  transform: translateY(-1px);
  box-shadow: var(--imp-shadow);
}
.ms-button-ghost, .ms-button-light, .ms-pill {
  background: transparent; color: var(--imp-ink);
  border: 2px solid var(--imp-ink); border-radius: var(--imp-r-btn);
  font-family: var(--imp-head); font-weight: 700;
}
.ms-button-ghost:hover, .ms-button-light:hover, .ms-pill:hover { background: var(--imp-ink); color: #fff; }

/* ---- product cards: soft 24px, flat shadow, lift on hover ---- */
.ms-product-card {
  background: var(--imp-bg);
  border: none;
  border-radius: var(--imp-r-card);
  box-shadow: var(--imp-shadow);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}
.ms-product-card:hover { transform: translateY(-4px); box-shadow: var(--imp-shadow-lg); }
.ms-card-figure, .ms-card-link img { border-radius: 0; }
.ms-card-title { font-weight: 700; font-size: 1rem; letter-spacing: -0.01em; }
.ms-card-price, .ms-price-main { font-family: var(--imp-head); font-weight: 800; color: var(--imp-ink); }
.ms-price-compare { color: var(--imp-muted); }
.ms-card-material-chip, .ms-chip {
  background: var(--imp-surface); color: var(--imp-muted);
  border-radius: var(--imp-r-btn); font-size: 0.72rem; font-weight: 600; border: none;
}
.ms-card-scarcity { color: var(--imp-badge); font-weight: 700; }
.ms-card-savings-line { color: var(--imp-primary); font-weight: 700; }
.ms-card-wishlist { color: var(--imp-ink); }

/* ---- collection tiles ---- */
.ms-collection-tile, .ms-sub-collection-card { border-radius: var(--imp-r-card); overflow: hidden; box-shadow: var(--imp-shadow); }
.ms-collection-tile-overlay { background: linear-gradient(180deg, transparent 40%, rgba(20,20,20,0.55)); }
.ms-collection-tile-title { color: #fff; font-weight: 800; letter-spacing: -0.02em; }

/* ---- hero ---- */
.ms-hero-full { border-radius: 0; }
.ms-hero-full-overlay { background: linear-gradient(90deg, rgba(20,20,20,0.45), transparent 70%); }
.ms-hero-actions .ms-button-primary { box-shadow: var(--imp-shadow-lg); }

/* ---- trust + payment strips ---- */
.ms-trust-strip { background: var(--imp-surface); border-top: 1px solid var(--imp-border); border-bottom: 1px solid var(--imp-border); }
.ms-trust-label { color: var(--imp-ink); font-family: var(--imp-head); font-weight: 700; }
.ms-trust-body, .ms-trust-icon { color: var(--imp-muted); }
.ms-trust-icon { color: var(--imp-primary); }
.ms-payment-strip { color: var(--imp-muted); }

/* ---- newsletter ---- */
.ms-newsletter-band { background: var(--imp-ink); color: #fff; }
.ms-newsletter-band h2, .ms-newsletter-band .ms-section-title { color: #fff; }

/* ---- footer: purple anchor ---- */
.ms-footer, .ms-footer-inner { background: var(--imp-footer); color: #fff; }
.ms-footer-title { color: #fff; }
.ms-footer a, .ms-footer-trust, .ms-footer-bottom { color: rgba(255,255,255,0.86); }
.ms-footer a:hover { color: #fff; }

/* ---- inputs ---- */
input, textarea, select, .ms-sort-select, .ms-newsletter-form input {
  border-radius: var(--imp-r-input);
  border: 1px solid var(--imp-border);
  font-family: var(--imp-body);
}
input:focus, textarea:focus, select:focus { outline: 2px solid var(--imp-primary); outline-offset: 1px; border-color: var(--imp-primary); }

/* ---- PDP ---- */
.pdp-price-main { font-family: var(--imp-head); font-weight: 800; color: var(--imp-ink); }
.pdp-badge, .pdp-badge-savings { background: var(--imp-badge); color: #fff; border-radius: var(--imp-r-btn); font-weight: 700; }
.pdp-badge-stock { background: rgba(0,163,65,0.12); color: var(--imp-primary-d); border-radius: var(--imp-r-btn); font-weight: 700; }
.pdp-badge-oos { background: var(--imp-surface); color: var(--imp-muted); border-radius: var(--imp-r-btn); }
.pdp-swatch, .pdp-variant-pill { border-radius: var(--imp-r-input); border: 2px solid var(--imp-border); font-family: var(--imp-head); font-weight: 600; }
.pdp-variant-pill:hover { border-color: var(--imp-ink); }
.pdp-sticky-bar { background: var(--imp-bg); box-shadow: 0 -8px 18px rgba(20,20,20,0.08); border-top: 1px solid var(--imp-border); }
.pdp-buybox { border-radius: var(--imp-r-card); }
.pdp-benefit-card { background: var(--imp-surface); border-radius: var(--imp-r-card); border: none; }
.pdp-benefit-icon { color: var(--imp-primary); }
.pdp-trust-grid, .pdp-trust-item { color: var(--imp-muted); }
.pdp-trust-icon { color: var(--imp-primary); }
.pdp-specs-table { border-radius: var(--imp-r-input); overflow: hidden; }
.pdp-features-strip, .pdp-atc-trust-strip { color: var(--imp-muted); }

/* ============================================================================
   LAYOUT FIDELITY — Impact structural proportions (page width 1440, 4-up grid,
   square card media + left info, ~55/45 PDP split, sticky header). Gated to impact.
   ============================================================================ */
.ms-header-inner, .ms-footer-inner, .ms-topbar-inner, .ms-section-head,
.ms-product-grid, .ms-collection-tiles, .ms-hero-full-content, .ms-newsletter-inner {
  max-width: 1440px; margin-left: auto; margin-right: auto;
}
.ms-header { position: sticky; top: 0; z-index: 50; }
.ms-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 18px; }
@media (max-width: 1100px) { .ms-product-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 760px)  { .ms-product-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; } }
.ms-product-card { position: relative; text-align: left; display: flex; flex-direction: column; }
.ms-card-figure { position: relative; aspect-ratio: 1 / 1; overflow: hidden; }
.ms-card-figure img, .ms-card-link img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ms-card-scarcity { position: absolute; top: 12px; left: 12px; z-index: 2; background: var(--imp-badge); color:#fff; padding: 4px 11px; border-radius: var(--imp-r-btn); font-size: .66rem; letter-spacing: .04em; }
.ms-card-wishlist { position: absolute; top: 10px; right: 10px; z-index: 2; }
.ms-collection-tiles, .ms-sub-collections-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
@media (max-width: 760px) { .ms-collection-tiles, .ms-sub-collections-grid { grid-template-columns: 1fr 1fr; gap: 12px; } }
.ms-collection-tile, .ms-sub-collection-card { aspect-ratio: 4 / 5; }
.ms-hero-full { min-height: 70vh; display: flex; align-items: center; }
.pdp-layout { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(0,0.88fr); gap: 48px; align-items: start; }
@media (max-width: 900px) { .pdp-layout { grid-template-columns: 1fr; gap: 24px; } }
.pdp-buybox { position: sticky; top: 88px; }
@media (max-width: 900px) { .pdp-buybox { position: static; } }
.pdp-gallery img, .pdp-main-img-wrap img { border-radius: var(--imp-r-card); }
.ms-footer-inner { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: 32px; }
@media (max-width: 820px) { .ms-footer-inner { grid-template-columns: 1fr 1fr; gap: 24px; } }