:root{
  --eco-blue:#4197CB;
  --eco-yellow:#FFC32A;
  --eco-gray:#4b5563;
  --ink:#0b2f55;
  --muted:#4b5563;
  --card:#fff;

  --font-family-base:'Karla-Regular';
  --font-size-base:16px;
  --font-weight-regular:300;
  --line-height-base:1.65;
  --letter-spacing-body:.02em;
}

@font-face{
  font-family:'Karla-Regular';
  src:url('../fonts/Karla-Regular.ttf') format('opentype');
  font-weight:200;
  font-style:normal;
  font-display:swap;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family:var(--font-family-base);
  font-size:var(--font-size-base);
  font-weight:var(--font-weight-regular);
  color:var(--eco-gray);
  background:#f7f8fb;
  letter-spacing:var(--letter-spacing-body);
  line-height:var(--line-height-base);
}

.container-footer{
  width:min(98vw,1500px);
  margin:0 auto;
}

/* --- footer layout --- */
.eco-footer-footer{
  position:relative;
  margin-top:auto;
  background:linear-gradient(#fff 0 170px, var(--eco-blue) 170px 100%);
}
.eco-footer__top-footer{ position:relative; z-index:2; padding:18px 0 0; }

.camp-grid-footer{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:32px;
  align-items:stretch;
  justify-content:center;
  padding-bottom:36px;
}

.camp-card-footer{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.4rem;
  justify-content:flex-start;
  min-height:220px;
  background:#f4f1ee;
  border-radius:10px;
  text-align:center;
  padding:16px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.camp-card-footer:hover{ transform:translateY(-6px); cursor:pointer; }
.hours-card-footer:hover{ transform:none; box-shadow:none; cursor:default; }

.camp-card-footer h3{ margin:0 0 6px; font-weight:600; color:var(--eco-blue); font-size:1.2rem; letter-spacing:var(--letter-spacing-body); }
.camp-card-footer h3 button{
  display:flex; align-items:center; justify-content:center;
  gap:.5rem; width:100%; background:none; border:0; padding:0;
  color:inherit; font:inherit; cursor:default;
}
.camp-card-footer h3 button:focus-visible{ outline:2px solid var(--eco-yellow); outline-offset:4px; border-radius:6px; }
.camp-card-footer h3 button span:first-child{ flex:0 1 auto; }

.camp-toggle-indicator{ display:none; position:relative; width:18px; height:18px; }
.camp-toggle-indicator::before{
  content:"";
  position:absolute; top:50%; left:50%;
  width:10px; height:10px;
  border-right:2px solid var(--eco-blue);
  border-bottom:2px solid var(--eco-blue);
  transform:translate(-50%,-50%) rotate(45deg);
  transition:transform .2s ease;
}
.camp-card-footer[data-open="true"] .camp-toggle-indicator::before{ transform:translate(-50%,-50%) rotate(-135deg); }

.camp-info-footer{ display:flex; flex-direction:column; align-items:center; gap:.35rem; width:100%; }
.camp-addr-footer{ display:block; font-weight:300; font-size:1.1rem; color:var(--eco-blue); text-decoration:none; }
.camp-phone-footer{ display:inline-block; margin-top:auto; padding-top:.5rem; color:var(--eco-blue); text-decoration:none; font-weight:600; font-size:1.1rem; }
.note-footer{ display:block; margin:.35rem 0; color:var(--eco-blue); font-weight:300; }

 


.eco-footer__bar-footer{
  position:relative;
  z-index:3;
  margin-top:0px;
  padding:12px 0;
  min-height:70px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:var(--eco-yellow);
}
.eco-footer__bar-footer::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:70px; background:var(--eco-yellow); z-index:-1;
  pointer-events:none;
  display:none;
}

.eco-footer__bar-inner-footer{
  position:relative;
  z-index:7;
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  color:#fff;
  transform:none;
  width:100%;
  padding:0 24px;
}

.eco-footer__social-wrap{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:flex-end;
  gap:14px;
  margin-left:auto;
}

.footer-copy{
  display:block;
  margin:0;
  text-align:left;
  color:#fff;
  font-weight:400;
  font-size:1.15rem;
  line-height:1.4;
  letter-spacing:var(--letter-spacing-body);
  flex:1 1 auto;
  width:auto;
  white-space:nowrap;
}

.connect-footer{
  margin:0;
  font-weight:300;
  letter-spacing:var(--letter-spacing-body);
  font-size:1.15rem;
  display:block;
}

.social-footer{ display:flex; gap:14px; }
.ic-footer{
  display:grid; place-items:center; width:46px; height:46px; border-radius:8px;
  background:#fff; color:#0b2f55; text-decoration:none;
  box-shadow:0 6px 14px rgba(0,0,0,.12);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
  border:2px solid transparent;
}
.ic-footer svg{ width:24px; height:24px; }
.ic-footer:hover{ transform:translateY(-6px) scale(1.08); box-shadow:0 14px 24px rgba(0,0,0,.22); background:var(--eco-yellow); border-color:#fff; }

/* Responsive layout */
@media (max-width:900px){
  .camp-grid-footer{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .eco-footer__bar-footer{
    background:var(--eco-blue);
    padding:0;
  }
  .eco-footer__bar-footer::after{ display:block; }
  .eco-footer__bar-inner-footer{
    background:transparent;
    padding:0;
    flex-wrap:wrap;
    justify-content:center;
  }
  .eco-footer__social-wrap{
    justify-content:center;
    margin-left:0;
    flex-wrap:wrap;
    order:1;
  }
  .connect-footer{ display:block; }
  .footer-copy{
    order:2;
    margin:16px 0 0;
    text-align:center;
    flex-basis:100%;
    width:100%;
    white-space:normal;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:12px 16px;
    background:var(--eco-yellow);
  }
}
@media (max-width:560px){
  .camp-grid-footer{
    grid-template-columns:1fr;
    gap:20px;
    padding-bottom:20px;
  }
  .camp-card-footer{ min-height:auto; height:auto; align-items:center; justify-content:flex-start; text-align:center; }
  .camp-card-footer h3{ margin:0 0 6px; font-weight:600; color:var(--eco-blue); font-size:1.2rem; letter-spacing:var(--letter-spacing-body); }
  .camp-card-footer h3 button{ justify-content:center; padding-right:0; }
  .eco-footer__bar-footer{
    margin-top:0px;
    overflow:visible;
    padding:0;
    display:block;
  }
  .eco-footer__bar-inner-footer{
    flex-direction:column;
    gap:12px;
    transform:none;
    justify-content:center;
    align-items:center;
    text-align:center;
  }
  .eco-footer__social-wrap{
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:12px;
  }
  .eco-footer__social-wrap .connect-footer{
    font-size:1.3rem;
    margin-bottom:6px;
  }
  .eco-footer__bar-footer::after{ display:none; }
  .eco-footer-footer{ background:var(--eco-blue); }
  .social-footer{
    gap:14px;
    margin-top:0;
    justify-content:center;
    flex-wrap:wrap;
  }
  .ic-footer{ width:52px; height:52px; }
  .ic-footer svg{ width:28px; height:28px; }
  .footer-copy{
    position:static;
    display:flex;
    margin:0;
    width:100%;
    min-height:54px;
    padding:12px 16px;
    background:var(--eco-yellow);
    align-items:center;
    justify-content:center;
    text-align:center;
    font-size:1.05rem;
    white-space:normal;
  }
}

/* Accordion states (mobile) */
.footer-js .camp-toggle-indicator{ display:inline-flex; }
.footer-js [data-campus-card] .camp-info-footer{ display:none; }
.footer-js [data-campus-card][data-open="true"] .camp-info-footer{ display:flex; }
.footer-js .camp-card-footer h3 button{ cursor:pointer; }
.footer-js .camp-card-footer h3 button span:first-child{ flex:1; text-align:center; }
.footer-js .hours-card-footer .camp-info-footer{ display:flex; }

.hours-card-footer{
  width:100%;
  box-sizing:border-box;
  margin:0;
  background:#f4f1ee;
  color:var(--eco-blue);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:.4rem;
  padding:16px;
  border-radius:14px;
  box-shadow:0 10px 22px rgba(13,38,76,.10);
}

.hours-card-footer h3{
  margin:0;
  font-weight:600;
  color:var(--eco-blue);
  font-size:1.2rem;
  letter-spacing:var(--letter-spacing-body);
}


.hours-card-footer p{
  margin:0;
  color:var(--eco-blue);
  text-align:center;
  font-weight:300;
  line-height:1.65;
  white-space:normal;
  font-size:1.1rem;
}

@media (min-width:901px){
  .hours-card-footer{
    background:transparent;
    box-shadow:none;
  }
}

@media (max-width:560px){
  .hours-card-footer{
    border-radius:14px;
    margin:0;
    max-width:100%;
    box-shadow:0 10px 22px rgba(13,38,76,.12);
  }
}

.eco-footer__top-footer{
  width:100%;
  overflow:hidden;
}