/* ============================================================
   GET STARTUPS — Shared Theme
   Master color/typography tokens used across all pages
   (comming.html, index.html, ...). Edit here to restyle everywhere.
   ============================================================ */

:root{
  --green-900:#142521;
  --green-700:#0AA458;
  --green-600:#0AA458;
  --green-500:#0AA458;
  --green-100:#DCE8E4;
  --green-050:rgba(255,255,255,.92);
  --ink:#142521;
  --muted:#5D6E68;
  --line:#DCE8E4;
  --paper:#ffffff;
  --red:#e0483e;
  --lav:#5D6E68;
  --surface:rgba(255,255,255,.92);
  --surface-strong:#ffffff;
  --overlay:rgba(20,37,33,.34);
  --accent-soft:rgba(22,163,106,.10);
  --toggle-shadow:0 14px 36px -22px rgba(20,37,33,.4);

  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:22px;
  --shadow-card:0 22px 42px -20px rgba(20,40,32,.38);
  --font-main:'Cairo', sans-serif;
}

body[data-theme="dark"]{
  --green-900:#083F35;
  --green-700:#0B8A47;
  --green-600:#16A36A;
  --green-500:#B8ED57;
  --green-100:rgba(22,163,106,.34);
  --green-050:rgba(255,255,255,.10);
  --ink:#ffffff;
  --muted:rgba(255,255,255,.78);
  --line:rgba(255,255,255,.16);
  --paper:#083F35;
  --red:#FF1F2D;
  --lav:#ffffff;
  --surface:rgba(255,255,255,.10);
  --surface-strong:rgba(255,255,255,.16);
  --overlay:rgba(8,17,24,.68);
  --accent-soft:rgba(22,163,106,.34);
  --toggle-shadow:0 16px 44px -24px rgba(0,0,0,.65);
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:var(--font-main);
  background:var(--paper);
  color:var(--ink);
  transition:background .35s ease, color .35s ease;
}

/* ---------- shared building blocks ---------- */
.gs-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:none;
  border-radius:var(--radius-sm);
  font-family:inherit;
  font-weight:700;
  cursor:pointer;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
}
.gs-btn-primary{
  background:linear-gradient(160deg,var(--green-600),var(--green-700));
  color:#fff;
  box-shadow:0 14px 28px -12px rgba(22,163,106,.35);
}
.gs-btn-primary:hover{ transform:translateY(-2px); box-shadow:0 20px 34px -14px rgba(22,163,106,.45); }
body[data-theme="dark"] .gs-btn-primary{ color:#083F35; box-shadow:0 14px 28px -12px rgba(184,237,87,.22); }

.gs-btn-outline{
  background:transparent;
  color:var(--green-700);
  border:1.5px solid var(--green-100);
}
.gs-btn-outline:hover{ background:var(--accent-soft); transform:translateY(-2px); }
body[data-theme="dark"] .gs-btn-outline{ color:var(--green-500); border-color:var(--line); }

.gs-btn-ghost{
  background:var(--surface);
  color:var(--ink);
  border:1px solid var(--line);
}
.gs-btn-ghost:hover{ background:var(--surface-strong); transform:translateY(-2px); }

/* keyframes shared across pages */
@keyframes spin{ to{ transform:rotate(360deg); } }
@keyframes breathe{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.035); } }
@keyframes floatY{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-10px); } }
@keyframes fadeDown{ from{ opacity:0; transform:translateY(-14px);} to{ opacity:1; transform:translateY(0);} }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(16px);} to{ opacity:1; transform:translateY(0);} }
@keyframes pulseDot{ 0%,100%{ opacity:.4; transform:scale(1);} 50%{ opacity:1; transform:scale(1.3);} }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}