/* Website layout on top of the A — Tessera design system (design-system/css: tokens, base, components). */

html { scroll-behavior: smooth; scroll-padding-top: 84px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { overflow-x: hidden; }
#main:focus { outline: none; }

.wrap { width: 100%; max-width: calc(var(--container) + 2 * clamp(20px, 5vw, 64px)); margin: 0 auto; padding: 0 clamp(20px, 5vw, 64px); }

/* Header */
.hdr { position: sticky; top: 0; z-index: 50; background: color-mix(in srgb, var(--paper) 94%, transparent); border-bottom: 1px solid var(--line); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.hdr__in { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 68px; }
.hdr__nav { display: flex; align-items: center; gap: 28px; }
.hdr__links { display: flex; gap: 22px; list-style: none; }
.hdr__links a { position: relative; display: inline-block; padding: 8px 0; font-size: 15px; font-weight: 500; text-decoration: none; color: var(--ink); }
.hdr__links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 2px; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform var(--dur-ui) var(--ease-settle); }
.hdr__links a:hover::after { transform: scaleX(1); }
.hdr__toggle { display: none; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); font: 600 15px/1 var(--font-sans); cursor: pointer; }
.hdr__toggle-icon { position: relative; width: 16px; height: 2px; background: currentColor; }
.hdr__toggle-icon::before, .hdr__toggle-icon::after { content: ""; position: absolute; left: 0; width: 16px; height: 2px; background: currentColor; }
.hdr__toggle-icon::before { top: -5px; } .hdr__toggle-icon::after { top: 5px; }
.menu-open .hdr__toggle-icon { background: transparent; }
.menu-open .hdr__toggle-icon::before { top: 0; transform: rotate(45deg); }
.menu-open .hdr__toggle-icon::after { top: 0; transform: rotate(-45deg); }

/* Language selector */
.lang { display: flex; gap: 3px; list-style: none; }
.lang__link { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 36px; padding: 0 10px; border: 1px solid var(--line-strong); font: 400 13px/1 var(--font-mono); letter-spacing: .06em; color: var(--ink); text-decoration: none; background: var(--surface); }
.lang__link:hover { border-color: var(--ink); }
.lang--bar { display: none; }
.lang__link[aria-current="true"] { background: var(--ink); border-color: var(--ink); color: var(--ink-inverse); }

/* Hero */
.hero { padding: clamp(48px, 7vw, 96px) 0 0; }
.hero__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }
.hero__text { grid-column: 1 / span 7; display: grid; gap: 24px; align-content: start; }
.hero__name { display: grid; gap: 2px; font-weight: 600; font-size: 20px; letter-spacing: -.012em; }
.hero__role { font-weight: 400; font-size: 16px; color: var(--muted); letter-spacing: 0; }
.hero__title { max-width: 17ch; }
.hero__lead { max-width: 56ch; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.hero__art { grid-column: 9 / -1; grid-row: 1; min-height: 420px; margin-right: calc(-1 * clamp(20px, 5vw, 64px)); overflow: hidden; }
.hero__facts { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; list-style: none; margin-top: clamp(48px, 6vw, 80px); }
.model { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; row-gap: 28px; margin-top: clamp(56px, 7vw, 96px); padding-top: 40px; padding-bottom: clamp(64px, 8vw, 112px); border-top: 3px solid var(--ink); }
.model__head { grid-column: 1 / span 5; display: grid; gap: 12px; align-content: start; }
.model__intro { color: var(--muted); font-size: 16px; max-width: 48ch; }
.model__flow { grid-column: 1 / -1; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.model__flow .t-flow__tile:nth-child(-n+2) { background: var(--surface); color: var(--ink); outline: 1px solid var(--line-strong); outline-offset: -1px; }
.model__flow .t-flow__tile:nth-child(-n+2) .t-flow__n, .model__flow .t-flow__tile:nth-child(-n+2) .t-flow__text { color: var(--muted); opacity: 1; }
.model__flow .t-flow__tile:nth-child(3) { background: var(--graphite); color: var(--on-graphite); }

/* Sections */
.sec { padding: clamp(64px, 8vw, 112px) 0; border-top: 1px solid var(--line); }
.sec--tint { background: var(--surface-2); border-top: 0; }
.sec--tint .t-card, .sec--tint .uc { background: var(--surface); }
.s-head { display: grid; gap: 16px; align-content: start; max-width: 760px; margin-bottom: clamp(36px, 4vw, 56px); }
.s-head__intro { color: var(--muted); font-size: 18px; line-height: 1.55; max-width: 60ch; }
.sec--tint .s-head__intro { color: var(--muted); }
.sec__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; row-gap: 32px; }
.sec__grid > .s-head { grid-column: 1 / span 4; margin-bottom: 0; }
.legend { display: flex; flex-wrap: wrap; gap: 8px 24px; list-style: none; margin-top: 4px; }

/* Profile */
.profile__body { grid-column: 5 / span 5; display: grid; gap: 18px; }
.profile__facts { grid-column: 10 / -1; display: grid; gap: 28px; align-content: start; padding-left: 24px; border-left: 1px solid var(--line); }
.profile__facts h3 { margin-bottom: 10px; }
.profile__list { list-style: none; display: grid; gap: 8px; font-size: 15px; line-height: 1.45; }
.profile__list li { padding-left: 16px; position: relative; }
.profile__list li::before { content: ""; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; background: var(--ink); }
.profile__lang { font-size: 15px; }

/* Challenges */
.ch-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 32px; list-style: none; }
.ch { display: grid; gap: 10px; align-content: start; padding-top: 16px; border-top: 3px solid var(--ink); }
.ch__n { font-size: 12px; color: var(--muted); }
.ch__problem { color: var(--muted); font-size: 16px; line-height: 1.55; }
.ch__fix { font-size: 16px; line-height: 1.55; }
.ch__fix .t-label { display: block; margin-bottom: 4px; color: var(--smalto-deep); }

/* Capabilities */
.cap-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; list-style: none; }
.cap { gap: 14px; }
.cap--applied { border-style: dashed; border-color: var(--line-strong); }
.cap__text { font-size: 16px; line-height: 1.55; }
.cap__rel { font-size: 15px; line-height: 1.5; color: var(--muted); }
.cap__rel .t-label { display: block; margin-bottom: 4px; color: var(--ink); }
.cap__ex { display: grid; gap: 8px; }
.tags { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; }

/* AI */
.ai-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px 32px; list-style: none; }
.ai-item { display: grid; gap: 10px; align-content: start; }
.ai-item p { color: var(--muted); font-size: 16px; line-height: 1.55; }
.autonomy { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; row-gap: 14px; margin-top: clamp(48px, 5vw, 72px); padding-top: 28px; border-top: 3px solid var(--ink); }
.autonomy > h3 { grid-column: 1 / span 4; }
.autonomy__scale { grid-column: 5 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; list-style: none; }
.autonomy__step { display: grid; gap: 6px; padding: 14px 16px; font-weight: 600; font-size: 15px; line-height: 1.3; }
.autonomy__step .t-data { font-weight: 400; font-size: 12px; opacity: .75; }
.autonomy__step--1 { background: var(--surface); outline: 1px solid var(--line-strong); outline-offset: -1px; }
.autonomy__step--2 { background: var(--surface-2); outline: 1px solid var(--line-strong); outline-offset: -1px; }
.autonomy__step--3 { background: var(--graphite); color: var(--on-graphite); }
.autonomy__step--4 { background: var(--ink); color: var(--ink-inverse); }
.autonomy__note { grid-column: 5 / -1; color: var(--muted); font-size: 15px; line-height: 1.55; max-width: 70ch; }
.basis { display: grid; gap: 10px; margin-top: 40px; padding: 24px 28px; border: 1px dashed var(--line-strong); max-width: 860px; }
.basis p { font-size: 16px; line-height: 1.55; }

/* Architecture */
#architecture .sec__grid > .s-head { grid-column: 1 / -1; max-width: 760px; }
.layers { grid-column: 1 / span 7; }
.layers__list { display: grid; gap: 3px; list-style: none; }
.layer { display: grid; grid-template-columns: 34% minmax(0, 1fr); align-items: stretch; gap: 3px; }
.layer__label { display: flex; align-items: center; padding: 14px 16px; background: var(--surface); color: var(--ink); outline: 1px solid var(--line); outline-offset: -1px; }
.layer__items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; list-style: none; }
.layer__items li { display: flex; align-items: center; padding: 14px 16px; background: var(--graphite); color: var(--on-graphite); font-size: 15px; font-weight: 500; }
.layer:first-child .layer__items li { background: var(--surface); color: var(--ink); outline: 1px solid var(--line-strong); outline-offset: -1px; }
.layer--ai .layer__label { box-shadow: inset 6px 0 0 var(--smalto); padding-left: 22px; font-weight: 400; }
.layer--ai .layer__items li { background: var(--ink); color: var(--ink-inverse); }
.arch-points { grid-column: 9 / -1; display: grid; gap: 24px; list-style: none; align-content: start; }
.arch-points li { display: grid; gap: 6px; padding-top: 14px; border-top: 1px solid var(--line-strong); }
.arch-points p { color: var(--muted); font-size: 15.5px; line-height: 1.55; }

/* Experience */
.sec__grid > .xp { grid-column: 5 / -1; }
#experience .sec__grid > .s-head { position: sticky; top: 100px; align-self: start; }
.xp { list-style: none; display: grid; }
.xp__item { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 24px; padding: 28px 0; border-top: 1px solid var(--line); }
.xp__item:first-child { padding-top: 0; border-top: 0; }
.xp__period { font-size: 14px; color: var(--muted); padding-top: 3px; }
.xp__body { display: grid; gap: 8px; }
.xp__body > p { font-size: 16px; line-height: 1.55; }
.xp__org { font: 400 13px/1.45 var(--font-mono); color: var(--muted); letter-spacing: .02em; }
.xp .tags { margin-top: 4px; }

/* Use cases */
.uc-list { display: grid; gap: 20px; list-style: none; }
.uc { display: grid; grid-template-columns: 1fr; gap: 22px; padding: 28px; border: 1px solid var(--line); background: var(--surface); }
.uc__head { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.1fr); gap: 10px 20px; align-items: baseline; }
@media screen and (max-width: 1000px) { .uc__head { grid-template-columns: 1fr; } }
.uc__n { font-size: 12px; color: var(--muted); }
.uc__evidence { display: grid; gap: 6px; font-size: 15px; line-height: 1.5; }
.uc__flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; list-style: none; }
.uc__flow > li { display: flex; flex-direction: column; gap: 8px; padding: 16px; background: var(--paper); outline: 1px solid var(--line); outline-offset: -1px; font-size: 15px; line-height: 1.5; }
.uc__flow .t-label { color: var(--muted); }
.uc__flow .uc__potential { outline: 1.5px dashed var(--line-strong); outline-offset: -1.5px; background: var(--surface); }
.uc__flow .uc__potential .t-evidence { margin-top: auto; }
.uc__flow .uc__outcome { background: var(--ink); color: var(--ink-inverse); outline: 0; }
.uc__flow .uc__outcome .t-label { color: inherit; opacity: .78; }

/* Process */
.process__flow { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.process__flow .t-flow__tile { min-height: 168px; }

/* Contact */
.contact { padding: clamp(64px, 8vw, 112px) 0; background: var(--ink); color: var(--ink-inverse); }
.contact__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; row-gap: 32px; align-items: end; }
.contact__text { grid-column: 1 / span 8; display: grid; gap: 20px; }
.contact .t-eyebrow { color: color-mix(in srgb, var(--ink-inverse) 75%, transparent); }
.contact__lead { font-size: 19px; line-height: 1.55; max-width: 56ch; color: color-mix(in srgb, var(--ink-inverse) 88%, transparent); }
.contact__act { grid-column: 9 / -1; display: grid; gap: 14px; justify-items: start; }
.contact__line { font: 400 14px/1.4 var(--font-mono); }
.contact__ph { padding: 6px 10px; border: 1px dashed color-mix(in srgb, var(--ink-inverse) 55%, transparent); font: 400 13.5px/1.4 var(--font-mono); color: color-mix(in srgb, var(--ink-inverse) 85%, transparent); }
.contact :focus-visible { outline-color: var(--smalto); }
.t-btn--ghost-inv { background: transparent; color: var(--ink-inverse); border-color: color-mix(in srgb, var(--ink-inverse) 60%, transparent); }
.t-btn--ghost-inv:hover { border-color: var(--ink-inverse); }

/* Footer */
.ftr { padding: 48px 0 40px; border-top: 1px solid var(--line); font-size: 14.5px; }
.ftr__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
.ftr__brand { grid-column: 1 / span 4; display: grid; gap: 10px; align-content: start; }
.ftr__role { color: var(--muted); }
.ftr__company { font-style: normal; color: var(--muted); line-height: 1.55; }
.ftr__company a { color: var(--ink); text-underline-offset: 3px; }
.ftr nav { grid-column: 5 / span 4; }
.ftr__links { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 24px; }
.ftr__links a { display: inline-block; padding: 4px 0; text-decoration: none; }
.ftr__links a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ftr__meta { grid-column: 9 / -1; display: grid; gap: 12px; align-content: start; justify-items: start; color: var(--muted); }

/* Root language gate and 404 */
.gate { min-height: 100vh; display: grid; place-content: center; justify-items: start; gap: 24px; padding: 40px 24px; }
.gate__links { display: flex; flex-wrap: wrap; gap: 12px; list-style: none; }

/* Laptop / tablet */
@media screen and (max-width: 1120px) {
  .hdr__toggle { display: inline-flex; }
  .lang--bar { display: flex; margin-left: auto; }
  .hdr__in { gap: 12px; }
  .js.menu-open .hdr__nav .lang--hdr { display: none; }
  html:not(.js) .lang--bar { display: none; }
  .js .hdr__nav { display: none; }
  .js.menu-open .hdr__nav { display: grid; position: absolute; left: 0; right: 0; top: 100%; gap: 20px; padding: 20px clamp(20px, 5vw, 64px) 28px; background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 16px 32px rgba(14,15,17,.08); }
  .js.menu-open .hdr__links { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }
  .js.menu-open .hdr__links a { padding: 12px 0; font-size: 17px; }
  html:not(.js) .hdr__in { flex-wrap: wrap; padding: 12px 0; }
  html:not(.js) .hdr__nav { flex-wrap: wrap; }
  html:not(.js) .hdr__links { flex-wrap: wrap; }
}
@media screen and (max-width: 1000px) {
  .hero__text { grid-column: 1 / span 8; }
  .hero__art { grid-column: 9 / -1; min-height: 360px; }
  .hero__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .model__head { grid-column: 1 / -1; }
  .model__flow, .process__flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sec__grid > .s-head, #experience .sec__grid > .s-head { grid-column: 1 / -1; position: static; }
  .profile__body { grid-column: 1 / span 7; }
  .profile__facts { grid-column: 8 / -1; }
  .ch-grid, .cap-grid, .ai-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .autonomy > h3, .autonomy__scale, .autonomy__note { grid-column: 1 / -1; }
  .layers, .arch-points { grid-column: 1 / -1; }
  .arch-points { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sec__grid > .xp { grid-column: 1 / -1; }
  .uc { grid-template-columns: 1fr; }
  .uc__flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact__text, .contact__act { grid-column: 1 / -1; }
  .ftr__brand, .ftr nav { grid-column: span 6; }
  .ftr__meta { grid-column: 1 / -1; }
}

/* Mobile: content reorganised for a single column */
@media screen and (max-width: 640px) {
  html { scroll-padding-top: 76px; }
  .hdr__in { min-height: 60px; }
  .hdr__toggle-label { font-size: 14px; }
  .js.menu-open .hdr__links { grid-template-columns: 1fr; }
  .hero { padding-top: 0; }
  .hero__grid { display: flex; flex-direction: column; }
  .hero__art { order: -1; min-height: 0; height: 132px; margin: 0 -20px 32px; }
  .hero__title { max-width: none; }
  .hero__cta .t-btn { flex: 1 1 100%; }
  .hero__facts { grid-template-columns: 1fr 1fr; gap: 24px 16px; margin-top: 44px; }
  .model__flow, .process__flow { grid-template-columns: 1fr; }
  .model__flow .t-flow__tile, .process__flow .t-flow__tile { min-height: 0; display: grid; grid-template-columns: 34px 1fr; column-gap: 8px; row-gap: 2px; }
  .model__flow .t-flow__n, .process__flow .t-flow__n { grid-row: span 2; padding-top: 4px; }
  .profile__body, .profile__facts { grid-column: 1 / -1; }
  .profile__facts { padding-left: 0; border-left: 0; padding-top: 24px; border-top: 1px solid var(--line); }
  .ch-grid, .cap-grid, .ai-grid, .arch-points { grid-template-columns: 1fr; }
  .autonomy__scale { grid-template-columns: 1fr 1fr; }
  .layer { grid-template-columns: 1fr; }
  .layer__items { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .layer__items li { padding: 10px; font-size: 13.5px; }
  .xp__item { grid-template-columns: 1fr; gap: 6px; }
  .uc { padding: 20px; }
  .uc__flow { grid-template-columns: 1fr; }
  .contact__act .t-btn { width: 100%; }
  .ftr__brand, .ftr nav, .ftr__meta { grid-column: 1 / -1; }
}

@media print {
  .hdr, .hdr__toggle, .t-skip, .hero__cta, .contact__act .t-btn { display: none !important; }
  .sec, .contact { padding: 24px 0; break-inside: auto; }
  .sec--tint, .contact { background: none; color: var(--ink); }
  .contact .t-eyebrow, .contact__lead, .contact__ph { color: var(--ink); }
  a { text-decoration: none; }
}
@media screen and (max-width: 420px) {
  .hdr__toggle { padding: 0 13px; }
  .hdr__toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .t-brand { font-size: 16px; gap: 10px; }
}

/* ---- MOS-AI-K company version ---- */
.hdr .t-logo { height: 22px; }
.ftr .t-logo { height: 20px; }
.gate .t-logo { height: 28px; }

/* About: experience + AI = partner */
.eq { display: grid; grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr) 48px minmax(0, 1fr); list-style: none; }
.eq__op { display: grid; place-items: center; font: 400 32px/1 var(--font-mono); color: var(--muted); }
.eq__tile { display: flex; flex-direction: column; gap: 14px; padding: 28px 28px 32px; min-height: 300px; }
.eq__tile p { margin-top: auto; font-size: 16.5px; line-height: 1.55; }
.eq__tile--1 { background: var(--surface); outline: 1px solid var(--line-strong); outline-offset: -1px; }
.eq__tile--1 .t-label, .eq__tile--1 p { color: var(--muted); }
.eq__tile--2 { background: var(--ink); color: var(--ink-inverse); }
.eq__tile--2 .t-label, .eq__tile--2 p { opacity: .82; }
.eq__tile--3 { background: var(--smalto); color: var(--on-smalto); }
.about__closing { max-width: 30ch; margin-top: clamp(40px, 5vw, 64px); font-weight: 600; font-size: clamp(26px, 3vw, 40px); line-height: 1.15; letter-spacing: -0.025em; text-wrap: balance; }
.about__closing { max-width: 34ch; padding-left: 24px; border-left: 3px solid var(--ink); }

/* Capabilities: KPI foot */
.cap__kpi { display: grid; gap: 8px; }
.cap__kpi .t-label { color: var(--smalto-deep); }

/* Use cases: challenge → change → KPI */
.uc { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr) !important; }
.uc__head { grid-template-columns: 1fr !important; align-content: start; gap: 10px; }
.uc__known { display: grid; gap: 4px; margin-top: 6px; font-size: 15px; line-height: 1.5; color: var(--muted); }
.uc__known .t-label { color: var(--ink); }
.uc__flow { grid-template-columns: 1fr 1.2fr 1fr !important; }
.uc__flow .uc__change { background: var(--ink); color: var(--ink-inverse); outline: 0; }
.uc__flow .uc__change .t-label { color: inherit; opacity: .78; }
.uc__flow .uc__kpi { background: var(--surface); outline: 1px solid var(--line-strong); }
.uc__flow .uc__kpi .t-label { color: var(--smalto-deep); }
.uc__kpis { list-style: none; display: grid; gap: 6px; font: 400 13.5px/1.45 var(--font-mono); }
.uc__kpis li { padding-left: 14px; position: relative; }
.uc__kpis li::before { content: ""; position: absolute; left: 0; top: .5em; width: 7px; height: 7px; background: var(--ink); }

/* Experience: sectors and selected programmes */
.sectors { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; list-style: none; }
.sector { display: grid; gap: 8px; align-content: start; padding: 20px 20px 24px; background: var(--surface); outline: 1px solid var(--line); outline-offset: -1px; }
.sector p { font-size: 15px; line-height: 1.5; color: var(--muted); }
.xp__title { margin: clamp(40px, 5vw, 64px) 0 16px; }
.xp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; list-style: none; }
.xp-card { display: grid; gap: 10px; align-content: start; padding-top: 18px; border-top: 3px solid var(--ink); }
.xp-card p { font-size: 16px; line-height: 1.55; }
.xp-card__impact { display: grid; gap: 8px; margin-top: 4px; }
.xp-card__impact .t-label { color: var(--smalto-deep); }

/* How we work: KPIs */
.kpis { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; row-gap: 24px; margin-top: clamp(48px, 5vw, 72px); padding-top: 28px; border-top: 3px solid var(--ink); }
.kpis__head { grid-column: 1 / span 4; display: grid; gap: 10px; align-content: start; }
.kpis__head p { color: var(--muted); font-size: 16px; line-height: 1.55; }
.kpis__grid { grid-column: 5 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; list-style: none; }
.kpis__grid li { display: grid; gap: 6px; padding-top: 12px; border-top: 1px solid var(--line-strong); }
.kpis__grid p { font-size: 15px; line-height: 1.5; color: var(--muted); }

@media screen and (max-width: 1000px) {
  .eq { grid-template-columns: 1fr; }
  .eq__op { padding: 8px 0; font-size: 24px; }
  .eq__tile { min-height: 0; }
  .eq__tile p { margin-top: 4px; }
  .uc { grid-template-columns: 1fr !important; }
  .sectors { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpis__head, .kpis__grid { grid-column: 1 / -1; }
  .kpis__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (max-width: 640px) {
  .uc__flow { grid-template-columns: 1fr !important; }
  .sectors, .xp-grid, .kpis__grid { grid-template-columns: 1fr; }
  .about__closing { padding-left: 16px; }
  .hdr .t-logo { height: 18px; }
}