/* =========================================================
   Perch × Robinhood — theme (safe logos + robot)
   ========================================================= */

:root {
  --perch-green: #00c805;
}

html {
  background: #000 !important;
}

::selection {
  background: rgba(0, 200, 5, 0.35);
  color: #fff;
}

/* ----- Hide sections not needed ----- */
#team,
.team-section,
#main-team-list,
#advisors-team-list,
#team-tabs,
.team-partners-block,
.team-partners-item,
.partners-divider,
.team-shadow-left,
.team-shadow-center,
.team-shadow-right,
.ecosystem-section,
.section-partners,
.partners-section,
#partners,
[id*="partners-projects"],
.grid-aside-heading,
.spaces-section,
#ai-revolution,
.revolution,
.revolution__items,
.revolution__item,
.revolution__title-wrap,
.js-marquee-revolution-clone,
.tweets-marquee,
.tweets-marquee-content,
#our-token,
.token-section,
#buy,
.token-intro,
.copy-block,
.copy-logos,
.js-marquee-token-clone {
  display: none !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.marquee-heading.mh-alt-mode,
.marquee-title {
  display: none !important;
}

.top-banner,
.top-banner-link,
[class*="top-banner"] {
  background: #041204 !important;
  border-color: rgba(0, 200, 5, 0.3) !important;
}

/* =========================================================
   UI chrome icons ONLY (arrows, bullets, corners)
   Do NOT silhouette product/feature logos
   ========================================================= */

img[src*="ico-arrow"],
img[src*="arrow-down"],
img[src*="arrow-right"],
img[src*="icon-link-arrow"],
img[src*="ico-indicator"],
img[src*="ico-bullet"],
img[src*="ico-close"],
img[src*="ico-menu"],
img[src*="ico-expand"],
img[src*="ico-quote"],
img[src*="corner-top"],
img[src*="corner-bottom"],
img[src*="corner-color"],
img[src*="selected-indicator"],
img[src*="sections-btn"],
img[src*="dot.svg"],
img.perch-ui-icon {
  filter: brightness(0) saturate(100%) invert(58%) sepia(98%) saturate(1200%)
    hue-rotate(68deg) brightness(105%) contrast(104%) !important;
}

/* Product / feature / menu logos — NEVER flatten */
img.product-menu-item-logo,
img.product-menu-item-logo-2,
img.product-menu-item-logo-3,
img[class*="product-menu-item-logo"],
img[class*="logo-ai-hub"],
img[class*="logo-labs"],
img[class*="logo-guard"],
img[class*="logo-degen"],
img[src*="logo-NFTGen"],
img[src*="logo-Pad"],
img[src*="logo-ai-hub"],
img[src*="CryptoGuard"],
img[src*="aivm-logo"],
img[src*="chain-gpt-labs"],
img[src*="logo-1-3-5"],
img[src*="logo-2.svg"],
img[src*="logo-4.svg"],
img[src*="hero-feature"],
img[src*="feature"],
.product-menu-item img,
.dd-main-menu-link-2 img,
.w-dropdown-list img,
.solution img,
.solutions img {
  filter: none !important;
  -webkit-filter: none !important;
}

/* Optional soft green tint for mono brand-dark menu icon only */
img.product-menu-item-logo[src*="logo-chainGPT-dark"],
img.product-menu-item-logo[src*="logo-chainGPT"] {
  filter: hue-rotate(40deg) saturate(1.35) brightness(1.05) !important;
}

/* Header Perch brand logo — MUST stay square (Webflow wanted 156x34 = broken stretch) */
img.perch-logo,
img[src*="logo-perch"],
img.image-1022,
a.w-nav-brand img,
.w-nav-brand img,
.header img[src*="logo-perch"] {
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
  border-radius: 12px !important;
  object-fit: cover !important;
  object-position: center !important;
  background: #000 !important;
  width: 44px !important;
  height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  display: block !important;
  box-shadow: 0 0 0 1px rgba(0, 200, 5, 0.3), 0 0 16px rgba(0, 200, 5, 0.18) !important;
}
img.pl-logo {
  width: 96px !important;
  height: 96px !important;
  max-width: 96px !important;
  max-height: 96px !important;
  min-width: 96px !important;
  min-height: 96px !important;
}

/* Inline SVG small UI */
header svg [fill]:not([fill="none"]),
footer svg [fill]:not([fill="none"]),
button svg [fill]:not([fill="none"]) {
  fill: #00c805 !important;
}
header svg [stroke]:not([stroke="none"]),
button svg [stroke]:not([stroke="none"]) {
  stroke: #00c805 !important;
}

/* Robot / rive / video protected */
canvas,
video,
.rive-animation,
.rive-animation *,
[class*="rive"],
[class*="Rive"],
.webgl,
.webgl *,
[data-rive-src],
[data-rive-src] *,
.page-loader canvas,
.lottie,
.lottie svg,
[class*="lottie"] {
  filter: none !important;
  -webkit-filter: none !important;
}

/* Photos */
img[data-perch="photo"],
img.perch-photo,
img[src*="Case"],
img[src*=".jpg"],
img[src*=".jpeg"],
img[src*=".webp"],
img[src*="avatar"],
.slide-image-elem,
.team-card-avatar-img {
  filter: none !important;
}

/* But jpg logo-perch is brand — already handled above with higher specificity via src* logo-perch */

a:hover {
  color: #00c805 !important;
}
:focus-visible {
  outline: 2px solid #00c805 !important;
  outline-offset: 2px;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(
    ellipse 70% 45% at 50% -8%,
    rgba(0, 200, 5, 0.12),
    transparent 55%
  );
}
body > * {
  position: relative;
  z-index: 1;
}
#rh-ticker,
#rh-ca-card,
#perch-preloader {
  z-index: 2147483000 !important;
}

* {
  scrollbar-color: #00c805 #111;
}
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-thumb {
  background: #00c805;
  border-radius: 8px;
}

/* ===== LOGO ULTIMATE FIX ===== */
.image-1022 {
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: 44px !important;
}
#perch-brand-logo,
.perch-brand-logo,
a.w-nav-brand img,
.brand-2 img {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  object-fit: contain !important;
  filter: none !important;
  -webkit-filter: none !important;
  border-radius: 12px !important;
  background: #000 !important;
}