/* ========================================================================
   Find & Bind · Public content pages
   About, Help, Privacy, and Terms
   ======================================================================== */

html{
	scroll-behavior:smooth;
}

body.content-page{
	min-height:100vh;
	display:flex;
	flex-direction:column;
	background:#f7f8fb;
}

.content-page-main{
	flex:1 0 auto;
}

/* Hero shared by all four pages. */
.content-hero{
	position:relative;
	overflow:hidden;
	border-bottom:1px solid #e9edf4;
	background:
		radial-gradient(70% 100% at 100% 0, rgba(0,161,20,.09), transparent 52%),
		radial-gradient(70% 100% at 0 100%, rgba(225,6,0,.08), transparent 55%),
		linear-gradient(180deg,#fff,#f7f9fc);
}

.content-hero::before,
.content-hero::after{
	content:"";
	position:absolute;
	width:220px;
	height:220px;
	border-radius:999px;
	filter:blur(64px);
	opacity:.16;
	pointer-events:none;
}

.content-hero::before{
	top:-110px;
	right:7%;
	background:var(--green);
}

.content-hero::after{
	left:6%;
	bottom:-130px;
	background:var(--red);
}

.content-hero__inner{
	position:relative;
	z-index:1;
	max-width:900px;
	padding-top:72px;
	padding-bottom:74px;
	text-align:center;
}

.content-eyebrow{
	margin:0 0 9px;
	color:var(--red-special);
	font-size:13px;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
}

.content-hero h1{
	max-width:820px;
	margin:0 auto;
	color:var(--ink);
	font-size:clamp(32px,5vw,52px);
	line-height:1.1;
	letter-spacing:-.025em;
}

.content-hero__lead{
	max-width:760px;
	margin:18px auto 0;
	color:#526070;
	font-size:clamp(16px,2vw,20px);
	line-height:1.7;
}

.content-updated{
	display:inline-flex;
	align-items:center;
	gap:8px;
	margin:22px 0 0;
	padding:7px 12px;
	border:1px solid #dde3ec;
	border-radius:999px;
	background:rgba(255,255,255,.74);
	color:#637083;
	font-size:13px;
}

.content-page-wrap{
	padding-top:36px;
	padding-bottom:64px;
}

/* About-page feature cards. */
.content-intro-grid{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:18px;
	margin-bottom:28px;
}

.content-feature-card{
	padding:24px;
	border:1px solid var(--line);
	border-radius:18px;
	background:#fff;
	box-shadow:0 10px 28px rgba(17,24,39,.06);
}

.content-feature-card__icon{
	display:inline-grid;
	place-items:center;
	width:44px;
	height:44px;
	margin-bottom:16px;
	border-radius:13px;
	font-size:18px;
}

.content-feature-card--need .content-feature-card__icon{
	background:#fff0ef;
	color:var(--red);
}

.content-feature-card--offer .content-feature-card__icon{
	background:#eaf8ed;
	color:#087a2a;
}

.content-feature-card--connect .content-feature-card__icon{
	background:#edf4ff;
	color:#2563a6;
}

.content-feature-card h2{
	margin:0 0 6px;
	color:var(--ink);
	font-size:19px;
	line-height:1.3;
}

.content-feature-card p{
	margin:0;
	color:var(--muted);
	font-size:15px;
}

/* Two-column policy/content layout. */
.content-layout{
	display:grid;
	grid-template-columns:250px minmax(0,1fr);
	align-items:start;
	gap:24px;
}

.content-side-card,
.content-toc{
	position:sticky;
	top:88px;
	padding:20px;
	border:1px solid var(--line);
	border-radius:16px;
	background:#fff;
	box-shadow:0 8px 24px rgba(17,24,39,.05);
}

.content-side-card__label,
.content-toc__title{
	margin:0 0 12px;
	color:var(--ink);
	font-size:13px;
	font-weight:800;
	letter-spacing:.08em;
	text-transform:uppercase;
}

.content-check-list{
	display:grid;
	gap:12px;
	margin:0;
	padding:0;
	list-style:none;
}

.content-check-list li{
	display:flex;
	align-items:flex-start;
	gap:10px;
	color:#4b5563;
}

.content-check-list i{
	display:inline-grid;
	place-items:center;
	width:20px;
	height:20px;
	margin-top:1px;
	border-radius:999px;
	background:#eaf8ed;
	color:#087a2a;
	font-size:10px;
	flex:0 0 20px;
}

.content-toc nav{
	display:grid;
	gap:3px;
}

.content-toc a{
	display:block;
	padding:7px 9px;
	border-radius:8px;
	color:#536174;
	font-size:13px;
	line-height:1.35;
	text-decoration:none;
}

.content-toc a:hover,
.content-toc a:focus-visible{
	background:#f1f4f8;
	color:var(--ink);
}

.content-surface{
	min-width:0;
	padding:clamp(24px,4vw,48px);
	border:1px solid var(--line);
	border-radius:18px;
	background:#fff;
	box-shadow:0 10px 30px rgba(17,24,39,.055);
}

.content-prose section{
	scroll-margin-top:92px;
}

.content-prose section + section{
	margin-top:36px;
	padding-top:34px;
	border-top:1px solid var(--line);
}

.content-prose h2{
	margin:0 0 13px;
	color:var(--ink);
	font-size:clamp(22px,2.5vw,28px);
	line-height:1.25;
}

.content-prose h3{
	margin:0 0 5px;
	color:var(--ink);
	font-size:16px;
	line-height:1.4;
}

.content-prose p,
.content-prose li{
	color:#485467;
	font-size:15px;
	line-height:1.78;
}

.content-prose p{
	margin:0 0 15px;
}

.content-prose p:last-child{
	margin-bottom:0;
}

.content-prose ul,
.content-prose ol{
	margin:10px 0 0;
	padding-left:22px;
}

.content-prose li + li{
	margin-top:8px;
}

.content-prose a{
	color:#075fb5;
	text-underline-offset:3px;
}

.content-prose strong{
	color:#273142;
}

/* Numbered About steps. */
.content-step-list{
	display:grid;
	gap:12px;
	margin:18px 0 0 !important;
	padding:0 !important;
	list-style:none;
}

.content-step-list > li{
	display:flex;
	align-items:flex-start;
	gap:13px;
	margin:0;
	padding:15px;
	border:1px solid #e4e8ef;
	border-radius:13px;
	background:#f8fafc;
}

.content-step-list > li > span{
	display:inline-grid;
	place-items:center;
	width:30px;
	height:30px;
	border-radius:999px;
	background:var(--navy);
	color:#fff;
	font-weight:800;
	flex:0 0 30px;
}

.content-step-list p{
	margin:0;
}

.content-principle-grid{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:12px;
	margin-top:17px;
}

.content-principle-grid > div{
	padding:16px;
	border:1px solid #e4e8ef;
	border-radius:13px;
	background:#fbfcfe;
}

.content-principle-grid h3 i{
	width:20px;
	margin-right:4px;
	color:var(--red);
	text-align:center;
}

.content-principle-grid p{
	margin:0;
	font-size:14px;
}

/* Shared informational callouts. */
.content-callout{
	display:flex;
	align-items:flex-start;
	gap:14px;
	padding:18px;
	border:1px solid #dbe4ef;
	border-radius:15px;
	background:#f7faff;
}

.content-callout > i{
	display:inline-grid;
	place-items:center;
	width:34px;
	height:34px;
	border-radius:10px;
	background:#e9f2ff;
	color:#1f64a9;
	font-size:15px;
	flex:0 0 34px;
}

.content-callout h2{
	margin:0 0 5px;
	color:var(--ink);
	font-size:18px;
}

.content-callout p{
	margin:0;
	color:#4b596d;
	line-height:1.7;
}

.content-callout--summary{
	margin-bottom:24px;
	background:#f7fbf8;
	border-color:#d7e9dc;
}

.content-callout--summary > i{
	background:#e6f6ea;
	color:#087a2a;
}

.content-callout--neutral{
	margin-top:18px;
}

.content-callout--safety{
	background:#fff9ed;
	border-color:#eadcb9;
}

.content-callout--safety > i{
	background:#fff0c8;
	color:#856000;
}

/* Bottom CTA on the About page. */
.content-cta{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:24px;
	margin-top:28px;
	padding:30px;
	border-radius:18px;
	background:linear-gradient(135deg,#0f1b3d,#182c61);
	box-shadow:0 14px 34px rgba(15,27,61,.2);
}

.content-cta .content-eyebrow{
	color:#ff8b86;
}

.content-cta h2{
	margin:0;
	color:#fff;
	font-size:clamp(22px,3vw,30px);
}

.content-cta__actions{
	display:flex;
	gap:10px;
	flex-wrap:wrap;
	justify-content:flex-end;
}

.content-cta .btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:44px;
	padding:10px 16px;
	font-weight:700;
}

.content-cta .btn-outline{
	border-color:rgba(255,255,255,.42);
	background:rgba(255,255,255,.08);
	color:#fff;
}

.content-cta .btn-outline:hover{
	background:rgba(255,255,255,.15);
}

/* Help search. */
.help-search{
	position:relative;
	display:flex;
	align-items:center;
	max-width:660px;
	margin:28px auto 0;
	border:1px solid #d7dce5;
	border-radius:14px;
	background:#fff;
	box-shadow:0 12px 30px rgba(17,24,39,.09);
}

.help-search > i{
	position:absolute;
	left:17px;
	color:#788597;
	pointer-events:none;
}

.help-search input{
	width:100%;
	height:56px;
	padding:0 52px 0 47px;
	border:0;
	border-radius:14px;
	background:transparent;
	color:var(--ink);
	font:inherit;
	font-size:16px;
}

.help-search input:focus{
	outline:3px solid rgba(15,27,61,.16);
	outline-offset:2px;
}

.help-search button{
	position:absolute;
	right:10px;
	display:inline-grid;
	place-items:center;
	width:36px;
	height:36px;
	padding:0;
	border:0;
	border-radius:9px;
	background:#f0f3f7;
	color:#5c6878;
	cursor:pointer;
}

.help-search button:hover{
	background:#e5e9ef;
}

.help-page-wrap{
	max-width:1050px;
}

.content-section-heading h2,
.help-topics__toolbar h2{
	margin:0;
	color:var(--ink);
	font-size:clamp(24px,3vw,32px);
}

.help-shortcuts{
	margin-bottom:38px;
}

.help-shortcuts__grid{
	display:grid;
	grid-template-columns:repeat(5,minmax(0,1fr));
	gap:12px;
	margin-top:17px;
}

.help-shortcut{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:10px;
	min-height:120px;
	padding:16px 12px;
	border:1px solid var(--line);
	border-radius:15px;
	background:#fff;
	color:#334155;
	font-weight:700;
	line-height:1.35;
	text-align:center;
	text-decoration:none;
	box-shadow:0 7px 22px rgba(17,24,39,.045);
	transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;
}

.help-shortcut i{
	color:var(--red);
	font-size:21px;
}

.help-shortcut:hover,
.help-shortcut:focus-visible{
	transform:translateY(-2px);
	border-color:#cdd5e1;
	box-shadow:0 12px 27px rgba(17,24,39,.08);
}

.help-topics{
	padding:clamp(20px,3vw,32px);
	border:1px solid var(--line);
	border-radius:18px;
	background:#fff;
	box-shadow:0 10px 30px rgba(17,24,39,.05);
}

.help-topics__toolbar{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:20px;
	margin-bottom:24px;
}

.help-result-count{
	min-height:20px;
	margin:5px 0 0;
	color:var(--muted);
	font-size:13px;
}

.help-expand-button{
	min-width:112px;
	font-weight:700;
}

.help-topic-groups{
	display:grid;
	gap:30px;
}

.help-topic-group{
	scroll-margin-top:92px;
}

.help-topic-group + .help-topic-group{
	padding-top:30px;
	border-top:1px solid var(--line);
}

.help-topic-group__heading{
	display:flex;
	align-items:flex-start;
	gap:13px;
	margin-bottom:13px;
}

.help-topic-group__heading > span{
	display:inline-grid;
	place-items:center;
	width:40px;
	height:40px;
	border-radius:12px;
	background:#fff0ef;
	color:var(--red);
	font-size:16px;
	flex:0 0 40px;
}

.help-topic-group__heading h3{
	margin:0;
	color:var(--ink);
	font-size:19px;
}

.help-topic-group__heading p{
	margin:2px 0 0;
	color:var(--muted);
}

.help-faq-list{
	display:grid;
	gap:9px;
}

.help-faq{
	overflow:hidden;
	border:1px solid #e1e5eb;
	border-radius:12px;
	background:#fbfcfe;
}

.help-faq summary{
	position:relative;
	padding:15px 48px 15px 16px;
	color:#243045;
	font-weight:700;
	line-height:1.45;
	cursor:pointer;
	list-style:none;
}

.help-faq summary::-webkit-details-marker{
	display:none;
}

.help-faq summary::after{
	content:"+";
	position:absolute;
	top:50%;
	right:16px;
	display:inline-grid;
	place-items:center;
	width:24px;
	height:24px;
	border-radius:999px;
	background:#edf1f6;
	color:#506078;
	font-size:18px;
	font-weight:500;
	line-height:1;
	transform:translateY(-50%);
}

.help-faq[open] summary::after{
	content:"−";
}

.help-faq summary:hover{
	background:#f4f6f9;
}

.help-faq summary:focus-visible{
	outline:3px solid rgba(15,27,61,.16);
	outline-offset:-3px;
}

.help-faq > div{
	padding:0 16px 16px;
	color:#4a5668;
	font-size:15px;
	line-height:1.75;
}

.help-faq p{
	margin:0;
}

.help-faq ul,
.help-faq ol{
	margin:0;
	padding-left:22px;
}

.help-faq li + li{
	margin-top:6px;
}

.help-empty{
	padding:44px 20px;
	border:1px dashed #cad2de;
	border-radius:14px;
	background:#fafbfd;
	text-align:center;
}

.help-empty > i{
	margin-bottom:10px;
	color:#8894a5;
	font-size:30px;
}

.help-empty h3{
	margin:0 0 4px;
	color:var(--ink);
	font-size:20px;
}

.help-empty p{
	margin:0 0 16px;
	color:var(--muted);
}

.help-safety-note{
	margin-top:24px;
}

/* Policy typography receives a slightly narrower reading measure. */
.content-policy > section > p,
.content-policy > section > ul,
.content-policy > section > ol{
	max-width:780px;
}

/* ========================================================================
   Dark theme
   ======================================================================== */

[data-theme="dark"] body.content-page{
	background:#0a0f18;
}

[data-theme="dark"] .content-hero{
	border-bottom-color:var(--line);
	background:
		radial-gradient(70% 100% at 100% 0, rgba(0,161,20,.1), transparent 52%),
		radial-gradient(70% 100% at 0 100%, rgba(225,6,0,.09), transparent 55%),
		linear-gradient(180deg,#0c111b,#0d1420);
}

[data-theme="dark"] .content-hero h1,
[data-theme="dark"] .content-feature-card h2,
[data-theme="dark"] .content-side-card__label,
[data-theme="dark"] .content-toc__title,
[data-theme="dark"] .content-prose h2,
[data-theme="dark"] .content-prose h3,
[data-theme="dark"] .content-callout h2,
[data-theme="dark"] .content-section-heading h2,
[data-theme="dark"] .help-topics__toolbar h2,
[data-theme="dark"] .help-topic-group__heading h3,
[data-theme="dark"] .help-empty h3{
	color:#eef2f7;
}

[data-theme="dark"] .content-hero__lead,
[data-theme="dark"] .content-feature-card p,
[data-theme="dark"] .content-check-list li,
[data-theme="dark"] .content-prose p,
[data-theme="dark"] .content-prose li,
[data-theme="dark"] .content-callout p,
[data-theme="dark"] .help-topic-group__heading p,
[data-theme="dark"] .help-faq > div{
	color:#b8c2d0;
}

[data-theme="dark"] .content-updated{
	border-color:#2a3443;
	background:rgba(13,20,32,.8);
	color:#aab5c4;
}

[data-theme="dark"] .content-feature-card,
[data-theme="dark"] .content-side-card,
[data-theme="dark"] .content-toc,
[data-theme="dark"] .content-surface,
[data-theme="dark"] .help-shortcut,
[data-theme="dark"] .help-topics{
	border-color:var(--line);
	background:#0e1420;
	box-shadow:0 12px 30px rgba(0,0,0,.25);
}

[data-theme="dark"] .content-check-list i{
	background:#10271a;
	color:#6ee7a0;
}

[data-theme="dark"] .content-toc a{
	color:#aeb9c8;
}

[data-theme="dark"] .content-toc a:hover,
[data-theme="dark"] .content-toc a:focus-visible{
	background:#151d2b;
	color:#fff;
}

[data-theme="dark"] .content-prose strong{
	color:#e5e7eb;
}

[data-theme="dark"] .content-prose a{
	color:#77b7ff;
}

[data-theme="dark"] .content-step-list > li,
[data-theme="dark"] .content-principle-grid > div{
	border-color:#253041;
	background:#111927;
}

[data-theme="dark"] .content-step-list > li > span{
	background:#c7d2fe;
	color:#0f172a;
}

[data-theme="dark"] .content-callout{
	border-color:#29384d;
	background:#101b2a;
}

[data-theme="dark"] .content-callout > i{
	background:#172943;
	color:#8fc5ff;
}

[data-theme="dark"] .content-callout--summary{
	border-color:#24452f;
	background:#102018;
}

[data-theme="dark"] .content-callout--summary > i{
	background:#173622;
	color:#7ce59b;
}

[data-theme="dark"] .content-callout--safety{
	border-color:#4d4022;
	background:#211b10;
}

[data-theme="dark"] .content-callout--safety > i{
	background:#3c2e0d;
	color:#ffd978;
}

[data-theme="dark"] .content-cta{
	background:linear-gradient(135deg,#121e3d,#1b3168);
}

[data-theme="dark"] .help-search{
	border-color:#2a3443;
	background:#0e1420;
	box-shadow:0 12px 30px rgba(0,0,0,.32);
}

[data-theme="dark"] .help-search input{
	color:#edf1f6;
}

[data-theme="dark"] .help-search button{
	background:#182130;
	color:#bac4d2;
}

[data-theme="dark"] .help-shortcut{
	color:#d3dae5;
}

[data-theme="dark"] .help-faq{
	border-color:#263142;
	background:#111927;
}

[data-theme="dark"] .help-faq summary{
	color:#e0e6ef;
}

[data-theme="dark"] .help-faq summary::after{
	background:#1d2838;
	color:#c4ceda;
}

[data-theme="dark"] .help-faq summary:hover{
	background:#151f2e;
}

[data-theme="dark"] .help-empty{
	border-color:#354052;
	background:#0d141f;
}

/* ========================================================================
   Responsive layout
   ======================================================================== */

@media (max-width:1000px){
	.help-shortcuts__grid{
		grid-template-columns:repeat(3,minmax(0,1fr));
	}
}

@media (max-width:860px){
	.content-hero__inner{
		padding-top:56px;
		padding-bottom:58px;
	}

	.content-layout{
		grid-template-columns:1fr;
	}

	.content-side-card,
	.content-toc{
		position:static;
	}

	.content-toc nav{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

	.content-cta{
		align-items:flex-start;
		flex-direction:column;
	}

	.content-cta__actions{
		justify-content:flex-start;
	}
}

@media (max-width:800px){
	.content-intro-grid{
		grid-template-columns:1fr;
	}
}

@media (max-width:640px){
	.content-page-wrap{
		padding-top:24px;
		padding-bottom:42px;
	}

	.content-hero__inner{
		padding-top:44px;
		padding-bottom:46px;
	}

	.content-surface{
		padding:22px 18px;
		border-radius:15px;
	}

	.content-principle-grid{
		grid-template-columns:1fr;
	}

	.content-toc nav{
		grid-template-columns:1fr;
	}

	.help-shortcuts__grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

	.help-shortcut{
		min-height:104px;
	}

	.help-topics__toolbar{
		align-items:stretch;
		flex-direction:column;
	}

	.help-expand-button{
		align-self:flex-start;
	}

}

@media (max-width:520px){
	.content-callout{
		gap:11px;
		padding:15px;
	}

	.content-cta{
		padding:24px 20px;
	}

	.content-cta__actions,
	.content-cta__actions .btn{
		width:100%;
	}
}

@media (max-width:390px){
	.help-shortcuts__grid{
		grid-template-columns:1fr;
	}
}

@media (prefers-reduced-motion:reduce){
	html{
		scroll-behavior:auto;
	}

	.help-shortcut{
		transition:none;
	}
}
