/* Ecnargarf — light maison storefront (stone + charcoal + sage green accents) */
:root {
  --brand-paper: #F7F5F1;
  --brand-ink: #2A2926;
  --brand-muted: #8A8680;
  --brand-line: rgba(42, 41, 38, 0.1);
  /* UI accent = sage green (logo asset stays champagne gold) */
  --brand-gold: #5E7A68;
  --brand-gold-soft: #8FA896;
  /* Interactive hover / focus accent — champagne gold site-wide */
  --brand-hover: #C4A574;
  --brand-panel: #EEF3EF;
  --brand-sage: #E8F0EA;
  --brand-sage-deep: #5E7A68;
  --brand-mist: #F7F5F1;
  --brand-mist-deep: #2A2926;
  --brand-mist-soft: #E8F0EA;
  --brand-dark: #2A2926;
  --brand-bronze: #5E7A68;
  --brand-sand: #F7F5F1;
  --brand-smoke: #8A8680;
}

/* RTL: translate content, do not mirror brand/contact chrome */
html[dir="rtl"] .site-logo,
html[dir="rtl"] .home-brand,
html[dir="rtl"] .olfactory__logo,
html[dir="rtl"] .footer-brand img {
  transform: none !important;
}
html[dir="rtl"] .footer-social,
html[dir="rtl"] .footer-cards,
html[dir="rtl"] .ecn-price,
html[dir="rtl"] .ecn-ltr,
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] a[href^="mailto:"],
html[dir="rtl"] a[href*="wa.me"] {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Tap / selection — keep brand-readable on phones */
html {
  -webkit-tap-highlight-color: rgba(94, 122, 104, 0.22);
}
::selection {
  background: rgba(94, 122, 104, 0.28);
  color: #2A2926;
}
::-moz-selection {
  background: rgba(94, 122, 104, 0.28);
  color: #2A2926;
}

/* Hover accents only on devices that truly hover (avoids sticky “black/gold” taps on iOS) */
@media (hover: hover) and (pointer: fine) {
  a:hover,
  button:hover,
  summary:hover,
  .nav-link:hover,
  .nav-drop a:hover,
  .site-locale a:hover,
  .mobile-locale a:hover,
  .mobile-sub a:hover,
  .cat-card:hover .cat-name,
  .home-cta-ghost:hover,
  .home-trade a:hover h3,
  .home-trade a:hover span,
  .home-cat-card:hover .home-cat-card__name {
    color: var(--brand-hover);
  }
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
.nav-link:focus-visible,
.nav-drop a:focus-visible,
.site-locale a:focus-visible,
.mobile-locale a:focus-visible,
.mobile-sub a:focus-visible {
  color: var(--brand-hover);
  outline: 2px solid rgba(94, 122, 104, 0.45);
  outline-offset: 2px;
}

/* Pressed state — sage, never dark-on-dark */
a:active,
button:active,
summary:active,
.nav-link:active,
.mobile-sub a:active,
.mobile-locale a:active,
.faq-question:active {
  color: var(--brand-sage-deep);
}

/* Filled CTAs: cream text on sage; gold fill + dark ink on true hover */
.home-cta-primary,
.pd-btn-primary,
.dist-geo-dialog__yes {
  color: #F7F5F1 !important;
}
.home-cta-primary:active,
.pd-btn-primary:active,
.dist-geo-dialog__yes:active,
.about-btn:active,
.contact-form button:active {
  background: #4A6554 !important;
  color: #F7F5F1 !important;
  border-color: #4A6554;
}
@media (hover: hover) and (pointer: fine) {
  .about-btn:hover,
  .about-btn:focus-visible,
  .contact-form button:hover,
  .contact-form button:focus-visible,
  .contact-form .btn:hover,
  .contact-form .btn:focus-visible,
  .home-cta-primary:hover,
  .home-cta-primary:focus-visible,
  .dist-geo-dialog__yes:hover,
  .dist-geo-dialog__yes:focus-visible,
  .pd-btn-primary:hover,
  .pd-btn-primary:focus-visible {
    background: var(--brand-hover) !important;
    color: #2A2926 !important;
    border-color: var(--brand-hover);
  }
}

/* Product detail: space size/price chips above Enquire CTAs */
.pd-sizes {
  margin: 0 0 2rem;
}
.pd-actions {
  margin-top: .25rem;
}

/* Mobile: keep copy off the screen edge */
@media (max-width: 640px) {
  .section-box,
  .about-hero,
  .brand-hero,
  .cat-page,
  .pd-page,
  .ws-hero__inner,
  .ws-section,
  .home-hero-inner,
  .home-section {
    padding-left: 1.35rem !important;
    padding-right: 1.35rem !important;
  }
  .max-w-7xl.mx-auto.px-4,
  .max-w-5xl.mx-auto.px-4,
  .max-w-3xl.mx-auto.px-4 {
    padding-left: 1.35rem !important;
    padding-right: 1.35rem !important;
  }
  .pd-sizes {
    margin-bottom: 2.25rem;
  }
  .pd-actions {
    margin-top: .5rem;
  }
}

/* Photo heroes — marketing pages (shared size) */
.about-hero,
.brand-hero {
  position: relative;
  overflow: hidden;
  min-height: clamp(17.5rem, 38vw, 24rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  padding: 5.5rem 1.35rem 3rem;
  text-align: center;
  background:
    linear-gradient(120deg, rgba(245, 242, 237, 0.96) 0%, rgba(245, 242, 237, 0.82) 42%, rgba(239, 235, 228, 0.55) 100%),
    radial-gradient(ellipse 70% 80% at 90% 20%, rgba(196, 176, 154, 0.28), transparent 55%),
    var(--brand-mist);
  border-bottom: 1px solid var(--brand-line);
}
.about-hero.has-photo,
.brand-hero.has-photo {
  /* --hero-photo set inline; light wash keeps type readable */
  background:
    linear-gradient(105deg, rgba(245, 242, 237, 0.9) 0%, rgba(245, 242, 237, 0.58) 42%, rgba(245, 242, 237, 0.2) 100%),
    var(--hero-photo) center / cover no-repeat,
    var(--brand-mist);
}
.about-hero.has-photo::before,
.brand-hero.has-photo::before {
  content: none;
}
.about-hero h1,
.brand-hero h1 {
  position: relative;
  z-index: 1;
  max-width: 72rem;
  margin: 0 auto .75rem;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 400;
  font-size: clamp(2.1rem, 4.8vw, 3.2rem);
  letter-spacing: .04em;
  color: var(--brand-ink);
  text-transform: none;
}
.about-hero p,
.brand-hero p {
  position: relative;
  z-index: 1;
  max-width: 36rem;
  margin: 0 auto;
  padding: 0;
  font-family: Outfit, system-ui, sans-serif;
  font-weight: 300;
  font-size: .92rem;
  line-height: 1.65;
  color: var(--brand-muted);
}
.about-hero .about-cta-row,
.brand-hero .about-cta-row {
  position: relative;
  z-index: 1;
  justify-content: center;
  width: 100%;
  margin-top: 1.25rem;
}

.section-box {
  max-width: 72rem;
  margin: 0 auto;
  padding: 3rem 1.25rem;
  text-align: left;
}
.section-box h2 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 400;
  font-size: clamp(1.55rem, 2.8vw, 2rem);
  letter-spacing: .03em;
  color: var(--brand-ink);
  margin: 0 0 .75rem;
}
.section-box > p {
  color: var(--brand-muted);
  font-weight: 300;
  font-size: .92rem;
  line-height: 1.65;
  max-width: 40rem;
  margin: 0 0 1.5rem;
}

/* Contact */
.contact-page { padding: 0 0 4rem; background: transparent; }
.contact-wrap.section-box { padding-top: 2.5rem; }
.contact-layout {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 2.5rem 3rem;
  align-items: start;
}
@media (max-width: 900px) {
  .contact-layout { grid-template-columns: 1fr; gap: 2rem; }
}

.contact-left h2,
.contact-right h2 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 400;
  font-size: 1.7rem;
  letter-spacing: .03em;
  color: var(--brand-ink);
  margin: 0 0 .75rem;
}
.contact-left > p {
  color: var(--brand-muted);
  font-weight: 300;
  line-height: 1.65;
  margin: 0 0 1.5rem;
  font-size: .92rem;
}

.contact-grid { display: grid; gap: .85rem; }
.contact-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.05rem 1.15rem;
  background: linear-gradient(145deg, #fff, var(--brand-panel));
  border: 1px solid var(--brand-line);
}
.contact-card i {
  color: var(--brand-sage-deep);
  font-size: 1.05rem;
  width: 1.25rem;
  height: 1.25rem;
  flex: 0 0 1.25rem;
  text-align: center;
}
.contact-card h3 {
  margin: 0 0 .15rem;
  font-family: Outfit, system-ui, sans-serif;
  font-size: .65rem;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--brand-mist-deep);
}
.contact-card p {
  margin: 0;
  font-size: .88rem;
  color: var(--brand-ink);
  font-weight: 300;
}
.contact-card a {
  color: var(--brand-ink);
  text-decoration: none;
  border-bottom: 1px solid rgba(94, 122, 104, .4);
}
.contact-card a:hover,
.contact-card a:focus-visible {
  color: var(--brand-hover);
  border-bottom-color: rgba(196, 165, 116, .55);
}

.contact-right .contact-form,
.contact-form {
  background: #fff;
  border: 1px solid var(--brand-line);
  padding: 1.5rem;
}
.form-wrapper { max-width: none !important; padding: 0 !important; margin: 0 !important; }

.contact-field-label {
  display: block;
  margin: .15rem 0 .35rem;
  font-size: .62rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--brand-muted);
}
.contact-form input:not([type="hidden"]),
.contact-form textarea,
.contact-form select {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-bottom: .75rem;
  padding: .8rem .9rem;
  background: var(--brand-paper);
  border: 1px solid var(--brand-line);
  color: var(--brand-ink);
  font: inherit;
  font-size: .88rem;
  outline: none;
  transition: border-color .25s;
}
.contact-form input:focus,
.contact-form textarea:focus,
.contact-form select:focus {
  border-color: var(--brand-sage-deep);
}
.contact-form textarea { min-height: 7rem; resize: vertical; }

/* Name / paired fields — shared across contact, distributors, wholesale, PL */
.ecn-form-row,
.contact-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  width: 100%;
  max-width: 100%;
}
.ecn-form-row > *,
.contact-form__row > * { min-width: 0; }
.contact-form .ecn-form-row input:not([type="hidden"]),
.contact-form .contact-form__row input:not([type="hidden"]) {
  margin-bottom: .75rem;
}

.contact-form button,
.contact-form .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: .35rem;
  padding: .85rem 1.4rem;
  border: 0;
  background: var(--brand-ink);
  color: var(--brand-paper);
  font-family: Outfit, system-ui, sans-serif;
  font-size: .65rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .3s, color .3s, transform .3s;
}
.contact-form button:hover,
.contact-form .btn:hover {
  transform: translateY(-1px);
}

/* Phone widget spacing inside page forms */
.contact-form .ecn-phone {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0 0 .75rem;
}
.contact-form .ecn-phone__hint {
  margin-top: .35rem;
}

.contact-map {
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 1.25rem 1rem;
}
.contact-map h2 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 400;
  font-size: 1.7rem;
  color: var(--brand-ink);
  margin: 0 0 1rem;
}
.contact-map iframe,
.map-container iframe {
  width: 100%;
  border: 1px solid var(--brand-line) !important;
  border-radius: 0 !important;
  filter: grayscale(.15) contrast(1.02);
}

.about-page .about-hero h1,
.contact-page .about-hero h1 {
  animation: brandRise .9s cubic-bezier(.22, 1, .36, 1) both;
}
.about-page .about-hero p,
.contact-page .about-hero p {
  animation: brandRise .9s cubic-bezier(.22, 1, .36, 1) .1s both;
}
@keyframes brandRise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .about-page .about-hero h1,
  .about-page .about-hero p,
  .contact-page .about-hero h1,
  .contact-page .about-hero p { animation: none; }
}

/* About */
.about-page { padding: 0 0 4rem; }
.about-kicker {
  font-size: .62rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--brand-sage-deep);
  margin: 0 0 .55rem;
}
.about-block { padding-top: 2.75rem; padding-bottom: 1.25rem; }
.about-grid-section { padding-bottom: 2rem; }
.about-paths {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
  margin-top: .5rem;
}
@media (max-width: 800px) {
  .about-paths { grid-template-columns: 1fr; }
}
a.about-path {
  text-decoration: none;
  transition: border-color .25s, transform .3s, box-shadow .3s;
}
a.about-path:hover {
  border-color: rgba(94, 122, 104, .45);
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(26, 28, 30, .06);
}
.about-cta { padding-top: 2rem; padding-bottom: 3rem; }
.about-cta-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .75rem;
  margin-top: .25rem;
}
@media (max-width: 768px) {
  .about-cta-row {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .about-cta-row .about-btn {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
}
.about-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .85rem 1.35rem;
  background: var(--brand-ink);
  color: var(--brand-paper);
  text-decoration: none;
  font-family: Outfit, system-ui, sans-serif;
  font-size: .65rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  transition: background .3s, color .3s, transform .3s;
}
.about-btn:hover {
  transform: translateY(-1px);
}
.about-btn-ghost {
  background: transparent;
  color: var(--brand-ink);
  border: 1px solid var(--brand-line);
}
.about-btn-ghost:hover,
.about-btn-ghost:focus-visible {
  background: transparent !important;
  color: var(--brand-hover) !important;
  border-color: var(--brand-hover) !important;
  transform: translateY(-1px);
}

/* FAQ */
.faq-page .section-box { padding-top: 2.5rem; }
.faq-list {
  display: grid;
  gap: .65rem;
  max-width: 44rem;
}
.faq-item {
  border: 1px solid var(--brand-line);
  background: #fff;
}
.faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  list-style: none;
  cursor: pointer;
  padding: 1.05rem 1.15rem;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.12rem;
  letter-spacing: .02em;
  color: var(--brand-ink);
}
.faq-question::-webkit-details-marker { display: none; }
.faq-question::marker { content: ""; }
.faq-question i {
  color: var(--brand-sage-deep);
  font-size: .72rem;
  transition: transform .3s;
  flex-shrink: 0;
}
.faq-item[open] .faq-question i { transform: rotate(180deg); }
.faq-answer { padding: 0 1.15rem 1.15rem; }
.faq-answer p {
  margin: 0;
  color: var(--brand-muted);
  font-weight: 300;
  font-size: .9rem;
  line-height: 1.65;
}
.faq-answer a {
  color: var(--brand-mist-deep);
  text-decoration: none;
  border-bottom: 1px solid rgba(91, 110, 140, .35);
}
.faq-answer a:hover,
.faq-answer a:focus-visible {
  color: var(--brand-hover);
  border-bottom-color: rgba(196, 165, 116, .55);
}

.faq-page .about-hero h1 {
  animation: brandRise .9s cubic-bezier(.22, 1, .36, 1) both;
}
.faq-page .about-hero p {
  animation: brandRise .9s cubic-bezier(.22, 1, .36, 1) .1s both;
}
@media (prefers-reduced-motion: reduce) {
  .faq-page .about-hero h1,
  .faq-page .about-hero p { animation: none; }
}

.policy-page .about-hero h1 {
  animation: brandRise .9s cubic-bezier(.22, 1, .36, 1) both;
}
.policy-page .about-hero p {
  animation: brandRise .9s cubic-bezier(.22, 1, .36, 1) .1s both;
}
@media (prefers-reduced-motion: reduce) {
  .policy-page .about-hero h1,
  .policy-page .about-hero p { animation: none; }
}

/* Policy */
.policy-page { padding: 0 0 4rem; }
.policy-page .section-box {
  padding-top: 1.75rem;
  padding-bottom: 1.25rem;
}
.policy-page .section-box + .section-box {
  border-top: 1px solid var(--brand-line);
}
.policy-page .section-box h2 {
  font-size: clamp(1.2rem, 2.3vw, 1.5rem);
}
.policy-page .section-box p { max-width: 42rem; }
.policy-page .section-box a:not(.about-btn) {
  color: var(--brand-mist-deep);
  text-decoration: none;
  border-bottom: 1px solid rgba(91, 110, 140, .35);
}
.policy-page .section-box a:not(.about-btn):hover,
.policy-page .section-box a:not(.about-btn):focus-visible {
  color: var(--brand-hover);
  border-bottom-color: rgba(196, 165, 116, .55);
}
/* Keep CTA buttons intact on policy / shipping pages */
.policy-page .section-box a.about-btn {
  color: var(--brand-paper);
  border-bottom: 0;
  text-decoration: none;
}
.policy-page .section-box a.about-btn-ghost {
  color: var(--brand-ink);
  border: 1px solid var(--brand-line);
  border-bottom-style: solid;
}

/* Content protect */
body.ecn-protect {
  -webkit-user-select: none;
  user-select: none;
}
body.ecn-protect input,
body.ecn-protect textarea,
body.ecn-protect select,
body.ecn-protect [contenteditable="true"] {
  -webkit-user-select: text;
  user-select: text;
}
body.ecn-protect img,
body.ecn-protect video {
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
}
html.ecn-protect-blur body.ecn-protect { filter: blur(8px); }
html.ecn-protect-flash body.ecn-protect { filter: brightness(0.85); }
@media print {
  body.ecn-protect { display: none !important; }
}

/* Chat widget — same on every page; height fits content (no nested scrollbars) */
#ecn-chat-toggle {
  position: fixed;
  right: max(16px, env(safe-area-inset-right, 0px));
  bottom: max(16px, env(safe-area-inset-bottom, 0px));
  z-index: 9999;
  width: 56px;
  height: 56px;
  border-radius: 999px;
  border: 0;
  background: #5E7A68;
  color: #F6F4F0;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
  cursor: pointer;
  font-size: 20px;
}
.ecn-chat-panel {
  position: fixed;
  right: max(12px, env(safe-area-inset-right, 0px));
  bottom: calc(78px + env(safe-area-inset-bottom, 0px));
  z-index: 10000;
  width: min(22rem, calc(100vw - 24px));
  height: auto;
  max-height: calc(100dvh - 5.75rem);
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid rgba(94, 122, 104, .22);
  box-shadow: 0 16px 40px rgba(42, 41, 38, .18);
  overflow-x: hidden;
  overflow-y: auto; /* only if the whole panel exceeds the viewport */
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.ecn-chat-panel[hidden] { display: none !important; }
.ecn-chat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .7rem .85rem;
  background: #5E7A68;
  color: #F6F4F0;
  flex-shrink: 0;
}
.ecn-chat-brand-wrap {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .3rem;
}
.ecn-chat-logo {
  height: 24px;
  width: auto;
  max-width: 10rem;
  display: block;
  object-fit: contain;
  /* Gold-on-black PNG → white mark on sage header */
  filter: brightness(0) invert(1);
}
.ecn-chat-sub {
  font-size: .68rem;
  opacity: .9;
  margin: 0;
  color: #F6F4F0;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.3;
}
#ecn-chat-close {
  border: 0;
  background: transparent;
  color: #F6F4F0;
  font-size: 1.45rem;
  line-height: 1;
  cursor: pointer;
  padding: .15rem .35rem;
  flex-shrink: 0;
}
.ecn-chat-channels {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  flex-shrink: 0;
  border-bottom: 1px solid rgba(94, 122, 104, .14);
  background: #EEF3EF;
}
.ecn-chat-channel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .55rem .35rem;
  font-size: .68rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  text-decoration: none;
  color: #2A2926;
  border-right: 1px solid rgba(94, 122, 104, .14);
}
.ecn-chat-channel:last-child { border-right: 0; }
.ecn-chat-channel:hover { background: rgba(196, 165, 116, .22); color: #2A2926; }
.ecn-chat-channel i { font-size: .9rem; color: #5E7A68; }
.ecn-chat-channel .fa-whatsapp { color: #25D366; }
.ecn-chat-phone-label {
  margin: 0;
  font-size: .68rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #7A7168;
}
.ecn-chat-msgs {
  flex: 0 0 auto;
  max-height: 5.5rem;
  overflow-x: hidden;
  overflow-y: auto; /* only when there are several chat bubbles */
  display: flex;
  flex-direction: column;
  gap: .4rem;
  padding: .7rem .85rem;
  background: #F7F5F1;
  font-size: .8rem;
  line-height: 1.45;
  scrollbar-gutter: stable;
}
.ecn-chat-form {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  overflow: visible;
  min-height: 0;
}
.ecn-chat-fields {
  display: grid;
  gap: .45rem;
  padding: .75rem .85rem .4rem;
  overflow: visible;
}
.ecn-chat-foot {
  flex: 0 0 auto;
  display: grid;
  gap: .45rem;
  padding: .45rem .85rem .85rem;
  border-top: 1px solid rgba(94, 122, 104, .14);
  background: #fff;
}
.ecn-chat-name-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
}
.ecn-chat-send {
  display: block;
  border: 0;
  background: #2A2926;
  color: #F6F4F0;
  padding: .7rem 1rem;
  cursor: pointer;
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}
.ecn-chat-send:hover { background: #C4A574; color: #2A2926; }
.ecn-chat-captcha-fallback {
  margin: 0;
  font-size: 11px;
  color: #5B6E8C;
  line-height: 1.4;
}
/* Keep phone widget compact inside chat on every page */
#ecn-chat-root .ecn-phone,
#ecn-chat-root .ecn-phone__shell { width: 100%; max-width: 100%; }
#ecn-chat-root .ecn-phone--compact .ecn-phone__country {
  font-size: .78rem;
  padding: .45rem 1.6rem .45rem .55rem;
}
#ecn-chat-root .ecn-phone--compact .ecn-phone__field { min-height: 2.2rem; }
#ecn-chat-root .ecn-phone--compact .ecn-phone__national {
  font-size: .8rem !important;
  padding: .45rem .55rem !important;
}

/* Honeypot — visually hidden without relying on Tailwind .hidden */
.ecn-hp {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.contact-form,
.pl-enquire,
.footer-news {
  position: relative;
}

/* Rectangular reCAPTCHA v2 — reserve layout height so nothing overlaps / clips */
.ecn-recaptcha-slot {
  --ecn-rc-scale: 1;
  --ecn-rc-w: 304px;
  --ecn-rc-h: 78px;
  position: relative;
  display: block;
  width: min(100%, calc(var(--ecn-rc-w) * var(--ecn-rc-scale)));
  min-height: calc(var(--ecn-rc-h) * var(--ecn-rc-scale));
  height: calc(var(--ecn-rc-h) * var(--ecn-rc-scale));
  overflow: visible;
  margin: 0;
}
.ecn-recaptcha-slot[data-size="compact"] {
  --ecn-rc-w: 164px;
  --ecn-rc-h: 144px;
}
.ecn-recaptcha-slot > .g-recaptcha,
.ecn-recaptcha-slot > div {
  transform: scale(var(--ecn-rc-scale));
  transform-origin: left top;
  width: var(--ecn-rc-w) !important;
}
html[dir="rtl"] .ecn-recaptcha-slot > .g-recaptcha,
html[dir="rtl"] .ecn-recaptcha-slot > div,
html[dir="rtl"] .ecn-captcha {
  transform-origin: right top;
}
#ecn-chat-captcha { width: 100%; }
#ecn-chat-captcha .ecn-recaptcha-slot { --ecn-rc-scale: 0.9; }
.footer-news__captcha {
  width: 100%;
  max-width: 22rem;
  margin-top: .15rem;
}
.footer-news__captcha .ecn-recaptcha-slot { --ecn-rc-scale: 0.88; }

@media (max-width: 480px) {
  .ecn-chat-panel {
    right: 8px;
    left: 8px;
    width: auto;
    bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    max-height: calc(100dvh - 5rem);
  }
  .ecn-chat-name-row { grid-template-columns: 1fr; }
  #ecn-chat-captcha .ecn-recaptcha-slot { --ecn-rc-scale: 0.8; }
  .footer-news__captcha .ecn-recaptcha-slot { --ecn-rc-scale: 0.78; }
  .ecn-chat-msgs { max-height: 4.75rem; }
}
@media (max-width: 360px) {
  #ecn-chat-captcha .ecn-recaptcha-slot,
  .footer-news__captcha .ecn-recaptcha-slot {
    --ecn-rc-scale: 0.7;
  }
}
@media (max-height: 640px) {
  .ecn-chat-msgs { max-height: 3.75rem; padding: .55rem .75rem; }
  .ecn-chat-fields { gap: .35rem; padding: .55rem .75rem .3rem; }
  .ecn-chat-foot { padding: .35rem .75rem .7rem; gap: .35rem; }
  #ecn-chat-captcha .ecn-recaptcha-slot { --ecn-rc-scale: 0.78; }
}

/* Captcha + form status */
.ecn-captcha {
  margin: .35rem 0 .5rem;
  transform-origin: left top;
  max-width: 100%;
  overflow: visible;
}
.contact-form .ecn-recaptcha-slot {
  margin: .35rem 0 .75rem;
  max-width: 100%;
}
.contact-form .ecn-recaptcha-slot .ecn-captcha {
  margin: 0;
}
.ecn-captcha-missing {
  margin: .35rem 0 .75rem;
  padding: .75rem .9rem;
  font-size: .8rem;
  line-height: 1.45;
  color: var(--brand-ink);
  border: 1px solid rgba(94, 122, 104, .35);
  background: rgba(220, 232, 223, .55);
}
.ecn-captcha-missing a { color: var(--brand-mist-deep); }
.ecn-form-ok {
  position: relative;
  margin: 0 0 1.25rem;
  padding: 1.6rem 1.45rem 1.5rem;
  text-align: center;
  color: var(--brand-ink);
  background:
    linear-gradient(180deg, rgba(238, 243, 239, 0.95) 0%, rgba(255, 252, 247, 0.98) 55%, #FFFcf7 100%);
  border: 1px solid rgba(94, 122, 104, 0.22);
  border-top: none;
  box-shadow: 0 10px 28px rgba(42, 41, 38, 0.05);
  animation: ecn-form-ok-in 0.55s ease both;
}
.ecn-form-ok__rule {
  display: block;
  height: 3px;
  margin: -1.6rem -1.45rem 1.15rem;
  background: linear-gradient(90deg, #C4A574 0%, #5E7A68 55%, #C4A574 100%);
}
.ecn-form-ok__eyebrow {
  margin: 0 0 .45rem;
  font-family: Outfit, system-ui, sans-serif;
  font-size: .62rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: #C4A574;
}
.ecn-form-ok__title {
  margin: 0 0 .65rem;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.85rem, 3.5vw, 2.35rem);
  font-weight: 400;
  line-height: 1.15;
  color: #5E7A68;
  letter-spacing: .02em;
}
.ecn-form-ok__body {
  margin: 0 auto;
  max-width: 34ch;
  font-family: Outfit, system-ui, sans-serif;
  font-size: .92rem;
  font-weight: 300;
  line-height: 1.6;
  color: #6F6B64;
}
@keyframes ecn-form-ok-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .ecn-form-ok { animation: none; }
}
.ecn-form-err {
  margin: 0 0 1rem;
  padding: .9rem 1rem;
  font-size: .88rem;
  line-height: 1.5;
  color: #8b2e3a;
  border: 1px solid rgba(196, 100, 110, .35);
  background: rgba(255, 235, 238, .9);
}

/* Sending state — progressive enhancement via site.js */
.contact-form.is-sending {
  position: relative;
  opacity: 0.78;
  pointer-events: none;
}
.contact-form.is-sending::after {
  content: "";
  display: block;
  height: 2px;
  margin-top: .85rem;
  background: linear-gradient(90deg, transparent, #C4A574, #5E7A68, #C4A574, transparent);
  background-size: 200% 100%;
  animation: ecn-form-send-shimmer 1.1s linear infinite;
}
@keyframes ecn-form-send-shimmer {
  from { background-position: 100% 0; }
  to { background-position: -100% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .contact-form.is-sending::after { animation: none; opacity: .55; }
}
.contact-form button[type="submit"][aria-busy="true"],
.contact-form.is-sending button[type="submit"] {
  cursor: wait;
  background: #3D4F44;
  color: #F7F5F1;
}
.ecn-form-send__busy[hidden],
.ecn-form-send__idle[hidden] {
  display: none !important;
}
.contact-form.is-sending .ecn-form-send__idle {
  display: none !important;
}
.contact-form.is-sending .ecn-form-send__busy {
  display: inline !important;
}

/* Mobile + tablet: forms, captcha, cookie clearance */
@media (max-width: 900px) {
  .contact-right .contact-form,
  .contact-form {
    padding: 1.25rem 1.1rem;
    overflow-x: clip;
  }
  .contact-map {
    padding-left: 1.35rem;
    padding-right: 1.35rem;
  }
  .contact-map iframe,
  .map-container iframe {
    height: min(280px, 55vw);
  }
}
/* Phone / tablet band (~375–768): keep 304px widget inside padded form columns */
@media (max-width: 768px) {
  .contact-form .ecn-recaptcha-slot,
  .pl-enquire .ecn-recaptcha-slot,
  .footer-news__captcha .ecn-recaptcha-slot {
    --ecn-rc-scale: 0.92;
  }
}
@media (max-width: 640px) {
  .ecn-form-row,
  .contact-form__row {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .contact-form input:not([type="hidden"]),
  .contact-form textarea,
  .contact-form select,
  .contact-form .ecn-phone__country,
  .contact-form .ecn-phone__national,
  .footer-news__row input[type="email"] {
    font-size: 16px; /* avoid iOS focus zoom */
    padding: .85rem .9rem;
  }
  .contact-form button[type="submit"],
  .contact-form button:not([type]),
  .contact-form .btn {
    width: 100%;
    max-width: 100%;
    min-height: 2.9rem;
    margin-top: .5rem;
  }
  .contact-field-label {
    margin-top: .15rem;
  }
  .contact-form .ecn-recaptcha-slot,
  .pl-enquire .ecn-recaptcha-slot,
  .footer-news__captcha .ecn-recaptcha-slot { --ecn-rc-scale: 0.88; }
  .ecn-form-ok {
    padding: 1.35rem 1.1rem 1.25rem;
  }
  .ecn-form-ok__rule {
    margin: -1.35rem -1.1rem 1rem;
  }
  .ecn-form-ok__body {
    font-size: .88rem;
  }
  .ecn-form-err {
    font-size: .84rem;
    padding: .8rem .85rem;
  }
}
@media (max-width: 480px) {
  .contact-right .contact-form,
  .contact-form {
    padding: 1.05rem .9rem;
  }
  .contact-form .ecn-recaptcha-slot,
  .pl-enquire .ecn-recaptcha-slot { --ecn-rc-scale: 0.78; }
  .about-hero.has-photo,
  .brand-hero.has-photo {
    min-height: 15.5rem;
    padding: 4.75rem 1.25rem 2.35rem;
  }
}
@media (max-width: 360px) {
  .contact-form .ecn-recaptcha-slot,
  .pl-enquire .ecn-recaptcha-slot { --ecn-rc-scale: 0.7; }
}

/* Photo band utility for marketing pages */
.ecn-photo-band {
  position: relative;
  min-height: 14rem;
  background-size: cover;
  background-position: center;
  border-block: 1px solid var(--brand-line);
}
.ecn-photo-band::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(246, 244, 240, .55), rgba(228, 234, 242, .25));
}

/* End-of-page bars + overflow (mobile) */
html, body {
  overflow-x: hidden;
}
@supports (overflow: clip) {
  html, body { overflow-x: clip; }
}

.contact-form .ecn-phone {
  margin-bottom: .75rem;
}
.contact-form .ecn-recaptcha-slot,
.pl-enquire .ecn-recaptcha-slot {
  margin: .35rem 0 .65rem;
  max-width: 100%;
}

/* Cookie banner open: keep page content / footer clear of the fixed bar */
html.ecn-cookie-open body {
  padding-bottom: calc(10.5rem + env(safe-area-inset-bottom, 0px));
}
@media (max-width: 700px) {
  html.ecn-cookie-open body {
    padding-bottom: calc(14rem + env(safe-area-inset-bottom, 0px));
  }
  .ecn-cookie-banner {
    padding: .7rem 1rem calc(.7rem + env(safe-area-inset-bottom, 0px));
  }
  .ecn-cookie-banner__title {
    font-size: 1.02rem;
    margin-bottom: .15rem;
  }
  .ecn-cookie-banner__text {
    font-size: .78rem;
    line-height: 1.45;
  }
  .ecn-cookie-banner__actions {
    flex-direction: column;
    gap: .45rem;
  }
  .ecn-cookie-btn {
    flex: 1 1 auto;
    width: 100%;
    min-height: 2.75rem;
    text-align: center;
    padding: .75rem 1rem;
  }
}

@media (max-width: 480px) {
  /* Private-label path cards: force single column on phones despite inline 2-col */
  .about-paths {
    grid-template-columns: 1fr !important;
  }
  .contact-card {
    padding: .95rem 1rem;
  }
}

@media (max-width: 380px) {
  .footer-news__row input[type="email"] {
    padding: .75rem .7rem;
  }
  .footer-news__row button {
    padding: .75rem .85rem;
    min-width: 2.85rem;
  }
}

/* Mobile-only: careful footer density trim (newsletter / reach / social / legal).
   Prefixed with .site-footer so these win over footer.php inline base rules.
   Cookie bar stays sticky-bottom — unchanged. */
@media (max-width: 640px) {
  .site-footer {
    padding-top: 2.6rem;
    padding-bottom: 1.25rem;
  }
  .site-footer .footer-main {
    margin-bottom: 1.5rem;
  }
  .site-footer .footer-brand .footer-blurb {
    margin-top: .75rem;
  }
  .site-footer .footer-news {
    margin-top: .85rem;
    gap: .5rem;
  }
  .site-footer .footer-reach {
    margin-bottom: 1rem;
    padding: .95rem 1.05rem;
    gap: .65rem;
  }
  .site-footer .footer-reach__title {
    margin-bottom: .2rem;
  }
  .site-footer .footer-social {
    gap: .45rem;
    padding: .85rem 0 .95rem;
  }
  .site-footer .footer-social a {
    width: 2.2rem;
    height: 2.2rem;
  }
  .site-footer .footer-bottom {
    padding-top: .9rem;
    gap: .65rem;
  }
  .site-footer .footer-legal {
    gap: .28rem .5rem;
    row-gap: .35rem;
  }
}
@media (max-width: 480px) {
  .site-footer {
    padding-top: 2.25rem;
    padding-bottom: 1.1rem;
  }
  .site-footer .footer-main {
    margin-bottom: 1.25rem;
  }
  .site-footer .footer-news {
    margin-top: .7rem;
    gap: .45rem;
  }
  .site-footer .footer-reach {
    margin-bottom: .85rem;
    padding: .8rem .9rem;
    gap: .55rem;
  }
  .site-footer .footer-social {
    padding: .7rem 0 .8rem;
  }
  .site-footer .footer-bottom {
    padding-top: .75rem;
    gap: .55rem;
  }
  .site-footer .footer-legal {
    gap: .25rem .45rem;
    row-gap: .3rem;
  }
}


/* —— B2B trade forms, programme proof, quote, thank-you next steps —— */
.contact-field-label {
  display: block;
  margin: .45rem 0 .35rem;
  font-size: .62rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8A8680;
}
/* Shared trade form (Contact / Wholesale / Distributors / Private Label) */
.trade-form,
.contact-form.trade-form,
.ecn-trade-quote__form .contact-form {
  max-width: 36rem;
}
.trade-form__interest {
  margin: 0;
  min-width: 0;
}
.trade-form__volume[hidden] {
  display: none !important;
}
.ws-enquiry {
  margin: 0 0 .85rem;
  padding: .85rem .95rem;
  border: 1px solid rgba(94, 122, 104, 0.22);
  background: rgba(247, 245, 241, 0.65);
}
.ws-enquiry__label {
  margin: 0 0 .2rem;
  font-size: .62rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8A8680;
}
.ws-enquiry__value {
  margin: 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.15rem;
  color: #2A2926;
}
.ws-enquiry__hint {
  margin: .35rem 0 0;
  font-size: .78rem;
  font-weight: 300;
  color: #8A8680;
}
.ws-enquiry__hint a {
  color: #5E7A68;
  text-decoration: none;
  border-bottom: 1px solid rgba(94, 122, 104, 0.4);
}

.ecn-trade-programmes__lede,
.ecn-trade-quote__lede {
  max-width: 46rem;
  color: #6F6B64;
  font-weight: 300;
  line-height: 1.6;
}
.ecn-trade-quote__lede a,
.ecn-trade-programmes__lede a {
  color: #5E7A68;
  text-decoration: none;
  border-bottom: 1px solid rgba(94, 122, 104, 0.4);
}
.ecn-trade-programmes__list {
  list-style: none;
  margin: 1.35rem 0 0;
  padding: 0;
  border-top: 1px solid rgba(42, 41, 38, 0.1);
}
.ecn-trade-programmes__list li {
  margin: 0;
  padding: .95rem 0;
  border-bottom: 1px solid rgba(42, 41, 38, 0.08);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  font-weight: 400;
  letter-spacing: .02em;
  color: #2A2926;
  line-height: 1.4;
}
.ecn-trade-programmes__photos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1.5rem;
}
.ecn-trade-programmes__photo {
  margin: 0;
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: #EEEBE4;
}
.ecn-trade-programmes__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 640px) {
  .ecn-trade-programmes__photos {
    grid-template-columns: 1fr;
  }
}

.ecn-trade-quote {
  scroll-margin-top: 5rem;
}
.ecn-trade-quote__form {
  margin-top: 1.1rem;
  max-width: 36rem;
}

.ecn-form-ok--next .ecn-form-ok__next {
  margin-top: 1.25rem;
  padding-top: 1.1rem;
  border-top: 1px solid rgba(196, 165, 116, 0.35);
}
.ecn-form-ok__next-label {
  margin: 0 0 .35rem;
  font-family: Outfit, system-ui, sans-serif;
  font-size: .62rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #C4A574;
}
.ecn-form-ok__next-copy {
  margin: 0 0 .9rem;
  font-size: .92rem;
  font-weight: 300;
  line-height: 1.55;
  color: #6F6B64;
}
.ecn-form-ok__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem .65rem;
}
.ecn-form-ok__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .8rem 1.15rem;
  background: #5E7A68;
  color: #F7F5F1;
  font-family: Outfit, system-ui, sans-serif;
  font-size: .62rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid #5E7A68;
  transition: background .25s, color .25s, border-color .25s;
}
.ecn-form-ok__btn:hover {
  background: #4A6554;
  border-color: #4A6554;
  color: #fff;
}
.ecn-form-ok__btn--ghost {
  background: transparent;
  color: #5E7A68;
}
.ecn-form-ok__btn--ghost:hover {
  background: rgba(94, 122, 104, 0.08);
  color: #3D4F44;
  border-color: #5E7A68;
}

.ws-page .ecn-trade-programmes,
.ws-page .ecn-trade-quote {
  width: min(72rem, 100%);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
