/* Mobile composition: copy, summit, and platform strip form one continuous hero. */
.mobile-menu-toggle,.mobile-contact-link{display:none}
@media(max-width:760px){
  header{height:84px;padding:0 6%;justify-content:space-between}
  header>.contact{display:none}
  header .brand{font-size:12px;gap:10px;letter-spacing:-.3px}
  header .brand span{max-width:none}
  .mobile-menu-toggle{display:grid;place-items:center;width:44px;height:44px;background:#0a1529a0;border:1px solid #687b8a66;border-radius:9px;color:#fff;font-size:22px}
  header nav{position:absolute;top:74px;left:6%;right:6%;margin:0;padding:10px;display:none;background:#08131ff5;border:1px solid #63738366;border-radius:12px;box-shadow:0 12px 35px #0009}
  header nav.is-open{display:grid;grid-template-columns:1fr 1fr;gap:4px}
  header nav a{display:flex;align-items:center;min-height:44px;padding:0 12px;font-size:14px}
  header nav .mobile-contact-link{color:#ff79b4}
  .hero{min-height:0;max-height:none}
  .hero-copy{top:112px;left:7%;right:7%}
  .hero-copy .eyebrow{font-size:10px;letter-spacing:2.3px;margin-bottom:20px}
  .hero-copy h1{font-size:clamp(42px,14vw,62px);letter-spacing:-2px;line-height:.96;overflow-wrap:normal}
  .hero-copy .intro{font-size:16px;line-height:1.5;margin:22px 0 24px;max-width:100%}
  .hero-copy .actions{gap:10px;flex-wrap:wrap}
  .hero-copy .actions .button,.hero-copy .story{font-size:12px;padding:0 15px;min-height:48px}
  .hero-copy .actions .button{gap:12px}
  .platforms{bottom:12px;height:80px;left:4%;right:4%}
  .platforms div{font-size:11px;font-weight:600}
  .platforms svg{height:25px;width:25px}
  .feature-main{padding:36px 7% 0;gap:6px}
  .feature-copy h2{font-size:clamp(29px,8.5vw,38px);line-height:1.1;letter-spacing:-1px}
  .feature-description{font-size:16px;line-height:1.55;margin-bottom:22px}
  .feature-actions{gap:14px}
  .feature-actions .button{font-size:13px;padding:0 17px;min-height:48px}
  .feature-actions .text-link{font-size:13px;min-height:44px;display:inline-flex;align-items:center}
  .app-caption{display:none}
  .feature-visual{height:440px;margin-top:20px}
  .phone-shot{height:420px;max-width:88%;transform:rotate(-5deg)}
  .seller-visual .phone-shot{transform:rotate(5deg)}
  .benefits{margin-top:12px}
  .benefits li{padding:20px 9px}
  .benefits h3{font-size:11px;line-height:1.45;letter-spacing:.65px;margin:10px 0 7px}
  .benefits p{font-size:13px;line-height:1.5}
  .benefits svg{width:30px;height:30px}
  .ecosystem-section{padding:42px 7% 38px}
  .ecosystem-heading h2{font-size:29px;line-height:1.15}
  .ecosystem-devices{gap:25px 9px}
  .ecosystem-devices h3{font-size:13px;line-height:1.4}
  .ecosystem-devices p{font-size:12px;line-height:1.5}
  .contact-section{padding:45px 7% 38px}
  .contact-section h2{font-size:30px;line-height:1.15}
  .contact-section p:not(.eyebrow){font-size:16px}
  .contact-email{font-size:12px;overflow-wrap:anywhere;padding:10px 0;margin-top:8px}
  .footer-links{gap:8px;flex-wrap:wrap;justify-content:space-between;width:100%}
  .footer-links a{font-size:13px;min-height:44px;display:inline-flex;align-items:center;padding:0 5px}
  .footer-main{gap:17px;padding-bottom:17px}
  .footer-bottom{font-size:11px;align-items:flex-start;flex-wrap:wrap;gap:10px}
  .footer-bottom a{min-height:44px;display:inline-flex;align-items:center}
  .footer-brand small{font-size:12px;line-height:1.5}
  .smoke-tuner{width:min(280px,calc(100vw - 20px))}
  .tuner-toggle{min-height:44px;padding:10px 14px}
  #smoke-tuner-body{max-height:60svh}
}
@media(max-width:350px){
  .hero-copy .eyebrow{letter-spacing:1.8px;font-size:9px}
  .hero-copy .actions{gap:8px}
  .hero-copy .actions .button,.hero-copy .story{padding:0 12px;font-size:11px}
  .story .play{width:22px;height:22px}
  .feature-actions{gap:10px}
  .feature-actions .button{font-size:12px;padding:0 12px;gap:12px}
  .feature-visual{height:395px}.phone-shot{height:375px}
  .platforms div{font-size:10px}
  .brand.footer-brand{font-size:12px}
  .benefits h3{font-size:10px}
}
@media(max-width:760px){header nav .mobile-contact-link{display:flex}}
@media(min-width:761px) and (max-width:1000px){
  .hero{height:min(100svh,980px);min-height:820px}
  .hero-copy{top:140px}
  .hero-copy h1{font-size:64px}
  .feature-copy h2{font-size:32px}
}