/*
 * Eridrekaj theme styles. Hand-edit this file directly; no build step.
 *
 * Colours: every themed colour is ONE line, light-dark(light value, dark value).
 * The device setting picks the mode; the bulb button forces it via html[data-theme].
 */
:root {
	/* Brand (same in both modes) */
	--night: #172a25;        /* sidebar background */
	--night-soft: #243b34;
	--lime: #d2ed62;         /* primary accent */
	--lime-hover: #e0f585;
	--coral: #ee755b;        /* secondary accent */
	--white: #fff;
	--grid-line: #2f6f6b1f;

	/* Sidebar (always dark) */
	--sidebar-text: #e8eee6;
	--sidebar-text-strong: #edf3e9;
	--sidebar-text-soft: #bdc9bf;
	--sidebar-text-faint: #a6b4a9;
	--sidebar-icon: #d4ddd4;
	--sidebar-line: #42564b;
	--sidebar-line-soft: #394c42;
	--sidebar-line-active: #53664c;
	--overlay-sidebar: #0a141099;

	/* Themed: light-dark(LIGHT, DARK) */
	--paper: light-dark(#f4f3ec, #0f1714);
	--paper-bright: light-dark(#fffef9, #17221e);
	--surface-muted: light-dark(#e6e9df, #1f2d28);
	--line: light-dark(#dedfd4, #2a3a34);
	--text: light-dark(#1c2924, #e8eee6);
	--text-article: light-dark(#46564b, #c9d4cc);
	--text-body: light-dark(#59645d, #aebbb2);
	--text-soft: light-dark(#667269, #9aa99f);
	--text-faint: light-dark(#737d74, #7f8e85);
	--muted: light-dark(#78817a, #8a978f);
	--muted-cool: light-dark(#849388, #6f7e75);
	--eyebrow: light-dark(#758178, #8fa097);
	--text-year: light-dark(#777f76, #8a978f);
	--text-taxonomy: light-dark(#64746a, #8fa097);
	--link: light-dark(#337568, #6fd0b8);
	--link-contact: light-dark(#4a6659, #9fc4b4);
	--link-contact-hover: light-dark(#bd563f, #ff9a82);
	--accent-gold: light-dark(#8d6e38, #d9b36a);
	--accent-clay: light-dark(#9a5f4e, #e39a86);
	--input-border: light-dark(#d4d9cf, #34463f);
	--focus: light-dark(#4e8474, #6fd0b8);
	--focus-ring: light-dark(#4e847421, #6fd0b833);
	--notice-text: light-dark(#285f4f, #bfe8d6);
	--notice-bg: light-dark(#e2eee3, #1d3a2f);
	--error-text: light-dark(#c0392b, #ffb4a6);
	--error-bg: light-dark(#fdecea, #3a1f1b);
	--overlay-modal: light-dark(#0e1915b3, #000000cc);

	/* Layout */
	--content-width: 980px;   /* width of .page-section */
	--modal-width: 760px;     /* Locate, Meet and Contact popups */
	--sidebar-width: 292px;
	--project-thumb: 104px;   /* project square size on the Projects page */
	--project-icon: 75%;      /* icon size inside that square */
	--project-icon-hover: 90%; /* icon size on hover */

	/* Fonts */
	--serif: "Space Grotesk", sans-serif;
	--sans: "DM Sans", sans-serif;

	color-scheme: light dark;
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }

/* ---- Reset ---- */
*, ::before, ::after { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; }
html { scroll-behavior: smooth; line-height: 1.5; -webkit-text-size-adjust: 100%; }
body { background: var(--paper); color: var(--text); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
ol, ul { list-style: none; }
a { color: inherit; text-decoration: none; }
img, svg, iframe { display: block; max-width: 100%; }
img { height: auto; }
button, input, textarea { font: inherit; color: inherit; background: none; border-radius: 0; }
button, a { -webkit-tap-highlight-color: transparent; }
button { appearance: button; }
textarea { resize: vertical; }
[hidden] { display: none !important; }

body { animation: fade-in .2s ease-out both; }
.main-content img, .avatar, .mobile-brand img { animation: fade-in .3s ease-out .15s both; }

body::before { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .12; background-image: repeating-linear-gradient(0deg, var(--grid-line) 0 1px, #0000 1px 56px), repeating-linear-gradient(90deg, var(--grid-line) 0 1px, #0000 1px 56px); animation: ambient-motion 48s linear infinite; }
@keyframes ambient-motion { to { background-position: 0 56px, 56px 0; } }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes page-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }

/* ---- Shared: lime buttons, inputs, chips ---- */
.sidebar-actions button, .book-download, .contact-form button, .comment-form .comment-submit, .article-search button { color: var(--night); background: var(--lime); border-radius: 8px; font-weight: 700; cursor: pointer; }
.book-download:hover, .contact-form button:hover, .comment-form .comment-submit:hover, .article-search button:hover { background: var(--lime-hover); }

.contact-form input, .contact-form textarea, .comment-form input[type=text], .comment-form input[type=email], .comment-form textarea, .article-search input[type=search] { width: 100%; color: var(--text); background: var(--paper-bright); border: 1px solid var(--input-border); border-radius: 8px; outline: 0; transition: border .15s, box-shadow .15s; }
.contact-form input:focus, .contact-form textarea:focus, .comment-form input[type=text]:focus, .comment-form input[type=email]:focus, .comment-form textarea:focus, .article-search input:focus { border-color: var(--focus); box-shadow: 0 0 0 3px var(--focus-ring); }

.filter-list a, .pagination a, .pagination span { color: var(--text-soft); border: 1px solid var(--line); border-radius: 7px; }
.filter-list a:hover, .filter-list a.is-current, .pagination a:hover, .pagination .is-current { color: var(--night); background: var(--lime); border-color: var(--lime); }

.book-cover, .book-detail-cover, .project-image, .article-image, .experience-image { overflow: hidden; background: var(--surface-muted); }
.book-cover img, .book-detail-cover img, .project-image img, .article-image img, .experience-image img { width: 100%; height: 100%; object-fit: cover; }

/* ---- Layout shell ---- */
.site-shell { position: relative; z-index: 1; min-height: 100vh; }
.main-content { flex: auto; width: 100%; min-width: 0; animation: page-enter .24s both; transition: opacity .16s, transform .16s; }
.page-leaving .main-content { opacity: 0; transform: translateY(5px); }
.page-section { width: min(100%, var(--content-width)); min-height: 100vh; margin: 0 auto; padding: clamp(46px, 8vw, 100px) clamp(22px, 6vw, 76px); }
.mobile-bar, .sidebar-backdrop { display: none; }

/* ---- Sidebar ---- */
.site-sidebar { position: sticky; top: 0; z-index: 30; flex: 0 0 var(--sidebar-width); width: var(--sidebar-width); height: 100dvh; overflow-y: auto; color: var(--sidebar-text); background: var(--night); text-align: right; }
.sidebar-inner { display: flex; flex-direction: column; align-items: flex-end; height: 100%; padding: 42px 32px 26px; }
.identity { display: flex; flex-direction: column; align-items: flex-end; gap: 17px; width: 100%; }
.avatar { width: 112px; height: 112px; object-fit: cover; background: var(--night-soft); border-radius: 30px 30px 30px 8px; }
.avatar-site-logo { object-fit: contain; background: var(--white); border-radius: 18px; padding: 9px; }
.avatar-placeholder { display: grid; place-items: center; color: var(--lime); font: 600 2.6rem var(--serif); }
.identity-name { font: 600 1.8rem/1.1 var(--serif); }
.identity-life { display: block; margin-top: 6px; color: var(--lime); font-size: .84rem; font-weight: 600; }
.identity-life:hover, .identity-life.is-current { text-decoration: underline; }
.identity-slogan { max-width: 220px; margin: 17px 0 0; padding-right: 12px; border-right: 2px solid var(--coral); color: var(--sidebar-text-soft); font-size: .92rem; line-height: 1.55; }

.social-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0;     justify-content: space-between; width: 100%; margin-top: 20px; }
.social-links a { display: grid; place-items: center; width: 36px; height: 36px; color: var(--sidebar-icon); border: 1px solid var(--sidebar-line); border-radius: 10px; transition: color .18s, background .18s, border .18s; }
.social-links a:hover, .sidebar-actions .secondary-action:hover, .theme-toggle:hover { color: var(--night); background: var(--lime); border-color: var(--lime); }
.social-links svg { width: 17px; height: 17px; fill: currentColor; stroke: currentColor; stroke-width: 1.5px; }
.social-links svg rect, .social-links svg circle { fill: none; stroke-width: 2px; }

.sidebar-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; width: 100%; margin-top: 24px; }
.sidebar-actions button { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; min-width: 0; min-height: 64px; padding: 7px 4px; border-radius: 9px; font-size: .64rem; line-height: 1.2; text-align: center; transition: transform .18s, background .18s; }
.sidebar-actions button:hover { background: var(--lime-hover); transform: translateY(-2px); }
.sidebar-actions .secondary-action { color: var(--sidebar-text-strong); background: none; border: 1px solid var(--sidebar-line); }
.sidebar-actions svg { flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7px; stroke-linecap: round; stroke-linejoin: round; }
.sidebar-actions button span { width: 19px; font-size: 1rem; text-align: center; }

.primary-nav { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 5px; width: 100%; margin-top: 26px; }
.primary-nav a { display: flex; justify-content: center; align-items: center; min-width: 0; min-height: 36px; padding: 0 2px; overflow: hidden; color: var(--sidebar-text-soft); border: 1px solid var(--sidebar-line); border-radius: 8px; font-size: .68rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; transition: color .16s, background .16s; }
.primary-nav a span { display: none; }
.primary-nav a:hover, .primary-nav a.is-current { color: var(--lime); background: var(--night-soft); }

.sidebar-bottom { width: 100%; margin-top: auto; }
.language-nav { display: flex; justify-content: flex-end; align-items: center; gap: 7px; padding-top: 17px; border-top: 1px solid var(--sidebar-line-soft); }
.language-nav a { display: grid; place-items: center; min-width: 38px; height: 31px; color: var(--sidebar-text-faint); text-transform: uppercase; border: 1px solid #0000; border-radius: 7px; font-size: .75rem; }
.language-nav a:hover, .language-nav a.is-current { color: var(--lime); border-color: var(--sidebar-line-active); }
.language-nav .theme-toggle { margin-right: auto; }
.copyright { margin: 14px 0 0; color: var(--muted-cool); font-size: .68rem; line-height: 1.7; }

.theme-toggle { display: grid; place-items: center; width: 33px; height: 33px; padding: 0; color: var(--sidebar-icon); border: 1px solid var(--sidebar-line); border-radius: 10px; cursor: pointer; transition: color .18s, background .18s, border .18s; }
.theme-toggle svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8px; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle[aria-pressed="false"] .bulb-glass { fill: var(--lime); stroke: var(--lime); }
.theme-toggle[aria-pressed="false"]:hover .bulb-glass { fill: var(--night); stroke: var(--night); }

/* ---- Page headings ---- */
.eyebrow { color: var(--eyebrow); font: 600 .68rem/1.4 var(--sans); letter-spacing: .13em; text-transform: uppercase; }
.eyebrow span { color: var(--coral); }
.page-section h1 { margin: 19px 0 32px; color: var(--text); font: 600 clamp(2.5rem, 6vw, 5rem)/1.03 var(--serif); }
.project-copy h2, .article-card h2, .experience-detail h2 { margin: 9px 0; color: var(--text); font: 600 1.36rem/1.2 var(--serif); }
.text-link { display: inline-block; margin-top: 16px; color: var(--link); font-size: .8rem; font-weight: 700; }
.text-link:hover { color: var(--coral); }
.empty-state { color: var(--text-faint); }

/* ---- Home ---- */
.home-page { padding-top: clamp(72px, 11vh, 128px); }
.home-page h1 { margin-top: 27px; font-size: clamp(3.2rem, 8vw, 6.8rem); }
.home-quote { max-width: 590px; margin: 44px 0 22px; padding: 2px 0 2px 20px; color: var(--text-article); border-left: 3px solid var(--coral); font: 500 1.24rem/1.6 var(--serif); }
.profile-bio { max-width: 660px; color: var(--text-body); line-height: 1.8; }
.profile-bio p, .book-profile p { margin: 0 0 1em; }
.home-latest { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 40px; align-items: start; width: 100%; margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--line); }
.home-heading { margin: 0 0 14px; color: var(--muted); font: 600 .74rem var(--sans); letter-spacing: .08em; text-transform: uppercase; }
.home-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.home-tile { position: relative; display: flex; align-items: flex-end; aspect-ratio: 1; overflow: hidden; background: var(--night-soft, #25382f); border-radius: 12px; color: #fff; }
.home-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.home-tile:hover img { transform: scale(1.04); }
.home-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(10, 18, 14, .86) 0%, rgba(10, 18, 14, .45) 42%, rgba(10, 18, 14, 0) 72%); }
.home-tile.is-plain::after { display: none; }
.home-tile-title { position: relative; z-index: 1; padding: 14px 15px; font: 600 1.05rem/1.25 var(--serif); text-shadow: 0 1px 8px rgba(0, 0, 0, .35); }
.home-more { display: inline-block; margin-top: 16px; color: var(--link); font-size: .84rem; font-weight: 600; }
.home-latest-book .book-card { display: block; }
.home-latest-book .book-cover { max-width: 250px; transition: transform .2s; }
.home-latest-book .book-card:hover .book-cover { transform: translateY(-3px); }
.counter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 32px; }
.counter-item { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; min-height: 98px; padding: 11px; background: var(--paper-bright); border: 1px solid var(--line); border-radius: 11px; }
.counter-icon { color: var(--coral); }
.counter-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7px; stroke-linecap: round; stroke-linejoin: round; }
.counter-item strong { color: var(--text); font: 600 1.35rem/1 var(--serif); }
.counter-item > span:last-child { color: var(--muted); font-size: .68rem; line-height: 1.25; }
.home-subscribe { width: 100%; margin-top: 44px; padding-top: 28px; border-top: 1px solid var(--line); text-align: left; }
.home-subscribe h2 { margin: 0 0 8px; font-size: 1.15rem; }
.home-subscribe p { max-width: 560px; margin: 0 0 16px; color: var(--text-soft); line-height: 1.6; }
.home-subscribe .ed-subscribe-email { color: var(--text); background: var(--paper-bright); border-color: var(--input-border); }
.home-subscribe .ed-subscribe-submit { color: var(--night); background: var(--lime); font-weight: 700; }
.home-subscribe .ed-subscribe-submit:hover { background: var(--lime-hover); opacity: 1; }
.home-subscribe .ed-subscribe-success { color: var(--notice-text); background: var(--notice-bg); }
.home-subscribe .ed-subscribe-error { color: var(--error-text); background: var(--error-bg); }

/* ---- Filters, search, pagination ---- */
.filter-list { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; margin: -12px 0 30px; }
.filter-list a { padding: 8px 12px; font-size: .78rem; }
.article-subfilter-list { margin-top: -18px; }
.article-subfilter-list a { padding: 6px 10px; font-size: .72rem; }
.article-search { display: flex; align-items: center; gap: 8px; width: 100%; margin: 0 0 18px; }
.article-search input[type=search] { flex: 1; min-width: 0; height: 42px; padding: 0 14px; }
.article-search button { height: 42px; padding: 0 18px; transition: background .16s; }
.article-search-clear { color: var(--link); font-size: .84rem; font-weight: 600; white-space: nowrap; }
.search-summary { margin: 0 0 14px; color: var(--text-soft); font-size: .9rem; }
.pagination { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; width: 100%; margin-top: 34px; }
.pagination a, .pagination span { display: inline-flex; justify-content: center; align-items: center; min-width: 38px; height: 38px; padding: 0 12px; font-size: .82rem; }
.pagination .page-gap { border-color: transparent; }
.pagination .is-disabled { opacity: .4; }
.pagination .page-next { margin-left: auto; }

/* ---- Projects: image left, category + title right, description + link below ---- */
.project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.project-card { display: grid; grid-template-columns: var(--project-thumb) minmax(0, 1fr); gap: 16px; align-content: start; align-items: center; padding: 18px; background: var(--paper-bright); border: 1px solid var(--line); border-radius: 14px; }
.project-card--no-image { grid-template-columns: minmax(0, 1fr); }
.project-image { display: grid; place-items: center; width: var(--project-thumb); aspect-ratio: 1; border-radius: 12px; }
.project-image img { width: var(--project-icon); height: var(--project-icon); object-fit: contain; transition: width .35s, height .35s; }
.project-card:hover .project-image img { width: var(--project-icon-hover); height: var(--project-icon-hover); }
.project-category { color: var(--accent-gold); font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.project-head h2 { margin: 6px 0 0; }
.project-body { grid-column: 1 / -1; }
.project-body p { color: var(--text-soft); font-size: .87rem; line-height: 1.7; }
.project-body p + p { margin-top: .6em; }

/* ---- Books ---- */
.books-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.book-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; color: var(--text); }
.book-card:hover h2 { color: var(--link); }
.book-cover, .book-detail-cover { aspect-ratio: .7; border: 1px solid var(--line); border-radius: 8px; }
.book-cover { display: grid; place-items: center; width: 100%; max-width: 250px; color: var(--muted-cool); }
.book-cover span { font: 600 .75rem var(--sans); letter-spacing: .08em; }
.book-card h2 { max-width: 250px; margin: 0; color: var(--text); font: 600 1.1rem/1.25 var(--serif); transition: color .16s; }
.book-detail { display: grid; grid-template-columns: minmax(200px, 280px) minmax(0, 1fr); align-items: start; gap: clamp(24px, 5vw, 52px); }
.book-detail--nocover { grid-template-columns: minmax(0, 1fr); }
.book-detail-cover { width: 100%; }
.book-detail-copy h1 { margin-top: 14px; }
.book-detail-copy h2 { margin: 22px 0 8px; color: var(--text); font: 600 1.2rem/1.25 var(--serif); }
.book-profile { color: var(--text-body); font-size: .96rem; line-height: 1.75; }
.book-downloads { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 22px; }
.book-download { display: inline-flex; align-items: center; gap: 18px; min-height: 44px; margin-top: 22px; padding: 0 15px; font-size: .84rem; }
.book-downloads .book-download { margin-top: 0; }
.chapter-list { margin: 8px 0 0; border-top: 1px solid var(--line); }
.chapter-list li { border-bottom: 1px solid var(--line); }
.chapter-list a { display: flex; align-items: baseline; gap: 16px; padding: 13px 2px; color: var(--text); }
.chapter-list a:hover, .chapter-nav a { color: var(--link); }
.chapter-number { flex: 0 0 28px; color: var(--muted); font-size: .72rem; font-variant-numeric: tabular-nums; }
.chapter-thumb { flex: 0 0 84px; width: 84px; aspect-ratio: 1.4; align-self: center; overflow: hidden; background: var(--surface-muted); border-radius: 10px; }
.chapter-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.chapter-copy { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.chapter-date, .book-date { color: var(--muted); font-size: .78rem; font-weight: 400; font-variant-numeric: tabular-nums; }
.book-date { margin-top: -6px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.chapter-note, .chapter-lead { margin-top: 18px; color: var(--text-article); font-size: 1.02rem; line-height: 1.7; }
.chapter-lead { margin-top: 14px; font-size: 1.1rem; }
.chapter-nav { display: flex; justify-content: space-between; gap: 18px; width: 100%; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--line); font-size: .86rem; font-weight: 600; }

/* ---- Life / experience ---- */
.experience-list { width: 100%; border-top: 1px solid var(--line); }
.experience-item { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 22px; padding: 27px 0; border-bottom: 1px solid var(--line); }
.experience-year { padding-top: 5px; color: var(--text-year); font-size: .8rem; font-weight: 600; }
.experience-detail { position: relative; }
.experience-detail h2 { margin-top: 0; }
.experience-image { float: right; width: 48px; height: 48px; margin-left: 14px; border-radius: 12px; }
.experience-image img { object-fit: contain; }
.experience-description { color: var(--text-soft); font-size: .9rem; line-height: 1.7; }
.experience-description p { margin: 0 0 .8em; }

/* ---- Articles ---- */
.article-list { width: 100%; border-top: 1px solid var(--line); }
.article-card { display: flex; align-items: flex-start; gap: 22px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.article-image { display: block; flex: 0 0 220px; width: 220px; aspect-ratio: 1.5; border-radius: 12px; }
.article-card-copy { width: 100%; min-width: 0; }
.article-card-copy h2 { margin-top: 7px; }
.article-card-copy h2 a:hover { color: var(--link); }
.article-card-copy p { margin: 7px 0; color: var(--text-soft); font-size: .88rem; line-height: 1.65; }
.article-taxonomies { display: flex; flex-wrap: wrap; gap: 5px 13px; margin-top: 13px; color: var(--text-taxonomy); font-size: .72rem; }
.article-taxonomies > div > span { color: var(--accent-clay); font-weight: 700; }
.article-single { width: 100%; }
.article-single h1 { margin-bottom: 22px; }
.article-cover { max-height: 410px; margin-bottom: 30px; overflow: hidden; border-radius: 16px; }
.article-cover img { width: 100%; max-height: 410px; object-fit: cover; }
.back-link { display: inline-block; margin-bottom: 26px; color: var(--link); font-size: .84rem; font-weight: 600; }
.article-content { color: var(--text-article); line-height: 1.8; }
.article-content p { margin: 0 0 1.2em; }

/* ---- Comments ---- */
.article-comments { width: 100%; margin-top: 54px; padding-top: 30px; border-top: 1px solid var(--line); }
.article-comments h2 { margin: 0 0 18px; font-size: 1.25rem; }
.article-comments h2 span { color: var(--muted); font-weight: 400; }
.comment-list { margin: 0 0 34px; }
.comment-item { padding: 16px 0; border-bottom: 1px solid var(--line); }
.comment-meta { margin-bottom: 6px; color: var(--eyebrow); font-size: .76rem; }
.comment-meta strong { color: var(--text); font-size: .92rem; }
.comment-text p { margin: 0 0 .6em; color: var(--text-article); line-height: 1.7; }
.comment-notice, .form-notice { padding: 12px 14px; color: var(--notice-text); background: var(--notice-bg); border-radius: 8px; }
.comment-notice { margin: 0 0 18px; font-size: .86rem; }
.comment-reply-title { margin: 0 0 16px; font-size: 1.05rem; }
.comment-form p { margin: 0 0 14px; }
.comment-form label { display: block; margin-bottom: 6px; color: var(--text-soft); font-size: .78rem; font-weight: 600; }
.comment-form input[type=text], .comment-form input[type=email], .comment-form textarea { padding: 11px 13px; }
.comment-form .comment-form-cookies-consent { display: flex; align-items: center; gap: 8px; }
.comment-form .comment-form-cookies-consent label { margin: 0; font-weight: 400; }
.comment-form .comment-submit { padding: 12px 22px; transition: background .16s; }

/* ---- Contact form + modals ---- */
.contact-page h1 { margin-bottom: 38px; }
.contact-form { display: grid; gap: 19px; max-width: 590px; }
.contact-form label:not(.trap-field) { display: grid; gap: 8px; }
.contact-form label span { color: var(--text-soft); font-size: .77rem; font-weight: 600; }
.contact-form input, .contact-form textarea { padding: 12px 14px; }
.contact-form button { display: flex; align-items: center; gap: 26px; width: fit-content; min-height: 46px; padding: 0 16px; border: 0; font-size: .85rem; }
.trap-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-notice { max-width: 590px; }
.contact-socials { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; max-width: 590px; margin-top: 56px; padding-top: 20px; border-top: 1px solid var(--line); }
.contact-socials > span { width: 100%; color: var(--muted); font-size: .66rem; font-weight: 700; letter-spacing: .12em; }
.contact-socials a { color: var(--link-contact); font-size: .82rem; }
.contact-socials a:hover { color: var(--link-contact-hover); }

.site-modal { position: fixed; inset: 0; z-index: 80; display: none; place-items: center; padding: 20px; background: var(--overlay-modal); }
.site-modal.is-open { display: grid; }
.modal-panel { position: relative; width: min(100%, var(--modal-width)); height: min(82vh, 760px); overflow: hidden; background: var(--paper-bright); border-radius: 14px; }
.modal-panel iframe { width: 100%; height: 100%; border: 0; }
.modal-empty { display: grid; place-items: center; min-height: 100%; padding: 36px; color: var(--text-soft); font-size: .95rem; line-height: 1.6; text-align: center; }
.contact-modal-panel { height: auto; max-height: 90vh; padding: 28px; overflow-y: auto; }
.contact-modal-panel h2 { margin: 0 44px 18px 0; color: var(--text); font: 600 1.7rem/1.15 var(--serif); }
.contact-modal-panel .contact-form { max-width: none; }
.modal-close { position: absolute; top: 10px; right: 10px; z-index: 1; display: grid; place-items: center; width: 38px; height: 38px; color: var(--text); background: var(--paper); border-radius: 50%; font-size: 1.6rem; cursor: pointer; }

/* ---- Desktop ---- */
/* Meet popup (CalDAV booking) */
.booking-panel { max-width: 640px; }
.booking-info { margin: 0 0 6px; color: var(--text-soft); font-size: .92rem; line-height: 1.6; }
.booking-status { min-height: 1.4em; margin: 0 0 14px; color: var(--muted); font-size: .8rem; line-height: 1.5; }
.booking-status.is-error { color: var(--error-text, #b42318); }
.booking-days, .booking-times { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.booking-times { padding-top: 4px; }
.booking-days button, .booking-times button { min-height: 40px; padding: 0 14px; color: var(--text); background: var(--paper); border: 1px solid var(--line); border-radius: 9px; font-size: .86rem; font-weight: 600; cursor: pointer; transition: background .15s, border-color .15s; }
.booking-days button:hover, .booking-times button:hover { border-color: var(--focus); }
.booking-days button.is-selected { color: var(--night); background: var(--lime); border-color: var(--lime); }
.booking-times button { min-width: 74px; font-variant-numeric: tabular-nums; }
.booking-chosen { margin: 0; color: var(--text-soft); font-size: .88rem; line-height: 1.6; }
.booking-chosen strong { color: var(--text); }
.booking-form .booking-change { display: inline; width: auto; min-height: 0; margin-left: 8px; padding: 0; color: var(--link); background: none; border: 0; border-radius: 0; font-size: .82rem; font-weight: 600; text-decoration: underline; cursor: pointer; }
.booking-form .booking-change:hover { background: none; }
.booking-form[hidden], .booking-days[hidden], .booking-times[hidden] { display: none; }
@media (min-width: 1024px) {
	.site-shell { display: flex; width: min(100%, 1480px); margin: 0 auto; }
	.sidebar-inner { justify-content: center; padding: 36px 25px; }
	.sidebar-bottom { margin-top: 28px; }
}

/* ---- Tablet and phone: sidebar becomes a drawer ---- */
@media (max-width: 1023px) {
	.mobile-bar { position: sticky; top: 0; z-index: 40; display: flex; justify-content: space-between; align-items: center; height: 68px; padding: 0 20px; color: var(--sidebar-text-strong); background: var(--night); }
	.mobile-brand { display: flex; align-items: center; gap: 10px; font: 600 1.05rem var(--serif); }
	.mobile-brand img { width: 37px; height: 37px; object-fit: cover; border-radius: 11px; }
	.mobile-brand img.mobile-brand-logo { padding: 3px; object-fit: contain; background: var(--white); }
	.mobile-bar .theme-toggle { margin: 0 10px 0 auto; }
	.menu-toggle { display: grid; align-content: center; justify-items: center; gap: 5px; width: 42px; height: 42px; border: 1px solid var(--sidebar-line); border-radius: 9px; }
	.menu-toggle span { width: 17px; height: 2px; background: var(--sidebar-text); }
	.site-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 60; width: min(84vw, 330px); overflow: auto; transform: translateX(-101%); transition: transform .24s; }
	.site-sidebar.is-open { transform: none; }
	.sidebar-backdrop.is-open { position: fixed; inset: 0; z-index: 50; display: block; background: var(--overlay-sidebar); }
	.sidebar-inner { min-height: 100%; }
	.page-section { min-height: calc(100vh - 68px); }
}

@media (max-width: 650px) {
	.page-section { padding: 52px 22px 64px; }
	.home-page { padding-top: 62px; }
	.home-page h1 { font-size: clamp(3rem, 15vw, 5rem); }
	.home-latest { grid-template-columns: minmax(0, 1fr); gap: 36px; margin-top: 40px; }
	.home-latest-book .book-cover { max-width: 190px; }
	.home-tile-title { padding: 10px 11px; font-size: .92rem; }
	.counter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 35px; }
	.counter-item { min-height: 88px; padding: 10px; }
	.project-grid { grid-template-columns: 1fr; }
	.books-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
	.book-cover, .book-card h2 { max-width: 100%; }
	.book-detail { grid-template-columns: minmax(0, 1fr); }
	.book-detail-cover { width: min(72%, 270px); }
	.experience-item { grid-template-columns: 1fr; gap: 9px; padding: 21px 0; }
	.experience-year { padding: 0; }
	.article-card { gap: 14px; }
	.chapter-thumb { flex-basis: 60px; width: 60px; aspect-ratio: 1; }
	.article-image { flex-basis: 120px; width: 120px; aspect-ratio: 1; }
	.article-card h2 { font-size: 1.12rem; }
	.article-card-copy p { font-size: .81rem; }
	.modal-panel { height: 86vh; }
}

@media (prefers-reduced-motion: reduce) {
	*, ::before, ::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-delay: 0s !important; }
}

/* ---- Subscribe form base styling (in WordPress a newsletter plugin supplies this; the colours above restyle it) ---- */
.ed-subscribe-form { display: flex; gap: 8px; max-width: 560px; }
.ed-subscribe-email { flex: 1; min-width: 0; padding: 11px 13px; border: 1px solid; border-radius: 8px; font: inherit; outline: 0; }
.ed-subscribe-submit { padding: 0 18px; border: 0; border-radius: 8px; font: inherit; cursor: pointer; }

/* doveCMS additions: error variant of the notices, article gallery */
.comment-notice.is-error, .form-notice.is-error { color: var(--error-text); background: var(--error-bg); }
.draft-notice { margin: 0 0 18px; padding: 10px 14px; color: var(--accent-gold); border: 1px dashed var(--accent-gold); border-radius: 8px; font-size: .82rem; }
.draft-notice a { color: inherit; text-decoration: underline; }

/* Books: article page (full cover on top, hashtags, button to pasion.al) */
.story-cover { margin-bottom: 30px; overflow: hidden; border-radius: 16px; background: var(--surface-muted); }
.story-cover img { display: block; width: 100%; height: auto; }
.story-tags { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 16px; color: var(--text-taxonomy); font-size: .78rem; }