/*
 * CALLY - trang xác thực (đăng nhập, quên mật khẩu...)
 * Dùng chung cho các view trong frontend/auth, nạp qua partial frontend.auth.partials.assets
 * Đơn vị dùng px vì bootstrap 3 đặt html { font-size: 10px }.
 */

/* trang xác thực dùng full màn hình, ẩn header/footer của layout auth */
body{
	background: #000;
}
.header-menu,
.main-footer{
	display: none!important;
}
#content,
#content #left_content{
	float: none;
	width: 100%;
	padding: 0!important;
	margin: 0;
}

.lg-page{
	--lg-bg: #000;
	--lg-red: #e50914;
	--lg-red-hover: #c40711;
	--lg-red-link: #ff2d4f;
	--lg-text: #fff;
	--lg-text-muted: #a3a3ab;
	--lg-text-label: #ddd;
	--lg-text-soft: #c4c4ca;
	--lg-text-pink: #e8c0c6;
	--lg-input-bg: #141418;
	--lg-input-border: #2e2e36;
	--lg-input-placeholder: #6b6b73;
	--lg-error-bg: #2a0609;
	--lg-error-border: rgba(255, 107, 129, 0.6);
	--lg-error-text: #ffb3c0;
	--lg-radius: 12px;
	--lg-font: 'Be Vietnam Pro', sans-serif;
	--lg-font-quote: 'Gentium Basic', serif;

	display: flex;
	max-width: 1280px;
	min-height: 100vh;
	margin: 0 auto;
	background: var(--lg-bg);
	font-family: var(--lg-font);
	color: var(--lg-text);
}
.lg-page *,
.lg-page *::before,
.lg-page *::after{
	box-sizing: border-box;
}
.lg-page a{
	text-decoration: none;
}

/* ===== cột trái: hình minh họa ===== */
.lg-visual{
	display: none;
	position: relative;
	flex: 0 0 620px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 90px 50px;
	background: radial-gradient(ellipse 310px 450px at 50% 50%, #6b0812 0%, #45050b 32.5%, #1f0305 65%, #080000 100%);
	overflow: hidden;
}
.lg-visual .lg-logo{
	position: absolute;
	left: 44px;
	top: 32px;
}
.lg-visual .lg-logo img{
	display: block;
	width: 162px;
	height: 47px;
}
.lg-stage{
	position: relative;
	width: 480px;
	height: 470px;
	flex-shrink: 0;
}
.lg-stage img{
	position: absolute;
	display: block;
}
.lg-stage .lg-ring-480{ left: 0; top: 0; width: 480px; height: 480px; }
.lg-stage .lg-ring-390{ left: 45px; top: 45px; width: 390px; height: 390px; }
.lg-stage .lg-ring-300{ left: 90px; top: 90px; width: 300px; height: 300px; }
.lg-stage .lg-ring-240{ left: 120px; top: 120px; width: 240px; height: 240px; }
.lg-stage .lg-avatar-helen{ left: 130px; top: 130px; width: 220px; height: 220px; }
.lg-stage .lg-avatar-aj{ left: 26px; top: 320px; width: 110px; height: 110px; }
.lg-stage .lg-avatar-rachel{ left: 344px; top: 320px; width: 110px; height: 110px; }

.lg-visual .lg-quote{
	width: 500px;
	max-width: 100%;
	margin: 0;
	font-family: var(--lg-font-quote);
	font-weight: 700;
	font-size: 30px;
	line-height: 34px;
	text-align: center;
	color: var(--lg-text);
}
.lg-visual .lg-intro{
	width: 500px;
	max-width: 100%;
	margin: 12px 0 0;
	font-size: 16px;
	line-height: 1.5;
	text-align: center;
	color: var(--lg-text-pink);
}
.lg-stats{
	display: flex;
	gap: 10px;
	margin: 96px 0 0;
	padding: 0;
	list-style: none;
}
.lg-stats li{
	width: 140px;
	margin: 0;
	text-align: center;
}
.lg-stats .lg-stat-value{
	display: block;
	font-weight: 700;
	font-size: 30px;
	line-height: 42px;
	color: var(--lg-red);
}
.lg-stats .lg-stat-label{
	display: block;
	font-size: 13px;
	color: var(--lg-text-pink);
}

/* ===== cột phải: form ===== */
.lg-main{
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 40px 20px;
}
.lg-main .lg-logo-mobile{
	display: block;
	margin: 0 auto 40px;
}
.lg-main .lg-logo-mobile img{
	display: block;
	width: 162px;
	height: 47px;
}
.lg-form{
	width: 100%;
	max-width: 520px;
}
.lg-form .lg-title{
	margin: 0;
	font-family: var(--lg-font);
	font-weight: 700;
	font-size: 30px;
	line-height: 1.45;
	color: var(--lg-text);
}
.lg-form .lg-subtitle{
	margin: 0;
	font-size: 15px;
	line-height: 1.45;
	color: var(--lg-text-muted);
}
.lg-field{
	margin-top: 25px;
}
.lg-field + .lg-field{
	margin-top: 18px;
}
.lg-field label{
	display: block;
	margin: 0 0 6px;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: var(--lg-text-label);
}
.lg-input{
	position: relative;
}
.lg-input .lg-input-icon{
	position: absolute;
	left: 16px;
	top: 17px;
	width: 18px;
	height: 18px;
	pointer-events: none;
}
.lg-input input{
	display: block;
	width: 100%;
	height: 52px;
	padding: 0 16px 0 46px;
	background: var(--lg-input-bg);
	border: 1px solid var(--lg-input-border);
	border-radius: var(--lg-radius);
	font-family: var(--lg-font);
	font-size: 15px;
	color: var(--lg-text);
	box-shadow: none;
	outline: none;
}
.lg-input input.lg-has-toggle{
	padding-right: 52px;
}
.lg-input input::placeholder{
	color: var(--lg-input-placeholder);
}
.lg-input input:focus{
	border-color: var(--lg-red);
	box-shadow: 0 0 0 3px rgba(229, 9, 20, 0.25);
}
/* autofill của Chrome không đổi nền input sang trắng */
.lg-input input:-webkit-autofill{
	-webkit-box-shadow: 0 0 0 100px var(--lg-input-bg) inset;
	-webkit-text-fill-color: var(--lg-text);
	caret-color: var(--lg-text);
}
.lg-toggle-pass{
	position: absolute;
	right: 4px;
	top: 4px;
	width: 44px;
	height: 44px;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 8px;
	cursor: pointer;
}
.lg-toggle-pass img{
	display: block;
	width: 18px;
	height: 18px;
	margin: 0 auto;
}
.lg-toggle-pass[aria-pressed="true"] img{
	opacity: 0.5;
}
.lg-toggle-pass:hover{
	background: rgba(255, 255, 255, 0.06);
}
.lg-toggle-pass:focus-visible{
	outline: 2px solid var(--lg-red);
	outline-offset: 0;
}

.lg-options{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 18px;
	min-height: 44px;
}
.lg-remember{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	min-height: 44px;
	font-weight: 400;
	font-size: 14px;
	color: var(--lg-text-label);
	cursor: pointer;
}
.lg-remember input{
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}
.lg-remember .lg-checkbox{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	background: var(--lg-input-bg);
	border: 1px solid var(--lg-input-border);
	border-radius: 4px;
}
.lg-remember .lg-checkbox img{
	width: 14px;
	height: 14px;
	visibility: hidden;
}
.lg-remember input:checked + .lg-checkbox{
	background: var(--lg-red);
	border-color: var(--lg-red);
}
.lg-remember input:checked + .lg-checkbox img{
	visibility: visible;
}
.lg-remember input:focus-visible + .lg-checkbox{
	outline: 2px solid var(--lg-red);
	outline-offset: 2px;
}
.lg-forgot{
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-weight: 600;
	font-size: 14px;
	color: var(--lg-red-link);
}
.lg-forgot:hover,
.lg-forgot:focus{
	color: var(--lg-red-link);
	text-decoration: underline;
}

.lg-submit{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 54px;
	margin-top: 8px;
	padding: 0 28px;
	background: var(--lg-red);
	border: 0;
	border-radius: var(--lg-radius);
	box-shadow: 0 8px 28px 0 rgba(229, 8, 20, 0.35);
	font-family: var(--lg-font);
	font-weight: 600;
	font-size: 16px;
	color: #fff;
	cursor: pointer;
	transition: background-color .15s ease, transform .15s ease;
}
.lg-submit:hover{
	background: var(--lg-red-hover);
}
.lg-submit:active{
	transform: translateY(1px);
}
.lg-submit:focus-visible{
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.lg-register{
	display: block;
	margin-top: 26px;
	font-size: 15px;
	text-align: center;
	color: var(--lg-text-soft);
}
.lg-register:hover,
.lg-register:focus{
	color: #fff;
	text-decoration: underline;
}

.lg-error{
	margin-top: 42px;
	padding: 16px;
	background: var(--lg-error-bg);
	border: 1px solid var(--lg-error-border);
	border-radius: var(--lg-radius);
	font-size: 13px;
	line-height: 1.5;
	color: var(--lg-error-text);
}
.lg-error p{
	margin: 0;
}
.lg-error p + p{
	margin-top: 4px;
}

@media(min-width: 768px){
	.lg-form .lg-title{
		font-size: 40px;
	}
	.lg-form .lg-subtitle{
		font-size: 16px;
	}
}
@media(min-width: 992px){
	.lg-visual{
		display: flex;
		flex-basis: 520px;
	}
	.lg-main .lg-logo-mobile{
		display: none;
	}
	.lg-main{
		padding: 60px 40px;
	}
}
@media(min-width: 1200px){
	.lg-visual{
		flex-basis: 620px;
	}
	/* từ 1200px cột phải chỉ còn 580px, giảm padding để form vẫn rộng đủ 520px */
	.lg-main{
		padding: 60px 30px;
	}
}
@media(prefers-reduced-motion: reduce){
	.lg-submit{
		transition: none;
	}
	.lg-submit:active{
		transform: none;
	}
}

/* ===== quên mật khẩu ===== */
.lg-form-forgot .lg-subtitle{
	line-height: 1.5;
}
.lg-form-forgot .lg-field{
	margin-top: 36px;
}
.lg-form-forgot .lg-submit{
	margin-top: 22px;
}
/* nút dạng link (vd. "Gửi lại link" ở trang đặt lại mật khẩu) */
a.lg-submit,
a.lg-submit:hover,
a.lg-submit:focus{
	color: #fff;
	text-decoration: none;
}
.lg-submit:disabled{
	background: #5c1014;
	box-shadow: none;
	color: rgba(255, 255, 255, 0.7);
	cursor: not-allowed;
}
.lg-back{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin-top: 16px;
	font-weight: 600;
	font-size: 15px;
	color: var(--lg-red-link);
}
.lg-back:hover,
.lg-back:focus{
	color: var(--lg-red-link);
	text-decoration: underline;
}

/* ===== đặt lại mật khẩu ===== */
.lg-form-reset .lg-field-hint{
	margin: 8px 0 0;
	font-size: 13px;
	line-height: 1.5;
	color: var(--lg-text-muted);
}
.lg-form-reset .lg-field-hint.is-error{
	color: var(--lg-error-text);
}
.lg-form-reset .lg-input input.is-error{
	border-color: var(--lg-error-border);
}
.lg-form-invalid .lg-submit{
	margin-top: 36px;
}

.lg-success{
	display: flex;
	align-items: flex-start;
	gap: 16px;
	margin-top: 46px;
	padding: 20px;
	background: #0c2416;
	border: 1px solid rgba(34, 197, 94, 0.5);
	border-radius: 14px;
}
.lg-success .lg-success-icon{
	position: relative;
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	margin-top: 2px;
}
.lg-success .lg-success-icon img{
	position: absolute;
	display: block;
}
.lg-success .lg-success-icon .lg-success-circle{
	inset: 0;
	width: 36px;
	height: 36px;
}
.lg-success .lg-success-icon .lg-success-check{
	left: 10px;
	top: 10px;
	width: 16px;
	height: 16px;
}
.lg-success .lg-success-title{
	margin: 0;
	font-weight: 600;
	font-size: 16px;
	line-height: 1.45;
	color: #86efac;
	word-break: break-word;
}
.lg-success .lg-success-text{
	margin: 5px 0 0;
	font-size: 13.5px;
	line-height: 1.5;
	color: #a7d8b8;
}

/* ===== đăng ký (nhiều bước) ===== */
.rg-page{
	--rg-option-bg: #191c21;
	--rg-option-bg-checked: #31333b;
	--rg-progress-off: #3a3a40;
	--rg-hint: rgba(255, 255, 255, 0.44);
	--rg-card-bg: #3a0008;
	--rg-note-bg: #1f1f21;
	--rg-note-text: #8e8e95;

	position: relative;
}
.rg-page .lg-main{
	justify-content: flex-start;
}
.rg-step[hidden]{
	display: none!important;
}
/* tiêu đề nhận focus khi chuyển bước (cho trình đọc màn hình), không cần viền */
.rg-step [tabindex="-1"]:focus{
	outline: none;
}

.rg-progress{
	display: flex;
	gap: 12px;
	margin: 0 0 40px;
	padding: 0;
	list-style: none;
}
.rg-progress li{
	flex: 1 1 0;
	margin: 0;
	font-weight: 500;
	font-size: 12.5px;
	line-height: 16px;
	text-align: center;
	color: var(--rg-progress-off);
}
.rg-progress li::before{
	content: '';
	display: block;
	height: 5px;
	margin-bottom: 9px;
	background: var(--rg-progress-off);
	border-radius: 3px;
}
.rg-progress li.is-active{
	color: var(--lg-text);
}
.rg-progress li.is-active::before{
	background: var(--lg-red);
}

/* các bước khảo sát */
.rg-question{
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}
.rg-question .rg-title{
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	line-height: 1.15;
}
.rg-hint{
	margin: 20px 0 10px;
	font-size: 15px;
	line-height: 32px;
	color: var(--rg-hint);
}
.rg-options{
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.rg-option{
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	margin: 0;
	padding: 12px 12px;
	background: var(--rg-option-bg);
	font-weight: 500;
	font-size: 14px;
	line-height: 22px;
	color: var(--lg-text);
	cursor: pointer;
	transition: background-color .15s ease;
}
.rg-option:first-child{
	border-radius: 9px 9px 0 0;
}
.rg-option:last-child{
	border-radius: 0 0 9px 9px;
}
.rg-option:hover,
.rg-option.is-checked{
	background: var(--rg-option-bg-checked);
}
.rg-option.is-disabled{
	cursor: not-allowed;
	opacity: 0.5;
}
.rg-option.is-disabled:hover{
	background: var(--rg-option-bg);
}
.rg-option input{
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}
.rg-option .rg-check{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	border: 1px solid #fff;
	border-radius: 5px;
}
.rg-option .rg-check img{
	width: 10.5px;
	height: 7.5px;
	visibility: hidden;
}
.rg-option input:checked + .rg-check{
	background: #000;
}
.rg-option input:checked + .rg-check img{
	visibility: visible;
}
.rg-option input:focus-visible + .rg-check{
	outline: 2px solid var(--lg-red);
	outline-offset: 2px;
}

.rg-actions{
	display: flex;
	gap: 11px;
	margin-top: 48px;
}
.rg-back{
	display: block;
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	padding: 0;
	background: transparent;
	border: 0;
	border-radius: 7px;
	cursor: pointer;
}
.rg-back img{
	display: block;
	width: 48px;
	height: 48px;
	margin: -1px 0 0 -2px;
}
.rg-back:hover{
	background: rgba(255, 255, 255, 0.06);
}
.rg-back:focus-visible{
	outline: 2px solid #fff;
	outline-offset: 2px;
}
.rg-continue{
	flex: 1 1 auto;
	height: 44px;
	padding: 0 20px;
	background: var(--lg-red);
	border: 0;
	border-radius: 8px;
	font-family: var(--lg-font);
	font-weight: 600;
	font-size: 14px;
	color: #eee;
	cursor: pointer;
	transition: background-color .15s ease;
}
.rg-continue:hover{
	background: var(--lg-red-hover);
}
.rg-continue:focus-visible{
	outline: 2px solid #fff;
	outline-offset: 2px;
}
.rg-continue:disabled{
	background: #5c1014;
	color: rgba(255, 255, 255, 0.6);
	cursor: not-allowed;
}

/* bước thông tin liên hệ */
.rg-step-contact .lg-title{
	line-height: 1.2;
}
.rg-step-contact .lg-field:first-of-type{
	margin-top: 28px;
}
.rg-input-plain input{
	padding-left: 16px;
}
.rg-step-contact .lg-input input.is-error{
	border-color: var(--lg-error-border);
}
.rg-field-error{
	margin: 8px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: var(--lg-red-link);
}
.rg-terms{
	margin: 26px 0 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--lg-text-muted);
}
.rg-terms a{
	color: var(--lg-text-soft);
	text-decoration: underline!important;
}
.rg-terms a:hover,
.rg-terms a:focus{
	color: #fff;
}
.rg-submit{
	gap: 10px;
	margin-top: 60px;
}
.rg-submit img,
.rg-welcome-next img{
	width: 16px;
	height: 16px;
}

/* bước chào mừng + thành công: ẩn cột hình minh họa, nội dung canh giữa */
.rg-page[data-step="6"] .lg-visual,
.rg-page[data-step="7"] .lg-visual{
	display: none!important;
}
.rg-welcome{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.rg-welcome-logo{
	display: none;
	position: absolute;
	left: 44px;
	top: 32px;
}
.rg-welcome-logo img{
	display: block;
	width: 162px;
	height: 47px;
}
.rg-welcome-title{
	margin: 0;
	font-family: var(--lg-font);
	font-weight: 700;
	font-size: 30px;
	line-height: 1.3;
	color: var(--lg-red);
}
.rg-welcome-brand{
	display: block;
	width: 324px;
	max-width: 100%;
	height: auto;
	margin-top: 24px;
}
.rg-welcome-text{
	margin: 28px 0 0;
	font-size: 17px;
	line-height: 1.5;
	color: var(--lg-text);
}
.rg-welcome-text span{
	color: var(--lg-red-link);
}
.rg-welcome-card{
	position: relative;
	width: 100%;
	max-width: 455px;
	margin-top: 46px;
	padding: 40px 12px 20px;
	background: var(--rg-card-bg);
	border-radius: 14px;
}
.rg-welcome-avatars{
	position: absolute;
	left: 50%;
	top: -24px;
	display: flex;
	gap: 8px;
	transform: translateX(-50%);
}
.rg-welcome-avatars img{
	display: block;
	width: 45px;
	height: 45px;
	border-radius: 50%;
}
.rg-welcome-card-title{
	margin: 0;
	font-size: 12px;
	color: var(--lg-text);
}
.rg-welcome-features{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
}
.rg-welcome-features li{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0 8px;
	font-size: 15px;
	line-height: 1.4;
	color: var(--lg-red-link);
}
.rg-welcome-features li + li{
	border-left: 1px solid rgba(255, 255, 255, 0.08);
}
.rg-feature-icon{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	background: #000;
	border-radius: 50%;
}
.rg-feature-icon img{
	width: 24px;
	height: 24px;
}
.rg-welcome-note{
	display: flex;
	align-items: flex-start;
	gap: 12px;
	width: 100%;
	max-width: 455px;
	margin-top: 34px;
	padding: 14px 16px;
	background: var(--rg-note-bg);
	border-radius: 6px;
	text-align: left;
}
.rg-welcome-note img{
	flex-shrink: 0;
	width: 20px;
	height: 20px;
}
.rg-welcome-note p{
	margin: 0;
	font-size: 13.5px;
	line-height: 1.5;
	color: var(--rg-note-text);
}
.rg-welcome .rg-welcome-next{
	gap: 10px;
	max-width: 520px;
	margin-top: 60px;
}

/* bước đăng ký thành công */
.rg-page[data-step="7"]{
	background: radial-gradient(ellipse 720px 300px at 50% 46%, rgba(120, 8, 18, 0.55) 0%, rgba(60, 4, 9, 0.3) 45%, rgba(0, 0, 0, 0) 100%), var(--lg-bg);
}
.rg-page[data-step="7"] .lg-form{
	max-width: 690px;
}
.rg-done{
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
/* icon + 2 vòng tròn mờ bên ngoài */
.rg-done-icon{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 208px;
	height: 208px;
	border: 1px solid rgba(22, 163, 74, 0.25);
	border-radius: 50%;
}
.rg-done-icon::before{
	content: '';
	position: absolute;
	width: 148px;
	height: 148px;
	background: rgba(22, 163, 74, 0.08);
	border: 1px solid rgba(22, 163, 74, 0.4);
	border-radius: 50%;
}
.rg-done-icon img{
	position: relative;
	display: block;
	width: 120px;
	height: 120px;
}
.rg-done-title{
	margin: 24px 0 0;
	font-family: var(--lg-font);
	font-weight: 700;
	font-size: 32px;
	line-height: 1.3;
	color: var(--lg-text);
}
.rg-done-text{
	margin: 16px 0 0;
	font-size: 16px;
	line-height: 1.6;
	color: var(--lg-text-soft);
}
.rg-done-info{
	width: 100%;
	max-width: 556px;
	margin: 46px 0 0;
	padding: 18px 30px;
	background: var(--lg-input-bg);
	border: 1px solid var(--lg-input-border);
	border-radius: 14px;
}
.rg-done-info > div{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 40px;
}
.rg-done-info > div[hidden]{
	display: none;
}
.rg-done-info dt{
	font-weight: 400;
	font-size: 14px;
	color: var(--lg-text-muted);
}
.rg-done-info dd{
	margin: 0;
	font-weight: 600;
	font-size: 14px;
	color: var(--lg-text);
	text-align: right;
	word-break: break-word;
}
.rg-done-actions{
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 100%;
	max-width: 556px;
	margin-top: 60px;
}
.rg-done-actions .lg-submit{
	margin-top: 0;
}
.rg-done-home{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 54px;
	border: 1px solid #4a4a52;
	border-radius: var(--lg-radius);
	font-weight: 600;
	font-size: 16px;
	color: var(--lg-text);
	transition: background-color .15s ease;
}
.rg-done-home:hover,
.rg-done-home:focus{
	color: var(--lg-text);
	background: rgba(255, 255, 255, 0.06);
}
.rg-done-home:focus-visible{
	outline: 2px solid #fff;
	outline-offset: 2px;
}

@media(min-width: 768px){
	.rg-question .rg-title{
		font-size: 40px;
	}
	.rg-welcome-title{
		font-size: 42px;
	}
	.rg-welcome-brand{
		width: 493px;
		margin-top: 36px;
	}
	.rg-welcome-text{
		font-size: 18px;
	}
	.rg-done-title{
		font-size: 46px;
	}
	.rg-done-text{
		font-size: 18px;
	}
	.rg-done-actions{
		flex-direction: row;
		gap: 18px;
	}
	.rg-done-actions > a{
		flex: 1 1 0;
	}
}
@media(min-width: 992px){
	.rg-page .lg-main{
		padding-top: 96px;
	}
	.rg-progress{
		margin-bottom: 46px;
	}
	.rg-actions{
		margin-top: 107px;
	}
	.rg-page[data-step="6"] .lg-main{
		padding-top: 120px;
	}
	.rg-page[data-step="7"] .lg-main{
		padding-top: 140px;
	}
	.rg-page[data-step="6"] .rg-welcome-logo,
	.rg-page[data-step="7"] .rg-welcome-logo{
		display: block;
	}
}
@media(prefers-reduced-motion: reduce){
	.rg-option,
	.rg-continue,
	.rg-done-home{
		transition: none;
	}
}