/**
 * Login and "Opprett konto" for logged-out visitors.
 * Figma: Opprett konto 1280.
 */

body.gg-modern-shop:has(.gg-reg) {
	overflow-x: clip;
	background-color: #fbf9f5;
}

/* Let the page run edge to edge inside an Elementor container. */
body.gg-modern-shop .e-con:has(.gg-reg) {
	margin-block: 0;
	padding-block: 0;
}

body.gg-modern-shop .e-con:has(.gg-reg) > .e-con-inner {
	padding-block: 0;
}

body.gg-modern-shop:not(#gg) .gg-reg {
	--rg-ink: #1b1c1a;
	--rg-text: #444748;
	--rg-muted: #6e6a64;
	--rg-gold: #b3924c;
	--rg-gold-bright: #d4af37;
	--rg-field: #f5f3ef;
	--rg-soft: #efeeea;
	--rg-sand: #f4efea;
	--rg-serif: "Playfair Display", Georgia, "Times New Roman", serif;
	--rg-sans: "Manrope", "Helvetica Neue", Helvetica, Arial, sans-serif;

	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	margin: 0 0 0 calc(50% - 50vw);
	color: var(--rg-ink);
	font-family: var(--rg-sans);
	font-size: 13px;
	line-height: 20px;
	letter-spacing: normal;
	text-align: left;

	& *,
	& *::before,
	& *::after {
		box-sizing: border-box;
	}

	& :is(p, ul, ol, h1, h2, h3, blockquote, address) {
		margin: 0;
		padding: 0;
	}

	& :is(ul, ol) {
		list-style: none;
	}

	& a {
		text-decoration: none;
	}

	& .gg-icon {
		flex: 0 0 auto;
	}

	& .gg-reg__inner {
		display: flex;
		flex-direction: column;
		gap: 28px;
		max-width: 1280px;
		margin: 0 auto;
		padding: 48px 24px 80px;
	}

	& .gg-reg__hook:empty {
		display: none;
	}

	/* Notices come from render_page_notices(). */
	& .gg-notices {
		padding: 0;
		background: none;
	}

	& .gg-notices__in {
		max-width: none;
	}

	/* Breadcrumbs
	--------------------------------------------- */

	& .gg-reg-crumbs ol {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 4px;
		color: var(--rg-muted);
		font-size: 13px;
		line-height: 20px;

		& li {
			display: flex;
			align-items: center;
		}

		& a {
			color: var(--rg-muted);
		}

		& a:hover {
			color: var(--rg-ink);
		}

		& li[aria-current] {
			color: var(--rg-ink);
			font-weight: 500;
		}
	}

	/* Header
	--------------------------------------------- */

	& .gg-reg-head {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
		max-width: 768px;
		padding-bottom: 20px;

		& h1 {
			margin: 0;
			color: var(--rg-ink);
			font-family: var(--rg-serif);
			font-size: 56px;
			font-weight: 500;
			line-height: 64px;
			letter-spacing: -1.4px;
		}

		& p {
			color: var(--rg-text);
			font-size: 17px;
			line-height: 28px;
		}
	}

	& .gg-reg-badge {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		padding: 4px 10px;
		border-radius: 2px;
		background: var(--rg-soft);
		font-size: 10px;
		font-weight: 700;
		line-height: 14px;
		letter-spacing: 0.5px;
		text-transform: uppercase;

		& .gg-icon {
			color: var(--rg-gold);
		}
	}

	/* Notice about manual approval
	--------------------------------------------- */

	& .gg-reg-notice {
		display: flex;
		align-items: flex-start;
		gap: 16px;
		padding: 28px;
		border-radius: 8px;
		background: var(--rg-field);
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	}

	& .gg-reg-notice__icon {
		display: flex;
		flex: 0 0 40px;
		align-items: center;
		justify-content: center;
		width: 40px;
		height: 40px;
		margin-top: 2px;
		border-radius: 12px;
		color: var(--rg-gold);
		background: rgba(179, 146, 76, 0.15);
	}

	& .gg-reg-notice__body {
		flex: 1 1 auto;
		min-width: 0;

		& h2 {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			gap: 4px 8px;
			margin: 0 0 3px;
			font-family: var(--rg-sans);
			font-size: 16px;
			font-weight: 600;
			line-height: 24px;
		}

		& p {
			color: var(--rg-text);
			font-size: 15px;
			line-height: 24px;
		}
	}

	& .gg-reg-notice__tag {
		padding: 2px 8px;
		border-radius: 2px;
		color: var(--rg-gold);
		background: #fbf9f5;
		font-size: 10px;
		font-weight: 700;
		line-height: 14px;
		letter-spacing: 1.2px;
		text-transform: uppercase;
	}

	& .gg-reg-notice__time {
		display: inline-flex;
		flex: 0 0 auto;
		align-items: center;
		gap: 8px;
		padding: 6px 12px;
		border-radius: 2px;
		color: var(--rg-text);
		background: #fff;
		white-space: nowrap;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.96px;

		& .gg-icon {
			color: var(--rg-gold);
		}
	}

	/* Grid
	--------------------------------------------- */

	& .gg-reg-grid {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 485px;
		gap: 48px;
		align-items: start;
	}

	& .gg-reg-form {
		display: flex;
		flex-direction: column;
		gap: 48px;
		min-width: 0;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: none;
	}

	& form.gg-reg-fields {
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
	}

	& .gg-reg--login .gg-reg-form {
		gap: 28px;
	}

	& .gg-reg-card {
		display: flex;
		flex-direction: column;
		gap: 16px;
		padding: 28px;
		border-radius: 8px;
		background: #fff;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);

		& h2 {
			margin: 0;
			color: var(--rg-ink);
			font-family: var(--rg-serif);
			font-size: 20px;
			font-weight: 600;
			line-height: 28px;
		}
	}

	& .gg-reg-card__head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;

		& > .gg-icon {
			color: var(--rg-muted);
		}
	}

	& .gg-reg-tag {
		color: var(--rg-muted);
		font-size: 10px;
		font-weight: 700;
		line-height: 14px;
		letter-spacing: 0.5px;
		text-transform: uppercase;
	}

	& .gg-reg-tag--gold {
		color: var(--rg-gold);
	}

	/* Account type
	--------------------------------------------- */

	& .gg-reg-types {
		display: flex;
		gap: 16px;
	}

	& .gg-reg-type {
		position: relative;
		display: flex;
		flex: 1 1 0;
		flex-direction: column;
		min-width: 0;
		padding: 16px;
		border-radius: 4px;
		background: var(--rg-field);
		cursor: pointer;
		transition: background-color 0.15s ease, box-shadow 0.15s ease;

		& input {
			position: absolute;
			opacity: 0;
			pointer-events: none;
		}

		&:hover {
			background: #f0ede7;
		}

		&:has(input:checked) {
			background: var(--rg-soft);
			box-shadow: inset 0 0 0 1px rgba(18, 18, 18, 0.12);
		}

		&:has(input:focus-visible) {
			outline: 2px solid var(--rg-ink);
			outline-offset: 2px;
		}

		& strong {
			margin-top: 0;
			font-size: 16px;
			font-weight: 600;
			line-height: 24px;
		}
	}

	& .gg-reg-type__top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-bottom: 8px;
	}

	& .gg-reg-type__icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 32px;
		height: 32px;
		border-radius: 12px;
		color: var(--rg-ink);
		background: #fff;
	}

	& .gg-reg-type__icon--gold {
		color: var(--rg-gold);
	}

	& .gg-reg-type__radio {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 16px;
		height: 16px;
		border: 1px solid #b8b3ab;
		border-radius: 50%;
		background: #fff;
	}

	& .gg-reg-type:has(input:checked) .gg-reg-type__radio {
		border-color: #000;
		background: #000;

		&::after {
			content: "";
			width: 6px;
			height: 6px;
			border-radius: 50%;
			background: #fbf9f5;
		}
	}

	& .gg-reg-type__text {
		margin-top: 0;
		color: var(--rg-text);
		font-size: 13px;
		line-height: 20px;
	}

	/* Fields
	--------------------------------------------- */

	& .gg-reg-fields {
		display: flex;
		flex-direction: column;
		gap: 16px;
	}

	& .gg-reg-field {
		display: flex;
		flex-direction: column;
		gap: 4px;
		min-width: 0;
		margin: 0;

		& label {
			display: block;
			margin: 0;
			color: var(--rg-ink);
			font-size: 16px;
			font-weight: 600;
			line-height: 24px;
		}

		& .req {
			color: var(--rg-gold);
			text-decoration: none;
		}

		& small {
			color: var(--rg-muted);
			font-size: 13px;
			line-height: 20px;
		}
	}

	& .gg-reg-field__row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;

		& .gg-reg-tag {
			letter-spacing: 1.2px;
		}
	}

	& .gg-reg-field :is(input[type="text"], input[type="email"], input[type="password"], input[type="tel"]) {
		display: block;
		width: 100%;
		height: 43px;
		margin: 0;
		padding: 11px 14px 12px;
		border: 0;
		border-radius: 2px;
		color: var(--rg-ink);
		background: var(--rg-field);
		box-shadow: none;
		font-family: var(--rg-sans);
		font-size: 15px;
		line-height: 20px;
		letter-spacing: normal;
		appearance: none;
		transition: box-shadow 0.15s ease, background-color 0.15s ease;

		&::placeholder {
			color: var(--rg-muted);
			opacity: 1;
		}

		&:focus {
			outline: 0;
			box-shadow: 0 0 0 2px var(--rg-gold);
		}
	}

	& .gg-reg-cols {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
	}

	& .gg-reg-cols--postal {
		grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	}

	& .gg-reg-password,
	& .gg-reg-phone {
		position: relative;
		display: block;
	}

	& .gg-reg-field .gg-reg-password input {
		padding-right: 44px;
	}

	/* WooCommerce adds its own eye button; ours replaces it. */
	& .gg-reg-password .show-password-input {
		display: none !important;
	}

	& .gg-reg-eye {
		position: absolute;
		top: 50%;
		right: 12px;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 28px;
		height: 28px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 4px;
		color: var(--rg-muted);
		background: none;
		box-shadow: none;
		transform: translateY(-50%);
		cursor: pointer;

		&:hover {
			color: var(--rg-ink);
			background: none;
		}

		& .gg-icon--eyeoff {
			display: none;
		}

		&[aria-pressed="true"] .gg-icon--eye {
			display: none;
		}

		&[aria-pressed="true"] .gg-icon--eyeoff {
			display: block;
		}
	}

	& .gg-reg-meter {
		display: flex;
		gap: 2px;
		height: 4px;
		margin-top: 4px;
		overflow: hidden;
		border-radius: 12px;
		background: var(--rg-soft);

		& i {
			flex: 1 1 0;
			background: rgba(110, 106, 100, 0.2);
			transition: background-color 0.2s ease;
		}

		&[data-score="1"] i:nth-child(-n + 1) {
			background: #ba1a1a;
		}

		&[data-score="2"] i:nth-child(-n + 2) {
			background: #d9822b;
		}

		&[data-score="3"] i:nth-child(-n + 3) {
			background: var(--rg-gold-bright);
		}

		&[data-score="4"] i:nth-child(-n + 4) {
			background: #4a7c59;
		}
	}

	& .gg-reg-phone__prefix {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 14px;
		display: flex;
		align-items: center;
		color: var(--rg-muted);
		font-size: 15px;
		line-height: 24px;
		pointer-events: none;
	}

	& .gg-reg-field .gg-reg-phone input[type="tel"] {
		padding-left: 56px;
	}

	/* Business fields */

	& .gg-reg-b2b {
		display: flex;
		flex-direction: column;
		gap: 16px;
		padding: 16px;
		border-radius: 4px;
		background: var(--rg-field);

		&[hidden] {
			display: none;
		}

		& .gg-reg-field input {
			background: #fff;
		}

		& .gg-reg-field.is-skipped {
			opacity: 0.45;
		}
	}

	& .gg-org-lookup {
		color: var(--rg-muted);
		font-size: 13px;
		line-height: 20px;

		&[data-state="ok"] {
			color: #4a7c59;
		}

		&[data-state="error"] {
			color: #ba1a1a;
		}
	}

	& .gg-reg-info {
		display: flex;
		align-items: center;
		gap: 8px;
		color: var(--rg-muted);
		font-size: 13px;
		line-height: 20px;

		& .gg-icon {
			color: var(--rg-gold);
		}
	}

	/* Country dropdown */

	& .gg-reg-field .gg-select {
		& .gg-select__btn {
			min-height: 44px;
			padding: 10px 14px;
			border: 0;
			border-radius: 2px;
			color: var(--rg-ink);
			background: var(--rg-field);
			font-family: var(--rg-sans);
			font-size: 15px;
			line-height: 24px;

			&:hover {
				background: #f0ede7;
				color: var(--rg-ink);
			}

			&:focus-visible {
				outline: 0;
				box-shadow: 0 0 0 2px var(--rg-gold);
			}
		}

		& .gg-select__chev {
			color: var(--rg-muted);
		}
	}

	/* Consent */

	& .gg-reg-check {
		display: flex;
		align-items: flex-start;
		gap: 8px;
		margin: 0;
		color: var(--rg-text);
		font-size: 13px;
		font-weight: 400;
		line-height: 21px;
		cursor: pointer;

		& input {
			flex: 0 0 14px;
			width: 14px;
			height: 14px;
			margin: 3px 0 0;
			border-radius: 2.5px;
			accent-color: #000;
		}

		& a {
			color: var(--rg-gold);
			text-decoration: underline;
			text-underline-offset: 2px;
		}

		& .req {
			color: var(--rg-gold);
		}
	}

	/* Submit */

	& .gg-reg-submit {
		display: flex;
		flex-direction: column;
		gap: 16px;
	}

	& .gg-reg-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		width: 100%;
		min-height: 48px;
		margin: 0;
		padding: 16px 24px;
		border: 0 !important;
		border-radius: 2px;
		color: #fff !important;
		background: #000 !important;
		box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
		font-family: var(--rg-sans);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.6px;
		text-align: center;
		text-transform: uppercase;
		cursor: pointer;
		transition: background-color 0.15s ease;

		&:hover,
		&:focus-visible {
			color: #fff !important;
			background: #2a2a2a !important;
		}
	}

	& .gg-reg-btn.gg-reg-btn--light {
		width: auto;
		min-height: 0;
		padding: 12px 24px;
		color: var(--rg-ink) !important;
		background: #fff !important;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
		white-space: nowrap;

		&:hover,
		&:focus-visible {
			color: var(--rg-ink) !important;
			background: #faf7f2 !important;
		}
	}

	& .gg-reg-switch {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		color: var(--rg-text);
		font-size: 13px;
		line-height: 24px;
		text-align: center;

		& a {
			color: var(--rg-gold);
			font-size: 16px;
			font-weight: 600;
			text-decoration: underline;
			text-underline-offset: 3px;
		}
	}

	& .gg-reg-forgot {
		color: var(--rg-gold);
		font-size: 13px;
		font-weight: 600;
		line-height: 20px;

		&:hover {
			color: var(--rg-ink);
		}
	}

	& .gg-reg-cta {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 24px;
		background: var(--rg-sand);

		& p:not(.gg-reg-tag) {
			margin-top: 4px;
			color: var(--rg-text);
			font-size: 13px;
			line-height: 20px;
		}

		& .gg-reg-tag {
			color: var(--rg-gold);
		}
	}

	/* Sidebar
	--------------------------------------------- */

	& .gg-reg-side {
		display: flex;
		flex-direction: column;
		gap: 28px;
		min-width: 0;
	}

	& .gg-reg-benefits {
		gap: 4px;
	}

	& .gg-reg-benefits__list {
		display: flex;
		flex-direction: column;
		gap: 28px;
		padding: 24px 0;

		& li {
			display: flex;
			align-items: flex-start;
			gap: 8px;
		}

		& h3 {
			margin: 0;
			font-family: var(--rg-sans);
			font-size: 16px;
			font-weight: 600;
			line-height: 24px;
		}

		& p {
			margin-top: 1px;
			color: var(--rg-text);
			font-size: 13px;
			line-height: 21px;
		}
	}

	& .gg-reg-benefits__icon {
		display: flex;
		flex: 0 0 36px;
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		margin-top: 2px;
		border-radius: 12px;
		color: var(--rg-ink);
		background: #eae8e4;
	}

	& .gg-reg-level {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;
		padding: 16px;
		border-radius: 2px;
		background: var(--rg-sand);
	}

	& .gg-reg-level__title {
		font-size: 16px;
		font-weight: 600;
		line-height: 24px;
	}

	& .gg-reg-level__badge {
		padding: 4px 10px;
		border-radius: 2px;
		color: var(--rg-gold);
		background: #fff;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.96px;
		white-space: nowrap;
	}

	& .gg-reg-founder {
		align-items: stretch;
		gap: 15px;
		padding-bottom: 0;
	}

	& .gg-reg-founder__head {
		display: flex;
		align-items: center;
		gap: 16px;

		& h2 {
			line-height: 25px;
		}

		& p {
			color: var(--rg-gold);
			font-size: 13px;
			font-weight: 500;
			line-height: 20px;
		}
	}

	& .gg-reg-founder__photo {
		display: flex;
		flex: 0 0 64px;
		align-items: center;
		justify-content: center;
		width: 64px;
		height: 64px;
		overflow: hidden;
		border-radius: 12px;
		color: var(--rg-gold);
		background: var(--rg-sand);
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);

		& img {
			display: block;
			width: 100%;
			height: 100%;
			object-fit: cover;
			object-position: center 25%;
		}

		& span {
			font-family: var(--rg-serif);
			font-size: 22px;
			font-weight: 500;
		}
	}

	& .gg-reg-stars {
		display: flex;
		gap: 4px;
		padding-top: 2px;
		color: var(--rg-gold);

		& .gg-icon {
			fill: currentColor;
		}
	}

	& .gg-reg-founder blockquote {
		margin: 0;
		color: var(--rg-text);
		font-family: var(--rg-serif);
		font-size: 15px;
		font-style: italic;
		line-height: 24px;
	}

	& .gg-reg-contact {
		display: flex;
		flex-direction: column;
		gap: 8px;
		margin: 0 -28px;
		padding: 17px 28px 16px;
		border-radius: 0 0 8px 8px;
		background: var(--rg-field);
	}

	& .gg-reg-contact__links {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 4px 16px;

		& a {
			display: inline-flex;
			align-items: center;
			gap: 6px;
			color: var(--rg-ink);
			font-size: 13px;
			line-height: 20px;
			overflow-wrap: anywhere;
		}

		& a:hover {
			color: var(--rg-gold);
		}

		& .gg-icon {
			color: var(--rg-gold);
		}
	}

	& .gg-reg-safe {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 8px 16px;
		padding: 16px;
		border-radius: 8px;
		color: var(--rg-text);
		background: var(--rg-soft);

		& span {
			display: inline-flex;
			align-items: center;
			gap: 6px;
		}

		& .gg-icon {
			color: var(--rg-gold);
		}
	}
}

/* Responsive
--------------------------------------------- */

@media (max-width: 1100px) {
	body.gg-modern-shop:not(#gg) .gg-reg {
		& .gg-reg-grid {
			grid-template-columns: minmax(0, 1fr);
		}

		& .gg-reg-head h1 {
			font-size: 48px;
			line-height: 56px;
		}
	}
}

@media (max-width: 760px) {
	body.gg-modern-shop:not(#gg) .gg-reg {
		& .gg-reg__inner {
			gap: 24px;
			padding: 32px 16px 56px;
		}

		& .gg-reg-head {
			padding-bottom: 8px;
		}

		& .gg-reg-head h1 {
			font-size: 40px;
			line-height: 48px;
			letter-spacing: -1px;
		}

		& .gg-reg-head p {
			font-size: 16px;
			line-height: 26px;
		}

		& .gg-reg-notice {
			flex-wrap: wrap;
			padding: 20px;
		}

		& .gg-reg-notice__body {
			flex-basis: calc(100% - 56px);
		}

		& .gg-reg-notice__time {
			margin-left: 56px;
		}

		& .gg-reg-form {
			gap: 24px;
		}

		& .gg-reg-card {
			padding: 20px;
		}

		& .gg-reg-types,
		& .gg-reg-cols,
		& .gg-reg-cta {
			grid-template-columns: minmax(0, 1fr);
			flex-direction: column;
			align-items: stretch;
		}

		& .gg-reg-cols--postal {
			grid-template-columns: minmax(0, 1fr);
		}

		& .gg-reg-cta .gg-reg-btn {
			width: 100%;
		}

		& .gg-reg-contact {
			margin: 0 -20px;
			padding-inline: 20px;
		}
	}
}

/**
 * Forgotten password, confirmation and new password.
 * Figma: Glemt passord 1280.
 */

body.gg-modern-shop:has(.gg-rec) {
	overflow-x: clip;
	background-color: #fbf9f5;
}

body.gg-modern-shop .e-con:has(.gg-rec) {
	margin-block: 0;
	padding-block: 0;
}

body.gg-modern-shop .e-con:has(.gg-rec) > .e-con-inner {
	padding-block: 0;
}

body.gg-modern-shop:not(#gg) .gg-rec {
	--rc-ink: #121212;
	--rc-text: #1b1c1a;
	--rc-muted: #6e6a64;
	--rc-line: #eae4dc;
	--rc-gold: #d4af37;
	--rc-gold-deep: #b3924c;
	--rc-field: #f5f3ef;
	--rc-sand: #f4efea;
	--rc-serif: "Playfair Display", Georgia, "Times New Roman", serif;
	--rc-sans: "Manrope", "Helvetica Neue", Helvetica, Arial, sans-serif;

	position: relative;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	margin: 0 0 0 calc(50% - 50vw);
	color: var(--rc-text);
	font-family: var(--rc-sans);
	font-size: 13px;
	line-height: 20px;
	letter-spacing: normal;
	text-align: left;

	& *,
	& *::before,
	& *::after {
		box-sizing: border-box;
	}

	& :is(p, ul, ol, h1, h2, h3) {
		margin: 0;
		padding: 0;
	}

	& :is(ul, ol) {
		list-style: none;
	}

	& a {
		text-decoration: none;
	}

	& .gg-icon {
		flex: 0 0 auto;
	}

	& .gg-rec__glow {
		position: absolute;
		top: 48px;
		left: calc(50% - 360px);
		width: 720px;
		height: 360px;
		background: linear-gradient(180deg, rgba(255, 224, 130, 0.2) 0%, rgba(244, 239, 234, 0.4) 50%, rgba(244, 239, 234, 0) 100%);
		filter: blur(32px);
		pointer-events: none;
	}

	& .gg-rec__inner {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 40px;
		max-width: 1280px;
		margin: 0 auto;
		padding: 32px 48px 80px;
	}

	& .gg-rec__col {
		display: flex;
		flex-direction: column;
		gap: 32px;
		width: 100%;
		max-width: 672px;
	}

	& .gg-notices {
		padding: 0;
		background: none;
	}

	& .gg-notices__in {
		max-width: none;
	}

	/* Breadcrumbs */

	& .gg-rec-crumbs {
		align-self: stretch;

		& ol {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			gap: 8px;
			font-size: 12px;
			font-weight: 600;
			line-height: 16px;
			letter-spacing: 0.96px;
		}

		& a {
			color: var(--rc-muted);
		}

		& a:hover {
			color: var(--rc-ink);
		}

		& li[aria-hidden] {
			color: #c4c7c7;
			font-weight: 400;
		}

		& li[aria-current] {
			color: var(--rc-text);
		}
	}

	/* Card */

	& .gg-rec-card {
		padding: 56px;
		border-radius: 8px;
		background: #fff;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	}

	& .gg-rec-card__head {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 26px 24px 0;
		text-align: center;

		& h1 {
			margin: 0 0 16px;
			color: var(--rc-ink);
			font-family: var(--rc-serif);
			font-size: 40px;
			font-weight: 400;
			line-height: 48px;
			letter-spacing: -1px;
		}

		& p {
			max-width: 512px;
			margin-bottom: 26px;
			color: var(--rc-muted);
			font-size: 15px;
			line-height: 24px;
		}
	}

	& .gg-rec-card__icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 64px;
		height: 58px;
		margin-bottom: 16px;
		border-radius: 12px;
		color: var(--rc-gold);
		background: var(--rc-sand);
	}

	/* Form */

	& .gg-rec-form {
		display: flex;
		flex-direction: column;
		gap: 24px;
		margin: 0;
		padding: 0 0 40px;
		border: 0;
		border-radius: 0;
		background: none;
	}

	& .gg-rec-field {
		display: flex;
		flex-direction: column;
		gap: 8px;
		margin: 0;
	}

	& .gg-rec-field__row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 16px;

		& label {
			margin: 0;
			color: var(--rc-ink);
			font-size: 12px;
			font-weight: 600;
			line-height: 16px;
			letter-spacing: 0.6px;
			text-transform: uppercase;
		}

		& .req {
			color: #ba1a1a;
		}
	}

	& .gg-rec-field__req {
		color: var(--rc-muted);
		font-size: 12px;
		line-height: 16px;
		letter-spacing: 0.6px;
	}

	& .gg-rec-field__hint {
		padding-left: 4px;
		color: var(--rc-muted);
		font-size: 13px;
		line-height: 20px;
	}

	& .gg-rec-input {
		position: relative;
		display: block;

		& > .gg-icon {
			position: absolute;
			top: 50%;
			left: 17px;
			color: var(--rc-muted);
			transform: translateY(-50%);
			pointer-events: none;
		}

		& input {
			display: block;
			width: 100%;
			height: 53px;
			margin: 0;
			padding: 15px 16px 16px 48px;
			border: 1px solid var(--rc-line);
			border-radius: 4px;
			color: var(--rc-ink);
			background: #fbf9f5;
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
			font-family: var(--rc-sans);
			font-size: 15px;
			line-height: 20px;
			letter-spacing: normal;
			appearance: none;
			transition: border-color 0.15s ease, box-shadow 0.15s ease;

			&::placeholder {
				color: rgba(110, 106, 100, 0.7);
				opacity: 1;
			}

			&:focus {
				outline: 0;
				border-color: var(--rc-gold-deep);
				box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.25);
			}
		}
	}

	& .gg-rec-input--password input {
		padding-right: 48px;
	}

	& .gg-rec-input .show-password-input {
		display: none !important;
	}

	& .gg-rec-eye {
		position: absolute;
		top: 50%;
		right: 12px;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 28px;
		height: 28px;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 4px;
		color: var(--rc-muted);
		background: none;
		box-shadow: none;
		transform: translateY(-50%);
		cursor: pointer;

		&:hover {
			color: var(--rc-ink);
			background: none;
		}

		& .gg-icon--eyeoff {
			display: none;
		}

		&[aria-pressed="true"] .gg-icon--eye {
			display: none;
		}

		&[aria-pressed="true"] .gg-icon--eyeoff {
			display: block;
		}
	}

	& .gg-rec-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 8px;
		width: 100%;
		min-height: 48px;
		margin: 0;
		padding: 16px 24px;
		border: 0 !important;
		border-radius: 4px;
		color: var(--rc-sand) !important;
		background: var(--rc-ink) !important;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
		font-family: var(--rc-sans);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 1.2px;
		text-align: center;
		text-transform: uppercase;
		cursor: pointer;
		transition: background-color 0.15s ease;

		&:hover,
		&:focus-visible {
			color: #fff !important;
			background: #2a2a2a !important;
		}
	}

	/* Steps */

	& .gg-rec-steps {
		display: flex;
		flex-direction: column;
		gap: 20px;
		padding-top: 40px;
		border-top: 1px solid var(--rc-line);

		& h2 {
			display: flex;
			align-items: center;
			gap: 8px;
			margin: 0;
			color: var(--rc-ink);
			font-family: var(--rc-sans);
			font-size: 16px;
			font-weight: 600;
			line-height: 24px;

			& .gg-icon {
				color: var(--rc-gold);
			}
		}

		& ol {
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			gap: 20px;
		}

		& li {
			display: flex;
			flex-direction: column;
			gap: 8px;
			padding: 16px;
			border-radius: 4px;
			background: var(--rc-field);
			font-size: 13px;
			line-height: 18px;
		}

		& strong {
			font-weight: 700;
		}
	}

	& .gg-rec-steps__top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		color: var(--rc-muted);

		& span {
			color: var(--rc-gold-deep);
			font-size: 10px;
			font-weight: 700;
			line-height: 14px;
			letter-spacing: 0.5px;
			text-transform: uppercase;
		}
	}

	/* Footer row */

	& .gg-rec-foot {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 12px 24px;
		margin-top: 46px;
		padding-top: 24px;
		border-top: 1px solid var(--rc-line);
	}

	& .gg-rec-foot__back {
		display: flex;
		align-items: center;
		gap: 8px;
		color: var(--rc-muted);
		font-size: 13px;
		line-height: 20px;

		& a {
			color: var(--rc-ink);
			font-size: 12px;
			font-weight: 600;
			line-height: 16px;
			letter-spacing: 0.96px;
			text-decoration: underline;
			text-underline-offset: 3px;
		}

		& a:hover {
			color: var(--rc-gold-deep);
		}
	}

	& .gg-rec-foot__call {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		color: var(--rc-muted);
		font-size: 12px;
		font-weight: 600;
		line-height: 16px;
		letter-spacing: 0.96px;

		& .gg-icon {
			color: var(--rc-gold);
		}

		&:hover {
			color: var(--rc-ink);
		}
	}

	/* Help card */

	& .gg-rec-help {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 24px;
		padding: 24px;
		border-radius: 8px;
		background: rgba(244, 239, 234, 0.8);
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	}

	& .gg-rec-help__intro {
		display: flex;
		align-items: center;
		gap: 16px;
		flex: 1 1 auto;
		min-width: 0;

		& h2 {
			margin: 0 0 4px;
			color: var(--rc-ink);
			font-family: var(--rc-sans);
			font-size: 16px;
			font-weight: 600;
			line-height: 24px;
		}

		& p {
			color: var(--rc-muted);
			font-size: 13px;
			line-height: 20px;
		}
	}

	& .gg-rec-help__icon {
		display: flex;
		flex: 0 0 48px;
		align-items: center;
		justify-content: center;
		width: 48px;
		height: 48px;
		border-radius: 12px;
		color: var(--rc-gold);
		background: #fff;
		box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	}

	& .gg-rec-help__links {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		flex: 0 0 auto;
		justify-content: flex-end;
		gap: 12px;

		& a {
			display: inline-flex;
			align-items: center;
			gap: 6px;
			padding: 8px 16px;
			border-radius: 4px;
			color: var(--rc-ink);
			background: #fff;
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
			font-size: 12px;
			font-weight: 600;
			line-height: 16px;
			letter-spacing: 0.96px;
			white-space: nowrap;
		}

		& a:hover {
			color: var(--rc-gold-deep);
		}

		& .gg-icon {
			color: var(--rc-gold);
		}
	}
}

@media (max-width: 760px) {
	body.gg-modern-shop:not(#gg) .gg-rec {
		& .gg-rec__inner {
			gap: 24px;
			padding: 24px 16px 56px;
		}

		& .gg-rec__col {
			gap: 20px;
		}

		& .gg-rec-card {
			padding: 28px 20px;
		}

		& .gg-rec-card__head {
			padding-inline: 0;
		}

		& .gg-rec-card__head h1 {
			font-size: 32px;
			line-height: 40px;
		}

		& .gg-rec-steps ol {
			grid-template-columns: minmax(0, 1fr);
			gap: 12px;
		}

		& .gg-rec-foot {
			margin-top: 32px;
		}

		& .gg-rec-help {
			flex-direction: column;
			align-items: stretch;
		}

		& .gg-rec-help__intro {
			flex-basis: auto;
		}

		& .gg-rec-help__links {
			justify-content: flex-start;
		}
	}
}