/* =========================================================
   EVANTU ABOUT US — SPACIOUS CORPORATE DESIGN
   Desktop hero deliberately shorter than the homepage.
========================================================= */
:root {
    --a-navy:#02172f; --a-blue:#075eae; --a-cyan:#24b7f2;
    --a-red:#e31b2f; --a-text:#10233f; --a-muted:#61748b;
    --a-border:#dbe7f2; --a-bg:#f4f9fd; --a-width:1320px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; color:var(--a-text); font-family:Inter,"Segoe UI",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
img { display:block; max-width:100%; }
a { color:inherit; }
.about-main { width:100%; overflow:clip; }
.about-wrap { width:min(calc(100% - 64px),var(--a-width)); margin-inline:auto; }
.about-section { padding:100px 0; }
.about-section--soft { background:var(--a-bg); }
.about-section--blue { background:linear-gradient(125deg,#edf7ff 0%,#fff 100%); }
.about-eyebrow { display:inline-flex; align-items:center; gap:11px; margin:0 0 17px; color:var(--a-blue); font-size:.77rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.about-eyebrow::before { content:""; width:27px; height:3px; background:var(--a-red); }
.about-title { max-width:850px; margin:0 0 25px; color:var(--a-navy); font-size:clamp(2.2rem,3.5vw,3.8rem); font-weight:850; letter-spacing:-.045em; line-height:1.09; }
.about-lead { max-width:850px; margin:0; color:var(--a-muted); font-size:1.08rem; line-height:1.85; }
.about-prose { color:var(--a-muted); font-size:1rem; line-height:1.85; }
.about-prose p { margin:0 0 21px; }
.about-prose p:last-child { margin-bottom:0; }
.about-section-head { max-width:950px; margin-bottom:42px; }
.about-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:76px; }
.about-split--wide { grid-template-columns:1.05fr .95fr; }
.about-photo { width:100%; max-height:560px; object-fit:cover; border-radius:17px; box-shadow:0 22px 55px rgba(2,23,47,.14); }
.about-button { display:inline-flex; align-items:center; justify-content:center; min-height:51px; padding:0 25px; border:1px solid transparent; border-radius:7px; background:var(--a-blue); color:#fff; font-size:.88rem; font-weight:750; text-decoration:none; transition:transform .2s,background .2s,box-shadow .2s; }
.about-button:hover { transform:translateY(-2px); background:#0b83ce; box-shadow:0 9px 24px rgba(5,90,170,.2); }
.about-button--outline { border-color:rgba(255,255,255,.65); background:rgba(2,23,47,.25); }
.about-button--outline:hover { background:rgba(255,255,255,.13); }

/* HERO — short desktop, portrait mobile */
.about-hero { position:relative; isolation:isolate; display:flex; align-items:center; min-height:430px; color:#fff; background-color:var(--a-navy); background-image:linear-gradient(90deg,rgba(2,18,43,.97) 0%,rgba(2,23,47,.90) 31%,rgba(2,31,70,.54) 55%,rgba(2,31,70,.12) 100%),url('/img/about-us/hero.jpg'); background-position:center,center; background-size:cover; background-repeat:no-repeat; }
.about-hero__inner { position:relative; z-index:1; padding:55px 0 65px; }
.about-hero__breadcrumb { margin-bottom:23px; color:#bed5e8; font-size:.8rem; }
.about-hero__breadcrumb a { color:#fff; text-decoration:none; }
.about-hero__eyebrow { color:#8ddfff; }
.about-hero h1 { max-width:760px; margin:0; font-size:clamp(2.8rem,4.8vw,4.9rem); font-weight:900; line-height:1; letter-spacing:-.052em; text-transform:uppercase; }
.about-hero h1 span { display:block; color:#36c5ff; }
.about-hero__text { max-width:680px; margin:20px 0 0; color:#e3eef8; font-size:1.03rem; line-height:1.7; }
.about-hero__actions { display:flex; flex-wrap:wrap; gap:13px; margin-top:26px; }
.about-hero::after { position:absolute; bottom:0; left:0; right:0; height:5px; content:""; background:linear-gradient(90deg,var(--a-red) 0 18%,var(--a-cyan) 18%); }

/* CORPORATE CONTENT */
.about-statement { margin:29px 0 0; padding:23px 26px; border-left:4px solid var(--a-red); background:#edf6ff; color:var(--a-navy); font-size:1.2rem; font-weight:800; line-height:1.55; }
.about-grid3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:23px; }
.about-panel { padding:34px 31px; border:1px solid var(--a-border); border-radius:13px; background:#fff; box-shadow:0 8px 24px rgba(2,23,47,.035); }
.about-panel h3 { margin:0 0 15px; color:var(--a-navy); font-size:1.2rem; }
.about-panel p { margin:0; color:var(--a-muted); font-size:.94rem; line-height:1.78; }
.about-panel--accent { border-top:4px solid var(--a-blue); }
.about-panel--accent:nth-child(2) { border-top-color:var(--a-red); }
.about-panel--accent:nth-child(3) { border-top-color:var(--a-cyan); }
.about-goals { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:27px 34px; margin-top:43px; }
.about-goal { display:flex; gap:13px; align-items:flex-start; }
.about-goal::before { content:"✓"; color:var(--a-blue); font-size:1.25rem; font-weight:900; }
.about-goal strong { display:block; margin-bottom:7px; color:var(--a-navy); font-size:.97rem; }
.about-goal small { display:block; color:var(--a-muted); font-size:.86rem; line-height:1.7; }
.about-evolution { display:flex; flex-wrap:wrap; gap:10px; margin-top:29px; }
.about-evolution span { padding:11px 14px; border:1px solid #cddfec; border-radius:7px; background:#f7fbff; color:var(--a-navy); font-size:.8rem; font-weight:750; }
.about-evolution span:not(:last-child)::after { content:' →'; color:var(--a-red); }
.about-quote { margin-top:29px; padding:24px 28px; border-left:4px solid var(--a-red); background:#f3f9ff; color:var(--a-navy); font-size:1rem; line-height:1.75; font-weight:650; }
.about-process { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:17px; }
.about-process__item { min-height:138px; padding:26px 23px; border:1px solid var(--a-border); border-radius:11px; background:#fff; }
.about-process__item span { display:block; margin-bottom:21px; color:var(--a-blue); font-size:.85rem; font-weight:900; }
.about-process__item strong { display:block; color:var(--a-navy); font-size:.98rem; line-height:1.45; }
.about-process-tagline { margin:40px 0 0; color:var(--a-navy); font-size:1.28rem; font-weight:850; text-align:center; }
.about-questions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.about-question { display:flex; align-items:center; min-height:83px; padding:18px 21px; border-left:4px solid var(--a-blue); background:#fff; color:var(--a-navy); font-size:.94rem; font-weight:700; box-shadow:0 5px 20px rgba(2,23,47,.04); }
.about-tags { display:flex; flex-wrap:wrap; gap:13px; }
.about-tag { padding:15px 20px; border:1px solid var(--a-border); border-radius:8px; background:#fff; color:var(--a-navy); font-size:.9rem; font-weight:650; }
.about-region-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:23px; margin:35px 0; }
.about-region { min-height:165px; padding:31px; border-top:4px solid var(--a-blue); border-radius:9px; background:#fff; box-shadow:0 9px 25px rgba(2,23,47,.05); }
.about-region strong { display:block; margin-bottom:15px; color:var(--a-navy); font-size:1.1rem; }
.about-region p { margin:0; color:var(--a-muted); font-size:.94rem; line-height:1.75; }
.about-values { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }
.about-values .about-panel { padding:28px 22px; }
.about-values .about-panel h3 { font-size:1.04rem; }
.about-values .about-panel p { font-size:.86rem; }
.about-support { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px; margin-top:34px; }
.about-support article { padding:25px; border-left:4px solid var(--a-cyan); background:#fff; }
.about-support h3 { margin:0 0 12px; color:var(--a-navy); font-size:1.04rem; }
.about-support p { margin:0; color:var(--a-muted); font-size:.88rem; line-height:1.7; }
.about-cta { padding:92px 0; background:linear-gradient(120deg,#02172f,#06477d); color:#fff; }
.about-cta__inner { display:flex; align-items:center; justify-content:space-between; gap:45px; }
.about-cta h2 { margin:0 0 20px; font-size:clamp(2.2rem,3.2vw,3.5rem); line-height:1.1; letter-spacing:-.04em; }
.about-cta p { max-width:780px; margin:0; color:#cbddec; font-size:1rem; line-height:1.8; }
.about-cta__actions { display:flex; flex-wrap:wrap; gap:12px; flex-shrink:0; }
.about-cta .about-eyebrow { color:#8ddfff; }
@media(max-width:1100px) {
    .about-section { padding:80px 0; }
    .about-split { gap:40px; }
    .about-process { grid-template-columns:repeat(3,1fr); }
    .about-values { grid-template-columns:repeat(3,1fr); }
    .about-goals { grid-template-columns:repeat(2,1fr); }
    .about-cta__inner { align-items:flex-start; flex-direction:column; }
}
@media(max-width:750px) {
    .about-wrap { width:min(calc(100% - 36px),var(--a-width)); }
    .about-section { padding:68px 0; }
    .about-hero { min-height:600px; align-items:flex-end; background-image:linear-gradient(0deg,rgba(2,18,43,.98) 0%,rgba(2,31,70,.88) 30%,rgba(2,31,70,.30) 74%,rgba(2,31,70,.12) 100%),url('/img/about-us/hero-mobile.jpg'); background-position:center,center top; }
    .about-hero__inner { padding:110px 0 48px; }
    .about-hero h1 { max-width:560px; font-size:clamp(2.5rem,8vw,4rem); }
    .about-hero__text { font-size:.96rem; }
    .about-title { font-size:clamp(2rem,6vw,3rem); }
    .about-split,.about-split--wide { grid-template-columns:1fr; gap:32px; }
    .about-grid3,.about-region-grid { grid-template-columns:1fr; }
    .about-goals,.about-questions,.about-support { grid-template-columns:1fr; }
    .about-process { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .about-values { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .about-photo { max-height:470px; }
    .about-region { min-height:auto; }
    .about-cta { padding:72px 0; }
}
@media(max-width:440px) {
    .about-hero { min-height:590px; }
    .about-hero h1 { font-size:2.45rem; }
    .about-hero__actions,.about-cta__actions { width:100%; }
    .about-hero__actions .about-button,.about-cta__actions .about-button { flex:1 1 100%; }
    .about-panel { padding:27px 24px; }
    .about-values { grid-template-columns:1fr; }
    .about-process__item { min-height:125px; padding:21px 17px; }
}
@media(prefers-reduced-motion:reduce) {
    html { scroll-behavior:auto; }
    *,*::before,*::after { transition:none!important; animation:none!important; }
}

/* DISTINCTIVE ABOUT-US EDITORIAL COMPONENTS */
.about-story { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:75px; align-items:start; }
.about-story__aside { padding:35px; background:#f0f7fd; border-top:4px solid var(--a-red); border-radius:12px; }
.about-story__aside strong { display:block; margin-bottom:16px; color:var(--a-navy); font-size:1.35rem; }
.about-story__aside p { color:var(--a-muted); line-height:1.85; }
.about-principles { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.about-principle { padding:36px; border:1px solid var(--a-border); border-radius:12px; background:#fff; }
.about-principle__number { color:var(--a-blue); font-size:.85rem; font-weight:800; }
.about-principle h3 { margin:18px 0 13px; color:var(--a-navy); font-size:1.32rem; }
.about-principle p { margin:0; color:var(--a-muted); line-height:1.8; }
.about-pullquote { margin:0; padding:40px 45px; border-left:5px solid var(--a-red); background:#edf6ff; color:var(--a-navy); font-size:clamp(1.4rem,2.4vw,2.2rem); font-weight:750; line-height:1.5; }
.about-commitments { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.about-commitment { padding:30px; background:#fff; border-top:3px solid var(--a-blue); box-shadow:0 8px 26px rgba(2,23,47,.05); }
.about-commitment h3 { margin:0 0 12px; color:var(--a-navy); }
.about-commitment p { margin:0; color:var(--a-muted); line-height:1.75; }
.about-note { margin-top:25px; color:var(--a-muted); font-size:.92rem; line-height:1.7; }
@media(max-width:800px) { .about-story { grid-template-columns:1fr; gap:30px; } .about-commitments { grid-template-columns:1fr; } }
@media(max-width:650px) { .about-principles { grid-template-columns:1fr; } .about-principle,.about-story__aside { padding:27px; } .about-pullquote { padding:28px; } }

/* =========================================================
   HERO SECTION DIRECTORY
   Desktop right column, mobile below introduction.

   Changes from previous version:
   - .about-hero__directory-title now uses #8ddfff to
     match the homepage "On This Page" colour.
   - All menu links are rendered at a uniform weight
     (font-weight: 700) with equal line-height and
     padding so no link appears heavier than another.
========================================================= */

.about-hero__inner {
    display:grid;
    grid-template-columns:minmax(0,1fr) 295px;
    gap:42px;
    align-items:center;
}
.about-hero__copy { min-width:0; }
.about-hero h1 { font-size:clamp(2.3rem,3.5vw,3.8rem); }

.about-hero__directory {
    padding: 24px 26px;
    border: none;
    border-left: 1px solid var(--a-red);
    border-radius: 12px;
    background: rgba(2, 23, 47, 0.82);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* On This Page label — matches homepage cyan */
.about-hero__directory-title {
    margin: 0 0 22px;
    color: #8ddfff;
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .12em;
    text-transform: uppercase;
}

/* All directory links — uniform weight and rhythm */
.about-hero__directory a {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 43px;
    padding: 11px 0;
    border-bottom: 1px solid rgba(255,255,255,.16);
    color: #fff;
    font-size: .88rem;
    font-weight: 700;
    line-height: 1.45;
    text-decoration: none;
    transition: color .2s ease, padding-left .2s ease;
}
.about-hero__directory a::before {
    content: "";
    width: 13px;
    height: 3px;
    flex: 0 0 13px;
    border-radius: 2px;
    background: var(--a-red);
}
.about-hero__directory a:last-child { border-bottom: 0; }
.about-hero__directory a:hover,
.about-hero__directory a:focus-visible {
    color: #8ddfff;
    padding-left: 5px;
}
.about-hero__directory a:focus-visible {
    outline: 2px solid #8ddfff;
    outline-offset: 3px;
}

.about-section[id] { scroll-margin-top: 100px; }

@media(max-width:900px) {
    .about-hero__directory { padding: 24px; }
    .about-hero__inner { grid-template-columns: 1fr; gap: 25px; }
    .about-hero__directory { width: 100%; }
    .about-hero__directory nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 20px;
    }
}
@media(max-width:750px) {
    .about-hero__inner { padding: 90px 0 36px; }
    .about-hero { min-height: unset; }
    .about-hero h1 { font-size: clamp(2.1rem, 7vw, 3.2rem); }
}
@media(max-width:440px) {
    .about-hero { min-height: unset; }
    .about-hero__directory nav { grid-template-columns: 1fr; }
}
/* SEO conversion enhancements and accessibility */
.about-button:focus-visible{outline:3px solid #ffcb3d;outline-offset:4px}
.about-service-links{display:flex;flex-wrap:wrap;gap:12px;margin-top:25px}
.about-service-links a{color:var(--a-blue);font-weight:750;text-underline-offset:4px}
.about-service-links a:hover{color:var(--a-red)}
.about-cta__actions{align-items:center}
@media(max-width:750px){.about-service-links{gap:15px}}