/* Current Home composition: Figma 191:934, 1458:4740, 1458:5455, 193:194. */
.hero { padding-block:var(--space-2xl) var(--space-3xl); }
.hero-copy { min-height:454px; }
.hero-heading { gap:var(--space-m); }
.hero .hero-description { margin-top:var(--space-m); }
.hero .hero-actions { margin-top:var(--space-l); }
.hero .offer-note { margin-top:var(--space-m); }
.hero .viewer-wrap { margin-top:0; gap:var(--space-m); }
.hero .hero-artwork { height:min(46.064815vw,497.5px); }
#overview [data-system-role],#features [data-system-role],#experience [data-system-role],#use-cases [data-system-role],#personalise [data-system-role],#mac-companion [data-system-role] { text-wrap:wrap; }
.control-feature-stack .control-symbol { width:24px; height:24px; flex:none; }
.demo-invitation .control-symbol { width:20px; height:20px; }
.palm-story .palm-copy .section-heading { color:var(--color-text-primary); }
.palm-story .palm-ground { transform:scaleY(-1); }

#features .feature-card { height:auto; min-height:var(--highlight-height); padding:32px 24px 24px; border-radius:24px; }
#features .feature-card-copy { flex:1; }
#features .feature-card .feature-visual { flex:none; height:210px; min-height:0; margin-top:16px; }
#features .feature-card .feature-visual img { height:100%; }
#features .highlight-controls { margin-top:var(--space-l); }
#experience .control-feature { gap:var(--space-m); padding:var(--space-l); }
#experience .text-article-copy { display:flex; flex-direction:column; gap:var(--space-s); }
#experience .text-article-copy > * { margin:0; }
#use-cases { --showroom-width:640px; --showroom-gap:88px; }
#mac-companion { padding-block:var(--space-4xl); }
#mac-companion .mc-intro { gap:var(--space-2xl); margin-inline:4px; }
#mac-companion .mc-macbook-visual { aspect-ratio:auto; height:410px; }
#mac-companion .mc-description { margin-top:var(--space-l); max-width:427px; }
#mac-companion .mc-features { margin-top:var(--space-l); }
#mac-companion .mc-requirements { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-s); min-height:44px; margin-top:var(--space-l); }
#personalise { background:var(--wash); padding-block:var(--space-4xl) 0; }
#personalise .chapter-intro .section-heading { max-width:none; }
#personalise .chapter-intro .heading-group { gap:var(--space-l); }
#appearance { padding-block:var(--space-xl) var(--space-3xl); }
#appearance .appearance-layout { grid-template-columns:456px minmax(0,1fr); min-height:0; gap:0 var(--space-2xl); align-items:center; }
#appearance .appearance-controls { grid-column:1; grid-row:1 / 3; align-self:center; gap:var(--space-l); }
#appearance .appearance-preview { position:static; grid-column:2; grid-row:1; width:100%; }
#appearance .appearance-3d-stage { width:min(100%,448px); aspect-ratio:448 / 400; margin-inline:auto; }
#appearance .appearance-caption { margin:0; padding-top:4px; min-height:56px; gap:0; align-content:start; }
#appearance .appearance-toolbar { margin:0; padding-top:16px; min-height:56px; }
#appearance .appearance-toolbar .segment { min-width:0; padding-inline:12px; }
#appearance .appearance-ar-action { grid-column:2; grid-row:2; padding-top:16px; min-height:60px; text-align:center; }
#appearance .appearance-ar-action .text-link { justify-content:center; }
#appearance .appearance-styles { grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--space-m); }
#appearance .keycap-art { width:80px; max-width:100%; }
#appearance .appearance-controls legend { margin-bottom:var(--space-m); }
#appearance .appearance-finishes { border-top:1px solid var(--line); padding-top:var(--space-l); }
#appearance .appearance-finish-current { display:none; }
#appearance .appearance-swatches { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:var(--space-m); }
#appearance .appearance-finish { width:auto; min-width:0; height:68px; grid-template-rows:44px 16px; gap:8px; }
#appearance .appearance-swatch { width:44px; height:44px; border:5px solid transparent; background-clip:padding-box; box-shadow:none; }
#appearance .appearance-finish:has(input:checked) .appearance-swatch { outline-offset:-2px; }
#appearance .appearance-finish:has(input:focus-visible) { outline:2px solid var(--blue); outline-offset:4px; }
.skin-picker { min-width:0; }
.skin-picker > summary { display:none; }
.skin-picker-panel { min-width:0; }

.lookalike-story.image-story { position:relative; display:block; height:66.666667vw; min-height:0; max-height:none; padding:0; overflow:hidden; }
.lookalike-story .lookalike-art { position:absolute; inset:0; margin:0; transform:none; }
.lookalike-story .lookalike-art img { position:absolute; top:-36.111111vw; left:0; width:100%; height:auto; max-width:none; transform:none; }
.lookalike-story .lookalike-copy { position:relative; z-index:1; width:100%; max-width:1060px; margin:0 auto; padding:var(--space-5xl) var(--page-gutter) 0; text-align:center; }
.lookalike-story .heading-group { display:flex; flex-direction:column; gap:var(--space-m); align-items:center; }
.lookalike-story .lookalike-copy .section-heading { margin:0; max-width:900px; }
.lookalike-story .lookalike-copy .section-description { margin:0; max-width:600px; color:var(--ink); }

.pricing-section { padding-block:var(--space-4xl); }
.pricing-section .pricing-heading { display:flex; flex-direction:column; align-items:center; gap:var(--space-m); height:auto; }
.pricing-section .pricing-heading .heading-description { margin:0; max-width:100%; text-align:center; }
.pricing-heading > *,#giving .heading-group > *,.lookalike-story .heading-group > * { flex:none; }
.pricing-section .pricing-heading .heading-description { width:100%; }
.pricing-section .price-card { grid-template-columns:minmax(0,1fr) 424px; gap:0; padding:0; margin-top:var(--space-xl); border-radius:var(--card-radius); overflow:hidden; }
.pricing-section .offer-art { position:relative; display:block; min-height:545px; overflow:hidden; background:var(--white); }
.pricing-section .offer-art .offer-picture { display:block; width:100%; height:100%; }
.pricing-section .offer-art img { position:static; display:block; width:100%; height:100%; max-height:none; max-width:none; mix-blend-mode:normal; object-fit:contain; transform:none; animation:none; }
.pricing-section .offer-copy { display:block; padding:var(--space-2xl); }
.pricing-section .offer-platform { margin:var(--space-s) 0 0; }
.pricing-section .price-card-top { margin-top:var(--space-s); }
.pricing-section .price-label { margin:var(--space-s) 0 0; color:var(--secondary); }
.pricing-section .included-list { margin:var(--space-l) 0; }
.pricing-section .included-list li { padding-block:var(--space-xs); }
.pricing-section .pricing-giving { margin:var(--space-m) 0 0; padding:0; }
.pricing-section .offer-identity img { width:40px; height:40px; }
.app-giving-callout { display:flex; align-items:center; gap:var(--space-xl); max-width:980px; margin:var(--space-m) auto 0; padding:var(--space-l); border:0; border-radius:var(--card-radius); background:var(--white); }
.app-giving-callout > img { width:53px; height:55px; object-fit:contain; flex:none; }
.app-giving-callout > div { flex:1; min-width:0; }
.app-giving-copy { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:var(--space-xl); row-gap:var(--space-xs); text-align:left; }
.app-giving-copy p { grid-column:1; }
.app-giving-copy > .text-link { grid-column:2; grid-row:1 / 3; align-self:center; }
.app-giving-callout p { margin:0; color:var(--secondary); }
.app-giving-callout .app-giving-title { color:var(--ink); font-weight:600; }
.app-giving-callout .text-link { flex:none; }
.pricing-footnote { margin:0 auto; padding-top:var(--space-l); text-align:center; }

#giving { padding-block:var(--space-4xl); background:var(--white); color:var(--ink); }
#giving .giving-content { display:flex; flex-direction:column; align-items:center; gap:var(--space-l); text-align:center; }
.giving-mark { display:block; width:72px; height:72px; }
#giving .heading-group { display:flex; flex-direction:column; align-items:center; gap:var(--space-l); width:100%; }
#giving .personal-heading { margin:0; color:var(--ink); }
#giving .personal-body { max-width:680px; margin:0; color:var(--secondary); }
.giving-actions { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:var(--space-l); }
.closing-scene.image-story { position:relative; display:block; height:40vw; min-height:0; max-height:none; padding:0; overflow:hidden; }
.closing-scene .cta-photo { position:absolute; inset:0; display:block; height:100%; transform:none; }
.closing-scene .cta-photo img { position:absolute; top:-10.555556vw; width:100%; height:auto; object-fit:cover; transform:none; }

@media(min-width:900px) and (max-width:1199px) {
  .hero-copy { min-height:406px; }
  #features .feature-card { height:auto; }
  #features .feature-card .feature-visual { margin-top:16px; }
  #mac-companion .mc-intro { margin-inline:0; }
  #mac-companion .mc-macbook-visual { height:446.628px; }
  .lookalike-story.image-story { height:75vw; }
  .lookalike-story .lookalike-art img { top:-29.296875vw; }
  .closing-scene .cta-photo img { top:-12.202644vw; }
  .pricing-section .offer-art { min-height:520px; }
  /* The source bitmap includes the card corner. Fill intermediate widths so
     letterboxing cannot show a second corner; keep the complete device at right. */
  .pricing-section .offer-art img { object-fit:cover; object-position:right center; }
}
@media(min-width:651px) and (max-width:899px) {
  .hero-copy { min-height:378px; }
  #features .feature-card { height:auto; }
  #features .feature-card .feature-visual { margin-top:16px; }
  #mac-companion .mc-intro { margin-inline:0; }
  #mac-companion .mc-macbook-visual { height:466px; }
  .lookalike-story.image-story { height:93.75vw; }
  .lookalike-story .lookalike-art img { top:-15.625vw; }
  .closing-scene.image-story { height:56.25vw; }
  .closing-scene .cta-photo img { top:-4.097239vw; }
  .pricing-section .price-card { grid-template-columns:minmax(0,1fr); }
  .pricing-section .offer-copy { display:grid; grid-template-columns:1fr 1fr; column-gap:var(--space-xl); }
  .pricing-section .offer-copy > :is(.offer-identity,.offer-platform,.price-card-top) { grid-column:1; }
  .pricing-section .included-list { grid-column:2; grid-row:1 / 4; margin:0; }
  .pricing-section .price-card-bottom,.pricing-section .pricing-giving { grid-column:2; }
  .pricing-section .offer-art { grid-row:2; min-height:352px; }
}
@media(min-width:900px) {
  #experience .experience-layout { grid-template-columns:minmax(0,389.78125fr) minmax(0,526.21875fr); gap:64px; align-items:start; }
  #experience .experience-copy { order:initial; width:auto; max-width:none; }
  #experience .interactive-product { order:initial; position:static; width:100%; max-width:none; padding-block:0; }
  #experience .product-device { width:100%; }
}
@media(min-width:651px) and (max-width:1199px) {
  .palm-story.palm-portrait { height:75vw; aspect-ratio:auto; min-height:0; }
  .palm-story.palm-portrait .palm-copy { inset:64px 0 auto; }
}
@media(min-width:651px) and (max-width:899px) {
  .palm-story.palm-portrait { height:93.75vw; }
}
@media(max-width:899px) {
  #appearance .appearance-layout { grid-template-columns:minmax(0,1fr); max-width:none; gap:var(--space-xl); }
  #appearance .appearance-preview { grid-column:1; grid-row:1; max-width:456px; margin-inline:auto; }
  #appearance .appearance-3d-stage { width:min(100%,360px); aspect-ratio:360 / 310.3413; }
  #appearance .appearance-controls { grid-column:1; grid-row:2; max-width:456px; width:100%; }
  #appearance .appearance-ar-action { grid-column:1; grid-row:3; }
}
@media(max-width:650px) {
  .hero { padding-block:var(--space-xl) var(--space-3xl); }
  .hero-copy { min-height:306px; }
  .hero .viewer-wrap { gap:var(--space-s); }
  .hero .hero-artwork { height:clamp(320px,92.3077vw,360px); }
 #features .feature-card { width:calc(100% - 48px); height:auto; padding:24px; }
  #features .feature-card .feature-visual { height:210px; margin-top:12px; }
  #features .feature-grid { margin-top:var(--space-xl); }
  #features .highlight-controls { margin-top:var(--space-l); }
  #use-cases { --showroom-width:calc(100vw - 64px); --showroom-gap:var(--space-4xl); }
  #mac-companion { padding-block:var(--space-4xl); }
  #mac-companion .mc-intro { margin-inline:0; gap:var(--space-xl); }
  #mac-companion .mc-macbook-visual { height:calc(100vw - 64px); }
  #mac-companion .mc-features { margin-top:var(--space-xl); }
  #mac-companion .mc-feature { row-gap:8px; min-height:77px; }
  #mac-companion .mc-requirements { margin-top:var(--space-xl); }
  #experience .control-feature { padding:16px 24px 24px; min-height:117px; gap:12px; }
  #experience .control-feature-stack { margin-top:56px; }
  #experience .demo-invitation { text-align:left; }
  .pricing-section .pricing-heading { gap:var(--space-m); }
  .pricing-section .price-card { margin-top:var(--space-xl); }
  #personalise { padding-top:var(--space-3xl); }
  #appearance { padding-block:var(--space-xl) var(--space-3xl); }
  #personalise .chapter-intro .heading-group { gap:var(--space-l); }
  #appearance .appearance-layout { gap:var(--space-xl); padding-inline:24px; }
  #appearance .appearance-preview { max-width:none; }
  #appearance .appearance-3d-stage { width:calc(100% - 16px); aspect-ratio:326 / 281.03125; }
  #appearance .appearance-caption { min-height:47px; }
  #appearance .appearance-toolbar { padding-top:16px; min-height:56px; }
  #appearance .appearance-ar-action { padding-top:12px; min-height:56px; }
  #appearance .appearance-finishes { border:0; padding-top:0; }
  #appearance .appearance-controls legend { margin-bottom:12px; }
  #appearance .appearance-finish-current { display:inline; }
  #appearance #appearance-finish-name { color:inherit; font-weight:inherit; }
  #appearance .appearance-finish { height:44px; }
  #appearance .appearance-swatches { gap:12px; }
  #appearance .appearance-controls { width:100%; max-width:none; gap:var(--space-xl); }
  .skin-picker > summary { display:flex; align-items:center; gap:12px; padding:8px 12px; border:0; box-shadow:inset 0 0 0 1px var(--line); border-radius:16px; min-height:56px; cursor:pointer; list-style:none; background:var(--white); }
  .skin-picker > summary::-webkit-details-marker { display:none; }
  .skin-picker-art { display:block; width:40px; height:40px; object-fit:contain; }
  .skin-picker > summary > span { display:grid; gap:0; text-align:left; }
  .skin-picker-label { font-size:12px; color:var(--secondary); }
  .skin-picker > summary > .ui-icon { margin-left:auto; }
  .skin-picker-panel { padding-top:var(--space-l); }
  #appearance .appearance-colour-name { display:none; }
  .lookalike-story.image-story { height:116vw; }
  .lookalike-story .lookalike-art img { top:0; height:100%; object-fit:cover; }
  .lookalike-story .lookalike-copy { padding-top:var(--space-xl); }
  .lookalike-story .lookalike-copy .section-description { max-width:326px; }
  .pricing-section { padding-block:var(--space-4xl); }
  .pricing-section .price-card { display:flex; flex-direction:column; gap:0; padding:0; }
  .pricing-section .offer-copy { display:block; padding:var(--space-xl); order:0; }
  .pricing-section .offer-art { order:1; min-height:0; height:260px; flex:none; width:100%; align-self:stretch; }
  .app-giving-callout { gap:var(--space-l); padding:var(--space-l); align-items:flex-start; }
  .app-giving-callout > img { width:48px; height:50px; }
  .app-giving-callout .text-link { margin-top:var(--space-s); }
  .app-giving-copy { display:block; }
  #giving .heading-group { gap:var(--space-l); }
  .closing-scene.image-story { height:125.128205vw; }
  .closing-scene .cta-photo img { inset:0; height:100%; object-fit:cover; }
}

/* Figma FAQ items include a four-pixel inset after the disclosure. */
#questions .faq-list details { padding-bottom:var(--space-xs); }
#questions .disclosure-summary { min-height:58px; }
@media(min-width:651px) and (max-width:1199px) { #questions .disclosure-summary { min-height:56px; } }
@media(max-width:650px) { #questions .disclosure-summary { min-height:55px; } }
.pricing-footnote { width:100%; max-width:none; }
.pricing-footnote > p { margin:0; }
.pricing-footnote :is(.price-requirements,.pricing-requirements) { margin:0 auto; }

#features .highlight-controls > div,#use-cases .gallery-controls > div { display:flex; align-items:center; gap:16px; }
#use-cases .scenario-caption { max-width:none; width:100%; }
#use-cases .scenario-card > .scenario-media { margin-bottom:16px!important; }
#experience .control-feature { min-height:136px; }
@media(min-width:900px) and (max-width:1199px) { #experience .control-feature { min-height:129px; } }
@media(min-width:651px) and (max-width:899px) { #experience .control-feature { min-height:104px; } }
@media(max-width:650px) {
 #experience .control-feature { min-height:117px; }
 #use-cases { --showroom-media-ratio:1; }
 .pricing-section .offer-identity img { width:40px; height:40px; }
 .app-giving-title { margin-bottom:4px; }
}

#palm.palm-story .palm-copy { inset:clamp(24px, 3vw, 40px) 0 auto; padding-block:0; }
#lookalike .heading-group { gap:24px; }
@media(min-width:900px) and (max-width:1199px) {
 #palm .palm-foreground img { top:13.971377vw; left:0; width:100%; }
}
@media(min-width:651px) and (max-width:899px) {
 #palm .palm-foreground img { top:15.2604427vw; left:-9.375%; width:118.75%; }
}
@media(max-width:650px) {
 #palm .palm-foreground img { top:35.948705vw; bottom:auto; left:-36.153846%; width:172.307692%; }
 #lookalike .lookalike-copy { padding-top:var(--space-2xl); }
}

#features .feature-card p { max-width:none; }
@media(min-width:900px) and (max-width:1199px) { #appearance .appearance-caption { min-height:53px; } }
@media(min-width:651px) and (max-width:899px) { #appearance .appearance-caption { min-height:52px; } }

/* Independent stacks reproduce Figma's tablet purchase layout. */
#pricing .included-list { gap:4px; }
#pricing .included-list li { gap:var(--space-m); }
#pricing .included-list li::before { font:inherit; letter-spacing:inherit; color:var(--color-text-secondary); }
@media(min-width:651px) and (max-width:899px) {
 #pricing .offer-copy { align-items:start; }
 #pricing .offer-main,#pricing .offer-inclusions { min-width:0; }
 #pricing .offer-inclusions .included-list { margin:0 0 24px; }
 #pricing .offer-inclusions .pricing-giving { margin-top:16px; }
 #pricing .app-giving-callout { align-items:flex-start; }
 #pricing .app-giving-copy { display:block; }
 #pricing .app-giving-title { margin-bottom:4px; }
 #pricing .app-giving-copy > .text-link { margin-top:4px; }
}
@media(max-width:650px) {
 #use-cases { --showroom-media-ratio:5 / 4; --showroom-gap:24px; }
 #use-cases .scenario-track { margin-top:48px; }
 #use-cases .scenario-card > .scenario-media { margin-bottom:12px!important; }
 #use-cases .gallery-controls { margin-top:24px; }
}

@media(min-width:900px) and (max-width:1199px) { #features .feature-card { width:308px; } }
@media(min-width:651px) and (max-width:899px) { #features .feature-card { width:292px; } }
@media(max-width:650px) { #features .feature-card { width:min(278px,calc(100vw - 112px)); padding:32px 24px 24px; } }

@media(min-width:651px) and (max-width:899px) { #pricing .offer-art { height:auto; min-height:0; aspect-ratio:688 / 352; } }
@media(max-width:650px) { #pricing .offer-art { height:auto; min-height:0; aspect-ratio:326 / 260; } }
/* The raster fallback uses the measured Figma image bounds; the live viewer
   retains its existing controls and rendering engine. */
#overview .hero-device-still { left:calc(50% - min(19.722222vw,213px)); top:48px; width:min(40.87963vw,441.5px); height:min(35.625509vw,384.7555px); object-fit:cover; }
#overview .hero-shadow-still { left:calc(50% - min(21.035789vw,227.1865px)); top:291.7227px; width:min(42.609649vw,460.1842px); height:min(19.574805vw,211.4079px); }
@media(min-width:900px) and (max-width:1199px) {
 #overview .hero-device-still { top:45.9259px; }
 #overview .hero-shadow-still { top:277.011px; }
}
@media(min-width:651px) and (max-width:899px) {
 #overview .hero-device-still { top:36.4445px; }
 #overview .hero-shadow-still { top:209.7583px; }
}
@media(max-width:650px) {
 #overview .hero-device-still { left:calc(50% - min(37.179487vw,145px)); top:0; width:min(76.923077vw,300px); height:min(67.070406vw,261.5746px); }
 #overview .hero-shadow-still { left:calc(50% - min(39.619504vw,154.5181px)); top:min(49.444103vw,192.832px); width:min(80.08677vw,312.3384px); height:min(36.879691vw,143.8308px); }
}

/* Match the desktop companion image crop while retaining its live controls. */
@media(min-width:1200px) {
 #mac-companion .mc-macbook-hardware { top:-53.8633px; }
 #mac-companion .mc-popover-plane { top:16.8px; }
}

/* Scroll enhancement keeps the authored still crop as the reduced-motion and
   no-JavaScript baseline. Overscan prevents edges appearing during movement. */
@media(prefers-reduced-motion:no-preference) {
 .lookalike-story.image-story.has-photo-parallax .lookalike-art,
 .closing-scene.image-story.has-photo-parallax .cta-photo {
  inset:calc(0px - var(--photo-parallax-travel)) 0 auto;
  height:calc(100% + var(--photo-parallax-travel) + var(--photo-parallax-travel));
  transform:translate3d(0,var(--photo-parallax-offset,0px),0);
 }
 .image-story.has-photo-parallax :is(.lookalike-art,.cta-photo) { will-change:auto; }
 .image-story.has-photo-parallax.is-photo-visible :is(.lookalike-art,.cta-photo) { will-change:transform; }
}