/*
Theme Name: De Gevulde Waterkruik
Theme URI: https://prikr.io
Author: prikr
Author URI: https://prikr.io
Description: Fundament child theme for degevuldewaterkruik.nl — Figma-specific overrides.
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Template: fundament
Text Domain: de-gevulde-waterkruik
*/

/* ─────────────────────────────────────────────────────────────
 * Brand-derived CSS custom properties.
 * hero-one overlay picks up the site's dark-muted colour instead of
 * the parent theme's default neutral gray.
 * ───────────────────────────────────────────────────────────── */
:root {
  --hero-one-overlay-from: rgb(var(--bg-surface-dark-muted) / 0.95);
  --hero-one-overlay-to:   rgb(var(--bg-surface-dark-muted) / 0.2);
}

/* ─────────────────────────────────────────────────────────────
 * Block-level overrides — Figma design system alignment.
 * Parent theme stays untouched so other Fundament sites keep their
 * approved visuals; overrides only apply on this site.
 * ───────────────────────────────────────────────────────────── */

/* text-slider — DM Sans marquee per Figma */
.wp-block-fundament-text-slider .fd-text-slider__word {
  font-family: "DM Sans", var(--font-heading), sans-serif !important;
  font-weight: 500 !important;
}

/* hero-two — image-right variant gets asymmetric padding (text side 80, image side 48).
   render.php uses md:flex-row-reverse when imagePosition='right'. */
@media (min-width: 768px) {
  .wp-block-fundament-hero-two .fundament-card.md\:flex-row-reverse {
    padding: 48px 48px 48px 80px !important;
  }
}

/* archive-cards — square/rounded arrow avatar via btn-radius token.
   Parent defaults to rounded-full (100%). Figma expects site's btn-radius. */
.wp-block-fundament-archive-cards .archive-cards__arrow {
  border-radius: var(--btn-radius, 9999px) !important;
}

/* values — value cards have no border per Figma. Parent adds a subtle border. */
.wp-block-fundament-values .fundament-card {
  border: 0 !important;
}

/* contact-one — form panel is rounded per Figma (Waterkruik shows rounded-[20px]) */
.wp-block-fundament-contact-one .content-grid > .fundament-island--light {
  border-radius: var(--image-radius) !important;
  overflow: hidden;
}

/* Menu pill — waterkruik brand: 8px afronding op desktop, 28px gap tussen items.
   (24px outer-padding zit vanaf v1.8.34 in de parent theme; item-padding zetten
    we hier op 0 zodat de gap-only spacing pattern werkt.) */
@media (min-width: 1024px) {
  .fd-nav__pill {
    border-radius: 8px !important;
    gap: 28px !important;
  }
  .fd-nav__pill > div > a {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Footer bottom band: witte copyright/legal-tekst op waterkruik.
   Parent zet inline `color: gray-400` op de inner wrapper, dus target ook
   descendants met !important om die inline-style te overrulen. */
.fd-footer__bottom,
.fd-footer__bottom *,
.fd-footer__bottom a {
  color: #ffffff !important;
}

/* Language switcher — witte achtergrond + gouden tekst per brand.
   Parent renders inline `background: var(--bg-page)` (cream) + `color: var(--text-heading)`;
   override to white bg + button-secondary tan text color. */
.fd-lang-switch__current,
.fd-lang-switch__list {
  background: #ffffff !important;
}
.fd-lang-switch__current,
.fd-lang-switch__option {
  color: #b18041 !important;
}

/* H5 = 20px on desktop per Figma. Parent uses text-xl (24px) on 7 blocks;
   override here so waterkruik matches its design system without regressing
   approved Fundament sites. */
@media (min-width: 768px) {
  .wp-block-fundament-values h5,
  .wp-block-fundament-service-cards h5,
  .wp-block-fundament-contact-one h5,
  .wp-block-fundament-contact-two h5,
  .wp-block-fundament-team h5,
  .wp-block-fundament-archive-cards h3,
  .wp-block-fundament-approach [data-approach-toggle] span {
    font-size: 20px !important;
    line-height: 1.3 !important;
  }
}