/* Last visual pass: clear type, genuine device silhouettes, and deliberately quiet motion. */
.lead-feature .feature-copy { max-width: 590px; }
.lead-feature .feature-copy h2 { max-width: 580px; font-size: clamp(54px, 5.8vw, 84px); }
.lead-feature .feature-copy > p { max-width: 510px; }

/* Give gradient glyphs enough room for their descenders and terminal punctuation. */
.ai-section { overflow: visible; }
.ai-section h2 {
  display: inline-block;
  width: max-content;
  max-width: none;
  margin: -.08em -.1em .12em;
  padding: .08em .1em .12em;
  font-size: clamp(58px, 5.7vw, 84px);
  line-height: 1.03;
  letter-spacing: -.074em;
  overflow: visible;
  white-space: nowrap;
}

.ai-section h2 span { padding-right: .045em; }

/* Pricing and FAQ are deliberately centered calls to action. */
.pricing-section .section-heading,
.faq-section .section-heading { max-width: 620px; text-align: center; }
.pricing-section .section-heading > p:last-child { margin-right: auto; margin-left: auto; }

/* A flatter, more recognizable Apple Watch: rectangular case, inset display and a continuous sport band. */
.health-showcase .watch-stage-render { width: 252px; height: 410px; right: -4px; bottom: -4px; transform: scale(.82); }
.health-showcase .watch-render-shadow { bottom: 10px; left: 12px; width: 228px; height: 34px; background:radial-gradient(ellipse,rgba(0,0,0,.3),transparent 70%); }
.health-showcase .watch-render-band { width: 96px; height: 149px; border: 1px solid #1f242c; border-radius: 34px; background:linear-gradient(90deg,#080a0d,#1a1e25 45%,#343b46 58%,#12171e 78%,#07090c); box-shadow:inset 1px 0 rgba(255,255,255,.08),inset -2px 0 rgba(0,0,0,.56),0 7px 12px rgba(0,0,0,.22); }
.health-showcase .watch-render-band-top { top: 0; }.health-showcase .watch-render-band-bottom { bottom: 0; }
.health-showcase .watch-render-case { top: 73px; left: 26px; width: 190px; height: 231px; padding: 8px; border: 2px solid #59616c; border-radius: 51px; background:linear-gradient(120deg,#bac1c9 0%,#555e69 6%,#151a21 18%,#090c11 79%,#424b56 96%,#89929c); box-shadow:inset 1px 1px 2px rgba(255,255,255,.35),inset -2px -2px 3px rgba(0,0,0,.68),0 22px 33px rgba(0,0,0,.3); transform:rotateY(-5deg) rotateX(2deg) rotateZ(-1deg); }
.health-showcase .watch-render-case::after { border-radius:46px; }.health-showcase .watch-render-screen { border:3px solid #020407; border-radius:42px; }.health-showcase .watch-render-lug { display:none; }
.health-showcase .watch-render-crown { right:-18px; top:72px; width:17px; height:30px; border:1px solid #68727d; border-left:0; border-radius:0 10px 10px 0; background:repeating-linear-gradient(0deg,#aab2bb 0 2px,#4a5560 2px 4px); }.health-showcase .watch-render-button { right:-14px; top:118px; width:8px; height:24px; border-radius:0 5px 5px 0; }

/* The device family uses the original high-resolution screens, positioned at their natural top edge. */
.imac-screen img,.macbook-screen img,.ipad-screen img { object-position:center top; }
.imac-chin::after { display:none; }
.imac-chin svg { position:absolute; top:8px; left:50%; width:15px; height:18px; color:#171b20; transform:translateX(-50%); }
.device-ecosystem .macbook-device { width:286px; }
.device-ecosystem .macbook-screen { padding:6px; border:6px solid #12161d; border-bottom-width:7px; border-radius:13px 13px 4px 4px; background:#12161d; }
.device-ecosystem .macbook-base { left:-6%; width:112%; height:18px; border-radius:3px 3px 16px 16px; }
.device-ecosystem .ipad-device { width:188px; padding:7px; border:7px solid #151a21; border-radius:25px; background:linear-gradient(130deg,#c3c9ce,#616c76 7%,#1b222b 16%,#303943); }
.device-ecosystem .ipad-screen { border-radius:14px; }.device-ecosystem .ecosystem-iphone { width:91px; border-color:#0d1117; background:#0d1117; box-shadow:0 16px 25px rgba(10,26,57,.28); }.device-ecosystem .ecosystem-iphone img { image-rendering:auto; object-position:center top; }
.device-ecosystem .ecosystem-watch { width:96px; height:142px; right:107px; bottom:0; transform:rotate(-3deg); }.device-ecosystem .ecosystem-watch-case { width:76px; height:94px; padding:4px; border:2px solid #5a6571; border-radius:24px; background:linear-gradient(130deg,#aab2bb,#404a55 8%,#0b0f14 20%,#323b46); }.device-ecosystem .ecosystem-watch-screen { border-radius:19px; }.device-ecosystem .ecosystem-watch-band { width:44px; height:55px; border:1px solid #1b2128; border-radius:16px; background:linear-gradient(90deg,#06080b,#303844,#07090c); }.device-ecosystem .ecosystem-watch-crown { right:-10px; top:32px; width:9px; height:19px; border:1px solid #65717d; border-left:0; background:repeating-linear-gradient(0deg,#a5adb7 0 2px,#4b5661 2px 4px); }

/* Capability icons share one clean stroke system without accidental overlaps. */
.capability svg { width:60px; height:60px; margin-bottom:27px; stroke-width:2.5; }
.capability svg path,.capability svg rect,.capability svg circle { vector-effect:non-scaling-stroke; }

/* The answer panel's measured height is animated by script in both directions. */
.faq-list details { overflow:hidden; }
.faq-answer { height:0; overflow:hidden; opacity:0; transition:height .32s cubic-bezier(.2,.8,.2,1),opacity .2s ease; }
.faq-answer p { margin:0; padding:0 21px 20px; }
.faq-list details[open] .faq-answer { opacity:1; }

@media (max-width: 800px) {
  .device-ecosystem .macbook-device { width:255px; }
  .device-ecosystem .ipad-device { width:172px; }
}

@media (max-width: 480px) {
  .lead-feature .feature-copy h2 { font-size:clamp(48px,14vw,60px); }
  .ai-section h2 { width:auto; max-width:100%; margin:0 0 18px; padding:.05em 0 .11em; font-size:clamp(48px,13.4vw,58px); line-height:1.05; letter-spacing:-.07em; white-space:normal; }
  .health-showcase .watch-stage-render { right:-9px; bottom:0; transform:scale(.67); }
  .imac-chin svg { top:4px; width:9px; height:11px; }
  .device-ecosystem .macbook-device { width:162px; }.device-ecosystem .ipad-device { width:113px; padding:4px; border-width:4px; border-radius:16px; }.device-ecosystem .ecosystem-iphone { width:64px; }.device-ecosystem .ecosystem-watch { right:64px; bottom:-4px; transform:scale(.73); transform-origin:bottom right; }
}

@media (prefers-reduced-motion:reduce) { .faq-answer { transition:none; } }

/* Updated surface palette and brand naming. */
.site-header .brand span { white-space:nowrap; }

.ai-section {
  color:#182434;
  background:#f4f5f7;
}

.ai-section::before { display:none; }
.ai-section .ai-section-copy > p:not(.eyebrow) { color:#526171; }
.ai-phone-wrap::before { background:radial-gradient(circle,rgba(58,123,214,.13),transparent 70%); }
.ai-section h2 { line-height:1.16; padding-bottom:.18em; margin-bottom:.06em; }
.ai-section h2 span { overflow:visible; }

.progress-section { background:#eff1f3; }
.progress-copy .eyebrow { color:#326fae; }
.progress-copy h2 { color:#17293a; }
.progress-copy > p:not(.eyebrow) { color:#526171; }
.progress-pills span { border-color:#d2dce5; color:#39546b; background:#fff; }
.progress-devices::before { background:radial-gradient(ellipse,rgba(69,135,207,.2),transparent 69%); }

.devices-feature { background:#edf5ef !important; }
.devices-feature::after { background:radial-gradient(ellipse,rgba(148,205,166,.45),transparent 67%); }

/* The capability grid follows the solid blue SF-like language from the reference. */
.capability svg { color:#147bf4; }
.capability svg.capability-solid { fill:none; stroke:none; }
.capability svg.capability-ai { fill:none; stroke:none; }
.capability svg.capability-devices { fill:none; stroke:#147bf4; stroke-width:2.7; stroke-linecap:round; stroke-linejoin:round; }

@media (max-width:480px) {
  .site-header .brand { gap:7px; font-size:14px; }
  .site-header .brand-logo { width:28px; height:28px; border-radius:8px; }
  .header-download { padding:8px 12px; font-size:13px; }
  .ai-section h2 { padding-bottom:.2em; line-height:1.18; }
}

/* Center the desktop navigation as a composed three-part bar. */
@media (min-width:801px) {
  .site-header { display:grid; grid-template-columns:1fr auto 1fr; }
  .site-header .brand { justify-self:start; }
  .site-header .desktop-nav { justify-self:center; margin-left:0; }
  .site-header .header-download { justify-self:end; }
}

/* The desktop mark needs its full path bounds, and the iPad uses an even, modern bezel. */
.imac-chin svg { top:6px; width:18px; height:22px; }
.device-ecosystem .ipad-device {
  padding:8px;
  border:8px solid #151a20;
  border-radius:22px;
  background:#151a20;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 22px 36px rgba(11,40,82,.25);
}
.device-ecosystem .ipad-screen { border-radius:12px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
.device-ecosystem .ipad-camera { z-index:2; width:5px; height:5px; background:#59636d; box-shadow:0 0 0 1px rgba(0,0,0,.38); }

/* The iPad is a distinct portrait device, not a short landscape card. */
.device-ecosystem .ipad-device { top:43px; right:42px; width:150px; aspect-ratio:3 / 4; }

/* Keep the capability marks as discrete, simple symbols. */
.capability svg.capability-theme,
.capability svg.capability-devices { fill:none; stroke:#147bf4; stroke-width:2.8; stroke-linecap:round; stroke-linejoin:round; }

@media (max-width:480px) {
  .imac-chin svg { top:3px; width:11px; height:14px; }
  .device-ecosystem .ipad-device { padding:5px; border-width:5px; border-radius:17px; }
  .device-ecosystem .ipad-screen { border-radius:9px; }
  .device-ecosystem .ipad-device { top:42px; right:30px; width:100px; }
}
