/* 
 * Alpha Estate - Main Stylesheet (Fase 2)
 * Architecture: Mobile-First
 * Aesthetic: Quiet Luxury
 */

:root {
	/* Colors */
	--color-bg: #F9F9F7;
	--color-bg-light: #ffffff;
	--color-bg-dark: #121212;
	--color-text: #121212;
	--color-text-light: #555555;
	--color-accent: #C5A059;
	--color-accent-hover: #b08d4a;
	--color-white: #ffffff;
	
	/* Typography */
	--font-heading: 'Playfair Display', serif;
	--font-body: 'Inter', sans-serif;
	
	/* Spacing */
	--space-xs: 0.5rem;
	--space-sm: 1rem;
	--space-md: 2rem;
	--space-lg: 4rem;
	--space-xl: 8rem;

	/* Transitions */
	--transition-smooth: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Reset & Base */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); color: var(--color-text); background-color: var(--color-bg); line-height: 1.6; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-weight: 400; line-height: 1.2; }
a { color: inherit; text-decoration: none; transition: var(--transition-smooth); }
img { max-width: 100%; height: auto; display: block; }

/* Utilities */
.container { max-width: 1200px; margin: 0 auto; padding: 0 var(--space-md); }
.container-narrow { max-width: 800px; margin: 0 auto; padding: 0 var(--space-md); }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-light { color: var(--color-white) !important; }
.text-accent { color: var(--color-accent) !important; }
.bg-light { background-color: var(--color-bg-light); }
.bg-dark { background-color: var(--color-bg-dark); }
.opacity-70 { opacity: 0.7; }
.position-relative { position: relative; }
.z-10 { z-index: 10; }
.w-100 { width: 100%; }
.mt-2 { margin-top: 0.5rem; }
.mt-4 { margin-top: 1rem; }
.mt-8 { margin-top: 2rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-8 { margin-bottom: 2rem; }

/* Buttons */
.btn {
	display: inline-block; padding: 1rem 2rem; font-family: var(--font-body); font-size: 0.9rem;
	font-weight: 500; letter-spacing: 1px; text-transform: uppercase; border: 1px solid transparent;
	cursor: pointer; transition: var(--transition-smooth); text-align: center;
}
.btn-primary { background-color: var(--color-accent); color: var(--color-white); }
.btn-primary:hover { background-color: var(--color-accent-hover); }
.btn-secondary { background-color: var(--color-text); color: var(--color-white); }
.btn-secondary:hover { background-color: var(--color-accent); }
.btn-outline-light { background-color: transparent; border-color: var(--color-white); color: var(--color-white); }
.btn-outline-light:hover { background-color: var(--color-white); color: var(--color-text); }
.link-arrow { display: inline-block; font-weight: 600; font-size: 0.95rem; border-bottom: 1px solid transparent; }
.link-arrow:hover { border-bottom: 1px solid var(--color-text); transform: translateX(5px); }
.link-arrow-light { color: var(--color-white); }
.link-arrow-light:hover { border-bottom: 1px solid var(--color-white); }

/* Header & Navigation */
.site-header {
	position: fixed; top: 0; left: 0; width: 100%; z-index: 1000;
	padding: 1.5rem 0; transition: var(--transition-smooth); background-color: transparent;
}
.site-header.scrolled {
	background-color: var(--color-bg-light);
	box-shadow: 0 4px 20px rgba(0,0,0,0.05);
	padding: 0.8rem 0;
}
.header-container { max-width: 1400px; margin: 0 auto; padding: 0 var(--space-md); display: flex; justify-content: space-between; align-items: center; }

/* Dynamic Logos */
.logo-link { position: relative; display: inline-block; }
.site-logo { height: 70px; transition: var(--transition-smooth); }
@media (min-width: 768px) { .site-logo { height: 90px; } }
.site-header.scrolled .site-logo { height: 60px; }

/* The magic of mix-blend-mode to hide generated backgrounds */
.logo-dark-mode { mix-blend-mode: screen; } /* removes black background, keeps white/gold text */
.logo-light-mode { mix-blend-mode: multiply; position: absolute; top: 0; left: 0; opacity: 0; visibility: hidden; } /* removes white bg, keeps dark text */

.site-header.scrolled .logo-dark-mode { opacity: 0; visibility: hidden; }
.site-header.scrolled .logo-light-mode { opacity: 1; visibility: visible; }

/* Menu */
.menu-toggle { display: block; background: none; border: none; cursor: pointer; z-index: 1001; }
.hamburger-line { display: block; width: 25px; height: 2px; margin: 5px 0; transition: var(--transition-smooth); }
.menu-close {
	-webkit-appearance: none;
	appearance: none;
	display: block;
	position: absolute;
	top: 1.5rem;
	right: 1.5rem;
	font-size: 2.5rem;
	background: transparent;
	border: none;
	color: var(--color-text);
	cursor: pointer;
	line-height: 1;
	padding: 10px;
	z-index: 1060;
}
.site-header:not(.scrolled) .nav-list a { color: var(--color-white); }
.site-header:not(.scrolled) .hamburger-line { background-color: var(--color-white); }
.site-header.scrolled .nav-list a { color: var(--color-text); }
.site-header.scrolled .hamburger-line { background-color: var(--color-text); }

.menu-wrapper {
	position: fixed; top: 0; right: -100%; width: 100%; height: 100vh; max-width: none;
	background-color: var(--color-bg); padding: 5rem 2rem 2rem;
	transition: right 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); 
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	z-index: 1050;
}
.menu-wrapper.is-open { right: 0; }
.menu-toggle.is-active .hamburger-line:nth-child(1) { transform: translateY(7px) rotate(45deg); background-color: var(--color-text); }
.menu-toggle.is-active .hamburger-line:nth-child(2) { opacity: 0; }
.menu-toggle.is-active .hamburger-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); background-color: var(--color-text); }
.nav-list { list-style: none; display: flex; flex-direction: column; gap: 2rem; padding-top: 0; width: 100%; text-align: center; }
.menu-wrapper .nav-list a { font-family: var(--font-heading); font-size: 2.2rem; color: var(--color-text) !important; padding: 0.5rem 1rem; display: block; }
.header-actions { margin-top: 3rem; text-align: center; width: 100%; }

@media (min-width: 992px) {
	.menu-toggle, .menu-close { display: none; }
	.menu-wrapper { position: static; width: auto; max-width: none; height: auto; background-color: transparent; padding: 0; flex-direction: row; align-items: center; justify-content: flex-end; gap: var(--space-lg); box-shadow: none; z-index: auto; }
	.nav-list { flex-direction: row; gap: var(--space-md); padding-top: 0; width: auto; text-align: left; }
	.menu-wrapper .nav-list a { font-family: var(--font-body); font-size: 0.85rem; text-transform: uppercase; letter-spacing: 1.5px; font-weight: 500; padding: 0; color: inherit !important; text-align: left; }
	.header-actions { margin-top: 0; width: auto; text-align: left; }
	.site-header:not(.scrolled) .menu-wrapper .nav-list a { color: var(--color-white) !important; }
	.site-header:not(.scrolled) .menu-wrapper .nav-list a:hover { color: var(--color-accent) !important; }
}

/* Hero Section */
.hero-section { position: relative; height: 100vh; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; text-align: center; background-attachment: scroll; }
.hero-overlay-dark { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.3) 100%); }
.hero-content { position: relative; z-index: 10; max-width: 1000px; padding: var(--space-md); color: var(--color-white); }
.hero-title { font-size: 3rem; margin-bottom: var(--space-sm); line-height: 1.1; }
.hero-subtitle { font-size: 1.1rem; font-weight: 300; margin-bottom: var(--space-lg); color: #f0f0f0; max-width: 700px; margin-left: auto; margin-right: auto; }
.hero-cta-group { display: flex; flex-direction: column; gap: 1rem; justify-content: center; }
@media (min-width: 992px) { .hero-section { background-attachment: fixed; } }
@media (min-width: 768px) { .hero-title { font-size: 5.5rem; } .hero-subtitle { font-size: 1.4rem; } .hero-cta-group { flex-direction: row; gap: 1.5rem; } }

/* Shared Layouts */
.section-title { font-size: 2.5rem; margin-bottom: 0.5rem; }
.section-subtitle { font-size: 1.2rem; }
.lead-text { font-size: 1.4rem; color: var(--color-accent); font-family: var(--font-heading); font-style: italic; }
.body-text { font-size: 1.1rem; color: var(--color-text-light); line-height: 1.8; }
.eyebrow { display: inline-block; text-transform: uppercase; letter-spacing: 3px; font-size: 0.8rem; font-weight: 600; color: var(--color-accent); margin-bottom: 1.5rem; }
@media (min-width: 768px) { .section-title { font-size: 3.8rem; } }

/* Grid Systems */
.grid-2 { display: grid; grid-template-columns: 1fr; gap: var(--space-lg); }
.grid-3 { display: grid; grid-template-columns: 1fr; gap: var(--space-lg); }
@media (min-width: 768px) { .grid-2 { grid-template-columns: repeat(2, 1fr); } .grid-3 { grid-template-columns: repeat(3, 1fr); } }

/* Vision / Manifesto */
.vision-section { padding: var(--space-xl) 0; }
.manifesto-card { 
	background: var(--color-white); 
	padding: var(--space-xl) var(--space-lg); 
	border: 1px solid rgba(0,0,0,0.05); 
	box-shadow: 0 30px 60px rgba(0,0,0,0.03); 
	border-left: 4px solid var(--color-accent);
	text-align: left;
	position: relative;
}
.manifesto-card::before {
	content: '"';
	position: absolute;
	top: -20px;
	left: 30px;
	font-family: var(--font-heading);
	font-size: 8rem;
	color: var(--color-accent);
	opacity: 0.15;
	line-height: 1;
}

@media (max-width: 768px) {
	.manifesto-card { padding: var(--space-md); }
	.manifesto-card::before { left: 10px; font-size: 5rem; top: -10px; }
}
.eco-card { background: var(--color-white); padding: var(--space-lg); border-top: 4px solid var(--color-accent); box-shadow: 0 20px 40px rgba(0,0,0,0.03); transition: var(--transition-smooth); }
.eco-card-dark { background: var(--color-bg-dark); color: var(--color-white); }
.eco-card:hover { transform: translateY(-10px); }
.eco-title { font-size: 2rem; margin-bottom: 1rem; }
.eco-desc { color: var(--color-text-light); margin-bottom: 1.5rem; }
.eco-card-dark .eco-desc { color: #aaaaaa; }

/* Split Sections */
.split-section { display: flex; flex-direction: column; padding: var(--space-lg) 0; }
.split-image { width: 100%; height: 400px; background-size: cover; background-position: center; background-attachment: scroll; }
.split-content { padding: var(--space-lg) var(--space-md); }
.feature-list { list-style: none; margin-top: 1.5rem; }
.feature-list li { position: relative; padding-left: 1.5rem; margin-bottom: 1rem; color: var(--color-text-light); }
.feature-list li::before { content: "—"; position: absolute; left: 0; color: var(--color-accent); }
@media (min-width: 992px) {
	.split-section { flex-direction: row; align-items: center; padding: 0; }
	.split-image { width: 50%; height: 800px; background-attachment: fixed; }
	.split-content { width: 50%; padding: var(--space-xl) 8%; }
	.split-reverse { flex-direction: row-reverse; }
}

/* Technology */
.technology-section { padding: var(--space-xl) 0; }
.tech-card { padding: 2rem 0; border-top: 1px solid rgba(255,255,255,0.1); }
.tech-title { font-size: 1.5rem; margin-bottom: 1rem; }

/* Standard Section */
.standard-section { padding: var(--space-xl) 0; }
.standard-card { padding: var(--space-md); border: 1px solid rgba(0,0,0,0.05); background: var(--color-white); transition: var(--transition-smooth); text-align: left; }
.standard-card:hover { border-color: var(--color-accent); transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
.standard-icon { font-family: var(--font-heading); font-size: 3.5rem; color: var(--color-accent); opacity: 0.3; margin-bottom: 1rem; }
.standard-title { font-size: 1.8rem; margin-bottom: 1rem; }

/* Leadership */
.leadership-section { padding: var(--space-xl) 0; }
.leader-card { text-align: center; }
.leader-avatar { width: 120px; height: 120px; border-radius: 50%; background: var(--color-bg-dark); color: var(--color-accent); display: flex; align-items: center; justify-content: center; font-family: var(--font-heading); font-size: 3rem; margin: 0 auto 1.5rem; }
.leader-name { font-size: 1.5rem; }
.leader-role { color: var(--color-text-light); text-transform: uppercase; font-size: 0.8rem; letter-spacing: 1px; margin-top: 0.5rem; }

/* Partners */
.partners-section { padding: var(--space-xl) 0; }
.partners-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 2rem; }
.partner-item { padding: 1.5rem 3rem; background: var(--color-white); border: 1px solid #eee; color: var(--color-text-light); font-weight: 500; letter-spacing: 1px; text-transform: uppercase; }

/* Global Stats */
.global-section { position: relative; padding: var(--space-xl) 0; background-size: cover; background-position: center; background-attachment: scroll; }
.global-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(18, 18, 18, 0.9); }
.global-stats-container { display: flex; flex-direction: column; gap: var(--space-lg); justify-content: center; align-items: center; text-align: center; }
@media (min-width: 992px) { .global-section { background-attachment: fixed; } }
@media (min-width: 768px) { .global-stats-container { flex-direction: row; justify-content: space-around; } }
.stat-number { display: inline-block; font-family: var(--font-heading); font-size: 5rem; color: var(--color-white); line-height: 1; margin-bottom: 0.5rem; }
.stat-label { display: block; font-size: 1.1rem; color: var(--color-white); text-transform: uppercase; letter-spacing: 2px; opacity: 0.7; }

/* FAQ Accordion */
.faq-section { padding: var(--space-xl) 0; }
.accordion { border-top: 1px solid #ddd; }
.accordion-item { border-bottom: 1px solid #ddd; }
.accordion-header { width: 100%; text-align: left; padding: 1.5rem 0; background: none; border: none; font-family: var(--font-heading); font-size: 1.5rem; cursor: pointer; display: flex; justify-content: space-between; align-items: center; color: var(--color-text); }
.accordion-header .icon { font-size: 1.5rem; font-family: var(--font-body); font-weight: 300; transition: transform 0.3s ease; }
.accordion-header.active .icon { transform: rotate(45deg); color: var(--color-accent); }
.accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; }
.accordion-content p { padding-bottom: 1.5rem; color: var(--color-text-light); font-size: 1.1rem; line-height: 1.8; }

/* Join / CTA */
.join-section { padding: var(--space-xl) 0; }
.cta-card { padding: var(--space-lg); }
.cta-card-title { font-size: 2.2rem; margin-bottom: 1rem; }
.standard-form { display: flex; flex-direction: column; gap: 1rem; }
.standard-form input { padding: 1.2rem; font-size: 1rem; font-family: var(--font-body); border: 1px solid #ccc; background: transparent; width: 100%; outline: none; transition: border-color 0.3s ease; }
.standard-form input:focus { border-color: var(--color-accent); }
.cta-card.bg-dark input { border-color: #444; color: var(--color-white); }
.cta-card.bg-dark input:focus { border-color: var(--color-accent); }

/* Footer */
.site-footer { background-color: var(--color-bg-light); padding: var(--space-xl) var(--space-md) var(--space-md); border-top: 1px solid #e0e0e0; }
.footer-container { max-width: 1200px; margin: 0 auto; }
.footer-top { display: grid; grid-template-columns: 1fr; gap: var(--space-lg); margin-bottom: var(--space-xl); }
@media (min-width: 768px) { .footer-top { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .footer-top { grid-template-columns: 2fr 1fr 1fr 1.5fr; } }
.footer-logo { height: 70px; margin-bottom: 1.5rem; mix-blend-mode: multiply; }
@media (min-width: 768px) { .footer-logo { height: 90px; } }
.footer-description { color: var(--color-text-light); font-size: 1.05rem; }
.widget-title { font-family: var(--font-body); font-size: 1.1rem; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 1.5rem; }
.footer-nav, .contact-list { list-style: none; }
.footer-nav li, .contact-list li { margin-bottom: 0.75rem; color: var(--color-text-light); }
.footer-nav a:hover, .contact-list a:hover { color: var(--color-accent); }
.footer-bottom { display: flex; flex-direction: column; gap: 1rem; align-items: center; border-top: 1px solid #e0e0e0; padding-top: var(--space-md); color: var(--color-text-light); font-size: 0.85rem; }
@media (min-width: 768px) { .footer-bottom { flex-direction: row; justify-content: space-between; } }
.social-links { display: flex; gap: 1.5rem; }
.social-links a { color: var(--color-text); font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }

/* Scroll Animations */
.fade-in-scroll { opacity: 0; transform: translateY(40px); transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.fade-in-scroll.is-visible { opacity: 1; transform: translateY(0); }
.stagger-fade-in { opacity: 0; transform: translateY(30px); animation: fadeInUp 1s forwards cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.delay-1 { animation-delay: 0.2s; transition-delay: 0.2s; }
.delay-2 { animation-delay: 0.4s; transition-delay: 0.4s; }
.delay-3 { animation-delay: 0.6s; transition-delay: 0.6s; }

@keyframes fadeInUp { to { opacity: 1; transform: translateY(0); } }
