/* Launch page hierarchy, feature cards and a single-axis example gallery. */
.hero { padding-bottom:clamp(72px,8vw,120px); }
.hero-description { max-width:620px; font-size:20px; line-height:1.45; }
.hero .offer-note { margin-bottom:26px;}
.hero .viewer-hint { margin-bottom:0;}
.feature-overview { background:#fff; }
.feature-overview-heading { max-width:780px; margin-bottom:36px; }
.feature-overview-heading .section-heading { font-size:clamp(28px,3.3vw,44px); }
.feature-intro { font-size:21px; line-height:1.45; color:var(--secondary); margin:24px 0 0; }
.feature-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,max(7.5rem,calc(50% - 8px))),1fr)); gap:16px; }
.feature-card { min-width:0; overflow:hidden; background:#f5f5f7; border-radius:24px; padding:24px; }
.feature-visual { display:flex; align-items:center; justify-content:center; height:201.6px; margin:0 0 20px; }
.feature-visual img { display:block; width:100%; height:calc(100% / 1.44); max-width:390px; object-fit:contain; transform:scale(1.44); }
.feature-visual-keyboard img { max-width:370px; }
.feature-visual-trackpad img { max-width:265px; mask-image:linear-gradient(to bottom,transparent 0%,#000 32%),linear-gradient(135deg,#000 64%,transparent 96%); mask-composite:intersect; }
.feature-visual-companion img { max-width:310px; }
.feature-card h3 { font-size:19px; line-height:1.25; letter-spacing:-.4px; font-weight:600; margin:0 0 8px; }
.feature-card p { color:var(--secondary); font-size:15px; line-height:1.45; margin:0; max-width:42ch; }
@media(max-width:700px) { .feature-grid { grid-template-columns:1fr; } }
.feature-purchase-note { margin:44px auto 0; text-align:center; }
.feature-purchase-note p { margin:0 0 10px; font-size:21px; line-height:1.35; font-weight:600; }
.feature-purchase-note span { color:var(--secondary); font-size:15px; line-height:1.45; }
.keyboard-layouts { position:relative; width:min(100%,230px); height:140px; }
.keyboard-layouts > div { position:absolute; width:74%; height:110px; top:0; left:0; }
.keyboard-layouts > div:nth-child(2) { top:15px; left:13%; }
.keyboard-layouts > div:nth-child(3) { top:30px; left:26%; }
.keyboard-layouts img { filter:drop-shadow(0 3px 4px #0002); }
.keyboard-layouts span { position:absolute; top:3px; left:8%; padding:2px 6px; border-radius:4px; background:#f2f2f7; color:#1d1d1f; font-size:10px; line-height:1.3; }
.experience-copy .section-description { margin-bottom:28px; }
.scenario-track { overflow-x:auto; overflow-y:hidden; touch-action:pan-x pan-y pinch-zoom; overscroll-behavior-x:contain; overscroll-behavior-y:auto; align-items:stretch; }
.scenario-card { align-self:stretch; }
.scenario-caption { padding-top:24px; line-height:1.5; }
.scenario-caption strong { display:block; margin-bottom:10px; }
.companion-guide-link { margin:30px 0 0; }
.compatibility-section { text-align:center; background:#fff; }
.compatibility-heading { max-width:800px; margin:0 auto; }
.compatibility-description { color:var(--secondary); font-size:21px; line-height:1.45; max-width:620px; margin:26px auto 0; }
.compatibility-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; max-width:820px; margin:56px auto 36px; }
.compatibility-facts div { padding:0 18px; }
.compatibility-facts div+div { border-left:1px solid #d2d2d7; }
.compatibility-facts dt { font-size:21px; font-weight:600; line-height:1.35; letter-spacing:-.4px; }
.compatibility-facts dd { margin:8px 0 0; font-size:17px; color:var(--secondary); line-height:1.45; }
.price-card { margin-top:44px; }
.plan-badge { background:#e8f2ff; color:#06c; }
.pricing-intro { line-height:1.5; }
@media(max-width:650px) {
  .hero { padding-bottom:72px; }
  .hero .eyebrow { max-width:270px; margin-inline:auto;}
  .hero-description { max-width:360px; font-size:18px; }
  .feature-overview-heading { margin-bottom:36px; }
  .feature-intro,.compatibility-description { font-size:18px; }
  .feature-grid { gap:12px; }
  .feature-card { padding:16px; border-radius:20px; }
  .feature-visual { height:144px; margin-bottom:14px; }
  .feature-card h3 { font-size:16px; }
  .feature-card p { font-size:14px; }
  .keyboard-layouts { height:100px; }
  .keyboard-layouts > div { height:72px; }
  .keyboard-layouts > div:nth-child(2) { top:14px; }
  .keyboard-layouts > div:nth-child(3) { top:28px; }
  .keyboard-layouts span { font-size:8px; left:0; top:0; padding:1px 3px; }
  .compatibility-facts { grid-template-columns:1fr; gap:24px; margin-top:36px; }
  .compatibility-facts div { padding:0; }
  .compatibility-facts div+div { border-left:0; }
  .compatibility-facts dt { font-size:20px; }
  .compatibility-facts dd { font-size:16px; margin-top:6px; }
  .scenario-caption { padding-top:20px; }
}

/* Current Pro controls on the measured continuous inner display. */
.product-device .key,
.product-device .key-utility,
.product-device .key-space,
.product-device .keyboard[data-layer=navigation] .key,
.product-device .keyboard[data-layer=navigation] .key-arrow { background:#1c1c1e; color:#fff; }
.product-device .key-utility,
.product-device .key-space { background:#1c1c1e; }
.product-device .key:active { background:#494a4e; }
.product-device .key[aria-pressed=true] { background:#007aff; color:#fff; }
.product-device.model-ready .demo-upper,
.product-device.model-ready .demo-deck,
.product-device.model-ready .demo-desktop,
.product-device.model-ready .native-deck { border-radius:0; }
.product-device.model-ready .deck-hinge { display:block; }
.product-device.model-ready .native-deck { aspect-ratio:auto; height:calc(100% - 12.5561cqw); }

/* A compact photo interlude with copy in the page flow. */
.lookalike-story { display:flex; flex-direction:column; width:100%; margin:0; background:#f7f6f3; }
.lookalike-story::before { content:none; }
.lookalike-copy { order:0; padding:56px 24px 24px; text-align:center; }
.lookalike-copy .section-heading { color:var(--ink); max-width:980px; margin:0 auto; font-size:clamp(34px,4.5vw,64px); }
.lookalike-copy .section-description { max-width:540px; margin:18px auto 0; color:var(--secondary); font-size:18px; line-height:1.45; }
.lookalike-art { order:1; position:relative; margin:0; width:100%; height:clamp(280px,33vw,520px); overflow:hidden; }
.lookalike-art picture { display:block; width:100%; height:100%; }
.lookalike-art img { display:block; width:100%; height:100%; object-fit:cover; object-position:center bottom; }
@media(max-width:899px) {
  .lookalike-copy { padding-top:40px; }
  .lookalike-copy .section-description { font-size:17px; }
  .lookalike-art { height:clamp(280px,90vw,560px); }
}

/* Companion, compatibility and setup share one compact section. */
.compact-companion { padding-block:80px; }
.companion-layout { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr)); gap:48px; align-items:center; }
.companion-copy,.companion-visual { min-width:0; container-type:inline-size; }
.companion-copy .section-heading { font-size:clamp(30px,3.7vw,44px); line-height:1.1; }
.companion-copy .section-description { font-size:18px; line-height:1.45; margin:20px 0 0; max-width:440px; }
.compact-companion .compatibility-facts { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; text-align:left; margin:28px 0 24px; }
.compact-companion .compatibility-facts div { padding:0 8px 0 0; }
.compact-companion .compatibility-facts div+div { padding-left:12px; }
.compact-companion .compatibility-facts dt { font-size:14px; line-height:1.4; letter-spacing:0; }
.compact-companion .compatibility-facts dd { font-size:13px; margin-top:5px; }
.compact-companion .menu-bar-stage { width:100%; margin:0 0 max(26px,calc(min(16rem,320px) + 36px - 50cqw)); aspect-ratio:2; overflow:visible; }
.compact-companion .companion-desktop-template { width:100%; height:100%; transform:none; object-fit:contain; }
.compact-companion .companion-menu { left:65%; right:auto; top:.6%; width:4%; }
.compact-companion .companion-menu summary { height:4cqw; min-height:20px; }
.compact-companion .companion-popover { right:-60px; top:calc(100% + 4px); width:228px; padding:14px; border-radius:12px; }
.compact-companion .companion-popover > strong { font-size:15px; }
.compact-companion .companion-subtitle { font-size:12px; margin:3px 0 10px; }
.compact-companion .companion-menu-row { font-size:12px; padding:8px 0; gap:10px; }
.compact-companion .companion-popover a { font-size:12px; padding:8px 0; }
.companion-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; padding:0; margin:0; list-style:none; counter-reset:setup; }
.companion-steps li { position:relative; min-width:0; padding:0 14px 0 0!important; border:0!important; counter-increment:setup; }
.companion-steps li::before { content:counter(setup); display:grid; place-items:center; position:relative!important; width:28px; height:28px; border-radius:50%; background:#e5e5ea; color:#515154; font-size:12px; margin-bottom:12px; z-index:1; }
.companion-steps li:not(:last-child)::after { content:""; position:absolute; left:28px; right:0; top:13px; height:1px; background:#d2d2d7; }
.companion-steps strong { font-size:15px; }
.companion-steps p { font-size:13px; line-height:1.45; color:var(--secondary); margin:6px 0 0; }

/* Keep the compact three-step layout at normal size; enlarged text reflows. */
@container (max-width:17rem) {
 .compact-companion .compatibility-facts { grid-template-columns:minmax(0,1fr); gap:16px; }
 .compact-companion .compatibility-facts div,
 .compact-companion .compatibility-facts div+div { padding:0; border:0; }
 .companion-steps { grid-template-columns:minmax(0,1fr); gap:20px; }
 .companion-steps li { padding:0 0 0 44px!important; }
 .companion-steps li::before { position:absolute!important; left:0; top:0; margin:0; }
 .companion-steps li:not(:last-child)::after { left:13px; right:auto; top:28px; bottom:-20px; width:1px; height:auto; }
}

.pricing-section .section-heading { font-size:clamp(32px,4vw,48px); }
.pricing-intro { font-size:18px; margin-top:18px; }
.pricing-section .price-card { width:100%; max-width:520px; padding:28px; margin:30px auto 0; }
.price-card .plan-description { font-size:14px; line-height:1.5; }
.price-card .included-heading { margin-top:22px; font-size:14px; }
.price-card .included-list { gap:8px; margin-block:16px 24px; }
.price-card .included-list li { font-size:14px; line-height:1.45; }
.price-card .price-card-bottom { gap:18px; padding-top:20px; }
.price-card .download-step > span {  margin-bottom:10px; }
.price-card .app-store-download { max-width:100%; }
.price-card .app-store-download img { height:40px; width:auto; max-width:100%; object-fit:contain; }
.price-card .download-step small { font-size:12px; }
.price-card .plan-badge { white-space:nowrap; flex-shrink:0; width:max-content; max-width:none; }
.price-card .price-card-top > div { min-width:0; }
.price-card .download-step { display:flex; flex-direction:column; align-items:stretch; gap:10px; min-width:0; }
.price-card .download-step > span { margin:0; text-align:left; color:var(--ink);   font-weight:600; }
.price-card .download-button:disabled { cursor:default;}
.availability-panel { margin-top:18px; }
.download-dialog { width:min(460px,calc(100% - 48px)); border:0; border-radius:24px; padding:40px; box-shadow:0 20px 80px #0003; }
.download-dialog::backdrop { background:#0006; backdrop-filter:blur(4px); }
.download-dialog h2 { margin:20px 0 16px; font-size:24px; line-height:1.2; letter-spacing:-.5px; }
.download-dialog p { color:var(--secondary); font-size:16px; line-height:1.5; margin:0 0 24px; }
.dialog-close { float:right; place-items:center;}
.cinematic-cta.closing-photo::before { content:none; }
.closing-message { padding:96px 0 88px; background:#fff; text-align:center; }
.closing-character { display:block; width:88px; height:88px; margin:0 auto 32px; }
.closing-message .cta-heading { max-width:680px; margin:0 auto; color:var(--ink); }
.closing-message .cta-description { max-width:560px; margin:28px auto 30px; font-size:20px; line-height:1.45; color:var(--secondary); }
.closing-message .cta-actions { display:flex; flex-direction:column; align-items:center; gap:18px; }
.closing-message .offer-note { margin:0; color:var(--secondary);}
.closing-message .final-giving { max-width:480px; margin:0; font-size:13px; line-height:1.45; }
.closing-message .final-giving a { color:var(--link-blue); text-decoration:underline; text-underline-offset:3px; }
@media(max-width:650px) {
 .closing-message { padding:64px 0; }
 .closing-character { width:72px; height:72px; margin-bottom:28px; }
 .closing-message .cta-description { font-size:18px; margin-block:24px; }
 .download-dialog { padding:24px; }
}

@media(max-width:650px) {
 .compact-companion { padding-block:60px; }
 .companion-layout { grid-template-columns:minmax(0,1fr); gap:32px; }
 .companion-copy .section-description { font-size:16px; }
 .compact-companion .companion-menu svg { width:3.07cqw; height:2.3cqw; }
 .compact-companion .companion-popover { right:-60px; width:228px; max-width:none; }
 .pricing-section .price-card { padding:22px; }
 .price-card .price-card-bottom { grid-template-columns:minmax(0,1fr); gap:18px; }
 .price-card .download-step { display:flex; flex-direction:column; align-items:stretch; gap:10px; }
 .price-card .download-step > span { margin:0; }
 .price-card .download-step .app-store-download { grid-column:2; grid-row:1 / span 2; }
 .price-card .download-step small { margin:0; }
}
@media(prefers-reduced-motion:reduce) {
  .scenario-track { scroll-behavior:auto; }
}

/* Light palm interlude: one headline and a close, product-led photograph. */
.palm-story.palm-portrait { display:flex; flex-direction:column; width:100%; padding:32px 0 0; margin:0; background:#fff; color:var(--ink); }
.palm-story.palm-portrait::before,.palm-portrait .palm-copy::before { content:none; }
.palm-portrait .palm-copy { order:0; width:100%; max-width:none; padding:24px 28px 16px; margin:0; color:var(--ink); text-align:center; }
.palm-portrait .palm-copy .section-heading { margin:0 auto; color:var(--ink); font-size:clamp(36px,4.5vw,64px); }
.palm-portrait .palm-copy .section-description { margin:18px auto 0; color:var(--secondary); font-size:18px; line-height:1.45; }
.palm-portrait .palm-art { order:1; position:relative; width:100%; max-width:none; height:clamp(300px,40vw,560px); margin:0; }
.palm-portrait .palm-art picture { display:block; width:100%; height:100%; }
.palm-portrait .palm-art img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 70%; border-radius:0; }
@media(max-width:899px) {
  .palm-portrait .palm-art { height:clamp(300px,92vw,540px); }
  .palm-portrait .palm-art img { object-fit:cover; }
}

/* One price, three essentials and a giving note beside the download actions. */
.pricing-section.section-pad { padding-block:64px; }
.pricing-section .price-card { max-width:600px; padding:32px; }
.price-card .plan-price { margin-top:10px; font-size:clamp(38px,12vw,48px); line-height:1.08; }
.price-card .included-heading { margin-top:24px; }
.price-card .included-list { gap:10px; margin:16px 0 24px; }
.price-card .included-list li { font-size:15px; }
.price-card .price-card-bottom { gap:16px; align-items:stretch; }
.price-card .download-step { display:flex; flex-direction:column; flex:1; min-width:0; }
.price-card .download-step > span { display:none; }
.price-card .download-step .button { flex:1;}
.price-card .pricing-giving { gap:12px; margin:20px 0 0; padding:14px 16px; font-size:14px; line-height:1.45; }
.price-card .pricing-giving .giving-character { width:32px; height:32px; }
.price-card .giving-note-copy { font-size:14px; line-height:1.45; }
.price-card .giving-note-link { display:inline; margin-left:6px; font-size:13px; }
.pricing-footnote { max-width:580px; margin:22px auto 0; }
.pricing-footnote > p { margin:0 0 10px; }
.pricing-requirements summary { cursor:pointer; color:var(--link-blue);}
.pricing-requirements p { text-align:left; font-size:13px; line-height:1.5; }
.pricing-requirements a { color:var(--link-blue); text-decoration:underline; }
@media(max-width:650px) {
  .pricing-section.section-pad { padding-block:56px; }
  .pricing-section .price-card { padding:24px; margin-top:28px; }
  .price-card .price-card-bottom { gap:12px; }
  .price-card .pricing-giving { padding:12px; }
}

/* The retained closing photo and call to action finish as one composition. */
.closing-scene { background:#fff; }
.closing-scene .cta-photo { position:static; display:block; width:100%; max-width:1440px; margin:auto; }
.closing-scene .cta-photo img { position:static; display:block; width:100%; height:clamp(280px,36vw,500px); object-fit:cover; object-position:center 65%; border-radius:0; }
.closing-scene .closing-message { padding:56px 0 64px; }
.closing-scene .closing-character { width:60px; height:60px; margin-bottom:22px; }
@media(max-width:650px) {
  .closing-scene .cta-photo img { height:300px; }
  .closing-scene .closing-message { padding:40px 0 48px; }
  .closing-scene .closing-character { width:48px; height:48px; margin-bottom:20px; }
}

/* Horizontal device exploration keeps the document available to vertical touch. */
#device-viewer { touch-action:pan-y pinch-zoom; }

.price-card .included-list { margin-top:22px; }
.price-card .price-card-bottom { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.price-card .giving-note-copy { font-size:13px; }
.price-card .pricing-giving { margin-top:16px; }
.swatch-photo { background:url('/assets/digital-lid-photo-20261010.webp') center / cover; }
#personalise .section-top .section-heading { max-width:100%; overflow-wrap:anywhere; }
@media(max-width:359px) { .price-card .price-card-bottom { grid-template-columns:1fr; } }

/* Dialog placement is separate from the shared close-button geometry. */
.download-dialog .dialog-close { position:absolute; right:18px; top:18px;}
