/** Shopify CDN: Minification failed

Line 7:0 Unexpected "/"

**/

/

































Alma fonts · CSS
/* ============================================================
   עלמא פרחים — Visual overrides on top of Minimog 5.9.0
   Aligns the Shopify storefront with almaflowers.co.il
   ============================================================ */
 
/* --- 1) Fonts: Heebo (body) + Cormorant Garamond (display) +
       Frank Ruehl Libre (Hebrew display) ---------------------- */
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;600;700;800&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Frank+Ruehl+Libre:wght@300;400;500;700&display=swap');
@font-face { font-family:'Assistant'; src:url('/cdn/shop/files/Assistant-Regular.ttf?v=1784807803') format('truetype'); font-weight:300 400; font-style:normal; font-display:swap; }
@font-face { font-family:'Assistant'; src:url('/cdn/shop/files/Assistant-Medium.ttf?v=1784807803') format('truetype'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Assistant'; src:url('/cdn/shop/files/Assistant-SemiBold.ttf?v=1784807803') format('truetype'); font-weight:600 800; font-style:normal; font-display:swap; }
:root {
  --alma-green: #1c3e30;
  --alma-green-dark: #0f2820;
  --alma-card-bg: #f1f1ee;
  --alma-page-bg: #fafafa;
  --alma-pill-bg: #ececec;
  --alma-footer-bg: #F7F7F7;
  --alma-title: #27282c;
  --alma-muted: #727272;
  --alma-soft-muted: #A8A8A9;
  --alma-radius-card: 12px;
--alma-radius-pill: 9999px;
 
  --font-stack-header: 'Assistant', 'Heebo', sans-serif;
  --font-stack-body: 'Assistant', 'Heebo', sans-serif;
  --alma-serif: 'Assistant', 'Heebo', sans-serif;
  --alma-sans: 'Assistant', 'Heebo', sans-serif;
}
 
/* Body uses Heebo (sans). Headings get the serif (rule below). */
*, *::before, *::after {
  font-family: var(--alma-sans) ;
}
 
body, body input, body button, body select, body textarea {
  letter-spacing: 0;
}
 
/* --- 2) Page background -------------------------------------- */
body {
  background-color: var(--alma-page-bg);
}
 
/* ===== #3 (final): one green + on the image bottom, on ALL products ===== */
.m-product-card__media { position: relative !important; }
.m-product-card__action--top {
  position: absolute !important;
  top: auto !important;
  bottom: 12px !important;
  left: 12px !important;
  right: auto !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 4 !important;
}
/* show the single-variant add-to-cart (inside <product-form>) too */
.m-product-card__action--top product-form,
.m-product-card__action--top .m-product-form,
.m-product-card__action--top .m-add-to-cart.m-button--icon {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
/* keep only the primary + , hide the extra quick-view icon */
.m-product-card__action--top .m-button--icon:not(.m-product-card__atc-button) {
  display: none !important;
}
 
/* --- 4) Buttons globally (alma green) ------------------------ */
.m-button--primary,
button.m-button--primary,
a.m-button--primary {
  background-color: var(--alma-green);
  color: #ffffff;
  border-radius: var(--alma-radius-pill);
  border: 0;
  font-weight: 500;
  letter-spacing: 0;
  padding-inline: 28px;
  transition: background-color 0.2s ease, transform 0.2s ease;
}
 
.m-button--primary:hover,
button.m-button--primary:hover,
a.m-button--primary:hover {
  background-color: var(--alma-green-dark);
  color: #ffffff;
}
 
.m-button--white {
  border-radius: var(--alma-radius-pill);
}
 
/* "WhatsApp" CTA pill — live site uses a dark/black pill */
a[href*="wa.me"].m-button,
.m-rich-text a[href*="wa.me"] {
  background-color: #222222 !important;
  color: #ffffff !important;
  border-radius: var(--alma-radius-pill);
  padding: 12px 28px;
}
 
a[href*="wa.me"].m-button:hover {
  background-color: var(--alma-green) !important;
}
 
/* --- 5) Header — sticky with centered pill search ------------ */
.m-header {
  background-color: #ffffff;
  border-bottom: 1px solid #f0f0f0;
}
 
.m-header__search,
.m-header .m-search-form {
  border-radius: var(--alma-radius-pill);
  background-color: var(--alma-pill-bg);
  border: 0;
}
 
.m-header__search input,
.m-header .m-search-form input {
  background-color: transparent;
  border: 0;
  font-size: 14px;
}
 
.m-header__search input::placeholder {
  color: var(--alma-soft-muted);
}
 
/* --- 6) Section headings ------------------------------------ */
.m-section__heading,
.m-section__header h2,
.m-section__header h3 {
  color: var(--alma-title);
  font-weight: 700;
  letter-spacing: -0.01em;
}
 
/* --- 7) Category tile carousel ("חפשו בקטגוריות") ------------ */
.m-collection-list .m-collection-card,
.m-collection-list .m-collection-list__item {
  border-radius: var(--alma-radius-card);
  overflow: hidden;
}
 
.m-collection-list .m-collection-card__media,
.m-collection-list .m-collection-list__item img {
  background-color: var(--alma-card-bg);
  border-radius: var(--alma-radius-card);
  transition: transform 0.4s ease;
}
 
.m-collection-list .m-collection-card:hover img,
.m-collection-list .m-collection-list__item:hover img {
  transform: scale(1.06);
}
 
.m-collection-list .m-collection-card__title {
  text-align: center;
  font-weight: 500;
  color: var(--alma-title);
  margin-top: 10px;
}
 
/* --- 8) Promotion banner ("מזמינים עד 15:00...") -------------- */
.m-promotion-banner.m-color-inverse,
.m-promotion-banner[class*="color-inverse"] {
  background-color: var(--alma-green);
  color: #ffffff;
}
 
.m-promotion-banner .m-section__heading {
  color: #ffffff;
}
 
.m-promotion-banner .m-button--white {
  background-color: #ffffff;
  color: var(--alma-green);
  border-radius: var(--alma-radius-pill);
  padding: 12px 32px;
  font-weight: 600;
}
 
.m-promotion-banner .m-button--white:hover {
  background-color: var(--alma-card-bg);
  color: var(--alma-green-dark);
}
 
/* --- 9) Footer (light grey, 4 cols collapse to accordion) ----- */
.m-footer,
.m-footer-block {
  background-color: var(--alma-footer-bg);
  color: var(--alma-title);
}
 
.m-footer .m-footer__heading,
.m-footer h4,
.m-footer h5 {
  color: var(--alma-title);
  font-weight: 700;
  letter-spacing: 0;
}
 
.m-footer a {
  color: var(--alma-muted);
  transition: color 0.2s ease;
}
 
.m-footer a:hover {
  color: var(--alma-green);
}
 
/* WhatsApp pill in footer top */
.m-footer a[href*="wa.me"] {
  background-color: #222222;
  color: #ffffff;
  border-radius: var(--alma-radius-pill);
  padding: 10px 24px;
  display: inline-block;
}
 
/* Social media links — round 44x44 pills */
body .m-footer--block .social-media-links a,
body .m-footer .social-media-links a {
  background-color: #ececec;
  color: #222;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease, color 0.2s ease;
}
 
body .m-footer .social-media-links a:hover {
  background-color: var(--alma-green);
  color: #ffffff;
}
 
/* --- 10) Cart drawer + cart button --------------------------- */
.m-cart-drawer .m-button--primary {
  background-color: var(--alma-green);
}
 
/* --- 11) Hero slide CTA — pill --------------------------------- */
.m-slider .m-slide__btn,
.m-slider .m-button {
  border-radius: var(--alma-radius-pill);
}
 
/* --- 12) RTL fine-tuning ------------------------------------- */
html[dir="rtl"] .m-product-card__name,
html[dir="rtl"] .m-product-card__title,
html[dir="rtl"] .m-section__heading {
  text-align: right;
}
 
html[dir="rtl"] .m-section__header[class*="alignment-center"],
html[dir="rtl"] .m-section__header.text-center {
  text-align: center;
}
 
/* --- 13) Mobile tweaks --------------------------------------- */
@media (max-width: 749px) {
  .m-section__header {
    padding-inline: 16px;
  }
 
  .m-product-card__name,
  .m-product-card__title {
    font-size: 14px;
  }
}
 
/* --- 14) Smooth focus rings (accessibility) ------------------ */
a:focus-visible,
button:focus-visible,
.m-button:focus-visible {
  outline: 2px solid var(--alma-green);
  outline-offset: 2px;
  border-radius: 4px;
}
 
/* --- 15) "עוד דברים שעשויים לעניין אתכם" — related products --- */
/* This is the section the redesign was originally for. Apply the
   same card treatment as the homepage product carousel. */
.m-related-products .m-product-card,
[class*="related-products"] .m-product-card,
.m-product-recommendations .m-product-card {
  border-radius: var(--alma-radius-card);
}
 
.m-related-products .m-section__heading,
.m-product-recommendations .m-section__heading {
  text-align: center;
  margin-bottom: 24px;
}
 
/* ============================================================
   19) QUICKVIEW MODAL — match live almaflowers.co.il behavior
   ------------------------------------------------------------
   - Hide the "View details / מעבר לדף המוצר המלא" link
   - Hide the inventory/Low stock indicator
   - Hide vendor / SKU clutter
   ============================================================ */
 
.m-product-quickview .m-product-quickview--viewmore,
.m-product-quickview a[href*="/products/"]:not(.m-button) {
  display: none !important;
}
 
.m-product-quickview .m-product-inventory,
.m-product-quickview .main-product__block-inventory_status,
.m-product-quickview .m-product-vendor,
.m-product-quickview .m-product-sku {
  display: none !important;
}
 
/* Title and price styling inside quickview — match live site */
.m-product-quickview .m-product-quickview--title,
.m-product-quickview .m-product-meta__title {
  color: var(--alma-title);
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 6px;
}
 
.m-product-quickview .m-price__regular,
.m-product-quickview .m-price-item--regular {
  color: var(--alma-title);
  font-weight: 600;
  font-size: 20px;
}
 
/* "Add to cart" button — primary green pill, full-width */
.m-product-quickview .m-product-form__buttons .m-button--primary,
.m-product-quickview .m-product-form__submit,
.m-product-quickview button[name="add"] {
  background-color: var(--alma-green) !important;
  color: #ffffff !important;
  border-radius: var(--alma-radius-pill) !important;
  border: 0 !important;
  padding: 14px 28px !important;
  font-weight: 600;
  font-size: 15px;
  width: 100%;
}
 
.m-product-quickview .m-product-form__buttons .m-button--primary:hover {
  background-color: var(--alma-green-dark) !important;
}
 
/* Buy It Now button — white with green border */
.m-product-quickview .shopify-payment-button button[type="submit"],
.m-product-quickview .shopify-payment-button [role="button"] {
  background-color: var(--alma-green-dark) !important;
  color: #ffffff !important;
  border-radius: var(--alma-radius-pill) !important;
  border: 0 !important;
}
 
/* Variant option swatches/buttons inside quickview — clean look */
.m-product-quickview .m-product-meta__form .m-product-variants {
  border-top: 1px solid #f0f0f0;
  padding-top: 14px;
  margin-top: 10px;
}
 
.m-product-quickview .m-product-variants__option-name {
  color: var(--alma-title);
  font-weight: 600;
  font-size: 14px;
}
 
.m-product-quickview .m-variant-buttons input + label,
.m-product-quickview .m-variant-buttons .m-radio__label {
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 8px 14px;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}
 
.m-product-quickview .m-variant-buttons input:checked + label,
.m-product-quickview .m-variant-buttons input[checked] + label {
  border-color: var(--alma-green);
  background-color: var(--alma-card-bg);
  color: var(--alma-green);
  font-weight: 600;
}
 
/* Quantity selector — clean rectangular */
.m-product-quickview .m-product-quantity__input,
.m-product-quickview quantity-input {
  border: 1px solid #ddd;
  border-radius: 8px;
}
 
/* ============================================================
   20) GLOBAL INVENTORY/LOW STOCK INDICATOR — hide everywhere
   ------------------------------------------------------------ */
.m-product-inventory,
.m-product-card .m-product-card__inventory,
.main-product__block-inventory_status {
  display: none !important;
}
 
/* ============================================================
   17) "עוד מעלמא" — bottom 3-feature row
   (Gift card / Workshops / Custom bouquet by florist)
   Section custom_class = "alma-features-row"
   ------------------------------------------------------------ */
 
.alma-features-row .m-section__heading {
  text-align: center;
  font-weight: 700;
  color: var(--alma-title);
  margin-bottom: 32px;
}
 
.alma-features-row .m-multiple-image-with-text__items,
.alma-features-row [class*="m-multiple-image"] [class*="grid"],
.alma-features-row [class*="grid-cols"] {
  gap: 24px;
}
 
/* Each feature block — rounded card on cream bg with hover lift */
.alma-features-row .m-image-with-text,
.alma-features-row [class*="m-image-with-text"],
.alma-features-row .m-multiple-image-with-text__item {
  background-color: var(--alma-card-bg);
  border-radius: var(--alma-radius-card);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
 
.alma-features-row .m-image-with-text:hover,
.alma-features-row [class*="m-image-with-text"]:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(28, 62, 48, 0.10);
}
 
/* Image top of card — fixed aspect ratio for visual harmony */
.alma-features-row .m-image-with-text__image,
.alma-features-row .m-image-with-text picture,
.alma-features-row .m-multiple-image-with-text__item img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background-color: #e8e8e3;
}
 
/* Text block inside card */
.alma-features-row .m-image-with-text__content,
.alma-features-row [class*="m-image-with-text"] .m-section__header,
.alma-features-row .m-multiple-image-with-text__item .m-image-with-text__content {
  padding: 24px 22px 26px;
  text-align: start;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
 
/* Subheading — small alma green eyebrow */
.alma-features-row .m-image-with-text__subheading,
.alma-features-row [class*="sub_title"],
.alma-features-row .m-section__subheading {
  color: var(--alma-green);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: none;
  margin-bottom: 4px;
}
 
/* Heading inside the card */
.alma-features-row .m-image-with-text__title,
.alma-features-row .m-image-with-text h3,
.alma-features-row .m-image-with-text h2 {
  color: var(--alma-title);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 6px 0;
}
 
/* Body text */
.alma-features-row .m-image-with-text__text,
.alma-features-row .m-image-with-text [class*="text"] p {
  color: var(--alma-muted);
  font-size: 15px;
  line-height: 1.6;
  margin: 0 0 16px 0;
}
 
/* CTA button — green pill, full-width on mobile */
.alma-features-row .m-image-with-text .m-button--primary,
.alma-features-row .m-image-with-text a.m-button {
  align-self: flex-start;
  background-color: var(--alma-green);
  color: #ffffff;
  border-radius: var(--alma-radius-pill);
  padding: 11px 24px;
  font-weight: 500;
  font-size: 14px;
  margin-top: auto;       /* pin to bottom of card so heights align */
  transition: background-color 0.2s ease, transform 0.2s ease;
}
 
.alma-features-row .m-image-with-text .m-button--primary:hover {
  background-color: var(--alma-green-dark);
  transform: translateY(-1px);
}
 
/* Mobile: 1 column stack */
@media (max-width: 749px) {
  .alma-features-row .m-multiple-image-with-text__items,
  .alma-features-row [class*="grid-cols"] {
    grid-template-columns: 1fr !important;
    gap: 16px;
  }
 
  .alma-features-row .m-image-with-text__title {
    font-size: 19px;
  }
 
  .alma-features-row .m-image-with-text .m-button--primary {
    align-self: stretch;
    text-align: center;
  }
}
 
/* Tablet: 3 columns are tight, allow 2-column fallback if needed */
@media (min-width: 750px) and (max-width: 989px) {
  .alma-features-row [class*="grid-cols-3"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
 
/* ============================================================
   18) "עוד מעלמא" — custom alma-services section
   (Distinct editorial style, unlike the live site)
   ------------------------------------------------------------
   Cream-on-cream feel: cream section bg, white cards inside.
   Each card has image-on-top, eyebrow, title, body, arrow link.
   Hover: card lifts gently and arrow shifts.
   ============================================================ */
 
.alma-services {
  background-color: var(--alma-services-section-bg, #f1f1ee);
  padding-top: var(--alma-services-pt, 70px);
  padding-bottom: var(--alma-services-pb, 70px);
}
 
.alma-services__inner {
  max-width: 1420px;
  margin: 0 auto;
  padding-inline: 24px;
}
 
/* --- Section header (centered) --- */
.alma-services__header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 40px;
}
 
.alma-services__eyebrow {
  color: var(--alma-green);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 8px 0;
}
 
.alma-services__title {
  font-size: clamp(26px, 3.6vw, 38px);
  font-weight: 700;
  color: var(--alma-title);
  margin: 0 0 8px 0;
  line-height: 1.2;
  letter-spacing: -0.01em;
}
 
.alma-services__subtitle {
  font-size: 16px;
  color: var(--alma-muted);
  margin: 0;
  line-height: 1.55;
}
 
/* --- Grid --- */
.alma-services__grid {
  display: grid;
  gap: 20px;
  grid-template-columns: 1fr;
}
 
@media (min-width: 750px) {
  .alma-services__grid--cols-2 { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .alma-services__grid--cols-3 { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .alma-services__grid--cols-4 { grid-template-columns: repeat(4, 1fr); gap: 20px; }
  .alma-services__grid--cols-5,
  .alma-services__grid--cols-6 { grid-template-columns: repeat(3, 1fr); gap: 20px; }
}
 
/* --- Card --- */
.alma-services__card {
  position: relative;
  background-color: var(--alma-services-card-bg, #ffffff);
  border-radius: var(--alma-radius-card);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
  box-shadow: 0 1px 2px rgba(28, 62, 48, 0.04);
}
 
.alma-services__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(28, 62, 48, 0.10);
}
 
/* Stretchy invisible link covers the whole card so anywhere is clickable */
.alma-services__card-link {
  position: absolute;
  inset: 0;
  z-index: 2;
  text-indent: -9999px;
  overflow: hidden;
}
 
/* --- Card media (image OR placeholder) --- */
.alma-services__card-media {
  width: 100%;
  aspect-ratio: 4 / 3;
  background-color: #e8e8e3;
  overflow: hidden;
  position: relative;
}
 
.alma-services__card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
  display: block;
}
 
.alma-services__card:hover .alma-services__card-img {
  transform: scale(1.04);
}
 
.alma-services__card-media--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #b8b8b0;
  background-color: #ececea;
}
 
/* --- Card body --- */
.alma-services__card-body {
  padding: 22px 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
 
.alma-services__card-eyebrow {
  color: var(--alma-green);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  margin: 0 0 2px 0;
  text-transform: none;
}
 
.alma-services__card-title {
  font-size: 21px;
  font-weight: 700;
  color: var(--alma-title);
  line-height: 1.3;
  margin: 0 0 4px 0;
}
 
.alma-services__card-body-text,
.alma-services__card-body-text p {
  color: var(--alma-muted);
  font-size: 14.5px;
  line-height: 1.6;
  margin: 0 0 12px 0;
}
 
.alma-services__card-body-text p:last-child {
  margin-bottom: 0;
}
 
/* CTA: subtle text link with arrow that animates on hover */
.alma-services__card-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding-top: 4px;
  color: var(--alma-green);
  font-weight: 600;
  font-size: 14px;
  position: relative;
  z-index: 3;        /* above the stretchy link so hover state reads */
}
 
.alma-services__card-cta-arrow {
  display: inline-block;
  transition: transform 0.25s ease;
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
}
 
.alma-services__card:hover .alma-services__card-cta-arrow {
  transform: translateX(-4px);   /* RTL: arrow moves toward content (right) */
}
 
html[dir="ltr"] .alma-services__card:hover .alma-services__card-cta-arrow {
  transform: translateX(4px);
}
 
/* In RTL, the arrow points the right way already (← in source = → visually) */
html[dir="rtl"] .alma-services__card-cta-arrow {
  /* keep ← as drawn — it visually points to the start (right side) in RTL,
     which is the natural "continue" direction in Hebrew */
}
 
/* --- Mobile tweaks --- */
@media (max-width: 749px) {
  .alma-services__inner {
    padding-inline: 16px;
  }
 
  .alma-services__header {
    margin-bottom: 28px;
  }
 
  .alma-services__card-title {
    font-size: 19px;
  }
 
  .alma-services__card-body {
    padding: 18px 18px 20px;
  }
}
 
/* ============================================================
   21) EDITORIAL TYPOGRAPHY — premium magazine aesthetic
   ============================================================ */
 
h1, h2, h3, h4,
.m-section__heading,
.m-section__header h1,
.m-section__header h2,
.m-section__header h3,
.m-promotion-banner__heading,
.m-promotion-banner h2,
.m-product-meta__title,
.m-product-quickview--title {
  font-family: var(--alma-serif) ;
  font-weight: 400 ;
  letter-spacing: 0.01em;
  line-height: 1.15;
}
 
.m-section__heading,
.m-section__header h2 {
  font-size: clamp(24px, 3.2vw, 36px) ;
}
 
.m-section__header h3 {
  font-size: clamp(20px, 2.6vw, 28px) ;
}
 
/* Subheadings / kickers / eyebrows — small, uppercase, letter-spaced */
.m-section__subheading,
.m-section__header [class*="subheading"] {
  font-family: var(--alma-sans) ;
  font-size: 11px ;
  font-weight: 400 ;
  letter-spacing: 0.32em !important;
  text-transform: uppercase;
  color: #888 ;
}
 
/* Body / description text under section headers */
.m-section__description,
.m-section__header p {
  font-family: var(--alma-sans) !important;
  font-weight: 300 !important;
  color: var(--alma-muted) !important;
  line-height: 1.7;
}
 
/* ============================================================
   22) EDITORIAL BUTTONS — outline / minimal, no pill noise
   ============================================================ */
 
/* Hero & banner buttons — outline style */
.m-slider .m-button,
.m-slide__btn,
.m-promotion-banner .m-button {
  border-radius: 0 !important;
  background: transparent !important;
  border: 1px solid currentColor !important;
  color: inherit !important;
  font-size: 11px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase;
  padding: 13px 28px !important;
  font-weight: 400 !important;
  transition: background-color 0.25s ease, color 0.25s ease;
}
 
.m-promotion-banner.m-color-inverse .m-button,
.m-promotion-banner .m-button--white {
  background: transparent !important;
  color: #fff !important;
  border-color: rgba(255,255,255,0.7) !important;
}
 
.m-promotion-banner .m-button--white:hover,
.m-promotion-banner.m-color-inverse .m-button:hover {
  background: #fff !important;
  color: var(--alma-green) !important;
}
 
/* "View all / browse" link buttons — text+arrow, underlined */
.m-section__header .m-button--link,
.m-button--link {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid currentColor !important;
  border-radius: 0 !important;
  padding: 4px 0 !important;
  color: var(--alma-title);
  font-size: 16px;
  letter-spacing: normal;
  text-transform: none;
  font-weight: 400;
}
 
/* ============================================================
   23) "עוד מעלמא" — refined editorial layout
       (overrides the cartoony version from section 17)
   ============================================================ */
 
.alma-features-row {
  background: var(--alma-card-bg) !important;
  padding-top: 80px !important;
  padding-bottom: 80px !important;
}
 
.alma-features-row .m-section__header {
  text-align: center;
  max-width: 520px;
  margin: 0 auto 48px;
}
 
.alma-features-row .m-section__heading {
  font-family: var(--alma-serif) ;
  font-weight: 400 ;
  font-size: 32px ;
  color: var(--alma-title);
  letter-spacing: 0.01em;
}
 
/* Cards: white surface, no border-radius noise, side-by-side image/text */
.alma-features-row .m-image-with-text,
.alma-features-row [class*="m-image-with-text"],
.alma-features-row .m-multiple-image-with-text__item {
  background: #ffffff !important;
  border-radius: 0 !important;
  overflow: hidden;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  min-height: 280px;
  box-shadow: none !important;
  margin-bottom: 14px;
  flex-direction: row !important;
}
 
.alma-features-row .m-image-with-text:hover,
.alma-features-row [class*="m-image-with-text"]:hover {
  transform: none !important;
  box-shadow: none !important;
}
 
/* Image side — full color block, atmospheric, no aspect-ratio */
.alma-features-row .m-image-with-text__image,
.alma-features-row .m-image-with-text picture,
.alma-features-row [class*="m-image-with-text"] img,
.alma-features-row .m-multiple-image-with-text__item img {
  width: 100%;
  height: 100%;
  aspect-ratio: auto !important;
  object-fit: cover;
  background: linear-gradient(135deg, #e8e1d3 0%, #c8b896 100%);
}
 
/* When no image: show a subtle gradient placeholder per block-position */
.alma-features-row .m-image-with-text:nth-child(1) .m-image-with-text__image:empty,
.alma-features-row [class*="m-image-with-text"]:nth-of-type(1) .m-image-with-text__image:empty {
  background: linear-gradient(135deg, #ede4d3 0%, #c8b896 100%);
}
.alma-features-row .m-image-with-text:nth-child(2) .m-image-with-text__image:empty,
.alma-features-row [class*="m-image-with-text"]:nth-of-type(2) .m-image-with-text__image:empty {
  background: radial-gradient(ellipse at 35% 35%, #dde6ec 0%, #c5d2dc 60%, #a8b8c4 100%);
}
.alma-features-row .m-image-with-text:nth-child(3) .m-image-with-text__image:empty,
.alma-features-row [class*="m-image-with-text"]:nth-of-type(3) .m-image-with-text__image:empty {
  background: radial-gradient(ellipse at 40% 35%, #e8dcd5 0%, #d4c8c2 55%, #b8a89e 100%);
}
 
/* Content side */
.alma-features-row .m-image-with-text__content,
.alma-features-row [class*="m-image-with-text"] .m-section__header {
  padding: 36px 32px !important;
  text-align: start !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0 !important;
}
 
/* Subheading: small uppercase eyebrow */
.alma-features-row .m-image-with-text__subheading,
.alma-features-row [class*="m-image-with-text"] .m-section__subheading {
  font-family: var(--alma-sans) ;
  font-size: 10px ;
  font-weight: 400 ;
  letter-spacing: 0.32em !important;
  color: #888 ;
  text-transform: uppercase;
  margin: 0 0 12px 0 !important;
}
 
/* Title: large serif */
.alma-features-row .m-image-with-text__title,
.alma-features-row [class*="m-image-with-text"] .m-section__heading,
.alma-features-row [class*="m-image-with-text"] h2,
.alma-features-row [class*="m-image-with-text"] h3 {
  font-family: var(--alma-serif) ;
  font-size: 26px ;
  font-weight: 400 ;
  line-height: 1.2 !important;
  color: var(--alma-title) ;
  margin: 0 0 14px 0 !important;
}
 
/* Body text */
.alma-features-row .m-image-with-text__text,
.alma-features-row [class*="m-image-with-text"] [class*="text"] p,
.alma-features-row .m-section__description {
  color: var(--alma-muted) !important;
  font-size: 13.5px !important;
  font-weight: 300 !important;
  line-height: 1.7 !important;
  margin: 0 0 24px 0 !important;
}
 
/* CTA: text-only with arrow, underlined, uppercase */
.alma-features-row .m-image-with-text .m-button,
.alma-features-row .m-image-with-text .m-button--primary,
.alma-features-row [class*="m-image-with-text"] a.m-button,
.alma-features-row [class*="m-image-with-text"] a[class*="button"] {
  align-self: flex-start;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid var(--alma-title) !important;
  border-radius: 0 !important;
  padding: 6px 0 !important;
  color: var(--alma-title) ;
  font-size: 10px ;
  letter-spacing: 0.2em !important;
  text-transform: uppercase;
  font-weight: 400 ;
  transition: opacity 0.25s ease;
}
 
.alma-features-row .m-image-with-text .m-button:hover,
.alma-features-row [class*="m-image-with-text"] a.m-button:hover {
  opacity: 0.6;
  background: transparent !important;
  color: var(--alma-title) ;
  transform: none !important;
}
 
/* Mobile: stack image above text */
@media (max-width: 749px) {
  .alma-features-row .m-image-with-text,
  .alma-features-row [class*="m-image-with-text"],
  .alma-features-row .m-multiple-image-with-text__item {
    grid-template-columns: 1fr !important;
    min-height: auto;
  }
  .alma-features-row .m-image-with-text__image,
  .alma-features-row [class*="m-image-with-text"] img,
  .alma-features-row .m-multiple-image-with-text__item img {
    aspect-ratio: 4/3 !important;
  }
}
 
/* ============================================================
   24) HERO + CATEGORY HEADER REFINEMENTS
   ============================================================ */
 
.m-slider .m-slide__title,
.m-slider .m-slide h1 {
  font-family: var(--alma-serif) ;
  font-weight: 400 ;
  letter-spacing: 0.02em;
}
 
.m-slider .m-slide__subheading {
  font-family: var(--alma-sans) ;
  font-size: 10px ;
  font-weight: 400 ;
  letter-spacing: 0.32em !important;
  text-transform: uppercase;
}
 
/* Logo wordmark in header — Frank Ruehl Libre serif for Hebrew */
.m-header__logo,
.m-header__logo-text,
.m-logo,
.m-logo-text {
  font-family: var(--alma-serif) !important;
  font-weight: 400 !important;
  letter-spacing: 0.16em;
}
 
/* Header nav — uppercase, letter-spaced */
.m-header__nav a,
.m-header__menu a {
  font-size: 16px !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  font-weight: 400 !important;
}
 
/* ============================================================
   25) PRODUCT-CARD "+" BUTTON — single clean implementation
   One green + circle on the product image, for BOTH card types:
   direct add-to-cart (single variant) AND choose-options /
   quick-view (products with sizes).
   ============================================================ */
 
/* If a direct add-to-cart icon exists on the image, hide the
   redundant quick-view icon next to it (single-variant cards). */
.m-product-card:has(.m-product-card__action--top .m-add-to-cart.m-button--icon)
  .m-product-card__action--top .m-product-quickview-button.m-button--icon {
  display: none !important;
}
 
/* Hide full-width "quick add"/"choose options" duplicate buttons
   and any non-image (footer/hover) action rows. */
.m-product-card .m-product-card__action:not(.m-product-card__action--top),
.m-product-card .m-add-to-cart.m-button:not(.m-button--icon),
.m-product-card .m-product-quickview-button.m-product-form {
  display: none !important;
}
 
/* Style the remaining on-image icon button as a 40px green + circle. */
.m-product-card__action--top .m-button--icon {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #1c3e30 !important;
  color: #ffffff !important;
  border: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 8px rgba(28, 62, 48, 0.18);
  transition: transform .15s ease, background .15s ease;
}
.m-product-card__action--top .m-button--icon:hover {
  background: #14291f !important;
  transform: scale(1.08);
}
/* Hide the button's built-in icon/label; draw a white + instead. */
.m-product-card__action--top .m-button--icon > * {
  display: none !important;
}
.m-product-card__action--top .m-button--icon::before {
  content: "+" !important;
  display: block !important;
  color: #ffffff !important;
  font-size: 26px !important;
  line-height: 1 !important;
  font-weight: 400 !important;
}
 
/* ============================================================
                                                                                                                 26) UNIFORM 4:3 PRODUCT CARD IMAGE RATIO (collection pages)
                                                                                                                    ============================================================ */
                                                                                                                    .m-product-card__media {
                                                                                                                      aspect-ratio: 4 / 3 !important;
                                                                                                                        height: auto !important;
                                                                                                                          overflow: hidden !important;
                                                                                                                          }
                                                                                                                          .m-product-card__media > * {
                                                                                                                            --aspect-ratio: 1.3333 !important;
                                                                                                                            }
                                                                                                                            .m-product-card__media .m-image,
                                                                                                                            .m-product-card__media img {
                                                                                                                              width: 100% !important;
                                                                                                                                height: 100% !important;
                                                                                                                                  object-fit: cover !important;
                                                                                                                                  }
 
/* =========================================================
   27) STATIC CATEGORY LIST — round images, single-row slider, no movement
   ========================================================= */
.m-collection-list--grid .m-collection-list__controls,
.m-collection-list--grid .swiper-button-prev,
.m-collection-list--grid .swiper-button-next,
.m-collection-list--grid .m-slider-controls__button { display: none !important; }
 
.m-collection-list--grid .m-mixed-layout__wrapper { overflow-x: auto !important; overflow-y: hidden !important; height: auto !important; -ms-overflow-style: none !important; scrollbar-width: none !important; }
.m-collection-list--grid .m-mixed-layout__wrapper::-webkit-scrollbar { display: none !important; }
.m-collection-list--grid .swiper-wrapper { transform: none !important; height: auto !important; display: flex !important; flex-wrap: nowrap !important; justify-content: space-evenly !important; align-items: flex-start !important; gap: 16px !important; }
.m-collection-list--grid .swiper-slide { width: 158px !important; min-width: 158px !important; max-width: 158px !important; margin: 0 !important; }
.m-collection-list--grid .swiper-slide-duplicate { display: none !important; }
.m-collection-list--grid .m-collection-card { width: 158px !important; max-width: 158px !important; height: auto !important; margin: 0 !important; flex: 0 0 auto !important; }
.m-collection-list--grid .m-collection-card__image { width: 158px !important; height: 158px !important; }
.m-collection-list--grid .m-collection-card__title { white-space: normal !important; text-align: center !important; font-size: 16px ; margin-top: 12px !important; }
.m-collection-list--grid .m-collection-card__info { text-align: center !important; }
 
@media (max-width: 767px) {
  .m-collection-list--grid .m-mixed-layout__inner {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-template-columns: none !important;
    grid-auto-columns: 30vw !important;
    gap: 12px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    padding: 0 12px !important;
  }
  .m-collection-list--grid .m-mixed-layout__inner::-webkit-scrollbar { display: none !important; }
  .m-collection-list--grid .swiper-slide,
  .m-collection-list--grid .m\:column {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  .m-collection-list--grid .m-collection-card { width: 100% !important; max-width: none !important; }
  .m-collection-list--grid .m-collection-card__image { width: 100% !important; height: auto !important; aspect-ratio: 1 / 1 !important; }
  .m-collection-list--grid .m-collection-card__title { font-size: 13px ; margin-top: 8px !important; }
}
 
/* =========================================================
   28) WHATSAPP FLOATING BUTTON
   ========================================================= */
.alma-whatsapp-float {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  left: auto !important;
  width: 56px !important;
  height: 56px !important;
  background-color: #25D366 !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.25) !important;
  z-index: 9998 !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.alma-whatsapp-float:hover {
  transform: scale(1.08) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.3) !important;
}
.alma-whatsapp-float svg { width: 32px !important; height: 32px !important; }
 
@media (max-width: 767px) {
  .alma-whatsapp-float {
    width: 52px !important;
    height: 52px !important;
    bottom: 18px !important;
    right: 18px !important;
  }
  .alma-whatsapp-float svg { width: 28px !important; height: 28px !important; }
}
/* ===== Section 29: Quick-view size selector fix (#11) ===== */
.alma-qv [data-qv-variants] {
  display: block !important;
}
.alma-qv__variants {
  margin: 14px 0 6px;
  text-align: right;
}
.alma-qv__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-start;
}
.alma-qv__pill {
  min-width: 64px;
  padding: 8px 16px;
  border: 1px solid #d8d8d8;
  border-radius: 999px;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  transition: all .15s ease;
}
.alma-qv__pill:hover {
  border-color: #1f3d2b;
}
.alma-qv__pill.is-active {
  background: #1f3d2b;
  color: #fff;
  border-color: #1f3d2b;
}
/* ===== Section 30: Click-to-call floating button (#16) ===== */
.alma-call-float {
  position: fixed;
  bottom: 90px;            /* יושב מעל כפתור הוואטסאפ (24px + 56px + מרווח) */
  right: 24px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #1f3d2b;      /* ירוק המותג */
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9998;
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
  transition: transform .15s ease, box-shadow .15s ease;
}
.alma-call-float:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 16px rgba(0,0,0,.32);
}
@media (max-width: 749px) {
  .alma-call-float {
    width: 52px;
    height: 52px;
bottom: 84px;
    right: 16px;
  }
}
/* ===== Section 31: Alma custom sections — Assistant font ===== */
[class*="alma-"],
[class*="alma-"] label,
[class*="alma-"] input,
[class*="alma-"] select,
[class*="alma-"] textarea,
[class*="alma-"] button,
[class*="alma-"] p,
[class*="alma-"] a,
[class*="alma-"] li,
[class*="alma-"] h1, [class*="alma-"] h2, [class*="alma-"] h3,
[class*="alma-"] h4, [class*="alma-"] h5, [class*="alma-"] h6 {
  font-family: 'Assistant', sans-serif !important;
}
/* ===== #3: single + button, always visible (mobile + desktop) ===== */
.m-product-card__action--top {
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.m-product-card__action--top .m-button--icon:not(.m-product-card__atc-button) {
  display: none !important;
}
/* ===== #3b: move + button to the bottom of the image ===== */
.m-product-card__action--top {
  top: auto !important;
  bottom: 14px !important;
}
/* ===== #4 (v2): size selector only when real variant options exist ===== */
.alma-qv [data-qv-variants] { display: none !important; }
.alma-qv [data-qv-variants]:has([data-qv-variants-list] button) { display: block !important; }
/* ===== #10: scroll-to-top arrow — restore visible size ===== */
#scroll-to-top-button svg,
.m-button--scroll-top svg {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  flex: none !important;
  color: #ffffff !important;
  fill: #ffffff !important;
}