@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:'Poppins',ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text)}
body{
	min-height:100vh;
	display:flex;
	flex-direction:column;
	background: linear-gradient(
		-45deg,
		#000000,
		#1a1a1a,
		#2d2d2d,
		#404040,
		#333333,
		#1a1a1a,
		#000000
	);
	background-size: 400% 400%;
	animation: gradient-shift 15s ease infinite, gradient-pulse 8s ease-in-out infinite;
	position: relative;
}

body::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: radial-gradient(
		circle at 20% 80%,
		rgba(255, 255, 255, 0.05) 0%,
		transparent 50%
	),
	radial-gradient(
		circle at 80% 20%,
		rgba(200, 200, 200, 0.08) 0%,
		transparent 50%
	),
	radial-gradient(
		circle at 40% 40%,
		rgba(150, 150, 150, 0.03) 0%,
		transparent 50%
	);
	pointer-events: none;
	z-index: -1;
}

:root{
	--brand:#F97316;
	--brand2:#EA580C;
	--brand-600:#EA580C;
	--accent:#EA580C;
	--accent2:#F59E0B;
	--text:#FFFFFF;
	--muted:#E0E0E0;
	--border:rgba(255, 255, 255, 0.15);
	--surface:rgba(255, 255, 255, 0.08);
	--surface-2:rgba(255, 255, 255, 0.12);
	--danger:#EF4444;
	--app-bg:#F1F5F9;
	--success:#10B981;
	--success-bg:#ECFDF5;
	--success-border:#A7F3D0;
	--success-text:#064E3B;
	--warning:#F59E0B;
	--warning-bg:#FFFBEB;
	--warning-border:#FED7AA;
	--warning-text:#92400E;
}

/* Animated Dark Gradient Background */
@keyframes gradient-shift {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

@keyframes gradient-pulse {
	0%, 100% {
		background-size: 200% 200%;
	}
	50% {
		background-size: 300% 300%;
	}
}

.container{max-width:1200px;margin:0 auto;padding:24px}
.section{padding:60px 24px}

/* Navigation */
.nav{display:flex;align-items:center;justify-content:space-between;padding:20px 32px;background:rgba(255, 255, 255, 0.12);backdrop-filter:blur(15px);position:sticky;top:0;z-index:40;box-shadow:0 8px 32px rgba(0,0,0,.4);margin-bottom:32px;border-radius:0;border:1px solid var(--border);clip-path:polygon(40px 0, calc(100% - 40px) 0, 100% 50%, calc(100% - 40px) 100%, 40px 100%, 0 50%)}
.nav a{color:var(--text);text-decoration:none;font-weight:500;margin:0 16px;transition:all .3s ease;font-size:15px}
.nav a:hover{color:var(--brand);transform:translateY(-1px)}
.nav .btn,.nav .icon-btn{margin-left:12px}
.nav-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:16px;text-decoration:none}
.logo{display:none !important}
.brand-name{font-family:'Poppins',sans-serif;font-weight:700;letter-spacing:-.5px;color:#FFFFFF !important;font-size:36px;background:none !important;-webkit-text-fill-color:#FFFFFF !important}

/* Mobile Navigation Toggle */
.nav-toggle{display:none;background:none;border:none;color:var(--text);font-size:24px;cursor:pointer;padding:8px}
.nav-menu{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* Responsive Navigation */
@media(max-width:1200px){
	.nav-actions{gap:6px}
	.nav a{margin:0 8px;font-size:14px}
}
@media(max-width:1024px){
	.nav-actions{gap:4px}
	.nav a{margin:0 6px;font-size:13px}
	.nav .btn,.nav .icon-btn{margin-left:4px;padding:8px 12px;font-size:12px}
}
@media(max-width:768px){
	.nav{padding:12px 16px;position:relative;clip-path:polygon(20px 0, calc(100% - 20px) 0, 100% 50%, calc(100% - 20px) 100%, 20px 100%, 0 50%)}
	.nav-toggle{display:block}
	.nav-actions{display:none}
	.nav-actions.nav-menu{display:flex;position:absolute;top:100%;left:0;right:0;background:var(--surface);border:2px solid var(--border);border-radius:12px;margin:8px 16px;padding:16px;flex-direction:column;align-items:stretch;gap:12px;box-shadow:0 8px 32px rgba(0,0,0,.3);z-index:50}
	.nav-actions.nav-menu a{margin:0;padding:8px 12px;border-radius:6px;text-align:center}
	.nav-actions.nav-menu a:hover{background:var(--brand);color:white}
	.nav-actions.nav-menu .btn{margin:0;justify-content:center}
	.brand-name{font-size:28px}
	.logo{display:none !important}
	.hero{padding:60px 20px;margin:16px auto;border-radius:16px;max-width:calc(100% - 32px)}
	.hero h1{font-size:clamp(24px,8vw,36px)}
	.hero p{font-size:clamp(15px,3.5vw,18px);max-width:100%}
}

/* BULLETPROOF NAVIGATION - CANNOT BE HIDDEN ON DESKTOP */
@media(min-width:769px){
	.nav-actions,
	.nav-actions.nav-menu,
	#navMenu,
	#navMenu.nav-menu {
		display: flex !important;
		flex-wrap: nowrap !important;
		position: static !important;
		background: none !important;
		border: none !important;
		box-shadow: none !important;
		margin: 0 !important;
		padding: 0 !important;
		flex-direction: row !important;
		align-items: center !important;
		gap: 8px !important;
		visibility: visible !important;
		opacity: 1 !important;
		height: auto !important;
		width: auto !important;
		overflow: visible !important;
		transform: none !important;
		transition: none !important;
	}
	
	.nav-actions a,
	.nav-actions button,
	#navMenu a,
	#navMenu button {
		display: inline-flex !important;
		visibility: visible !important;
		opacity: 1 !important;
		position: static !important;
		transform: none !important;
		transition: none !important;
	}
	
	.nav-toggle{
		display: none !important;
	}
}

/* EXTRA BULLETPROOF - FORCE NAVIGATION TO STAY VISIBLE ON DESKTOP */
@media(min-width:769px){
	.nav a,
	.nav .btn,
	.nav .icon-btn {
		display: inline-flex !important;
		visibility: visible !important;
		opacity: 1 !important;
		position: static !important;
		transform: none !important;
		transition: none !important;
		pointer-events: auto !important;
	}
	
	/* Override any potential mobile navigation styles on desktop */
	.nav-actions.nav-menu,
	#navMenu.nav-menu {
		display: flex !important;
		flex-direction: row !important;
		position: static !important;
		background: none !important;
		border: none !important;
		box-shadow: none !important;
		margin: 0 !important;
		padding: 0 !important;
		align-items: center !important;
		gap: 8px !important;
	}
}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,var(--brand),var(--brand2));color:white;padding:14px 28px;border-radius:16px;text-decoration:none;border:none;font-weight:600;cursor:pointer;box-shadow:0 8px 24px rgba(249,115,22,.25);transition:all .3s ease;font-size:15px;position:relative;overflow:hidden}
.btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .3s}
.btn:hover::before{left:100%}
.btn:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(249,115,22,.35);color:white}
.btn-outline{background:transparent;color:var(--text);border:2px solid var(--border);box-shadow:none}
.btn-outline:hover{background:linear-gradient(135deg,var(--brand),var(--brand2));border-color:var(--brand);transform:translateY(-3px);box-shadow:0 12px 32px rgba(249,115,22,.25);color:white !important}
.btn-danger{background:var(--danger)}
.btn-sm{padding:10px 20px;border-radius:12px;font-size:13px}
.btn-lg{padding:18px 36px;border-radius:20px;font-size:17px}
.btn-wide{padding-left:40px;padding-right:40px}

/* Navigation button styles */
.nav .btn,.nav .btn-sm,.nav .btn-lg{padding:10px 16px;border-radius:6px;font-size:14px;transition:all .2s ease}
.nav .btn:hover{transform:none;box-shadow:0 8px 24px rgba(249,115,22,.2)}
.nav .btn-outline:hover{color:white !important;background:linear-gradient(135deg,var(--brand),var(--brand2)) !important;border-color:var(--brand) !important}
.nav .btn::before{display:none}

/* Force white text for Start Designing CTAs */
a.btn[href="/signup.html"]{color:#fff !important}


/* Hero */
.hero{padding:100px 40px;text-align:center;background:rgba(255, 255, 255, 0.12);backdrop-filter:blur(20px);border-radius:32px;margin:32px auto;max-width:1200px;box-shadow:0 20px 60px rgba(0,0,0,.4);border:1px solid var(--border);position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="house-pattern" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"><circle cx="10" cy="10" r="1" fill="%233B82F6" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23house-pattern)"/></svg>');opacity:0.3}
.hero h1{font-family:'Poppins',sans-serif;font-size:clamp(28px,6vw,56px);line-height:1.2;margin:0 0 24px;color:var(--text);font-weight:800;letter-spacing:-.03em;border:none !important;outline:none !important;box-shadow:none !important;padding:0 0 .1em 0 !important;position:relative;z-index:1;text-wrap:balance;overflow-wrap:anywhere;hyphens:auto;display:inline-block;overflow:visible}
.hero p{color:var(--muted);max-width:900px;margin:0 auto 40px;font-size:clamp(16px,2.2vw,22px);line-height:1.7;position:relative;z-index:1;overflow-wrap:anywhere}
.hero .cta{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}

/* Glossy text effect */
.glossy-text{
	background: linear-gradient(135deg, 
		var(--brand) 0%, 
		var(--brand2) 25%, 
		var(--accent) 50%, 
		var(--accent2) 75%, 
		var(--brand) 100%);
	background-size: 300% 300%;
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	animation: glossy-shift 2s ease-in-out infinite;
	position: relative;
	text-shadow: 0 0 40px rgba(59, 130, 246, 0.2);
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 0 24px !important;
}

/* Prevent descender clipping on glossy titles too */
.glossy-text{line-height:1.2;display:inline-block;padding-bottom:.1em;overflow:visible}

.glossy-text::before {
	content: 'Design your dream home with AI-powered creativity.';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(135deg, 
		rgba(255, 255, 255, 0.4) 0%, 
		rgba(255, 255, 255, 0.1) 50%, 
		rgba(255, 255, 255, 0.4) 100%);
	background-size: 200% 200%;
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	animation: glossy-overlay 1s ease-in-out infinite;
	pointer-events: none;
}

@keyframes glossy-shift {
	0%, 100% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
}

@keyframes glossy-overlay {
	0%, 100% { 
		background-position: 0% 50%; 
		opacity: 0.6;
	}
	50% { 
		background-position: 100% 50%; 
		opacity: 0.8;
	}
}


@keyframes success-pulse {
	0%, 100% { 
		transform: scale(1);
		box-shadow: 0 4px 12px rgba(16,185,129,.3);
	}
	50% { 
		transform: scale(1.05);
		box-shadow: 0 6px 20px rgba(16,185,129,.4);
	}
}

@keyframes success-check {
	0% { 
		transform: scale(0) rotate(-45deg);
		opacity: 0;
	}
	50% { 
		transform: scale(1.2) rotate(-45deg);
		opacity: 1;
	}
	100% { 
		transform: scale(1) rotate(0deg);
		opacity: 1;
	}
}



/* Auth pages */
.auth h1{font-size:clamp(28px,6vw,48px);line-height:1.1;margin-bottom:16px;font-weight:800;text-align:center;text-wrap:balance}
.auth .form{max-width:480px;margin:0 auto}

/* Signup/Login pages */
.signup-section, .login-section{text-align:center}
.signup-section h1, .login-section h1{text-align:center;margin-bottom:16px}
.signup-section .help, .login-section .help{text-align:center;margin-bottom:24px}
.signup-section .form, .login-section .form{margin:0 auto}
.signup-section .form + div, .login-section .form + div{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:16px}
.signup-section .form + div .help, .login-section .form + div .help{margin:0;display:inline-block;line-height:1.2}
.signup-section .form + div .btn, .login-section .form + div .btn{display:inline-flex;align-items:center;height:auto;padding:8px 16px;line-height:1.2}

/* Large title styling for signup page */
.large-title{font-size:clamp(28px,6vw,56px);line-height:1.1;font-weight:800;text-align:center;margin-bottom:16px;text-wrap:balance}
.contact-large h1{font-size:clamp(28px,6vw,48px);text-wrap:balance}
.contact-large .form{max-width:800px}

/* Contact page styling */
.contact-large h1{font-size:clamp(28px,6vw,52px);line-height:1.1;font-weight:800;text-wrap:balance}
.contact-large .form{max-width:1000px;width:100%;gap:20px;margin:0 auto}
.contact-large .label{font-size:16px;font-weight:600}
.contact-large .input, .contact-large textarea.input{font-size:16px;padding:16px 20px}
.contact-large .btn{padding:16px 24px;border-radius:8px;font-size:16px}
.contact-large #sendBtn.btn-sm{padding:12px 20px;border-radius:8px;font-size:14px}

/* Success/Error messages */
.help.msg-success,.msg-success{display:inline-flex;align-items:center;gap:16px;font-size:16px;color:var(--success-text);background:var(--success-bg);border:2px solid var(--success-border);padding:16px 20px;border-radius:12px;margin-top:12px;font-weight:500;box-shadow:0 4px 16px rgba(16,185,129,.2);transition:all .3s ease}
.help.msg-error,.msg-error{display:inline-flex;align-items:center;gap:16px;font-size:16px;color:#fee2e2;background:#450a0a;border:2px solid #7f1d1d;padding:16px 20px;border-radius:12px;margin-top:12px;font-weight:500;box-shadow:0 4px 16px rgba(239,68,68,.2);transition:all .3s ease}
.error-icon{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#ef4444,#dc2626);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 12px rgba(239,68,68,.3);flex-shrink:0}
.error-icon svg{width:20px;height:20px}
.contact-large .help{font-size:15px}

/* Form grid */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.form-grid .field{display:flex;flex-direction:column;gap:8px}
.form-grid .field.full{grid-column:1 / -1}
@media(max-width:768px){.form-grid{grid-template-columns:1fr}}
.checkbox{display:flex;align-items:flex-start;gap:12px;color:var(--muted);font-size:15px}
.checkbox input{margin-top:4px}
.consent-row{margin-top:8px}

/* Contact page layout */
.contact-large.container{max-width:1200px}
.contact-large.section{padding-left:20px;padding-right:20px}
.contact-large .form{padding-left:0;padding-right:0;width:100%;margin:0 auto}

/* Plans header */
.plans-header{display:flex;flex-direction:column;align-items:center;text-align:center}
.plans-title{color:var(--text);font-weight:800;font-size:clamp(28px,5vw,48px);line-height:1.2;text-wrap:balance;overflow-wrap:anywhere;display:inline-block;padding-bottom:.1em;overflow:visible}
.plans-subtitle{font-size:clamp(16px,2.4vw,20px);color:var(--text);font-weight:600;overflow-wrap:anywhere}
@supports (background-clip: text){
	.plans-title{background-image:linear-gradient(90deg,var(--brand),var(--brand2));background-clip:text;color:transparent}
}
@supports (-webkit-background-clip: text){
	.plans-title{-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
}
.plans-subheader{margin:16px 0 24px 0;text-align:center;font-size:clamp(18px,3vw,24px);line-height:1.2;color:var(--text);font-weight:700}

/* Layout */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media(max-width:1200px){.services-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1024px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:768px){.grid{grid-template-columns:1fr}.services-grid{grid-template-columns:1fr}}

/* Cards */
.card{background:rgba(255, 255, 255, 0.1);backdrop-filter:blur(15px);border:1px solid var(--border);border-radius:28px;padding:32px;box-shadow:0 12px 40px rgba(0,0,0,.3);display:flex;flex-direction:column;transition:all .4s ease;position:relative;overflow:hidden}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--brand),var(--brand2),var(--accent));opacity:0;transition:opacity .3s ease}
.card:hover::before{opacity:1}
.card:hover{transform:translateY(-8px);box-shadow:0 24px 60px rgba(0,0,0,.4);border-color:var(--brand)}
.card h3{margin:0 0 16px;font-size:22px;color:var(--text);font-weight:700;font-family:'Poppins',sans-serif}
.card p{color:var(--muted);line-height:1.7;font-size:16px}
.card ul{margin:0 0 20px 24px}
.card p:last-child{margin-top:auto}
.card h3{min-height:32px}
.card .price-row{min-height:36px;font-size:20px;font-weight:700;color:#FFFFFF}
.card .features{min-height:140px;display:grid;grid-template-rows:repeat(3,1fr);gap:12px}
.card .features li{display:flex;align-items:flex-start;margin:0;color:var(--muted);font-size:15px;position:relative;padding-left:28px;line-height:1.4;min-height:20px}
.card .features li::before{content:'';position:absolute;left:0;top:4px;width:10px;height:10px;background:#FFFFFF;border-radius:2px;flex-shrink:0;box-shadow:0 2px 4px rgba(0,0,0,0.2)}

/* Forms */
.form{display:grid;gap:16px;max-width:480px;margin:0 auto}
.input, textarea.input{width:100%;padding:14px 18px;border:2px solid var(--border);border-radius:8px;background:rgba(255, 255, 255, 0.1);backdrop-filter:blur(15px);transition:all .2s ease;color:var(--text);font-size:16px}
.input::placeholder, textarea.input::placeholder{color:var(--muted)}
.input:focus, textarea.input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px rgba(249,115,22,.3);background:rgba(255, 255, 255, 0.12)}
.label{font-weight:600;color:var(--text);font-size:16px}
.help{color:var(--muted);font-size:18px;line-height:1.5}

/* Tables */
.table{width:100%;border-collapse:separate;border-spacing:0 12px}
.table td,.table th{padding:16px 18px}
.table tr{background:var(--surface);border:2px solid var(--border);border-radius:8px}
.table th{color:var(--text);text-align:left;font-weight:600}

/* Footer */
.footer{padding:60px 24px;color:var(--muted);text-align:center}
.footer a{color:inherit}

/* Site Footer */
.site-footer{border-top:2px solid var(--border);background:rgba(255, 255, 255, 0.08);backdrop-filter:blur(15px);padding:20px 20px;margin-top:auto}
.site-footer .footer-container{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:16px}
.site-footer .brand{gap:16px}
.site-footer .brand-name{font-size:20px;font-weight:800}
.site-footer .desc{color:var(--muted);margin-top:6px;max-width:480px;font-size:15px;line-height:1.5}
.site-footer .col-title{font-weight:700;color:var(--text);margin-bottom:8px;font-size:16px}
.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.site-footer a{color:var(--muted);text-decoration:none;transition:color .2s ease}
.site-footer a:hover{color:var(--brand)}
.site-footer .bottom{display:flex;align-items:center;position:relative;margin-top:16px;padding-top:12px;border-top:1px solid var(--border);color:var(--muted)}
.site-footer .bottom > div:first-child{position:absolute;left:50%;transform:translateX(-50%);text-align:center}
.site-footer .bottom > div:last-child{margin-left:auto}
.site-footer .social{display:flex;gap:16px}
.site-footer .badge{background:transparent;border-color:var(--border);color:var(--text);border-radius:20px;padding:8px 16px}
#manageCookiesBtn{margin-right:12px}
@media(max-width:1024px){.site-footer .footer-container{grid-template-columns:1fr 1fr 1fr}.site-footer .bottom{flex-direction:column;gap:12px;align-items:center}.site-footer .bottom>div:first-child{position:static;transform:none;text-align:center;margin:0 auto}.site-footer .bottom>div:last-child{margin-left:0;width:100%}}
@media(max-width:768px){.site-footer .footer-container{grid-template-columns:1fr}.site-footer .security-wrap{padding:16px;margin-top:12px}.site-footer .security-badges{gap:12px;margin-top:12px}.site-footer .security-badge{min-width:60px;padding:6px}.site-footer .security-badge img{max-width:40px;max-height:24px}.site-footer .security-note{font-size:12px;margin-top:10px}}

/* Footer payment options */
.site-footer .payment-wrap{grid-column:1 / -1;margin-top:8px}
.site-footer .payment-frame{border:2px solid var(--border);border-radius:12px;padding:20px;background:var(--surface-2)}
.site-footer .payment-title{font-weight:700;color:var(--text);margin-bottom:8px;font-size:16px;text-align:center}
.site-footer .payment-icons{display:flex;flex-wrap:wrap;gap:20px;margin-top:20px;justify-content:center}
.site-footer .pay-icon-container{display:flex;flex-direction:column;align-items:center;gap:8px}
.site-footer .pay-icon{min-width:60px;height:40px;border-radius:6px;border:2px solid #ddd;background:white;display:flex;align-items:center;justify-content:center;color:var(--text);font-weight:700;font-size:10px;padding:4px;transition:transform 0.2s ease, box-shadow 0.2s ease;box-shadow:0 2px 8px rgba(0,0,0,0.1)}
.site-footer .pay-icon:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,0.25);border-color:var(--brand)}
.site-footer .pay-icon svg{width:100%;height:100%;max-width:50px;max-height:32px;object-fit:contain;display:block}
.site-footer .pay-label{font-size:12px;color:var(--text);font-weight:600;text-align:center;line-height:1.2}
.site-footer .payment-note{color:var(--muted);margin-top:16px;font-size:14px;text-align:center}

/* Footer security section */
.site-footer .security-wrap{grid-column:1 / -1;margin-top:16px;padding:20px;border-radius:12px;background:var(--surface-2);border:2px solid var(--border)}
.site-footer .security-title{font-weight:700;color:var(--text);margin-bottom:12px;font-size:16px;text-align:center}
.site-footer .security-badges{display:flex;flex-wrap:wrap;gap:20px;margin-top:16px;justify-content:center;align-items:center}
.site-footer .security-badge{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px;border-radius:6px;background:white;border:2px solid #ddd;transition:all 0.2s ease;min-width:70px;box-shadow:0 2px 8px rgba(0,0,0,0.1)}
.site-footer .security-badge:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,0.25);border-color:var(--brand)}
.site-footer .security-badge img{width:100%;height:100%;max-width:50px;max-height:32px;object-fit:contain;display:block}
.site-footer .security-note{color:var(--muted);margin-top:12px;font-size:13px;text-align:center;line-height:1.4}

/* Security disclaimer in bottom */
.site-footer .security-disclaimer{color:var(--muted);font-size:12px;line-height:1.4;margin-top:8px;text-align:center;opacity:0.8}
.site-footer .security-status{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--success);background:var(--success-bg);padding:4px 8px;border-radius:12px;border:1px solid var(--success-border);margin-left:8px}

/* Payment section in content */
.payment-section{margin-top:24px;padding:20px;border:2px solid var(--border);border-radius:12px;background:var(--surface-2)}
.payment-section h4{color:var(--text);margin-bottom:16px;font-size:18px;font-weight:700}
.payment-section .payment-icons{display:flex;flex-wrap:wrap;gap:20px;margin-top:16px;justify-content:center}
.payment-section .pay-icon-container{display:flex;flex-direction:column;align-items:center;gap:8px}
.payment-section .pay-icon{min-width:80px;height:60px;border-radius:8px;border:3px solid #ddd;background:white;display:flex;align-items:center;justify-content:center;color:var(--text);font-weight:700;font-size:12px;padding:8px;transition:transform 0.2s ease, box-shadow 0.2s ease;box-shadow:0 4px 12px rgba(0,0,0,0.15)}
.payment-section .pay-icon:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,0.25);border-color:var(--brand)}
.payment-section .pay-icon svg{width:100%;height:100%;max-width:72px;max-height:48px;object-fit:contain;display:block}
.payment-section .pay-label{font-size:12px;color:var(--text);font-weight:600;text-align:center;line-height:1.2}
.payment-section .payment-note{color:var(--muted);margin-top:16px;font-size:14px;text-align:center}

/* Badges */
.badge{display:inline-block;padding:8px 16px;border-radius:20px;border:2px solid var(--border);background:var(--surface-2);color:var(--text);font-weight:600;font-size:12px;letter-spacing:.5px}

/* Utility */
.center{display:flex;align-items:center;justify-content:center}
.stack{display:grid;gap:16px}

/* Icon badges */
.icon-badge{width:72px;height:72px;border-radius:20px;background:linear-gradient(135deg,var(--brand),var(--brand2));box-shadow:0 12px 32px rgba(249,115,22,.25), inset 0 0 0 1px rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.icon-badge::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(255,255,255,.1),transparent);opacity:0;transition:opacity .3s ease}
.icon-badge:hover::before{opacity:1}
.icon-badge svg{width:36px;height:36px;color:#fff;position:relative;z-index:1}

/* Icon card header */
.icon-card{display:flex;align-items:center;gap:16px;margin-bottom:12px}
.icon-card h3{margin:0;font-size:20px;font-weight:700}

/* Subscribe section */
.subscribe-section{margin-top:40px;margin-bottom:40px;padding:32px;border-radius:16px;border:2px solid var(--border);background:rgba(255, 255, 255, 0.1);backdrop-filter:blur(20px);box-shadow:0 8px 32px rgba(0,0,0,.4)}
.subscribe-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
.subscribe-wrap{display:flex;align-items:center;background:rgba(255, 255, 255, 0.12);backdrop-filter:blur(15px);border:2px solid var(--border);border-radius:12px;padding:8px 8px;max-width:400px;margin:0 auto}
.subscribe-input{flex:1;border:none;background:transparent;color:var(--text);padding:12px 16px;outline:none;font-size:16px}
.subscribe-button{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:8px;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;border:none;cursor:pointer;transition:all .2s ease}
.subscribe-button:hover{transform:translateY(-2px)}
.subscribe-button svg{width:22px;height:22px}
@media(max-width:1024px){.subscribe-grid{grid-template-columns:1fr}}
.subscribe-grid #subMsg{grid-column:2}
@media(max-width:1024px){.subscribe-grid #subMsg{grid-column:1}}

/* Turnstile */
.turnstile-wrap{margin-top:16px;display:flex;justify-content:center;margin-left:0}
.turnstile-wrap .cf-challenge, .turnstile-wrap iframe{max-width:none}
@media(max-width:1024px){.turnstile-wrap{justify-content:center;margin-left:0}}

/* Success notice */
.success-wrap{display:flex;align-items:center;gap:16px;background:var(--success-bg);border:2px solid var(--success-border);color:var(--success-text);padding:16px 20px;border-radius:12px;font-weight:500;box-shadow:0 4px 16px rgba(16,185,129,.2);transition:all .3s ease;max-width:100%;word-wrap:break-word}
.success-icon{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--success),#34d399);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 12px rgba(16,185,129,.3);flex-shrink:0;position:relative;overflow:hidden;animation:success-pulse 2s ease-in-out infinite}
.success-icon::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(255,255,255,.2),rgba(255,255,255,.05));border-radius:50%}
.success-icon svg{width:20px;height:20px;position:relative;z-index:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2));animation:success-check 0.6s ease-out}

/* Mobile responsive success message */
@media(max-width:768px){
	.success-wrap{flex-direction:column;text-align:center;gap:12px;padding:20px 16px}
	.success-icon{width:48px;height:48px}
	.success-icon svg{width:24px;height:24px}
	.help.msg-success,.msg-success{flex-direction:column;text-align:center;gap:12px;padding:20px 16px}
}

/* Subscribe success state */
.subscribe-wrap.success{background:var(--success-bg);border-color:var(--success-border)}
.subscribe-wrap.success .subscribe-input{color:var(--success-text)}
.subscribe-wrap.success .subscribe-button{background:linear-gradient(135deg,var(--success),#34d399)}

/* Subscribe success message */
.subscribe-success-message{display:flex;align-items:center;gap:16px;background:var(--success-bg);border:2px solid var(--success-border);color:var(--success-text);padding:20px 24px;border-radius:12px;font-weight:500;box-shadow:0 4px 16px rgba(16,185,129,.2);transition:all .3s ease;max-width:100%;word-wrap:break-word;margin:0 auto}
.subscribe-success-message .title{color:var(--success-text);font-weight:600;font-size:16px;line-height:1.4}
.subscribe-success-message .success-icon{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--success),#34d399);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 12px rgba(16,185,129,.3);flex-shrink:0;position:relative;overflow:hidden;animation:success-pulse 2s ease-in-out infinite}
.subscribe-success-message .success-icon::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(255,255,255,.2),rgba(255,255,255,.05));border-radius:50%}
.subscribe-success-message .success-icon svg{width:20px;height:20px;position:relative;z-index:1;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2));animation:success-check 0.6s ease-out}

/* Mobile responsive subscribe success message */
@media(max-width:768px){
	.subscribe-success-message{flex-direction:column;text-align:center;gap:12px;padding:24px 20px}
	.subscribe-success-message .success-icon{width:48px;height:48px}
	.subscribe-success-message .success-icon svg{width:24px;height:24px}
}

/* Success panel */
.success-panel{display:flex;align-items:center;gap:20px;background:var(--success-bg);border:2px solid var(--success-border);border-radius:16px;padding:24px;box-shadow:0 8px 24px rgba(16,185,129,.15);transition:all .3s ease}
.success-panel .title{color:var(--success-text);font-weight:700;font-size:18px}
.success-panel .desc{color:var(--success-text);line-height:1.6}


/* Cookies banner */
.cookie-banner{position:fixed;left:20px;right:20px;bottom:20px;z-index:70;border:2px solid var(--border);background:var(--surface);color:var(--text);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.3);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px}
.cookie-banner .cookie-text{display:flex;flex-direction:column;gap:6px}
.cookie-banner .cookie-text strong{font-weight:700}
.cookie-banner a{color:var(--brand);text-decoration:underline}
.cookie-banner .cookie-actions{display:flex;gap:12px;flex-shrink:0}
@media(max-width:768px){.cookie-banner{flex-direction:column;align-items:stretch}.cookie-banner .cookie-actions{justify-content:flex-end}}

/* Cookie modal */
.cookie-modal{position:fixed;inset:0;z-index:80}
.cookie-modal-backdrop{position:absolute;inset:0;background:rgba(2,6,23,.7);backdrop-filter:blur(4px)}
.cookie-modal-panel{position:relative;max-width:640px;margin:10vh auto;background:var(--surface);border:2px solid var(--border);border-radius:16px;box-shadow:0 20px 48px rgba(0,0,0,.4);display:flex;flex-direction:column}
.cookie-modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:2px solid var(--border)}
.cookie-modal-header h3{margin:0;font-size:20px;font-weight:700}
.cookie-modal-body{display:grid;gap:16px;padding:20px}
.cookie-modal-body .manage-intro{margin:0 0 8px 0;font-size:14px;color:var(--muted);line-height:1.6}
.cookie-option{display:flex;align-items:center;justify-content:space-between;gap:16px;border:2px solid var(--border);border-radius:12px;padding:16px}
.cookie-modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 20px;border-top:2px solid var(--border)}

/* Toggle */
.toggle{position:relative;width:60px;height:32px;border-radius:20px;border:2px solid var(--border);background:var(--surface-2);cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px rgba(0,0,0,.1)}
.toggle[aria-checked="true"]{background:linear-gradient(135deg,var(--brand),var(--brand2));border-color:var(--brand);box-shadow:0 4px 12px rgba(245,158,11,.3)}
.toggle span{position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.2);transition:left .2s ease}
.toggle[aria-checked="true"] span{left:30px;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.toggle::after{content:'Off';position:absolute;top:50%;transform:translateY(-50%);right:8px;font-size:10px;font-weight:700;color:var(--muted);pointer-events:none;transition:color .2s ease}
.toggle[aria-checked="true"]::after{content:'';left:8px;right:auto;color:#fff;font-weight:800}
.toggle:focus-visible{outline:none;box-shadow:0 0 0 4px rgba(245,158,11,.2)}
.toggle:hover{filter:brightness(1.05);transform:scale(1.02)}
.toggle[aria-checked="true"]:hover{filter:brightness(1.1);transform:scale(1.02)}
.toggle.disabled{opacity:.6;cursor:default}

/* Always on badge */
.badge.always-on{background:rgba(255, 255, 255, 0.15);border-color:var(--border);color:#FFFFFF;font-weight:600;backdrop-filter:blur(10px)}

/* Email address styling */
a[href^="mailto:"] {
	color: #d97706 !important;
	text-decoration: none;
	transition: color 0.2s ease;
}

a[href^="mailto:"]:hover {
	color: #b45309 !important;
	text-decoration: underline;
}

/* Privacy Policy and Terms of Service links in consent text only */
.consent-row a[href="/privacy.html"], 
.consent-row a[href="/terms.html"] {
	color: #d97706 !important;
	text-decoration: none;
	transition: color 0.2s ease;
}

.consent-row a[href="/privacy.html"]:hover, 
.consent-row a[href="/terms.html"]:hover {
	color: #b45309 !important;
	text-decoration: underline;
}

/* Contact us link in FAQ success panel */
.success-panel .desc a[href="/contact.html"] {
	color: #d97706 !important;
	text-decoration: none;
	transition: color 0.2s ease;
}

.success-panel .desc a[href="/contact.html"]:hover {
	color: #b45309 !important;
	text-decoration: underline;
}

/* Consultation page links styling */
.success-panel .desc a[href="/signup.html"], 
.success-panel .desc a[href="/pricing.html"] {
	color: #d97706 !important;
	text-decoration: none;
	transition: color 0.2s ease;
}

.success-panel .desc a[href="/signup.html"]:hover, 
.success-panel .desc a[href="/pricing.html"]:hover {
	color: #b45309 !important;
	text-decoration: underline;
}

/* Forgot password link styling */
a[href="/reset.html"] {
	color: #d97706 !important;
	text-decoration: none;
	transition: color 0.2s ease;
}

a[href="/reset.html"]:hover {
	color: #b45309 !important;
	text-decoration: underline;
}

/* Cookie Policy and Privacy Policy links in cookie banner and modal */
.cookie-banner a[href="/cookie-policy.html"], 
.cookie-banner a[href="/privacy.html"],
.cookie-modal a[href="/cookie-policy.html"], 
.cookie-modal a[href="/privacy.html"] {
	color: #d97706 !important;
	text-decoration: none;
	transition: color 0.2s ease;
}

.cookie-banner a[href="/cookie-policy.html"]:hover, 
.cookie-banner a[href="/privacy.html"]:hover,
.cookie-modal a[href="/cookie-policy.html"]:hover, 
.cookie-modal a[href="/privacy.html"]:hover {
	color: #b45309 !important;
	text-decoration: underline;
}

/* Global icon removal - hide visual icons across the site */
/* Hides inline SVG icons everywhere */
/* svg{display:none !important} */
/* Hide explicit icon containers/classes without affecting text wrappers */
.icon-badge,
.success-icon,
.error-icon,
.subscribe-button svg,
.help.msg-success svg,
.help.msg-error svg{display:none !important}
/* Hide <i> tags used as icons (keeps italic text unaffected as we scope to those with classes) */
i[class]{display:none !important}

/* Restore sending icon on subscribe button */
.subscribe-button svg{display:inline-block !important}

/* Ensure Plans page buttons are visible */
.card .btn-outline{background:var(--surface) !important;color:var(--text) !important;border:2px solid var(--brand) !important;box-shadow:0 4px 12px rgba(249,115,22,.15) !important;font-weight:600 !important;opacity:1 !important;visibility:visible !important}
.card .btn-outline:hover{background:linear-gradient(135deg,var(--brand),var(--brand2)) !important;color:white !important;border-color:var(--brand) !important}
.card .btn{color:white !important;font-weight:600 !important;opacity:1 !important;visibility:visible !important;background:linear-gradient(135deg,var(--brand),var(--brand2)) !important}