/* Gryffos — shared design tokens & base (Apple-inspired) */
:root{
  --bg: #ffffff;
  --bg-alt: #f5f5f7;
  --ink: #1d1d1f;
  --ink-soft: #6e6e73;
  --border: rgba(0,0,0,0.08);
  --accent: #0071e3;
  --accent-hover: #0077ed;
  --radius-lg: 22px;
  --radius-md: 14px;
  --radius-pill: 980px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.47;
}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

/* Nav */
.nav{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,0.8);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--border);
}
.nav-inner{
  max-width:1100px; margin:0 auto; padding:0 24px;
  height:48px; display:flex; align-items:center; justify-content:space-between;
}
.nav-brand{font-size:0.95rem; font-weight:600; letter-spacing:-0.01em; display:flex; align-items:center; gap:6px;}
.nav-links{display:flex; gap:28px; font-size:0.78rem; color:var(--ink-soft);}
.nav-links a{transition:color .2s;}
.nav-links a:hover{color:var(--ink);}

/* Buttons */
.btn{
  display:inline-flex; align-items:center; gap:6px;
  padding:11px 22px; border-radius:var(--radius-pill);
  font-size:0.92rem; font-weight:500;
  transition:transform .3s var(--ease), opacity .3s var(--ease), background .2s;
}
.btn-primary{background:var(--accent); color:#fff;}
.btn-primary:hover{background:var(--accent-hover);}
.btn-text{color:var(--accent); padding:0; font-weight:500;}
.btn-text:hover{color:var(--accent-hover);}
.btn-text .arrow{transition:transform .25s var(--ease);}
.btn-text:hover .arrow{transform:translateX(3px);}

/* Reveal-on-scroll */
.reveal{opacity:0; transform:translateY(24px); transition:opacity .9s var(--ease), transform .9s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
}

/* Footer */
.site-footer{
  border-top:1px solid var(--border); padding:32px 24px; text-align:center;
  color:var(--ink-soft); font-size:0.78rem; background:var(--bg-alt);
}
.site-footer a{color:var(--ink-soft);}
.site-footer a:hover{color:var(--ink);}

/* Mockup window frame (used to represent tool UIs abstractly) */
.window-frame{
  background:#fff; border-radius:var(--radius-lg);
  box-shadow:0 30px 60px -20px rgba(0,0,0,0.18), 0 0 0 1px var(--border);
  overflow:hidden;
}
.window-titlebar{
  height:32px; background:#f5f5f7; display:flex; align-items:center; gap:6px; padding:0 14px;
  border-bottom:1px solid var(--border);
}
.window-dot{width:10px; height:10px; border-radius:50%;}
.window-dot.r{background:#ff5f57;} .window-dot.y{background:#febc2e;} .window-dot.g{background:#28c840;}
.window-body{padding:22px;}