:root {
	--display-font-family: Suez One;
	--body-font-family: Arial;

	--font-size: 18px

	--logo-padding: 0px;
	--logo-height: 77px;

	--header-width: 1366px;
	--header-border-position: top;
	--header-border-size: 0;
	--header-bg-color: 250 246 239;
	--header-border-color: 0 128 0;

	--brand-color: 0 0 0;
	--brand-color-inverted: 255 255 255;

	--background-color: 255 15 ;
	--text-color: 61 61 61;
	--link-color: 0 0 0;

	--action-color: 222 43 56;
	--action-color-inverted: 255 255 255;

	--announcement-bar-bg-color: 38 130 147;
	--announcement-bar-text-color: 255 255 255;
	--announcement-bar-link-color: 255 255 255;

	--main-navigation-bg-color: 250 246 239;
	--main-navigation-link-color: 0 0 0;
	--main-navigation-link-color-hover: 0 0 0;
	--main-navigation-link-bg-color: 250 246 239;
	--main-navigation-link-font-size: 18px;
	--main-navigation-link-alignment: center;

	--auxiliary-bg-color: transparent;
	--auxiliary-border-color: transparent;
	--auxiliary-link-color: 0 0 0;

	--order-status-bg-color: 250 246 239;
	--order-status-color: 119 7 ;

	--store-menu-bg_color: 248 248 248;
	--store-menu-color: 119 7 ;

	--footer-bg-color: 43 43 43;
	--footer-color: 255 15 ;
	--footer-link-color: 255 255 255;
}

/*Custom Styles*/
/* ===== CPM HEADER NAV (colors + spacing only) ===== */
.siteHeader .mainNavigation__list > li > a {
  color: #282828;
  font-weight: 600;
  padding: 10px 16px;
  transition: color .15s ease;
}
.siteHeader .mainNavigation__list > li > a:hover,
.siteHeader .mainNavigation__list > li.open > a.dropdown-toggle {
  color: #7DA875;
}
.siteHeader .dropdown-menu > li.menu-item > a:hover {
  color: #7DA875;
  background: #FAF6EF;
}
.siteHeader .mainNavigation__list > li > a[href$="/store"] {
  background: #DE2B38;
  color: #ffffff;
  border-radius: 6px;
  padding: 9px 18px;
  font-weight: 700;
}
.siteHeader .mainNavigation__list > li > a[href$="/store"]:hover {
  background: #C21F2C;
  color: #ffffff;
}

/* ===== SEARCH BOX (rounded pill) ===== */
.storeSearch__container--vertical {
  background: #FAF6EF;
  border: 1px solid #E4DCCD;
  border-radius: 999px;
  padding: 2px 6px 2px 14px;
}
.storeSearch__input--vertical {
  background: transparent;
  border: none;
  box-shadow: none;
  color: #282828;
}
.storeSearch__input--vertical::placeholder { color: #9b9384; }
.storeSearch__button--vertical {
  background: transparent;
  border: none;
  color: #267D85;
}
.storeSearch__container--vertical:focus-within {
  border-color: #7DA875;
  box-shadow: 0 0 0 2px rgba(125,168,117,.25);
}

/* ===== ANNOUNCEMENT BAR CTA hover (base look is inline in the bar HTML) ===== */
.anncBar__cta:hover {
  background: #C21F2C !important;
  color: #ffffff !important;
}

/* CPM footer: restyle GrazeCart's native Privacy / Terms line */
.siteFooter .legal-links{
  font-size:0;            /* collapses the literal "and" between the links */
  padding:8px 12px 2px;
  line-height:1.6;
}
.siteFooter .legal-links a{
  font-family:'Inter',Arial,sans-serif;
  font-size:13px;
  font-weight:600;
  letter-spacing:.02em;
  color:#b6ae9f;
  text-decoration:none;
  transition:color .14s ease;
}
.siteFooter .legal-links a:hover{ color:#DE2B38; }
.siteFooter .legal-links a:first-of-type::after{
  content:"\2022";        /* clean dot separator in place of "and" */
  color:#6f6a62;
  font-weight:400;
  margin:0 11px;
}

/* ============================================================
   CPM "News From the Ranch" — restyle of the NATIVE blog widget
   (featuredPostsWidget--275). CSS-only. The widget keeps
   auto-updating with the two latest blog posts; this just makes
   it match the rest of the site. Paste this in an HTML widget
   placed anywhere on the same page as the blog widget.
   ============================================================ */

/* Section shell */
#pageWidget--275,
div[id="pageWidget--275"]{background:#FAF6EF !important;padding:0 !important}
.featuredPostsWidget--275{
  background:#FAF6EF !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:#282828;
  padding:74px 22px;
  max-width:none;
}
.featuredPostsWidget--275 *{box-sizing:border-box}

/* Heading */
.featuredPostsWidget--275 .featuredPostsWidget__header{
  text-align:center;
  max-width:760px;
  margin:0 auto 44px;
}
.featuredPostsWidget--275 .featuredPostsWidget__header::before{
  content:"From the Ranch Journal";
  display:block;
  font-family:'Bitter',Georgia,serif;
  color:#267D85;
  font-weight:700;
  font-size:14px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  margin-bottom:10px;
}
.featuredPostsWidget--275 .featuredPostsWidget__header h2{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:800 !important;
  color:#282828 !important;
  font-size:36px !important;
  line-height:1.1 !important;
  letter-spacing:-.4px !important;
  margin:0 !important;
}

/* Posts grid */
.featuredPostsWidget--275 .featuredPostsWidget__post{
  display:grid !important;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
  max-width:1040px;
  margin:0 auto;
}

/* Each post -> card */
.featuredPostsWidget--275 .featuredPostsWidget__postContainer{
  display:flex !important;
  flex-direction:column;
  background:#fff !important;
  border:1px solid #E4DCCD !important;
  border-radius:14px !important;
  overflow:hidden;
  padding:0 !important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.featuredPostsWidget--275 .featuredPostsWidget__postContainer:hover{
  transform:translateY(-5px);
  box-shadow:0 16px 34px rgba(0,0,0,.10);
  border-color:#DE2B38;
}

/* Photo on top */
.featuredPostsWidget--275 .featuredPostsWidget__postPhoto{
  order:1;
  margin:0;
}
.featuredPostsWidget--275 .featuredPostsWidget__postPhoto a{display:block;line-height:0}
.featuredPostsWidget--275 .featuredPostsWidget__postPhoto img{
  width:100% !important;
  aspect-ratio:16/9;
  object-fit:cover;
  display:block;
  border-radius:0 !important;
  margin:0 !important;
}

/* Date */
.featuredPostsWidget--275 .featuredPostsWidget__postSubheading{
  order:2;
  padding:20px 24px 0;
  color:#267D85 !important;
  font-weight:700;
  font-size:12px;
  letter-spacing:1.2px;
  text-transform:uppercase;
}

/* Title */
.featuredPostsWidget--275 .featuredPostsWidget__postHeading{
  order:3;
  padding:9px 24px 0;
  margin:0 !important;
}
.featuredPostsWidget--275 .featuredPostsWidget__postHeading a{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:700 !important;
  font-size:21px !important;
  line-height:1.25 !important;
  color:#282828 !important;
  text-decoration:none !important;
}
.featuredPostsWidget--275 .featuredPostsWidget__postContainer:hover .featuredPostsWidget__postHeading a{
  color:#DE2B38 !important;
}

/* Excerpt */
.featuredPostsWidget--275 .featuredPostsWidget__postPreview{
  order:4;
  flex:1;
  padding:11px 24px 0;
  font-size:15px;
  line-height:1.6;
  color:#5a564f !important;
}

/* Read more -> red link w/ arrow */
.featuredPostsWidget--275 .featuredPostsWidget__postContainer > a[href]{
  order:5;
  align-self:flex-start;
  margin:18px 24px 24px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#DE2B38 !important;
  font-weight:700 !important;
  font-size:14px !important;
  letter-spacing:.2px;
  text-decoration:none !important;
}
.featuredPostsWidget--275 .featuredPostsWidget__postContainer > a[href]::after{
  content:"\2192";
  display:inline-block;
  transition:transform .18s ease;
}
.featuredPostsWidget--275 .featuredPostsWidget__postContainer:hover > a[href]::after{
  transform:translateX(5px);
}

@media (max-width:760px){
  .featuredPostsWidget--275{padding:54px 18px}
  .featuredPostsWidget--275 .featuredPostsWidget__header h2{font-size:29px !important}
  .featuredPostsWidget--275 .featuredPostsWidget__post{grid-template-columns:1fr;gap:16px}
}

/* ============================================================
   CPM "Contact Us" — restyle of the NATIVE contact page
   (section.contactPage + form.contactPage__form). CSS-only.
   The form still posts to GrazeCart and keeps its spam
   protection; this just makes it match the rest of the site.
   ============================================================ */
/* Section shell -> full-width vanilla band.
   High-specificity selector so it wins over the theme's
   .pageContainer / .contactPage background no matter the load order. */
section.contactPage.pageContainer,
.contactPage.pageContainer,
.contactPage{
  background:#FAF6EF !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif !important;
  color:#282828 !important;
  max-width:none !important;
  width:auto !important;
  margin:0 !important;
  padding:72px 22px !important;
}
.contactPage *{box-sizing:border-box}

/* Heading block */
.contactPage__header{
  text-align:center !important;
  max-width:640px;
  margin:0 auto 32px !important;
  padding:0 !important;
}
.contactPage__header::before{
  content:"We'd Love to Hear From You";
  display:block;
  font-family:'Bitter',Georgia,serif;
  color:#267D85;
  font-weight:700;
  font-size:14px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  margin-bottom:10px;
}
.contactPage__heading,
.contactPage__heading.h1{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:800 !important;
  color:#282828 !important;
  font-size:42px !important;
  line-height:1.08 !important;
  letter-spacing:-.5px !important;
  margin:0 !important;
}
.contactPage__header::after{
  content:"Questions about an order, a particular cut, or visiting the ranch? Send us an email, call us or text us and we will get right back to you.";
  display:block;
  max-width:540px;
  margin:14px auto 0;
  font-size:16px;
  line-height:1.6;
  color:#5a564f;
}

/* Form -> centered white card */
.contactPage__form{
  max-width:620px !important;
  margin:0 auto !important;
  background:#fff !important;
  border:1px solid #E4DCCD !important;
  border-radius:16px !important;
  padding:34px 32px 36px !important;
  box-shadow:0 14px 34px rgba(0,0,0,.06) !important;
}

/* Keep honeypot fields hidden */
.contactPage__form .form-grouped{display:none !important}

/* Field rows */
.contactPage__form .form-group{margin-bottom:20px !important}
.contactPage__form .control-label{
  display:block !important;
  font-family:'Inter',sans-serif !important;
  font-weight:600 !important;
  font-size:14px !important;
  letter-spacing:.2px;
  color:#3f3a32 !important;
  margin:0 0 7px !important;
}

/* Inputs + textarea */
.contactPage__form .form-control{
  width:100% !important;
  display:block !important;
  font-family:'Inter',sans-serif !important;
  font-size:16px !important;
  color:#282828 !important;
  background:#FCFAF5 !important;
  border:1px solid #E4DCCD !important;
  border-radius:10px !important;
  padding:13px 15px !important;
  line-height:1.4 !important;
  box-shadow:none !important;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}
.contactPage__form textarea.form-control{min-height:150px !important;resize:vertical !important}
.contactPage__form .form-control::placeholder{color:#a89e8d !important}
.contactPage__form .form-control:focus{
  outline:none !important;
  border-color:#DE2B38 !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(222,43,56,.14) !important;
}

/* Submit button -> brand red */
.contactPage__form .btn,
.contactPage__form button[type="submit"]{
  display:inline-flex !important;
  align-items:center !important;
  gap:9px !important;
  background:#DE2B38 !important;
  color:#fff !important;
  font-family:'Inter',sans-serif !important;
  font-weight:700 !important;
  font-size:16px !important;
  letter-spacing:.2px !important;
  border:none !important;
  border-radius:10px !important;
  padding:14px 30px !important;
  margin-top:4px !important;
  cursor:pointer !important;
  text-transform:none !important;
  box-shadow:0 6px 16px rgba(222,43,56,.22) !important;
  transition:background .16s ease, transform .12s ease, box-shadow .16s ease !important;
}
.contactPage__form .btn:hover,
.contactPage__form button[type="submit"]:hover{
  background:#C21F2C !important;
  transform:translateY(-1px) !important;
  box-shadow:0 9px 20px rgba(222,43,56,.28) !important;
}
.contactPage__form .btn .fa{color:#fff !important}

/* Divider + address block below the form */
.contactPage hr{
  max-width:620px !important;
  margin:38px auto 0 !important;
  border:0 !important;
  border-top:1px solid #E4DCCD !important;
}
.contactPage__address{
  text-align:center !important;
  margin:28px auto 0 !important;
  padding:0 !important;
}
.contactPage__address ul{margin:0 !important;padding:0 !important;list-style:none !important}
.contactPage__address li{
  font-family:'Inter',sans-serif !important;
  font-size:16px !important;
  line-height:1.7 !important;
  color:#5a564f !important;
  margin:0 !important;
}
.contactPage__address li.h4{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:800 !important;
  font-size:20px !important;
  color:#282828 !important;
  margin-bottom:4px !important;
}
.contactPage__address a{
  color:#DE2B38 !important;
  font-weight:700 !important;
  text-decoration:none !important;
}
.contactPage__address a:hover{text-decoration:underline !important}

@media (max-width:600px){
  .contactPage{padding:52px 16px !important}
  .contactPage__heading,.contactPage__heading.h1{font-size:32px !important}
  .contactPage__header::after{font-size:15px}
  .contactPage__form{padding:26px 20px 28px !important}
  .contactPage__form .btn,
  .contactPage__form button[type="submit"]{width:100% !important;justify-content:center !important}
}




/* ============================================================
   CPM STOREFRONT RESTYLE  (collections + products)
   Scoped to .storeIndex (collection) and .productPage (product)
   so nothing leaks to other pages.
   NO @import (theme already loads Bitter + Inter via its own <link>).
   Theme's /theme/theme.css forces .btn-brand black with !important and
   loads AFTER this file, so brand-red overrides use a scoped selector
   (higher specificity) + !important.
   ============================================================ */

/* ---------- Brand-red buttons (Add to Cart / Select Option) ---------- */
.storeIndex .btn-brand,
.productPage .btn-brand,
.storeIndex .productListing__addToCartButton--grid,
.productPage .productListing__addToCartButton--grid{
  background-color:#DE2B38 !important;
  border-color:#DE2B38 !important;
  color:#ffffff !important;
  border-radius:8px !important;
  font-family:'Inter',system-ui,sans-serif !important;
  font-weight:700 !important;
  letter-spacing:.2px !important;
  padding-top:12px !important;
  padding-bottom:12px !important;
  transition:background-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}
.storeIndex .btn-brand:hover,
.productPage .btn-brand:hover,
.storeIndex .productListing__addToCartButton--grid:hover,
.productPage .productListing__addToCartButton--grid:hover{
  background-color:#C21F2C !important;
  border-color:#C21F2C !important;
  color:#ffffff !important;
  box-shadow:0 6px 16px rgba(222,43,56,.26) !important;
}

/* ============================================================
   COLLECTION PAGE
   ============================================================ */

/* ---------- Sidebar ---------- */
.storeIndex .h4{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:800 !important;
  color:#282828 !important;
  font-size:18px !important;
}
.storeIndex .storeIndex__sideBarList--style1{
  border-bottom:1px solid #E4DCCD !important;
}
.storeIndex .menu-item>a,
.storeIndex .storeIndex__sideBarList--style1>li>a{
  color:#5f574a !important;
  font-family:'Inter',system-ui,sans-serif !important;
  font-size:15px !important;
  transition:color .15s ease !important;
}
.storeIndex .menu-item>a:hover{ color:#DE2B38 !important; text-decoration:none !important; }
.storeIndex .menu-item.active>a{ color:#DE2B38 !important; font-weight:700 !important; }

/* ---------- Store search ---------- */
.storeIndex .storeSearch__input{
  border:1px solid #E4DCCD !important;
  border-radius:8px 0 0 8px !important;
  background:#fff !important;
}
.storeIndex .storeSearch__input:focus{
  border-color:#DE2B38 !important;
  box-shadow:0 0 0 3px rgba(222,43,56,.12) !important;
}
.storeIndex .storeSearch__button{
  background:#DE2B38 !important;
  border-color:#DE2B38 !important;
  color:#fff !important;
  border-radius:0 8px 8px 0 !important;
}

/* ---------- Banner heading font ---------- */
.storeIndex .collectionBanner__heading{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:800 !important;
}

/* ---------- Filter pills (all uniform; --active is on every pill) ---------- */
.storeIndex .productTags__tag a{
  background-color:#ffffff !important;
  border:1px solid #E4DCCD !important;
  color:#5f574a !important;
  border-radius:999px !important;
  font-family:'Inter',system-ui,sans-serif !important;
  font-size:13px !important;
  font-weight:600 !important;
  padding:8px 16px !important;
  transition:all .15s ease !important;
}
.storeIndex .productTags__tag a:hover,
.storeIndex .productTags__tag a:focus{
  background-color:#DE2B38 !important;
  border-color:#DE2B38 !important;
  color:#ffffff !important;
  text-decoration:none !important;
}

/* ---------- Product cards: frame + hover lift + red border ---------- */
.storeIndex .productListing--grid>section[itemscope]{
  background:#ffffff !important;
  border:1px solid #E4DCCD !important;
  border-radius:14px !important;
  padding:14px !important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
.storeIndex .productListing--grid>section[itemscope]:hover{
  transform:translateY(-4px) !important;
  border-color:#DE2B38 !important;
  box-shadow:0 12px 28px rgba(40,40,40,.12) !important;
}
/* Title */
.storeIndex .productListing--grid h3[itemprop="name"]{
  font-family:'Inter',system-ui,sans-serif !important;
  font-weight:700 !important;
  font-size:17px !important;
  color:#282828 !important;
}
/* Price block */
.storeIndex .productListing__salePrice{
  color:#DE2B38 !important;
  font-weight:800 !important;
}
.storeIndex .productListing__price--grid{
  font-weight:800 !important;
  color:#282828 !important;
}
.storeIndex .productListing__originalPrice{ color:#9a9285 !important; }
.storeIndex .productListing__saleSavings--grid{
  color:#DE2B38 !important;
  font-weight:700 !important;
}

/* Category-tile eyebrow stays white over the image */
.storeIndex .photoGridWidget__subcaption,
.storeIndex .photoGridWidget__subcaption.h4{
  color:#ffffff !important;
}

/* ============================================================
   PRODUCT PAGE
   ============================================================ */

/* Title */
.productPage .productPage__heading{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:800 !important;
  color:#282828 !important;
}
/* Keep Shopping back link */
.productPage a:has(> .fa-chevron-left),
.productPage .fa-chevron-left{ color:#DE2B38 !important; }

/* Vendor + meta */
.productPage .productPage__vendorLink a{ color:#267D85 !important; }

/* Description body */
.productPage .productPage__productDescription h2,
.productPage .productPage__productDescription h3,
.productPage .productPage__descriptionText h2,
.productPage .productPage__descriptionText h3{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:800 !important;
  color:#282828 !important;
}

/* Protocols + Ingredients sidebar */
.productPage .productPage__protocolsHeading,
.productPage .productPage__ingredientsHeading{
  font-family:'Bitter',Georgia,serif !important;
  font-weight:800 !important;
  color:#282828 !important;
  font-size:18px !important;
}
.productPage .productPage__protocolsList{ list-style:none !important; padding-left:0 !important; }
.productPage .productPage__protocolsListItem{
  font-family:'Inter',system-ui,sans-serif !important;
  color:#5f574a !important;
  padding:5px 0 !important;
  border-bottom:1px solid #f0ebe0 !important;
}
.productPage .productPage__protocolsListItem a{ color:#5f574a !important; transition:color .15s ease !important; }
.productPage .productPage__protocolsListItem a:hover{ color:#DE2B38 !important; }
.productPage .productPage__productIngredients{ margin-top:18px !important; }

/* ---------- Mobile ---------- */
@media (max-width:640px){
  .storeIndex .productListing--grid>section[itemscope]{ padding:12px !important; border-radius:12px !important; }
  .storeIndex .productTags__tag a{ font-size:12px !important; padding:7px 13px !important; }
}
