/* Company page */
body.ground { background: var(--bg); }
.ab-bg { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; background-image: radial-gradient(var(--dot, rgba(20, 26, 32, .08)) 1px, transparent 1.2px); background-size: 24px 24px; }
.ab-bg .orb { position: absolute; border-radius: 50%; filter: blur(70px); opacity: .5; }
.ab-bg .o1 { width: 52vmax; height: 52vmax; right: -16vmax; top: -22vmax; background: radial-gradient(closest-side, color-mix(in oklab, var(--accent) 34%, transparent), transparent); }
.ab-bg .o2 { width: 44vmax; height: 44vmax; left: -18vmax; bottom: -20vmax; background: radial-gradient(closest-side, color-mix(in oklab, var(--brand-slate) 42%, transparent), transparent); }

.ab-wrap { width: min(1180px, 100% - 2 * max(20px, env(safe-area-inset-left, 0px))); margin-inline: auto; }
.ab-top { position: relative; z-index: 3; }
.ab { position: relative; z-index: 1; display: grid; gap: clamp(44px, 8vh, 96px); padding-block: clamp(28px, 6vh, 72px) clamp(56px, 10vh, 120px); }

/* hero */
.ab-hero { display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: clamp(24px, 5vw, 80px); }
.ab-copy { display: grid; gap: 22px; justify-items: start; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; padding: 7px 16px; border-radius: var(--r-pill); font-weight: 800; font-size: .88rem; color: var(--accent); background: var(--accent-soft); border: 1px solid color-mix(in oklab, var(--accent) 28%, transparent); }
.eyebrow i { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px color-mix(in oklab, var(--accent) 22%, transparent); }
.ab h1 { font-size: clamp(2.4rem, 6.2vw, 5.2rem); font-weight: 900; line-height: 1.25; letter-spacing: -.02em; }
.ab h1 em { font-style: normal; color: var(--accent); }
.ab .lead { max-width: 34em; font-size: clamp(1rem, 1.6vw, 1.3rem); line-height: 2.1; color: var(--ink-2); font-weight: 500; }
.ab-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.ab-actions .btn { min-width: 11em; }

.ab-art { position: relative; display: grid; place-items: center; aspect-ratio: 1; width: min(100%, 440px); justify-self: center; }
.ab-art .logo { position: relative; z-index: 2; width: 46%; filter: drop-shadow(0 26px 40px color-mix(in oklab, var(--brand-slate) 40%, transparent)); }
.ab-art .ring { position: absolute; border-radius: 50%; border: 1px solid var(--line-strong); }
.ab-art .r1 { inset: 12%; background: radial-gradient(closest-side, color-mix(in oklab, var(--surface) 80%, transparent), transparent 92%); border-color: color-mix(in oklab, var(--accent) 40%, var(--line)); }
.ab-art .r2 { inset: 3%; border-style: dashed; animation: spin 60s linear infinite; }
.ab-art .r3 { inset: -7%; opacity: .55; animation: spin 90s linear infinite reverse; border-style: dotted; }
.ab-art .dot { position: absolute; width: 14px; height: 14px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 7px color-mix(in oklab, var(--accent) 20%, transparent); }
.ab-art .d1 { top: 6%; right: 22%; } .ab-art .d2 { bottom: 16%; left: 4%; width: 10px; height: 10px; background: var(--brand-slate); box-shadow: 0 0 0 6px color-mix(in oklab, var(--brand-slate) 22%, transparent); } .ab-art .d3 { bottom: 2%; right: 30%; width: 8px; height: 8px; }
@keyframes spin { to { transform: rotate(360deg); } }

/* numbers */
.ab-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(12px, 2vw, 24px); }
.stat { position: relative; display: grid; gap: 6px; padding: clamp(20px, 3vw, 34px); border-radius: var(--r-xl); overflow: hidden; background: color-mix(in oklab, var(--surface) 82%, transparent); border: 1px solid var(--line); box-shadow: var(--shadow-2); backdrop-filter: blur(8px); }
.stat::before { content: ""; position: absolute; inset-inline: 0; top: 0; height: 3px; background: linear-gradient(to left, var(--accent), transparent); }
.stat b { font-size: clamp(2rem, 4.6vw, 3.6rem); font-weight: 900; line-height: 1.2; font-variant-numeric: tabular-nums; color: var(--ink); }
.stat > span { color: var(--muted); font-weight: 600; line-height: 1.8; }

/* award */
.ab-award { display: flex; align-items: center; gap: clamp(16px, 3vw, 36px); padding: clamp(24px, 4vw, 48px); border-radius: var(--r-xl); position: relative; overflow: hidden; color: #F4F6F8; border: 1px solid rgba(255, 255, 255, .08);
  background: radial-gradient(120% 160% at 100% 0%, rgba(198, 44, 47, .55), transparent 58%), linear-gradient(160deg, #1A2026, #0F1317); box-shadow: var(--shadow-2); }
.ab-award .medal { display: grid; place-items: center; flex: none; width: clamp(64px, 9vw, 104px); aspect-ratio: 1; border-radius: 50%; color: #fff; background: color-mix(in oklab, var(--accent) 80%, #000); box-shadow: 0 0 0 10px rgba(255, 255, 255, .06), 0 0 0 22px rgba(255, 255, 255, .03); }
.ab-award .medal svg { width: 52%; height: 52%; }
.ab-award h2 { font-size: clamp(1.3rem, 2.8vw, 2.2rem); font-weight: 900; line-height: 1.5; }
.ab-award p { margin-top: 6px; color: rgba(244, 246, 248, .75); font-size: clamp(.95rem, 1.5vw, 1.2rem); line-height: 1.9; }

/* section heading */
.sec { display: flex; align-items: center; gap: 18px; margin-bottom: clamp(18px, 3vw, 32px); font-size: clamp(1.5rem, 3vw, 2.3rem); font-weight: 900; }
.sec::after { content: ""; flex: 1; height: 1px; background: linear-gradient(to left, var(--line-strong), transparent); }
.sec span { position: relative; padding-inline-start: 18px; }
.sec span::before { content: ""; position: absolute; inset-inline-start: 0; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 2px; background: var(--accent); transform: rotate(45deg); }

/* firsts */
.ab-firsts .grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(12px, 2vw, 24px); }
.first, .val { position: relative; display: grid; align-content: start; gap: 14px; padding: clamp(22px, 3vw, 34px); border-radius: var(--r-xl); overflow: hidden; background: color-mix(in oklab, var(--surface) 84%, transparent); border: 1px solid var(--line); box-shadow: var(--shadow-2); transition: transform var(--t-med) var(--ease-out), border-color var(--t-med); }
.first:hover, .val:hover { transform: translateY(-4px); border-color: color-mix(in oklab, var(--accent) 45%, var(--line)); }
.first .n { position: absolute; inset-inline-end: 22px; top: 8px; font-size: clamp(4rem, 8vw, 6.4rem); font-weight: 900; line-height: 1; color: color-mix(in oklab, var(--ink) 6%, transparent); pointer-events: none; }
.first .ic, .val .ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 18px; color: var(--accent); border: 1px solid color-mix(in oklab, var(--accent) 50%, transparent); background: var(--accent-soft); }
.first .ic svg, .val .ic svg { width: 56%; height: 56%; }
.first h3, .val h3 { font-size: clamp(1.05rem, 1.7vw, 1.35rem); font-weight: 800; line-height: 1.9; }
.first p { display: inline-flex; width: fit-content; padding: 6px 14px; border-radius: var(--r-pill); font-weight: 800; font-size: .9rem; color: var(--accent); background: var(--accent-soft); }

.ab-values { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(12px, 2vw, 24px); }
.val { grid-template-columns: auto 1fr; align-items: center; gap: 18px; }

/* closing */
.ab-cta { display: grid; justify-items: center; gap: 18px; padding: clamp(32px, 6vw, 64px) 20px; text-align: center; border-radius: var(--r-xl); border: 1px solid var(--line); background: color-mix(in oklab, var(--surface) 70%, transparent); backdrop-filter: blur(8px); }
.ab-cta .logo { width: 72px; }
.ab-cta h2 { font-size: clamp(1.5rem, 3.6vw, 2.8rem); font-weight: 900; }
.ab-cta .ab-actions { justify-content: center; }

/* scroll reveal: content is visible without script */
.rv [data-reveal]:not(.in) { opacity: 0; transform: translateY(26px); }
[data-reveal] { transition: opacity 700ms var(--ease-out), transform 800ms var(--ease-out), border-color var(--t-med); transition-delay: calc(var(--d, 0) * 90ms); }
@media (prefers-reduced-motion: reduce) { .rv [data-reveal]:not(.in) { transform: none; } .ab-art .ring { animation: none; } }

@media (max-width: 860px) {
  .ab-hero { grid-template-columns: 1fr; text-align: start; }
  .ab-art { order: -1; width: min(70%, 300px); }
  .ab-stats { grid-template-columns: 1fr; }
  .ab-firsts .grid, .ab-values { grid-template-columns: 1fr; }
  .ab-award { flex-direction: column; align-items: flex-start; }
  .ab-actions .btn { flex: 1; }
}
