:root { --paper:#f6f5f2; --white:#fff; --ink:#17191c; --muted:#62676d; --line:#d9dadd; --red:#ec1c24; --navy:#0b2a67; --teal:#00a6a6; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { align-items:center; display:flex; justify-content:space-between; margin:0 auto; max-width:1240px; padding:28px 40px; }
.brand-home img { display:block; height:50px; object-fit:contain; object-position:left center; width:188px; }
nav { display:flex; gap:34px; }
nav a { color:var(--muted); font-size:14px; font-weight:600; }
nav a:hover,nav a:focus-visible { color:var(--ink); }
.hero { align-items:center; display:grid; gap:84px; grid-template-columns:1.2fr .8fr; margin:0 auto; max-width:1240px; min-height:650px; padding:70px 40px 110px; }
.eyebrow,.card-kicker { color:var(--muted); font-size:12px; font-weight:700; letter-spacing:.13em; margin:0 0 20px; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(54px,6.6vw,88px); font-weight:550; letter-spacing:-.055em; line-height:.98; margin-bottom:32px; max-width:780px; }
.hero-intro { color:var(--muted); font-size:20px; line-height:1.6; margin-bottom:38px; max-width:610px; }
.text-link,.card-copy a { border-bottom:1px solid currentColor; display:inline-flex; font-size:14px; font-weight:650; gap:10px; padding-bottom:5px; }
.text-link:hover,.text-link:focus-visible,.card-copy a:hover,.card-copy a:focus-visible { color:var(--red); }
.hero-mark { margin-left:auto; max-width:390px; width:100%; }
.hero-mark img { display:block; height:auto; object-fit:contain; width:100%; }
.brands-section { background:var(--white); padding:120px max(40px,calc((100vw - 1160px)/2)); }
.section-heading { display:block; margin-bottom:88px; }
.section-heading h2,.about-grid h2 { font-size:clamp(38px,4vw,58px); font-weight:520; letter-spacing:-.045em; line-height:1.06; margin:0; }
.section-heading h2 { white-space:nowrap; }
.portfolio-grid { display:grid; gap:24px; grid-template-columns:repeat(3,minmax(0,1fr)); }
.brand-card { border:1px solid var(--line); display:grid; grid-template-rows:270px 1fr; min-height:480px; position:relative; }
.logo-stage { align-items:center; background:#f1f1ef; display:flex; justify-content:center; overflow:hidden; padding:48px; }
.logo-stage img { display:block; max-height:130px; max-width:90%; object-fit:contain; width:auto; }
.coachmetry-stage { background:#f0f5f7; }
.coachmetry-stage img { max-height:105px; transform:scale(1.12); }
.mobility-stage { flex-direction:column; gap:18px; position:relative; }
.mobility-stage img { max-height:80px; max-width:92%; }
.mobility-stage img:first-of-type { transform:scale(1.033); }
.card-copy { padding:34px 38px 38px; }
.card-copy h3 { font-size:27px; font-weight:560; letter-spacing:-.03em; line-height:1.2; margin-bottom:34px; max-width:390px; }
.quiet-status { color:var(--navy); font-size:13px; font-weight:650; }
.coachmetry-card { border-top:3px solid var(--teal); }
.mobility-card { border-top:3px solid var(--red); }
.brand-links { display:flex; flex-wrap:wrap; gap:22px; }
.future-card { border-top:3px solid var(--ink); }
.future-stage { background:#f4f3f1; }
.placeholder-mark { align-items:center; border:1px solid #a9adb2; border-radius:50%; color:#7b7f84; display:flex; font-size:44px; font-weight:200; height:82px; justify-content:center; line-height:1; width:82px; }
.future-note { color:var(--muted); font-size:14px; line-height:1.55; margin:0; max-width:260px; }
.about-section { margin:0 auto; max-width:1240px; padding:128px 40px 145px; }
.about-grid { display:grid; gap:80px; grid-template-columns:1.2fr .8fr; }
.about-grid p { color:var(--muted); font-size:18px; line-height:1.7; padding-top:8px; }
footer { align-items:center; background:var(--ink); color:#a9adb2; display:flex; justify-content:space-between; padding:48px max(40px,calc((100vw - 1160px)/2)); }
footer img { height:42px; object-fit:contain; object-position:left center; width:165px; }
footer p { font-size:12px; margin:0; }
@media (max-width:1050px) {
  .site-header { padding:22px 24px; }
  .brand-home img { height:42px; width:152px; }
  nav { gap:18px; }
  nav a:last-child { display:none; }
  .hero { gap:48px; grid-template-columns:1fr; min-height:auto; padding:70px 24px 86px; }
  .hero-mark { margin:0; max-width:260px; }
  .brands-section { padding:88px 24px; }
  .section-heading,.about-grid,.portfolio-grid { grid-template-columns:1fr; }
  .portfolio-grid { gap:24px; margin-top:0; }
  .section-heading { display:block; margin-bottom:58px; }
  .section-heading h2 { white-space:normal; }
  .brand-card { grid-template-rows:220px 1fr; min-height:420px; }
  .mobility-card { grid-template-rows:260px 1fr; }
  .logo-stage { padding:32px; }
  .card-copy { padding:30px; }
  .about-section { padding:92px 24px 105px; }
  .about-grid { gap:34px; }
  footer { align-items:flex-start; flex-direction:column; gap:30px; padding:42px 24px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }