/*
Theme Name: Weblooc Base
Theme URI: https://weblooc.com
Description: Minimalna tema za Weblooc — daje samo chrome (navbar + footer) za WP defaultne strani (404, search, singular, archive). Vsi marketinški layouti pridejo iz mu-plugin-ov; ta tema NIČ ne oblikuje pri prepoznavih custom straneh.
Author: Weblooc d.o.o.
Author URI: https://weblooc.com
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
License: Proprietary
Text Domain: weblooc-base
Tags: minimal, headless-ready, brand-system
*/

/* ============================================================
   Tokens — duplicate of CGP brand system za samostojnost.
   Ko se chrome.css naloži, dobi telo iste tokens; sicer fallback hex.
   ============================================================ */
.weblooc-base-body {
	--w-ivory:          #F6F1E8;
	--w-ivory-deep:     #E9E1D0;
	--w-char:           #1B1A16;
	--w-char-muted:     #4a4a44;
	--w-char-subtle:    #85827a;
	--w-sky-50:         #EDF2F5;
	--w-sky-100:        #D7E2EA;
	--w-sky-500:        #7A9CB0;
	--w-sky-700:        #4F7387;
	--w-sky-900:        #2F4D5C;
	--w-border:         rgba(27, 26, 22, 0.12);
	--w-border-soft:    rgba(27, 26, 22, 0.06);
}

/* ============================================================
   Reset + body
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

.weblooc-base-body {
	margin: 0;
	background: var(--w-ivory, #F6F1E8);
	color: var(--w-char, #1B1A16);
	font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-feature-settings: "ss01", "cv11";
	line-height: 1.55;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }

/* ============================================================
   Main wrapper — centered prose for default pages
   ============================================================ */
main.weblooc-base-main { display: block; }

.wb-inner {
	max-width: 880px;
	margin: 0 auto;
	padding: 96px 24px 128px;
}

@media (max-width: 768px) {
	.wb-inner { padding: 64px 16px 96px; }
}

/* ============================================================
   Eyebrow (Geist Mono small caps)
   ============================================================ */
.wb-eyebrow {
	font-family: "Geist Mono", "SF Mono", Menlo, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--w-char-muted, #4a4a44);
	display: block;
	margin-bottom: 24px;
}

/* ============================================================
   Headings
   ============================================================ */
.wb-inner h1,
.wb-inner h2,
.wb-inner h3 {
	font-family: "Instrument Serif", Georgia, "Times New Roman", serif;
	font-weight: 400;
	color: var(--w-char, #1B1A16);
	letter-spacing: -0.02em;
}

.wb-inner h1 {
	font-size: 64px;
	line-height: 1.05;
	letter-spacing: -2px;
	margin: 0 0 24px;
}

.wb-inner h1 em,
.wb-inner h2 em {
	font-style: italic;
	color: var(--w-sky-700, #4F7387);
}

.wb-inner h2 {
	font-size: 32px;
	line-height: 1.15;
	margin: 48px 0 16px;
}

.wb-inner h3 {
	font-size: 22px;
	line-height: 1.25;
	margin: 32px 0 8px;
}

@media (max-width: 768px) {
	.wb-inner h1 { font-size: 40px; letter-spacing: -1px; }
}

/* ============================================================
   Prose
   ============================================================ */
.wb-prose {
	font-size: 16px;
	line-height: 1.7;
	color: var(--w-char-muted, #4a4a44);
}

.wb-prose p { margin: 0 0 16px; }

.wb-prose a {
	color: var(--w-sky-700, #4F7387);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.wb-prose strong { color: var(--w-char, #1B1A16); font-weight: 600; }

.wb-prose em {
	font-family: "Instrument Serif", Georgia, serif;
	font-style: italic;
	color: var(--w-sky-700, #4F7387);
}

.wb-prose ul, .wb-prose ol { margin: 0 0 16px; padding-left: 24px; }
.wb-prose ul li::marker { color: var(--w-sky-500, #7A9CB0); }

.wb-prose blockquote {
	margin: 32px 0;
	padding: 0 0 0 24px;
	border-left: 1px solid var(--w-sky-500, #7A9CB0);
	font-family: "Instrument Serif", Georgia, serif;
	font-style: italic;
	font-size: 22px;
	line-height: 1.45;
	color: var(--w-char, #1B1A16);
}

/* ============================================================
   404 — friendly, branded
   ============================================================ */
.wb-404 { text-align: center; padding: 64px 0; }

.wb-404 .wb-eyebrow { margin-bottom: 24px; color: var(--w-sky-700, #4F7387); }

.wb-404 h1 {
	font-size: 120px;
	line-height: 0.95;
	letter-spacing: -3px;
	margin: 0 0 24px;
}

.wb-404 p {
	font-family: "DM Sans", sans-serif;
	font-size: 17px;
	line-height: 1.55;
	color: var(--w-char-muted, #4a4a44);
	max-width: 480px;
	margin: 0 auto 12px;
}

.wb-404-cta {
	display: inline-block;
	margin-top: 32px;
	padding: 14px 24px;
	background: var(--w-char, #1B1A16);
	color: var(--w-ivory, #F6F1E8);
	text-decoration: none;
	border-radius: 8px;
	font-family: "DM Sans", sans-serif;
	font-weight: 500;
	font-size: 15px;
	transition: background .18s ease;
}

.wb-404-cta:hover { background: #2a2924; }

@media (max-width: 768px) {
	.wb-404 h1 { font-size: 72px; letter-spacing: -2px; }
}

/* ============================================================
   Listing (archive, search)
   ============================================================ */
.wb-list {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.wb-list-item {
	padding: 32px 0;
	border-bottom: 1px solid var(--w-border, rgba(27, 26, 22, 0.12));
}

.wb-list-item:first-child { padding-top: 0; }
.wb-list-item:last-child { border-bottom: 0; }

.wb-list-item a {
	text-decoration: none;
	color: var(--w-char, #1B1A16);
	display: block;
}

.wb-list-item h2 {
	font-size: 26px;
	margin: 8px 0 8px;
	line-height: 1.2;
	transition: color .18s ease;
}

.wb-list-item a:hover h2 { color: var(--w-sky-700, #4F7387); }

.wb-list-item p {
	font-size: 15px;
	line-height: 1.6;
	color: var(--w-char-muted, #4a4a44);
	margin: 0;
}

.wb-pagination {
	margin-top: 48px;
	padding-top: 32px;
	border-top: 1px solid var(--w-border, rgba(27, 26, 22, 0.12));
	display: flex;
	justify-content: space-between;
	font-family: "Geist Mono", monospace;
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.wb-pagination a {
	color: var(--w-char-muted, #4a4a44);
	text-decoration: none;
}

.wb-pagination a:hover { color: var(--w-char, #1B1A16); }