/* Match the browser canvas to the edge-to-edge header surface. */
html{background:#f4f4f1}

/* Quiet hero and supporting content. */
.nav-wrap{position:relative;top:auto;left:auto;transform:none;max-width:none;width:100%;margin:0;padding-inline:max(32px,calc((100% - 1024px)/2))}.nav{border:0;border-radius:0;box-shadow:none;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;padding:26px 0;min-height:100px}.nav .brand img{width:66px}.nav-links{margin-left:auto}.nav-links a{font-size:14px}body{background:#fff}.quiet-hero{background:#f4f4f1;display:grid;grid-template-columns:1.35fr 1fr;gap:64px;align-items:center;padding:36px max(32px,calc((100% - 1024px)/2)) 54px;min-height:710px}.nav-wrap{background:#f4f4f1}.nav-wrap:before{content:none}.quiet-hero h1{font-size:64px;line-height:1.055;letter-spacing:-.055em;font-weight:500;margin:0 0 26px;padding:0}.quiet-hero .copy>p{font-size:18px;line-height:1.65;color:#6a6e67;margin:0 0 30px}.quiet-hero .copy>p strong{color:#292c27;font-weight:500}.quiet-hero .phone{height:auto;padding:0;width:auto;margin:0;display:flex;flex-direction:column;align-items:center}.quiet-hero .phone>button{border:0;background:none;padding:0;width:310px;max-width:100%;cursor:pointer}.quiet-hero video{display:block;width:100%;height:auto}.quiet-hero .hint{font-size:12px;line-height:1.5;color:#797e75;margin:0}.quiet-hero .app-store-button,.quiet-closing .app-store-button{box-shadow:0 6px 12px -7px #1c261b60}.quiet-hero .app-store-button:after{display:none}.maker-section{padding-block:92px;display:grid;grid-template-columns:1.2fr 1fr;gap:70px;border-top:1px solid var(--line);align-items:center}.maker-section h2{font-size:40px;letter-spacing:-.035em;line-height:1.12;margin-top:22px}.maker-section .founder-note{border:0;padding:0;margin:12px 0 0}.maker-section .founder-audience{display:none}.maker-section .founder-story{font-size:19px;line-height:1.65;color:var(--muted)}.maker-section .crew-cameo{width:120px;height:100px;margin:0}.quiet-closing{background:#f4f4f1;border-radius:0;padding-block:90px}.quiet-closing h2{font-size:42px;margin-top:24px}.quiet-closing>p{margin:22px 0 28px}.quiet-closing .launch-note{font-size:12px;margin:16px 0 0;color:var(--muted)}
@media(max-width:1100px){.quiet-hero{gap:30px}.quiet-hero h1{font-size:54px}}
@media(max-width:700px){.nav-wrap{width:100%;padding-inline:25px}.nav{min-height:88px;padding-block:20px}.nav .brand img{width:58px}.quiet-hero{display:flex;flex-direction:column;align-items:stretch;gap:34px;padding:28px 25px 40px;min-height:0}.quiet-hero h1{font-size:43px;line-height:1.07;margin-bottom:20px}.quiet-hero .copy>p{font-size:16px;margin-bottom:25px}.quiet-hero .phone>button{width:285px}.maker-section{display:block;padding-block:55px}.maker-section h2{font-size:32px}.maker-story{margin-top:28px}.maker-section .founder-story{font-size:17px}.quiet-closing{padding:55px 23px}.quiet-closing h2{font-size:31px}.quiet-closing>p{font-size:15px}}
@media(max-width:360px){.quiet-hero h1{font-size:37px}}

/* The maker story: one unframed scene, preserved in full at every width. */
.maker-section{column-gap:70px;row-gap:34px;align-items:start}.maker-section .maker-story{padding-top:43px}.maker-section .founder-note{max-width:none;margin:0}.maker-illustration{grid-column:1/-1;margin:0}.maker-illustration img{display:block;width:60%;height:auto;margin-inline:auto;object-fit:contain}.maker-section h2{margin-bottom:0}@media(max-width:700px){.maker-section .maker-story{padding-top:0;margin-top:24px}.maker-illustration{margin-top:30px}.maker-section{padding-bottom:42px}}

/* The playback caption is a real keyboard- and touch-accessible control. */
.quiet-hero .hero-playback{appearance:none;border:0;background:transparent;color:inherit;font:inherit;min-height:44px;min-width:100px;padding:10px 14px;cursor:pointer;border-radius:8px}.quiet-hero .hero-playback:hover{color:var(--blue,#3948dc)}.quiet-hero .hero-playback:focus-visible{outline:2px solid #3948dc;outline-offset:2px}

/* Clip every close-up to a stable, softly rounded phone-shaped viewport. */
.quiet-hero .phone>#demo{border-radius:36px;overflow:hidden;isolation:isolate;clip-path:inset(0 round 36px)}
.quiet-hero #hero-movie{border-radius:36px}
