/* Screems — site styles. Layout is inline in the HTML for easy editing; this file holds resets, hover/focus states and animations. */
html, body { margin: 0; padding: 0; background: #f4f6f7; }
* { box-sizing: border-box; }
body { -webkit-font-smoothing: antialiased; }
a { color: oklch(0.52 0.20 258); text-decoration: none; }
a:hover { color: oklch(0.42 0.16 258); }
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
body { -webkit-font-smoothing: antialiased; }
input::placeholder, textarea::placeholder { color: rgba(255,255,255,0.45); }
.role-btn.is-active { background: rgba(255,255,255,0.94) !important; color: oklch(0.22 0.03 250) !important; }
#video-thumb { position: absolute; inset: 0; }

/* Animations */
@keyframes marq { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes pulse { 0%,100% { opacity: 0.35; transform: scale(1); } 50% { opacity: 0.9; transform: scale(1.35); } }
@keyframes logoPulse { 0%,100% { opacity: 1; filter: invert(1) brightness(2) drop-shadow(0 0 0 rgba(255,255,255,0)); } 50% { opacity: 0.82; filter: invert(1) brightness(2.3) drop-shadow(0 0 10px rgba(255,255,255,0.5)); } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@keyframes barGrow0 { 0%,100% { transform: scaleY(0.7); } 50% { transform: scaleY(1); } }
@keyframes barGrow1 { 0%,100% { transform: scaleY(0.72); } 50% { transform: scaleY(1); } }
@keyframes barGrow2 { 0%,100% { transform: scaleY(0.78); } 50% { transform: scaleY(1); } }
@keyframes barGrow3 { 0%,100% { transform: scaleY(0.84); } 50% { transform: scaleY(1); } }
@keyframes wordCycle { 0%,10% { opacity: 0; transform: translateY(14px); } 18%,85% { opacity: 1; transform: translateY(0); } 95%,100% { opacity: 0; transform: translateY(-14px); } }

/* Hover / focus states (generated from the design) */
.ui-1:hover { background: oklch(0.58 0.22 258) !important; color: #fff !important; }
.ui-2:hover { background: rgba(255,255,255,0.9) !important; color: oklch(0.22 0.03 250) !important; }
.ui-3:hover { background: rgba(255,255,255,0.9) !important; color: oklch(0.22 0.03 250) !important; }
.ui-4:hover { background: rgba(255,255,255,0.9) !important; color: oklch(0.22 0.03 250) !important; }
.ui-5:hover { background: rgba(255,255,255,0.9) !important; color: oklch(0.22 0.03 250) !important; }
.ui-6:hover { background: rgba(255,255,255,0.9) !important; color: oklch(0.22 0.03 250) !important; }
.ui-7:hover { background: rgba(255,255,255,0.9) !important; color: oklch(0.22 0.03 250) !important; }
.ui-8:hover { background: rgba(255,255,255,0.9) !important; color: oklch(0.22 0.03 250) !important; }
.ui-9:hover { background: oklch(0.95 0.02 240) !important; }
.ui-10:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-11:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-12:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-13:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-14:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-15:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-16:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-17:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-18:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-19:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-20:hover { transform: translateY(-5px) !important; box-shadow: 0 18px 34px -18px oklch(0.45 0.18 258 / 0.35) !important; }
.ui-21:hover { background: oklch(0.94 0.02 240) !important; }
.ui-22:focus { border-color: oklch(0.66 0.19 145) !important; }
.ui-23:focus { border-color: oklch(0.66 0.19 145) !important; }
.ui-24:focus { border-color: oklch(0.66 0.19 145) !important; }
.ui-25:focus { border-color: oklch(0.66 0.19 145) !important; }
.ui-26:hover { background: rgba(255,255,255,0.16) !important; }
.ui-27:hover { background: rgba(255,255,255,0.16) !important; }
.ui-28:hover { background: rgba(255,255,255,0.16) !important; }
.ui-29:focus { border-color: oklch(0.66 0.19 145) !important; }
.ui-30:hover { background: oklch(0.48 0.20 258) !important; transform: translateY(-2px) !important; }
.ui-31:hover { color: #fff !important; }
.ui-32:hover { color: #fff !important; }
.ui-33:hover { color: #fff !important; }
.ui-34:hover { color: #fff !important; }
.ui-35:hover { color: #fff !important; }
.ui-36:hover { color: #fff !important; }
.ui-37:hover { color: #fff !important; }
.ui-38:hover { color: #fff !important; }
.ui-39:hover { color: #fff !important; }
.ui-40:hover { color: #fff !important; }
.ui-41:hover { color: #fff !important; }
.ui-42:hover { color: #fff !important; }
.ui-43:hover { color: #fff !important; }
.ui-44:hover { color: #fff !important; }
.ui-45:hover { color: #fff !important; }
.ui-46:hover { transform: translateX(4px) !important; }
.ui-47:hover { transform: translateX(4px) !important; }
.ui-48:hover { transform: translateX(4px) !important; }
.ui-49:hover { transform: translateX(4px) !important; }
.ui-50:hover { transform: translateX(4px) !important; }
.ui-51:hover { transform: translateX(4px) !important; }
.ui-52:hover { transform: translateX(4px) !important; }
.ui-53:hover { background: oklch(0.58 0.22 258) !important; color: #fff !important; }
.ui-54:hover { background: oklch(0.58 0.22 258) !important; color: #fff !important; }

/* Responsive */
@media (max-width: 1024px) {
  [style*="grid-template-columns: repeat(5, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  [style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }
  [style*="grid-template-columns: repeat(6, 1fr)"] { grid-template-columns: repeat(3, 1fr) !important; }
  [style*="grid-template-columns: 1.25fr 0.9fr 0.9fr"] { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  section[style*="grid-template-columns"], div[style*="grid-template-columns: 1fr 1fr"], div[style*="grid-template-columns: 0.9fr 1.1fr"], div[style*="grid-template-columns: 1.05fr 0.95fr"], div[style*="grid-template-columns: 0.85fr 1.15fr"], div[style*="grid-template-columns: 1.1fr 0.9fr"], div[style*="grid-template-columns: 1.3fr 1fr 1fr 1fr"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: 1fr !important; }
  [style*="padding: 56px 48px"], [style*="padding: 52px 48px"] { padding: 36px 24px !important; }
  nav [style*="justify-content: center"] > div { max-width: 100%; }
}

/* ---------- WordPress additions ---------- */
img { max-width: 100%; height: auto; }
#investor-form button:disabled { opacity: 0.6; cursor: wait; }
.screems-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.screems-list-item:hover { transform: translateX(4px); }

/* Inner page content (legal pages, posts) — editable in the block editor */
.screems-prose { font-size: 15.5px; line-height: 1.75; color: oklch(0.30 0.015 250); }
.screems-prose > :first-child { margin-top: 0; }
.screems-prose h2 { font-family: 'Space Grotesk', sans-serif; font-size: 19px; font-weight: 600; margin: 34px 0 10px; color: oklch(0.22 0.015 250); }
.screems-prose h3 { font-family: 'Space Grotesk', sans-serif; font-size: 16.5px; font-weight: 600; margin: 26px 0 8px; }
.screems-prose ul, .screems-prose ol { padding-left: 1.3em; }
.screems-prose img { border-radius: 16px; }
.screems-pagination .nav-links { display: flex; gap: 8px; margin-top: 18px; font-family: 'JetBrains Mono', monospace; font-size: 12px; }
.screems-pagination .page-numbers { padding: 8px 13px; border-radius: 100px; background: #fff; border: 1px solid oklch(0.92 0.005 250); }
.screems-pagination .current { background: oklch(0.24 0.04 250); color: #fff; }

@media (max-width: 760px) {
  .screems-card { padding: 34px 22px !important; }
  #invest > div:first-child { padding: 36px 22px !important; }
  #invest > div:last-child { min-height: 380px !important; }
  #agdc > div:last-child { padding: 36px 22px 30px !important; }
  footer[style*="padding: 48px 48px 34px"] { padding: 36px 24px 28px !important; }
  [style*="grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px"] { grid-template-columns: 1fr !important; }
  #problem h2, #maps h2, #tech h2, #access h2, #market h2, #capital h2, #compare h2, #gtm h2 { font-size: 34px !important; }
  #agdc h2, #invest h2 { font-size: 38px !important; }
  #video { aspect-ratio: 16/9 !important; }
  nav[style*="margin: 44px 44px 0"] { margin: 36px 30px 0 !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}
@media (max-width: 480px) {
  #top nav > div:first-child > a:first-child > span { display: none; }
  #top nav > div:first-child > a.ui-1 { padding: 10px 15px !important; font-size: 13px !important; }
  #top nav[style*="margin: 44px 44px 0"] { margin: 34px 26px 0 !important; padding: 0 !important; }
  #top > div[style*="padding: 72px 60px 60px"] { padding: 56px 26px 40px !important; }
}