/* ============================================================
   FBI background check on a tight deadline (guide)
   Page: fbi-background-check-tight-deadline.html

   A guide, read top to bottom in one centred column (like the
   site's other guides): title, the short answer, then sections.
   It reads like a guide: why it happens (with a table of times),
   what has worked, how to do it (numbered steps), when it won't
   work, then booking and common questions. The only bold block is
   the navy call to action.
   Brand: navy #004c80, yellow #f5c842, Roboto.
   ============================================================ */

body.ftd-page {
  --ftd-navy: #004c80;
  --ftd-navy-deep: #00365c;
  --ftd-ink: #13293d;
  --ftd-text: #3b4856;
  --ftd-muted: #687583;
  --ftd-line: #dfe5ec;
  --ftd-sun: #f5c842;
  --ftd-sun-deep: #e8b830;

  background: #ffffff;
  color: var(--ftd-text);
  font-family: 'Roboto', sans-serif;
  -webkit-font-smoothing: antialiased;
}

body.ftd-page main {
  padding: 0;
  background: #ffffff;
}

.ftd-page main a {
  color: var(--ftd-navy);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.ftd-page main a:hover {
  color: var(--ftd-navy-deep);
  text-decoration-thickness: 2px;
}

.ftd-page a:focus-visible,
.ftd-page summary:focus-visible {
  outline: 3px solid var(--ftd-sun);
  outline-offset: 2px;
  border-radius: 4px;
}

.ftd-page [id] {
  scroll-margin-top: 88px;
}

.ftd-nowrap {
  white-space: nowrap;
}

/* ---- The guide column --------------------------------------- */
.ftd-guide {
  max-width: 768px;
  margin: 0 auto;
  /* bottom: the server adds the "Related guides" block right after */
  padding: 40px 24px 48px;
}

/* ---- Title and short answer --------------------------------- */
.ftd-crumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  font-size: 0.85rem;
  color: var(--ftd-muted);
}

.ftd-page .ftd-crumbs a {
  display: inline-block;
  padding: 6px 0;
  margin: -6px 0;
  color: var(--ftd-muted);
  text-decoration: none;
}

.ftd-page .ftd-crumbs a:hover {
  color: var(--ftd-navy);
  text-decoration: underline;
}

.ftd-head h1 {
  margin: 22px 0 0;
  font-size: clamp(2.05rem, 4.6vw, 2.9rem);
  font-weight: 800;
  line-height: 1.13;
  letter-spacing: -0.02em;
  color: var(--ftd-navy);
}

.ftd-updated {
  margin: 16px 0 0;
  font-size: 0.9rem;
  color: var(--ftd-muted);
}

.ftd-page .ftd-updated a {
  color: var(--ftd-text);
  text-decoration-color: rgba(59, 72, 86, 0.35);
}

.ftd-lead {
  margin: 28px 0 0;
  padding-top: 28px;
  border-top: 1px solid var(--ftd-line);
  font-size: 1.2rem;
  line-height: 1.7;
  color: var(--ftd-ink);
}

/* ---- Sections ----------------------------------------------- */
/* Spacing: 72px between sections (52px on phones), 14px from a
   heading to its text, 20px between paragraphs */
.ftd-section {
  margin-top: 72px;
}

.ftd-page .ftd-section h2,
.ftd-page .ftd-cta h2 {
  margin: 0 0 14px;
  font-size: clamp(1.45rem, 2.6vw, 1.75rem);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--ftd-ink);
}

.ftd-section > p {
  margin: 0 0 20px;
  font-size: 1.08rem;
  line-height: 1.75;
}

.ftd-section > p:last-child {
  margin-bottom: 0;
}

.ftd-section strong {
  color: var(--ftd-ink);
}

/* ---- Times table ------------------------------------------- */
.ftd-table {
  width: 100%;
  margin: 4px 0 0;
  border-collapse: collapse;
  font-size: 1.02rem;
  line-height: 1.55;
}

.ftd-table th,
.ftd-table td {
  padding: 13px 16px 13px 0;
  border-bottom: 1px solid var(--ftd-line);
  text-align: left;
  vertical-align: top;
}

.ftd-table thead th {
  padding-top: 0;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--ftd-muted);
  border-bottom-color: #c9d3de;
}

.ftd-table tbody th {
  width: 36%;
  font-weight: 600;
  color: var(--ftd-ink);
}

.ftd-page .ftd-table tbody th a {
  color: inherit;
  text-decoration-color: rgba(19, 41, 61, 0.35);
}

.ftd-page .ftd-table tbody th a:hover {
  color: var(--ftd-navy);
  text-decoration-color: currentColor;
}

.ftd-table tfoot th,
.ftd-table tfoot td {
  border-bottom: 0;
  font-weight: 700;
  color: var(--ftd-ink);
}

/* ---- Steps: numbered circles joined by a thin line ---------- */
.ftd-steps {
  list-style: none;
  counter-reset: ftd-step;
  margin: 10px 0 0;
  padding: 0;
}

.ftd-steps li {
  position: relative;
  counter-increment: ftd-step;
  padding: 0 0 26px 48px;
}

.ftd-steps li:last-child {
  padding-bottom: 0;
}

.ftd-steps li::before {
  content: counter(ftd-step);
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  border: 2px solid var(--ftd-navy);
  border-radius: 50%;
  background: #ffffff;
  color: var(--ftd-navy);
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 26px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.ftd-steps li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 14px;
  top: 36px;
  bottom: 6px;
  width: 2px;
  background: var(--ftd-line);
}

.ftd-page .ftd-steps h3 {
  margin: 3px 0 4px;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--ftd-ink);
}

.ftd-page .ftd-steps h3 a {
  color: var(--ftd-ink);
  text-decoration-color: rgba(19, 41, 61, 0.35);
}

.ftd-page .ftd-steps h3 a:hover {
  color: var(--ftd-navy);
  text-decoration-color: currentColor;
}

.ftd-steps p {
  margin: 0;
  font-size: 1.02rem;
  line-height: 1.65;
}

/* ---- Buttons ------------------------------------------------ */
.ftd-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}

.ftd-page .ftd-btn {
  display: inline-block;
  padding: 13px 26px;
  border: 2px solid transparent;
  border-radius: 999px;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.ftd-page .ftd-btn--primary {
  background: var(--ftd-navy);
  border-color: var(--ftd-navy);
  color: #ffffff;
}

.ftd-page .ftd-btn--primary:hover {
  background: var(--ftd-navy-deep);
  border-color: var(--ftd-navy-deep);
  color: #ffffff;
}

.ftd-page .ftd-btn--ghost {
  background: #ffffff;
  border-color: var(--ftd-navy);
  color: var(--ftd-navy);
}

.ftd-page .ftd-btn--ghost:hover {
  background: #eef4f9;
  color: var(--ftd-navy);
}

.ftd-page .ftd-btn--sun {
  background: var(--ftd-sun);
  border-color: var(--ftd-sun);
  color: var(--ftd-navy);
  font-weight: 700;
}

.ftd-page .ftd-btn--sun:hover {
  background: var(--ftd-sun-deep);
  border-color: var(--ftd-sun-deep);
  color: var(--ftd-navy);
}

.ftd-page .ftd-btn--line {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.55);
  color: #ffffff;
}

.ftd-page .ftd-btn--line:hover {
  border-color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

/* ---- FAQ: questions open and close -------------------------- */
.ftd-faq details {
  border-bottom: 1px solid var(--ftd-line);
}

.ftd-faq details:first-child {
  border-top: 1px solid var(--ftd-line);
}

.ftd-faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0;
  cursor: pointer;
  list-style: none;
}

.ftd-faq summary::-webkit-details-marker {
  display: none;
}

/* Plus that turns into a minus */
.ftd-faq summary::after {
  content: "";
  flex: none;
  width: 14px;
  height: 14px;
  background:
    linear-gradient(var(--ftd-navy), var(--ftd-navy)) center / 14px 2px no-repeat,
    linear-gradient(var(--ftd-navy), var(--ftd-navy)) center / 2px 14px no-repeat;
}

.ftd-faq details[open] summary::after {
  background: linear-gradient(var(--ftd-navy), var(--ftd-navy)) center / 14px 2px no-repeat;
}

.ftd-page .ftd-faq h3 {
  margin: 0;
  font-size: 1.08rem;
  font-weight: 700;
  line-height: 1.45;
  color: var(--ftd-ink);
}

.ftd-faq summary:hover h3 {
  color: var(--ftd-navy);
}

.ftd-faq details p {
  margin: -2px 0 0;
  padding: 0 34px 22px 0;
  font-size: 1.04rem;
  line-height: 1.7;
}

/* ---- Closing call to action --------------------------------- */
.ftd-cta {
  position: relative;
  overflow: hidden;
  margin-top: 72px;
  padding: 38px 38px 30px;
  border-radius: 18px;
  background-color: var(--ftd-navy);
  background-image: radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.10), transparent 55%);
  color: #ffffff;
}

/* Faint dotted ring, echoing the homepage hero graphic */
.ftd-cta::before {
  content: "";
  position: absolute;
  top: -110px;
  right: -110px;
  width: 260px;
  height: 260px;
  border: 2px dotted rgba(255, 255, 255, 0.18);
  border-radius: 50%;
  pointer-events: none;
}

.ftd-page .ftd-cta h2 {
  color: #ffffff;
}

.ftd-cta > p:not(.ftd-place) {
  position: relative;
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.88);
}

.ftd-cta .ftd-actions {
  margin-top: 26px;
}

.ftd-place {
  display: flex;
  gap: 8px;
  margin: 24px 0 0;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  font-size: 0.9rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.72);
}

.ftd-place svg {
  flex: none;
  margin-top: 2px;
  color: var(--ftd-sun);
}

.ftd-page .ftd-place a {
  color: rgba(255, 255, 255, 0.92);
  text-decoration-color: rgba(255, 255, 255, 0.4);
}

.ftd-page .ftd-place a:hover {
  color: #ffffff;
  text-decoration-color: #ffffff;
}

/* ============================================================
   Phones
   ============================================================ */
@media (max-width: 640px) {
  .ftd-guide {
    padding: 26px 16px 40px;
  }

  .ftd-lead {
    margin-top: 22px;
    padding-top: 22px;
    font-size: 1.08rem;
  }

  .ftd-section {
    margin-top: 52px;
  }

  .ftd-faq summary {
    padding: 16px 0;
  }

  .ftd-section > p {
    font-size: 1.03rem;
  }

  .ftd-steps li {
    padding-left: 44px;
  }

  .ftd-table {
    font-size: 0.97rem;
  }

  .ftd-table tbody th {
    width: 42%;
  }

  .ftd-actions .ftd-btn {
    width: 100%;
  }

  .ftd-cta {
    margin-top: 52px;
    padding: 30px 22px 24px;
  }

  .ftd-actions {
    margin-top: 28px;
  }

}

@media (prefers-reduced-motion: reduce) {
  .ftd-page *,
  .ftd-page *::before,
  .ftd-page *::after {
    transition: none !important;
  }
}

/* The two situations (requerimiento, visa deadline): a short list
   with navy dots, inside the reading column */
.ftd-cases-list {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
}

.ftd-cases-list li {
  position: relative;
  margin: 0 0 12px;
  padding-left: 22px;
  font-size: 1.08rem;
  line-height: 1.7;
}

.ftd-cases-list li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 0.72em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ftd-navy);
}

.ftd-cases-list strong {
  color: var(--ftd-ink);
}

@media (max-width: 640px) {
  .ftd-cases-list li {
    font-size: 1.03rem;
  }
}
