@media (max-width: 900px) {
  .desktop-nav {
    display:none;
  }
  .hero {
    min-height:auto;
    padding-top:150px;
  }
  .hero-visual-row {
    margin-top:70px;
  }
  .switcher-window {
    width:55%;
  }
  .floating-chip {
    display:none;
  }
  .trust-strip {
    margin-top:90px;
  }
  .trust-strip > p {
    display:none;
  }
  .trust-strip > div {
    width:100%;
    justify-content:space-between;
  }
  .features,.how {
    padding-top:130px;
  }
  .feature-grid {
    grid-template-columns:1fr;
  }
  .feature-large {
    grid-row:auto;
    min-height:680px;
  }
  .feature-wide {
    grid-column:auto;
  }
  .native-orbit {
    right:-15px;
    opacity:.75;
  }
  .showcase {
    margin-top:130px;
    padding:130px 0;
  }
  .showcase-viewport {
    min-height:620px;
  }
  .screenshot-placeholder {
    height:520px;
  }
  .steps {
    grid-template-columns:1fr;
  }
  .step {
    min-height:310px;
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .step-visual {
    max-width:320px;
  }
  .site-footer {
    grid-template-columns:1fr auto;
  }
  .site-footer > p {
    display:none;
  }
  .site-footer > nav {
    grid-column:2;
  }
  .site-footer > span {
    grid-column:2;
  }
}

@media (max-width: 620px) {
  .section-shell {
    width:min(calc(100% - 32px),var(--max));
  }
  .site-header {
    padding:10px 12px;
  }
  .nav-wrap {
    padding-left:12px;
  }
  .nav-download {
    font-size:0;
  }
  .nav-download::before {
    content:"Download";
    font-size:11px;
  }
  .nav-download span {
    font-size:11px;
  }
  .hero {
    padding-top:128px;
  }
  .hero h1 {
    font-size:50px;
  }
  .hero-copy > p:not(.hero-note) {
    font-size:15px;
  }
  .hero-actions {
    flex-direction:column;
    align-items:stretch;
    max-width:300px;
    margin-inline:auto;
  }
  .hero-note {
    line-height:1.5 !important;
  }
  .hero-visual-row {
    width:110%;
    margin-left:-5%;
  }
  .desktop-frame {
    border-radius:11px;
    padding:3px;
  }
  .desktop-wallpaper {
    border-radius:8px;
    aspect-ratio:1.35;
  }
  .wallpaper-topbar {
    height:19px;
    font-size:5px;
  }
  .switcher-window {
    width:73%;
    top:15%;
    border-radius:10px;
  }
  .switcher-search {
    height:38px;
    font-size:8px;
  }
  .window-item {
    height:35px;
  }
  .window-list {
    padding:3px;
  }
  .app-icon {
    width:20px;
    height:20px;
    border-radius:5px;
    font-size:7px;
  }
  .window-name {
    font-size:7px;
  }
  .switcher-footer {
    display:none;
  }
  .dock {
    height:29px;
    bottom:5px;
    padding:3px 5px;
  }
  .dock i {
    width:21px;
    height:21px;
    border-radius:5px;
  }
  .trust-strip {
    overflow:hidden;
  }
  .trust-strip > div {
    gap:18px;
    justify-content:flex-start;
    width:max-content;
  }
  .trust-strip > div span:nth-of-type(3),.trust-strip > div span:nth-of-type(4),.trust-strip > div i:nth-of-type(2),.trust-strip > div i:nth-of-type(3) {
    display:none
  }
  .section-heading h2 {
    font-size:45px;
  }
  .feature-grid {
    margin-top:48px;
  }
  .feature-card {
    min-height:350px;
    padding:25px;
    border-radius:22px;
  }
  .feature-number {
    top:23px;
    left:25px;
  }
  .feature-large {
    min-height:650px;
  }
  .feature-text {
    margin-top:42px;
  }
  .feature-text h3 {
    font-size:26px;
  }
  .mini-search {
    width:calc(100% - 50px);
    bottom:25px;
  }
  .feature-wide {
    min-height:470px;
  }
  .feature-wide > div:first-child {
    width:100%;
  }
  .native-orbit {
    width:250px;
    height:250px;
    top:15px;
    right:50%;
    translate:50%;
    opacity:.55;
  }
  .showcase {
    padding:110px 0;
  }
  .showcase-viewport {
    min-height:510px;
  }
  .screenshot-placeholder {
    height:410px;
    border-radius:18px;
  }
  .placeholder-content {
    width:84%;
  }
  .placeholder-row {
    height:48px;
  }
  .placeholder-row small {
    display:none;
  }
  .compact-menu {
    left:50%;
  }
  .settings-panel {
    width:90%;
    height:290px;
    grid-template-columns:90px 1fr;
  }
  .settings-panel aside {
    padding:30px 7px;
  }
  .settings-panel aside > * {
    padding:8px 6px;
    font-size:8px;
  }
  .settings-panel > div {
    padding:25px 18px;
  }
  .settings-panel h4 {
    margin-bottom:18px;
  }
  .settings-panel label {
    padding:13px 0;
  }
  .settings-panel label small {
    display:none;
  }
  .steps {
    margin-top:48px;
  }
  .step {
    padding-inline:18px;
  }
  .download-section {
    padding-top:110px;
  }
  .pricing-section {
    padding-top: 80px;
  }
  .pricing-card {
    margin-top: 48px;
  }
  .pricing-card-content {
    padding: 36px 26px 30px;
  }
  .download-card {
    min-height:520px;
    padding-inline:20px;
    border-radius:24px;
  }
  .download-card h2 {
    font-size:42px;
  }
  .site-footer {
    min-height:210px;
    padding:35px 0;
    display:flex;
    flex-wrap:wrap;
    align-content:center;
    justify-content:space-between;
    gap:28px;
  }
  .site-footer .brand {
    width:100%;
  }
  .site-footer > nav {
    width:100%;
    justify-content:space-between;
  }
  .site-footer > span {
    margin:0 0 0 auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior:auto;
  }
  *, *::before, *::after {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .js .reveal {
    opacity:1;
    transform:none;
  }
}

@media (max-width:900px) {
  .switcher-window.actual-switcher {
    width:64%;
  }
  .placeholder-content.app-window-real {
    width:82%;
  }
}

@media (max-width:620px) {
  .switcher-window.actual-switcher {
    width:90%;
    top:10%;
    padding:5px;
  }
  .actual-switcher .switcher-search {
    height:31px;
    margin-bottom:4px;
    padding-inline:8px;
  }
  .actual-switcher .window-list {
    gap:3px;
  }
  .actual-switcher .window-item {
    height:30px;
    padding-inline:6px;
    border-radius:7px;
  }
  .actual-switcher .window-name b em {
    display:none;
  }
  .actual-switcher .window-name small {
    font-size:5px;
  }
  .placeholder-content.app-window-real {
    width:92%;
    padding:7px;
  }
  .app-window-real .placeholder-search {
    height:42px;
    margin-bottom:7px;
  }
  .app-window-real .placeholder-row {
    height:53px;
    margin-top:5px;
    padding-inline:8px;
  }
  .app-window-real .app-icon {
    width:32px;
    height:32px;
  }
  .app-window-real .placeholder-row b em {
    display:none;
  }
  .app-window-real .placeholder-row small {
    display:block;
  }
}

@media (prefers-reduced-motion:reduce) {
  .hero-copy,.hero-visual {
    translate:none;
  }
  .floating-chip {
    animation:none;
  }
  .showcase-progress {
    display:none;
  }
  .scroll-progress {
    display:none;
  }
}

/* Phone layout corrections. Kept last so the app-specific mockup rules scale too. */
@media (max-width:620px) {
  .section-shell {
    width:calc(100% - 32px);
  }
  .scroll-progress {
    display:none;
  }
  .scrolled .nav-wrap {
    background:transparent;
    box-shadow:none;
  }
  .site-header {
    padding:8px 10px;
  }
  .site-header.scrolled {
    opacity:1;
    pointer-events:auto;
  }
  .nav-wrap {
    height:52px;
    padding-inline:10px;
  }
  .brand {
    font-size:14px;
  }
  .hero {
    padding-top:112px;
  }
  .hero-glow {
    width:100%;
    height:300px;
    top:45px;
    left:50%;
    translate:-50% 0;
    filter:blur(85px);
  }
  .hero h1 {
    font-size:clamp(40px,12.5vw,50px);
    line-height:1.01;
  }
  .hero-copy > p:not(.hero-note) {
    margin-top:22px;
    font-size:14px;
    line-height:1.6;
  }
  .hero-actions {
    width:100%;
    max-width:300px;
    margin-top:28px;
  }
  .hero-actions .button {
    width:100%;
  }
  .hero-note {
    max-width:270px;
    margin-inline:auto !important;
  }
  .hero-visual-row {
    flex-direction:column;
    width:calc(100% + 20px);
    margin:58px 0 0 -10px;
    gap:26px;
    transform:none;
  }
  .hero-visual-secondary {
    margin-top:0;
  }
  .desktop-wallpaper {
    aspect-ratio:1.42;
  }
  .dock {
    display:none;
  }
  .switcher-window.actual-switcher {
    width:90%;
    top:9%;
    padding:4px;
  }
  .actual-switcher .switcher-search {
    height:clamp(27px,8vw,31px);
    margin-bottom:3px;
  }
  .actual-switcher .window-list {
    gap:2px;
  }
  .actual-switcher .window-item {
    height:clamp(26px,7.5vw,30px);
  }
  .actual-switcher .app-icon {
    width:18px;
    height:18px;
  }
  .trust-strip {
    margin-top:68px;
    padding-block:20px;
  }
  .trust-strip > div {
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .trust-strip > div span {
    text-align:center;
    font-size:8px;
  }
  .trust-strip i {
    display:none;
  }
  .features,.how {
    padding-top:100px;
  }
  .section-heading h2 {
    font-size:clamp(36px,11vw,45px);
    line-height:1.02;
  }
  .section-heading > p {
    font-size:14px;
    line-height:1.55;
  }
  .feature-grid {
    margin-top:40px;
    gap:12px;
  }
  .feature-card {
    min-height:320px;
    padding:22px;
    border-radius:20px;
  }
  .feature-card h3 {
    font-size:22px;
  }
  .feature-large {
    min-height:560px;
  }
  .feature-large .feature-icon {
    margin-top:20px;
  }
  .feature-text {
    margin-top:32px;
  }
  .feature-text h3 {
    font-size:25px;
  }
  .mini-search {
    width:calc(100% - 44px);
    bottom:22px;
  }
  .mini-search > div {
    padding-inline:8px;
    gap:8px;
    font-size:9px;
  }
  .menu-pill {
    width:210px;
    right:-14px;
  }
  .key-stack {
    top:55px;
  }
  .key-stack kbd {
    min-width:54px;
    height:54px;
  }
  .feature-wide {
    min-height:420px;
  }
  .native-orbit {
    width:220px;
    height:220px;
    top:24px;
  }
  .native-orbit::before {
    width:140px;
    height:140px;
  }
  .showcase {
    margin-top:100px;
    padding:90px 0;
  }
  .showcase-stage {
    margin-top:44px;
  }
  .showcase-slide-heading {
    margin-bottom:14px;
    padding-inline:4px;
  }
  .showcase-slide-heading b {
    font-size:14px;
  }
  .showcase-progress {
    margin:0 4px 14px;
  }
  .showcase-viewport {
    min-height:455px;
  }
  .screenshot-placeholder {
    height:365px;
    padding:5px;
    border-radius:16px;
  }
  .screenshot-placeholder::after {
    inset:5px;
    border-radius:12px;
  }
  .placeholder-content.app-window-real {
    width:94%;
    padding:6px;
  }
  .app-window-real .placeholder-search {
    height:38px;
    margin-bottom:6px;
    font-size:10px;
  }
  .app-window-real .placeholder-row {
    height:47px;
    margin-top:4px;
    gap:7px;
  }
  .app-window-real .app-icon {
    width:28px;
    height:28px;
    border-radius:8px;
  }
  .app-window-real .placeholder-row b {
    font-size:9px;
  }
  .app-window-real .placeholder-row small {
    font-size:7px;
  }
  .compact-menu {
    width:min(260px,calc(100% - 28px));
    left:50%;
  }
  .settings-panel {
    width:calc(100% - 24px);
    height:260px;
    grid-template-columns:78px 1fr;
  }
  .settings-panel aside {
    padding:22px 5px;
  }
  .settings-panel aside > * {
    padding:7px 5px;
  }
  .settings-panel > div {
    padding:20px 14px;
  }
  .settings-panel h4 {
    margin-bottom:14px;
    font-size:17px;
  }
  .settings-panel label {
    padding:11px 0;
  }
  .showcase-slide figcaption {
    padding:18px 4px;
  }
  .steps {
    margin-top:40px;
  }
  .step {
    min-height:260px;
    padding:30px 16px;
  }
  .step h3 {
    margin-top:28px;
  }
  .search-line,.instant-line {
    margin-top:35px;
  }
  .download-section {
    padding:90px 0 70px;
  }
  .download-card {
    min-height:460px;
    padding:60px 18px;
    border-radius:22px;
  }
  .download-card h2 {
    font-size:clamp(34px,10.5vw,42px);
    line-height:1.02;
  }
  .download-card > p {
    font-size:13px;
    line-height:1.55;
  }
  .download-card .button-large {
    width:100%;
    max-width:260px;
  }
  .site-footer {
    min-height:auto;
    padding:30px 0 calc(30px + env(safe-area-inset-bottom));
    flex-direction:column;
    flex-wrap:nowrap;
    align-items:flex-start;
    gap:22px;
  }
  .site-footer > nav {
    width:100%;
    justify-content:flex-start;
    flex-wrap:wrap;
    gap:16px 22px;
  }
  .site-footer > span {
    margin:0;
  }
}

@media (max-width:380px) {
  .section-shell {
    width:calc(100% - 24px);
  }
  .hero h1 {
    font-size:38px;
  }
  .section-heading h2 {
    font-size:36px;
  }
  .hero-visual-row {
    width:calc(100% + 16px);
    margin-left:-8px;
  }
  .feature-card {
    padding-inline:18px;
  }
  .mini-search {
    width:calc(100% - 36px);
  }
  .showcase-viewport {
    min-height:430px;
  }
  .screenshot-placeholder {
    height:340px;
  }
  .app-window-real .placeholder-search {
    height:35px;
  }
  .app-window-real .placeholder-row {
    height:43px;
  }
  .settings-panel {
    width:calc(100% - 16px);
    grid-template-columns:72px 1fr;
  }
  .settings-panel > div {
    padding-inline:11px;
  }
  .download-card h2 {
    font-size:32px;
  }
}
