/** Shopify CDN: Minification failed

Line 38:0 All "@import" rules must come first

**/
/* ==========================================================================
   Poised — Dawn Theme Reskin (CSS-only overrides)
   Targets Dawn's native header, footer, product page, and collection grid
   markup so those areas pick up the Poised look WITHOUT touching Dawn's
   Liquid/JS — cart drawer, predictive search, mega menu, variant picker,
   dynamic checkout, and quantity rules all keep working exactly as they do
   today.
   ========================================================================== */

:root {
  --poised-green: #7FA99B;
  --poised-green-light: #A9C7BC;
  --poised-green-pale: #EEF3F0;
  --poised-cream: #FAF9F6;
  --poised-charcoal: #2B2B2B;
  --poised-charcoal-soft: #5B5B5B;
  --poised-border: #e5e1d8;
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --color-button: 43, 43, 43;
  --color-button-text: 255, 255, 255;
  --color-base-accent-1: 127, 169, 155;
  --color-base-accent-2: 127, 169, 155;
  --color-base-background-1: 255, 255, 255;
  --color-base-background-2: 250, 249, 246;
  --color-base-text: 43, 43, 43;
  --buttons-radius: 8;
  --inputs-radius: 8;
  --card-corner-radius: 20;
}

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital@1&family=Playfair+Display:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');

body, .type-body-regular { font-family: var(--font-body); color: var(--poised-charcoal); }
h1, h2, h3, .h1, .h2, .h3,
.product__title, .card__heading, .footer-block__heading {
  font-family: var(--font-body) !important;
  color: var(--poised-charcoal);
  font-weight: 600;
}

/* Editorial serif accent reserved for review/testimonial quotes only —
   never for structural headings, per brand spec. */
.poised-quote, blockquote.poised-quote {
  font-family: var(--font-heading) !important;
  font-style: italic;
}

/* ---------------- Announcement bar (native Dawn, above the header, every page) ---------------- */
/* Forced to exact brand charcoal/off-white rather than relying on the
   shared scheme-3 tokens (which scheme-3 also serves elsewhere, e.g.
   sold-out badges) — scoped to this bar only so nothing else shifts.
   Always stays in normal document flow above the header, on every page
   including the homepage — the transparent-header treatment below is
   scoped to the header section only so it never overlaps or hides this
   bar. */
.utility-bar {
  background: var(--poised-charcoal) !important;
  position: relative;
  z-index: 21;
}
.utility-bar .announcement-bar__message,
.utility-bar .announcement-bar__link {
  color: var(--poised-cream) !important;
}

/* ---------------- Header ---------------- */
.header-wrapper,
.section-header {
  background: #ffffff;
  border-bottom: 1px solid var(--poised-border);
  transition: background 0.3s ease, border-color 0.3s ease;
}
.header__heading-link,
.header__heading-logo-wrapper {
  font-weight: 700;
  color: var(--poised-charcoal);
}
/* Wordmark treatment: lowercase serif with a trailing period, e.g.
   "poised." — CSS-only, text-transform + a generated ::after character.
   shop.name itself is untouched ("Poised"), so admin, emails, and SEO
   titles are unaffected. */
.header__heading-link {
  font-family: var(--font-heading);
  font-style: normal;
  font-weight: 600;
  text-transform: lowercase;
  letter-spacing: -0.01em;
  font-size: 1.15em;
}
.header__heading-link::after {
  content: '.';
  color: var(--poised-green);
}
.header__inline-menu .header__menu-item {
  font-family: var(--font-body);
  font-weight: 500;
  color: var(--poised-charcoal);
}
.header__inline-menu .header__menu-item:hover,
.header__inline-menu .header__menu-item--active {
  color: var(--poised-green);
}
.header__icon,
.header__icon svg { color: var(--poised-charcoal); }
.header__icon--cart .cart-count-bubble { background: var(--poised-charcoal); }

/* ---------------- Transparent header (homepage ONLY, no overlay of the
   announcement bar) ----------------
   Scoped by body.has-hero-header, set permanently by the hero section's
   own script (sections/custom-hero-posture.liquid) — header.liquid and
   header-group.json are never edited, so every other page keeps the
   normal solid in-flow header above.

   The header section's own auto-generated wrapper (#shopify-section-header)
   is given position: relative so it becomes the containing block for the
   absolutely-positioned header inside it. That confines "top: 0" to the
   header's own slot in the page — right after the announcement bar —
   instead of the absolute top of the whole page (which previously made
   the header float up and cover the announcement bar entirely). The
   header still collapses out of flow and floats over the hero image
   below it, exactly as intended — it now just starts below the
   announcement bar instead of above it.

   Mobile nudge: on small screens the transparent header (logo + menu
   icons, white-on-photo) sat flush at top:0 of its own slot and read as
   basically invisible against the hero image directly behind it. Nudged
   down 14px so there's breathing room and it's clearly readable as its
   own row above the hero content. */
body.has-hero-header #shopify-section-header {
  position: relative;
  z-index: 20;
}
body.has-hero-header .header-wrapper,
body.has-hero-header .section-header {
  background: transparent;
  border-bottom-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 20;
}
@media (max-width: 849px) {
  body.has-hero-header .header-wrapper,
  body.has-hero-header .section-header {
    top: 14px;
  }
}
/* ---------------- Buttons everywhere ---------------- */
/* 8px radius per brand spec (Phase 13) — replaces the old fully-rounded
   pill treatment used in the initial pass. */
.button,
.button--primary,
.shopify-payment-button__button--unbranded,
.product-form__submit {
  background: var(--poised-charcoal) !important;
  border-color: var(--poised-charcoal) !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  font-family: var(--font-body);
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  transition: background 0.15s ease, transform 0.15s ease;
}
.button:hover,
.product-form__submit:hover {
  background: var(--poised-green) !important;
  border-color: var(--poised-green) !important;
  transform: translateY(-1px);
}
.button--secondary {
  border-radius: 8px !important;
  border-color: var(--poised-charcoal) !important;
  color: var(--poised-charcoal) !important;
  background: transparent !important;
}

/* ---------------- Footer ---------------- */
.footer {
  background: var(--poised-charcoal);
  color: #c7cbc4;
}
.footer-block__heading {
  color: #ffffff !important;
  font-size: 15px;
}
.footer-block a,
.footer__list-social a { color: #c7cbc4; }
.footer-block a:hover { color: #ffffff; }
.footer__copyright,
.footer__copyright a { color: #9a9e95; }

/* ---------------- Product page ---------------- */
.product__title { font-size: clamp(26px, 3vw, 38px); font-weight: 700; }
.price,
.price__regular,
.price__sale .price-item--sale {
  color: var(--poised-charcoal);
  font-weight: 700;
}
.price__sale .price-item--regular { color: #a6aaa2; }

.product__media-wrapper,
.product__media {
  border-radius: 20px;
  overflow: hidden;
  background: var(--poised-green-pale);
}

/* ---- Variant picker (pill/button style) ----
   Dawn's base stylesheet in this theme ships CSS for the *swatch* picker
   only (component-swatch-input.css). The plain button/pill picker
   (fieldset.product-form__input--pill) has no styling at all upstream,
   which left every unselected option rendering as an invisible/blank
   pill. These rules give the pill picker its own complete, self-contained
   look so every value is always visible, selected or not. */
fieldset.product-form__input--pill {
  border: 0;
  padding: 0;
  margin: 0 0 20px;
}
fieldset.product-form__input--pill legend.form__label {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 13px;
  color: var(--poised-charcoal);
  margin-bottom: 10px;
}
fieldset.product-form__input--pill input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
fieldset.product-form__input--pill label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  margin: 0 8px 8px 0;
  padding: 10px 18px;
  border-radius: 8px !important;
  border: 1px solid var(--poised-border) !important;
  background: #ffffff;
  color: var(--poised-charcoal);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
fieldset.product-form__input--pill label:hover {
  border-color: var(--poised-charcoal) !important;
}
fieldset.product-form__input--pill input[type="radio"]:checked + label {
  border-color: var(--poised-charcoal) !important;
  background: var(--poised-charcoal) !important;
  color: #ffffff !important;
}
fieldset.product-form__input--pill input[type="radio"].disabled + label {
  color: #b7b3a8;
  border-color: var(--poised-border) !important;
  background: #f7f5f0;
  text-decoration: line-through;
  cursor: not-allowed;
}

.product-form__input .form__label,
fieldset.product-form__input label {
  border-radius: 8px !important;
  border-color: var(--poised-border) !important;
  font-family: var(--font-body);
  font-weight: 600;
}
input[type="radio"]:checked + label,
.product-form__input input:checked + label {
  border-color: var(--poised-charcoal) !important;
  background: var(--poised-charcoal) !important;
  color: #ffffff !important;
}
.swatch-input__input:checked + .swatch-input__label {
  outline: 2px solid var(--poised-charcoal);
  outline-offset: 2px;
}

.quantity {
  border-radius: 8px !important;
  border-color: var(--poised-border) !important;
  overflow: hidden;
}

.product__accordion .accordion__title,
details > summary {
  font-family: var(--font-body);
  font-weight: 600;
  color: var(--poised-charcoal);
}

.product__description,
.product__text {
  color: var(--poised-charcoal-soft);
  line-height: 1.65;
}

/* ---------------- Collection grid / product cards ---------------- */
.product-grid,
.collection .grid { row-gap: 24px; }
.card,
.card-wrapper {
  border-radius: 20px !important;
  overflow: hidden;
  border: 1px solid var(--poised-border);
  box-shadow: none !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.card:hover,
.card-wrapper:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(43, 43, 43, 0.08) !important;
}
.card__media,
.card__inner { background: var(--poised-green-pale); }
.card__information,
.card__content { padding: 16px 18px 20px !important; }
.card__heading {
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
}
.card .price { font-size: 14px; }

/* ---------------- Section background rhythm ---------------- */
.color-background-1 { background: #ffffff; }
.color-background-2 { background: var(--poised-cream); }

@media (max-width: 749px) {
  .card__information, .card__content { padding: 12px !important; }
}

/* ---------------- Section dividers ----------------
   Thin brand-green rule at the boundary between every content section
   on the page (homepage and elsewhere), scoped to #MainContent so the
   header/footer's own borders are untouched. Uses Dawn's automatic
   .shopify-section wrapper — no Liquid edits needed per-section. */
#MainContent .shopify-section + .shopify-section {
  border-top: 3px solid var(--poised-green);
}