/* Global base styles */
html { scroll-behavior: smooth; }
body { background: var(--color-white); color: var(--color-ink); font-family: var(--font-body); line-height: 1.65; }
h1, h2, h3 { color: var(--color-ink); font-family: var(--font-heading); font-weight: 700; line-height: 1.12; }
h1 { font-size: clamp(2.8rem, 6vw, 5.25rem); letter-spacing: -.04em; }
h2 { font-size: clamp(2.2rem, 4vw, 3.5rem); letter-spacing: -.03em; }
h3 { font-size: 1.45rem; }
a { color: inherit; }
.skip-link { background: var(--color-ink); color: #fff; left: 1rem; padding: .7rem 1rem; position: fixed; top: -4rem; z-index: 10000; }
.skip-link:focus { top: 1rem; }
.section-padding { padding: 6.5rem 0; }
.section-soft { background: var(--color-surface); }
.eyebrow { color: var(--color-primary); font-size: .78rem; font-weight: 700; letter-spacing: .16em; margin-bottom: .85rem; text-transform: uppercase; }
.eyebrow--light { color: #f7c7d9; }
.lead-text { color: var(--color-muted); font-size: 1.18rem; }
.text-link { color: var(--color-primary-dark); font-weight: 700; text-decoration: none; }
.text-link:hover { color: var(--color-primary); }
.text-link span { display: inline-block; transition: transform .2s ease; }
.text-link:hover span { transform: translateX(4px); }
.btn { border-radius: .5rem; font-weight: 700; padding: .75rem 1.25rem; }
.btn-primary { background: var(--color-primary); border-color: var(--color-primary); }
.btn-primary:hover, .btn-primary:focus { background: var(--color-primary-dark); border-color: var(--color-primary-dark); }
.btn-outline-primary { border-color: var(--color-primary); color: var(--color-primary-dark); }
.btn-outline-primary:hover, .btn-outline-primary:focus { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.button-row, .hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; }

/* Header and navigation */
.site-header { background: rgba(255,255,255,.96); border-bottom: 1px solid transparent; position: sticky; top: 0; transition: box-shadow .2s ease, border-color .2s ease; z-index: 1020; }
.site-header.is-scrolled { border-color: var(--color-line); box-shadow: 0 4px 20px rgba(25, 15, 20, .05); }
.navbar { min-height: 80px; }
.navbar-brand, .footer-brand { align-items: center; display: inline-flex; font-family: var(--font-heading); font-size: 1.1rem; font-weight: 700; gap: .6rem; line-height: 1; text-decoration: none; }
.brand-logo { height: 3.15rem; object-fit: contain; width: 2.85rem; }.brand-name { display: flex; flex-direction: column; letter-spacing: -.03em; white-space: nowrap; }.brand-name span { color: var(--color-ink); }.footer-brand span { color: var(--color-ink); }.brand-name em, .footer-brand em { color: var(--color-salt-pink); font-family: var(--font-body); font-size: .67em; font-style: normal; font-weight: 700; letter-spacing: .02em; margin-top: .18rem; }
.nav-link { color: var(--color-ink); font-size: .95rem; font-weight: 600; padding: .5rem .8rem !important; }
.nav-link:hover, .nav-link.active { color: var(--color-primary) !important; }
.navbar-toggler { border-color: var(--color-line); }
.navbar-toggler:focus { box-shadow: 0 0 0 .2rem rgba(166, 67, 104, .2); }

/* Hero */
.hero-section { background: linear-gradient(135deg, #fff 0%, #fff5f8 100%); overflow: hidden; padding: 7.5rem 0 6.5rem; position: relative; }
.hero-section--video { background: #2a2026; color: #fff; isolation: isolate; }.hero-section--video h1 { color: #fff; }.hero-section--video h1 span { color: #e5a0b3; }.hero-section--video .hero-copy, .hero-section--video .hero-points { color: #f5e7ec; }.hero-section--video .eyebrow { color: #e6afbf; }.hero-section--video .btn-outline-dark { border-color: #fff; color: #fff; }.hero-section--video .btn-outline-dark:hover { background: #fff; color: var(--color-ink); }.hero-video, .hero-video-overlay { height: 100%; inset: 0; position: absolute; width: 100%; }.hero-video { object-fit: cover; z-index: -2; }.hero-video-overlay { background: linear-gradient(90deg, rgba(42, 32, 38, .91) 0%, rgba(42, 32, 38, .66) 53%, rgba(42, 32, 38, .4) 100%); z-index: -1; }.hero-video-note { align-items: center; display: flex; justify-content: center; min-height: 250px; text-align: center; }.hero-video-note p { border: 1px solid rgba(255,255,255,.45); border-radius: 50%; color: rgba(255,255,255,.9); font-family: var(--font-heading); font-size: 1.4rem; padding: 3rem 1.5rem; }.hero-video-note small { font-family: var(--font-body); font-size: .75rem; }
.hero-section h1 span { color: var(--color-primary); }
.hero-copy { color: var(--color-muted); font-size: 1.18rem; margin: 1.5rem 0 2rem; max-width: 39rem; }
.hero-points { color: var(--color-muted); font-size: .87rem; margin-top: 2.3rem; }
.hero-points li::before { color: var(--color-primary); content: "✓"; font-weight: 700; margin-right: .4rem; }

/* Shared interior-page hero */
.page-hero { background: linear-gradient(135deg, #2d242a, #49323d); color: #fff; padding: 7rem 0 5.5rem; position: relative; }.page-hero h1 { color: #fff; max-width: 50rem; }.page-hero p:not(.eyebrow) { color: #f0e6e9; font-size: 1.15rem; max-width: 44rem; }.page-hero .eyebrow { color: #e8b7c5; }.page-hero--products { background: linear-gradient(135deg, #413038, #6c4453); }.page-hero--gallery { background: linear-gradient(135deg, #302a2d, #5c4b47); }.page-hero--certifications { background: linear-gradient(135deg, #2e2932, #4e4857); }.page-hero--contact { background: linear-gradient(135deg, #452d38, #7a475b); }
.media-placeholder { align-items: center; background: linear-gradient(135deg, #e9d8de, #bb8192); border-radius: var(--radius-card); color: #fff; display: flex; font-family: var(--font-heading); font-size: 1.4rem; justify-content: center; min-height: 360px; position: relative; }.media-placeholder::after { content: ""; }

/* About page */
.content-card { background: #fff; border: 1px solid var(--color-line); border-radius: var(--radius-card); height: 100%; padding: 2rem; }.content-card > span { color: var(--color-primary); display: block; font-size: .8rem; font-weight: 700; letter-spacing: .12em; margin-bottom: 2rem; }.content-card p { color: var(--color-muted); margin-bottom: 0; }.market-list { display: flex; flex-wrap: wrap; gap: .7rem; }.market-list span { border: 1px solid var(--color-line); border-radius: 999px; color: var(--color-primary-dark); font-weight: 600; padding: .6rem 1rem; }

/* Product detail page */
.product-jump-links { display: flex; flex-wrap: wrap; gap: .65rem; }.product-jump-links a { border: 1px solid var(--color-line); border-radius: 999px; color: var(--color-primary-dark); font-size: .9rem; font-weight: 700; padding: .55rem .9rem; text-decoration: none; }.product-jump-links a:hover { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }.products-detail-section { padding-bottom: 6.5rem; }.product-detail { align-items: center; display: grid; gap: 5rem; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: 5rem 0; scroll-margin-top: 6rem; }.product-detail + .product-detail { border-top: 1px solid var(--color-line); }.product-detail--reverse .product-detail__image { grid-column: 2; grid-row: 1; }.product-detail--reverse .product-detail__content { grid-column: 1; grid-row: 1; }.product-detail__image { background: linear-gradient(135deg, #ead5dc, #bb788c); border-radius: var(--radius-card); min-height: 380px; overflow: hidden; }.product-detail__image.is-empty::before { color: #fff; content: "Product image to be added"; display: block; font-size: .75rem; letter-spacing: .08em; padding-top: 10rem; text-align: center; text-transform: uppercase; }.product-detail__image img { display: block; height: 100%; min-height: 380px; object-fit: cover; width: 100%; }.check-list { list-style: none; margin: 1.3rem 0 2rem; padding: 0; }.check-list li { border-bottom: 1px solid var(--color-line); padding: .6rem 0; }.check-list li::before { color: var(--color-primary); content: "✓"; font-weight: 700; margin-right: .6rem; }

/* Gallery and certificates */
.gallery-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(3, 1fr); }.gallery-item { background: linear-gradient(135deg, #e8d9dd, #bd8796); border-radius: var(--radius-card); margin: 0; min-height: 260px; overflow: hidden; position: relative; }.gallery-item img { display: block; height: 100%; min-height: 260px; object-fit: cover; width: 100%; }.gallery-item.is-empty::before { color: #fff; content: "Gallery image to be added"; font-size: .72rem; left: 0; letter-spacing: .08em; position: absolute; right: 0; text-align: center; text-transform: uppercase; top: 44%; }.gallery-item figcaption { background: linear-gradient(transparent, rgba(36, 30, 33, .8)); bottom: 0; color: #fff; font-family: var(--font-heading); font-size: 1.25rem; left: 0; padding: 3rem 1.25rem 1.1rem; position: absolute; right: 0; }.gallery-item figcaption span { display: block; font-family: var(--font-body); font-size: .68rem; letter-spacing: .08em; margin-top: .2rem; text-transform: uppercase; }.gallery-note { color: var(--color-muted); margin-top: 1.5rem; }.gallery-note code { color: var(--color-primary-dark); }.document-card { background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius-card); height: 100%; padding: 2rem; }.document-card span { border: 1px solid var(--color-primary); border-radius: .35rem; color: var(--color-primary); display: inline-block; font-size: .7rem; font-weight: 700; letter-spacing: .1em; margin-bottom: 2.2rem; padding: .35rem .5rem; }.document-card p { color: var(--color-muted); margin-bottom: 0; }

/* Contact page */
.contact-methods { display: grid; gap: 1rem; margin: 2rem 0; }.contact-methods a, .contact-address { border-bottom: 1px solid var(--color-line); color: var(--color-ink); font-weight: 700; padding: .75rem 0; text-decoration: none; overflow-wrap: anywhere; }.contact-methods a:hover { color: var(--color-primary); }.contact-methods span, .contact-address span { color: var(--color-primary); display: block; font-size: .72rem; letter-spacing: .1em; margin-bottom: .15rem; text-transform: uppercase; }.contact-socials { display: flex; flex-wrap: wrap; gap: 1rem; }.contact-socials a { color: var(--color-primary-dark); font-size: .82rem; font-weight: 700; text-decoration: none; }.enquiry-form { background: var(--color-surface); border: 1px solid var(--color-line); border-radius: var(--radius-card); padding: 2rem; }.form-note { color: var(--color-muted); font-size: .88rem; }.enquiry-form label { display: block; font-size: .87rem; font-weight: 700; margin-bottom: .4rem; }.enquiry-form input, .enquiry-form textarea { background: #fff; border: 1px solid var(--color-line); border-radius: .45rem; color: var(--color-ink); font: inherit; padding: .75rem .85rem; width: 100%; }.enquiry-form input:focus, .enquiry-form textarea:focus { border-color: var(--color-primary); box-shadow: 0 0 0 .2rem rgba(155,63,92,.12); outline: 0; }

/* Product and feature cards */
.section-heading { margin-bottom: 1.7rem; }.section-heading h2, .section-intro h2 { margin-bottom: 0; }.section-intro { max-width: 46rem; }
.product-slider { display: flex; gap: 1.5rem; overflow-x: auto; padding: .2rem .2rem 1.1rem; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-color: var(--color-primary) transparent; }.product-slider-controls { display: flex; gap: .6rem; justify-content: flex-end; margin-top: -2.1rem; }.slider-button { background: var(--color-white); border: 1px solid var(--color-line); border-radius: 50%; color: var(--color-primary-dark); font-size: 1.1rem; height: 2.4rem; transition: .2s ease; width: 2.4rem; }.slider-button:hover { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.product-card { background: var(--color-white); border: 1px solid var(--color-line); border-radius: var(--radius-card); flex: 0 0 calc((100% - 3rem) / 3); overflow: hidden; scroll-snap-align: start; transition: box-shadow .25s ease, transform .25s ease; }
.product-card:hover { box-shadow: var(--shadow-card); transform: translateY(-5px); }.product-card__image { height: 230px; position: relative; }
.product-card__image::after { content: ""; }
.product-card__image--edible { background: #bd6783 url("../images/products/edible-pink-salt.webp") center/cover no-repeat; }.product-card__image--wellness { background: #c77b81 url("../images/products/culinary-wellness-salt.webp") center/cover no-repeat; }.product-card__image--animal { background: #9c7c5e url("../images/products/animal-lick-salt.webp") center/cover no-repeat; }.product-card__image--lamps { background: #b95756 url("../images/products/salt-lamps-decor.webp") center/cover no-repeat; }.product-card__image--industrial { background: #866e66 url("../images/products/industrial-salt.webp") center/cover no-repeat; }
.product-card__body { padding: 1.7rem; }.product-card__body h3 { margin-bottom: .6rem; }.product-card__body p { color: var(--color-muted); }
.feature-card { border-left: 1px solid var(--color-line); height: 100%; padding: .5rem 1.2rem 1rem; }.feature-number { color: var(--color-primary); display: block; font-size: .8rem; font-weight: 700; letter-spacing: .12em; margin-bottom: 2.3rem; }.feature-card p { color: var(--color-muted); margin-bottom: 0; }
.review-card { background: var(--color-white); border: 1px solid var(--color-line); border-radius: var(--radius-card); height: 100%; margin: 0; padding: 2rem; }.review-card blockquote { color: var(--color-ink); font-family: var(--font-heading); font-size: 1.28rem; line-height: 1.38; margin-bottom: 2rem; }.review-card figcaption { color: var(--color-primary-dark); font-size: .82rem; font-weight: 700; }.review-card figcaption span { color: var(--color-muted); display: block; font-weight: 400; margin-top: .18rem; }

/* Contact band and footer */
.cta-section { background: var(--color-primary-dark); color: #fff; padding: 6rem 0; }.cta-section h2 { color: #fff; margin-inline: auto; max-width: 50rem; }.cta-section p:not(.eyebrow) { color: #f5dbe5; font-size: 1.1rem; margin: 1rem auto 2rem; max-width: 38rem; }.cta-section .btn-light { color: var(--color-primary-dark); }
.site-footer { background: #282126; color: #ded3d7; padding: 4rem 0 1.5rem; }.footer-brand { color: #fff; }.footer-brand span { color: #fff; }.footer-copy { margin-top: 1rem; max-width: 27rem; }.footer-title { color: #fff; font-family: var(--font-body); font-size: .85rem; letter-spacing: .12em; text-transform: uppercase; }.footer-links li { margin-bottom: .5rem; }.footer-links a { color: #ded3d7; text-decoration: none; }.footer-links a:hover { color: #fff; }.footer-email { display: inline-flex; flex-wrap: wrap; gap: 0; }.social-links { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.1rem; }.social-links a { color: #fff; font-size: .8rem; font-weight: 700; text-decoration: none; }.social-links a:hover { color: #e6afbf; }.footer-bottom { border-top: 1px solid rgba(255,255,255,.13); margin-top: 2rem; padding-top: 1.5rem; }

/* Individual product range pages */
.range-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.range-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.range-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.range-card, .packaging-card { background: #fff; border: 1px solid var(--color-line); border-radius: var(--radius-card); overflow: hidden; }
.range-card__image, .packaging-card__image { align-items: flex-end; background: linear-gradient(135deg, #eed8df, #b96d83); border: 0; color: #fff; display: flex; min-height: 270px; overflow: hidden; padding: 1rem; position: relative; text-align: left; width: 100%; }
.range-card__image img, .packaging-card__image img { height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; }
.range-card__image::after, .packaging-card__image::after { background: linear-gradient(transparent, rgba(39,35,41,.72)); content: ""; inset: 0; position: absolute; }
.range-card__image.is-empty::before, .packaging-card__image.is-empty::before { color: rgba(255,255,255,.88); content: "Image to be added"; font-size: .72rem; left: 1rem; letter-spacing: .08em; position: absolute; text-transform: uppercase; top: 1rem; z-index: 1; }
.range-card__image span, .packaging-card__image span { font-size: .76rem; font-weight: 700; letter-spacing: .08em; position: relative; text-transform: uppercase; z-index: 1; }
.range-card__image--large { min-height: 340px; }
.range-card__body, .packaging-card__body { padding: 1.5rem; }
.range-card__body p, .packaging-card__body p { color: var(--color-muted); margin-bottom: 0; }
.spec-list { border-top: 1px solid var(--color-line); margin: 1rem 0; }
.spec-list div { border-bottom: 1px solid var(--color-line); display: grid; gap: 1rem; grid-template-columns: 7rem 1fr; padding: .72rem 0; }
.spec-list dt { color: var(--color-primary-dark); font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.spec-list dd { color: var(--color-muted); margin: 0; }
.upload-note { color: var(--color-muted); display: block; font-size: .75rem; margin: .85rem 0 0; }
.upload-note code { color: var(--color-primary-dark); overflow-wrap: anywhere; }
.packaging-slider { display: flex; gap: 1.2rem; overflow-x: auto; padding: .2rem .2rem 1.2rem; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-color: var(--color-primary) transparent; }
.packaging-card { flex: 0 0 280px; scroll-snap-align: start; }
.packaging-card__image { min-height: 210px; }
.packaging-card__body h3 { font-size: 1.15rem; }
.image-preview-modal .modal-content { background: #111; border: 0; border-radius: .8rem; overflow: hidden; position: relative; }
.image-preview-modal img { display: block; max-height: 78vh; object-fit: contain; width: 100%; }
.image-preview-modal p { background: #fff; color: var(--color-ink); font-weight: 700; margin: 0; padding: 1rem 1.2rem; }
.image-preview-close { background-color: #fff; position: absolute; right: 1rem; top: 1rem; z-index: 2; }