/* Start custom CSS for html, class: .elementor-element-2d53416 */:root { 
--bg: #080a0b; 
--bg-soft: #0d1011; 
--bg-card: #111415; 
--bg-card-2: #151918;
--text: #f2f3f1; 
--text-soft: #b0b6b3; 
--text-muted: #747d7a;
--accent: #9bd8b7; 
--accent-bright: #b9efd0; 
--accent-dark: #315846;
--line: rgba(255, 255, 255, 0.09); 
--line-soft: rgba(255, 255, 255, 0.055);
--container: 1180px;
--ease: cubic-bezier(0.22, 0.61, 0.36, 1); 
--ease-smooth: cubic-bezier(0.16, 1, 0.3, 1); 
}
/* ========================================================= 
RESET 
========================================================= */
*, 
*::before, 
*::after { 
box-sizing: border-box; 
}
html { 
scroll-behavior: smooth; 
background: var(--bg); 
}
body { 
margin: 0; 
background: 
radial-gradient( 
circle at 80% 10%, 
rgba(155, 216, 183, 0.035), 
transparent 30% 
), 
var(--bg);
color: var(--text); 
font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
overflow-x: hidden; 
-webkit-font-smoothing: antialiased; 
text-rendering: optimizeLegibility; 
}
::selection { 
background: var(--accent); 
color: #07100b; 
}
img { 
max-width: 100%; 
display: block; 
}
button, 
input, 
textarea, 
select { 
font: inherit; 
}
a { 
color: inherit; 
}
/* ========================================================= 
GLOBAL CONTAINER / SECTIONS 
========================================================= */
.container { 
width: min(var(--container), calc(100% - 64px)); 
margin-inline: auto; 
}
.section { 
padding: 145px 0; 
}
.section-sm { 
padding: 60px 0; 
}
/* ========================================================= 
AMBIENT BACKGROUND 
========================================================= */
.site-noise { 
position: fixed; 
inset: 0; 
z-index: 100; 
pointer-events: none;
opacity: 0.018;
background-image: 
url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E"); 
}
.cursor-glow { 
position: fixed; 
width: 420px; 
height: 420px;
border-radius: 50%;
background: 
radial-gradient( 
circle, 
rgba(155, 216, 183, 0.045), 
transparent 68% 
);
transform: translate(-50%, -50%);
pointer-events: none; 
z-index: 2;
opacity: 0.75; 
transition: opacity 0.4s ease; 
}
/* ========================================================= 
NAVIGATION 
========================================================= */
.nav-wrap { 
position: fixed; 
inset: 0 0 auto; 
z-index: 80;
background: 
linear-gradient( 
180deg, 
rgba(8, 10, 11, 0.94), 
rgba(8, 10, 11, 0.76) 
);
backdrop-filter: blur(22px); 
-webkit-backdrop-filter: blur(22px);
border-bottom: 1px solid var(--line-soft); 
}
.nav { 
height: 82px;
display: flex; 
align-items: center; 
justify-content: space-between; 
}
.brand { 
display: flex; 
align-items: center; 
gap: 13px;
color: #fff; 
text-decoration: none;
font-size: 11px; 
font-weight: 700; 
letter-spacing: 2px; 
}
.brand-mark { 
width: 34px; 
height: 34px;
display: grid; 
place-items: center;
border: 1px solid rgba(155, 216, 183, 0.42);
color: var(--accent);
font: 500 10px "DM Mono", monospace;
background: rgba(155, 216, 183, 0.025); 
}
.nav-links { 
display: flex; 
align-items: center; 
gap: 32px; 
}
.nav-links a { 
position: relative;
color: #929997;
text-decoration: none;
font-size: 11px; 
font-weight: 600; 
letter-spacing: 0.3px;
transition: 
color 0.3s ease, 
opacity 0.3s ease; 
}
.nav-links a:not(.nav-cta)::after { 
content: "";
position: absolute; 
left: 0; 
bottom: -7px;
width: 0; 
height: 1px;
background: var(--accent);
transition: width 0.35s var(--ease); 
}
.nav-links a:hover { 
color: #fff; 
}
.nav-links a:hover::after { 
width: 100%; 
}
.nav-cta { 
display: inline-flex; 
align-items: center;
padding: 12px 17px;
color: #dff5e7 !important;
border: 1px solid rgba(155, 216, 183, 0.28);
background: rgba(155, 216, 183, 0.035);
transition: 
border-color 0.3s ease, 
background 0.3s ease, 
transform 0.3s ease; 
}
.nav-cta:hover { 
border-color: rgba(155, 216, 183, 0.65);
background: rgba(155, 216, 183, 0.07);
transform: translateY(-1px); 
}
.nav-cta span, 
.btn span { 
margin-left: 12px; 
}
/* ========================================================= 
MOBILE NAV 
========================================================= */
.nav-toggle { 
display: none;
padding: 8px;
border: 0; 
background: transparent;
cursor: pointer; 
}
.nav-toggle span { 
display: block;
width: 25px; 
height: 1px;
margin: 6px 0;
background: #dfe5e1;
transition: transform 0.3s ease; 
}
/* ========================================================= 
HERO 
========================================================= */
.hero { 
min-height: 100vh;
padding-top: 150px; 
padding-bottom: 90px;
position: relative;
display: flex; 
align-items: center;
overflow: hidden;
background: 
radial-gradient( 
ellipse at 78% 48%, 
rgba(155, 216, 183, 0.055), 
transparent 32% 
), 
radial-gradient( 
ellipse at 10% 80%, 
rgba(255, 255, 255, 0.025), 
transparent 32% 
); 
}
.hero::before { 
content: "";
position: absolute; 
inset: 0;
background: 
linear-gradient( 
180deg, 
rgba(255,255,255,0.018), 
transparent 25% 
);
pointer-events: none; 
}
.hero-grid { 
position: absolute; 
inset: 0;
opacity: 0.16;
background-image: 
linear-gradient( 
rgba(255,255,255,0.045) 1px, 
transparent 1px 
), 
linear-gradient( 
90deg, 
rgba(255,255,255,0.045) 1px, 
transparent 1px 
);
background-size: 76px 76px;
mask-image: 
linear-gradient( 
to bottom, 
black, 
transparent 78% 
); 
}
.hero-inner { 
position: relative; 
z-index: 5;
display: grid;
grid-template-columns: 1.08fr 0.92fr;
gap: 85px;
align-items: center; 
}
/* ========================================================= 
TYPOGRAPHY 
========================================================= */
.eyebrow, 
.section-index, 
.credential-strip, 
.case-tag, 
.contact-meta { 
font-family: "DM Mono", monospace;
font-size: 9px; 
font-weight: 500;
letter-spacing: 2.2px;
color: var(--accent); 
}
.eyebrow { 
display: flex; 
align-items: center; 
gap: 11px;
margin-bottom: 20px; 
}
.pulse-dot { 
width: 6px; 
height: 6px;
flex: 0 0 auto;
border-radius: 50%;
background: var(--accent);
box-shadow: 
0 0 0 4px rgba(155,216,183,0.07), 
0 0 18px rgba(155,216,183,0.5);
animation: pulse 2.8s ease-in-out infinite; 
}
.credential-strip { 
color: #66706c;
margin-bottom: 28px; 
}
.credential-strip i { 
color: #3c4641; 
font-style: normal; 
margin: 0 7px; 
}
.hero h1 { 
max-width: 850px;
margin: 0 0 30px;
font-size: clamp(54px, 6.3vw, 84px);
line-height: 0.98;
letter-spacing: -4.5px;
font-weight: 800;
color: #f3f4f2; 
}
.hero h1 em, 
.section-head h2 em, 
.credentials-section h2 em, 
.contact-section h2 em { 
font-style: normal; 
color: var(--accent); 
}
.hero-lead { 
max-width: 650px;
margin: 0 0 37px;
color: #9aa39f;
font-size: 15px; 
line-height: 1.85;
letter-spacing: -0.1px; 
}
/* ========================================================= 
BUTTONS 
========================================================= */
.hero-actions { 
display: flex; 
flex-wrap: wrap; 
gap: 12px; 
}
.btn { 
min-height: 50px;
display: inline-flex; 
align-items: center; 
justify-content: center;
padding: 0 21px;
border: 1px solid transparent;
text-decoration: none;
font-size: 10px; 
font-weight: 700;
letter-spacing: 0.8px;
cursor: pointer;
transition: 
transform 0.35s var(--ease), 
box-shadow 0.35s ease, 
border-color 0.35s ease, 
background 0.35s ease; 
}
.btn-primary { 
background: var(--accent); 
color: #07100b; 
}
.btn-primary:hover { 
transform: translateY(-3px);
box-shadow: 
0 14px 35px rgba(155,216,183,0.12); 
}
.btn-ghost { 
color: #e8ece9;
border-color: rgba(255,255,255,0.13);
background: rgba(255,255,255,0.015); 
}
.btn-ghost:hover { 
border-color: rgba(155,216,183,0.45);
background: rgba(155,216,183,0.035);
transform: translateY(-3px); 
}
/* ========================================================= 
HERO DATA CENTER VISUAL 
========================================================= */
.technical-frame { 
position: relative;
height: 540px;
border: 1px solid rgba(255,255,255,0.1);
background: 
linear-gradient( 
145deg, 
rgba(255,255,255,0.035), 
rgba(255,255,255,0.008) 
);
box-shadow: 
inset 0 1px 0 rgba(255,255,255,0.035), 
0 30px 80px rgba(0,0,0,0.25);
overflow: hidden; 
}
.technical-frame::before { 
content: "";
position: absolute; 
inset: 12px;
border: 1px solid rgba(155,216,183,0.055);
pointer-events: none; 
}
.frame-top { 
position: absolute;
inset: 0 0 auto;
padding: 18px 21px;
display: flex; 
justify-content: space-between;
border-bottom: 1px solid rgba(255,255,255,0.075);
color: #65706b;
font: 500 8px "DM Mono", monospace;
letter-spacing: 1.7px; 
}
.orbital { 
position: absolute;
inset: 80px 25px 115px;
display: grid; 
place-items: center; 
}
.orbit { 
position: absolute;
border: 1px solid rgba(155,216,183,0.12);
border-radius: 50%; 
}
.orbit-a { 
width: 285px; 
height: 285px;
animation: spin 28s linear infinite; 
}
.orbit-b { 
width: 410px; 
height: 185px;
transform: rotate(-25deg);
animation: spinReverse 34s linear infinite; 
}
.core { 
width: 145px; 
height: 145px;
display: flex; 
flex-direction: column; 
align-items: center; 
justify-content: center;
border-radius: 50%;
border: 1px solid rgba(155,216,183,0.38);
background: 
radial-gradient( 
circle, 
rgba(155,216,183,0.1), 
rgba(10,14,13,0.96) 68% 
);
box-shadow: 
0 0 80px rgba(155,216,183,0.07); 
}
.core span, 
.core small { 
color: #68736e;
font: 500 8px "DM Mono", monospace;
letter-spacing: 2px; 
}
.core strong { 
margin: 3px 0;
color: var(--accent);
font-size: 42px;
line-height: 1;
letter-spacing: -2px; 
}
.node { 
position: absolute;
width: 5px; 
height: 5px;
border-radius: 50%;
background: var(--accent);
box-shadow: 0 0 13px rgba(155,216,183,0.55); 
}
.n1 { top: 18%; left: 23%; } 
.n2 { top: 32%; right: 14%; } 
.n3 { bottom: 16%; left: 28%; } 
.n4 { right: 26%; bottom: 11%; }
.system-readout { 
position: absolute;
left: 24px; 
right: 24px; 
bottom: 25px;
padding-top: 16px;
display: grid; 
grid-template-columns: repeat(3,1fr);
gap: 18px;
border-top: 1px solid rgba(255,255,255,0.08); 
}
.system-readout div { 
display: flex; 
flex-direction: column; 
gap: 6px; 
}
.system-readout span { 
color: #5d6763;
font: 500 8px "DM Mono", monospace;
letter-spacing: 1px; 
}
.system-readout b { 
color: #dce4df;
font-size: 9px;
font-weight: 600; 
}
.scan-line { 
position: absolute;
left: 8%; 
right: 8%;
height: 1px;
background: 
linear-gradient( 
90deg, 
transparent, 
rgba(155,216,183,0.55), 
transparent 
);
opacity: 0.35;
animation: scan 7s ease-in-out infinite; 
}
/* ========================================================= 
SCROLL CUE 
========================================================= */
.scroll-cue { 
position: absolute;
left: 50%; 
bottom: 29px;
transform: translateX(-50%);
display: flex; 
align-items: center; 
gap: 10px;
color: #58615e;
font: 500 8px "DM Mono", monospace;
letter-spacing: 2px; 
}
.scroll-cue span { 
width: 28px; 
height: 1px;
background: #58615e; 
}
/* ========================================================= 
METRICS 
========================================================= */
.metrics { 
border-top: 1px solid var(--line-soft); 
border-bottom: 1px solid var(--line-soft);
background: 
linear-gradient( 
90deg, 
rgba(255,255,255,0.018), 
transparent, 
rgba(255,255,255,0.018) 
); 
}
.metric-grid { 
display: grid;
grid-template-columns: repeat(4,1fr); 
}
.metric { 
padding: 34px 26px;
border-right: 1px solid var(--line-soft); 
}
.metric:first-child { 
padding-left: 0; 
}
.metric:last-child { 
border-right: 0; 
}
.metric strong { 
display: block;
margin-bottom: 9px;
color: var(--accent);
font-size: 42px;
line-height: 1;
letter-spacing: -2px; 
}
.metric span { 
color: #69736f;
font: 500 8px/1.7 "DM Mono", monospace;
text-transform: uppercase;
letter-spacing: 1px; 
}
/* ========================================================= 
SECTION HEAD 
========================================================= */
.section-dark { 
background: #0b0e0e; 
}
.section-head { 
display: grid;
grid-template-columns: 1fr 1fr;
gap: 80px;
align-items: end;
margin-bottom: 62px; 
}
.section-head h2, 
.credentials-section h2, 
.contact-section h2 { 
margin: 16px 0 0;
font-size: clamp(44px,5vw,67px);
line-height: 1;
letter-spacing: -3.5px;
font-weight: 750; 
}
.section-head > p, 
.about-copy, 
.contact-section > p { 
max-width: 520px;
margin: 0;
color: #858f8a;
font-size: 13px;
line-height: 1.9; 
}
/* ========================================================= 
SERVICES 
========================================================= */
.service-grid { 
display: grid;
grid-template-columns: repeat(3,1fr);
gap: 1px;
background: rgba(255,255,255,0.09); 
}
.service-card { 
position: relative;
min-height: 455px;
padding: 39px;
background: 
linear-gradient( 
145deg, 
#111515, 
#0b0e0e 
);
overflow: hidden;
transition: 
transform 0.5s var(--ease), 
background 0.5s ease; 
}
.service-card::after { 
content: "";
position: absolute;
left: 0; 
right: 0; 
bottom: 0;
height: 1px;
background: 
linear-gradient( 
90deg, 
transparent, 
rgba(155,216,183,0.4), 
transparent 
);
opacity: 0;
transition: opacity 0.4s ease; 
}
.service-card:hover { 
background: 
linear-gradient( 
145deg, 
#151a18, 
#0d1110 
);
transform: translateY(-7px); 
}
.service-card:hover::after { 
opacity: 1; 
}
.service-num { 
color: #58615e;
font: 500 9px "DM Mono", monospace; 
}
.service-icon { 
margin: 57px 0 25px;
color: var(--accent);
font-size: 28px;
opacity: 0.9; 
}
.service-card h3 { 
margin: 0 0 17px;
font-size: 23px;
line-height: 1.18;
letter-spacing: -0.7px; 
}
.service-card p { 
margin: 0;
color: #7f8985;
font-size: 12px;
line-height: 1.75; 
}
.service-card ul { 
list-style: none;
padding: 0;
margin: 27px 0 0;
border-top: 1px solid rgba(255,255,255,0.065); 
}
.service-card li { 
padding: 10px 0;
border-bottom: 1px solid rgba(255,255,255,0.045);
color: #707a76;
font: 500 8px "DM Mono", monospace; 
}
/* ========================================================= 
CASE STUDIES 
========================================================= */
.case-section { 
background: #080a0b; 
}
.case-list { 
border-top: 1px solid rgba(255,255,255,0.1); 
}
.case-item { 
display: grid;
grid-template-columns: 65px 1fr 50px;
gap: 25px;
align-items: center;
padding: 31px 0;
border-bottom: 1px solid rgba(255,255,255,0.085);
transition: 
padding 0.45s var(--ease), 
background 0.4s ease; 
}
.case-item:hover { 
padding-left: 16px;
background: 
linear-gradient( 
90deg, 
rgba(155,216,183,0.035), 
transparent 65% 
); 
}
.case-no { 
color: #505955;
font: 500 9px "DM Mono", monospace; 
}
.case-item h3 { 
margin: 8px 0 9px;
font-size: 24px;
letter-spacing: -0.7px; 
}
.case-item p { 
max-width: 800px;
margin: 0;
color: #7c8682;
font-size: 12px;
line-height: 1.75; 
}
.case-arrow { 
color: var(--accent);
font-size: 19px; 
}
/* ========================================================= 
TIMELINE 
========================================================= */
.timeline-section { 
background: 
radial-gradient( 
circle at 80% 50%, 
rgba(155,216,183,0.035), 
transparent 30% 
), 
#0b0f0e; 
}
.timeline-layout { 
display: grid;
grid-template-columns: 1.65fr 0.75fr;
gap: 22px; 
}
.timeline-detail { 
position: relative;
min-height: 570px;
padding: 48px;
overflow: hidden;
border: 1px solid rgba(155,216,183,0.13);
background: 
linear-gradient( 
145deg, 
rgba(155,216,183,0.065), 
rgba(255,255,255,0.012) 
); 
}
.timeline-detail::before { 
content: "";
position: absolute;
width: 520px; 
height: 520px;
right: -260px; 
bottom: -260px;
border: 1px solid rgba(155,216,183,0.055);
border-radius: 50%; 
}
.timeline-detail::after { 
content: "";
position: absolute;
width: 360px; 
height: 360px;
right: -180px; 
bottom: -180px;
border: 1px solid rgba(155,216,183,0.045);
border-radius: 50%; 
}
.detail-status { 
display: flex; 
align-items: center; 
gap: 9px;
color: var(--accent);
font: 500 8px "DM Mono", monospace;
letter-spacing: 2px; 
}
.detail-year { 
margin: 38px 0 7px;
color: #f4f6f3;
font-size: clamp(74px,9vw,112px);
line-height: 0.85;
font-weight: 800;
letter-spacing: -7px; 
}
.detail-role { 
margin-bottom: 14px;
color: var(--accent);
font-size: 14px;
font-weight: 600; 
}
.timeline-detail h3 { 
margin: 0 0 18px;
font-size: 34px;
letter-spacing: -1px; 
}
.timeline-detail > p { 
position: relative; 
z-index: 2;
max-width: 760px;
margin: 0;
color: #949e99;
font-size: 13px;
line-height: 1.85; 
}
.outcome { 
position: relative; 
z-index: 3;
display: grid;
gap: 9px;
margin-top: 36px;
padding: 22px;
border: 1px solid rgba(255,255,255,0.06);
background: rgba(255,255,255,0.025); 
}
.outcome span { 
color: var(--accent);
font: 500 8px "DM Mono", monospace;
letter-spacing: 1.5px; 
}
.outcome strong { 
font-size: 14px; 
}
.outcome small { 
color: #717b76;
font-size: 10px; 
}
.outcome b { 
color: var(--accent);
font-weight: 500; 
}
.year-panel { 
padding: 28px;
border: 1px solid rgba(255,255,255,0.08);
background: rgba(255,255,255,0.015); 
}
.panel-label { 
margin-bottom: 21px;
text-align: center;
color: #66706b;
font: 500 8px "DM Mono", monospace;
letter-spacing: 2px; 
}
.year-list { 
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px;
max-height: 460px;
overflow-y: auto;
padding-right: 4px; 
}
.year-list::-webkit-scrollbar { 
width: 3px; 
}
.year-list::-webkit-scrollbar-thumb { 
background: rgba(155,216,183,0.25); 
}
.year-btn { 
appearance: none;
padding: 12px 10px;
border: 1px solid rgba(255,255,255,0.075);
background: rgba(255,255,255,0.018);
color: #7c8581;
font: 700 13px Inter, sans-serif;
cursor: pointer;
transition: 
color 0.25s ease, 
border-color 0.25s ease, 
background 0.25s ease, 
transform 0.25s ease; 
}
.year-btn:hover { 
color: #fff;
border-color: rgba(155,216,183,0.3);
transform: translateY(-1px); 
}
.year-btn.active { 
color: #07100b;
border-color: var(--accent);
background: var(--accent);
box-shadow: 
0 8px 24px rgba(155,216,183,0.1); 
}
.panel-note { 
margin-top: 24px; 
padding-top: 18px;
border-top: 1px solid rgba(255,255,255,0.075);
color: #5e6863;
text-align: center;
font: 500 8px "DM Mono", monospace; 
}
.journey-stats { 
display: grid;
grid-template-columns: repeat(4,1fr);
margin-top: 22px;
border: 1px solid rgba(255,255,255,0.07); 
}
.journey-stats div { 
padding: 25px;
text-align: center;
border-right: 1px solid rgba(255,255,255,0.07); 
}
.journey-stats div:last-child { 
border-right: 0; 
}
.journey-stats strong { 
display: block;
color: var(--accent);
font-size: 32px;
letter-spacing: -1px; 
}
.journey-stats span { 
color: #69736e;
font: 500 8px "DM Mono", monospace;
letter-spacing: 2px; 
}
/* ========================================================= 
CREDENTIALS 
========================================================= */
.credentials-section { 
background: #080a0b; 
}
.credentials-grid { 
display: grid;
grid-template-columns: 0.85fr 1.15fr;
gap: 100px;
align-items: start; 
}
.about-copy { 
margin-top: 26px; 
}
.credential-list { 
border-top: 1px solid rgba(255,255,255,0.09); 
}
.credential-list > div { 
display: grid;
grid-template-columns: 40px 1fr auto;
gap: 15px;
align-items: center;
padding: 20px 0;
border-bottom: 1px solid rgba(255,255,255,0.085);
transition: 
padding 0.3s ease, 
background 0.3s ease; 
}
.credential-list > div:hover { 
padding-left: 10px;
background: rgba(155,216,183,0.02); 
}
.credential-list span, 
.credential-list small { 
color: #58625e;
font: 500 8px "DM Mono", monospace; 
}
.credential-list strong { 
font-size: 13px;
font-weight: 600; 
}
.credential-list small { 
color: var(--accent); 
}
/* ========================================================= 
CONTACT 
========================================================= */
.contact-section { 
background: 
radial-gradient( 
circle at 85% 40%, 
rgba(155,216,183,0.045), 
transparent 30% 
), 
#0b0f0e; 
}
.contact-grid { 
display: grid;
grid-template-columns: 1fr 1fr;
gap: 100px;
align-items: start; 
}
.contact-section h2 { 
margin-bottom: 25px; 
}
.contact-section > div > p { 
max-width: 520px;
color: #89938e;
font-size: 13px;
line-height: 1.85; 
}
.contact-meta { 
display: flex;
flex-wrap: wrap;
gap: 25px;
margin-top: 35px; 
}
.contact-form { 
display: grid;
gap: 18px; 
}
.contact-form label { 
color: #7a8580;
font: 500 8px "DM Mono", monospace;
letter-spacing: 1px; 
}
.contact-form input, 
.contact-form select, 
.contact-form textarea { 
display: block;
width: 100%;
margin-top: 8px;
padding: 14px 15px;
border: 1px solid rgba(255,255,255,0.09);
border-radius: 0;
outline: none;
background: 
rgba(255,255,255,0.018);
color: #fff;
font: 13px Inter, sans-serif;
transition: 
border-color 0.3s ease, 
background 0.3s ease; 
}
.contact-form input::placeholder, 
.contact-form textarea::placeholder { 
color: #535d59; 
}
.contact-form input:focus, 
.contact-form select:focus, 
.contact-form textarea:focus { 
border-color: rgba(155,216,183,0.48);
background: 
rgba(155,216,183,0.018); 
}
.contact-form select { 
appearance: none; 
}
.contact-form textarea { 
resize: vertical; 
}
.form-status { 
min-height: 16px;
margin: 0;
color: var(--accent);
font-size: 10px; 
}
/* ========================================================= 
FOOTER 
========================================================= */
.footer { 
padding: 27px 0;
border-top: 1px solid rgba(255,255,255,0.065);
background: #080a0b; 
}
.footer-inner { 
display: flex;
justify-content: space-between;
gap: 20px;
color: #565f5b;
font: 500 8px "DM Mono", monospace;
letter-spacing: 0.8px; 
}
.footer a { 
color: var(--accent);
text-decoration: none;
transition: opacity 0.25s ease; 
}
.footer a:hover { 
opacity: 0.7; 
}
/* ========================================================= 
REVEAL ANIMATION 
========================================================= */
.reveal { 
opacity: 0;
transform: 
translateY(25px);
transition: 
opacity 0.9s var(--ease-smooth), 
transform 0.9s var(--ease-smooth); 
}
.reveal.is-visible { 
opacity: 1;
transform: none; 
}
.reveal-delay { 
transition-delay: 0.12s; 
}
.reveal-delay-2 { 
transition-delay: 0.22s; 
}
/* ========================================================= 
KEYFRAMES 
========================================================= */
@keyframes spin { 
to { 
transform: rotate(360deg); 
} 
}
@keyframes spinReverse { 
to { 
transform: rotate(-360deg); 
} 
}
@keyframes scan { 
0% { 
top: 13%; 
opacity: 0; 
}
15% { 
opacity: 0.35; 
}
50% { 
top: 84%; 
opacity: 0.2; 
}
85% { 
opacity: 0; 
}
100% { 
top: 13%; 
opacity: 0; 
} 
}
@keyframes pulse { 
0%, 
100% { 
box-shadow: 
0 0 0 4px rgba(155,216,183,0.06), 
0 0 15px rgba(155,216,183,0.35); 
}
50% { 
box-shadow: 
0 0 0 7px rgba(155,216,183,0.025), 
0 0 22px rgba(155,216,183,0.55); 
} 
}
/* ========================================================= 
TABLET 
========================================================= */
@media (max-width: 1000px) {
.hero-inner { 
grid-template-columns: 1fr;
gap: 55px;
}
.hero-copy { 
max-width: 800px; 
}
.hero-visual { 
max-width: 760px; 
}
.section-head { 
grid-template-columns: 1fr;
gap: 25px;
}
.service-grid { 
grid-template-columns: 1fr; 
}
.service-card { 
min-height: auto; 
}
.timeline-layout { 
grid-template-columns: 1fr; 
}
.credentials-grid, 
.contact-grid { 
grid-template-columns: 1fr;
gap: 60px;
}
.metric-grid { 
grid-template-columns: 1fr 1fr; 
}
.metric:nth-child(2) { 
border-right: 0; 
}
.metric:nth-child(3) { 
padding-left: 0; 
}
}
/* ========================================================= 
MOBILE 
========================================================= */
@media (max-width: 680px) {
.container { 
width: min(100% - 30px, var(--container)); 
}
.section { 
padding: 90px 0; 
}
.section-sm { 
padding: 35px 0; 
}
.nav { 
height: 70px; 
}
.brand { 
font-size: 9px;
letter-spacing: 1.5px;
}
.brand-mark { 
width: 30px; 
height: 30px; 
}
.nav-toggle { 
display: block; 
}
.nav-links { 
display: none;
position: absolute;

top: 70px;
left: 15px;
right: 15px;

padding: 13px;

flex-direction: column;
align-items: stretch;

gap: 3px;

background: rgba(11,14,13,0.98);

border: 1px solid rgba(255,255,255,0.09);

box-shadow:
  0 20px 50px rgba(0,0,0,0.35);
}
.nav-links.open { 
display: flex; 
}
.nav-links a { 
padding: 12px 10px; 
}
.nav-cta { 
justify-content: center; 
margin-top: 5px; 
}
.hero { 
padding-top: 120px;
min-height: auto;
}
.hero h1 { 
font-size: 49px;
line-height: 1;

letter-spacing: -3px;
}
.hero-lead { 
font-size: 13px;
line-height: 1.8;
}
.technical-frame { 
height: 370px; 
}
.orbital { 
inset: 65px 10px 100px; 
}
.orbit-a { 
width: 205px; 
height: 205px; 
}
.orbit-b { 
width: 285px; 
height: 135px; 
}
.core { 
width: 115px; 
height: 115px; 
}
.core strong { 
font-size: 34px; 
}
.system-readout { 
grid-template-columns: 1fr; 
}
.system-readout div:nth-child(n+2) { 
display: none; 
}
.metric-grid { 
grid-template-columns: 1fr; 
}
.metric, 
.metric:first-child, 
.metric:nth-child(3) { 
padding: 25px 0;
border-right: 0;

border-bottom: 1px solid var(--line-soft);
}
.metric:last-child { 
border-bottom: 0; 
}
.section-head h2, 
.credentials-section h2, 
.contact-section h2 { 
font-size: 44px;
letter-spacing: -2.5px;
}
.case-item { 
grid-template-columns: 34px 1fr; 
}
.case-arrow { 
display: none; 
}
.case-item h3 { 
font-size: 21px; 
}
.timeline-detail { 
min-height: auto;
padding: 31px;
}
.detail-year { 
font-size: 78px;
letter-spacing: -5px;
}
.timeline-detail h3 { 
font-size: 27px; 
}
.year-list { 
grid-template-columns: repeat(4,1fr);
max-height: none;
}
.journey-stats { 
grid-template-columns: 1fr 1fr; 
}
.journey-stats div { 
border-bottom: 1px solid rgba(255,255,255,0.07); 
}
.journey-stats div:nth-child(2) { 
border-right: 0; 
}
.journey-stats div:nth-child(n+3) { 
border-bottom: 0; 
}
.footer-inner { 
flex-direction: column;
line-height: 1.6;
}
.cursor-glow { 
display: none; 
} 
}
/* ========================================================= 
ACCESSIBILITY / REDUCED MOTION 
========================================================= */
@media (prefers-reduced-motion: reduce) {
html { 
scroll-behavior: auto; 
}
*, 
*::before, 
*::after { 
animation: none !important;
transition: none !important;
}
.reveal { 
opacity: 1; 
transform: none; 
} 
}/* End custom CSS */