/*
Theme Name: Mariken de Kok
Template: twentytwentyfive
Description: Child theme for marikendekok.nl (warm, calm and fresh; colours taken from Mariken's portrait).
Version: 1.0.3
Text Domain: marikendekok
*/

/* ---------- basics ---------- */
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
::selection { background: #F4D7CC; }
.wp-site-blocks { padding-top: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }
main.wp-block-group { margin-top: 0 !important; }
.wp-element-button, .wp-block-button__link { transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease; }
.wp-element-button:hover, .wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(210, 105, 75, .7); }
.is-style-outline .wp-block-button__link { background: transparent; color: var(--wp--preset--color--contrast); border: 1.5px solid rgba(30, 43, 51, .25); }
.is-style-outline .wp-block-button__link:hover { border-color: var(--wp--preset--color--contrast); box-shadow: none; }
em { font-style: italic; }
h1 em, h2 em { color: var(--wp--preset--color--coral); }

/* ---------- header ---------- */
.mk-header { position: sticky; top: 0; z-index: 50; background: rgba(251, 248, 244, .82); backdrop-filter: saturate(160%) blur(14px); -webkit-backdrop-filter: saturate(160%) blur(14px); border-bottom: 1px solid rgba(30, 43, 51, .06); }
.mk-header .mk-header-inner { padding: 1rem clamp(1.25rem, 4vw, 2.5rem); max-width: 1200px; margin: 0 auto; }
.mk-brand { font-family: var(--wp--preset--font-family--literata); font-size: 1.45rem; letter-spacing: -.01em; margin: 0; line-height: 1.1; }
.mk-brand a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.mk-brand-sub { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--wp--preset--color--slate); margin: .2rem 0 0; font-weight: 600; }
.mk-nav { gap: clamp(.9rem, 2.4vw, 2rem); }
.mk-nav p { margin: 0; }
.mk-nav a { color: var(--wp--preset--color--contrast); text-decoration: none; font-weight: 600; font-size: .95rem; position: relative; }
.mk-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 2px; background: var(--wp--preset--color--coral); transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.mk-nav a:hover::after { transform: scaleX(1); }
.mk-nav .wp-block-button__link { padding: .65rem 1.25rem; font-size: .92rem; }
.mk-nav .wp-block-buttons a::after { display: none; }
@media (max-width: 860px) { .mk-nav .mk-navlink { display: none; } }

/* ---------- sections ---------- */
.mk-section { padding: clamp(4.5rem, 9vw, 8rem) clamp(1.25rem, 4vw, 2.5rem) !important; }
.mk-eyebrow { display: block; font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--coral); margin-bottom: .25rem !important; }
.mk-pill { display: inline-flex; align-items: center; gap: .55rem; padding: .45rem 1rem .45rem .75rem; border-radius: 999px; background: var(--wp--preset--color--white); box-shadow: 0 1px 0 rgba(30, 43, 51, .06), 0 8px 24px -16px rgba(30, 43, 51, .35); font-size: .85rem; font-weight: 600; color: var(--wp--preset--color--slate); }
.mk-pill::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: var(--wp--preset--color--coral); box-shadow: 0 0 0 4px rgba(210, 105, 75, .18); }
.mk-lead { font-size: clamp(1.1rem, 1.6vw, 1.28rem); color: #43525C; max-width: 34rem; }
.mk-center { text-align: center; }
.mk-center .mk-lead { margin-left: auto; margin-right: auto; }

/* ---------- hero ---------- */
.mk-hero { position: relative; overflow: hidden; background: radial-gradient(1200px 600px at 85% 10%, #F4EBE0 0%, rgba(244, 235, 224, 0) 60%), radial-gradient(900px 500px at 0% 100%, #E9EFF2 0%, rgba(233, 239, 242, 0) 60%), var(--wp--preset--color--base); padding-top: clamp(3rem, 7vw, 6rem) !important; }
.mk-hero .wp-block-columns { align-items: center !important; gap: clamp(2rem, 6vw, 5rem); }
.mk-hero h1 { margin-top: 1.4rem; }
.mk-trust { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: 2rem !important; font-size: .92rem; color: var(--wp--preset--color--slate); font-weight: 600; }
.mk-photo-wrap { position: relative; }
.mk-photo-wrap::before { content: ""; position: absolute; inset: 8% -6% -5% 10%; border-radius: 260px 260px 40px 40px; background: linear-gradient(160deg, #F1C9B9 0%, #D2694B 100%); opacity: .9; transform: rotate(4deg); }
.mk-photo { position: relative; margin: 0 !important; }
.mk-photo img { border-radius: 260px 260px 32px 32px; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; width: 100%; box-shadow: 0 40px 80px -40px rgba(30, 43, 51, .55); }
.mk-float { position: absolute; left: -8%; bottom: 9%; max-width: 270px; background: var(--wp--preset--color--white); border-radius: 18px; padding: 1rem 1.15rem !important; box-shadow: 0 24px 48px -24px rgba(30, 43, 51, .45); font-family: var(--wp--preset--font-family--literata); font-style: italic; font-size: 1rem; line-height: 1.45; animation: mk-bob 6s ease-in-out infinite; }
.mk-float p { margin: 0; }
.mk-float .mk-stars { font-family: var(--wp--preset--font-family--manrope); font-style: normal; color: var(--wp--preset--color--gold); letter-spacing: .15em; font-size: .85rem; margin-bottom: .3rem; }
@keyframes mk-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@media (max-width: 781px) { .mk-float { left: 4%; bottom: -6%; } .mk-photo-wrap { margin: 0 6% 3rem; } }
@media (prefers-reduced-motion: reduce) { .mk-float { animation: none; } html { scroll-behavior: auto; } }

/* ---------- recognise ---------- */
.mk-recognise { background: var(--wp--preset--color--white); }
.mk-checks { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; max-width: 1000px; margin: 2.5rem auto 0 !important; }
.mk-checks li { background: var(--wp--preset--color--base); border-radius: 18px; padding: 1.3rem 1.3rem 1.3rem 3.4rem; position: relative; font-weight: 500; line-height: 1.5; }
.mk-checks li::before { content: ""; position: absolute; left: 1.2rem; top: 1.45rem; width: 1.3rem; height: 1.3rem; border-radius: 50%; background: #F4D7CC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D2694B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center / 62% no-repeat; }
.mk-note { margin-top: 2.5rem !important; font-family: var(--wp--preset--font-family--literata); font-style: italic; font-size: 1.35rem; color: var(--wp--preset--color--slate); }

/* ---------- services ---------- */
.mk-services { background: var(--wp--preset--color--mist); }
.mk-cards { gap: 1.5rem !important; margin-top: 3rem !important; }
.mk-card { background: var(--wp--preset--color--white); border-radius: 24px; padding: 2.2rem 2rem !important; height: 100%; box-shadow: 0 1px 0 rgba(30, 43, 51, .05), 0 30px 60px -45px rgba(30, 43, 51, .5); transition: transform .3s ease, box-shadow .3s ease; }
.mk-card:hover { transform: translateY(-6px); box-shadow: 0 1px 0 rgba(30, 43, 51, .05), 0 40px 70px -40px rgba(30, 43, 51, .55); }
.mk-card h3 { margin-top: .4rem; }
.mk-num { font-family: var(--wp--preset--font-family--literata); font-style: italic; font-size: 2.6rem; line-height: 1; color: var(--wp--preset--color--coral); margin: 0 !important; }
.mk-card p:last-child { color: #4A5963; margin-bottom: 0; }
.wp-block-column:has(> .mk-card) { display: flex; }

/* ---------- about ---------- */
.mk-about { background: var(--wp--preset--color--base); }
.mk-about .wp-block-columns { gap: clamp(2rem, 6vw, 5rem); align-items: center !important; }
.mk-facts { background: var(--wp--preset--color--slate); color: #EEF3F5; border-radius: 28px; padding: 2.4rem 2.2rem !important; position: relative; overflow: hidden; }
.mk-facts::after { content: ""; position: absolute; right: -60px; top: -60px; width: 200px; height: 200px; border-radius: 50%; background: rgba(255, 255, 255, .06); }
.mk-facts h3 { color: var(--wp--preset--color--white); font-size: 1.3rem; }
.mk-facts ul { list-style: none; padding: 0; margin: 1.2rem 0 0; }
.mk-facts li { padding: .85rem 0; border-top: 1px solid rgba(255, 255, 255, .14); line-height: 1.5; }
.mk-facts li strong { display: block; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: #F1C9B9; font-weight: 700; margin-bottom: .15rem; }
.mk-words { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem !important; }
.mk-words span { background: var(--wp--preset--color--sand); color: var(--wp--preset--color--contrast); border-radius: 999px; padding: .4rem .9rem; font-size: .88rem; font-weight: 600; }

/* ---------- reviews ---------- */
.mk-reviews { background: linear-gradient(180deg, var(--wp--preset--color--sand) 0%, var(--wp--preset--color--base) 100%); }
.mk-quotes { gap: 1.5rem !important; margin-top: 3rem !important; }
.mk-quote { background: var(--wp--preset--color--white); border-radius: 24px; padding: 2rem !important; height: 100%; position: relative; box-shadow: 0 30px 60px -48px rgba(30, 43, 51, .55); }
.mk-quote::before { content: "\201C"; position: absolute; top: .4rem; right: 1.3rem; font-family: var(--wp--preset--font-family--literata); font-size: 5rem; line-height: 1; color: #F4D7CC; }
.mk-quote .mk-qtext { font-family: var(--wp--preset--font-family--literata); font-size: 1.12rem; line-height: 1.55; position: relative; }
.mk-quote .mk-qwho { font-size: .9rem; color: var(--wp--preset--color--slate); margin-bottom: 0; }
.mk-quote .mk-qwho strong { color: var(--wp--preset--color--contrast); }
.wp-block-column:has(> .mk-quote) { display: flex; }
.mk-more { margin-top: 2.5rem !important; }

/* ---------- tips ---------- */
.mk-tips { background: var(--wp--preset--color--white); }
.mk-tip { border: 1.5px solid rgba(30, 43, 51, .08); border-radius: 24px; padding: 2rem !important; height: 100%; transition: border-color .25s ease, transform .25s ease; }
.mk-tip:hover { border-color: var(--wp--preset--color--coral); transform: translateY(-4px); }
.mk-tip .mk-icon { width: 3rem; height: 3rem; border-radius: 14px; display: grid; place-items: center; font-size: 1.4rem; background: var(--wp--preset--color--sand); margin: 0 0 .8rem !important; }
.mk-tip a { font-weight: 700; color: var(--wp--preset--color--coral); text-decoration: none; }
.mk-tip a:hover { text-decoration: underline; }
.wp-block-column:has(> .mk-tip) { display: flex; }

/* ---------- call to action ---------- */
.mk-cta-wrap { background: var(--wp--preset--color--base); padding-top: 0 !important; }
.mk-cta { background: radial-gradient(700px 300px at 90% 0%, rgba(210, 105, 75, .45) 0%, rgba(210, 105, 75, 0) 70%), var(--wp--preset--color--contrast); color: #E6ECEF; border-radius: 36px; padding: clamp(3rem, 7vw, 5.5rem) clamp(1.5rem, 5vw, 4rem) !important; text-align: center; }
.mk-cta h2 { color: var(--wp--preset--color--white); }
.mk-cta .mk-lead { color: #C9D4DA; margin-left: auto; margin-right: auto; }
.mk-cta .is-style-outline .wp-block-button__link { color: var(--wp--preset--color--white); border-color: rgba(255, 255, 255, .35); }

/* ---------- footer ---------- */
.mk-footer { padding: 3rem clamp(1.25rem, 4vw, 2.5rem) 2.5rem !important; font-size: .92rem; color: var(--wp--preset--color--slate); }
.mk-footer a { color: var(--wp--preset--color--slate); text-decoration: none; font-weight: 600; }
.mk-footer a:hover { color: var(--wp--preset--color--coral); }
.mk-footer p { margin: 0; }

/* ---------- fixes v1.0.1 ---------- */
.wp-block-post-content > .mk-section, .mk-section { margin-block: 0 !important; }
.mk-nav .wp-block-button__link { color: var(--wp--preset--color--white) !important; }
.mk-checks { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 860px; text-align: left; }
@media (max-width: 700px) { .mk-checks { grid-template-columns: 1fr; } }
.mk-quote { text-align: left; }
.mk-quote::before { top: .2rem; }

/* ---------- lighter rendering v1.0.3 (fast on remote desktop / software rendering) ---------- */
.mk-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--wp--preset--color--base); }
.mk-float { animation: none; box-shadow: 0 10px 24px -14px rgba(30, 43, 51, .45); }
.mk-hero { background: linear-gradient(135deg, #F4EBE0 0%, var(--wp--preset--color--base) 55%, #E9EFF2 100%); }
.mk-photo img { box-shadow: 0 16px 32px -20px rgba(30, 43, 51, .5); }
.mk-photo-wrap::before { transform: none; }
.mk-card, .mk-card:hover { box-shadow: 0 1px 0 rgba(30, 43, 51, .05), 0 12px 24px -18px rgba(30, 43, 51, .35); }
.mk-card:hover { transform: none; }
.mk-quote { box-shadow: 0 12px 24px -18px rgba(30, 43, 51, .35); }
.mk-pill { box-shadow: 0 1px 0 rgba(30, 43, 51, .06), 0 4px 10px -6px rgba(30, 43, 51, .3); }
.mk-cta { background: linear-gradient(135deg, var(--wp--preset--color--contrast) 60%, #4A3A36 100%); }
.mk-reviews { background: var(--wp--preset--color--sand); }
.mk-tip:hover { transform: none; }
.wp-element-button:hover, .wp-block-button__link:hover { transform: none; box-shadow: none; }