/*
Theme Name: Nordlicht
Theme URI: https://danielfischer.name
Template: twentytwentyfive
Author: Daniel Fischer
Description: Child theme for danielfischer.name – dark "Kaamos" night with aurora accents. Green = private, violet = work.
Version: 0.4.4
Requires at least: 6.5
License: GPL-2.0-or-later
Text Domain: nordlicht
*/

:root {
	--df-night: #0F1C24;
	--df-surface: #172A35;
	--df-line: #24404E;
	--df-snow: #EEF2F0;
	--df-frost: #A8B6BC;
	--df-frost-strong: #C3CED2;
	--df-green: #5AE6A8;   /* private */
	--df-violet: #B28DFF;  /* work */
	--df-blue: #4FB8E8;
	--df-green-night: #0E2A2C;
	--df-violet-night: #221B38;
	--df-grotesk: "Space Grotesk", system-ui, sans-serif;
	--df-wide: 1240px;
}

/* ---------- Header ---------- */
.df-header { padding: 28px 32px 0; }
.df-header__row { max-width: var(--df-wide); margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 24px; }
.df-logo { display: inline-flex; align-items: center; gap: 12px; color: var(--df-snow); text-decoration: none; font-family: var(--df-grotesk); font-weight: 700; font-size: 20px; letter-spacing: 0.02em; }
.df-logo:hover { color: var(--df-snow); }
.df-nav { font-size: 15px; gap: 28px; }
.df-nav a { color: var(--df-snow); text-decoration: none; }
.df-nav a:hover { color: var(--df-green); }
.df-nav .wp-block-navigation-item:last-child a { color: var(--df-frost); }
.df-lang { display: flex; gap: 12px; font-size: 13px; font-weight: 600; letter-spacing: 0.06em; }
.df-lang a { color: var(--df-frost); text-decoration: none; }
.df-lang a[aria-current="true"] { color: var(--df-green); }
.df-lang span { color: #4D6672; }
.df-aurora { max-width: var(--df-wide); margin: 0 auto; height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--df-green) 0%, var(--df-blue) 50%, var(--df-violet) 100%); }

/* ---------- Front page ---------- */
.df-front { padding: 0 32px; }
.df-front__content > * { max-width: var(--df-wide); margin-left: auto !important; margin-right: auto !important; }

.df-kicker { font-family: var(--df-grotesk) !important; font-weight: 500 !important; font-size: 15px !important; letter-spacing: 0.12em !important; text-transform: uppercase; color: var(--df-frost) !important; margin: 96px 0 32px !important; }

.df-front__content > .df-hero {
	position: relative; z-index: 0; max-width: none; display: block; background-color: #0F1C24;
	margin: -112px -32px 0 !important; padding: 200px 32px 150px;
	background:
		linear-gradient(180deg, rgba(15,28,36,.55) 0%, rgba(15,28,36,.15) 28%, rgba(15,28,36,.35) 60%, #0F1C24 95%, #0F1C24 100%),
		linear-gradient(90deg, rgba(15,28,36,.78) 0%, rgba(15,28,36,.35) 55%, rgba(15,28,36,0) 100%),
		url("assets/img/hero-aurora.jpg") center 18% / cover no-repeat;
}
.df-hero__inner { max-width: var(--df-wide); margin: 0 auto !important; }
.df-hero__inner > * { max-width: 620px; }
.df-eyebrow { font-family: var(--df-grotesk); font-size: 15px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--df-green); margin: 0 0 20px; }
.df-hero__title { font-size: clamp(48px, 7vw, 80px) !important; line-height: 1.0 !important; letter-spacing: -0.03em !important; margin: 0 0 24px !important; text-shadow: 0 2px 24px rgba(15,28,36,.6); }
.df-hero__lead { color: var(--df-snow); font-size: 19px; max-width: 520px; margin: 0; text-shadow: 0 1px 12px rgba(15,28,36,.8); }
.df-hero__credit { max-width: var(--df-wide); margin: 56px auto 0 !important; font-size: 12px; color: var(--df-frost); text-align: right; }
.df-header { position: relative; z-index: 1; }

/* Doors: friends (green) / colleagues (violet) */
.df-doors { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; margin-top: 80px !important; }
.df-door { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 36px; border-radius: 16px; }
.df-door > * { margin: 0 !important; }
.df-door--friends { background: var(--df-green-night); }
.df-door--work { background: var(--df-violet-night); }
.df-door__label { font-family: var(--df-grotesk); font-size: 13px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; }
.df-door--friends .df-door__label { color: var(--df-green); }
.df-door--work .df-door__label { color: var(--df-violet); }
.df-door__title { font-size: 30px !important; line-height: 1.2 !important; letter-spacing: -0.01em !important; }
.df-door__title a { color: var(--df-snow); text-decoration: none; }
.df-door__title a::after { content: ""; position: absolute; inset: 0; border-radius: 16px; }
.df-door:hover .df-door__title a { text-decoration: underline; text-underline-offset: 4px; }
.df-door__text { color: var(--df-frost-strong); }

/* Bubbles */
.df-bubbles { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 32px; }
.df-bubble { position: relative; flex: 1 1 160px; display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; }
.df-bubble > * { margin: 0 !important; }
.df-bubble::before { content: ""; width: 120px; height: 120px; border-radius: 50%; box-sizing: border-box; border: 2px solid var(--df-accent); background: var(--df-accent-night); background-image: var(--df-icon); background-repeat: no-repeat; background-position: center; background-size: 44px 44px; }
.df-bubble--private { --df-accent: var(--df-green); --df-accent-night: var(--df-green-night); }
.df-bubble--work { --df-accent: var(--df-violet); --df-accent-night: var(--df-violet-night); }
.df-bubble__title { font-size: 24px !important; }
.df-bubble__title a { color: var(--df-snow); text-decoration: none; }
.df-bubble__title a::after { content: ""; position: absolute; inset: 0; }
.df-bubble:hover .df-bubble__title a { color: var(--df-accent); }
.df-bubble__text { font-size: 15px; color: var(--df-frost); }
.df-bubble--science  { --df-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B28DFF' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M7 3c0 6 10 6 10 12M17 3c0 6-10 6-10 12M7 21c0-2 10-2 10 0'/%3E%3C/svg%3E"); }
.df-bubble--knowhow  { --df-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B28DFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l5 6-5 6M12 18h8'/%3E%3C/svg%3E"); }
.df-bubble--cooking  { --df-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235AE6A8' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M4 11h16a8 8 0 0 1-16 0zM9 3v4M12 2v5M15 3v4'/%3E%3C/svg%3E"); }
.df-bubble--photos   { --df-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235AE6A8' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M3 8h4l2-3h6l2 3h4v11H3z'/%3E%3Ccircle cx='12' cy='13' r='4'/%3E%3C/svg%3E"); }
.df-bubble--life     { --df-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235AE6A8' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7v9h-6v-6H9v6H3z'/%3E%3C/svg%3E"); }

/* Latest posts */
.df-latest .wp-block-post-template { gap: 24px; }
.df-latest .wp-block-post-featured-image { margin: 0 0 12px; }
.df-latest .wp-block-post-featured-image img { border-radius: 4px; height: 200px; object-fit: cover; width: 100%; }
.df-latest__meta { gap: 8px; font-size: 13px; color: var(--df-frost); margin: 0 0 8px; }
.df-latest__meta a { color: var(--df-green); text-decoration: none; }
.df-latest__meta a.df-area--work { color: var(--df-violet); }
.df-latest__meta .df-area a::after { content: " ·"; color: var(--df-frost); }
.df-latest .wp-block-post-title { font-size: 22px; line-height: 1.25; margin: 0; }
.df-latest .wp-block-post-title a { color: var(--df-snow); text-decoration: none; }
.df-latest .wp-block-post-title a:hover { color: var(--df-green); }
.df-more { margin-top: 24px !important; font-weight: 600; }

/* WordPress' block gap must not push siblings in grids/rows down */
.df-doors > *, .df-bubbles > *, .df-latest .wp-block-post-template > * { margin-block-start: 0 !important; }
.df-latest .wp-block-post-template { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important; }

/* Category tiles (recipe overviews, projects) */
.df-cards .wp-block-post-template { gap: 24px; }
.df-cards .wp-block-post-template > * { margin-block-start: 0 !important; }
.df-cards .wp-block-post-featured-image { margin: 0 0 10px; }
.df-cards .wp-block-post-featured-image img { border-radius: 8px; object-fit: cover; }
.df-cards li { background: var(--df-surface); border-radius: 12px; padding: 0 0 16px; overflow: hidden; }
.df-cards li .wp-block-post-featured-image { margin: 0 0 12px; }
.df-cards li .wp-block-post-featured-image img { border-radius: 0; }
.df-cards li .wp-block-post-title { padding: 0 16px; font-size: 19px; line-height: 1.3; }
.df-cards li:not(:has(img))::before { content: ""; display: block; aspect-ratio: 4 / 3; margin: 0 0 12px; background: radial-gradient(120% 90% at 20% 110%, rgba(90,230,168,.35) 0%, rgba(90,230,168,0) 60%), radial-gradient(100% 80% at 90% 0%, rgba(178,141,255,.35) 0%, rgba(178,141,255,0) 60%), var(--df-surface); }
.df-cards .wp-block-post-title a { color: var(--df-snow); text-decoration: none; }
.df-cards .wp-block-post-title a:hover { color: var(--df-green); }

/* WP Recipe Maker cards in the night look (recipes = private = green) */
.wprm-recipe { background: var(--df-surface) !important; color: var(--df-snow) !important; border: 1px solid var(--df-line) !important; border-radius: 16px !important; overflow: hidden; }
.wprm-recipe, .wprm-recipe * { color: var(--df-snow) !important; border-color: var(--df-line) !important; }
.wprm-recipe .wprm-layout-container, .wprm-recipe .wprm-internal-container, .wprm-recipe .wprm-recipe-jump-to-section { background: var(--df-night) !important; }
.wprm-recipe .wprm-recipe-name, .wprm-recipe h2, .wprm-recipe h3, .wprm-recipe .wprm-recipe-header { font-family: var(--df-grotesk) !important; font-weight: 500 !important; }
.wprm-recipe .wprm-recipe-meta-container-pill, .wprm-recipe .wprm-recipe-meta-container-pill * { background: var(--df-green-night) !important; color: var(--df-green) !important; }
.wprm-recipe .wprm-recipe-meta-container-pill { border: 1px solid var(--df-green) !important; }
.wprm-recipe a, .wprm-recipe .wprm-recipe-print, .wprm-recipe .wprm-recipe-print * { color: var(--df-green) !important; }
.wprm-recipe .wprm-recipe-print { background: transparent !important; border: 1px solid var(--df-green) !important; }
.wprm-recipe .wprm-recipe-details-label, .wprm-recipe .wprm-recipe-time-label { color: var(--df-frost) !important; }
.wprm-recipe svg path, .wprm-recipe svg g { stroke: var(--df-green); }
.wprm-recipe .wprm-checkbox-container label::before { border-color: var(--df-green) !important; background: transparent !important; }

/* Publications (work = violet) */
.df-pubs-intro { color: var(--df-frost-strong); font-size: 19px; }
.df-pubs-year { font-size: 15px !important; letter-spacing: 0.12em !important; color: var(--df-violet) !important; margin: 40px 0 12px !important; }
.df-pubs { list-style: none; padding: 0 !important; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.df-pubs > li { margin: 0 !important; padding: 16px 20px; background: var(--df-surface); border-left: 3px solid var(--df-violet); border-radius: 0 10px 10px 0; line-height: 1.55; }
.df-pubs > li strong { color: var(--df-violet); font-weight: 600; }
.df-pubs > li em { color: var(--df-snow); font-style: normal; font-weight: 600; }
.df-pubs a { color: var(--df-violet); word-break: break-all; }
.df-pubs a:hover { color: var(--df-snow); }

/* MyBook timeline (private = green) */
.df-timeline .wp-block-post-template { list-style: none; margin: 32px 0 0; padding: 0 0 0 32px; border-left: 2px solid var(--df-green-night); display: flex; flex-direction: column; gap: 40px; }
.df-timeline .wp-block-post-template > li { position: relative; margin: 0 !important; }
.df-timeline .wp-block-post-template > li::before { content: ""; position: absolute; left: -42px; top: 6px; width: 16px; height: 16px; border-radius: 50%; background: var(--df-green); box-shadow: 0 0 0 4px var(--df-night); }
.df-timeline .wp-block-post-date { font-size: 14px; font-weight: 600; margin: 0 0 4px; }
.df-timeline .wp-block-post-date a { color: var(--df-green); text-decoration: none; }
.df-timeline .wp-block-post-title { font-size: 24px; margin: 0 0 12px; }
.df-timeline .wp-block-post-title a { color: var(--df-snow); text-decoration: none; }
.df-timeline .wp-block-post-title a:hover { color: var(--df-green); }
.df-timeline .wp-block-post-featured-image { margin: 0 0 12px; max-width: 520px; }
.df-timeline .wp-block-post-featured-image img { border-radius: 10px; }
.df-timeline .wp-block-post-excerpt { color: var(--df-frost-strong); margin: 0; }
.df-timeline .wp-block-post-excerpt__more-link { color: var(--df-green); }
.df-timeline .wp-block-query-pagination { margin-top: 40px; }

.df-note { color: var(--df-frost); font-size: 14px; border-top: 1px solid var(--df-line); padding-top: 16px; margin-top: 32px !important; }

/* ---------- Footer ---------- */
.df-footer { padding: 96px 32px 48px; }
.df-footer__row { max-width: var(--df-wide); margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-top: 24px; border-top: 1px solid var(--df-line); font-size: 14px; color: var(--df-frost); }
.df-footer__row p { margin: 0; }

/* ---------- Small screens ---------- */
@media (max-width: 900px) {
	.df-front__content > .df-hero { margin-top: -150px !important; padding: 220px 32px 110px; }
	.df-kicker { margin-top: 64px !important; }
	.df-bubbles { justify-content: center; }
}

/* Bereichsseiten (0.4.1) */
.df-area-intro { font-size: 20px !important; line-height: 1.6; color: var(--df-frost-strong); max-width: 720px; }
.df-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.df-tiles > * { margin: 0 !important; }
.df-tile { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 22px 24px; border-radius: 12px; background: var(--df-accent-night); border: 1px solid transparent; transition: border-color .15s; }
.df-tile > * { margin: 0 !important; }
.df-tile--private { --df-accent: var(--df-green); --df-accent-night: var(--df-green-night); }
.df-tile--work { --df-accent: var(--df-violet); --df-accent-night: var(--df-violet-night); }
.df-tile:hover { border-color: var(--df-accent); }
.df-tile__title { font-size: 20px !important; line-height: 1.3 !important; }
.df-tile__title a { color: var(--df-snow); text-decoration: none; }
.df-tile__title a::after { content: ""; position: absolute; inset: 0; border-radius: 12px; }
.df-tile:hover .df-tile__title a { color: var(--df-accent); }
.df-tile__text { font-size: 15px; color: var(--df-frost-strong); }

/* Fotoalben-Kacheln (0.4.2) */
.df-albums { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; margin-top: 40px !important; }
.df-albums > * { margin: 0 !important; }
.df-album { position: relative; background: var(--df-green-night); border-radius: 12px; overflow: hidden; border: 1px solid transparent; transition: border-color .15s; }
.df-album:hover { border-color: var(--df-green); }
.df-album > * { margin: 0 !important; }
.df-album__img img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.df-album:not(:has(img))::before { content: ""; display: block; aspect-ratio: 4 / 3; background: radial-gradient(120% 90% at 20% 110%, rgba(90,230,168,.35) 0%, rgba(90,230,168,0) 60%), var(--df-green-night); }
.df-album__title { font-size: 18px !important; padding: 12px 16px 14px; }
.df-album__title a { color: var(--df-snow); text-decoration: none; }
.df-album__title a::after { content: ""; position: absolute; inset: 0; }
.df-album:hover .df-album__title a { color: var(--df-green); }

/* Unterseitenliste (ersetzt page-list-Plugin) */
.df-subpages { list-style: none; padding: 0; display: grid; gap: 6px; }
.df-subpages ul { list-style: none; padding-left: 20px; margin-top: 6px; }
.df-subpages a { color: var(--df-snow); text-decoration-color: var(--df-line); text-underline-offset: 4px; }
.df-subpages a:hover { color: var(--df-green); }
.df-feed { margin-top: 32px !important; }
