/* =====================================================================
   Smart Space — Theme (2026 refresh)
   Refined editorial / architectural. Mukta + Open Sans. #00EF71 accent.
   Single shared stylesheet for all pages.
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Mukta:wght@400;500;600;700;800&family=Open+Sans:wght@400;500;600;700&display=swap');

:root{
  --green:#00EF71;
  --green-deep:#00b957;
  --green-ink:#00733d;      /* accessible green for text on light bg */
  --ink:#141719;            /* near-black charcoal */
  --ink-2:#1c2124;          /* panel charcoal */
  --ink-soft:#4a5157;
  --paper:#f6f4f0;          /* warm concrete paper */
  --concrete:#e9e5de;
  --line:#dcd7ce;
  --line-dark:#2a2f33;
  --white:#fff;
  --radius:3px;
  --wrap:1200px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Open Sans",sans-serif;color:var(--ink);background:var(--paper);line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5{font-family:"Mukta",sans-serif;font-weight:700;line-height:1.1;letter-spacing:-.02em}
img{max-width:100%}
a{color:inherit;text-decoration:none}
p{margin-bottom:1rem}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
.label{font-family:"Mukta",sans-serif;font-weight:600;font-size:.75rem;letter-spacing:.22em;text-transform:uppercase}

/* Utility carryovers from the old markup */
.center-text{text-align:center}
.light-text{color:var(--white)}
.italic{font-style:italic}
.mt-45{margin-top:45px}
.padding-bottom{padding-bottom:64px}
.content-width{max-width:820px;margin-left:auto;margin-right:auto}
.desktop-only{display:block}
.mobile-only{display:none}
.after-trapezoid{display:none} /* legacy spacer no longer needed */

/* ---------------------------------------------------------------------
   BUTTONS
   --------------------------------------------------------------------- */
.btn,.primary-button,.secondary-button,.donate-button,input[type="submit"],.give-submit{
  display:inline-block;background:var(--green);color:var(--ink)!important;
  padding:13px 24px;border-radius:var(--radius);font-family:"Mukta",sans-serif;
  font-weight:700;font-size:.92rem;line-height:1;border:1px solid var(--green);
  cursor:pointer;transition:.2s;text-align:center;letter-spacing:.01em}
.btn:hover,.primary-button:hover,.secondary-button:hover,.donate-button:hover,
input[type="submit"]:hover,.give-submit:hover{
  background:var(--ink);color:var(--white)!important;border-color:var(--ink)}
.btn-dark{background:var(--ink);color:var(--white)!important;border-color:var(--ink)}
.btn-dark:hover{background:var(--green);color:var(--ink)!important;border-color:var(--green)}
.btn-outline{background:transparent;color:var(--ink)!important;border-color:var(--ink)}
.btn-outline:hover{background:var(--ink);color:var(--white)!important;border-color:var(--ink)}
.btn-outline-ink{background:transparent;color:var(--ink)!important;border-color:var(--ink)}
.btn-outline-ink:hover{background:var(--ink);color:var(--white)!important;border-color:var(--ink)}

/* ---------------------------------------------------------------------
   NAV  (uses existing DOM: #mainLogo, #hamburger-menu, .menu > ul)
   --------------------------------------------------------------------- */
header{position:relative}
nav{position:sticky;top:0;z-index:100;background:var(--ink);border-bottom:1px solid var(--line-dark);
  display:flex;align-items:center;justify-content:space-between;
  height:78px;padding:0 32px;gap:24px}
#mainLogo{flex:0 0 auto;line-height:0}
#mainLogo img{height:26px;width:auto}
.menu{margin-left:auto}
.menu ul{list-style:none;display:flex;align-items:center;gap:28px;margin:0;padding:0}
.menu ul li{margin:0}
.menu ul li a{font-family:"Mukta",sans-serif;font-weight:600;font-size:.95rem;color:#cfd3d6;transition:color .2s;white-space:nowrap}
.menu ul li a:hover{color:var(--white)}
/* Action links: Sign Up (3rd) + Book A Room (4th) -> green pills pushed to the far right */
.menu ul li:nth-child(3),.menu ul li:nth-child(4){order:1}
.menu ul li:nth-child(3){margin-left:16px}
.menu ul li:nth-child(3) a,
.menu ul li:nth-child(4) a{
  background:var(--green);color:var(--ink);padding:10px 16px;border-radius:var(--radius);font-weight:700}
.menu ul li:nth-child(3) a:hover,
.menu ul li:nth-child(4) a:hover{background:var(--white);color:var(--ink)}
#hamburger-menu{display:none;flex:0 0 auto;cursor:pointer;width:34px;height:28px}
#hamburger-menu svg{width:34px;height:28px}
#hamburger-menu svg rect{fill:var(--white);transition:fill .2s}
#hamburger-menu:hover svg rect{fill:var(--green)}

/* ---------------------------------------------------------------------
   HERO (homepage)
   --------------------------------------------------------------------- */
.hero{padding:92px 0 76px}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.hero .label{color:var(--green-ink);margin-bottom:22px}
.hero h1{font-size:clamp(2.9rem,5.6vw,4.8rem);font-weight:800}
.hero h1 .u{color:var(--ink);box-shadow:inset 0 -.16em 0 var(--green)}
.hero p.lead{font-size:1.15rem;color:var(--ink-soft);margin:26px 0 34px;max-width:36ch}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}
.hero-media{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5;box-shadow:0 30px 60px -30px rgba(20,23,25,.5)}
.hero-media img{width:100%;height:100%;object-fit:cover;display:block}
.hero-media .tag{position:absolute;left:18px;bottom:18px;background:var(--ink);color:var(--white);padding:9px 15px;border-radius:var(--radius);letter-spacing:.14em}
.hero-media .tag b{color:var(--green)}

/* STAT STRIP */
.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--concrete)}
.stats .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding-left:0;padding-right:0}
.stat{padding:34px 24px;border-right:1px solid var(--line)}
.stat:last-child{border-right:none}
.stat .num{font-family:"Mukta";font-size:2rem;font-weight:800;line-height:1.05}
.stat .lbl{color:var(--ink-soft);font-size:.9rem;margin-top:6px}

/* SECTION HEADS */
.section{padding:96px 0}
.section-tight{padding:72px 0}
.sec-head{max-width:640px;margin-bottom:52px}
.sec-head .label{color:var(--green-ink);margin-bottom:16px}
.sec-head h2{font-size:clamp(2.1rem,3.8vw,3.1rem)}
.sec-head p{color:var(--ink-soft);margin-top:16px;font-size:1.08rem}
.bg-white{background:var(--white)}

/* TWO-COLUMN PROSE + IMAGE */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.two-col .prose .label{color:var(--green-ink);margin-bottom:16px;display:block}
.two-col .prose h2{font-size:clamp(2rem,3.6vw,2.8rem);margin-bottom:18px}
.two-col .prose p{color:var(--ink-soft);margin-bottom:16px}
.two-col .media-img{border-radius:var(--radius);overflow:hidden;aspect-ratio:5/4;box-shadow:0 24px 48px -30px rgba(20,23,25,.45)}
.two-col .media-img img{width:100%;height:100%;object-fit:cover;display:block}
.two-col.flip .media-img{order:-1}
@media(max-width:960px){.two-col{grid-template-columns:1fr;gap:32px}.two-col.flip .media-img{order:0}}

/* MEMBERSHIP CARDS (reuses feat styling but with body copy + link) */
.member-note{text-align:center;margin-top:28px;color:var(--ink-soft)}
.member-note a{color:var(--green-ink);font-weight:700}

/* PRICE / SPONSORSHIP TABLES */
.price-table{width:100%;max-width:600px;margin:8px auto 0;border-collapse:collapse;text-align:left;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.price-table thead th{font-family:"Mukta",sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;color:var(--ink-soft);padding:16px 20px;border-bottom:2px solid var(--ink);background:var(--paper)}
.price-table thead th:last-child{text-align:right}
.price-table td{padding:15px 20px;border-bottom:1px solid var(--line)}
.price-table tbody tr:last-child td{border-bottom:none}
.price-table tbody tr:hover{background:var(--paper)}
.price-table .tier{font-family:"Mukta",sans-serif;font-weight:700;font-size:1.02rem}
.price-table .price{text-align:right;font-family:"Mukta",sans-serif;font-weight:800;font-size:1.1rem;white-space:nowrap}
.table-note{max-width:600px;margin:12px auto 0;font-size:.82rem;color:var(--ink-soft)}
.cta-inline{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:26px}

/* BENEFITS MATRIX */
.table-scroll{overflow-x:auto;max-width:860px;margin:8px auto 0}
.benefit-table{width:100%;min-width:560px;border-collapse:collapse;text-align:left;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.benefit-table thead th{font-family:"Mukta",sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;color:var(--ink-soft);padding:14px 12px;background:var(--paper);border-bottom:2px solid var(--ink);text-align:center}
.benefit-table thead th:first-child{text-align:left}
.benefit-table td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:center;color:var(--ink-soft)}
.benefit-table td:first-child{text-align:left;font-weight:600;color:var(--ink)}
.benefit-table tbody tr:last-child td{border-bottom:none}
.benefit-table tbody tr:hover{background:var(--paper)}
.benefit-table .yes{color:var(--green-ink);font-weight:800;font-size:1.05rem}
.benefit-table .num{color:var(--green-ink);font-weight:800}
.benefit-table .no{color:#c9c3b8}

/* FEATURE GRID */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.feat{background:var(--white);padding:38px 32px;transition:.25s}
.feat:hover{background:var(--paper)}
.feat .idx{font-family:"Mukta";font-weight:700;color:var(--green-ink);font-size:.9rem;letter-spacing:.1em}
.feat h3{font-size:1.35rem;margin:16px 0 10px}
.feat p{color:var(--ink-soft);font-size:.96rem;margin:0}

/* SPLIT (studio) */
.split .wrap{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;border:1px solid var(--line);padding:0}
.split .media{min-height:460px;background-size:cover;background-position:center}
.split .body{padding:64px 56px;background:var(--ink);color:var(--paper);display:flex;flex-direction:column;justify-content:center}
.split .body .label{color:var(--green)}
.split .body h2{color:var(--white);font-size:2.5rem;margin:16px 0 18px}
.split .body p{color:#c9c9c9;margin-bottom:28px}

/* QUOTE */
.quote{background:var(--ink);color:var(--paper);text-align:center;padding:96px 0}
.quote .wrap{max-width:900px}
.quote .mark{font-family:"Mukta";font-weight:800;font-size:4rem;color:var(--green);line-height:.6}
.quote blockquote{font-family:"Mukta";font-weight:500;font-size:clamp(1.5rem,2.8vw,2.2rem);line-height:1.32;margin:18px 0 28px;letter-spacing:-.01em}
.quote cite{font-style:normal;color:#b7b7b7;font-size:.95rem}
.quote cite b{color:var(--white);display:block;font-size:1.05rem;margin-bottom:2px}

/* CTA (two-column) */
.cta{background:var(--green);color:var(--ink);padding:88px 0}
.cta .wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center}
.cta h2{font-size:clamp(2.1rem,4vw,3.2rem);margin-bottom:14px}
.cta p{max-width:48ch;font-size:1.12rem;color:#0f2a1c;margin:0}
.cta-actions{display:flex;flex-direction:column;gap:14px;justify-self:end;min-width:220px}

/* ---------------------------------------------------------------------
   SUBPAGE HEADER (legacy .homepage-header / .subpage)
   --------------------------------------------------------------------- */
.homepage-header{background:var(--ink);color:var(--white);text-align:center;
  display:flex;align-items:center;justify-content:center;min-height:220px;padding:48px 24px}
.homepage-header .logo-container{margin:0 auto}
.homepage-header .logo-container img{max-height:96px;width:auto;margin:0 auto}
.homepage-header h1{color:var(--white);font-size:clamp(2.2rem,4.5vw,3.4rem);margin:0}
.homepage-header .blog-heading{margin:0}
.homepage-header.subpage{min-height:220px;padding:48px 24px}

/* WHITE / CONTENT SECTIONS (legacy) */
.white-section{background:transparent;padding:56px 32px;max-width:860px;margin:0 auto;text-align:center}
.white-section h2{font-size:clamp(1.9rem,3.4vw,2.6rem);margin-bottom:18px}
.white-section p{color:var(--ink-soft);max-width:62ch;margin:0 auto 14px}
.white-section img{display:block;margin:8px auto 0;border-radius:var(--radius)}
.white-section .btn,.white-section .primary-button,.white-section .secondary-button,.white-section .donate-button{margin-top:26px}
.subpage-white-section{padding-top:64px}
.sponsorship-section p{margin-bottom:8px}

/* PHOTO HERO bands (legacy) */
.photo-hero{min-height:340px;background-size:cover;background-position:center;position:relative;
  background-image:linear-gradient(rgba(20,23,25,.45),rgba(20,23,25,.45)),url('../images/7-9-21/collab-space.jpg')}
.podcast-hero{background-image:linear-gradient(rgba(20,23,25,.5),rgba(20,23,25,.5)),url('../images/7-9-21/podcast-room-2.jpg')}
.studio-hero{background-image:linear-gradient(rgba(20,23,25,.5),rgba(20,23,25,.5)),url('../images/7-9-21/rode-podcast-board.jpg')}
.sponsorship-hero{background-image:linear-gradient(rgba(20,23,25,.5),rgba(20,23,25,.5)),url('../images/7-9-21/conference-room-small.jpg')}

/* BOARD MEMBERS */
.smart-board-wrap{max-width:var(--wrap);margin:36px auto 0;padding:0 32px;display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.board-member{display:flex;gap:20px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.board-member img{width:120px;height:120px;object-fit:cover;border-radius:50%;flex:0 0 auto}
.board-details h3{font-size:1.2rem;margin-bottom:6px}
.board-details p{color:var(--ink-soft);font-size:.95rem;margin-bottom:8px}
.board-details a{color:var(--green-ink);font-weight:600}

/* PODCAST BLOCKS */
.podcast-block-wrap{max-width:var(--wrap);margin:0 auto;padding:72px 32px;text-align:center}
.podcast-blocks{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin:34px 0 24px}
.podcast-blocks a{display:block;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--white);transition:.25s}
.podcast-blocks a:hover{transform:translateY(-4px);box-shadow:0 20px 34px -24px rgba(20,23,25,.4)}
.podcast-block-wrap>p{max-width:70ch;margin:18px auto 0}
.podcast-block-wrap p em{color:var(--ink-soft);font-size:.85rem}

/* SPONSOR LOGO ROLL (light band, grayscale) */
.sponsors-section,.featured-sponsor-roll{text-align:center}
.sponsors-section{padding:72px 32px}
.featured-sponsor-roll{display:flex;gap:56px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:28px;max-width:var(--wrap);margin-left:auto;margin-right:auto}
.featured-sponsor-roll img{height:48px;filter:grayscale(1);opacity:.78;transition:.25s}
.featured-sponsor-roll a:hover img{opacity:1}

/* HOMEPAGE sponsors variant */
.sponsors{background:var(--paper);text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:72px 0}
.sponsors .label{color:var(--green-ink)}
.sponsor-row{display:flex;gap:64px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:34px}
.sponsor-row img{height:48px;filter:grayscale(1);opacity:.78;transition:.25s}
.sponsor-row a:hover img{opacity:1}

/* CALENDAR */
.calendar-wrap{max-width:var(--wrap);margin:0 auto;padding:56px 32px;text-align:center}
.calendar-wrap iframe{border:1px solid var(--line)!important;border-radius:var(--radius);max-width:100%}
.calendar-wrap .secondary-button{margin-top:24px}

/* ---------------------------------------------------------------------
   BLOG ROLL + CARDS
   --------------------------------------------------------------------- */
.blog-roll{max-width:var(--wrap);margin:0 auto;padding:96px 32px}
.blog-roll h2{font-size:clamp(2rem,3.6vw,2.8rem);margin-bottom:8px;text-align:center}
.blog-roll-wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:40px}
.blog-article{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--white);transition:.25s;display:block}
.blog-article:hover{transform:translateY(-4px);box-shadow:0 24px 40px -28px rgba(20,23,25,.45)}
.blog-article img{width:100%;height:200px;object-fit:cover;display:block}
.blog-preview{padding:24px}
.blog-preview .blog-title{font-size:1.2rem;margin-bottom:10px;line-height:1.2}
.blog-preview p{color:var(--ink-soft);font-size:.92rem;margin:0}
.view-more{text-align:center;margin-top:40px}
.view-more a{font-family:"Mukta";font-weight:700;color:var(--green-ink)}
.view-more a:hover{color:var(--ink)}

/* ---------------------------------------------------------------------
   BLOG POST PAGE
   --------------------------------------------------------------------- */
.blog-page-wrap{max-width:860px;margin:0 auto;padding:56px 24px 80px}
.blog-page-header{border-radius:var(--radius);overflow:hidden;margin-bottom:32px}
.blog-page-header img{width:100%;max-height:440px;object-fit:cover;display:block}
.blog-page-wrap .blog-title{font-size:clamp(2rem,4vw,3rem);line-height:1.08;margin-bottom:10px}
.blog-date{color:var(--green-ink);font-family:"Mukta";font-weight:600;letter-spacing:.04em;margin-bottom:28px}
.blog-page-wrap h1,.blog-page-wrap h2{font-size:1.9rem;margin:32px 0 12px}
.blog-page-wrap h3{font-size:1.35rem;margin:24px 0 8px}
.blog-page-wrap p{color:var(--ink-soft);margin-bottom:16px}
.blog-page-wrap img{border-radius:var(--radius)}
.blog-inner-image-wrap{width:100%;height:auto}
.row{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center;margin:36px 0}
.column{min-width:0}
.column.dark-bg{background:var(--ink);border-radius:var(--radius);padding:28px;display:flex;align-items:center;justify-content:center}
@media(min-width:721px){.order1{order:1}.order2{order:2}}

/* ---------------------------------------------------------------------
   FOOTER (existing DOM: newsletter-wrap, contact-wrap, #footer-bottom)
   --------------------------------------------------------------------- */
footer{background:var(--ink);color:#b7b7b7}
.newsletter-wrap{border-bottom:1px solid var(--line-dark);padding:56px 32px}
.newsletter-inner{max-width:var(--wrap);margin:0 auto}
.newsletter-inner h2{color:var(--white);font-size:1.8rem;margin-bottom:20px}
#mc_embed_signup{max-width:640px}
.mc-field-group{margin-bottom:14px;display:flex;flex-direction:column;gap:6px}
.mc-field-group label{font-size:.85rem;color:#cfd3d6}
#mc_embed_signup input[type="text"],#mc_embed_signup input[type="email"]{
  background:var(--ink-2);border:1px solid var(--line-dark);color:var(--white);
  padding:12px 14px;border-radius:var(--radius);font-size:.95rem}
#mc_embed_signup input::placeholder{color:#6a7076}
.indicates-required{font-size:.75rem;color:#7f8489;margin-bottom:12px}
.asterisk{color:var(--green)}
.contact-wrap{max-width:var(--wrap);margin:0 auto;padding:56px 32px;display:grid;grid-template-columns:1fr 1.2fr;gap:48px}
.contact-info h2{color:var(--white);font-size:1.8rem;margin-bottom:16px}
.contact-info p{margin:0 0 4px}
.phone-email{margin-top:16px}
.phone-email a{color:var(--green);font-weight:600;display:inline-block;margin-bottom:6px}
.contact-form-wrap{min-width:0}
.contact-form-wrap iframe{width:100%;border:0;background:var(--white);border-radius:var(--radius)}
#footer-bottom{border-top:1px solid var(--line-dark);text-align:center;padding:22px 32px}
#footer-info{font-size:.82rem;color:#7f8489;margin:0}
#footer-info a{color:#b7b7b7}
#footer-info a:hover{color:var(--green)}

/* Particles testimonial (legacy homepage) — restyle as dark band if present */
.gray-trapezoid{background:var(--ink);color:var(--paper);text-align:center;padding:80px 24px}
.gray-trapezoid .trapezoid-content{max-width:820px;margin:16px auto 24px}

/* ---------------------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------------------- */
@media(max-width:960px){
  .hero .wrap,.split .wrap,.cta .wrap{grid-template-columns:1fr}
  .cta-actions{justify-self:start;min-width:0}
  .stats .wrap{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(2){border-right:none}
  .feat-grid,.blog-roll-wrap{grid-template-columns:repeat(2,1fr)}
  .podcast-blocks{grid-template-columns:repeat(2,1fr)}
  .smart-board-wrap{grid-template-columns:1fr}
  .split .media{min-height:280px}
}

@media(max-width:720px){
  .wrap,nav{padding-left:20px;padding-right:20px}
  .desktop-only{display:none}
  .mobile-only{display:block;height:34px!important}
  /* Mobile menu: hidden until hamburger toggles .open-menu */
  #hamburger-menu{display:block}
  .menu{position:absolute;top:78px;left:0;right:0;background:var(--ink);
    border-bottom:1px solid var(--line-dark);margin:0;
    max-height:0;overflow:hidden;transition:max-height .3s ease}
  .menu.open-menu{max-height:80vh}
  .menu ul{flex-direction:column;align-items:stretch;gap:0;padding:8px 0}
  .menu ul li{order:0!important;margin-left:0!important}
  .menu ul li a{display:block;padding:14px 24px;font-size:1.05rem;border-bottom:1px solid var(--line-dark)}
  .menu ul li:nth-child(3) a,.menu ul li:nth-child(4) a{
    background:transparent;color:var(--green);padding:14px 24px;border-radius:0}
  .menu ul li:nth-child(3) a:hover,.menu ul li:nth-child(4) a:hover{background:var(--ink-2);color:var(--green)}
  .hero{padding:56px 0 48px}
  .section,.quote,.cta{padding:56px 0}
  .feat-grid,.blog-roll-wrap,.podcast-blocks{grid-template-columns:1fr}
  .stats .wrap{grid-template-columns:1fr 1fr}
  .split .body{padding:44px 28px}
  .row{grid-template-columns:1fr;gap:20px}
  .board-member{flex-direction:column;text-align:center}
  .contact-wrap{grid-template-columns:1fr}
  .white-section,.blog-roll,.podcast-block-wrap,.sponsors-section,.calendar-wrap{padding-left:20px;padding-right:20px}
}
