/*
 * Krannon Appearance Presets
 * --------------------------------------------------------------------
 * Each preset re-declares the core CSS variables and adds targeted
 * overrides for hero, cards, buttons, header and footer. Rules cascade
 * after style.css and never duplicate the base structure — they only
 * shift the look.
 *
 * Order:
 *   1. Classic Krannon  (.krannon-style-classic)  — default, no overrides
 *   2. Museum Editorial (.krannon-style-museum)
 *   3. Archaeological Fieldwork (.krannon-style-fieldwork)
 *   4. Academic Archive (.krannon-style-archive)
 *   5. Contemporary Cultural Site (.krannon-style-cultural)
 *   6. Custom Appearance is driven by inline CSS variables emitted from
 *      customizer-appearance.php, but a few structural defaults live here.
 */


/* =====================================================================
 * 1. Classic Krannon — preserved baseline.
 * Intentionally empty: style.css already defines this look.
 * ================================================================== */


/* =====================================================================
 * 2. Museum Editorial
 * Calm, museum-grade typography. Wide gutters, refined serifs, ivory
 * background, restrained accents. Aimed at scientific authority.
 * ================================================================== */

body.krannon-style-museum {
  --krannon-primary: #2A2520;
  --krannon-primary-dark: #14110D;
  --krannon-secondary: #6B5B47;
  --krannon-accent: #8C6B3E;
  --krannon-accent-soft: #c5a778;
  --krannon-bg: #F2EEE6;
  --krannon-bg-soft: #FBF8F1;
  --krannon-text: #1B1813;
  --krannon-muted: #6A655C;
  --krannon-border: rgba(42,37,32,.12);
  --krannon-border-strong: rgba(42,37,32,.22);
  --krannon-shadow: 0 14px 40px rgba(0,0,0,.05);
  --krannon-shadow-soft: 0 4px 14px rgba(0,0,0,.04);
  --krannon-shadow-strong: 0 22px 56px rgba(0,0,0,.08);
  --krannon-radius: 4px;
  --krannon-radius-sm: 2px;
  --krannon-serif: "Lora", "EB Garamond", Georgia, serif;
  --krannon-sans: "Lora", "EB Garamond", Georgia, serif;

  background: var(--krannon-bg-soft);
  color: var(--krannon-text);
  font-family: var(--krannon-serif);
  font-size: 18px;
  line-height: 1.78;
  letter-spacing: .005em;
}

body.krannon-style-museum h1,
body.krannon-style-museum h2,
body.krannon-style-museum h3,
body.krannon-style-museum h4 {
  font-family: var(--krannon-serif);
  letter-spacing: -.005em;
  font-weight: 600;
  color: var(--krannon-primary-dark);
}

body.krannon-style-museum h1 { font-size: clamp(2.2rem, 4vw, 3.4rem); line-height: 1.18; }
body.krannon-style-museum h2 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); line-height: 1.24; }

body.krannon-style-museum .site-header {
  background: var(--krannon-bg-soft);
  border-bottom: 1px solid var(--krannon-border);
  padding-block: 22px;
}

body.krannon-style-museum .site-title,
body.krannon-style-museum .site-branding a {
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .9em;
  font-weight: 600;
}

body.krannon-style-museum .krannon-card,
body.krannon-style-museum .card,
body.krannon-style-museum article.post,
body.krannon-style-museum .krannon-section {
  background: var(--krannon-bg-soft);
  border: 1px solid var(--krannon-border);
  box-shadow: none;
  border-radius: 4px;
}

body.krannon-style-museum .button,
body.krannon-style-museum .wp-block-button__link,
body.krannon-style-museum .krannon-btn,
body.krannon-style-museum button.krannon-cta {
  background: transparent;
  color: var(--krannon-primary);
  border: 1px solid var(--krannon-primary);
  border-radius: 2px;
  padding: 12px 26px;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .82rem;
  font-weight: 600;
  font-family: var(--krannon-sans);
}

body.krannon-style-museum .button:hover,
body.krannon-style-museum .krannon-btn:hover {
  background: var(--krannon-primary);
  color: var(--krannon-bg-soft);
}

body.krannon-style-museum .site-footer {
  background: #efeae0;
  border-top: 1px solid var(--krannon-border);
  padding-block: 56px;
  font-size: .92rem;
  color: var(--krannon-muted);
}

body.krannon-style-museum .krannon-hero,
body.krannon-style-museum .hero {
  padding-block: 96px;
  border-bottom: 1px solid var(--krannon-border);
}


/* =====================================================================
 * 3. Archaeological Fieldwork
 * Earthy, tactile, document-from-the-trench aesthetic. Warmer browns,
 * stronger contrast on metadata, tighter cards, hand-rule dividers.
 * ================================================================== */

body.krannon-style-fieldwork {
  --krannon-primary: #5A3E22;
  --krannon-primary-dark: #2E1F11;
  --krannon-secondary: #8C5E2E;
  --krannon-accent: #B97A3A;
  --krannon-accent-soft: #d6a979;
  --krannon-bg: #ECE3D2;
  --krannon-bg-soft: #F6EFDD;
  --krannon-text: #261C10;
  --krannon-muted: #6F5F47;
  --krannon-border: rgba(90,62,34,.22);
  --krannon-border-strong: rgba(90,62,34,.4);
  --krannon-shadow: 0 10px 28px rgba(58,38,18,.08);
  --krannon-shadow-soft: 0 3px 10px rgba(58,38,18,.06);
  --krannon-radius: 2px;
  --krannon-radius-sm: 2px;
  --krannon-serif: "IBM Plex Serif", "EB Garamond", Georgia, serif;
  --krannon-sans: "IBM Plex Sans", "Noto Sans", system-ui, sans-serif;

  background: var(--krannon-bg);
  color: var(--krannon-text);
  font-family: var(--krannon-sans);
  font-size: 16.5px;
  line-height: 1.66;
}

body.krannon-style-fieldwork h1,
body.krannon-style-fieldwork h2,
body.krannon-style-fieldwork h3 {
  font-family: var(--krannon-serif);
  font-weight: 600;
  color: var(--krannon-primary-dark);
}

body.krannon-style-fieldwork h2::after {
  content: "";
  display: block;
  width: 56px;
  height: 2px;
  background: var(--krannon-accent);
  margin-top: 14px;
}

body.krannon-style-fieldwork .site-header {
  background: #3a2918;
  color: #eadbc1;
  border-bottom: 3px solid var(--krannon-accent);
}

body.krannon-style-fieldwork .site-header a,
body.krannon-style-fieldwork .site-header .site-title {
  color: #eadbc1;
}

body.krannon-style-fieldwork .site-header nav a:hover {
  color: var(--krannon-accent-soft);
}

body.krannon-style-fieldwork .krannon-card,
body.krannon-style-fieldwork .card,
body.krannon-style-fieldwork article.post {
  background: #fbf6e9;
  border: 1px solid var(--krannon-border-strong);
  box-shadow: 0 2px 0 rgba(90,62,34,.18);
  border-radius: 2px;
  padding: 22px;
}

body.krannon-style-fieldwork .krannon-card .meta,
body.krannon-style-fieldwork .meta-row {
  font-family: var(--krannon-sans);
  font-size: .82rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--krannon-muted);
  border-top: 1px dashed var(--krannon-border-strong);
  border-bottom: 1px dashed var(--krannon-border-strong);
  padding-block: 8px;
  margin-block: 12px;
}

body.krannon-style-fieldwork .button,
body.krannon-style-fieldwork .krannon-btn,
body.krannon-style-fieldwork .wp-block-button__link {
  background: var(--krannon-primary-dark);
  color: #f4e6c9;
  border: none;
  border-radius: 2px;
  padding: 12px 22px;
  font-family: var(--krannon-sans);
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .85rem;
}

body.krannon-style-fieldwork .button:hover,
body.krannon-style-fieldwork .krannon-btn:hover {
  background: var(--krannon-accent);
  color: #2E1F11;
}

body.krannon-style-fieldwork .site-footer {
  background: #2E1F11;
  color: #d8c7a6;
  border-top: 4px solid var(--krannon-accent);
  padding-block: 64px;
}

body.krannon-style-fieldwork .site-footer a { color: var(--krannon-accent-soft); }


/* =====================================================================
 * 4. Academic Archive
 * Library / archive aesthetic. Restrained palette, generous reading
 * width, classic serif body, sober header, structured footer.
 * ================================================================== */

body.krannon-style-archive {
  --krannon-primary: #1F2933;
  --krannon-primary-dark: #0D131A;
  --krannon-secondary: #4A5867;
  --krannon-accent: #7A6034;
  --krannon-accent-soft: #b39764;
  --krannon-bg: #F5F2EC;
  --krannon-bg-soft: #FBFAF6;
  --krannon-text: #161A1F;
  --krannon-muted: #5C6470;
  --krannon-border: rgba(31,41,51,.14);
  --krannon-border-strong: rgba(31,41,51,.28);
  --krannon-shadow: none;
  --krannon-shadow-soft: none;
  --krannon-shadow-strong: none;
  --krannon-radius: 0;
  --krannon-radius-sm: 0;
  --krannon-serif: "Source Serif 4", "EB Garamond", Georgia, serif;
  --krannon-sans: "IBM Plex Sans", "Noto Sans", system-ui, sans-serif;

  background: var(--krannon-bg-soft);
  color: var(--krannon-text);
  font-family: var(--krannon-serif);
  font-size: 18px;
  line-height: 1.8;
}

body.krannon-style-archive .entry-content,
body.krannon-style-archive article {
  max-width: 720px;
  margin-inline: auto;
}

body.krannon-style-archive h1,
body.krannon-style-archive h2,
body.krannon-style-archive h3 {
  font-family: var(--krannon-serif);
  color: var(--krannon-primary-dark);
  font-weight: 600;
  letter-spacing: -.005em;
}

body.krannon-style-archive h1 { font-size: 2.4rem; line-height: 1.22; }
body.krannon-style-archive h2 { font-size: 1.7rem; line-height: 1.28; border-bottom: 1px solid var(--krannon-border); padding-bottom: 8px; }

body.krannon-style-archive .site-header {
  background: var(--krannon-bg-soft);
  border-bottom: 1px solid var(--krannon-border-strong);
  font-family: var(--krannon-sans);
  font-size: .92rem;
}

body.krannon-style-archive .site-title {
  font-family: var(--krannon-serif);
  font-weight: 600;
  letter-spacing: .01em;
}

body.krannon-style-archive nav a {
  text-transform: none;
  letter-spacing: 0;
  font-family: var(--krannon-sans);
  font-size: .92rem;
}

body.krannon-style-archive .krannon-card,
body.krannon-style-archive .card,
body.krannon-style-archive article.post {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--krannon-border);
  border-radius: 0;
  box-shadow: none;
  padding: 22px 0;
}

body.krannon-style-archive a {
  color: var(--krannon-primary);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

body.krannon-style-archive a:hover {
  color: var(--krannon-accent);
}

body.krannon-style-archive .button,
body.krannon-style-archive .krannon-btn,
body.krannon-style-archive .wp-block-button__link {
  background: transparent;
  color: var(--krannon-primary);
  border: none;
  border-bottom: 1px solid var(--krannon-primary);
  border-radius: 0;
  padding: 4px 0;
  font-family: var(--krannon-sans);
  font-weight: 500;
  text-transform: none;
  letter-spacing: .01em;
}

body.krannon-style-archive .button:hover,
body.krannon-style-archive .krannon-btn:hover {
  border-bottom-color: var(--krannon-accent);
  color: var(--krannon-accent);
}

body.krannon-style-archive .site-footer {
  background: var(--krannon-bg-soft);
  border-top: 1px solid var(--krannon-border-strong);
  font-family: var(--krannon-sans);
  font-size: .9rem;
  color: var(--krannon-muted);
  padding-block: 48px;
}


/* =====================================================================
 * 5. Contemporary Cultural Site
 * Modern, public-facing, more visual. Crisp geometric sans, larger
 * hero, generous spacing, soft surfaces, clear CTAs.
 * ================================================================== */

body.krannon-style-cultural {
  --krannon-primary: #1E3A4D;
  --krannon-primary-dark: #0F1F2B;
  --krannon-secondary: #2C7A7B;
  --krannon-accent: #C4642A;
  --krannon-accent-soft: #e8a76d;
  --krannon-bg: #F4F6F8;
  --krannon-bg-soft: #FFFFFF;
  --krannon-text: #15212B;
  --krannon-muted: #4F6373;
  --krannon-border: rgba(30,58,77,.1);
  --krannon-border-strong: rgba(30,58,77,.2);
  --krannon-shadow: 0 20px 50px rgba(15,31,43,.08);
  --krannon-shadow-soft: 0 6px 20px rgba(15,31,43,.06);
  --krannon-shadow-strong: 0 28px 70px rgba(15,31,43,.14);
  --krannon-radius: 16px;
  --krannon-radius-sm: 8px;
  --krannon-serif: "Inter", system-ui, sans-serif;
  --krannon-sans: "Inter", system-ui, sans-serif;

  background: var(--krannon-bg);
  color: var(--krannon-text);
  font-family: var(--krannon-sans);
  font-size: 17px;
  line-height: 1.7;
}

body.krannon-style-cultural h1,
body.krannon-style-cultural h2,
body.krannon-style-cultural h3 {
  font-family: var(--krannon-sans);
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--krannon-primary-dark);
}

body.krannon-style-cultural h1 { font-size: clamp(2.4rem, 5vw, 3.8rem); line-height: 1.08; }
body.krannon-style-cultural h2 { font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.18; }

body.krannon-style-cultural .site-header {
  background: var(--krannon-bg-soft);
  border-bottom: 1px solid var(--krannon-border);
  box-shadow: 0 1px 0 rgba(15,31,43,.04);
}

body.krannon-style-cultural .krannon-hero,
body.krannon-style-cultural .hero {
  background: linear-gradient(180deg, var(--krannon-bg-soft), var(--krannon-bg));
  padding-block: 112px;
  border-radius: 0 0 var(--krannon-radius) var(--krannon-radius);
}

body.krannon-style-cultural .krannon-card,
body.krannon-style-cultural .card,
body.krannon-style-cultural article.post {
  background: var(--krannon-bg-soft);
  border: 1px solid var(--krannon-border);
  border-radius: var(--krannon-radius);
  box-shadow: var(--krannon-shadow-soft);
  padding: 28px;
  transition: transform 220ms ease, box-shadow 220ms ease;
}

body.krannon-style-cultural .krannon-card:hover,
body.krannon-style-cultural article.post:hover {
  transform: translateY(-3px);
  box-shadow: var(--krannon-shadow);
}

body.krannon-style-cultural .button,
body.krannon-style-cultural .krannon-btn,
body.krannon-style-cultural .wp-block-button__link {
  background: var(--krannon-primary);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 14px 28px;
  font-family: var(--krannon-sans);
  font-weight: 600;
  letter-spacing: .005em;
  font-size: .95rem;
  box-shadow: 0 6px 18px rgba(30,58,77,.18);
}

body.krannon-style-cultural .button:hover,
body.krannon-style-cultural .krannon-btn:hover {
  background: var(--krannon-accent);
  box-shadow: 0 10px 26px rgba(196,100,42,.28);
}

body.krannon-style-cultural .site-footer {
  background: var(--krannon-primary-dark);
  color: #d4dde4;
  padding-block: 72px;
  border-top: none;
}

body.krannon-style-cultural .site-footer a { color: var(--krannon-accent-soft); }


/* =====================================================================
 * 6. Custom Appearance
 * The CSS variables are emitted inline by customizer-appearance.php.
 * The rules below translate the structural choices (hero layout, card
 * style, button style, header style, footer style, spacing, radius)
 * into actual layout and chrome.
 * ================================================================== */

body.krannon-style-custom {
  background: var(--krannon-bg-soft);
  color: var(--krannon-text);
}

/* ---- Card style ---------------------------------------------------- */

body.krannon-style-custom.krannon-card-flat .krannon-card,
body.krannon-style-custom.krannon-card-flat .card,
body.krannon-style-custom.krannon-card-flat article.post {
  background: var(--krannon-bg-soft);
  border: none;
  box-shadow: none;
  border-radius: var(--krannon-radius);
}

body.krannon-style-custom.krannon-card-bordered .krannon-card,
body.krannon-style-custom.krannon-card-bordered .card,
body.krannon-style-custom.krannon-card-bordered article.post {
  background: var(--krannon-bg-soft);
  border: 1px solid var(--krannon-border-strong);
  box-shadow: none;
  border-radius: var(--krannon-radius);
}

body.krannon-style-custom.krannon-card-shadow .krannon-card,
body.krannon-style-custom.krannon-card-shadow .card,
body.krannon-style-custom.krannon-card-shadow article.post {
  background: var(--krannon-bg-soft);
  border: 1px solid var(--krannon-border);
  box-shadow: var(--krannon-shadow-soft);
  border-radius: var(--krannon-radius);
}

body.krannon-style-custom.krannon-card-editorial .krannon-card,
body.krannon-style-custom.krannon-card-editorial .card,
body.krannon-style-custom.krannon-card-editorial article.post {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--krannon-border);
  border-radius: 0;
  box-shadow: none;
  padding-block: 28px;
}

/* ---- Button style -------------------------------------------------- */

body.krannon-style-custom.krannon-button-solid .button,
body.krannon-style-custom.krannon-button-solid .krannon-btn,
body.krannon-style-custom.krannon-button-solid .wp-block-button__link {
  background: var(--krannon-primary);
  color: #fff;
  border: none;
  border-radius: var(--krannon-radius-sm);
  padding: 12px 24px;
}

body.krannon-style-custom.krannon-button-outline .button,
body.krannon-style-custom.krannon-button-outline .krannon-btn,
body.krannon-style-custom.krannon-button-outline .wp-block-button__link {
  background: transparent;
  color: var(--krannon-primary);
  border: 1px solid var(--krannon-primary);
  border-radius: var(--krannon-radius-sm);
  padding: 12px 24px;
}

body.krannon-style-custom.krannon-button-underline .button,
body.krannon-style-custom.krannon-button-underline .krannon-btn,
body.krannon-style-custom.krannon-button-underline .wp-block-button__link {
  background: transparent;
  color: var(--krannon-primary);
  border: none;
  border-bottom: 1px solid var(--krannon-primary);
  border-radius: 0;
  padding: 4px 0;
}

body.krannon-style-custom.krannon-button-pill .button,
body.krannon-style-custom.krannon-button-pill .krannon-btn,
body.krannon-style-custom.krannon-button-pill .wp-block-button__link {
  background: var(--krannon-primary);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 12px 28px;
}

/* ---- Hero layout --------------------------------------------------- */

body.krannon-style-custom.krannon-hero-minimal .krannon-hero,
body.krannon-style-custom.krannon-hero-minimal .hero {
  padding-block: 64px;
}
body.krannon-style-custom.krannon-hero-minimal .krannon-hero img,
body.krannon-style-custom.krannon-hero-minimal .hero img {
  display: none;
}

body.krannon-style-custom.krannon-hero-overlay .krannon-hero,
body.krannon-style-custom.krannon-hero-overlay .hero {
  position: relative;
}
body.krannon-style-custom.krannon-hero-overlay .krannon-hero::before,
body.krannon-style-custom.krannon-hero-overlay .hero::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.55));
  pointer-events: none;
}
body.krannon-style-custom.krannon-hero-overlay .krannon-hero > *,
body.krannon-style-custom.krannon-hero-overlay .hero > * {
  position: relative;
  color: #fff;
}

body.krannon-style-custom.krannon-hero-split .krannon-hero,
body.krannon-style-custom.krannon-hero-split .hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
}
@media (max-width: 860px) {
  body.krannon-style-custom.krannon-hero-split .krannon-hero,
  body.krannon-style-custom.krannon-hero-split .hero {
    grid-template-columns: 1fr;
  }
}

/* ---- Section spacing ---------------------------------------------- */

body.krannon-style-custom .krannon-section,
body.krannon-style-custom main > section {
  padding-block: var(--krannon-section-spacing, 72px);
}

/* ---- Header style ------------------------------------------------- */

body.krannon-style-custom.krannon-header-centered .site-header .site-branding {
  text-align: center;
  width: 100%;
}
body.krannon-style-custom.krannon-header-centered .site-header nav {
  justify-content: center;
}

body.krannon-style-custom.krannon-header-condensed .site-header {
  padding-block: 10px;
  font-size: .92rem;
}

body.krannon-style-custom.krannon-header-editorial .site-header {
  border-bottom: 2px solid var(--krannon-primary-dark);
  padding-block: 28px;
}
body.krannon-style-custom.krannon-header-editorial .site-title {
  font-family: var(--krannon-serif);
  font-size: 1.5rem;
  letter-spacing: .005em;
}

/* ---- Footer style ------------------------------------------------- */

body.krannon-style-custom.krannon-footer-minimal .site-footer {
  padding-block: 32px;
  font-size: .88rem;
  border-top: 1px solid var(--krannon-border);
}

body.krannon-style-custom.krannon-footer-columns .site-footer .footer-inner,
body.krannon-style-custom.krannon-footer-columns .site-footer > .container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
@media (max-width: 720px) {
  body.krannon-style-custom.krannon-footer-columns .site-footer .footer-inner,
  body.krannon-style-custom.krannon-footer-columns .site-footer > .container {
    grid-template-columns: 1fr;
  }
}

body.krannon-style-custom.krannon-footer-institutional .site-footer {
  background: var(--krannon-primary-dark);
  color: #e6dfd2;
  padding-block: 64px;
  border-top: none;
}
body.krannon-style-custom.krannon-footer-institutional .site-footer a {
  color: var(--krannon-accent-soft, #d8b97e);
}

/* =====================================================================
 * Krannon Editorial — v1.3.0
 * ================================================================== */
body.krannon-style-editorial,
body.krannon-style-custom {
  background: var(--krannon-bg);
  color: var(--krannon-text);
}

body.krannon-style-editorial .site-header,
body.krannon-style-custom .site-header {
  background: color-mix(in srgb, var(--krannon-surface) 92%, transparent);
  border-bottom: 1px solid var(--krannon-border);
}

body.krannon-style-editorial .site-footer,
body.krannon-style-custom .site-footer {
  background: var(--krannon-dark-surface);
  color: var(--krannon-light-accent);
}

body.krannon-style-editorial a,
body.krannon-style-custom a { color: var(--krannon-primary); }
body.krannon-style-editorial a:hover,
body.krannon-style-custom a:hover { color: var(--krannon-accent); }

.krannon-section-hero.has-overlay::before { background: var(--krannon-hero-overlay, rgba(20,16,12,.48)); }
.krannon-bg-white, .krannon-card, .krannon-child-card, .krannon-announcement { background: var(--krannon-surface); }
.krannon-bg-soft { background: var(--krannon-bg); }
.krannon-button, .button, .wp-block-button__link { background: var(--krannon-primary); color: var(--krannon-surface); border-color: var(--krannon-primary); }
.krannon-button:hover, .button:hover, .wp-block-button__link:hover { background: var(--krannon-primary-dark); color: var(--krannon-surface); }
.breadcrumbs, .krannon-breadcrumbs, .krannon-local-nav, .krannon-gallery-caption, figcaption { color: var(--krannon-muted); border-color: var(--krannon-border); }
.leaflet-marker-icon, .krannon-map-point, .map-point { color: var(--krannon-accent); }