/* =========================================================================
   CAREY — CENTRALE HUISSTIJL-CSS
   =========================================================================
   WAAR PLAKKEN:
   WordPress-dashboard → Weergave → Customizer → Extra CSS
   (of: GeneratePress → Customizer → Additional CSS)

   Dit ene blok stuurt de opmaak van AL je pagina's aan: de homepage-secties
   én de drie juridische pagina's. Je hoeft styling dus niet per pagina te
   herhalen. Als je later een kleur of lettertype wilt aanpassen, doe je dat
   hier op één plek.
   ========================================================================= */

/* ---- 1. Manrope-lettertype laden (Google Fonts) ---- */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap');

/* ---- 2. Merkkleuren als variabelen ---- */
:root {
  --carey-sage:    #7D9773;  /* sage green  — primaire merkkleur / knoppen   */
  --carey-sage-dk: #6A8461;  /* donkerder sage — hover                       */
  --carey-blue:    #4D7395;  /* structural blue — accenten / B2B             */
  --carey-navy:    #031421;  /* dark navy — donkere secties / tekst          */
  --carey-ink:     #031421;  /* hoofd-tekstkleur                            */
  --carey-mute:    #44514f;  /* gedempte tekst — donkerder voor meer contrast */
  --carey-line:    #e6e9e6;  /* lijntjes / randen                          */
  --carey-bg-soft: #f7f6f4;  /* zachte achtergrond                         */
}

/* ---- 3. Juridische pagina's (privacy / voorwaarden / herroeping) ---- */
/* Wikkel de inhoud van die pagina's in <div class="carey-legal"> ... </div> */
.carey-legal {
  font-family: 'Manrope', system-ui, sans-serif;
  color: var(--carey-ink);
  max-width: 820px;
  margin: 0 auto;
  padding: 40px 24px 80px;
  line-height: 1.7;
  font-size: 16px;
}
.carey-legal .carey-kicker {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--carey-sage);
  margin-bottom: 8px;
}
.carey-legal h1 {
  font-family: 'Manrope', sans-serif;
  font-weight: 800;
  font-size: clamp(28px, 4vw, 40px);
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--carey-navy);
  margin: 0 0 8px;
}
.carey-legal .carey-meta {
  font-size: 13px;
  color: var(--carey-mute);
  margin-bottom: 28px;
}
.carey-legal h2 {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
  font-size: 20px;
  color: var(--carey-navy);
  margin: 36px 0 12px;
  padding-top: 8px;
}
.carey-legal h3 {
  font-weight: 700;
  font-size: 16px;
  color: var(--carey-navy);
  margin: 24px 0 8px;
}
.carey-legal p { margin: 0 0 16px; }
.carey-legal ul { margin: 0 0 16px; padding-left: 22px; }
.carey-legal li { margin-bottom: 8px; }
.carey-legal a { color: var(--carey-blue); text-decoration: underline; }
.carey-legal strong { font-weight: 700; color: var(--carey-navy); }

/* Tabellen in de juridische pagina's */
.carey-legal table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 24px;
  font-size: 14px;
}
.carey-legal th {
  text-align: left;
  background: var(--carey-bg-soft);
  color: var(--carey-navy);
  font-weight: 700;
  padding: 10px 12px;
  border: 1px solid var(--carey-line);
}
.carey-legal td {
  padding: 10px 12px;
  border: 1px solid var(--carey-line);
  vertical-align: top;
}

/* Conceptbanner bovenaan de juridische pagina's */
.carey-concept {
  background: #fdf6e8;
  border: 1px solid #e7d4a8;
  border-left: 4px solid #d9a441;
  border-radius: 8px;
  padding: 14px 18px;
  margin: 0 0 32px;
  font-size: 14px;
  color: #6b5320;
}
.carey-concept strong { color: #6b5320; }

/* Modelformulier-blok (herroeping) */
.carey-form-box {
  background: var(--carey-bg-soft);
  border: 1px solid var(--carey-line);
  border-radius: 12px;
  padding: 28px;
  margin: 24px 0;
}
.carey-form-box .carey-fill {
  display: block;
  border-bottom: 1px solid #c2c9c2;
  min-height: 28px;
  margin: 6px 0 18px;
}

/* ---- 4. Hulpklassen voor de Elementor-homepage ---- */
/* sage knop — geef een Elementor-knop de CSS-class: carey-btn            */
.carey-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  background: var(--carey-sage) !important;
  color: #fff !important;
  padding: 14px 28px !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  box-shadow: 0 4px 20px rgba(125,151,115,0.3);
  transition: all 0.2s;
}
.carey-btn:hover {
  background: var(--carey-sage-dk) !important;
  transform: translateY(-1px);
}

/* eyebrow-label boven sectietitels — class: carey-eyebrow */
.carey-eyebrow {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--carey-sage);
  margin-bottom: 10px;
}

/* trust-pill rij onder de hero — class: carey-trust */
.carey-trust span { color: var(--carey-mute); font-size: 12px; font-weight: 500; }

/* Mobiel */
@media (max-width: 640px) {
  .carey-legal { padding: 24px 16px 60px; }
  .carey-legal table { font-size: 13px; }
  .carey-legal th, .carey-legal td { padding: 8px; }
}