/* About page: a calm, editorial layer over the site's teal and gold brand system. */
.about-page { background: #f7f5f0; color: #112b3a; overflow-x: hidden; }
.about-page p { line-height: 1.7 !important; }
.about-page a { transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.about-page h1, .about-page h2, .about-page h3, .about-page p { margin-top: 0; }
.about-page h2 { letter-spacing: -.045em; }
.about-page h2 em, .about-page h1 em { color: #e1ae35; font-style: normal; }

.about-eyebrow { align-items: center; color: #e1ae35; display: flex; font-size: .68rem !important; font-weight: 800; gap: 12px; letter-spacing: .2em; line-height: 1.2 !important; margin-bottom: 0; }
.about-eyebrow span { background: #e1ae35; display: inline-block; height: 1px; opacity: .7; width: 38px; }
.about-eyebrow--dark { color: #a67d1d; }
.about-eyebrow--dark span { background: #c69b3a; }

.about-hero { background: linear-gradient(90deg, rgba(7, 23, 34, .98) 0%, rgba(7, 23, 34, .9) 39%, rgba(7, 23, 34, .38) 72%, rgba(7, 23, 34, .55) 100%), url('./images/bg.webp') center 57% / cover no-repeat; color: #fff; min-height: 720px; overflow: hidden; position: relative; }
.about-hero:before { background: radial-gradient(circle, rgba(225,174,53,.22) 0, transparent 65%); content: ''; height: 600px; position: absolute; right: -160px; top: -220px; width: 600px; }
.about-hero__inner { align-items: center; display: grid; grid-template-columns: minmax(0, .94fr) minmax(360px, 1.06fr); min-height: 720px; position: relative; z-index: 1; }
.about-hero__copy { max-width: 640px; padding: 110px 0 72px; position: relative; z-index: 2; }
.about-hero h1 { color: #fff; font-size: clamp(3.1rem, 6vw, 6.2rem); font-weight: 700; letter-spacing: -.075em; line-height: .96; margin: 25px 0 27px; max-width: 700px; }
.about-hero__lead { color: rgba(255,255,255,.74); font-size: 1.08rem !important; max-width: 525px; }
.about-hero__actions { align-items: center; display: flex; flex-wrap: wrap; gap: 13px; margin-top: 31px; }
.about-button { align-items: center; border-radius: 999px; display: inline-flex; font-size: .81rem; font-weight: 800; gap: 12px; justify-content: center; letter-spacing: .04em; padding: 14px 21px; text-decoration: none !important; }
.about-button--gold { background: #e1ae35; box-shadow: 0 13px 30px rgba(225,174,53,.2); color: #102b3b; }
.about-button--gold:hover, .about-button--gold:focus { background: #f3ce79; color: #102b3b; transform: translateY(-3px); }
.about-button--gold span { font-size: 18px; line-height: .65; }
.about-button--outline { border: 1px solid rgba(255,255,255,.35); color: #fff; }
.about-button--outline:hover, .about-button--outline:focus { border-color: #e1ae35; color: #f3ce79; transform: translateY(-3px); }
.about-hero__trust { border-top: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.56); display: flex; flex-wrap: wrap; font-size: .76rem; gap: 23px; margin-top: 43px; max-width: 540px; padding-top: 17px; }
.about-hero__trust strong { color: #f3ce79; font-size: .97rem; margin-right: 4px; }
.about-hero__visual { align-self: stretch; min-height: 720px; position: relative; }
.about-hero__visual:after { border: 1px solid rgba(225,174,53,.38); border-radius: 50%; content: ''; height: 570px; position: absolute; right: 2%; top: 94px; width: 570px; }
.about-hero__ring { border: 1px solid rgba(225,174,53,.2); border-radius: 50%; position: absolute; right: 10%; top: 137px; }
.about-hero__ring--one { height: 485px; width: 485px; }
.about-hero__ring--two { height: 395px; right: 18%; top: 182px; width: 395px; }
.about-hero__badge { align-items: center; background: rgba(10,33,47,.88); border: 1px solid rgba(225,174,53,.45); border-radius: 13px; bottom: 138px; box-shadow: 0 18px 40px rgba(0,0,0,.24); display: flex; gap: 11px; padding: 12px 16px; position: absolute; right: 9%; z-index: 2; }
.about-hero__badge-mark { align-items: center; background: #e1ae35; border-radius: 50%; color: #102b3b; display: flex; font-size: 16px; height: 32px; justify-content: center; width: 32px; }
.about-hero__badge strong, .about-hero__badge small { display: block; }
.about-hero__badge strong { color: #fff; font-size: .78rem; }
.about-hero__badge small { color: rgba(255,255,255,.55); font-size: .67rem; margin-top: 3px; }
.about-hero__scroll { bottom: 23px; color: rgba(255,255,255,.58); display: flex; flex-direction: column; font-size: .63rem; gap: 8px; left: 50%; letter-spacing: .16em; position: absolute; text-align: center; text-decoration: none !important; transform: translateX(-50%); z-index: 3; }
.about-hero__scroll:hover { color: #f3ce79; }
.about-hero__scroll i { font-size: 20px; font-style: normal; line-height: .7; }

.about-intro { background: #f7f5f0; padding: 105px 0 93px; }
.about-section-heading h2, .about-values__heading h2, .about-care__copy h2 { color: #102b3b; font-size: clamp(2.35rem, 4.5vw, 4.25rem); line-height: .98; margin: 17px 0 0; }
.about-intro__grid { align-items: center; display: grid; gap: clamp(40px, 8vw, 110px); grid-template-columns: minmax(0, .92fr) minmax(300px, .75fr); margin-top: 67px; }
.about-intro__copy { max-width: 630px; }
.about-kicker { color: #a67d1d; font-size: .72rem !important; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.about-lead { font-size: 1.42rem !important; line-height: 1.38 !important; }
.about-lead--dark { color: #193c4c; font-weight: 600; }
.about-intro__copy > p:not(.about-kicker):not(.about-lead) { color: #56646b; font-size: 1rem !important; max-width: 615px; }
.about-intro__copy a:not(.about-text-link) { color: #a67d1d; font-weight: 700; text-decoration: underline; text-decoration-color: rgba(166,125,29,.35); text-underline-offset: 3px; }
.about-intro__copy a:not(.about-text-link):hover { color: #193c4c; }
.about-text-link { color: #a67d1d; display: inline-flex; font-size: .82rem; font-weight: 800; gap: 9px; letter-spacing: .04em; margin-top: 12px; text-decoration: none !important; }
.about-text-link span { font-size: 17px; line-height: .7; transition: transform .2s ease; }
.about-text-link:hover { color: #193c4c; }
.about-text-link:hover span { transform: translateX(4px); }
.about-intro__image-wrap { justify-self: end; max-width: 430px; position: relative; width: 100%; }
.about-intro__image-wrap:before { border: 1px solid #d1a13c; content: ''; height: calc(100% - 24px); left: -18px; position: absolute; top: 18px; width: calc(100% - 24px); }
.about-intro__image-frame { background: #102b3b; padding: 0 0 19px 19px; position: relative; z-index: 1; }
.about-intro__image-frame img { display: block; height: auto; width: 100%; }
.about-intro__note { align-items: center; background: #e1ae35; bottom: -17px; display: flex; gap: 12px; padding: 15px 19px; position: absolute; right: -18px; z-index: 2; }
.about-intro__note strong { color: #102b3b; font-size: 1.45rem; font-weight: 800; }
.about-intro__note span { color: #102b3b; font-size: .71rem; font-weight: 800; letter-spacing: .06em; line-height: 1.25; text-transform: uppercase; }
.about-stat-row { border-top: 1px solid #d5d1c7; display: grid; gap: 25px; grid-template-columns: repeat(3, 1fr); margin-top: 94px; padding-top: 22px; }
.about-stat-row div { align-items: center; display: flex; gap: 13px; }
.about-stat-row strong { color: #c69b3a; font-size: .77rem; letter-spacing: .08em; }
.about-stat-row span { color: #69767b; font-size: .76rem; }

.about-values { background: #0b2636; color: #fff; padding: 99px 0 105px; position: relative; }
.about-values:before { background: radial-gradient(circle, rgba(225,174,53,.14), transparent 67%); content: ''; height: 520px; left: -260px; position: absolute; top: 130px; width: 520px; }
.about-values__heading { align-items: end; display: flex; gap: 35px; justify-content: space-between; position: relative; }
.about-values__heading h2 { color: #fff; }
.about-values__heading > p { color: rgba(255,255,255,.6); font-size: .96rem !important; margin: 0 0 2px; max-width: 380px; }
.about-values__grid { display: grid; gap: 16px; grid-template-columns: repeat(4, 1fr); margin-top: 59px; position: relative; }
.about-value-card { background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.12); min-height: 310px; padding: 25px 22px 22px; position: relative; transition: background .25s ease, border-color .25s ease, transform .25s ease; }
.about-value-card:hover { background: rgba(225,174,53,.12); border-color: rgba(225,174,53,.55); transform: translateY(-5px); }
.about-value-card--featured { background: linear-gradient(150deg, #d6a32d, #8e6c1d); border-color: #f2ce7c; color: #102b3b; }
.about-value-card__number { color: rgba(255,255,255,.45); font-size: .7rem; font-weight: 800; letter-spacing: .12em; }
.about-value-card--featured .about-value-card__number { color: rgba(16,43,59,.58); }
.about-value-card__icon { align-items: center; border: 1px solid rgba(225,174,53,.55); border-radius: 50%; color: #e1ae35; display: flex; font-size: 20px; height: 48px; justify-content: center; margin: 39px 0 22px; width: 48px; }
.about-value-card--featured .about-value-card__icon { background: #102b3b; border-color: #102b3b; color: #f3ce79; }
.about-value-card h3 { color: #fff; font-size: 1.22rem; letter-spacing: -.02em; margin-bottom: 11px; }
.about-value-card--featured h3 { color: #102b3b; }
.about-value-card p { color: rgba(255,255,255,.6); font-size: .83rem !important; line-height: 1.6 !important; }
.about-value-card--featured p { color: rgba(16,43,59,.76); }
.about-value-card a { bottom: 21px; color: #f3ce79; font-size: .72rem; font-weight: 800; left: 22px; position: absolute; text-decoration: none; }
.about-value-card--featured a { color: #102b3b; }
.about-value-card a span { font-size: 16px; margin-left: 5px; }

.about-services { background: #f1eee7; padding: 105px 0 113px; }
.about-section-heading--split { align-items: end; display: flex; gap: 35px; justify-content: space-between; }
.about-section-heading--split > p { color: #647178; font-size: .95rem !important; margin: 0 0 2px; max-width: 380px; }
.about-service-grid { display: grid; gap: 14px; grid-template-columns: repeat(4, 1fr); margin-top: 59px; }
.about-service-card { background-color: #123447; background-position: center; background-size: cover; color: #fff; display: flex; flex-direction: column; min-height: 335px; overflow: hidden; padding: 20px; position: relative; text-decoration: none !important; }
.about-service-card:before { background: linear-gradient(180deg, rgba(5,20,29,.12) 15%, rgba(5,20,29,.94) 100%); content: ''; inset: 0; position: absolute; transition: background .3s ease; }
.about-service-card:hover:before { background: linear-gradient(180deg, rgba(5,20,29,.08) 4%, rgba(5,20,29,.78) 100%); }
.about-service-card:hover { color: #fff; transform: translateY(-5px); }
.about-service-card--airport { background-image: url('./images/Dubai-Airport-Transfer.webp'); }
.about-service-card--chauffeur { background-image: url('./images/chauffeur-service-in-dubai.webp'); }
.about-service-card--intercity { background-image: url('./images/Dubai-To-Abu-Dhabi.webp'); }
.about-service-card--business { background-image: url('./images/corporate-services.webp'); }
.about-service-card__index, .about-service-card__arrow, .about-service-card__content { position: relative; z-index: 1; }
.about-service-card__index { color: rgba(255,255,255,.65); font-size: .67rem; letter-spacing: .1em; }
.about-service-card__arrow { align-items: center; border: 1px solid rgba(255,255,255,.65); border-radius: 50%; display: flex; font-size: 19px; height: 35px; justify-content: center; margin-left: auto; width: 35px; }
.about-service-card__content { margin-top: auto; }
.about-service-card__content small { color: #f3ce79; display: block; font-size: .62rem; font-weight: 800; letter-spacing: .16em; margin-bottom: 7px; }
.about-service-card__content strong { display: block; font-size: 1.45rem; letter-spacing: -.03em; }
.about-service-card__content > span { color: rgba(255,255,255,.72); display: block; font-size: .78rem; line-height: 1.45; margin-top: 8px; }

.about-care { background: #f7f5f0; padding: 113px 0 119px; }
.about-care__grid { align-items: center; display: grid; gap: clamp(55px, 9vw, 130px); grid-template-columns: minmax(300px, .85fr) minmax(0, 1fr); }
.about-care__visual { max-width: 445px; position: relative; }
.about-care__visual img { display: block; height: auto; position: relative; width: 100%; z-index: 1; }
.about-care__visual:after { border: 1px solid #c69b3a; content: ''; height: calc(100% - 24px); left: 18px; position: absolute; top: 18px; width: calc(100% - 24px); z-index: 0; }
.about-care__quote { background: #102b3b; bottom: -21px; color: #f3ce79; font-size: 1.18rem; font-style: italic; line-height: 1.15; padding: 18px 23px; position: absolute; right: -22px; z-index: 2; }
.about-care__copy { max-width: 630px; }
.about-care__copy > p:not(.about-eyebrow):not(.about-lead) { color: #657178; font-size: .97rem !important; }
.about-check-list { list-style: none; margin: 32px 0 0; padding: 0; }
.about-check-list li { align-items: flex-start; display: flex; gap: 13px; margin-bottom: 20px; }
.about-check-list > li > span:first-child { align-items: center; background: #e1ae35; border-radius: 50%; color: #102b3b; display: flex; flex: 0 0 23px; font-size: 12px; height: 23px; justify-content: center; margin-top: 2px; width: 23px; }
.about-check-list strong, .about-check-list small { display: block; }
.about-check-list strong { color: #193c4c; font-size: .86rem; }
.about-check-list small { color: #738087; font-size: .77rem; margin-top: 3px; }

.about-cta { background: #102b3b; color: #fff; overflow: hidden; padding: 75px 0 80px; position: relative; }
.about-cta:after { border: 1px solid rgba(225,174,53,.28); border-radius: 50%; content: ''; height: 490px; position: absolute; right: -140px; top: -235px; width: 490px; }
.about-cta__inner { align-items: center; display: flex; gap: 35px; justify-content: space-between; position: relative; z-index: 1; }
.about-cta h2 { color: #fff; font-size: clamp(2.5rem, 5vw, 4.6rem); line-height: .98; margin: 18px 0 0; }
.about-cta__action { max-width: 350px; }
.about-cta__action p { color: rgba(255,255,255,.68); font-size: .92rem !important; }
.about-cta__action .about-button { margin-top: 12px; }

@media (max-width: 991px) {
    .about-hero, .about-hero__inner, .about-hero__visual { min-height: 640px; }
    .about-hero__inner { grid-template-columns: 1fr; }
    .about-hero__copy { padding: 150px 0 70px; }
    .about-hero__visual { display: none; }
    .about-hero h1 { max-width: 630px; }
    .about-values__grid, .about-service-grid { grid-template-columns: repeat(2, 1fr); }
    .about-value-card { min-height: 285px; }
}

@media (max-width: 767px) {
    .about-page .container { padding-left: 22px; padding-right: 22px; }
    .about-hero { min-height: 670px; }
    .about-hero__copy { padding: 145px 0 65px; }
    .about-hero h1 { font-size: clamp(3rem, 14vw, 4.8rem); }
    .about-hero__lead { font-size: 1rem !important; }
    .about-hero__trust { gap: 11px 18px; }
    .about-intro, .about-services, .about-care { padding-bottom: 78px; padding-top: 78px; }
    .about-intro__grid, .about-care__grid { grid-template-columns: 1fr; margin-top: 45px; }
    .about-intro__image-wrap, .about-care__visual { justify-self: center; max-width: 390px; }
    .about-stat-row { gap: 17px; grid-template-columns: 1fr; margin-top: 66px; }
    .about-stat-row div { border-bottom: 1px solid #d5d1c7; padding-bottom: 13px; }
    .about-values__heading, .about-section-heading--split, .about-cta__inner { align-items: flex-start; flex-direction: column; }
    .about-values__heading > p, .about-section-heading--split > p, .about-cta__action { max-width: 520px; }
    .about-values__grid, .about-service-grid { grid-template-columns: 1fr; }
    .about-value-card { min-height: 250px; }
    .about-service-card { min-height: 295px; }
    .about-care__visual { margin-bottom: 19px; }
    .about-cta__action { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .about-page *, .about-page *:before, .about-page *:after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
