/* ==========================================================================
   Gaivota — ontwerpvariabelen
   Waarden komen 1 op 1 uit de Elementor-kit van gaivota.nl (Default Kit, post 7).
   ========================================================================== */

/* Oskar staat bij Adobe Fonts. Kit wkr4bjo is dezelfde kit als op gaivota.nl en bevat
   de gewichten 100 t/m 600 (de oude kit mtg0lum had alleen 200, 400 en 600).
   17-9-2026: koppen op 100, zoals live. */
@import url("https://use.typekit.net/wkr4bjo.css");

/* Marcellus staat in het thema zelf. */
@font-face {
	font-family: "Marcellus";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/marcellus-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Marcellus";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/marcellus-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	/* Kleuren */
	--gv-navy: #001C55;        /* Primary  */
	--gv-taupe: #BAA68D;       /* Secundary */
	--gv-tekst: #04173B;       /* Text */
	--gv-accent: #01040B;      /* Accent */
	--gv-wit: #FFFFFF;
	--gv-lijn: #BAA68D;

	/* Uit de nieuwe opzet (lite-site juni 2026) */
	--gv-navy-diep: #001642;
	--gv-papier: #F7F5F1;          /* warme band */
	--gv-taupe-zacht: #CDBFA6;     /* taupe op navy */
	--gv-taupe-tekst: #827462;     /* taupe voor kleine tekst op licht, 4,5:1 (WCAG 1.4.3) */
	--gv-lijn-licht: #E6E1D8;
	--gv-lijn-navy: rgba(255, 255, 255, .22);
	--gv-tekst-zacht: #5C6470;

	/* Lettertypes */
	--gv-font-kop: "oskar", "Marcellus", Georgia, serif;
	--gv-font-tekst: "Marcellus", Georgia, "Times New Roman", serif;
	--gv-kop-gewicht: 100;

	/* Typografie — exact de kit-waarden */
	/* 17-9-2026: schaal kleiner voor een exclusiever beeld; lopende tekst blijft minimaal 16px. */
	--gv-h1: clamp(2.4rem, 4.6vw, 5.2rem);
	--gv-h2: clamp(1.8rem, 3.1vw, 3.4rem);
	--gv-h3: clamp(1.1rem, 1.3vw, 1.3rem);
	--gv-body: 1rem;
	--gv-body-groot: clamp(1.05rem, 1.2vw, 1.15rem);
	--gv-knop: .9rem;
	--gv-subtitel: 1rem;
	--gv-kleine-titel: 1rem;
	--gv-menu: 15px;

	/* Ritme. Deze waarden zijn te wijzigen onder Site-instellingen > Vormgeving. */
	/* 17-9-2026: ritme strakker, in lijn met de nieuwe opzet (was 30vh / 20vh / 10vh). */
	--gv-ritme: clamp(7rem, 18vh, 11rem);          /* standaardruimte onder een sectie */
	--gv-ritme-mobiel: 5rem;
	--gv-ritme-compact: clamp(5rem, 11vh, 7.5rem); /* voor secties die dichter op elkaar staan */
	--gv-ritme-compact-mobiel: 4rem;
	--gv-ritme-eerste: clamp(3.5rem, 8vh, 6rem);   /* ruimte boven de eerste sectie */
	--gv-ritme-eerste-mobiel: 3rem;

	--gv-blok: 5rem;                   /* ruimte binnen een kadersectie */
	--gv-blok-klein: 4rem;
	--gv-blok-mobiel-boven: 0rem;
	--gv-blok-mobiel-onder: 2rem;
	--gv-kop-boven: 12rem;             /* ruimte binnen een kopsectie */
	--gv-kop-onder: 8rem;
	--gv-kop-mobiel-boven: 6rem;
	--gv-kop-mobiel-onder: 2rem;

	--gv-marge-zij: clamp(2rem, 4vw, 5rem); /* marge links en rechts */
	--gv-marge-zij-smal: clamp(1.5rem, 3.2vw, 4rem);
	--gv-marge-zij-mobiel: 1rem;
	--gv-kolom-gat: min(10vw, 8rem);   /* gat tussen twee kolommen */
	--gv-kolom-gat-mobiel: 3rem;
	--gv-plak-offset: 160px;           /* meelopende kolom */
	--gv-breedte-header: 1600px;
	--gv-breedte-footer: 1380px;
	--gv-breedte-inhoud: 1440px;      /* maximale breedte van tekst en beelden */
	--gv-raster-gat: clamp(2.5rem, 6vw, 6rem); /* vaste ruimte tussen twee kolommen, overal gelijk */
	--gv-leesbreedte: 36rem;          /* maximale regellengte van lopende tekst */
	--gv-band: clamp(4.5rem, 11vh, 7.5rem);   /* ruimte binnen een gekleurde band */
	--gv-h-header: 75px;           /* logo 55px + 10px boven en onder */
	--gv-logo-h: 55px;
	--gv-radius: 0;              /* 17-9-2026: beelden en kaarten overal recht, zoals de grote beelden */

	/* Hoogtes uit de kit-custom-CSS */
	--gv-h-header-sm: 4rem;
	--gv-h-header-md: 6.5rem;
	--gv-h-header-lg: 9.6rem;
	--gv-h-secondary-sm: 2rem;
	--gv-h-secondary-md: 3rem;
	--gv-h-secondary-lg: 4.875rem;
	--gv-h-accent: 2rem;
}

@media (max-width: 1024px) {
	:root {
		--gv-h1: 3rem;
		--gv-h2: 2.4rem;
	}
}

@media (max-width: 767px) {
	:root {
		--gv-h1: 2.3rem;
		--gv-h2: 1.85rem;
		--gv-h3: 1.15rem;
		--gv-body: 1rem;
		--gv-body-groot: 1rem;
		--gv-knop: .9rem;
		--gv-subtitel: .9rem;
		--gv-kleine-titel: 1rem;
		--gv-kolom-gat: var(--gv-kolom-gat-mobiel);
	}
}