*{box-sizing:border-box}

:root{
  --tf-bg:#07120f;
  --tf-bg-soft:#10231b;
  --tf-bg-card:#13251b;
  --tf-green:#8fa85a;
  --tf-green-soft:#1a3023;
  --tf-orange:#f28c28;
  --tf-white:#ffffff;
  --tf-muted:#cbd5d1;
  --tf-soft-muted:#94a3b8;
  --tf-line:rgba(255,255,255,.14);
  --tf-shadow:0 22px 60px rgba(0,0,0,.22);
  --tf-radius:24px;
  --tf-radius-sm:14px;
  --tf-wrap:1180px;
}

html{scroll-behavior:smooth}

body{
  margin:0;
  font-family:Inter,Arial,sans-serif;
  background:var(--tf-bg);
  color:var(--tf-white);
}

a{color:inherit}

.tf-wrap{
  max-width:var(--tf-wrap);
  margin:0 auto;
  padding:24px 24px 72px;
}

.tf-header{
  min-height:104px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-bottom:1px solid var(--tf-line);
  padding-bottom:18px;
}

.tf-brand{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
}

.tf-logo{
  height:112px !important;
  width:auto !important;
  max-width:360px;
  object-fit:contain;
  display:block;
}

.tf-nav{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
}

.tf-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  border-radius:var(--tf-radius-sm);
  padding:12px 16px;
  text-decoration:none;
  font-weight:900;
  border:0;
  cursor:pointer;
  transition:.2s ease;
  white-space:nowrap;
  font-size:14px;
}

.tf-btn:hover{transform:translateY(-1px)}

.tf-btn-primary{
  background:var(--tf-orange);
  color:var(--tf-white);
  box-shadow:0 12px 28px rgba(242,140,40,.22);
}

.tf-btn-secondary{
  background:var(--tf-bg-soft);
  color:var(--tf-white);
  border:1px solid var(--tf-line);
}

.tf-btn-back{
  background:transparent;
  color:var(--tf-muted);
  border:1px solid var(--tf-line);
}

.tf-hero{
  text-align:center;
  padding:42px 0 34px;
}

.tf-eyebrow{
  color:var(--tf-orange);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.14em;
  margin:0 0 12px;
}

.tf-title{
  font-size:48px;
  line-height:1.06;
  margin:0 0 16px;
  letter-spacing:-.04em;
}

.tf-lead{
  color:var(--tf-muted);
  font-size:18px;
  line-height:1.6;
  max-width:820px;
  margin:0 auto;
}

.tf-section{margin-top:50px}

.tf-section-title{
  font-size:34px;
  margin:0 0 18px;
  letter-spacing:-.03em;
}

.tf-grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  align-items:stretch;
}

.tf-card{
  background:var(--tf-bg-card);
  border:1px solid var(--tf-line);
  border-radius:var(--tf-radius);
  padding:24px;
  box-shadow:var(--tf-shadow);
}

.tf-card-highlight{
  background:var(--tf-green-soft);
  border:2px solid var(--tf-orange);
}

.tf-card-title{
  font-size:22px;
  margin:0 0 10px;
}

.tf-card-text{
  color:var(--tf-muted);
  line-height:1.6;
  margin:0;
}

.tf-footer{
  margin-top:64px;
  border-top:1px solid var(--tf-line);
  padding-top:24px;
  color:var(--tf-soft-muted);
  display:flex;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}

.tf-footer a{
  color:var(--tf-muted);
  text-decoration:none;
  font-weight:700;
}

.tf-modal{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.82);
  z-index:9999;
  align-items:center;
  justify-content:center;
  padding:24px;
}

.tf-modal.open{display:flex}

.tf-modal-card{
  width:min(560px,100%);
  background:var(--tf-bg-card);
  border:1px solid var(--tf-line);
  border-radius:24px;
  padding:28px;
  color:var(--tf-white);
  box-shadow:0 30px 90px rgba(0,0,0,.45);
}

.tf-modal-close{
  float:right;
  border:0;
  background:var(--tf-bg-soft);
  color:var(--tf-white);
  border-radius:12px;
  width:42px;
  height:42px;
  font-size:24px;
  cursor:pointer;
}

.tf-form{
  display:grid;
  gap:14px;
  margin-top:22px;
}

.tf-form label{
  display:grid;
  gap:7px;
  color:var(--tf-muted);
  font-weight:800;
}

.tf-form input{
  border:1px solid var(--tf-line);
  background:var(--tf-bg);
  color:var(--tf-white);
  border-radius:var(--tf-radius-sm);
  padding:14px;
  font-size:15px;
}

.tf-note{
  color:var(--tf-soft-muted);
  text-align:center;
  margin-top:28px;
}

.tf-success{
  margin-top:14px;
  color:var(--tf-green);
  font-weight:800;
}

@media(max-width:900px){
  .tf-grid-3{grid-template-columns:1fr}
  .tf-title{font-size:36px}
  .tf-logo{height:82px !important}
  .tf-header{align-items:flex-start;min-height:auto}
}
