/*
Theme Name: LV Preview Theme
Description: A faithful WordPress port of the approved LV Real Estate Consulting design preview — deep green and gold, Lora headings, Public Sans body. Includes a front page with interactive down-payment calculator, an Investors page and a Sell Your Property page, with Contact Form 7 forms wired to HubSpot.
Version: 1.4
Author: LV Real Estate Consulting
*/

  :root{
    --bg:#fbfaf7; --surface:#ffffff; --surface-2:#f1efe8; --surface-3:#e9e6da;
    --ink:#17211c; --muted:#5c6a62; --faint:#849087;
    --green:#123c2f; --green-2:#1a5743; --green-soft:#e6efe9;
    --gold:#a87c2a; --gold-soft:#f5ecd4;
    --line:#ddd9cc; --line-strong:#c9c3b2;
    --btn:#123c2f; --btn-ink:#ffffff;
    --shadow:0 18px 45px rgba(18,60,47,.14);
    --radius:18px;
  }
  @media (prefers-color-scheme: dark){
    :root{
      --bg:#101613; --surface:#171e1a; --surface-2:#1d2621; --surface-3:#26312b;
      --ink:#eef2ee; --muted:#aebbb2; --faint:#8a9a8f;
      --green:#7fc2a4; --green-2:#9ad0b6; --green-soft:#1e332a;
      --gold:#d9b45f; --gold-soft:#332d1a;
      --line:#2c3831; --line-strong:#3d4d43;
      --btn:#e9f2ec; --btn-ink:#123c2f;
      --shadow:0 18px 45px rgba(0,0,0,.35);
    }
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{transition:none!important; animation:none!important} }
  body{margin:0;background:var(--bg);color:var(--ink);font-family:"Public Sans",system-ui,-apple-system,Segoe UI,sans-serif;font-size:16.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
  img{max-width:100%;display:block}
  a{color:inherit}
  h1,h2,h3{font-family:"Lora",Georgia,serif;line-height:1.12;margin:0;font-weight:600;letter-spacing:-.01em}
  h1{font-size:clamp(2.4rem,5.4vw,4.1rem)}
  h2{font-size:clamp(1.85rem,3.6vw,2.7rem)}
  h3{font-size:1.28rem}
  p{margin:0}
  .wrap{max-width:1180px;margin:0 auto;padding:0 22px}
  .previewbar{background:#0c231b;color:#eaf3ee;font-size:.86rem}
  @media (prefers-color-scheme: dark){ .previewbar{background:#0a0f0d} }
  .previewbar .wrap{display:flex;gap:10px;align-items:center;justify-content:space-between;padding-top:9px;padding-bottom:9px;flex-wrap:wrap}
  .previewbar strong{letter-spacing:.08em;text-transform:uppercase;font-size:.74rem;color:#cfe3d7}
  .previewbar a{color:#fff;text-decoration:underline;text-underline-offset:3px;font-weight:600}
  /* Nav */
  header.site{position:sticky;top:0;z-index:50;background:color-mix(in srgb, var(--bg) 92%, transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
  .nav{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0}
  .brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
  .brand-logo{width:48px;height:48px;flex:0 0 48px;display:block}
  .brand-logo svg{width:100%;height:100%;display:block}
  .lg-bg{fill:var(--btn)}
  .lg-fg{fill:var(--btn-ink)}
  .lg-roof{stroke:var(--gold)}
  .lg-bg-f{fill:#e9f2ec}
  .lg-fg-f{fill:#123c2f}
  .lg-roof-f{stroke:#d9b45f}
  .brand b{display:block;font-size:1.02rem;line-height:1.15}
  .brand > span:last-child span{display:block;font-size:.78rem;color:var(--muted);line-height:1.2}
  .navlinks{display:flex;gap:17px;align-items:center}
  .navlinks a{text-decoration:none;font-weight:600;font-size:.94rem;color:var(--muted);white-space:nowrap}
  .navlinks a:hover{color:var(--ink)}
  .nav-cta{display:flex;gap:10px;align-items:center}
  .phone-link{display:inline-flex;gap:8px;align-items:center;text-decoration:none;font-weight:700;font-size:.95rem}
  .phone-link svg{width:18px;height:18px}
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--btn);color:var(--btn-ink);border:1px solid var(--btn);padding:12px 20px;border-radius:999px;font-weight:700;text-decoration:none;cursor:pointer;font-size:.98rem;transition:transform .15s ease, opacity .15s ease}
  .btn:hover{opacity:.92}
  .btn svg{width:18px;height:18px}
  .btn.secondary{background:transparent;color:var(--ink);border-color:var(--line-strong)}
  .btn.gold{background:var(--gold);border-color:var(--gold);color:#fff}
  @media (prefers-color-scheme: dark){ .btn.gold{color:#1c1808} }
  .menu-btn{display:none;background:var(--surface);border:1px solid var(--line);border-radius:10px;width:44px;height:44px;place-items:center;cursor:pointer;color:var(--ink)}
  .menu-btn svg{width:22px;height:22px}
  .mobile-menu{display:none;border-top:1px solid var(--line);padding:14px 0 18px}
  .mobile-menu.open{display:block}
  .mobile-menu a{display:block;padding:10px 2px;text-decoration:none;font-weight:600;border-bottom:1px solid var(--line)}
  .mobile-menu a:last-child{border-bottom:0}
  /* Hero */
  .hero{padding:54px 0 42px}
  .hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:44px;align-items:center}
  .kicker{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--green-2);margin-bottom:18px}
  .kicker::before{content:"";width:28px;height:2px;background:var(--gold);display:inline-block}
  .hero h1 em{font-style:italic;color:var(--green-2)}
  .lede{font-size:1.16rem;color:var(--muted);margin:20px 0 26px;max-width:34rem}
  .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:28px}
  .proof{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border-top:1px solid var(--line);padding-top:20px;max-width:36rem}
  .proof b{display:block;font-family:"Lora",serif;font-size:1.28rem;line-height:1.1}
  .proof span{font-size:.86rem;color:var(--muted);line-height:1.35;display:block;margin-top:4px}
  .hero-media{position:relative}
  .hero-media img.main{width:100%;height:520px;object-fit:cover;border-radius:22px;box-shadow:var(--shadow)}
  .hero-card{position:absolute;left:18px;bottom:18px;right:18px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 18px;display:flex;gap:14px;align-items:flex-start;box-shadow:var(--shadow)}
  .hero-card .icon{width:42px;height:42px;flex:0 0 42px;border-radius:12px;background:var(--green-soft);color:var(--green-2);display:grid;place-items:center}
  .hero-card .icon svg{width:21px;height:21px}
  .hero-card b{display:block;line-height:1.3}
  .hero-card p{font-size:.92rem;color:var(--muted);line-height:1.45}
  /* Sections */
  section.block{padding:64px 0}
  section.tint{background:var(--surface-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .section-head{max-width:44rem;margin-bottom:32px}
  .section-head.center{margin-left:auto;margin-right:auto;text-align:center}
  .section-head.center .kicker{justify-content:center}
  .section-head p{color:var(--muted);margin-top:12px;font-size:1.05rem}
  /* Who we help */
  .help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  .help-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
  .help-card .icon{width:46px;height:46px;border-radius:12px;background:var(--gold-soft);color:var(--gold);display:grid;place-items:center;margin-bottom:16px}
  .help-card .icon svg{width:22px;height:22px}
  .help-card h3{margin-bottom:8px}
  .help-card p{color:var(--muted);font-size:.96rem}
  .help-note{margin-top:22px;background:var(--green);color:#eef6f1;border-radius:var(--radius);padding:24px 26px;display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap}
  @media (prefers-color-scheme: dark){ .help-note{background:#1e332a;color:var(--ink)} }
  .help-note h3{font-size:1.35rem;max-width:32rem}
  .help-note p{opacity:.85;margin-top:5px;max-width:32rem}
  /* Steps */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:step}
  .step{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;position:relative}
  .step-num{font-family:"Lora",serif;font-size:2.6rem;line-height:1;color:var(--gold);font-weight:700}
  .step h3{margin:14px 0 8px}
  .step p{color:var(--muted);font-size:.97rem}
  .step .tag{display:inline-block;margin-top:16px;font-size:.82rem;font-weight:700;background:var(--green-soft);color:var(--green-2);padding:6px 10px;border-radius:999px}
  /* Calculator + About split */
  .split{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
  .about-photo{border-radius:22px;width:100%;height:380px;object-fit:cover;box-shadow:var(--shadow)}
  .about-copy p{color:var(--muted);margin-top:14px}
  .about-copy p strong{color:var(--ink)}
  .values{margin-top:22px;display:grid;gap:12px}
  .value{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
  .value svg{width:20px;height:20px;color:var(--green-2);flex:0 0 20px;margin-top:3px}
  .value b{display:block;line-height:1.3}
  .value span{color:var(--muted);font-size:.92rem}
  .calc{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:var(--shadow)}
  .calc h3{font-size:1.45rem;margin-bottom:6px}
  .calc > p{color:var(--muted);font-size:.95rem;margin-bottom:20px}
  label.field{display:block;font-weight:700;font-size:.9rem;margin-bottom:14px}
  label.field span{display:flex;justify-content:space-between;gap:12px;margin-bottom:7px}
  label.field output{font-family:"Lora",serif;font-size:1.05rem;color:var(--green-2)}
  input[type=range]{width:100%;accent-color:var(--green-2)}
  input[type=number],input[type=text],input[type=email],input[type=tel],select,textarea{width:100%;padding:12px 13px;border:1px solid var(--line-strong);border-radius:11px;background:var(--bg);color:var(--ink);font:inherit;font-size:.98rem}
  input:focus,select:focus,textarea:focus{outline:2px solid var(--green-2);outline-offset:1px;border-color:transparent}
  .term-toggle{display:flex;gap:8px;margin:6px 0 18px}
  .term-toggle button{flex:1;padding:10px;border-radius:999px;border:1px solid var(--line-strong);background:transparent;color:var(--ink);font-weight:700;cursor:pointer;font:inherit;font-size:.92rem}
  .term-toggle button[aria-pressed=true]{background:var(--btn);color:var(--btn-ink);border-color:var(--btn)}
  .calc-results{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .result{background:var(--surface-2);border-radius:14px;padding:15px}
  .result small{display:block;color:var(--muted);font-weight:700;font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;line-height:1.35}
  .result b{display:block;font-family:"Lora",serif;font-size:1.45rem;margin-top:5px;line-height:1.1}
  .result p{font-size:.85rem;color:var(--muted);margin-top:4px;line-height:1.4}
  .calc-foot{font-size:.84rem;color:var(--faint);margin-top:16px;line-height:1.5}
  /* FAQ */
  .faq-list{max-width:820px;margin:0 auto;display:grid;gap:12px}
  .faq{background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden}
  .faq button{width:100%;text-align:left;background:none;border:0;color:var(--ink);font:inherit;font-weight:700;padding:20px 22px;display:flex;justify-content:space-between;gap:16px;align-items:center;cursor:pointer}
  .faq button svg{width:20px;height:20px;flex:0 0 20px;color:var(--muted);transition:transform .2s ease}
  .faq.open button svg{transform:rotate(45deg)}
  .faq-body{display:none;padding:0 22px 20px;color:var(--muted)}
  .faq.open .faq-body{display:block}
  .faq-body p + p{margin-top:10px}
  /* Apply */
  .apply-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:start}
  .contact-list{display:grid;gap:14px;margin-top:24px}
  .contact-item{display:flex;gap:13px;align-items:flex-start}
  .contact-item .icon{width:42px;height:42px;flex:0 0 42px;border-radius:12px;background:var(--green-soft);color:var(--green-2);display:grid;place-items:center}
  .contact-item .icon svg{width:20px;height:20px}
  .contact-item b{display:block}
  .contact-item a{text-decoration:none;font-weight:600}
  .contact-item a:hover{text-decoration:underline}
  .contact-item span{color:var(--muted);font-size:.92rem;display:block}
  form.apply{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:var(--shadow)}
  form.apply h3{font-size:1.4rem;margin-bottom:6px}
  form.apply > p{color:var(--muted);font-size:.94rem;margin-bottom:20px}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .form-grid .full{grid-column:1/-1}
  form.apply label{font-weight:700;font-size:.88rem;display:block}
  form.apply label input,form.apply label select,form.apply label textarea{margin-top:6px;font-weight:400}
  textarea{resize:vertical;min-height:96px}
  .form-status{display:none;margin-top:14px;background:var(--green-soft);color:var(--ink);border-radius:12px;padding:13px 15px;font-size:.92rem}
  .form-status.show{display:block}
  .form-status a{font-weight:700}
  /* What changed */
  .changes{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
  .change{display:flex;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px}
  .change svg{width:22px;height:22px;color:var(--green-2);flex:0 0 22px;margin-top:2px}
  .change b{display:block;margin-bottom:4px}
  .change p{color:var(--muted);font-size:.94rem}
  /* Footer */
  footer{background:#0c231b;color:#dcebe1;margin-top:0}
  @media (prefers-color-scheme: dark){ footer{background:#0a0f0d} }
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;padding:46px 0 34px}
  .footer-brand{display:flex;align-items:center;gap:11px;margin-bottom:14px}
  .footer-brand svg{width:40px;height:40px;flex:0 0 40px;display:block}
  .footer-brand h4{margin:0}
  .footer-brand .tagline{display:block;font-size:.78rem;color:#a9c6b4;line-height:1.25;margin-top:3px;letter-spacing:.02em}
  footer h4{margin:0 0 12px;font-size:.85rem;letter-spacing:.09em;text-transform:uppercase;color:#a9c6b4}
  footer a{color:#dcebe1;text-decoration:none}
  footer a:hover{text-decoration:underline}
  footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
  footer p{color:#b9cec0;font-size:.95rem;max-width:26rem}
  .footer-bottom{border-top:1px solid rgba(255,255,255,.14);padding:18px 0 24px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.88rem;color:#a9c6b4}

  /* Multi-view pages */
  .navlinks a.is-current{text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:7px}
  .mobile-menu a.is-current{text-decoration:underline;text-decoration-color:var(--gold);text-decoration-thickness:3px;text-underline-offset:6px}
  section[id], #calculator, #investor-how, #investor-apply, #wholesale-how, #wholesale-apply{scroll-margin-top:92px}
  .page-hero{padding:54px 0 42px}
  .disclaimer{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px 22px;color:var(--muted);font-size:.94rem;line-height:1.6}
  .disclaimer b{color:var(--ink);display:block;margin-bottom:6px;font-size:.98rem}
  .criteria-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .criteria-item{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px}
  .criteria-item svg{width:20px;height:20px;color:var(--green-2);flex:0 0 20px;margin-top:3px}
  .criteria-item b{display:block;line-height:1.3}
  .criteria-item span{color:var(--muted);font-size:.92rem}
  .audience-strip{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .audience-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px;display:flex;flex-direction:column;gap:10px}
  .audience-card .icon{width:46px;height:46px;border-radius:12px;background:var(--green-soft);color:var(--green-2);display:grid;place-items:center}
  .audience-card .icon svg{width:22px;height:22px}
  .audience-card p{color:var(--muted);font-size:.96rem;flex:1}
  .audience-card a{font-weight:700;text-decoration:none;color:var(--green-2);display:inline-flex;gap:8px;align-items:center}
  .audience-card a svg{width:18px;height:18px}
  .audience-card a:hover{text-decoration:underline}
  @media (max-width:640px){ .criteria-list,.audience-strip{grid-template-columns:1fr} .page-hero{padding:36px 0 28px} }
  @media (min-width:961px){
    header.site .wrap{max-width:1340px}
    .brand{flex:0 0 auto}
    .brand b{white-space:nowrap}
    .brand > span:last-child span{white-space:nowrap}
    .nav-cta{flex:0 0 auto}
    .phone-link{white-space:nowrap}
    .nav-cta .btn{white-space:nowrap}
  }
  .sticky-apply{display:none}
  @media (max-width: 960px){
    .hero-grid,.split,.apply-grid{grid-template-columns:1fr}
    .help-grid,.steps{grid-template-columns:1fr 1fr}
    .hero-media img.main{height:420px}
    .navlinks{display:none}
    .menu-btn{display:grid}
    .phone-link span{display:none}
  }
  @media (max-width: 640px){
    body{font-size:16px}
    .nav-cta .btn{display:none}
    .nav{gap:10px}
    .brand{gap:9px}
    .brand-logo{width:42px;height:42px;flex-basis:42px}
    .brand b{font-size:.92rem}
    .brand > span:last-child span{font-size:.72rem}
    .help-grid,.steps,.changes,.footer-grid,.form-grid,.calc-results{grid-template-columns:1fr}
    .proof{grid-template-columns:1fr 1fr 1fr;gap:10px}
    .proof b{font-size:1.05rem}
    .proof span{font-size:.78rem}
    section.block{padding:48px 0}
    .hero{padding:36px 0 28px}
    .hero-media img.main{height:340px}
    .hero-card{position:static;margin-top:12px}
    .sticky-apply{display:flex;position:fixed;left:14px;right:14px;bottom:14px;z-index:60;box-shadow:var(--shadow)}
    body{padding-bottom:76px}
    .previewbar .wrap{justify-content:flex-start}
  }

/* ============================================================
   WordPress / Contact Form 7 adaptations (added for the port)
   The preview styled a hand-written <form class="apply">; in
   WordPress the same card is a <div class="apply"> wrapping the
   Contact Form 7 output, so the card + field styles are
   mirrored/extended for that markup here.
   ============================================================ */
div.apply{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:26px;box-shadow:var(--shadow)}
div.apply .wpcf7 form{margin:0}
div.apply .wpcf7 p{margin:0 0 14px;font-weight:700;font-size:.88rem}
div.apply .wpcf7 label{font-weight:700;font-size:.88rem;display:block}
div.apply .wpcf7 input[type=text],div.apply .wpcf7 input[type=email],div.apply .wpcf7 input[type=tel],
div.apply .wpcf7 input[type=number],div.apply .wpcf7 select,div.apply .wpcf7 textarea{margin-top:6px;font-weight:400}
div.apply .wpcf7 input[type=submit]{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--btn);color:var(--btn-ink);border:1px solid var(--btn);padding:12px 20px;border-radius:999px;font-weight:700;cursor:pointer;font-size:.98rem;width:100%;margin-top:6px}
div.apply .wpcf7 input[type=submit]:hover{opacity:.92}
div.apply .wpcf7 .wpcf7-response-output{margin:14px 0 0;border-radius:12px;padding:13px 15px;font-size:.92rem;font-weight:400}
div.apply .wpcf7 .wpcf7-not-valid-tip{font-weight:400;font-size:.85rem;margin-top:4px}
/* Keep the sticky site header clear of the WordPress admin bar when logged in */
body.admin-bar header.site{top:32px}
@media (max-width:782px){ body.admin-bar header.site{top:46px} }