/* ═══════════════════════════════════════════════════════
   SOLISCOMM — Global Stylesheet v4
   Solar gold · Deep carbon · Warm cream
   ═══════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=Jost:wght@300;400;500&family=Barlow+Condensed:wght@500;600;700&display=swap');

:root {
  --carbon:      #0A0A06;
  --carbon-2:    #131308;
  --carbon-3:    #1C1C10;
  --char:        #282818;
  --dust:        #2A2620;
  --sand:        #A8936E;
  --cream:       #F2EBD9;
  --cream-2:     #E8DEC8;
  --gold:        #F2A020;
  --gold-2:      #C87D0A;
  --gold-pale:   rgba(242,160,32,0.08);
  --gold-line:   rgba(242,160,32,0.18);
  --white:       #FEFAF2;

  --f-serif: 'Cormorant Garamond', serif;
  --f-body:  'Jost', sans-serif;
  --f-cond:  'Barlow Condensed', sans-serif;
  --ease:    cubic-bezier(0.16,1,0.3,1);
  --nav-h:   52px;
  --max-w:   1300px;
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; background:var(--carbon); }
body { background:var(--carbon); color:var(--carbon); font-family:var(--f-body); font-weight:300; overflow-x:hidden; margin:0; padding-top:var(--nav-h); }
/* WordPress admin bar offset */
.admin-bar body { padding-top:calc(var(--nav-h) + 32px); }
.admin-bar #nav { top:32px; }
@media screen and (max-width:782px) { .admin-bar body { padding-top:calc(var(--nav-h) + 46px); } .admin-bar #nav { top:46px; } }

a { text-decoration:none; color:inherit; }
img { display:block; width:100%; height:100%; object-fit:cover; }
button { font-family:inherit; cursor:pointer; }
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline:2px solid var(--gold); outline-offset:2px;
}

/* ── Reveal animations ── */
.r, .rx { opacity:1; transform:none; }
.js-ready .r  { opacity:0; transform:translateY(24px); transition:opacity .85s var(--ease),transform .85s var(--ease); }
.js-ready .rx { opacity:0; transform:translateX(-32px); transition:opacity .85s var(--ease),transform .85s var(--ease); }
.js-ready .r.in,.js-ready .rx.in { opacity:1; transform:none; }
/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .js-ready .r, .js-ready .rx { opacity:1; transform:none; }
  .hero-orb, .mission-sun-orb, .hero-shaft { animation:none; }
}
.d1{transition-delay:.1s;} .d2{transition-delay:.2s;} .d3{transition-delay:.3s;} .d4{transition-delay:.4s;}

@keyframes rise { from{opacity:0;transform:translateY(16px);} to{opacity:1;transform:none;} }
@keyframes fadeIn { from{opacity:0;} to{opacity:1;} }
@keyframes glow { 0%,100%{opacity:.4;} 50%{opacity:1;} }

/* ══════════════════════════════════
   NAV
══════════════════════════════════ */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  height:var(--nav-h); display:flex; align-items:center;
  justify-content:space-between; padding:0 56px;
  background:var(--carbon);
  border-bottom:1px solid var(--gold-line);
}
#nav.scrolled {
  background:var(--carbon);
  border-bottom:1px solid var(--gold-line);
}
.nav-logo {
  font-family:var(--f-serif); font-size:1.8rem; font-weight:400;
  color:var(--white); letter-spacing:.02em; flex-shrink:0;
}
.nav-logo span { color:var(--gold); }
.nav-links { display:flex; list-style:none; gap:40px; }
.nav-links a {
  font-family:var(--f-cond); font-size:.72rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color:#ffffff; transition:color .2s; position:relative;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-3px; left:0;
  width:0; height:1px; background:var(--gold);
  transition:width .25s var(--ease);
}
.nav-links a:hover, .nav-links a.active { color:var(--gold); }
.nav-links a:hover::after, .nav-links a.active::after { width:100%; }
.nav-btn {
  font-family:var(--f-cond); font-size:.7rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  background:transparent; border:1px solid var(--gold);
  color:var(--gold); padding:9px 22px;
  transition:background .2s,color .2s;
}
.nav-btn:hover { background:var(--gold); color:var(--carbon); }

/* Burger */
.burger {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; padding:8px;
}
.burger span {
  display:block; width:22px; height:2px;
  background:var(--cream); transition:all .3s; transform-origin:center;
}
.burger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* Mobile nav */
.mob-nav {
  position:fixed; inset:0; background:var(--carbon-2); z-index:200;
  display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:0;
  transform:translateX(100%); transition:transform .4s var(--ease);
  padding:2rem;
}
.mob-nav.open { transform:none; }
.mob-close {
  position:absolute; top:20px; right:24px;
  background:none; border:none; color:var(--cream);
  font-size:2rem; opacity:.6; cursor:pointer;
  z-index:210; padding:8px; line-height:1;
}
.mob-close:hover { opacity:1; }
.mob-nav ul { list-style:none; width:100%; text-align:center; }
.mob-nav ul li { border-bottom:1px solid var(--gold-line); }
.mob-nav ul li:first-child { border-top:1px solid var(--gold-line); }
.mob-nav ul a {
  display:block; padding:1.1rem;
  font-family:var(--f-cond); font-size:.95rem; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase;
  color:var(--cream); transition:color .2s;
}
.mob-nav ul a:hover, .mob-nav ul a.active { color:var(--gold); }
.mob-cta {
  margin-top:2rem; padding:14px 40px;
  background:var(--gold); color:var(--carbon);
  font-family:var(--f-cond); font-size:.78rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; border:none;
}
.mob-backdrop {
  display:none; position:fixed; inset:0;
  background:rgba(0,0,0,.6); z-index:180; backdrop-filter:blur(2px);
}
.mob-backdrop.open { display:block; }

/* ══════════════════════════════════
   BUTTONS (shared)
══════════════════════════════════ */
.btn-gold {
  background:var(--gold); color:var(--carbon); border:none;
  font-family:var(--f-cond); font-size:.74rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  padding:15px 32px; transition:background .2s,transform .2s;
  display:inline-flex; align-items:center; gap:10px;
}
.btn-gold:hover { background:#FFB84D; transform:translateY(-2px); }
.btn-ghost-light {
  font-family:var(--f-cond); font-size:.7rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color:rgba(242,235,217,.65); border:none; border-bottom:1px solid rgba(242,235,217,.25);
  padding-bottom:3px; background:none; transition:color .2s,border-color .2s;
}
.btn-ghost-light:hover { color:var(--gold); border-color:var(--gold); }
.btn-ghost-dark {
  font-family:var(--f-cond); font-size:.7rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--dust); border:none; border-bottom:1px solid rgba(110,100,80,.3);
  padding-bottom:3px; background:none; transition:color .2s,border-color .2s;
}
.btn-ghost-dark:hover { color:var(--gold-2); border-color:var(--gold-2); }
.btn-outline-dark {
  background:none; color:var(--carbon); border:1px solid var(--carbon);
  font-family:var(--f-cond); font-size:.72rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  padding:13px 28px; transition:background .2s,color .2s;
}
.btn-outline-dark:hover { background:var(--carbon); color:var(--cream); }

/* ══════════════════════════════════
   PAGE HERO (inner pages)
══════════════════════════════════ */
.page-hero {
  position:relative; height:75vh; min-height:600px;
  display:flex; align-items:flex-end; overflow:hidden;
  background:var(--carbon);
}
.page-hero-bg {
  position:absolute; inset:0;
}
.page-hero-bg img { filter:brightness(1) saturate(.85); }
.page-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(105deg, rgba(10,10,6,.45) 0%, rgba(10,10,6,.2) 55%, rgba(10,10,6,.02) 100%);
}
.page-hero-content {
  position:relative; z-index:2;
  max-width:var(--max-w); margin:0 auto;
  padding:0 56px 88px;
  width:100%;
}
.page-hero-tag {
  font-family:var(--f-cond); font-size:.62rem; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:var(--gold);
  display:flex; align-items:center; gap:14px; margin-bottom:20px;
}
.page-hero-tag::before { content:''; display:block; width:28px; height:1px; background:var(--gold); }
.page-hero-h1 {
  font-family:var(--f-serif); font-weight:300;
  font-size:clamp(3rem,6vw,6rem); line-height:.95;
  color:#ffffff; letter-spacing:-.02em; max-width:800px;
}
.page-hero-h1 em { font-style:italic; color:var(--gold); }
.page-hero-sub {
  display:none;
}

/* ══════════════════════════════════
   SECTION COMPONENTS (shared)
══════════════════════════════════ */
.section-label {
  font-family:var(--f-cond); font-size:.64rem; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:var(--gold);
  display:flex; align-items:center; gap:12px; margin-bottom:20px;
}
.section-label::before { content:''; display:block; width:24px; height:1px; background:var(--gold); }
.section-label--dark { color:var(--gold-2); }
.section-label--dark::before { background:var(--gold-2); }

.section-h2-light {
  font-family:var(--f-serif); font-weight:300;
  font-size:clamp(2.4rem,4vw,4rem); line-height:1.05; color:var(--white);
}
.section-h2-light em { font-style:italic; color:var(--gold); }
.section-h2-dark {
  font-family:var(--f-serif); font-weight:400;
  font-size:clamp(2.4rem,4vw,4rem); line-height:1.05; color:var(--carbon);
}
.section-h2-dark em { font-style:italic; color:var(--gold-2); }

/* ══════════════════════════════════
   STATS ROW (output bar)
══════════════════════════════════ */
.output { background:var(--gold); }
.output-inner {
  display:grid; grid-template-columns:repeat(3,1fr);
  max-width:none;
}
.output-item {
  padding:24px 40px; border-right:1px solid rgba(10,10,6,.1);
  display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:center;
}
.output-item:last-child { border-right:none; }
.output-num {
  font-family:var(--f-serif); font-size:2.6rem; font-weight:300;
  color:var(--carbon); line-height:1;
}
.output-label {
  font-family:var(--f-cond); font-size:.62rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  color:rgba(10,10,6,.55); line-height:1.4;
}
.output-unit {
  font-family:var(--f-cond); font-size:.55rem; font-weight:600;
  letter-spacing:.12em; text-transform:uppercase;
  color:rgba(10,10,6,.35); margin-top:2px;
}

/* ══════════════════════════════════
   CTA BAND (full image)
══════════════════════════════════ */
.cta-band {
  position:relative; padding:100px 56px;
  background:var(--carbon-2); overflow:hidden; text-align:center;
}
.cta-band::before {
  content:'SC';
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  font-family:var(--f-serif); font-size:clamp(12rem,22vw,28rem); font-weight:600;
  color:transparent; -webkit-text-stroke:1px rgba(10,10,6,.05);
  pointer-events:none; user-select:none; white-space:nowrap; line-height:1;
}
.cta-band-inner { position:relative; z-index:2; }
.cta-band-eyebrow {
  font-family:var(--f-cond); font-size:.64rem; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:var(--gold-2);
  display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:20px;
}
.cta-band-eyebrow::before,.cta-band-eyebrow::after { content:''; display:block; width:36px; height:1px; background:var(--gold-2); }
.cta-band h2 {
  font-family:var(--f-serif); font-weight:300;
  font-size:clamp(2.8rem,5.5vw,6rem); line-height:.95;
  color:var(--carbon); margin-bottom:20px; letter-spacing:-.02em;
}
.cta-band h2 em { font-style:italic; color:var(--gold-2); }
.cta-band p {
  font-size:1rem; line-height:1.85; color:var(--dust);
  max-width:520px; margin:0 auto 40px;
}
.cta-band-note {
  font-family:var(--f-cond); font-size:.62rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase;
  color:rgba(10,10,6,.3); margin-top:16px;
  display:flex; align-items:center; justify-content:center; gap:8px;
}

/* Override for dark bg CTA variant */
.cta-band--dark { background:var(--carbon-2); }
.cta-band--dark::before { -webkit-text-stroke:1px rgba(242,235,217,.03); }
.cta-band--dark h2 { color:var(--white); }
.cta-band--dark h2 em { color:var(--gold); }
.cta-band--dark p { color:rgba(242,235,217,.55); }
.cta-band--dark .cta-band-eyebrow { color:var(--gold); }
.cta-band--dark .cta-band-eyebrow::before,
.cta-band--dark .cta-band-eyebrow::after { background:var(--gold); }
.cta-band--dark .cta-band-note { color:rgba(242,235,217,.75); }

/* ══════════════════════════════════
   FOOTER
══════════════════════════════════ */
footer {
  background:var(--carbon); border-top:1px solid rgba(242,235,217,.06);
  padding:60px 0 36px;
}
.footer-grid {
  max-width:var(--max-w); margin:0 auto; padding:0 56px;
  display:grid; grid-template-columns:2fr 1fr 1fr; gap:60px;
  padding-bottom:48px; border-bottom:1px solid rgba(242,235,217,.05);
}
.footer-logo {
  font-family:var(--f-serif); font-size:1.4rem; font-weight:400;
  color:var(--white); margin-bottom:16px; display:block;
}
.footer-logo span { color:var(--gold); }
.footer-brand p { font-size:.84rem; line-height:1.8; color:rgba(242,235,217,.75); max-width:280px; }
.footer-col h4 {
  font-family:var(--f-cond); font-size:.6rem; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold); margin-bottom:20px;
}
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.footer-col a { font-size:.84rem; color:rgba(242,235,217,.35); transition:color .2s; }
.footer-col a:hover { color:var(--gold); }
.footer-bottom {
  max-width:var(--max-w); margin:0 auto; padding:24px 56px 0;
  display:flex; justify-content:space-between; align-items:center;
}
.footer-bottom p { font-size:.74rem; color:rgba(242,235,217,.18); }

/* ══════════════════════════════════
   RESPONSIVE
══════════════════════════════════ */
@media(max-width:900px) {
  #nav { padding:0 24px; }
  .nav-links,.nav-btn { display:none; }
  .burger { display:flex; }

  .page-hero-content { padding:0 24px 56px; }
  .page-hero-h1 { font-size:clamp(2.4rem,8vw,4rem); }

  .output-inner { grid-template-columns:1fr 1fr; }
  .output-item { padding:16px 20px; gap:10px; }
  .output-num { font-size:2rem; }

  .cta-band { padding:72px 24px; }
  .cta-band::before { display:none; }

  .footer-grid { grid-template-columns:1fr; gap:32px; padding:0 24px 36px; }
  .footer-bottom { padding:20px 24px 0; flex-direction:column; gap:8px; text-align:center; }

}