.technology-page { background: var(--black); }

.technology-hero {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    gap: 3rem;
    align-items: center;
    max-width: 1300px;
    margin: 0 auto;
    padding: 9rem 1.5rem 4rem;
}

.technology-hero-content h1 {
    max-width: 680px;
    margin: 0.8rem 0 1.2rem;
    font-family: var(--font-headline);
    font-size: clamp(3.2rem, 6vw, 6.5rem);
    line-height: 0.95;
    letter-spacing: 0.03em;
}

.technology-hero-content h1 span,
.technology-feature-copy h2 span,
.technology-finale h2 span { color: var(--yellow); }

.technology-hero-content p {
    max-width: 530px;
    color: var(--text-muted);
    font-size: 1.1rem;
    line-height: 1.7;
}

.technology-hero-media,
.technology-feature img,
.technology-video {
    overflow: hidden;
    border: 1px solid var(--black-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
}

.technology-hero-media img,
.technology-feature img { display: block; width: 100%; height: 100%; object-fit: cover; }
.technology-hero-media { min-height: 420px; }

.technology-content { max-width: 1100px; margin: 0 auto; padding: 3rem 1.5rem 6rem; }
.technology-intro { max-width: 790px; padding: 4rem 0 5rem; }
.technology-intro h2,
.technology-finale h2 { margin: 0.5rem 0 1.2rem; font-family: var(--font-headline); font-size: clamp(2.4rem, 5vw, 4.8rem); line-height: 1; }
.technology-intro p,
.technology-feature-copy p,
.technology-finale > p { color: var(--text-muted); font-size: 1.02rem; line-height: 1.8; }

.technology-feature {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: center;
    padding: 4rem 0;
    border-top: 1px solid var(--black-border);
}

.technology-feature.reverse .technology-feature-copy { order: 2; }
.technology-feature.reverse > img { order: 1; }
.technology-feature-copy h2 { margin: 0.5rem 0 1.2rem; font-family: var(--font-headline); font-size: clamp(2rem, 4vw, 3.7rem); line-height: 1; }
.technology-index { color: var(--yellow); font-family: var(--font-ui); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.15em; }
.technology-feature img { aspect-ratio: 4 / 3; }
.technology-video { aspect-ratio: 16 / 9; background: #111; }
.technology-video iframe { display: block; width: 100%; height: 100%; border: 0; }

.technology-finale { margin-top: 2rem; padding: 4rem; background: linear-gradient(135deg, rgba(245,208,0,0.1), rgba(255,255,255,0.02)); border: 1px solid var(--black-border); border-radius: var(--radius-lg); }
.technology-finale > p { max-width: 760px; }
.technology-proof { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.8rem; margin-top: 2rem; }
.technology-proof span { padding: 1rem; color: var(--text); border-left: 2px solid var(--yellow); background: rgba(0,0,0,0.2); font-family: var(--font-ui); font-size: 0.85rem; font-weight: 600; }

@media (max-width: 800px) {
    .technology-hero { grid-template-columns: 1fr; padding-top: 8rem; }
    .technology-hero-media { min-height: 280px; }
    .technology-feature { grid-template-columns: 1fr; gap: 2rem; }
    .technology-feature.reverse .technology-feature-copy,
    .technology-feature.reverse > img { order: initial; }
    .technology-finale { padding: 2rem; }
    .technology-proof { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
    .technology-proof { grid-template-columns: 1fr; }
}
