/* ── Company Scanner CSS — matches /dcode-scanner/ design system ── */

/* Variables inherited from sc-page or redeclared for standalone results page */
.sc-results {
	--sc-accent:       #CDFF1A;
	--sc-accent-s:     #D8FF3A;
	--sc-accent-soft:  rgba(205,255,26,0.16);
	--sc-accent-line:  rgba(205,255,26,0.32);
	--sc-bg-0:         #07090A;
	--sc-bg-1:         #0B0F0D;
	--sc-bg-2:         #10160F;
	--sc-surface:      #131A14;
	--sc-surface-2:    #19221B;
	--sc-border:       rgba(255,255,255,0.08);
	--sc-border-s:     rgba(255,255,255,0.14);
	--sc-fg:           #F2F5EE;
	--sc-fg-dim:       #B7C0B2;
	--sc-fg-mute:      #7E8A7A;
	--sc-r:            16px;
	--sc-r-lg:         22px;
	--sc-r-pill:       999px;
	--sc-maxw:         1240px;

	background: var(--sc-bg-0);
	color: var(--sc-fg);
	font-family: 'Manrope', 'Inter', system-ui, sans-serif;
	-webkit-font-smoothing: antialiased;
	min-height: 60vh;
}

.sc-results * { box-sizing: border-box }

.sc-res-wrap {
	max-width: var(--sc-maxw);
	margin: 0 auto;
	padding: 0 32px;
}

/* ── Shared type reuse from sc-page ── */
.sc-results .sc-display       { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; letter-spacing: -0.02em; line-height: 1.0; color: var(--sc-fg) }
.sc-results .sc-h2            { font-size: clamp(28px,3.5vw,48px) }
.sc-results .sc-lead          { color: var(--sc-fg-dim); font-size: 16px; max-width: 54ch }
.sc-results .sc-eyebrow       { display: inline-flex; align-items: center; gap: 10px; font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--sc-accent) }
.sc-results .sc-eyebrow::before { content: ""; display: block; width: 20px; height: 2px; background: var(--sc-accent); border-radius: 2px }

/* Buttons reused */
.sc-results .sc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 20px; border-radius: var(--sc-r-pill); font-weight: 600; font-size: 14px; transition: transform .15s, background .15s; white-space: nowrap; cursor: pointer; border: 0; font-family: inherit }
.sc-results .sc-btn-primary   { background: var(--sc-accent); color: #0B0F0D; box-shadow: 0 12px 30px -12px rgba(205,255,26,0.55) }
.sc-results .sc-btn-primary:hover { background: var(--sc-accent-s); transform: translateY(-1px) }
.sc-results .sc-btn-ghost     { background: transparent; color: var(--sc-fg); border: 1px solid var(--sc-border-s) }
.sc-results .sc-btn-ghost:hover { border-color: var(--sc-accent-line) }
.sc-results .sc-arr           { display: inline-block; transition: transform .15s }
.sc-results .sc-btn:hover .sc-arr { transform: translateX(3px) }

/* ── Header ── */
.sc-res-header {
	padding: 60px 0 40px;
	border-bottom: 1px solid var(--sc-border);
	background: linear-gradient(180deg, var(--sc-bg-1) 0%, var(--sc-bg-0) 100%);
}
.sc-res-header h1 { margin: 12px 0 0 }
.sc-res-date {
	display: flex; align-items: center; gap: 8px;
	margin-top: 14px; color: var(--sc-fg-mute);
	font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: 0.06em;
}

/* ── Overall score ── */
.sc-res-overall { padding: 64px 0; border-bottom: 1px solid var(--sc-border) }

.sc-res-score-wrap {
	display: grid; grid-template-columns: 200px 1fr; gap: 60px; align-items: center;
}

.sc-res-circle {
	position: relative; width: 160px; height: 160px; flex-shrink: 0;
}
.sc-res-svg { width: 100%; height: 100%; transform: rotate(-90deg) }
.sc-res-track   { fill: none; stroke: rgba(255,255,255,0.06); stroke-width: 10 }
.sc-res-progress {
	fill: none;
	stroke: var(--circle-color, #CDFF1A);
	stroke-width: 10;
	stroke-linecap: round;
	stroke-dasharray: 408;
	stroke-dashoffset: var(--dash-offset, 0);
	transition: stroke-dashoffset 1.2s cubic-bezier(.4,0,.2,1);
}
.sc-res-number {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	font-family: 'Bricolage Grotesque', sans-serif;
	font-weight: 800; font-size: 48px; letter-spacing: -0.03em;
}
.sc-res-denom {
	position: absolute; bottom: 26px; left: 0; right: 0;
	text-align: center; color: var(--sc-fg-mute);
	font-family: 'JetBrains Mono', monospace; font-size: 12px;
}

.sc-res-label  { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; font-size: 22px; margin-bottom: 10px }
.sc-res-verdict .sc-lead { margin: 0 0 24px }

.sc-res-sub-scores { display: flex; flex-direction: column; gap: 12px }
.sc-sub-score { display: flex; align-items: center; gap: 12px }
.sc-sub-label { font-size: 13px; color: var(--sc-fg-dim); width: 100px; flex-shrink: 0; font-family: 'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 0.06em }
.sc-sub-bar   { flex: 1; height: 6px; background: rgba(255,255,255,0.06); border-radius: 99px; overflow: hidden }
.sc-sub-fill  { height: 100%; border-radius: 99px; transition: width 1s cubic-bezier(.4,0,.2,1) }
.sc-sub-val   { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; font-size: 16px; width: 28px; text-align: right }

/* ── Cards ── */
.sc-res-cards { padding: 64px 0; border-bottom: 1px solid var(--sc-border) }
.sc-res-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px }

.sc-res-card {
	--card-color: #FF6B6B;
	background: linear-gradient(180deg, var(--sc-surface-2, #19221B), var(--sc-surface, #131A14));
	border: 1px solid var(--sc-border);
	border-top: 3px solid var(--card-color);
	border-radius: var(--sc-r-lg); padding: 28px 24px;
	display: flex; flex-direction: column; gap: 20px;
}

.sc-res-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px }
.sc-res-card-title { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700; font-size: 20px; letter-spacing: -0.01em; margin: 0 }
.sc-res-card-score { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; font-size: 32px; letter-spacing: -0.03em; flex-shrink: 0 }
.sc-res-card-score span { font-size: 14px; font-weight: 500; color: var(--sc-fg-mute); margin-left: 2px }

.sc-res-items { display: flex; flex-direction: column; gap: 10px; flex: 1 }
.sc-res-item {
	display: flex; align-items: center; gap: 10px;
	font-size: 13.5px; padding: 8px 0;
	border-bottom: 1px solid var(--sc-border); color: var(--sc-fg-dim);
}
.sc-res-item:last-child { border-bottom: 0 }
.sc-res-item svg { flex-shrink: 0 }
.sc-res-item.sc-ok   { color: var(--sc-fg-dim) }
.sc-res-item.sc-ok svg { color: #A6F432 }
.sc-res-item.sc-bad  { color: var(--sc-fg-mute) }
.sc-res-item.sc-bad svg { color: #FF6B6B }
.sc-res-item.sc-warn svg { color: #f39c12 }
.sc-res-item.sc-res-item-info { color: var(--sc-fg); font-weight: 500 }
.sc-res-item.sc-res-item-info svg { color: var(--sc-accent) }

.sc-res-rec {
	background: rgba(255,255,255,0.03); border: 1px solid var(--sc-border);
	border-radius: 10px; padding: 12px 14px;
	font-size: 13px; color: var(--sc-fg-dim); line-height: 1.5;
}

/* ── CTA section ── */
.sc-res-cta-section { padding: 64px 0 80px }

.sc-res-cta {
	position: relative;
	background:
		radial-gradient(50% 60% at 90% 10%, rgba(205,255,26,0.07), transparent 60%),
		linear-gradient(180deg, var(--sc-surface, #131A14), var(--sc-bg-1, #0B0F0D));
	border: 1px solid var(--sc-border-s);
	border-radius: 24px; padding: 52px 56px; margin-bottom: 28px;
}
.sc-res-cta::before {
	content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none;
	background: linear-gradient(135deg, rgba(205,255,26,0.32), transparent 30%);
	-webkit-mask: linear-gradient(#000,#000) content-box, linear-gradient(#000,#000);
	-webkit-mask-composite: xor; mask-composite: exclude; padding: 1px; opacity: 0.6;
}

.sc-res-email-box {
	background: var(--sc-surface); border: 1px solid var(--sc-border);
	border-radius: var(--sc-r-lg); padding: 24px 28px;
}
.sc-res-email-row { display: flex; gap: 12px; align-items: stretch }

/* sc-field reuse for results page */
.sc-results .sc-field {
	display: flex; align-items: center; gap: 10px;
	background: #0A0E0B; border: 1px solid var(--sc-border-s);
	border-radius: 12px; padding: 12px 14px;
}
.sc-results .sc-field input { flex: 1; background: transparent; border: 0; outline: 0; color: var(--sc-fg); font: 500 14px/1.2 'Manrope', sans-serif }
.sc-results .sc-field input::placeholder { color: var(--sc-fg-mute) }
.sc-results .sc-field:focus-within { border-color: var(--sc-accent) }
.sc-field-icon { color: var(--sc-fg-mute); flex-shrink: 0 }

/* ── NIP spinner (on scanner form page) ── */
.sc-spinner {
	position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
	width: 18px; height: 18px;
	border: 2px solid rgba(205,255,26,0.2);
	border-top-color: var(--sc-accent, #CDFF1A);
	border-radius: 50%;
	animation: sc-spin 0.7s linear infinite;
	pointer-events: none;
}
@keyframes sc-spin { to { transform: translateY(-50%) rotate(360deg) } }

/* Clean rotation (no translateY) — used by overlay spinners and inline status icons */
@keyframes sc-spin-clean { to { transform: rotate(360deg) } }

/* ── Consent checkbox ── */
.sc-consent {
	display: flex; align-items: flex-start; gap: 12px;
	padding: 14px; border: 1px solid var(--sc-border);
	border-radius: 12px; cursor: pointer; margin-top: 4px;
}
.sc-consent input[type="checkbox"] {
	width: 18px; height: 18px; flex-shrink: 0; margin-top: 2px;
	accent-color: var(--sc-accent, #CDFF1A);
	cursor: pointer;
}
.sc-consent span { font-size: 13px; color: var(--sc-fg-dim); line-height: 1.5 }

/* ── Responsive ── */
@media (max-width: 960px) {
	.sc-res-cards-grid { grid-template-columns: 1fr }
	.sc-res-score-wrap { grid-template-columns: 1fr; gap: 36px }
	.sc-res-circle     { margin: 0 auto }
}
@media (max-width: 640px) {
	.sc-res-wrap    { padding: 0 20px }
	.sc-res-cta     { padding: 36px 24px }
	.sc-res-header  { padding: 40px 0 28px }
	.sc-res-email-row { flex-direction: column }
}

/* ── Scan progress bar ──────────────────────────────────────────────── */
.sc-page .sc-progress { margin-top: 16px }
.sc-page .sc-progress-head {
	display: flex; justify-content: space-between; align-items: baseline;
	margin-bottom: 8px;
	font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 12px;
}
.sc-page .sc-progress-step { color: var(--sc-fg-dim) }
.sc-page .sc-progress-pct  { color: var(--sc-accent); font-weight: 600 }
.sc-page .sc-progress-track {
	height: 8px; border-radius: 99px; overflow: hidden;
	background: rgba(255,255,255,0.08);
	border: 1px solid var(--sc-accent-line);
}
.sc-page .sc-progress-bar {
	height: 100%; width: 0%; border-radius: 99px;
	background: linear-gradient(90deg, var(--sc-accent), var(--sc-accent-s));
	box-shadow: 0 0 16px var(--sc-accent-soft);
	transition: width .45s cubic-bezier(.25,.8,.35,1);
}
.sc-page .sc-progress-bar.is-done { transition: width .25s ease }
@media (prefers-reduced-motion: reduce) {
	.sc-page .sc-progress-bar { transition: none }
}