/* ═══════════════════════════════════════════════════════════════
   budulai.app v3 layer (Sep 28, 2026): one centered promise,
   email-only sign-up, real screenshots (no video), referral step.
   Loaded after v2.css.
   ═══════════════════════════════════════════════════════════════ */
#hero.v3{padding:118px 0 72px;text-align:center;background:
  radial-gradient(ellipse 70% 45% at 50% 0%,rgba(212,168,67,.18),transparent 70%),var(--bg)}
#hero.v3 .wrap{max-width:1120px}
#hero.v3 .eyebrow{margin:0 auto 24px;background:#FBF8F1;border-color:var(--line);color:var(--gold-text)}
#hero.v3 h1{max-width:900px;margin:0 auto;font-size:clamp(2.4rem,5.6vw,4.4rem);line-height:1.04;letter-spacing:-.03em;font-weight:600;color:var(--navy);text-wrap:balance}
.v3-accent{color:#7F5E12}
#hero.v3 .hero-sub{max-width:600px;margin:22px auto 0;font-size:1.13rem;line-height:1.6;color:var(--text2);text-wrap:pretty}
.v3-signup{max-width:540px;margin:30px auto 0}
#hero.v3 .hero-offer{margin:0 0 14px;background:var(--navy);border:1px solid var(--navy);color:#E8E0CC;text-align:center;box-shadow:0 14px 34px -18px rgba(11,20,38,.55)}
#hero.v3 .hero-offer strong{color:var(--brand-gold)}
#hero.v3 .wl-inline{margin:0 auto}
#hero.v3 .hero-note{margin-top:12px}
.v3-founder{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:22px;font-size:.92rem;color:var(--text2)}
.v3-founder img{border-radius:6px}

/* Real screenshots, static and light (no video) */
.v3-shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;max-width:960px;margin:64px auto 0;align-items:start}
.v3-shots figure{margin:0}
.v3-shots img{width:100%;max-width:270px;margin:0 auto;border-radius:36px;
  box-shadow:0 0 0 8px #0B1426,0 0 0 9px rgba(212,168,67,.3),0 30px 60px -26px rgba(11,20,38,.55)}
.v3-shots .mid{transform:translateY(-18px)}
.v3-shots figcaption{margin-top:20px}
.v3-shots figcaption span{display:inline-block;max-width:250px;font-family:var(--serif);font-size:1.02rem;line-height:1.35;color:var(--navy);font-weight:600}
.v3-real{margin-top:22px;font-size:.84rem;color:var(--text3)}


/* Referral box shown after a successful sign-up */
.ref-box{box-sizing:border-box;width:100%;margin:16px auto 0;max-width:540px;text-align:left;background:#FBF8F1;border:1px solid var(--line);border-radius:18px;padding:16px 18px;color:var(--navy)}
.ref-box h5{font-family:var(--serif);font-size:1.08rem;font-weight:600;margin:0 0 4px}
.ref-box p{font-size:.9rem;line-height:1.5;color:var(--text2);margin:0 0 12px}
.ref-row{display:flex;gap:8px}
.ref-row input{flex:1;min-width:0;font:inherit;font-size:.9rem;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--navy)}
.ref-row button{font:inherit;font-weight:600;font-size:.9rem;padding:10px 16px;border-radius:100px;border:0;background:var(--brand-gold);color:var(--navy);cursor:pointer;white-space:nowrap}
.ref-row button:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
.ref-fine{font-size:.78rem!important;color:var(--text3)!important;margin:10px 0 0!important}
.cta-sec .ref-box{background:rgba(250,246,239,.08);border-color:rgba(250,246,239,.25);color:#F2EBDA}
.cta-sec .ref-box p,.cta-sec .ref-fine{color:#D5DDE8!important}

@media(max-width:760px){
  #hero.v3{padding:100px 0 48px}
  #hero.v3 h1{font-size:clamp(2.1rem,9vw,2.7rem)}
  #hero.v3 .hero-sub{font-size:1.02rem}
  .v3-founder img{display:none}
  .v3-shots{grid-template-columns:repeat(3,62%);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;margin:44px -24px 0;padding:6px 24px 18px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .v3-shots::-webkit-scrollbar{display:none}
  .v3-shots figure{scroll-snap-align:center}
  .v3-shots .mid{transform:none}
  .v3-shots img{max-width:none;border-radius:30px}
}

/* Closing band runs full width and flush into the footer (same navy, no inset or rounded corners) */
.cta-sec{margin:0!important;border-radius:0!important}

/* Hero feature: one big real screenshot + three plain steps (replaces the 3-phone row) */
.v3-feature{display:grid;grid-template-columns:auto 1fr;gap:64px;align-items:center;max-width:1000px;margin:64px auto 0;padding:56px 64px;
  background:var(--navy);border-radius:36px;text-align:left;box-shadow:0 40px 80px -44px rgba(11,20,38,.6);position:relative;overflow:hidden}
.v3-feature::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 50% 60% at 20% 30%,rgba(212,168,67,.18),transparent 70%)}
.v3-feature>*{position:relative}
.v3-feature .real-shot{max-width:300px;margin:0}
.v3-feature .real-shot figcaption{color:#9FB0C4}
.v3-steps .f-kicker{color:var(--brand-gold);margin-bottom:12px}
.v3-steps h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.1;letter-spacing:-.02em;color:#F2EBDA;margin:0 0 28px}
.v3-steps ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.v3-steps li{display:flex;gap:14px;align-items:flex-start;font-size:1.04rem;line-height:1.55;color:#C9D3E0}
.v3-steps li strong{color:#F2EBDA}
.v3-steps li>span{flex:none;width:30px;height:30px;border-radius:50%;background:var(--brand-gold);color:var(--navy);font-weight:700;font-size:.9rem;display:flex;align-items:center;justify-content:center;margin-top:1px}
@media(max-width:860px){
  .v3-feature{grid-template-columns:1fr;gap:32px;padding:36px 22px;margin-top:44px;border-radius:26px}
  .v3-feature .real-shot{margin:0 auto;max-width:240px}
  .v3-steps h2{text-align:center}
  .v3-steps .f-kicker{text-align:center}
}

/* v12 */
.v3-live{margin-top:24px;font-size:.95rem;color:#9FB0C4;padding-left:44px}
.v4-more{text-align:center;margin-top:34px;position:relative;z-index:1}
.privacy-sec .v4-more a{color:#D4A843}
.story-photo img{object-fit:cover;object-position:50% 30%}
@media(max-width:860px){.v3-live{padding-left:0;text-align:center}}
