/* PromptWick shared design system - single source for all pages */
:root{
  --ink:#14161f; --indigo:#4f46e5; --indigo-600:#4338ca; --indigo-300:#a5b4fc;
  --amber:#f59e0b; --amber-soft:#fbbf24;
  --night:#0a0c16; --night-2:#10132a; --night-card:#141735;
  --paper:#fbfbfd; --line:#e7e9f0; --line-soft:#eef0f5;
  --muted:#5b6478; --muted-d:#9aa3bd;
  --display:"Space Grotesk",system-ui,sans-serif;
  --body:"Inter",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
a{color:inherit;text-decoration:none;}
img,svg{display:block;}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px;}

/* premium top hairline accent */
.topline{height:2px;background:linear-gradient(90deg,var(--amber) 0%,var(--indigo) 45%,var(--indigo-600) 100%);}

/* nav */
.nav{position:sticky;top:0;z-index:40;background:rgba(9,11,22,.82);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid rgba(255,255,255,.07);}
.nav-in{display:flex;align-items:center;gap:24px;height:66px;}
.brand{display:flex;align-items:center;gap:10px;color:#fff;font-family:var(--display);font-weight:700;font-size:18.5px;letter-spacing:-.3px;}
.brand .mark{width:28px;height:28px;filter:drop-shadow(0 2px 8px rgba(245,158,11,.35));}
.nav-links{margin-left:auto;display:flex;align-items:center;gap:30px;}
.nav-links a:not(.btn){color:var(--muted-d);font-size:14px;font-weight:500;letter-spacing:.01em;transition:color .15s ease;}
.nav-links a:not(.btn):hover{color:#fff;}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--display);font-weight:600;font-size:15px;border-radius:12px;padding:11px 18px;cursor:pointer;border:0;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;}
.btn:focus-visible{outline:2px solid var(--amber);outline-offset:2px;}
.btn-primary{
  color:#fff;
  background:linear-gradient(180deg,#5b53ec,var(--indigo) 60%,var(--indigo-600));
  box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 8px 24px -10px rgba(79,70,229,.9);
}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 12px 30px -10px rgba(79,70,229,1);}
.btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.2);}
.btn-ghost:hover{border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.04);}
.nav-links .btn{padding:9px 16px;font-size:14px;}

/* shared dark header band (hero / page header) */
.dark{background:radial-gradient(125% 95% at 82% -15%,#241c54 0%,var(--night) 58%);color:#fff;position:relative;overflow:hidden;}
.dark::after{content:"";position:absolute;right:-130px;top:-130px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(245,158,11,.2),transparent 70%);pointer-events:none;}

/* eyebrow */
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--amber);background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.28);padding:5px 12px;border-radius:999px;}

/* footer */
.foot{padding:44px 0;border-top:1px solid var(--line);color:var(--muted);font-size:14px;background:#fff;}
.foot-in{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.foot .brand{color:var(--ink);}
.foot .brand .mark{filter:none;width:24px;height:24px;}
.foot-links{margin-left:auto;display:flex;gap:24px;}
.foot-links a{color:var(--muted);transition:color .15s ease;}
.foot-links a:hover{color:var(--ink);}

/* motion - fail-open: only hide reveal elements when JS is active (html.js).
   Without JS (or if the reveal script never runs), content stays fully visible
   instead of leaving the page blank. */
html.js .reveal{opacity:0;transform:translateY(14px);}
html.js .reveal.in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease;}
@media (prefers-reduced-motion:reduce){html.js .reveal{opacity:1;transform:none;}.btn{transition:none;}}

@media (max-width:860px){
  .nav-links a:not(.btn){display:none;}
}