/* ============================================
   innovare-tec gmbh — Design System v3
   Mobile-first · Animated · Stylish
   ============================================ */

:root {
    --primary: #0a0e27;
    --primary-light: #111640;
    --blue: #1e3a8a;
    --blue-mid: #3b82f6;
    --cyan: #06b6d4;
    --cyan-light: #22d3ee;
    --light-blue: #60a5fa;
    --white: #ffffff;
    --gray-50: #f8fafc;
    --gray-100: #f1f5f9;
    --gray-200: #e2e8f0;
    --gray-300: #cbd5e1;
    --gray-400: #9ca3af;
    --gray-500: #6b7280;
    --gray-600: #4b5563;
    --gray-700: #374151;
    --text: #1e293b;
    --text-light: #64748b;
    --text-muted: #94a3b8;

    --font-head: 'Space Grotesk', 'Inter', system-ui, sans-serif;
    --font-body: 'Inter', system-ui, sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', monospace;

    --max-w: 1200px;
    --nav-h: 72px;
    --radius: 12px;
    --radius-sm: 8px;
    --radius-lg: 20px;
    --ease: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-out: cubic-bezier(0.33, 1, 0.68, 1);
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --t: 0.35s;
    --t-fast: 0.2s;
    --glow-cyan: 0 0 30px rgba(6,182,212,0.15);
    --glow-blue: 0 0 40px rgba(59,130,246,0.1);
}

/* Reset */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:var(--nav-h); }
body {
    font-family:var(--font-body); color:var(--text); background:var(--white);
    line-height:1.65; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
    overflow-x:hidden;
}
a { color:var(--cyan); text-decoration:none; transition:color var(--t) var(--ease); }
a:hover { color:var(--cyan-light); }
img { max-width:100%; display:block; }
ul,ol { list-style:none; }
.mono { font-family:var(--font-mono); font-weight:500; }
.container { max-width:var(--max-w); margin:0 auto; padding:0 20px; }
@media(min-width:768px) { .container { padding:0 40px; } }

/* ===== NAVIGATION ===== */
.nav {
    position:fixed; top:0; left:0; right:0; height:var(--nav-h); z-index:1000;
    background:rgba(255,255,255,0.0); backdrop-filter:blur(0px); -webkit-backdrop-filter:blur(0px);
    border-bottom:1px solid transparent; transition:all 0.5s var(--ease);
}
.nav.scrolled {
    background:rgba(255,255,255,0.92); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
    border-bottom-color:rgba(226,232,240,0.6); box-shadow:0 4px 30px rgba(10,14,39,0.06);
}
.nav-inner {
    max-width:var(--max-w); margin:0 auto; padding:0 20px; height:100%;
    display:flex; align-items:center; justify-content:space-between; gap:20px;
}
@media(min-width:768px) { .nav-inner { padding:0 40px; gap:24px; } }
.nav-logo { display:flex; align-items:center; }
.nav-logo-img { height:38px; width:auto; transition:filter 0.5s var(--ease), transform 0.3s var(--ease); }
.nav-logo:hover .nav-logo-img { transform:scale(1.04); }
.nav:not(.scrolled) .nav-logo-img { filter:brightness(0) invert(1); }
@media(min-width:768px) { .nav-logo-img { height:42px; } }
.nav-links { display:none; align-items:center; gap:28px; }
@media(min-width:1024px) { .nav-links { display:flex; } }
.nav-link {
    font-size:13px; font-weight:500; color:rgba(255,255,255,0.75); transition:color var(--t), transform var(--t-fast);
    position:relative; padding:4px 0;
}
.nav-link:hover { color:#fff; transform:translateY(-1px); }
.nav-link.active { color:#fff; }
.nav.scrolled .nav-link { color:var(--text-light); }
.nav.scrolled .nav-link:hover { color:var(--text); transform:translateY(-1px); }
.nav.scrolled .nav-link.active { color:var(--text); }
.nav-link.active::after {
    content:''; position:absolute; bottom:-2px; left:0; right:0; height:2px;
    background:linear-gradient(90deg, var(--cyan), var(--blue-mid)); border-radius:1px;
    animation:navUnderline 0.3s var(--ease);
}
@keyframes navUnderline { from { transform:scaleX(0); } to { transform:scaleX(1); } }
.nav-link-cta {
    background:var(--cyan); color:var(--primary)!important; padding:7px 18px; border-radius:var(--radius-sm);
    font-weight:600; transition:all var(--t) var(--ease);
}
.nav-link-cta:hover { background:var(--cyan-light); color:var(--primary)!important; transform:translateY(-1px); box-shadow:0 4px 16px rgba(6,182,212,0.3); }
.nav.scrolled .nav-link-cta { color:var(--primary)!important; }
.nav-link-cta.active::after { display:none; }
.nav-right { display:flex; align-items:center; gap:12px; }
@media(min-width:768px) { .nav-right { gap:16px; } }

/* Language Toggle */
.lang-toggle {
    background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.15); border-radius:6px;
    padding:5px 10px; cursor:pointer; display:flex; align-items:center; gap:4px;
    transition:all var(--t) var(--ease);
}
.lang-toggle:hover { background:rgba(255,255,255,0.18); border-color:rgba(255,255,255,0.3); }
.nav.scrolled .lang-toggle { background:var(--gray-50); border-color:var(--gray-200); }
.nav.scrolled .lang-toggle:hover { background:var(--gray-100); border-color:var(--gray-300); }
.lang-opt { font-family:var(--font-mono); font-size:12px; font-weight:600; color:rgba(255,255,255,0.35); transition:color var(--t); }
.lang-opt.active { color:var(--cyan); }
.nav.scrolled .lang-opt { color:var(--gray-400); }
.nav.scrolled .lang-opt.active { color:var(--cyan); }
.lang-sep { font-size:11px; color:rgba(255,255,255,0.15); transition:color var(--t); }
.nav.scrolled .lang-sep { color:var(--gray-300); }

/* Mobile Toggle */
.nav-toggle {
    display:flex; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px;
}
@media(min-width:1024px) { .nav-toggle { display:none; } }
.nav-toggle span { display:block; width:20px; height:2px; background:#fff; transition:all 0.4s var(--ease); border-radius:1px; }
.nav.scrolled .nav-toggle span { background:var(--text); }
.nav-toggle.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.nav-toggle.active span:nth-child(2) { opacity:0; transform:scaleX(0); }
.nav-toggle.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* Mobile Menu */
.mobile-menu {
    position:fixed; top:var(--nav-h); left:0; right:0; bottom:0;
    background:linear-gradient(180deg, var(--primary) 0%, #0d1235 100%);
    z-index:999; display:flex; align-items:center; justify-content:center;
    opacity:0; visibility:hidden; transition:all 0.5s var(--ease);
}
.mobile-menu.open { opacity:1; visibility:visible; }
@media(min-width:1024px) { .mobile-menu { display:none; } }
.mobile-menu-inner { display:flex; flex-direction:column; gap:24px; text-align:center; }
.mobile-link {
    font-family:var(--font-head); font-size:28px; font-weight:600; color:#fff;
    transition:all var(--t); opacity:0; transform:translateY(20px);
}
.mobile-menu.open .mobile-link {
    opacity:1; transform:translateY(0);
    transition:opacity 0.5s var(--ease), transform 0.5s var(--ease);
}
.mobile-menu.open .mobile-link:nth-child(1) { transition-delay:0.05s; }
.mobile-menu.open .mobile-link:nth-child(2) { transition-delay:0.1s; }
.mobile-menu.open .mobile-link:nth-child(3) { transition-delay:0.15s; }
.mobile-menu.open .mobile-link:nth-child(4) { transition-delay:0.2s; }
.mobile-menu.open .mobile-link:nth-child(5) { transition-delay:0.25s; }
.mobile-menu.open .mobile-link:nth-child(6) { transition-delay:0.3s; }
.mobile-link:hover { color:var(--cyan); transform:translateX(8px); }

/* ===== HERO ===== */
.hero {
    position:relative; min-height:100vh; min-height:100dvh;
    display:flex; align-items:center; justify-content:center;
    overflow:hidden; padding:calc(var(--nav-h) + 24px) 0 48px;
}
@media(min-width:768px) { .hero { padding:calc(var(--nav-h) + 40px) 0 60px; } }
.hero-bg { position:absolute; inset:0; z-index:0; }
.hero-gradient {
    position:absolute; inset:0;
    background:linear-gradient(135deg, #0a0e27 0%, #111640 25%, #0d1235 50%, #0a0e27 75%, #111640 100%);
    background-size:400% 400%;
    animation:gradientShift 15s ease infinite;
}
@keyframes gradientShift {
    0% { background-position:0% 50%; }
    25% { background-position:50% 100%; }
    50% { background-position:100% 50%; }
    75% { background-position:50% 0%; }
    100% { background-position:0% 50%; }
}
/* Animated gradient orbs */
.hero-gradient::before {
    content:''; position:absolute; width:500px; height:500px; border-radius:50%;
    background:radial-gradient(circle, rgba(6,182,212,0.22) 0%, rgba(6,182,212,0.05) 40%, transparent 70%);
    top:-10%; right:-10%; animation:orbPulse 8s ease-in-out infinite;
    filter:blur(40px);
}
.hero-gradient::after {
    content:''; position:absolute; width:400px; height:400px; border-radius:50%;
    background:radial-gradient(circle, rgba(59,130,246,0.18) 0%, rgba(59,130,246,0.04) 40%, transparent 70%);
    bottom:-5%; left:-8%; animation:orbPulse 10s ease-in-out infinite reverse;
    filter:blur(40px);
}
@media(min-width:768px) {
    .hero-gradient::before { width:700px; height:700px; }
    .hero-gradient::after { width:600px; height:600px; }
}
/* Third orb (center, cyan) */
.hero-orb-3 {
    position:absolute; width:350px; height:350px; border-radius:50%;
    background:radial-gradient(circle, rgba(34,211,238,0.15) 0%, transparent 70%);
    top:50%; left:50%; transform:translate(-50%,-50%);
    animation:orbPulse3 12s ease-in-out infinite;
    filter:blur(50px); pointer-events:none; z-index:0;
}
@media(min-width:768px) { .hero-orb-3 { width:500px; height:500px; } }
@keyframes orbPulse3 {
    0%,100% { transform:translate(-50%,-50%) scale(1); opacity:0.5; }
    33% { transform:translate(-40%,-60%) scale(1.2); opacity:0.9; }
    66% { transform:translate(-60%,-40%) scale(0.85); opacity:0.3; }
}
@keyframes orbPulse {
    0%,100% { transform:scale(1) translate(0,0); opacity:0.6; }
    33% { transform:scale(1.15) translate(30px,-20px); opacity:1; }
    66% { transform:scale(0.9) translate(-20px,15px); opacity:0.4; }
}

/* Grid pattern */
.geo-grid {
    position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(59,130,246,0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(59,130,246,0.05) 1px, transparent 1px);
    background-size:60px 60px;
    mask-image:radial-gradient(ellipse at 50% 40%, black 20%, transparent 70%);
    -webkit-mask-image:radial-gradient(ellipse at 50% 40%, black 20%, transparent 70%);
    animation:gridDrift 30s linear infinite;
}
@media(min-width:768px) { .geo-grid { background-size:80px 80px; } }
@keyframes gridDrift {
    0% { background-position:0 0; }
    100% { background-position:80px 80px; }
}

/* Geometric shapes */
.geo-shapes { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.geo-shape { position:absolute; border:1px solid rgba(6,182,212,0.15); border-radius:2px; background:rgba(6,182,212,0.02); box-shadow:0 0 15px rgba(6,182,212,0.04); }
.geo-shape-1 { width:200px; height:200px; top:10%; right:-5%; animation:geoFloat1 18s ease-in-out infinite; }
.geo-shape-2 { width:150px; height:150px; bottom:15%; left:-3%; border-color:rgba(59,130,246,0.12); animation:geoFloat2 22s ease-in-out infinite; }
.geo-shape-3 { width:100px; height:100px; top:40%; left:20%; border-color:rgba(96,165,250,0.10); animation:geoFloat3 16s ease-in-out infinite; }
.geo-shape-4 { width:80px; height:80px; top:20%; left:60%; border-color:rgba(6,182,212,0.10); border-radius:50%; animation:geoFloat4 14s ease-in-out infinite; }
.geo-shape-5 { width:180px; height:180px; bottom:5%; right:15%; border-color:rgba(30,58,138,0.12); animation:geoFloat5 25s ease-in-out infinite; }
.geo-shape-6 { width:60px; height:60px; top:65%; left:8%; border-color:rgba(6,182,212,0.12); border-radius:50%; animation:geoFloat6 12s ease-in-out infinite; }
@media(min-width:768px) {
    .geo-shape-1 { width:300px; height:300px; }
    .geo-shape-2 { width:200px; height:200px; }
    .geo-shape-3 { width:150px; height:150px; }
    .geo-shape-4 { width:100px; height:100px; }
    .geo-shape-5 { width:250px; height:250px; }
    .geo-shape-6 { width:80px; height:80px; }
}

/* Animated dots */
.geo-shape-dot { border:none; border-radius:50%; background:rgba(6,182,212,0.35); box-shadow:0 0 6px rgba(6,182,212,0.3); }
.geo-shape-dot-1 { width:3px; height:3px; top:25%; left:35%; animation:dotPulse 4s ease-in-out infinite; }
.geo-shape-dot-2 { width:2px; height:2px; top:55%; right:25%; animation:dotPulse 5s ease-in-out 1s infinite; }
.geo-shape-dot-3 { width:4px; height:4px; top:75%; left:55%; animation:dotPulse 3.5s ease-in-out 0.5s infinite; background:rgba(59,130,246,0.2); }
.geo-shape-dot-4 { width:2px; height:2px; top:15%; left:70%; animation:dotPulse 6s ease-in-out 2s infinite; }
@media(min-width:768px) {
    .geo-shape-dot-1 { width:4px; height:4px; }
    .geo-shape-dot-2 { width:3px; height:3px; }
    .geo-shape-dot-3 { width:5px; height:5px; }
    .geo-shape-dot-4 { width:3px; height:3px; }
}

/* Animated lines */
.geo-line { border:none; width:80px; height:1px; background:linear-gradient(90deg, transparent, rgba(6,182,212,0.25), transparent); box-shadow:0 0 8px rgba(6,182,212,0.1); }
.geo-line-1 { top:30%; left:10%; transform:rotate(-15deg); animation:lineSweep 8s ease-in-out infinite; }
.geo-line-2 { bottom:25%; right:5%; transform:rotate(20deg); animation:lineSweep 10s ease-in-out 3s infinite; width:100px; }
@media(min-width:768px) {
    .geo-line-1 { width:120px; }
    .geo-line-2 { width:160px; }
}

@keyframes geoFloat1 {
    0%,100% { transform:rotate(45deg) translate(0,0); opacity:0.8; }
    25% { transform:rotate(50deg) translate(15px,-20px); opacity:1; }
    50% { transform:rotate(42deg) translate(25px,-10px); opacity:0.6; }
    75% { transform:rotate(48deg) translate(5px,-25px); opacity:0.9; }
}
@keyframes geoFloat2 {
    0%,100% { transform:rotate(30deg) translate(0,0); opacity:0.7; }
    33% { transform:rotate(35deg) translate(-20px,15px); opacity:1; }
    66% { transform:rotate(25deg) translate(10px,-10px); opacity:0.5; }
}
@keyframes geoFloat3 {
    0%,100% { transform:rotate(60deg) translate(0,0) scale(1); }
    50% { transform:rotate(65deg) translate(20px,-15px) scale(1.05); }
}
@keyframes geoFloat4 {
    0%,100% { transform:translate(0,0) scale(1); opacity:0.5; }
    50% { transform:translate(-15px,20px) scale(1.2); opacity:0.8; }
}
@keyframes geoFloat5 {
    0%,100% { transform:rotate(15deg) translate(0,0); opacity:0.4; }
    33% { transform:rotate(20deg) translate(-30px,10px); opacity:0.7; }
    66% { transform:rotate(12deg) translate(15px,-20px); opacity:0.3; }
}
@keyframes geoFloat6 {
    0%,100% { transform:translate(0,0) scale(1); opacity:0.4; }
    50% { transform:translate(10px,-15px) scale(0.8); opacity:0.7; }
}
@keyframes dotPulse {
    0%,100% { transform:scale(1); opacity:0.3; }
    50% { transform:scale(2.5); opacity:0.8; }
}
@keyframes lineSweep {
    0%,100% { opacity:0; transform:translateX(-30px) rotate(-15deg); }
    30%,70% { opacity:1; }
    50% { transform:translateX(30px) rotate(-15deg); }
}

.hero-content { position:relative; z-index:1; text-align:center; max-width:1000px; }
.hero-badge {
    display:inline-block; font-size:11px; letter-spacing:2.5px; color:rgba(255,255,255,0.35);
    border:1px solid rgba(255,255,255,0.08); border-radius:100px; padding:6px 18px; margin-bottom:24px;
    backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
    background:rgba(255,255,255,0.03);
    animation:badgeFade 1s var(--ease) 0.2s both;
}
@keyframes badgeFade { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
.hero-h1 {
    font-family:var(--font-head); font-weight:700; line-height:1.15; margin-bottom:14px;
    letter-spacing:-0.5px; animation:heroTitleIn 0.8s var(--ease) 0.3s both;
}
@media(min-width:768px) { .hero-h1 { letter-spacing:-1px; } }
@keyframes heroTitleIn { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
.hero-h1 span { display:inline; color:#fff; font-size:clamp(24px,4.5vw,52px); }
.hero-accent { color:var(--cyan)!important; position:relative; }
.hero-accent::after {
    content:''; position:absolute; bottom:-4px; left:5%; right:5%; height:2px;
    background:linear-gradient(90deg, transparent, var(--cyan), var(--blue-mid), transparent);
    opacity:0.4; border-radius:1px;
    animation:accentGlow 3s ease-in-out infinite alternate;
}
@keyframes accentGlow { 0%{opacity:0.2;filter:blur(0px);} 100%{opacity:0.5;filter:blur(1px);} }
.hero-sub {
    font-size:clamp(14px,2vw,20px); color:rgba(255,255,255,0.45); margin-bottom:36px; font-weight:400;
    animation:heroSubIn 0.8s var(--ease) 0.5s both;
}
@media(min-width:768px) { .hero-sub { margin-bottom:48px; } }
@keyframes heroSubIn { from { opacity:0; transform:translateY(15px); } to { opacity:1; transform:translateY(0); } }

/* Mode Cards */
.hero-modes { display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:32px; text-align:left; }
@media(min-width:640px) { .hero-modes { grid-template-columns:repeat(3,1fr); gap:16px; } }
@media(min-width:768px) { .hero-modes { gap:20px; margin-bottom:40px; } }
.mode-card {
    background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06);
    border-radius:var(--radius); padding:20px; position:relative; overflow:hidden;
    transition:all 0.5s var(--ease);
    backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.mode-card::before {
    content:''; position:absolute; inset:0; border-radius:var(--radius);
    background:linear-gradient(135deg, rgba(6,182,212,0.06) 0%, transparent 50%);
    opacity:0; transition:opacity 0.5s var(--ease);
}
.mode-card:hover { border-color:rgba(6,182,212,0.25); transform:translateY(-3px); }
.mode-card:hover::before { opacity:1; }
@media(min-width:768px) { .mode-card { padding:24px; } }
.mode-num { font-size:11px; color:rgba(255,255,255,0.15); letter-spacing:2px; display:block; margin-bottom:8px; }
.mode-title { font-family:var(--font-head); font-size:17px; font-weight:600; color:#fff; margin-bottom:4px; }
@media(min-width:768px) { .mode-title { font-size:18px; } }
.mode-sub { font-size:12px; color:var(--cyan); opacity:0.8; }
@media(min-width:768px) { .mode-sub { font-size:13px; } }

/* Hero CTA */
.btn {
    display:inline-flex; align-items:center; justify-content:center; font-family:var(--font-body);
    font-size:14px; font-weight:600; padding:13px 28px; border-radius:var(--radius-sm); cursor:pointer;
    border:none; text-decoration:none; transition:all 0.4s var(--ease); letter-spacing:-0.2px;
    position:relative; overflow:hidden;
}
@media(min-width:768px) { .btn { padding:14px 32px; } }
.btn-cyan {
    background:linear-gradient(135deg, var(--cyan) 0%, #0891b2 100%); color:var(--primary);
    box-shadow:0 2px 12px rgba(6,182,212,0.2);
}
.btn-cyan:hover {
    color:var(--primary); transform:translateY(-2px);
    box-shadow:0 8px 28px rgba(6,182,212,0.35);
}
.btn-cyan::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(135deg, transparent 0%, rgba(255,255,255,0.15) 50%, transparent 100%);
    transform:translateX(-100%); transition:transform 0.6s var(--ease);
}
.btn-cyan:hover::after { transform:translateX(100%); }
.btn-sm { padding:10px 22px; font-size:13px; }
@media(min-width:768px) { .btn-sm { padding:10px 24px; } }
.btn-outline {
    background:transparent; color:var(--cyan); border:1px solid rgba(6,182,212,0.25);
}
.btn-outline:hover { background:rgba(6,182,212,0.08); border-color:var(--cyan); color:var(--cyan); }
.hero-cta {
    margin-top:8px;
    animation:heroCTAIn 0.8s var(--ease) 0.7s both;
}
@keyframes heroCTAIn { from { opacity:0; transform:translateY(15px); } to { opacity:1; transform:translateY(0); } }

/* Scroll indicator */
.hero-scroll { position:absolute; bottom:50px; left:50%; transform:translateX(-50%); z-index:3; }
@media(min-width:768px) { .hero-scroll { bottom:75px; } }
@media(min-width:1024px) { .hero-scroll { bottom:95px; } }
.scroll-dot {
    width:6px; height:6px; background:rgba(255,255,255,0.35); border-radius:50%;
    animation:scrollBounce 2.5s ease-in-out infinite;
}
@keyframes scrollBounce { 0%,100%{transform:translateY(0);opacity:.3} 50%{transform:translateY(14px);opacity:.8} }

/* Noise texture overlay */
.hero-noise {
    position:absolute; inset:0; z-index:0; opacity:0.035; pointer-events:none;
    mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-repeat:repeat; background-size:256px 256px;
}

/* Wave divider hero → section */
.hero-divider { position:absolute; bottom:-1px; left:0; right:0; z-index:2; line-height:0; }
.hero-divider svg { width:100%; height:40px; display:block; }
@media(min-width:768px) { .hero-divider svg { height:60px; } }
@media(min-width:1024px) { .hero-divider svg { height:80px; } }

/* ===== SECTIONS ===== */
.section { padding:60px 0; }
@media(min-width:768px) { .section { padding:100px 0; } }
@media(min-width:1024px) { .section { padding:120px 0; } }
.section-white { background:var(--white); }
.section-gray { background:var(--gray-50); position:relative; }
.section-gray::before {
    content:''; position:absolute; top:0; left:0; right:0; height:1px;
    background:linear-gradient(90deg, transparent, var(--gray-200), transparent);
}
.section-dark { background:var(--primary); color:#fff; position:relative; overflow:hidden; }
.section-dark::before {
    content:''; position:absolute; top:-200px; right:-200px; width:500px; height:500px;
    background:radial-gradient(circle, rgba(6,182,212,0.04) 0%, transparent 70%);
    border-radius:50%; pointer-events:none;
}
.section-head { text-align:center; margin-bottom:40px; }
@media(min-width:768px) { .section-head { margin-bottom:56px; } }
.section-label {
    display:inline-block; font-size:11px; letter-spacing:3px; color:var(--cyan); text-transform:uppercase;
    margin-bottom:12px; position:relative; padding:0 16px;
}
.section-label::before, .section-label::after {
    content:''; position:absolute; top:50%; width:20px; height:1px;
    background:linear-gradient(90deg, transparent, var(--cyan));
}
.section-label::before { right:100%; }
.section-label::after { left:100%; background:linear-gradient(90deg, var(--cyan), transparent); }
.section-dark .section-label { color:var(--cyan); }
.section-title {
    font-family:var(--font-head); font-size:clamp(24px,4vw,40px); font-weight:700;
    letter-spacing:-0.5px; line-height:1.2;
}
.section-dark .section-title { color:#fff; }
.section-sub { font-size:15px; color:var(--text-light); margin-top:8px; }
@media(min-width:768px) { .section-sub { font-size:16px; } }
.section-dark .section-sub { color:rgba(255,255,255,0.45); }

/* ===== ANSATZ: PHASES ===== */
.phases { max-width:720px; margin:0 auto 48px; position:relative; padding-left:36px; }
@media(min-width:768px) { .phases { padding-left:48px; margin-bottom:64px; } }
.phases::before {
    content:''; position:absolute; left:12px; top:0; bottom:0; width:2px;
    background:linear-gradient(180deg, var(--cyan), var(--blue-mid), var(--gray-200));
    border-radius:1px;
}
@media(min-width:768px) { .phases::before { left:18px; } }
.phase { position:relative; padding-bottom:28px; }
@media(min-width:768px) { .phase { padding-bottom:36px; } }
.phase:last-child { padding-bottom:0; }
.phase-marker {
    position:absolute; left:-36px; top:0; width:28px; height:28px;
    background:linear-gradient(135deg, var(--cyan), var(--blue-mid));
    border-radius:50%; display:flex; align-items:center; justify-content:center; z-index:1;
    box-shadow:0 0 0 4px var(--white), 0 0 0 5px var(--gray-200);
    transition:all 0.4s var(--ease);
}
@media(min-width:768px) { .phase-marker { left:-48px; width:36px; height:36px; } }
.phase-marker span { font-size:10px; font-weight:700; color:#fff; }
@media(min-width:768px) { .phase-marker span { font-size:12px; } }
.phase-body {
    background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius);
    padding:16px; transition:all 0.4s var(--ease);
}
.phase-body:hover { box-shadow:0 8px 24px rgba(10,14,39,0.06); border-color:var(--gray-300); }
@media(min-width:768px) { .phase-body { padding:24px; } }
.phase-period { font-size:11px; color:var(--cyan); letter-spacing:1px; margin-bottom:4px; }
@media(min-width:768px) { .phase-period { font-size:12px; margin-bottom:6px; } }
.phase-title { font-family:var(--font-head); font-size:16px; font-weight:600; color:var(--text); margin-bottom:6px; }
@media(min-width:768px) { .phase-title { font-size:18px; margin-bottom:8px; } }
.phase-body > p { font-size:13px; color:var(--text-light); }
@media(min-width:768px) { .phase-body > p { font-size:14px; } }
.phase-result {
    font-size:12px; color:var(--cyan); background:rgba(6,182,212,0.06); padding:6px 12px;
    border-radius:6px; display:inline-block; margin-top:10px; border:1px solid rgba(6,182,212,0.12);
}
@media(min-width:768px) { .phase-result { font-size:13px; padding:8px 14px; margin-top:12px; } }

/* Formula */
.fp-section { max-width:720px; margin:0 auto; }
.fp-formula-box {
    font-family:var(--font-mono); font-size:clamp(15px,2.5vw,22px); font-weight:600;
    background:linear-gradient(135deg, var(--primary), #111640);
    color:#fff; padding:18px 24px; border-radius:var(--radius); text-align:center;
    border:1px solid rgba(6,182,212,0.15);
    box-shadow:var(--glow-cyan);
    transition:all 0.4s var(--ease);
}
.fp-formula-box:hover { border-color:rgba(6,182,212,0.3); box-shadow:0 0 50px rgba(6,182,212,0.2); }
@media(min-width:768px) { .fp-formula-box { padding:20px 28px; } }

/* ===== PLATTFORM: CAPABILITIES ===== */
.cap-grid { display:grid; grid-template-columns:1fr; gap:12px; }
@media(min-width:640px) { .cap-grid { grid-template-columns:repeat(2,1fr); gap:16px; } }
@media(min-width:1024px) {
    .cap-grid { grid-template-columns:repeat(3,1fr); gap:20px; }
}
.cap-card {
    background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06);
    border-radius:var(--radius); padding:22px; position:relative; overflow:hidden;
    transition:all 0.5s var(--ease);
}
.cap-card::before {
    content:''; position:absolute; top:0; left:0; right:0; height:2px;
    background:linear-gradient(90deg, transparent, var(--cyan), transparent);
    opacity:0; transition:opacity 0.5s var(--ease);
}
.cap-card:hover { border-color:rgba(6,182,212,0.2); transform:translateY(-4px); }
.cap-card:hover::before { opacity:1; }
@media(min-width:768px) { .cap-card { padding:28px; } }
.cap-icon { width:36px; height:36px; color:var(--cyan); margin-bottom:14px; transition:transform 0.4s var(--ease-spring); }
.cap-card:hover .cap-icon { transform:scale(1.15) rotate(-3deg); }
@media(min-width:768px) { .cap-icon { width:44px; height:44px; margin-bottom:16px; } }
.cap-icon svg { width:100%; height:100%; }
.cap-card h3 { font-family:var(--font-head); font-size:16px; font-weight:600; color:#fff; margin-bottom:8px; }
@media(min-width:768px) { .cap-card h3 { font-size:17px; margin-bottom:10px; } }
.cap-card p { font-size:13px; color:rgba(255,255,255,0.55); margin-bottom:6px; line-height:1.6; }
.cap-value {
    font-size:12px; color:var(--cyan); margin-top:12px; padding:5px 12px;
    background:rgba(6,182,212,0.06); border:1px solid rgba(6,182,212,0.1);
    border-radius:6px; display:inline-block;
}
@media(min-width:768px) { .cap-value { font-size:13px; padding:6px 12px; } }

/* ===== PORTFOLIO ===== */
.port-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:40px; }
@media(min-width:768px) { .port-grid { grid-template-columns:repeat(4,1fr); gap:20px; margin-bottom:48px; } }
.port-card {
    background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius);
    padding:20px; text-align:center; position:relative; overflow:hidden;
    transition:all 0.5s var(--ease);
}
.port-card::after {
    content:''; position:absolute; bottom:0; left:0; right:0; height:3px;
    background:linear-gradient(90deg, var(--cyan), var(--blue-mid));
    transform:scaleX(0); transition:transform 0.4s var(--ease);
}
.port-card:hover { box-shadow:0 12px 32px rgba(10,14,39,0.08); transform:translateY(-4px); }
.port-card:hover::after { transform:scaleX(1); }
@media(min-width:768px) { .port-card { padding:24px; } }
.port-tag {
    display:inline-block; font-family:var(--font-mono); font-size:10px; font-weight:600; color:var(--cyan);
    background:rgba(6,182,212,0.08); padding:3px 10px; border-radius:4px; margin-bottom:10px;
}
@media(min-width:768px) { .port-tag { font-size:11px; margin-bottom:12px; } }
.port-tag-min { color:var(--blue-mid); background:rgba(59,130,246,0.08); }
.port-tag-passive { color:var(--gray-400); background:var(--gray-100); }
.port-card h3 { font-family:var(--font-head); font-size:15px; font-weight:600; color:var(--text); margin-bottom:4px; }
@media(min-width:768px) { .port-card h3 { font-size:16px; margin-bottom:6px; } }
.port-loc { font-size:12px; color:var(--text-muted); }
@media(min-width:768px) { .port-loc { font-size:13px; } }

.port-meta { text-align:center; margin-top:24px; }
@media(min-width:768px) { .port-meta { margin-top:32px; } }
.criteria-chips { display:flex; flex-wrap:wrap; gap:6px; justify-content:center; margin-bottom:14px; }
@media(min-width:768px) { .criteria-chips { gap:8px; margin-bottom:16px; } }
.chip {
    font-size:11px; color:var(--text); background:var(--white); border:1px solid var(--gray-200);
    padding:4px 12px; border-radius:100px; transition:all 0.3s var(--ease);
}
@media(min-width:768px) { .chip { font-size:12px; padding:5px 14px; } }
.chip:hover { border-color:var(--cyan); color:var(--cyan); background:rgba(6,182,212,0.04); }
.port-sectors { font-size:11px; color:var(--text-muted); letter-spacing:1px; }
@media(min-width:768px) { .port-sectors { font-size:13px; } }
.sep { margin:0 4px; }

/* ===== MANAGING PARTNER ===== */
.partner-section { padding:60px 0; }
@media(min-width:768px) { .partner-section { padding:100px 0 120px; } }

.partner-intro { display:grid; grid-template-columns:1fr; gap:24px; margin-bottom:32px; align-items:center; }
@media(min-width:768px) { .partner-intro { grid-template-columns:220px 1fr; gap:36px; margin-bottom:40px; } }
@media(min-width:1024px) { .partner-intro { grid-template-columns:240px 1fr; gap:40px; } }
.partner-photo-main {
    width:100%; max-width:200px; aspect-ratio:3/4; border-radius:var(--radius); overflow:hidden;
    background:var(--primary); margin:0 auto; position:relative;
    box-shadow:0 12px 40px rgba(10,14,39,0.15);
    transition:all 0.5s var(--ease);
}
.partner-photo-main:hover { transform:translateY(-4px); box-shadow:0 20px 50px rgba(10,14,39,0.2); }
@media(min-width:768px) { .partner-photo-main { max-width:220px; } }
@media(min-width:1024px) { .partner-photo-main { max-width:240px; } }
.partner-photo-main img { width:100%; height:100%; object-fit:cover; }
.photo-fallback {
    width:100%; height:100%; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg, var(--primary), var(--blue));
}
.photo-initials { font-family:var(--font-head); font-size:40px; font-weight:700; color:rgba(255,255,255,0.3); }
@media(min-width:768px) { .photo-initials { font-size:48px; } }
.partner-headline {
    font-family:var(--font-head); font-size:clamp(17px,3vw,26px); font-weight:700;
    color:var(--text); line-height:1.3; margin-bottom:6px;
}
.partner-sub { font-size:14px; color:var(--text-light); margin-bottom:16px; }
@media(min-width:768px) { .partner-sub { font-size:15px; margin-bottom:20px; } }

/* Partner Metrics */
.partner-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
@media(min-width:768px) { .partner-metrics { gap:12px; } }
.metric-item {
    text-align:center; padding:10px 6px; background:var(--gray-50); border:1px solid var(--gray-200);
    border-radius:var(--radius-sm); transition:all 0.4s var(--ease); position:relative; overflow:hidden;
}
.metric-item::before {
    content:''; position:absolute; top:0; left:0; right:0; height:2px;
    background:linear-gradient(90deg, var(--cyan), var(--blue-mid));
    transform:scaleX(0); transition:transform 0.4s var(--ease);
}
.metric-item:hover { border-color:var(--cyan); transform:translateY(-2px); }
.metric-item:hover::before { transform:scaleX(1); }
@media(min-width:768px) { .metric-item { padding:12px 8px; } }
.metric-num { font-size:clamp(17px,3vw,24px); font-weight:700; color:var(--text); display:block; line-height:1.2; }
.metric-unit { font-size:13px; color:var(--cyan); }
@media(min-width:768px) { .metric-unit { font-size:14px; } }
.metric-label { font-size:10px; color:var(--text-muted); display:block; margin-top:2px; }
@media(min-width:768px) { .metric-label { font-size:11px; } }

/* Track Record — Compact Grid */
.track-grid { display:grid; grid-template-columns:1fr; gap:10px; margin-bottom:32px; }
@media(min-width:768px) { .track-grid { grid-template-columns:1fr 1fr; gap:12px; margin-bottom:40px; } }
.track-card {
    background:var(--gray-50); border:1px solid var(--gray-200); border-radius:var(--radius);
    padding:16px; border-left:3px solid var(--cyan); position:relative;
    transition:all 0.4s var(--ease);
}
.track-card:hover {
    transform:translateY(-3px); box-shadow:0 12px 28px rgba(10,14,39,0.06);
    border-left-color:var(--blue-mid);
}
@media(min-width:768px) { .track-card { padding:20px; } }
.track-card h4 { font-family:var(--font-head); font-size:14px; font-weight:600; color:var(--text); margin-bottom:2px; }
@media(min-width:768px) { .track-card h4 { font-size:15px; } }
.track-meta { font-size:10px; color:var(--text-muted); letter-spacing:1px; display:block; margin-bottom:6px; }
@media(min-width:768px) { .track-meta { font-size:11px; margin-bottom:8px; } }
.track-card p { font-size:12px; color:var(--text-light); line-height:1.5; }
@media(min-width:768px) { .track-card p { font-size:13px; } }

/* Education — Compact */
.edu-section { margin-bottom:32px; }
@media(min-width:768px) { .edu-section { margin-bottom:40px; } }
.edu-layout { display:grid; grid-template-columns:1fr; gap:20px; }
@media(min-width:768px) { .edu-layout { grid-template-columns:180px 1fr; gap:32px; } }
.edu-photo {
    width:100%; max-width:160px; aspect-ratio:3/4; border-radius:var(--radius); overflow:hidden;
    background:var(--primary); margin:0 auto;
    box-shadow:0 8px 24px rgba(10,14,39,0.12);
    transition:all 0.5s var(--ease);
}
.edu-photo:hover { transform:translateY(-3px); box-shadow:0 16px 40px rgba(10,14,39,0.18); }
@media(min-width:768px) { .edu-photo { max-width:180px; } }
.edu-photo img { width:100%; height:100%; object-fit:cover; }
.edu-group { margin-bottom:14px; }
@media(min-width:768px) { .edu-group { margin-bottom:16px; } }
.edu-group h4 {
    font-family:var(--font-head); font-size:11px; font-weight:600; color:var(--cyan);
    margin-bottom:4px; text-transform:uppercase; letter-spacing:1px;
}
@media(min-width:768px) { .edu-group h4 { font-size:12px; } }
.edu-group p { font-size:12px; color:var(--text-light); line-height:1.6; }
@media(min-width:768px) { .edu-group p { font-size:13px; } }

/* Partner Quote */
.partner-quote {
    background:linear-gradient(135deg, var(--primary), #111640);
    border-radius:var(--radius); padding:22px 24px; text-align:center;
    border-left:4px solid var(--cyan); position:relative; overflow:hidden;
    transition:all 0.5s var(--ease);
}
.partner-quote::before {
    content:''; position:absolute; top:-50%; right:-50%; width:200%; height:200%;
    background:radial-gradient(circle, rgba(6,182,212,0.04) 0%, transparent 50%);
    transition:opacity 0.5s var(--ease); opacity:0;
}
.partner-quote:hover { transform:scale(1.01); }
.partner-quote:hover::before { opacity:1; }
@media(min-width:768px) { .partner-quote { padding:24px 28px; } }
.partner-quote p { font-family:var(--font-head); font-size:clamp(14px,2vw,18px); font-weight:500; color:#fff; line-height:1.5; position:relative; z-index:1; }

/* ===== ÜBER UNS ===== */
.about-contrast { display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:32px; max-width:700px; margin-left:auto; margin-right:auto; }
@media(min-width:640px) { .about-contrast { grid-template-columns:1fr 1fr; gap:16px; margin-bottom:40px; } }
.about-not, .about-yes {
    padding:18px; border-radius:var(--radius); position:relative; overflow:hidden;
    transition:all 0.4s var(--ease);
}
.about-not:hover, .about-yes:hover { transform:translateY(-2px); }
@media(min-width:768px) { .about-not, .about-yes { padding:20px; } }
.about-not { background:rgba(239,68,68,0.06); border:1px solid rgba(239,68,68,0.12); }
.about-not:hover { border-color:rgba(239,68,68,0.25); }
.about-yes { background:rgba(6,182,212,0.06); border:1px solid rgba(6,182,212,0.12); }
.about-yes:hover { border-color:rgba(6,182,212,0.25); }
.about-not h4 { font-size:12px; font-weight:600; color:rgba(239,68,68,0.8); margin-bottom:8px; letter-spacing:0.5px; }
@media(min-width:768px) { .about-not h4 { font-size:13px; } }
.about-yes h4 { font-size:12px; font-weight:600; color:var(--cyan); margin-bottom:8px; letter-spacing:0.5px; }
@media(min-width:768px) { .about-yes h4 { font-size:13px; } }
.about-not p, .about-yes p { font-size:12px; color:rgba(255,255,255,0.65); line-height:1.7; }
@media(min-width:768px) { .about-not p, .about-yes p { font-size:13px; color:rgba(255,255,255,0.7); } }

.about-vision {
    text-align:center; padding:24px; position:relative; overflow:hidden;
    background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.06);
    border-radius:var(--radius); margin-top:32px; transition:all 0.5s var(--ease);
}
.about-vision::before {
    content:''; position:absolute; inset:-1px; border-radius:var(--radius); padding:1px;
    background:linear-gradient(135deg, rgba(6,182,212,0.2), transparent 40%, transparent 60%, rgba(59,130,246,0.15));
    -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude;
    opacity:0; transition:opacity 0.5s var(--ease);
}
.about-vision:hover { transform:translateY(-2px); }
.about-vision:hover::before { opacity:1; }
@media(min-width:768px) { .about-vision { padding:28px; margin-top:40px; } }
.about-vision > span { font-size:10px; color:var(--cyan); letter-spacing:2px; display:block; margin-bottom:8px; }
@media(min-width:768px) { .about-vision > span { font-size:11px; } }
.about-vision > p { font-size:16px; color:#fff; font-weight:500; margin-bottom:4px; }
@media(min-width:768px) { .about-vision > p { font-size:17px; } }
.about-vision-sectors { font-size:10px; color:rgba(255,255,255,0.25); letter-spacing:1px; }
@media(min-width:768px) { .about-vision-sectors { font-size:11px; color:rgba(255,255,255,0.3); } }

/* ===== KONTAKT ===== */
.contact-cards { display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:32px; }
@media(min-width:640px) { .contact-cards { grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:40px; } }
.contact-card-item {
    background:var(--white); border:1px solid var(--gray-200); border-radius:var(--radius);
    padding:22px; text-align:center; position:relative; overflow:hidden;
    transition:all 0.5s var(--ease);
}
.contact-card-item::after {
    content:''; position:absolute; bottom:0; left:0; right:0; height:3px;
    background:linear-gradient(90deg, var(--cyan), var(--blue-mid));
    transform:scaleX(0); transform-origin:center; transition:transform 0.5s var(--ease);
}
.contact-card-item:hover {
    box-shadow:0 16px 40px rgba(10,14,39,0.1); transform:translateY(-6px);
    border-color:rgba(6,182,212,0.3);
}
.contact-card-item:hover::after { transform:scaleX(1); }
@media(min-width:768px) { .contact-card-item { padding:24px; } }
.cc-icon {
    width:36px; height:36px; color:var(--cyan); margin:0 auto 10px;
    transition:all 0.5s var(--ease-spring);
}
.contact-card-item:hover .cc-icon { transform:scale(1.2) rotate(-5deg); }
@media(min-width:768px) { .cc-icon { width:40px; height:40px; margin:0 auto 12px; } }
.cc-icon svg { width:100%; height:100%; }
.contact-card-item h3 { font-family:var(--font-head); font-size:15px; font-weight:600; color:var(--text); margin-bottom:4px; }
@media(min-width:768px) { .contact-card-item h3 { font-size:16px; margin-bottom:6px; } }
.contact-card-item p { font-size:12px; color:var(--text-light); margin-bottom:12px; }
@media(min-width:768px) { .contact-card-item p { font-size:13px; margin-bottom:14px; } }

.contact-direct {
    background:linear-gradient(135deg, var(--primary), #111640);
    border-radius:var(--radius); padding:22px;
    display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between;
    border:1px solid rgba(6,182,212,0.08);
    transition:all 0.4s var(--ease);
}
.contact-direct:hover { border-color:rgba(6,182,212,0.2); box-shadow:var(--glow-cyan); }
@media(min-width:768px) { .contact-direct { padding:32px 40px; gap:20px; } }
.contact-company { font-family:var(--font-head); font-size:14px; font-weight:600; color:#fff; margin-bottom:6px; }
@media(min-width:768px) { .contact-company { font-size:15px; } }
.contact-info-block p { font-size:12px; color:rgba(255,255,255,0.65); line-height:1.7; }
@media(min-width:768px) { .contact-info-block p { font-size:13px; color:rgba(255,255,255,0.7); } }
.contact-info-block a { color:var(--cyan); transition:color var(--t); }
.contact-info-block a:hover { color:var(--cyan-light); }
.contact-conf { font-size:12px; color:rgba(255,255,255,0.35); font-style:italic; }
@media(min-width:768px) { .contact-conf { font-size:13px; color:rgba(255,255,255,0.4); } }

/* Social Links */
.contact-social { display:flex; flex-direction:column; gap:8px; margin-top:14px; }
@media(min-width:768px) { .contact-social { margin-top:16px; } }
.social-link {
    display:inline-flex; align-items:center; gap:8px; color:var(--cyan);
    font-size:12px; transition:all var(--t) var(--ease);
}
.social-link:hover { color:var(--cyan-light); transform:translateX(4px); }
@media(min-width:768px) { .social-link { font-size:13px; } }
.social-link svg { flex-shrink:0; transition:transform 0.3s var(--ease-spring); }
.social-link:hover svg { transform:scale(1.15); }

/* ===== FOOTER ===== */
.footer { background:var(--primary); border-top:1px solid rgba(255,255,255,0.06); padding:40px 0 24px; }
@media(min-width:768px) { .footer { padding:48px 0 28px; } }
.footer-inner { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-bottom:24px; }
@media(min-width:768px) { .footer-inner { grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; margin-bottom:32px; } }
.footer-logo-img {
    height:28px; width:auto; margin-bottom:10px; filter:brightness(0) invert(1); opacity:0.6;
    transition:opacity 0.3s var(--ease);
}
.footer-logo-img:hover { opacity:0.9; }
@media(min-width:768px) { .footer-logo-img { height:32px; margin-bottom:12px; opacity:0.7; } }
.footer-brand { grid-column:1/-1; }
@media(min-width:768px) { .footer-brand { grid-column:auto; } }
.footer-brand p { font-size:12px; color:rgba(255,255,255,0.4); line-height:1.6; }
@media(min-width:768px) { .footer-brand p { font-size:13px; color:rgba(255,255,255,0.5); } }
.footer-fn { font-size:10px; color:rgba(255,255,255,0.2); margin-top:6px; }
@media(min-width:768px) { .footer-fn { font-size:11px; color:rgba(255,255,255,0.25); margin-top:8px; } }
.footer-links, .footer-connect { display:flex; flex-direction:column; gap:6px; }
@media(min-width:768px) { .footer-links, .footer-connect { gap:8px; } }
.footer-links a, .footer-connect a, .footer-legal-links a {
    font-size:12px; color:rgba(255,255,255,0.4); transition:all var(--t) var(--ease);
}
@media(min-width:768px) { .footer-links a, .footer-connect a, .footer-legal-links a { font-size:13px; color:rgba(255,255,255,0.5); } }
.footer-links a:hover, .footer-connect a:hover, .footer-legal-links a:hover { color:#fff; transform:translateX(2px); }
.footer-legal-links { display:flex; flex-direction:column; gap:6px; }
@media(min-width:768px) { .footer-legal-links { gap:8px; } }
.footer-bottom {
    border-top:1px solid rgba(255,255,255,0.06); padding-top:16px; text-align:center;
}
@media(min-width:768px) { .footer-bottom { padding-top:20px; } }
.footer-bottom p { font-size:11px; color:rgba(255,255,255,0.2); }
@media(min-width:768px) { .footer-bottom p { font-size:12px; color:rgba(255,255,255,0.25); } }

/* ===== ANIMATIONS ===== */
[data-animate] {
    opacity:0; transform:translateY(28px);
    transition:opacity 0.8s var(--ease), transform 0.8s var(--ease);
}
[data-animate].visible { opacity:1; transform:translateY(0); }
/* Stagger delays */
.hero-modes [data-animate]:nth-child(2) { transition-delay:0.12s; }
.hero-modes [data-animate]:nth-child(3) { transition-delay:0.24s; }
.cap-grid [data-animate]:nth-child(2) { transition-delay:0.08s; }
.cap-grid [data-animate]:nth-child(3) { transition-delay:0.16s; }
.cap-grid [data-animate]:nth-child(4) { transition-delay:0.24s; }
.cap-grid [data-animate]:nth-child(5) { transition-delay:0.32s; }
.cap-grid [data-animate]:nth-child(6) { transition-delay:0.4s; }
.port-grid [data-animate]:nth-child(2) { transition-delay:0.08s; }
.port-grid [data-animate]:nth-child(3) { transition-delay:0.16s; }
.port-grid [data-animate]:nth-child(4) { transition-delay:0.24s; }

/* ===== MOBILE HERO POLISH ===== */
@media(max-width:639px) {
    .hero { padding:calc(var(--nav-h) + 16px) 0 60px; }
    .hero-badge { font-size:10px; letter-spacing:2px; padding:5px 14px; margin-bottom:18px; }
    .hero-h1 span { font-size:clamp(22px,6vw,32px); }
    .hero-sub { margin-bottom:24px; font-size:13px; }
    .hero-modes { gap:10px; margin-bottom:24px; }
    .hero-cta { width:100%; padding:14px 24px; font-size:15px; text-align:center; }
    /* Horizontal mode cards on mobile */
    .mode-card {
        display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto;
        gap:0 12px; padding:16px; align-items:center;
    }
    .mode-num { grid-row:1/3; font-size:18px; color:rgba(255,255,255,0.10); letter-spacing:0; margin-bottom:0; }
    .mode-title { margin-bottom:2px; font-size:15px; }
    .mode-sub { font-size:11px; }
}
@media(max-width:767px) {
    .nav-toggle { min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center; }
    .lang-toggle { min-height:36px; padding:6px 12px; }
    .btn-sm { min-height:44px; padding:12px 20px; }
    .mobile-link { padding:8px 0; min-height:44px; display:flex; align-items:center; justify-content:center; }
}

/* Smooth focus states */
:focus-visible {
    outline:2px solid var(--cyan); outline-offset:3px; border-radius:4px;
}

/* Selection */
::selection { background:rgba(6,182,212,0.2); color:var(--text); }

/* Print */
@media print {
    .nav,.mobile-menu,.hero-scroll,.hero-bg,.geo-shapes { display:none; }
    .hero { min-height:auto; padding:40px 20px; background:#0a0e27; }
    .section { padding:40px 0; }
    [data-animate] { opacity:1; transform:none; }
}