/*
Theme Name: Borojevic Ured 2026
Theme URI: https://www.borojevic-ured.hr
Author: Fresh Studio
Author URI: https://freshstudio.hr
Description: Custom hand-coded theme for Ured Borojevic - ovlasteni inzenjer strojarstva. Built for speed, accessibility and local SEO, without a page builder dependency.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: borojevic2026
*/

/* =========================================================
   DESIGN TOKENS
   Brand: existing gold "DB" monogram kept as-is.
   Primary = refined engineering blue (trust, precision).
   Gold    = brand-mark accent (energy / certificates / highlights).
   Green   = efficiency, eco, success states.
   ========================================================= */
:root{
  /* Brand */
  --color-primary: #2B3F82;
  --color-primary-600: #202f65;
  --color-primary-100: #E8ECF9;
  --color-gold: #F5A623;
  --color-gold-600: #D6890A;
  --color-gold-100: #FDF1DC;
  --color-green: #1FA75A;
  --color-green-600: #178246;
  --color-green-100: #E4F7EC;

  /* Neutrals */
  --color-ink: #171A2B;
  --color-body: #4B5170;
  --color-bg: #F7F8FB;
  --color-surface: #FFFFFF;
  --color-border: #E3E6F0;
  --color-muted-bg: #EEF1F8;

  /* Semantic */
  --color-on-primary: #FFFFFF;
  --color-on-gold: #171A2B;
  --color-destructive: #DC2626;
  --color-ring: #2B3F82;

  /* Type */
  --font-heading: 'Poppins', 'Segoe UI', system-ui, sans-serif;
  --font-body: 'Open Sans', 'Segoe UI', system-ui, sans-serif;

  --fs-xs: 0.8125rem;
  --fs-sm: 0.9375rem;
  --fs-base: 1.0625rem;
  --fs-lg: 1.25rem;
  --fs-xl: 1.5rem;
  --fs-2xl: 1.875rem;
  --fs-3xl: 2.375rem;
  --fs-4xl: 3rem;
  --fs-5xl: 3.75rem;

  /* Space (spacious, marketing site) */
  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4rem;
  --space-8: 6rem;
  --space-9: 8rem;

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 24px;
  --radius-full: 999px;

  --shadow-sm: 0 1px 2px rgba(23,26,43,0.06), 0 1px 1px rgba(23,26,43,0.04);
  --shadow-md: 0 8px 24px rgba(23,26,43,0.08);
  --shadow-lg: 0 24px 48px -12px rgba(23,26,43,0.18);

  --container-max: 1240px;
  --transition: 200ms ease;
}

@media (prefers-color-scheme: dark){
  :root{ color-scheme: light; }
}

/* =========================================================
   RESET / BASE
   ========================================================= */
*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *, *::before, *::after{
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

body{
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-base);
  line-height: 1.65;
  color: var(--color-body);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
}

img{ max-width: 100%; height: auto; display: block; }
svg{ display: block; }

h1,h2,h3,h4,h5,h6{
  font-family: var(--font-heading);
  color: var(--color-ink);
  font-weight: 600;
  line-height: 1.2;
  margin: 0 0 var(--space-3);
}
h1{ font-size: var(--fs-5xl); font-weight: 700; letter-spacing: -0.02em; }
h2{ font-size: var(--fs-3xl); letter-spacing: -0.01em; }
h3{ font-size: var(--fs-xl); }
p{ margin: 0 0 var(--space-3); }
a{ color: var(--color-primary); text-decoration: none; }
ul, ol{ padding-left: 1.25em; }

/* Focus visibility - accessibility first */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible{
  outline: 3px solid var(--color-gold);
  outline-offset: 2px;
  border-radius: 4px;
}

.skip-link{
  position: absolute;
  left: -999px;
  top: 0;
  background: var(--color-ink);
  color: #fff;
  padding: var(--space-2) var(--space-3);
  z-index: 1000;
  border-radius: 0 0 8px 0;
}
.skip-link:focus{ left: 0; }

.container{
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--space-4);
}

.visually-hidden{
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

/* =========================================================
   BUTTONS
   ========================================================= */
.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  line-height: 1.2;
  min-height: 44px;
  padding: 0.65rem 1.375rem;
  border-radius: var(--radius-sm);
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: var(--fs-sm);
  border: 2px solid transparent;
  cursor: pointer;
  transition: transform var(--transition), box-shadow var(--transition), background-color var(--transition), color var(--transition), border-color var(--transition);
  text-align: center;
}
.btn:hover{ transform: translateY(-2px); }
.btn-primary{
  background: var(--color-gold);
  color: var(--color-on-gold);
  box-shadow: var(--shadow-sm);
}
.btn-primary:hover{ background: var(--color-gold-600); box-shadow: var(--shadow-md); color: var(--color-on-gold); }
.btn-secondary{
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,0.55);
}
.btn-secondary:hover{ background: rgba(255,255,255,0.12); border-color:#fff; color:#fff; }
.btn-outline{
  background: transparent;
  color: var(--color-primary);
  border-color: var(--color-border);
}
.btn-outline:hover{ border-color: var(--color-primary); background: var(--color-primary-100); }
.btn-block{ width: 100%; }

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(247,248,251,0.9);
  backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid var(--color-border);
}
.site-header .container{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding-block: var(--space-2);
}
.site-branding{ display:flex; align-items:center; gap: var(--space-2); min-width:0; }
.site-branding img{ height: 44px; width: auto; }
.site-branding-text{ display:flex; flex-direction:column; line-height:1.15; }
.site-branding-text strong{ font-family: var(--font-heading); color: var(--color-ink); font-size: 0.95rem; font-weight:700; }
.site-branding-text span{ font-size: 0.75rem; color: var(--color-body); }

.primary-nav ul{
  list-style:none;
  display:flex;
  align-items:center;
  gap: var(--space-4);
  margin:0; padding:0;
}
.primary-nav a{
  position: relative;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: var(--fs-sm);
  padding: var(--space-1) 0;
  transition: color var(--transition);
}
.primary-nav a::after{
  content:"";
  position:absolute; left:0; right:0; bottom:-1px;
  height:2px; background: var(--color-gold);
  transform: scaleX(0); transform-origin: left;
  transition: transform 220ms ease;
}
.primary-nav a:hover,
.primary-nav a:focus-visible,
.primary-nav .current-menu-item > a{
  color: var(--color-primary);
}
.primary-nav a:hover::after,
.primary-nav a:focus-visible::after,
.primary-nav .current-menu-item > a::after{
  transform: scaleX(1);
}
.header-cta{ display:flex; align-items:center; gap: var(--space-3); }
.header-phone{
  display:flex; align-items:center; gap:0.4rem;
  font-family: var(--font-heading); font-weight:600; color: var(--color-ink);
  font-size: var(--fs-sm);
}
.header-phone svg{ width:18px; height:18px; color: var(--color-gold); flex-shrink:0; }

.menu-toggle{
  display:none;
  min-width: 44px; min-height: 44px;
  align-items:center; justify-content:center;
  background:none; border:1px solid var(--color-border);
  border-radius: var(--radius-sm);
  cursor:pointer;
}
.menu-toggle svg{ width:22px; height:22px; color: var(--color-ink); }

@media (max-width: 1120px){
  .primary-nav{
    position:fixed; inset:0 0 0 auto;
    width:min(320px,86vw); height:100vh;
    background: var(--color-surface);
    box-shadow: var(--shadow-lg);
    padding: var(--space-6) var(--space-4) var(--space-4);
    transform: translateX(100%);
    transition: transform 280ms ease;
    overflow-y:auto;
  }
  .primary-nav.is-open{ transform: translateX(0); }
  .primary-nav ul{ flex-direction:column; align-items:flex-start; gap: var(--space-3); }
  .primary-nav a{ font-size: var(--fs-lg); }
  .menu-toggle{ display:inline-flex; }
  .header-phone{ display:none; }
  .nav-backdrop{
    display:none; position:fixed; inset:0; background:rgba(15,18,33,0.45); z-index:90;
  }
  .nav-backdrop.is-open{ display:block; }
}

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position: relative;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-600) 100%);
  color: #fff;
  overflow: hidden;
  padding-block: var(--space-9) var(--space-8);
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background-image: radial-gradient(circle at 82% 20%, rgba(245,166,35,0.28), transparent 45%),
                     radial-gradient(circle at 100% 100%, rgba(31,167,90,0.22), transparent 40%);
  pointer-events:none;
}
.hero .container{
  position:relative;
  display:grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--space-7);
  align-items:center;
}
.hero-eyebrow{
  display:inline-flex; align-items:center; gap:0.5rem;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.25);
  color:#fff;
  font-family: var(--font-heading); font-weight:600; font-size: var(--fs-xs);
  letter-spacing:0.04em; text-transform:uppercase;
  padding: 0.4rem 0.9rem;
  border-radius: var(--radius-full);
  margin-bottom: var(--space-3);
}
.hero-eyebrow svg{ width:14px; height:14px; color: var(--color-gold); }
.hero h1{ color:#fff; margin-bottom: var(--space-4); }
.hero h1 em{ font-style:normal; color: var(--color-gold); }
.hero p.lead{ font-size: var(--fs-lg); color: rgba(255,255,255,0.88); max-width:46ch; margin-bottom: var(--space-5); }
.hero-actions{ display:flex; flex-wrap:wrap; gap: var(--space-3); margin-bottom: var(--space-6); }
.hero-trust{ display:flex; flex-wrap:wrap; gap: var(--space-5); }
.hero-trust-item{ display:flex; align-items:center; gap:0.6rem; }
.hero-trust-item svg{ width:22px; height:22px; color: var(--color-gold); flex-shrink:0; }
.hero-trust-item span{ font-size: var(--fs-sm); color: rgba(255,255,255,0.85); font-family: var(--font-heading); font-weight:500; }

.hero-media{ position:relative; }
.hero-media img{
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  aspect-ratio: 4/5; object-fit:cover; object-position: top;
}
.hero-badge{
  position:absolute; left:-1.25rem; bottom:-1.25rem;
  background:#fff; color: var(--color-ink);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  padding: var(--space-3) var(--space-4);
  display:flex; align-items:center; gap: var(--space-2);
  max-width: 260px;
}
.hero-badge .badge-icon{
  width:44px; height:44px; border-radius:50%;
  background: var(--color-green-100); color: var(--color-green);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.hero-badge .badge-icon svg{ width:22px; height:22px; }
.hero-badge strong{ display:block; font-family: var(--font-heading); font-size: var(--fs-sm); }
.hero-badge span{ font-size: var(--fs-xs); color: var(--color-body); }

@media (max-width: 1023px){
  .hero .container{ grid-template-columns:1fr; }
  .hero-media{ order:-1; max-width:360px; margin-inline:auto; }
  .hero h1{ font-size: var(--fs-4xl); }
  .hero-badge{ position:static; margin-top: var(--space-4); max-width:none; }
}
@media (max-width:640px){
  .hero{ padding-block: var(--space-7) var(--space-6); }
  .hero h1{ font-size: var(--fs-3xl); }
}
@media (max-width:480px){
  .hero-actions,
  .cta-band-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn,
  .cta-band-actions .btn{ width:100%; }
}

/* =========================================================
   SECTIONS / GENERIC
   ========================================================= */
.section{ padding-block: var(--space-8); }
.section-tight{ padding-block: var(--space-6); }
.section-muted{ background: var(--color-muted-bg); }
.section-dark{ background: var(--color-ink); color: rgba(255,255,255,0.85); }
.section-dark h2, .section-dark h3{ color:#fff; }

.section-head{ max-width: 680px; margin-bottom: var(--space-6); }
.section-head.center{ margin-inline:auto; text-align:center; }
.eyebrow{
  display:inline-block; font-family: var(--font-heading); font-weight:700;
  font-size: var(--fs-xs); letter-spacing:0.08em; text-transform:uppercase;
  color: var(--color-primary); margin-bottom: var(--space-2);
}

/* Trust / partner logo strip */
.logo-strip{ padding-block: var(--space-5); border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border); background:#fff; }
.logo-strip p{ text-align:center; font-size: var(--fs-xs); text-transform:uppercase; letter-spacing:0.08em; color:var(--color-body); font-weight:600; margin-bottom: var(--space-4); }
.logo-strip-grid{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap: var(--space-6); }
.logo-strip-grid img{ height:34px; width:auto; object-fit:contain; filter:grayscale(1); opacity:0.65; transition: opacity var(--transition), filter var(--transition); }
.logo-strip-grid img:hover{ filter:grayscale(0); opacity:1; }

/* Services grid */
.grid{ display:grid; gap: var(--space-5); }
.grid-3{ grid-template-columns: repeat(3, 1fr); }
.grid-4{ grid-template-columns: repeat(4, 1fr); }
.grid-2{ grid-template-columns: repeat(2, 1fr); }
@media (max-width:1023px){ .grid-3, .grid-4{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:640px){ .grid-3, .grid-4, .grid-2{ grid-template-columns: 1fr; } }

.card{
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
  height:100%;
}
a.card{ display:block; color:inherit; }
a.card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: transparent; }
.card-icon{
  width:56px; height:56px; border-radius: var(--radius-sm);
  background: var(--color-primary-100); color: var(--color-primary);
  display:flex; align-items:center; justify-content:center;
  margin-bottom: var(--space-3);
}
.card-icon svg{ width:28px; height:28px; }
.card h3{ margin-bottom: var(--space-2); }
.card p{ margin-bottom: var(--space-2); }
.card-link{ font-family: var(--font-heading); font-weight:600; font-size: var(--fs-sm); color: var(--color-primary); display:inline-flex; align-items:center; gap:0.35rem; }
.card-link svg{ width:16px; height:16px; transition: transform var(--transition); }
a.card:hover .card-link svg{ transform: translateX(3px); }

/* Process / steps */
.steps{ counter-reset: step; display:grid; grid-template-columns: repeat(4,1fr); gap: var(--space-5); }
@media (max-width:1023px){ .steps{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:640px){ .steps{ grid-template-columns: 1fr; } }
.step{ position:relative; padding-top: var(--space-6); }
.step::before{
  counter-increment: step; content: counter(step, decimal-leading-zero);
  font-family: var(--font-heading); font-weight:700; font-size: var(--fs-2xl);
  color: var(--color-gold);
  display:block; margin-bottom: var(--space-2);
}

/* Stats */
.stats{ display:grid; grid-template-columns: repeat(4,1fr); gap: var(--space-5); text-align:center; }
@media (max-width:768px){ .stats{ grid-template-columns: repeat(2,1fr); } }
.stat strong{ display:block; font-family: var(--font-heading); font-size: var(--fs-3xl); color:#fff; }
.stat span{ font-size: var(--fs-sm); color: rgba(255,255,255,0.75); }

/* Testimonial / quote */
.quote-card{
  background:#fff; border-radius: var(--radius-lg); box-shadow: var(--shadow-md);
  padding: var(--space-6); border-left:4px solid var(--color-gold);
}
.quote-card p{ font-size: var(--fs-lg); color: var(--color-ink); font-style:italic; }
.quote-author{ display:flex; align-items:center; gap: var(--space-2); margin-top: var(--space-4); }
.quote-author strong{ font-family: var(--font-heading); display:block; font-size: var(--fs-sm); color:var(--color-ink); }
.quote-author span{ font-size: var(--fs-xs); color: var(--color-body); }

/* CTA band */
.cta-band{
  background: linear-gradient(120deg, var(--color-primary), var(--color-primary-600));
  color:#fff; border-radius: var(--radius-lg); padding: var(--space-7);
  display:flex; align-items:center; justify-content:space-between; gap: var(--space-5); flex-wrap:wrap;
}
.cta-band h2{ color:#fff; margin-bottom: var(--space-2); }
.cta-band p{ color: rgba(255,255,255,0.85); margin-bottom:0; max-width:48ch; }
.cta-band-actions{ display:flex; gap: var(--space-3); flex-wrap:wrap; }

/* Forms */
.form-field{ margin-bottom: var(--space-4); }
.form-field label{ display:block; font-family: var(--font-heading); font-weight:600; font-size: var(--fs-sm); color: var(--color-ink); margin-bottom:0.4rem; }
.form-field .required{ color: var(--color-destructive); }
.form-field input,
.form-field textarea,
.form-field select{
  width:100%; min-height:48px; padding: 0.75rem 1rem;
  border:1.5px solid var(--color-border); border-radius: var(--radius-sm);
  font-family: var(--font-body); font-size: var(--fs-base); color: var(--color-ink);
  background:#fff;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.form-field textarea{ min-height:140px; resize:vertical; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{
  border-color: var(--color-primary); box-shadow: 0 0 0 4px var(--color-primary-100); outline:none;
}
.form-hint{ font-size: var(--fs-xs); color: var(--color-body); margin-top:0.3rem; }
.wpcf7-not-valid-tip{ color: var(--color-destructive); font-size: var(--fs-xs); margin-top:0.3rem; }
.wpcf7-response-output{ border-radius: var(--radius-sm); padding: var(--space-3); margin-top: var(--space-3); font-size: var(--fs-sm); }

/* Energy-certificate quote form (existing CF7 form #2972 markup) */
.ec-form-row{ display:grid; grid-template-columns:1fr 1fr; gap: var(--space-3); margin-bottom: var(--space-3); }
@media (max-width:640px){ .ec-form-row{ grid-template-columns:1fr; } }
.ec-form-row-full{ margin-bottom: var(--space-3); }
.ec-form-row input,
.ec-form-row-full textarea,
.ec-form-row select{
  width:100%; min-height:48px; padding: 0.75rem 1rem;
  border:1.5px solid var(--color-border); border-radius: var(--radius-sm);
  font-family: var(--font-body); font-size: var(--fs-base); color: var(--color-ink);
  background:#fff;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.ec-form-row-full textarea{ min-height:110px; resize:vertical; }
.ec-form-row input:focus, .ec-form-row select:focus, .ec-form-row-full textarea:focus{
  border-color: var(--color-primary); box-shadow: 0 0 0 4px var(--color-primary-100); outline:none;
}
.ec-form-submit{ margin-top: var(--space-2); }
.ec-submit-btn{
  display:flex; width:100%; align-items:center; justify-content:center;
  gap:0.5rem; line-height:1.2;
  min-height:48px; padding:0.75rem 1.5rem; border-radius: var(--radius-sm);
  background: var(--color-gold); color: var(--color-on-gold); border:none;
  font-family: var(--font-heading); font-weight:700; font-size: var(--fs-sm);
  cursor:pointer; transition: transform var(--transition), background-color var(--transition);
}
.ec-submit-btn:hover{ background: var(--color-gold-600); transform: translateY(-2px); }

/* FAQ / accordion */
.accordion-item{ border-bottom:1px solid var(--color-border); }
.accordion-item summary{
  display:flex; align-items:center; justify-content:space-between; gap: var(--space-3);
  padding: var(--space-4) 0; cursor:pointer; list-style:none;
  font-family: var(--font-heading); font-weight:600; color: var(--color-ink); font-size: var(--fs-lg);
}
.accordion-item summary::-webkit-details-marker{ display:none; }
.accordion-item summary svg{ width:22px; height:22px; color: var(--color-primary); flex-shrink:0; transition: transform var(--transition); }
.accordion-item[open] summary svg{ transform: rotate(45deg); }
.accordion-item .accordion-body{ padding-bottom: var(--space-4); max-width:70ch; }

/* Breadcrumb / page header for interior pages */
.page-header{ background: var(--color-primary-100); padding-block: var(--space-6); }
.page-header .eyebrow{ }
.breadcrumb{ list-style:none; display:flex; flex-wrap:wrap; gap:0.4rem; padding:0; margin:0 0 var(--space-3); font-size: var(--fs-xs); color: var(--color-body); }
.breadcrumb li:not(:last-child)::after{ content:"/"; margin-left:0.4rem; color: var(--color-border); }
.breadcrumb a{ color: var(--color-body); }
.breadcrumb a:hover{ color: var(--color-primary); }

/* Footer */
.site-footer{ background: var(--color-ink); color: rgba(255,255,255,0.7); padding-block: var(--space-8) var(--space-5); }
.footer-grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: var(--space-6); margin-bottom: var(--space-7); }
@media (max-width:1023px){ .footer-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width:640px){ .footer-grid{ grid-template-columns: 1fr; } }
.footer-col h3{ color:#fff; font-size: var(--fs-sm); text-transform:uppercase; letter-spacing:0.06em; margin-bottom: var(--space-3); }
.footer-col ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap: var(--space-2); }
.footer-col a{ color: rgba(255,255,255,0.7); }
.footer-col a:hover{ color: var(--color-gold); }
.footer-brand-mark{ display:flex; align-items:center; gap:0.6rem; margin-bottom: var(--space-3); }
.footer-brand-mark img{ height:36px; width:auto; }
.footer-brand-mark strong{ font-family: var(--font-heading); font-weight:700; font-size:1.1rem; color:#fff; }
.footer-brand p{ max-width:34ch; }
.footer-contact-item{ display:flex; gap:0.6rem; align-items:flex-start; margin-bottom: var(--space-2); }
.footer-contact-item svg{ width:18px; height:18px; color: var(--color-gold); flex-shrink:0; margin-top:2px; }
.footer-social{ display:flex; gap: var(--space-2); margin-top: var(--space-3); }
.footer-social a{
  width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,0.2);
  display:flex; align-items:center; justify-content:center;
}
.footer-social a:hover{ border-color: var(--color-gold); }
.footer-social svg{ width:18px; height:18px; }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,0.12); padding-top: var(--space-4);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap: var(--space-3);
  font-size: var(--fs-xs);
}
.footer-bottom ul{ list-style:none; display:flex; gap: var(--space-4); padding:0; margin:0; }

/* Prose content (privacy policy, generic pages, single post body) */
.entry-content{ max-width: 74ch; }
.entry-content h2{ margin-top: var(--space-6); }
.entry-content h3{ margin-top: var(--space-5); }
.entry-content ul, .entry-content ol{ margin-bottom: var(--space-3); }
.entry-content a{ text-decoration: underline; text-underline-offset: 2px; }
.entry-content img{ border-radius: var(--radius-md); margin-block: var(--space-4); }
.entry-content blockquote{
  border-left: 4px solid var(--color-gold);
  margin: var(--space-4) 0; padding: var(--space-2) var(--space-4);
  color: var(--color-ink); font-style: italic; background: var(--color-muted-bg);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

/* Blog listing / single */
.post-card-meta{ font-size: var(--fs-xs); color: var(--color-body); margin-bottom: var(--space-2); text-transform:uppercase; letter-spacing:0.04em; font-weight:600; }
.single-post-header{ max-width:74ch; margin-inline:auto; text-align:center; }
.single-post-header .post-card-meta{ justify-content:center; display:flex; gap:var(--space-2); }
.single-featured-image{ margin: var(--space-5) 0; border-radius: var(--radius-lg); overflow:hidden; box-shadow: var(--shadow-md); }
.single-featured-image img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.pagination-row{ display:flex; justify-content:space-between; gap:var(--space-3); margin-top:var(--space-7); flex-wrap:wrap; }

/* Utility */
.text-center{ text-align:center; }
.mt-0{ margin-top:0; } .mb-0{ margin-bottom:0; }
.color-gold{ color: var(--color-gold); }
.color-green{ color: var(--color-green); }
.bg-surface{ background: var(--color-surface); }
