/* ── HOME PAGE STYLES ── */

/* Hero */
.hero {
    position: relative; height: 100vh;
    min-height: 600px;
    overflow: hidden;
    display: flex; align-items: flex-end; justify-content: center;
}
.hero-bg { position: absolute; inset: 0; z-index: 0; }
.hero-bg img {
    width: 100%; height: 120%;
    object-fit: cover; object-position: center 30%;
    position: absolute; top: -10%; left: 0;
}
.hero-tint {
    position: absolute; inset: 0; z-index: 1;
    background: rgba(8,18,13,0.42);
}
.hero-overlay {
    position: absolute; inset: 0; z-index: 2;
    background: radial-gradient(ellipse 130% 110% at 50% 115%, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 65%);
}
.hero-vignette {
    position: absolute; inset: 0; z-index: 2;
    background: linear-gradient(to bottom, rgba(0,0,0,0.22) 0%, rgba(0,0,0,0) 35%);
}
.hero-distortion {
    position: absolute; inset: 0; z-index: 3; pointer-events: none;
    background:
        radial-gradient(ellipse 80% 50% at 20% 80%, rgba(0,0,0,0.3) 0%, transparent 70%),
        radial-gradient(ellipse 60% 40% at 80% 20%, rgba(0,0,0,0.2) 0%, transparent 60%),
        radial-gradient(ellipse 100% 60% at 50% 100%, rgba(0,0,0,0.35) 0%, transparent 50%);
}
.hero-noise {
    position: absolute; inset: 0; z-index: 4; pointer-events: none;
    background-repeat: repeat; background-size: 153.5px 153.5px;
    opacity: 0.25; mix-blend-mode: soft-light;
}
.hero-content {
    position: relative; z-index: 5;
    width: 50%; max-width: 850px; min-width: 320px;
    padding-bottom: 96px; text-align: center;
}
.hero h1 {
    font-family: 'Inter', sans-serif;
    font-size: 54.1px; font-weight: 500;
    line-height: 58.8px; letter-spacing: -2.24px;
    color: #fff; text-align: center; font-style: normal;
    margin-bottom: 20px;
}
.hero p {
    font-family: 'Instrument Sans', sans-serif;
    font-size: 16px; color: rgba(255,255,255,0.82);
    margin-bottom: 36px; line-height: 1.6; letter-spacing: -0.01em;
    max-width: 540px; margin-left: auto; margin-right: auto;
}
.hero-buttons {
    display: flex; gap: 8px; justify-content: center; flex-wrap: wrap;
}

/* Stats + Philosophy Wrapper */
.stats-philosophy-wrapper {
    background: linear-gradient(#fafafa 0%, #ffffff 100%);
    display: flex; flex-direction: column;
    align-items: center; gap: 156px;
    width: 100%; padding-top: 72px; padding-bottom: 40px;
}

/* Stats Bar */
.stats-bar {
    display: flex; align-items: center; justify-content: center;
    gap: 235.371px; height: 64px;
    max-width: 1080px; width: 100%;
}
.stats-label {
    font-family: 'Instrument Sans', sans-serif;
    font-size: 16px; color: var(--dark-70); font-weight: 400;
    flex-shrink: 0; letter-spacing: -0.01em;
}
.stats-cards { display: flex; gap: 16px; }
.stat-card {
    display: flex; align-items: flex-start; gap: 8px;
    background: var(--white); border-radius: var(--radius-lg);
    width: 238.67px; height: 64px; flex-shrink: 0;
    padding: 20px 51px 20px 32px;
    font-family: 'Instrument Sans', sans-serif;
    font-size: 16px; color: var(--dark-70); letter-spacing: -0.16px;
    white-space: nowrap;
}
.stat-card svg { flex-shrink: 0; color: var(--dark); }

/* Philosophy */
.philosophy {
    text-align: center; padding: 56px 0;
    max-width: 1080px; width: 100%;
    display: flex; flex-direction: column; align-items: center;
}
.philosophy .section-label {
    justify-content: center; margin-bottom: 32px;
}
.philosophy h2 {
    font-family: 'Inter', sans-serif;
    font-size: 48px; font-weight: 500;
    letter-spacing: -1.92px; line-height: 60px;
    max-width: 1080px; color: var(--dark);
}

/* Feature Blocks */
.features-wrapper {
    display: flex; flex-direction: column;
    align-items: center; gap: 72px; width: 100%;
    padding-top: 120px;
}
.feature-block { width: 100%; max-width: 1080px; padding: 0; }
.feature-block .container {
    display: grid; grid-template-columns: 440px 544px;
    gap: 96px; align-items: center; height: 456px;
}
.feature-block.reverse .container {
    grid-template-columns: 544px 440px;
}
.feature-block.reverse .feature-text { order: 2; }
.feature-block.reverse .feature-image { order: 1; }
.feature-text .section-label { margin-bottom: 28px; }
.feature-text h3 {
    font-family: 'Inter', sans-serif;
    font-size: 39.1px; font-weight: 500; letter-spacing: -1.6px;
    line-height: 48px; color: var(--dark); margin-bottom: 16px;
}
.feature-text p {
    font-family: 'Instrument Sans', sans-serif;
    font-size: 16px; color: var(--dark-70); line-height: 24px;
    letter-spacing: -0.01em; margin-bottom: 28px;
}
.feature-buttons {
    display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
}
.feature-buttons .btn-primary {
    width: 238px; height: 57px; border-radius: var(--radius-pill);
    padding: 0 32px; font-size: 16px; letter-spacing: -0.01em;
    justify-content: flex-start;
}
.feature-buttons .btn-outline {
    width: 183px; height: 57px; border-radius: var(--radius-pill);
    padding: 0 32px; font-size: 16px; letter-spacing: -0.01em;
}
.feature-image {
    border-radius: var(--radius-lg); overflow: hidden;
    height: 100%; position: relative;
}
.feature-image img {
    position: absolute; width: 100%; height: 119.3%;
    top: -9.65%; left: 0; object-fit: cover;
}

/* Scarcity */
.scarcity {
    padding: 0; text-align: center; margin-top: 156px;
}
.scarcity .section-label {
    justify-content: center; margin-bottom: 16px;
}
.scarcity h2 {
    font-family: 'Inter', sans-serif; font-size: 39.2px; font-weight: 500;
    letter-spacing: -1.6px; line-height: 48px; color: var(--dark); margin-bottom: 32px;
}
.scarcity > p {
    font-family: 'Instrument Sans', sans-serif;
    font-size: 16px; color: var(--dark-70); max-width: 440px;
    margin: 0 auto 72px; line-height: 24px; letter-spacing: -0.01em;
}
.grid-4 {
    display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
    max-width: 1080px; margin: 0 auto;
}

/* Holdings */
.holdings {
    padding: 0; margin-top: 156px;
    max-width: 1080px; margin-left: auto; margin-right: auto;
}
.holdings-header {
    display: grid; grid-template-columns: 544px 1fr;
    gap: 96px; align-items: start; margin-bottom: 72px;
}
.holdings-header-left .section-label { margin-bottom: 16px; }
.holdings-header-left h2 {
    font-family: 'Inter', sans-serif; font-size: 38.3px; font-weight: 500;
    letter-spacing: -1.6px; line-height: 48px; color: var(--dark);
}
.holdings-header-right {
    display: flex; flex-direction: column; gap: 24px;
}
.holdings-header-right p {
    font-family: 'Instrument Sans', sans-serif;
    font-size: 16px; color: var(--dark-70);
    line-height: 24px; letter-spacing: -0.01em;
}
.holdings-header-right .btn-primary {
    width: 168px; height: 57px;
    display: flex; align-items: center; justify-content: center;
    padding: 0 32px; font-size: 16px;
}

/* Restricted Access */
.restricted {
    background: var(--dark); color: var(--white);
    position: relative; overflow: hidden;
    display: flex; flex-direction: column; align-items: center;
    justify-content: center; height: 580px;
    margin-top: 156px; padding: 0;
}
.restricted-bg { position: absolute; inset: 0; z-index: 0; }
.restricted-bg img { width: 100%; height: 100%; object-fit: cover; }
.restricted-bg::after {
    content: ''; position: absolute; inset: 0;
    background: rgba(8,18,13,0.72);
}
.restricted-bg-overlay {
    position: absolute; inset: 0; z-index: 1;
    background: radial-gradient(ellipse 80% 80% at 50% 50%, rgba(41,102,77,0.12) 0%, transparent 70%);
}
.restricted-content {
    position: relative; z-index: 2; text-align: center;
    max-width: 680px; padding: 0 24px;
}
.restricted .section-label {
    display: inline-flex;
    background: rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.85);
    justify-content: center; margin-bottom: 32px;
    backdrop-filter: blur(10px);
}
.restricted h2 {
    font-family: 'Inter', sans-serif; font-size: 54.1px; font-weight: 500;
    letter-spacing: -2.24px; line-height: 58.8px;
    color: var(--white); margin-bottom: 32px;
}
.restricted p {
    font-family: 'Instrument Sans', sans-serif;
    font-size: 16px; color: rgba(255,255,255,0.68);
    max-width: 500px; margin: 0 auto 24px;
    line-height: 24px; letter-spacing: -0.01em;
}
.restricted-buttons {
    display: flex; gap: 8px; justify-content: center; flex-wrap: wrap;
}
.restricted-buttons .btn-primary {
    width: 197px; height: 57px;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
}
.restricted-buttons .btn-outline-white { width: 183px; height: 57px; }

/* Process */
.process {
    padding: 0 24px; text-align: center; margin-top: 156px;
}
.process-header { margin-bottom: 71.99px; }
.process-header .section-label {
    justify-content: center; margin-bottom: 16px;
}
.process h2 {
    font-family: 'Inter', sans-serif; font-size: 38.6px; font-weight: 500;
    letter-spacing: -1.6px; line-height: 48px; color: var(--dark);
}
.process-grid {
    display: flex; justify-content: center; align-items: flex-start;
    gap: 96px; width: 1080px; height: 496px;
    max-width: 1080px; margin: 0 auto; text-align: left;
}
.process-image {
    border-radius: var(--radius-lg); overflow: hidden;
    width: 492px; height: 496px; flex-shrink: 0;
    position: relative;
}
.process-image img {
    position: absolute; width: 151.37%; height: 100%;
    top: 0; left: -25.68%; max-width: none;
}
.process-accordion { display: flex; flex-direction: column; justify-content: space-between; height: 496px; }

/* FAQ styles moved to components.css (shared) */

/* CTA styles moved to components.css (shared) */

/* ── RESPONSIVE (Home Page) ── */
@media (max-width: 1100px) {
    .feature-block .container { grid-template-columns: 1fr 1fr; }
    .feature-block.reverse .container { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
    .hero h1 { font-size: 38px; line-height: 44px; letter-spacing: -1.5px; }
    .hero-content { padding: 0 24px 80px; width: 90%; }
    .philosophy h2 { font-size: 32px; line-height: 40px; }
    .feature-block .container { grid-template-columns: 1fr; height: auto; }
    .feature-block .feature-image { height: 320px; }
    .feature-block.reverse .feature-text { order: 1; }
    .feature-block.reverse .feature-image { order: 2; }
    .process-grid { flex-direction: column; width: auto; height: auto; gap: 32px; }
    .process-image { width: 100%; height: 260px; }
    .process-accordion { height: auto; }
    .faq-header { grid-template-columns: 1fr; gap: 24px; }
    .faq-body { grid-template-columns: 1fr; }
    .cta h2 { font-size: 36px; letter-spacing: -1.5px; }
    .restricted h2 { font-size: 36px; letter-spacing: -1.5px; }
    .scarcity h2 { font-size: 30px; }
}
@media (max-width: 600px) {
    .hero h1 { font-size: 28px; letter-spacing: -1px; line-height: 34px; }
    .stats-bar { padding: 0 20px; flex-direction: column; align-items: flex-start; gap: 16px; }
    .stats-label { width: auto; }
    .stats-cards { gap: 8px; flex-wrap: wrap; width: 100%; }
}
