/** Shopify CDN: Minification failed

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

**/
.grecaptcha-badge{display:none}.section__flush-top .m-section-my{margin-top:0}.section__flush-bottom .m-section-my{margin-bottom:0}.sf__text-stroke{-webkit-text-stroke:.5px #dfdfdf;letter-spacing:10px;text-transform:uppercase;font-size:110px;font-style:italic;color:rgba(0,0,0,0);font-weight:bold}.sf__text-stroke.text-stroke-1{font-size:48px;line-height:56px;font-style:normal;-webkit-text-stroke:1px dimgray;letter-spacing:0}.sf__text-scroll{font-size:48px;line-height:56px}.m-scroll{display:flex;width:100%;height:165px;position:relative;margin:auto;overflow:hidden}.m-scroll__title{white-space:nowrap;transition:all 1s ease}.m-scroll__title>div{display:flex;animation:scrollText var(--speed, 22s) infinite linear;position:absolute}.sf__scrolling-text .sf__scrolling-text-inner{width:100%;height:auto;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;overflow:hidden;white-space:nowrap;vertical-align:baseline}.sf__scrolling-text .sf__scrolling-text-inner:hover>*{animation-play-state:paused}.sf__scrolling-text .sf__scrolling-text-inner>*{margin:0;animation-duration:var(--speed, 15s)}.sf__scrolling-text .sf__scrolling-text-inner a{color:inherit;text-decoration:none}.sf__scrolling-text .sf__scrolling-text-inner a em{font-style:normal}.sf__scrolling-text .sf__scrolling-text-inner span.custom{padding:0 1em;display:inline-block;vertical-align:middle}.sf__scrolling-text .sf__scrolling-text-inner span.custom[data-scale=medium]{padding:0 1em;transform:scale(0.5)}.sf__scrolling-text .sf__scrolling-text-inner span.custom[data-scale=large]{padding:0 2em}.sf__scrolling-text[data-s-dir=ltr] .sf__scrolling-text-inner>*{transform:translateX(-20%) translateZ(0);animation:sf-scrolling-text-animation linear infinite 15s}.sf__scrolling-text[data-s-dir=rtl]{direction:rtl}.sf__scrolling-text[data-s-dir=rtl] .sf__scrolling-text-inner>*{transform:translateX(20%) translateZ(0);animation:sf-scrolling-text-animation-reverse linear infinite 15s}.sf__scrolling-text[data-s-speed=lowest] .sf__scrolling-text-inner>*{animation-duration:15s}.sf__scrolling-text[data-s-speed=medium] .sf__scrolling-text-inner>*{animation-duration:7s}.sf__scrolling-text[data-s-speed=fast] .sf__scrolling-text-inner>*{animation-duration:4s}.sf__scrolling-text[data-style=text-outline] em{-webkit-text-stroke-color:inherit;-webkit-text-fill-color:rgba(0,0,0,0)}.sf__scrolling-text[data-style=text-outline][data-outline-thickness=thin] em{-webkit-text-stroke-width:.015em}.sf__scrolling-text[data-style=text-outline][data-outline-thickness=thick] em{-webkit-text-stroke-width:.03em}.sf__scrolling-text[data-style=text-outline] a:hover em{-webkit-text-fill-color:initial;-webkit-text-stroke-width:0}.sf__scrolling-text.font_size_11vh *{font-size:11vh;line-height:1.2em}.sf__tab-item{width:100%;color:#fff;overflow:hidden;margin-bottom:40px}.sf__tab-item input{position:absolute;opacity:0;z-index:-1}.sf__tab-item-label{display:flex;justify-content:space-between;padding:1em 0;font-weight:bold;cursor:pointer;color:#000;border-bottom:1px solid #ededed;position:relative}.sf__tab-item-label::after,.sf__tab-item-label::before{position:absolute;content:"";text-align:center;transition:all var(--m-duration-default, 0.25s);transform:translateY(-50%);top:50%;background:#000}.sf__tab-item-label::after{width:11px;height:1px;right:0}.sf__tab-item-label::before{width:1px;height:11px;right:4.5px}.sf__tab-item-content{max-height:0;padding:0;color:#000;transition:all var(--m-duration-default, 0.25s)}.sf__tab-item input:checked+.sf__tab-item-label{border-bottom-color:#000}.sf__tab-item input:checked+.sf__tab-item-label::before{display:none}.sf__tab-item input:checked~.sf__tab-item-content{max-height:100vh;padding:20px 0 0}.ssw-faveiticon{position:relative !important;display:flex;align-items:center}.ssw-socialconnect{display:flex;align-items:center;justify-content:space-between}.ssw-social-login-widget .ssw-socialconnect>div>a{display:inline-flex !important;justify-content:center;align-items:center;height:44px !important}.ssw-social-login-widget .ssw-socialconnect>div>a i[class*=ssw-icon]{transform:none !important}.ssw-stars>i{font-size:16px !important}@media screen and (min-width: 768px){.hide-on-desk{display:none !important}}@media screen and (max-width: 767px){.hide-on-mobile{display:none !important}.hidden-br-mobile br{display:none}}.shopify-policy__container{max-width:740px !important;margin:0 auto 4rem !important}.shopify-policy__title h1{font-size:1.875rem;line-height:2.25rem;padding:32px 16px}@media screen and (min-width: 1024px){.shopify-policy__title h1{font-size:2.25rem;line-height:2.5rem;padding-top:64px;padding-bottom:64px}}.m-menu-badge{position:relative;height:100%}.m-menu-badge::before{content:var(--badge);position:absolute;top:-4px;left:6px;font-size:12px;text-transform:capitalize;width:42px;height:20px;font-weight:500;border-radius:11px;display:flex;align-items:center;justify-content:center}.m-menu-badge--hot::before{background-color:#ffe7e7;color:#da3f3f}.m-menu-badge--new::before{background-color:#d5fbef;color:#3a9076}.flex{display:flex}.grid{display:grid}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.flex-wrap{flex-wrap:wrap}.flex-1{flex:1 1 0%}.grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.gap-4{gap:16px}.col-span-2{grid-column:span 2/span 2}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-base{font-size:1rem;line-height:1.5rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.mt-0{margin-top:0 !important}.mt-10{margin-top:10px}.mb-0{margin-bottom:0}.text-2xl{font-size:1.5rem;line-height:2rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.leading-7{line-height:1.75rem}.leading-6{line-height:1.5rem}.pl-8{padding-left:32px}.px-3{padding-left:12px;padding-right:12px}.mt-6{margin-top:24px}.mt-8{margin-top:32px}.mt-10{margin-top:40px}.mb-10{margin-bottom:40px}.mb-6{margin-bottom:24px}.mb-4{margin-bottom:16px}.mb-2\.5{margin-bottom:10px}.mb-2{margin-bottom:8px}.mr-5{margin-right:20px}.mx-auto{margin-left:auto;margin-right:auto}.list-disc{list-style-type:disc}.w-full{width:100%}.text-color-subtext{color:rgb(var(--color-foreground-secondary))}.w-\[20px\]{width:20px}.h-\[20px\]{height:20px}.-mx-4{margin:0 -16px}.px-4{padding:0 16px}.mb-14{margin-bottom:56px}.mt-4{margin-top:16px}.px-12{padding:0 48px}.w-4{width:1rem}.h-4{height:1rem}.w-36{width:9rem}.ml-2{margin-left:8px}.grid{display:grid}.grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}@media screen and (min-width: 768px){.md\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.md\:pr-4{padding-right:16px}.md\:pl-12{padding-left:48px}.md\:pr-10{padding-right:40px}.md\:gap-7{gap:28px}.md\:mb-6{margin-bottom:24px}}@media screen and (min-width: 1280px){.xl\:items-center{align-items:center}.xl\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}}@media screen and (max-width: 767px){.img-ctn{margin-bottom:24px}}
/* ============================================
   KARVEEN — PRODUCT CARD RESTYLE
   Targets your theme's actual classes:
   m-product-card, m-price, m-button, m-section__heading
   ============================================ */

:root {
  --kv-bg: #FAFAF8;
  --kv-ink: #1C1C1A;
  --kv-accent: #2B5D4F;
  --kv-muted: #8A8A82;
  --kv-sale: #C1440E;
  --kv-radius: 4px;
  --kv-border: #EAE8E2;
}

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500&family=Inter:wght@400;500;600&display=swap');

/* ---- Section heading ("BEST SELLING") ---- */
.m-section__heading,
.m-section__header h2 {
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  color: var(--kv-ink) !important;
  text-transform: none !important;
}

/* ---- Card border (whole card boxed, modern look) ----
   .m-product-card is the outer wrapper for both media and content
   (snippets/product-card-2.liquid). overflow:hidden clips the image's
   corners to match the card's radius, so __media no longer needs its
   own radius. */
.m-product-card {
  border: 1px solid var(--kv-border) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  background-color: #fff !important;
}

.m-product-card:hover {
  border-color: var(--kv-accent) !important;
  box-shadow: 0 12px 24px rgba(28, 28, 26, 0.08) !important;
}

/* ---- Card image area ---- */
.m-product-card__media {
  background: #F1F0EC;
}

.m-product-card__content {
  padding: 14px 16px 16px !important;
}

/* ---- Sale / discount badge (top-left, currently red) ---- */
.m-product-card__tag-name {
  background-color: var(--kv-ink) !important;
  color: #fff !important;
  border-radius: 2px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  padding: 4px 9px !important;
}

/* If you want the sale badge specifically in the accent color instead of black,
   uncomment the line below and adjust the selector to match your sale-specific class */
/* .m-product-card__tag-name.tag--sale { background-color: var(--kv-sale) !important; } */

/* ---- Card content / info block ---- */
.m-product-card__info {
  margin-top: 16px !important;
}

.m-product-card__vendor {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  color: var(--kv-muted) !important;
}

/* ---- Product title (currently blue, uppercase) ---- */
.m-product-card__name,
.m-product-card__title {
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--kv-ink) !important;
  transition: color 0.2s ease !important;
}

.m-product-card__name:hover,
.m-product-card__title:hover {
  color: var(--kv-accent) !important;
}

/* ---- Star ratings text ---- */
.m-product-card__reviews {
  color: var(--kv-muted) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
}

/* ---- Price ---- */
.m-price {
  font-family: 'Inter', sans-serif !important;
}

.m-price__sale .m-price-item--last {
  color: var(--kv-sale) !important;
  font-weight: 600 !important;
}

.m-price__sale .m-price-item--regular {
  color: var(--kv-muted) !important;
  text-decoration: line-through !important;
}

.m-price__regular .m-price-item--regular {
  color: var(--kv-ink) !important;
  font-weight: 600 !important;
}

/* ---- Card hover lift (subtle, whole card) ---- */
.m-product-card {
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}

.m-product-card:hover {
  transform: translateY(-3px) !important;
}

.m-product-card__main-image,
.m-product-card__hover-image {
  transition: transform 1s ease, opacity 0.6s ease !important;
}

/* ---- Card hover actions: wishlist / quick-view icon buttons ----
   Real markup: circular .m-button--icon buttons (wishlist adds
   .m-wishlist-button, quick-view adds .m-product-quickview-button)
   live inside .m-product-card__action / __action-icons. SVGs use
   fill="currentColor", so setting color here recolors the icon. */
.m-product-card__action .m-button--icon,
.m-product-card__action-icons .m-button--icon {
  background-color: #fff !important;
  border-color: var(--kv-border) !important;
  color: var(--kv-ink) !important;
  transition: color 0.2s ease, border-color 0.2s ease !important;
}

.m-product-card__action .m-button--icon:hover,
.m-product-card__action-icons .m-button--icon:hover {
  color: var(--kv-accent) !important;
  border-color: var(--kv-accent) !important;
  box-shadow: none !important;
}

/* ---- Card hover action: "Quick Add" button ----
   Real markup: snippets/product-card-quick-add-btn.liquid renders
   this as .m-button--white inside .m-product-card__action-wrapper.
   Scoped to the card so other .m-button--white uses elsewhere are
   untouched. */
.m-product-card__action-wrapper .m-button--white {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  background-color: #fff !important;
  border: 1px solid var(--kv-ink) !important;
  color: var(--kv-ink) !important;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
}

.m-product-card__action-wrapper .m-button--white:hover {
  background-color: var(--kv-accent) !important;
  border-color: var(--kv-accent) !important;
  color: #fff !important;
}

/* ---- "View more" / primary buttons ---- */
.m-button--primary {
  background-color: var(--kv-ink) !important;
  border-color: var(--kv-ink) !important;
  color: #fff !important;
  border-radius: 2px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em !important;
}

.m-button--primary:hover {
  background-color: var(--kv-accent) !important;
  border-color: var(--kv-accent) !important;
}

/* ---- Accessibility ---- */
@media (prefers-reduced-motion: reduce) {
  .m-product-card,
  .m-product-card__main-image,
  .m-product-card__hover-image,
  .m-product-card__name,
  .m-product-card__title,
  .m-product-card__action .m-button--icon,
  .m-product-card__action-icons .m-button--icon,
  .m-product-card__action-wrapper .m-button--white {
    transition: none !important;
  }
}


/* ============================================
   KARVEEN — TOP NAV BAR RESTYLE
   Uses the same --kv-* tokens declared in the :root block above.
   Targets confirmed theme classes: m-topbar, m-link-lists,
   m-logo, m-cart-icon-bubble, m-search-form, container
   ============================================ */

/* ---- Top utility bar (currently navy) ---- */
.m-topbar {
  background-color: var(--kv-ink) !important;
  border-bottom: none !important;
}

.m-topbar,
.m-topbar__link,
.m-topbar a {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 0.04em !important;
  color: #F1F0EC !important;
}

.m-topbar__link:hover {
  color: #fff !important;
}

/* ---- Main header row ---- */
header,
.m-header {
  background-color: #fff !important;
  border-bottom: 1px solid var(--kv-border) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.02) !important;
}

/* ---- Logo ---- */
.m-logo,
.m-logo__image {
  padding: 6px 0 !important;
}

/* ---- Main header nav links (HOME / SHOP BY / ABOUT US / etc.) ----
   Real markup is <a class="m-menu__link m-menu__link--main"> inside
   sections/header.liquid. The underline is the theme's own
   .m-menu__link--main:after, which uses background-color:currentColor,
   so recoloring the link text on hover recolors the underline too —
   no separate ::after override needed. */
.m-menu__link,
.m-menu__link--main {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--kv-ink) !important;
  transition: color 0.2s ease !important;
}

.m-menu__link--main:hover {
  color: var(--kv-accent) !important;
}

/* ---- Collection sidebar "Shop By Category" widget heading ----
   .m-link-lists / .m-link inside it already get brand styling from
   the footer/sidebar link-list rule below. */
.m-filter--widget-title {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--kv-ink) !important;
}

/* ---- Footer / collection-sidebar link lists ----
   Real markup: <ul class="m-link-lists"><li class="m-link-lists--item">
   <a class="m-link">. This is a separate component from the main
   header nav above (m-link-lists is not used in the header). */
.m-link-lists .m-link {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--kv-ink) !important;
  transition: color 0.2s ease !important;
}

.m-link-lists .m-link:hover,
.m-link-lists--item:hover .m-link,
.m-link-lists--item.active .m-link {
  color: var(--kv-accent) !important;
}

/* ---- "Shop By" dropdown panel ---- */
.m-select-custom--options,
.m-nav-dropdown,
.has-dropdown .dropdown-menu,
[data-dropdown-menu] {
  background-color: #fff !important;
  border: 1px solid var(--kv-border) !important;
  border-radius: 4px !important;
  box-shadow: 0 16px 32px rgba(28, 28, 26, 0.08) !important;
  padding: 10px 0 !important;
}

.m-select-custom--option,
.has-dropdown .dropdown-menu a,
[data-dropdown-menu] a {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--kv-ink) !important;
  padding: 10px 20px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.m-select-custom--option:hover,
.has-dropdown .dropdown-menu a:hover,
[data-dropdown-menu] a:hover {
  background-color: var(--kv-bg) !important;
  color: var(--kv-accent) !important;
}

/* ---- Icons: search / account / wishlist / compare / cart ----
   Header icon buttons wrap their tooltip in .m-tooltip--style-2
   (style-1 is used by the product-card action icons instead, which
   this rule should not touch). Both header search-button classes
   are real: --button in the popup search, __button in the inline one. */
.m-cart-icon-bubble,
.m-search-form--button,
.m-search-form__button,
.m-tooltip--style-2 {
  color: var(--kv-ink) !important;
  transition: color 0.2s ease, background-color 0.2s ease !important;
}

.m-cart-icon-bubble:hover,
.m-search-form--button:hover,
.m-search-form__button:hover,
.m-tooltip--style-2:hover {
  color: var(--kv-accent) !important;
}

/* Cart / wishlist item-count bubbles */
.m-cart-count,
.m-wishlist-count {
  background-color: var(--kv-accent) !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
}

/* ---- Search input (in popup / inline) ---- */
.m-search-form,
.m-search-popup__search-form input,
.m-search--form-input {
  border-radius: 4px !important;
  border-color: var(--kv-border) !important;
  font-family: 'Inter', sans-serif !important;
}

.m-search-form:focus-within,
.m-search--form-input:focus {
  border-color: var(--kv-accent) !important;
}

/* ---- Sticky header on scroll ----
   Not implemented here as raw CSS. The theme has a native "Sticky
   header" section setting (sections/header-group.json, sticky_header),
   which was "none" on the live theme — switched to "on_scroll_up" in
   that file instead of fighting the theme's own JS-toggled .stuck
   class + transform/position changes on .m-header__wrapper with a
   competing position:sticky override here. */

/* ---- Accessibility ---- */
@media (prefers-reduced-motion: reduce) {
  .m-menu__link,
  .m-menu__link--main,
  .m-link-lists .m-link,
  .m-cart-icon-bubble,
  .m-search-form--button,
  .m-search-form__button,
  .m-tooltip--style-2 {
    transition: none !important;
  }
}

/* ============================================
   KARVEEN — FOOTER RESTYLE
   Switches the footer from the theme's navy color scheme to the
   ink/cream palette, bookending the ink topbar. Real classes
   confirmed in sections/footer.liquid, snippets/footer-blocks.liquid,
   snippets/footer-design.liquid, snippets/newsletter-form.liquid,
   snippets/social-media-links.liquid. The old hardcoded navy
   custom_css on the footer-blocks section (faking a white circle
   behind social icons via -webkit-text-stroke) was removed in
   sections/footer-group.json so these rules aren't fought inline.
   ============================================ */

.m-footer,
.m-footer--middle,
.m-footer--bottom {
  background-color: var(--kv-ink) !important;
  color: #D8D6CE !important;
}

.m-footer--middle {
  padding-top: 56px !important;
  padding-bottom: 40px !important;
}

/* ---- Column headings (SIGN UP & SAVE / CUSTOMER CARE / etc.) ---- */
.m-footer--block-title {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #fff !important;
}

/* ---- Body copy: newsletter description, "About Us" rich text ---- */
.m-footer--block-newsletter-desc,
.m-footer .block-text {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: #B9B7AE !important;
  line-height: 1.6 !important;
}

.m-footer .block-text a {
  color: #D8D6CE !important;
}

/* ---- Footer link columns (Customer Care / Our Policies) ----
   Scoped under .m-footer so this doesn't affect the same
   .m-link-lists / .m-link component used on the (light) collection
   sidebar, which keeps its own ink-on-light styling from above. */
.m-footer .m-link-lists .m-link {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: #D8D6CE !important;
}

.m-footer .m-link-lists .m-link:hover,
.m-footer .m-link-lists--item:hover .m-link {
  color: var(--kv-accent) !important;
}

/* ---- Newsletter form ---- */
.m-newsletter-form__input-wrapper {
  background-color: transparent !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
  border-radius: 0 !important;
  transition: border-color 0.2s ease !important;
}

.m-newsletter-form__input-wrapper:focus-within {
  border-bottom-color: var(--kv-accent) !important;
}

.m-newsletter-form__input {
  font-family: 'Inter', sans-serif !important;
  color: #fff !important;
  background-color: transparent !important;
}

.m-newsletter-form__input::placeholder {
  color: #9C9A90 !important;
}

.m-newsletter-form__icon,
.m-newsletter-form__button {
  color: #fff !important;
  transition: color 0.2s ease !important;
}

.m-newsletter-form__button:hover {
  color: var(--kv-accent) !important;
}

/* ---- Social icons: clean ghost circles (replaces the old
   text-stroke halo hack removed from footer-group.json) ---- */
.m-footer .social-media-links--item {
  width: 36px;
  height: 36px;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  color: #fff !important;
  background-color: transparent !important;
  transition: color 0.2s ease, border-color 0.2s ease !important;
}

.m-footer .social-media-links--item svg {
  color: inherit !important;
  fill: currentColor !important;
  stroke: none !important;
}

.m-footer .social-media-links--item:hover {
  color: var(--kv-accent) !important;
  border-color: var(--kv-accent) !important;
}

/* ---- Bottom bar (copyright, legal menu) ---- */
.m-footer--bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}

.m-footer__copyright {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  color: #9C9A90 !important;
}

.m-footer--bottom-menu.m-link-lists .m-link {
  color: #9C9A90 !important;
  font-size: 12px !important;
}

.m-footer--bottom-menu.m-link-lists .m-link:hover {
  color: var(--kv-accent) !important;
}

/* ---- Accessibility ---- */
@media (prefers-reduced-motion: reduce) {
  .m-newsletter-form__input-wrapper,
  .m-newsletter-form__button,
  .m-footer .social-media-links--item,
  .m-footer .m-link-lists .m-link,
  .m-footer--bottom-menu.m-link-lists .m-link {
    transition: none !important;
  }
}

/* ============================================
   KARVEEN — BLOG RESTYLE
   Real classes confirmed in snippets/page-title.liquid,
   snippets/breadcrumb.liquid, snippets/article-card.liquid,
   snippets/blog-sidebar.liquid, snippets/responsive-image.liquid.
   ============================================ */

/* ---- Page header ("BLOGS" title + breadcrumb) ---- */
.m-page-header__title {
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--kv-ink) !important;
}

.m-breadcrumb,
.m-breadcrumb--item {
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
  color: var(--kv-muted) !important;
}

.m-breadcrumb--item a {
  color: var(--kv-muted) !important;
  transition: color 0.2s ease !important;
}

.m-breadcrumb--item a:hover {
  color: var(--kv-accent) !important;
}

.m-breadcrumb--item-current {
  color: var(--kv-ink) !important;
}

/* ---- Article card image: rounded, animated zoom on hover ---- */
.m-article-card__image {
  display: block;
  overflow: hidden !important;
  border-radius: 8px !important;
}

.m-article-card__image .m-image,
.m-article-card__image img {
  transition: transform 0.6s ease !important;
}

.m-article-card:hover .m-article-card__image .m-image,
.m-article-card:hover .m-article-card__image img {
  transform: scale(1.06) !important;
}

/* ---- Card lift on hover (consistent with product cards) ---- */
.m-article-card {
  transition: transform 0.3s ease !important;
}

.m-article-card:hover {
  transform: translateY(-3px) !important;
}

/* ---- Card content ---- */
.m-article-card__tags {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--kv-accent) !important;
}

.m-article-card__date {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  color: var(--kv-muted) !important;
}

.m-article-card__title {
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  color: var(--kv-ink) !important;
}

.m-article-card__title a {
  transition: color 0.2s ease !important;
}

.m-article-card__title a:hover {
  color: var(--kv-accent) !important;
}

.m-article-card__excerpt {
  font-family: 'Inter', sans-serif !important;
  color: var(--kv-muted) !important;
  line-height: 1.6 !important;
}

/* ---- "Read More" link with a small arrow shift on hover ---- */
.m-article-card__readmore {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: var(--kv-ink) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: color 0.2s ease !important;
}

.m-article-card__readmore::after {
  content: '\2192';
  display: inline-block;
  transition: transform 0.2s ease !important;
}

.m-article-card__readmore:hover {
  color: var(--kv-accent) !important;
}

.m-article-card__readmore:hover::after {
  transform: translateX(3px);
}

/* ---- Blog sidebar widgets (Tags / Categories / Recent Post) ---- */
.m-widget__title {
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--kv-ink) !important;
}

/* Tag list as modern pill chips ----
   Scoped to .m-widget (blog sidebar) since .m-link-lists--inline is
   also reused by the footer's bottom legal-links menu, which should
   keep its own plain-text styling from the footer block above. */
.m-widget .m-link-lists--inline {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.m-widget .m-link-lists--inline .m-link-lists--item {
  margin: 0 !important;
}

.m-widget .m-link-lists--inline .m-link {
  display: inline-flex !important;
  padding: 6px 14px !important;
  border: 1px solid var(--kv-border) !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
}

.m-widget .m-link-lists--inline .m-link:hover {
  background-color: var(--kv-ink) !important;
  border-color: var(--kv-ink) !important;
  color: #fff !important;
}

/* ---- Accessibility ---- */
@media (prefers-reduced-motion: reduce) {
  .m-article-card,
  .m-article-card__image .m-image,
  .m-article-card__image img,
  .m-article-card__title a,
  .m-article-card__readmore,
  .m-article-card__readmore::after,
  .m-breadcrumb--item a,
  .m-widget .m-link-lists--inline .m-link {
    transition: none !important;
  }
}