/* Product hero (prototypes/product-hero-20261026): large headline, a large real screen and a tab row beneath it. */
.hero-editorial{--paper:#f0efed;--ink:#101619;--muted:#56636b;--line:#10161932;--device-width:clamp(330px,27.1vw,410px);max-width:none;background:radial-gradient(ellipse at 78% 32%,#d9e8efbd 0,transparent 51%),linear-gradient(170deg,#f0efed 28%,#e3e8e8 66%,#c9cfd1 100%);color:var(--ink);line-height:normal;padding-top:88px}
.hero-editorial .hero{width:calc(100% - 128px);max-width:1440px;min-height:980px;margin:auto;display:grid;grid-template-columns:58% 42%;align-items:start;padding:28px 0 64px;text-align:left}
.hero-editorial .hero-copy{grid-column:1;padding:130px 36px 0 0;position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start}
.hero-editorial h1{font-size:clamp(64px,6.15vw,98px);line-height:1.02;letter-spacing:-.065em;font-weight:450;max-width:660px;margin:0;text-wrap:balance}

.hero-editorial .description{font-size:18px;line-height:1.5;letter-spacing:-.02em;color:#37444b;max-width:500px;margin-top:26px;text-wrap:pretty}
.hero-editorial .hero-product{order:1;font-size:21px;line-height:1.4;letter-spacing:-.02em;font-weight:550;max-width:480px;margin:22px 0 0;text-wrap:pretty}
.hero-editorial .hero-waitlist {
  grid-template-columns:minmax(0,1fr) auto; gap:0; max-width:370px; margin:26px 0 0;
}
.hero-editorial .hero-waitlist input[type=email] {
  height:48px; padding-inline:12px; border-right:0; border-radius:3px 0 0 3px;
}
.hero-editorial .hero-waitlist .btn {
  min-height:48px; padding:0 16px; border-radius:0 3px 3px 0; font-size:14px;
}
.hero-editorial .hero-waitlist[data-state=done] { grid-template-columns:auto; justify-content:start; }
.hero-editorial .hero-waitlist[data-state=done] .btn { border-radius:3px; }

.hero-editorial .phone-area{grid-column:2;position:relative;z-index:1;width:100%;margin:0;padding-top:58px;display:flex;flex-direction:column;align-items:flex-start}
.hero-editorial .device{position:relative;width:var(--device-width);flex:none;padding:calc(var(--device-width)*.034);border:1px solid #687174;border-radius:calc(var(--device-width)*.15);background:linear-gradient(108deg,#a6aeb0 0%,#333a3d 5%,#080d10 14%,#0a0f11 86%,#767f82 100%);box-shadow:inset 0 0 0 1px #e0e8eb33,18px 36px 60px -22px #10161950,0 5px 12px -6px #10161980}
.hero-editorial .device img{display:block;width:100%;height:auto;aspect-ratio:800/1739;border-radius:calc(var(--device-width)*.113);box-shadow:0 0 0 calc(var(--device-width)*.013) #080d10;background:#080d10;object-fit:contain}
.hero-editorial .device [data-editorial-image]{aspect-ratio:auto 800/1739}
.hero-editorial .device::before,.hero-editorial .device::after{content:'';position:absolute;width:2px;background:linear-gradient(#a2aaad,#313a3e);border-radius:2px}
.hero-editorial .device::before{left:-3px;top:22%;height:6%;box-shadow:0 35px 0 #6e787c}
.hero-editorial .device::after{right:-3px;top:27%;height:10%}
.hero-editorial .screen-index{width:var(--device-width);margin-top:28px}
.hero-editorial .screen-picker{display:flex;width:100%;border-bottom:1px solid var(--line)}
.hero-editorial .screen-picker button{flex:1;padding:12px 6px;border:0;border-bottom:2px solid transparent;background:none;min-height:46px;font-size:13px;line-height:normal;white-space:nowrap;color:var(--muted);touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.hero-editorial .screen-picker button[aria-selected=true]{border-bottom-color:var(--ink);color:var(--ink);font-weight:550}
.hero-editorial .screen-picker button:hover{color:var(--ink)}
.hero-editorial button:focus-visible,.hero-editorial a:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.hero-editorial .screen-summary{font-size:12px;line-height:1.5;margin-top:16px;text-align:center}
.hero-editorial .screen-caption{display:block}
.hero-editorial .capture-note{font:10px/1.5 var(--mono);color:#4e5d65;display:block;margin-top:5px}

@media(max-width:1100px) and (min-width:761px){.hero-editorial{--device-width:clamp(288px,33vw,350px)}.hero-editorial .hero{width:calc(100% - 64px);grid-template-columns:54% 46%;min-height:940px}.hero-editorial .phone-area{padding-top:52px}.hero-editorial .hero-copy{padding:120px 30px 0 0}.hero-editorial h1{font-size:clamp(52px,6vw,66px)}}
/* On phones the copy and signup share a left edge; the device stays centered below. */
@media (max-width:760px) {
  .hero-editorial {
    --device-width:min(326px,calc(100vw - 64px)); padding-top:70px;
    background:radial-gradient(ellipse at 80% 65%,#d9e8efb0 0,transparent 57%),linear-gradient(#f0efed 48%,#dfe4e5 100%);
  }
  .hero-editorial .hero {
    display:flex; flex-direction:column; align-items:center;
    width:calc(100% - 2 * var(--site-header-edge)); min-height:0; padding:27px 0 42px; text-align:left;
  }
  .hero-editorial .hero-copy { width:100%; padding:8px 0 0; }
  .hero-editorial h1 {
    font-size:clamp(34px,10.5vw,56px); line-height:1.04; letter-spacing:-.055em;
    max-width:500px; margin:0;
  }
  .hero-editorial .description { font-size:15px; margin:18px 0 0; max-width:500px; text-wrap:pretty; }
  .hero-editorial .hero-product { order:0; font-size:15px; font-weight:500; line-height:1.5; max-width:500px; margin:16px 0 0; text-wrap:pretty; }
  .hero-editorial .hero-waitlist { margin:24px 0 0; }
  .hero-editorial .hero-waitlist .status { text-align:left; }
  .hero-editorial .hero-waitlist[data-state=done] { justify-content:start; }
  .hero-editorial .phone-area { align-items:center; padding-top:40px; }
  .hero-editorial .screen-index { width:min(326px,calc(100vw - 48px)); margin-top:23px; }
  .hero-editorial .screen-picker button { font-size:12px; padding-inline:6px; }
  .hero-editorial .screen-summary { margin-top:12px; }
}
@media (max-width:359px) {
  .hero-editorial { --device-width:calc(100vw - 52px); }
  .hero-editorial .hero { width:calc(100% - 32px); padding-top:20px; }
  .hero-editorial .hero-copy { padding-top:12px; }
  .hero-editorial h1 { font-size:33px; }
  .hero-editorial .capture-note { font-size:9px; }
}
@media(prefers-reduced-motion:reduce){.hero-editorial *,.hero-editorial *::before,.hero-editorial *::after{animation:none!important;transition:none!important}}
