/* ==================================================
FOOTER WRAPPER
================================================== */

.site-footer {
  background: #4e9c76;
  color: #fff;
  padding: 70px var(--space-3) 30px;
}


/* ==================================================
GRID STRUCTUUR
================================================== */

.footer-inner {
  max-width: 1100px;
  margin: 0 auto;

  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1.2fr;
  gap: 50px;
}


/* ==================================================
ALGEMENE KOLOM-STYLING
================================================== */

.footer-col {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.footer-col h3 {
  font-size: 1.1rem;
  margin: 0;
  color: #fff;
}

.footer-col p,
.footer-col li,
.footer-col a {
  line-height: 1.35; /* compactere basis */
  color: #eaf3ef;
  margin: 0;
}


/* ==================================================
KOLom 1 — NAAM + COACHING + QUOTE
================================================== */

.footer-col-1 .footer-heading {
  display: flex;
  flex-direction: column;
  gap: 0; /* naam + coaching strak */
}

.footer-col-1 .footer-heading h3,
.footer-col-1 .footer-heading p {
  margin: 0;
  line-height: 1.2; /* super compact */
}

.footer-col-1 .footer-quote {
  margin-top: 12px; /* witregel */
  line-height: 1.25;
}


/* ==================================================
KOLom 2 — MENU
================================================== */

.footer-col-2 ul {
  list-style: none;
  padding: 0;
  margin-top: 8px; /* kleiner dan standaard */
}

.footer-col-2 li {
  margin-bottom: 4px; /* minder ruimte tussen items */
}

.footer-col-2 a {
  text-decoration: none;
  transition: .2s ease;
}

.footer-col-2 a:hover {
  opacity: 0.7;
}


/* ==================================================
KOLom 3 — AANBOD
================================================== */

.footer-col-3 ul {
  list-style: none;
  padding: 0;
  margin-top: 10px;
}

.footer-col-3 li {
  margin-bottom: 4px;
}


/* ==================================================
KOLom 4 — CONTACT + SOCIALS
================================================== */

.footer-col-4 p {
  margin: 0 0 4px 0; /* strak onder elkaar */
  line-height: 1.25;
}

.footer-socials {
  display: flex;
  gap: 12px;
  margin-top: 14px;
}

.social-icon svg {
  width: 26px;
  height: 26px;
  transition: .25s ease;
}

/* originele kleuren */
.social-icon.linkedin svg { fill: #0A66C2; }
.social-icon.instagram svg { fill: #E1306C; }

/* hover */
.social-icon:hover svg {
  transform: scale(1.12);
  opacity: 0.85;
}


/* ==================================================
FOOTER BOTTOM
================================================== */

.footer-bottom {
  text-align: center;
  margin-top: 30px;
  padding-top: 20px;

  border-top: 1px solid rgba(255,255,255,0.2);

  font-size: 0.85rem;
  color: #eaf3ef;
}


/* ==================================================
RESPONSIVE
================================================== */

@media (max-width: 900px) {
  .footer-inner {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
}

@media (max-width: 600px) {
  .footer-inner {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .footer-bottom==================================================
FOOTER
================================================== */

.site-footer{
  background:#4e9c76;
  color:#fff;
  padding:70px var(--space-3) 30px;
}


/* ==================================================
INNER GRID
================================================== */

.footer-inner{
  max-width:1100px;
  margin:0 auto;

  display:grid;
  grid-template-columns:1.3fr 1fr 1fr 1.2fr;
  gap:50px;
}


/* ==================================================
KOLOMMEN
================================================== */

.footer-col{
  display:flex;
  flex-direction:column;
  gap:10px;
}


.footer-col h3{
  font-size:1.1rem;
  margin-bottom:0;
  color:#fff;
}

.footer-col p:first-of-type{
  margin-top:0;
  font-size:0.95rem;
  line-height:1.6;
  color:#eaf3ef; /* iets zachter dan wit */
}


/* ==================================================
LIJSTEN
================================================== */

.footer-col ul{
  list-style:none;
  padding:0;
  margin-top:14px;
}


.footer-col li{
  margin-bottom:6px;
}


.footer-col a{
  text-decoration:none;
  color:#eaf3ef;
  transition:.2s ease;
}


.footer-col a:hover{
  opacity:0.7;
}


/* ==================================================
SOCIALS
================================================== */

.footer-socials{
  display:flex;
  gap:12px;
  margin-top:12px;
}


.social-icon svg{
  width:26px;
  height:26px;
  transition:.25s ease;
}


/* originele kleuren */
.social-icon.linkedin svg{
  fill:#0A66C2;
}

.social-icon.instagram svg{
  fill:#E1306C;
}


/* hover */
.social-icon:hover svg{
  transform:scale(1.12);
  opacity:0.85;
}


/* ==================================================
BOTTOM
================================================== */

.footer-bottom{
  text-align:center;
  margin-top:30px;
  padding-top:20px;

  border-top:1px solid rgba(255,255,255,0.2);

  font-size:0.85rem;
  color:#eaf3ef;
}


/* ==================================================
RESPONSIVE
================================================== */

@media(max-width:900px){

  .footer-inner{
    grid-template-columns:1fr 1fr;
    gap:40px;
  }

}

@media(max-width:600px){

  .footer-inner{
    grid-template-columns:1fr;
    gap:30px;
  }

  .footer-bottom{
    margin-top:30px;
  }

}
/* ============================================
KOLOM 1 — NAAM + COACHING + QUOTE
============================================ */

.footer-col-1 .footer-heading {
  display:flex;
  flex-direction:column;
  gap:0;
}

.footer-col-1 .footer-heading h3,
.footer-col-1 .footer-heading p {
  margin:0;
}

.footer-col-1 .footer-quote {
  margin-top:12px; /* witregel */
  line-height:1.4;
}


/* ============================================
KOLOM 2 — MENU (kleinere spacing)
============================================ */

.footer-col-2 ul {
  margin-top:8px; /* kleiner dan standaard */
}

.footer-col-2 li {
  margin-bottom:4px; /* minder ruimte tussen items */
}


/* ============================================
KOLOM 3 — AANBOD
============================================ */

.footer-col-3 ul {
  margin-top:10px;
}

.footer-col-3 li {
  margin-bottom:4px;
}


/* ============================================
KOLOM 4 — CONTACT
============================================ */

.footer-col-4 p {
  margin:0 0 4px 0; /* strak onder elkaar */
}

.footer-col-4 .footer-socials {
  margin-top:14px; /* nette ruimte boven socials */
}
/* ============================================
ALGEMEEN — compactere basis line-height
============================================ */
.footer-col p,
.footer-col li,
.footer-col a {
  line-height: 1.35; /* compacter dan 1.6 */
}


/* ============================================
KOLOM 1 — NAAM + COACHING + QUOTE
============================================ */
.footer-col-1 .footer-heading p {
  line-height: 1.2; /* super strak onder elkaar */
}

.footer-col-1 .footer-quote {
  line-height: 1.25; /* mooi compact maar leesbaar */
}


/* ============================================
KOLOM 2 — MENU
============================================ */
.footer-col-2 li {
  line-height: 1.25; /* minder ruimte tussen regels */
}


/* ============================================
KOLOM 3 — AANBOD
============================================ */
.footer-col-3 li {
  line-height: 1.25;
}


/* ============================================
KOLOM 4 — CONTACT
============================================ */
.footer-col-4 p {
  line-height: 1.0; /* strak onder elkaar */
}