/* ═══════════════════════════════════════════════════════════════════════
   ThePetChef — Footer  v5.4.2
   BEM block: .pf  (PetchefFooter)
   All text / links editable via Appearance → Customise → ThePetChef Footer
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Design tokens (scoped so they only affect the footer) ──────── */
.pf {
  --pf-bg:      #2d4a3e;          /* brand dark green                */
  --pf-line:    rgba(255,255,255,.10);
  --pf-head:    #ffffff;
  --pf-text:    rgba(255,255,255,.65);
  --pf-link:    rgba(255,255,255,.58);
  --pf-link-h:  #ffffff;
  --pf-radius:  36px 36px 0 0;
  --pf-pad-x:   40px;
}

/* ── Base ───────────────────────────────────────────────────────── */
.pf {
  background:    var(--pf-bg);
  border-radius: var(--pf-radius);
  color:         var(--pf-text);
  font-family:   inherit;
}

.pf__wrap {
  max-width: 1240px;
  margin:    0 auto;
  padding:   0 var(--pf-pad-x);
}

/* ═══════════════════════════════════════════════════════════════════
   TRUST STRIP
   ═══════════════════════════════════════════════════════════════════ */
.pf__trust {
  padding-top: 36px;
}

.pf__trust-grid {
  display:               grid;
  grid-template-columns: repeat(4, 1fr);
}

/* Vertical divider between items */
.pf__trust-item {
  display:     flex;
  align-items: center;
  gap:         14px;
  padding:     0 28px 0 0;
}

.pf__trust-item + .pf__trust-item {
  border-left: 1px solid var(--pf-line);
  padding-left: 28px;
}

.pf__trust-icon {
  flex-shrink:     0;
  width:           38px;
  height:          38px;
  display:         flex;
  align-items:     center;
  justify-content: center;
  color:           var(--pf-head);
}

.pf__trust-icon svg {
  width:  22px;
  height: 22px;
}

.pf__trust-text {
  display:        flex;
  flex-direction: column;
  gap:            3px;
}

.pf__trust-text strong {
  font-size:   .83rem;
  font-weight: 700;
  color:       var(--pf-head);
  line-height: 1.2;
}

.pf__trust-text span {
  font-size:   .74rem;
  color:       var(--pf-text);
  line-height: 1.4;
}

/* Thin horizontal rule below the trust strip */
.pf__trust-line {
  height:     1px;
  background: var(--pf-line);
  margin:     28px var(--pf-pad-x) 0;
}

/* ═══════════════════════════════════════════════════════════════════
   MAIN COLUMNS
   ═══════════════════════════════════════════════════════════════════ */
.pf__body {
  padding: 36px 0 42px;
}

.pf__grid {
  display:               grid;
  grid-template-columns: 1.3fr 1fr 1fr 1.5fr;
  gap:                   0 44px;
  align-items:           start;
}

.pf__col-title {
  font-size:      .68rem;
  font-weight:    700;
  letter-spacing: .10em;
  text-transform: uppercase;
  color:          var(--pf-head);
  margin:         0 0 18px;
  padding:        0;
}

/* Nav menu columns */
.pf__menu {
  list-style: none !important;
  margin:     0    !important;
  padding:    0    !important;
}

.pf__menu > li {
  margin: 0 0 11px !important;
  padding: 0       !important;
}

.pf__menu > li::before,
.pf__menu > li::after {
  display: none !important;
}

.pf__menu a {
  font-size:   .84rem;
  color:       var(--pf-link);
  text-decoration: none;
  transition:  color .18s ease;
}

.pf__menu a:hover {
  color: var(--pf-link-h);
}

/* Store column */
.pf__store-list {
  list-style:     none;
  margin:         0;
  padding:        0;
  display:        flex;
  flex-direction: column;
  gap:            11px;
}

.pf__store-list li {
  display:     flex;
  align-items: flex-start;
  gap:         10px;
  font-size:   .84rem;
  color:       var(--pf-link);
  line-height: 1.5;
}

.pf__store-list li svg {
  width:      15px;
  height:     15px;
  flex-shrink: 0;
  margin-top: 3px;
  color:      rgba(255,255,255,.45);
}

.pf__store-list a {
  color:           var(--pf-link);
  text-decoration: none;
  transition:      color .18s ease;
}

.pf__store-list a:hover {
  color: var(--pf-link-h);
}

/* ═══════════════════════════════════════════════════════════════════
   BOTTOM BAR
   ═══════════════════════════════════════════════════════════════════ */
.pf__bottom {
  border-top: 1px solid var(--pf-line);
}

.pf__bottom-inner {
  display:     flex;
  align-items: center;
  gap:         28px;
  padding:     18px 0;
}

/* Social icons */
.pf__social {
  display:    flex;
  gap:        8px;
  flex-shrink: 0;
}

.pf__social-link {
  width:            34px;
  height:           34px;
  border-radius:    50%;
  border:           1px solid var(--pf-line);
  display:          flex;
  align-items:      center;
  justify-content:  center;
  color:            var(--pf-link);
  text-decoration:  none;
  transition:       color .18s ease, border-color .18s ease, background .18s ease;
}

.pf__social-link:hover {
  color:        var(--pf-head);
  border-color: rgba(255,255,255,.30);
  background:   rgba(255,255,255,.08);
}

.pf__social-link svg {
  width:  15px;
  height: 15px;
}

/* Copyright */
.pf__copy {
  font-size:   .78rem;
  color:       var(--pf-text);
  margin:      0;
  flex:        1;
  text-align:  center;
}

/* Legal links */
.pf__legal {
  display:    flex;
  gap:        20px;
  flex-shrink: 0;
}

.pf__legal a {
  font-size:       .78rem;
  color:           var(--pf-link);
  text-decoration: none;
  white-space:     nowrap;
  transition:      color .18s ease;
}

.pf__legal a:hover {
  color: var(--pf-link-h);
}

/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width:1100px) {
  .pf__grid {
    grid-template-columns: 1fr 1fr;
    row-gap: 32px;
  }
}

@media (max-width:900px) {
  .pf { --pf-radius: 26px 26px 0 0; --pf-pad-x: 28px; }
}

@media (max-width:768px) {
  .pf { --pf-radius: 22px 22px 0 0; --pf-pad-x: 20px; }

  /* Trust: 2-col on tablet */
  .pf__trust-grid {
    grid-template-columns: 1fr 1fr;
    row-gap: 22px;
  }

  /* Reset all left borders, add only between column pairs */
  .pf__trust-item + .pf__trust-item {
    border-left:  none;
    padding-left: 0;
  }
  .pf__trust-item:nth-child(2),
  .pf__trust-item:nth-child(4) {
    border-left:  1px solid var(--pf-line);
    padding-left: 24px;
  }

  /* Bottom bar wraps */
  .pf__bottom-inner {
    flex-wrap: wrap;
    gap:       14px;
    padding:   18px 0;
  }
  .pf__copy {
    text-align: left;
    order:      3;
    flex:       none;
    width:      100%;
  }
  .pf__legal {
    order:     4;
    flex-wrap: wrap;
    gap:       12px;
    width:     100%;
  }
}

@media (max-width:600px) {
  /* Trust: still 2-col — compact enough */
  .pf__trust-icon { width: 30px; height: 30px; }
  .pf__trust-icon svg { width: 18px; height: 18px; }

  /* Columns: 2-col on phone */
  .pf__grid {
    grid-template-columns: 1fr 1fr;
    gap: 26px 20px;
  }
}

@media (max-width:480px) {
  .pf { --pf-radius: 16px 16px 0 0; }

  /* Trust and columns both single-col on very small screens */
  .pf__trust-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .pf__trust-item + .pf__trust-item {
    border-left:  none !important;
    padding-left: 0    !important;
  }

  .pf__grid {
    grid-template-columns: 1fr;
  }
}