/* ===============  SynsureTech Bible — Foundation  =============== */

/* Tokens */
:root{
  /* brand */
  --st-blue:#0061FF; --st-blue-600:#0453d9; --st-blue-100:#E8F1FF;
  --st-ink:#0E1222; --st-ink-70:#3B425A; --st-ink-50:#6B7390;
  --st-bg:#FFFFFF; --st-bg-alt:#F6F8FC;
  --st-green:#18BF6D; --st-red:#E45757; --st-amber:#FFB020;

  /* layout + rhythm */
  --st-container:1200px;       /* max content width */
  --st-page-gutter:24px;       /* outer page padding */
  --st-r:8px;                  /* base rhythm (8px grid) */
  --st-radius:12px;            /* card radius */
  --st-shadow:0 6px 24px rgba(14,18,34,.08);

  /* spacing tokens (Bible standard) */
  --space-2xs:4px;   --space-xs:8px;   --space-sm:12px;
  --space-md:16px;   --space-lg:24px;  --space-xl:32px;
  --space-2xl:48px;  --space-3xl:64px; --space-4xl:96px;

  /* radius variants */
  --radius-sm:8px; --radius-md:12px; --radius-lg:16px; --radius-full:9999px;

  /* type scale (mobile-first) */
  --st-h1:clamp(28px,4vw,44px);
  --st-h2:clamp(22px,3vw,32px);
  --st-h3:clamp(18px,2.4vw,22px);
  --st-body:16px; --st-small:14px; --st-xsmall:12px;
}

/* Global reset */
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--st-bg);color:var(--st-ink);font:400 var(--st-body)/1.6 system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial}
img{max-width:100%;height:auto}
a{color:var(--st-blue);text-decoration:none}
a:hover{color:var(--st-blue-600);text-decoration:underline}

/* Container + sections */
.st-container{max-width:var(--st-container);margin:0 auto;padding-inline:clamp(var(--space-lg),5vw,var(--space-3xl))}
.st-section{padding-block:var(--space-4xl)}
@media(max-width:768px){.st-section{padding-block:var(--space-3xl)}}
.st-section.alt{background:var(--st-bg-alt)}
.st-stack>*+*{margin-top:var(--space-md)} /* vertical rhythm helper */

/* Section wrappers for consistent padding */
.section-wrapper{padding-block:var(--space-4xl);padding-inline:clamp(var(--space-lg),5vw,var(--space-3xl))}
@media(max-width:768px){.section-wrapper{padding-block:var(--space-3xl);padding-inline:var(--space-md)}}
.section-inner{max-width:var(--st-container);margin:0 auto}

/* Hero spacing - Bible v2 */
.hero.page-with-header{margin-top:var(--space-4xl);margin-bottom:var(--space-3xl);padding-inline:clamp(var(--space-lg),5vw,var(--space-3xl))}
@media(max-width:1024px){.hero.page-with-header{margin-top:72px}}
@media(max-width:768px){.hero.page-with-header{margin-top:var(--space-2xl);margin-bottom:var(--space-2xl);padding-inline:var(--space-md)}}

/* Hero inner container */
.hero-inner{max-width:var(--st-container);margin:0 auto}

/* Hero two-column layout */
.hero-two-col{display:flex;align-items:center;justify-content:space-between;gap:var(--space-xl)}
@media(max-width:1280px){.hero-two-col{flex-direction:column;text-align:center;gap:var(--space-lg)}}

/* Hero text block */
.hero-text-block{max-width:760px}
@media(max-width:1280px){.hero-text-block{margin:0 auto}}

/* Hero image block */
.hero-image-block{max-width:620px;width:100%;overflow:hidden;border-radius:var(--radius-lg)}
@media(max-width:1280px){.hero-image-block{max-width:100%}}

/* Typography (single source of truth) */
h1{font-size:var(--st-h1);line-height:1.15;margin:0 0 calc(var(--st-r)*2)}
h2{font-size:var(--st-h2);line-height:1.2;margin:0 0 calc(var(--st-r)*1.5)}
h3{font-size:var(--st-h3);line-height:1.25;margin:0 0 calc(var(--st-r)*1.25)}
p{margin:0 0 calc(var(--st-r)*1.5)}
.small{font-size:var(--st-small);color:var(--st-ink-50)}
.muted{color:var(--st-ink-50)}

/* Buttons */
.st-btn{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:10px;
  font-weight:600;border:1px solid transparent;cursor:pointer;transition:.15s all ease}
.st-btn:disabled{opacity:.5;cursor:not-allowed}
.st-btn.primary{background:var(--st-blue);color:#fff;box-shadow:var(--st-shadow)}
.st-btn.primary:hover{background:var(--st-blue-600)}
.st-btn.secondary{background:#fff;border-color:var(--st-blue);color:var(--st-blue)}
.st-btn.ghost{background:transparent;color:var(--st-blue)}
.st-btn.block{width:100%}

/* Cards */
.st-card{background:#fff;border:1px solid #E7ECF7;border-radius:var(--radius-md);box-shadow:var(--st-shadow);padding:var(--space-lg)}
.st-card.tight{padding:var(--space-md)}

/* Card grids */
.card-grid{display:grid;gap:var(--space-lg)}
@media(min-width:1280px){.card-grid.cols-3{grid-template-columns:repeat(3,1fr)}.card-grid.cols-4{grid-template-columns:repeat(4,1fr)}}
@media(min-width:768px) and (max-width:1279px){.card-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-md)}}
@media(max-width:767px){.card-grid{grid-template-columns:1fr;gap:var(--space-md)}}
.st-kpi{display:flex;gap:14px;align-items:center}
.st-badge{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:6px 10px;font-weight:600;font-size:13px;background:var(--st-blue-100);color:var(--st-blue)}
.badge-ok{background:#E9FBF2;color:var(--st-green)} .badge-warn{background:#FFF4E5;color:var(--st-amber)} .badge-no{background:#FDEBEC;color:var(--st-red)}

/* Home Hero */
.home-hero{text-align:center;padding-top:8px;font-family:'Inter','Open Sans',system-ui,-apple-system,Arial,sans-serif;color:var(--st-ink)}
.hero-tag{display:inline-flex !important;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font-size:13px;font-weight:500;letter-spacing:.02em;margin-bottom:12px}
.hero-tag::before{content:"";width:6px;height:6px;border-radius:50%;opacity:.9}
.home-hero h1{margin:0 0 16px;font-weight:600;line-height:1.2}
.home-hero .subhead{max-width:820px;margin:0 auto 8px;font-size:18px;line-height:1.5}

/* 4-step sticky bar */
.st-steps{position:sticky;top:64px;z-index:20;background:#fff;border-bottom:1px solid #E7ECF7}
.st-steps .row{display:flex;gap:12px;overflow:auto;padding:10px var(--st-page-gutter)}
.step{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid #E7ECF7;border-radius:12px;background:#fff;white-space:nowrap}
.step .dot{width:10px;height:10px;border-radius:50%;background:#C8D6FF}
.step.active{border-color:var(--st-blue);box-shadow:var(--st-shadow)}
.step.active .dot{background:var(--st-blue)}
.step.done{opacity:.85}
.step.done .dot{background:var(--st-green)}

/* Footer */
.st-footer{background:#0B1020;color:#E9EEFF;margin-top:calc(var(--st-r)*6)}
.st-footer a{color:#E9EEFF}
.st-footer .grid{display:grid;gap:20px;padding:32px var(--st-page-gutter)}
@media(min-width:900px){.st-footer .grid{grid-template-columns:2fr 1fr 1fr 1fr}}

.st-footer .brand{font-weight:800;font-size:18px;margin-bottom:8px}
.st-footnote{border-top:1px solid rgba(255,255,255,.08);padding:14px var(--st-page-gutter);font-size:13px;color:#BFD0FF}

/* Utilities (replace ad-hoc margins/paddings) */
.mt-0{margin-top:0}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:32px}.mt-6{margin-top:48px}
.mb-0{margin-bottom:0}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.mb-4{margin-bottom:32px}
.pt-2{padding-top:16px}.pb-2{padding-bottom:16px}.px-2{padding-inline:16px}.py-3{padding-block:24px}
.center{text-align:center}.grid-2{display:grid;gap:20px}@media(min-width:900px){.grid-2{grid-template-columns:1fr 1fr}}

/* Bible v2 Standard Padding Classes */
.bible-section{padding:96px 0}
@media(max-width:768px){.bible-section{padding:64px 0}}
.bible-section-sm{padding:64px 0}
@media(max-width:768px){.bible-section-sm{padding:48px 0}}
.bible-container{padding-left:clamp(20px,5vw,64px);padding-right:clamp(20px,5vw,64px)}
