/* ════════════════════════════════════════
   RESPONSIVE — HERO MODULE 1
   All hero breakpoints are managed inside hero.css.
   This block is intentionally empty to avoid conflicts.
════════════════════════════════════════ */

/* ════════════════════════════════════════
   RESPONSIVE — ABOUT MODULE 2
════════════════════════════════════════ */

@media (max-width: 1200px) {
    .about-row-1 { grid-template-columns: 1fr 340px; }
    .about-intro-card { padding: 40px 36px; }
    .about-team-card  { padding: 40px 36px; }
    .about-quote-panel { padding: 52px 52px; gap: 40px; }
}

@media (max-width: 900px) {
    .about-row-1 {
        grid-template-columns: 1fr;
    }
    .about-tall-image {
        min-height: 340px;
        transform: none;
    }
    .about-row-2 {
        grid-template-columns: 1fr;
    }
    .about-side-col {
        flex-direction: row;
    }
    .about-stat-card { flex: 1; }
    .about-mini-image { flex: 1; min-height: 180px; }
    .about-quote-panel {
        grid-template-columns: 1fr;
        padding: 48px 36px;
        gap: 32px;
    }
    .about-quote-panel::before { font-size: 10rem; top: -10px; left: 20px; }
    .about-quote-visual { height: 260px; }
}

@media (max-width: 640px) {
    .about-section { padding: 16px 12px 0; }

    .about-intro-card { padding: 32px 24px; border-radius: var(--radius-lg); }
    .about-team-card  { padding: 32px 24px; border-radius: var(--radius-lg); }
    .about-tall-image { border-radius: var(--radius-lg); }

    .about-side-col { flex-direction: column; }
    .about-mini-image { min-height: 200px; }

    .about-quote-panel {
        border-radius: var(--radius-lg);
        padding: 36px 24px;
    }

    .about-disciplines { gap: 8px; }
    .about-discipline-tag { font-size: 0.65rem; padding: 6px 14px; }
}

/* ════════════════════════════════════════
   RESPONSIVE — SERVICES MODULE 3
════════════════════════════════════════ */

@media (max-width: 1400px) {
    .svc-title-block { grid-column: span 12; grid-row: span 2; align-items: center; padding: 0; text-align: center; }
    .svc-massive-title { font-size: clamp(4rem, 8vw, 8rem); text-shadow: 4px 4px 0px rgba(26,26,26,0.3); margin-bottom: 24px; }
    
    .svc-branding { grid-column: span 12; grid-row: span 3; }
    .svc-perf { grid-column: span 6; grid-row: span 4; }
    .svc-social { grid-column: span 6; grid-row: span 2; }
    .svc-seo { grid-column: span 6; grid-row: span 2; }
    .svc-arch { grid-column: span 12; grid-row: span 3; }
    .svc-jewel { grid-column: span 4; grid-row: span 4; }
    .svc-interior { grid-column: span 4; grid-row: span 4; }
    .svc-films { grid-column: span 4; grid-row: span 4; }
}

@media (max-width: 900px) {
    .services-grid { display: flex; flex-direction: column; gap: 16px; }
    
    .service-card {
        min-height: 380px;
        padding: 32px;
    }
    .svc-massive-title { text-align: left; margin-bottom: 16px; }
    
    .svc-branding .svc-bg-img { width: 100%; border-radius: 0; opacity: 0.2; left: 0; }
    .svc-perf .svc-bg-img { width: 100%; height: 100%; top: 0; border-radius: 0; opacity: 0.2; }
}

@media (max-width: 640px) {
    .services-section { padding: 80px 12px 24px; }
    
    .service-card {
        min-height: 320px;
        padding: 24px;
        border-radius: var(--radius-lg);
    }
    .svc-massive-title { font-size: 3.5rem; text-shadow: 3px 3px 0px rgba(26,26,26,0.3); }
    .svc-title { font-size: 1.6rem; }
    .svc-action-btn { width: 48px; height: 48px; }
    .svc-action-btn svg { width: 20px; height: 20px; }
}