/*
Theme Name: Center for Trans Futures
Theme URI: https://centerfortransfutures.org
Author: The Center for Trans Futures
Version: 1.0
Text Domain: ctf
*/

:root {
  --bg: #0b0f14;
  --surface: #111823;
  --text: #f2f5f7;
  --muted: #c8d1db;

  /* Trans pride accents */
  --trans-blue: #5bcffa;
  --trans-pink: #f5abb9;
  --focus: #ffd54a;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 100%;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: linear-gradient(180deg, var(--bg), #070a0d);
  color: var(--text);
  line-height: 1.6;
}

a {
  color: var(--text);
}

a:focus,
a:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}

header,
main,
footer {
  display: block;
}

.wrap {
  max-width: 1080px;
  margin: 0 auto;
  padding: clamp(24px, 5vw, 64px) 16px;
}

button,
a.button {
  min-height: 44px;
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.18);
  background: linear-gradient(
    135deg,
    rgba(91,207,250,0.25),
    rgba(245,171,185,0.22)
  );
  color: var(--text);
  font-weight: 600;
  text-decoration: none;
}

button:hover,
a.button:hover {
  transform: translateY(-1px);
}

@media (prefers-reduced-motion: reduce) {
  button:hover,
  a.button:hover {
    transform: none;
  }
}
:root{
  --ctf-bg:#ffffff;
  --ctf-ink:#0b0f14;
  --ctf-muted:#2a3440;

  --ctf-blue:#4bb7e7;
  --ctf-pink:#d97f96;

  --ctf-border:rgba(11,15,20,0.14);
  --ctf-focus:#1b65d6;

  --ctf-radius:18px;
  --ctf-radius-sm:12px;

  --ctf-shadow:0 16px 48px rgba(11,15,20,0.10);
  --ctf-shadow-sm:0 10px 26px rgba(11,15,20,0.08);

  --ctf-grad-soft:linear-gradient(135deg, rgba(75,183,231,0.18), rgba(217,127,150,0.18));
  --ctf-grad-band:linear-gradient(90deg, rgba(75,183,231,0.95), rgba(255,255,255,0.90), rgba(217,127,150,0.92));
}

html{font-size:100%;}
body{
  background:var(--ctf-bg);
  color:var(--ctf-ink);
  font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size:18px;
  line-height:1.75;
  margin:0;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

a{
  color:var(--ctf-ink);
  text-decoration-thickness:2px;
  text-underline-offset:0.18em;
}

:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid var(--ctf-focus);
  outline-offset:3px;
}

.ctf-skip-link{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}
.ctf-skip-link:focus{
  left:12px;
  top:12px;
  width:auto;
  height:auto;
  padding:10px 12px;
  background:#fff;
  border:1px solid var(--ctf-border);
  border-radius:12px;
  z-index:99999;
}

/* Header nav only */
.ctf-header-navonly{
  position:sticky;
  top:0;
  z-index:50;
  background:#fff;
  border-bottom:1px solid var(--ctf-border);
  padding:8px 16px;
  transition:padding 160ms ease, box-shadow 160ms ease;
}

.ctf-header-navonly::before{
  content:"";
  display:block;
  height:4px;
  background:var(--ctf-grad-band);
  margin-bottom:6px;
}

.ctf-header-inner{
  max-width:1120px;
  margin:0 auto;
}

/* Collapse state */
.ctf-header-navonly.ctf-collapsed{
  padding-top:4px;
  padding-bottom:4px;
  box-shadow:0 10px 26px rgba(11,15,20,0.10);
}
.ctf-header-navonly.ctf-collapsed::before{
  height:3px;
  margin-bottom:4px;
}

/* Primary menu layout */
.ctf-menu{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0;
  padding:0;
}

.ctf-menu > li{
  position:relative;
  margin:0;
  padding:0;
}

.ctf-menu a{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:6px 10px;
  border-radius:var(--ctf-radius-sm);
  text-decoration:none;
}

.ctf-menu a:hover{
  background:var(--ctf-grad-soft);
}

/* Toggle button */
.ctf-submenu-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  min-height:40px;
  margin-left:2px;
  border-radius:var(--ctf-radius-sm);
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;
}
.ctf-submenu-toggle:hover{
  background:var(--ctf-grad-soft);
}
.ctf-submenu-toggle:focus-visible{
  outline:3px solid var(--ctf-focus);
  outline-offset:3px;
}

/* Submenu */
.ctf-menu .sub-menu{
  display:none;
  position:absolute;
  left:0;
  top:calc(100% + 6px);
  min-width:240px;
  padding:8px;
  margin:0;
  list-style:none;
  background:#fff;
  border:1px solid var(--ctf-border);
  border-radius:14px;
  box-shadow:0 14px 40px rgba(11,15,20,0.12);
  z-index:9999;
}

.ctf-menu li.ctf-open > .sub-menu{
  display:block;
}

/* Hover open for mouse users */
@media (hover:hover){
  .ctf-menu li.menu-item-has-children:hover > .sub-menu{
    display:block;
  }
}

/* Submenu links */
.ctf-menu .sub-menu a{
  display:flex;
  width:100%;
  min-height:44px;
}

/* Third level submenu */
.ctf-menu .sub-menu .sub-menu{
  left:calc(100% + 8px);
  top:0;
}

/* Main content */
.ctf-main{
  max-width:1120px;
  margin:0 auto;
  padding:32px 16px 48px 16px;
}

.ctf-section{
  border:1px solid var(--ctf-border);
  border-radius:var(--ctf-radius);
  box-shadow:var(--ctf-shadow-sm);
  background:#fff;
  padding:clamp(16px, 3vw, 28px);
}

.ctf-hero{
  background:
    radial-gradient(900px 420px at 12% 0%, rgba(75,183,231,0.18), transparent 60%),
    radial-gradient(900px 420px at 88% 20%, rgba(217,127,150,0.16), transparent 58%),
    linear-gradient(180deg, #ffffff, #f6f8fb);
  box-shadow:var(--ctf-shadow);
}

.ctf-hero-org{
  margin:0 0 6px 0;
  font-weight:800;
  font-size:1.05rem;
  color:var(--ctf-ink);
}

.ctf-hero-title-text{
  margin:0 0 8px 0;
  line-height:1.15;
}

.ctf-hero-excerpt{
  margin:0;
  color:var(--ctf-muted);
  max-width:72ch;
}

.ctf-content{
  margin-top:18px;
}

.ctf-footer{
  border-top:1px solid var(--ctf-border);
  background:#f6f8fb;
  color:var(--ctf-muted);
  padding:18px 16px;
}
.ctf-footer-inner{
  max-width:1120px;
  margin:0 auto;
}

/* Mobile adjustments */
@media (max-width:780px){
  .ctf-menu{
    gap:6px;
  }
  .ctf-menu a{
    min-height:36px;
    padding:5px 9px;
  }
  .ctf-submenu-toggle{
    min-width:36px;
    min-height:36px;
  }
  .ctf-menu .sub-menu{
    position:static;
    display:block;
    box-shadow:none;
    border-radius:12px;
    margin-top:8px;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .ctf-header-navonly{
    transition:none;
  }
}

/* Dropdown base */
.ctf-menu{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0;
  padding:0;
}

.ctf-menu > li{
  position:relative;
}

/* Top level links */
.ctf-menu > li > a{
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:6px 10px;
  border-radius:12px;
  text-decoration:none;
}

/* Toggle button */
.ctf-submenu-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  min-height:40px;
  margin-left:2px;
  border-radius:12px;
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;
}

/* Submenu hidden */
.ctf-menu .sub-menu{
  display:none;
  position:absolute;
  left:0;
  top:calc(100% + 6px);
  min-width:240px;
  padding:8px;
  margin:0;
  list-style:none;
  background:#ffffff;
  border:1px solid rgba(11,15,20,0.14);
  border-radius:14px;
  box-shadow:0 14px 40px rgba(11,15,20,0.12);
  z-index:9999;
}

/* Show on JS open class */
.ctf-menu li.ctf-open > .sub-menu{
  display:block;
}

/* Optional hover open for desktops */
@media (hover:hover){
  .ctf-menu li.menu-item-has-children:hover > .sub-menu{
    display:block;
  }
}

/* Submenu links */
.ctf-menu .sub-menu a{
  display:flex;
  width:100%;
  min-height:44px;
  padding:10px 12px;
  border-radius:12px;
  text-decoration:none;
}

/* Third level opens right */
.ctf-menu .sub-menu .sub-menu{
  left:calc(100% + 8px);
  top:0;
}
.home .entry-title,
.home .page-title,
.home h1.wp-block-post-title,
.home header .entry-header{
  display: none;
}
