/* File: assets/css/about-us.css */
.about-us-page .section-header { text-align: center; margin-bottom: 50px; }
.about-us-page .section-title { font-size: clamp(2rem, 4vw, 2.5rem); color: var(--color-dark); margin: 0 0 10px 0; }
.about-us-page .section-subtitle { font-size: 1.1rem; color: var(--color-medium-gray); max-width: 600px; margin: 0 auto; }
.about-hero { padding: 80px 0; background-color: var(--color-white); }
.about-hero-content { display: grid; grid-template-columns: 1.1fr 1fr; gap: 60px; align-items: center; }
.hero-text-block .hero-eyebrow { font-size: 16px; font-weight: 600; color: var(--color-primary); text-transform: uppercase; letter-spacing: 1px; display: block; margin-bottom: 10px; }
.hero-text-block .hero-title { font-size: clamp(2.5rem, 5vw, 3.8rem); line-height: 1.2; color: var(--color-dark); margin: 0 0 20px 0; }
.hero-text-block p { font-size: 1.1rem; color: var(--color-medium-gray); line-height: 1.8; margin-bottom: 1.5rem; }
.hero-image-block img { width: 100%; border-radius: 16px; object-fit: cover; aspect-ratio: 4 / 5; }
.our-mission-section { padding: 80px 0; background-color: var(--color-light-gray); }
.mission-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.mission-item { text-align: center; background-color: #fff; padding: 40px 30px; border-radius: 12px; border: 1px solid #e9ecef; }
.mission-icon { width: 60px; height: 60px; margin: 0 auto 20px auto; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: var(--color-light-gray); color: var(--color-primary); }
.mission-icon .lucide { width: 30px; height: 30px; }
.mission-item h3 { font-size: 22px; margin: 0 0 10px 0; color: var(--color-dark); }
.mission-item p { color: var(--color-medium-gray); line-height: 1.6; }
.what-we-offer-section { padding: 80px 0; text-align: center; }
.offer-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 15px; margin-bottom: 40px; }
.offer-pill { background-color: var(--color-light-gray); color: var(--color-dark); font-weight: 500; padding: 12px 25px; border-radius: 30px; border: 1px solid #e9ecef; transition: all 0.3s ease; }
.offer-pill:hover { background-color: var(--color-primary); color: #fff; border-color: var(--color-primary); transform: scale(1.05); }
.why-choose-us-stats { padding: 80px 0; background-color: var(--color-dark); }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; color: #fff; }
.stat-item { text-align: center; border: 1px solid rgba(255,255,255,0.2); padding: 30px; border-radius: 12px; }
.stat-icon { color: var(--color-primary); margin-bottom: 15px; }
.stat-icon .lucide { width: 40px; height: 40px; }
.stat-number { display: block; font-size: 2.5rem; font-weight: 700; }
.stat-label { font-size: 16px; color: rgba(255,255,255,0.7); }
.our-promise-section { padding: 80px 0; }
.promise-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 60px; align-items: center; }
.promise-image img { width: 100%; border-radius: 16px; object-fit: cover; }
.promise-content .section-title { font-size: 2.5rem; }
.promise-content p { font-size: 1.1rem; line-height: 1.8; color: var(--color-medium-gray); margin-bottom: 30px; }
@media (max-width: 991px) { .about-hero-content, .promise-grid { grid-template-columns: 1fr; } .hero-image-block { margin-top: 40px; order: -1; } .mission-grid, .stats-grid { grid-template-columns: repeat(2, 1fr); } .our-promise-section, .about-hero { text-align: center; } .promise-image { max-width: 500px; margin: 0 auto; } }
@media (max-width: 767px) { .mission-grid { grid-template-columns: 1fr; } .our-promise-section, .what-we-offer-section, .our-mission-section, .about-hero { padding: 60px 0; } .hero-text-block .hero-title { font-size: 2.2rem; } }
@media (max-width: 576px) { .stats-grid { grid-template-columns: 1fr; } }