/*
Theme Name: Alkenbjerggaard
Description: Tema til Alkenbjerggaard, privat pasningsordning i Them. Lyst og legende design med himmel, sol, bakker og polaroid-galleri.
Version: 1.0.1
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: alkenbjerggaard
*/

:root {
	--ab-sky: var(--wp--preset--color--sky);
	--ab-base: var(--wp--preset--color--base);
	--ab-card: var(--wp--preset--color--card);
	--ab-meadow: var(--wp--preset--color--meadow);
	--ab-deep: var(--wp--preset--color--deep);
	--ab-sun: var(--wp--preset--color--sun);
	--ab-berry: var(--wp--preset--color--berry);
	--ab-ink: var(--wp--preset--color--ink);
	--ab-muted: var(--wp--preset--color--muted);
	--ab-line: var(--wp--preset--color--line);
	--ab-display: var(--wp--preset--font-family--fredoka);
	--ab-hand: var(--wp--preset--font-family--caveat);
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
h1, h2, h3 { text-wrap: balance; }
:focus-visible { outline: 3px solid var(--ab-berry); outline-offset: 3px; border-radius: 6px; }
[id] { scroll-margin-top: 16px; }

/* Small coloured label above headings */
.ab-tag { font-family: var(--ab-display); font-weight: 600; font-size: .85rem; letter-spacing: .04em; color: var(--ab-berry); margin-bottom: .2rem !important; }

/* ---------- Header ---------- */
.ab-header { background: var(--ab-sky); position: relative; overflow: hidden; padding-top: 28px; }
.ab-header::before { content: ""; position: absolute; top: -60px; right: -60px; width: 260px; height: 260px; border-radius: 50%; background: var(--ab-sun); opacity: .85; z-index: 0; }
.ab-header > * { position: relative; z-index: 1; }
.ab-bar { gap: 12px; }
.ab-logo { font-family: var(--ab-display); font-weight: 700; font-size: 1.4rem; display: flex; align-items: center; gap: 10px; margin: 0; }
.ab-logo a { color: var(--ab-deep); text-decoration: none; }
.ab-logo::before { content: ""; width: 34px; height: 34px; flex: none; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 34'%3E%3Cpath d='M3 17 17 5l14 12v14H3z' fill='%23d2556b'/%3E%3Crect x='13' y='20' width='8' height='11' fill='%23f6c445'/%3E%3C/svg%3E"); }
.ab-nav { font-family: var(--ab-display); font-weight: 600; font-size: .95rem; gap: 2px; }
.ab-nav .wp-block-navigation-item__content { color: var(--ab-deep); text-decoration: none; padding: 8px 13px; border-radius: 999px; white-space: nowrap; }
.ab-nav .wp-block-navigation-item__content:hover { background: rgba(255,255,255,.75); }
.ab-nav .wp-block-navigation__responsive-container-open { color: var(--ab-deep); }
.ab-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--ab-sky); color: var(--ab-deep); }
.ab-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1.3rem; }
.ab-call .wp-block-button__link { white-space: nowrap; }

/* ---------- Hero ---------- */
.ab-hero { background: var(--ab-sky); position: relative; padding-top: 32px; padding-bottom: 140px; }
.ab-hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 120px; pointer-events: none;
	background: no-repeat bottom / 100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 70 C240 10 480 40 720 60 S1200 20 1440 50 V120 H0Z' fill='%235f9e45' fill-opacity='.35'/%3E%3Cpath d='M0 90 C300 40 560 110 860 80 S1260 50 1440 85 V120 H0Z' fill='%23fbfdf8'/%3E%3C/svg%3E"); }
.ab-hero-cols { gap: 40px; }
.ab-hero-title { font-size: var(--wp--preset--font-size--huge); letter-spacing: -.01em; }
.ab-hero-title mark, mark.ab-green { background: none; color: var(--ab-meadow); }
.ab-lead { font-size: 1.18rem; color: var(--ab-muted); max-width: 38ch; }
.ab-badge { display: inline-flex; align-items: center; gap: 8px; background: var(--ab-card); border-radius: 999px; padding: 8px 18px 8px 8px; font-family: var(--ab-display); font-weight: 600; font-size: .95rem; color: var(--ab-deep); margin-top: 1.4rem !important; }
.ab-badge strong { background: var(--ab-sun); color: var(--ab-ink); border-radius: 999px; padding: 4px 12px; font-weight: 600; }

/* Blob-shaped images (block style "Blob") */
.wp-block-image.is-style-blob img { aspect-ratio: 1; width: 100%; object-fit: cover; border-radius: 46% 54% 42% 58% / 52% 44% 56% 48%; border: 6px solid var(--ab-card); }
.wp-block-image.is-style-blob { margin: 0; }

/* ---------- Sections ---------- */
.ab-section { padding-top: 72px; padding-bottom: 72px; }
.ab-letter { padding-top: 32px; padding-bottom: 24px; }
.ab-paper { max-width: 760px !important; margin-left: auto !important; margin-right: auto !important; background: var(--ab-card); border: 2px solid var(--ab-line); border-radius: 28px; padding: clamp(26px, 5vw, 48px); position: relative; }
.ab-paper::before { content: ""; position: absolute; top: -14px; left: 50%; width: 110px; height: 28px; transform: translateX(-50%) rotate(-2deg); background: var(--ab-sun); opacity: .75; border-radius: 4px; }
.ab-paper p { font-size: 1.1rem; }
.ab-paper .ab-sig, .ab-sig { font-family: var(--ab-hand); font-weight: 600; font-size: 2.1rem; line-height: 1.1; color: var(--ab-berry); margin-top: 1.6rem !important; }

/* Cards (values, price) */
.ab-card { background: var(--ab-card); border: 2px solid var(--ab-line); border-radius: 24px; padding: 26px; }
.ab-card > * { margin-top: 0; margin-bottom: 0; }
.ab-card > * + * { margin-top: 10px; }
.ab-values-section { padding-top: 40px; }
.ab-values { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; margin-top: 28px !important; }
.ab-values > .ab-value { grid-column: span 2; margin: 0 !important; }
.ab-values > .ab-value:nth-child(n+4) { grid-column: span 3; }
.ab-value p { color: var(--ab-muted); }
.ab-icon svg { width: 48px; height: 48px; display: block; }

/* Polaroid gallery (block style "Polaroid") */
.wp-block-gallery.is-style-polaroid { --wp--style--unstable-gallery-gap: 26px; gap: 26px; margin-top: 30px; }
.wp-block-gallery.is-style-polaroid.has-nested-images figure.wp-block-image { background: var(--ab-card); padding: 10px 10px 0; border-radius: 6px; box-shadow: 0 6px 18px rgba(36,75,42,.14); flex-direction: column; flex-grow: 0; transition: transform .2s; }
.wp-block-gallery.is-style-polaroid.has-nested-images figure.wp-block-image:nth-child(odd) { transform: rotate(-2deg); }
.wp-block-gallery.is-style-polaroid.has-nested-images figure.wp-block-image:nth-child(even) { transform: rotate(1.6deg); }
.wp-block-gallery.is-style-polaroid.has-nested-images figure.wp-block-image:hover { transform: rotate(0) scale(1.02); }
.wp-block-gallery.is-style-polaroid.has-nested-images figure.wp-block-image:not(#individual-image) img { aspect-ratio: 1; object-fit: cover; width: 100%; height: auto; flex: none; }
.wp-block-gallery.is-style-polaroid.has-nested-images figure.wp-block-image figcaption { position: static; background: none; color: var(--ab-deep); font-family: var(--ab-display); font-weight: 600; font-size: .95rem; text-align: center; padding: 10px 4px 12px; margin: 0; max-height: none; overflow: visible; text-shadow: none; }
.wp-block-gallery.is-style-polaroid.has-nested-images figure.wp-block-image:has(figcaption)::before { display: none; }

/* About */
.ab-about { background: var(--ab-meadow); color: var(--ab-base); }
.ab-about h2, .ab-about p { color: var(--ab-base); }
.ab-about .ab-tag { color: #ffe28a; }
.ab-duo { gap: 22px !important; justify-content: center; }
.ab-duo .ab-person { width: 190px; flex: none; text-align: center; }
.ab-duo .ab-person + .ab-person { margin-top: 70px !important; }
.ab-duo .ab-person img { border-color: var(--ab-base); }
.ab-duo .ab-person figcaption { font-family: var(--ab-display); font-weight: 700; font-size: 1.3rem; color: var(--ab-base); margin-top: 10px; text-align: center; }

/* Quotes */
.ab-quotes-section { background: var(--ab-sky); }
.ab-quotes { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; margin-top: 30px !important; }
.ab-quotes > .ab-q { grid-column: span 2; }
.ab-quotes > .ab-q:nth-child(n+4) { grid-column: span 3; }
.wp-block-quote.ab-q { margin: 0 !important; background: var(--ab-card); border: 0; border-radius: 24px; padding: 30px 26px 24px; display: flex; flex-direction: column; gap: 14px; }
.wp-block-quote.ab-q::before { content: "\201C"; font-family: var(--ab-display); font-weight: 700; font-size: 4.2rem; line-height: 1; color: var(--ab-sun); height: 30px; margin-top: -6px; }
.wp-block-quote.ab-q p { font-size: 1.12rem; line-height: 1.6; color: var(--ab-ink); margin: 0; flex: 1; font-style: normal; }
.wp-block-quote.ab-q cite { font-family: var(--ab-hand); font-weight: 600; font-size: 1.7rem; line-height: 1.1; color: var(--ab-berry); font-style: normal; }

/* Places & contact */
.ab-places .wp-block-columns { gap: 24px; }
.ab-places .ab-card { border-radius: 28px; padding: 30px; height: 100%; }
.ab-price { font-family: var(--ab-display); font-weight: 700; font-size: clamp(2.8rem, 7vw, 4rem); line-height: 1; color: var(--ab-deep); font-variant-numeric: tabular-nums; }
.ab-price-unit { color: var(--ab-muted); font-family: var(--ab-display); margin-top: 2px !important; }
.ab-muted { color: var(--ab-muted); }
.ab-years { gap: 10px; }
.ab-year { font-family: var(--ab-display); font-weight: 700; font-size: 1.2rem; background: var(--ab-sun); color: var(--ab-ink); border-radius: 16px; padding: 10px 20px; margin: 0 !important; }
.ab-contact { background: var(--ab-deep) !important; border-color: var(--ab-deep) !important; color: var(--ab-base); }
.ab-contact h2, .ab-contact .ab-tag { color: var(--ab-sun); }
.ab-row > * { margin: 0; }
.ab-label { font-family: var(--ab-display); font-weight: 600; font-size: .8rem; opacity: .75; text-transform: uppercase; letter-spacing: .08em; }
.ab-row .ab-value { font-family: var(--ab-display); font-weight: 600; font-size: 1.4rem; overflow-wrap: anywhere; line-height: 1.35; }
.ab-maplink a { font-family: var(--ab-display); font-weight: 600; color: var(--ab-sun); }

/* Footer */
.ab-footer { padding-top: 28px; padding-bottom: 28px; color: var(--ab-muted); font-family: var(--ab-display); font-size: .9rem; }

/* Other pages */
.ab-page { padding-top: 48px; padding-bottom: 72px; }

@media (max-width: 781px) {
	.ab-hero { padding-bottom: 110px; }
	.ab-hero .is-style-blob { max-width: 320px; margin: 0 auto; }
	.ab-values, .ab-quotes { grid-template-columns: 1fr; }
	.ab-values > .ab-value, .ab-values > .ab-value:nth-child(n+4),
	.ab-quotes > .ab-q, .ab-quotes > .ab-q:nth-child(n+4) { grid-column: auto; }
	.wp-block-gallery.is-style-polaroid { --wp--style--unstable-gallery-gap: 16px; gap: 16px; }
	.ab-duo .ab-person { width: 150px; }
}

/* Sections sit edge to edge without gaps between them */
.wp-block-post-content > .ab-section, .wp-block-post-content > .ab-hero { margin-block-start: 0 !important; margin-block-end: 0 !important; }