/* Vertical landing pages (/for/*): the page is the conversation.
   Brand world: DM Serif Display + Inter, espresso on linen. Each page sets
   its own accent on <body data-v>. */
*{margin:0;padding:0;box-sizing:border-box}
:root{--oat:#f5f0e8;--oat-deep:#ece4d8;--earth:#2c2520;--earth-2:#5a4f47;--earth-3:#6c6056;--sand:#e5ddd2;--white:#fff;
  --accent:#2f5d50;--accent-ink:#fff;--accent-soft:#e3ece7;
  --serif:'DM Serif Display',Georgia,serif;--sans:'Inter',system-ui,sans-serif;
  --gutter:clamp(20px,5vw,80px);--ease:cubic-bezier(.16,1,.3,1)}
body[data-v="realtors"]{--accent:#2f5d50;--accent-soft:#e1ebe5}
body[data-v="trades"]{--accent:#a4501a;--accent-soft:#f3e3d4}
body[data-v="consultants"]{--accent:#2e4a7d;--accent-soft:#e2e7f1}
body[data-v="coaches"]{--accent:#7a3e6e;--accent-soft:#efe2ec}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:var(--sans);font-size:17px;line-height:1.6;color:var(--earth);background:var(--oat);overflow-x:hidden}
::selection{background:var(--accent);color:var(--accent-ink)}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}

/* ---------- first viewport: the ask-it wall ---------- */
.ask{min-height:100svh;padding:clamp(104px,14vh,140px) var(--gutter) clamp(40px,6vh,64px);display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);grid-template-rows:1fr auto;column-gap:clamp(32px,5vw,88px);row-gap:clamp(28px,4vh,48px);align-items:center;max-width:1440px;margin:0 auto}
.wall{list-style:none;display:flex;flex-direction:column;gap:clamp(4px,1vh,10px)}
.wall button{all:unset;cursor:pointer;display:inline;font-family:var(--serif);font-size:clamp(1.65rem,3.1vw,3.05rem);line-height:1.12;letter-spacing:-.015em;
  color:rgba(44,37,32,.55);text-wrap:balance;transition:color .35s var(--ease);text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:3px;text-underline-offset:.18em}
.wall button:hover{color:rgba(44,37,32,.62)}
.wall button[aria-selected="true"]{color:var(--earth);text-decoration-color:var(--accent)}
.wall button.done::after{content:"";display:inline-block;width:.5em;height:.28em;margin-left:.3em;border-left:3px solid var(--accent);border-bottom:3px solid var(--accent);transform:rotate(-45deg) translateY(-.32em)}
.wall li{display:block}

.phone{align-self:center;background:var(--white);border-radius:16px;box-shadow:0 30px 60px -30px rgba(44,37,32,.45),0 2px 6px rgba(44,37,32,.06);overflow:hidden;max-width:440px;width:100%;justify-self:end}
.phone-top{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--sand)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-family:var(--serif);font-size:1.05rem}
.phone-top b{font-weight:600;font-size:.95rem;display:block;line-height:1.2}
.phone-top div span{display:block;font-size:.78rem;color:var(--earth-3)}
.thread{padding:18px;display:flex;flex-direction:column;gap:10px;min-height:300px;background:linear-gradient(var(--white),var(--white))}
.reply[hidden]{display:none}
.reply{display:flex;flex-direction:column;gap:10px}
.msg{max-width:88%;padding:10px 14px;border-radius:14px;font-size:.93rem;line-height:1.45}
.msg.me{align-self:flex-end;background:var(--accent);color:var(--accent-ink);border-bottom-right-radius:4px}
.msg.bot{align-self:flex-start;background:var(--oat);border-bottom-left-radius:4px}
.msg.bot strong{font-weight:600}
.msg.ok{background:var(--accent-soft)}
.choice{display:flex;gap:8px;align-self:flex-start}
.choice button{font:600 .86rem var(--sans);border-radius:999px;padding:7px 18px;cursor:pointer;border:1.5px solid var(--accent);background:var(--accent);color:var(--accent-ink);transition:transform .15s var(--ease),opacity .2s}
.choice button.no{background:transparent;color:var(--accent)}
.choice button:active{transform:scale(.96)}
.choice button[disabled]{cursor:default;opacity:.55}
.choice button.picked{opacity:1}
.after[hidden]{display:none}
.typing[hidden]{display:none}
.typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:var(--oat);border-radius:14px;border-bottom-left-radius:4px}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--earth-3);animation:dot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,60%,100%{opacity:.25}30%{opacity:1}}
.phone-foot{padding:10px 18px;border-top:1px solid var(--sand);font-size:.76rem;color:var(--earth-3)}

.pitch{grid-column:1 / -1;display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap;border-top:1px solid var(--sand);padding-top:clamp(20px,3vh,32px)}
.pitch h1{font-family:var(--sans);font-weight:600;font-size:clamp(1.15rem,1.6vw,1.45rem);line-height:1.35;letter-spacing:-.01em;max-width:40ch;text-wrap:pretty}
.pitch h1 span{display:block;font-weight:400;color:var(--earth-2)}
.go{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.btn{display:inline-block;background:var(--earth);color:var(--oat);text-decoration:none;font-weight:600;font-size:1rem;padding:15px 28px;border-radius:8px;transition:background .2s,transform .15s var(--ease)}
.btn:hover{background:var(--accent)}
.btn:active{transform:translateY(1px)}
.go small{font-size:.8rem;color:var(--earth-3)}

/* ---------- sections ---------- */
.sec{padding:clamp(64px,9vw,120px) var(--gutter);max-width:1440px;margin:0 auto}
.sec h2,.asks h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.2vw,3.6rem);line-height:1.05;letter-spacing:-.02em;max-width:18ch;text-wrap:balance}
.sec .lead,.asks .lead{margin-top:18px;max-width:58ch;color:var(--earth-2);font-size:1.08rem}

.picks{list-style:none;margin-top:clamp(36px,5vw,64px);border-top:1px solid var(--earth)}
.picks li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(16px,4vw,64px);padding:clamp(22px,3vw,34px) 0;border-bottom:1px solid var(--sand)}
.picks h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.35rem,2.1vw,1.8rem);line-height:1.2;letter-spacing:-.01em;text-wrap:balance}
.picks p{color:var(--earth-2);max-width:56ch}
.picks .via{display:block;margin-top:8px;font-size:.82rem;color:var(--accent);font-weight:600}

.asks{background:var(--earth);color:var(--oat);border-radius:0}
.asks-in{padding:clamp(72px,10vw,128px) var(--gutter);max-width:1440px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.asks h2{color:var(--oat)}
.asks .lead{color:rgba(245,240,232,.75)}
.asks ul{list-style:none;display:flex;flex-direction:column;gap:18px}
.asks li{padding-left:28px;position:relative;color:rgba(245,240,232,.88)}
.asks li::before{content:"";position:absolute;left:0;top:.45em;width:12px;height:12px;border-radius:50%;border:2px solid var(--oat)}
.asks li b{color:var(--oat);font-weight:600}

.plans{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;margin-top:clamp(36px,5vw,56px);border-top:1px solid var(--earth)}
.plan{padding:clamp(24px,3vw,40px) clamp(0px,3vw,40px) clamp(24px,3vw,40px) 0}
.plan + .plan{border-left:1px solid var(--sand);padding-left:clamp(20px,3vw,40px)}
.plan h3{font-family:var(--serif);font-weight:400;font-size:1.7rem}
.plan .price{font-family:var(--serif);font-size:3rem;line-height:1;margin:14px 0 4px}
.plan .price small{font-family:var(--sans);font-size:.95rem;color:var(--earth-3)}
.plan .who{color:var(--earth-2);margin-bottom:16px}
.plan ul{list-style:none;display:flex;flex-direction:column;gap:8px;font-size:.95rem;margin-bottom:22px}
.plan li::before{content:"\2014";color:var(--accent);margin-right:10px}
.plan.biz .who{color:var(--accent);font-weight:600}
.fine{margin-top:22px;font-size:.82rem;color:var(--earth-3);max-width:80ch}

.faq{margin-top:clamp(28px,4vw,48px);border-top:1px solid var(--earth);max-width:880px}
.faq details{border-bottom:1px solid var(--sand)}
.faq summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;font-weight:600;font-size:1.06rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:18px;font-family:var(--serif);font-size:1.6rem;color:var(--accent);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 22px;color:var(--earth-2);max-width:68ch}

.close{background:var(--accent);color:var(--accent-ink)}
.close-in{padding:clamp(72px,10vw,128px) var(--gutter);max-width:1440px;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.close h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,5vw,4.2rem);line-height:1.02;letter-spacing:-.02em;max-width:14ch}
.close .btn{background:var(--oat);color:var(--earth)}
.close .btn:hover{background:var(--white)}
.close small{display:block;margin-top:8px;font-size:.82rem}

@media (max-width:900px){
  .ask{grid-template-columns:1fr;grid-template-rows:auto;min-height:0;padding-top:96px;align-items:start}
  .phone{justify-self:stretch;max-width:none}
  .thread{min-height:250px}
  .wall button{font-size:clamp(1.45rem,6vw,2rem)}
  .picks li,.asks-in,.plans{grid-template-columns:1fr}
  .plan + .plan{border-left:0;border-top:1px solid var(--sand);padding-left:0}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}