.about-modern-page {
    --about-bg: #090b12;
    --about-panel: #11141d;
    --about-panel-soft: #151923;
    --about-text: #f6f7fb;
    --about-muted: #aeb4c2;
    --about-line: rgba(255,255,255,.11);
    --about-accent: #ff5a57;
    --about-accent-2: #ffb36b;
    background: var(--about-bg);
}

.about-modern-page #main-content { overflow: hidden; color: var(--about-text); background: var(--about-bg); }
.about-shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.about-section { padding: clamp(78px, 10vw, 132px) 0; }

.about-kicker {
    display: flex;
    gap: 10px;
    align-items: center;
    margin: 0 0 18px;
    color: var(--about-accent-2);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.about-kicker span { width: 28px; height: 2px; background: currentColor; }

.about-hero {
    position: relative;
    min-height: 760px;
    padding: 150px 0 90px;
    border-bottom: 1px solid var(--about-line);
    background:
        radial-gradient(circle at 76% 28%, rgba(255,90,87,.17), transparent 30%),
        radial-gradient(circle at 18% 80%, rgba(113,82,255,.1), transparent 27%),
        var(--about-bg);
}

.about-hero::before {
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 48px 48px;
    content: "";
    pointer-events: none;
}

.about-hero__grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr); gap: clamp(50px, 8vw, 110px); align-items: center; }
.about-breadcrumb { display: flex; gap: 10px; margin-bottom: 46px; color: var(--about-muted); font-size: 14px; }
.about-breadcrumb a { color: var(--about-text); text-decoration: none; }
.about-breadcrumb a:hover { color: var(--about-accent-2); }

.about-hero h1 {
    max-width: 760px;
    margin: 0;
    color: var(--about-text);
    font-size: clamp(48px, 7.2vw, 92px);
    font-weight: 750;
    letter-spacing: -.055em;
    line-height: .98;
}

.about-hero h1 em { color: var(--about-accent); font-family: Georgia, serif; font-weight: 400; }
.about-hero__lead { max-width: 680px; margin: 30px 0 0; color: var(--about-muted); font-size: clamp(18px, 2vw, 22px); line-height: 1.65; }
.about-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 38px; }

.about-button {
    display: inline-flex;
    min-height: 52px;
    gap: 12px;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    border: 1px solid var(--about-line);
    border-radius: 8px;
    color: var(--about-text);
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.about-button:hover { color: var(--about-text); border-color: rgba(255,255,255,.32); transform: translateY(-2px); }
.about-button--primary { border-color: var(--about-accent); background: var(--about-accent); color: #100909; }
.about-button--primary:hover { border-color: #ff7774; background: #ff7774; color: #100909; }
.about-button--ghost { background: rgba(255,255,255,.035); }

.about-proof { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); max-width: 720px; gap: 0; margin: 58px 0 0; padding: 0; list-style: none; }
.about-proof li { display: grid; gap: 7px; padding: 0 18px; border-left: 1px solid var(--about-line); }
.about-proof li:first-child { padding-left: 0; border-left: 0; }
.about-proof b { color: var(--about-accent); font-size: 12px; letter-spacing: .1em; }
.about-proof span { color: var(--about-muted); font-size: 14px; }

.about-hero__visual { position: relative; min-height: 535px; display: grid; place-items: center; }
.about-visual-card { position: relative; z-index: 2; width: min(100%, 470px); padding: 15px; border: 1px solid var(--about-line); border-radius: 38px; background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.025)); box-shadow: 0 40px 90px rgba(0,0,0,.4); transform: rotate(2deg); }
.about-visual-card::after { position: absolute; inset: 15px; border: 1px solid rgba(255,255,255,.1); border-radius: 28px; content: ""; pointer-events: none; }
.about-visual-card img { display: block; width: 100%; height: auto; border-radius: 27px; }
.about-visual-card__label { position: absolute; z-index: 2; top: 30px; left: 30px; padding: 8px 12px; border-radius: 999px; color: #fff; background: rgba(9,11,18,.78); backdrop-filter: blur(10px); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.about-orbit { position: absolute; border: 1px solid rgba(255,90,87,.25); border-radius: 50%; }
.about-orbit--one { width: 510px; height: 510px; }
.about-orbit--two { width: 400px; height: 400px; border-style: dashed; transform: rotate(35deg); }
.about-float-tag { position: absolute; z-index: 3; padding: 10px 14px; border: 1px solid var(--about-line); border-radius: 8px; background: rgba(17,20,29,.9); box-shadow: 0 14px 35px rgba(0,0,0,.25); color: var(--about-text); font-size: 13px; font-weight: 700; }
.about-float-tag--top { top: 82px; right: -12px; }
.about-float-tag--bottom { bottom: 58px; left: -22px; }

.about-focus { border-bottom: 1px solid var(--about-line); background: #0d1018; }
.about-focus__grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.about-focus span { padding: 23px 15px; border-left: 1px solid var(--about-line); color: var(--about-muted); text-align: center; font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.about-focus span:last-child { border-right: 1px solid var(--about-line); }

.about-story__grid { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: clamp(50px,9vw,130px); }
.about-section-heading h2, .about-values h2, .about-cta h2 { margin: 0; color: var(--about-text); font-size: clamp(38px,5vw,64px); letter-spacing: -.045em; line-height: 1.08; }
.about-story__copy { padding-top: 6px; }
.about-story__copy p { color: var(--about-muted); font-size: 18px; line-height: 1.82; }
.about-story__copy .about-story__lead { color: var(--about-text); font-size: clamp(21px,2.2vw,27px); line-height: 1.55; }

.about-capabilities { background: #0d1018; border-block: 1px solid var(--about-line); }
.about-section-heading--row { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(280px,.7fr); gap: 60px; align-items: end; margin-bottom: 55px; }
.about-section-heading--row > p { margin: 0; color: var(--about-muted); font-size: 18px; line-height: 1.7; }
.about-capability-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-top: 1px solid var(--about-line); border-left: 1px solid var(--about-line); }
.about-capability { position: relative; min-height: 290px; padding: 30px; border-right: 1px solid var(--about-line); border-bottom: 1px solid var(--about-line); color: var(--about-text); background: rgba(255,255,255,.015); text-decoration: none; transition: background .25s ease; }
.about-capability:hover { color: var(--about-text); background: rgba(255,90,87,.075); }
.about-capability > span { color: var(--about-accent); font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.about-capability h3 { margin: 66px 0 13px; color: var(--about-text); font-size: 25px; }
.about-capability p { margin: 0; color: var(--about-muted); font-size: 16px; line-height: 1.65; }
.about-capability i { position: absolute; top: 27px; right: 28px; font-size: 25px; font-style: normal; transition: transform .2s ease; }
.about-capability:hover i { transform: translate(3px,-3px); }

.about-section-heading--center { max-width: 740px; margin: 0 auto 60px; text-align: center; }
.about-section-heading--center .about-kicker { justify-content: center; }
.about-section-heading--center > p:last-child { margin: 22px auto 0; color: var(--about-muted); font-size: 18px; }
.about-process-list { position: relative; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.about-process-list::before { position: absolute; top: 27px; right: 12%; left: 12%; height: 1px; background: linear-gradient(90deg,var(--about-accent),rgba(255,179,107,.3)); content: ""; }
.about-process-list li { position: relative; z-index: 1; margin: 0; }
.about-process-list li > span { display: grid; width: 55px; height: 55px; margin-bottom: 26px; place-items: center; border: 1px solid var(--about-accent); border-radius: 50%; color: #130808; background: var(--about-accent); font-size: 12px; font-weight: 900; }
.about-process-list h3 { margin: 0 0 12px; color: var(--about-text); font-size: 22px; }
.about-process-list p { margin: 0; color: var(--about-muted); font-size: 16px; line-height: 1.65; }

.about-values { background: #0d1018; border-top: 1px solid var(--about-line); }
.about-values__grid { display: grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(55px,9vw,130px); align-items: start; }
.about-values__intro { position: sticky; top: 120px; }
.about-values__intro > p:not(.about-kicker) { margin: 25px 0; color: var(--about-muted); font-size: 18px; line-height: 1.75; }
.about-values__intro > a { color: var(--about-accent-2); font-weight: 800; text-decoration: none; }
.about-value-list { border-top: 1px solid var(--about-line); }
.about-value-list article { display: grid; grid-template-columns: 58px 1fr; gap: 20px; padding: 27px 0; border-bottom: 1px solid var(--about-line); }
.about-value-list article > span { color: var(--about-accent); font-size: 12px; font-weight: 900; }
.about-value-list h3 { margin: 0 0 8px; color: var(--about-text); font-size: 23px; }
.about-value-list p { margin: 0; color: var(--about-muted); font-size: 16px; line-height: 1.65; }

.about-cta { padding: clamp(75px,10vw,125px) 0; background: radial-gradient(circle at 85% 50%,rgba(255,90,87,.18),transparent 30%),linear-gradient(120deg,#171119,#0b1018); }
.about-cta__inner { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(300px,.75fr); gap: clamp(50px,8vw,100px); align-items: end; }
.about-cta__inner > div:last-child p { margin: 0 0 25px; color: var(--about-muted); font-size: 18px; line-height: 1.7; }

.active-light-mode.about-modern-page { --about-bg:#f7f7fa; --about-panel:#fff; --about-panel-soft:#f0f1f5; --about-text:#171922; --about-muted:#616675; --about-line:rgba(20,22,30,.13); }
.active-light-mode.about-modern-page #main-content { background: var(--about-bg); }
.active-light-mode .about-hero { background: radial-gradient(circle at 76% 28%,rgba(255,90,87,.14),transparent 30%),var(--about-bg); }
.active-light-mode .about-focus, .active-light-mode .about-capabilities, .active-light-mode .about-values { background: #f0f1f5; }
.active-light-mode .about-visual-card { background: rgba(255,255,255,.65); }
.active-light-mode .about-float-tag { background: rgba(255,255,255,.92); }

@media (max-width: 991px) {
    .about-hero { min-height: auto; padding-top: 125px; }
    .about-hero__grid, .about-story__grid, .about-values__grid, .about-cta__inner { grid-template-columns: 1fr; }
    .about-hero__visual { width: min(100%,560px); min-height: 520px; margin-inline: auto; }
    .about-section-heading--row { grid-template-columns: 1fr; gap: 22px; }
    .about-capability-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .about-process-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 38px 25px; }
    .about-process-list::before { display: none; }
    .about-values__intro { position: static; }
}

@media (max-width: 767px) {
    .about-shell { width: min(100% - 28px,1180px); }
    .about-section { padding: 72px 0; }
    .about-hero { padding: 112px 0 65px; }
    .about-breadcrumb { margin-bottom: 34px; }
    .about-hero h1 { font-size: clamp(43px,13vw,62px); }
    .about-proof { grid-template-columns: 1fr; gap: 18px; margin-top: 42px; }
    .about-proof li, .about-proof li:first-child { padding: 0 0 0 15px; border-left: 1px solid var(--about-line); }
    .about-hero__visual { min-height: 420px; }
    .about-visual-card { width: min(88vw,390px); border-radius: 28px; }
    .about-orbit--one { width: 390px; height: 390px; }
    .about-orbit--two { width: 310px; height: 310px; }
    .about-float-tag--top { top: 38px; right: 0; }
    .about-float-tag--bottom { bottom: 28px; left: 0; }
    .about-focus__grid { grid-template-columns: repeat(2,1fr); }
    .about-focus span { border-bottom: 1px solid var(--about-line); }
    .about-focus span:last-child { grid-column: 1/-1; }
    .about-capability-grid, .about-process-list { grid-template-columns: 1fr; }
    .about-capability { min-height: 245px; }
    .about-capability h3 { margin-top: 45px; }
    .about-section-heading--center { text-align: left; }
    .about-section-heading--center .about-kicker { justify-content: flex-start; }
    .about-process-list li { display: grid; grid-template-columns: 55px 1fr; gap: 18px; }
    .about-process-list li > span { margin: 0; }
}

@media (max-width: 420px) {
    .about-actions .about-button { width: 100%; }
    .about-hero__visual { min-height: 360px; }
    .about-float-tag { font-size: 11px; }
    .about-orbit--one { width: 330px; height: 330px; }
    .about-orbit--two { width: 265px; height: 265px; }
}

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