/* KeepDonors look ("Orchard"), layered over site.css for the public pages. Brand: Montserrat; #FFC433 sun,
   #0B2239 ink, #485A70 slate, #F9F5E8 cream. Brand art only ever sits on cream or white. */
body.site.kd {
  --ground: #F9F5E8; --card: #FFFFFF; --ink: #0B2239; --muted: #4A5A6C; --line: #E8E0CC;
  --accent: #FFC433; --accent-ink: #0B2239; --accent-soft: #FFF1C7; --teal: #485A70; --teal-soft: #E4E9EF;
  --kd-sun: #FFC433; --kd-ink: #0B2239; --kd-slate: #485A70; --kd-cream: #FBF4E4; --kd-bark: #7A5230; --kd-berry: #F5B23A; --kd-berry-hi: #FFD98A;
  font-family: Montserrat, system-ui, sans-serif; color: var(--ink); background: var(--ground); overflow-x: hidden;
}
.kd h1, .kd h2, .kd h3 { font-weight: 800; letter-spacing: -0.02em; }
.kd-img { display: block; max-width: 100%; height: auto; }
.kd-art { display: block; width: 100%; height: auto; }

/* Buttons: sun yellow with ink text */
.kd .btn { border-radius: 999px; font-weight: 700; }
.kd .btn.primary { background: var(--kd-sun); border-color: var(--kd-sun); color: var(--kd-ink); box-shadow: 0 8px 20px -10px rgba(180,120,0,.8); }
.kd .btn.primary:hover, .kd button.primary:hover { background: #F5B400; border-color: #F5B400; }
.kd button.primary { background: var(--kd-sun); border-color: var(--kd-sun); color: var(--kd-ink); }
.kd .btn.ghost { border: 2px solid var(--kd-ink); }
.kd .btn.huge, .kd button.huge { border-radius: 999px; }

/* Header and footer */
.kd .top { padding: 18px clamp(16px, 4vw, 56px); }
.kd-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.kd-brand .kd-sunmark { width: 46px; }
.kd-brand .kd-wordimg { height: 26px; width: auto; }
.kd .top nav { gap: 22px; font-weight: 600; }
.kd .top nav a:not(.btn):hover { text-decoration: underline; text-decoration-color: var(--kd-sun); text-decoration-thickness: 3px; text-underline-offset: 6px; }
.kd-foot { display: block; max-width: none; margin-top: 30px; padding: 0 clamp(16px, 5vw, 72px) 34px; color: var(--ink); }
.kd-foot-art { max-width: 1240px; margin: 0 auto; }
.kd-foot-row { max-width: 1240px; margin: 10px auto 0; display: flex; gap: 20px; flex-wrap: wrap; justify-content: space-between; align-items: center; font-size: 14px; color: var(--muted); }
.kd-foot .tagline { letter-spacing: .14em; text-transform: uppercase; font-size: 12px; font-weight: 700; color: var(--kd-slate); }
.kd-foot .kd-brand .kd-sunmark { width: 38px; } .kd-foot .kd-brand .kd-wordimg { height: 22px; }

/* Hero: berry sprigs in the corners, nothing over the phone */
.kd .hero2 { padding-top: 40px; }
.kd .hero2 h1 em { background: linear-gradient(transparent 60%, rgba(255,196,51,.75) 60%); -webkit-background-clip: border-box; background-clip: border-box; color: inherit; font-style: normal; }
.kd .rotator { color: var(--kd-slate); }
.kd .eyebrow { color: var(--kd-slate); letter-spacing: .14em; }
.kd .eyebrow .dot { background: var(--kd-sun); box-shadow: none; animation: none; }
.kd-sprig { position: absolute; pointer-events: none; z-index: -1; }
.kd-sprig-l { width: 170px; left: -60px; bottom: 6px; transform: rotate(-8deg); }
.kd-sprig-r { width: 170px; right: -40px; top: 70px; transform: rotate(170deg); }
.kd .vphone { background: var(--kd-ink); }
.kd .vplay { background: var(--kd-sun); color: var(--kd-ink); }
.kd .vcap { background: linear-gradient(transparent, rgba(11,34,57,.85)); }
.kd .float-card { border-radius: 16px; font-weight: 600; }
.kd .pill.ok { background: #FFF1C7; color: var(--kd-ink); }

.kd .marquee { background: var(--kd-ink); border: 0; }
.kd .marquee .track { color: #DCE4EE; }
.kd .marquee i { color: var(--kd-sun); }
.kd-divider { max-width: 1100px; margin: 10px auto 0; padding: 0 20px; }

/* Sections */
.kd .band { max-width: 1180px; }
.kd .band-head { max-width: 720px; margin: 0 auto 34px; text-align: center; }
.kd .band-head .eyebrow { margin-bottom: 8px; }
.kd .sample-meta { text-align: center; }
.kd .sample-meta .kind { display: inline-block; padding: 4px 10px; border-radius: 999px; background: var(--kd-ink); color: var(--kd-sun); letter-spacing: .1em; }
.kd .sample-meta .script { font-style: italic; }
#how.band { position: relative; }
.kd-fly { position: absolute; width: 190px; right: 4%; top: 6px; pointer-events: none; }
.kd .step { border-radius: 20px; }
.kd .step .icon { width: 48px; height: 48px; border-radius: 14px; background: #FFF1C7; display: grid; place-items: center; font-size: 24px; }
.kd .connector span { background: var(--kd-berry); }
.kd .checks li::before { background: var(--kd-sun); color: var(--kd-ink); }
.kd-perch { width: 230px; margin-top: 22px; }
.kd .inbox-mock { border-radius: 24px; }
.kd .im-btn { background: var(--kd-sun); border-color: var(--kd-sun); color: var(--kd-ink); }
@keyframes glowbtn { 50% { box-shadow: 0 0 0 8px rgba(255,196,51,.25); } }
.kd .tcard { border-top: 6px solid var(--kd-sun); border-radius: 22px; }

/* Closing call to action: a cream card, so the singing bird's yellow and the speech bubble stay clear */
.kd .cta2 { display: grid; grid-template-columns: .9fr 1.1fr; gap: 30px; align-items: center; text-align: left; color: var(--ink);
  background: var(--kd-cream); border: 2px solid var(--kd-sun); border-radius: 34px; padding: 44px 48px; }
.kd .cta2 p { color: var(--muted); opacity: 1; }
.kd-cta-bird { max-width: 340px; }

/* Demo pages */
.kd .phone { background: var(--kd-ink); }
.kd .phone .vid { background: linear-gradient(160deg, #173556, #0B2239); }
.kd .fact { border-left-color: var(--kd-sun); }
.kd .note-line { background: #FFF1C7; color: var(--ink); }
.kd .spin-heart { color: var(--kd-sun); }
.kd .watch .stages li.done { color: var(--kd-slate); }
.kd .watch .stages li.done::before { background: var(--kd-slate); }
.kd .card { border-radius: 20px; }

@media (max-width: 900px) {
  .kd-sprig, .kd-fly { display: none; }
  .kd .top nav a:not(.btn) { display: none; }
  .kd .top .btn { padding: 8px 14px; font-size: 13px; white-space: nowrap; }
  .kd-brand .kd-sunmark { width: 34px; } .kd-brand .kd-wordimg { height: 18px; }
  .kd .cta2 { grid-template-columns: 1fr; padding: 30px 22px; text-align: center; }
  .kd-cta-bird { margin: 0 auto; max-width: 260px; }
  .kd-perch { margin: 18px auto 0; }
  .kd .hero2 > *, .kd .split > * { min-width: 0; }
}

/* Phone header: wordmark only (bigger), and a burger menu for the links */
.kd-burger { display: none; }
@media (max-width: 900px) {
  .kd .top { position: relative; flex-wrap: nowrap; }
  .kd .top .kd-brand .kd-sunmark { display: none; }
  .kd .top .kd-brand .kd-wordimg { height: 32px; }
  .kd-burger { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 10px; border-radius: 12px;
    border: 2px solid var(--kd-ink); background: #fff; cursor: pointer; }
  .kd-burger span { display: block; height: 3px; border-radius: 2px; background: var(--kd-ink); transition: transform .2s, opacity .2s; }
  .kd-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  .kd-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .kd-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
  .kd .top nav { display: none; position: absolute; left: 12px; right: 12px; top: calc(100% + 4px); z-index: 30; flex-direction: column; align-items: stretch; gap: 0;
    background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 8px; box-shadow: 0 24px 48px -20px rgba(11,34,57,.4); }
  .kd .top nav.open { display: flex; }
  .kd .top nav a:not(.btn) { display: block; padding: 12px 14px; border-radius: 10px; font-size: 16px; }
  .kd .top nav a:not(.btn):hover { background: var(--ground); text-decoration: none; }
  .kd .top nav .btn { margin-top: 6px; justify-content: center; text-align: center; padding: 12px 16px; font-size: 15px; }
  .kd-foot .kd-brand .kd-sunmark { display: none; }
}