/* About Us-only sections: welcome, our story, why us, what we provide, our mission, testimonials, contact. */

/* ===== welcome ===== */
.welcome-wrap { display: grid; grid-template-columns: 1.05fr .95fr; gap: 64px; align-items: center; }
.welcome-tag { font: 600 16.5px/1.5 var(--body); font-style: italic; color: var(--gold); margin: 0 0 20px; }
.welcome-wrap p { color: var(--slate); font: 400 16px/1.72 var(--body); margin: 0 0 16px; }
@media (max-width: 760px) {
	.welcome-wrap { grid-template-columns: 1fr; gap: 36px; }
}

/* ===== our story (shares .about/.about-media/.checklist with the homepage) ===== */
.bespoke-define { text-align: right; margin: 0 0 18px; }
.bespoke-define b { font: 700 30px var(--heading); color: #c3c9d4; display: block; letter-spacing: -.01em; }
.bespoke-define p { font: 400 13.5px/1.6 var(--body); color: var(--slate); margin-top: 2px; }
.bespoke-define .pos { color: var(--gold); font-weight: 700; font-style: italic; }
@media (max-width: 760px) {
	.bespoke-define { text-align: left; }
}

/* ===== what we provide ===== */
.provide-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px; }
.provide-col { padding-right: 20px; }
.provide-col:not(:last-child) { border-right: 1px solid var(--line); }
.provide-col h3 { font: 700 20px var(--heading); color: var(--navy); margin: 0 0 12px; }
.provide-col p { font: 400 15px/1.7 var(--body); color: var(--slate); margin: 0; }
@media (max-width: 760px) {
	.provide-grid { grid-template-columns: 1fr; gap: 32px; }
	.provide-col { border-right: 0 !important; padding-right: 0; }
}

/* ===== our mission (team-grid) ===== */
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; align-items: start; }
.mission-team-grid { grid-template-columns: repeat(2, 1fr); align-items: stretch; }
.mission-team-grid .team-card.t-light { margin-top: 0; }
.team-card { position: relative; border-radius: 22px; padding: 40px 30px 34px; overflow: hidden; transition: transform .4s cubic-bezier(.16, 1, .3, 1), box-shadow .4s cubic-bezier(.16, 1, .3, 1); }
.team-card.t-light { background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-md); margin-top: 40px; }
.team-card.t-dark { background: linear-gradient(160deg, var(--navy), var(--navy-deep)); box-shadow: var(--shadow-lg); }
.team-card:hover { transform: translateY(-8px); }
.team-ic { width: 64px; height: 64px; border-radius: 18px; display: flex; align-items: center; justify-content: center; margin-bottom: 22px; position: relative; z-index: 1; transition: transform .4s cubic-bezier(.16, 1, .3, 1); }
.team-card:hover .team-ic { transform: rotate(-6deg) scale(1.06); }
.t-light .team-ic { background: rgba(214, 164, 58, .14); color: var(--navy); }
.t-dark .team-ic { background: rgba(214, 164, 58, .2); color: var(--gold-soft); }
.team-role { display: inline-block; font: 700 11px var(--body); letter-spacing: .13em; text-transform: uppercase; padding: 5px 11px; border-radius: 999px; margin-bottom: 13px; position: relative; z-index: 1; }
.t-light .team-role { color: var(--gold); background: rgba(214, 164, 58, .12); }
.t-dark .team-role { color: var(--gold-soft); background: rgba(255, 255, 255, .08); }
.team-card h3 { font: 700 21px var(--heading); margin: 0 0 10px; position: relative; z-index: 1; }
.t-light h3 { color: var(--navy); }
.t-dark h3 { color: #fff; }
.team-card p { font: 400 15px/1.65 var(--body); margin: 0; position: relative; z-index: 1; }
.t-light p { color: var(--slate); }
.t-dark p { color: #c9d3e5; }
@media (max-width: 980px) {
	.team-grid { grid-template-columns: 1fr; gap: 18px; }
	.team-card.t-light { margin-top: 0; }
}

/* ===== testimonials (dark editorial) ===== */
.tst { background: linear-gradient(160deg, var(--navy), var(--navy-deep)); color: #fff; position: relative; overflow: hidden; }
.tst:before { content: ''; position: absolute; top: -90px; right: -70px; width: 320px; height: 320px; border-radius: 50%; background: rgba(214, 164, 58, .1); }
.tst .wrap { position: relative; }
.tst-lead { max-width: 640px; margin: 0 auto 44px; text-align: center; }
.tst-lead h2 { color: #fff; }
.tst-feature { max-width: 880px; margin: 0 auto 44px; text-align: center; }
.tst-mark { font: 800 120px var(--heading); color: rgba(235, 207, 134, .24); line-height: .7; display: block; margin-bottom: 2px; }
.tst-feature blockquote { font: 600 clamp(22px, 2.6vw, 31px)/1.42 var(--heading); color: #fff; margin: 0 0 24px; letter-spacing: -.01em; text-wrap: balance; }
.tst-stars { display: flex; gap: 4px; justify-content: center; margin-bottom: 16px; }
.tst-author { font: 700 16px var(--body); color: var(--gold-soft); }
.tst-author span { display: block; font: 500 13.5px var(--body); color: #aab5c9; margin-top: 3px; }
.tst-row { display: flex; gap: 30px; overflow-x: auto; overflow-y: hidden; border-top: 1px solid rgba(255, 255, 255, .12); padding: 42px 4px 14px; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--gold) rgba(255, 255, 255, .15); }
.tst-mini { flex: 0 0 320px; scroll-snap-align: start; border-left: 2px solid var(--gold); padding-left: 22px; }
.tst-mini p { font: 400 15px/1.62 var(--body); color: #cdd6e6; margin: 0 0 14px; }
.tst-mini b { font: 700 14.5px var(--body); color: #fff; display: block; }
.tst-mini span { font: 500 12.5px var(--body); color: #8fa0bd; }

/* ===== about contact ===== */
.abt-contact .wrap { display: grid; grid-template-columns: .82fr 1.18fr; gap: 52px; align-items: center; }
.abt-points { display: flex; flex-direction: column; gap: 16px; margin-top: 28px; }
.abt-point { display: flex; gap: 16px; align-items: center; }
.abt-point-ic { width: 52px; height: 52px; border-radius: 14px; background: #fff; border: 1px solid var(--line); color: var(--gold); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.abt-point b { display: block; font: 700 15px var(--heading); color: var(--navy); }
.abt-point span { font: 500 14px var(--body); color: var(--slate); }
.abt-social { margin-top: 28px; }
.abt-social-label { display: block; font: 700 13px var(--body); color: var(--navy); letter-spacing: .04em; margin-bottom: 12px; }
.abt-social-row { display: flex; gap: 12px; }
.abt-social-row a { width: 44px; height: 44px; border-radius: 12px; background: #fff; border: 1px solid var(--line); display: flex; align-items: center; justify-content: center; color: var(--navy); transition: transform .25s, background .25s, color .25s, border-color .25s; }
.abt-social-row a:hover { background: var(--gold); color: #fff; transform: translateY(-3px); border-color: var(--gold); }
@media (max-width: 980px) {
	.abt-contact .wrap { grid-template-columns: 1fr; gap: 36px; }
}