/* =====================================================================
   Every Day, Say Gay! — hand-built static site
   An A Great Idea LGBTQ+ visibility campaign, with the GSA Network of NC.
   Brand: Magenta #C92EA5 + Purple #8224E3 (+ pride multicolor)
   Type: Poppins (display) + Roboto (body) — Google Fonts
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600;700;800;900&family=Roboto:wght@400;500;700&display=swap');

:root {
  --magenta:#C92EA5; --purple:#8224E3; --hotpink:#F427D2; --blue:#348BE2; --green:#8ECE40; --gold:#AF6A1A;
  --ink:#181818; --muted:#5c6672; --slate:#758696; --border:#E7E1EC; --paper:#FAFAFA; --white:#fff;
  --display:'Poppins',-apple-system,BlinkMacSystemFont,sans-serif;
  --body:'Roboto',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --grad:linear-gradient(120deg,#8224E3 0%,#C92EA5 55%,#F427D2 100%);
  --shadow-md:0 6px 20px rgba(130,36,227,.14);
  --shadow-lg:0 16px 40px rgba(130,36,227,.22);
  --wrap:1140px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:var(--body); font-size:17px; line-height:1.65; color:var(--ink); background:var(--white); -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:var(--purple); }
h1,h2,h3,h4 { font-family:var(--display); font-weight:800; line-height:1.05; margin:0 0 .5em; letter-spacing:-.01em; }
.wrap { max-width:var(--wrap); margin:0 auto; padding:0 24px; }

/* animated pride bar */
.pride-bar { height:7px; border:0; margin:0; background:linear-gradient(90deg,#E30303,#F6DC1E,#8ECE40,#348BE2,#8224E3,#F427D2,#E30303); background-size:200% 100%; animation:pride-slide 20s linear infinite; }
@keyframes pride-slide { from{background-position:0 0;} to{background-position:-200% 0;} }
@media (prefers-reduced-motion:reduce){ .pride-bar{animation:none;} }

/* Buttons */
.btn { display:inline-flex; align-items:center; gap:.5em; font-family:var(--display); font-weight:700; font-size:16px; padding:14px 28px; border-radius:999px; text-decoration:none; cursor:pointer; border:3px solid transparent; transition:transform .15s ease, box-shadow .15s ease, background .15s ease; }
.btn:hover { transform:translateY(-3px) rotate(-1deg); }
.btn--primary { background:var(--hotpink); color:#fff; box-shadow:var(--shadow-md); }
.btn--primary:hover { background:#e01ebf; box-shadow:var(--shadow-lg); }
.btn--purple { background:var(--purple); color:#fff; }
.btn--purple:hover { background:#6c17c9; }
.btn--ghost { background:transparent; color:#fff; border-color:rgba(255,255,255,.85); }
.btn--ghost:hover { background:rgba(255,255,255,.16); }
.btn--dark { background:var(--ink); color:#fff; }
.btn--dark:hover { background:#000; }

/* Header */
.site-header { position:sticky; top:0; z-index:50; background:rgba(255,255,255,.95); backdrop-filter:saturate(180%) blur(10px); border-bottom:1px solid var(--border); }
.site-header .wrap { display:flex; align-items:center; justify-content:space-between; height:76px; gap:16px; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.brand img { height:44px; width:auto; }
.brand span { font-family:var(--display); font-weight:900; font-size:18px; color:var(--ink); line-height:1; letter-spacing:-.02em; }
.site-header .btn { padding:10px 22px; font-size:15px; }

/* Hero */
.hero { position:relative; overflow:hidden; color:#fff; background:var(--grad); padding:96px 0 108px; }
.hero__bubbles { position:absolute; inset:0; opacity:.14; background:
   radial-gradient(circle at 12% 22%, #fff 0 2px, transparent 3px),
   radial-gradient(circle at 82% 30%, #fff 0 2px, transparent 3px),
   radial-gradient(circle at 65% 78%, #fff 0 2px, transparent 3px); }
.hero__inner { position:relative; display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:center; }
.hero__eyebrow { display:inline-block; font-family:var(--display); font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:13px; background:rgba(255,255,255,.16); padding:8px 16px; border-radius:999px; margin-bottom:22px; }
.hero h1 { font-size:clamp(44px,6.6vw,84px); font-weight:900; line-height:.96; margin-bottom:.32em; text-shadow:0 3px 24px rgba(0,0,0,.18); }
.hero h1 .pop { color:var(--green); }
.hero__sub { font-size:clamp(18px,2.2vw,22px); font-weight:400; max-width:540px; margin:0 0 30px; color:rgba(255,255,255,.96); }
.hero__cta { display:flex; gap:14px; flex-wrap:wrap; }
.hero__mark { justify-self:center; }
.hero__mark img { width:min(42vw,420px); filter:drop-shadow(0 14px 30px rgba(0,0,0,.28)); animation:bob 5s ease-in-out infinite; }
@keyframes bob { 0%,100%{transform:translateY(0) rotate(-2deg);} 50%{transform:translateY(-12px) rotate(2deg);} }

/* Sections */
.section { padding:88px 0; }
.section--paper { background:var(--paper); }
.section--tint { background:linear-gradient(180deg,#fdf3fb 0%, #f7edff 100%); }
.eyebrow { font-family:var(--display); font-weight:700; letter-spacing:.15em; text-transform:uppercase; font-size:13px; color:var(--magenta); margin:0 0 14px; }
.section h2 { font-size:clamp(30px,4.4vw,48px); max-width:20ch; }
.lede { font-size:20px; color:var(--muted); max-width:60ch; }

/* About split */
.about { display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:center; }
.about__media { position:relative; }
.about__media img { width:100%; border-radius:22px; box-shadow:var(--shadow-lg); aspect-ratio:4/3; object-fit:cover; }
.about__media .bubble { position:absolute; right:-18px; bottom:-22px; width:150px; transform:rotate(6deg); }
.about p { font-size:18px; color:#333; }
.about .partners { display:flex; align-items:center; gap:20px; margin-top:22px; flex-wrap:wrap; }
.about .partners img { height:52px; width:auto; }

/* Action cards */
.actions { margin-top:44px; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.action { background:#fff; border:2px solid var(--border); border-radius:20px; padding:28px 24px; box-shadow:var(--shadow-md); transition:transform .18s ease, box-shadow .18s ease; }
.action:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
.action__n { width:46px; height:46px; border-radius:14px; display:grid; place-items:center; font-family:var(--display); font-weight:800; color:#fff; font-size:20px; margin-bottom:16px; }
.action:nth-child(1) .action__n{ background:var(--hotpink);} .action:nth-child(2) .action__n{ background:var(--blue);}
.action:nth-child(3) .action__n{ background:var(--green);} .action:nth-child(4) .action__n{ background:var(--purple);}
.action h3 { font-size:19px; font-weight:800; margin:0 0 8px; }
.action p { margin:0; color:var(--muted); font-size:15.5px; line-height:1.55; }

/* GSA section (dark) */
.gsa { background:var(--ink); color:#fff; }
.gsa__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin:44px 0 40px; }
.gsa__card { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:18px; padding:28px; }
.gsa__card h3 { color:#fff; font-size:20px; margin:0 0 8px; }
.gsa__card p { margin:0; color:rgba(255,255,255,.78); font-size:15.5px; }
.gsa__cta { display:flex; align-items:center; gap:24px; flex-wrap:wrap; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:20px; padding:28px 32px; }
.gsa__cta img { height:56px; width:auto; background:#fff; border-radius:10px; padding:8px 12px; }
.gsa__cta .t { flex:1; min-width:240px; }
.gsa__cta h3 { color:#fff; margin:0 0 4px; font-size:20px; }
.gsa__cta p { margin:0; color:rgba(255,255,255,.78); }

/* Events gallery */
.gallery { margin-top:44px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.gcard { position:relative; border-radius:18px; overflow:hidden; box-shadow:var(--shadow-md); aspect-ratio:4/3; }
.gcard img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.gcard:hover img { transform:scale(1.06); }
.gcard figcaption { position:absolute; left:0; right:0; bottom:0; padding:26px 18px 14px; color:#fff; font-family:var(--display); font-weight:700; font-size:16px; background:linear-gradient(180deg, transparent, rgba(24,10,30,.82)); }

/* Newsletter / speak out */
.speak { background:var(--grad); color:#fff; text-align:center; }
.speak h2 { color:#fff; margin-bottom:10px; }
.speak .lede { color:rgba(255,255,255,.94); margin:0 auto 26px; }
.signup { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; max-width:520px; margin:0 auto; }
.signup input[type=email] { flex:1; min-width:220px; font-family:var(--body); font-size:16px; padding:15px 18px; border-radius:999px; border:0; }
.signup .btn--primary { background:var(--ink); }
.signup .btn--primary:hover { background:#000; }
.speak__note { font-size:14px; color:rgba(255,255,255,.8); margin-top:14px; }

/* Footer */
.site-footer { background:#140a1c; color:rgba(255,255,255,.72); padding:56px 0 40px; }
.site-footer .wrap { display:grid; grid-template-columns:1fr auto; gap:30px; align-items:start; }
.site-footer .fmark img { height:34px; width:auto; margin-bottom:14px; }
.site-footer .attrib { font-size:14.5px; line-height:1.7; max-width:52ch; }
.site-footer .attrib a { color:#fff; font-weight:600; }
.social { display:flex; gap:12px; }
.social a { width:40px; height:40px; display:grid; place-items:center; border-radius:999px; background:rgba(255,255,255,.10); color:#fff; transition:background .15s ease; }
.social a:hover { background:var(--hotpink); }
.social svg { width:18px; height:18px; fill:currentColor; }
.copyright { grid-column:1/-1; border-top:1px solid rgba(255,255,255,.14); margin-top:12px; padding-top:22px; font-size:13px; color:rgba(255,255,255,.55); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }

/* Reveal */
.reveal { transition:opacity .6s ease, transform .6s ease; }
.reveal-on .reveal { opacity:0; transform:translateY(20px); }
.reveal-on .reveal.in { opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .reveal-on .reveal{opacity:1; transform:none;} }

/* Responsive */
@media (max-width:900px){
  .hero__inner{grid-template-columns:1fr; gap:28px;} .hero__mark{order:-1;} .hero__mark img{width:min(60vw,300px);}
  .about{grid-template-columns:1fr; gap:30px;} .about__media{order:-1;}
  .actions{grid-template-columns:1fr 1fr;} .gsa__grid{grid-template-columns:1fr;} .gallery{grid-template-columns:1fr 1fr;}
  .site-footer .wrap{grid-template-columns:1fr;}
}
@media (max-width:560px){ .actions{grid-template-columns:1fr;} .gallery{grid-template-columns:1fr;} .brand span{display:none;} }
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} .btn:hover{transform:none;} .hero__mark img{animation:none;} }