/* The website's /join (owner mockup 10/9): the page's pitch on the left, the app's guided seller setup
   (intro.js, drawn with .intro-shell.is-embedded) in a card on the right. On a phone the setup is full width. */
.join-page{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:start;padding-block:48px 64px}
.join-eyebrow{font-weight:800;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange)}
.join-hero h1{font-family:'Archivo',var(--sans);font-weight:800;font-size:clamp(40px,4.6vw,58px);line-height:1.02;letter-spacing:-.02em;margin:12px 0 16px;color:var(--ink);text-wrap:balance}
.join-hero h1 em{font-style:normal;color:var(--orange)}
.join-lead{font-size:19px;line-height:1.5;color:var(--muted);margin:0 0 26px;max-width:520px}
.join-show{display:flex;align-items:center;gap:36px;margin-top:6px}
.join-phone{display:block;width:280px;height:auto;flex:none;filter:drop-shadow(0 22px 34px #3a2a1f33)}
.join-show .join-benefits{gap:22px}
.join-benefits{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.join-benefits li{display:flex;gap:14px;align-items:center}
.join-benefits img{width:52px;height:52px;flex:none;border-radius:14px;background:var(--white);border:1px solid var(--line);padding:6px;object-fit:contain}
.join-benefits p{margin:0}.join-benefits b{display:block;font-size:16px;color:var(--ink)}.join-benefits span{font-size:14.5px;color:var(--muted)}
.join-card{background:var(--white);border:1px solid var(--line);border-radius:28px;padding:30px 30px 26px;box-shadow:0 18px 40px #3a2a1f14;position:sticky;top:96px}
.join-card-foot{text-align:center}
.join-claim{margin:14px 0 0;font-size:14.5px;color:var(--muted)}
.join-claim a{color:var(--orange);font-weight:700;text-decoration:none}.join-claim a:hover{text-decoration:underline}

/* The guided setup inside the card: the page scrolls, not the setup; no full-screen chrome. */
.intro-shell.is-embedded{position:relative;inset:auto;z-index:auto;display:block;overflow:visible;padding:0;background:none}
.is-embedded .intro-top{height:auto;padding:0;margin:0 0 22px}
.is-embedded .intro-bar{gap:6px}.is-embedded .intro-bar i{height:6px}
.is-embedded .intro-step{display:block;overflow:visible;padding:0;min-height:0}
.is-embedded .intro-cta{position:static;padding:16px 0 0;background:none}
.is-embedded .intro-h{font-size:32px;margin:6px 0 18px}
.is-embedded .intro-eyebrow{margin-top:24px;font-size:12px;letter-spacing:.14em}
.is-embedded .intro-ownpin{margin-top:4px}
.is-embedded .intro-field input,.is-embedded .intro-search input{border-radius:999px;height:58px;padding:0 22px}
.is-embedded .intro-pair input{border-radius:999px}
.is-embedded .intro-minimap{height:180px}
/* The first question has nothing to go back to, and nothing to leave yet. */
.join-page.is-first .intro-back,.join-page.is-first .intro-skip{visibility:hidden}

@media(max-width:860px){
  .join-page{display:flex;flex-direction:column;gap:0;padding-block:18px 32px}
  /* The pitch's heading and lead stay above the setup; its picture and benefits go below it. */
  .join-hero{display:contents}
  .join-eyebrow,.join-hero h1,.join-lead{order:0}
  .join-hero h1{font-size:34px;margin:8px 0 8px}
  .join-lead{font-size:15.5px;margin:0 0 14px}
  .join-card{order:1;align-self:stretch;width:auto;position:static;background:none;border:0;border-radius:0;box-shadow:none;padding:6px 0 0}
  .join-show{order:2;flex-direction:column;gap:26px;margin:30px 0 8px}
  .join-phone{width:min(300px,80vw)}
  /* Past the first question it is the app's setup: one question, full width. */
  .join-page:not(.is-first) :is(.join-eyebrow,h1#join-title,.join-lead,.join-show){display:none}
  .is-embedded .intro-h{font-size:28px}
  body.on-join .bottom-nav{display:none}
  .join-page:not(.is-first) .is-embedded .intro-cta{position:sticky;bottom:0;padding:12px 0 calc(14px + env(safe-area-inset-bottom));background:linear-gradient(#faf7f200,var(--paper) 30%)}
}
/* The server's first paint, before the setup starts in the card. */
.join-ssr-q{font-family:'Archivo',var(--sans);font-weight:800;font-size:32px;letter-spacing:-.02em;text-align:center;margin:96px 0 120px}
/* The first question replaces the server's first paint in place: it is simply there, with no entrance. */
.join-page.is-first .is-embedded .in{opacity:1;transform:none;animation:none}
