/* ANGELIC FELLOWSHIP CLOUD — cosmic layer for the Houseless Initiative page (2026-10-07)
   Loaded after the page's own styles and center-law.css. Brings the homepage's header, type,
   glass cards, gold buttons and footer to this page. The starfield + nebula come from center-law.css. */
:root{
  --space-0:#05040f;--space-1:#0b0820;--space-2:#160d33;
  --gold-glow:rgba(242,211,140,.38);--gold-hair:rgba(242,211,140,.28);
  --white:#f8f6ff;--text:rgba(238,234,255,.88);--mute:rgba(222,216,250,.70);
  --teal:#5fe1cf;--glass:rgba(255,255,255,.055);--glass-edge:rgba(255,255,255,.13);
  --display:'Cinzel',Georgia,'Times New Roman',serif;
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
}
body{font-family:var(--sans);color:var(--text);font-weight:400}

/* header — identical to the homepage */
header.site{position:static;z-index:60;background:rgba(7,5,26,.72)!important;
  backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid rgba(255,255,255,.08)!important}
header.site .wrap{max-width:1080px;margin-inline:auto;padding-inline:clamp(20px,5.5vw,64px)}
header.site .bar{display:flex;flex-direction:column;align-items:center;gap:.55rem;padding-block:.8rem}
header.site .brand{display:flex;align-items:center;justify-content:center;gap:.65rem;border:0;text-decoration:none}
header.site .brand img{width:30px;height:30px;border-radius:50%;display:block;box-shadow:0 0 14px var(--gold-glow)}
header.site .brand span{font-family:var(--display);font-weight:600;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--white);white-space:nowrap}
header.site nav.site{display:flex;flex-wrap:wrap;justify-content:center;gap:.2rem 1.15rem}
header.site nav.site a{border:0;text-decoration:none;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-weight:500}
header.site nav.site a:hover,header.site nav.site a[aria-current=page]{color:#f2d38c!important;text-shadow:0 0 14px var(--gold-glow)!important}
@media(max-width:430px){header.site .brand span{font-size:.68rem;letter-spacing:.14em}
  header.site nav.site{gap:.15rem .8rem}header.site nav.site a{font-size:.64rem;letter-spacing:.12em}}
/* site header scrolls away here so the sticky section menu stays usable */
.secnav{top:0;z-index:55}

/* type */
.kicker,.part-label{color:var(--teal)!important;font-weight:600;letter-spacing:.34em}
.hero h1,h2.ptitle,.cta h2{font-family:var(--display);font-weight:600;color:var(--white)!important;letter-spacing:.05em;
  text-shadow:0 0 18px rgba(255,255,255,.35),0 0 46px var(--gold-glow),0 0 90px rgba(169,139,255,.35)!important}
.hero .sub{color:#f2d38c;text-shadow:0 1px 14px rgba(5,4,15,.95),0 0 2px rgba(5,4,15,.9)}
.hero .kicker{text-shadow:0 1px 12px rgba(5,4,15,.95),0 0 2px rgba(5,4,15,.9)}
/* phones: let the hero grow with its text so the top line is never clipped */
@media(max-width:700px){.hero{min-height:0}.hero .inner{padding-top:64px}}
.lede{color:var(--mute)}
.lede strong,.card p strong,.pitch strong{color:var(--white)}

/* glass cards, like the homepage */
.diagram,.engine,.room,.crew,.protocol,.phase,.tier,.note,.moneystrip,.hcol,.cta{
  background:var(--glass)!important;border:1px solid var(--glass-edge)!important;border-radius:22px!important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 20px 50px rgba(0,0,0,.35)}
.engine.n2,.hcol.true,.tier{border-color:rgba(242,211,140,.32)!important}
.note,.moneystrip{border-color:rgba(242,211,140,.30)!important}
.cta{background:radial-gradient(ellipse 70% 60% at 50% 0%,rgba(169,139,255,.16),transparent 70%),var(--glass)!important}
figure.ph{border-radius:22px;border-color:var(--glass-edge)}
figure.ph figcaption{background:rgba(11,8,32,.75)}
.timeline{border-left-color:var(--gold-hair)}
.titem::before{background:var(--space-0)}

/* buttons — gold primary + quiet outline, exactly the homepage's */
.btn{display:inline-block;border:0;border-radius:999px;padding:1.1em 2.9em;font-size:.86rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:#1a1230!important;
  background:linear-gradient(135deg,#fff3cf 0%,#f2d38c 45%,#d9a94e 100%)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.25) inset,0 0 30px rgba(242,211,140,.45),0 0 70px rgba(169,139,255,.35);
  transition:box-shadow .3s}
.btn:hover{box-shadow:0 0 0 1px rgba(255,255,255,.4) inset,0 0 44px rgba(242,211,140,.65),0 0 90px rgba(169,139,255,.45)}
.btn.ghost{background:rgba(255,255,255,.03)!important;color:#f2d38c!important;border:1px solid var(--gold-hair)!important;
  font-size:.76rem;padding:.9em 2.2em;box-shadow:none}
.btn.ghost:hover{border-color:#f2d38c!important;color:var(--white)!important;box-shadow:0 0 24px var(--gold-glow);background:rgba(242,211,140,.08)!important}
@media(max-width:430px){.btn{padding-inline:1.8em;letter-spacing:.14em}}

/* founding donors: let the sky show through */
#founding-donors{background:radial-gradient(ellipse 70% 40% at 50% 0%,rgba(169,139,255,.20),transparent 70%)!important;
  border-top:1px solid rgba(255,255,255,.08)!important}
#founding-donors a[href*="buy.stripe.com"]{max-width:100%}
@media(max-width:430px){#founding-donors a[href*="buy.stripe.com"]{min-width:0!important;width:100%;padding-inline:20px!important}}

/* footer — homepage style */
body > footer{border-top:1px solid rgba(255,255,255,.08)!important;padding-block:clamp(48px,6vw,80px)!important;
  background:linear-gradient(180deg,transparent,rgba(5,4,15,.6))}
.banner20{border-color:var(--gold-hair)!important;color:#f2d38c!important;font-family:var(--display);letter-spacing:.16em;
  text-shadow:0 0 18px var(--gold-glow);box-shadow:0 0 24px rgba(169,139,255,.18)}
body > footer p{color:var(--mute)}
.legal-links{margin-top:1rem;font-size:.8rem}
.legal-links a{color:var(--mute);text-decoration:none}
.legal-links a:hover{color:#f2d38c}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}