/** Shopify CDN: Minification failed

Line 959:19 Unexpected "{"
Line 959:27 Expected ":"

**/
/* v1777759227 */
/* Custom Fixes for JulianePorter Site */

/* Round 8 — Belt-and-suspenders against horizontal page scroll.
   Some sections use 100vw / negative-margin full-bleed tricks; on Windows
   100vw includes the scrollbar width, so even a 1px overflow can introduce
   sideways scrolling. Clamp the page to never scroll horizontally. */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

/* ===========================================================================
   ROUND 6 — Juliane email items 1-16 fixes
   =========================================================================== */

/* Item 6: Product card images at full brightness on hover (regression).
   Override the global a:hover { opacity: 0.7 } that's dimming images inside
   product card anchors. */
html body .card-wrapper a:hover,
html body .card a:hover,
html body .card a:hover img,
html body .product-card-gallery a:hover,
html body .product-card-gallery a:hover img,
html body .scroll-item a:hover,
html body .scroll-item a:hover img,
html body .grid__item a:hover,
html body .grid__item a:hover img,
html body .featured-collection-section a:hover,
html body .featured-collection-section a:hover img,
html body .related-products-grid a:hover,
html body .related-products-grid a:hover img,
html body .collection-grid a:hover,
html body .collection-grid a:hover img,
html body .product-thumbnail a:hover,
html body .product-thumbnail a:hover img {
  opacity: 1 !important;
}

/* Item 12: Card title and price tighter spacing + consistent PT Serif font. */
html body .card__heading,
html body .card-info__title,
html body .product-card-title {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.92rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
  margin: 0.7rem 0 0.15rem !important;
  color: #1a1a1a !important;
  line-height: 1.3 !important;
}
html body .card__price,
html body .card-info__price,
html body .product-card-price {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.85rem !important;
  color: #555 !important;
  letter-spacing: 0.02em !important;
  margin-top: 0 !important;
}

/* Item 13: Cards use cover not contain, so portrait/landscape mix evenly. */
html body .card__image-container img,
html body .card-info__image img,
html body .product-card-gallery .card__image-container img,
html body .scroll-item .card__image-container img,
html body .related-products-grid .card__image-container img,
html body .featured-collection-section .card__image-container img,
html body .collection-grid .card__image-container img {
  object-fit: cover !important;
  object-position: center !important;
}

/* Item 7d: Single consistent background color across the bottom homepage sections.
   Force the homepage-gallery section (which had its own bg) to inherit. */
html body .shopify-section[class*="homepage-gallery"],
html body .shopify-section[id*="homepage_gallery"],
html body .gallery-split,
html body .homepage-gallery {
  background: transparent !important;
}

/* Item 7c: Three-column footer evenly spaced full width. */
html body .footer-main-grid--three {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 60px !important;
  align-items: start !important;
  padding: 0 !important;
}
@media screen and (max-width: 749px) {
  html body .footer-main-grid--three {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
  }
}

/* Item 4: Footer feature icons monochrome */
html body .footer-feature-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #1a1a1a !important;
}
html body .footer-feature-icon svg {
  color: #1a1a1a !important;
  stroke: #1a1a1a !important;
  fill: none !important;
}

/* Item 7b: Spread feature row evenly. */
html body .footer-features {
  display: flex !important;
  justify-content: space-around !important;
  gap: 40px !important;
  padding-top: 50px !important;
  padding-bottom: 30px !important;
}
html body .footer-feature-item {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  text-align: center !important;
}

/* Item 3: Top bar / header consistent serif font, smaller utility text */
html body .header-top-bar {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
}
html body .header-top-bar .social-top-link svg {
  width: 16px !important;
  height: 16px !important;
}

/* Item 3 (search): make the search dropdown clean centered overlay */
html body .predictive-search,
html body .predictive-search-results,
html body details[open] > .search-modal,
html body .search-modal {
  background: #ffffff !important;
  color: #1a1a1a !important;
  border: 1px solid #d6d3cc !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
  border-radius: 0 !important;
}
html body .predictive-search input,
html body .search-modal input {
  background: transparent !important;
  color: #1a1a1a !important;
}

/* Item 14a: smooth section spacing on the homepage. */
html body .shopify-section {
  background: transparent;
}
html body {
  background: #ffffff;
}


/* Collectors Page - Reduce font sizes */
.page-collectors h1,
.page-collectors .rte h1,
.template-page[data-template="page"] .rte h1 {
  font-size: 2.5rem !important;
  line-height: 1.2 !important;
}

.page-collectors h2,
.page-collectors .rte h2,
.template-page[data-template="page"] .rte h2 {
  font-size: 2rem !important;
  line-height: 1.3 !important;
}

.page-collectors .rte p,
.template-page[data-template="page"] .rte p {
  font-size: 1.6rem !important;
  line-height: 1.6 !important;
  max-width: 800px;
}

/* About Page - Constrain image width and reduce text size */
.page-about img,
.page-about .rte img,
.template-page[data-template="page"] .rte img {
  max-width: 800px !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 auto 2rem !important;
  display: block;
}

.page-about .rte,
.template-page[data-template="page"] .rte {
  max-width: 900px;
  margin: 0 auto;
  padding: 2rem;
}

.page-about .rte p,
.template-page[data-template="page"] .rte p {
  font-size: 1.6rem !important;
  line-height: 1.7 !important;
  margin-bottom: 1.5rem;
}

/* Contact Page - Fix layout */
.page-contact .rte,
.template-page[data-template="page"] .rte {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem;
}

.page-contact img,
.page-contact .rte img {
  max-width: 600px !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 auto 2rem !important;
  display: block;
}

/* Shipping Page - Improve readability */
.page-shipping .rte,
.template-page[data-template="page"] .rte {
  max-width: 900px;
  margin: 0 auto;
  padding: 2rem;
}

.page-shipping .rte p {
  font-size: 1.6rem !important;
  line-height: 1.7 !important;
}

/* FAQs Page - Improve styling */
.page-faqs .rte,
.template-page[data-template="page"] .rte {
  max-width: 900px;
  margin: 0 auto;
  padding: 2rem;
}

.page-faqs .rte h2 {
  font-size: 2rem !important;
  margin-top: 3rem;
  margin-bottom: 1rem;
}

.page-faqs .rte p {
  font-size: 1.6rem !important;
  line-height: 1.7 !important;
  margin-bottom: 1.5rem;
}

/* General page improvements */
.template-page .main-content {
  max-width: 1200px;
  margin: 0 auto;
}

.template-page .rte {
  font-size: 1.6rem;
  line-height: 1.7;
}

/* Fix commission button link */
.page-collectors a[href*="commission"],
.page-collectors .button {
  display: inline-block;
  padding: 1rem 2rem;
  background-color: var(--color-primary, #000);
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  margin-top: 1rem;
  transition: transform 0.3s ease, background-color 0.3s ease;
}

.page-collectors a[href*="commission"]:hover,
.page-collectors .button:hover {
  transform: scale(1.02);
  background-color: #333;
}

/* Standardized Image Ratios - Matching Benchmark (Phase 4) */
.card__image-container,
.product-card-gallery .card__image-container,
.collection-grid .card__image-container,
.featured-collection-section .card__image-container,
.related-products-grid .card__image-container {
  position: relative;
  width: 100%;
  aspect-ratio: 4/3;
  overflow: hidden;
}

.card__image-container img,
.product-card-gallery .card__image-container img,
.collection-grid .card__image-container img,
.featured-collection-section .card__image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Enhanced hover effects - scale instead of fade */
.card:hover .card__image,
.product-card-gallery:hover .card__image,
.collection-grid .card:hover .card__image {
  transform: scale(1.08);
}

/* Product detail page image ratios - original working version */
.product__media-wrapper .product__media-item {
  aspect-ratio: 4/3;
  overflow: hidden;
}

.product__media-wrapper .product__media-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Product gallery arrows */
.product-gallery-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(0, 0, 0, 0.1);
  cursor: pointer;
  padding: 12px;
  z-index: 10;
  color: #333;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease, background-color 0.3s ease, transform 0.2s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.product__media-gallery:hover .product-gallery-arrow {
  opacity: 1;
}

.product-gallery-arrow:hover {
  background: #fff;
  border-color: rgba(0, 0, 0, 0.2);
  transform: translateY(-50%) scale(1.1);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.product-gallery-prev {
  left: 20px;
}

.product-gallery-next {
  right: 20px;
}

@media screen and (max-width: 750px) {
  .product__media-gallery {
    max-height: 60vh;
  }
  
  .product__media-wrapper .product__media-item {
    max-height: 60vh;
  }
  
  .product__media-wrapper .product__media-item img {
    max-height: 60vh;
  }
  
  .product-gallery-arrow {
    width: 40px;
    height: 40px;
    padding: 8px;
  }
  
  .product-gallery-prev {
    left: 10px;
  }
  
  .product-gallery-next {
    right: 10px;
  }
}


/* Related products grid - standardized spacing */
.related-products-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 2.5rem;
  margin-top: 2rem;
}

.related-products-title {
  font-size: 1.8rem;
  text-align: center;
  margin-bottom: 3rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 400;
  color: #333;
}

/* Logo transparency support */
.logo-image {
  background: transparent;
  mix-blend-mode: multiply;
}

/* Ensure logo displays properly with transparent background */
.header-logo .logo-image {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Phase 4: Typography and Spacing Improvements - Matching Benchmark */
.card__heading {
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  line-height: 1.4;
  margin: 1rem 0 0.5rem;
  color: #333;
}

.card__price {
  font-size: 0.95rem;
  color: #666;
  letter-spacing: 0.02em;
}

/* Improved spacing for product cards */
.card-wrapper {
  margin-bottom: 2rem;
}

/* Collection grid spacing */
.collection-grid,
.featured-collection-section .grid {
  gap: 2.5rem;
  margin-top: 2rem;
}

@media screen and (min-width: 750px) {
  .collection-grid,
  .featured-collection-section .grid {
    gap: 3rem;
  }
}

/* Homepage section improvements */
.homepage-section {
  margin-bottom: 4rem;
}

/* Gallery section image ratios */
.gallery-image-col {
  aspect-ratio: 4/3;
  overflow: hidden;
}

.gallery-image-col img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.gallery-image-col:hover img {
  transform: scale(1.05);
}

/* Story columns image improvements */
.story-image-wrapper img {
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.story-block:hover .story-image-wrapper img {
  transform: scale(1.03);
}

/* Contact section image ratios */
.homepage-contact .contact-image-wrapper {
  aspect-ratio: 4/3;
  overflow: hidden;
}

.homepage-contact .contact-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.homepage-contact .contact-image-wrapper:hover img {
  transform: scale(1.05);
}

/* ===========================================================================
   Homepage Vertical Rhythm — match benchmark vonessendesign.se
   Consistent spacing between every homepage section, with smaller mobile values.
   =========================================================================== */
.shopify-section + .shopify-section {
  margin-top: 0;
}

[class*="shopify-section-template"] {
  padding-top: 70px;
  padding-bottom: 70px;
}

/* Hero is full-bleed — no extra top padding */
.shopify-section-template[id*="homepage-hero"],
.shopify-section.hero-section-wrapper {
  padding-top: 0;
  padding-bottom: 0;
}

/* Section headings: consistent margin below */
.shopify-section h2,
.shopify-section .section-title,
.shopify-section .featured-collection-title {
  margin-bottom: 36px;
}

/* Featured-collection grids: consistent inner gap */
.featured-collection-grid,
.collection-grid,
.product-grid {
  gap: 24px;
}

/* Buttons under sections — consistent margin-top */
.section-button,
.featured-collection-button,
.collection-link-button {
  margin-top: 36px;
}

@media (max-width: 768px) {
  [class*="shopify-section-template"] {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .shopify-section h2,
  .shopify-section .section-title,
  .shopify-section .featured-collection-title {
    margin-bottom: 24px;
  }
  .section-button,
  .featured-collection-button,
  .collection-link-button {
    margin-top: 24px;
  }
}

/* ===========================================================================
   ACTIVE NAV — keep ONLY the lower thicker line (the ::after pseudo-element).
   Suppress every other source of underline on the active nav link.
   =========================================================================== */
html body .nav-link,
html body .site-header .nav-link,
html body .header-nav .nav-link,
html body .nav-link:hover,
html body .nav-link--active,
html body .nav-link--active:hover,
html body .nav-link--active:focus,
html body .nav-link--active:visited {
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-style: none !important;
  text-decoration-color: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}
/* Restore the single, lower, thicker line via ::after on the active link only */
html body .nav-link.nav-link--active::after,
html body .site-header .nav-link.nav-link--active::after {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 0;
  height: 2px;
  background: #171717;
  transform: scaleX(1);
}
/* Make sure ::before isn't drawing an extra line */
html body .nav-link::before,
html body .nav-link--active::before {
  display: none !important;
  content: none !important;
}

/* ===========================================================================
   Hero "Collector Access" button — white background, centered in the gap below
   the olive grove painting, inside the hero image area.
   =========================================================================== */
.homepage-hero,
.shopify-section.hero-section-wrapper,
[class*="shopify-section-template"][id*="homepage-hero"] {
  position: relative;
}
.homepage-hero .hero-cta,
.homepage-hero a.collector-access,
.homepage-hero .hero-button,
.hero-section-wrapper .hero-cta,
.hero-section-wrapper a.collector-access,
.hero-section-wrapper .hero-button,
[class*="shopify-section-template"][id*="homepage-hero"] .hero-cta,
[class*="shopify-section-template"][id*="homepage-hero"] a.collector-access,
[class*="shopify-section-template"][id*="homepage-hero"] .hero-button {
  position: absolute !important;
  left: 50% !important;
  bottom: 5% !important;
  transform: translateX(-50%) !important;
  background: #ffffff !important;
  color: #1a1a1a !important;
  border: 1px solid #1a1a1a !important;
  padding: 14px 38px !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
  transition: background 0.2s ease, color 0.2s ease !important;
  z-index: 5 !important;
}
.homepage-hero .hero-cta:hover,
.homepage-hero a.collector-access:hover,
.hero-section-wrapper .hero-cta:hover,
.hero-section-wrapper a.collector-access:hover,
[class*="shopify-section-template"][id*="homepage-hero"] .hero-cta:hover,
[class*="shopify-section-template"][id*="homepage-hero"] a.collector-access:hover {
  background: #1a1a1a !important;
  color: #ffffff !important;
}

/* ===========================================================================
   Typography pass — header utility links / footer / testimonials match the
   benchmark's lighter, refined feel (small caps, increased tracking).
   =========================================================================== */
html body .site-header .header-action-link,
html body .site-header .header-search-text,
html body .site-header .nav-link {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #1a1a1a !important;
  font-weight: 400 !important;
}
html body .nav-dropdown-link {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 400 !important;
  color: #2b2b2b !important;
}
html body .site-footer .footer-heading,
html body .site-footer h3,
html body .site-footer h4 {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #1a1a1a !important;
  font-weight: 400 !important;
}
html body .site-footer p,
html body .site-footer a,
html body .site-footer .footer-links a {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.02em !important;
  color: #555 !important;
  text-transform: none !important;
}
html body .testimonial-list,
html body .testimonial-list .testimonial,
html body .testimonial-list .testimonial__blockquote,
html body .testimonial-list .testimonial__author {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  text-align: center !important;
}
html body .testimonial-list .testimonial__blockquote {
  font-style: italic !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
  color: #2b2b2b !important;
  max-width: 640px !important;
  margin: 0 auto 6px !important;
}
html body .testimonial-list .testimonial__author {
  font-size: 0.78rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #888 !important;
  font-style: normal !important;
  font-weight: 400 !important;
}
html body .testimonials-show-more-wrapper {
  text-align: center !important;
}
html body .testimonials-show-more {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

/* ===========================================================================
   "You May Also Like" heading — lighter, more refined.
   =========================================================================== */
html body .related-products-title,
html body .product__related-section .related-products-title {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 1.5rem !important;          /* Round 8: bumped from 0.95rem */
  font-weight: 400 !important;
  letter-spacing: 0.12em !important;     /* Round 8: slightly tighter */
  text-transform: none !important;       /* Round 8: drop uppercase per benchmark */
  color: #1a1a1a !important;             /* Round 8: darker */
  margin-bottom: 2.5rem !important;
  text-align: center !important;
}

/* ===========================================================================
   Header / Nav structural rules — ensure dropdowns are hidden by default
   and revealed on hover. These duplicate the rules in custom.css so the
   header still works correctly even if only custom-fixes.css loads.
   =========================================================================== */
html body .site-header .nav-menu {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  justify-content: center !important;
  gap: 4px !important;
}
html body .site-header .nav-item {
  position: static !important;
  list-style: none !important;
}
html body .site-header .nav-item--has-dropdown {
  position: static !important;
}
html body .site-header .header-nav {
  position: relative !important;
}
html body .site-header .nav-dropdown-panel {
  display: none !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 100% !important;
  background: #fff !important;
  border-top: 1px solid #eee !important;
  z-index: 200 !important;
  padding: 28px 0 32px !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.04) !important;
}
html body .site-header .nav-item--has-dropdown:hover .nav-dropdown-panel,
html body .site-header .nav-item--has-dropdown:focus-within .nav-dropdown-panel {
  display: block !important;
}
html body .site-header .nav-dropdown-inner {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 48px !important;
  justify-content: center !important;
  align-items: flex-start !important;
}
html body .site-header .nav-dropdown-column {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  list-style: none !important;
}
html body .site-header .nav-dropdown-link {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 400 !important;
  color: #2b2b2b !important;
  text-decoration: none !important;
}
html body .site-header .nav-dropdown-sublist {
  list-style: none !important;
  padding-left: 0 !important;
  margin: 6px 0 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
html body .site-header .nav-dropdown-sublink {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.06em !important;
  color: #6c6c6c !important;
  text-decoration: none !important;
}

/* ===========================================================================
   ROUND 6 ADD-ONS — items 3, 12, 14a/b, search popup
   =========================================================================== */

/* Item 12a — Force PT Serif site-wide. Headings keep their existing weights. */
html body, html body p, html body a, html body span, html body div,
html body input, html body textarea, html body button, html body select,
html body label,
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6 {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
}

/* Item 3 — Top bar refinement. Smaller utility text; bottom border under top bar; consistent casing. */
html body .header-top-bar {
  background: #1a1a1a !important;
  color: #ffffff !important;
  padding: 8px 0 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.08em !important;
}
html body .header-top-bar a,
html body .header-top-bar select {
  color: #ffffff !important;
  text-transform: none !important;
}
html body .header-top-bar .social-top-link svg {
  width: 14px !important;
  height: 14px !important;
}
html body .header-top-bar select {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
  color: #ffffff !important;
  padding: 2px 6px !important;
  font-size: 0.7rem !important;
  text-transform: none !important;
}

/* Search overlay — when search modal opens, render it as a clean centered drop-down,
   not the awkward blue box on the left. */
html body .search-modal,
html body details[id*="search"][open] > .search-modal,
html body .header__search,
html body .predictive-search,
html body .predictive-search-results {
  background: #ffffff !important;
  border: 1px solid #d6d3cc !important;
  border-radius: 0 !important;
  box-shadow: 0 12px 28px rgba(0,0,0,0.08) !important;
  padding: 18px !important;
  color: #1a1a1a !important;
  max-width: 720px !important;
  margin: 0 auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  position: fixed !important;
  top: 90px !important;
  width: calc(100% - 32px) !important;
  z-index: 9999 !important;
}
html body .search-modal input,
html body .header__search input,
html body .predictive-search input {
  font-family: 'PT Serif', Georgia, serif !important;
  font-size: 1rem !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #d6d3cc !important;
  padding: 10px 0 !important;
  width: 100% !important;
  outline: none !important;
}

/* Item 14a — homepage section-to-section consistent spacing */
html body .shopify-section + .shopify-section {
  margin-top: 0;
}
html body [class*="featured-collection"],
html body [class*="scroll-collection"],
html body [class*="story-grid"] {
  padding-top: 70px;
  padding-bottom: 70px;
}

/* Item 14b — extra breathing room between hero and Originals section */
html body .hero-section-wrapper + .shopify-section,
html body .shopify-section[id*="homepage-hero"] + .shopify-section {
  margin-top: 24px !important;
}

/* Title/price spacing on cards — tighten gap */
html body .card-info,
html body .card__info {
  text-align: center !important;
}
html body .card-info > * + *,
html body .card__info > * + * {
  margin-top: 0.15rem !important;
}

/* Item 7d — homepage gallery section blends with rest of homepage */
html body .gallery-split,
html body .homepage-gallery,
html body .shopify-section[id*="homepage_gallery"] {
  background: transparent !important;
}

/* Item 11d — page content uses PT Serif consistently (layered above main-page rule) */
html body .page-content,
html body .page-content p,
html body .page-content h1,
html body .page-content h2,
html body .page-content h3,
html body .page-title,
html body .jp-page-section,
html body .jp-page-section * {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
}

/* Item 11b — Shipping page section headings bold + centered */
html body .template-page .page-content h2 {
  text-align: center !important;
  font-weight: 700 !important;
  font-size: 1.25rem !important;
  letter-spacing: 0.04em !important;
  margin-top: 2.5rem !important;
  margin-bottom: 1rem !important;
}

/* Item 14c/d — homepage section title styling for the new "Originals/Prints" labels.
   Title is the painting series, with View All directly below. */
html body .featured-collection-section .section-title,
html body #scroll-{{section.id}} .section-title {
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 2.1rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  color: #1a1a1a !important;
  margin: 0 0 0.4rem 0 !important;
}

/* Worldwide-shipping/gift-cards/customer-service feature row centered + spread */
html body .footer-features {
  display: flex !important;
  justify-content: space-around !important;
  gap: 20px !important;
  text-align: center !important;
}
html body .footer-feature-item {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 0 10px !important;
}
html body .footer-feature-icon {
  color: #1a1a1a !important;
  width: 34px !important;
  height: 34px !important;
}
html body .footer-feature-text {
  font-size: 0.75rem !important;
  letter-spacing: 0.18em !important;
  color: #1a1a1a !important;
  text-transform: uppercase !important;
}

/* ===========================================================================
   ROUND 7 — Juliane's new list (items 3, 7, 9, 14)
   =========================================================================== */

/* Item 7: Single consistent background across the bottom homepage sections.
   The story-grid section uses .sg3-wrap with a cream bg; force unified white. */
html body .shopify-section,
html body .gallery-split,
html body .homepage-gallery,
html body .story-grid-v3,
html body .story-section-wrapper,
html body .sg3-wrap,
html body .homepage-story-columns,
html body .homepage-three-columns {
  background-color: #ffffff !important;
  background: #ffffff !important;
}

/* Item 7: Story-grid (Exhibitions/About/Process) evenly spread full-width, not grouped center.
   The Symmetry "story-grid-v3" template uses .sg3-wrap → .sg3-grid → .sg3-col. */
html body .sg3-wrap {
  padding: 60px 24px 60px !important;
  min-height: 0 !important;
  display: block !important;
  background-color: #ffffff !important;
}
html body .sg3-grid {
  max-width: 1500px !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 80px !important;
  align-items: start !important;
}
@media screen and (max-width: 749px) {
  html body .sg3-grid {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
  }
  html body .sg3-wrap { padding: 40px 16px !important; }
}
html body .sg3-col {
  width: 100%;
  max-width: 100%;
}
html body .sg3-img {
  width: 100% !important;
}

/* ===========================================================================
   ROUND 8 item 14 + homepage spacing — uniform vertical breathing room.
   Juliane: gap hero→Originals = Originals→Prints = Prints→story-grid = …
   Pick a single section gap and apply consistent top+bottom padding to every
   homepage section. Hero stays at 0 because it's full-bleed.
   =========================================================================== */
:root { --jp-section-gap: 30px; } /* Round 9: tightened from 48px — Originals→Prints felt too open */
html body main > .shopify-section,
html body #MainContent > .shopify-section {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* Force every direct inner wrapper inside a homepage shopify-section to use the
   same top + bottom padding. Covers Originals, Prints, story-grid, gallery, testimonials. */
html body main > .shopify-section > section,
html body main > .shopify-section > div,
html body #MainContent > .shopify-section > section,
html body #MainContent > .shopify-section > div {
  padding-top: var(--jp-section-gap) !important;
  padding-bottom: var(--jp-section-gap) !important;
}
/* Also normalize known classed inner wrappers */
html body .featured-collection-section,
html body .scroll-collection-section,
html body .scroll-collection-wrapper,
html body .featured-collection-wrapper,
html body .gallery-section-wrapper,
html body .homepage-testimonials,
html body .sg3-wrap {
  padding-top: var(--jp-section-gap) !important;
  padding-bottom: var(--jp-section-gap) !important;
}
/* Round 9 — the per-collection-page "N works" count (.collection-count) was
   #bbb / 12px — nearly invisible. Nudge darker but keep it subtle/secondary. */
html body .collection-count,
html body .collection-header .collection-count,
html body .collection-meta .collection-count {
  color: #8a8a8a !important;
  opacity: 1 !important;
}

/* Round 9 — kill extra whitespace that sat between the Originals card grid and
   the Prints heading (grid bottom margin + title-row top margin). */
html body .featured-collection-section .grid,
html body .featured-collection-section .featured-collection-grid,
html body .featured-collection-section .collection-grid {
  margin-bottom: 0 !important;
}
html body .scroll-collection-section .scroll-header,
html body .scroll-collection-wrapper .scroll-header,
html body .shopify-section > section .scroll-title-row {
  margin-top: 0 !important;
}
/* The Originals card grid carries ~32px of its own slack below the last card
   (gallery dots / card padding). Pull the Prints section up by that much so
   the Originals→Prints gap matches the ~60px used elsewhere on the page. */
html body main > .shopify-section.scroll-collection-wrapper,
html body #MainContent > .shopify-section.scroll-collection-wrapper {
  margin-top: -32px !important;
}

/* Round 8 — "N works" labels were almost invisible. Darken + slightly larger. */
html body .product-block.collection-block .product-block__detail .small,
html body .collection-block .small,
html body .product-block .product-count {
  color: #1a1a1a !important;
  opacity: 0.85 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.08em !important;
  margin-top: 4px !important;
}

/* Round 8 — "You May Also Like" heading: slightly larger and darker.
   Was 15.2px in rgb(108,108,108) light gray — too quiet. */
html body .related-products-title,
html body .related-products .related-products-title,
html body .ymal-title,
html body h2.related-products-title {
  font-size: 1.5rem !important;       /* ~24px */
  letter-spacing: 0.12em !important;
  color: #1a1a1a !important;
  font-weight: 400 !important;
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  text-align: center !important;
  margin: 0 0 28px !important;
}

/* Round 8 — Sold label font-size must match price.
   Card badge .sold-out-text was 11.56px while .card__price is 13.6px.
   Match the price size on cards + product page. */
html body .sold-out-text,
html body .card .sold-out-text,
html body .product-card .sold-out-text,
html body .card-wrapper .sold-out-text {
  font-size: 0.85rem !important; /* matches .card__price */
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  /* Round 9 — remove the 6px indent so "Sold" aligns flush with the price/title. */
  margin-left: 0 !important;
  padding-left: 0 !important;
}
html body .product-info .sold-out-text,
html body .product-form .sold-out-text,
html body .product-price .sold-out-text {
  font-size: 1.125rem !important; /* matches .product-price 18px */
  /* Round 9 — same red as the category/collection page sold label (#c0392b). */
  color: #c0392b !important;
}

/* Hero remains edge-to-edge — no top/bottom padding. */
html body main > .shopify-section.hero-section-wrapper,
html body #MainContent > .shopify-section.hero-section-wrapper {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
html body main > .shopify-section.hero-section-wrapper .hero-section {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Item 9: Contact page heading centered + hide duplicate default Symmetry contact form.
   Body has class `gradient`, not template-page-contact, so target via :has(.page-contact-form)
   which is unique to the page.body custom form. */
html body:has(.page-contact-form) .majortitle,
html body:has(.page-contact-form) .page-title,
html body:has(.page-contact-form) .page-header,
html body:has(.page-contact-form) .breadcrumbs {
  text-align: center !important;
}
html body:has(.page-contact-form) .majortitle {
  display: block !important;
  width: 100% !important;
  margin-left: auto !important;
  /* R11.5 — match SHIPPING / EXHIBITIONS / ABOUT / PROCESS all-caps treatment */
  text-transform: uppercase !important;
  /* R12.2 — Contact uses h1.majortitle (32px) while the other four More Info
     pages use h1.page-title (28px). Force Contact to the exact same size +
     letter-spacing so all five leading titles are identical. */
  font-size: 28px !important;
  letter-spacing: 4.2px !important;
}
/* R11.6 — tighten the gap between the page title and the first content item on
   Shipping + Exhibitions pages only (marker .jp-tight-h1 added to body_html). */
html body:has(.jp-tight-h1) .majortitle,
html body:has(.jp-tight-h1) .page-title,
html body:has(.jp-tight-h1) .page-header h1 {
  margin-bottom: 12px !important;
  padding-bottom: 0 !important;
}
html body:has(.jp-tight-h1) .jp-page-section {
  padding-top: 1.25rem !important;
}
html body:has(.jp-tight-h1) .jp-page-section h2:first-of-type,
html body:has(.jp-tight-h1) .jp-page-section :first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
  margin-right: auto !important;
}
html body:has(.page-contact-form) .jp-page-section {
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 1rem 1.5rem 4rem !important;
}
/* Hide the duplicate default contact form (rendered after page.content by main-contact section) */
html body:has(.page-contact-form) .account-form,
html body:has(.page-contact-form) form#contact_form,
html body:has(.page-contact-form) .lightish-spaced-row:has(> h2),
html body:has(.page-contact-form) .flexible-layout--form {
  display: none !important;
}

/* Item 3: Localization selectors must be visibly clickable in the dark top bar */
html body .header-top-bar .localization-selector {
  cursor: pointer !important;
  padding: 4px 10px !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
html body .header-top-bar .localization-selector.is-disabled {
  cursor: default !important;
  opacity: 0.7 !important;
}
html body .header-top-bar .localization-select {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  cursor: pointer !important;
  z-index: 5 !important;
  font-family: inherit !important;
  /* R9 fix: the closed control is an invisible overlay (the white label is the
     .localization-display span), but the NATIVE popup inherits this color. Keep
     it dark so the option list is readable on its white popup background. */
  color: #1a1a1a !important;
}
/* R9 fix: force dropdown option list to dark-on-white — was white-on-white,
   only visible on hover. Applies to the native <option> popup. */
html body .header-top-bar .localization-select option,
html body .localization-select option {
  color: #1a1a1a !important;
  background-color: #ffffff !important;
}
html body .header-top-bar .localization-display {
  pointer-events: none !important;
  color: #ffffff !important;
  font-family: 'PT Serif', Georgia, serif !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}
html body .header-top-bar .localization-caret {
  color: #ffffff !important;
  pointer-events: none !important;
  font-size: 0.7rem !important;
  margin-left: 2px !important;
}
html body .header-top-bar .localization-selector:hover .localization-caret {
  transform: translateY(2px);
}

/* R15.3 Testimonials site-wide */
/* R15.3 Testimonials site-wide — heading bigger+darker than quotes, tighter stack */
.testimonials-section .testimonials-heading,
.product-testimonials .testimonials-title,
.testimonial-list .subheading,
.testimonial-list .testimonial-list-heading {
  font-size: 0.8125rem !important;
  color: #7a7a7a !important;
  font-weight: 400 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  margin-top: 1.5rem !important;
  margin-bottom: 4rem !important;
  font-family: "Cardo", serif !important;
}
.testimonials-section .testimonials-stack { gap: 1.25rem !important; }
.product-testimonials .testimonials-track > * + * { margin-top: 1.25rem !important; }
.testimonial-list .testimonial + .testimonial { margin-top: 1.25rem !important; }
/* keep the little divider dashes intact — no changes to .testimonials-divider */