/* ============================================================
   AMMOS — Asset Management Multifamily Operating System
   Brand palette extracted directly from the AMMOS logo.
   ============================================================ */

:root {
  /* Brand colors — sampled from logo */
  --green-deep:   #172E0A;   /* darkest — headings, footer */
  --green:        #294715;   /* primary green */
  --green-mid:    #3E5626;   /* mid green — accents */
  --gold:         #B8984C;   /* gold — rules, highlights */
  --gold-soft:    #C7A05E;
  --cream:        #FEF8E0;   /* page background */
  --cream-deep:   #F4ECCF;   /* panel background */
  --ink:          #1c1c14;   /* body text */
  --ink-soft:     #4a4a3e;
  --white:        #ffffff;

  --maxw: 1180px;
  --radius: 6px;
  --shadow-sm: 0 1px 3px rgba(23,46,10,.08), 0 1px 2px rgba(23,46,10,.06);
  --shadow-md: 0 10px 30px rgba(23,46,10,.10), 0 4px 10px rgba(23,46,10,.06);
  --shadow-lg: 0 24px 60px rgba(23,46,10,.16);

  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Newsreader', Georgia, serif;
  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ---------- Reset ---------- */
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--cream);
  line-height: 1.65;
  font-size: 18px;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

/* subtle paper grain over the whole page */
body::before {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none; z-index: 1;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Typography ---------- */
h1,h2,h3,h4 { font-family: var(--font-display); font-weight: 600; line-height: 1.08; color: var(--green-deep); letter-spacing: -.01em; }
.eyebrow {
  font-family: var(--font-ui);
  font-size: .92rem; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--gold); display: inline-block;
}
.eyebrow.lg { font-size: 1.05rem; letter-spacing: .26em; }
.kicker-rule { display:inline-block; width:14px; height:2px; background:var(--gold); vertical-align: middle; margin-right:10px; opacity:.85; }

/* ---------- Layout ---------- */
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 28px; position: relative; z-index: 2; }
section { position: relative; z-index: 2; }

/* ---------- Header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(254,248,224,.86);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(184,152,76,.28);
}
.nav { display: flex; align-items: center; justify-content: space-between; height: 91px; }
.brand { display: flex; align-items: center; gap: 14px; font-family: var(--font-display); font-weight: 600; }
.brand img { height: 56px; width: 56px; border-radius: 50%; background: transparent; }
.brand-name { font-size: 1.45rem; color: var(--green-deep); letter-spacing: .02em; }
.brand-name span { color: var(--gold); }
.nav-links { display: flex; align-items: center; gap: 39px; font-family: var(--font-ui); font-size: .92rem; font-weight: 500; }
.nav-links a { color: var(--green-deep); position: relative; padding: 4px 0; transition: color .2s; }
.nav-links a::after {
  content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px;
  background: var(--gold); transition: width .25s ease;
}
.nav-links a:hover { color: var(--green); }
.nav-links a:hover::after { width: 100%; }
.nav-links a.cta {
  background: var(--green); color: var(--cream);
  padding: 10px 20px; border-radius: var(--radius);
  font-weight: 600; transition: background .2s, transform .2s;
}
.nav-links a.cta::after { display: none; }
.nav-links a.cta:hover { background: var(--green-deep); transform: translateY(-1px); color: var(--cream); }
.menu-toggle { display:none; background:none; border:0; cursor:pointer; font-size:1.6rem; color:var(--green-deep); }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font-ui); font-weight: 600; font-size: .95rem;
  padding: 14px 28px; border-radius: var(--radius);
  cursor: pointer; border: 1px solid transparent;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.btn-primary { background: var(--green); color: var(--cream); box-shadow: var(--shadow-sm); }
.btn-primary:hover { background: var(--green-deep); transform: translateY(-2px); box-shadow: var(--shadow-md); color: var(--cream); }
.btn-ghost { background: transparent; color: var(--green-deep); border-color: var(--gold); }
.btn-ghost:hover { background: var(--gold); color: var(--green-deep); transform: translateY(-2px); }
.btn .arrow { transition: transform .2s; }
.btn:hover .arrow { transform: translateX(4px); }

/* ---------- Hero ---------- */
.hero { padding: 92px 0 80px; position: relative; overflow: hidden; }
.hero::after {
  content:""; position:absolute; right:-180px; top:-120px;
  width: 520px; height: 520px; border-radius: 50%;
  background: radial-gradient(circle at center, rgba(184,152,76,.18), transparent 68%);
  z-index: 0;
}
.hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 60px; align-items: center; }
.hero h1 { font-size: clamp(2.6rem, 5.4vw, 4.4rem); margin: 22px 0 10px; }
.hero h1 .accent { color: var(--green); font-style: italic; }
.hero .lede { font-size: 1.28rem; color: var(--ink-soft); max-width: 34ch; margin: 18px 0 34px; line-height: 1.5; }
.hero-cta { display: flex; gap: 16px; flex-wrap: wrap; }
.hero-art { position: relative; z-index: 2; display:flex; justify-content:center; }
.hero-seal {
  width: min(100%, 420px); aspect-ratio: 1;
  filter: drop-shadow(0 18px 40px rgba(23,46,10,.22));
  animation: floaty 7s ease-in-out infinite;
  background: transparent;
}
@keyframes floaty { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-12px)} }

/* entrance animation — content is ALWAYS visible by default.
   JS adds .in to play a soft entrance. No JS / JS-fail = fully visible. */
.reveal { opacity: 1; transform: none; transition: opacity .7s ease, transform .7s ease; }
.js-ready .reveal { opacity: 0; transform: translateY(22px); }
.js-ready .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js-ready .reveal { opacity: 1; transform: none; } }

/* ---------- Trust strip ---------- */
.trust { border-top: 1px solid rgba(184,152,76,.3); border-bottom: 1px solid rgba(184,152,76,.3); background: var(--cream-deep); }
.trust .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 24px; padding-top: 26px; padding-bottom: 26px; }
.trust-item { display:flex; align-items:center; gap:12px; font-family: var(--font-ui); font-size:.88rem; color: var(--green-deep); font-weight:500; }
.trust-item .dot { width:8px; height:8px; border-radius:50%; background: var(--gold); flex:none; }

/* ---------- Section shells ---------- */
.section-pad { padding: 96px 0; }
.section-head { max-width: 720px; margin-bottom: 54px; }
.section-head h2 { font-size: clamp(2rem, 3.6vw, 2.9rem); margin: 16px 0 14px; }
.section-head p { color: var(--ink-soft); font-size: 1.15rem; }

/* ---------- The Gap (problem) ---------- */
.gap-band { background: var(--green-deep); color: var(--cream); }
.gap-band h2, .gap-band h3 { color: var(--cream); }
.gap-band .eyebrow { color: var(--gold-soft); }
.gap-quote { font-family: var(--font-display); font-size: clamp(1.6rem,3vw,2.4rem); line-height: 1.3; max-width: 22ch; }
.gap-quote .hl { color: var(--gold-soft); font-style: italic; }
.gap-grid { display:grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items:center; }
.gap-points { display:flex; flex-direction:column; gap: 26px; }
.gap-point { padding-left: 22px; border-left: 2px solid var(--gold); }
.gap-point h4 { color: var(--cream); font-size: 1.15rem; margin-bottom: 6px; }
.gap-point p { color: rgba(254,248,224,.78); font-size: 1rem; }

/* ---------- DDC framework ---------- */
.ddc-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 26px; }
.ddc-card {
  background: var(--white); border: 1px solid rgba(184,152,76,.32);
  border-radius: var(--radius); padding: 34px 30px;
  box-shadow: var(--shadow-sm); position: relative; overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}
.ddc-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.ddc-card::before { content:""; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg,var(--green),var(--gold)); }
.ddc-num { font-family: var(--font-display); font-size: 3rem; color: var(--cream-deep); line-height:1; position:absolute; top:18px; right:22px; font-weight:600; }
.ddc-card h3 { font-size: 1.5rem; margin-bottom: 10px; }
.ddc-card p { color: var(--ink-soft); font-size: 1rem; }

/* ---------- Pillars / book / kairos cards ---------- */
.tri-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: 28px; }
.feature-card {
  background: var(--white); border:1px solid rgba(184,152,76,.3);
  border-radius: var(--radius); padding: 36px 32px; box-shadow: var(--shadow-sm);
  display:flex; flex-direction:column; transition: transform .25s, box-shadow .25s;
}
.feature-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.feature-card .tag { font-family:var(--font-ui); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; font-weight:600; color:var(--gold); margin-bottom:14px; }
.feature-card h3 { font-size:1.55rem; margin-bottom:12px; }
.feature-card p { color:var(--ink-soft); font-size:1rem; flex:1; margin-bottom:18px; }
.feature-card .card-link { font-family:var(--font-ui); font-weight:600; font-size:.9rem; color:var(--green); display:inline-flex; gap:8px; align-items:center; }
.feature-card .card-link .arrow { transition: transform .2s; }
.feature-card:hover .card-link .arrow { transform: translateX(4px); }
.feature-card.coming { background: linear-gradient(160deg, var(--green) 0%, var(--green-deep) 100%); color: var(--cream); border-color: var(--green); }
.feature-card.coming h3, .feature-card.coming .tag { color: var(--cream); }
.feature-card.coming .tag { color: var(--gold-soft); }
.feature-card.coming p { color: rgba(254,248,224,.82); }

/* ---------- Signup band ---------- */
.signup-band { background: var(--cream-deep); border-top:1px solid rgba(184,152,76,.3); }
.signup-grid { display:grid; grid-template-columns: 1fr 460px; gap: 60px; align-items:center; }
.signup-copy h2 { font-size: clamp(2rem,3.4vw,2.7rem); margin-bottom:16px; }
.signup-copy p { color: var(--ink-soft); font-size:1.12rem; max-width: 42ch; }
.form-shell { background: var(--cream); border:1px solid rgba(184,152,76,.35); border-radius: var(--radius); padding: 8px; box-shadow: var(--shadow-md); }

/* ---------- Page hero (interior pages) ---------- */
.page-hero { padding: 80px 0 50px; border-bottom:1px solid rgba(184,152,76,.28); }
.page-hero h1 { font-size: clamp(2.4rem,4.6vw,3.8rem); margin:16px 0 14px; }
.page-hero p { font-size:1.22rem; color:var(--ink-soft); max-width: 56ch; }

/* ---------- About ---------- */
.about-grid { display:grid; grid-template-columns: 1fr 1.4fr; gap:60px; align-items:start; }
.about-portrait { background: var(--cream-deep); border:1px solid rgba(184,152,76,.35); border-radius: var(--radius); padding:40px; text-align:center; position:sticky; top:100px; }
.about-portrait .seal { width: 200px; margin:0 auto 22px; }
.about-portrait .portrait {
  width: 100%; max-width: 280px;
  margin: 0 auto 22px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 50%;
  border: 4px solid var(--cream);
  outline: 1px solid rgba(184,152,76,.45);
  box-shadow: 0 14px 40px rgba(23,46,10,.18), 0 4px 12px rgba(23,46,10,.10);
  transition: transform .35s ease, box-shadow .35s ease;
}
.about-portrait .portrait:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 56px rgba(23,46,10,.24), 0 6px 16px rgba(23,46,10,.12);
}
.about-portrait h3 { font-size:1.4rem; margin-bottom:4px; }
.about-portrait .role { font-family:var(--font-ui); font-size:.85rem; color:var(--gold); font-weight:600; letter-spacing:.04em; }
.prose p { margin-bottom: 22px; font-size:1.12rem; color:var(--ink); }
.prose p .lead-em { font-family:var(--font-display); font-style:italic; color:var(--green); }
.pullquote { border-left:3px solid var(--gold); padding:8px 0 8px 26px; margin:32px 0; font-family:var(--font-display); font-size:1.5rem; line-height:1.35; color:var(--green-deep); }

/* ---------- Academy specifics ---------- */
.curriculum { display:grid; grid-template-columns: repeat(2,1fr); gap:24px; }
.curr-item { background:var(--white); border:1px solid rgba(184,152,76,.3); border-radius:var(--radius); padding:28px; box-shadow:var(--shadow-sm); }
.curr-item h4 { font-size:1.25rem; margin-bottom:8px; display:flex; gap:12px; align-items:baseline; }
.curr-item h4 .n { font-family:var(--font-ui); font-size:.8rem; color:var(--gold); font-weight:700; }
.curr-item p { color:var(--ink-soft); font-size:.98rem; }
.who-list { list-style:none; display:flex; flex-direction:column; gap:16px; }
.who-list li { display:flex; gap:14px; align-items:flex-start; font-size:1.1rem; }
.who-list li .chk { color:var(--gold); font-weight:700; flex:none; margin-top:2px; }
.detail-note { display:inline-flex; align-items:center; gap:10px; background:var(--cream-deep); border:1px dashed var(--gold); border-radius:var(--radius); padding:12px 20px; font-family:var(--font-ui); font-size:.92rem; color:var(--green-deep); font-weight:500; }

/* ---------- Footer ---------- */
.site-footer { background: var(--green-deep); color: var(--cream); padding: 64px 0 32px; margin-top: 0; }
.footer-grid { display:grid; grid-template-columns: 1.4fr 1fr 1fr; gap:48px; padding-bottom:44px; border-bottom:1px solid rgba(184,152,76,.3); }
.footer-brand { display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.footer-brand img { border-radius:50%; background: transparent; }
.footer-brand .fname { font-family:var(--font-display); font-size:1.4rem; color:var(--cream); }
.footer-blurb { color: rgba(254,248,224,.7); font-size:.98rem; max-width:38ch; }
.footer-col h4 { color:var(--gold-soft); font-family:var(--font-ui); font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; margin-bottom:18px; }
.footer-col a { display:block; color:rgba(254,248,224,.82); font-family:var(--font-ui); font-size:.95rem; margin-bottom:12px; transition:color .2s; }
.footer-col a:hover { color:var(--cream); }
.footer-bottom { padding-top:26px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; font-family:var(--font-ui); font-size:.82rem; color:rgba(254,248,224,.6); }
.footer-bottom .legal-entity { max-width: 60ch; }

/* ---------- Kai chat widget ---------- */
.kai-launch {
  position: fixed; right: 26px; bottom: 26px; z-index: 200;
  display:flex; align-items:center; gap:12px; cursor:pointer;
  background: var(--white); border:1px solid rgba(184,152,76,.4);
  border-radius: 50px; padding: 8px 20px 8px 8px;
  box-shadow: var(--shadow-lg); transition: transform .2s;
  font-family: var(--font-ui); font-weight:600; color:var(--green-deep);
}
.kai-launch:hover { transform: translateY(-3px) scale(1.02); }
.kai-launch img { height:46px; width:46px; border-radius:50%; object-fit:cover; object-position: top center; border:2px solid var(--gold); background: var(--cream); }
.kai-launch .pulse { position:absolute; top:8px; right:18px; width:10px; height:10px; background:var(--gold); border-radius:50%; box-shadow:0 0 0 0 rgba(184,152,76,.6); animation:pulse 2s infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(184,152,76,.6)} 70%{box-shadow:0 0 0 12px rgba(184,152,76,0)} 100%{box-shadow:0 0 0 0 rgba(184,152,76,0)} }

.kai-panel {
  position: fixed; right: 26px; bottom: 26px; z-index: 201;
  width: min(390px, calc(100vw - 40px)); height: min(580px, calc(100vh - 60px));
  background: var(--cream); border:1px solid rgba(184,152,76,.4);
  border-radius: 14px; box-shadow: var(--shadow-lg);
  display:flex; flex-direction:column; overflow:hidden;
  transform: translateY(20px) scale(.96); opacity:0; pointer-events:none;
  transition: transform .28s cubic-bezier(.16,1,.3,1), opacity .28s;
}
.kai-panel.open { transform:none; opacity:1; pointer-events:auto; }
.kai-header { background: var(--green); color:var(--cream); padding:16px 18px; display:flex; align-items:center; gap:12px; }
.kai-header img { height:42px; width:42px; border-radius:50%; object-fit:cover; object-position: top center; border:2px solid var(--gold-soft); background: var(--cream); }
.kai-header .kh-name { font-family:var(--font-display); font-size:1.15rem; }
.kai-header .kh-sub { font-family:var(--font-ui); font-size:.72rem; color:rgba(254,248,224,.8); }
.kai-header .kh-close { margin-left:auto; background:none; border:0; color:var(--cream); font-size:1.4rem; cursor:pointer; opacity:.85; }
.kai-header .kh-close:hover { opacity:1; }
.kai-body { flex:1; overflow-y:auto; padding:18px; display:flex; flex-direction:column; gap:14px; }
.kai-msg { font-family:var(--font-ui); font-size:.92rem; line-height:1.5; padding:11px 15px; border-radius:14px; max-width:85%; }
.kai-msg.bot { background:var(--white); border:1px solid rgba(184,152,76,.3); color:var(--ink); align-self:flex-start; border-bottom-left-radius:4px; }
.kai-msg.user { background:var(--green); color:var(--cream); align-self:flex-end; border-bottom-right-radius:4px; }
.kai-suggested { display:flex; flex-wrap:wrap; gap:8px; }
.kai-chip { font-family:var(--font-ui); font-size:.8rem; background:var(--cream-deep); border:1px solid rgba(184,152,76,.4); color:var(--green-deep); padding:7px 13px; border-radius:50px; cursor:pointer; transition:background .2s; }
.kai-chip:hover { background:var(--gold); }
.kai-input { border-top:1px solid rgba(184,152,76,.3); padding:12px; display:flex; gap:8px; background:var(--cream); }
.kai-input input { flex:1; font-family:var(--font-ui); font-size:.92rem; padding:11px 14px; border:1px solid rgba(184,152,76,.4); border-radius:50px; background:var(--white); color:var(--ink); }
.kai-input input:focus { outline:none; border-color:var(--green); }
.kai-input button { background:var(--green); color:var(--cream); border:0; border-radius:50%; width:42px; height:42px; cursor:pointer; flex:none; font-size:1.1rem; transition:background .2s; }
.kai-input button:hover { background:var(--green-deep); }
.kai-typing { display:flex; gap:4px; padding:11px 15px; }
.kai-typing span { width:7px; height:7px; background:var(--gold); border-radius:50%; animation:typing 1.2s infinite; }
.kai-typing span:nth-child(2){animation-delay:.2s} .kai-typing span:nth-child(3){animation-delay:.4s}
@keyframes typing { 0%,60%,100%{opacity:.3;transform:translateY(0)} 30%{opacity:1;transform:translateY(-4px)} }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .hero-grid, .gap-grid, .signup-grid, .about-grid { grid-template-columns: 1fr; gap: 40px; }
  .ddc-grid, .tri-grid, .curriculum { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .hero-art { order: -1; }
  .hero-seal { width: 240px; }
  .about-portrait { position: static; }
  .nav-links { display: none; position: absolute; top: 76px; left:0; right:0; flex-direction: column; background: var(--cream); padding: 20px 28px; gap: 18px; border-bottom: 1px solid rgba(184,152,76,.3); box-shadow: var(--shadow-md); }
  .nav-links.show { display: flex; }
  .menu-toggle { display: block; }
}
@media (max-width: 520px) {
  body { font-size: 17px; }
  .section-pad { padding: 64px 0; }
  .hero { padding: 56px 0 50px; }
  .kai-launch span.label { display:none; }
}


/* ---------- Vertical DDC pathway (Academy page) ---------- */
.ddc-path {
  max-width: 760px; margin: 0 auto; position: relative;
  padding: 16px 0;
}
.ddc-path::before {
  content:""; position:absolute; left:50%; top:48px; bottom:48px;
  width:2px; background: linear-gradient(180deg, var(--gold) 0%, var(--green) 50%, var(--gold) 100%);
  transform: translateX(-50%); opacity:.45;
}
.ddc-step {
  position: relative; background: var(--white);
  border: 1px solid rgba(184,152,76,.32);
  border-radius: var(--radius);
  padding: 34px 36px 30px;
  margin: 0 auto 18px;
  max-width: 620px;
  box-shadow: var(--shadow-sm);
  z-index: 2;
}
.ddc-step::before {
  content: attr(data-step);
  position: absolute; top: -16px; left: 36px;
  font-family: var(--font-ui); font-size: .72rem; letter-spacing: .22em;
  font-weight: 700; text-transform: uppercase;
  color: var(--gold);
  background: var(--cream); padding: 4px 12px; border: 1px solid rgba(184,152,76,.45);
  border-radius: 50px;
}
.ddc-step h3 { font-size: 1.7rem; margin-bottom: 10px; color: var(--green-deep); }
.ddc-step p { color: var(--ink-soft); font-size: 1.02rem; }
.ddc-arrow {
  display: block; width: 32px; height: 32px; margin: 0 auto 18px;
  position: relative; z-index: 1;
  color: var(--gold);
}
.ddc-arrow svg { width: 100%; height: 100%; }

/* Last step has no trailing line tail */
.ddc-path .ddc-step:last-of-type { margin-bottom: 0; }

@media (max-width: 720px) {
  .ddc-path::before { left: 28px; }
  .ddc-step { padding: 30px 26px 26px; }
  .ddc-step::before { left: 24px; }
  .ddc-arrow { margin-left: 12px; margin-right: auto; }
}


/* ---------- Ecosystem cards: Book | Academy | Kairos hierarchy ---------- */
.eco-grid {
  display: grid; grid-template-columns: 1fr 1.15fr 1fr; gap: 28px;
  align-items: stretch;
}
@media (max-width: 900px) { .eco-grid { grid-template-columns: 1fr; } }

.eco-book {
  background: var(--white);
  border: 1px solid rgba(184,152,76,.3);
}
.eco-book .tag { color: var(--gold); }

/* ACADEMY is the visual center of gravity — primary green, slightly elevated */
.eco-academy.primary {
  background: linear-gradient(165deg, var(--green) 0%, var(--green-deep) 100%);
  color: var(--cream);
  border: 1px solid var(--green-deep);
  transform: scale(1.025);
  box-shadow: 0 24px 48px rgba(23,46,10,.18), 0 8px 18px rgba(23,46,10,.10);
  position: relative;
}
.eco-academy.primary::before {
  content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background: linear-gradient(90deg, var(--gold-soft), var(--gold), var(--gold-soft));
  border-top-left-radius: var(--radius); border-top-right-radius: var(--radius);
}
.eco-academy.primary h3 { color: var(--cream); }
.eco-academy.primary .tag { color: var(--gold-soft); }
.eco-academy.primary p { color: rgba(254,248,224,.88); }
.eco-academy.primary .card-link { color: var(--gold-soft); }
.eco-academy.primary:hover { transform: scale(1.025) translateY(-5px); }

/* KAIROS — lighter premium tone, soft ivory with elegant outline */
.eco-kairos {
  background: #FBF7E8;
  border: 1px solid rgba(184,152,76,.55);
  position: relative;
}
.eco-kairos::before {
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  border-top-left-radius: var(--radius); border-top-right-radius: var(--radius);
}
.eco-kairos .tag {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--gold);
}
.eco-kairos .tag::after {
  content: ""; display:inline-block; width:5px; height:5px; border-radius:50%;
  background: var(--gold); box-shadow: 0 0 0 3px rgba(184,152,76,.18);
}

/* ---------- Authority stack on About page ---------- */
.authority-stack {
  list-style: none; padding: 0; margin: 16px 0 0;
  display: flex; flex-direction: column; gap: 8px;
  text-align: left;
}
.authority-stack li {
  font-family: var(--font-ui);
  font-size: .85rem;
  color: var(--green-deep);
  line-height: 1.45;
  padding-left: 18px;
  position: relative;
}
.authority-stack li::before {
  content:""; position:absolute; left:0; top:.6em;
  width:8px; height:1.5px; background: var(--gold);
}

/* ---------- Footer logo: inverted version for dark background ---------- */
.site-footer .footer-brand img {
  height: 70px; width: 70px;
  border-radius: 50%;
  background: transparent;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.3));
}
.site-footer .footer-brand .fname {
  font-size: 1.6rem;
}