/* Minimal top-section and Our Story corrections */
.announcement-bar {
  padding: 8px 0;
}

.announcement-inner {
  font-size: 10px;
  text-align: center;
}

.nav-links {
  display: flex;
  gap: 34px;
}

.nav-links a {
  margin-left: 0;
}

.brand-story {
  margin-top: 0;
}

.brand-story-inner {
  margin: 0 auto;
  padding: 0 20px;
}

/* Remove ALL outer spacing from ALL Story containers */
.section-story,
.section-story-container,
.section-story-wrapper,
.shopify-section,
.section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Force Story block to shrink to exact text height */
.section-story {
    max-width: 320px !important;
    margin-left: auto !important;
    margin-right: auto !important;

    padding: 6px 12px !important;
    border-radius: 6px !important;

    /* NEW background color (lighter, theme-consistent) */
    background-color: #fffdf8 !important;

    text-align: center !important;
}

/* Remove ALL extra spacing inside text */
.section-story p {
    font-size: 14px !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    color: #3f3f3f !important;
}

/* Compact heading */
.section-story h2,
.section-story .section-title {
    font-size: 18px !important;
    font-weight: 600 !important;
    margin-top: 0 !important;
    margin-bottom: 4px !important;
    color: #2c2c2c !important;
}

/* New compact Story section at bottom */
.story-relocated {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    text-align: center !important;
}

/* Remove spacing inside text */
.story-relocated p {
    font-size: 15px !important;
    line-height: 1.45 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #3f3f3f !important;
}

/* Compact heading */
.story-relocated h2 {
    font-size: 20px !important;
    font-weight: 600 !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    color: #2c2c2c !important;
}

/* Full-width rectangle container */
.story-fullwidth {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #f3e9dd !important;
}

/* Story content fills the rectangle */
.story-relocated {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 40px 20px !important;
    background: none !important;
    text-align: center !important;
}

/* Heading */
.story-relocated h2 {
    font-size: 22px !important;
    font-weight: 600 !important;
    margin: 0 0 12px 0 !important;
    color: #2c2c2c !important;
}

/* Paragraph */
.story-relocated p {
    font-size: 15px !important;
    line-height: 1.45 !important;
    margin: 0 !important;
    color: #3f3f3f !important;
}

/* Remove ALL borders, divider lines, and background strips */
.story-fullwidth,
.shopify-section,
.section,
.section-story,
.section-story-wrapper,
.section-story-container {
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* Remove ALL padding/margins that create visual lines */
.story-fullwidth,
.shopify-section,
.section,
.section-story,
.section-story-wrapper,
.section-story-container {
    padding: 0 !important;
    margin: 0 !important;
}

/* Ensure the beige rectangle is clean and uniform */
.story-fullwidth {
    width: 100% !important;
    background-color: #f3e9dd !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 180px !important;
}

/* Story content fills the rectangle */
.story-relocated {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    text-align: center !important;
}

/* Heading */
.story-relocated h2 {
    font-size: 22px !important;
    font-weight: 600 !important;
    margin: 0 0 10px 0 !important;
    color: #2c2c2c !important;
}

/* Paragraph */
.story-relocated p {
    font-size: 15px !important;
    line-height: 1.45 !important;
    margin: 0 !important;
    color: #3f3f3f !important;
}

/* Remove bottom border/divider from FAQ section */
.faq,
.faq-section,
.faq-wrapper,
.faq-container,
.faq-item,
.faq-list {
    border-bottom: none !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* Remove bottom padding/margin that creates a visual line */
.faq,
.faq-section,
.faq-wrapper,
.faq-container,
.faq-list {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* Ensure FAQ items do not create a divider line */
.faq-item {
    border: none !important;
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Keep Story rectangle clean and attached */
.story-fullwidth {
    background-color: #f3e9dd !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 180px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Fix modal image container */
.product-modal-image {
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    background: none !important;
    border: none !important;
}

/* Fix modal image sizing */
.modal-img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
    border: none !important;
    box-shadow: none !important;
}

/* Remove unwanted borders/lines around modal */
.product-modal,
.product-modal-content,
.product-modal-wrapper,
.product-modal-image,
.product-modal-details {
    border: none !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* Remove padding that creates visual lines */
.product-modal,
.product-modal-content,
.product-modal-wrapper {
    padding: 0 !important;
    margin: 0 !important;
}

/* Ensure modal layout stays clean */
.product-modal-content {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

/* Target the REAL Shopify modal image container */
.ProductItemModal__Image,
.ProductItemModal__ImageWrapper,
.ProductItemModal__Media,
.ProductItemModal__MediaWrapper {
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Target the REAL modal image element */
.ProductItemModal__Image img,
.ProductItemModal__Media img,
.ProductItemModal__ImageWrapper img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
    border: none !important;
    box-shadow: none !important;
}

/* Remove unwanted borders/lines around modal */
.ProductItemModal,
.ProductItemModal__Content,
.ProductItemModal__Wrapper,
.ProductItemModal__Image,
.ProductItemModal__Media {
    border: none !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* Remove padding that creates visual lines */
.ProductItemModal,
.ProductItemModal__Content,
.ProductItemModal__Wrapper {
    padding: 0 !important;
    margin: 0 !important;
}

/* Ensure modal layout stays clean */
.ProductItemModal__Content {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

/* FINAL FIX — hidden Shopify modal image classes */
.ProductItemModal__Media--image,
.ProductItemModal__MediaContainer {
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Ensure the actual modal image is never cropped */
.ProductItemModal__Media--image img,
.ProductItemModal__MediaContainer img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
    border: none !important;
    box-shadow: none !important;
}

/* Remove ALL borders/lines from modal wrapper */
.ProductItemModal,
.ProductItemModal__Content,
.ProductItemModal__Wrapper {
    border: none !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* Remove padding that creates visual lines */
.ProductItemModal,
.ProductItemModal__Content,
.ProductItemModal__Wrapper {
    padding: 0 !important;
    margin: 0 !important;
}

/* Clean modal layout */
.ProductItemModal__Content {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

/* FINAL FIX — override the last Shopify modal image container */
.ProductItemModal__MediaItem {
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;       /* stop cropping */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Ensure the image inside MediaItem is never cropped */
.ProductItemModal__MediaItem img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;      /* full bottle visible */
    display: block !important;
    margin: 0 auto !important;
    border: none !important;
    box-shadow: none !important;
}