/* ============================================================
   Domain Launch Pad — styles
   Everything scoped under .dlp-root so the theme stays happy.
   Palette matched to launchkits.com: burnt red, cream, night
   navy, slate blue.
   ============================================================ */

.dlp-root {
	--dlp-red: #C8402F;
	--dlp-navy: #15161E;
	--dlp-navy-card: #1B1D29;
	--dlp-slate: #7E96A3;
	--dlp-cream: #EDE3D0;
	--dlp-cream-light: #F5EEE0;
	--dlp-ink: #1B1D29;
	--dlp-muted: #8A7F69;
	font-family: 'Poppins', system-ui, sans-serif;
	color: var(--dlp-ink);
	line-height: 1.5;
}
.dlp-root *, .dlp-root *::before, .dlp-root *::after { box-sizing: border-box; }
.dlp-root .dlp-display {
	font-family: 'Poppins', sans-serif;
	font-weight: 900;
	font-style: italic;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin: 0;
}

/* ---------- hero ---------- */
.dlp-hero {
	position: relative;
	background: var(--dlp-navy);
	text-align: center;
	padding: 56px 24px 24px;
	overflow: hidden;
	border-radius: 24px 24px 0 0;
}
.dlp-hero-eyebrow { color: var(--dlp-red); font-weight: 700; font-style: italic; font-size: 15px; margin-bottom: 12px; position: relative; }
.dlp-hero-title {
	color: #fff;
	font-size: clamp(30px, 5.5vw, 52px);
	line-height: 1.15;
	text-shadow: 3px 3px 0 var(--dlp-red);
	position: relative;
}
.dlp-hero-badge {
	display: inline-block;
	margin-top: 20px;
	padding: 6px 20px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 700;
	color: var(--dlp-cream);
	background: rgba(126, 150, 163, 0.25);
	border: 1px solid var(--dlp-slate);
	position: relative;
}

/* starfield */
.dlp-stars { position: absolute; inset: 0; pointer-events: none; }
.dlp-star { position: absolute; border-radius: 50%; opacity: 0.8; }
.dlp-sparkle { position: absolute; font-size: 13px; }
.dlp-moon {
	position: absolute;
	width: 220px; height: 220px;
	left: -90px; top: -110px;
	border-radius: 50%;
	background: var(--dlp-cream);
	opacity: 0.9;
	box-shadow: inset -18px -14px 0 rgba(0, 0, 0, 0.12);
}
.dlp-crater { position: absolute; border-radius: 50%; background: rgba(0, 0, 0, 0.11); }

/* ---------- stat cards ---------- */
.dlp-stats-band { background: var(--dlp-navy); padding: 12px 16px 40px; }
.dlp-stats {
	max-width: 760px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
}
.dlp-stat {
	border-radius: 18px;
	padding: 20px 16px;
	border: 1px solid rgba(237, 227, 208, 0.15);
}
.dlp-stat-navy { background: var(--dlp-navy-card); }
.dlp-stat-slate { background: var(--dlp-slate); }
.dlp-stat-num { font-family: 'Poppins', sans-serif; font-weight: 900; font-style: italic; font-size: 30px; color: #fff; }
.dlp-stat-label { font-size: 12px; font-weight: 600; margin-top: 4px; color: var(--dlp-cream); }
.dlp-stat-slate .dlp-stat-label { color: var(--dlp-navy); }

/* ---------- form on red band ---------- */
.dlp-form-band { background: var(--dlp-red); padding: 40px 16px; border-radius: 0 0 24px 24px; }
.dlp-root.dlp-no-hero .dlp-form-band { border-radius: 24px; }
.dlp-card {
	max-width: 640px;
	margin: 0 auto;
	background: var(--dlp-cream);
	border-radius: 28px;
	padding: 28px;
	box-shadow: 0 14px 30px rgba(0, 0, 0, 0.18);
}
.dlp-card h2.dlp-display { color: var(--dlp-navy); font-size: 24px; margin-bottom: 4px; }
.dlp-card-sub { font-style: italic; font-size: 14px; color: var(--dlp-muted); margin: 0 0 20px; }
.dlp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.dlp-field { display: block; }
.dlp-label {
	display: block;
	font-size: 12px;
	font-weight: 700;
	font-style: italic;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	color: var(--dlp-navy);
}
.dlp-input {
	margin-top: 4px;
	width: 100%;
	border: 2px solid rgba(27, 29, 41, 0.25);
	border-radius: 14px;
	padding: 10px 16px;
	background: var(--dlp-cream-light);
	color: var(--dlp-ink);
	font-family: inherit;
	font-size: 15px;
	outline: none;
}
.dlp-input:focus { border-color: var(--dlp-red); }
.dlp-hint { font-size: 12px; font-style: italic; color: var(--dlp-muted); }

.dlp-toggle-box {
	margin-top: 20px;
	padding: 16px;
	border-radius: 18px;
	background: var(--dlp-cream-light);
	border: 2px solid rgba(27, 29, 41, 0.15);
}
.dlp-pill-btn {
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	font-style: italic;
	padding: 8px 16px;
	border-radius: 999px;
	border: 2px solid var(--dlp-navy);
	background: transparent;
	color: var(--dlp-navy);
	cursor: pointer;
	margin: 4px 8px 0 0;
}
.dlp-pill-btn.dlp-active { background: var(--dlp-navy); color: var(--dlp-cream); }
.dlp-owner-field { margin-top: 16px; max-width: 280px; display: none; }
.dlp-owner-field.dlp-show { display: block; }

.dlp-launch-btn {
	font-family: 'Poppins', sans-serif;
	font-weight: 900;
	font-style: italic;
	text-transform: uppercase;
	letter-spacing: 1px;
	width: 100%;
	margin-top: 24px;
	padding: 16px;
	border-radius: 999px;
	border: none;
	color: #fff;
	font-size: 20px;
	background: #B9AE99;
	cursor: not-allowed;
}
.dlp-launch-btn.dlp-ready {
	background: var(--dlp-red);
	cursor: pointer;
	box-shadow: 4px 4px 0 var(--dlp-navy);
}
.dlp-launch-btn.dlp-ready:active { transform: translate(2px, 2px); box-shadow: 2px 2px 0 var(--dlp-navy); }
.dlp-ready-hint { text-align: center; font-size: 12px; font-style: italic; color: var(--dlp-muted); margin-top: 8px; }

/* ---------- results ---------- */
.dlp-results { max-width: 640px; margin: 0 auto; padding: 40px 16px; }
.dlp-section {
	background: var(--dlp-cream-light);
	border: 2px solid rgba(27, 29, 41, 0.35);
	border-radius: 24px;
	overflow: hidden;
	margin-bottom: 24px;
}
.dlp-section-top { border: 3px solid var(--dlp-navy); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12); }
.dlp-section-head {
	background: var(--dlp-navy);
	padding: 14px 20px;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
}
.dlp-section-head.dlp-head-slate { background: var(--dlp-slate); }
.dlp-section-title { font-size: 16px; color: #fff; }
.dlp-section-top .dlp-section-title { font-size: 20px; text-shadow: 2px 2px 0 var(--dlp-red); }
.dlp-head-slate .dlp-section-title { color: var(--dlp-navy); }
.dlp-section-blurb { font-size: 12px; font-style: italic; color: var(--dlp-slate); }
.dlp-head-slate .dlp-section-blurb { color: var(--dlp-navy-card); }
.dlp-section-tag { margin-left: auto; font-size: 11px; font-weight: 700; font-style: italic; color: var(--dlp-cream); }

.dlp-row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 20px;
	border-bottom: 1px solid rgba(27, 29, 41, 0.12);
}
.dlp-row:last-child { border-bottom: none; }
.dlp-row-main { flex: 1; min-width: 0; }
.dlp-domain { font-weight: 700; font-size: 17px; color: var(--dlp-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dlp-domain .dlp-tld { color: #A89F8C; }
.dlp-note { font-size: 12px; font-style: italic; color: var(--dlp-muted); margin-top: 2px; }
.dlp-chars { font-size: 12px; color: #A89F8C; white-space: nowrap; }
.dlp-copy-btn, .dlp-check-btn {
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	font-style: italic;
	letter-spacing: 0.5px;
	padding: 6px 16px;
	border-radius: 999px;
	white-space: nowrap;
	cursor: pointer;
	text-decoration: none;
}
.dlp-copy-btn { border: 2px solid var(--dlp-navy); background: transparent; color: var(--dlp-navy); }
.dlp-copy-btn.dlp-copied { background: var(--dlp-navy); color: var(--dlp-cream); }
.dlp-check-btn { border: none; background: var(--dlp-red); color: #fff; }
.dlp-check-btn:hover { color: #fff; }

.dlp-results-bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; gap: 12px; flex-wrap: wrap; }
.dlp-count { font-size: 14px; font-weight: 700; font-style: italic; color: var(--dlp-navy); }

/* pro tip */
.dlp-tip {
	position: relative;
	overflow: hidden;
	border-radius: 24px;
	background: var(--dlp-navy);
	color: var(--dlp-cream);
	padding: 24px;
	font-size: 14px;
}
.dlp-tip .dlp-display { display: block; font-size: 16px; color: #fff; text-shadow: 2px 2px 0 var(--dlp-red); margin-bottom: 8px; position: relative; }
.dlp-tip-body { position: relative; }
.dlp-tip b { color: #fff; }

.dlp-empty { text-align: center; font-style: italic; font-size: 14px; color: var(--dlp-muted); padding: 40px 16px; }

/* focus + motion */
.dlp-root button:focus-visible, .dlp-root a:focus-visible, .dlp-root input:focus-visible {
	outline: 3px solid var(--dlp-red);
	outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
	.dlp-root * { transition: none !important; }
}

/* mobile */
@media (max-width: 560px) {
	.dlp-grid { grid-template-columns: 1fr; }
	.dlp-stats { grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
	.dlp-stat { padding: 14px 10px; }
	.dlp-stat-num { font-size: 22px; }
	.dlp-chars { display: none; }
	.dlp-row { padding: 12px 14px; }
	.dlp-section-tag { display: none; }
}
