/* about-us page specific CSS */
:root { --red:#B91C1C;--red-dim:#7F1414;--red-soft:#FEF2F2;--dark:#111827;--dark2:#1F2937;--body:#475569;--bg:#F8FAFC;--panel-2:#F8FAFC;--border:#E2E8F0;--maxw:1240px;--c1:#FCA5A5;--c2:#FDE68A;--c3:#BFDBFE;--c4:#BBF7D0;--serif:'Source Serif 4',Georgia,serif; }
body { font-family:'Inter',system-ui,sans-serif;color:var(--body);background:#fff;line-height:1.6;-webkit-font-smoothing:antialiased; }
:focus-visible { outline:2px solid var(--red);outline-offset:3px; }
.wrap { max-width:var(--maxw);margin:0 auto;padding:0 32px; }
h1 { font-size:60px;line-height:1.06; }
h2 { font-size:38px;line-height:1.15; }
h3 { font-size:19px;line-height:1.3; }
section { padding:104px 0; }
.kicker { font-size:13px;font-weight:600;color:var(--red);margin-bottom:14px;display:block; }
.btn { display:inline-flex;align-items:center;padding:13px 24px;border-radius:8px;font-weight:600;font-size:15px;border:1.5px solid transparent;transition:background .15s,border-color .15s; }
.btn-primary { background:var(--red);color:#fff; }
.btn-primary:hover { background:#9f1a1a; }
.btn-secondary { color:var(--dark);border-color:var(--border); }
.btn-secondary:hover { border-color:var(--dark); }
.ctas { display:flex;gap:14px;flex-wrap:wrap; }
.hero { padding:88px 0 96px;background:linear-gradient(180deg,var(--bg),#fff);border-bottom:1px solid var(--border); }
.hero-grid { display:grid;grid-template-columns:1fr 540px;gap:64px;align-items:center; }
.hero h1 { margin:0 0 24px; }
.hero p.lead { font-size:18px;max-width:540px; }
.hero p.lead+p.lead { margin-top:16px; }
.doc { background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 30px 70px -24px rgba(17,24,39,.28);overflow:hidden; }
.doc-bar { display:flex;align-items:center;gap:10px;padding:14px 20px;border-bottom:1px solid var(--border);font-size:13px;font-weight:600;color:var(--dark); }
.doc-bar i { width:9px;height:9px;border-radius:50%;background:var(--red); }
.doc-bar span { margin-left:auto;font-weight:500;color:#94A3B8; }
.doc-body { padding:28px 28px 22px;font-family:var(--serif);font-size:19px;line-height:1.7;color:var(--dark); }
strong { font-weight:600;color:var(--dark); }
.dark strong, .mv-card.m strong, .contact strong { color:#fff; }
mark { color:inherit;background:linear-gradient(var(--c),var(--c)) 0 100%/0% 100% no-repeat;padding:2px 0;border-radius:3px;animation:sweep .9s ease forwards;cursor:default;transition:box-shadow .15s; }
mark sup { font-family:'Inter',sans-serif;font-size:10px;font-weight:700;margin-left:2px;color:var(--dark2); }
.m1 { --c:var(--c1);animation-delay:.3s; }
.m2 { --c:var(--c2);animation-delay:.9s; }
.m3 { --c:var(--c3);animation-delay:1.5s; }
.m4 { --c:var(--c4);animation-delay:2.1s; }
@keyframes sweep { to{background-size:100% 100%;} }
.legend { display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 20px 22px; }
.leg { display:flex;align-items:center;gap:9px;font-size:13px;font-weight:500;color:var(--dark2);padding:8px 10px;border:1px solid var(--border);border-radius:8px;cursor:default;transition:border-color .15s,background .15s; }
.leg b { width:14px;height:14px;border-radius:4px;background:var(--c);flex:none; }
.l1 { --c:var(--c1); }
.l2 { --c:var(--c2); }
.l3 { --c:var(--c3); }
.l4 { --c:var(--c4); }
.leg.on { border-color:var(--dark);background:var(--bg); }
mark.on { box-shadow:0 0 0 3px rgba(17,24,39,.18); }
.story-head { display:flex;justify-content:space-between;align-items:end;gap:48px;margin-bottom:56px; }
.story-head h2 { max-width:560px; }
.track { display:grid;grid-template-columns:repeat(3,1fr);gap:0;position:relative; }
.track::before { content:"";position:absolute;left:0;right:0;top:9px;height:2px;background:var(--border); }
.stage { position:relative;padding:44px 40px 0 0; }
.stage::before { content:"";position:absolute;top:0;left:0;width:20px;height:20px;border-radius:50%;background:#fff;border:4px solid var(--red); }
.stage:last-child::before { background:var(--red); }
.stage h3 { margin-bottom:10px;font-size:22px; }
.stage p { font-size:16.5px; }
.mv { padding:0 0 104px; }
.mv-grid { display:grid;grid-template-columns:1fr 1fr;gap:20px; }
.mv-card { border-radius:18px;padding:48px 44px; }
.mv-card.m { background:var(--dark); }
.mv-card.v { background:var(--red-soft); }
.mv-card small { font-size:13px;font-weight:600;display:block;margin-bottom:22px; }
.mv-card.m small { color:#FCA5A5; }
.mv-card.v small { color:var(--red); }
.mv-card p { font-family:'Inter',font-size:22px;line-height:1.55; }
.mv-card.m p { color:#fff; }
.mv-card.v p { color:var(--dark); }
.alt { background:var(--bg);border-block:1px solid var(--border); }
.sec-head { max-width:640px;margin-bottom:52px; }
.sec-head p { margin-top:14px;font-size:18px; }
.bento { display:grid;grid-template-columns:repeat(6,1fr);gap:18px; }
.tile { background:#fff;border:1px solid var(--border);border-radius:16px;padding:30px;display:flex;flex-direction:column;gap:22px;justify-content:space-between; }
.tile h3 { margin-bottom:8px;font-size:21px; }
.tile p { font-size:15.5px; }
.t-a, .t-b { grid-column:span 3; }
.t-c, .t-d, .t-e { grid-column:span 2; }
.vis { min-height:92px;display:flex;flex-direction:column;justify-content:flex-end;gap:9px; }
.ln { height:10px;border-radius:5px;background:#E2E8F0; }
.ln.h1 { background:linear-gradient(90deg,#E2E8F0 30%,var(--c1) 30% 78%,#E2E8F0 78%); }
.ln.h2 { background:linear-gradient(90deg,var(--c2) 0 46%,#E2E8F0 46%); }
.bars { flex-direction:row;align-items:flex-end;gap:6px; }
.bars i { flex:1;height:var(--h);border-radius:4px 4px 0 0;background:#CBD5E1; }
.bars i.hot { background:var(--red); }
.src { display:flex;align-items:center;gap:10px; }
.src b { width:12px;height:12px;border-radius:50%;background:var(--c);flex:none; }
.src .ln { flex:1; }
.docs { flex-direction:row;align-items:flex-end;gap:10px; }
.docs>div { flex:1;height:84px;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:10px;display:flex;flex-direction:column;gap:7px; }
.docs .ln { height:6px; }
.page { background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:12px;display:grid;grid-template-columns:1fr 14px;gap:7px 10px; }
.page .ln { height:7px; }
.page em { width:14px;height:7px;border-radius:2px;background:var(--c);align-self:center; }
.why { display:grid;grid-template-columns:5fr 7fr;gap:80px; }
.why-l { position:sticky;top:120px;align-self:start; }
.why-list { list-style:none; }
.why-list li { display:grid;grid-template-columns:34px 1fr;gap:18px;padding:26px 0;border-bottom:1px solid var(--border); }
.why-list li:first-child { padding-top:0; }
.why-list li::before { content:"";width:22px;height:22px;margin-top:3px;border-radius:50%;background:var(--red-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B91C1C' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/13px no-repeat; }
.why-list h3 { margin-bottom:6px; }
.why-list p { font-size:16.5px; }
.aud { display:grid;grid-template-columns:340px 1fr;gap:20px; }
.tabs { display:flex;flex-direction:column;gap:6px; }
.tab { font:inherit;font-size:16px;font-weight:600;text-align:left;color:var(--dark2);background:transparent;border:1px solid transparent;border-radius:10px;padding:16px 20px;cursor:pointer;transition:background .15s,border-color .15s; }
.tab:hover { background:#fff;border-color:var(--border); }
.tab[aria-selected="true"] { background:var(--dark);color:#fff; }
.panel { background:#fff;border:1px solid var(--border);border-radius:18px;padding:56px 52px;display:flex;flex-direction:column;justify-content:center;min-height:340px; }
.panel h3 { font-size:16px;color:var(--red);margin-bottom:18px; }
.panel p { font-family:var(--serif);font-size:30px;line-height:1.4;color:var(--dark);max-width:640px; }
.panel[hidden] { display:none; }
.dark { background:var(--dark); }
.priv { display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center; }
.dark h2 { color:#fff;margin-bottom:22px; }
.dark p { color:#94A3B8; }
.dark p+p { margin-top:16px; }
.dark a { color:#fff;text-decoration:underline;text-underline-offset:3px; }
.redact { background:#0B1220;border:1px solid #1E293B;border-radius:16px;padding:32px;display:flex;flex-direction:column;gap:14px; }
.redact i { display:block;height:12px;border-radius:3px;background:#334155; }
.redact i.k { background:#E2E8F0; }
.redact i.r { background:var(--red); }
.redact span { font-size:12.5px;font-weight:600;color:#64748B;margin-top:6px; }
.commit { text-align:center; }
.commit h2 { margin-bottom:36px; }
.commit blockquote { font-family:'Inter';font-size:29px;line-height:1.45;color:var(--dark);max-width:900px;margin:0 auto 28px; }
.commit p { max-width:820px;margin:0 auto; }
.contact { background:var(--dark);text-align:center;padding:88px 0; }
.contact h2 { color:#fff; }
.contact p { color:#94A3B8;margin:14px auto 0; }
.contact .ctas { margin-top:30px;justify-content:center; }
.contact .btn-secondary { border-color:#374151;color:#fff; }
@media (prefers-reduced-motion:reduce) {
  mark { animation:none;background-size:100% 100%; }
}
@media (max-width:1040px) {
  h1 { font-size:42px; }
  h2 { font-size:30px; }
  section { padding:72px 0; }
  .hero-grid, .priv, .why { grid-template-columns:1fr;gap:40px; }
  .story-head { flex-direction:column;align-items:start;gap:16px; }
  .why-l { position:static; }
  .aud { grid-template-columns:1fr; }
  .tabs { flex-direction:row;flex-wrap:wrap; }
  .tab { padding:10px 16px;font-size:14.5px;border-color:var(--border); }
  .panel { padding:36px 30px;min-height:0; }
  .panel p { font-size:24px; }
  .commit blockquote { font-size:23px; }
}
@media (max-width:760px) {
  .wrap { padding:0 20px; }
  h1 { font-size:34px; }
  .track { grid-template-columns:1fr; }
  .track::before { left:9px;right:auto;top:0;bottom:0;width:2px;height:auto; }
  .stage { padding:0 0 36px 44px; }
  .mv-grid { grid-template-columns:1fr; }
  .mv-card { padding:36px 28px; }
  .mv-card p { font-size:22px; }
  .bento { grid-template-columns:1fr; }
  .t-a, .t-b, .t-c, .t-d, .t-e { grid-column:auto; }
  .doc-body { font-size:18px;padding:22px; }
  .legend { grid-template-columns:1fr; }
}
.story-head { justify-content:center;text-align:center; }
.story-head h2 { max-width:none; }
.sec-head { margin-left:auto;margin-right:auto;text-align:center; }
@media (max-width:1040px) {
  .story-head { align-items:center; }
}
