:root{
  /* Overwritten by chosen palette via <style id="acef-palette"> */
  --acef-navy:#0A2540;
  --acef-emerald:#1FA774;
  --acef-gold:#D4AF37;
  --acef-light:#F5F5F5;
  --acef-charcoal:#333333;

  --acef-radius:16px;
  --acef-shadow: 0 12px 30px rgba(10,37,64,.10);
  --acef-max: 1200px;
  --acef-content: 920px;
  --acef-gap: 1.25rem;
}

*{box-sizing:border-box}
body.acef{
  margin:0;
  font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Inter,Helvetica,Arial,sans-serif;
  color: var(--acef-charcoal);
  background: #fff;
  line-height:1.6;
}

a{color:var(--acef-emerald); text-decoration:none}
a:hover{color:var(--acef-navy); text-decoration:underline}

.wrap{max-width:var(--acef-max); margin:0 auto; padding:0 18px;}
.site{min-height:100dvh; display:flex; flex-direction:column;}

/* Header */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border-bottom:1px solid #eee;
}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0; position:relative;}
.brand{display:flex; align-items:center; gap:12px; min-width:160px;}
.brand a{color:var(--acef-navy); font-weight:900; letter-spacing:-.02em}
.custom-logo{max-height:60px; width:auto}

.nav__list{display:flex; gap:14px; list-style:none; margin:0; padding:0; flex-wrap:wrap; align-items:center;}
.nav__list a{display:inline-flex; padding:8px 10px; border-radius:10px; color:var(--acef-navy); font-weight:650;}
.nav__list a:hover{background:var(--acef-light); text-decoration:none}

/* Mobile nav (burger) */
.nav-toggle{
  display:none;
  width:44px;height:44px;
  border:1px solid #ddd;
  background:#fff;
  border-radius:12px;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:10px;
  cursor:pointer;
}
.nav-toggle__bar{
  display:block;
  height:2px;
  width:100%;
  background: var(--acef-navy);
  border-radius:2px;
}

@media(max-width: 860px){
  .nav-toggle{display:inline-flex;}
  /* hide menu by default */
  #site-nav{display:none;}
  #site-nav.is-open{
    display:block;
    position:absolute;
    left:18px; right:18px;
    top: calc(100% + 10px);
    background:#fff;
    border:1px solid #eee;
    border-radius:16px;
    box-shadow: var(--acef-shadow);
    padding:12px;
  }
  .nav__list{flex-direction:column; align-items:stretch; gap:6px;}
  .nav__list a{padding:12px 12px; border-radius:12px;}
}

/* Main */
.main{flex:1}
.content-grid{display:grid; grid-template-columns: 1fr; gap: calc(var(--acef-gap) * 1.5); padding: 22px 0 40px;}
@media(min-width: 980px){
  .content-grid.has-sidebar{grid-template-columns: minmax(0, 1fr) 320px;}
}

.card{
  background:#fff;
  border:1px solid #eee;
  border-radius: var(--acef-radius);
  box-shadow: var(--acef-shadow);
  overflow:hidden;
}
.card__body{padding: 18px 18px 20px;}
.card__media img{display:block; width:100%; height:auto;}
.card__title{margin:0 0 10px; line-height:1.2}
.card__title a{color:var(--acef-navy)}
.card__title a:hover{text-decoration:underline}
.card__excerpt{margin:0 0 12px; color:#555}

.prose{max-width: var(--acef-content); padding:22px;}
.prose h1,.prose h2,.prose h3{color:var(--acef-navy); line-height:1.2}
.prose h1{font-size:clamp(1.6rem, 2.6vw, 2.4rem); margin:0 0 14px}
.prose h2{font-size:clamp(1.25rem, 2.1vw, 1.8rem); margin:32px 0 12px}
.prose p{margin:0 0 14px}
.prose img{max-width:100%; height:auto; border-radius: 14px}

.meta{display:flex; flex-wrap:wrap; gap:10px; color:#666; font-size:.9rem; margin: 0 0 14px;}
.badge{display:inline-flex; align-items:center; padding: 3px 10px; border-radius:999px; background: var(--acef-light); color: var(--acef-navy); font-weight:650; font-size:.8rem;}

/* Blog grids */
.post-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 18px;
}
@media(min-width: 680px){
  .post-grid{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media(min-width: 1080px){
  .post-grid{grid-template-columns: repeat(3, minmax(0, 1fr));}
}

/* Buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; padding: 10px 14px; border-radius: 12px; font-weight: 750; border:1px solid transparent; cursor:pointer;}
.btn--primary{background:var(--acef-emerald); color:#fff}
.btn--primary:hover{background:var(--acef-navy); color:#fff; text-decoration:none}
.btn--ghost{background:transparent; border-color:#ddd; color:var(--acef-navy)}
.btn--ghost:hover{background:var(--acef-light); text-decoration:none}

/* Footer */
.site-footer{border-top: 1px solid #eee; padding: 26px 0; background:#fff;}
.footer-inner{display:flex; flex-wrap:wrap; justify-content:space-between; gap:14px; align-items:center;}
.small{font-size:.9rem; color:#666}

/* Widgets */
.widget{padding:16px; border:1px solid #eee; border-radius:16px}
.widget__title{margin:0 0 10px; color:var(--acef-navy); font-size:1.05rem}

/* Pagination */
.pagination, .nav-links{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.page-numbers{display:inline-flex; padding:8px 12px; border:1px solid #ddd; border-radius:10px; color:var(--acef-navy); font-weight:650}
.page-numbers.current{background:var(--acef-light); border-color: var(--acef-light)}

/* Comment form tweaks */
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{
  width:100%;
  border:1px solid #ddd;
  border-radius:12px;
  padding:10px 12px;
  font:inherit;
}

/* Simple form styling (used by Contact page blocks / basic HTML forms) */
.prose input[type="text"],
.prose input[type="email"],
.prose input[type="url"],
.prose input[type="tel"],
.prose textarea,
.prose select{
  width:100%;
  border:1px solid #ddd;
  border-radius:12px;
  padding:10px 12px;
  font:inherit;
  background:#fff;
}
.prose textarea{min-height:140px; resize:vertical;}
.prose button,
.prose input[type="submit"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  border:1px solid var(--acef-navy);
  background: var(--acef-navy);
  color:#fff;
  padding:10px 14px;
  font-weight:700;
  cursor:pointer;
}
.prose button:hover,
.prose input[type="submit"]:hover{opacity:.92}

/* Accessibility helpers */
.screen-reader-text{
  border:0 !important;
  clip:rect(1px,1px,1px,1px) !important;
  -webkit-clip-path: inset(50%) !important;
  clip-path: inset(50%) !important;
  height:1px !important;
  margin:-1px !important;
  overflow:hidden !important;
  padding:0 !important;
  position:absolute !important;
  width:1px !important;
  white-space:nowrap !important;
}

/* Burger icon (SVG) */
.nav-toggle{ color: var(--acef-navy); }
.nav-toggle__icon{ display:block; }