/* HOME PAGE STYLES */

/* Hero */
.hero { position: relative; min-height: 100dvh; display: flex; align-items: center; padding-top: calc(var(--header-h) + var(--space-16)); padding-bottom: var(--space-24); overflow: hidden; }
.hero-bg { position: absolute; inset: 0; background: radial-gradient(ellipse 80% 60% at 65% 45%, rgba(95,160,168,0.07) 0%, transparent 65%), linear-gradient(180deg, #0d1414 0%, #111212 100%); }
.hero-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(95,160,168,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(95,160,168,0.04) 1px, transparent 1px); background-size: 56px 56px; mask-image: radial-gradient(ellipse 80% 100% at 50% 0%, black 20%, transparent 75%); pointer-events: none; }
.hero-content { position: relative; max-width: 920px; margin: 0 auto; padding: 0 clamp(var(--space-5), 5vw, var(--space-12)); }
.hero-eyebrow { font-size: var(--text-xs); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-primary); margin-bottom: var(--space-5); }
.hero h1 { font-size: var(--text-hero); line-height: 0.95; color: var(--color-text); margin-bottom: var(--space-8); }
.hero h1 .accent { color: var(--color-primary); }
.hero-sub { font-size: var(--text-lg); color: var(--color-text-muted); max-width: 52ch; line-height: 1.65; margin-bottom: var(--space-10); }
.hero .btn-group { margin-bottom: var(--space-16); }
.hero-stats { display: flex; align-items: center; gap: var(--space-8); flex-wrap: wrap; }
.stat { display: flex; flex-direction: column; gap: 2px; }
.stat-n { font-family: var(--font-display); font-size: var(--text-xl); color: var(--color-primary); letter-spacing: 0.06em; }
.stat-l { font-size: var(--text-xs); color: var(--color-text-muted); letter-spacing: 0.08em; text-transform: uppercase; }
.stat-div { width: 1px; height: 38px; background: var(--color-border); }

/* Services overview */
.services-overview { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-5); }
.overview-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-7, 1.75rem); display: flex; flex-direction: column; gap: var(--space-3); transition: border-color var(--transition), transform var(--transition); text-decoration: none; }
.overview-card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.overview-card .card-icon { margin-bottom: var(--space-2); }
.overview-card h3 { font-size: var(--text-base); color: var(--color-text); }
.overview-card p { font-size: var(--text-sm); color: var(--color-text-muted); line-height: 1.65; flex: 1; }
.card-link { font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-primary); margin-top: var(--space-2); }

/* About visual */
.about-visual { display: flex; flex-direction: column; gap: var(--space-5); }
.about-emblem { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-xl); padding: var(--space-10); display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-3); }
.emblem-title { font-family: var(--font-display); font-size: var(--text-xl); letter-spacing: 0.1em; }
.emblem-sub { font-size: var(--text-sm); color: var(--color-text-muted); }
.about-quote { background: var(--color-accent-dark); border-left: 3px solid var(--color-primary); border-radius: var(--radius-md); padding: var(--space-6); }
.about-quote p { font-size: var(--text-base); color: var(--color-text-muted); line-height: 1.7; font-style: italic; }

/* Content hub */
.content-hub { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
.hub-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-8); display: flex; flex-direction: column; gap: var(--space-4); transition: border-color var(--transition), transform var(--transition); text-decoration: none; }
.hub-card:hover { border-color: var(--color-primary); transform: translateY(-3px); }
.hub-icon { width: 52px; height: 52px; background: var(--color-accent-dark); border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; }
.hub-label { font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-primary); margin-bottom: var(--space-1); }
.hub-card h3 { font-size: var(--text-lg); color: var(--color-text); margin-bottom: var(--space-2); }
.hub-card p { font-size: var(--text-sm); color: var(--color-text-muted); line-height: 1.7; flex: 1; }

/* CTA Banner */
.cta-banner { background: var(--color-accent-dark); border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); padding-block: var(--space-20); text-align: center; }
.cta-banner h2 { font-size: var(--text-2xl); margin-bottom: var(--space-4); }
.cta-banner p { font-size: var(--text-lg); color: var(--color-text-muted); max-width: 52ch; margin: 0 auto var(--space-10); line-height: 1.65; }

/* Responsive */
@media (max-width: 1100px) { .services-overview { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .services-overview { grid-template-columns: 1fr; } .content-hub { grid-template-columns: 1fr; } .hero-stats { gap: var(--space-5); } .stat-div { display: none; } }