/* ============ H+ GEO/AIO Suite — brand styles ============ */

:root {
  --hteal: #1AD2C4;
  --hamber: #FFAE19;
  --hcoral: #FF3E3E;
  --hpurple: #9433FF;
}

html { scroll-behavior: smooth; }

/* --- H+ plus-sign logo (4 rounded segments) --- */
.hplus-plus {
  position: relative;
  display: inline-block;
  width: 0.62em;
  height: 0.62em;
  transform: translateY(0.02em);
}
.hplus-plus .pp {
  position: absolute;
  width: 0.26em;
  height: 0.44em;
  border-radius: 0.13em;
}
.hplus-plus .pp-t { left: 0.18em; top: -0.06em; background: var(--hteal); }
.hplus-plus .pp-b { left: 0.18em; bottom: -0.06em; background: var(--hcoral); }
.hplus-plus .pp-l { left: -0.06em; top: 0.18em; width: 0.44em; height: 0.26em; background: var(--hamber); }
.hplus-plus .pp-r { right: -0.06em; top: 0.18em; width: 0.44em; height: 0.26em; background: var(--hpurple); }

/* --- gradient text --- */
.grad-text {
  background: linear-gradient(100deg, var(--hteal), var(--hpurple));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* --- login ambient glow --- */
.login-glow {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(600px 400px at 15% 20%, rgba(26, 210, 196, 0.10), transparent 60%),
    radial-gradient(600px 420px at 85% 80%, rgba(148, 51, 255, 0.12), transparent 60%),
    radial-gradient(400px 300px at 80% 15%, rgba(255, 174, 25, 0.06), transparent 60%);
}

/* --- loading plus spinner --- */
.loader-plus {
  position: relative;
  width: 56px;
  height: 56px;
  animation: loader-rot 1.6s linear infinite;
}
.loader-plus span {
  position: absolute;
  width: 20px;
  height: 32px;
  border-radius: 10px;
}
.loader-plus span:nth-child(1) { left: 18px; top: -4px; background: var(--hteal); }
.loader-plus span:nth-child(2) { left: -4px; top: 18px; width: 32px; height: 20px; background: var(--hamber); }
.loader-plus span:nth-child(3) { right: -4px; top: 18px; width: 32px; height: 20px; background: var(--hpurple); }
.loader-plus span:nth-child(4) { left: 18px; bottom: -4px; background: var(--hcoral); }
@keyframes loader-rot {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* --- score ring --- */
.score-ring { transform: rotate(-90deg); }
.score-ring .ring-bg { stroke: #26262B; }
.score-ring .ring-fg {
  stroke-linecap: round;
  transition: stroke-dashoffset 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

/* --- pillar progress bars --- */
.pillar-bar {
  height: 8px;
  border-radius: 9999px;
  background: #26262B;
  overflow: hidden;
}
.pillar-bar > div {
  height: 100%;
  border-radius: 9999px;
  transition: width 1s cubic-bezier(0.22, 1, 0.36, 1);
}

/* --- check accordion --- */
details.check-group summary { cursor: pointer; list-style: none; }
details.check-group summary::-webkit-details-marker { display: none; }
details.check-group summary .chev { transition: transform 0.25s ease; }
details.check-group[open] summary .chev { transform: rotate(180deg); }

/* --- status badges --- */
.badge-pass { color: #34d399; background: rgba(52, 211, 153, 0.1); border: 1px solid rgba(52, 211, 153, 0.25); }
.badge-warn { color: var(--hamber); background: rgba(255, 174, 25, 0.1); border: 1px solid rgba(255, 174, 25, 0.25); }
.badge-fail { color: var(--hcoral); background: rgba(255, 62, 62, 0.1); border: 1px solid rgba(255, 62, 62, 0.25); }

.impact-critical { color: var(--hcoral); }
.impact-high { color: var(--hamber); }
.impact-medium { color: var(--hteal); }
.impact-low { color: #9ca3af; }

/* fade-in for results */
.fade-up { animation: fadeUp 0.5s ease both; }
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

/* scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0A0A0B; }
::-webkit-scrollbar-thumb { background: #2c2c33; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #3a3a44; }

@media print {
  header, footer, #audit-hero form, #logout-btn { display: none !important; }
  body { background: #fff !important; color: #111 !important; }
}
