:root {
    /* Light Mode Variables */
    --bg-color: #ffffff;
    --text-color: #0d1b2e;
    --text-light: #3d4f68;
    --primary-color: #0044cc;
    --secondary-color: #002266;
    --accent-color: #2277ff;
    --section-bg: #e6eeff;
    --section-blue: #d5e6ff;
    --surface-strong: #ffffff;
    --surface-soft: #eef4ff;
    --card-bg: #ffffff;
    --border-color: #b2c8e8;
    --nav-bg: rgba(255, 255, 255, 0.96);
    --shadow: 0 14px 34px rgba(0, 34, 102, 0.15);
    --gradient-1: linear-gradient(135deg, #0044cc, #002266);
    --gradient-2: linear-gradient(135deg, #ffffff 0%, #ecf3ff 54%, #dce8ff 100%);
    --gradient-section: linear-gradient(180deg, #ffffff 0%, #e6eeff 100%);
    --success-color: #008a60;
    --warm-color: #d97706;
    --ice-blue: #d3e9ff;
    --soft-blue: #c4d8f7;
    --deep-blue: #002f8f;
    --cyan-blue: #0077aa;
    --steel-blue: #3d6898;
}

[data-theme="dark"] {
    /* Dark Mode Variables */
    --bg-color: #061225;
    --text-color: #f5f9ff;
    --text-light: #b7c7df;
    --primary-color: #66aaff;
    --secondary-color: #1f5ed7;
    --accent-color: #9cc9ff;
    --section-bg: #0b1b34;
    --section-blue: #0f2442;
    --surface-strong: #0d1f3b;
    --surface-soft: #09172c;
    --card-bg: #0f203b;
    --border-color: #224269;
    --nav-bg: rgba(6, 18, 37, 0.9);
    --shadow: 0 16px 38px rgba(0, 0, 0, 0.45);
    --gradient-1: linear-gradient(135deg, #2f8cff, #0044cc);
    --gradient-2: linear-gradient(135deg, #0b1b34 0%, #061225 58%, #020816 100%);
    --gradient-section: linear-gradient(180deg, #061225 0%, #0b1b34 100%);
    --success-color: #22c55e;
    --warm-color: #fbbf24;
    --ice-blue: #102743;
    --soft-blue: #12325c;
    --deep-blue: #8fbdff;
    --cyan-blue: #67e8f9;
    --steel-blue: #9bb6dc;
}

/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    background-color: var(--bg-color);
    color: var(--text-color);
    line-height: 1.6;
    transition: background-color 0.4s ease, color 0.4s ease;
    overflow-x: hidden;
}

body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(circle at 15% 12%, rgba(51, 136, 255, 0.12), transparent 28%),
        radial-gradient(circle at 85% 8%, rgba(0, 68, 204, 0.08), transparent 26%);
}

[data-theme="dark"] body::before {
    background:
        radial-gradient(circle at 15% 12%, rgba(102, 170, 255, 0.16), transparent 30%),
        radial-gradient(circle at 85% 8%, rgba(0, 68, 204, 0.16), transparent 28%);
}

a {
    text-decoration: none;
    color: var(--primary-color);
    transition: color 0.3s ease;
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.section-padding {
    padding: 100px 0;
    scroll-margin-top: 130px;
    position: relative;
}

.section-title {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 20px;
    text-align: center;
    background: var(--primary-color);
    background: linear-gradient(90deg, var(--primary-color), var(--accent-color));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    width: 100%;
}

.section-subtitle {
    text-align: center;
    color: var(--text-light);
    max-width: 700px;
    margin: 0 auto 50px auto;
    font-size: 1.1rem;
}

.align-left {
    text-align: left;
    margin-left: 0;
}

.section-title.align-left {
    width: auto;
}

.section-kicker {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--primary-color);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

/* Navigation */
header {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: min(94%, 1240px);
    max-width: 1240px;
    background: var(--nav-bg);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid var(--border-color);
    border-radius: 18px;
    z-index: 1000;
    box-shadow: var(--shadow);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.nav-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 70px;
    padding: 0 22px;
}

.brand-mini,
.logo-container {
    display: flex;
    align-items: center;
}

.brand-mini {
    justify-content: flex-start;
    min-width: 270px;
    color: var(--text-color);
    font-weight: 800;
    letter-spacing: 0;
}

.brand-mini span {
    display: inline-block;
    padding-left: 14px;
    border-left: 4px solid var(--primary-color);
    line-height: 1.05;
    position: relative;
    box-sizing: content-box;
    width: 27ch;
    max-width: 27ch;
    overflow: hidden;
    white-space: nowrap;
    font-family: 'Courier New', Consolas, monospace;
    animation: brand-terminal-type 16s steps(27, end) infinite;
}

.brand-mini span::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0.08em;
    width: 2px;
    height: 1em;
    background: var(--primary-color);
    animation: brand-cursor-blink 0.8s steps(1, end) infinite;
}

.logo-img {
    display: none;
}

.nav-links {
    display: flex;
    gap: 6px;
    align-items: center;
    background: transparent;
    padding: 0;
    border-radius: 0;
}

.nav-links li a {
    color: var(--text-color);
    font-weight: 600;
    font-size: 0.86rem;
    padding: 10px 11px;
    border-radius: 8px;
    position: relative;
    transition: all 0.3s ease;
    display: block;
}

.mobile-menu-toggle {
    display: none;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-color);
    border-radius: 50%;
    background: var(--section-bg);
    color: var(--text-color);
    cursor: pointer;
}

.nav-links li a:hover {
    color: var(--primary-color);
    background: rgba(0, 68, 204, 0.05);
}

.nav-links li a.active {
    background: rgba(0, 68, 204, 0.08);
    color: var(--primary-color);
    box-shadow: none;
}

.theme-toggle {
    background: none;
    border: none;
    color: var(--text-color);
    font-size: 1.2rem;
    cursor: pointer;
    transition: color 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--section-bg);
}

.theme-toggle:hover {
    color: var(--primary-color);
}

/* Hero Section */
.hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    padding-top: 120px;
    background: var(--gradient-2);
    overflow: hidden;
}

.hero::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 800px;
    height: 800px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 68, 204, 0.1) 0%, rgba(0, 0, 0, 0) 70%);
    z-index: 0;
}

.hero-content {
    position: relative;
    z-index: 1;
    max-width: 920px;
    animation: fadeInUp 1s ease-out;
}

.hero-tagline {
    font-weight: 600;
    color: var(--primary-color);
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 15px;
    display: block;
}

.hero-main-title {
    position: relative;
    margin-bottom: 25px;
    display: block;
}

.hero-logo {
    position: static;
    transform: none;
    height: 120px;
    width: auto;
    object-fit: contain;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.1));
    cursor: pointer;
}

.hero-logo:hover {
    transform: scale(1.05);
}

.hero-title {
    font-size: 3.65rem;
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 0;
}

.hero-title span {
    color: var(--primary-color);
}

.hero-desc {
    font-size: 1.2rem;
    color: var(--text-light);
    margin-bottom: 40px;
    max-width: 760px;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.hero-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 34px;
    max-width: 920px;
}

.hero-metrics div {
    background: color-mix(in srgb, var(--card-bg) 86%, transparent);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 18px;
    backdrop-filter: blur(10px);
    box-shadow: 0 8px 22px rgba(0, 34, 102, 0.06);
}

[data-theme="dark"] .hero-metrics div {
    background: color-mix(in srgb, var(--card-bg) 80%, transparent);
}

.hero-metrics strong {
    display: block;
    color: var(--primary-color);
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 1;
    margin-bottom: 8px;
}

.hero-metrics span {
    color: var(--text-light);
    font-size: 0.94rem;
    font-weight: 500;
}

.btn {
    display: inline-block;
    padding: 15px 35px;
    border-radius: 30px;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
}

.btn-primary {
    background: var(--gradient-1);
    color: #ffffff !important;
    border: none;
    box-shadow: 0 5px 15px rgba(0, 68, 204, 0.3);
}

.btn-primary:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 68, 204, 0.4);
}

.btn-secondary {
    background: transparent;
    color: var(--text-color) !important;
    border: 2px solid var(--border-color);
    margin-left: 15px;
}

.btn-secondary:hover {
    border-color: var(--primary-color);
    color: var(--primary-color) !important;
}

.section-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 auto 40px;
    padding: 10px;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: var(--surface-soft);
    max-width: 760px;
}

.section-menu a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 18px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--card-bg);
    color: var(--text-color);
    font-weight: 700;
    box-shadow: none;
}

.section-menu a:hover {
    color: #ffffff;
    border-color: transparent;
    background: var(--gradient-1);
    transform: translateY(-2px);
}

.section-menu.compact {
    justify-content: flex-start;
    margin: 10px 0 30px;
    padding: 8px;
    max-width: none;
}

/* Portfolio / Services Executive Summary */
.portfolio {
    background:
        radial-gradient(circle at 8% 18%, rgba(51, 136, 255, 0.09), transparent 28%),
        linear-gradient(180deg, var(--surface-strong), #eef5ff);
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

[data-theme="dark"] .portfolio {
    background:
        radial-gradient(circle at 8% 18%, rgba(102, 170, 255, 0.14), transparent 30%),
        linear-gradient(180deg, #08172b, var(--section-bg));
}

.portfolio .section-title {
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: #111827;
    color: #111827;
}

[data-theme="dark"] .portfolio .section-title {
    background: linear-gradient(90deg, #7de7ff, #c8f7ff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 22px;
    margin-top: 40px;
}

.card {
    background-color: var(--card-bg);
    border-radius: 8px;
    padding: 30px 26px;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    position: relative;
    overflow: hidden;
}

.card,
.division-card,
.capability-card,
.detail-item,
.process-step,
.mv-box {
    backdrop-filter: blur(10px);
}

.service-grid .card:nth-child(2) .card-icon {
    color: var(--success-color);
}

.service-grid .card:nth-child(4) .card-icon {
    color: var(--warm-color);
}

.division-menu-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-top: 44px;
}

.division-card {
    display: grid;
    gap: 14px;
    min-height: 320px;
    padding: 34px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: linear-gradient(145deg, #ffffff 0%, #e8fbff 100%);
    color: var(--text-color);
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden;
}

.division-menu-grid .division-card:nth-child(2) {
    background: linear-gradient(145deg, #ffffff 0%, #e8fff5 56%, #edfaff 100%);
}

[data-theme="dark"] .division-card {
    background: linear-gradient(145deg, #0f2840 0%, #071a2d 100%);
    border-color: rgba(103, 232, 249, 0.24);
}

[data-theme="dark"] .division-menu-grid .division-card:nth-child(2) {
    background: linear-gradient(145deg, #0d2f2c 0%, #08243a 100%);
    border-color: rgba(74, 222, 128, 0.26);
}

.division-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0, 68, 204, 0.12), transparent 46%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.division-card:hover {
    transform: translateY(-5px);
    color: var(--text-color);
}

.division-card:hover::before {
    opacity: 1;
}

.division-card > * {
    position: relative;
    z-index: 1;
}

.division-icon {
    display: inline-flex;
    width: 58px;
    height: 58px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #dff8ff;
    color: #006d93;
    font-size: 1.8rem;
}

.division-icon.accent {
    background: linear-gradient(135deg, #dcfce7, #dff8ff);
    color: #047857;
}

[data-theme="dark"] .division-icon {
    background: rgba(103, 232, 249, 0.16);
    color: var(--cyan-blue);
}

[data-theme="dark"] .division-icon.accent {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.2), rgba(103, 232, 249, 0.14));
    color: #86efac;
}

.division-label {
    color: #007aa3;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 1.3px;
    text-transform: uppercase;
}

.division-menu-grid .division-card:nth-child(2) .division-label,
.division-menu-grid .division-card:nth-child(2) .division-link {
    color: #047857;
}

[data-theme="dark"] .division-label,
[data-theme="dark"] .division-link {
    color: var(--cyan-blue);
}

[data-theme="dark"] .division-menu-grid .division-card:nth-child(2) .division-label,
[data-theme="dark"] .division-menu-grid .division-card:nth-child(2) .division-link {
    color: #86efac;
}

.division-card strong {
    font-size: 1.8rem;
    line-height: 1.15;
    color: #006d93;
}

.division-menu-grid .division-card:nth-child(2) strong {
    color: #047857;
}

[data-theme="dark"] .division-card strong {
    color: #d8fbff;
}

[data-theme="dark"] .division-menu-grid .division-card:nth-child(2) strong {
    color: #dcfce7;
}

.division-card p {
    color: var(--text-light);
}

.division-link {
    align-self: end;
    color: var(--primary-color);
    font-weight: 800;
}

.card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--gradient-1);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s ease;
}

.card:hover {
    transform: translateY(-5px);
}

.card:hover::before {
    transform: scaleX(1);
}

.card-icon {
    font-size: 3rem;
    color: var(--primary-color);
    margin-bottom: 20px;
}

.card-title {
    font-size: 1.5rem;
    margin-bottom: 15px;
    font-weight: 700;
}

.card-desc {
    color: var(--text-light);
    margin-bottom: 20px;
}

.card-link {
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.card-link:hover {
    gap: 10px;
}

/* Engineering Section */
.engineering {
    background: linear-gradient(180deg, var(--section-blue), var(--section-bg));
}

.split-section {
    display: flex;
    align-items: center;
    gap: 60px;
}

.split-content {
    flex: 1;
}

.split-image {
    flex: 1;
    position: relative;
}

.image-wrapper {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow);
}

.image-wrapper img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.7s ease;
}

.image-wrapper:hover img {
    transform: scale(1.05);
}

.overlay-stats {
    position: absolute;
    bottom: -30px;
    left: -30px;
    background: var(--card-bg);
    padding: 30px;
    border-radius: 15px;
    box-shadow: var(--shadow);
    display: flex;
    gap: 30px;
    border: 1px solid var(--border-color);
}

.stat-item h4 {
    font-size: 2rem;
    color: var(--primary-color);
    line-height: 1;
}

.stat-item p {
    font-size: 0.9rem;
    color: var(--text-light);
    font-weight: 500;
}

.feature-list {
    margin-top: 30px;
}

.feature-list li {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 20px;
}

.feature-icon {
    color: var(--accent-color);
    font-size: 1.5rem;
    margin-top: 2px;
}

.expanded-list li {
    padding: 18px 0;
    border-bottom: 1px solid var(--border-color);
    scroll-margin-top: 140px;
}

.expanded-list li:first-child {
    border-top: 1px solid var(--border-color);
}

.expanded-list span {
    display: block;
    color: var(--text-light);
    margin-top: 4px;
}

.detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin-top: 54px;
}

.detail-item {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 24px;
    box-shadow: var(--shadow);
}

.detail-item h3 {
    margin-bottom: 10px;
    color: var(--text-color);
}

.detail-item p {
    color: var(--text-light);
}

.engineering .detail-item {
    background: linear-gradient(145deg, #ffffff 0%, #edfaff 100%);
    border-color: rgba(0, 122, 163, 0.18);
}

.engineering .detail-item:nth-child(2) {
    background: linear-gradient(145deg, #ffffff 0%, #e8fbff 100%);
}

.engineering .detail-item:nth-child(3) {
    background: linear-gradient(145deg, #ffffff 0%, #eaf4ff 100%);
}

.informatics .detail-item {
    background: linear-gradient(145deg, #ffffff 0%, #e8fff5 100%);
    border-color: rgba(4, 120, 87, 0.18);
}

.informatics .detail-item:nth-child(2) {
    background: linear-gradient(145deg, #ffffff 0%, #ecfeff 100%);
}

.informatics .detail-item:nth-child(3) {
    background: linear-gradient(145deg, #ffffff 0%, #e6f7ff 100%);
}

.engineering .detail-item h3 {
    color: #006d93;
}

.informatics .detail-item h3 {
    color: #047857;
}

.informatics .detail-item:nth-child(2) h3 {
    color: #007aa3;
}

.informatics .detail-item:nth-child(3) h3 {
    color: #1f5ed7;
}

[data-theme="dark"] .engineering .detail-item {
    background: linear-gradient(145deg, #0f2840 0%, #071a2d 100%);
    border-color: rgba(103, 232, 249, 0.2);
}

[data-theme="dark"] .informatics .detail-item {
    background: linear-gradient(145deg, #0d2f2c 0%, #08243a 100%);
    border-color: rgba(74, 222, 128, 0.22);
}

[data-theme="dark"] .engineering .detail-item h3 {
    color: #d8fbff;
}

[data-theme="dark"] .informatics .detail-item h3 {
    color: #dcfce7;
}

[data-theme="dark"] .informatics .detail-item:nth-child(2) h3 {
    color: var(--cyan-blue);
}

[data-theme="dark"] .informatics .detail-item:nth-child(3) h3 {
    color: #9cc9ff;
}

/* Informatics Section */
.informatics {
    background: linear-gradient(180deg, var(--surface-strong), var(--surface-soft));
}

.informatics .split-section {
    flex-direction: row-reverse;
}

.informatics .overlay-stats {
    left: auto;
    right: -30px;
}

.tech-stack {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 30px;
}

.tech-badge {
    background: var(--section-bg);
    border: 1px solid var(--border-color);
    padding: 8px 15px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-color);
    transition: all 0.3s ease;
}

.tech-badge:hover {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}

.informatics .tech-badge {
    background: linear-gradient(135deg, #e8fff5, #edfaff);
    border-color: rgba(4, 120, 87, 0.2);
    color: #047857;
    font-weight: 750;
}

.informatics .tech-badge:nth-child(3n + 2) {
    background: linear-gradient(135deg, #ecfeff, #e8fff5);
    color: #007aa3;
}

.informatics .tech-badge:nth-child(3n) {
    background: linear-gradient(135deg, #e6f7ff, #dcfce7);
    color: #1f5ed7;
}

[data-theme="dark"] .informatics .tech-badge {
    background: rgba(74, 222, 128, 0.1);
    border-color: rgba(74, 222, 128, 0.22);
    color: #86efac;
}

[data-theme="dark"] .informatics .tech-badge:nth-child(3n + 2) {
    background: rgba(103, 232, 249, 0.1);
    color: var(--cyan-blue);
}

[data-theme="dark"] .informatics .tech-badge:nth-child(3n) {
    background: rgba(102, 170, 255, 0.1);
    color: #9cc9ff;
}

/* Independent Division Pages */
.division-hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 140px 0 90px;
    position: relative;
    overflow: hidden;
    background: #02040a;
}

.division-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px);
    background-size: 82px 82px;
    mask-image: radial-gradient(circle at 72% 50%, black, transparent 68%);
    pointer-events: none;
}

.engineering-hero::before,
.tech-hero::before {
    background:
        radial-gradient(circle at 82% 42%, rgba(255, 255, 255, 0.08), transparent 34%),
        linear-gradient(90deg, rgba(2, 4, 10, 0.92), rgba(2, 4, 10, 0.62), transparent);
    background-size: auto;
    mask-image: none;
}

[data-theme="dark"] .division-hero::before {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px);
}

[data-theme="dark"] .engineering-hero::before,
[data-theme="dark"] .tech-hero::before {
    background:
        radial-gradient(circle at 82% 42%, rgba(255, 255, 255, 0.08), transparent 34%),
        linear-gradient(90deg, rgba(2, 4, 10, 0.92), rgba(2, 4, 10, 0.62), transparent);
}

.engineering-hero::after,
.tech-hero::after {
    content: '';
    position: absolute;
    width: 520px;
    height: 520px;
    right: -170px;
    top: 12%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.1), transparent 68%);
    pointer-events: none;
}

.tech-hero::after {
    background: radial-gradient(circle, rgba(51, 136, 255, 0.12), transparent 68%);
}

.division-hero::after {
    z-index: 0;
}

.division-hero-copy {
    position: relative;
    padding: 30px 0;
}

.division-hero-copy::before {
    content: '';
    position: absolute;
    inset: -24px -32px;
    z-index: -1;
    border-radius: 12px;
    background: linear-gradient(90deg, rgba(2, 4, 10, 0.88), rgba(2, 4, 10, 0.48), transparent);
}

.division-hero-copy h1,
.division-hero-copy p,
.division-hero .section-kicker {
    color: #ffffff;
}

.division-hero-copy p {
    color: rgba(255, 255, 255, 0.82);
}

.division-hero .btn-secondary {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.34);
    background: rgba(255, 255, 255, 0.04);
}

.division-hero .btn-secondary:hover {
    border-color: #ffffff;
    color: #ffffff !important;
}

.division-animated-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.division-animated-bg > * {
    position: absolute;
}

.blueprint-grid-layer,
.circuit-grid-layer {
    inset: 0;
    opacity: 0.46;
    background-image:
        linear-gradient(rgba(0, 68, 204, 0.13) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 68, 204, 0.13) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(90deg, transparent, black 18%, black 82%, transparent);
    animation: division-grid-drift 36s linear infinite;
}

[data-theme="dark"] .blueprint-grid-layer,
[data-theme="dark"] .circuit-grid-layer {
    opacity: 0.38;
    background-image:
        linear-gradient(rgba(102, 170, 255, 0.2) 1px, transparent 1px),
        linear-gradient(90deg, rgba(102, 170, 255, 0.2) 1px, transparent 1px);
}

.blueprint-drawing-layer,
.data-network-layer {
    inset: 0;
}

.beam,
.measure-line,
.data-path {
    position: absolute;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(0, 68, 204, 0.62), transparent);
    transform-origin: left center;
    --line-rotate: 0deg;
    animation: technical-line-sweep 7s ease-in-out infinite;
}

[data-theme="dark"] .beam,
[data-theme="dark"] .measure-line,
[data-theme="dark"] .data-path {
    background: linear-gradient(90deg, transparent, rgba(156, 201, 255, 0.72), transparent);
}

.beam-a {
    width: 34%;
    top: 34%;
    left: 8%;
}

.beam-b {
    width: 26%;
    top: 56%;
    left: 58%;
    --line-rotate: 90deg;
    animation-delay: 1.2s;
}

.beam-c {
    width: 42%;
    top: 72%;
    left: 18%;
    animation-delay: 2.4s;
}

.measure-a {
    width: 18%;
    top: 22%;
    left: 60%;
    opacity: 0.72;
    animation-delay: 0.8s;
}

.measure-b {
    width: 20%;
    top: 82%;
    left: 66%;
    opacity: 0.68;
    animation-delay: 2s;
}

.column-dot,
.data-node {
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary-color);
    box-shadow: 0 0 0 7px rgba(0, 68, 204, 0.12), 0 0 22px rgba(0, 68, 204, 0.28);
    animation: technical-node-pulse 3.8s ease-in-out infinite;
}

[data-theme="dark"] .column-dot,
[data-theme="dark"] .data-node {
    background: var(--accent-color);
    box-shadow: 0 0 0 7px rgba(102, 170, 255, 0.12), 0 0 22px rgba(102, 170, 255, 0.36);
}

.dot-a { top: 32%; left: 24%; }
.dot-b { top: 54%; left: 64%; animation-delay: 1s; }
.dot-c { top: 70%; left: 38%; animation-delay: 2s; }

.survey-scan {
    top: 0;
    bottom: 0;
    left: -20%;
    width: 18%;
    background: linear-gradient(90deg, transparent, rgba(0, 68, 204, 0.12), transparent);
    transform: skewX(-12deg);
    animation: division-scan 8s linear infinite;
}

[data-theme="dark"] .survey-scan {
    background: linear-gradient(90deg, transparent, rgba(156, 201, 255, 0.16), transparent);
}

.circuit-grid-layer {
    background-size: 56px 56px;
    opacity: 0.42;
}

.data-node {
    width: 12px;
    height: 12px;
    background: var(--success-color);
}

.node-a { top: 26%; left: 58%; }
.node-b { top: 38%; left: 82%; animation-delay: 0.8s; }
.node-c { top: 68%; left: 62%; animation-delay: 1.6s; }
.node-d { top: 78%; left: 86%; animation-delay: 2.4s; }

.path-a {
    width: 24%;
    top: 30%;
    left: 60%;
    --line-rotate: 14deg;
}

.path-b {
    width: 22%;
    top: 54%;
    left: 68%;
    --line-rotate: 104deg;
    animation-delay: 1.1s;
}

.path-c {
    width: 26%;
    top: 74%;
    left: 61%;
    --line-rotate: 8deg;
    animation-delay: 2.2s;
}

.code-rain {
    top: 18%;
    right: 7%;
    display: grid;
    gap: 22px;
    color: rgba(0, 68, 204, 0.26);
    font-family: 'Courier New', monospace;
    font-weight: 800;
    letter-spacing: 2px;
}

.code-rain span {
    animation: code-float 6s ease-in-out infinite;
}

.code-rain span:nth-child(2) { animation-delay: 1s; }
.code-rain span:nth-child(3) { animation-delay: 2s; }
.code-rain span:nth-child(4) { animation-delay: 3s; }

[data-theme="dark"] .code-rain {
    color: rgba(156, 201, 255, 0.28);
}

@keyframes division-grid-drift {
    from { background-position: 0 0; }
    to { background-position: 96px 96px; }
}

@keyframes technical-line-sweep {
    0%, 100% { opacity: 0.1; transform: rotate(var(--line-rotate)) scaleX(0.22); }
    45%, 65% { opacity: 0.75; transform: rotate(var(--line-rotate)) scaleX(1); }
}

@keyframes technical-node-pulse {
    0%, 100% { transform: scale(0.86); opacity: 0.55; }
    50% { transform: scale(1.18); opacity: 1; }
}

@keyframes division-scan {
    from { left: -24%; }
    to { left: 115%; }
}

@keyframes code-float {
    0%, 100% { opacity: 0.18; transform: translateY(0); }
    50% { opacity: 0.55; transform: translateY(12px); }
}

/* Literal animated hero scenes requested for division pages */
.engineering-animated-bg,
.tech-animated-bg {
    background: #02040a;
}

.engineering-animated-bg::after,
.tech-animated-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(2, 4, 10, 0.94) 0%, rgba(2, 4, 10, 0.72) 38%, rgba(2, 4, 10, 0.2) 100%),
        linear-gradient(180deg, transparent 0%, #02040a 100%);
    z-index: 2;
}

.city-skyline,
.automation-scene {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.city-skyline {
    opacity: 0.72;
}

.city-building {
    position: absolute;
    bottom: 8%;
    width: 76px;
    border: 2px solid rgba(255, 255, 255, 0.72);
    border-bottom: 0;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.015));
}

.city-building i {
    display: block;
    width: 10px;
    height: 8px;
    margin: 13px auto 0;
    box-shadow:
        18px 0 rgba(255, 255, 255, 0.62),
        -18px 0 rgba(255, 255, 255, 0.62);
    background: rgba(255, 255, 255, 0.62);
    animation: window-flicker 5s ease-in-out infinite;
}

.city-building.finished {
    border-color: rgba(255, 255, 255, 0.82);
}

.city-building.construction {
    border-style: dashed;
}

.city-building.construction::before {
    content: '';
    position: absolute;
    left: -8px;
    right: -8px;
    top: 34%;
    height: 2px;
    background: rgba(255, 255, 255, 0.62);
    box-shadow: 0 42px rgba(255, 255, 255, 0.4);
}

.tower-a { right: 42%; height: 230px; }
.tower-b { right: 28%; height: 310px; width: 88px; }
.tower-c { right: 13%; height: 190px; }
.tower-d { right: 51%; height: 160px; width: 70px; }
.tower-e { right: 5%; height: 135px; width: 62px; }

.crane {
    position: absolute;
    bottom: 36%;
    width: 260px;
    height: 150px;
    border-left: 3px solid rgba(255, 255, 255, 0.72);
    transform-origin: left bottom;
    animation: crane-sway 8s ease-in-out infinite;
}

.crane i:nth-child(1) {
    position: absolute;
    left: 0;
    top: 0;
    width: 230px;
    height: 3px;
    background: rgba(255, 255, 255, 0.72);
}

.crane i:nth-child(2) {
    position: absolute;
    left: 35px;
    top: 0;
    width: 3px;
    height: 132px;
    background: rgba(255, 255, 255, 0.42);
}

.crane i:nth-child(3) {
    position: absolute;
    right: 20px;
    top: 0;
    width: 2px;
    height: 56px;
    background: rgba(255, 255, 255, 0.62);
}

.crane-main {
    right: 8%;
}

.crane-secondary {
    right: 46%;
    bottom: 26%;
    transform: scale(0.72);
    opacity: 0.68;
    animation-delay: 1.8s;
}

.worker {
    position: absolute;
    bottom: 7.5%;
    width: 12px;
    height: 24px;
    border-radius: 999px 999px 4px 4px;
    background: rgba(255, 255, 255, 0.84);
    animation: worker-move 7s ease-in-out infinite;
}

.worker::before {
    content: '';
    position: absolute;
    left: 2px;
    top: -8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.9);
}

.worker i {
    position: absolute;
    left: -9px;
    top: 7px;
    width: 30px;
    height: 2px;
    background: rgba(255, 255, 255, 0.62);
    transform: rotate(-18deg);
    animation: tool-swing 2.4s ease-in-out infinite;
}

.worker-a { right: 58%; }
.worker-b { right: 35%; animation-delay: 1.4s; }
.worker-c { right: 17%; animation-delay: 2.8s; }

.work-spark {
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 0 16px #ffffff;
    animation: spark-pop 2.2s ease-in-out infinite;
}

.spark-a { right: 53%; bottom: 25%; }
.spark-b { right: 21%; bottom: 18%; animation-delay: 0.8s; }
.spark-c { right: 8%; bottom: 31%; animation-delay: 1.5s; }

.automation-scene {
    opacity: 0.86;
}

.workflow-lane {
    position: absolute;
    right: 5%;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid rgba(102, 170, 255, 0.28);
    border-radius: 12px;
    background: rgba(3, 9, 20, 0.68);
    box-shadow: 0 0 34px rgba(51, 136, 255, 0.08);
}

.lane-a { top: 22%; }
.lane-b { top: 56%; right: 12%; animation-delay: 1s; }

.flow-node {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid currentColor;
    background: rgba(255, 255, 255, 0.05);
    color: #9cc9ff;
    box-shadow: 0 0 18px currentColor;
    animation: node-status 4s ease-in-out infinite;
}

.flow-node.start { color: #ffffff; }
.flow-node.process { color: #66aaff; animation-delay: 0.7s; }
.flow-node.secure { color: #22c55e; animation-delay: 1.4s; }
.flow-node.warning { color: #f59e0b; animation-delay: 1s; }
.flow-node.done { color: #22c55e; animation-delay: 1.8s; }

.flow-connector {
    width: 74px;
    height: 2px;
    background: linear-gradient(90deg, rgba(102, 170, 255, 0.18), rgba(102, 170, 255, 0.9), rgba(102, 170, 255, 0.18));
    animation: connector-flow 2.8s linear infinite;
}

.floating-terminal {
    position: absolute;
    right: 11%;
    width: 320px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.74);
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.45);
}

.terminal-a { bottom: 12%; }
.terminal-b { top: 13%; right: 35%; width: 250px; opacity: 0.7; }

.floating-terminal code {
    display: block;
    margin-bottom: 8px;
    color: #22c55e;
    font-size: 0.84rem;
    white-space: nowrap;
    animation: terminal-line 5s ease-in-out infinite;
}

.floating-terminal code:nth-child(2) {
    color: #66aaff;
    animation-delay: 0.8s;
}

.floating-terminal code:nth-child(3) {
    color: #ffffff;
    animation-delay: 1.6s;
}

.security-shield,
.security-lock {
    position: absolute;
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    border: 1px solid currentColor;
    background: rgba(0, 0, 0, 0.62);
    color: #22c55e;
    font-size: 1.45rem;
    box-shadow: 0 0 26px rgba(34, 197, 94, 0.22);
    animation: security-float 5s ease-in-out infinite;
}

.security-shield { right: 42%; top: 42%; }
.security-lock { right: 4%; top: 44%; color: #f04444; animation-delay: 1.3s; }

.security-pulse {
    position: absolute;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    border: 1px solid rgba(102, 170, 255, 0.18);
    animation: security-ring 4.5s ease-out infinite;
}

.pulse-a { right: 38%; top: 35%; }
.pulse-b { right: 0; top: 36%; border-color: rgba(240, 68, 68, 0.2); animation-delay: 1.6s; }

@keyframes window-flicker {
    0%, 100% { opacity: 0.38; }
    50% { opacity: 0.82; }
}

@keyframes crane-sway {
    0%, 100% { transform: rotate(-1deg); }
    50% { transform: rotate(1.5deg); }
}

@keyframes worker-move {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(18px); }
}

@keyframes tool-swing {
    0%, 100% { transform: rotate(-18deg); }
    50% { transform: rotate(18deg); }
}

@keyframes spark-pop {
    0%, 100% { opacity: 0; transform: scale(0.4); }
    35%, 55% { opacity: 1; transform: scale(1.4); }
}

@keyframes node-status {
    0%, 100% { opacity: 0.45; transform: scale(0.94); }
    50% { opacity: 1; transform: scale(1.04); }
}

@keyframes connector-flow {
    from { filter: brightness(0.7); transform: scaleX(0.72); }
    to { filter: brightness(1.35); transform: scaleX(1); }
}

@keyframes terminal-line {
    0%, 100% { opacity: 0.42; transform: translateX(-4px); }
    45%, 70% { opacity: 1; transform: translateX(0); }
}

@keyframes security-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

@keyframes security-ring {
    0% { opacity: 0.5; transform: scale(0.35); }
    100% { opacity: 0; transform: scale(1.25); }
}

.division-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(420px, 1fr);
    gap: 62px;
    align-items: center;
}

.division-hero-copy h1 {
    font-size: 4rem;
    line-height: 1.05;
    margin-bottom: 24px;
    color: var(--text-color);
}

.division-hero-copy p {
    max-width: 690px;
    margin-bottom: 34px;
    color: var(--text-light);
    font-size: 1.16rem;
}

.division-visual {
    position: relative;
}

.division-blueprint {
    height: 460px;
}

.capability-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.capability-card {
    display: flex;
    flex-direction: column;
    min-height: 420px;
    padding: 28px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--card-bg);
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden;
}

.capability-card::after {
    content: '';
    position: absolute;
    inset: 0;
    border-top: 4px solid var(--primary-color);
    opacity: 0.75;
    pointer-events: none;
}

.capability-card > i {
    width: 50px;
    height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border-radius: 8px;
    background: rgba(0, 68, 204, 0.1);
    color: var(--primary-color);
    font-size: 1.45rem;
}

.tech-hero ~ .section-padding .capability-card > i,
.informatics .capability-card > i {
    background: rgba(0, 166, 118, 0.12);
    color: var(--success-color);
}

.capability-card h3 {
    font-size: 1.2rem;
    line-height: 1.25;
    margin-bottom: 12px;
}

.capability-card p {
    color: var(--text-light);
    margin-bottom: 18px;
}

.capability-card ul {
    margin-top: auto;
    padding-top: 18px;
    border-top: 1px solid var(--border-color);
}

.capability-card li {
    position: relative;
    padding-left: 18px;
    margin-bottom: 10px;
    color: var(--text-light);
    font-size: 0.94rem;
}

.capability-card li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.67em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--primary-color);
}

#servicios-ingenieria {
    background:
        radial-gradient(circle at 12% 14%, rgba(103, 232, 249, 0.14), transparent 30%),
        linear-gradient(180deg, #f6fdff 0%, #eaf8ff 100%);
}

#servicios-informatica {
    background:
        radial-gradient(circle at 85% 12%, rgba(74, 222, 128, 0.12), transparent 30%),
        linear-gradient(180deg, #f5fff9 0%, #eafaff 100%);
}

[data-theme="dark"] #servicios-ingenieria {
    background:
        radial-gradient(circle at 12% 14%, rgba(103, 232, 249, 0.16), transparent 32%),
        linear-gradient(180deg, #071a2d 0%, #061426 100%);
}

[data-theme="dark"] #servicios-informatica {
    background:
        radial-gradient(circle at 85% 12%, rgba(74, 222, 128, 0.16), transparent 32%),
        linear-gradient(180deg, #071d22 0%, #061827 100%);
}

#servicios-ingenieria .section-title {
    background: linear-gradient(90deg, #007aa3, #38d5ff, #8eeaff);
    -webkit-background-clip: text;
    background-clip: text;
}

#servicios-informatica .section-title {
    background: linear-gradient(90deg, #047857, #22c55e, #67e8f9);
    -webkit-background-clip: text;
    background-clip: text;
}

[data-theme="dark"] #servicios-ingenieria .section-title {
    background: linear-gradient(90deg, #d8fbff, #67e8f9, #9cc9ff);
    -webkit-background-clip: text;
    background-clip: text;
}

[data-theme="dark"] #servicios-informatica .section-title {
    background: linear-gradient(90deg, #dcfce7, #86efac, #67e8f9);
    -webkit-background-clip: text;
    background-clip: text;
}

#servicios-ingenieria .capability-card {
    background: linear-gradient(145deg, #ffffff 0%, #e8fbff 100%);
    border-color: rgba(0, 122, 163, 0.2);
}

#servicios-ingenieria .capability-card:nth-child(2) {
    background: linear-gradient(145deg, #ffffff 0%, #eef9ff 58%, #dff8ff 100%);
}

#servicios-ingenieria .capability-card:nth-child(3) {
    background: linear-gradient(145deg, #ffffff 0%, #eaf4ff 100%);
}

#servicios-ingenieria .capability-card:nth-child(4) {
    background: linear-gradient(145deg, #ffffff 0%, #edfaff 52%, #e9f2ff 100%);
}

#servicios-informatica .capability-card {
    background: linear-gradient(145deg, #ffffff 0%, #e8fff5 56%, #edfaff 100%);
    border-color: rgba(4, 120, 87, 0.2);
}

#servicios-informatica .capability-card:nth-child(2) {
    background: linear-gradient(145deg, #ffffff 0%, #e4fff0 48%, #dff8ff 100%);
}

#servicios-informatica .capability-card:nth-child(3) {
    background: linear-gradient(145deg, #ffffff 0%, #ecfeff 48%, #e5fff2 100%);
}

#servicios-informatica .capability-card:nth-child(4) {
    background: linear-gradient(145deg, #ffffff 0%, #e6f7ff 48%, #dcfce7 100%);
}

[data-theme="dark"] #servicios-ingenieria .capability-card {
    background: linear-gradient(145deg, #0f2840 0%, #071a2d 100%);
    border-color: rgba(103, 232, 249, 0.24);
}

[data-theme="dark"] #servicios-ingenieria .capability-card:nth-child(2) {
    background: linear-gradient(145deg, #0d2a42 0%, #071829 100%);
}

[data-theme="dark"] #servicios-ingenieria .capability-card:nth-child(3) {
    background: linear-gradient(145deg, #102743 0%, #07162b 100%);
}

[data-theme="dark"] #servicios-ingenieria .capability-card:nth-child(4) {
    background: linear-gradient(145deg, #0b2439 0%, #08162c 100%);
}

[data-theme="dark"] #servicios-informatica .capability-card {
    background: linear-gradient(145deg, #0d2f2c 0%, #08243a 100%);
    border-color: rgba(74, 222, 128, 0.26);
}

[data-theme="dark"] #servicios-informatica .capability-card:nth-child(2) {
    background: linear-gradient(145deg, #0c3326 0%, #082234 100%);
}

[data-theme="dark"] #servicios-informatica .capability-card:nth-child(3) {
    background: linear-gradient(145deg, #08323a 0%, #06251f 100%);
}

[data-theme="dark"] #servicios-informatica .capability-card:nth-child(4) {
    background: linear-gradient(145deg, #0b293d 0%, #0b3024 100%);
}

#servicios-ingenieria .capability-card::after {
    border-top-color: #38d5ff;
}

#servicios-ingenieria .capability-card:nth-child(2)::after { border-top-color: #007aa3; }
#servicios-ingenieria .capability-card:nth-child(3)::after { border-top-color: #3388ff; }
#servicios-ingenieria .capability-card:nth-child(4)::after { border-top-color: #4f7fba; }

#servicios-informatica .capability-card::after {
    border-top-color: #22c55e;
}

#servicios-informatica .capability-card:nth-child(2)::after { border-top-color: #047857; }
#servicios-informatica .capability-card:nth-child(3)::after { border-top-color: #67e8f9; }
#servicios-informatica .capability-card:nth-child(4)::after { border-top-color: #66aaff; }

#servicios-ingenieria .capability-card > i {
    background: #dff8ff;
    color: #006d93;
}

#servicios-ingenieria .capability-card:nth-child(2) > i {
    background: #e8fbff;
    color: #007aa3;
}

#servicios-ingenieria .capability-card:nth-child(3) > i {
    background: #dcecff;
    color: #1f5ed7;
}

#servicios-ingenieria .capability-card:nth-child(4) > i {
    background: #eef4ff;
    color: #244c82;
}

#servicios-informatica .capability-card > i {
    background: linear-gradient(135deg, #dcfce7, #dff8ff);
    color: #047857;
}

#servicios-informatica .capability-card:nth-child(2) > i {
    background: #dcfce7;
    color: #15803d;
}

#servicios-informatica .capability-card:nth-child(3) > i {
    background: #ecfeff;
    color: #007aa3;
}

#servicios-informatica .capability-card:nth-child(4) > i {
    background: #e6f7ff;
    color: #1f5ed7;
}

[data-theme="dark"] #servicios-ingenieria .capability-card > i {
    background: rgba(103, 232, 249, 0.16);
    color: var(--cyan-blue);
}

[data-theme="dark"] #servicios-informatica .capability-card > i {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.2), rgba(103, 232, 249, 0.14));
    color: #86efac;
}

#servicios-ingenieria .capability-card h3 { color: #006d93; }
#servicios-ingenieria .capability-card:nth-child(2) h3 { color: #007aa3; }
#servicios-ingenieria .capability-card:nth-child(3) h3 { color: #1f5ed7; }
#servicios-ingenieria .capability-card:nth-child(4) h3 { color: #244c82; }

#servicios-informatica .capability-card h3 { color: #047857; }
#servicios-informatica .capability-card:nth-child(2) h3 { color: #15803d; }
#servicios-informatica .capability-card:nth-child(3) h3 { color: #007aa3; }
#servicios-informatica .capability-card:nth-child(4) h3 { color: #1f5ed7; }

[data-theme="dark"] #servicios-ingenieria .capability-card h3 { color: #d8fbff; }
[data-theme="dark"] #servicios-ingenieria .capability-card:nth-child(3) h3 { color: #9cc9ff; }
[data-theme="dark"] #servicios-ingenieria .capability-card:nth-child(4) h3 { color: var(--steel-blue); }

[data-theme="dark"] #servicios-informatica .capability-card h3 { color: #dcfce7; }
[data-theme="dark"] #servicios-informatica .capability-card:nth-child(3) h3 { color: var(--cyan-blue); }
[data-theme="dark"] #servicios-informatica .capability-card:nth-child(4) h3 { color: #9cc9ff; }

#servicios-ingenieria .capability-card li::before {
    background: #38d5ff;
}

#servicios-informatica .capability-card li::before {
    background: #22c55e;
}

.division-band {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 0.72fr);
    gap: 44px;
    align-items: center;
    padding: 44px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--card-bg);
    box-shadow: var(--shadow);
}

.engineering {
    background:
        radial-gradient(circle at 10% 18%, rgba(56, 213, 255, 0.12), transparent 30%),
        linear-gradient(180deg, #eaf8ff 0%, #f7fdff 100%);
}

.informatics {
    background:
        radial-gradient(circle at 88% 18%, rgba(34, 197, 94, 0.12), transparent 30%),
        linear-gradient(180deg, #eafaff 0%, #f4fff8 100%);
}

[data-theme="dark"] .engineering {
    background:
        radial-gradient(circle at 10% 18%, rgba(56, 213, 255, 0.16), transparent 32%),
        linear-gradient(180deg, #061426 0%, #071a2d 100%);
}

[data-theme="dark"] .informatics {
    background:
        radial-gradient(circle at 88% 18%, rgba(34, 197, 94, 0.16), transparent 32%),
        linear-gradient(180deg, #061827 0%, #071d22 100%);
}

.engineering .division-band {
    background: linear-gradient(145deg, #ffffff 0%, #e8fbff 100%);
    border-color: rgba(0, 122, 163, 0.2);
}

.informatics .division-band {
    background: linear-gradient(145deg, #ffffff 0%, #e8fff5 55%, #edfaff 100%);
    border-color: rgba(4, 120, 87, 0.2);
}

[data-theme="dark"] .engineering .division-band {
    background: linear-gradient(145deg, #0f2840 0%, #071a2d 100%);
    border-color: rgba(103, 232, 249, 0.24);
}

[data-theme="dark"] .informatics .division-band {
    background: linear-gradient(145deg, #0d2f2c 0%, #08243a 100%);
    border-color: rgba(74, 222, 128, 0.26);
}

.engineering .division-band h2 {
    color: #006d93;
}

.informatics .division-band h2 {
    color: #047857;
}

[data-theme="dark"] .engineering .division-band h2 {
    color: #d8fbff;
}

[data-theme="dark"] .informatics .division-band h2 {
    color: #dcfce7;
}

.division-band h2 {
    margin-bottom: 16px;
    font-size: 2.2rem;
    line-height: 1.15;
}

.division-band p {
    color: var(--text-light);
}

.band-list {
    display: grid;
    gap: 12px;
}

.band-list span {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--section-bg);
    color: var(--text-color);
    font-weight: 700;
}

.band-list i {
    color: var(--success-color);
}

.engineering .band-list span {
    background: #f6fdff;
    border-color: rgba(0, 122, 163, 0.18);
}

.engineering .band-list span:nth-child(2) { background: #e8fbff; }
.engineering .band-list span:nth-child(3) { background: #eaf4ff; }
.engineering .band-list span:nth-child(4) { background: #edfaff; }

.informatics .band-list span {
    background: #f5fff9;
    border-color: rgba(4, 120, 87, 0.18);
}

.informatics .band-list span:nth-child(2) { background: #e8fff5; }
.informatics .band-list span:nth-child(3) { background: #ecfeff; }
.informatics .band-list span:nth-child(4) { background: #e6f7ff; }

.engineering .band-list i {
    color: #007aa3;
}

.informatics .band-list i {
    color: #047857;
}

[data-theme="dark"] .engineering .band-list span {
    background: rgba(103, 232, 249, 0.08);
    border-color: rgba(103, 232, 249, 0.18);
}

[data-theme="dark"] .informatics .band-list span {
    background: rgba(74, 222, 128, 0.08);
    border-color: rgba(74, 222, 128, 0.18);
}

[data-theme="dark"] .engineering .band-list i {
    color: var(--cyan-blue);
}

[data-theme="dark"] .informatics .band-list i {
    color: #86efac;
}

.deliverables-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin-top: 34px;
}

.division-cta {
    background: var(--bg-color);
}

#contacto-ingenieria.division-cta {
    background: linear-gradient(180deg, #f7fdff, #e8fbff);
}

#contacto-informatica.division-cta {
    background: linear-gradient(180deg, #f4fff8, #e8fff5);
}

[data-theme="dark"] #contacto-ingenieria.division-cta {
    background: linear-gradient(180deg, #071a2d, #061426);
}

[data-theme="dark"] #contacto-informatica.division-cta {
    background: linear-gradient(180deg, #071d22, #061827);
}

.cta-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 34px;
    padding: 44px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--gradient-1);
    color: #ffffff;
    box-shadow: var(--shadow);
}

#contacto-ingenieria .cta-panel {
    background: linear-gradient(135deg, #006d93, #38d5ff);
}

#contacto-informatica .cta-panel {
    background: linear-gradient(135deg, #047857, #22c55e 58%, #38d5ff);
}

.cta-panel .section-kicker,
.cta-panel p {
    color: rgba(255, 255, 255, 0.82);
}

.cta-panel h2 {
    max-width: 760px;
    margin-bottom: 12px;
    font-size: 2rem;
    line-height: 1.15;
}

.cta-panel .btn-primary {
    background: #ffffff;
    color: #002266 !important;
    box-shadow: none;
    white-space: nowrap;
}

.tech-dashboard {
    border: 1px solid rgba(51, 136, 255, 0.22);
    border-radius: 12px;
    background: #08111f;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}

.dashboard-top {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    color: #e6f3ff;
}

.dashboard-top span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #3388ff;
}

.dashboard-top span:nth-child(2) {
    background: #22c55e;
}

.dashboard-top span:nth-child(3) {
    background: #f59e0b;
}

.dashboard-top strong {
    margin-left: auto;
    font-size: 0.88rem;
    letter-spacing: 0.8px;
}

.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding: 18px;
}

.dashboard-panel {
    min-height: 135px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.055);
    color: #ffffff;
}

.dashboard-panel.wide {
    grid-column: span 2;
}

.dashboard-panel small {
    display: block;
    margin-bottom: 10px;
    color: #8dc3ff;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.dashboard-panel strong {
    display: block;
    font-size: 1.8rem;
    line-height: 1.1;
}

.dashboard-panel p {
    color: rgba(255, 255, 255, 0.72);
    margin-top: 8px;
}

.flow-line {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 20px;
}

.flow-line span {
    height: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, #3388ff, #22c55e);
    animation: pulse-particle 3s infinite ease-in-out;
}

.code-panel {
    display: grid;
    gap: 10px;
    min-height: auto;
}

.code-panel code {
    color: #b7f7d0;
    font-size: 0.86rem;
}

.expanded-stack {
    justify-content: center;
    margin: 34px 0 0;
}

.footer-contact {
    color: #ffffff;
    font-weight: 700;
}

/* About Us */
.about {
    background:
        radial-gradient(circle at 85% 12%, rgba(0, 68, 204, 0.08), transparent 30%),
        linear-gradient(180deg, var(--surface-strong), var(--section-bg));
    text-align: center;
}

.methodology {
    background:
        linear-gradient(90deg, rgba(0, 68, 204, 0.05) 1px, transparent 1px),
        linear-gradient(180deg, #eef6ff, var(--section-bg));
    background-size: 54px 54px, auto;
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
}

[data-theme="dark"] .about {
    background:
        radial-gradient(circle at 85% 12%, rgba(102, 170, 255, 0.12), transparent 32%),
        linear-gradient(180deg, #08172b, #07152a);
}

[data-theme="dark"] .methodology {
    background:
        linear-gradient(90deg, rgba(102, 170, 255, 0.07) 1px, transparent 1px),
        linear-gradient(180deg, #0e2748, #08172b);
    background-size: 54px 54px, auto;
}

.methodology .section-title {
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: #111827;
    color: #111827;
}

.about .section-title {
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: #111827;
    color: #111827;
    -webkit-text-stroke: unset;
    text-shadow: none;
}

[data-theme="dark"] .methodology .section-title {
    background: linear-gradient(90deg, #5eead4, #b7fff7);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

[data-theme="dark"] .about .section-title {
    background: linear-gradient(90deg, #ffffff, #eaf6ff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    -webkit-text-stroke: 1px rgba(102, 170, 255, 0.14);
    text-shadow: 0 8px 30px rgba(102, 170, 255, 0.36);
}

.process-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.process-step {
    position: relative;
    min-height: 250px;
    padding: 28px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: linear-gradient(160deg, #ffffff 0%, #eaf4ff 100%);
    box-shadow: var(--shadow);
    overflow: hidden;
}

.process-step:nth-child(2) {
    background: linear-gradient(160deg, #ffffff 0%, #e9fff4 100%);
}

.process-step:nth-child(3) {
    background: linear-gradient(160deg, #ffffff 0%, #fff8d7 100%);
}

.process-step:nth-child(4) {
    background: linear-gradient(160deg, #ffffff 0%, #ffecec 100%);
}

[data-theme="dark"] .process-step {
    background: linear-gradient(160deg, #10233f 0%, #08172d 100%);
    border-color: rgba(102, 170, 255, 0.24);
}

[data-theme="dark"] .process-step:nth-child(2) {
    background: linear-gradient(160deg, #0e332b 0%, #071d22 100%);
}

[data-theme="dark"] .process-step:nth-child(3) {
    background: linear-gradient(160deg, #3a2f09 0%, #1d1908 100%);
}

[data-theme="dark"] .process-step:nth-child(4) {
    background: linear-gradient(160deg, #3b151b 0%, #1f0b13 100%);
}

.process-step::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 4px;
    background: var(--gradient-1);
}

.process-step:nth-child(2)::after {
    background: linear-gradient(90deg, #047857, #4ade80);
}

.process-step:nth-child(3)::after {
    background: linear-gradient(90deg, #d97706, #fde047);
}

.process-step:nth-child(4)::after {
    background: linear-gradient(90deg, #b91c1c, #fb7185);
}

.process-step span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 28px;
    border-radius: 50%;
    background: var(--gradient-1);
    color: #ffffff;
    font-weight: 800;
}

.process-step:nth-child(2) span {
    background: linear-gradient(135deg, #047857, #4ade80);
}

.process-step:nth-child(3) span {
    background: linear-gradient(135deg, #d97706, #fde047);
    color: #172033;
}

.process-step:nth-child(4) span {
    background: linear-gradient(135deg, #b91c1c, #fb7185);
}

.process-step h3 {
    margin-bottom: 12px;
    font-size: 1.25rem;
    color: var(--secondary-color);
}

.process-step:nth-child(2) h3 {
    color: #047857;
}

.process-step:nth-child(3) h3 {
    color: #a16207;
}

.process-step:nth-child(4) h3 {
    color: #b91c1c;
}

[data-theme="dark"] .process-step h3 {
    color: #d9ebff;
}

[data-theme="dark"] .process-step:nth-child(2) h3 {
    color: #86efac;
}

[data-theme="dark"] .process-step:nth-child(3) h3 {
    color: #fde68a;
}

[data-theme="dark"] .process-step:nth-child(4) h3 {
    color: #fda4af;
}

.process-step p {
    color: var(--text-light);
}

.mission-vision {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin-top: 50px;
}

.mv-box {
    background: linear-gradient(145deg, #ffffff 0%, #f1f7ff 100%);
    padding: 50px 40px;
    border-radius: 8px;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow);
    position: relative;
    overflow: hidden;
}

.mv-box:nth-child(2) {
    background: linear-gradient(145deg, #ffffff 0%, #eaf3ff 100%);
}

.mv-box:nth-child(3) {
    background: linear-gradient(145deg, #ffffff 0%, #effbff 100%);
}

.mv-box:nth-child(4) {
    background: linear-gradient(145deg, #ffffff 0%, #edf2ff 100%);
}

[data-theme="dark"] .mv-box {
    background: linear-gradient(145deg, #10233f 0%, #08172d 100%);
    border-color: rgba(102, 170, 255, 0.24);
}

[data-theme="dark"] .mv-box:nth-child(2) {
    background: linear-gradient(145deg, #10284b 0%, #08172d 100%);
}

[data-theme="dark"] .mv-box:nth-child(3) {
    background: linear-gradient(145deg, #0e2b3e 0%, #071626 100%);
}

[data-theme="dark"] .mv-box:nth-child(4) {
    background: linear-gradient(145deg, #12243f 0%, #07172f 100%);
}

.mv-box::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0, 68, 204, 0.1), transparent 42%);
    pointer-events: none;
}

.mv-box > * {
    position: relative;
    z-index: 1;
}

.mv-icon {
    font-size: 2.5rem;
    color: var(--primary-color);
    margin-bottom: 20px;
}

.mv-box:nth-child(1) .mv-icon,
.mv-box:nth-child(1) h3 {
    color: var(--deep-blue);
}

.mv-box:nth-child(2) .mv-icon,
.mv-box:nth-child(2) h3 {
    color: #1f5ed7;
}

.mv-box:nth-child(3) .mv-icon,
.mv-box:nth-child(3) h3 {
    color: #007aa3;
}

.mv-box:nth-child(4) .mv-icon,
.mv-box:nth-child(4) h3 {
    color: #244c82;
}

[data-theme="dark"] .mv-box:nth-child(1) .mv-icon,
[data-theme="dark"] .mv-box:nth-child(1) h3 {
    color: #d9ebff;
}

[data-theme="dark"] .mv-box:nth-child(2) .mv-icon,
[data-theme="dark"] .mv-box:nth-child(2) h3 {
    color: #9cc9ff;
}

[data-theme="dark"] .mv-box:nth-child(3) .mv-icon,
[data-theme="dark"] .mv-box:nth-child(3) h3 {
    color: var(--cyan-blue);
}

[data-theme="dark"] .mv-box:nth-child(4) .mv-icon,
[data-theme="dark"] .mv-box:nth-child(4) h3 {
    color: var(--steel-blue);
}

/* Contact */
.contact {
    background-color: var(--bg-color);
}

.contact-wrapper {
    display: flex;
    gap: 50px;
    background: var(--card-bg);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: var(--shadow);
    border: 1px solid var(--border-color);
}

select#service {
    appearance: none;
}

.form-submit {
    width: 100%;
}

.contact-info {
    flex: 1;
    background: var(--gradient-1);
    color: #ffffff;
    padding: 50px;
}

.contact-info h3 {
    font-size: 2rem;
    margin-bottom: 20px;
}

.contact-info p {
    color: rgba(255, 255, 255, 0.8);
    margin-bottom: 40px;
}

.info-item {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
}

.info-icon {
    width: 50px;
    height: 50px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.contact-form {
    flex: 1.5;
    padding: 50px;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
}

.form-control {
    width: 100%;
    padding: 15px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background-color: var(--bg-color);
    color: var(--text-color);
    font-family: inherit;
    transition: border-color 0.3s ease;
}

.form-control:focus {
    outline: none;
    border-color: var(--primary-color);
}

textarea.form-control {
    resize: vertical;
    min-height: 150px;
}

/* Footer */
footer {
    background-color: #050505;
    color: #aaaaaa;
    padding: 50px 0 20px;
    border-top: 1px solid #1a1a1a;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 50px;
    margin-bottom: 40px;
}

.footer-brand h4 {
    color: #ffffff;
    font-size: 1.5rem;
    margin-bottom: 20px;
}

.footer-brand p {
    margin-bottom: 20px;
    max-width: 400px;
}

.social-links {
    display: flex;
    gap: 15px;
}

.social-links a {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #111;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    transition: all 0.3s ease;
}

.social-links a:hover {
    background: var(--primary-color);
    transform: translateY(-3px);
}

.footer-links h5 {
    color: #ffffff;
    font-size: 1.1rem;
    margin-bottom: 20px;
}

.footer-links ul li {
    margin-bottom: 10px;
}

.footer-links ul li a {
    color: #aaaaaa;
}

.footer-links ul li a:hover {
    color: var(--primary-color);
}

.footer-bottom {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #222;
    font-size: 0.9rem;
}

/* Animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes brand-terminal-type {
    0% { width: 0; }
    16% { width: 27ch; }
    84% { width: 27ch; }
    100% { width: 0; }
}

@keyframes brand-cursor-blink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

@keyframes sectionPop {
    0% {
        opacity: 0.5;
        transform: scale(0.98) translateY(10px);
    }
    50% {
        transform: scale(1.01) translateY(-5px);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.section-animate {
    animation: sectionPop 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s ease-out;
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Responsive */
@media (max-width: 992px) {
    .split-section, .informatics .split-section {
        flex-direction: column;
    }

    .division-hero-grid,
    .division-band {
        grid-template-columns: 1fr;
    }

    .division-hero-copy h1 {
        font-size: 3rem;
    }

    .city-skyline,
    .automation-scene {
        transform: scale(0.82);
        transform-origin: right bottom;
        opacity: 0.55;
    }

    .engineering-animated-bg::after,
    .tech-animated-bg::after {
        background:
            linear-gradient(90deg, rgba(2, 4, 10, 0.96) 0%, rgba(2, 4, 10, 0.78) 58%, rgba(2, 4, 10, 0.45) 100%),
            linear-gradient(180deg, transparent 0%, #02040a 100%);
    }

    .capability-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    
    .contact-wrapper {
        flex-direction: column;
    }
    
    .overlay-stats {
        position: relative;
        bottom: 0;
        left: 0;
        right: 0;
        margin-top: 20px;
        justify-content: center;
    }

    .detail-grid,
    .process-grid,
    .deliverables-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    header {
        top: 12px;
        width: calc(100% - 24px);
    }

    .nav-container {
        height: 66px;
    }

    .mobile-menu-toggle {
        display: flex;
        order: 3;
    }

    .theme-toggle {
        order: 2;
        margin-left: auto;
        margin-right: 10px;
    }

    nav {
        order: 4;
    }

    .nav-links {
        position: absolute;
        top: calc(100% + 10px);
        left: 0;
        right: 0;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 14px;
        border: 1px solid var(--border-color);
        border-radius: 8px;
        background: var(--nav-bg);
        box-shadow: var(--shadow);
        opacity: 0;
        pointer-events: none;
        transform: translateY(-8px);
        transition: opacity 0.25s ease, transform 0.25s ease;
    }

    .nav-links.open {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .nav-links li a {
        text-align: center;
        border-radius: 8px;
    }
}

@media (max-width: 768px) {
    .hero-main-title {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        margin-bottom: 30px;
    }
    
    .hero-logo {
        position: static;
        transform: none;
        height: 82px;
    }

    .hero-logo:hover {
        transform: scale(1.05);
    }

    .hero-title {
        font-size: 2.15rem;
    }

    .hero-desc {
        font-size: 1.05rem;
    }

    .btn {
        width: 100%;
        padding: 14px 20px;
    }

    .btn-secondary {
        margin-left: 0;
    }

    .hero-metrics,
    .detail-grid,
    .process-grid,
    .division-menu-grid,
    .capability-grid,
    .deliverables-grid,
    .mission-vision,
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .division-hero {
        min-height: auto;
        padding: 122px 0 70px;
    }

    .division-animated-bg {
        opacity: 0.38;
    }

    .city-skyline,
    .automation-scene {
        transform: scale(0.66);
        opacity: 0.48;
    }

    .tower-a,
    .tower-d {
        display: none;
    }

    .workflow-lane,
    .floating-terminal {
        right: -18%;
    }

    .terminal-b,
    .security-shield {
        display: none;
    }

    .code-rain {
        right: 2%;
        font-size: 0.78rem;
    }

    .beam-a,
    .beam-c,
    .path-a,
    .path-c {
        width: 58%;
    }

    .division-hero-copy h1 {
        font-size: 2.25rem;
    }

    .division-hero-copy p {
        font-size: 1.02rem;
    }

    .division-blueprint {
        height: 340px;
    }

    .division-card,
    .capability-card,
    .division-band,
    .cta-panel {
        padding: 26px 22px;
    }

    .cta-panel {
        flex-direction: column;
        align-items: flex-start;
    }

    .cta-panel .btn-primary {
        width: 100%;
        white-space: normal;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-panel.wide {
        grid-column: span 1;
    }

    .section-padding {
        padding: 78px 0;
    }

    .section-title {
        font-size: 2rem;
    }

    .section-menu {
        justify-content: flex-start;
        padding: 8px;
    }

    .section-menu a {
        width: 100%;
        justify-content: center;
    }
    
    .contact-info,
    .contact-form {
        padding: 32px 24px;
    }

    .nav-links {
        grid-template-columns: 1fr;
    }
}

/* Final visual tuning for black hero scenes */
.engineering-hero,
.tech-hero {
    background: #00040b;
}

.engineering-animated-bg::after,
.tech-animated-bg::after {
    background:
        linear-gradient(90deg, rgba(0, 4, 11, 0.9) 0%, rgba(0, 4, 11, 0.64) 30%, rgba(0, 4, 11, 0.2) 58%, rgba(0, 4, 11, 0.08) 100%),
        linear-gradient(180deg, rgba(0, 4, 11, 0) 0%, rgba(0, 4, 11, 0.15) 62%, #00040b 100%);
}

.division-hero-copy {
    z-index: 3;
}

.division-hero-copy::before {
    inset: -28px -38px;
    background:
        linear-gradient(90deg, rgba(0, 4, 11, 0.94), rgba(0, 4, 11, 0.82) 58%, rgba(0, 4, 11, 0.34) 100%);
    box-shadow: 0 0 70px rgba(0, 4, 11, 0.9);
}

.division-hero-copy h1,
.division-hero-copy p,
.division-hero .section-kicker {
    color: #ffffff;
}

.division-hero-copy p {
    color: rgba(255, 255, 255, 0.86);
}

.division-visual {
    z-index: 3;
}

.city-skyline {
    opacity: 1;
    filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.18));
}

.city-skyline::before {
    content: '';
    position: absolute;
    right: 0;
    left: 34%;
    bottom: 8%;
    height: 2px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 -34px 0 rgba(255, 255, 255, 0.08), 0 16px 0 rgba(255, 255, 255, 0.16);
}

.city-building {
    border-color: rgba(255, 255, 255, 0.9);
    background:
        repeating-linear-gradient(90deg, transparent 0 13px, rgba(255, 255, 255, 0.11) 13px 15px),
        linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.025));
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.12), 0 0 24px rgba(255,255,255,0.08);
}

.city-building.finished {
    border-color: rgba(255, 255, 255, 0.96);
}

.city-building.construction {
    border-color: rgba(255, 255, 255, 0.78);
    background:
        repeating-linear-gradient(135deg, rgba(255,255,255,0.08) 0 7px, transparent 7px 14px),
        linear-gradient(180deg, rgba(255,255,255,0.1), transparent);
}

.city-building i {
    background: rgba(255, 255, 255, 0.86);
    box-shadow:
        18px 0 rgba(255, 255, 255, 0.72),
        -18px 0 rgba(255, 255, 255, 0.72),
        0 18px rgba(255, 255, 255, 0.44),
        18px 18px rgba(255, 255, 255, 0.34),
        -18px 18px rgba(255, 255, 255, 0.34);
}

.tower-a { right: 44%; height: 260px; width: 86px; }
.tower-b { right: 27%; height: 350px; width: 106px; }
.tower-c { right: 12%; height: 230px; width: 88px; }
.tower-d { right: 55%; height: 190px; width: 82px; }
.tower-e { right: 2%; height: 170px; width: 76px; }

.crane {
    border-left-color: rgba(255, 255, 255, 0.92);
    filter: drop-shadow(0 0 10px rgba(255,255,255,0.2));
}

.crane i:nth-child(1),
.crane i:nth-child(2),
.crane i:nth-child(3) {
    background: rgba(255, 255, 255, 0.86);
}

.worker {
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 0 12px rgba(255,255,255,0.22);
}

.work-spark {
    width: 6px;
    height: 6px;
}

.automation-scene {
    opacity: 1;
    filter: drop-shadow(0 0 16px rgba(102, 170, 255, 0.12));
}

.automation-scene::before {
    content: '';
    position: absolute;
    right: 0;
    top: 12%;
    width: 58%;
    height: 76%;
    border: 1px solid rgba(102, 170, 255, 0.12);
    border-radius: 18px;
    background:
        linear-gradient(90deg, rgba(102,170,255,0.06) 1px, transparent 1px),
        linear-gradient(rgba(102,170,255,0.06) 1px, transparent 1px);
    background-size: 42px 42px;
}

.workflow-lane {
    border-color: rgba(102, 170, 255, 0.62);
    background: rgba(3, 13, 29, 0.9);
    box-shadow: 0 0 34px rgba(51, 136, 255, 0.22);
}

.flow-node {
    background: rgba(255, 255, 255, 0.09);
    box-shadow: 0 0 20px currentColor, inset 0 0 14px rgba(255,255,255,0.06);
}

.flow-connector {
    height: 3px;
    box-shadow: 0 0 14px rgba(102, 170, 255, 0.35);
}

.floating-terminal {
    border-color: rgba(255, 255, 255, 0.32);
    background: rgba(0, 0, 0, 0.9);
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.62), 0 0 26px rgba(34, 197, 94, 0.12);
}

.floating-terminal::before {
    content: '';
    display: block;
    width: 42px;
    height: 8px;
    margin-bottom: 13px;
    border-radius: 999px;
    background: linear-gradient(90deg, #f04444 0 9px, transparent 9px 15px, #f59e0b 15px 24px, transparent 24px 30px, #22c55e 30px 39px);
}

.floating-terminal code {
    font-size: 0.92rem;
    text-shadow: 0 0 10px currentColor;
}

.security-shield,
.security-lock {
    background: rgba(0, 0, 0, 0.86);
    box-shadow: 0 0 28px currentColor;
}

.security-pulse {
    border-width: 2px;
}

@media (max-width: 992px) {
    .city-skyline,
    .automation-scene {
        transform: scale(0.9);
        opacity: 0.78;
    }

    .engineering-animated-bg::after,
    .tech-animated-bg::after {
        background:
            linear-gradient(90deg, rgba(0, 4, 11, 0.96) 0%, rgba(0, 4, 11, 0.78) 52%, rgba(0, 4, 11, 0.38) 100%),
            linear-gradient(180deg, rgba(0, 4, 11, 0) 0%, #00040b 100%);
    }
}

@media (max-width: 768px) {
    .division-hero-copy::before {
        inset: -20px;
        background: rgba(0, 4, 11, 0.86);
    }

    .city-skyline,
    .automation-scene {
        transform: scale(0.72);
        opacity: 0.62;
    }

    .automation-scene::before {
        right: -22%;
        width: 88%;
    }
}