/* Self-hosted Manrope under the SIL Open Font License. */
@font-face {
  font-family: "Manrope";
  src: url("fonts/manrope.woff") format("woff");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}
body {
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 {
  font-family: "Manrope", Arial, sans-serif;
  font-synthesis: none;
  font-weight: 500;
  text-wrap: balance;
}
.hero h1 {
  font-size: clamp(44px, 5.2vw, 78px);
  letter-spacing: -.055em;
  line-height: 1.1;
}
h2 {
  font-size: clamp(34px, 3.5vw, 50px);
  letter-spacing: -.045em;
  line-height: 1.18;
}
h3 {letter-spacing: -.025em;}
.intro {font-size: 16px; line-height: 1.8;}
.section-head p, .about p, .detail-grid p {line-height: 1.8;}
.links {font-size: 13px; font-weight: 500; gap: 30px;}
.btn, .menu {font-size: 13px; font-weight: 600; letter-spacing: -.01em;}
.pill {font-size: 11px; font-weight: 500; line-height: 1.6;}
.kicker {font-size: 12px; font-weight: 600; letter-spacing: .14em;}
.card p {font-size: 14px; line-height: 1.8;}
.text-link {font-size: 13px; font-weight: 500;}
.stage h3 {font-size: 22px; font-weight: 500; letter-spacing: -.025em;}
.details summary {font-size: 16px; font-weight: 500; letter-spacing: -.015em;}
.detail-grid h2 {font-size: clamp(30px, 3vw, 38px); line-height: 1.22;}
.footer p {line-height: 1.8;}
@media (min-width: 801px) and (max-width: 1000px) {
  .hero-top {display: block;}
  .intro {max-width: 520px; margin-top: 28px;}
}
@media (max-width: 800px) {
  body {font-size: 15px;}
  .hero h1 {font-size: clamp(32px, 7.5vw, 58px); line-height: 1.16; letter-spacing: -.05em;}
  h2 {font-size: clamp(29px, 6.6vw, 42px); line-height: 1.22; letter-spacing: -.04em;}
  .intro {font-size: 15px;}
  .dark p, .about p {font-size: 14px;}
}

/* Shared Umo brand tokens and approved vector product lettering. */
:root {--umo-paper:#f4f1eb; --umo-ink:#101213; --umo-gray:#6d6d69; --umo-blue:#9ed7f5;}
body {color:var(--umo-ink);}
.intro,.section-head p,.card p,.about p,.product-title p,.detail-grid p,
.caption,.num,.breadcrumbs,.kicker,.footer p,.footer-bottom {color:var(--umo-gray);}
.notice {color:var(--umo-gray)!important; font-size:14px!important;}
.caption,.num,.footer-bottom {font-size:12px;}
.caption {flex-wrap:wrap;}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;}
.product-word {display:block;width:auto;height:calc(var(--word-size)*2.2);max-width:100%;}
.card h3 {--word-size:30px; margin:18px 0 0;line-height:1;}
.card p {margin:4px 0 18px;}
.product-title h1 {--word-size:clamp(46px,5.8vw,80px);font-size:inherit;line-height:1;margin:10px 0 0;}
.product-title {align-items:center;}
.product-title>div:first-child {min-width:0;}
.product-title>div:last-child {max-width:370px;}
.product-title .kicker {margin-bottom:16px;}
.family-stage {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:48px 30px 20px;margin:38px 0 0;border-radius:22px;background:linear-gradient(150deg,#e8e5df,#eeebe5);}
.family-device {min-width:0;display:flex;flex-direction:column;align-items:center;}
.family-cutout {width:100%;height:auto;aspect-ratio:1.15;object-fit:contain;object-position:center bottom;display:block;}
.family-word {height:44px;width:auto;max-width:100%;margin-top:18px;}
.card-media {display:flex!important;align-items:center;justify-content:center;aspect-ratio:1.4;background:linear-gradient(150deg,#e8e5df,#eeebe5);padding:22px;}
.card-media img {position:static;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center bottom;}
.concept-frame {display:flex;justify-content:center;align-items:center;margin-top:32px;padding:40px;border-radius:20px;background:linear-gradient(150deg,#e8e5df,#eeebe5);}
.concept {width:100%;height:clamp(300px,42vw,570px);object-fit:contain;margin:0;border-radius:0;}
.concept:focus-visible {outline:3px solid #407b9c;outline-offset:8px;}
dialog img {max-width:85vw;max-height:78vh;}
.icon {width:16px;height:16px;display:inline-block;vertical-align:middle;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.icon-wrap {display:inline-flex;align-items:center;}
.text-link {display:inline-flex;align-items:center;gap:24px;}
.text-link span {margin-left:0;}
.dark .kicker {color:#c3cfd1;}
@media(max-width:800px) {
 .family-stage {gap:8px;padding:26px 10px 14px;margin-top:28px;border-radius:16px;}
 .family-cutout {aspect-ratio:.85;}
 .family-word {height:clamp(20px,6vw,28px);margin-top:10px;}
 .product-title h1 {--word-size:clamp(32px,10vw,65px);margin-top:8px;}
 .product-title>div:last-child {max-width:100%;margin-top:4px;}
 .product-title .kicker {margin-top:4px;margin-bottom:12px;}
 .product-title p {margin-top:0;}
 .concept-frame {padding:18px;margin-top:28px;border-radius:14px;}
 .concept {height:clamp(250px,72vw,440px);}
 .notice {font-size:14px!important;}
 .caption {font-size:12px;gap:6px 16px;}
}