/* ============================================================
   Age-verification method chooser — page-scoped styles.
   Everything lives under .verify-age so it never touches the
   shared header/footer CSS. Dark navy band + brand gold accents.
   ============================================================ */

.verify-age,
.verify-age *,
.verify-age *::before,
.verify-age *::after{ box-sizing:border-box; }

.verify-age{
	--va-band:#152a38;      /* content band, sits on body #001119        */
	--va-card:#1d3646;      /* option card face                          */
	--va-card-hi:#20415a;   /* card hover / active fill                  */
	--va-line:#2c4a5e;      /* hairline borders                          */
	--va-gold:#f4a005;      /* site brand gold (buttons + accents)       */
	--va-gold-soft:#f4a005; /* pill / active border                      */
	--va-ink:#ffffff;       /* primary text                              */
	--va-muted:#9db0bf;     /* secondary text                            */

	background:var(--va-band);
	color:var(--va-ink);
	padding:64px 20px 80px;
	font-family:"Myriad Pro","Helvetica Neue",Arial,sans-serif;
	-webkit-font-smoothing:antialiased;
}

.verify-age .va-shell{
	max-width:560px;
	margin:0 auto;
}

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

.verify-age .va-hero{
	text-align:center;
	margin-bottom:34px;
}

.verify-age .va-hero__icon{
	display:inline-flex;
	color:#6fa8cc; /* design blue — sampled from mockup PNGs */
	margin-bottom:14px;
}
.verify-age .va-hero__icon svg{ width:34px; height:34px; }

.verify-age .va-hero__title{
	margin:0 0 12px;
	font-size:27px;
	line-height:1.25;
	font-weight:700;
	letter-spacing:.2px;
	color:var(--va-ink);
}

.verify-age .va-hero__sub{
	margin:0 auto;
	max-width:440px;
	font-size:17px;
	line-height:1.5;
	color:var(--va-muted);
}

/* ---------- cards ---------- */

.verify-age .va-cards{
	display:flex;
	flex-direction:column;
	gap:14px;
}

/* the radios drive the active state (click a card -> gold border moves).
   hidden but still focusable via the label. */
.verify-age .va-radio{
	position:absolute;
	width:1px; height:1px;
	opacity:0;
	pointer-events:none;
}

.verify-age .va-card{
	display:flex;
	align-items:center;
	gap:16px;
	padding:18px 20px;
	background:var(--va-card);
	border:1px solid var(--va-line);
	border-radius:12px;
	transition:border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
	cursor:pointer;

	/* staggered entrance */
	opacity:0;
	transform:translateY(10px);
	animation:va-rise .5s ease forwards;
}
.verify-age .va-card:nth-of-type(1){ animation-delay:.04s; }
.verify-age .va-card:nth-of-type(2){ animation-delay:.10s; }
.verify-age .va-card:nth-of-type(3){ animation-delay:.16s; }

.verify-age .va-card:hover{
	background:var(--va-card-hi);
	border-color:#3a6280;
	transform:translateY(-1px);
	box-shadow:0 8px 22px rgba(0,0,0,.28);
}

/* active (checked) card — gold border */
.verify-age .va-radio:checked + .va-card{
	border-color:var(--va-gold);
	box-shadow:0 0 0 1px var(--va-gold) inset;
}
.verify-age .va-radio:checked + .va-card:hover{
	border-color:var(--va-gold);
}
/* keyboard focus ring */
.verify-age .va-radio:focus-visible + .va-card{
	outline:2px solid var(--va-gold);
	outline-offset:2px;
}

.verify-age .va-card__icon{
	flex:0 0 auto;
	display:inline-flex;
	color:var(--va-muted);
}
.verify-age .va-radio:checked + .va-card .va-card__icon{ color:var(--va-gold); }
.verify-age .va-card__icon svg{ width:22px; height:22px; }

.verify-age .va-card__text{
	flex:1 1 auto;
	min-width:0;
	display:flex;
	flex-direction:column;
	gap:3px;
}

.verify-age .va-card__title{
	font-size:21px;
	font-weight:700;
	color:var(--va-ink);
	line-height:1.3;
}

.verify-age .va-card__sub{
	font-size:17px;
	font-weight:400;
	color:var(--va-muted);
	line-height:1.45;
}

.verify-age .va-pill{
	flex:0 0 auto;
	align-self:flex-start;
	margin-top:2px;
	padding:5px 12px;
	border-radius:6px;
	background:var(--va-gold);
	color:#1a1206;
	font-size:14px;
	font-weight:700;
	letter-spacing:.2px;
	white-space:nowrap;
}

/* ---------- continue ---------- */

.verify-age .va-actions{
	text-align:center;
	margin:30px 0 8px;
}

.verify-age .va-continue{
	display:inline-block;
	min-width:170px;
	padding:13px 34px;
	border-radius:10px;
	background:var(--va-gold);
	color:#1a1206 !important;
	font-size:19px;
	font-weight:700;
	text-decoration:none;
	transition:background .16s ease, transform .16s ease, box-shadow .16s ease;
}
.verify-age .va-continue:hover{
	background:#f3aa22;
	transform:translateY(-1px);
	box-shadow:0 8px 20px rgba(244,160,5,.28);
	text-decoration:none;
	color:#1a1206 !important;
}

/* ---------- footer copy ---------- */

.verify-age .va-foot{
	margin-top:28px;
	padding-top:22px;
	border-top:1px solid var(--va-line);
	text-align:center;
}

.verify-age .va-help{
	margin:0 0 8px;
	font-size:17px;
	color:var(--va-muted);
}
.verify-age .va-help a{ color:var(--va-gold); text-decoration:underline; }

.verify-age .va-fine{
	margin:0 auto 14px;
	max-width:440px;
	font-size:17px;
	line-height:1.55;
	color:#7d90a0;
}

.verify-age .va-links{
	margin:0;
	font-size:17px;
}
.verify-age .va-links a{
	color:#cdd9e2;
	text-decoration:underline;
}
.verify-age .va-links a:hover{ color:#ffffff; }
.verify-age .va-sep{
	margin:0 10px;
	color:#4d6579;
}

@keyframes va-rise{
	to{ opacity:1; transform:translateY(0); }
}

/* ---------- mobile ---------- */

@media (max-width:767px){
	.verify-age{ padding:40px 16px 56px; }
	.verify-age .va-hero__title{ font-size:23px; }
	.verify-age .va-card{
		align-items:center;
		padding:16px;
		gap:13px;
	}
	.verify-age .va-card__title{ font-size:19px; }
	.verify-age .va-pill{ align-self:center; margin-top:0; font-size:12px; }

	.verify-age .va-continue{ display:block; width:100%; font-size:16px; }
}

/* respect reduced-motion */
@media (prefers-reduced-motion:reduce){
	.verify-age .va-card{ animation:none; opacity:1; transform:none; }
}

/* Age verification banner. All classes prefixed av- to avoid collisions. */
.av-banner{background:#2d5f80;border-top:1px solid #3b7396;border-bottom:1px solid #1d4661;color:#fff;font-family:inherit}
.av-banner__inner{max-width:1140px;margin:0 auto;padding:14px 0px;display:flex;align-items:center;gap:18px}
.av-banner__icon{flex:0 0 auto}
.av-banner__text{flex:1;line-height:1.4}
.av-banner__title,.av-banner__sub{margin:0}
.av-banner__title{font-size:16px;font-weight:700}
.av-banner__title span{font-weight:400;opacity:.9}
.av-banner__sub{font-size:14px;color:#d6e6f1;margin-top:2px}
.av-banner__btn{flex:0 0 auto;background:#6aa574;color:#fff;font-weight:700;font-size:16px;padding:11px 26px;border-radius:3px;text-decoration:none;white-space:nowrap}
.av-banner__btn:hover{background:#5d9667}
.av-banner__btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (max-width:640px){
  .av-banner__inner{flex-wrap:wrap;padding:14px 16px;gap:10px 12px}
  .av-banner__icon{display:none}
  .av-banner__text{flex:1 1 100%}
  .av-banner__title{font-size:15px}
  .av-banner__sub{font-size:13px}
  .av-banner__btn{flex:1 1 100%;text-align:center;padding:12px}
}