@font-face{font-family:Desk Inter;src:url('hero-desk/inter.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:Desk Jakarta;src:url('hero-desk/jakarta.woff2') format('woff2');font-weight:100 900;font-display:swap}
.hero.hf-desk-hero{padding:0;margin:0;min-height:0;height:220svh;position:relative;z-index:2;background:#fff;border-radius:0;isolation:isolate}
.hf-desk-stage{position:sticky;top:0;height:100svh;min-height:540px;overflow:hidden;border-radius:0 0 18px 18px;isolation:isolate;contain:layout paint}
.hf-desk-scene{position:absolute;inset:0;transform-origin:50% 53%;will-change:transform,opacity}
.hf-desk-wood{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none}
.hf-desk-left-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,16,7,.35),transparent 42%),linear-gradient(180deg,rgba(18,14,8,.28),transparent 26%);pointer-events:none}
.hf-desk-prop{position:absolute;pointer-events:none;transform-origin:center;will-change:transform}
.hf-desk-prop svg{display:block;width:100%;height:auto;overflow:visible}
.hf-desk-plant{left:0;top:0;width:31.75%;filter:drop-shadow(-35px 104px 12px rgba(16,21,9,.43))}
.hf-desk-plant canvas{display:block;width:100%;height:auto;aspect-ratio:540/330}
.hf-desk-plant svg{position:absolute;inset:0}
.hf-desk-plant.wind-ready svg{opacity:0}
.hf-desk-tray{left:58.5%;top:0;width:20%;filter:drop-shadow(-21px 22px 7px rgba(26,20,12,.44))}
.hf-desk-coffee{right:0;top:0;width:17.1%;filter:drop-shadow(-80px 119px 13px rgba(21,16,10,.45))}
.hf-desk-pen{right:2.7%;top:38.2%;width:20.58%;filter:drop-shadow(-13px 17px 7px rgba(31,19,9,.45));transform-origin:53% 54%}
.hf-desk-notebook{left:4.2%;bottom:-.3%;width:30.58%;filter:drop-shadow(-13px 21px 9px rgba(26,17,10,.32))}
.hf-desk-remote{left:43.7%;bottom:-.1%;width:12.87%;filter:drop-shadow(-6px 12px 6px rgba(24,17,10,.4))}
.hf-desk-paper{position:absolute;inset:0;z-index:2;background:#fff;border-radius:18px;transform:scale(.02);opacity:0;transform-origin:50% 53%;will-change:transform,opacity;pointer-events:none}
.hf-desk-phone{position:absolute;z-index:5;left:50%;top:51.6%;height:74.1%;aspect-ratio:263/529;transform:translate3d(-50%,-50%,0);will-change:transform;filter:drop-shadow(-12px 16px 6px rgba(24,15,9,.34))}
.hf-desk-phone svg{width:100%;height:100%;display:block}
.hf-desk-copy{position:absolute;z-index:6;left:3.8%;top:33.9%;width:34%;color:#fff;will-change:transform,opacity}
.hf-desk-copy h1{font-family:Desk Inter,Arial,sans-serif!important;font-weight:600!important;font-size:clamp(28px,3.75vw,50px)!important;line-height:1.075!important;letter-spacing:-.019em!important;text-align:left!important;margin:0!important;max-width:none!important;word-spacing:0}
.hf-desk-copy h1>span{display:block;white-space:nowrap}
.hf-desk-team{display:inline-block;position:relative;min-width:3.32em}
.hf-desk-team canvas{position:absolute;left:-.03em;top:-.65em;width:3.52em;height:1.82em;pointer-events:none}
.hf-desk-team.is-live>span{opacity:0}
.hf-desk-copy p{font:400 clamp(17px,2.12vw,29px)/1.05 Desk Inter,Arial,sans-serif;color:#fff;margin:27px 0 0;text-align:left;letter-spacing:-.02em}
.hf-desk-copy .hf-desk-cta{display:inline-flex;align-items:center;justify-content:center;min-height:56px;border-radius:999px;background:#fff;color:#161918;padding:0 25px;margin-top:76px;text-decoration:none;font:650 15px/1.2 Desk Inter,Arial,sans-serif;transition:transform .35s cubic-bezier(.2,1.1,.3,1)}
.hf-desk-copy .hf-desk-cta:hover{transform:translate3d(0,-3px,0)}
.hf-desk-copy .hf-desk-cta:active{transform:scale(.97)}
.hf-desk-copy .hf-desk-fine{font:400 13px/1.1 Desk Inter,Arial,sans-serif;letter-spacing:0;max-width:380px;margin:28px 0 0}
.hf-desk-preview{position:absolute;z-index:7;right:3.8%;bottom:6.9%;width:14.15%;min-width:160px;padding:10px;border:0;border-radius:13px;background:#fff;color:#929292;text-decoration:none;font:400 15px/1.1 Desk Inter,Arial,sans-serif;will-change:transform,opacity}
.hf-desk-preview>span{display:block;margin:3px 6px 13px;white-space:nowrap;font-size:clamp(10px,1.1vw,15px)}
.hf-desk-preview .hf-desk-preview-media{height:clamp(115px,13.65vw,182px);background:#d7d7d7;border-radius:8px;position:relative}
.hf-desk-preview b{position:absolute;bottom:9px;left:10px;border-radius:999px;padding:9px 12px;background:#fff;color:#151616;font-size:12px;font-weight:600}
.hf-desk-preview b:before{content:'▶';font-size:11px;padding-right:6px}
.hf-desk-preview:hover{transform:translate3d(0,-3px,0)}
.hf-desk-cta:focus-visible,.hf-desk-preview:focus-visible{outline:3px solid #fff;outline-offset:5px}
.hf-desk-split{position:absolute;z-index:3;inset:0;color:#191b19;opacity:0;pointer-events:none}
.hf-desk-split>div{position:absolute;top:40.4%;width:33%}
.hf-desk-split-left{right:calc(50% + 13.6%);text-align:right}
.hf-desk-split-right{left:calc(50% + 13.6%);text-align:left}
.hf-desk-split h2{font:650 clamp(34px,6.85vw,93px)/1 Desk Inter,Arial,sans-serif;letter-spacing:-.055em;margin:0 0 20px;white-space:nowrap}
.hf-desk-split p{font:400 clamp(13px,1.36vw,18px)/1.55 Desk Inter,Arial,sans-serif;letter-spacing:0;margin:0}
.hf-desk-mascot{position:absolute;z-index:4;opacity:0;will-change:transform,opacity;pointer-events:none;width:10%;aspect-ratio:1}
.hf-desk-mascot canvas{width:100%;height:100%;display:block}
.hf-desk-mascot:nth-of-type(1){right:59.8%;top:17%}
.hf-desk-mascot:nth-of-type(2){left:59.8%;top:17%}
.hf-desk-mascot:nth-of-type(3){right:59.8%;bottom:12%}
.hf-desk-mascot:nth-of-type(4){left:59.8%;bottom:12%}
body.hf-desk-intro .nav:not(.scrolled):not(.open){background:transparent;border-color:transparent;box-shadow:none;color:#fff}
body.hf-desk-intro .nav:not(.scrolled):not(.open) .wordmark,body.hf-desk-intro .nav:not(.scrolled):not(.open) .nlink{color:#fff}
body.hf-desk-intro .nav:not(.scrolled):not(.open) .logo img{filter:brightness(0) invert(1)}
body.hf-desk-intro .nav:not(.scrolled):not(.open) .nav-cta{--bg:#fff;--fg:#171918}
@media(max-width:760px){
 .hero.hf-desk-hero{height:200svh}
 .hf-desk-stage{min-height:760px}
 .hf-desk-plant{width:54%;left:-5%;top:-1%}
 .hf-desk-tray{width:27%;left:51%}
 .hf-desk-coffee{width:29%;right:-8%}
 .hf-desk-pen{width:34%;right:-5%;top:46%}
 .hf-desk-notebook{width:51%;left:-12%}
 .hf-desk-remote{width:18%;left:42%}
 .hf-desk-copy{left:6%;top:15%;width:88%;text-align:left}
 .hf-desk-copy h1{font-size:clamp(27px,7.1vw,42px)!important;line-height:1.04!important}
 .hf-desk-copy p{font-size:18px;margin:14px 0 0}
 .hf-desk-copy .hf-desk-cta{min-height:40px;font-size:12px;padding:0 17px;margin-top:18px}
 .hf-desk-copy .hf-desk-fine{display:none}
 .hf-desk-phone{height:48%;top:72.5%;left:48%;filter:drop-shadow(-8px 12px 5px rgba(24,15,9,.34))}
 .hf-desk-preview{right:5%;bottom:6%;width:23%;min-width:0;padding:5px;border-radius:8px}
 .hf-desk-preview>span{font-size:8px;white-space:normal;margin:3px 2px 6px}
 .hf-desk-preview .hf-desk-preview-media{height:94px;border-radius:5px}
 .hf-desk-preview b{font-size:9px;padding:5px 7px;left:4px;bottom:5px}
 .hf-desk-split>div{top:14%;width:auto}
 .hf-desk-split-left{left:6%;right:auto;text-align:left}
 .hf-desk-split-right{right:6%;left:auto;text-align:right}
 .hf-desk-split h2{font-size:36px;margin-bottom:13px}
 .hf-desk-split p{font-size:11px;max-width:150px}
 .hf-desk-mascot{width:18%}
 .hf-desk-mascot:nth-of-type(1){right:69%;top:38%}
 .hf-desk-mascot:nth-of-type(2){left:66%;top:40%}
 .hf-desk-mascot:nth-of-type(3){right:70%;bottom:17%}
 .hf-desk-mascot:nth-of-type(4){left:68%;bottom:16%}
}
@media(prefers-reduced-motion:reduce){.hf-desk-scene,.hf-desk-prop,.hf-desk-phone,.hf-desk-copy,.hf-desk-mascot{will-change:auto}.hf-desk-copy .hf-desk-cta{transition:none}}
/* Override the former flex-centered typographic hero. */
.hero.hf-desk-hero{display:block;align-items:initial;justify-content:initial}
.hf-desk-stage{width:100%}
.hero.hf-desk-hero{overflow:visible}
.hf-desk-copy h1{color:#fff!important}
/* Only the HearFlow · iPhone eyebrow is visually hidden. */
.hf-desk-copy .hf-desk-eyebrow{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%);white-space:nowrap}
.hf-desk-prop svg{overflow:hidden}
body.hf-desk-intro .nav:not(.open){background:transparent!important;border-color:transparent!important;box-shadow:none!important;color:#fff}
body.hf-desk-intro .nav:not(.open) .nlink,body.hf-desk-intro .nav:not(.open) .brand{color:#fff}
body.hf-desk-intro .nav:not(.open) .nav-cta{--bg:#fff;--fg:#171918}
.hf-desk-team canvas{left:-.06em;top:-.64em;width:3.4em;height:1.8em}
body.hf-desk-intro .nav:not(.open) .brand-word{color:#fff}
body.hf-desk-intro .nav:not(.open) .logo img{filter:brightness(0) invert(1)}

.hf-desk-soft{filter:blur(10px);opacity:0;pointer-events:none}
.hf-desk-soft-cached{filter:none}
.hf-desk-soft-cached>canvas{display:block;width:100%;height:100%}
/* The fixed header needs no live backdrop sampling of the moving scene. */
body.hf-desk-visible:not(.hf-desk-intro) .nav:not(.open)::before{backdrop-filter:none;-webkit-backdrop-filter:none;background:color-mix(in srgb,var(--cream-1) 94%,transparent)}
.hf-desk-mascot{width:8.8%}
@media(max-width:760px){.hf-desk-mascot{width:18%}}
/* Native reference placement, accounting for each transparent crop origin. */
.hf-desk-pen{right:.35%;top:34.59%}
.hf-desk-phone{top:52%;height:73.47%}
@media(max-width:760px){.hf-desk-pen{right:-5%;top:46%}.hf-desk-phone{top:72.5%;height:48%}}

.hf-desk-preview>span{font-size:clamp(10px,1vw,14px)}
.hf-desk-split h2{font-weight:700;font-size:clamp(34px,7.2vw,98px)}
/* Keep navigation interactive through every chapter of the pinned hero. */
body.hf-desk-visible .nav{transform:none;opacity:1;pointer-events:auto}
@media(max-width:760px){.hf-desk-preview>span{font-size:8px}.hf-desk-split h2{font-size:36px}}

.hf-desk-phone{filter:none!important}
.hf-desk-phone-shadow{position:absolute;inset:5px;border-radius:49px;box-shadow:-12px 16px 6px rgba(24,15,9,.34);z-index:-1;will-change:opacity}
body.hf-desk-intro .nav:not(.open)::before{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.hf-desk-intro .nav:not(.open){margin:0;border-radius:0;padding:16px 28px;width:100%;max-width:none}
body.hf-desk-intro .nav:not(.open) #globeBtn{color:#fff}
body.hf-desk-intro .nav:not(.open) .nav-burger{color:#fff;border-color:#ffffff73}
body.hf-desk-intro .nav:not(.open) .nav-burger span,body.hf-desk-intro .nav:not(.open) .nav-burger span::before,body.hf-desk-intro .nav:not(.open) .nav-burger span::after{background:currentColor}
@media(max-width:760px){body.hf-desk-intro .nav:not(.open){padding:14px 18px}.hf-desk-phone-shadow{box-shadow:-8px 12px 5px rgba(24,15,9,.34)}}

.hf-desk-soft .hf-desk-plant{aspect-ratio:540/330}
/* Complete objects: the painted silhouette has generous source padding.
   Only the viewport clips the desk; no transformed object has a crop mask. */
.hf-desk-prop{filter:none!important;overflow:visible;will-change:auto;transform:none!important}
.hf-prop-surface{position:relative;width:100%;overflow:visible;transform-origin:50% 50%;will-change:transform}
.hf-prop-surface>img,.hf-prop-shadow>img{display:block;width:100%;height:auto;max-width:none;pointer-events:none;user-select:none}
.hf-prop-shadow{position:absolute;inset:0;width:100%;filter:brightness(0) blur(8px);opacity:.24;transform-origin:50% 50%;will-change:transform;pointer-events:none}
.hf-desk-plant{left:-12%;top:-34%;width:49%;bottom:auto;right:auto}
.hf-desk-plant canvas{position:absolute;inset:0;display:block;width:100%;height:100%;aspect-ratio:auto;pointer-events:none}
.hf-desk-plant.wind-ready .hf-prop-surface>img{opacity:0}
.hf-desk-tray{left:55.5%;top:-16%;width:28%;right:auto;bottom:auto}
.hf-desk-coffee{right:-9%;top:-27%;width:30%;left:auto;bottom:auto}
.hf-desk-pen{right:-2%;top:27%;width:28%;left:auto;bottom:auto}
.hf-desk-notebook{left:-7%;top:70%;width:44%;bottom:auto;right:auto}
.hf-desk-remote{left:37%;top:92%;width:26%;bottom:auto;right:auto}
.hf-desk-team{min-width:0;width:3.34em;height:1em;vertical-align:baseline}
.hf-team-accessible{position:absolute!important;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.hf-team-letters{display:inline-block;white-space:nowrap}
.hf-team-letter{display:inline-block;will-change:transform,opacity;transform-origin:50% 80%}
.hf-team-avatars{position:absolute;inset:0;pointer-events:none}
.hf-team-avatar{position:absolute;left:calc(var(--i)*.535em - .01em);top:.23em;width:.71em;height:.71em;opacity:0;transform-origin:50% 80%;will-change:transform,opacity}
.hf-team-avatar svg,.hf-desk-mascot svg{display:block;width:100%;height:100%;overflow:hidden}
.hf-desk-mascot{aspect-ratio:1}
@media(max-width:760px){
 .hf-desk-plant{left:-25%;top:-17%;width:81%}
 .hf-desk-tray{left:47%;top:-7%;width:49%}
 .hf-desk-coffee{right:-23%;top:-8%;width:51%}
 .hf-desk-pen{right:-6%;top:43%;width:52%}
 .hf-desk-notebook{left:-18%;top:87%;width:76%}
 .hf-desk-remote{left:27%;top:94%;width:47%}
 .hf-prop-shadow{filter:brightness(0) blur(5px)}
}
@media(prefers-reduced-motion:reduce){.hf-team-letter,.hf-team-avatar,.hf-prop-surface,.hf-prop-shadow{will-change:auto}}
/* Reference anchors corrected for the complete-image transparent margins. */
.hf-desk-plant{top:-43%;width:49%}
.hf-desk-coffee{top:-23%}
.hf-desk-pen{width:25%;right:-1%;top:35%}
.hf-desk-remote{width:30%;left:34.8%;top:87.8%}
.hf-desk-soft .hf-desk-plant{aspect-ratio:auto}
@media(max-width:760px){
 .hf-desk-plant{left:-25%;top:-17%;width:81%}
 .hf-desk-coffee{right:-23%;top:-8%;width:51%}
 .hf-desk-pen{right:-6%;top:43%;width:52%}
 .hf-desk-remote{left:27%;top:94%;width:47%}
}
/* Bound blur rasterization to the viewport, while each object remains unclipped. */
.hf-desk-scene{contain:paint}
.hf-desk-pen{width:min(25vw,46svh)}
@media(max-width:760px){.hf-desk-pen{width:52%}}
/* The former download button's mobile flex rule must not collapse the preview. */
#heroDownload.hf-desk-preview{display:block}
#heroDownload.hf-desk-preview .hf-desk-preview-media{width:100%;flex:none}
#heroDownload.hf-desk-preview>span{line-height:1.2}
#heroDownload.hf-desk-preview:hover{background:#fff}
.hf-desk-scene{background:#986d49}

/* HearFlow iPhone copy in the existing desk composition; plain App Store QR. */
.hf-desk-copy{top:27%;width:calc(50% - 17% - 3.8%);max-width:430px}
.hf-desk-copy h1{font-size:clamp(27px,3.05vw,42px)!important;line-height:1.12!important}
.hf-desk-copy h1>span{white-space:normal}
.hf-desk-copy .hf-desk-eyebrow{font:600 12px/1.4 Desk Inter,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;margin:0 0 18px;color:rgba(255,255,255,.86)}
.hf-desk-copy .hf-desk-intro-copy{font:400 clamp(14px,1.23vw,17px)/1.55 Desk Inter,Arial,sans-serif;letter-spacing:0;margin-top:22px;text-wrap:pretty}
.hf-desk-copy .hf-desk-cta{margin-top:25px;min-height:50px;font-size:14px;padding:0 23px}
.hf-desk-qr{position:absolute;z-index:7;right:15%;bottom:7.6%;width:clamp(120px,12.5vw,180px);aspect-ratio:1;display:block;padding:0;border:0;border-radius:0;background:none;box-shadow:none;will-change:opacity}
.hf-desk-qr img{display:block;width:100%;height:auto;border:0;border-radius:0}
.hf-desk-qr:focus-visible{outline:3px solid #fff;outline-offset:5px}
.hf-desk-split h2{font-size:clamp(34px,5.25vw,72px)}
.hf-desk-split p{max-width:315px;text-wrap:pretty}
.hf-desk-split-left p{margin-left:auto}
@media(max-width:760px){
 .hf-desk-copy{left:6%;top:13%;width:88%;max-width:none}
 .hf-desk-copy h1{font-size:clamp(28px,7.5vw,40px)!important;line-height:1.1!important}
 .hf-desk-copy .hf-desk-eyebrow{font-size:10px;margin-bottom:12px}
 .hf-desk-copy .hf-desk-intro-copy{font-size:14px;line-height:1.45;margin-top:14px}
 .hf-desk-copy .hf-desk-cta{font-size:12px;min-height:40px;padding:0 17px;margin-top:16px}
 .hf-desk-phone{height:45%;top:74.3%}
 .hf-desk-qr{width:90px;right:3%;bottom:5%}
 .hf-desk-split h2{font-size:36px}
 .hf-desk-split p{max-width:145px;font-size:12px;line-height:1.45}
}

/* Regenerated high-resolution hardware; genuine screenshot in its screen aperture. */
.hf-desk-phone{aspect-ratio:811/1646;height:min(73.47%,40vw,650px)}
.hf-desk-phone-shadow{inset:3px 4px;border-radius:18% / 9%;box-shadow:-9px 15px 12px rgba(24,15,9,.24),0 2px 3px rgba(24,15,9,.25)}
@media(max-width:760px){.hf-desk-phone{height:45%}.hf-desk-phone-shadow{border-radius:18% / 9%;box-shadow:-6px 11px 8px rgba(24,15,9,.24),0 2px 3px rgba(24,15,9,.25)}}

/* Only the two requested agent marks in the white Dictate / Read it scene. */
.hf-desk-mascot.hf-desk-claude{left:65%;right:auto;top:17%;bottom:auto;width:112px;aspect-ratio:1}
.hf-desk-claude canvas{image-rendering:pixelated;width:100%;height:100%}
.hf-desk-mascot.hf-desk-codex{left:auto;right:65%;top:auto;bottom:15%;width:140px;aspect-ratio:650/205}
.hf-desk-codex img{display:block;width:100%;height:auto;filter:brightness(0)}
@media(max-width:760px){
 .hf-desk-mascot.hf-desk-claude{left:auto;right:7%;top:38%;width:72px}
 .hf-desk-mascot.hf-desk-codex{left:3%;right:auto;bottom:17%;width:60px}
}

/* Direct Retina app images and native word layers; no screenshot nested in SVG. */
.hero.hf-desk-hero{height:320svh}
.hf-desk-device{position:relative;z-index:1}
.hf-desk-display{position:absolute;z-index:2;left:5.5487%;top:2.3086%;width:88.5327%;height:95.5043%;border-radius:15.5989% / 7.1247%;overflow:hidden;background:#fff;pointer-events:none;isolation:isolate;contain:paint}
.hf-desk-display>.hf-desk-home-shot,.hf-desk-audios,.hf-desk-audios-chrome{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;image-rendering:auto}
.hf-desk-audios{opacity:0}
.hf-desk-audio-list{position:absolute;inset:0;clip-path:inset(18.1152% 0 11.518%);background:#fff}
.hf-desk-audio-header{position:absolute;left:0;width:100%;overflow:hidden}
.hf-desk-audio-header img{position:absolute;left:0;width:100%;object-fit:fill;max-height:none;max-width:none}
.hf-desk-audio-word{position:absolute;font:400 calc(var(--hf-screen-unit, .2px) * 48)/1 -apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;white-space:pre;letter-spacing:0;color:rgba(20,21,22,.74);transform-origin:left bottom;pointer-events:none}
.hf-desk-island{position:absolute;z-index:3;left:36.4982%;top:4.4957%;width:26.6338%;height:3.706%;border-radius:999px;background:#030303;pointer-events:none}
.hf-desk-island:after{content:"";position:absolute;right:9%;top:39%;width:5%;aspect-ratio:1;border-radius:50%;background:#0d1520}
@media(max-width:760px){.hero.hf-desk-hero{height:320svh}}

/* More room for readable app typography, with clear space beside the device. */
@media(min-width:761px){
 .hf-desk-phone{height:min(82%,44vw,760px);will-change:auto}
 .hf-desk-split-left{right:calc(50% + 16%)}
 .hf-desk-split-right{left:calc(50% + 16%)}
}

/* Home uses the same native-text path as Audios, retaining genuine capture icons. */
.hf-desk-home,.hf-desk-home-shot{position:absolute;inset:0;width:100%;height:100%;display:block}
.hf-desk-home-text{position:absolute;background:#fff;display:flex;align-items:center;overflow:visible}
.hf-desk-home-line{position:absolute;left:calc(var(--hf-screen-unit, .2px) * 5);font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;line-height:1;white-space:pre;letter-spacing:0;transform-origin:left center}

/* The iPhone → Mac chapter continues in the same pinned hero. */
.hero.hf-desk-hero{height:620svh}
.hf-desk-display:after{content:"";position:absolute;left:39%;top:8.1%;width:21.5%;height:4.25%;background:white;z-index:5}
.hf-shared-brand{position:absolute;z-index:12;pointer-events:none;transform:translate(-50%,-50%);contain:layout style;transform-origin:center;will-change:transform}
.hf-shared-brand img{display:block;width:100%;height:100%;object-fit:contain}
.hf-mac-surface-scene{position:absolute;inset:0;z-index:8;opacity:0;pointer-events:none;contain:layout paint;will-change:opacity}
.hf-mac-surface-camera{position:absolute;transform-origin:0 0;will-change:transform;pointer-events:none}
.hf-mac-surface-app{position:absolute;left:9%;top:10%;width:82%;aspect-ratio:2240/1520;border-radius:8px;background:#f4f0e7}
.hf-mac-scene{position:absolute;inset:0;z-index:9;opacity:0;pointer-events:none;contain:layout paint}
.hf-mac-hardware{position:absolute;left:50%;top:50%;width:min(88vw,1080px,135svh);aspect-ratio:1100/670;transform-origin:0 0}
.hf-mac-hardware{contain:layout style;z-index:1;will-change:transform}
.hf-mac-raster{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform;pointer-events:none}
.hf-mac-app-detail{position:absolute;z-index:6;display:block;max-width:none;pointer-events:none;user-select:none;will-change:opacity}
.hf-mac-scene{will-change:opacity}
.hf-mac-copy{position:absolute;inset:0;z-index:10;opacity:0;pointer-events:none;color:#191b19;will-change:transform,opacity}
/* Shared anchors and alignment with the Dictate / Read it chapter. */
.hf-mac-copy>div{position:absolute;top:40.4%;width:33%}
.hf-mac-copy h2{font:700 clamp(30px,4vw,54px)/1 Desk Inter,Arial,sans-serif;letter-spacing:-.055em;margin:0 0 20px;text-wrap:balance}
.hf-mac-copy p{font:400 clamp(13px,1.36vw,18px)/1.55 Desk Inter,Arial,sans-serif;letter-spacing:0;margin:0;max-width:315px;text-wrap:pretty}
.hf-mac-copy .hf-desk-split-left p{margin-left:auto}
.hf-mac-copy .hf-mac-copy-note{font-size:12px;margin-top:18px;color:var(--ink-soft)}
.hf-mac-zoom-copy{position:absolute;z-index:10;left:50%;top:19%;width:min(88%,920px);transform:translate(-50%,0);text-align:center;opacity:0;pointer-events:none;will-change:transform,opacity;color:#191b19}
.hf-mac-zoom-copy h2{font:700 clamp(28px,3.3vw,48px)/1.08 Desk Inter,Arial,sans-serif;letter-spacing:-.055em;margin:0;text-wrap:balance}
@media(max-width:760px){
 .hf-mac-copy>div{top:14%;width:41%}
 .hf-mac-copy h2{font-size:22px;margin-bottom:13px}
 .hf-mac-copy p{font-size:12px;line-height:1.45;max-width:145px}
 .hf-mac-copy .hf-desk-split-left p{margin-left:0}
 .hf-mac-copy .hf-mac-copy-note{font-size:10px;margin-top:12px}
 .hf-mac-zoom-copy{top:17%;width:88%}
 .hf-mac-zoom-copy h2{font-size:28px}
}
@media(min-width:761px) and (max-height:650px){.hf-mac-copy h2{font-size:30px}.hf-mac-copy .hf-mac-copy-note{font-size:10px;margin-top:10px}.hf-mac-zoom-copy{top:96px}.hf-mac-zoom-copy h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){.hf-mac-copy,.hf-mac-zoom-copy{will-change:auto}}
@media(max-width:760px){.hf-mac-copy.hf-mac-import-copy .hf-desk-split-right{width:70%;max-width:360px}}
.hf-mac-import-icon{position:absolute;object-fit:contain;pointer-events:none;user-select:none}
.hf-mac-import-icon[data-import-icon="dictionary"]{transform:rotate(-9deg)}
.hf-mac-import-icon[data-import-icon="snippets"]{transform:rotate(10deg)}
.hf-mac-raster-screen{position:absolute;overflow:hidden;border-radius:2.4% 2.4% 0 0 / 3.67% 3.67% 0 0;background:#eeece5;isolation:isolate}
.hf-mac-content-screen{background:transparent}
/* The captured Terminal covers every native app glyph; the notch remains above. */
.hf-mac-hardware>.hf-mac-display{background:transparent;z-index:7;will-change:transform}
.hf-desk-phone{will-change:auto}
.hf-mac-shell,.hf-mac-shell image,.hf-mac-app>img{image-rendering:auto}
.hf-mac-shell{position:absolute;inset:0;width:100%;height:100%}
.hf-mac-display{position:absolute;left:9.5455%;top:1.9403%;width:80.9091%;height:87.4627%;overflow:hidden;border-radius:2.4% 2.4% 0 0 / 3.67% 3.67% 0 0;background:#eeece5;isolation:isolate}
.hf-mac-wallpaper{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hf-mac-menubar{position:absolute;z-index:6;left:0;top:0;width:100%;aspect-ratio:1512/32;pointer-events:none}
.hf-mac-menubar img{position:absolute;inset:0;display:block;width:100%;height:100%}
.hf-mac-menubar .hf-mac-menu-it{display:none}
html[data-lang="it"] .hf-mac-menubar .hf-mac-menu-it{display:block}
html[data-lang="it"] .hf-mac-menubar .hf-mac-menu-en{display:none}
.hf-mac-app{position:absolute;left:9%;top:10%;width:82%;aspect-ratio:2240/1520;border-radius:8px;overflow:hidden;box-shadow:0 12px 32px #0003;background:#f4f0e7}
.hf-mac-app>img{display:block;width:100%;height:100%}
.hf-mac-brand-mask{position:absolute;left:1.2%;top:2.5%;width:7.8%;height:5.5%;background:#f4f0e7}
.hf-mac-terminal{position:absolute;z-index:5;left:13.3%;top:19.6%;width:72%;background:none;border:0;border-radius:0;overflow:visible;transform:translateY(15px) scale(.96);opacity:0;transition:transform .6s cubic-bezier(.22,1.1,.3,1),opacity .24s}
.hf-mac-terminal.is-visible{opacity:1;transform:none}.hf-mac-terminal[hidden]{display:none}
.hf-mac-terminal>img{display:block;width:100%;height:auto}
/* Native logical desktop coordinate space: 1512×982, uniformly scaled. */
.hero.hf-desk-hero{height:890svh}
.hf-mac-notch{position:absolute;z-index:8;left:0;top:0;width:100%;aspect-ratio:1512/160;pointer-events:none}
.hf-mac-notch-native{position:absolute;left:35.7142857143%;top:0;display:block;width:28.5714285714%;height:100%;overflow:visible}
.hf-mac-display{box-shadow:0 -1px 0 #000}
.hf-mac-claude-frames{display:block;width:100%;height:100%;image-rendering:pixelated}
.hf-mac-notch-claude{position:absolute;left:56.99074074%;top:3.25%;width:1.4285714286%;aspect-ratio:1;contain:layout paint;will-change:opacity,transform}
.hf-desk-claude canvas{will-change:transform}
.hf-mac-demo-cursor{position:absolute;left:0;top:0;width:20px;height:26px;transform-origin:0 0;will-change:transform,opacity}
.hf-mac-demo-cursor svg{display:block;width:100%;height:100%;overflow:visible}
.hf-mac-notch-copy{fill:#fff;font:600 13px/1.3 -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:-.26px}
.hf-mac-yes-press,.hf-mac-demo-cursor,.hf-mac-notch-copy,.hf-mac-notch-ear,.hf-mac-done-dot,.hf-mac-notch-claude{opacity:0}
.hf-mac-terminal{pointer-events:none;transition:none}
.hf-mac-story-sound{position:absolute;z-index:20;right:24px;bottom:22px;width:34px;height:34px;border:1px solid #0002;border-radius:50%;background:#ffffffc7;color:#555;font-size:19px;cursor:pointer}
.hf-mac-story-sound[aria-pressed="true"]{color:#151515}.hf-mac-story-sound:focus-visible{outline:2px solid #7fa8cc;outline-offset:3px}
@media(max-width:760px){.hero.hf-desk-hero{height:890svh}.hf-mac-hardware{width:96vw}}
@media(prefers-reduced-motion:reduce){.hf-mac-terminal{transition:none}}

/* The mobile chapters keep their copy around the centred hardware. Initial
   desk placement is unchanged; the measured resting anchors follow viewport
   height even when the sticky stage has its 760px minimum. */
@media(max-width:760px){
 .hf-desk-split>div{top:var(--hf-phone-rest-y,50%);width:calc((100% - var(--hf-phone-rest-width,42vw))/2 - 3% - 8px);transform:translateY(-50%)}
 .hf-desk-split .hf-desk-split-left{left:3%;right:auto;text-align:right}
 .hf-desk-split .hf-desk-split-right{right:3%;left:auto;text-align:left}
 .hf-desk-split h2{font-size:clamp(14px,4.1vw,26px);margin-bottom:12px}
 .hf-desk-split p{font-size:clamp(11px,2.9vw,13px);line-height:1.5;max-width:none}
 .hf-desk-mascot.hf-desk-claude{--hf-claude-size:clamp(44px,14vw,60px);width:var(--hf-claude-size);top:max(82px,calc(var(--hf-phone-rest-y,50svh) - var(--hf-phone-rest-height,42svh)/2 - var(--hf-claude-size) - 20px));right:7%;left:auto;bottom:auto}
 .hf-mac-copy .hf-desk-split-left{top:var(--hf-mac-copy-left-y,14%);width:56%;max-width:260px}
 .hf-mac-copy .hf-desk-split-right{top:var(--hf-mac-copy-right-y,68%);width:41%;max-width:245px}
 .hf-mac-copy h2{font-size:clamp(18px,5vw,22px)}
 .hf-mac-copy p{font-size:clamp(11px,2.8vw,13px);max-width:none}
}
/* Preserve the translated link name while its existing Apple SVG carries
   the compact CTA. Reserve each control's width so the menu stays visible. */
@media(max-width:380px){
 .nav .nav-right,.nav .nav-burger{flex-shrink:0}
 .nav .mag{width:36px;flex:0 0 36px}
 .nav #navDownload{display:flex;align-items:center;justify-content:center;width:36px;min-width:36px;height:36px;min-height:36px;padding:0!important;border-radius:11px;flex:0 0 36px}
 .nav #navDownload .roll{width:18px;height:20px;line-height:20px}
 .nav #navDownload .roll>span{font-size:0;line-height:20px}
 .nav #navDownload .hero-btn-os{display:block;width:18px;height:20px;margin:0;vertical-align:0}
}

/* Slightly larger Wispr import copy without changing the other hero beats. */
.hf-mac-copy.hf-mac-import-copy h2{font-size:clamp(33px,4.4vw,59px)}
.hf-mac-copy.hf-mac-import-copy p{font-size:clamp(14px,1.5vw,20px)}
@media(max-width:760px){.hf-mac-copy.hf-mac-import-copy h2{font-size:clamp(20px,5.5vw,24px)}.hf-mac-copy.hf-mac-import-copy p{font-size:clamp(12px,3.1vw,14px)}}
@media(min-width:761px) and (max-height:650px){.hf-mac-copy.hf-mac-import-copy h2{font-size:33px}}

/* Hero sits above the next band with the same rounded section edge. */
.hero.hf-desk-hero,.hf-desk-stage{border-bottom-left-radius:44px;border-bottom-right-radius:44px}
@media(max-width:860px){.hero.hf-desk-hero,.hf-desk-stage{border-bottom-left-radius:30px;border-bottom-right-radius:30px}}

/* Desktop import chapter: upper-left title, lower-right description. */
@media(min-width:761px){
 .hf-mac-copy.hf-mac-import-copy .hf-desk-split-left{left:5%;right:auto;top:20%;width:31%;max-width:none;text-align:left}
 .hf-mac-copy.hf-mac-import-copy .hf-desk-split-right{right:5%;left:auto;top:auto;bottom:14%;width:31%;max-width:none;text-align:right}
 .hf-mac-copy.hf-mac-import-copy h2{font-size:clamp(30px,3.96vw,53px);line-height:1.08}
 .hf-mac-copy.hf-mac-import-copy .hf-wispr-name{font-size:clamp(33px,4.4vw,59px);white-space:nowrap}
 .hf-mac-copy.hf-mac-import-copy p{max-width:none}
}
@media(min-width:761px) and (max-height:650px){
 .hf-mac-copy.hf-mac-import-copy .hf-desk-split-left{top:18%}
 .hf-mac-copy.hf-mac-import-copy h2{font-size:30px}
 .hf-mac-copy.hf-mac-import-copy .hf-wispr-name{font-size:33px}
 .hf-mac-copy.hf-mac-import-copy .hf-desk-split-right{bottom:9%}
}