/* ── Solid Cyber Footer ─────────────────────────────── */
.scf {
  position: relative;
  background: url(/assets/imgs/section.jpg) no-repeat center center fixed;
  background-size: cover;
  color: #fff;
  overflow: hidden;
}

/* Three-stop overlay: photo breathes at top, seals dark at bottom */
.scf::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      175deg,
      rgba(6,6,16,.60) 0%,
      rgba(6,6,16,.82) 45%,
      rgba(6,6,16,.96) 100%
    );
  pointer-events: none;
  z-index: 0;
}

/* Noise grain — adds texture without covering the photo */
.scf::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 0;
  opacity: .5;
}

.scf > * { position: relative; z-index: 1; }

/* ── CTA zone ─────────────────────────────────────────── */
.scf-cta {
  padding: 8rem 0 7rem;
  position: relative;
}

/* Orange accent rule above headline */
.scf-overline {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1.4rem;
}
.scf-overline-rule {
  width: 32px;
  height: 2px;
  background: #e8620a;
  flex-shrink: 0;
}
.scf-overline-text {
  font-size: .63rem;
  font-weight: 800;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: #e8620a;
}

.scf-headline {
  font-size: clamp(1.9rem, 3.8vw, 2.8rem);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -.03em;
  color: #fff;
  margin-bottom: 1rem;
}
.scf-headline em {
  font-style: normal;
  color: rgba(255,255,255,.38);
}

.scf-sub {
  font-size: 1rem;
  font-weight: 500;
  color: rgba(255,255,255,.5);
  max-width: 380px;
  line-height: 1.6;
  margin-bottom: 2.25rem;
}

/* ── Buttons ──────────────────────────────────────────── */
.scf-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: #fff;
  color: #1a1a2e;
  font-size: .875rem;
  font-weight: 800;
  letter-spacing: .02em;
  padding: .8rem 1.75rem;
  border-radius: 6px;
  text-decoration: none;
  border: 2px solid #fff;
  transition: background .2s, color .2s, transform .18s;
}
.scf-btn-primary:hover {
  background: transparent;
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
}
.scf-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: transparent;
  color: rgba(255,255,255,.72);
  font-size: .875rem;
  font-weight: 700;
  letter-spacing: .02em;
  padding: .8rem 1.75rem;
  border-radius: 6px;
  text-decoration: none;
  border: 1.5px solid rgba(255,255,255,.25);
  transition: border-color .2s, color .2s, transform .18s;
}
.scf-btn-ghost:hover {
  border-color: rgba(255,255,255,.7);
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
}

/* ── Credentials panel — right side of CTA ───────────── */
.scf-creds {
  position: absolute;
  right: 14%;
  top: 60%;
  transform: translateY(-50%);
  width: 270px;
  text-align: center;
  pointer-events: none;
  z-index: 1;
}
@media (max-width: 991px) { .scf-creds { display: none; } }
.scf-creds-method {
  font-size: .78rem;
  font-style: italic;
  color: rgba(255,255,255,.32);
  line-height: 1.75;
  margin-bottom: 1.8rem;
  letter-spacing: .01em;
}
.scf-cert-logos {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
}
.scf-cert-logos img {
  height: 96px;
  width: auto;
  opacity: 1;
  transition: transform .2s;
}
.scf-cert-logos img:hover { transform: scale(1.06); pointer-events: all; }

/* ── Divider ──────────────────────────────────────────── */
.scf-rule {
  border: none;
  border-top: 1px solid rgba(255,255,255,.08);
  margin: 0;
}

/* ── Nav zone ─────────────────────────────────────────── */
.scf-nav {
  padding: 3.5rem 0 0;
}

.scf-col-label {
  font-size: .6rem;
  font-weight: 800;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: rgba(255,255,255,.28);
  margin-bottom: 1.1rem;
  display: block;
}
.scf-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.scf-links li { margin-bottom: .65rem; }
.scf-links a {
  font-size: .875rem;
  font-weight: 600;
  color: rgba(255,255,255,.58);
  text-decoration: none;
  transition: color .15s;
  position: relative;
}
.scf-links a::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 0;
  height: 1px;
  background: #e8620a;
  transition: width .22s ease;
}
.scf-links a:hover { color: #fff; text-decoration: none; }
.scf-links a:hover::after { width: 100%; }

/* ── Inline cert logos (below CTA buttons) ───────────── */
.scf-cert-inline {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-top: 2.5rem;
  padding-top: 1.75rem;
  border-top: 1px solid rgba(255,255,255,.07);
}
.scf-cert-inline img {
  height: 48px;
  width: auto;
  opacity: .5;
  transition: opacity .2s;
}
.scf-cert-inline img:hover { opacity: .9; }

/* ── Form controls inside footer ─────────────────────── */
.scf .form-control {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.15);
  color: #fff;
  border-radius: 6px;
  transition: background .15s, border-color .15s;
}
.scf .form-control:focus {
  background: rgba(255,255,255,.11);
  border-color: rgba(255,255,255,.38);
  box-shadow: none;
  color: #fff;
}
.scf .form-control::placeholder { color: rgba(255,255,255,.28); }
.scf select.form-control option { color: #1a1a2e; background: #fff; }
.scf .invalid-feedback { color: #ff8c5a; }
.scf .form-text { opacity: .65; }

/* ── Inline nav (sits beside form in the CTA zone) ────── */
.scf-nav-inline { margin-top: 3rem; }
@media (min-width: 992px) {
  .scf-nav-inline {
    margin-top: 4.5rem;
    padding-left: 3.5rem;
    border-left: 1px solid rgba(255,255,255,.07);
  }
}

/* ── Bottom bar ───────────────────────────────────────── */
.scf-bottom {
  border-top: 1px solid rgba(255,255,255,.06);
  margin-top: 3rem;
  padding: 1.35rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .75rem;
}
.scf-copy {
  font-size: .72rem;
  font-weight: 600;
  color: rgba(255,255,255,.22);
  margin: 0;
  letter-spacing: .01em;
}
.scf-legal { display: flex; gap: 1.75rem; }
.scf-legal a {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(255,255,255,.18);
  text-decoration: none;
  transition: color .15s;
}
.scf-legal a:hover { color: rgba(255,255,255,.5); }
