/* ==========================================================================
   De Paviljoenhoeve — finalize.css
   Finalisatie-laag bovenop de geporte Webflow-site. Alle nieuwe componenten,
   volledig in de bestaande designtaal: hergebruikt de site-swatches
   (--swatch--*), de maatschaal (--size--*), radii en section-spacing.
   Namespace: alles begint met .pav- zodat het nooit botst met Webflow-classes.
   ========================================================================== */

/* ---- icon utility -------------------------------------------------------- */
.pav-ic { width: 1.5rem; height: 1.5rem; display: inline-block; flex: none;
  vertical-align: middle; color: inherit; }
.pav-ic svg, svg.pav-ic { width: 100%; height: 100%; display: block; }

/* button with a leading icon (keeps .button's look, adds inline-flex) */
.button.pav-btn, a.button.pav-btn {
  display: inline-flex; align-items: center; gap: var(--size--0-5rem);
  text-decoration: none;
}
.button.pav-btn .pav-ic { width: 1.15rem; height: 1.15rem; }

/* ==========================================================================
   PRICE BOARD  (het prijslijst-bord — hero-variant + full-variant)
   ========================================================================== */
.pav-board {
  background-color: var(--swatch--light-2);
  border: 1px solid var(--swatch--light-border);
  border-radius: var(--radius--main);
  padding: var(--size--2rem) var(--size--2-5rem);
  box-shadow: 0 1px 0 var(--swatch--light-border), 0 24px 48px -32px #3532332e;
}
.pav-board__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--size--1rem); flex-wrap: wrap;
  padding-bottom: var(--size--1rem); margin-bottom: var(--size--1-5rem);
  border-bottom: 1px solid var(--swatch--light-border);
}
.pav-board__eyebrow {
  display: inline-flex; align-items: center; gap: var(--size--0-5rem);
  font-weight: 700; font-size: var(--size--0-75rem); letter-spacing: .08em;
  text-transform: uppercase; color: var(--swatch--brand-2);
}
.pav-board__eyebrow .pav-ic { width: 1.1rem; height: 1.1rem; }
.pav-board__meta { font-size: var(--size--0-75rem); color: var(--swatch--dark);
  opacity: .7; }
.pav-board__cols { display: grid; grid-template-columns: 1fr 1fr;
  gap: var(--size--2rem) var(--size--2-5rem); }
.pav-board__group + .pav-board__group { }
.pav-board__group-head {
  display: flex; align-items: center; gap: var(--size--0-75rem);
  margin-bottom: var(--size--1rem);
}
.pav-board__group-head .pav-ic { width: 1.6rem; height: 1.6rem;
  color: var(--swatch--brand-2); }
.pav-board__group-head.is-onion .pav-ic { color: #e0a52b; }
.pav-board__group-title { font-weight: 700; }
.pav-board__sub + .pav-board__sub { margin-top: var(--size--1-25rem); }
.pav-board__sub-label {
  font-weight: 700; font-size: var(--size--0-75rem); letter-spacing: .04em;
  text-transform: uppercase; color: var(--swatch--dark); opacity: .6;
  margin-bottom: var(--size--0-5rem);
}
.pav-board__row {
  display: flex; align-items: baseline; gap: var(--size--0-75rem);
  padding: var(--size--0-375rem) 0;
}
.pav-board__maat { color: var(--swatch--dark); opacity: .9; white-space: nowrap; }
.pav-board__unit { opacity: .55; font-size: .82em; font-weight: 400; }
.pav-board__leader { flex: 1 1 auto; border-bottom: 2px dotted #35323340;
  transform: translateY(-.28em); min-width: 1rem; }
.pav-board__price { font-weight: 700; color: var(--swatch--dark);
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.pav-board__foot { margin-top: var(--size--1-5rem);
  padding-top: var(--size--1rem); border-top: 1px solid var(--swatch--light-border);
  display: flex; align-items: center; gap: var(--size--1rem) var(--size--1-5rem);
  flex-wrap: wrap; }
.pav-board__note { font-size: var(--size--0-875rem, .875rem);
  color: var(--swatch--dark); opacity: .7; }
.pav-link {
  display: inline-flex; align-items: center; gap: var(--size--0-375rem);
  color: var(--swatch--brand-2); font-weight: 700;
  text-decoration: underline; text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
}
.pav-link .pav-ic { width: 1.05rem; height: 1.05rem; transition: transform .2s; }
.pav-link:hover .pav-ic { transform: translateX(3px); }

/* full-variant: bredere kolommen, gecentreerd op leesbare breedte */
.pav-board.is-full { padding: var(--size--2-5rem) var(--size--3rem);
  max-width: 52rem; margin-left: auto; margin-right: auto; }
.pav-board.is-full .pav-board__cols { gap: var(--size--2-5rem) var(--size--3rem); }
.pav-board__group-desc { color: var(--swatch--dark); opacity: .75;
  margin-bottom: var(--size--1rem); }

@media (max-width: 767px) {
  .pav-board { padding: var(--size--1-5rem); }
  .pav-board__cols { grid-template-columns: 1fr; gap: var(--size--1-5rem); }
}

/* ==========================================================================
   HERO SPLIT  (hello links, prijslijst-bord rechts)
   ========================================================================== */
.pav-hero { padding-bottom: 0; display: flex; flex-direction: column; }
.pav-hero__grid {
  display: grid; grid-template-columns: 1.05fr 1fr;
  gap: var(--size--3rem) var(--size--4rem); align-items: center;
}
.pav-hero__hello { display: flex; flex-direction: column;
  align-items: flex-start; gap: var(--size--1-5rem); text-align: left; }
.pav-hero__intro { max-width: 34rem; }
.pav-hero__actions { display: flex; flex-wrap: wrap; gap: var(--size--1rem);
  align-items: center; }
.pav-btn-ghost {
  display: inline-flex; align-items: center; gap: var(--size--0-5rem);
  padding: var(--size--1-25rem) var(--size--2rem); border-radius: var(--radius--main);
  background: var(--swatch--transparent); border: 1.5px solid #3532333a;
  color: var(--swatch--dark); font-weight: 600; transition: border-color .2s, background-color .2s;
}
.pav-btn-ghost:hover { border-color: var(--swatch--dark); background: #35323310; }
.pav-btn-ghost .pav-ic { width: 1.15rem; height: 1.15rem; color: var(--swatch--brand-2); }
.pav-trust { display: flex; flex-direction: column; gap: var(--size--0-75rem);
  margin-top: var(--size--0-5rem); }
.pav-trust__label { font-size: var(--size--0-75rem); letter-spacing: .04em;
  text-transform: uppercase; color: var(--swatch--dark); opacity: .55; font-weight: 700; }
.pav-trust__logos { display: flex; align-items: center; flex-wrap: wrap;
  gap: var(--size--1-5rem); opacity: .8; }
.pav-trust__logos .g_fw_logo-embed { height: 1.75rem; width: auto; }
.pav-trust__logos svg { height: 100%; width: auto; }

/* fotoband onder de hero: in de container, hele foto zichtbaar (geen crop) */
.pav-photoband { width: 100%; max-width: var(--container--main);
  margin: var(--section-space--main) auto 0; }
.pav-photoband img { width: 100%; height: auto; display: block;
  border-radius: var(--radius--main); }

@media (max-width: 991px) {
  .pav-hero__grid { grid-template-columns: 1fr; gap: var(--size--2-5rem); }
  .pav-hero__intro { max-width: none; }
}
/* mobile: lead the hero with the team photo, full-bleed at the top */
@media (max-width: 767px) {
  .pav-hero { padding-top: 0; }
  .pav-photoband { order: -1; width: 100vw; max-width: none;
    margin: 0 0 var(--size--2rem) 50%; transform: translateX(-50%); }
  .pav-photoband img { border-radius: 0; }
}

/* ==========================================================================
   COUNTERS  (custom count-up)
   ========================================================================== */
.pav-count { font-variant-numeric: tabular-nums; }
/* smaller + heavier than the default .number (2.5rem/700) so the stat reads tighter */
.h-numbers_grid .pav-count { font-size: var(--size--2rem); font-weight: 800;
  letter-spacing: -0.01em; }
.h-numbers_item .icon-embed-large .pav-ic { width: 100%; height: 100%; }

/* ==========================================================================
   FEATURE (1/1) + CARD GRID (1/4, 1/2)
   ========================================================================== */
.pav-feature {
  display: grid; grid-template-columns: 1.15fr 1fr; overflow: hidden;
  background-color: var(--swatch--light-2); border: 1px solid var(--swatch--light-border);
  border-radius: var(--radius--main);
}
.pav-feature__media { position: relative; min-height: 18rem; }
.pav-feature__media img { position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; }
.pav-feature__badge {
  position: absolute; top: var(--size--1rem); left: var(--size--1rem);
  display: inline-flex; align-items: center; gap: var(--size--0-5rem);
  padding: var(--size--0-5rem) var(--size--1rem); border-radius: var(--radius--round);
  background: var(--swatch--light-1); color: var(--swatch--dark);
  font-weight: 700; font-size: var(--size--0-75rem);
}
.pav-feature__badge .pav-ic { width: 1.05rem; height: 1.05rem; color: var(--swatch--brand-2); }
.pav-feature__body { padding: var(--size--2-5rem);
  display: flex; flex-direction: column; align-items: flex-start;
  justify-content: center; gap: var(--size--1rem); }
.pav-feature__facts { display: flex; flex-wrap: wrap; gap: var(--size--0-75rem) var(--size--1-5rem);
  margin: var(--size--0-25rem) 0 var(--size--0-5rem); }
.pav-fact { display: inline-flex; align-items: center; gap: var(--size--0-5rem);
  color: var(--swatch--dark); opacity: .85; }
.pav-fact .pav-ic { width: 1.2rem; height: 1.2rem; color: var(--swatch--brand-2); }
.pav-fact--link { opacity: 1; color: var(--swatch--brand-2); font-weight: 700; }

/* centered page header (huisverkoop, and reused elsewhere) */
.pav-pagehead { max-width: 46rem; margin: 0 auto; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: var(--size--1-25rem); }
.pav-pagehead__facts { display: flex; flex-wrap: wrap; justify-content: center;
  gap: var(--size--0-75rem) var(--size--1-5rem); margin-top: var(--size--0-5rem); }

/* neutralise the Webflow light-3 section band so the page reads as one cream
   surface (light-1); cards/features (light-2) provide the contrast instead */
.section_overzicht_items { background-color: transparent; }

.pav-cardgrid { display: grid; gap: var(--size--1-5rem); }
.pav-cardgrid.is-4 { grid-template-columns: repeat(4, 1fr); }
.pav-cardgrid.is-2 { grid-template-columns: repeat(2, 1fr); }
.pav-card {
  display: flex; flex-direction: column; align-items: flex-start;
  gap: var(--size--0-75rem); padding: var(--size--1-5rem);
  background-color: var(--swatch--light-2); border: 1px solid var(--swatch--light-border);
  border-radius: var(--radius--main); color: inherit;
  transition: transform .2s, border-color .2s, box-shadow .2s;
}
a.pav-card:hover { transform: translateY(-3px); border-color: #35323333;
  box-shadow: 0 20px 40px -30px #35323355; }
.pav-card__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 3rem; height: 3rem; border-radius: var(--radius--small);
  background: var(--swatch--light-1); color: var(--swatch--brand-2);
}
.pav-card__icon .pav-ic { width: 1.6rem; height: 1.6rem; }
.pav-card__title { font-weight: 700; }
.pav-card__text { color: var(--swatch--dark); opacity: .8; flex: 1 1 auto; }
.pav-card__more { display: inline-flex; align-items: center; gap: var(--size--0-375rem);
  color: var(--swatch--brand-2); font-weight: 700; margin-top: var(--size--0-25rem); }
.pav-card__more .pav-ic { width: 1.05rem; height: 1.05rem; transition: transform .2s; }
a.pav-card:hover .pav-card__more .pav-ic { transform: translateX(3px); }

/* locaties: 6 verkooppunten as a 1/2 grid (boerderij lifted to a 1/1 feature) */
.section_locaties .locaties_list { display: grid; grid-template-columns: 1fr 1fr;
  gap: var(--size--1-5rem); }
.pav-locaties-feature { margin-bottom: var(--size--2-5rem); }
.pav-locaties-title { margin-bottom: var(--size--1-5rem); text-align: center; }

/* "Ook leveren wij wekelijks bij" — clean, on-brand supply card */
.pav-supply { max-width: 54rem; margin: var(--section-space--small) auto 0; }
.pav-supply__head { text-align: center; margin-bottom: var(--size--1-5rem); }
.pav-supply__card { display: flex; align-items: center; justify-content: center;
  gap: var(--size--1-25rem) var(--size--2rem); flex-wrap: wrap;
  background-color: var(--swatch--light-2); border: 1px solid var(--swatch--light-border);
  border-radius: var(--radius--main); padding: var(--size--1-5rem) var(--size--2rem); }
.pav-supply__logo { flex: none; background: #fff; border: 1px solid var(--swatch--light-border);
  border-radius: var(--radius--small); padding: var(--size--0-625rem, .625rem) var(--size--1rem);
  display: inline-flex; align-items: center; }
.pav-supply__logo img { height: 2.25rem; width: auto; display: block; }
.pav-supply__places { display: flex; flex-wrap: wrap; gap: var(--size--0-5rem); justify-content: center; }
.pav-chip { display: inline-flex; align-items: center; gap: var(--size--0-375rem);
  background-color: var(--swatch--light-1); border: 1px solid var(--swatch--light-border);
  border-radius: var(--radius--round); padding: var(--size--0-375rem) var(--size--0-875rem, .875rem);
  font-weight: 600; color: var(--swatch--dark); font-size: var(--size--0-875rem, .875rem); }
.pav-chip .pav-ic { width: .95rem; height: .95rem; color: var(--swatch--brand-2); }

@media (max-width: 991px) {
  .pav-feature { grid-template-columns: 1fr; }
  .pav-feature__media { min-height: 15rem; }
  .pav-cardgrid.is-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .section_locaties .locaties_list { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .pav-cardgrid.is-4, .pav-cardgrid.is-2 { grid-template-columns: 1fr; }
}

/* ==========================================================================
   CONTACT  (2-koloms: gegevens-kaart + kaart)
   ========================================================================== */
.pav-contact-grid { display: grid; grid-template-columns: 0.85fr 1.15fr;
  gap: var(--size--2-5rem); align-items: stretch; margin-top: var(--section-space--small); }
.pav-contact-card { background-color: var(--swatch--light-2);
  border: 1px solid var(--swatch--light-border); border-radius: var(--radius--main);
  padding: var(--size--2rem); display: flex; flex-direction: column; gap: var(--size--2rem); }
.pav-contact-block { display: flex; flex-direction: column; gap: var(--size--0-75rem); }
.pav-contact-block .pav-footer__title { margin-bottom: var(--size--0-25rem); }
.pav-contact-map { border-radius: var(--radius--main); overflow: hidden;
  min-height: 26rem; border: 1px solid var(--swatch--light-border); }
.pav-contact-map iframe { width: 100%; height: 100%; min-height: 26rem; display: block; border: 0; }
@media (max-width: 860px) {
  .pav-contact-grid { grid-template-columns: 1fr; }
  .pav-contact-map { min-height: 20rem; }
  .pav-contact-map iframe { min-height: 20rem; }
}

/* ==========================================================================
   HUISVERKOOP  (zo koop je bij ons + slim aanbod)
   ========================================================================== */
.pav-step__label { font-size: var(--size--0-75rem); font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: var(--swatch--brand-2); opacity: .8; }
.pav-aanbod { display: grid; grid-template-columns: 1fr 1fr;
  gap: var(--size--2rem) var(--size--3rem); }
.pav-aanbod__item { display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--size--1rem); padding: var(--size--0-75rem) 0;
  border-bottom: 1px solid var(--swatch--light-border); }
.pav-aanbod__naam { font-weight: 700; color: var(--swatch--dark); white-space: nowrap; }
.pav-aanbod__desc { color: var(--swatch--dark); opacity: .7; text-align: right; }
.pav-aanbod__more { margin-top: var(--size--1rem); }
@media (max-width: 767px) { .pav-aanbod { grid-template-columns: 1fr; gap: var(--size--1-5rem); } }

/* ==========================================================================
   BEWAARTIPS  (tip-cards + uien-callout)
   ========================================================================== */
.pav-tip { gap: var(--size--0-625rem, .625rem); }
.pav-tip__head { display: flex; align-items: center; justify-content: space-between;
  width: 100%; gap: var(--size--0-75rem); }
.pav-tip__num { font-size: var(--size--0-75rem); font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: var(--swatch--brand-2); opacity: .8; }
.pav-tips-note { display: flex; gap: var(--size--1rem); align-items: flex-start;
  background-color: var(--swatch--light-2); border: 1px solid var(--swatch--light-border);
  border-left: 4px solid var(--swatch--brand); border-radius: var(--radius--main);
  padding: var(--size--1-5rem) var(--size--2rem); }
.pav-tips-note .pav-ic { width: 1.9rem; height: 1.9rem; color: #e0a52b; flex: none; margin-top: .15rem; }
.pav-tips-note h3 { margin-bottom: var(--size--0-25rem); }
.pav-tips-outro { color: var(--swatch--dark); opacity: .8; text-align: center;
  font-style: italic; }

/* ==========================================================================
   FAQ  (native accordion, GEO-friendly)
   ========================================================================== */
.pav-faq { max-width: 48rem; margin: 0 auto; display: flex; flex-direction: column;
  gap: var(--size--0-75rem); }
.pav-faq__item { background-color: var(--swatch--light-2);
  border: 1px solid var(--swatch--light-border); border-radius: var(--radius--main); }
.pav-faq__q { cursor: pointer; list-style: none; display: flex; align-items: center;
  justify-content: space-between; gap: var(--size--1rem);
  padding: var(--size--1-25rem) var(--size--1-5rem); font-weight: 700;
  color: var(--swatch--dark); }
.pav-faq__q::-webkit-details-marker { display: none; }
.pav-faq__q .pav-ic { flex: none; width: 1.4rem; height: 1.4rem;
  color: var(--swatch--brand-2); transition: transform .2s; }
.pav-faq__item[open] .pav-faq__q .pav-ic { transform: rotate(45deg); }
.pav-faq__a { padding: 0 var(--size--1-5rem) var(--size--1-25rem);
  color: var(--swatch--dark); opacity: .85; }
.pav-faq__a a { color: var(--swatch--brand-2); font-weight: 600;
  text-decoration: underline; text-underline-offset: 2px; }

/* ==========================================================================
   END CTA  (warme afsluit-band)
   ========================================================================== */
.pav-cta { position: relative; overflow: hidden;
  background-color: var(--swatch--brand);
  border-radius: var(--radius--main); color: var(--swatch--dark);
  padding: var(--size--4rem) var(--size--2-5rem); text-align: center; }
.pav-cta__motif { position: absolute; pointer-events: none; color: #35323314; }
.pav-cta__motif.is-1 { right: -1.5rem; bottom: -2.5rem; width: 12rem; height: 12rem; }
.pav-cta__motif.is-2 { left: -1.5rem; top: -2rem; width: 8rem; height: 8rem; transform: rotate(-12deg); }
.pav-cta__inner { position: relative; max-width: 40rem; margin: 0 auto;
  display: flex; flex-direction: column; align-items: center; gap: var(--size--1-25rem); }
.pav-cta__actions { display: flex; flex-wrap: wrap; gap: var(--size--1rem);
  align-items: center; justify-content: center; }
.pav-cta .button { background-color: var(--swatch--dark); color: var(--swatch--light-1); }
.pav-cta .button:hover { background-color: #2b2b2b; }
.pav-cta__phone { display: inline-flex; align-items: center; gap: var(--size--0-5rem);
  color: var(--swatch--dark); font-weight: 700; }
.pav-cta__phone .pav-ic { width: 1.2rem; height: 1.2rem; }

/* ==========================================================================
   WERKWIJZE TIMELINE  (horizontale 'van grond tot mond'-reis)
   ========================================================================== */
.pav-tl { position: relative; }
.pav-tl__top { display: flex; align-items: center; justify-content: space-between;
  gap: var(--size--1rem); margin-bottom: var(--size--1-5rem); }
.pav-tl__progress { flex: 1 1 auto; height: 6px; background-color: var(--swatch--light-2);
  border: 1px solid var(--swatch--light-border); border-radius: var(--radius--round); overflow: hidden; }
.pav-tl__progress-bar { height: 100%; width: 100%; background-color: var(--swatch--brand);
  border-radius: var(--radius--round); transform-origin: left; transform: scaleX(0.06);
  transition: transform .15s ease-out; }
.pav-tl__nav { display: flex; gap: var(--size--0-5rem); flex: none; }
.pav-tl__btn { width: 2.75rem; height: 2.75rem; border-radius: var(--radius--round);
  background-color: var(--swatch--light-2); border: 1px solid var(--swatch--light-border);
  color: var(--swatch--dark); display: inline-flex; align-items: center; justify-content: center;
  transition: background-color .2s, color .2s, opacity .2s; }
.pav-tl__btn:hover:not(:disabled) { background-color: var(--swatch--brand); }
.pav-tl__btn:disabled { opacity: .35; cursor: default; }
.pav-tl__btn .pav-ic { width: 1.3rem; height: 1.3rem; }
.pav-tl__btn.is-prev .pav-ic { transform: scaleX(-1); }
.pav-tl__scroller { display: flex; gap: var(--size--1-5rem); overflow-x: auto;
  scroll-snap-type: x proximity; padding-bottom: var(--size--1rem);
  scrollbar-width: none; -ms-overflow-style: none; }
.pav-tl__scroller::-webkit-scrollbar { display: none; }
.pav-tl__card { position: relative; flex: 0 0 clamp(15rem, 76vw, 20rem);
  scroll-snap-align: start; background-color: var(--swatch--light-2);
  border: 1px solid var(--swatch--light-border); border-radius: var(--radius--main);
  padding: var(--size--1-75rem, 1.75rem) var(--size--1-5rem); display: flex;
  flex-direction: column; gap: var(--size--0-625rem, .625rem); overflow: hidden; }
.pav-tl__card::before { content: ""; position: absolute; left: 0; right: 0;
  top: calc(var(--size--1-75rem, 1.75rem) + 1.6rem); height: 2px;
  background-image: repeating-linear-gradient(to right, #35323330 0 6px, transparent 6px 13px); }
.pav-tl__num { position: absolute; top: -.75rem; right: .25rem; font-size: 5.5rem;
  font-weight: 800; line-height: 1; color: #3532330f; font-variant-numeric: tabular-nums;
  pointer-events: none; z-index: 0; }
.pav-tl__stage { position: relative; z-index: 1; width: 3.25rem; height: 3.25rem;
  border-radius: var(--radius--round); background-color: var(--swatch--light-1);
  border: 1px solid var(--swatch--light-border);
  color: var(--swatch--brand-2); display: inline-flex; align-items: center; justify-content: center; }
.pav-tl__stage .pav-ic { width: 1.75rem; height: 1.75rem; }
.pav-tl__eyebrow { position: relative; z-index: 1; font-size: var(--size--0-75rem);
  font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--swatch--brand-2);
  margin-top: var(--size--0-25rem); }
.pav-tl__card h3 { position: relative; z-index: 1; }
.pav-tl__text { position: relative; z-index: 1; color: var(--swatch--dark); opacity: .82; }
.pav-tl__hint { margin-top: var(--size--0-75rem); font-size: var(--size--0-75rem);
  color: var(--swatch--dark); opacity: .5; display: flex; align-items: center; gap: var(--size--0-375rem); }
.pav-tl__hint .pav-ic { width: 1rem; height: 1rem; }
@media (max-width: 767px) { .pav-tl__num { font-size: 4.5rem; } }

/* ==========================================================================
   FOOTER  (4 kolommen + bottom bar)
   ========================================================================== */
.pav-footer { background-color: var(--swatch--light-2);
  border-top: 1px solid var(--swatch--light-border); }
/* neutralise the Webflow footer_wrapper card-grid so our grid + bottom bar stack */
.pav-footer .footer_wrapper { display: block; background-color: transparent;
  border-radius: 0; }
.pav-footer__grid { display: grid;
  grid-template-columns: 1.5fr 1fr 1.2fr 1.15fr; gap: var(--size--2-5rem);
  padding-bottom: var(--size--2-5rem); }
.pav-footer__brand { display: flex; flex-direction: column;
  align-items: flex-start; gap: var(--size--1rem); }
.pav-footer__logo { height: 3rem; width: auto; }
.pav-footer__tag { color: var(--swatch--dark); opacity: .75; max-width: 22rem; }
.pav-footer__title { font-weight: 700; font-size: var(--size--0-75rem);
  letter-spacing: .06em; text-transform: uppercase; color: var(--swatch--dark);
  opacity: .55; margin-bottom: var(--size--1rem); }
.pav-footer__col > * + * { margin-top: 0; }
.pav-footer__nav { display: flex; flex-direction: column;
  gap: var(--size--0-625rem, .625rem); align-items: flex-start; }
.pav-footer .pav-footer__nav a { color: var(--swatch--dark); font-weight: 600;
  width: fit-content; text-decoration: none; white-space: nowrap;
  border-bottom: 1.5px solid transparent; transition: color .2s, border-color .2s; }
.pav-footer .pav-footer__nav a:hover { color: var(--swatch--brand-2); border-color: var(--swatch--brand-2); }
.pav-footer__list { display: flex; flex-direction: column; gap: var(--size--0-75rem); }
.pav-footer__item { display: inline-flex; align-items: flex-start; gap: var(--size--0-625rem, .625rem);
  color: var(--swatch--dark); }
.pav-footer__item .pav-ic { width: 1.25rem; height: 1.25rem; color: var(--swatch--brand-2);
  flex: none; margin-top: .1rem; }
a.pav-footer__item:hover { color: var(--swatch--brand-2); }
.pav-footer__hours-row { display: flex; justify-content: space-between;
  gap: var(--size--1rem); color: var(--swatch--dark); }
.pav-footer__hours-row dt { opacity: .8; }
.pav-footer__hours-row dd { font-weight: 600; margin: 0; white-space: nowrap; }
.pav-footer__hours-row.is-closed dd { opacity: .55; font-weight: 500; }
.pav-footer__social { display: flex; gap: var(--size--0-75rem); margin-top: var(--size--1rem); }
.pav-footer__social a { display: inline-flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; border-radius: var(--radius--round);
  background: var(--swatch--light-1); color: var(--swatch--dark); transition: color .2s, background-color .2s; }
.pav-footer__social a:hover { color: var(--swatch--light-1); background: var(--swatch--brand-2); }
.pav-footer__social .pav-ic { width: 1.35rem; height: 1.35rem; }
.pav-footer__bottom { border-top: 1px solid var(--swatch--light-border);
  padding: var(--size--1-25rem) 0; display: flex; flex-wrap: wrap;
  align-items: center; justify-content: space-between; gap: var(--size--0-75rem); }
.pav-footer__bottom p { font-size: var(--size--0-875rem, .875rem); color: var(--swatch--dark); opacity: .7; }
.pav-footer__legal { display: flex; flex-wrap: wrap; gap: var(--size--0-75rem) var(--size--1-5rem); }
.pav-footer__legal a { font-size: var(--size--0-875rem, .875rem); color: var(--swatch--dark);
  opacity: .7; text-decoration: underline; text-underline-offset: 2px; }
.pav-footer__legal a:hover { opacity: 1; color: var(--swatch--brand-2); }

@media (max-width: 991px) {
  .pav-footer__grid { grid-template-columns: 1fr 1fr; gap: var(--size--2rem); }
  .pav-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .pav-footer__grid { grid-template-columns: 1fr; }
  .pav-footer__bottom { flex-direction: column; align-items: flex-start; }
}
