:root {
					--gold: #d29a2e;
					--gold-dark: #a96d08;
					--gold-light: #f4ca70;
					--dark: #071c18;
					--dark-2: #0d2b25;
					--green: #174b3d;
					--bg: #f7f5f1;
					--text: #202725;
					--muted: #6e7774;
			}

			* {
					box-sizing: border-box;
			}

			body {
					font-family: "DM Sans", sans-serif;
					background: var(--bg);
					color: var(--text);
					overflow-x: hidden;
			}

			a {
					text-decoration: none;
			}

			/* =========================
				 TOP BAR
			========================= */

			.topbar {
					background: linear-gradient(90deg, #071814, #0d2a23);
					color: #e8d3a2;
					font-size: 13px;
					padding: 10px 0;
			}

			.topbar a {
					color: #e8d3a2;
			}

			/* =========================
				 NAVBAR
			========================= */

			.navbar-custom {
					background: rgba(255,255,255,.92);
					backdrop-filter: blur(20px);
					border-bottom: 1px solid #ece8e1;
					padding: 18px 0;
			}

			.brand {
					font-size: 32px;
					font-weight: 700;
					color: var(--gold-dark);
					letter-spacing: -1px;
			}

			.brand i {
					font-size: 28px;
			}

			.brand img {
					height: 48px;
					margin-top: -5px;
			}

			.navbar-nav .nav-link {
					color: #303735;
					font-size: 14px;
					font-weight: 600;
					padding: 10px 15px !important;
			}

			.navbar-nav .nav-link:hover {
					color: var(--gold-dark);
			}

			.btn-login {
					border: 1px solid #d7d4ce;
					background: white;
					padding: 10px 25px;
					border-radius: 10px;
					font-weight: 600;
					color: #333;
			}

			.btn-register {
					background: linear-gradient(135deg, var(--gold-light), var(--gold-dark));
					color: white;
					padding: 10px 28px;
					border-radius: 10px;
					font-weight: 700;
					border: 0;
			}

			/* =========================
				 HERO
			========================= */

			.hero {
					position: relative;
					overflow: hidden;
					padding: 70px 0 60px;
					background:
							radial-gradient(circle at 50% 40%, rgba(240,190,90,.18), transparent 35%),
							linear-gradient(135deg, #f8f7f3, #ece9e2);
			}

			.hero::before {
					content: "";
					position: absolute;
					width: 650px;
					height: 650px;
					border: 2px solid rgba(215,160,50,.18);
					border-radius: 50%;
					left: 50%;
					top: 45%;
					transform: translate(-50%, -50%);
			}

			.hero-content {
					position: relative;
					z-index: 2;
			}

			.badge-trusted {
					display: inline-flex;
					align-items: center;
					gap: 8px;
					padding: 10px 17px;
					border: 1px solid #ded8cd;
					border-radius: 50px;
					color: #9a6c1b;
					background: rgba(255,255,255,.5);
					font-size: 13px;
					font-weight: 600;
			}

			.hero-title {
					font-size: clamp(42px, 5vw, 66px);
					line-height: 1.05;
					font-weight: 800;
					letter-spacing: -2px;
					margin: 25px 0;
			}

			.hero-title span {
					color: var(--gold-dark);
			}

			.hero-desc {
					font-size: 17px;
					line-height: 1.7;
					color: #58615e;
					max-width: 500px;
			}

			.btn-gold {
					background: linear-gradient(135deg, #e2ac42, #ae7208);
					color: white;
					border: 0;
					padding: 16px 27px;
					border-radius: 10px;
					font-weight: 700;
					box-shadow: 0 10px 25px rgba(180,125,20,.2);
			}

			.btn-outline-custom {
					background: rgba(255,255,255,.6);
					border: 1px solid #d5d1ca;
					padding: 15px 27px;
					border-radius: 10px;
					font-weight: 700;
					color: #343a38;
			}

			.hero-mini-info {
					display: flex;
					gap: 25px;
					margin-top: 40px;
					flex-wrap: wrap;
			}

			.mini-item {
					display: flex;
					align-items: center;
					gap: 10px;
			}

			.mini-icon {
					width: 42px;
					height: 42px;
					border-radius: 50%;
					border: 1px solid #d9bc7c;
					color: var(--gold-dark);
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 20px;
			}

			.mini-item strong {
					display: block;
					font-size: 13px;
			}

			.mini-item small {
					color: var(--muted);
					font-size: 11px;
			}

			/* =========================
				 GOLD VISUAL
			========================= */

			.gold-visual {
					position: relative;
					min-height: 440px;
					display: flex;
					align-items: center;
					justify-content: center;
			}

			.gold-glow {
					position: absolute;
					width: 350px;
					height: 350px;
					border-radius: 50%;
					background: radial-gradient(circle, rgba(255,203,83,.35), transparent 65%);
			}

			.gold-bar {
					position: absolute;
					background:
							linear-gradient(
									135deg,
									#8d5700 0%,
									#d69a20 18%,
									#ffd66d 48%,
									#a96604 78%,
									#704000 100%
							);
					border: 4px solid #754300;
					box-shadow:
							inset 8px 8px 15px rgba(255,255,255,.3),
							inset -8px -8px 20px rgba(70,40,0,.35),
							0 30px 50px rgba(70,40,0,.3);
					color: #fff1bd;
					text-align: center;
					border-radius: 24px;
					z-index: 2;
			}

			.gold-bar.large {
					width: 190px;
					height: 300px;
					transform: rotate(7deg) translateX(-30px);
					padding-top: 55px;
			}

			.gold-bar.small {
					width: 125px;
					height: 190px;
					transform: rotate(-4deg) translate(100px, 70px);
					padding-top: 38px;
					z-index: 3;
			}

			.gold-bar .logo-mark {
					font-size: 42px;
					display: block;
			}

			.gold-bar .gold-brand {
					font-size: 25px;
					font-weight: 600;
			}

			.gold-bar .fine {
					margin-top: 28px;
					font-size: 18px;
					font-style: italic;
			}

			.gold-bar.small .gold-brand {
					font-size: 19px;
			}

			.gold-bar.small .fine {
					font-size: 13px;
					margin-top: 20px;
			}

			.gold-platform {
					position: absolute;
					width: 400px;
					height: 85px;
					background:
							radial-gradient(ellipse at top, #fff, #e4dfd4);
					border-radius: 50%;
					bottom: 25px;
					box-shadow: 0 20px 30px rgba(0,0,0,.12);
			}

			/* =========================
				 PRICE CARD
			========================= */

			.price-card {
					background:
							linear-gradient(145deg, #102b25, #061613);
					color: white;
					border-radius: 20px;
					padding: 27px;
					box-shadow: 0 20px 45px rgba(0,0,0,.18);
			}

			.price-card h4 {
					font-weight: 700;
			}

			.price-card .date {
					color: #b4bbb8;
					font-size: 12px;
			}

			.live-badge {
					background: #174d36;
					color: #9be1b5;
					border-radius: 30px;
					padding: 6px 10px;
					font-size: 11px;
			}

			.price-box {
					border: 1px solid rgba(255,255,255,.12);
					border-radius: 13px;
					padding: 14px;
					margin-top: 10px;
			}

			.price-box span {
					color: #bbc5c1;
					font-size: 13px;
			}

			.price-box strong {
					font-size: 15px;
			}

			.price-up {
					color: #7fd69d;
					font-size: 11px;
			}

			/* =========================
				 BENEFITS
			========================= */

			.benefits {
					margin-top: -10px;
					position: relative;
					z-index: 3;
			}

			.benefit-wrapper {
					background: white;
					border: 1px solid #ebe7e0;
					border-radius: 22px;
					box-shadow: 0 10px 35px rgba(0,0,0,.05);
					padding: 25px;
			}

			.benefit-item {
					display: flex;
					gap: 15px;
					padding: 10px 20px;
					border-right: 1px solid #e7e4de;
			}

			.benefit-item:last-child {
					border-right: 0;
			}

			.benefit-icon {
					min-width: 50px;
					height: 50px;
					border-radius: 50%;
					background: #faf7f0;
					color: var(--gold-dark);
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 25px;
			}

			.benefit-item h6 {
					margin-bottom: 5px;
					font-weight: 700;
			}

			.benefit-item p {
					margin: 0;
					font-size: 12px;
					line-height: 1.6;
					color: var(--muted);
			}

			/* =========================
				 PRODUCTS
			========================= */

			.section {
					padding: 70px 0;
			}

			.section-title {
					font-size: 30px;
					font-weight: 800;
					letter-spacing: -1px;
			}

			.product-card {
					position: relative;
					height: 100%;
					min-height: 300px;
					background: white;
					border: 1px solid #e7e3dc;
					border-radius: 18px;
					padding: 25px;
					overflow: hidden;
					transition: .3s ease;
			}

			.product-card:hover {
					transform: translateY(-7px);
					box-shadow: 0 18px 40px rgba(0,0,0,.08);
			}

			.product-card h5 {
					font-weight: 700;
			}

			.product-card p {
					font-size: 13px;
					line-height: 1.7;
					color: var(--muted);
					max-width: 190px;
			}

			.product-link {
					color: var(--green);
					font-size: 13px;
					font-weight: 700;
					position: absolute;
					bottom: 22px;
			}

			.product-visual {
					position: absolute;
					right: 15px;
					bottom: 15px;
					font-size: 100px;
					color: var(--gold);
					opacity: .9;
			}

			.product-card.digital .product-visual {
					color: #1c2422;
			}

			/* =========================
				 AGENT CTA
			========================= */

			.agent-banner {
					background:
							linear-gradient(100deg, #0a2a23, #123b31);
					color: white;
					border-radius: 22px;
					padding: 35px 40px;
					overflow: hidden;
					position: relative;
			}

			.agent-banner::after {
					content: "";
					position: absolute;
					width: 300px;
					height: 300px;
					border: 1px solid rgba(212,154,45,.15);
					border-radius: 50%;
					right: -70px;
					top: -100px;
			}

			.agent-icon {
					width: 75px;
					height: 75px;
					border: 1px solid rgba(219,169,70,.5);
					color: var(--gold-light);
					border-radius: 15px;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 36px;
			}

			.btn-light-custom {
					background: white;
					color: #20302b;
					padding: 15px 25px;
					border-radius: 10px;
					font-weight: 700;
			}

			/* =========================
				 PARTNERS
			========================= */

			.partners {
					padding: 50px 0;
			}

			.partner-name {
					font-size: 20px;
					font-weight: 700;
					color: #63706c;
					text-align: center;
					opacity: .85;
			}

			/* =========================
				 FOOTER
			========================= */

			footer {
					background: #071a16;
					color: #cbd3d0;
					padding: 60px 0 30px;
					margin-top: 70px;
			}

			footer h5 {
					color: white;
					font-size: 15px;
					margin-bottom: 20px;
			}

			footer a {
					display: block;
					color: #aab5b1;
					margin-bottom: 10px;
					font-size: 13px;
			}

			footer a:hover {
					color: var(--gold-light);
			}

			.footer-brand{
					color: var(--gold-light);
					font-size: 30px;
					font-weight: 800;
			}

			.footer-brand img{
					height: 36px;
					margin-top: -5px;
			}

			/* =========================
				 MOBILE NAV
			========================= */

			.mobile-bottom-nav {
					display: none;
			}

			/* =========================
				 RESPONSIVE
			========================= */

			@media (max-width: 991px) {

					.hero {
							padding-top: 45px;
					}

					.hero-title {
							font-size: 46px;
					}

					.gold-visual {
							min-height: 380px;
							margin: 30px 0;
					}

					.price-card {
							margin-top: 20px;
					}

					.benefit-item {
							border-right: 0;
							border-bottom: 1px solid #eee;
					}

					.benefit-item:last-child {
							border-bottom: 0;
					}
			}

			@media (max-width: 768px) {

					body {
							padding-bottom: 75px;
					}

					.topbar {
							font-size: 11px;
					}

					.topbar .location-link {
							display: none;
					}

					.navbar-custom {
							padding: 14px 0;
					}

					.brand {
							font-size: 28px;
					}

					.hero {
							padding: 35px 0 30px;
					}

					.hero-title {
							font-size: 40px;
							letter-spacing: -1px;
					}

					.hero-desc {
							font-size: 15px;
					}

					.gold-visual {
							transform: scale(.85);
							margin: -20px 0 -10px;
					}

					.price-card {
							border-radius: 18px;
							padding: 20px;
					}

					.price-card .row {
							row-gap: 12px;
					}

					.hero-mini-info {
							gap: 15px;
					}

					.mini-item {
							width: 100%;
					}

					.benefits {
							margin-top: 0;
					}

					.benefit-wrapper {
							padding: 10px;
							border-radius: 18px;
					}

					.benefit-item {
							padding: 18px 10px;
					}

					.section {
							padding: 45px 0;
					}

					.section-title {
							font-size: 25px;
					}

					.product-card {
							min-height: 260px;
					}

					.product-visual {
							font-size: 75px;
					}

					.agent-banner {
							padding: 25px;
					}

					.agent-icon {
							width: 60px;
							height: 60px;
							font-size: 28px;
					}

					.desktop-nav {
							display: none;
					}

					.mobile-bottom-nav {
							display: flex;
							position: fixed;
							bottom: 0;
							left: 0;
							right: 0;
							height: 72px;
							background: rgba(255,255,255,.97);
							backdrop-filter: blur(15px);
							z-index: 9999;
							border-top: 1px solid #e8e5df;
							justify-content: space-around;
							align-items: center;
					}

					.mobile-bottom-nav a {
							color: #69716e;
							font-size: 10px;
							text-align: center;
					}

					.mobile-bottom-nav i {
							display: block;
							font-size: 21px;
							margin-bottom: 3px;
					}

					.mobile-bottom-nav a.active {
							color: var(--gold-dark);
					}

					footer {
							margin-top: 0;
							padding-bottom: 30px;
					}
			}