/*!
Theme Name: twentyfoursevenstudio
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Custom blank theme for Elementor Pro setup - Twenty-Four Seven Studio
Version: 1.0.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: twentyfoursevenstudio
Tags: elementor-ready, blank-theme, custom

AANGEDAN: Dit thema is gestript voor optimaal gebruik met Elementor Pro.
Alle overbodige marges, kleuren en menu-stylings zijn verwijderd zodat 
Elementor Global Settings de volledige controle heeft.
*/

/*--------------------------------------------------------------
>>> INHOUDSOPGAVE:
----------------------------------------------------------------
1. Generic (Normalize & Box Sizing)
2. Elementor Reset (Cruciale nul-meting voor Elementor)
3. Base (Media & Basis elementen)
4. Utilities (Toegankelijkheid & WordPress core klasses)
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1. Generic
--------------------------------------------------------------*/

/* Normalize.css - Behoudt standaard browser consistentie 
   (Dit deel heb ik behouden omdat het bugs in o.a. Safari/Firefox voorkomt) */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}
main { display: block; }
hr { box-sizing: content-box; height: 0; overflow: visible; }
pre { font-family: monospace, monospace; font-size: 1em; }
a { background-color: transparent; }
abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; }
b, strong { font-weight: bolder; }
code, kbd, samp { font-family: monospace, monospace; font-size: 1em; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
img { border-style: none; }
button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; }
button, input { overflow: visible; }
button, select { text-transform: none; }
button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }
fieldset { padding: 0.35em 0.75em 0.625em; }
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; }
progress { vertical-align: baseline; }
textarea { overflow: auto; }
[type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; }
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }
[type="search"] { -webkit-appearance: textfield; outline-offset: -2px; }
[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }
details { display: block; }
summary { display: list-item; }
template { display: none; }
[hidden] { display: none; }

/* Box sizing - Extreem belangrijk voor correcte grid-layouts in Elementor */
*, *::before, *::after {
	box-sizing: inherit;
}
html {
	box-sizing: border-box;
}


/*--------------------------------------------------------------
2. Elementor Reset (De Nul-meting)
--------------------------------------------------------------*/

/* AANPASSING: Body en HTML strak getrokken. 
Verwijdert de standaard witte rand om je website heen en voorkomt 
horizontaal scrollen (een veelvoorkomend Elementor probleem).
*/
body, html {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	background: #fff; /* Elementor zal dit overschrijven indien ingesteld */
}

/* AANPASSING: Standaard marges van tekst-elementen verwijderd.
Hiermee voorkom je dat jouw Elementor-kolommen ineens extra hoog worden 
omdat het thema er onzichtbare ruimte (1.5em) onder zette.
Zet de typografie-instellingen (Brother-1816 en Novantique) in Elementor Global Settings!
*/
h1, h2, h3, h4, h5, h6, p, ul, ol, dl, figure, blockquote {
	margin: 0;
	padding: 0;
}

ul, ol {
	list-style: none; /* Elementor lists / icon lists handelen hun eigen styling af */
}

/* Verwijder hardcoded link kleuren. Elementor regelt je hover-statussen. */
a {
	color: inherit;
	text-decoration: none;
}
a:hover, a:focus, a:active {
	outline: 0;
}


/*--------------------------------------------------------------
3. Base (Media & Basis elementen)
--------------------------------------------------------------*/

/* AANPASSING: Zorgt ervoor dat iframes (Loom video's!) en embeds
nooit buiten hun Elementor container breken. 
*/
embed, iframe, object {
	max-width: 100%;
}

/* Afbeeldingen maken we responsive */
img {
	height: auto;
	max-width: 100%;
	display: block; /* Haalt het spook-randje (ghost margin) onder afbeeldingen weg */
}


/*--------------------------------------------------------------
4. Utilities (Behouden voor WordPress/Accessibility)
--------------------------------------------------------------*/

/* AANPASSING: Dit is behouden. Het verbergt tekst visueel, maar laat het 
leesbaar voor screen readers (blinden/slechtzienden). Elementor gebruikt 
deze class (.screen-reader-text) soms ook! 
*/
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Standaard WordPress uitlijning-klasses. Soms voegt WP dit toe als je 
toch de Gutenberg editor ergens gebruikt. Veilig om te laten staan, weegt niks. */
.alignleft { float: left; margin-right: 1.5em; margin-bottom: 1.5em; }
.alignright { float: right; margin-left: 1.5em; margin-bottom: 1.5em; }
.aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; margin-bottom: 1.5em; }