/* ============================================================
   HELIO PEPTIDES — storefront design system (Dawn)
   Warm off-white · near-black ink · orange accent · rounded cards · pills.
   Inter + Instrument Serif + JetBrains Mono.
   ============================================================ */
:root{
  --hl-bg:#FBFBF9; --hl-card:#FFFFFF; --hl-ink:#0A0C10; --hl-sub:#6B6F76;
  --hl-line:rgba(10,12,16,.08); --hl-accent:#E8923A; --hl-accent-deep:#c9761f;
  --hl-navy:#101419; --hl-r:30px; --hl-media-r:18px; --hl-ease:cubic-bezier(.2,.7,.2,1);
  --hl-sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --hl-serif:'Instrument Serif',Georgia,serif;
  --hl-mono:'JetBrains Mono',ui-monospace,'SF Mono',monospace;
  --page-width:1240px;
  /* drive Dawn's own font system so native components inherit */
  --font-body-family:var(--hl-sans); --font-heading-family:var(--hl-sans);
  --font-heading-weight:800; --font-body-weight:400;
}

/* ── base ── */
body,body.gradient,.gradient{background:var(--hl-bg)!important;}
body{color:var(--hl-ink)!important; font-family:var(--hl-sans)!important; font-size:17px; line-height:1.55; letter-spacing:normal!important; -webkit-font-smoothing:antialiased;}
/* subtle film-grain overlay (verbatim from v42, non-blocking) */
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:200; opacity:.30; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .03 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
.page-width{max-width:var(--page-width)!important; padding-left:28px; padding-right:28px;}
::selection{background:var(--hl-accent); color:var(--hl-ink);}

/* ── typography ── */
h1,h2,h3,h4,.h0,.h1,.h2,.h3,.h4,
.title,.title-wrapper h2,.banner__heading,.collection-hero__title,
.product__title,.product__title h1,.product__title h2,.card__heading,.card__heading a,
.rich-text__heading,.cart__heading{
  font-family:var(--hl-sans)!important; letter-spacing:-.04em!important; line-height:1.03!important; font-weight:800!important; color:var(--hl-ink)!important;
}
.h0,.banner__heading{letter-spacing:-.045em!important; line-height:1.0!important;}
em.serif,.serif,.banner__heading em,.rich-text__heading em{font-family:var(--hl-serif)!important; font-style:italic!important; font-weight:400!important; letter-spacing:0!important; color:var(--hl-accent);}
.mono{font-family:var(--hl-mono)!important;}
.rte a{color:var(--hl-accent-deep);}

/* eyebrow / mono micro-label with orange tick (v42 .eyebrow) */
.section-header .subtitle,.eyebrow,.caption,.caption-with-letter-spacing{
  font-family:var(--hl-mono)!important; font-size:12px!important; font-weight:500!important;
  letter-spacing:.16em!important; text-transform:uppercase!important; color:var(--hl-sub)!important;
}

/* ── buttons: ink / orange pills (v42 .btn) ── */
.button,
.product-form__submit,.cart__checkout-button,.button--primary,.button--secondary{
  border-radius:100px!important; font-family:var(--hl-sans)!important; font-weight:700!important;
  letter-spacing:0!important; text-transform:none!important; transition:transform .18s var(--hl-ease),box-shadow .18s!important;
}
.button::after,.button::before{display:none!important;}
.button:not(.button--secondary):not(.button--tertiary),
.product-form__submit,.cart__checkout-button{
  background:var(--hl-ink)!important; color:#fff!important; border:0!important; box-shadow:none!important; padding:15px 32px!important;
}
.button:not(.button--secondary):not(.button--tertiary):hover,
.product-form__submit:hover,.cart__checkout-button:hover{transform:translateY(-2px) scale(1.01); box-shadow:0 16px 40px rgba(10,12,16,.18)!important;}
.button--secondary{background:transparent!important; color:var(--hl-ink)!important; border:1.5px solid var(--hl-ink)!important; padding:14px 28px!important;}
.button--secondary:hover{background:var(--hl-ink)!important; color:#fff!important; transform:scale(1.03);}
.button.orange,.color-accent-1 .button:not(.button--secondary){background:var(--hl-accent)!important; color:var(--hl-ink)!important;}

/* ── header: frosted, clean (v42 nav) ── */
.header-wrapper{background:rgba(251,251,249,.72)!important; -webkit-backdrop-filter:blur(22px) saturate(1.7); backdrop-filter:blur(22px) saturate(1.7); border-bottom:1px solid var(--hl-line)!important; box-shadow:none!important;}
.header{padding-top:12px!important; padding-bottom:12px!important; max-width:var(--page-width);}
.header__heading-link .h2,.header__heading-logo{font-weight:900!important; letter-spacing:-.03em!important; color:var(--hl-ink)!important;}
.header__menu-item,.header__menu-item span,.list-menu__item{font-family:var(--hl-sans)!important; font-size:13.5px!important; font-weight:600!important; color:var(--hl-ink)!important; opacity:.72; transition:opacity .15s; text-transform:none!important;}
.header__menu-item:hover{opacity:1;}
.header__icon .icon,.header__icon{color:var(--hl-ink)!important;}
.cart-count-bubble{background:var(--hl-accent)!important; color:var(--hl-ink)!important;}
.header__submenu,.mega-menu__content{background:var(--hl-card)!important; border:1px solid var(--hl-line)!important; border-radius:20px!important; box-shadow:0 30px 70px rgba(10,12,16,.10)!important;}

/* ── announcement bar (v42 .promo) ── */
.announcement-bar,.utility-bar{background:var(--hl-ink)!important; color:#fff!important;}
.announcement-bar__message{font-family:var(--hl-sans)!important; font-weight:600!important; font-size:12.5px!important;}
.announcement-bar__message strong,.announcement-bar__message b{color:var(--hl-accent)!important;}

/* ── product cards: white, r30, hover lift (v42 .pc) ── */
.card--standard .card__inner,.card--card,.card--product{
  background:var(--hl-card)!important; border:1px solid var(--hl-line)!important; border-radius:var(--hl-r)!important;
  overflow:hidden; transition:transform .25s var(--hl-ease),box-shadow .25s!important;
}
.card-wrapper:hover .card--standard .card__inner,.card-wrapper:hover .card--card{transform:translateY(-6px); box-shadow:0 34px 80px rgba(10,12,16,.10)!important;}
.card__inner,.card__inner .card__media{border-radius:var(--hl-r)!important;}
.card__media,.card .media{border-radius:var(--hl-media-r)!important; background:var(--hl-bg)!important;}
.card__media img,.card .media img{object-fit:contain!important;}
.card__content{padding:16px 18px 18px!important;}
.card__heading,.card__heading a{font-size:19px!important; letter-spacing:-.02em!important;}
.card__heading a::after{display:none;}
.card-information .caption,.card__caption{font-family:var(--hl-mono)!important; font-size:10.5px!important; color:var(--hl-sub)!important; letter-spacing:.05em!important;}
/* badges (v42 .bdg) */
.badge{font-family:var(--hl-mono)!important; font-size:9px!important; font-weight:700!important; letter-spacing:.06em!important; text-transform:uppercase!important; border-radius:100px!important; padding:5px 9px!important; background:var(--hl-ink)!important; color:#fff!important;}
.badge--sale,.badge.color-scheme-5{background:var(--hl-accent)!important; color:var(--hl-ink)!important;}

/* ── price (v42 .price) ── */
.price,.price .price-item{font-family:var(--hl-sans)!important; font-weight:800!important; color:var(--hl-ink)!important;}
.price__regular .price-item{font-size:19px!important;}
.price--on-sale .price-item--regular{color:var(--hl-sub)!important; font-weight:600!important;}
.price .price-item--sale{color:var(--hl-accent-deep)!important;}

/* ── collection / product grid ── */
.collection-hero__title,.title-wrapper--no-top-margin h1{font-size:clamp(46px,7vw,84px)!important; font-weight:900!important; letter-spacing:-.04em!important; line-height:1!important;}
.product-grid{gap:16px!important;}
/* facets → pill chips (v42 .chipf) */
.active-facets__button-inner,.facets__button{border-radius:100px!important; border:1px solid var(--hl-line)!important;}
select,.select__select,.facet-filters__sort{font-family:var(--hl-sans)!important; border-radius:100px!important; border:1px solid var(--hl-line)!important; background:var(--hl-card)!important;}

/* ── banner / hero (v42 .hero) ── */
.banner__box{background:rgba(251,251,249,.72)!important; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border:1px solid var(--hl-line)!important; border-radius:var(--hl-r)!important; box-shadow:none!important;}
.banner__heading{font-size:clamp(38px,6vw,84px)!important;}
.banner__buttons .button{padding:16px 32px!important;}
.banner__box .caption-with-letter-spacing{border:1px solid var(--hl-line); background:rgba(251,251,249,.66); padding:10px 18px; border-radius:100px; display:inline-block;}

/* ── rich-text / statement ── */
.rich-text__heading{font-size:clamp(34px,5vw,72px)!important;}
.rich-text__text{color:var(--hl-sub); font-size:19px; font-weight:500;}

/* ── dark proof section (v42 .dark) — apply when a section uses the inverse/dark scheme ── */
.color-scheme-4,.color-inverse{background:var(--hl-navy)!important; color:#fff!important;}
.color-scheme-4 h1,.color-scheme-4 h2,.color-scheme-4 h3,.color-inverse h2{color:#fff!important;}
.color-scheme-4 em.serif,.color-inverse em.serif{color:var(--hl-accent)!important;}

/* ── FAQ / accordion / collapsible (v42 .q) ── */
.accordion,details.accordion,.collapsible-content details{border-top:1px solid var(--hl-line)!important; border-radius:0!important; background:transparent!important; box-shadow:none!important;}
.accordion summary,.collapsible-content summary{font-family:var(--hl-sans)!important; font-weight:700!important; font-size:18px!important; padding:24px 0!important; color:var(--hl-ink)!important;}
.accordion summary .icon-caret,.accordion .icon-accordion{color:var(--hl-accent)!important;}
.accordion__content,.collapsible-content__content{color:var(--hl-sub)!important; font-weight:500;}

/* ── PDP (v42-port): premium media + info ── */
.product__media-wrapper .media,.product__media,.product-media-container{border-radius:var(--hl-r)!important; overflow:hidden; background:var(--hl-bg)!important;}
.product__title,.product__title h1{font-size:clamp(30px,4vw,52px)!important; font-weight:900!important; letter-spacing:-.03em!important; line-height:1.02!important;}
.product .price .price-item{font-size:26px!important;}
.product-form__input .form__label,.product-form__input legend{font-family:var(--hl-mono)!important; font-size:11px!important; letter-spacing:.12em!important; text-transform:uppercase!important; color:var(--hl-sub)!important;}
.product-form__input--pill input[type=radio]+label,fieldset .variant-option label{border-radius:100px!important; border:1.5px solid var(--hl-line)!important; font-weight:700!important;}
.product-form__input--pill input[type=radio]:checked+label{background:var(--hl-ink)!important; color:#fff!important; border-color:var(--hl-ink)!important;}
/* spec-table look for PDP description / metafield tables */
.product__description table,.rte table{border-collapse:collapse; width:100%; font-size:14.5px;}
.product__description table td,.rte table td{border-bottom:1px solid var(--hl-line); padding:12px 10px;}
.product__description table td:first-child,.rte table td:first-child{font-family:var(--hl-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--hl-sub); white-space:nowrap;}

/* ── article / research (v42-content) ── */
.article-template__title,.article-template h1{font-size:clamp(34px,5vw,64px)!important; font-weight:900!important; letter-spacing:-.03em!important;}
.article-template__content,.article-template .rte{max-width:72ch; margin-left:auto; margin-right:auto; font-size:18px; line-height:1.7;}
.article-template__content h2,.article-template__content h3{margin-top:1.6em;}
.article-card{border-radius:var(--hl-r)!important;}
.article-card__info .caption-with-letter-spacing{color:var(--hl-accent)!important;}

/* ── footer: light, warm (v42 footer) ── */
.footer{background:var(--hl-bg)!important; border-top:1px solid var(--hl-line)!important;}
.footer .footer-block__heading{font-family:var(--hl-mono)!important; font-size:12px!important; letter-spacing:.12em!important; text-transform:uppercase!important; color:var(--hl-sub)!important;}
.footer__list-item a,.footer a.link,.footer .list-menu__item{color:var(--hl-ink)!important; font-weight:600!important; opacity:.82; text-decoration:none!important;}
.footer__list-item a:hover,.footer a.link:hover{opacity:1; color:var(--hl-accent-deep)!important;}
.footer .copyright__content,.footer__content-bottom .caption{font-family:var(--hl-mono)!important; font-size:10px!important; letter-spacing:.06em!important; color:var(--hl-sub)!important;}
.footer__content-bottom{border-top:1px solid var(--hl-line)!important;}

/* ── forms / inputs ── */
.field__input,input[type=text],input[type=email],input[type=search],input[type=tel],input[type=password],textarea{
  border-radius:16px!important; border:1px solid var(--hl-line)!important; font-family:var(--hl-sans)!important; background:var(--hl-card)!important;
}
.field__input:focus,input:focus,textarea:focus{outline:none!important; border-color:var(--hl-ink)!important; box-shadow:none!important;}
.field__label{color:var(--hl-sub)!important;}

/* ── media radii ── */
.media,.global-media-settings{border-radius:var(--hl-media-r)!important;}

/* ── motion / accessibility ── */
@media (prefers-reduced-motion:reduce){
  *,*::after,*::before{animation:none!important; transition:none!important;}
  body::after{display:none;}
}
*:focus-visible{outline:2px solid var(--hl-accent)!important; outline-offset:2px;}

/* ── responsive ── */
@media(max-width:990px){.page-width{padding-left:20px!important; padding-right:20px!important;}}
@media(max-width:749px){
  body{font-size:16px;}
  .product__title,.product__title h1{font-size:clamp(28px,7vw,40px)!important;}
  .card__content{padding:14px!important;}
}
