/* Basisstijl van de publieke site. Kleuren en lettertypes komen uit het thema van de site
   (CSS-variabelen, zie ThemeStyle.razor). Een themapakket kan dit later aanvullen. */

*, *::before, *::after { box-sizing: border-box; }

body {
    margin: 0;
    font-family: var(--t-body-font);
    color: var(--t-text);
    background: var(--t-background);
    line-height: 1.6;
    overflow-wrap: break-word;
}

h1, h2, h3, h4, h5, h6 { font-family: var(--t-heading-font); line-height: 1.25; margin: 0 0 .5em; }
a { color: var(--t-primary); }
img { max-width: 100%; height: auto; }

.t-visually-hidden {
    position: absolute; width: 1px; height: 1px; overflow: hidden;
    clip: rect(0 0 0 0); white-space: nowrap;
}

.t-skip { position: absolute; left: -999px; }
.t-skip:focus { left: 1rem; top: 1rem; background: #fff; padding: .5rem 1rem; z-index: 10; }

/* Raster: 12 kolommen, mobiel eerst. */
.t-container { max-width: 1140px; margin: 0 auto; padding: 0 1rem; }
.t-container-full { padding: 0 1rem; }
.t-row { display: flex; flex-wrap: wrap; margin: 0 -1rem; }
.t-row > * { padding: 0 1rem; }
.t-col-1 { width: 8.3333%; } .t-col-2 { width: 16.6667%; } .t-col-3 { width: 25%; }
.t-col-4 { width: 33.3333%; } .t-col-5 { width: 41.6667%; } .t-col-6 { width: 50%; }
.t-col-7 { width: 58.3333%; } .t-col-8 { width: 66.6667%; } .t-col-9 { width: 75%; }
.t-col-10 { width: 83.3333%; } .t-col-11 { width: 91.6667%; } .t-col-12 { width: 100%; }

@media (min-width: 768px) {
    .t-col-md-1 { width: 8.3333%; } .t-col-md-2 { width: 16.6667%; } .t-col-md-3 { width: 25%; }
    .t-col-md-4 { width: 33.3333%; } .t-col-md-5 { width: 41.6667%; } .t-col-md-6 { width: 50%; }
    .t-col-md-7 { width: 58.3333%; } .t-col-md-8 { width: 66.6667%; } .t-col-md-9 { width: 75%; }
    .t-col-md-10 { width: 83.3333%; } .t-col-md-11 { width: 91.6667%; } .t-col-md-12 { width: 100%; }
}

@media (min-width: 1024px) {
    .t-col-lg-1 { width: 8.3333%; } .t-col-lg-2 { width: 16.6667%; } .t-col-lg-3 { width: 25%; }
    .t-col-lg-4 { width: 33.3333%; } .t-col-lg-5 { width: 41.6667%; } .t-col-lg-6 { width: 50%; }
    .t-col-lg-7 { width: 58.3333%; } .t-col-lg-8 { width: 66.6667%; } .t-col-lg-9 { width: 75%; }
    .t-col-lg-10 { width: 83.3333%; } .t-col-lg-11 { width: 91.6667%; } .t-col-lg-12 { width: 100%; }
}

/* Secties */
.t-section { background-size: cover; background-position: center; }
.t-pad-none { padding: 0; }
.t-pad-small { padding: 1.5rem 0; }
.t-pad-medium { padding: 3rem 0; }
.t-pad-large { padding: 5rem 0; }
.t-bg-primary { background-color: var(--t-primary); color: #fff; }
.t-bg-secondary { background-color: var(--t-secondary); color: #fff; }
.t-bg-light { background-color: #f4f5f7; }
.t-bg-dark { background-color: #1d2127; color: #fff; }
.t-bg-primary a, .t-bg-secondary a, .t-bg-dark a { color: inherit; }
/* Een balk met tekst en knop op één regel, gecentreerd (bv. "Start een nieuwe website"); op kleur een witte knop. */
.t-banner-line { margin: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .75rem 1.5rem; text-align: center; font-size: 1.3rem; font-weight: 600; }
:is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) a.t-button { background: #fff; color: var(--t-primary); border: 0; }
:is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) a.t-button:hover { filter: brightness(.95); }

.t-block + .t-block { margin-top: 1rem; }
.t-preview-notice { padding: 1rem 1.25rem; border: 2px dashed #c9a227; border-radius: 6px; background: #fffbea; color: #5c4400; font: 14px/1.5 system-ui, sans-serif; }
.t-subtitle { font-size: 1.15rem; opacity: .85; }
.t-image { margin: 0; }
.t-image figcaption { margin-top: .4rem; }
.t-image img { display: block; width: 100%; height: auto; }
.t-image-frame { position: relative; }
.t-image-buttons { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 1rem; }
.t-image-buttons .t-button { box-shadow: 0 2px 8px rgba(0, 0, 0, .25); }
/* Gecentreerde sectie: titels, tekst en knoppen in het midden. */
.t-align-center { text-align: center; }
.t-align-center :is(.t-heading-1, .t-heading-2, .t-heading-3) { justify-content: center; }
.t-image figcaption { font-size: .9rem; opacity: .75; }

/* Kop en voet */
.t-header { border-bottom: 1px solid #e5e7eb; background: var(--t-background); }
.t-header-inner { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; padding-top: 1rem; padding-bottom: 1rem; }
.t-brand { font-family: var(--t-heading-font); font-weight: 700; font-size: 1.25rem; text-decoration: none; color: var(--t-primary); margin-right: auto; }
.t-brand img { max-height: var(--t-logo-height, 48px); display: block; }
/* Bovenbalk boven de kop (keuze per site) */
.t-topbar { border-bottom: 1px solid rgba(0, 0, 0, .06); font-size: .8rem; }
.t-topbar-inner { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1.25rem; padding-top: .4rem; padding-bottom: .4rem; }
.t-topbar-list { list-style: none; margin: 0 0 0 auto; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; }
.t-topbar a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.t-topbar a:hover { color: var(--t-primary); }
.t-topbar svg { width: 14px; height: 14px; flex: none; }
/* Kop vast bovenaan bij het scrollen, en logo in het midden (keuzes per site) */
.t-header-sticky { position: sticky; top: 0; z-index: 50; }
/* Bovenbalk in de kop: tekst naast het logo (met een lijn ertussen), contact rechts. */
.t-header-with-bar .t-brand { margin-right: 0; }
.t-header-tagline { padding-left: 1rem; border-left: 1px solid #e0e0e0; font-size: .85rem; color: #999; }
.t-header-contact { margin-left: auto; font-size: .8rem; }
.t-header-contact .t-topbar-list { margin: 0; column-gap: 0; }
.t-header-contact .t-topbar-list li + li { border-left: 1px solid #d5d5d5; margin-left: .8rem; padding-left: .8rem; }
.t-header-contact a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.t-header-contact a:hover { color: var(--t-primary); }
.t-header-contact svg { width: 14px; height: 14px; flex: none; }
@media (max-width: 760px) {
    .t-header-tagline { display: none; }
    .t-header-contact { flex-basis: 100%; order: 5; }
    .t-header-contact .t-topbar-list { justify-content: flex-start; }
}
.t-header-centered .t-header-inner { justify-content: center; }
.t-header-centered .t-brand { margin-right: 0; flex-basis: 100%; display: flex; justify-content: center; }
.t-header-centered .t-nav ul { justify-content: center; }
.t-header-button { text-decoration: none; padding: .55rem 1.1rem; font-size: .9rem; white-space: nowrap; }
/* De mededeling boven de kop (module Mededeling). */
.t-announcement { font-size: .95rem; }
.t-announcement-inner { display: flex; align-items: center; gap: 1rem; padding-top: .55rem; padding-bottom: .55rem; }
.t-announcement p { margin: 0; flex: 1; text-align: center; }
.t-announcement a { color: inherit; font-weight: 600; }
.t-announcement-close { flex: none; text-decoration: none; opacity: .8; padding: 0 .25rem; }
.t-announcement-close:hover { opacity: 1; }
.t-announcement-brand { background: var(--t-primary); color: #fff; }
.t-announcement-info { background: #e8f1fb; color: #123a63; }
.t-announcement-important { background: #fdecc8; color: #6b3d00; }
/* Iconen van sociale media (kop, voet, blok). */
.t-social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.t-social a { display: inline-flex; align-items: center; gap: .4rem; color: inherit; text-decoration: none; opacity: .85; }
.t-social a:hover, .t-social a:focus-visible { opacity: 1; color: var(--t-primary); }
.t-social svg { flex: none; }
.t-topbar-social .t-social { gap: .5rem; }
.t-footer-social a:hover, .t-footer-social a:focus-visible { color: inherit; }
.t-social-block .t-social { gap: .9rem; }
.t-share { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
.t-share-title { margin: 0; font-weight: 600; }
/* Het vergrootglas naar de zoekpagina (module Zoeken). */
.t-header-search { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; color: var(--t-text); }
.t-header-search:hover, .t-header-search:focus-visible { color: var(--t-primary); background: color-mix(in srgb, var(--t-primary) 8%, transparent); }
.t-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 1rem; }
/* Een label breekt nooit af; bij plaatsgebrek schuift het hele item naar een volgende regel. */
.t-nav a { text-decoration: none; color: var(--t-text); white-space: nowrap; }
.t-nav a.active { color: var(--t-primary); font-weight: 600; }
.t-nav .t-has-children { position: relative; }
.t-nav .t-has-children > ul {
    display: none; position: absolute; top: 100%; left: -1rem; z-index: 20;
    flex-direction: column; flex-wrap: nowrap; gap: .5rem;
    width: max-content; min-width: 10rem; max-width: calc(100vw - 2rem);
    background: var(--t-background); padding: .75rem 1rem; border-radius: 6px; box-shadow: 0 8px 24px rgba(0,0,0,.12);
}
.t-nav .t-has-children:hover > ul, .t-nav .t-has-children:focus-within > ul { display: flex; }
/* Een derde niveau (bv. Games > EDCE > Maps) klapt naast zijn item uit; op een smal scherm staat het eronder, ingesprongen. */
.t-nav .t-has-children .t-has-children > ul { top: -.75rem; left: 100%; }
.t-nav .t-has-children .t-has-children > a::after { content: " \203A"; opacity: .6; }
@media (max-width: 767px) {
    .t-nav .t-has-children .t-has-children > ul { position: static; display: flex; box-shadow: none; padding: .25rem 0 .25rem .75rem; }
}
/* Mega-menu (instelling van de kop): één breed paneel onder de kop met een kolom per kind. */
.t-header-inner:has(.t-mega) { position: relative; }
.t-nav .t-mega { position: static; }
.t-nav .t-mega > .t-mega-panel {
    display: grid; position: absolute; left: 0; right: 0; top: 100%; z-index: 20;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1.25rem 2rem;
    background: var(--t-background); padding: 1.25rem 1.5rem; border-radius: 6px; box-shadow: 0 8px 24px rgba(0,0,0,.12);
    /* Dicht met een korte vertraging: wie de muis rustig of schuin naar een kolom beweegt, verliest het paneel niet. */
    visibility: hidden; opacity: 0; transition: opacity .15s ease .25s, visibility 0s linear .4s;
}
.t-nav .t-mega:hover > .t-mega-panel, .t-nav .t-mega:focus-within > .t-mega-panel { visibility: visible; opacity: 1; transition-delay: 0s; }
/* Een onzichtbare brug van het menu-item tot het paneel: de ruimte tussen beide (de onderrand van de kop) hoort bij het item. */
.t-nav .t-mega > a { position: relative; }
.t-nav .t-mega > a::after { content: ""; position: absolute; left: -1rem; right: -1rem; top: 100%; height: 3rem; }
.t-mega-column ul { display: flex; flex-direction: column; flex-wrap: nowrap; gap: .45rem; }
.t-mega-column a { white-space: normal; }
.t-mega-title { display: block; margin-bottom: .6rem; padding-bottom: .4rem; font-weight: 700; border-bottom: 1px solid color-mix(in srgb, var(--t-text) 15%, transparent); }
.t-mega-more { align-self: end; }
@media (max-width: 767px) {
    .t-nav .t-mega > .t-mega-panel { display: none; position: static; box-shadow: none; padding: .5rem 0 .5rem .75rem; gap: .75rem 1.5rem; }
    .t-nav .t-mega:hover > .t-mega-panel, .t-nav .t-mega:focus-within > .t-mega-panel { display: grid; }
    .t-nav .t-mega > a::after { content: none; }
}
/* Taalmenu: altijd rechts naast het logo; op smalle schermen zakt het menu eronder. */
@media (max-width: 767px) {
    .t-header-inner .t-brand { margin-right: auto; }
    .t-header-inner .t-nav { order: 3; flex-basis: 100%; }
}

/* Taalmenu */
.t-languages { position: relative; font-size: .9rem; }
.t-languages > summary {
    display: inline-flex; align-items: center; gap: .35rem; list-style: none; cursor: pointer;
    padding: .35rem .6rem; border: 1px solid #d5d9e0; border-radius: 4px; color: var(--t-text); user-select: none;
}
.t-languages > summary::-webkit-details-marker { display: none; }
.t-languages > summary::after {
    content: ""; width: .4rem; height: .4rem; margin-left: .15rem;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px);
}
.t-languages[open] > summary::after { transform: rotate(-135deg) translateY(-1px); }
.t-languages > summary:hover, .t-languages[open] > summary { border-color: var(--t-primary); color: var(--t-primary); }
.t-languages > summary:focus-visible { outline: 2px solid var(--t-primary); outline-offset: 2px; }
.t-languages nav {
    position: absolute; right: 0; top: calc(100% + .35rem); z-index: 20; min-width: 11rem;
    background: var(--t-background); border: 1px solid #e5e7eb; border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12); padding: .35rem 0;
}
.t-languages ul { list-style: none; margin: 0; padding: 0; }
.t-languages a {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: .5rem .9rem .5rem 1.6rem; text-decoration: none; color: var(--t-text); position: relative;
}
.t-languages a:hover, .t-languages a:focus-visible { background: #f3f5f8; color: var(--t-primary); }
.t-language-code { font-size: .75rem; opacity: .6; }
/* De actieve taal: vinkje, vet en in de hoofdkleur. */
.t-languages a.active { color: var(--t-primary); font-weight: 600; background: color-mix(in srgb, var(--t-primary) 8%, transparent); }
.t-languages a.active::before {
    content: ""; position: absolute; left: .7rem; top: 50%; width: .35rem; height: .65rem;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-60%) rotate(45deg);
}

/* Voet onderaan het scherm bij een korte pagina (keuze per site): de inhoud vult de ruimte. */
.t-site.t-footer-sticky { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
.t-site.t-footer-sticky > main { flex: 1 0 auto; }
.t-site.t-footer-sticky > .t-footer { flex-shrink: 0; }
.t-footer { margin-top: 3rem; padding: 2rem 0; border-top: 1px solid #e5e7eb; font-size: .9rem; }
.t-footer-columns { display: grid; gap: 1.5rem; grid-template-columns: 1fr; padding-bottom: 1.5rem; }
@media (min-width: 768px) {
    .t-footer-columns { grid-template-columns: 2fr 1fr 1fr; }
}
.t-footer h2 { font-size: 1rem; margin: 0 0 .5rem; }
.t-footer p { margin: 0 0 .35rem; }
.t-footer address { font-style: normal; }
.t-footer-linkcolumn ul, ul.t-footer-contactlinks { list-style: none; margin: 0; padding: 0; }
ul.t-footer-contactlinks { margin-top: .5rem; }
:is(.t-footer-linkcolumn, .t-footer-contactlinks) li { margin: .25rem 0; }
/* Links in de voet: zonder onderlijning, in de kolom met een driehoekje in de accentkleur ervoor. */
.t-footer :is(.t-footer-linkcolumn, .t-footer-links, .t-footer-contactlinks) a, .t-footer :is(.t-footer-linkcolumn, .t-footer-links, .t-footer-contactlinks) a:hover { text-decoration: none; }
:is(.t-footer-linkcolumn, .t-footer-contactlinks) a::before { content: ""; display: inline-block; margin: 0 8px 1px 2px;
    border-left: 5px solid var(--t-primary); border-top: 4px solid transparent; border-bottom: 4px solid transparent; }
.t-footer-bottom { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 1.5rem; }
.t-footer-bottom > span { opacity: .7; }
/* De vermelding ziet eruit als de ©-tekst ernaast: zelfde letter, grootte en kleur (ook de link). */
.t-footer-bottom > .t-powered { font: inherit; }
/* Op een eigen regel: volle breedte, uitgelijnd zoals gekozen */
.t-footer-bottom > .t-powered-line { flex-basis: 100%; }
.t-powered-line.t-powered-center { text-align: center; }
.t-powered-line.t-powered-right { text-align: right; }
/* Op de laatste regel: links meteen na ©, in het midden of helemaal rechts */
.t-footer-bottom > .t-powered-inline.t-powered-left { order: 1; }
.t-footer-bottom > .t-powered-inline.t-powered-center { order: 1; margin-inline: auto; }
.t-footer-bottom > .t-powered-inline.t-powered-right { order: 3; margin-left: auto; }
.t-footer-bottom > .t-footer-links { order: 2; }
.t-footer .t-footer-bottom .t-powered a { color: inherit; font: inherit; opacity: 1; text-decoration: underline; }
.t-footer .t-copyright a { color: inherit; text-decoration: none; font-weight: 600; }
.t-footer-links ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; }
.t-footer-links a { color: inherit; opacity: .85; }
.t-footer-links a:hover { opacity: 1; }

/* Kaarten: gedeeld door modules (medewerkers, diensten, nieuws). */
.t-cards { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 768px) {
    .t-cards-2, .t-cards-3, .t-cards-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
    .t-cards-3 { grid-template-columns: repeat(3, 1fr); }
    .t-cards-4 { grid-template-columns: repeat(4, 1fr); }
}
/* Rasteritems mogen smaller worden dan hun langste woord (dat breekt af, zie body). */
.t-cards > *, .t-blog-item > * { min-width: 0; }
.t-card { background: var(--t-background); border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; }
.t-card-image { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
/* Foto op een vrije kaart (bv. een paard): staand, met het onderwerp in beeld. */
.t-card-photo { aspect-ratio: 3 / 4; object-position: center top; }
.t-team-photo { aspect-ratio: 1 / 1; }
.t-card-body { padding: 1rem 1.25rem 1.25rem; }
.t-card-title { margin: 0 0 .25rem; font-size: 1.15rem; }
.t-card-subtitle { margin: 0 0 .75rem; color: var(--t-primary); font-weight: 600; font-size: .95rem; }
.t-card-text { font-size: .95rem; }
.t-card-links { list-style: none; padding: 0; margin: .75rem 0 0; display: flex; flex-wrap: wrap; gap: .75rem; font-size: .9rem; }
.t-card-more { margin: .75rem 0 0; font-weight: 600; }
.t-service-icon { width: 2.5rem; height: 2.5rem; color: var(--t-primary); margin-bottom: .5rem; }

/* Tijdlijn (module historiek) */
.t-timeline-list { list-style: none; margin: 0; padding: 0; border-left: 3px solid var(--t-primary); }
.t-timeline-item { position: relative; padding: 0 0 1.75rem 1.5rem; }
.t-timeline-item::before { content: ""; position: absolute; left: -.55rem; top: .35rem; width: .8rem; height: .8rem; border-radius: 50%; background: var(--t-background); border: 3px solid var(--t-primary); }
.t-timeline-date { font-weight: 700; color: var(--t-primary); }
.t-timeline-body h3 { margin: .25rem 0; font-size: 1.1rem; }
.t-timeline-body img { margin-top: .5rem; border-radius: 6px; max-width: 360px; }

/* Nieuws */
.t-news-date { margin: 0 0 .35rem; font-size: .85rem; opacity: .75; }
.t-card-title a { color: inherit; text-decoration: none; }
/* Kaart met eigen accentkleur (bv. de kleur van een product): rand bovenaan, icoon, titel en link. */
.t-cards .t-card.t-card-accent { border-top: 4px solid var(--t-card-accent); }
.t-cards .t-card-accent .t-card-title, .t-cards .t-card-accent .t-service-icon, .t-cards .t-card-accent .t-card-more a { color: var(--t-card-accent); opacity: 1; }
.t-card-text p { margin: 0 0 .5rem; }
.t-card-title a:hover { text-decoration: underline; }
.t-news-article .t-container { max-width: 760px; }
/* Eén kolom: afbeelding links, tekst rechts (op een smal scherm onder elkaar) */
@media (min-width: 640px) {
    .t-cards-1 .t-news-item:has(.t-card-image) { display: grid; grid-template-columns: minmax(0, 280px) 1fr; }
    .t-cards-1 .t-news-item .t-card-image { height: 100%; object-fit: cover; }
}
.t-news-back { font-size: .9rem; }
.t-news-image { width: 100%; border-radius: 8px; margin: 1rem 0; }
.t-news-summary { font-size: 1.15rem; font-weight: 500; margin-bottom: 1rem; }

/* Blog */
.t-blog-filter { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: baseline; margin-bottom: 1.25rem; }
.t-blog-list { display: grid; gap: 2rem; }
.t-blog-item { display: grid; grid-template-columns: minmax(0, 240px) 1fr; gap: 1.5rem; align-items: start; }
.t-blog-item:not(:has(.t-blog-item-image)) { grid-template-columns: 1fr; }
.t-blog-item-image img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 8px; display: block; }
.t-blog-item-title { margin: 0 0 .35rem; font-size: 1.35rem; }
.t-blog-item-title a { color: inherit; text-decoration: none; }
.t-blog-item-title a:hover { text-decoration: underline; }
.t-blog-meta { margin: 0 0 .75rem; font-size: .85rem; opacity: .75; }
.t-blog-meta-sep { margin: 0 .4rem; }
.t-blog-tags { list-style: none; margin: .75rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.t-blog-tags a { display: inline-block; padding: .15rem .6rem; border-radius: 999px; font-size: .8rem; text-decoration: none; color: var(--t-primary); border: 1px solid currentColor; }
.t-blog-tags a:hover { background: var(--t-primary); color: #fff; }
/* Paginaknoppen (nieuws, blog) */
.t-pager { margin-top: 2.5rem; }
.t-pager ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .35rem; }
.t-pager a, .t-pager span {
    display: inline-flex; align-items: center; justify-content: center; min-width: 2.4rem; height: 2.4rem; padding: 0 .6rem;
    border: 1px solid #d5d9de; border-radius: 6px; font-size: .95rem; text-decoration: none; color: inherit; background: var(--t-background);
}
.t-pager a:hover { border-color: var(--t-primary); color: var(--t-primary); }
.t-pager a:focus-visible { outline: 2px solid var(--t-primary); outline-offset: 2px; }
.t-pager .t-pager-current { background: var(--t-primary); border-color: var(--t-primary); color: #fff; font-weight: 600; }
.t-pager .t-pager-gap { border-color: transparent; background: none; min-width: 1.5rem; padding: 0; }
.t-pager .t-pager-disabled { opacity: .35; }
.t-blog-rss { margin-top: 1.5rem; font-size: .9rem; }
.t-blog-rss a { display: inline-flex; align-items: center; gap: .4rem; }
.t-blog-rss svg { color: #f26522; }
.t-blog-post .t-container { max-width: 760px; }
.t-blog-back { font-size: .9rem; }
.t-blog-image { width: 100%; border-radius: 8px; margin: 1rem 0; }
.t-blog-summary { font-size: 1.15rem; font-weight: 500; margin-bottom: 1rem; }
@media (max-width: 640px) {
    .t-blog-item { grid-template-columns: 1fr; gap: .75rem; }
}

/* Contactformulier */
.t-contact-form { display: grid; gap: .9rem; max-width: 640px; }
.t-contact-form label { display: grid; gap: .3rem; font-weight: 600; font-size: .95rem; }
.t-contact-form input, .t-contact-form textarea { font: inherit; font-weight: 400; padding: .6rem .7rem; border: 1px solid #c8ccd2; border-radius: 6px; }
.t-contact-form input:focus, .t-contact-form textarea:focus { outline: 2px solid var(--t-primary); outline-offset: 1px; }
.t-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.t-button { justify-self: start; background: var(--t-primary); color: #fff; border: 0; border-radius: 6px; padding: .7rem 1.4rem; font: inherit; font-weight: 600; cursor: pointer; }
.t-contact-thanks { background: #e3f6e8; color: #11612a; padding: 1rem 1.25rem; border-radius: 6px; }
.t-contact-error { background: #fde8e8; color: #a4161a; padding: .75rem 1.25rem; border-radius: 6px; }
.t-contact-privacy { font-size: .85rem; opacity: .75; margin: 0; }

/* Carrousel: dia's naast elkaar in een strook (scroll-snap); carousel.js voegt knoppen toe. */
.t-carousel { position: relative; overflow: hidden; }
.t-carousel-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.t-carousel-track::-webkit-scrollbar { display: none; }
.t-carousel-track:focus-visible { outline: 2px solid var(--t-primary); outline-offset: -2px; }
.t-carousel-slide { flex: 0 0 100%; scroll-snap-align: start; display: flex; align-items: center; justify-content: center; text-align: center; background-size: cover; background-position: center; padding: 2rem 4rem; box-sizing: border-box; }
.t-carousel-small .t-carousel-slide { min-height: 220px; }
.t-carousel-medium .t-carousel-slide { min-height: 340px; }
.t-carousel-large .t-carousel-slide { min-height: 480px; }
.t-carousel-light .t-carousel-slide { background-color: #e9e9e9; color: var(--t-text); }
.t-carousel-dark .t-carousel-slide { background-color: #1d2127; color: #fff; }
.t-carousel-primary .t-carousel-slide { background-color: var(--t-primary); color: #fff; }
.t-carousel-photo { color: #fff; position: relative; }
.t-carousel-photo::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .35); }
.t-carousel-caption { position: relative; max-width: 760px; }
.t-carousel-caption h2 { margin: 0 0 .5rem; font-size: clamp(1.6rem, 4vw, 2.8rem); letter-spacing: .02em; color: inherit; }
.t-carousel-caption h2 a { color: inherit; text-decoration: none; }
.t-carousel-caption p { margin: 0 0 1rem; font-size: clamp(1rem, 2vw, 1.25rem); opacity: .9; }
.t-carousel :is(.t-carousel-prev, .t-carousel-next) { position: absolute; top: 50%; transform: translateY(-50%); width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .35); color: #fff; font-size: 1.8rem; line-height: 1; cursor: pointer; }
.t-carousel :is(.t-carousel-prev, .t-carousel-next):hover, .t-carousel :is(.t-carousel-prev, .t-carousel-next):focus-visible { background: var(--t-primary); outline: none; }
.t-carousel-prev { left: .75rem; }
.t-carousel-next { right: .75rem; }
.t-carousel-dots { position: absolute; left: 0; right: 0; bottom: .75rem; display: flex; justify-content: center; gap: .5rem; }
.t-carousel-dot { width: .7rem; height: .7rem; border-radius: 50%; border: 0; padding: 0; background: rgba(127, 127, 127, .5); cursor: pointer; }
.t-carousel-dot[aria-current="true"] { background: var(--t-primary); }
@media (max-width: 600px) {
    .t-carousel-slide { padding: 2rem 1.25rem 2.5rem; }
    .t-carousel :is(.t-carousel-prev, .t-carousel-next) { display: none; }
}

/* Galerij: vierkante tegels in een raster; op een gsm twee per rij. */
.t-gallery-album { margin-top: 2rem; }
.t-gallery-description { opacity: .8; }
.t-gallery-grid { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.t-gallery-grid figure { margin: 0; }
.t-gallery-link { display: block; overflow: hidden; border-radius: 6px; background: #eef0f3; }
.t-gallery-link img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform .25s; }
.t-gallery-link:hover img, .t-gallery-link:focus-visible img { transform: scale(1.04); }
.t-gallery-grid figcaption { font-size: .85rem; margin-top: .35rem; opacity: .8; }
@media (min-width: 700px) {
    .t-gallery-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .t-gallery-4, .t-gallery-5, .t-gallery-6 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 1000px) {
    .t-gallery-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .t-gallery-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
/* Vergroting (gallery.js): donkere achtergrond, foto zo groot mogelijk, knoppen erover. */
.t-lightbox { border: 0; padding: 0; margin: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; background: rgba(10, 12, 15, .94); color: #fff; }
.t-lightbox::backdrop { background: rgba(10, 12, 15, .94); }
.t-lightbox figure { margin: 0; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3.5rem 4rem 2.5rem; box-sizing: border-box; }
.t-lightbox img { max-width: 100%; max-height: calc(100dvh - 8rem); object-fit: contain; }
.t-lightbox figcaption { margin-top: .75rem; text-align: center; max-width: 60ch; }
.t-lightbox-count { position: absolute; top: 1rem; left: 1.25rem; margin: 0; font-size: .9rem; opacity: .8; }
.t-lightbox button { position: absolute; border: 0; background: rgba(255, 255, 255, .12); color: #fff; font: inherit; font-size: 2rem; line-height: 1; width: 3rem; height: 3rem; border-radius: 50%; cursor: pointer; }
.t-lightbox button:hover, .t-lightbox button:focus-visible { background: rgba(255, 255, 255, .25); outline: none; }
.t-lightbox-close { top: .75rem; right: .75rem; }
.t-lightbox-prev { left: .75rem; top: 50%; transform: translateY(-50%); }
.t-lightbox-next { right: .75rem; top: 50%; transform: translateY(-50%); }
.t-lightbox-single :is(.t-lightbox-prev, .t-lightbox-next) { display: none; }
@media (max-width: 600px) {
    .t-lightbox figure { padding: 3.5rem .5rem 2rem; }
    .t-lightbox :is(.t-lightbox-prev, .t-lightbox-next) { top: auto; bottom: .75rem; transform: none; }
}

/* Klantenportaal: formulieren als het contactformulier (ook in elk thema), plus de bestandenlijst. */
.t-portal-error { background: #fde8e8; color: #a4161a; padding: .75rem 1.25rem; border-radius: 6px; }
.t-portal-notice { background: #e3f6e8; color: #11612a; padding: .75rem 1.25rem; border-radius: 6px; }
.t-portal-form { max-width: 420px; }
.t-portal-hint { font-size: .85rem; opacity: .75; margin: 0; }
.t-portal-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; }
.t-portal-head p { margin: 0; }
/* Een link als knop: geen onderlijning (ook niet bij hover of in een thema dat links onderlijnt). */
.t-site a:is(.t-button, .t-button-light), .t-site a:is(.t-button, .t-button-light):hover { text-decoration: none; display: inline-block; }
/* Blok Knoppen: naast elkaar, links, in het midden of rechts; een knop met alleen een rand. */
.t-buttons { display: flex; flex-wrap: wrap; gap: .75rem; }
.t-buttons-center { justify-content: center; }
.t-buttons-right { justify-content: flex-end; }
.t-site a.t-button-outline { background: transparent; color: var(--t-primary); box-shadow: inset 0 0 0 2px var(--t-primary); }
.t-site a.t-button-outline:hover { background: var(--t-primary); color: #fff; }
:is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) a.t-button-outline { background: transparent; color: #fff; box-shadow: inset 0 0 0 2px #fff; }
/* Blok Scheiding: ruimte, met of zonder lijn. */
.t-divider { display: flex; align-items: center; }
.t-divider hr { flex: 1; border: 0; border-top: 1px solid currentColor; opacity: .18; margin: 0; }
.t-divider-small { min-height: 1rem; }
.t-divider-medium { min-height: 2.5rem; }
.t-divider-large { min-height: 5rem; }
/* Blok Aftelklok: grote cijfers in vakjes, met de eenheid eronder. */
.t-countdown { text-align: center; }
.t-countdown-clock { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin: 1rem 0; }
.t-countdown-unit { display: flex; flex-direction: column; align-items: center; min-width: 5rem; padding: .75rem .5rem; border-radius: 8px; background: rgba(0, 0, 0, .05); }
.t-countdown-value { font-size: 2.5rem; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; color: var(--t-primary); }
.t-countdown-label { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; opacity: .75; }
.t-countdown-end { font-size: 1.25rem; font-weight: 600; }
:is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) .t-countdown-unit { background: rgba(255, 255, 255, .12); }
:is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) .t-countdown-value { color: inherit; }
/* Blok Tabs / accordeon: zonder script uitklapbare stukken; met tabs.js een rij tabbladen. */
.t-tabs details.t-tab { border-bottom: 1px solid rgba(0, 0, 0, .12); }
.t-tabs details.t-tab:first-child { border-top: 1px solid rgba(0, 0, 0, .12); }
.t-tabs summary { cursor: pointer; padding: .85rem 2rem .85rem 0; font-weight: 600; list-style: none; position: relative; }
.t-tabs summary::-webkit-details-marker { display: none; }
.t-tabs summary::after { content: "+"; position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); font-size: 1.25rem; color: var(--t-primary); }
.t-tabs details[open] > summary::after { content: "\2212"; }
.t-tabs summary:focus-visible { outline: 2px solid var(--t-primary); outline-offset: 2px; }
.t-tabs details > .t-tab-panel { padding: 0 0 1rem; }
.t-tab-list { display: flex; flex-wrap: wrap; gap: .25rem; border-bottom: 2px solid rgba(0, 0, 0, .12); }
.t-tab-button { font: inherit; font-weight: 600; padding: .65rem 1.1rem; border: 0; border-bottom: 3px solid transparent; margin-bottom: -2px; background: none; color: inherit; cursor: pointer; }
.t-tab-button[aria-selected="true"] { border-bottom-color: var(--t-primary); color: var(--t-primary); }
.t-tab-button:focus-visible { outline: 2px solid var(--t-primary); outline-offset: -2px; }
.t-tabs-ready > .t-tab-panel { padding: 1rem 0; }
/* Blok Tabel: kopcellen vet, op een smal scherm opzij scrollen in het kader. */
.t-table { margin-left: 0; margin-right: 0; }
.t-table-scroll { overflow-x: auto; }
.t-table-scroll:focus-visible { outline: 2px solid var(--t-primary); outline-offset: 2px; }
.t-table table { width: 100%; border-collapse: collapse; }
.t-table th, .t-table td { text-align: left; vertical-align: top; padding: .6rem .75rem; border-bottom: 1px solid rgba(0, 0, 0, .1); }
.t-table thead th { border-bottom: 2px solid var(--t-primary); }
.t-table-striped tbody tr:nth-child(odd) { background: rgba(0, 0, 0, .03); }
.t-table figcaption { font-size: .9rem; opacity: .75; margin-top: .5rem; }
/* Blok Voor/na-foto: de voor-foto ligt erover, afgesneden op --t-compare; de regelaar ligt onzichtbaar over alles. */
.t-compare { margin-left: 0; margin-right: 0; --t-compare: 50%; }
.t-compare-frame { position: relative; overflow: hidden; border-radius: 6px; line-height: 0; }
.t-compare-frame img { display: block; width: 100%; height: auto; }
.t-compare-before { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--t-compare)) 0 0); }
.t-compare-before img { width: 100%; height: 100%; object-fit: cover; }
.t-compare-handle { position: absolute; top: 0; bottom: 0; left: var(--t-compare); width: 3px; margin-left: -1.5px; background: #fff; box-shadow: 0 0 4px rgba(0, 0, 0, .4); pointer-events: none; }
.t-compare-handle::after { content: "\2194"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #fff; color: #222; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; line-height: 1; box-shadow: 0 1px 4px rgba(0, 0, 0, .4); }
.t-compare-range { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; }
.t-compare-range:focus-visible + .t-compare-handle, .t-compare-frame:has(.t-compare-range:focus-visible) .t-compare-handle { outline: 3px solid var(--t-primary); }
.t-compare-label { position: absolute; top: .75rem; padding: .2rem .6rem; border-radius: 4px; background: rgba(0, 0, 0, .55); color: #fff; font-size: .85rem; line-height: 1.4; pointer-events: none; }
.t-compare-label-before { left: .75rem; }
.t-compare-label-after { right: .75rem; }
.t-compare figcaption { font-size: .9rem; opacity: .75; margin-top: .5rem; }
/* Blokken Video en Kaart: eerst een vlak met een knop; na een klik de speler of kaart in hetzelfde vlak. */
.t-video { margin-left: 0; margin-right: 0; }
.t-embed { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem;
  padding: 1.5rem; overflow: hidden; border-radius: 6px; background: #1d232a; color: #fff; text-align: center; }
.t-embed-video { aspect-ratio: 16 / 9; }
.t-embed-map { background: #e8ecef; color: inherit; }
.t-map-small { height: 16rem; }
.t-map-medium { height: 24rem; }
.t-map-large { height: 34rem; }
.t-embed-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; }
.t-site a.t-embed-load { position: relative; display: inline-flex; align-items: center; gap: .75rem; padding: .7rem 1.4rem;
  border-radius: 999px; background: var(--t-primary); color: #fff; font-weight: 600; text-decoration: none; }
.t-site a.t-embed-load:hover, .t-site a.t-embed-load:focus-visible { filter: brightness(1.1); }
.t-embed-play { width: 0; height: 0; border-style: solid; border-width: .55rem 0 .55rem .9rem; border-color: transparent transparent transparent currentColor; }
.t-embed-notice { position: relative; margin: 0; max-width: 32rem; font-size: .8rem; opacity: .85; }
.t-map-address { position: relative; margin: 0; font-weight: 600; }
.t-embed.t-embed-loaded { padding: 0; background: #000; }
.t-embed-loaded iframe { width: 100%; height: 100%; border: 0; display: block; }
.t-map-links { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: .5rem 0 0; font-size: .9rem; }
.t-button-light { background: transparent; color: var(--t-primary); border: 1px solid currentColor; padding: .5rem 1rem; }
.t-portal-files { width: 100%; border-collapse: collapse; }
.t-portal-mine { display: inline-block; margin-left: .4rem; font-size: .75rem; opacity: .7; }
.t-portal-upload { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid #e3e6ea; }
.t-portal-upload h3 { margin: 0 0 .75rem; }
.t-portal-upload input[type="file"] { font: inherit; }
.t-portal-files th, .t-portal-files td { text-align: left; padding: .6rem .5rem; border-bottom: 1px solid #e3e6ea; vertical-align: top; overflow-wrap: anywhere; }
.t-portal-files th { font-size: .85rem; opacity: .75; font-weight: 600; }
.t-portal-actions { white-space: nowrap; text-align: right; }
.t-portal-actions a + a { margin-left: 1rem; }
@media (max-width: 600px) {
    .t-portal-files thead { display: none; }
    .t-portal-files tr { display: grid; grid-template-columns: 1fr auto; gap: .2rem .75rem; padding: .6rem 0; border-bottom: 1px solid #e3e6ea; }
    .t-portal-files td { border: 0; padding: 0; }
    .t-portal-files td:first-child { grid-column: 1 / -1; font-weight: 600; }
    .t-portal-actions { grid-column: 1 / -1; text-align: left; }
}

/* Sitemap (module) */
.t-sitemap ul { list-style: none; margin: 0; padding-left: 0; }
.t-sitemap ul ul { padding-left: 1.25rem; border-left: 2px solid #e5e7eb; margin: .25rem 0 .5rem .35rem; }
.t-sitemap li { margin: .3rem 0; }
.t-sitemap a { text-decoration: none; }
.t-sitemap a:hover { text-decoration: underline; }

/* Kruimelpad (module) */
.t-breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; list-style: none; margin: 0 0 1rem; padding: 0; font-size: .875rem; }
.t-breadcrumbs li { display: flex; align-items: center; white-space: nowrap; }
.t-breadcrumbs.t-align-center ol { justify-content: center; }
.t-breadcrumbs.t-align-right ol { justify-content: flex-end; }
/* Scheidingsteken: een getekend pijltje, of een gekozen teken (--t-crumb-sep) */
.t-sep-chevron > li + li::before {
    content: ""; width: .4rem; height: .4rem; margin: 0 .65rem 0 .5rem;
    border-right: 1.5px solid currentColor; border-top: 1.5px solid currentColor; transform: rotate(45deg); opacity: .45;
}
.t-sep-text > li + li::before { content: var(--t-crumb-sep, "/"); margin: 0 .6rem; opacity: .5; }
.t-crumb-gap { opacity: .6; }
.t-breadcrumbs a { color: var(--t-text); opacity: .75; text-decoration: none; }
.t-breadcrumbs a:hover { color: var(--t-primary); opacity: 1; text-decoration: underline; }
.t-breadcrumbs [aria-current] { color: var(--t-primary); font-weight: 600; }

/* Cookiemelding: informatief, onderaan in beeld tot de bezoeker op OK klikt. */
.t-cookie-notice {
    position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 50;
    display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
    max-width: 52rem; margin: 0 auto; padding: .9rem 1.1rem;
    background: var(--t-background); color: var(--t-text);
    border: 1px solid #e5e7eb; border-left: 4px solid var(--t-primary); border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .15); font-size: .9rem;
}
.t-cookie-notice p { flex: 1 1 18rem; margin: 0; }
.t-cookie-notice p a { color: var(--t-primary); }
.t-cookie-ok {
    flex: none; padding: .45rem 1.2rem; border-radius: 4px;
    background: var(--t-primary); color: #fff; font-weight: 600; text-decoration: none;
}
.t-cookie-ok:hover, .t-cookie-ok:focus-visible { filter: brightness(.9); color: #fff; }

/* ------------------------------------------------------------------ thema's
   Stijl per thema (data-theme op .t-site); de kleuren blijven die van de klant. */

/* Zakelijk: strakke witte kop met een lijn in de hoofdkleur, menu in hoofdletters, rechte hoeken. */
[data-theme="corporate"] .t-header { border-top: 4px solid var(--t-primary); box-shadow: 0 1px 3px rgba(0, 0, 0, .08); border-bottom: 0; }
[data-theme="corporate"] .t-nav a { text-transform: uppercase; font-size: .82rem; font-weight: 600; letter-spacing: .06em; }
[data-theme="corporate"] h1, [data-theme="corporate"] h2 { font-weight: 700; letter-spacing: -.01em; }
[data-theme="corporate"] h2 { padding-bottom: .35rem; border-bottom: 2px solid var(--t-primary); display: inline-block; }
[data-theme="corporate"] .t-bg-primary h2, [data-theme="corporate"] .t-bg-dark h2 { border-bottom-color: currentColor; }
[data-theme="corporate"] .t-card, [data-theme="corporate"] .t-button, [data-theme="corporate"] .t-cookie-ok,
[data-theme="corporate"] .t-contact-form input, [data-theme="corporate"] .t-contact-form textarea { border-radius: 0; }
[data-theme="corporate"] .t-card { border-top: 3px solid var(--t-primary); }
[data-theme="corporate"] .t-button { text-transform: uppercase; letter-spacing: .05em; font-size: .85rem; }
[data-theme="corporate"] .t-footer { background: #1f2329; color: #c9ced6; border-top: 0; }
[data-theme="corporate"] .t-footer a { color: #fff; }
[data-theme="corporate"] .t-footer h2 { color: #fff; border: 0; }

/* Modern: afgeronde hoeken, zachte schaduwen, knoppen als pil, grotere titels. */
[data-theme="modern"] .t-header { border-bottom: 0; box-shadow: 0 6px 24px rgba(0, 0, 0, .06); }
[data-theme="modern"] h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.02em; }
[data-theme="modern"] h2 { font-weight: 750; letter-spacing: -.01em; }
[data-theme="modern"] .t-nav a { padding: .35rem .75rem; border-radius: 999px; }
[data-theme="modern"] .t-nav a.active, [data-theme="modern"] .t-nav a:hover { background: color-mix(in srgb, var(--t-primary) 10%, transparent); }
[data-theme="modern"] .t-card { border: 0; border-radius: 16px; box-shadow: 0 10px 30px rgba(0, 0, 0, .08); }
[data-theme="modern"] .t-button, [data-theme="modern"] .t-cookie-ok { border-radius: 999px; padding-inline: 1.6rem; }
[data-theme="modern"] .t-contact-form input, [data-theme="modern"] .t-contact-form textarea { border-radius: 10px; }
[data-theme="modern"] .t-cookie-notice { border-radius: 16px; border-left-width: 1px; }
[data-theme="modern"] .t-bg-light { background: color-mix(in srgb, var(--t-primary) 6%, #fff); }

/* Klassiek: schreeflettertype voor titels, dunne lijnen, ingetogen kleuren. */
[data-theme="classic"] .t-header { border-bottom: 1px solid #d6d3cc; }
[data-theme="classic"] .t-brand { font-weight: 400; }
[data-theme="classic"] h1, [data-theme="classic"] h2, [data-theme="classic"] h3 { font-weight: 400; }
[data-theme="classic"] h1 { font-size: clamp(1.9rem, 3.5vw, 2.6rem); }
[data-theme="classic"] h2 { padding-bottom: .4rem; border-bottom: 1px solid #d6d3cc; }
[data-theme="classic"] .t-bg-primary h2, [data-theme="classic"] .t-bg-dark h2 { border-bottom-color: rgba(255, 255, 255, .4); }
[data-theme="classic"] .t-nav a { font-family: var(--t-heading-font); font-size: 1.05rem; }
[data-theme="classic"] .t-card { border-radius: 2px; border-color: #d6d3cc; box-shadow: none; }
[data-theme="classic"] .t-button, [data-theme="classic"] .t-cookie-ok { border-radius: 2px; background: transparent; color: var(--t-primary); border: 1px solid var(--t-primary); }
[data-theme="classic"] .t-button:hover, [data-theme="classic"] .t-cookie-ok:hover { background: var(--t-primary); color: #fff; }
[data-theme="classic"] .t-footer { background: #f7f5f0; }

/* Minimalistisch: veel witruimte, dunne lijnen, geen kaders; de inhoud spreekt. */
[data-theme="minimal"] .t-header { border-bottom: 1px solid #ececec; }
[data-theme="minimal"] .t-header-inner { padding-top: 1.5rem; padding-bottom: 1.5rem; }
[data-theme="minimal"] .t-brand { font-weight: 500; letter-spacing: .02em; color: var(--t-text); }
[data-theme="minimal"] .t-nav a { font-size: .78rem; text-transform: uppercase; letter-spacing: .14em; opacity: .75; }
[data-theme="minimal"] .t-nav a.active, [data-theme="minimal"] .t-nav a:hover { opacity: 1; color: var(--t-text); font-weight: 400; text-decoration: underline; text-underline-offset: .5em; text-decoration-thickness: 1px; }
[data-theme="minimal"] :is(h1, h2, h3) { font-weight: 300; letter-spacing: -.01em; }
[data-theme="minimal"] h1 { font-size: clamp(2rem, 4.5vw, 3.2rem); }
[data-theme="minimal"] .t-pad-medium { padding: 4.5rem 0; }
[data-theme="minimal"] .t-pad-large { padding: 7rem 0; }
[data-theme="minimal"] .t-card { border: 0; border-top: 1px solid #e3e3e3; border-radius: 0; background: transparent; }
[data-theme="minimal"] .t-card-body { padding-left: 0; padding-right: 0; }
[data-theme="minimal"] .t-service-icon { color: var(--t-text); opacity: .7; }
[data-theme="minimal"] :is(.t-button, .t-cookie-ok) { border-radius: 0; background: transparent; color: var(--t-text); border: 1px solid currentColor; }
[data-theme="minimal"] :is(.t-button, .t-cookie-ok):hover { background: var(--t-text); color: var(--t-background); }
[data-theme="minimal"] .t-bg-light { background: #fafafa; }
[data-theme="minimal"] .t-footer { border-top: 1px solid #ececec; font-size: .85rem; }
[data-theme="minimal"] .t-footer h2 { font-size: .75rem; font-weight: 500; text-transform: uppercase; letter-spacing: .14em; }

/* Krachtig: donkere kop en voet, grote vette titels, ronde knoppen, kaarten met schaduw. */
[data-theme="bold"] .t-topbar { background: #000; color: rgba(255, 255, 255, .7); border-bottom: 0; }
[data-theme="bold"] .t-header { background: #111418; border-bottom: 0; }
[data-theme="bold"] .t-brand { color: #fff; }
[data-theme="bold"] .t-nav a { color: rgba(255, 255, 255, .85); font-weight: 600; }
[data-theme="bold"] .t-nav a.active, [data-theme="bold"] .t-nav a:hover { color: #fff; box-shadow: inset 0 -3px 0 var(--t-primary); }
[data-theme="bold"] .t-nav .t-has-children > ul, [data-theme="bold"] .t-nav .t-mega > .t-mega-panel { background: #111418; }
[data-theme="bold"] .t-languages > summary { color: #fff; border-color: rgba(255, 255, 255, .3); }
[data-theme="bold"] :is(h1, h2) { font-weight: 800; letter-spacing: -.03em; }
[data-theme="bold"] h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); line-height: 1.05; }
[data-theme="bold"] h2 { font-size: clamp(1.6rem, 3vw, 2.3rem); }
[data-theme="bold"] .t-bg-primary { background-image: linear-gradient(135deg, var(--t-primary), color-mix(in srgb, var(--t-primary) 60%, #000)); }
[data-theme="bold"] .t-card { border: 0; border-radius: 14px; box-shadow: 0 12px 32px rgba(0, 0, 0, .1); transition: transform .15s, box-shadow .15s; }
[data-theme="bold"] .t-card:hover { transform: translateY(-3px); box-shadow: 0 18px 40px rgba(0, 0, 0, .14); }
[data-theme="bold"] .t-service-icon { color: var(--t-secondary); }
[data-theme="bold"] :is(.t-button, .t-cookie-ok) { border-radius: 999px; padding-inline: 1.6rem; font-weight: 700; background: var(--t-secondary); }
[data-theme="bold"] .t-footer { background: #111418; color: rgba(255, 255, 255, .7); border-top: 0; }
[data-theme="bold"] .t-footer :is(h2, a) { color: #fff; }
[data-theme="bold"] .t-footer h2 { font-size: 1rem; letter-spacing: 0; }

/* Warm: afgeronde vormen, zachte achtergronden, titels in de tweede kleur. */
[data-theme="warm"] .t-header { border-bottom: 0; background: color-mix(in srgb, var(--t-secondary) 6%, var(--t-background)); }
[data-theme="warm"] .t-nav a { padding: .35rem .8rem; border-radius: 10px; }
[data-theme="warm"] .t-nav a.active, [data-theme="warm"] .t-nav a:hover { background: color-mix(in srgb, var(--t-secondary) 15%, transparent); color: var(--t-text); }
[data-theme="warm"] :is(h1, h2) { color: color-mix(in srgb, var(--t-secondary) 80%, #000); }
[data-theme="warm"] .t-bg-light { background: color-mix(in srgb, var(--t-secondary) 8%, #fff); }
[data-theme="warm"] .t-bg-primary, [data-theme="warm"] .t-bg-light { border-radius: 24px; margin: 0 1rem; }
[data-theme="warm"] .t-card { border: 0; border-radius: 18px; background: color-mix(in srgb, var(--t-secondary) 5%, #fff); }
[data-theme="warm"] .t-card-image { border-radius: 18px 18px 0 0; }
[data-theme="warm"] .t-service-icon { color: var(--t-secondary); background: color-mix(in srgb, var(--t-secondary) 14%, #fff); border-radius: 14px; padding: .55rem; width: 3.2rem; height: 3.2rem; }
[data-theme="warm"] :is(.t-button, .t-cookie-ok) { border-radius: 14px; }
[data-theme="warm"] :is(.t-contact-form input, .t-contact-form textarea) { border-radius: 12px; }
[data-theme="warm"] .t-footer { background: color-mix(in srgb, var(--t-secondary) 8%, #fff); border-top: 0; border-radius: 24px 24px 0 0; }

/* Elegant: schreefletter voor titels, gecentreerde kop en titels, rustig menu, fijne lijnen. */
[data-theme="elegant"] .t-header { border-bottom: 1px solid color-mix(in srgb, var(--t-secondary) 40%, #fff); }
[data-theme="elegant"] .t-header-inner { justify-content: center; }
[data-theme="elegant"] .t-brand { margin-right: 0; flex-basis: 100%; display: flex; justify-content: center; font-weight: 400; font-size: 1.6rem; letter-spacing: .04em; }
[data-theme="elegant"] .t-nav ul { justify-content: center; }
[data-theme="elegant"] .t-nav a { font-size: .8rem; text-transform: uppercase; letter-spacing: .18em; }
[data-theme="elegant"] .t-nav a.active { color: var(--t-secondary); font-weight: 400; }
[data-theme="elegant"] :is(h1, h2, h3) { font-weight: 400; }
[data-theme="elegant"] :is(h1, h2) { text-align: center; }
[data-theme="elegant"] .t-footer h2::after { display: none; }
[data-theme="elegant"] h2::after { content: ""; display: block; width: 3rem; height: 1px; margin: .75rem auto 0; background: var(--t-secondary); }
[data-theme="elegant"] .t-subtitle { text-align: center; font-style: italic; }
[data-theme="elegant"] .t-card { border: 1px solid color-mix(in srgb, var(--t-secondary) 30%, #fff); border-radius: 0; text-align: center; }
[data-theme="elegant"] .t-service-icon { color: var(--t-secondary); margin-inline: auto; display: block; }
[data-theme="elegant"] .t-card-title { font-family: var(--t-heading-font); font-weight: 400; font-size: 1.3rem; }
[data-theme="elegant"] :is(.t-button, .t-cookie-ok) { border-radius: 0; text-transform: uppercase; letter-spacing: .15em; font-size: .78rem; }
[data-theme="elegant"] .t-footer { text-align: center; border-top: 1px solid color-mix(in srgb, var(--t-secondary) 40%, #fff); }
[data-theme="elegant"] .t-footer h2 { font-family: var(--t-heading-font); font-weight: 400; }

/* Boxed: de pagina in een wit kader op een grijze achtergrond; logo bovenaan, daaronder een
   donkere menubalk over de volle breedte met het actieve item in de primaire kleur; grijze
   tekst in Open Sans; donkere voet. */
body:has(> .t-site[data-theme="boxed"]), body:has(.t-site[data-theme="boxed"]) { background: #e9e9e9; }
[data-theme="boxed"] { max-width: 1300px; margin: 0 auto; background: #fff; box-shadow: 0 0 18px rgba(0, 0, 0, .12); font-size: 14px; line-height: 1.7; color: #777; }
/* Op een breed scherm: grijze ruimte boven de kop en onder de voet, zodat het kader los staat. */
@media (min-width: 1340px) {
    [data-theme="boxed"] { margin-top: 30px; margin-bottom: 30px; }
    [data-theme="boxed"].t-footer-sticky { min-height: calc(100vh - 60px); min-height: calc(100dvh - 60px); }
}
[data-theme="boxed"] :is(h1, h2, h3, h4) { color: #404040; font-weight: 600; letter-spacing: -.01em; }
[data-theme="boxed"] h1 { font-size: 26px; line-height: 1.3; }
[data-theme="boxed"] h2 { font-size: 22px; line-height: 1.35; }
[data-theme="boxed"] h3 { font-size: 18px; }
/* Paginatitel: een dunne lijn eronder met een kort streepje in de hoofdkleur. */
[data-theme="boxed"] .t-section:not(.t-bg-primary, .t-bg-secondary, .t-bg-dark) .t-heading-1 { position: relative; border-bottom: 1px solid #e9e9e9; padding-bottom: 1.6rem; margin-bottom: 0; }
/* Weinig ruimte onder de titellijn: de sectie met de titel en de volgende sluiten dicht aan. */
[data-theme="boxed"] .t-section:has(.t-heading-1):not(.t-bg-primary, .t-bg-secondary, .t-bg-dark) { padding-bottom: 0; }
[data-theme="boxed"] .t-section:has(.t-heading-1):not(.t-bg-primary, .t-bg-secondary, .t-bg-dark) + .t-section:not(.t-bg-primary, .t-bg-secondary, .t-bg-dark, .t-bg-light) { padding-top: 1.25rem; }
[data-theme="boxed"] .t-section:not(.t-bg-primary, .t-bg-secondary, .t-bg-dark) .t-heading-1::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 100px; height: 3px; background: var(--t-primary); }
[data-theme="boxed"] .t-heading-1 h1 { font-size: 24px; font-weight: 400; margin-bottom: 0; }
/* De ondertitel van een paginatitel op dezelfde regel, lichtgrijs, na een streepje ("Onze diensten - Hosting"). */
[data-theme="boxed"] .t-heading-1 { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: .3em; }
[data-theme="boxed"] .t-heading-1 .t-subtitle { margin: 0; font-size: 24px; line-height: 1.3; color: #aaa; opacity: 1; }
[data-theme="boxed"] .t-heading-1 .t-subtitle::before { content: "- "; }
[data-theme="boxed"] a { color: var(--t-primary); }
[data-theme="boxed"] .t-topbar { border-bottom: 0; font-size: 12px; color: #888; }
[data-theme="boxed"] .t-topbar a:hover { color: var(--t-primary); }
[data-theme="boxed"] .t-header { border-bottom: 0; }
[data-theme="boxed"] .t-header-inner { padding-top: 1.6rem; padding-bottom: 0; row-gap: 1.25rem; }
/* Witte rand rond de inhoud: secties met een achtergrond blijven binnen de pagina-inhoud. */
[data-theme="boxed"] main { padding-top: 1.5rem; }
/* Begint de pagina met het kruimelpad, dan staat dat dicht onder de menubalk. */
[data-theme="boxed"] main:has(.t-section:first-child .t-breadcrumbs) { padding-top: 1.25rem; }
[data-theme="boxed"] main .t-section:first-child:has(.t-breadcrumbs) { padding-top: 0; }
[data-theme="boxed"] .t-section:is(.t-bg-light, .t-bg-primary, .t-bg-secondary, .t-bg-dark):not(.t-section-full) { max-width: 1180px; margin-left: auto; margin-right: auto; }
/* Een gekleurde sectie op volle breedte onderaan de pagina sluit aan op de voet (geen witte rand). */
[data-theme="boxed"] main:has(> * > .t-section-full:last-child, > .t-section-full:last-child) ~ .t-footer { margin-top: 0; }
[data-theme="boxed"] :is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) :is(h1, h2, h3, h4, p, a:not(.t-button)) { color: #fff; }
[data-theme="boxed"] :is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) a.t-button { background: #fff; color: var(--t-primary); padding: .65rem 1.4rem; }
[data-theme="boxed"] :is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) a.t-button:hover { color: var(--t-primary); filter: brightness(.95); }
/* Maten van het kader: 1300 px breed, inhoud 1200 px met 10 px marge (menubalk 1180 px). */
[data-theme="boxed"] .t-container { max-width: 1200px; padding-left: 10px; padding-right: 10px; }
[data-theme="boxed"] .t-brand img { max-height: var(--t-logo-height, 64px); }
/* De menubalk: onder het logo, donker, met blokken per item; binnen de witte rand van de pagina. */
[data-theme="boxed"] .t-nav { order: 10; flex-basis: 100%; background: #303030; }
[data-theme="boxed"] .t-nav ul { gap: 0; }
[data-theme="boxed"] .t-nav a { display: block; padding: .8rem 1.3rem; color: #fff; font-size: 13px; font-weight: 600; }
[data-theme="boxed"] .t-nav a:hover { background: rgba(255, 255, 255, .08); color: #fff; }
[data-theme="boxed"] .t-nav a.active { background: var(--t-primary); color: #fff; }
[data-theme="boxed"] .t-nav .t-has-children > ul, [data-theme="boxed"] .t-nav .t-mega > .t-mega-panel { background: #303030; border: 0; box-shadow: 0 6px 16px rgba(0, 0, 0, .2); }
[data-theme="boxed"] .t-mega-title { border-bottom-color: rgba(255, 255, 255, .15); }
[data-theme="boxed"] .t-nav .t-has-children > ul a { font-weight: 400; padding: .55rem 1.1rem; }
[data-theme="boxed"] .t-languages > summary { color: inherit; }
[data-theme="boxed"] :is(.t-button, .t-cookie-ok), [data-theme="boxed"] a:is(.t-button, .t-cookie-ok) { border-radius: 3px; background: var(--t-primary); color: #fff; font-size: 13px; font-weight: 600; }
[data-theme="boxed"] a:is(.t-button, .t-cookie-ok):hover { color: #fff; filter: brightness(1.08); }
[data-theme="boxed"] .t-card { border: 1px solid #e6e6e6; border-radius: 3px; box-shadow: none; }
[data-theme="boxed"] .t-service-icon { color: var(--t-primary); }
[data-theme="boxed"] .t-bg-light { background: #f6f6f6; }
[data-theme="boxed"] .t-bg-dark { background-color: #303030; }
[data-theme="boxed"] .t-footer { background: #303030; color: #aaa; border-top: 0; margin-top: 3rem; padding-bottom: 0; }
[data-theme="boxed"] .t-footer :is(h2, h3) { color: #fff; font-size: 15px; font-weight: 600; }
[data-theme="boxed"] .t-footer a { color: #ddd; }
[data-theme="boxed"] .t-footer a:hover { color: var(--t-primary); }
[data-theme="boxed"] .t-footer-linkcolumn li { margin: 0; }
[data-theme="boxed"] .t-footer .t-footer-linkcolumn a { display: block; padding: 3px 0; color: #a4a4a4; text-decoration: none; }
[data-theme="boxed"] .t-footer .t-footer-linkcolumn a:hover { color: #fff; }
[data-theme="boxed"] :is(.t-footer-linkcolumn, .t-footer-contactlinks) a::before { border-left-color: #ddd; }
[data-theme="boxed"] .t-footer .t-copyright { opacity: 1; }
[data-theme="boxed"] .t-footer .t-copyright a { color: #fff; font-weight: inherit; }
[data-theme="boxed"] .t-footer-bottom { background: #262626; margin-top: 1.5rem; padding-top: .9rem; padding-bottom: .9rem; max-width: none; }
@media (max-width: 760px) {
    [data-theme="boxed"] .t-nav a { padding: .65rem .9rem; }
}

/* Porto: zoals het gelijknamige sjabloon (de oude site van Torfs), nagemeten op
   torfs.accountant. Open Sans (zelf gehost), 14 px grijze tekst, titels met krappe
   letterafstand (-0,05em), menu 12 px vet in kapitalen, donkere voet. */
[data-theme="porto"] { font-size: 14px; line-height: 26px; color: #777; }
[data-theme="porto"] :is(h1, h2, h3, h4, h5, h6) { color: #212529; letter-spacing: -.05em; }
[data-theme="porto"] h1 { font-size: 30px; font-weight: 400; line-height: 1.2; }
[data-theme="porto"] h2 { font-size: 28px; font-weight: 400; line-height: 1.5; }
[data-theme="porto"] h3 { font-size: 21px; font-weight: 400; line-height: 1.4; }
[data-theme="porto"] h4 { font-size: 16.8px; font-weight: 700; line-height: 27px; }
[data-theme="porto"] :is(h5, h6) { font-size: 12.6px; font-weight: 600; line-height: 18px; text-transform: uppercase; }
[data-theme="porto"] :is(strong, b) { color: #444; }
[data-theme="porto"] .t-nav a { text-transform: uppercase; font-size: 12px; font-weight: 700; letter-spacing: -.5px; color: #444; }
[data-theme="porto"] .t-nav a.active, [data-theme="porto"] .t-nav a:hover { color: var(--t-primary); }
[data-theme="porto"] :is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) { color: rgba(255, 255, 255, .85); }
[data-theme="porto"] :is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) :is(h1, h2, h3, h4, h5, h6, strong, b) { color: #fff; }
[data-theme="porto"] .t-card-title { font-size: 16.8px; font-weight: 700; letter-spacing: -.05em; }
[data-theme="porto"] :is(.t-button, .t-cookie-ok) { border-radius: 4px; text-transform: uppercase; font-size: 12.8px; font-weight: 600; }
[data-theme="porto"] .t-footer { background: #212529; color: #777; font-size: 12.6px; border-top: 0; }
[data-theme="porto"] .t-footer h2 { color: #fff; font-size: 12.6px; font-weight: 600; text-transform: uppercase; letter-spacing: -.05em; line-height: 18px; margin-bottom: 1rem; }
[data-theme="porto"] .t-footer a { color: #999; }
[data-theme="porto"] .t-footer a:hover { color: #fff; }
[data-theme="porto"] .t-footer-bottom { border-top: 1px solid rgba(255, 255, 255, .06); padding-top: 1.25rem; }
/* Porto: kop met groot logo en een lichte rand bovenaan */
[data-theme="porto"] .t-header { border-top: 3px solid #ededed; border-bottom: 0; }
[data-theme="porto"] .t-header-inner { padding-top: .75rem; padding-bottom: .75rem; }
[data-theme="porto"] .t-brand img { max-height: var(--t-logo-height, 96px); }
@media (max-width: 760px) { [data-theme="porto"] .t-brand img { max-height: min(var(--t-logo-height, 96px), 60px); } }
[data-theme="porto"] .t-topbar { border-bottom: 2px solid rgba(0, 0, 0, .06); color: #999; }
/* Porto: donkere titelbalk met de paginatitel links en het kruimelpad rechts */
/* Thema "arcade": voor gamesites. Witte kop (logo's met een lichte achtergrond blijven
   kloppen) met een lijn in een verloop van de tweede naar de hoofdkleur, titels en menu in
   kapitalen, donkere titelbalk, donkere secties en voet met een fijn raster, kaarten met een
   gekleurde bovenrand. Kleuren komen uit de site. */
[data-theme="arcade"] { --t-arcade-dark: #15191d; --t-arcade-darker: #0f1215; --t-arcade-grid: color-mix(in srgb, var(--t-primary) 9%, transparent); }
[data-theme="arcade"] :is(h1, h2, h3) { font-weight: 800; text-transform: uppercase; letter-spacing: .02em; }
[data-theme="arcade"] h1 { font-size: clamp(2rem, 4.5vw, 3.2rem); line-height: 1.08; }
[data-theme="arcade"] h2 { font-size: clamp(1.4rem, 2.6vw, 2rem); }
[data-theme="arcade"] h3 { font-size: 1.05rem; letter-spacing: .04em; }
[data-theme="arcade"] .t-section:not(.t-bg-primary, .t-bg-secondary, .t-bg-dark) :is(.t-heading-1, .t-heading-2) > :is(h1, h2)::after { content: ""; display: block; width: 56px; height: 4px; margin-top: .45em; background: linear-gradient(90deg, var(--t-secondary), var(--t-primary)); }
[data-theme="arcade"] .t-section.t-align-center :is(.t-heading-1, .t-heading-2) > :is(h1, h2)::after { margin-left: auto; margin-right: auto; }
[data-theme="arcade"] .t-subtitle { text-transform: none; letter-spacing: 0; }
[data-theme="arcade"] .t-topbar { background: var(--t-arcade-dark); color: rgba(255, 255, 255, .65); border-bottom: 0; }
[data-theme="arcade"] .t-topbar a:hover { color: #fff; }
[data-theme="arcade"] .t-header { border-bottom: 0; box-shadow: 0 1px 0 rgba(0, 0, 0, .06); position: relative; }
[data-theme="arcade"] .t-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 3px; background: linear-gradient(90deg, var(--t-secondary), var(--t-primary) 40%, var(--t-arcade-dark)); z-index: 1; }
[data-theme="arcade"] .t-nav a { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #3a3a3a; }
[data-theme="arcade"] .t-nav a.active, [data-theme="arcade"] .t-nav a:hover { color: var(--t-primary); }
[data-theme="arcade"] .t-nav .t-has-children > ul, [data-theme="arcade"] .t-nav .t-mega > .t-mega-panel { border-top: 3px solid var(--t-primary); }
[data-theme="arcade"] .t-mega-title { color: var(--t-primary); }
[data-theme="arcade"] .t-page-header { display: block; margin-bottom: 2.5rem; padding: 2.4rem 0 2.2rem; color: #fff; border-bottom: 3px solid var(--t-primary);
    background: linear-gradient(0deg, var(--t-arcade-grid) 1px, transparent 1px) 0 0 / 100% 24px, linear-gradient(90deg, var(--t-arcade-grid) 1px, transparent 1px) 0 0 / 24px 100%,
                radial-gradient(ellipse at 15% 0%, color-mix(in srgb, var(--t-primary) 30%, transparent), transparent 60%), var(--t-arcade-dark); }
[data-theme="arcade"] .t-page-header:has(~ main > .t-section:first-child:is(.t-bg-light, .t-bg-dark, .t-bg-primary, .t-bg-secondary, [style*="background-image"])) { margin-bottom: 0; }
[data-theme="arcade"] .t-page-header-inner { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .5rem 2rem; }
[data-theme="arcade"] .t-page-header-title { margin: 0; color: #fff; font-family: var(--t-heading-font); font-size: clamp(1.6rem, 3.4vw, 2.4rem); font-weight: 800; text-transform: uppercase; letter-spacing: .03em; line-height: 1.1; }
[data-theme="arcade"] .t-page-header-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: rgba(255, 255, 255, .5); }
[data-theme="arcade"] .t-page-header-crumbs li { display: flex; align-items: center; }
[data-theme="arcade"] .t-page-header-crumbs li + li::before { content: "\203A"; margin: 0 .45rem; color: var(--t-primary); }
[data-theme="arcade"] .t-page-header-crumbs a { color: rgba(255, 255, 255, .75); text-decoration: none; }
[data-theme="arcade"] .t-page-header-crumbs a:hover { color: #fff; }
[data-theme="arcade"] .t-bg-light { background-color: color-mix(in srgb, var(--t-primary) 6%, #f7f9fa); }
[data-theme="arcade"] .t-bg-dark { background: linear-gradient(0deg, var(--t-arcade-grid) 1px, transparent 1px) 0 0 / 100% 28px, linear-gradient(90deg, var(--t-arcade-grid) 1px, transparent 1px) 0 0 / 28px 100%, var(--t-arcade-dark); }
[data-theme="arcade"] .t-bg-primary { background-image: linear-gradient(135deg, var(--t-secondary), var(--t-primary) 45%, color-mix(in srgb, var(--t-primary) 55%, #000)); }
[data-theme="arcade"] :is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) :is(h1, h2, h3) { color: #fff; }
[data-theme="arcade"] .t-bg-dark :is(.t-heading-1, .t-heading-2) > :is(h1, h2)::after { content: ""; display: block; width: 56px; height: 4px; margin-top: .45em; background: var(--t-primary); box-shadow: 0 0 12px var(--t-primary); }
[data-theme="arcade"] .t-bg-dark.t-align-center :is(.t-heading-1, .t-heading-2) > :is(h1, h2)::after { margin-left: auto; margin-right: auto; }
[data-theme="arcade"] .t-card { border: 1px solid #e2e8ea; border-top: 3px solid var(--t-primary); border-radius: 4px; box-shadow: 0 4px 14px rgba(0, 0, 0, .05); transition: transform .15s, box-shadow .15s; }
[data-theme="arcade"] .t-card:hover { transform: translateY(-3px); box-shadow: 0 10px 26px color-mix(in srgb, var(--t-primary) 22%, transparent); }
[data-theme="arcade"] .t-bg-dark .t-card { background: #1e2329; border-color: #2a3037; border-top-color: var(--t-primary); color: rgba(255, 255, 255, .8); }
[data-theme="arcade"] .t-bg-dark .t-card :is(h3, .t-card-title, .t-card-title a) { color: #fff; }
[data-theme="arcade"] .t-service-icon { color: var(--t-primary); }
[data-theme="arcade"] :is(.t-button, .t-cookie-ok), [data-theme="arcade"] a:is(.t-button, .t-cookie-ok) { border-radius: 3px; background: var(--t-primary); color: #fff; font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; text-decoration: none; }
[data-theme="arcade"] :is(a, button):is(.t-button, .t-cookie-ok):hover { color: #fff; filter: brightness(1.08); box-shadow: 0 0 0 3px color-mix(in srgb, var(--t-primary) 25%, transparent); }
[data-theme="arcade"] :is(.t-bg-primary, .t-bg-dark) a.t-button { background: transparent; color: #fff; box-shadow: inset 0 0 0 2px #fff; }
[data-theme="arcade"] .t-bg-dark a.t-button { box-shadow: inset 0 0 0 2px var(--t-primary), 0 0 14px color-mix(in srgb, var(--t-primary) 45%, transparent); }
[data-theme="arcade"] :is(.t-bg-primary, .t-bg-dark) a.t-button:hover { background: #fff; color: var(--t-arcade-dark); filter: none; }
[data-theme="arcade"] .t-footer { border-top: 3px solid var(--t-primary); color: rgba(255, 255, 255, .62); padding-bottom: 0;
    background: linear-gradient(0deg, var(--t-arcade-grid) 1px, transparent 1px) 0 0 / 100% 28px, linear-gradient(90deg, var(--t-arcade-grid) 1px, transparent 1px) 0 0 / 28px 100%, var(--t-arcade-dark); }
[data-theme="arcade"] .t-footer h2 { color: #fff; font-size: .85rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
[data-theme="arcade"] .t-footer a { color: color-mix(in srgb, var(--t-primary) 45%, #fff); }
[data-theme="arcade"] .t-footer a:hover { color: #fff; }
[data-theme="arcade"] .t-footer-bottom { background: var(--t-arcade-darker); margin-top: 1rem; padding-top: .9rem; padding-bottom: .9rem; max-width: none; font-size: .8rem; }
[data-theme="arcade"] .t-library-filter { padding: 1rem; border-radius: 4px; background: color-mix(in srgb, var(--t-primary) 6%, #f7f9fa); border: 1px solid #e2e8ea; }
[data-theme="arcade"] :is(.t-library-tags, .t-projects-filter) a { border-radius: 3px; text-transform: uppercase; font-size: .75rem; font-weight: 700; letter-spacing: .06em; }

.t-page-header { display: none; }
[data-theme="porto"] .t-page-header { display: block; background: #212529; padding: 30px 0; margin-bottom: 35px; }
/* Begint de inhoud met een sectie met achtergrond, dan sluit die aan op de titelbalk: een witte
   strook ertussen ziet eruit als een fout. */
[data-theme="porto"] .t-page-header:has(~ main > .t-section:first-child:is(.t-bg-light, .t-bg-dark, .t-bg-primary, .t-bg-secondary, [style*="background-image"])) { margin-bottom: 0; }
[data-theme="porto"] .t-page-header-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 2rem; }
[data-theme="porto"] .t-page-header-title { margin: 0; color: #fff; font-size: 30px; line-height: 1.1; letter-spacing: -.05em; font-family: var(--t-heading-font); }
[data-theme="porto"] .t-page-header-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; font-size: 14px; color: #777; }
[data-theme="porto"] .t-page-header-crumbs li { display: flex; align-items: center; }
[data-theme="porto"] .t-page-header-crumbs a { color: #999; text-decoration: none; }
[data-theme="porto"] .t-page-header-crumbs a:hover { color: #fff; }
[data-theme="porto"] .t-page-header-crumbs [aria-current="page"] { color: #fff; }
/* Het kruimelpad staat al in de titelbalk; het blok Kruimelpad niet nog eens tonen (zijn
   gestructureerde gegevens voor zoekmachines blijven wel in de pagina). */
[data-theme="porto"] .t-breadcrumbs { display: none; }
/* Porto: de hoofdtitel van een pagina (h1 in de inhoud) groot, vet en gecentreerd, met de
   ondertitel als inleiding eronder */
[data-theme="porto"] .t-heading:has(> h1) { text-align: center; max-width: 820px; margin-inline: auto; }
[data-theme="porto"] .t-heading > h1 { font-size: 42px; font-weight: 700; line-height: 1; margin-bottom: 32px; }
[data-theme="porto"] .t-heading:has(> h1) .t-subtitle { font-size: 16.8px; line-height: 1.9; opacity: .9; }
@media (max-width: 760px) { [data-theme="porto"] .t-heading > h1 { font-size: 30px; } }

/* Module Paarden: overzicht met kaarten en de fiche van een paard. */
.t-horse-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .t-horse-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) {
    .t-horse-grid-3 { grid-template-columns: repeat(3, 1fr); }
    .t-horse-grid-4 { grid-template-columns: repeat(4, 1fr); }
}
.t-horse-card-image { position: relative; display: block; }
.t-horse-card-image img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.t-horse-card-image .t-horse-status { position: absolute; top: .75rem; left: .75rem; }
.t-horse-status { display: inline-block; padding: .15rem .6rem; border-radius: 3px; font-size: .8rem; font-weight: 600; background: var(--t-secondary); color: #fff; }
.t-horse-status-sold { background: #6b7280; }
.t-horse-status-reserved { background: var(--t-primary); }
.t-horse-facts { margin: .5rem 0; display: grid; grid-template-columns: auto 1fr; gap: .15rem .75rem; font-size: .92rem; }
.t-horse-facts dt { opacity: .7; }
.t-horse-facts dd { margin: 0; }
.t-horse-facts .t-horse-kind { grid-column: 1 / -1; font-weight: 600; }
.t-horse-back { margin: 0 0 1rem; }
.t-horse-layout { display: grid; gap: 2rem; grid-template-columns: 1fr; }
@media (min-width: 860px) { .t-horse-layout { grid-template-columns: 3fr 2fr; align-items: start; } }
.t-horse-photo-main img { display: block; width: 100%; height: auto; border-radius: 4px; }
.t-horse-thumbs { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: .5rem; }
.t-horse-thumbs img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 3px; }
.t-horse-info h1 { margin-top: 0; }
.t-horse-summary { font-size: 1.1rem; }
.t-horse-facts-full { font-size: 1rem; gap: .4rem 1.25rem; padding-top: 1rem; border-top: 1px solid #e5e7eb; }
.t-horse-contact { margin: 1.25rem 0 0; }
.t-horse-description { margin-top: 2rem; max-width: 46rem; }

/* Module Veelgestelde vragen: uitklapbare vragen. */
.t-faq-category { margin: 2rem 0 .75rem; }
.t-faq-category:first-of-type { margin-top: 0; }
.t-faq-item { border: 1px solid #e5e7eb; border-radius: 4px; margin: 0 0 .5rem; background: var(--t-background); }
.t-faq-item summary { cursor: pointer; padding: .8rem 1rem; font-weight: 600; list-style: none; display: flex; gap: .75rem; align-items: baseline; }
.t-faq-item summary::-webkit-details-marker { display: none; }
.t-faq-item summary::before { content: "+"; color: var(--t-primary); font-weight: 700; width: 1rem; flex: none; }
.t-faq-item[open] summary::before { content: "−"; }
.t-faq-item summary:hover { color: var(--t-primary); }
.t-faq-answer { padding: 0 1rem .9rem 2.75rem; }
.t-faq-answer p { margin: 0 0 .6rem; }
.t-faq-answer p:last-child { margin-bottom: 0; }

/* Module Openingsuren: status, weekrooster (vandaag vet) en afwijkende uren. */
.t-hours-location + .t-hours-location { margin-top: 2rem; }
.t-hours-status { display: flex; flex-wrap: wrap; align-items: center; gap: 0 .35rem; margin: 0 0 .75rem; }
.t-hours-status strong::before { content: ""; display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; margin-right: .45rem; vertical-align: .05rem; background: #9ca3af; }
.t-hours-open strong { color: #15803d; }
.t-hours-open strong::before { background: #16a34a; }
.t-hours-closed strong { color: #b91c1c; }
.t-hours-closed strong::before { background: #dc2626; }
.t-hours-week { border-collapse: collapse; width: 100%; max-width: 28rem; }
.t-hours-week th, .t-hours-week td { padding: .4rem 0; border-bottom: 1px solid #e5e7eb; text-align: left; vertical-align: top; }
.t-hours-week th { font-weight: 400; padding-right: 1.5rem; white-space: nowrap; }
.t-hours-week td { font-variant-numeric: tabular-nums; }
.t-hours-today th, .t-hours-today td { font-weight: 700; }
.t-hours-note { margin: .75rem 0 0; font-style: italic; }
.t-hours-exceptions { margin-top: 1.25rem; }
.t-hours-exceptions h4 { margin: 0 0 .4rem; font-size: 1rem; }
.t-hours-exceptions ul { list-style: none; margin: 0; padding: 0; }
.t-hours-exceptions li { display: flex; flex-wrap: wrap; gap: 0 .75rem; padding: .3rem 0; }
.t-hours-date { font-weight: 600; }
.t-hours-ranges { font-variant-numeric: tabular-nums; }
.t-hours-label { opacity: .75; }

/* Module Afspraken: stappen met keuzeknoppen, een samenvatting van de keuzes en het formulier. */
.t-booking-step { margin: 1.25rem 0 .6rem; font-size: 1.1rem; }
.t-booking-summary { list-style: none; margin: 0 0 1rem; padding: .6rem .9rem; display: flex; flex-wrap: wrap; gap: .35rem 1.25rem; background: color-mix(in srgb, var(--t-primary) 7%, transparent); border-radius: 6px; }
.t-booking-summary:empty { display: none; }
.t-booking-summary span { font-weight: 600; }
.t-booking-summary a { font-size: .85rem; margin-left: .35rem; }
.t-booking-choices { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.t-booking-choice { display: inline-block; padding: .55rem .95rem; border: 1px solid var(--t-primary); border-radius: 6px; text-decoration: none; color: var(--t-primary); font-weight: 600; }
.t-booking-choice:hover, .t-booking-choice:focus-visible { background: var(--t-primary); color: #fff; }
.t-booking-types { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); }
.t-booking-types .t-booking-choice { display: grid; gap: .2rem; height: 100%; box-sizing: border-box; }
.t-booking-duration { font-weight: 400; font-size: .9rem; opacity: .8; }
.t-booking-description { font-weight: 400; font-size: .9rem; color: var(--t-text); }
.t-booking-types .t-booking-choice:hover .t-booking-description { color: inherit; }
.t-booking-times .t-booking-choice { min-width: 4.5rem; text-align: center; font-variant-numeric: tabular-nums; }
.t-booking-pages { display: flex; gap: 1.5rem; margin: .9rem 0 0; }
.t-booking-form { display: grid; gap: .9rem; max-width: 640px; }
.t-booking-form label { display: grid; gap: .3rem; font-weight: 600; font-size: .95rem; }
.t-booking-form input, .t-booking-form textarea { font: inherit; font-weight: 400; padding: .6rem .7rem; border: 1px solid #c8ccd2; border-radius: 6px; }
.t-booking-form input:focus, .t-booking-form textarea:focus { outline: 2px solid var(--t-primary); outline-offset: 1px; }
.t-booking-form button { justify-self: start; }
.t-booking-thanks { background: #e3f6e8; color: #11612a; padding: 1rem 1.25rem; border-radius: 6px; }
.t-booking-error { background: #fde8e8; color: #a4161a; padding: .75rem 1.25rem; border-radius: 6px; }
.t-booking-privacy { font-size: .85rem; opacity: .75; margin: 0; }

/* Module Reviews: citaten met sterren en wie het zegt; als raster, lijst of horizontaal schuivende rij. */
.t-reviews-average { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5rem; margin: 0 0 1.25rem; font-weight: 600; }
.t-reviews-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25rem; }
.t-reviews-grid .t-reviews-list { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.t-reviews-list > li { display: flex; }
.t-reviews-slider .t-reviews-list { grid-auto-flow: column; grid-auto-columns: minmax(16rem, 22rem); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem; }
.t-reviews-slider .t-reviews-list > li { scroll-snap-align: start; }
.t-reviews-slider .t-reviews-list:focus-visible { outline: 2px solid var(--t-primary); outline-offset: 4px; }
.t-review { flex: 1; display: flex; flex-direction: column; gap: .75rem; margin: 0; padding: 1.25rem 1.5rem; border-radius: 8px; background: rgba(0, 0, 0, .035); }
.t-review blockquote { margin: 0; flex: 1; font-style: italic; }
.t-review blockquote p { margin: 0 0 .5rem; }
.t-review blockquote p:last-child { margin-bottom: 0; }
.t-review figcaption { display: flex; align-items: center; gap: .75rem; }
.t-review figcaption > span { display: flex; flex-direction: column; }
.t-review-role { font-size: .9rem; opacity: .75; }
.t-review-photo { width: 3rem; height: 3rem; flex: none; border-radius: 50%; object-fit: cover; }
.t-review-initials { display: inline-flex; align-items: center; justify-content: center; background: var(--t-primary); color: #fff; font-weight: 700; }
.t-stars { letter-spacing: .1em; font-size: 1.1rem; line-height: 1; white-space: nowrap; }
.t-stars-on { color: #f2a900; }
.t-stars-off { color: currentColor; opacity: .2; }
:is(.t-bg-primary, .t-bg-secondary, .t-bg-dark) .t-review { background: rgba(255, 255, 255, .1); }

/* Module Logo's: een strook logo's, gecentreerd en even hoog; grijs tot de muis erover gaat. */
.t-logos h2 { text-align: center; }
.t-logos-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1.5rem 2.5rem; }
.t-logos-list img { display: block; width: auto; max-width: 11rem; object-fit: contain; }
.t-logos-small .t-logos-list img { height: 2.25rem; }
.t-logos-medium .t-logos-list img { height: 3.5rem; }
.t-logos-large .t-logos-list img { height: 5rem; max-width: 14rem; }
.t-logos-gray .t-logos-list img { filter: grayscale(1); opacity: .7; transition: filter .2s, opacity .2s; }
.t-logos-gray .t-logos-list li:hover img, .t-logos-gray .t-logos-list a:focus-visible img { filter: none; opacity: 1; }
/* Module Links: kaarten met een schermafbeelding (16:10) of een gewone lijst. */
.t-links-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25rem; }
.t-links-cards .t-links-list { grid-template-columns: repeat(auto-fill, minmax(min(16rem, 100%), 1fr)); }
.t-link a { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.t-links-cards .t-link a { border: 1px solid rgba(0, 0, 0, .1); border-radius: 8px; overflow: hidden; transition: box-shadow .2s, transform .2s; }
.t-links-cards .t-link a:hover, .t-links-cards .t-link a:focus-visible { box-shadow: 0 6px 18px rgba(0, 0, 0, .12); transform: translateY(-2px); }
.t-link-image { display: block; aspect-ratio: 16 / 10; background: rgba(0, 0, 0, .05); border-bottom: 1px solid rgba(0, 0, 0, .08); }
.t-link-image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.t-link-initial { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 3rem; font-weight: 700; color: var(--t-primary); opacity: .5; }
.t-link-body { display: flex; flex-direction: column; gap: .2rem; padding: 1rem 1.25rem; }
.t-links-list .t-link-body { padding: 0; }
.t-links-cards .t-link-body { padding: 1rem 1.25rem; }
.t-link-name { color: var(--t-primary); }
.t-link a:hover .t-link-name, .t-link a:focus-visible .t-link-name { text-decoration: underline; }
.t-link-host { font-size: .85rem; opacity: .7; }
.t-link-description { font-size: .95rem; }

/* Module Prijslijsten: als een menukaart, naam en prijs met stippellijntjes ertussen. */
.t-pricelist-intro { max-width: 46rem; }
.t-pricelist-sections { display: grid; gap: 1.5rem 3rem; }
@media (min-width: 900px) { .t-pricelist-two .t-pricelist-sections { grid-template-columns: 1fr 1fr; } }
.t-pricelist-section h3 { margin: 0 0 .6rem; padding-bottom: .35rem; border-bottom: 2px solid var(--t-primary); }
.t-pricelist-section ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .65rem; }
.t-pricelist-line { display: flex; align-items: baseline; gap: .5rem; }
.t-pricelist-name { font-weight: 600; }
.t-pricelist-dots { flex: 1; border-bottom: 1px dotted currentColor; opacity: .35; transform: translateY(-.25em); min-width: 1rem; }
.t-pricelist-price { font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.t-pricelist-description { margin: .15rem 0 0; font-size: .92rem; opacity: .8; }
.t-pricelist-note { margin-top: 1.25rem; font-size: .9rem; font-style: italic; opacity: .8; }

/* Module Evenementen: de agenda met een kalenderblaadje per evenement, en de pagina met inschrijven. */
.t-event-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.t-event { display: flex; gap: 1.25rem; align-items: flex-start; padding-bottom: 1rem; border-bottom: 1px solid #e5e7eb; }
.t-event-past { opacity: .6; }
.t-event-date { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 4.25rem; height: 4.25rem; border-radius: 8px; background: var(--t-primary); color: #fff; text-decoration: none; line-height: 1.1; }
.t-event-day { font-size: 1.6rem; font-weight: 700; }
.t-event-month { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.t-event-body h3 { margin: 0 0 .2rem; }
.t-event-body p { margin: .2rem 0; }
.t-event-when { font-size: .95rem; opacity: .8; }
.t-event-places { font-size: .9rem; font-weight: 600; }
.t-event-full { color: #b91c1c; }
.t-event-left { font-weight: 400; opacity: .8; }
.t-events-none { opacity: .8; }
.t-event-facts { display: flex; flex-wrap: wrap; gap: .75rem 2.5rem; margin: 1rem 0 1.5rem; }
.t-event-facts dt { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.t-event-facts dd { margin: 0; font-weight: 600; }
.t-event-photo img { display: block; width: 100%; max-height: 28rem; object-fit: cover; border-radius: 6px; }
.t-event-register { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid #e5e7eb; }

/* Module Projecten: filter, kaarten met foto, en de pagina van een project. */
.t-projects-filter { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.25rem; }
.t-projects-filter a { padding: .35rem .85rem; border: 1px solid var(--t-primary); border-radius: 999px; text-decoration: none; color: var(--t-primary); font-size: .9rem; }
.t-projects-filter a.active, .t-projects-filter a:hover { background: var(--t-primary); color: #fff; }
.t-project-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.5rem; grid-template-columns: repeat(var(--t-project-columns, 3), minmax(0, 1fr)); }
.t-project-grid-2 { --t-project-columns: 2; }
.t-project-grid-4 { --t-project-columns: 4; }
@media (max-width: 900px) { .t-project-grid { --t-project-columns: 2; } }
@media (max-width: 560px) { .t-project-grid { --t-project-columns: 1; } }
.t-project-card { display: flex; flex-direction: column; overflow: hidden; }
.t-project-card-image img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .3s; }
.t-project-card:hover .t-project-card-image img { transform: scale(1.03); }
.t-project-card-image { overflow: hidden; }
.t-project-category { margin: 0 0 .25rem; color: var(--t-primary); font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.t-project-back { margin: 0 0 1rem; }
.t-project-summary { font-size: 1.15rem; max-width: 46rem; }
.t-project-facts { display: flex; flex-wrap: wrap; gap: .5rem 2rem; margin: 1rem 0 1.5rem; }
.t-project-facts dt { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.t-project-facts dd { margin: 0; font-weight: 600; }
.t-project-photos { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr)); }
.t-project-photos li:first-child { grid-column: 1 / -1; }
.t-project-photos img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; }
.t-project-photos li:first-child img { aspect-ratio: 16 / 9; }
.t-project-description { max-width: 46rem; }

/* Module Formulieren: velden onder elkaar, keuzes als lijst, een fout veld rood. */
.t-form-fields { display: grid; gap: .9rem; max-width: 640px; }
.t-form-fields > label, .t-form-choice, .t-form-consent { display: grid; gap: .3rem; font-weight: 600; font-size: .95rem; }
.t-form-fields input:not([type="checkbox"], [type="radio"]), .t-form-fields textarea, .t-form-fields select { font: inherit; font-weight: 400; padding: .6rem .7rem; border: 1px solid #c8ccd2; border-radius: 6px; background: var(--t-background); }
.t-form-fields :is(input, textarea, select):focus { outline: 2px solid var(--t-primary); outline-offset: 1px; }
.t-form-choice { border: 0; margin: 0; padding: 0; }
.t-form-choice legend { padding: 0; margin-bottom: .2rem; }
.t-form-choice label, .t-form-consent label { display: flex; gap: .5rem; align-items: baseline; font-weight: 400; }
.t-form-help { font-weight: 400; font-size: .85rem; opacity: .75; }
.t-form-invalid :is(input, textarea, select) { border-color: #dc2626; }
.t-form-invalid > span, .t-form-invalid legend { color: #b91c1c; }
.t-form-fields button { justify-self: start; }
.t-form-thanks { background: #e3f6e8; color: #11612a; padding: 1rem 1.25rem; border-radius: 6px; }
.t-form-error { background: #fde8e8; color: #a4161a; padding: .75rem 1.25rem; border-radius: 6px; }
.t-form-privacy { font-size: .85rem; opacity: .75; margin: 0; }
/* Leden: postcode en gemeente naast elkaar. */
.t-members-row { display: grid; grid-template-columns: minmax(6rem, 9rem) 1fr; gap: .9rem; }
.t-members-row > label { display: grid; gap: .3rem; font-weight: 600; font-size: .95rem; }

/* Module Zoeken: zoekvak met knop, aantal en resultaten met de gezochte woorden gemarkeerd. */
.t-search-form { display: flex; gap: .5rem; max-width: 640px; }
.t-search-label { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.t-search-form input { flex: 1; min-width: 0; font: inherit; padding: .6rem .7rem; border: 1px solid #c8ccd2; border-radius: 6px; }
.t-search-form input:focus { outline: 2px solid var(--t-primary); outline-offset: 1px; }
.t-search-count { margin: 1rem 0 .5rem; opacity: .8; }
.t-search-results { list-style: none; margin: 0; padding: 0; }
.t-search-results li { padding: .75rem 0; border-bottom: 1px solid #e5e7eb; }
.t-search-results a { font-weight: 600; font-size: 1.05rem; }
.t-search-results p { margin: .25rem 0 0; font-size: .95rem; }
.t-search-results mark { background: color-mix(in srgb, var(--t-primary) 18%, transparent); color: inherit; padding: 0 .1em; border-radius: 2px; }

/* Prijstabellen (t-plan…), bv. uit een sjabloon van API-gegevens; naar de prijstabel van Porto. */
.t-plans-period { display: inline-flex; border: 1px solid var(--t-primary); border-radius: 4px; overflow: hidden; margin-bottom: 1.5rem; }
.t-plans-period a { padding: .45rem 1.1rem; text-decoration: none; color: var(--t-primary); font-weight: 600; }
.t-plans-period a.active { background: var(--t-primary); color: #fff; }
.t-plans-app { margin: 2rem 0 1rem; }
.t-plans-app:first-of-type { margin-top: 0; }
.t-plans-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 900px) { .t-plans-grid { grid-template-columns: repeat(3, 1fr); } }
/* Het blok Formules zet een klasse naar het aantal formules: 1, 2 of 4 naast elkaar (4: eerst twee per rij). */
.t-plans-grid-1 { max-width: 26rem; margin-inline: auto; }
@media (min-width: 700px) { .t-plans-grid:is(.t-plans-grid-2, .t-plans-grid-4) { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .t-plans-grid.t-plans-grid-4 { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 900px) { .t-plans-grid.t-plans-grid-many { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); } }
.t-plan { border: 1px solid #e5e5e5; border-radius: 4px; overflow: hidden; display: flex; flex-direction: column; background: var(--t-background); }
.t-plan-featured { border-color: var(--t-primary); box-shadow: 0 0 0 2px var(--t-primary); }
.t-plan-header { background: #212529; color: #fff; padding: 1rem 1.25rem; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; }
.t-plan-featured .t-plan-header { background: var(--t-primary); }
.t-plan-header h3 { margin: 0; color: inherit; font-size: 1.25rem; }
.t-plan-tag { white-space: nowrap; font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; background: rgba(255, 255, 255, .2); padding: .15rem .5rem; border-radius: 3px; }
.t-plan-price { background: #f4f4f4; padding: 1.1rem 1.25rem; display: flex; flex-direction: column; align-items: center; text-align: center; gap: .1rem; }
.t-plan-amount { font-size: 2rem; font-weight: 700; color: #212529; line-height: 1.2; }
.t-plan-amount-text { font-size: 1.15rem; }
.t-plan-label, .t-plan-vat { font-size: .85rem; opacity: .8; }
.t-plan-saving { font-size: .85rem; font-weight: 600; color: var(--t-primary); }
.t-plan-features { list-style: none; margin: 0; padding: .5rem 1.25rem 1rem; }
.t-plan-features li { display: flex; gap: .6rem; padding: .45rem 0; border-bottom: 1px solid rgba(0, 0, 0, .06); }
.t-plan-features li:last-child { border-bottom: 0; }
.t-plan-features .is-out { opacity: .5; }
.t-plan-check { width: 1rem; flex: none; color: var(--t-primary); font-weight: 700; }
.t-plan-limit { font-weight: 600; }
.t-plan-features { flex: 1; }
.t-plan-action { padding: 0 1.25rem 1.25rem; text-align: center; }
.t-pricing > h2 { text-align: center; }
/* Module Lessen: per dag de lessen met uur, plaatsen en de knop; de eigen lessen in de kijker. */
.t-lessons-account p { margin: 0 0 1rem; }
.t-lessons-weeks { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; margin: 0 0 1rem; }
.t-lessons-day { font-size: 1.1rem; margin: 1.25rem 0 .5rem; }
.t-lessons-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.t-lesson { display: grid; grid-template-columns: 7rem 1fr auto; gap: .5rem 1rem; align-items: center; padding: .75rem 1rem; border: 1px solid rgba(0, 0, 0, .1); border-radius: 8px; }
.t-lesson-mine { border: 2px solid var(--t-primary); }
.t-lesson-time { font-weight: 700; font-variant-numeric: tabular-nums; }
.t-lesson-body { display: flex; flex-direction: column; gap: .1rem; }
.t-lesson-meta, .t-lesson-places, .t-lesson-description { font-size: .9rem; opacity: .8; }
.t-lesson-action { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
.t-lesson-action form { margin: 0; }
.t-lesson-status { font-weight: 600; color: var(--t-primary); }
@media (max-width: 640px) { .t-lesson { grid-template-columns: 1fr; } .t-lesson-action { justify-content: flex-start; } }
/* Module Fiscale kalender: de deadlines per maand, wat binnenkort valt in de kijker; de keuzes voor herinneringen. */
.t-taxcalendar-month { font-size: 1.1rem; margin: 1.5rem 0 .5rem; }
.t-taxcalendar-list h4 { margin: 0; }
.t-taxcalendar-soon .t-event-date { background: var(--t-primary); color: #fff; }
.t-taxcalendar-badge { display: inline-block; margin-left: .5rem; padding: .05rem .5rem; border-radius: 999px; background: var(--t-primary); color: #fff; font-size: .75rem; font-weight: 600; }
.t-taxcalendar-subscribe { margin-top: 1.5rem; display: flex; flex-wrap: wrap; gap: .25rem .75rem; align-items: baseline; }
.t-taxcalendar-subscribe a { font-weight: 600; }
.t-taxcalendar-hint { font-size: .85rem; opacity: .75; }
.t-taxreminders-categories { border: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: .35rem 1rem; }
.t-taxreminders-categories legend { font-weight: 600; font-size: .95rem; margin-bottom: .4rem; }
.t-booking-form .t-taxreminders-check { display: flex; align-items: center; gap: .5rem; font-weight: 400; }
.t-booking-form select { font: inherit; padding: .55rem .7rem; border: 1px solid #c8ccd2; border-radius: 6px; max-width: 20rem; }
/* Module Cadeaubonnen: de bedragen als knoppen naast elkaar, een eigen bedrag eronder. */
.t-giftcard-amounts { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.t-giftcard-amounts legend { font-weight: 600; font-size: .95rem; margin-bottom: .4rem; }
.t-giftcard-amount { position: relative; }
.t-giftcard-amount input { position: absolute; opacity: 0; }
.t-giftcard-amount span { display: inline-block; padding: .55rem 1.1rem; border: 2px solid var(--t-primary); border-radius: 6px; color: var(--t-primary); font-weight: 700; cursor: pointer; }
.t-giftcard-amount input:checked + span { background: var(--t-primary); color: #fff; }
.t-giftcard-amount input:focus-visible + span { outline: 3px solid var(--t-primary); outline-offset: 2px; }
.t-giftcard-custom { flex-basis: 100%; }
.t-giftcard-custom input { max-width: 10rem; }
.t-giftcard-terms { white-space: pre-line; }
/* Module Kennisbank: zoekvak, artikels per categorie, en de pagina van een artikel. */
.t-knowledge-search { display: flex; flex-wrap: wrap; gap: .6rem; max-width: 640px; margin: 0 0 1.5rem; }
.t-knowledge-search input { flex: 1 1 14rem; font: inherit; padding: .6rem .7rem; border: 1px solid #c8ccd2; border-radius: 6px; }
.t-knowledge-search input:focus { outline: 2px solid var(--t-primary); outline-offset: 1px; }
.t-knowledge-count { font-weight: 600; }
.t-knowledge-category { margin-bottom: 1.5rem; }
.t-knowledge-category h3 { margin: 0 0 .5rem; }
.t-knowledge-list { list-style: none; margin: 0; padding: 0; }
.t-knowledge-list li { padding: .5rem 0; border-bottom: 1px solid rgba(0, 0, 0, .08); }
.t-knowledge-list li:last-child { border-bottom: 0; }
.t-knowledge-list a { font-weight: 600; }
.t-knowledge-summary { display: block; font-size: .9rem; opacity: .8; }
.t-knowledge-category-name { margin: 0; font-size: .85rem; text-transform: uppercase; letter-spacing: .05em; opacity: .7; }
.t-knowledge-body { max-width: 46rem; }
.t-knowledge-updated { font-size: .85rem; opacity: .7; margin-top: 2rem; }
.t-knowledge-related { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid rgba(0, 0, 0, .1); max-width: 46rem; }
.t-knowledge-related h2 { font-size: 1.15rem; }
/* Module Vestigingen: kaartjes naast elkaar; de dichtstbijzijnde krijgt een rand in de kleur van de site. */
.t-locations-nearest { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin: 0 0 1rem; }
.t-locations-status { font-size: .9rem; opacity: .8; }
.t-location-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); }
.t-location { padding: 1.25rem 1.5rem; border: 1px solid rgba(0, 0, 0, .1); border-radius: 8px; }
.t-location h3 { margin: 0 0 .25rem; }
.t-location address { font-style: normal; margin: .5rem 0; }
.t-location-hours, .t-location-note { margin: .5rem 0; }
.t-location-note { font-size: .9rem; opacity: .8; }
.t-location-distance { display: block; font-size: .85rem; font-weight: 600; color: var(--t-primary); }
.t-location-distance:empty { display: none; }
.t-location-nearest { border: 2px solid var(--t-primary); }
/* Module Nieuwsbrief: het adres en de knop naast elkaar (onder elkaar op een smal scherm). */
.t-newsletter-form { display: flex; flex-wrap: wrap; gap: .6rem; max-width: 640px; margin: .75rem 0; }
.t-newsletter-form label { flex: 1 1 14rem; display: flex; }
.t-newsletter-form input { flex: 1; font: inherit; padding: .6rem .7rem; border: 1px solid #c8ccd2; border-radius: 6px; }
.t-newsletter-form input:focus { outline: 2px solid var(--t-primary); outline-offset: 1px; }
.t-newsletter .t-booking-privacy { margin-top: .25rem; }
/* Module Downloads: per bestand een label met het soort, de titel als link, grootte en uitleg. */
.t-download-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.t-download { display: flex; align-items: flex-start; gap: .9rem; padding: .75rem 0; border-bottom: 1px solid rgba(0, 0, 0, .08); }
.t-download:last-child { border-bottom: 0; }
.t-download-kind { flex: none; min-width: 3rem; padding: .35rem .4rem; border-radius: 4px; background: var(--t-primary); color: #fff; font-size: .75rem; font-weight: 700; text-align: center; letter-spacing: .03em; }
.t-download-body { display: flex; flex-direction: column; gap: .15rem; }
.t-download-body a { font-weight: 600; }
.t-download-meta { font-size: .8rem; opacity: .7; }
.t-download-description { font-size: .95rem; }

/* Bibliotheek: filterformulier boven de kaarten (hergebruikt het projectenraster), tags en downloads. */
.t-library-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem; margin: 0 0 1.5rem; }
.t-library-field { display: flex; flex-direction: column; gap: .25rem; min-width: 10rem; }
.t-library-field label { font-size: .8rem; font-weight: 600; }
.t-library-field input, .t-library-field select { font: inherit; font-weight: 400; padding: .5rem .6rem; border: 1px solid #c8ccd2; border-radius: 6px; background: var(--t-background); color: inherit; }
.t-library-field :is(input, select):focus { outline: 2px solid var(--t-primary); outline-offset: 1px; }
.t-library-search { flex: 1 1 14rem; }
.t-library-filter .t-button { padding: .55rem 1.2rem; }
.t-library-empty { opacity: .8; }
.t-library-meta { display: flex; flex-wrap: wrap; gap: .25rem .9rem; margin: .5rem 0 0; font-size: .8rem; opacity: .7; }
.t-library-pages { display: flex; justify-content: center; align-items: center; gap: 1.25rem; margin: 1.5rem 0 0; }
.t-library-tags { list-style: none; margin: 0 0 1.5rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.t-library-tags a { display: inline-block; padding: .2rem .7rem; border: 1px solid var(--t-primary); border-radius: 999px; color: var(--t-primary); font-size: .85rem; text-decoration: none; }
.t-library-tags a:hover { background: var(--t-primary); color: #fff; }
.t-library-files { margin: 0 0 2rem; }
.t-library-files .t-download { align-items: center; }
.t-library-files .t-download-body { flex: 1; min-width: 0; }
.t-library-checksum { font-size: .75rem; opacity: .6; overflow-wrap: anywhere; }
.t-library-checksum code { font-size: inherit; }
.t-library-programs { display: block; margin-top: .25rem; font-size: .8rem; color: #8a1f1f; }
.t-library-download { flex: none; text-decoration: none; padding: .5rem 1rem; }
@media (max-width: 560px) { .t-library-files .t-download { flex-wrap: wrap; } .t-library-field { min-width: 0; flex: 1 1 100%; } }

/* Community: reacties en beoordelingen bij een item, en het inzendblok. */
.t-discussion { margin: 2rem 0 0; max-width: 46rem; }
.t-rating-summary { display: flex; align-items: center; gap: .6rem; margin: 0 0 1rem; }
.t-stars { color: #e6a800; letter-spacing: .1em; font-size: 1.1rem; }
.t-comments { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: 1rem; }
.t-comment { padding: .9rem 1rem; border: 1px solid rgba(0, 0, 0, .08); border-radius: 6px; background: rgba(0, 0, 0, .02); }
.t-comment-meta { margin: 0 0 .35rem; font-size: .85rem; opacity: .75; }
.t-comment-body p { margin: 0 0 .5rem; }
.t-comment-body p:last-child { margin-bottom: 0; }
.t-comment-actions { margin: .4rem 0 0; }
.t-link-button { background: none; border: 0; padding: 0; font: inherit; font-size: .8rem; color: var(--t-primary); cursor: pointer; text-decoration: underline; }
.t-rate { border: 0; padding: 0; margin: 0 0 .5rem; display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
.t-rate legend { font-weight: 600; margin-bottom: .35rem; }
.t-rate-option { display: inline-flex; align-items: center; gap: .3rem; cursor: pointer; }
.t-discussion-empty { opacity: .8; }
.t-library-mine { margin-top: 1.5rem; }
.t-games-count { margin: 0 0 1rem; font-size: .85rem; opacity: .7; }
.t-collection-meta { display: flex; flex-wrap: wrap; gap: .25rem .75rem; margin: 0 0 .5rem; font-size: .85rem; opacity: .8; }
.t-collection-badges { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 .5rem; }
.t-collection-badges:empty { display: none; }
.t-collection-works { background: #d9f2e3; color: #1d6b3f; }
.t-collection-status-wishlist { background: #fff2cc; color: #7a5a00; }
.t-collection-status-sold, .t-collection-status-lent { background: rgba(0, 0, 0, .08); }
.t-collection-wishlist .t-project-card-image img { opacity: .75; }
.t-games-cover { display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--t-primary) 10%, #f2f4f5); }
.t-games-cover img { aspect-ratio: 3 / 4; object-fit: cover; }
.t-games-nocover { display: flex; align-items: center; justify-content: center; width: 100%; aspect-ratio: 3 / 4; font-size: 3rem; font-weight: 700; color: var(--t-primary); opacity: .6; }
.t-games-year { font-weight: 400; opacity: .7; }
.t-games-platforms { margin: 0 0 .5rem; font-size: .85rem; opacity: .8; }
.t-game-head { display: flex; gap: 2rem; align-items: flex-start; margin: 0 0 1.5rem; }
.t-game-cover { flex: 0 0 220px; max-width: 40%; }
.t-game-cover img { display: block; width: 100%; border-radius: 6px; box-shadow: 0 2px 10px rgba(0, 0, 0, .15); }
.t-game-head-body { flex: 1; min-width: 0; }
.t-game-links ul { padding-left: 1.25rem; }
/* De downloads van de bibliotheek bij een spel, per soort. */
.t-game-downloads h3 { margin: 1.25rem 0 .4rem; font-size: 1.05rem; }
.t-game-downloads ul { margin: 0; }
.t-game-downloads-by { opacity: .7; font-size: .9em; }
.t-game-downloads-more { margin: .3rem 0 0; font-size: .95rem; }
@media (max-width: 640px) { .t-game-head { flex-direction: column; } .t-game-cover { flex-basis: auto; max-width: 60%; } }
.t-library-status { font-size: .8rem; font-weight: 600; padding: .15rem .5rem; border-radius: 999px; background: rgba(0, 0, 0, .08); }
.t-library-status-approved { background: #d9f2e3; color: #1d6b3f; }
.t-library-status-rejected { background: #fbe1e1; color: #8a1f1f; }
.t-account-section { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid rgba(0, 0, 0, .08); }
.t-account-danger h3 { color: #8a1f1f; }
.t-check { display: flex; align-items: center; gap: .5rem; }
.t-lobby-players { margin: 0 0 1rem; padding-left: 1.25rem; }
.t-lobby-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.25rem; }
.t-lobby-action { margin: 0; }
.t-lobby-turn { padding: 1rem; border-radius: 6px; background: color-mix(in srgb, var(--t-primary) 8%, transparent); margin: 0 0 1.25rem; }
.t-lobby-waiting { opacity: .8; }
.t-lobby-yourturn { margin-left: .5rem; color: var(--t-primary); }
.t-lobby-notes { white-space: pre-line; }
.t-lobby-status-running { background: #d9f2e3; color: #1d6b3f; }
.t-lobby-status-finished, .t-lobby-status-cancelled { background: rgba(0, 0, 0, .08); }
.t-lobby-new { margin-top: 1.5rem; }
.t-lobby-finish { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem; margin: 0 0 1.25rem; }
.t-lobby-finish label { display: flex; flex-direction: column; gap: .25rem; font-size: .85rem; }
.t-lobby-finish select { font: inherit; padding: .45rem .6rem; border: 1px solid #c8ccd2; border-radius: 6px; }
.t-lobby-me { font-weight: 700; }
/* Module Vacatures: een lijst van jobs, en de tekst van een vacature met opsommingen. */
.t-job-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.t-job { padding: 1.25rem 1.5rem; border: 1px solid rgba(0, 0, 0, .1); border-radius: 8px; }
.t-job h3 { margin: 0 0 .25rem; }
.t-job h3 a { text-decoration: none; }
.t-job p { margin: .35rem 0 0; }
.t-job-meta { font-size: .9rem; opacity: .75; }
.t-job-more { font-weight: 600; }
.t-job-description { max-width: 46rem; }
.t-job-description h2 { font-size: 1.25rem; margin: 1.5rem 0 .5rem; }
.t-job-description ul { padding-left: 1.25rem; }
.t-booking-form input[type="file"] { padding: .45rem; background: #fff; }
.t-booking-hint { font-weight: 400; font-size: .8rem; opacity: .75; }
/* Packs: dezelfde kaarten als de formules, onder een eigen titel; de kop in de kleur van de site. */
.t-plans-packs { margin-top: 2.5rem; }
.t-plans-packs > h3 { margin: 0 0 .35rem; font-size: 1.4rem; }
.t-plans-packs > p { margin: 0 0 1.25rem; opacity: .85; }
.t-plan-pack .t-plan-header { background: var(--t-secondary, var(--t-primary)); }
.t-plans-extra { margin-top: 1.5rem; border: 1px dashed var(--t-primary); border-radius: 4px; padding: 1.25rem 1.5rem; background: var(--t-background); }
.t-plans-extra h3 { margin: 0 0 .35rem; font-size: 1.2rem; }
.t-plans-extra p { margin: 0; opacity: .85; }
.t-plans-extra-list { list-style: none; margin: .9rem 0 0; padding: 0; columns: 13rem; column-gap: 1.5rem; }
.t-plans-extra-list li { break-inside: avoid; padding: .3rem 0; display: flex; gap: .6rem; }
.t-plans-extra .t-plan-action { padding: 1rem 0 0; text-align: left; }
.t-plans-unavailable, .t-api-unavailable { opacity: .75; font-style: italic; }

/* Lettertypepaar Raleway + Merriweather (zoals de oude site van Stal Eerselingen): titels en knoppen
   in Merriweather, titels in gespatieerde kapitalen; na de thema's, zodat het paar voorgaat. */
[data-font="raleway-merriweather"] :is(h1, h2, h3, h4) { font-weight: 400; text-transform: uppercase; letter-spacing: .12em; line-height: 1.3; }
[data-font="raleway-merriweather"] .t-subtitle { font-family: var(--t-heading-font); font-style: italic; letter-spacing: .02em; }
[data-font="raleway-merriweather"] :is(.t-button, .t-cookie-ok, .t-nav a, .t-brand) { font-family: var(--t-heading-font); letter-spacing: 0; }
[data-font="raleway-merriweather"] .t-footer h2 { letter-spacing: .1em; }