/* Website composition. App UI and camera geometry remain in style/safari.css. */
:root{--black:#0c0e0d;--muted:#acb2ad;--white:#f5f5f1;--green:#50e24e}
.site-header{max-width:1376px;padding:26px 48px;border-bottom:1px solid #ffffff12}
.site-header nav{gap:28px;font-size:12px}.site-header nav>a{color:#c6cbc6}.site-header nav>a:hover{color:white}
.site-header .release-link{color:var(--white);border-color:#ffffff35;padding:12px 18px}.release-link:hover{background:#ffffff0a}
.hero{position:relative;max-width:1376px;--stage-scale:1.02;grid-template-columns:minmax(320px,.86fr) minmax(0,1.4fr);column-gap:38px;padding:30px 48px 105px;grid-template-rows:auto auto;min-height:730px;align-content:center}
.hero-intro{align-self:end}.hero .eyebrow{font-size:10px;letter-spacing:1.65px;color:#a5b3a5;margin-bottom:23px}
.hero h1{font-size:clamp(38px,3.4vw,48px);line-height:1.08;letter-spacing:-2px;font-weight:500}.hero h1 span{color:var(--green)}
.hero-description{font-size:16px;line-height:1.65;max-width:360px;margin-top:24px;color:#d1d5d0}.hero-assurance{font-size:13px;line-height:1.5;color:#919c94;max-width:360px;margin:12px 0 0}
.hero-actions{display:flex;gap:17px;align-items:center;flex-wrap:wrap;margin-top:28px}
.primary-action{display:inline-flex;align-items:center;gap:26px;min-height:46px;padding:13px 19px;background:var(--white);color:#101510;border-radius:28px;font-size:13px;font-weight:550;transition:background .18s}
.primary-action:hover{background:var(--green)}.text-action{font-size:12px;line-height:1.5;background:none;padding:10px 0;color:#bec6be}.text-action:hover{color:white}.text-action span{margin-left:7px}
.film-copy{padding-top:36px;align-self:start;max-width:410px}.film-kicker{font-size:9px;letter-spacing:1.6px;font-weight:600;color:#8a978e;display:block;margin-bottom:8px}.film-description{min-height:67px;max-width:370px;margin:0}.film-description p{font-size:15px;line-height:1.5;letter-spacing:0;color:#cdd5cd;max-width:310px}
.playback{display:block;margin:8px 0 0}.chapters{display:flex;flex-wrap:wrap;gap:0 16px;max-width:410px}.chapter{display:block;width:auto;height:35px;min-width:0;padding:0 0 10px;color:#a3aca5;font-size:11px;line-height:25px;background:none;position:relative}.chapter:after{display:none}.chapter i{left:0;right:0;bottom:3px;top:auto;width:auto;height:1px;border-radius:0;background:#566459;opacity:0}.chapter i:after{content:'';display:block;width:var(--progress,0%);height:100%;background:var(--green)}.chapter.active{color:white}.chapter.active i{opacity:1}.chapter:hover{color:white}
.transport{display:flex;align-items:center;margin-top:8px;gap:3px}.play-toggle,.replay{width:34px;height:34px;font-size:20px;color:#b0b9b1}.play-toggle{margin:0}.film-length{font-size:10px;letter-spacing:.2px;color:#87948a;margin-left:9px}
.stage-orbit{background:radial-gradient(ellipse,#247c2420,transparent 68%);width:720px;height:510px}.device-label{position:absolute;top:551px;width:100%;text-align:center;white-space:nowrap;line-height:1.4}.device-label strong{display:block;font-size:12px;letter-spacing:.5px;font-weight:500;color:#e5eae4}.device-label span{display:block;font-size:10px;color:#8f9c92;margin-top:4px}
.stage-viewport{height:calc(610px * var(--stage-scale))}.stage{transform:translateX(-50%) scale(var(--stage-scale))}.link-symbol{stroke:#e7f5e7}.link-center{fill:#17261b}.connection-link{z-index:0}
.tools{background:#137c20;padding:80px 48px}.section-inner{max-width:1152px}.section-title{grid-template-columns:1fr 1fr;gap:60px}.section-title h2,h2{font-size:42px;font-weight:500;letter-spacing:-1.6px;line-height:1.1}.section-title p{max-width:380px}.tool-grid{gap:52px;margin-top:45px}.tool-grid h3{font-weight:500}.tool-grid p{max-width:300px}
.practical{background:#f4f4ef;padding:85px 48px 48px}.practical-grid{grid-template-columns:1fr 1.25fr;gap:80px}.practical .eyebrow{font-size:9px;letter-spacing:1.6px;margin-bottom:20px}.questions p,.questions ol{color:#4d5a4f;max-width:none}.questions a{color:#16652a;border-bottom:1px solid #b3c7b5;padding-bottom:2px}.questions a:hover{color:#0b3917}.compatibility{font-size:12px;line-height:1.5}.faq-question{font-size:15px}
.help-strip{background:#f4f4ef;color:#17251b;display:flex;align-items:center;justify-content:space-between;gap:35px;padding:38px max(48px,calc((100% - 1152px)/2)) 55px}.help-strip>div{border-top:1px solid #d4dace;padding-top:35px;flex:1}.help-strip .eyebrow{font-size:9px;letter-spacing:1.3px;color:#637666;display:block;margin-bottom:10px}.help-strip h2{font-size:24px;letter-spacing:-.5px}.help-strip p{font-size:13px;line-height:1.6;color:#556559;margin:10px 0 0}.help-strip>a{font-size:13px;white-space:nowrap;padding:14px 20px;border:1px solid #b2c0b3;border-radius:28px;margin-top:35px}.help-strip>a span{margin-left:20px}.help-strip>a:hover{background:#e6eae2}
.release{padding:70px 48px}.release-inner{max-width:1152px;gap:26px}.release h2{font-size:28px;max-width:430px;font-weight:500;line-height:1.2}.release p:not(.eyebrow){line-height:1.65;color:#a5afa6}.release-action{margin-left:auto;flex-shrink:0;text-align:center}.contact-button{display:flex;align-items:center;justify-content:center;padding:16px 22px;margin:0;font-weight:550}.release-action small{font-size:10px;color:#8c988f;display:block;margin-top:12px}footer{max-width:1248px;font-size:11px;padding:30px 48px;gap:24px}footer img{opacity:.8}
@media(min-width:900px) and (max-width:1150px){.hero{--stage-scale:.82;grid-template-columns:310px minmax(0,1fr);padding-left:32px;padding-right:32px;gap:28px;min-height:670px}.hero h1{font-size:40px}.hero-description{font-size:15px}.hero-actions{gap:10px}.primary-action{padding:13px 16px}.text-action{font-size:11px}.chapters{gap:0 12px}.chapter{font-size:10px}.film-copy{padding-top:28px}}
@media(min-width:900px) and (max-height:780px){.hero{--stage-scale:.84;min-height:620px;padding-top:20px;padding-bottom:75px}.hero h1{font-size:40px}.hero .eyebrow{margin-bottom:17px}.hero-description{margin-top:18px}.hero-actions{margin-top:22px}.film-copy{padding-top:28px}.site-header{padding-top:20px;padding-bottom:20px}}
@media(max-width:899px){.site-header{padding:22px 28px}.site-header nav{gap:20px}.hero{display:flex;flex-direction:column;min-height:0;padding:48px 28px 85px;--stage-scale:.96}.hero-intro{align-self:center}.hero h1{font-size:52px}.hero-description,.hero-assurance{margin-left:auto;margin-right:auto;max-width:430px}.hero-actions{justify-content:center}.demonstration{margin-top:24px}.film-copy{align-self:center;text-align:center;padding-top:12px;width:100%;max-width:500px}.film-description{margin:auto;min-height:61px;max-width:450px}.film-description p{margin:auto;max-width:400px}.chapters{justify-content:center;max-width:none;gap:22px}.transport{justify-content:center}.tools,.practical{padding-left:32px;padding-right:32px}.practical-grid{gap:45px}.release-inner{flex-wrap:wrap}.release-action{margin-left:106px}.help-strip{padding-left:32px;padding-right:32px}}
@media(max-width:600px){.site-header{padding:20px 22px}.wordmark{width:122px}.site-header nav{gap:16px}.site-header nav>a:first-child{display:none}.site-header nav>a:nth-child(2){font-size:11px}.site-header .release-link{font-size:11px;padding:10px 12px}.site-header .release-link span{display:none}.hero{padding:36px 22px 65px;--stage-scale:.57}.hero .eyebrow{font-size:9px;margin-bottom:19px}.hero h1{font-size:43px;letter-spacing:-1.9px}.hero-description{font-size:15px;max-width:330px;margin-top:20px}.hero-assurance{font-size:12px}.hero-actions{gap:12px;margin-top:22px}.primary-action{font-size:12px;gap:15px;padding:13px 16px}.text-action{font-size:11px}.demonstration{margin-top:27px}.film-copy{padding-top:15px}.film-description{min-height:60px}.film-description p{font-size:14px;max-width:280px}.film-kicker{font-size:8px}.chapters{gap:16px}.chapter{font-size:10px}.film-length{font-size:10px}.transport{margin-top:5px}.section-title{display:block}.section-title h2,h2{font-size:34px}.section-title>p:last-child{font-size:14px;margin-top:20px}.tools,.practical{padding:48px 24px}.tool-grid{display:block;margin-top:30px}.tool-grid article{display:grid;grid-template-columns:112px 1fr;gap:0 15px;padding-top:24px;margin-top:24px}.tool-grid h3{font-size:18px}.tool-grid p{font-size:13px}.tool-art{grid-row:1/3;grid-column:1;transform:scale(.8);margin:0;align-self:center}.practical{padding-bottom:15px}.practical-grid{grid-template-columns:1fr;gap:30px}.compatibility{margin-top:20px;font-size:11px}.help-strip{display:block;padding:10px 24px 45px}.help-strip>div{padding-top:25px}.help-strip>a{display:inline-block;margin-top:20px}.help-strip h2{font-size:24px}.release{padding:45px 24px}.release-inner{gap:18px}.release-inner>img{width:58px;height:58px}.release-inner>div:not(.release-action){flex:1}.release h2{font-size:24px;max-width:260px}.release-action{margin:9px 0 0 76px}.contact-button{font-size:12px;padding:14px 19px}.release-action small{font-size:9px}footer{padding:25px 24px;gap:20px}.site-header nav span[aria-hidden]{margin-left:0}}
@media(max-width:370px){.hero{--stage-scale:.49;padding-left:18px;padding-right:18px}.hero h1{font-size:38px}.site-header{padding-left:18px;padding-right:18px}.site-header nav{gap:10px}.wordmark{width:106px}.chapters{gap:12px}.hero-actions{gap:5px}.primary-action{padding:12px 13px}}
/* Keep both devices in view sooner on a phone, with a compact two-line title. */
@media(max-width:600px){.hero{--stage-scale:.54;padding-top:30px}.hero h1{font-size:36px;letter-spacing:-1.6px}.hero-description{font-size:14px;line-height:1.6;margin-top:18px}.hero .eyebrow{margin-bottom:16px}}
@media(max-width:370px){.hero{--stage-scale:.47}.hero h1{font-size:32px;letter-spacing:-1.4px}}

/* Avoid a blank phone flash before the first complete demonstration frame. */
.stage{visibility:hidden}
/* A quieter left column; all film narration and controls belong to the film. */
@media(min-width:900px){
 .hero{grid-template-areas:"intro demo" "intro copy";grid-template-rows:auto auto;align-items:center;min-height:0}
 .hero-intro{align-self:center;padding-bottom:90px}
 .hero-description{max-width:310px;font-size:17px;line-height:1.65}
 .film-copy{grid-area:copy;justify-self:center;align-self:start;width:100%;max-width:580px;padding-top:14px;text-align:center}
 .film-description{min-height:25px;max-width:none;margin:0 auto}.film-description p{max-width:none;font-size:14px}
 .playback{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:12px}
 .chapters{max-width:none;gap:18px}.transport{margin:0}
 .stage-viewport{height:calc(650px * var(--stage-scale))}
}
.hero-actions{margin-top:30px}.store-download{cursor:default}.store-download:disabled{opacity:1}.store-download:disabled:hover{background:var(--white)}a.store-download{cursor:pointer}a.store-download:hover{background:var(--green)}
.phone-screen{background:#0b100d}
.overview-glow{position:absolute;left:50%;top:300px;transform:translate(-50%,-50%);width:740px;height:540px;pointer-events:none;background:radial-gradient(ellipse,#42e64a38,transparent 68%);opacity:0}
.walkthrough-title{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:45px;opacity:0;pointer-events:none;text-align:center}
.walkthrough-title .device-logo{display:block;width:105px;height:auto;filter:drop-shadow(0 0 14px #42e64a33)}
.walkthrough-title p{color:var(--white);font-size:37px;letter-spacing:-1px;font-weight:400;margin:22px 0 0}
@media(max-width:899px){.hero-description{max-width:330px}.film-description{min-height:30px}.hero-actions{margin-top:24px}.film-copy{padding-top:14px}}
@media(max-width:600px){.hero-description{max-width:290px}.primary-action.store-download{font-size:12px;padding:14px 20px}.film-description p{font-size:13px}.film-copy{padding-top:12px}.film-description{min-height:36px}.hero-actions{margin-top:22px}}
@media(min-width:900px) and (max-width:1150px){.playback{gap:8px}.chapters{gap:12px}.chapter{font-size:10px}.hero-description{font-size:16px}}

/* Reserve room for role labels beneath the enlarged connected phones. */
.stage-viewport{height:calc(650px * var(--stage-scale))}

/* Align the support and download rows with the content above. */
.help-strip{position:relative;padding-top:32px;padding-bottom:32px;min-height:112px}
.help-strip:before{content:"";position:absolute;top:0;left:max(48px,calc((100% - 1152px)/2));right:max(48px,calc((100% - 1152px)/2));height:1px;background:#d4dace}
.help-strip>div{border:0;padding:0}.help-strip>a{margin:0}.help-strip h2{font-weight:500}
.release{padding-top:48px;padding-bottom:48px}.release-inner{align-items:center;gap:24px}.release-inner>img{width:64px;height:64px}.release h2{font-size:24px;letter-spacing:-.6px}.release .contact-button{font-size:13px;padding:14px 20px}
@media(max-width:899px){.help-strip:before{left:32px;right:32px}.release-action{margin-left:auto}}
@media(max-width:600px){.help-strip{display:flex;flex-wrap:wrap;gap:18px;padding:28px 24px}.help-strip:before{left:24px;right:24px}.help-strip>div{padding:0}.help-strip>a{margin:0}.release{padding:36px 24px}.release-inner{gap:18px}.release-inner>img{width:52px;height:52px}.release h2{font-size:22px}.release-action{flex-basis:100%;margin:6px 0 0}.release .contact-button{width:100%}}

/* A compact, centred download group on every screen size. */
.release .release-inner{justify-content:center;flex-wrap:nowrap;gap:22px}
.release .release-action{margin:0;flex:0 1 auto}
@media(max-width:600px){.release .release-inner{gap:16px}.release .release-inner>img{width:48px;height:48px;flex-shrink:0}.release .contact-button{width:auto;font-size:12px;padding:14px 16px}}
@media(max-width:370px){.release .release-inner{flex-direction:column;gap:16px}}

/* Official badge artwork stays untouched, with clear space around it. */
.release .app-store-badge{display:block;background:transparent;border:0;padding:12px;border-radius:0;line-height:0}
.release .app-store-badge:hover,.release .app-store-badge:disabled:hover{background:transparent}
.app-store-badge img{display:block;height:48px;width:auto}
@media(max-width:600px){.site-header nav>a:first-child{display:inline}.site-header nav{gap:16px}}

/* Keep branding together, with the download badge alongside. */
.release .download-brand{display:flex;align-items:center;gap:18px;flex:0 0 auto}
.download-icon{width:64px;height:64px}.download-wordmark{width:158px;height:auto}
footer{display:flex;justify-content:space-between;align-items:center}
@media(max-width:600px){.release .release-inner{flex-direction:column;gap:12px}.release .download-brand{flex:0 0 auto;gap:16px}.download-icon{width:52px;height:52px}.download-wordmark{width:148px}footer{flex-wrap:wrap}}

/* Shared wordmark dimensions and restored app-icon silhouette. */
.site-header .wordmark,.download-wordmark{width:158px;height:26px;object-fit:contain}
.download-icon{border-radius:24%;border:1px solid #444a42}
@media(max-width:600px){.site-header .wordmark,.download-wordmark{width:122px;height:26px}}
@media(max-width:370px){.site-header .wordmark,.download-wordmark{width:106px;height:26px}}

/* Give the download badge breathing room; keep footer links together. */
.release .release-inner{gap:48px}
footer{justify-content:flex-start;gap:24px}
footer>a:first-child{width:auto;margin:0}
@media(max-width:600px){.release .release-inner{gap:28px}}

/* One continuous dark closing area on both pages. */
.release,footer{background:var(--black)}
.release{padding-bottom:32px}
footer{border-top:0}

/* Geometric cross avoids font-baseline drift; triangle matches the app. */
.marker-art{align-items:center}
.marker-art svg{display:block;width:35px;height:35px;flex-shrink:0;stroke:none;fill:none}
.marker-art .feature-cross{stroke:none}.marker-art .triangle-target{width:42px;height:42px}
.marker-art i{flex-shrink:0}

/* Beta availability, shared by the product page and guide. */
.beta-label{color:var(--green);font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;margin:0 0 16px}
.beta-action{display:inline-flex;align-items:center;justify-content:center;gap:18px;text-decoration:none}
.release-action{text-align:center}
.release .beta-note{font-size:12px;color:#b8bfb6;margin:13px 0 0}
.beta-guide-note{font-size:15px;line-height:1.6;color:#b8bfb6;max-width:480px;margin:20px 0 0}
.questions p a{text-decoration:underline;text-underline-offset:3px}