/* CNPS block theme — supporting styles.
   theme.json owns the design tokens; this covers what it can't express.
   Dark mode is handled by overriding the preset custom properties. */

/* ---- Utility type ---- */
.cnps-eyebrow{
  font-family:var(--wp--preset--font-family--mono);
  font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
}
.cnps-hero-title em{font-style:italic;color:var(--wp--preset--color--accent)}

/* ---- Header ---- */
.cnps-header{position:sticky;top:0;z-index:30;
  background:color-mix(in srgb,var(--wp--preset--color--base) 88%,transparent);
  backdrop-filter:saturate(140%) blur(10px);}
.cnps-mark{display:inline-flex;line-height:0}
.cnps-header .wp-block-navigation a:hover{color:var(--wp--preset--color--contrast)}

/* ---- Navigation submenus (dropdowns) — match the design tokens ---- */
.cnps-header .wp-block-navigation .wp-block-navigation-item__label{font-family:var(--wp--preset--font-family--sans)}
.cnps-header .wp-block-navigation__submenu-container{
  background-color:var(--wp--preset--color--surface);
  border:1px solid var(--wp--preset--color--line);
  border-radius:12px;
  box-shadow:0 1px 2px rgba(19,26,36,.05),0 14px 36px rgba(19,26,36,.12);
  padding:7px;
  min-width:216px;
  margin-top:6px;
}
/* each submenu row */
.cnps-header .wp-block-navigation__submenu-container .wp-block-navigation-item{color:var(--wp--preset--color--muted)}
.cnps-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  color:var(--wp--preset--color--muted);
  font-size:0.9rem;
  padding:8px 12px;
  border-radius:7px;
  width:100%;
}
.cnps-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.cnps-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus{
  color:var(--wp--preset--color--contrast);
  background-color:var(--wp--preset--color--surface-2);
}
/* dropdown caret follows text colour */
.cnps-header .wp-block-navigation-submenu__toggle,
.cnps-header .wp-block-navigation__submenu-icon{color:currentColor}
/* transparent bridge across the visual gap so moving the mouse from the
   menu item down to the dropdown doesn't lose :hover and close it */
.cnps-header .wp-block-navigation__submenu-container::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-12px;
  height:14px;
  background:transparent;
  pointer-events:auto;
  display:block;
}
/* keep the dropdown open while the pointer is anywhere within the parent item */
.cnps-header .wp-block-navigation-item.has-child:hover > .wp-block-navigation__submenu-container,
.cnps-header .wp-block-navigation-item.has-child:focus-within > .wp-block-navigation__submenu-container{
  visibility:visible;
  opacity:1;
}
@media (prefers-color-scheme:dark){
  .cnps-header .wp-block-navigation__submenu-container{box-shadow:0 1px 2px rgba(0,0,0,.35),0 16px 40px rgba(0,0,0,.45)}
}
:root[data-theme="dark"] .cnps-header .wp-block-navigation__submenu-container{box-shadow:0 1px 2px rgba(0,0,0,.35),0 16px 40px rgba(0,0,0,.45)}

/* ---- Hero ---- */
.cnps-hero{position:relative;overflow:hidden}
.cnps-orbit{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none}
.cnps-hero-inner{position:relative;z-index:2}
.cnps-stat-n{font-family:var(--wp--preset--font-family--serif);font-size:2rem;font-weight:600;
  font-variant-numeric:tabular-nums;line-height:1;margin:0}
.cnps-stat-l{font-family:var(--wp--preset--font-family--mono);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--wp--preset--color--muted);margin:.35rem 0 0}

/* ---- Cards / pillars ---- */
.cnps-card{height:100%;box-shadow:0 1px 2px rgba(19,26,36,.04),0 8px 30px rgba(19,26,36,.06);
  transition:transform .18s ease,border-color .18s ease}
.cnps-card:hover{transform:translateY(-3px);border-color:var(--wp--preset--color--secondary)!important}
.cnps-ico{display:inline-flex;color:var(--wp--preset--color--accent);line-height:0}
.cnps-go{font-family:var(--wp--preset--font-family--mono);font-size:.74rem;letter-spacing:.1em;
  text-transform:uppercase;font-weight:600;margin-top:.4rem}
.cnps-go a{text-decoration:none}
.cnps-pillars{align-items:stretch}
.cnps-pillars .wp-block-column{display:flex}

/* ---- Featured threads ---- */
.cnps-cat{font-family:var(--wp--preset--font-family--mono);font-size:.66rem;letter-spacing:.12em;
  text-transform:uppercase;font-weight:600;margin:0}
.cnps-tt a{text-decoration:none;transition:color .15s ease}
.cnps-thread:hover .cnps-tt a{color:var(--wp--preset--color--secondary)}
.cnps-meta{font-size:.85rem;margin:.2rem 0 0}

/* ---- Video card ---- */
.cnps-videocard{overflow:hidden;box-shadow:0 1px 2px rgba(19,26,36,.04),0 8px 30px rgba(19,26,36,.06)}
.cnps-thumb{aspect-ratio:16/9;position:relative;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(120% 120% at 30% 20%,#1c2b3d,#0a0f18)}
.cnps-thumb .cnps-play{width:64px;height:64px;border-radius:50%;background:rgba(224,174,78,.94);
  display:flex;align-items:center;justify-content:center;color:#160f02}
.cnps-thumb .cnps-play svg{margin-left:3px}
.cnps-thumb .cnps-tag{position:absolute;left:14px;top:14px;font-family:var(--wp--preset--font-family--mono);
  font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;background:rgba(10,15,24,.72);
  color:#E0AE4E;padding:5px 9px;border-radius:5px}

/* ---- Donate ---- */
.cnps-donate{position:relative;overflow:hidden}
.cnps-donate::after{content:"";position:absolute;right:-60px;top:-60px;width:280px;height:280px;
  border-radius:50%;border:1px solid rgba(224,174,78,.25);box-shadow:0 0 0 30px rgba(224,174,78,.05)}
.cnps-donate>*{position:relative;z-index:1}

/* ---- Footer ---- */
.cnps-footlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.cnps-footlist a{text-decoration:none;color:var(--wp--preset--color--muted)}
.cnps-footlist a:hover{color:var(--wp--preset--color--contrast)}
.cnps-footer h3,.cnps-footer h4{font-family:var(--wp--preset--font-family--serif)}

/* ---- Responsive ---- */
@media (max-width:781px){
  .cnps-stats{gap:1.75rem!important}
  .cnps-orbit{opacity:.6}
}

/* ---- Dark mode: override the design tokens ---- */
@media (prefers-color-scheme:dark){
  :root{
    --wp--preset--color--base:#0A0F18;
    --wp--preset--color--surface:#121A26;
    --wp--preset--color--surface-2:#0F1721;
    --wp--preset--color--contrast:#E9EDF2;
    --wp--preset--color--muted:#93A0B0;
    --wp--preset--color--accent:#E0AE4E;
    --wp--preset--color--accent-soft:#3a2f18;
    --wp--preset--color--secondary:#6FA0C6;
    --wp--preset--color--line:#223143;
  }
  .cnps-card{box-shadow:0 1px 2px rgba(0,0,0,.3),0 12px 40px rgba(0,0,0,.35)}
  .cnps-videocard{box-shadow:0 1px 2px rgba(0,0,0,.3),0 12px 40px rgba(0,0,0,.35)}
}
:root[data-theme="dark"]{
  --wp--preset--color--base:#0A0F18;
  --wp--preset--color--surface:#121A26;
  --wp--preset--color--surface-2:#0F1721;
  --wp--preset--color--contrast:#E9EDF2;
  --wp--preset--color--muted:#93A0B0;
  --wp--preset--color--accent:#E0AE4E;
  --wp--preset--color--accent-soft:#3a2f18;
  --wp--preset--color--secondary:#6FA0C6;
  --wp--preset--color--line:#223143;
}
