/*! Sade Theme – main.css  (2025-11-01)
   Minimal, clean, responsive CSS for header, nav, content, widgets.
   - Header/logo sizing: 2x height + width limit (see .custom-logo rules)
   - Safe defaults; avoids heavy resets to not break WP editor output
*/

/* ---------- CSS Variables ---------- */
:root{
  --sade-bg: #ffffff;
  --sade-text: #111827;         /* slate-900 */
  --sade-muted: #6b7280;        /* slate-500 */
  --sade-accent: #2563eb;       /* blue-600 */
  --sade-surface: #f8fafc;      /* slate-50 */
  --sade-border: #e5e7eb;       /* slate-200 */
  --sade-radius: 12px;
  --sade-shadow: 0 1px 2px rgba(0,0,0,.05), 0 4px 12px rgba(0,0,0,.06);
}

/* ---------- Base ---------- */
*,
*::before,
*::after{ box-sizing: border-box; }

html{ scroll-behavior:smooth; }
body{
  margin:0;
  color:var(--sade-text);
  background:var(--sade-bg);
  font: 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a{ color:var(--sade-accent); text-decoration:none; }
a:hover{ text-decoration:underline; }

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

.wrapper{ max-width:1080px; margin-inline:auto; padding-inline:16px; }

/* ---------- Header ---------- */
.site-header{
  background:#fff;
  border-bottom:1px solid var(--sade-border);
  position:relative;
  z-index:5;
}
.site-header .wrapper{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  min-height:64px;
}
.site-branding{ display:flex; align-items:center; gap:12px; }
.site-branding .site-title{
  font-size: clamp(18px, 2.2vw, 24px);
  margin:0;
  letter-spacing:.5px;
  font-weight: 800;
}
.site-branding .site-title a{ color:var(--sade-text); text-decoration:none; }
.site-branding .site-title a:hover{ color:var(--sade-accent); }
.site-description{
  color:var(--sade-muted);
  font-size:13px;
  margin:0;
}

/* Header logo: 2x vertical size, horizontal limit, keep aspect */
.custom-logo,
.custom-logo-link img{
  max-height: clamp(56px, 6.4vw, 72px); /* doubled height */
  max-width: 220px;                     /* horizontal limit */
  height:auto;
  width:auto;
  display:block;
}
@media (max-width:600px){
  .custom-logo,
  .custom-logo-link img{
    max-height:48px;
    max-width:180px;
  }
}

/* ---------- Primary nav ---------- */
.primary-nav ul{
  list-style:none; margin:0; padding:0;
  display:flex; align-items:center; gap:18px;
}
.primary-nav a{
  color:var(--sade-text);
  text-decoration:none;
  padding:8px 0;
}
.primary-nav a:hover{ color:var(--sade-accent); text-decoration:none; }
@media (max-width:760px){
  .primary-nav ul{ gap:14px; }
}

/* ---------- Content ---------- */
.site-content.wrapper{ padding-block:24px 56px; }
.entry{ background:#fff; border:1px solid var(--sade-border); border-radius:var(--sade-radius); box-shadow:var(--sade-shadow); padding:20px; }
.entry-title{ margin:0 0 8px; font-size:clamp(22px, 3vw, 32px); line-height:1.25; }
.entry-meta{ color:var(--sade-muted); font-size:14px; margin-bottom:12px; }

/* Lists & widgets */
.widget{
  background:#fff;
  border:1px solid var(--sade-border);
  border-radius:var(--sade-radius);
  padding:16px;
  box-shadow:var(--sade-shadow);
}
.widget .widget-title,
.widgettitle{
  margin:0 0 12px;
  font-size:18px;
  font-weight:700;
}

/* Forms */
input[type="text"], input[type="search"], input[type="email"], input[type="url"],
input[type="password"], textarea, select{
  border:1px solid var(--sade-border);
  border-radius:10px;
  padding:8px 10px;
  width:100%;
  font:inherit;
  background:#fff;
}
button, input[type="submit"]{
  padding:9px 14px;
  border-radius:10px;
  background:var(--sade-accent);
  color:#fff;
  border:1px solid transparent;
  cursor:pointer;
}
button:hover, input[type="submit"]:hover{ filter:brightness(1.05); }

/* ---------- Hero (optional, front-page) ---------- */
.hero{ padding:64px 0; text-align:center; }
.hero .hero-logo{ max-height:120px; width:auto; }
@media (min-width:992px){ .hero .hero-logo{ max-height:140px; } }

/* ---------- Footer ---------- */
.site-footer{
  margin-top:56px;
  padding:24px 0;
  color:var(--sade-muted);
  border-top:1px solid var(--sade-border);
  background:#fff;
}
.site-footer .site-info{ font-size:14px; }
.site-footer a{ color:inherit; text-decoration:none; }
.site-footer a:hover{ color:var(--sade-accent); }

/* ---------- Utilities ---------- */
.card{ background:#fff; border:1px solid var(--sade-border); border-radius:var(--sade-radius); box-shadow:var(--sade-shadow); }
.rounded{ border-radius:var(--sade-radius); }
.mt-2{ margin-top:.5rem; } .mt-4{ margin-top:1rem; } .mt-6{ margin-top:1.5rem; }
.mb-2{ margin-bottom:.5rem; } .mb-4{ margin-bottom:1rem; } .mb-6{ margin-bottom:1.5rem; }

/* ---------- Post images spacing ---------- */
.entry-content img{ margin: 12px 0; border-radius:10px; }

/* If you also insert the auto-generated logo image inside content, keep it modest */
.entry-content img[src*="auto-logo-"]{ max-width:260px; height:auto; }