/* ============================================
   META TEAM — BASE / RESET
   ============================================ */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--font-body);
  color:var(--text);
  background:var(--bg);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
input,select,textarea{ font-family:inherit; font-size:inherit; }

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:800;
  line-height:1.12;
  letter-spacing:-0.01em;
  color:var(--text);
}
h1{ font-size:var(--fs-h1); }
h2{ font-size:var(--fs-h2); }
h3{ font-size:var(--fs-h3); }
h4{ font-size:var(--fs-h4); font-weight:700; }
p{ font-size:var(--fs-body); color:var(--text-soft); }

:focus-visible{
  outline:3px solid var(--orange-500);
  outline-offset:2px;
  border-radius:2px;
}

.container{
  max-width:var(--container);
  margin:0 auto;
  padding:0 32px;
}
.container-narrow{
  max-width:var(--container-narrow);
  margin:0 auto;
  padding:0 32px;
}
@media (max-width:680px){
  .container,.container-narrow{ padding:0 20px; }
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:var(--fs-eyebrow);
  font-weight:800;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--orange-600);
}
.eyebrow::before{
  content:"";
  width:22px;
  height:2px;
  background:var(--orange-500);
  display:inline-block;
}
.eyebrow.on-dark{ color:var(--orange-500); }

.section{ padding:96px 0; }
.section-tight{ padding:64px 0; }
@media (max-width:780px){
  .section{ padding:64px 0; }
  .section-tight{ padding:44px 0; }
}
.section.dark{ background:var(--navy-900); color:var(--text-on-dark); }
.section.dark p{ color:var(--text-on-dark-soft); }
.section.dark h1,.section.dark h2,.section.dark h3,.section.dark h4{ color:var(--white); }
.section.alt{ background:var(--bg-alt); }

.lede{
  font-size:var(--fs-body-lg);
  color:var(--text-soft);
  max-width:760px;
}
.section.dark .lede{ color:var(--text-on-dark-soft); }

.section-head{
  margin-bottom:48px;
  max-width:760px;
}
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head h2{ margin-top:14px; }

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  font-size:0.98rem;
  padding:14px 28px;
  border-radius:999px;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
  white-space:nowrap;
}
.btn-primary{
  background:linear-gradient(95deg,var(--orange-600),var(--orange-500));
  color:var(--navy-900);
  box-shadow:0 6px 20px rgba(250,120,0,0.30);
}
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 10px 28px rgba(250,120,0,0.40); }
.btn-ghost{
  background:transparent;
  color:var(--text);
  border:1.5px solid var(--navy-300);
}
.btn-ghost:hover{ border-color:var(--navy-900); background:var(--navy-50); }
.section.dark .btn-ghost{ color:var(--white); border-color:var(--navy-500); }
.section.dark .btn-ghost:hover{ border-color:var(--white); background:rgba(255,255,255,0.06); }
.btn-link{
  font-weight:700;
  color:var(--navy-900);
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-bottom:2px solid var(--orange-500);
  padding-bottom:2px;
  transition:gap .2s var(--ease);
}
.btn-link:hover{ gap:11px; }
.section.dark .btn-link{ color:var(--white); }
.btn-sm{ padding:10px 20px; font-size:0.88rem; }

/* Octagon shape utility (Pectus motif) */
.pectus{
  clip-path: polygon(29% 0%, 71% 0%, 100% 29%, 100% 71%, 71% 100%, 29% 100%, 0% 29%, 0% 71%);
}

.tag-chip{
  display:inline-block;
  padding:6px 14px;
  border-radius:999px;
  font-size:var(--fs-micro);
  font-weight:700;
  letter-spacing:0.04em;
  text-transform:uppercase;
  background:var(--navy-50);
  color:var(--navy-700);
}

.skip-link{
  position:absolute; left:-999px; top:0;
  background:var(--navy-900); color:#fff; padding:12px 20px; z-index:999;
}
.skip-link:focus{ left:12px; top:12px; }

.divider{ height:1px; background:var(--border); border:0; }
.section.dark .divider{ background:rgba(255,255,255,0.14); }

::selection{ background:var(--orange-300); color:var(--navy-900); }

.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
