/* Lumina — neumorphism landing page
   Palette mirrors the app's NeuColors (Lumina Neo v2.0.0). */

:root {
	--bg: #E0E5EC;
	--light: #FFFFFF;
	--dark: #A3B1C6;
	--accent: #6D7FDB;
	--teal: #3AAFA9;
	--text: #4A5568;
	--muted: #7D8BA8;
	--hair: rgba(163, 177, 198, .45);
	--radius: 22px;
	--wrap: 1120px;
	--raise: -6px -6px 12px var(--light), 6px 6px 12px var(--dark);
	--raise-sm: -3px -3px 6px var(--light), 3px 3px 6px var(--dark);
	--inset: inset 4px 4px 8px var(--dark), inset -4px -4px 8px var(--light);
	--inset-sm: inset 2px 2px 4px var(--dark), inset -2px -2px 4px var(--light);
	color-scheme: light;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--bg: #2A2D32;
		--light: rgba(255, 255, 255, .08);
		--dark: rgba(0, 0, 0, .55);
		--accent: #8B9AF0;
		--teal: #4DD0C7;
		--text: #D5DAE5;
		--muted: #8D96AE;
		--hair: rgba(255, 255, 255, .08);
		color-scheme: dark;
	}
}

:root[data-theme="dark"] {
	--bg: #2A2D32;
	--light: rgba(255, 255, 255, .08);
	--dark: rgba(0, 0, 0, .55);
	--accent: #8B9AF0;
	--teal: #4DD0C7;
	--text: #D5DAE5;
	--muted: #8D96AE;
	--hair: rgba(255, 255, 255, .08);
	color-scheme: dark;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 88px; }

body {
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font-family: "M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", "Hiragino Sans", system-ui, sans-serif;
	font-size: 1rem;
	line-height: 1.8;
	-webkit-font-smoothing: antialiased;
	transition: background-color .3s, color .3s;
}

img { max-width: 100%; display: block; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

.wrap { width: min(var(--wrap), 100% - 32px); margin-inline: auto; }

.num { font-variant-numeric: tabular-nums; letter-spacing: .02em; }

/* ---------- neumorphic primitives ---------- */

.neu { background: var(--bg); border-radius: var(--radius); box-shadow: var(--raise); }
.neu-in { background: var(--bg); border-radius: var(--radius); box-shadow: var(--inset); }

.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	padding: .8em 1.5em;
	border: 0; border-radius: 16px;
	background: var(--bg); color: var(--text);
	font: inherit; font-weight: 700;
	box-shadow: var(--raise-sm);
	cursor: pointer;
	transition: box-shadow .15s, color .15s;
}
.btn:hover { text-decoration: none; color: var(--accent); }
.btn:active { box-shadow: var(--inset-sm); }
.btn:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* ---------- header ---------- */

.site-header {
	position: sticky; top: 0; z-index: 10;
	background: color-mix(in srgb, var(--bg) 88%, transparent);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}
.site-header .wrap { display: flex; align-items: center; gap: 16px; height: 72px; }

.brand { display: flex; align-items: center; gap: 12px; color: var(--text); font-weight: 800; font-size: 1.25rem; letter-spacing: .04em; }
.brand:hover { text-decoration: none; }
.brand img { width: 40px; height: 40px; border-radius: 12px; box-shadow: var(--raise-sm); }

.nav { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.nav a { color: var(--muted); font-size: .92rem; font-weight: 700; padding: .4em .8em; border-radius: 12px; }
.nav a:hover { color: var(--accent); text-decoration: none; }

.theme-toggle {
	width: 42px; height: 42px; padding: 0; border-radius: 14px; flex: none;
}
.theme-toggle svg { width: 20px; height: 20px; }
.theme-toggle .moon { display: none; }
:root[data-theme="dark"] .theme-toggle .sun { display: none; }
:root[data-theme="dark"] .theme-toggle .moon { display: block; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .theme-toggle .sun { display: none; }
	:root:not([data-theme="light"]) .theme-toggle .moon { display: block; }
}

@media (max-width: 720px) {
	.nav a { display: none; }
}

/* ---------- hero ---------- */

.hero { padding: 56px 0 96px; overflow-x: clip; }
.hero .wrap { display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center; }

.chip {
	display: inline-flex; align-items: center; gap: .5em;
	padding: .35em 1em; border-radius: 999px;
	box-shadow: var(--inset-sm);
	font-size: .82rem; font-weight: 700; color: var(--muted);
}
.chip .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--teal); }

.hero h1 {
	margin: 20px 0 16px;
	font-size: clamp(2.2rem, 5.2vw, 3.6rem);
	line-height: 1.3; font-weight: 800; letter-spacing: .01em;
}
.hero h1 em { font-style: normal; color: var(--accent); }
.hero .lead { font-size: 1.08rem; color: var(--muted); max-width: 34em; margin: 0 0 32px; }

.cta { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; }
.play-badge { display: inline-block; border-radius: 12px; }
.play-badge img { width: 200px; height: auto; margin: -10px; }
.cta-note { font-size: .82rem; color: var(--muted); }

@media (max-width: 880px) {
	.hero { padding-top: 32px; }
	.hero .wrap { grid-template-columns: 1fr; gap: 48px; }
}

/* ---------- phone mockup: Xperia 1 VIII ----------
   Body 74 x 162 mm, 6.5" 19.5:9 display, ~6 mm top/bottom bezels,
   ~2.4 mm sides, front camera in the top bezel (no punch hole). */

.phone {
	position: relative;
	width: min(300px, 80vw);
	margin-inline: auto;
	padding: 8.1% 3.2%;
	border-radius: 11% / 5%;
	background: #16181B;
	box-shadow:
		inset 0 0 0 1.5px #3A3D43,
		inset 0 0 0 3px #0E0F11,
		0 2px 4px rgba(0, 0, 0, .18),
		0 28px 48px -18px rgba(0, 0, 0, .45);
}
/* top bezel: camera (left), earpiece (center), sensor (right) */
.x-top { position: absolute; top: 0; left: 0; right: 0; height: 3.7%; pointer-events: none; }
.x-top i { position: absolute; top: 50%; transform: translate(-50%, -50%); }
.x-top .cam {
	left: 22%; width: 3.4%; aspect-ratio: 1; border-radius: 50%;
	background: radial-gradient(circle at 38% 38%, #33415E 0 16%, #080A0F 42%, #030405 72%);
	box-shadow: 0 0 0 1px #24272C;
}
.x-top .spk { left: 50%; width: 22%; height: 2px; border-radius: 1px; background: #050607; box-shadow: 0 0 0 .5px #2A2D32; }
.x-top .sensor { left: 71%; width: 1.4%; aspect-ratio: 1; border-radius: 50%; background: #0B0C0E; }
/* bottom speaker (front stereo) */
.phone::after {
	content: ""; position: absolute; left: 50%; bottom: 1.85%; transform: translate(-50%, 50%);
	width: 22%; height: 2px; border-radius: 1px; background: #050607; box-shadow: 0 0 0 .5px #2A2D32;
}
/* right-side keys: volume, power (fingerprint), shutter */
.x-key { position: absolute; right: -2px; width: 2px; border-radius: 0 2px 2px 0; background: linear-gradient(90deg, #1A1C1F, #4A4E55); }
.x-key.vol { top: 24%; height: 9%; }
.x-key.power { top: 38%; height: 6%; }
.x-key.shutter { top: 70%; height: 4.5%; }

.x-display {
	position: relative;
	aspect-ratio: 9 / 19.5;
	container-type: inline-size;
	display: flex; flex-direction: column;
	overflow: hidden;
	border-radius: 7% / 3.3%;
	background: var(--bg);
	color: var(--text);
}
.x-display > * { font-size: 4.6cqw; }

/* Android 16 system bars */
.x-status {
	display: flex; align-items: center; justify-content: space-between;
	padding: .75em 1.6em .3em;
	font-size: 3.5cqw; font-weight: 700; line-height: 1;
}
.x-status .icons { display: flex; align-items: center; gap: .4em; }
.x-status svg { height: 1em; width: auto; display: block; }
.x-gesture { display: grid; place-items: center; height: 5.2cqw; flex: none; }
.x-gesture i { display: block; width: 30%; height: 1.2cqw; border-radius: 1cqw; background: var(--text); opacity: .55; }

.screen {
	flex: 1; min-height: 0;
	padding: 1.1em .95em .9em;
	display: flex; flex-direction: column; gap: .95em;
	line-height: 1.5;
}
.phone.small { width: 100%; max-width: 280px; }

.m-title { font-weight: 800; font-size: 1.15em; padding: 0 .3em; }

.m-field {
	box-shadow: var(--inset-sm); border-radius: 1.1em;
	padding: .75em 1.05em; color: var(--text); font-weight: 700;
	display: flex; justify-content: space-between; align-items: center;
}
.m-field .caret { width: 2px; height: 1.1em; background: var(--accent); animation: blink 1.1s steps(1) infinite; }

.m-chips { display: flex; gap: .6em; overflow: hidden; }
.m-chip { box-shadow: var(--raise-sm); border-radius: .8em; padding: .3em .8em; font-size: .88em; font-weight: 700; white-space: nowrap; color: var(--muted); }
.m-chip.on { box-shadow: var(--inset-sm); color: var(--accent); }

.m-elapsed { box-shadow: var(--raise); border-radius: 1.5em; padding: 1.3em .7em .9em; text-align: center; }
.m-elapsed .t { font-size: 2.3em; font-weight: 800; line-height: 1.1; }
.m-elapsed .now { margin-top: .45em; color: var(--muted); font-size: .9em; }
.m-elapsed .now b { color: var(--text); font-weight: 700; margin-right: .4em; }

.m-buttons { display: flex; justify-content: space-between; gap: .75em; padding: 0 .45em; }
.m-btn {
	flex: 1; aspect-ratio: 1; max-width: 4.9em; border-radius: 50%;
	box-shadow: var(--raise-sm);
	display: grid; place-items: center;
	font-weight: 800; font-size: .85em; color: var(--muted);
}
.m-btn.primary { color: var(--accent); box-shadow: var(--inset-sm); }

.m-label { font-size: .85em; font-weight: 700; color: var(--muted); padding: 0 .3em; }
.m-laps { box-shadow: var(--inset-sm); border-radius: 1.2em; padding: .45em .9em; flex: 1; }
.m-lap { display: flex; justify-content: space-between; padding: .55em 0; border-bottom: 1px solid var(--hair); }
.m-lap:last-child { border-bottom: 0; }
.m-lap span:first-child { font-weight: 700; }

.m-tabs { display: flex; gap: .45em; padding: .45em; border-radius: 1.4em; box-shadow: var(--raise-sm); margin-top: auto; }
.m-tab { flex: 1; min-width: 0; text-align: center; padding: .45em 0 .3em; border-radius: .9em; color: var(--muted); font-size: .64em; font-weight: 700; line-height: 1.3; white-space: nowrap; letter-spacing: -.04em; }
.m-tab svg { width: 2.2em; height: 2.2em; display: block; margin: 0 auto .2em; }
.m-tab.on { box-shadow: var(--inset-sm); color: var(--accent); }

/* hero: timer in front, leaderboard behind, on a recessed disc */
.hero-visual { position: relative; isolation: isolate; width: fit-content; margin-inline: auto; }
.hero-visual::before {
	content: ""; position: absolute; z-index: -1;
	left: 56%; top: 50%; width: 200%; aspect-ratio: 1;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	box-shadow: inset 14px 14px 30px var(--dark), inset -14px -14px 30px var(--light);
}
.hero-visual::after {
	content: ""; position: absolute; z-index: -1;
	left: 56%; top: 50%; width: 170%; aspect-ratio: 1;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 22%, transparent), transparent);
}
.hero-visual .phone.front { position: relative; z-index: 1; }
.hero-visual .phone.back {
	display: none;
	position: absolute; top: 7%; left: 46%;
	width: 88%;
	filter: saturate(.9) brightness(.97);
}

/* leaderboard mock */
.m-card { box-shadow: var(--raise-sm); border-radius: 1.38em; padding: 0.92em; }
.m-head { display: flex; justify-content: space-between; align-items: baseline; font-weight: 800; margin-bottom: 0.62em; }
.m-head .sum { color: var(--accent); font-size: .85em; }
.m-seg { display: flex; gap: 0.46em; margin-bottom: 0.77em; }
.m-seg span { flex: 1; text-align: center; font-size: .78em; font-weight: 700; padding: 0.23em 0; border-radius: 0.62em; box-shadow: var(--raise-sm); color: var(--muted); }
.m-seg span.on { box-shadow: var(--inset-sm); color: var(--accent); }
.m-chart { box-shadow: var(--inset-sm); border-radius: 1.08em; padding: 0.77em 0.62em 0.46em; height: 10.15em; display: flex; align-items: flex-end; gap: 0.54em; }
.m-bar { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.23em; height: 100%; justify-content: flex-end; font-size: .72em; color: var(--muted); }
.m-bar i { display: block; width: 100%; border-radius: 0.46em 0.46em 0.23em 0.23em; background: var(--accent); opacity: .55; }
.m-bar.today i { opacity: 1; }
.m-bar .v { font-size: .9em; color: var(--text); font-weight: 700; }
.m-rank { display: flex; align-items: center; gap: 0.77em; padding: 0.46em 0; }
.m-rank .n { width: 1.85em; height: 1.85em; border-radius: 50%; box-shadow: var(--raise-sm); display: grid; place-items: center; font-weight: 800; font-size: .8em; color: var(--accent); flex: none; }
.m-rank .n.grey { color: var(--muted); }
.m-rank .body { flex: 1; min-width: 0; }
.m-rank .row { display: flex; justify-content: space-between; font-weight: 700; }
.m-rank .groove { height: 0.46em; border-radius: 0.23em; box-shadow: var(--inset-sm); margin-top: 0.31em; overflow: hidden; }
.m-rank .groove i { display: block; height: 100%; background: var(--accent); border-radius: 0.23em; }

/* log mock */
.m-day { font-weight: 800; color: var(--muted); font-size: .85em; padding: 0 0.31em; }
.m-log { box-shadow: var(--raise-sm); border-radius: 1.08em; padding: 0.77em 0.92em; }
.m-log .row { display: flex; justify-content: space-between; font-weight: 700; }
.m-log .sub { color: var(--muted); font-size: .85em; margin-top: 0.15em; }

/* settings mock */
.m-set { box-shadow: var(--raise-sm); border-radius: 1.08em; padding: 0.77em 0.92em; display: flex; gap: 0.77em; align-items: center; }
.m-set .body { flex: 1; min-width: 0; }
.m-set b { display: block; }
.m-set small { color: var(--muted); font-size: .82em; line-height: 1.4; display: block; }
.m-toggle { width: 3.23em; height: 1.85em; border-radius: 0.92em; box-shadow: var(--inset-sm); position: relative; flex: none; }
.m-toggle::after { content: ""; position: absolute; top: 0.23em; left: 0.23em; width: 1.38em; height: 1.38em; border-radius: 50%; background: var(--bg); box-shadow: var(--raise-sm); transition: left .2s; }
.m-toggle.on { background: color-mix(in srgb, var(--accent) 25%, var(--bg)); }
.m-toggle.on::after { left: 1.62em; background: var(--accent); }

/* ---------- sections ---------- */

section.block { padding: 88px 0; }
.eyebrow { font-size: .8rem; font-weight: 800; letter-spacing: .18em; color: var(--accent); text-transform: uppercase; }
.block h2 { font-size: clamp(1.6rem, 3.4vw, 2.3rem); line-height: 1.4; margin: 8px 0 12px; font-weight: 800; }
.block .intro { color: var(--muted); max-width: 40em; margin: 0 0 48px; }

/* concept */
.concept { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.concept article { padding: 32px 28px; }
.concept h3 { margin: 18px 0 8px; font-size: 1.2rem; }
.concept p { margin: 0; color: var(--muted); font-size: .95rem; }
.icon-well { width: 56px; height: 56px; border-radius: 18px; box-shadow: var(--inset); display: grid; place-items: center; color: var(--accent); }
.icon-well svg { width: 26px; height: 26px; }

/* features */
.features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; }
.feature { padding: 28px; display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: start; }
.feature h3 { margin: 4px 0 6px; font-size: 1.1rem; }
.feature p { margin: 0; color: var(--muted); font-size: .94rem; }
.feature ul { margin: 8px 0 0; padding-left: 1.1em; color: var(--muted); font-size: .9rem; }

@media (max-width: 880px) {
	.concept, .features { grid-template-columns: 1fr; }
}

/* screens */
.screens { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; align-items: start; }
.screens figure { margin: 0; }
.screens figcaption { text-align: center; margin-top: 20px; font-weight: 700; }
.screens figcaption small { display: block; color: var(--muted); font-weight: 500; font-size: .85rem; }
@media (max-width: 1080px) { .screens { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
	.screens {
		grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%;
		overflow-x: auto; scroll-snap-type: x mandatory;
		padding: 16px 16px 28px; margin: -16px -16px 0;
	}
	.screens figure { scroll-snap-align: center; }
}

/* steps */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; counter-reset: step; list-style: none; padding: 0; margin: 0; }
.steps li { padding: 28px; }
.steps li::before {
	counter-increment: step; content: counter(step);
	display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	box-shadow: var(--inset-sm); color: var(--accent); font-weight: 800; font-size: 1.1rem; margin-bottom: 16px;
}
.steps h3 { margin: 0 0 6px; font-size: 1.1rem; }
.steps p { margin: 0; color: var(--muted); font-size: .94rem; }
@media (max-width: 880px) { .steps { grid-template-columns: 1fr; } }

/* privacy */
.privacy { padding: 40px; display: grid; grid-template-columns: auto 1fr; gap: 32px; align-items: start; }
.privacy h2 { margin-top: 0; }
.privacy p { color: var(--muted); margin: 0 0 12px; }
.privacy .note { box-shadow: var(--inset-sm); border-radius: 16px; padding: 16px 20px; font-size: .92rem; color: var(--muted); margin: 20px 0; }
.privacy .note strong { color: var(--text); }
.shield { width: 88px; height: 88px; border-radius: 28px; box-shadow: var(--inset); display: grid; place-items: center; color: var(--teal); }
.shield svg { width: 40px; height: 40px; }
@media (max-width: 720px) { .privacy { grid-template-columns: 1fr; padding: 28px 22px; } }

/* release notes */
.release { padding: 36px 40px; }
.release header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px 20px; margin-bottom: 16px; }
.release h3 { margin: 0; font-size: 1.4rem; }
.release time { color: var(--muted); font-size: .9rem; }
.release ul { margin: 0; padding-left: 1.2em; columns: 2; column-gap: 40px; }
.release li { break-inside: avoid; margin-bottom: 6px; }
@media (max-width: 720px) { .release { padding: 28px 22px; } .release ul { columns: 1; } }

/* final cta */
.final { text-align: center; padding: 56px 24px; }
.final img.app { width: 88px; height: 88px; border-radius: 24px; margin: 0 auto 20px; box-shadow: var(--raise); }
.final h2 { margin-top: 0; }
.final p { color: var(--muted); margin: 0 auto 28px; max-width: 32em; }
.final .cta { justify-content: center; }

/* footer */
.site-footer { padding: 48px 0 56px; color: var(--muted); font-size: .9rem; }
.site-footer .wrap { display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center; justify-content: space-between; border-top: 1px solid var(--hair); padding-top: 32px; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.site-footer a { color: var(--muted); font-weight: 700; }
.site-footer a:hover { color: var(--accent); }

/* reveal on scroll */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in { opacity: 1; transform: none; }
.no-js .reveal { opacity: 1; transform: none; }

@keyframes blink { 50% { opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.reveal { opacity: 1; transform: none; transition: none; }
	.m-field .caret { animation: none; }
}

.nw { white-space: nowrap; }

/* ---------- desktop / large screens ---------- */

.qr-card {
	display: none;
	align-items: center; gap: 14px;
	padding: 10px 16px 10px 10px;
	border-radius: 18px;
	box-shadow: var(--raise-sm);
	font-size: .8rem; line-height: 1.5; color: var(--muted);
}
.qr-card img { width: 76px; height: 76px; padding: 6px; border-radius: 10px; background: #fff; flex: none; }
.qr-card b { display: block; color: var(--text); font-size: .88rem; }

.nav a.active { color: var(--accent); box-shadow: var(--inset-sm); }

@media (min-width: 881px) {
	.hero { min-height: calc(100svh - 72px); display: flex; align-items: center; padding: 32px 0 64px; }
	.hero .wrap { width: min(var(--wrap), 100% - 64px); }
	.hero .phone.front { width: min(clamp(240px, calc((100svh - 210px) * .45), 340px), 25vw); }
	.hero-visual { padding-block: 2%; }
	.hero-visual .phone.front { transform: translateX(-22%); }
	.hero-visual .phone.back { display: block; }
}

/* Download from a PC: the Play badge can't install directly, so offer a QR code. */
@media (min-width: 881px) and (hover: hover) and (pointer: fine) {
	.qr-card { display: flex; }
	.cta-note { flex-basis: 100%; }
}

@media (hover: hover) and (pointer: fine) {
	.concept article, .feature, .steps li, .screens .phone {
		transition: transform .25s ease, box-shadow .25s ease;
	}
	.screens figure:hover .phone { transform: translateY(-4px); }
	.concept article:hover, .feature:hover, .steps li:hover {
		transform: translateY(-4px);
		box-shadow: -10px -10px 22px var(--light), 10px 10px 22px var(--dark);
	}
}

@media (min-width: 1200px) {
	.features { grid-template-columns: repeat(3, 1fr); }
	.feature { grid-template-columns: 1fr; gap: 16px; }
}

@media (min-width: 1440px) {
	:root { --wrap: 1260px; }
	.hero .wrap { gap: 80px; }
	.phone.small { max-width: 300px; }
	section.block { padding: 112px 0; }
	.screens { gap: 36px; }
}

@media (min-width: 1800px) {
	html { font-size: 17px; }
	:root { --wrap: 1400px; }
	.phone.small { max-width: 320px; }
	.qr-card img { width: 88px; height: 88px; }
}

@media (prefers-reduced-motion: reduce) {
	.concept article, .feature, .steps li, .screens .phone { transition: none; }
	.concept article:hover, .feature:hover, .steps li:hover, .screens figure:hover .phone { transform: none; }
}

/* ---------- privacy policy page ---------- */

.policy-page { padding: 48px 0 88px; }
.policy-page .wrap { max-width: 860px; }
.policy-head { margin-bottom: 40px; }
.policy-head h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); line-height: 1.3; margin: 8px 0 12px; font-weight: 800; }
.policy-head p:not(.eyebrow) { color: var(--muted); margin: 0 0 28px; }
.policy { padding: 48px 52px; font-size: 1rem; }
.policy > p:first-child { margin-top: 0; padding-bottom: 28px; border-bottom: 1px solid var(--hair); }
.policy h2 { font-size: 1.2rem; color: var(--accent); margin: 36px 0 10px; font-weight: 800; }
.policy p { margin: 0 0 10px; }
.policy ul { margin: 8px 0 0; padding-left: 1.3em; }
.policy li { margin-bottom: 6px; }
.policy li::marker { color: var(--accent); }
@media (max-width: 720px) { .policy { padding: 28px 22px; } }