/*
 * Styles for the owner and agent landing pages (kate-pages.js adds the reveals).
 * Same tokens as askkate.ai: cream #f8f6f2 ground, ink #161616, terracotta #a85135 accent word,
 * apricot #ffb38a buttons, charcoal #302e32 band, peach closing gradient, Manrope 800 headlines, DM Sans body.
 * Everything is visible without JavaScript; motion only hides content once kate-pages.js has added .kp-js.
 */
.kp-page{--kp-cream:#f8f6f2;--kp-ink:#161616;--kp-terra:#a85135;--kp-apricot:#ffb38a;--kp-apricot-deep:#d18b66;--kp-char:#302e32;--kp-char-2:#454146;--kp-muted:#605458;--kp-line:rgba(22,22,22,.14);--kp-ease:cubic-bezier(.2,.7,.2,1);background:var(--kp-cream);color:var(--kp-ink);font-family:"DM Sans",Arial,sans-serif;overflow-x:clip}
.kp-page *{box-sizing:border-box}
.kp-page h1,.kp-page h2,.kp-page h3{font-family:Manrope,Arial,sans-serif;margin:0}
.kp-page a{color:inherit}
.kp-wrap{max-width:1320px;margin:0 auto;padding:0 64px}

/* ---------- hero ---------- */
.kp-hero{position:relative;isolation:isolate;padding:150px 0 110px;background:linear-gradient(107deg,#f8f6f2 0%,#f6f1ed 48%,#ead9ce 100%);overflow:hidden}
.kp-grain{position:absolute;inset:0;z-index:-1;opacity:.19;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E")}
.kp-orb{position:absolute;z-index:-1;border-radius:50%;pointer-events:none;will-change:transform;animation:kpDrift 18s ease-in-out infinite alternate}
.kp-orb.a{width:520px;height:520px;right:-120px;top:-140px;background:radial-gradient(circle at 35% 35%,rgba(255,179,138,.75),rgba(255,179,138,0) 68%)}
.kp-orb.b{width:420px;height:420px;left:-160px;bottom:-200px;background:radial-gradient(circle at 60% 40%,rgba(168,81,53,.32),rgba(168,81,53,0) 70%);animation-duration:23s;animation-delay:-6s}
.kp-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:72px;align-items:center}
.kp-eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--kp-terra);font:800 11px/1.3 Manrope,Arial,sans-serif;letter-spacing:.17em;text-transform:uppercase}
.kp-eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--kp-apricot);box-shadow:0 0 0 0 rgba(255,179,138,.7);animation:kpPulse 2.4s ease-out infinite}
.kp-hero h1{font-size:clamp(46px,7.2vw,104px);line-height:.94;letter-spacing:-.045em;font-weight:800;margin:22px 0 28px}
.kp-hero h1 em,.kp-page h2 em{font-style:normal;color:var(--kp-terra)}
.kp-line{display:block;overflow:hidden;padding-bottom:.08em}
.kp-line>span{display:block}
.kp-lead{font-size:clamp(17px,1.5vw,20px);line-height:1.6;color:#3a3330;max-width:34em;margin:0 0 34px}
.kp-cta-row{display:flex;flex-wrap:wrap;gap:16px 22px;align-items:center}
.kp-btn{display:inline-flex;align-items:center;gap:12px;background:var(--kp-apricot);color:#30241e;border:.67px solid var(--kp-apricot-deep);border-radius:5px;padding:18px 26px;font:800 15px/1.2 "DM Sans",Arial,sans-serif;text-decoration:none;box-shadow:0 8px 22px rgba(146,85,52,.12);transition:transform .35s var(--kp-ease),box-shadow .35s var(--kp-ease),background .35s}
.kp-btn i{font-style:normal;display:inline-block;transition:transform .35s var(--kp-ease)}
.kp-btn:hover,.kp-btn:focus-visible{transform:translateY(-3px);box-shadow:0 16px 34px rgba(146,85,52,.24);background:#ffc29f}
.kp-btn:hover i,.kp-btn:focus-visible i{transform:translate(4px,-4px)}
.kp-btn:focus-visible,.kp-link:focus-visible{outline:3px solid var(--kp-ink);outline-offset:3px}
.kp-link{display:inline-block;font-weight:800;text-decoration:none;border-bottom:2px solid var(--kp-ink);padding:12px 0 3px}
.kp-note{margin:26px 0 0;font-size:13px;line-height:1.55;color:var(--kp-muted);max-width:40em}
/* The brokerage's licensed name, beside the WhatsApp button (Fla. Admin. Code 61J2-10.025). Never hidden; in the page body it fades in with the button beside it. */
.kp-id{flex:0 0 100%;display:flex;gap:10px;align-items:flex-start;margin:0;max-width:36em;font:600 13.5px/1.5 "DM Sans",Arial,sans-serif;color:#2b2420}
.kp-id::before{content:"";flex:none;width:8px;height:8px;margin-top:.5em;border-radius:50%;background:var(--kp-terra)}
.kp-cta-row .kp-id{order:1}

/* ---------- conversation card ---------- */
.kp-chat{position:relative;background:#fff;border:.67px solid rgba(22,22,22,.12);border-radius:22px;box-shadow:0 40px 90px rgba(80,40,20,.2),0 6px 18px rgba(80,40,20,.08);overflow:hidden;transform:rotate(1.2deg);transition:transform .8s var(--kp-ease)}
.kp-chat:hover{transform:rotate(0deg) translateY(-4px)}
.kp-chat-top{display:flex;align-items:center;gap:12px;padding:16px 20px;background:#1f3d2f;color:#fffaf6}
.kp-chat-top b{font:800 15px Manrope,Arial,sans-serif}
.kp-chat-top small{display:block;font-size:11px;opacity:.75}
.kp-avatar{width:38px;height:38px;border-radius:50%;background:var(--kp-apricot);display:grid;place-items:center;color:#30241e;font:800 16px Manrope,Arial,sans-serif}
.kp-chat-body{display:flex;flex-direction:column;gap:12px;padding:22px 18px 26px;background:#efe9e1;min-height:430px}
.kp-msg{max-width:84%;padding:11px 14px;border-radius:14px;font-size:14.5px;line-height:1.45;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.kp-msg.you{align-self:flex-end;background:#dcf8c6;border-top-right-radius:4px}
.kp-msg.kate{align-self:flex-start;background:#fff;border-top-left-radius:4px}
.kp-msg small{display:block;margin-top:5px;font-size:10.5px;color:#5a4f49;text-align:right}
.kp-photos{display:flex;gap:6px;margin-top:8px}
.kp-photos span{flex:1;height:54px;border-radius:8px;background:linear-gradient(135deg,#f3c9aa,#d9906b);position:relative}
.kp-photos span:nth-child(2){background:linear-gradient(135deg,#cfd8cf,#8aa293)}
.kp-photos span:nth-child(3){background:linear-gradient(135deg,#e5dccf,#b9a58e)}
.kp-chips{display:flex;gap:8px;margin-top:10px}
.kp-chips span{flex:1;text-align:center;border:1px solid #2a7a5b;color:#1b6a4c;border-radius:20px;padding:7px 10px;font:700 12.5px "DM Sans",Arial,sans-serif;background:#f4fbf7}
.kp-typing{align-self:flex-start;background:#fff;border-radius:14px;border-top-left-radius:4px;padding:13px 16px;display:none;gap:5px;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.kp-js .kp-typing{display:flex}
.kp-typing i{width:7px;height:7px;border-radius:50%;background:#9a8f88;animation:kpDot 1.1s infinite ease-in-out}
.kp-typing i:nth-child(2){animation-delay:.15s}.kp-typing i:nth-child(3){animation-delay:.3s}
.kp-chat-foot{padding:11px 18px;background:#fbf8f4;border-top:1px solid rgba(22,22,22,.08);font-size:11.5px;color:var(--kp-muted)}
.kp-js .kp-chat .kp-msg,.kp-js .kp-chat .kp-typing{opacity:0;transform:translateY(14px) scale(.97)}
.kp-js .kp-chat.is-in .kp-msg{animation:kpPop .55s var(--kp-ease) forwards;animation-delay:var(--d,0s)}
.kp-js .kp-chat.is-in .kp-typing{animation:kpTyping 1.5s ease forwards;animation-delay:var(--d,0s)}

/* ---------- ribbon ---------- */
.kp-ribbon{background:var(--kp-ink);color:#fffaf6;overflow:hidden;border-block:1px solid #000;padding:20px 0}
.kp-ribbon-track{display:flex;width:max-content;animation:kpMarquee 46s linear infinite}
.kp-ribbon:hover .kp-ribbon-track{animation-play-state:paused}
.kp-ribbon span{display:inline-flex;align-items:center;gap:34px;padding-right:34px;font:800 clamp(22px,3vw,38px)/1 Manrope,Arial,sans-serif;letter-spacing:-.03em;white-space:nowrap}
.kp-ribbon span::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--kp-apricot)}
.kp-ribbon span:nth-child(even){color:var(--kp-apricot)}

/* ---------- shared section scaffolding ---------- */
.kp-sec{padding:110px 0}
.kp-kicker{display:flex;justify-content:space-between;gap:20px;font:800 11px/1.3 Manrope,Arial,sans-serif;letter-spacing:.17em;text-transform:uppercase;margin-bottom:34px}
.kp-sec h2{font-size:clamp(38px,5.6vw,76px);line-height:.98;letter-spacing:-.04em;font-weight:800}
.kp-sec .kp-sub{font-size:clamp(16px,1.4vw,19px);line-height:1.62;max-width:36em;margin:22px 0 0;color:#3a3330}

/* ---------- dark band: what stays with you ---------- */
.kp-band{background:var(--kp-char);color:#fffaf6}
.kp-band .kp-kicker{color:#fffaf6}
.kp-band .kp-sub{color:#e9dfd8}
.kp-band h2 em{color:var(--kp-apricot)}
.kp-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:56px}
.kp-card{position:relative;background:var(--kp-char-2);border:.67px solid #a69893;border-radius:14px;padding:34px 30px 36px;overflow:hidden;transition:transform .45s var(--kp-ease),border-color .3s,background .3s}
.kp-card::before{content:"";position:absolute;inset:auto -30% -60% auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,179,138,.28),rgba(255,179,138,0) 70%);transition:transform .6s var(--kp-ease)}
.kp-card:hover{transform:translateY(-8px);border-color:var(--kp-apricot);background:#4d484f}
.kp-card:hover::before{transform:translate(-30px,-30px) scale(1.2)}
.kp-card .kp-num{display:block;font:800 13px Manrope,Arial,sans-serif;letter-spacing:.17em;color:var(--kp-apricot);margin-bottom:46px}
.kp-card h3{font-size:clamp(24px,2.3vw,32px);line-height:1.08;letter-spacing:-.03em;font-weight:800;margin-bottom:14px}
.kp-card p{margin:0;font-size:15.5px;line-height:1.62;color:#eadfd8}

/* ---------- steps ---------- */
.kp-steps-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:60px;align-items:end;margin-bottom:70px}
.kp-steps{position:relative;margin:0;padding:0;list-style:none}
.kp-steps::before,.kp-steps::after{content:"";position:absolute;left:52px;top:20px;bottom:20px;width:2px}
.kp-steps::before{background:var(--kp-line)}
.kp-steps::after{background:var(--kp-terra);transform-origin:top;transform:scaleY(var(--p,1))}
.kp-js .kp-steps::after{transform:scaleY(var(--p,0))}
.kp-step{position:relative;display:grid;grid-template-columns:106px minmax(0,1fr) minmax(0,1.1fr);gap:0 40px;align-items:start;padding:34px 0;border-top:1px solid var(--kp-line)}
.kp-step:first-child{border-top:0}
.kp-step .kp-n{position:relative;z-index:1;width:106px;font:800 clamp(54px,6vw,92px)/.9 Manrope,Arial,sans-serif;letter-spacing:-.06em;color:var(--kp-terra);background:var(--kp-cream);padding:6px 0;transition:color .4s}
.kp-step h3{font-size:clamp(26px,3vw,40px);line-height:1.04;letter-spacing:-.035em;font-weight:800}
.kp-step p{margin:6px 0 0;font-size:17px;line-height:1.65;color:#3a3330;max-width:34em}
.kp-step:hover .kp-n{color:var(--kp-ink)}

/* ---------- cost ---------- */
.kp-cost{background:linear-gradient(120deg,#fff4e8 0%,#f8dac5 100%);position:relative;overflow:hidden}
.kp-cost-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:70px;align-items:center}
.kp-cost h2{font-size:clamp(38px,5.2vw,76px)}
.kp-cost .kp-sub{color:#52403a}
.kp-seal{border:2px solid var(--kp-ink);border-radius:18px;padding:34px 32px;background:rgba(255,255,255,.6);transform:rotate(-1.4deg);transition:transform .6s var(--kp-ease)}
.kp-seal:hover{transform:rotate(0deg)}
.kp-seal b{display:block;font:800 clamp(26px,2.6vw,36px)/1.05 Manrope,Arial,sans-serif;letter-spacing:-.03em;margin-bottom:16px}
.kp-seal ul{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.kp-seal li{display:flex;gap:12px;font-size:15.5px;line-height:1.5}
.kp-seal li::before{content:"";flex:none;width:10px;height:10px;margin-top:7px;border-radius:50%;background:var(--kp-terra)}

/* ---------- before you list ---------- */
.kp-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:50px}
.kp-doc{border:1px solid var(--kp-ink);border-radius:14px;padding:34px 32px;background:#fff;transition:transform .4s var(--kp-ease),box-shadow .4s var(--kp-ease)}
.kp-doc:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(60,30,20,.14)}
.kp-doc h3{font-size:clamp(23px,2.2vw,30px);letter-spacing:-.03em;margin-bottom:12px}
.kp-doc p{margin:0;font-size:16px;line-height:1.65;color:#3a3330}

/* ---------- faq (the site's own .faq look, scoped here so the page has no dependency on home rules) ---------- */
.kp-faq{background:var(--kp-cream)}
.kp-faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:70px;align-items:start}
.kp-faq h2{position:sticky;top:40px}
.kp-faq details{border-top:1px solid var(--kp-line);padding:19px 0}
.kp-faq details:last-child{border-bottom:1px solid var(--kp-line)}
.kp-faq summary{cursor:pointer;list-style:none;min-height:44px;display:flex;justify-content:space-between;gap:20px;align-items:center;font:800 18px/1.3 Manrope,Arial,sans-serif}
.kp-faq summary::-webkit-details-marker{display:none}
.kp-faq summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--kp-ink);display:grid;place-items:center;font:600 20px/1 "DM Sans",Arial,sans-serif;transition:transform .35s var(--kp-ease),background .3s}
.kp-faq details[open] summary::after{transform:rotate(45deg);background:var(--kp-apricot)}
.kp-faq summary:focus-visible{outline:3px solid var(--kp-ink);outline-offset:4px}
.kp-faq details p{margin:12px 0 4px;font-size:16px;line-height:1.7;color:#3a3330;max-width:38em}
.kp-faq details p a{font-weight:700}

/* ---------- closing ---------- */
.kp-closing{position:relative;overflow:hidden;background:linear-gradient(120deg,#fff4e8 0%,#f8dac5 100%);text-align:center;padding:120px 20px 130px;color:#352b26}
.kp-closing .kp-eyebrow{justify-content:center}
.kp-closing .kp-id{justify-content:center;margin:22px auto 0;max-width:36em;font-size:13.5px;line-height:1.5;text-align:center;color:#2b2420}
.kp-closing .kp-id::before{content:none}
.kp-closing h2{font-size:clamp(46px,8.2vw,124px);line-height:.92;letter-spacing:-.05em;font-weight:800;margin:22px 0 26px}
.kp-closing p{margin:0 auto 38px;max-width:30em;font-size:17px;line-height:1.6;color:#70594b}
.kp-closing .kp-orb.a{left:50%;right:auto;top:-220px;margin-left:-260px}

/* ---------- reveal ---------- */
.kp-js [data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .9s var(--kp-ease),transform .9s var(--kp-ease);transition-delay:var(--rd,0s)}
.kp-js [data-reveal].is-in{opacity:1;transform:none}
.kp-js .kp-line>span{transform:translateY(105%);transition:transform 1.05s var(--kp-ease);transition-delay:var(--rd,0s)}
.kp-js .kp-hero.is-in .kp-line>span{transform:none}

@keyframes kpDrift{from{transform:translate(0,0) scale(1)}to{transform:translate(-50px,40px) scale(1.12)}}
@keyframes kpPulse{0%{box-shadow:0 0 0 0 rgba(255,179,138,.75)}70%,100%{box-shadow:0 0 0 14px rgba(255,179,138,0)}}
@keyframes kpPop{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@keyframes kpTyping{0%{opacity:0;transform:translateY(10px)}12%,78%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-6px);height:0;padding:0;margin:-6px 0}}
@keyframes kpDot{0%,80%,100%{transform:translateY(0);opacity:.45}40%{transform:translateY(-5px);opacity:1}}
@keyframes kpMarquee{to{transform:translateX(-50%)}}

/* ---------- responsive ---------- */
@media (max-width:1060px){
  .kp-wrap{padding:0 40px}
  .kp-hero-grid,.kp-cost-grid,.kp-faq-grid,.kp-steps-head{grid-template-columns:1fr;gap:48px}
  .kp-cards{grid-template-columns:1fr}
  .kp-faq h2{position:static}
  .kp-step{grid-template-columns:86px minmax(0,1fr);gap:0 24px}
  .kp-step .kp-n{width:86px}
  .kp-step p{grid-column:2}
  .kp-steps::before,.kp-steps::after{left:42px}
}
@media (max-width:640px){
  .kp-wrap{padding:0 20px}
  .kp-hero{padding:118px 0 80px}
  .kp-sec{padding:76px 0}
  .kp-two{grid-template-columns:1fr}
  .kp-btn{width:100%;justify-content:center}
  .kp-cta-row .kp-id{order:0}
  .kp-chat{transform:none}
  .kp-chat-body{min-height:0}
  .kp-step{grid-template-columns:62px minmax(0,1fr);gap:0 16px;padding:26px 0}
  .kp-step .kp-n{width:62px;font-size:44px}
  .kp-steps::before,.kp-steps::after{left:30px}
  .kp-kicker{flex-direction:column;gap:6px}
}
@media print{
  .kp-js [data-reveal],.kp-js .kp-line>span,.kp-js .kp-chat .kp-msg{opacity:1;transform:none;transition:none;animation:none}
  .kp-js .kp-chat .kp-typing,.kp-ribbon,.kp-orb{display:none}
  .kp-js .kp-steps::after{transform:scaleY(1)}
}
@media (prefers-reduced-motion:reduce){
  .kp-orb,.kp-ribbon-track,.kp-eyebrow::before,.kp-typing i{animation:none}
  .kp-js [data-reveal],.kp-js .kp-line>span,.kp-js .kp-chat .kp-msg{opacity:1;transform:none;transition:none;animation:none}
  .kp-js .kp-chat .kp-typing{display:none}
  .kp-js .kp-steps::after{transform:scaleY(1)}
  .kp-btn,.kp-card,.kp-doc,.kp-chat,.kp-seal{transition:none}
}
