/** Shopify CDN: Minification failed

Line 11:71 Unexpected "*"

**/
/* ============================================================
   LeBRA — Footer layout (award-worthy rebuild · "Les Deux fidelity")
   ------------------------------------------------------------
   Loaded from footer.liquid LAST (after section-footer.css), so
   equal-specificity rules here win. Brand values flow ONLY through
   Dawn scheme/font tokens — no raw hex, no custom --brand-*/--space-*.

   STRATEGY: one evenly-distributed grid. display:contents flattens
   .footer__blocks-wrapper so the link columns + the Country block
   become direct grid items of .footer__content-top, sharing ONE grid
   with the newsletter. The newsletter is simply the WIDEST column on
   the left; Customer Care / LeBRA / Country fill three equal tracks
   to its right. Headings share a baseline, the rhythm is uniform,
   whitespace is the luxury. Links whisper until hovered.

   Heading typography + the newsletter field/button full-width rules
   live in assets/lebra-overrides.css and are NOT duplicated here —
   this file owns LAYOUT, colour softening, the collapsible mechanic,
   the Country column, the social row, and the bottom bar.

   Breakpoints: 750 / 990 only. 62.5% root (1rem = 10px). No clamp().
   ============================================================ */

/* ---------- 1 · Edge gutter — full-bleed, NOT .page-width ----------
   The footer wrappers no longer carry Dawn's `.page-width` (removed from
   footer.liquid) — so nothing caps them at the centred ~1200px column or
   re-adds its 5rem padding. We set the full-bleed width + the site-wide
   --page-edge gutter directly on the plain selector (which our grid rules
   already drive), so the newsletter box + columns line up with the product
   names / hero text down the whole page. */
.footer .footer__content-top,
.footer .footer__content-bottom-wrapper {
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
  padding-left: var(--page-edge, 1.6rem);
  padding-right: var(--page-edge, 1.6rem);
}

/* ---------- 2 · Top area · MOBILE (<750): single stacked column ----------
   Newsletter on top (not collapsible), then the link columns + Country
   stacked. .footer__blocks-wrapper stays a normal block so its children
   stack; display:contents is desktop-only. */
.footer .footer__content-top {
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  padding-bottom: 4rem;
}

.footer .footer-block--newsletter {
  order: -1; /* stock DOM has the newsletter AFTER the columns */
  margin: 0;
  display: block; /* undo Dawn's flex row */
  text-align: left;
}

.footer .footer__blocks-wrapper.grid {
  display: block; /* mobile: stacked rows */
  margin: 0;
}

.footer .footer__blocks-wrapper .footer-block.grid__item {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

/* ---------- 3 · Top area · DESKTOP/TABLET (>=750): ONE even grid ----------
   display:contents dissolves the wrapper so its children join the
   newsletter as siblings in a single grid — true even distribution. */
@media screen and (min-width: 750px) {
  .footer .footer__content-top {
    display: grid;
    grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr));
    column-gap: 4rem;
    row-gap: 4rem;
    align-items: start;
    padding-bottom: 6.4rem;
  }

  .footer .footer__blocks-wrapper.grid {
    display: contents;
  }

  /* Newsletter → the first (widest) track, top row. */
  .footer .footer-block--newsletter {
    grid-column: 1;
    grid-row: 1;
    max-width: 42rem;
  }
}

@media screen and (min-width: 990px) {
  .footer .footer__content-top {
    grid-template-columns: 1.6fr repeat(3, minmax(0, 1fr));
    column-gap: 6.4rem;
  }
}

/* ---------- 4 · Link lists ---------- */
.footer .footer-block__details-content {
  margin: 0;
}

.footer .footer-block__details-content > li {
  margin: 0;
  padding: 0;
  line-height: 1.7;
}

/* Un-underline by default (beats Dawn's .link base underline);
   underline only on hover. Softer rest colour → full on hover. */
.footer .footer-block__details-content .list-menu__item--link,
.footer .footer-block__details-content .footer-link--pending {
  display: inline-block;
  padding: 0;
  font-size: 1.4rem;
  text-decoration: none;
  color: rgba(var(--color-foreground), 0.68);
  transition: color var(--duration-short, 0.1s) ease;
}

.footer .footer-block__details-content a.list-menu__item--link:hover,
.footer .footer-block__details-content a.list-menu__item--link:focus-visible {
  color: rgb(var(--color-foreground));
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

/* Label with no URL yet — looks like a link, not interactive. */
.footer .footer-link--pending {
  cursor: default;
}

/* Cookie settings — Consentmo cookie-preferences re-open trigger. Rendered as a
   <button> (Consentmo needs the JS handler) but must read identically to the
   sibling footer links: strip the UA button chrome and inherit the link type.
   Resting colour / size come from .list-menu__item--link above; that hover rule
   is <a>-qualified, so the button gets its own hover/focus underline. */
.footer .footer-block__details-content button.footer-cookie-settings {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-weight: inherit;
  font-size: 1.4rem;
  letter-spacing: inherit;
  line-height: inherit;
  text-align: start;
  cursor: pointer;
}

.footer .footer-block__details-content button.footer-cookie-settings:hover,
.footer .footer-block__details-content button.footer-cookie-settings:focus-visible {
  color: rgb(var(--color-foreground));
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

@media (prefers-reduced-motion: reduce) {
  .footer .footer-block__details-content .list-menu__item--link {
    transition: none;
  }
}

/* ---------- 5 · Collapsible columns (mobile accordion / desktop static) ----
   Chevron is a CSS ::after on the summary (NO svg in the DOM → no collision
   with Dawn's `summary .icon-caret { position:absolute }`, which was the
   giant-arrow bug). */
.footer .footer-collapsible {
  margin: 0;
}

.footer .footer-collapsible__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.2rem;
  list-style: none;
}

.footer .footer-collapsible__summary::-webkit-details-marker {
  display: none;
}

.footer .footer-collapsible .footer-block__heading {
  margin: 0; /* heading typography itself lives in lebra-overrides.css */
}

/* ::after chevron — a rotated border square, hidden on desktop. */
.footer .footer-collapsible__summary::after {
  content: "";
  display: none;
  width: 0.8rem;
  height: 0.8rem;
  flex-shrink: 0;
  margin-right: 0.3rem;
  border-right: 0.1rem solid rgba(var(--color-foreground), 0.55);
  border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.55);
  transform: rotate(45deg); /* points down = closed */
  transition: transform var(--duration-short, 0.1s) ease;
}

.footer .footer-collapsible[open] .footer-collapsible__summary::after {
  transform: rotate(-135deg); /* points up = open */
}

@media (prefers-reduced-motion: reduce) {
  .footer .footer-collapsible__summary::after {
    transition: none;
  }
}

/* Desktop/tablet: always open (JS holds [open]); summary inert; no chevron. */
@media screen and (min-width: 750px) {
  .footer .footer-collapsible__summary {
    pointer-events: none;
    cursor: default;
    margin-bottom: 1.6rem; /* gap between heading and the list */
  }
}

/* Mobile: accordion rows — hairline dividers, >=44px tap target, chevron. */
@media screen and (max-width: 749px) {
  .footer .footer-collapsible__summary {
    cursor: pointer;
    min-height: 4.4rem;
    padding: 0.8rem 0;
    border-top: 0.1rem solid rgba(var(--color-foreground), 0.12);
  }

  .footer .footer-collapsible__summary::after {
    display: block;
  }

  .footer .footer-collapsible > .footer-block__details-content {
    padding: 0.4rem 0 1.6rem;
  }

  /* Close the last row of the column stack with a hairline. */
  .footer .footer__blocks-wrapper .footer-block:last-child {
    border-bottom: 0.1rem solid rgba(var(--color-foreground), 0.12);
  }
}

/* ---------- 6 · Country column (plain heading, not collapsible) ---------- */
@media screen and (min-width: 750px) {
  .footer .footer-block--country .footer-block__heading {
    margin-bottom: 1.6rem;
  }
}

@media screen and (max-width: 749px) {
  /* Read as a row in the stack, but always-visible (single short element). */
  .footer .footer-block--country {
    border-top: 0.1rem solid rgba(var(--color-foreground), 0.12);
  }

  .footer .footer-block--country .footer-block__heading {
    min-height: 4.4rem;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0.8rem 0;
  }

  .footer .footer-block--country .footer__country {
    padding-bottom: 1.6rem;
  }
}

/* Globe + "International" note — muted, sized to a list row. */
.footer .footer__country-note {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 1.4rem;
  line-height: 1.7;
  color: rgba(var(--color-foreground), 0.62);
}

.footer .footer__country-globe {
  display: inline-flex;
  width: 1.6rem;
  height: 1.6rem;
}

.footer .footer__country-globe svg,
.footer .footer__country-globe .icon {
  width: 100%;
  height: 100%;
}

/* When Markets exist later, Dawn's <localization-form> renders here —
   left-align it to the column (Dawn centers it by default). */
.footer .footer-block--country .localization-form {
  margin: 0;
  justify-content: flex-start;
}

.footer .footer-block--country .localization-form__select {
  padding-left: 0;
}

/* ---------- 7 · Newsletter polish (DOM untouched; field/button full-width
   rules already in lebra-overrides.css — only refinements here) ---------- */
.footer .footer-block__newsletter {
  text-align: left;
}

.footer .footer-block__newsletter .footer__newsletter {
  justify-content: flex-start;
}

/* Calm, hairline full-width subscribe button. */
.footer .newsletter-form__button-full {
  min-height: 4.8rem;
  font-size: 1.2rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Field: quiet hairline; brand 0 radius inherited from the brand layer. */
.footer .footer-block__newsletter .field {
  border-color: rgba(var(--color-foreground), 0.25);
}

.footer .footer-block__newsletter .field:focus-within {
  border-color: rgb(var(--color-foreground));
}

/* ---------- 8 · Social icons — ONE row, left-aligned, under newsletter ---- */
.footer .footer__list-social.list-social {
  flex-wrap: nowrap;
  justify-content: flex-start;
  margin-top: 2.4rem;
}

/* First icon flush with the newsletter's left edge (kills the default pad). */
.footer .footer__list-social .list-social__item:first-child .list-social__link {
  padding-left: 0;
}

/* Facebook placeholder — visible but not interactive. */
.footer .footer__list-social .list-social__link--placeholder {
  cursor: default;
}

.footer .footer__list-social .list-social__link--placeholder:hover .icon {
  transform: none;
}

/* ---------- 9 · Bottom bar — centered copyright + legal only ----------
   Localization moved up to the Country column; payment removed in Liquid.
   Only the centered copyright/legal wrapper renders. */
.footer .footer__content-bottom {
  padding-top: 3.2rem;
}

.footer .footer__content-bottom-wrapper {
  justify-content: center;
}

.footer .footer__copyright {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  column-gap: 2rem;
  row-gap: 0.8rem;
  margin: 0;
  text-align: center;
}

.footer .footer-legal-lebra {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  column-gap: 2rem;
  row-gap: 0.8rem;
  margin: 0;
}

.footer .footer__copyright .copyright__content {
  font-size: 1.1rem;
  letter-spacing: 0.04em;
  color: rgba(var(--color-foreground), 0.7);
}

/* Legal links: soft, no underline, hover-underline. */
.footer .footer-legal-lebra a,
.footer .footer__copyright .copyright__content a {
  color: rgba(var(--color-foreground), 0.62);
  text-decoration: none;
  transition: color var(--duration-short, 0.1s) ease;
}

.footer .footer-legal-lebra a:hover,
.footer .footer-legal-lebra a:focus-visible,
.footer .footer__copyright .copyright__content a:hover {
  color: rgb(var(--color-foreground));
  text-decoration: underline;
  text-underline-offset: 0.3rem;
}

/* Pending legal label (no URL yet) — plain, not a link. */
.footer .footer-legal-lebra .footer-link--pending {
  color: rgba(var(--color-foreground), 0.62);
  cursor: default;
}

@media (prefers-reduced-motion: reduce) {
  .footer .footer-legal-lebra a,
  .footer .footer__copyright .copyright__content a {
    transition: none;
  }
}