/** Shopify CDN: Minification failed

Line 220:0 Unexpected "{"
Line 220:1 Expected identifier but found "%"
Line 221:2 Unexpected "{"
Line 221:3 Unexpected "{"
Line 221:5 Expected identifier but found "'sero-pdp.css'"
Line 222:0 Unexpected "{"
Line 222:1 Expected identifier but found "%"

**/
/* ============================================
   SERO — Custom Stylesheet
   File: assets/sero-custom.css
   DO NOT edit theme source files directly.
   All overrides live here.
   ============================================ */

/* --- GOOGLE FONTS IMPORT --- */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500&family=DM+Sans:wght@300;400;500&display=swap');

/* --- CSS VARIABLES --- */
:root {
  --sero-font-heading: 'Cormorant Garamond', Georgia, serif;
  --sero-font-body: 'DM Sans', system-ui, sans-serif;

  --sero-bg: #FAFAF8;
  --sero-surface: #F2EFE9;
  --sero-surface-dark: #E8E3DA;
  --sero-fg: #1A1916;
  --sero-fg-secondary: #6B6760;
  --sero-accent: #C4A882;
  --sero-accent-dark: #8B7355;
  --sero-border: rgba(26, 25, 22, 0.10);

  --sero-section-padding-desktop: 96px;
  --sero-section-padding-mobile: 56px;
  --sero-container-max: 1240px;
}

/* --- GLOBAL RESETS --- */
body {
  background-color: var(--sero-bg);
  color: var(--sero-fg);
  font-family: var(--sero-font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* --- HEADING SYSTEM --- */
h1, h2, h3, h4,
.h1, .h2, .h3, .h4 {
  font-family: var(--sero-font-heading);
  font-weight: 400;
  letter-spacing: -0.015em;
  line-height: 1.15;
  color: var(--sero-fg);
}

/* --- BODY COPY --- */
p, li, label, input, textarea {
  font-family: var(--sero-font-body);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--sero-fg);
}

/* --- SECTION PADDING — scoped to main content only --- */
#MainContent .shopify-section {
  padding-top: var(--sero-section-padding-desktop);
  padding-bottom: var(--sero-section-padding-desktop);
}

@media screen and (max-width: 749px) {
  #MainContent .shopify-section {
    padding-top: var(--sero-section-padding-mobile);
    padding-bottom: var(--sero-section-padding-mobile);
  }
}

/* Custom sections manage their own padding internally */
.sero-section-hero,
.sero-section-usp,
.sero-section-insight,
.sero-section-mechanism,
.sero-section-product,
.sero-section-reviews,
.sero-section-guarantee,
.sero-section-closing,
.sero-section-footer {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Utility overrides */
#MainContent .sero-section--tight {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

#MainContent .sero-section--flush {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* --- ANNOUNCEMENT BAR --- */
.announcement-bar {
  background-color: var(--sero-fg) !important;
  color: var(--sero-bg) !important;
  text-align: center !important;
}

.announcement-bar__message,
.announcement-bar p,
.announcement-bar__text {
  font-family: var(--sero-font-body) !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  font-weight: 400 !important;
  color: var(--sero-bg) !important;
  text-align: center !important;
  width: 100% !important;
  display: block !important;
}

/* Force announcement bar inner container full width and centered */
.announcement-bar .page-width,
.announcement-bar .container,
.announcement-bar [class*="page-width"],
.announcement-bar [class*="container"] {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: center !important;
}

/* --- NAVIGATION --- */
/* Background and border */
.header {
  background-color: var(--sero-bg) !important;
  border-bottom: 1px solid var(--sero-border);
}

/* Nav link items — confirmed Horizon class names from live DOM inspection */
.menu-list__list-item {
  font-family: var(--sero-font-body);
}

/* Nav link anchor */
.menu-list__link {
  font-family: var(--sero-font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: var(--sero-fg) !important;
  text-decoration: none !important;
}

.menu-list__link:hover {
  color: var(--sero-accent-dark) !important;
}

/* Nav link title span — the actual visible text node */
.menu-list__link-title {
  font-family: var(--sero-font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: var(--sero-fg) !important;
}

/* Mobile nav drawer links */
.menu-drawer__navigation .menu-list__link,
.menu-drawer__navigation .menu-list__link-title {
  font-family: var(--sero-font-body) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: var(--sero-fg) !important;
}

/* --- HERO MEDIA PLACEHOLDER — force warm surface color --- */
.sero-section-hero .sero-hero__media {
  background-color: #F2EFE9 !important;
}

.sero-section-hero .sero-hero__placeholder {
  background-color: #F2EFE9 !important;
}

/* --- FOOTER (native Horizon suppression) --- */
/* The custom sero-footer.liquid handles all footer styling internally.
   These rules suppress any residual native footer styling. */
.footer {
  display: none;
}

/* --- UTILITIES --- */
.sero-eyebrow {
  font-family: var(--sero-font-body);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--sero-fg-secondary);
  display: block;
  margin-bottom: 12px;
}

.sero-divider {
  width: 32px;
  height: 1px;
  background-color: var(--sero-accent);
  margin: 20px 0;
}
{% if template == 'product' %}
  {{ 'sero-pdp.css' | asset_url | stylesheet_tag }}
{% endif %}