/*
Theme Name: Merkmakers Studio
Theme URI: https://merkmakersstudio.nl
Author: Merkmakers Studio
Description: Lichtgewicht blokthema voor Merkmakers Studio. Geen pagebuilder, geen plugins nodig voor het thema zelf.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: merkmakers
*/

/* Toegankelijkheid */
.skip-link{position:absolute;left:-999px}
.skip-link:focus{left:0;top:0;z-index:100;background:var(--wp--preset--color--groen);color:var(--wp--preset--color--creme);padding:.75rem 1rem}
:where(a,button,input,textarea,summary):focus-visible{outline:3px solid var(--wp--preset--color--goud);outline-offset:3px}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

/* Woordmerk in de header */
.mm-woordmerk{font-family:var(--wp--preset--font-family--serif);font-weight:700;letter-spacing:-.035em;line-height:1;margin:0}
.mm-woordmerk a{text-decoration:none}
.mm-punt{display:inline-block;width:.25em;height:.25em;border-radius:50%;background:#C79A4B;margin:0 .07em;vertical-align:baseline}
.mm-woordmerk small{font-family:var(--wp--preset--font-family--sans);font-size:.55rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;margin-left:.7rem}

/* Gouden punt als opsommingsteken */
.is-style-mm-punten{list-style:none;padding-left:0}
.is-style-mm-punten li{position:relative;padding-left:1.1rem;margin-bottom:.4rem}
.is-style-mm-punten li::before{content:"";position:absolute;left:0;top:.7em;width:.45rem;height:.45rem;border-radius:50%;background:var(--wp--preset--color--goud)}

/* Hero-paneel */
.mm-paneel{position:relative}
.mm-paneel::before{content:"";position:absolute;top:0;left:clamp(1.75rem,3.5vw,3rem);width:3.5rem;height:4px;background:var(--wp--preset--color--goud)}
.mm-paneel p{border-top:1px solid rgba(247,243,236,.22);padding-top:1rem;margin-top:1rem}
.mm-paneel p:first-of-type{border-top:0;padding-top:0;margin-top:0}

/* Lijnen tussen situaties en stappen */
.mm-lijnen > *{border-top:1px solid rgba(30,47,42,.18);padding-top:1.5rem;padding-bottom:1.5rem;margin:0}
.mm-lijnen > *:last-child{border-bottom:1px solid rgba(30,47,42,.18)}

/* Stappen met gouden onderlijn */
.mm-stappen{border-top:1px solid rgba(30,47,42,.18)}
.mm-stappen:last-of-type{border-bottom:1px solid rgba(30,47,42,.18)}
.mm-nummer{font-family:var(--wp--preset--font-family--serif);font-size:2.2rem;line-height:1;margin:0;border-bottom:3px solid var(--wp--preset--color--goud);width:2rem;padding-bottom:.4rem}

/* Kolommen in het aanbod met scheidingslijn */
@media (min-width:782px){
 .mm-aanbod .wp-block-column + .wp-block-column{border-left:1px solid rgba(247,243,236,.25);padding-left:2rem}
}

/* FAQ */
.wp-block-details{border-top:1px solid rgba(30,47,42,.18);padding:1.25rem 0}
.wp-block-details summary{font-family:var(--wp--preset--font-family--serif);font-size:1.3rem;cursor:pointer}
.wp-block-details p{margin-top:1rem}

/* Formulier (Fluent Forms / WPForms): leesbaar, met zichtbare labels */
.mm-formulier input,.mm-formulier textarea{border:1.5px solid var(--wp--preset--color--groen);border-radius:2px;padding:.8rem .9rem;min-height:48px;width:100%;font:inherit}
.mm-formulier label{font-weight:600}

/* Voorbeeldlabel en knop in het menu */
.mm-label{display:inline-block;border:1px solid var(--wp--preset--color--goud);padding:.25rem .7rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin-bottom:1rem}
.mm-voorbeeld .wp-block-column{border-top:3px solid var(--wp--preset--color--goud);padding-top:1rem}
.mm-nav-knop a{background:var(--wp--preset--color--groen);color:var(--wp--preset--color--creme)!important;padding:.6rem 1.1rem;border-radius:2px;font-weight:600}