/* Shared design tokens for inspectionreporttemplate.com
   Matches the import-template page exactly. */

body { font-family: 'Inter', sans-serif; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.font-display { font-family: 'Inter', sans-serif; letter-spacing: -0.04em; }
.font-serif-i { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; letter-spacing: -0.01em; }
::selection { background: #22D3EE; color: #0B1220; }

/* Hero radial glow (cyan + violet wash) */
.hero-glow { position: relative; }
.hero-glow::before {
  content:""; position:absolute; inset:auto -10% 0 auto;
  width:900px; height:900px;
  background:radial-gradient(circle, rgba(34,211,238,.22), transparent 60%);
  filter:blur(20px); pointer-events:none; z-index:0;
}
.hero-glow::after {
  content:""; position:absolute; inset:-20% auto auto -10%;
  width:600px; height:600px;
  background:radial-gradient(circle, rgba(124,58,237,.10), transparent 60%);
  filter:blur(30px); pointer-events:none; z-index:0;
}

/* Dot grid background */
.dot-grid {
  background-image: radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 24px 24px;
}

/* Subtle scanline overlay */
.scan { position: relative; }
.scan::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(0deg, transparent 0, transparent 3px, rgba(34,211,238,.025) 3px, rgba(34,211,238,.025) 4px);
  mix-blend-mode:overlay; border-radius:inherit;
}

/* FAQ details */
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
details[open] .faq-plus { transform: rotate(45deg); }

/* Interactive SVG defect/flow diagrams: hover highlight */
.svg-interactive [data-node] { transition: all .2s ease; cursor: pointer; }
.svg-interactive [data-node]:hover { filter: brightness(1.4) drop-shadow(0 0 8px rgba(34,211,238,.6)); }

/* ============ Signup modal — guaranteed styles (no Tailwind dependency) ============ */
.modal-bg {
  position: fixed; inset: 0; z-index: 100;
  background: rgba(9, 9, 11, 0.82);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  display: none; align-items: center; justify-content: center;
  padding: 8px;
}
.modal-bg.flex { display: flex !important; }
.modal-bg.hidden { display: none !important; }
@media (min-width: 640px) { .modal-bg { padding: 16px; } }

.modal-bg > div {
  background: #18181b;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 25px 50px -12px rgba(0,0,0,.6);
  max-width: 32rem;
  width: 100%;
  position: relative;
  display: flex; flex-direction: column;
  max-height: min(92vh, 720px);
}

/* Modal header */
.modal-bg > div > div:first-child {
  padding: 20px 20px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  flex-shrink: 0;
}
@media (min-width: 640px) { .modal-bg > div > div:first-child { padding: 20px 24px 12px; } }

/* Modal body (scrollable) */
.modal-bg > div > div:nth-child(2) {
  overflow-y: auto; flex: 1 1 auto;
  padding: 16px 20px;
  -webkit-overflow-scrolling: touch;
}
@media (min-width: 640px) { .modal-bg > div > div:nth-child(2) { padding: 16px 24px; } }

/* Modal footer (sticky) */
.modal-bg > div > div:last-child:not(:nth-child(-n+2)) {
  padding: 12px 20px 16px;
  border-top: 1px solid rgba(255,255,255,0.06);
  flex-shrink: 0;
  background: #18181b;
}

/* Form layout inside modal */
#signupForm { display: flex; flex-direction: column; gap: 12px; margin-top: 16px; }
#signupForm label { display: block; }
#signupForm input, #signupForm select {
  width: 100%; box-sizing: border-box;
  margin-top: 4px;
  background: #09090b;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 14px;
  color: #fff;
  font-family: inherit;
}
#signupForm input::placeholder { color: #52525b; }
#signupForm input:focus, #signupForm select:focus {
  outline: none;
  border-color: #22d3ee;
  box-shadow: 0 0 0 3px rgba(34,211,238,0.20);
}
#signupSubmit {
  width: 100%;
  padding: 12px 20px;
  border-radius: 10px;
  background: linear-gradient(135deg, #22d3ee, #0891b2);
  color: #0b1220;
  font-weight: 600;
  font-size: 15px;
  border: none;
  cursor: pointer;
  font-family: inherit;
}
#signupSubmit:hover:not(:disabled) { filter: brightness(1.08); }
#signupSubmit:disabled { opacity: 0.7; cursor: wait; }
#signupErr { color: #fca5a5; font-size: 13px; padding: 8px 0; }
.modal-bg button[aria-label="Close"] {
  flex-shrink: 0;
  width: 36px; height: 36px;
  background: transparent; border: none;
  border-radius: 8px;
  color: #a1a1aa;
  font-size: 26px; line-height: 1;
  cursor: pointer;
  display: grid; place-items: center;
}
.modal-bg button[aria-label="Close"]:hover { background: rgba(255,255,255,0.08); color: #fff; }

/* Mobile tweaks */
@media (max-width: 480px) {
  .modal-bg > div { max-height: 96vh; border-radius: 14px; }
  .modal-bg > div > div:first-child { padding: 16px 16px 10px; }
  .modal-bg > div > div:nth-child(2) { padding: 12px 16px; }
}