/* ==========================================================================
   Showfa — base.css
   Design tokens, resets, and base typography.
   ========================================================================== */

:root{
  /* Colors */
  --navy-900:#001824;
  --navy-800:#082633;
  --navy-700:#0b2d3a;
  --teal-600:#02928b;
  --teal-500:#0aa79e;
  --teal-400:#17b3a3;
  --teal-100:#e6f5f3;
  --teal-50:#f2faf9;
  --ink:#0b2530;
  --grey-700:#4a5a63;
  --grey-500:#6b7c85;
  --grey-300:#c7d2d6;
  --grey-100:#eef2f3;
  --white:#ffffff;
  --border:#e2e8ea;
  --shadow-sm: 0 2px 10px rgba(6,30,40,0.06);
  --shadow-md: 0 10px 30px rgba(6,30,40,0.10);
  --shadow-lg: 0 20px 60px rgba(6,30,40,0.18);
  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:24px;
  --radius-pill:999px;

  --font-display:'Poppins', system-ui, sans-serif;
  --font-body:'Inter', system-ui, sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-size:16px;
  line-height:1.6;
}

img{ max-width:100%; display:block; }

a{ text-decoration:none; color:inherit; }

h1,h2,h3,h4,h5,h6{
  font-family:var(--font-display);
  margin:0;
  color:var(--ink);
  font-weight:600;
}

p{ margin:0; }

ul{ margin:0; padding:0; list-style:none; }

button{ font-family:inherit; }

:focus-visible{
  outline:2px solid var(--teal-500);
  outline-offset:2px;
}

.container{
  max-width:1320px;
}

/* Utility text colors */
.text-teal{ color:var(--teal-400); }
.text-muted-custom{ color:var(--grey-500); }

/* Section spacing rhythm */
.section-pad{
  padding-top:56px;
  padding-bottom:56px;
}
@media (min-width:992px){
  .section-pad{
    padding-top:80px;
    padding-bottom:80px;
  }
}

/* Reusable eyebrow / label */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12.5px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--teal-400);
  background:rgba(23,179,163,0.12);
  padding:6px 14px;
  border-radius:var(--radius-pill);
}

/* Buttons */
.btn-showfa{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-family:var(--font-body);
  font-weight:600;
  font-size:15px;
  padding:12px 24px;
  border-radius:var(--radius-sm);
  border:1px solid transparent;
  transition:all .2s ease;
  white-space:nowrap;
  cursor:pointer;
}

.btn-showfa-primary{
  background:linear-gradient(180deg,var(--teal-500),var(--teal-600));
  color:var(--white);
  box-shadow:0 6px 18px rgba(2,146,139,0.28);
}
.btn-showfa-primary:hover{
  filter:brightness(1.06);
  color:var(--white);
  transform:translateY(-1px);
}

.btn-showfa-outline{
  background:transparent;
  border-color: var(--teal-600);
  color:var(--white);
}
.btn-showfa-outline i{
  color:var(--teal-600);
}
.btn-showfa-outline:hover{
  background:rgba(255,255,255,0.08);
  color:var(--white);
}

.btn-showfa-block{ width:100%; border-radius:50px }
