/* Be Well Live Well — bwlw.css
   Header + Footer styles only.
   All page/section styles are handled by Elementor.
*/

/* ── TOKENS (colours injected via wp_head from Customizer, but kept here as fallback) ── */
:root{
  --cream:#faf7f1;
  --ink:#211c1a;
  --heading:#211c1a;
  --muted:#73797a;
  --coral:#ab5c57;
  --coral-dark:#9e6e7a;
  --peach:#faab8c;
  --peach-text:#dc967b;
  --mauve:#9e6e7a;
  --lav:#f6d9cb;
  --line:#ddd5ca;
  --serif:"Playfair Display",Georgia,serif;
  --sans:"DM Sans",Arial,sans-serif;
  --max:1380px;
  --ease:.3s ease;
}

/* ── BASE RESETS ── */
*{box-sizing:border-box; padding: 0;
    margin: 0;}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
.container{width:min(calc(100% - 88px),var(--max));margin:auto}

/* ── SHARED: BUTTON (used in nav CTA + footer newsletter) ── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--coral);border:2px solid #7a3330;color:#fff!important;
  border-radius:999px;min-height:52px;padding:14px 30px;
  font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  box-shadow:0 5px 0 #7a3330;
  transition:background var(--ease),transform var(--ease),box-shadow var(--ease);
  cursor:pointer;
}
.btn:hover{background:var(--coral-dark);transform:translateY(-2px);box-shadow:0 7px 0 #7a3330}

/* ── SHARED: SERIF utility (used on footer newsletter heading) ── */
.serif{font-family:var(--serif);font-weight:500;letter-spacing:-.045em}

/* ── SHARED: EYEBROW (used in footer) ── */
.eyebrow{font-size:11px;letter-spacing:.22em;font-weight:700;text-transform:uppercase;color:var(--coral)}

/* ════════════════════════════════════════
   ANNOUNCEMENT BAR
════════════════════════════════════════ */
.announce{background:var(--peach);text-align:center;padding:11px 20px}
.announce a{color:#3d2420;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.announce a:hover{text-decoration:underline}

/* ════════════════════════════════════════
   HEADER / NAV
════════════════════════════════════════ */
.nav{
  height:100px;padding:0 64px;
  background:var(--nav-bg, #fbf8f3);
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;
  z-index:100;
}
.nav--sticky{position:sticky;top:0}

/* Logo */
.logo-link{display:flex;align-items:center;flex:none}
.logo-img{height:82px;width:auto;object-fit:contain}
.logo{display:none;font-family:var(--serif);font-size:38px;line-height:.67;color:#111;letter-spacing:-.065em}
.logo span{font-size:.48em;letter-spacing:.02em}
.logo-link.logo-missing .logo-img{display:none}
.logo-link.logo-missing .logo{display:block}

/* Desktop nav links */
.navlinks{display:flex;gap:22px;align-items:center;font-size:13px;letter-spacing:.07em;font-weight:700;text-transform:uppercase}
.navlinks>a:hover{color:var(--coral)}

/* Dropdown nav item */
.nav-item{position:relative}
.nav-item>a{display:inline-flex;align-items:center;gap:5px;transition:color var(--ease)}
.nav-item>a:hover{color:var(--coral)}
.nav-item .chev{display:inline-flex;transition:transform var(--ease)}
.icon-chev{width:9px;height:9px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.nav-item:hover .chev,
.nav-item:focus-within .chev{transform:rotate(180deg)}

/* Dropdown submenu */
.submenu{
  position:absolute;top:calc(100% + 14px);left:50%;
  transform:translateX(-50%) translateY(6px);
  min-width:210px;background:#fff;
  border:1px solid var(--line);border-radius:10px;
  box-shadow:0 20px 34px -18px rgba(23,43,52,.28);
  padding:8px 0;
  opacity:0;visibility:hidden;
  transition:opacity var(--ease),transform var(--ease),visibility var(--ease);
  z-index:200;
}
.nav-item:hover .submenu,
.nav-item:focus-within .submenu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.submenu a{display:block;padding:9px 18px;font-size:11px;letter-spacing:.06em;color:var(--ink);white-space:nowrap;font-weight:600}
.submenu a:hover{color:var(--coral);background:var(--cream)}

/* Right side of nav */
.navright{display:flex;gap:14px;align-items:center}

/* Hamburger button */
.menu{width:40px;height:36px;padding:5px;border:0;background:none;display:none;flex-direction:column;justify-content:center;gap:6px;cursor:pointer}
.menu span{display:block;width:27px;height:1px;background:#132b34;transition:transform .3s,opacity .3s}
.menu[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.menu[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

/* ════════════════════════════════════════
   MOBILE NAV
════════════════════════════════════════ */
.mobile-nav{
  position:fixed;inset:0;z-index:500;
  display:flex;flex-direction:column;
  background:var(--cream);
  transform:translateY(-100%);visibility:hidden;
  transition:transform .5s cubic-bezier(.22,.61,.36,1),visibility .5s;
  overflow-y:auto;
}
.mobile-nav.is-open{transform:translateY(0);visibility:visible}

.mobile-nav__head{
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 24px;border-bottom:1px solid var(--line);flex:none;
}
.mobile-nav__brand-link{display:flex;align-items:center;gap:10px}
.mobile-nav__logo-img{height:34px;width:auto;object-fit:contain}
.mobile-nav__brand-link.logo-missing .mobile-nav__logo-img{display:none}
.mobile-nav__brand{font-family:var(--serif);font-size:17px;color:var(--heading)}

.mobile-nav__close{
  width:42px;height:42px;border:1px solid var(--line);border-radius:50%;
  background:none;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:border-color .3s,transform .3s;flex:none;
}
.mobile-nav__close svg{width:16px;height:16px;fill:none;stroke:var(--heading);stroke-width:2;stroke-linecap:round}
.mobile-nav__close:hover{border-color:var(--coral);transform:rotate(90deg)}

.mobile-nav__body{padding:8px 24px 20px;flex:1}
.mobile-nav__item{
  padding:18px 0;border-bottom:1px solid var(--line);
  opacity:0;transform:translateY(10px);
  transition:opacity .5s,transform .5s;
}
.mobile-nav.is-open .mobile-nav__item{opacity:1;transform:none}
.mobile-nav__body .mobile-nav__item:nth-child(1){transition-delay:.05s}
.mobile-nav__body .mobile-nav__item:nth-child(2){transition-delay:.1s}
.mobile-nav__body .mobile-nav__item:nth-child(3){transition-delay:.15s}
.mobile-nav__body .mobile-nav__item:nth-child(4){transition-delay:.2s}
.mobile-nav__item a{font-family:var(--serif);font-size:19px;font-weight:500;line-height:1.3;color:var(--heading);letter-spacing:-.01em}

.mobile-nav__row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.mobile-nav__row>a{flex:1}
.mobile-nav__toggle{
  width:34px;height:34px;flex:none;
  border:1px solid var(--line);border-radius:50%;
  background:none;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:border-color .3s;
}
.mobile-nav__toggle:hover{border-color:var(--coral)}
.mobile-nav__toggle svg{width:12px;height:12px;fill:none;stroke:var(--heading);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s}
.mobile-nav__toggle[aria-expanded="true"] svg{transform:rotate(180deg)}

.mobile-submenu{display:flex;flex-direction:column;max-height:0;overflow:hidden;transition:max-height .4s,margin-top .4s}
.mobile-nav__item.is-expanded .mobile-submenu{max-height:280px;margin-top:12px}
.mobile-submenu a{font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:7px 0;transition:color .3s}
.mobile-submenu a:hover{color:var(--coral)}

.mobile-nav__foot{
  flex:none;padding:22px 24px 32px;
  border-top:1px solid var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.mobile-nav__social{display:flex;gap:10px}
.mobile-nav__social a{
  width:34px;height:34px;border:1px solid var(--line);border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:border-color .3s;
}
.mobile-nav__social i{font-size:15px;color:var(--heading)}
.mobile-nav__social a:hover{border-color:var(--coral)}
body.nav-open{overflow:hidden}

/* Hide mobile nav on desktop */
@media(min-width:901px){.mobile-nav{display:none}}

/* ════════════════════════════════════════
   NEWSLETTER BAR (above footer)
════════════════════════════════════════ */
.final-news{background:var(--lav);padding:55px 0}
.final-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}
.final-news h2{font-family:var(--serif)!important;font-size:24px!important;line-height:1.2!important;margin:0;color:var(--heading)!important}
.final-news .eyebrow{margin-bottom:8px}
.final-news p{font-size:14px;line-height:1.7;color:#61666a;margin:0 0 14px}
.final-form{display:flex;gap:8px}
.final-form input{flex:1;height:46px;border:0;background:#fff;border-radius:999px;padding:0 20px;font-size:13px}

/* ════════════════════════════════════════
   FOOTER
════════════════════════════════════════ */
footer{background:var(--footer-bg,#191310);color:#fff;padding:70px 0 0}
.footer-wrap{width:100%;padding:0 64px}
.footer-main{
  display:grid;
  grid-template-columns:1.2fr 1.3fr .9fr 1.2fr .8fr 1.3fr;
  gap:28px;align-items:start;
  padding-bottom:60px;
}

/* Brand col */
.footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.footer-logo-link{display:flex;align-items:center}
.footer-logo-img{height:120px;width:auto;object-fit:contain;filter:brightness(0) invert(1)}
.footer-logo-link.logo-missing .footer-logo-img{display:none}
.footer-logo-link.logo-missing .footer-logo{display:block}
.footer-logo{display:none;font-family:var(--serif);font-size:clamp(22px,2vw,30px);line-height:1.05;letter-spacing:-.03em;color:#f5f1ee;margin:0}
.footer-logo span{display:block;font-size:.85em}

/* Link columns */
.footer-column h4{font-size:11px!important;letter-spacing:.15em!important;margin:0 0 14px!important;color:var(--peach-text)!important;text-transform:uppercase!important}
.footer-column h4:not(:first-child){margin-top:20px!important}
.footer-column a,
.footer-column span{display:block;color:#eef2f3!important;font-size:13px!important;font-weight:500!important;letter-spacing:.01em!important;line-height:2.2!important;transition:color .3s!important}
.footer-column a:hover{color:var(--peach)!important}

/* Contact */
.footer-note--contact{font-style:normal;line-height:2.2;color:#eef2f3;font-size:14px;font-weight:600;letter-spacing:.01em}

/* Social icons */
.footer-social{display:flex;gap:12px;margin-top:6px;flex-wrap:wrap}
.footer-social a{
  width:32px;height:32px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.2);border-radius:50%;
  transition:border-color .3s;
}
.footer-social i{font-size:16px;color:#fff;transition:color .3s}
.footer-social a:hover{border-color:var(--peach)}
.footer-social a:hover i{color:var(--peach)}

/* ═══ Certifications ═══ */
.footer-certs{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:10px;
  margin-top:10px;
  max-width:220px;
}

.footer-cert-link{
  display:block;
  width:100%;
  aspect-ratio:4 / 3;
  border-radius:8px;
  overflow:hidden;
  background:#fff;
  border:1px solid rgba(255,255,255,.14);
  transition:border-color .3s, transform .3s;
}

.footer-cert-link:hover{
  border-color:rgba(250,171,140,.6);
  transform:translateY(-2px);
}

.footer-cert-link img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  padding:5px;
  background:#fff;
}

/* Responsive */
@media (max-width:900px){
  .footer-certs{ max-width:250px; }
}

@media (max-width:560px){
  .footer-certs{
    max-width:100%;
    grid-template-columns:repeat(2, 1fr);
    gap:8px;
  }
}


/* Zoomable certs (no URL) */
.footer-cert-zoom{
  cursor:zoom-in;
}
.footer-cert-zoom:focus-visible{
  outline:2px solid var(--peach);
  outline-offset:2px;
}

/* ═══ Cert Lightbox ═══ */
.bwlw-cert-lightbox{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;
  padding:30px;
  opacity:0;visibility:hidden;
  transition:opacity .3s ease,visibility .3s ease;
}
.bwlw-cert-lightbox.is-open{opacity:1;visibility:visible}

.bwlw-cert-lightbox__overlay{
  position:absolute;inset:0;
  background:rgba(25,19,16,.88);
  backdrop-filter:blur(4px);
  cursor:zoom-out;
}

.bwlw-cert-lightbox__inner{
  position:relative;z-index:1;
  max-width:min(900px,92vw);
  max-height:88vh;
  display:flex;align-items:center;justify-content:center;
}

.bwlw-cert-lightbox__img{
  max-width:100%;
  max-height:80vh;
  width:auto;height:auto;
  background:#fff;
  padding:10px;
  border-radius:8px;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.6);
  transform:scale(.96);
  transition:transform .35s cubic-bezier(.22,.61,.36,1);
}
.bwlw-cert-lightbox.is-open .bwlw-cert-lightbox__img{transform:scale(1)}

.bwlw-cert-lightbox__close{
  position:absolute;top:-52px;right:0;
  width:40px;height:40px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:50%;
  background:transparent;color:#fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:background .3s,border-color .3s,transform .3s;
}
.bwlw-cert-lightbox__close svg{width:16px;height:16px}
.bwlw-cert-lightbox__close:hover{
  background:var(--coral);
  border-color:var(--coral);
  transform:rotate(90deg);
}

@media (max-width:560px){
  .bwlw-cert-lightbox{padding:16px}
  .bwlw-cert-lightbox__close{top:-46px;width:34px;height:34px}
  .bwlw-cert-lightbox__img{padding:6px}
}

/* Newsletter trigger */
.footer-newsletter{line-height:1.6!important;color:#eef2f3;font-size:13px;font-weight:500}
.footer-newsletter:hover{color:var(--peach)}

/* Bottom bar */
.footer-bottom{
  display:flex;align-items:center;flex-wrap:wrap;gap:20px;
  padding:20px 0;border-top:1px solid rgba(255,255,255,.12);
}
.footer-bottom a{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#eef2f3;font-weight:700}
.footer-bottom a:hover{color:var(--peach)}
.copyright, .copyright a{font-weight: 400!important;flex-basis:100%;margin:0;text-align:center;font-size:11px!important;letter-spacing:.08em!important;color:rgba(255,255,255,.55)!important;text-transform: unset!important}

/* ════════════════════════════════════════
   NEWSLETTER POPUP
════════════════════════════════════════ */
.newsletter-popup{
  position:fixed;inset:0;z-index:1000;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  visibility:hidden;opacity:0;
  transition:opacity .35s ease,visibility .35s;
}
.newsletter-popup.is-open{visibility:visible;opacity:1}
.newsletter-popup__overlay{position:absolute;inset:0;background:rgba(25,19,16,.6);cursor:pointer}
.newsletter-popup__box{
  position:relative;z-index:1;
  width:100%;max-width:460px;
  background:var(--cream);border-radius:16px;padding:46px 38px;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.45);
  transform:translateY(16px) scale(.98);
  transition:transform .35s cubic-bezier(.22,.61,.36,1);
}
.newsletter-popup.is-open .newsletter-popup__box{transform:translateY(0) scale(1)}
.newsletter-popup__close{
  position:absolute;top:18px;right:18px;
  width:36px;height:36px;
  border:1px solid var(--line);border-radius:50%;
  background:none;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:border-color .3s,transform .3s;
}
.newsletter-popup__close:hover{border-color:var(--coral);transform:rotate(90deg)}
.newsletter-popup__close svg{width:14px;height:14px;fill:none;stroke:var(--heading);stroke-width:2;stroke-linecap:round}
.newsletter-popup__title{font-family:var(--serif);font-size:22px;color:var(--heading);margin:12px 0 10px;letter-spacing:-.015em}
.newsletter-popup__body{font-size:14px;line-height:1.6;color:var(--muted);margin:0 0 20px}
.newsletter-popup__hint{font-size:13px;color:var(--coral);margin:0 0 12px}

/* MailChimp for WooCommerce (mc4wp) overrides inside popup */
#newsletterPopup .mc4wp-form{display:flex;flex-direction:column;gap:12px}
#newsletterPopup .mc4wp-form input[type=email]{
  height:46px;border:1px solid var(--line);background:#fff;
  border-radius:999px;padding:0 20px;font-size:13px;font-family:inherit;width:100%;
}
#newsletterPopup .mc4wp-form input[type=submit]{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--coral);border:2px solid #7a3330;color:#fff;
  border-radius:999px;min-height:52px;padding:14px 30px;
  font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  box-shadow:0 5px 0 #7a3330;cursor:pointer;width:100%;
  transition:background var(--ease);
}
#newsletterPopup .mc4wp-form input[type=submit]:hover{background:var(--coral-dark)}

/* mc4wp in newsletter bar */
.final-news .mc4wp-form{display:flex;gap:8px;margin-top:14px}
.final-news .mc4wp-form input[type=email]{
  flex:1;height:46px;border:0;background:#fff;
  border-radius:999px;padding:0 20px;font-size:13px;font-family:inherit;
}
.final-news .mc4wp-form input[type=submit]{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--coral);border:2px solid #7a3330;color:#fff;
  border-radius:999px;min-height:46px;padding:12px 24px;
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  box-shadow:0 4px 0 #7a3330;cursor:pointer;white-space:nowrap;
  transition:background var(--ease);
}
.final-news .mc4wp-form input[type=submit]:hover{background:var(--coral-dark)}

/* ════════════════════════════════════════
   RESPONSIVE — tablet (≤900px)
════════════════════════════════════════ */
@media(max-width:900px){
  .container{width:min(calc(100% - 42px),var(--max))}

  /* Nav */
  .nav{height:72px;padding:0 22px}
  .navlinks,.navright{display:none}
  .menu{display:flex}

  /* Footer */
  .footer-wrap{padding:0 22px}
  .footer-main{grid-template-columns:1fr 1fr 1fr}
  .footer-bottom{padding:20px 0}

  /* Newsletter bar */
  .final-grid{grid-template-columns:1fr;gap:22px}
  .final-form{flex-direction:column;gap:10px}
  .final-form input{flex:none;width:100%;height:50px}
  .final-news .mc4wp-form{flex-direction:column;gap:10px}
  .final-news .mc4wp-form input[type=email]{flex:none;width:100%;height:50px}
}

/* ════════════════════════════════════════
   RESPONSIVE — mobile (≤560px)
════════════════════════════════════════ */
@media(max-width:560px){
  .container{width:calc(100% - 28px)}

  /* Nav */
  .nav{height:68px;padding:0 16px}
  .logo-img{height:56px}

  /* Footer */
  footer{padding-top:50px}
  .footer-wrap{padding:0 16px}
  .footer-main{grid-template-columns:1fr 1fr;row-gap:34px}
  .footer-brand{grid-column:1/-1}
  .footer-bottom{flex-direction:column;text-align:center;gap:10px}
  .copyright{margin-left:0}

  /* Newsletter bar */
  .final-news{padding:44px 0}
  .final-news h2{font-size:20px!important}
}

