:root { --ink:#1e1e1e; --muted:#62665e; --line:#dde1d8; --green:#547b17; --green-dark:#3d5b0e; --mist:#f0f3eb; color-scheme:light; font-family:"DM Sans",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; }
html { min-width:320px; background:#fff; color:var(--ink); scroll-behavior:smooth; }
body { min-height:100vh; margin:0; }
[hidden] { display:none !important; }
button,input,textarea { font:inherit; }
a { color:inherit; }
.site-header { position:absolute; z-index:20; top:24px; left:50%; display:flex; width:min(1180px,calc(100% - 48px)); min-height:78px; align-items:center; justify-content:space-between; gap:28px; padding:10px 14px 10px 24px; border:1px solid rgba(255,255,255,.72); border-radius:18px; background:rgba(255,255,255,.9); box-shadow:0 18px 50px rgba(24,32,15,.16); backdrop-filter:blur(18px); transform:translateX(-50%); }
.wordmark { display:block; text-decoration:none; }
.wordmark img { display:block; width:155px; height:55px; object-fit:contain; }
.site-header nav,.site-footer nav { display:flex; align-items:center; gap:clamp(14px,2.4vw,30px); }
.site-header nav a,.site-footer nav a { color:var(--muted); font-size:13px; font-weight:700; text-decoration:none; }
.site-header nav a:hover,.site-footer nav a:hover { color:var(--green); }
.site-header nav .header-cta { min-height:48px; padding:0 22px; border-radius:8px; background:var(--green); color:#fff; display:inline-flex; align-items:center; box-shadow:0 10px 22px rgba(84,123,23,.24); }
.funnel-page { min-height:100vh; padding:134px 20px 78px; overflow:hidden; background:#f6f7f2; }
.funnel,.complete-card { width:min(980px,100%); min-height:650px; margin:0 auto; overflow:hidden; border:1px solid rgba(255,255,255,.6); border-radius:18px; background:rgba(255,255,255,.98); box-shadow:0 35px 90px rgba(18,24,11,.3); }
.progress-header { display:grid; grid-template-columns:36px minmax(0,1fr) 36px; align-items:center; gap:13px; padding:19px 24px; border-bottom:1px solid #edf1f6; }
.back-button { display:grid; width:34px; height:34px; place-items:center; padding:0; border:0; border-radius:50%; background:var(--mist); color:var(--green-dark); font-size:17px; cursor:pointer; }
.back-button:disabled { opacity:0; pointer-events:none; }
.progress-header>div { height:6px; overflow:hidden; border-radius:999px; background:#e7edf4; }
.progress-header>div i { display:block; width:33.333%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--green-dark),#58a7e9); transition:width .3s cubic-bezier(.22,1,.36,1); }
.progress-header>small { color:#8591a0; font-size:10px; font-weight:800; text-align:right; }
.funnel-step { display:grid; justify-items:center; padding:clamp(45px,6vw,68px) clamp(28px,7vw,76px) 62px; animation:step-in .35s cubic-bezier(.22,1,.36,1) both; text-align:center; }
.funnel-step h1 { max-width:650px; margin:12px 0 16px; outline:0; font-size:clamp(39px,5vw,62px); font-weight:850; letter-spacing:-.05em; line-height:1.01; }
.funnel-step>p:not(.kicker) { max-width:540px; margin:0; color:var(--muted); font-size:15px; line-height:1.65; }
.kicker { margin:0; color:var(--green); font-size:11px; font-weight:850; letter-spacing:.17em; text-transform:uppercase; }
.primary-button { display:inline-flex; min-width:240px; min-height:58px; align-items:center; justify-content:center; gap:24px; margin-top:30px; padding:0 28px; border:0; border-radius:999px; background:var(--green); color:#fff; font-size:14px; font-weight:850; text-decoration:none; cursor:pointer; box-shadow:0 14px 30px rgba(84,123,23,.27); transition:transform .15s,background .15s; }
.primary-button:hover { transform:translateY(-2px); background:var(--green-dark); }
.welcome-step { grid-template-columns:minmax(0,1.05fr) minmax(290px,.95fr); gap:clamp(35px,5vw,64px); align-items:center; justify-items:stretch; padding:42px; text-align:left; }
.welcome-copy { display:grid; justify-items:start; }
.welcome-copy h1 { font-size:clamp(42px,5vw,64px); }
.welcome-copy>p:not(.kicker) { max-width:510px; margin:0; color:var(--muted); font-size:15px; line-height:1.65; }
.review-pill { display:inline-flex; align-items:center; gap:10px; margin-bottom:27px; padding:9px 13px; border:1px solid #e4e9f0; border-radius:999px; background:#fff; box-shadow:0 8px 22px rgba(35,49,19,.08); font-size:11px; }
.review-pill span { color:#f6b800; font-size:13px; letter-spacing:.06em; }
.review-pill strong { color:#354257; }
.reassurance { margin-top:16px; color:#8290a2; font-size:10px; }
.welcome-photo { position:relative; height:510px; margin:0; overflow:hidden; border-radius:19px; background:#d6e1ec; box-shadow:0 22px 50px rgba(35,49,19,.18); }
.welcome-photo img { width:100%; height:100%; object-fit:cover; }
.welcome-photo::after { position:absolute; inset:45% 0 0; background:linear-gradient(transparent,rgba(6,28,50,.82)); content:""; }
.welcome-photo figcaption { position:absolute; z-index:1; right:24px; bottom:23px; left:24px; display:grid; gap:4px; color:#fff; }
.welcome-photo figcaption strong { font-size:15px; }
.welcome-photo figcaption span { color:rgba(255,255,255,.82); font-size:10px; line-height:1.5; }
.question-step { padding-top:42px; }
.question-step h1 { font-size:clamp(38px,4.5vw,54px); }
.option-list { display:grid; width:min(650px,100%); grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; margin-top:30px; }
.option-list button { display:grid; min-height:102px; grid-template-columns:76px minmax(0,1fr) auto; align-items:center; gap:15px; padding:10px 15px 10px 10px; overflow:hidden; border:1px solid #dde1d8; border-radius:15px; background:#fbfdff; color:var(--ink); text-align:left; cursor:pointer; transition:border-color .15s,transform .15s,box-shadow .15s; }
.option-list button:hover { transform:translateY(-2px); border-color:#8ea95d; box-shadow:0 12px 28px rgba(50,73,23,.12); }
.option-list button>img { width:76px; height:80px; border-radius:10px; object-fit:cover; }
.option-list button div { display:grid; gap:4px; }
.option-list button strong { font-size:14px; }
.option-list button small { color:#778496; font-size:10px; line-height:1.35; }
.option-list button>i { color:var(--green); font-size:16px; font-style:normal; }
.contact-step { position:relative; justify-items:stretch; padding-top:40px; text-align:left; }
.contact-step>.kicker,.contact-step>h1,.contact-step>p { justify-self:center; text-align:center; }
.contact-step h1 { margin-bottom:12px; font-size:clamp(36px,4vw,50px); }
.contact-photo { height:112px; margin:-40px -76px 32px; overflow:hidden; }
.contact-photo img { width:100%; height:100%; object-fit:cover; object-position:center 62%; filter:saturate(.85); }
.field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:28px; }
.field-grid label { display:grid; gap:7px; color:#3e4d61; font-size:11px; font-weight:750; }
.field-grid label small { color:#939eab; font-weight:500; }
.field-grid input,.field-grid textarea { width:100%; min-width:0; border:1px solid #d7e0ea; border-radius:11px; outline:0; background:#f9fbfd; color:var(--ink); font-size:13px; font-weight:500; transition:border-color .15s,box-shadow .15s,background .15s; }
.field-grid input { height:49px; padding:0 13px; }
.field-grid textarea { padding:12px 13px; resize:vertical; line-height:1.5; }
.field-grid input:focus,.field-grid textarea:focus { border-color:#7f9e4a; background:#fff; box-shadow:0 0 0 4px rgba(84,123,23,.1); }
.field-grid input::placeholder,.field-grid textarea::placeholder { color:#a0aab6; }
.message-field { grid-column:1/-1; }
.consent-list { display:grid; gap:17px; margin-top:24px; padding-top:23px; border-top:1px solid #e5ebf2; }
.consent-list label { display:grid; grid-template-columns:20px minmax(0,1fr); align-items:start; gap:12px; color:#566477; font-size:10.5px; line-height:1.62; cursor:pointer; }
.consent-list input { width:18px; height:18px; margin:1px 0 0; accent-color:var(--green); }
.consent-list strong { color:#2f3d50; }
.submit-button { width:100%; margin-top:27px; }
.form-policies { display:flex; align-items:center; justify-content:center; gap:9px; margin-top:17px; }
.form-policies a { color:#547b17; font-size:12px; text-underline-offset:3px; }
.form-policies span { color:#8d98a5; }
.preview-note { margin-top:12px; color:#969faa; font-size:9px; text-align:center; }
.form-status { min-height:18px; margin:12px 0 0; color:#a52a2a; font-size:11px; font-weight:700; text-align:center; }
.submit-button:disabled { cursor:wait; opacity:.72; transform:none; }
.complete-card { display:grid; grid-template-columns:minmax(280px,.9fr) minmax(320px,1.1fr); align-items:stretch; text-align:center; }
.complete-card>img { width:100%; height:100%; min-height:650px; object-fit:cover; }
.complete-card>div { display:grid; justify-items:center; align-content:center; padding:50px; }
.complete-card>div>span { display:grid; width:64px; height:64px; margin-bottom:25px; place-items:center; border-radius:50%; background:var(--green); color:#fff; font-size:26px; }
.complete-card h1 { margin:12px 0 14px; outline:0; font-size:clamp(40px,5vw,58px); font-weight:850; letter-spacing:-.045em; }
.complete-card p:not(.kicker) { max-width:470px; margin:0; color:var(--muted); line-height:1.65; }
.receipt { margin-top:14px; color:#7a8797; font-size:9px; }
.site-footer { display:grid; grid-template-columns:minmax(240px,1fr) auto; align-items:end; gap:24px; padding:45px clamp(24px,6vw,90px); border-top:1px solid #dfe3da; background:#f5f5f3; }
.site-footer>div { display:grid; gap:5px; }
.site-footer strong { font-size:16px; }
.site-footer span { color:var(--muted); font-size:11px; }
.site-footer>small { grid-column:1/-1; padding-top:18px; border-top:1px solid #dfe3da; color:#818d9b; font-size:9px; }
.policy-page { min-height:70vh; padding-top:102px; }
.policy-page>header { padding:clamp(65px,8vw,104px) clamp(24px,10vw,150px); background:linear-gradient(125deg,#f7f8f4,#e8ede2); }
.policy-page>header h1 { margin:14px 0; font-size:clamp(48px,7vw,82px); font-weight:850; letter-spacing:-.05em; }
.policy-page>header>p:last-child { margin:0; color:var(--muted); font-size:12px; }
.policy-layout { display:grid; width:min(1160px,calc(100% - 40px)); grid-template-columns:220px minmax(0,720px); justify-content:center; gap:clamp(38px,8vw,110px); margin:0 auto; padding:clamp(55px,8vw,100px) 0; }
.policy-layout aside { position:sticky; top:30px; display:grid; height:max-content; gap:12px; padding-left:18px; border-left:2px solid var(--line); }
.policy-layout aside strong { margin-bottom:5px; font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.policy-layout aside a { color:var(--muted); font-size:12px; text-decoration:none; }
.policy-layout article>p { margin:0 0 42px; color:#4f5e70; font-size:19px; line-height:1.7; }
.policy-layout article section { padding:30px 0; border-top:1px solid var(--line); scroll-margin-top:30px; }
.policy-layout article h2 { margin:0 0 13px; font-size:27px; font-weight:800; letter-spacing:-.025em; }
.policy-layout article section p,.policy-layout article li { color:#5c6a7c; font-size:13px; line-height:1.8; }
.policy-layout article section p { margin:0 0 13px; }
.policy-layout article section p:last-child { margin-bottom:0; }
.policy-layout article ul { display:grid; gap:5px; margin:14px 0; padding-left:21px; }
.policy-layout article a { color:var(--green); font-weight:750; text-underline-offset:3px; }
.policy-callout { margin:18px 0; padding:20px 22px; border-left:4px solid var(--green); border-radius:0 12px 12px 0; background:#eff4e7; }
.policy-callout strong { color:#3d5b0e; font-size:13px; }
.policy-callout p { margin-top:6px !important; color:#59644d !important; }
.not-found { display:grid; min-height:100vh; place-items:center; align-content:center; padding:30px; text-align:center; }
.not-found h1 { margin:12px 0; font-size:52px; font-weight:850; }
@keyframes step-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:780px) { .welcome-step { grid-template-columns:1fr; } .welcome-photo { height:310px; } .option-list { grid-template-columns:1fr; } .complete-card { grid-template-columns:1fr; } .complete-card>img { height:280px; min-height:0; } .policy-layout { grid-template-columns:1fr; } .policy-layout aside { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); } .policy-layout aside strong { grid-column:1/-1; } .site-footer { grid-template-columns:1fr; } .site-footer nav { justify-content:flex-start; } .site-footer>small { grid-column:auto; } }
@media (max-width:560px) {
  .site-header { top:10px; width:calc(100% - 20px); min-height:66px; padding:7px 8px 7px 14px; border-radius:14px; } .wordmark img { width:112px; height:45px; } .site-header nav>a:not(.header-cta) { display:none; } .site-header nav .header-cta { min-height:42px; padding:0 15px; font-size:11px; }
  .funnel-page { padding:87px 7px 36px; background-attachment:scroll; } .funnel,.complete-card { min-height:calc(100vh - 100px); border-radius:19px; } .progress-header { padding:14px 15px; }
  .funnel-step { padding:35px 18px 42px; } .welcome-step { gap:28px; padding:22px 18px 35px; } .welcome-copy h1,.funnel-step h1 { font-size:37px; } .welcome-copy>p:not(.kicker),.funnel-step>p:not(.kicker) { font-size:13px; } .review-pill { margin-bottom:22px; } .primary-button { width:100%; } .welcome-photo { height:270px; }
  .question-step { padding-top:27px; } .question-step h1 { font-size:35px; } .option-list { margin-top:24px; } .option-list button { min-height:88px; grid-template-columns:66px minmax(0,1fr) auto; } .option-list button>img { width:66px; height:66px; }
  .contact-step { padding-top:27px; } .contact-photo { height:92px; margin:-27px -18px 26px; } .contact-step h1 { font-size:34px; } .field-grid { grid-template-columns:1fr; margin-top:24px; } .message-field { grid-column:auto; } .consent-list label { font-size:10px; } .complete-card>div { padding:35px 22px; }
  .policy-page { padding-top:77px; } .policy-page>header { padding-inline:20px; } .policy-layout { width:min(100% - 30px,1160px); }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } }

/* Haven's charcoal, olive, and cream visual language follows its public site. */
:root { --ink:#3d4140; --muted:#656a64; --line:#dce1d4; --green:#899d46; --green-dark:#718438; --mist:#f2f5e8; font-family:Arial,Helvetica,sans-serif; }
body { background:#f8f9f6; }
.topline { display:flex; min-height:36px; align-items:center; justify-content:center; gap:28px; padding:7px 18px; background:#3d4140; color:#fff; font-size:11px; letter-spacing:.025em; }
.topline a { color:#fff; font-weight:700; text-decoration:none; }
.site-header { top:36px; width:100%; max-width:none; min-height:82px; padding:12px max(28px,calc((100vw - 1200px)/2)); border:0; border-radius:0; background:#fff; box-shadow:0 1px 0 #e5e8df; backdrop-filter:none; }
.wordmark { display:flex; align-items:center; gap:9px; color:#3d4140; }
.brand-mark { display:block; width:42px; height:42px; color:#3d4140; }
.brand-mark svg { width:100%; height:100%; }
.brand-words { display:grid; gap:0; }
.brand-words strong { font-size:29px; font-weight:800; letter-spacing:-.065em; line-height:.95; }
.brand-words small { margin-top:4px; color:#899d46; font-size:9px; font-weight:800; letter-spacing:.18em; }
.site-header nav .header-cta { border-radius:9px; background:#899d46; box-shadow:none; }
.funnel-page { padding-top:160px; background:radial-gradient(circle at 16% 12%,#f2f4e8 0,transparent 35%),#f8f9f6; }
.funnel,.complete-card { border:1px solid #e1e6da; border-radius:16px; box-shadow:0 28px 70px rgba(44,57,34,.1); }
.progress-header { border-bottom-color:#e6eadf; }
.progress-header>div { background:#e8eddd; }
.progress-header>div i { background:#899d46; }
.funnel-step h1,.complete-card h1,.policy-page h1,.policy-layout h2,.not-found h1 { font-family:Georgia,'Times New Roman',serif; font-weight:700; letter-spacing:-.035em; }
.funnel-step h1 { line-height:1.09; }
.kicker { color:#788b3b; }
.primary-button { border-radius:9px; background:#899d46; box-shadow:0 10px 22px rgba(113,132,56,.2); }
.primary-button:hover { background:#718438; }
.welcome-step { grid-template-columns:minmax(0,1fr) minmax(300px,.96fr); min-height:620px; gap:45px; padding:48px; }
.welcome-copy h1 { max-width:500px; font-size:clamp(43px,4.7vw,66px); }
.welcome-copy>p:not(.kicker) { font-size:16px; }
.reassurance { color:#737d67; font-size:11px; }
.hero-art { position:relative; width:100%; height:480px; overflow:hidden; border-radius:18px; background:linear-gradient(160deg,#ecf0dd,#c8d4aa 68%,#b6c68e); }
.hero-sun { position:absolute; top:56px; right:58px; width:92px; height:92px; border-radius:50%; background:#fff7d8; box-shadow:0 0 65px #fff8d6; }
.hero-hill { position:absolute; width:125%; height:240px; border-radius:50% 50% 0 0; }
.hero-hill-back { right:-45%; bottom:-36px; background:#9fb776; transform:rotate(-8deg); }
.hero-hill-front { left:-35%; bottom:-60px; background:#6f8b55; transform:rotate(10deg); }
.hero-house { position:absolute; left:50%; bottom:110px; width:180px; height:170px; transform:translateX(-50%); filter:drop-shadow(0 15px 12px rgba(47,69,36,.16)); }
.hero-roof { position:absolute; z-index:2; top:6px; left:17px; width:146px; height:146px; border-radius:8px 12px 0 0; background:#485342; transform:rotate(45deg); }
.hero-wall { position:absolute; z-index:3; right:0; bottom:0; left:0; height:120px; border-radius:3px; background:#fcfcf5; }
.hero-door { position:absolute; bottom:0; left:65px; width:50px; height:80px; border-radius:25px 25px 0 0; background:#a6b877; }
.hero-window { position:absolute; top:35px; right:20px; width:24px; height:29px; border:4px solid #9aab80; border-radius:4px; background:#dce8c4; }
.hero-leaf { position:absolute; z-index:4; width:80px; height:30px; border-radius:100% 0 100% 0; background:#547648; transform:rotate(-35deg); }
.leaf-one { left:35px; bottom:117px; }
.leaf-two { right:30px; bottom:90px; transform:rotate(155deg); }
.hero-art p { position:absolute; z-index:5; right:0; bottom:20px; left:0; margin:0; color:#fff; font-family:Georgia,serif; font-size:18px; text-align:center; text-shadow:0 2px 6px rgba(0,0,0,.2); }
.question-step { min-height:620px; }
.option-list button { min-height:108px; grid-template-columns:50px minmax(0,1fr) auto; border-color:#dfe5d8; border-radius:12px; background:#fbfcf8; }
.option-list button:hover { border-color:#899d46; box-shadow:0 10px 25px rgba(75,98,45,.11); }
.option-number { display:grid; width:48px; height:48px; place-items:center; border-radius:10px; background:#edf1df; color:#718438; font-family:Georgia,serif; font-size:18px; }
.option-list button strong { color:#3d4140; }
.option-list button small { color:#737b70; }
.contact-step { min-height:680px; }
.field-grid input,.field-grid textarea { border-color:#dfe5d8; border-radius:8px; background:#fcfdf9; }
.field-grid label { color:#51584d; }
.consent-list label { color:#555d50; }
.preview-note { color:#757e6e; }
.complete-art { display:grid; min-height:650px; place-items:center; background:radial-gradient(circle,#dbe6c2,#7d9c67); }
.complete-art span { display:grid; width:170px; height:170px; place-items:center; border:3px solid rgba(255,255,255,.75); border-radius:50%; color:#fff; font-family:Georgia,serif; font-size:120px; }
.complete-check { display:grid; width:64px; height:64px; margin-bottom:25px; place-items:center; border-radius:50%; background:#899d46; color:#fff; font-size:26px; }
.site-footer { border-top:0; background:#3d4140; }
.site-footer strong,.site-footer a { color:#fff; }
.site-footer span,.site-footer>small { color:#d2d8cc; }
.site-footer nav a { color:#dce4d3; }
.site-footer>small { border-top-color:#5f655e; }
.policy-page { padding-top:82px; }
.policy-page>header { background:linear-gradient(125deg,#f5f7ef,#e8eddb); }
.policy-layout article>p,.policy-layout article section p,.policy-layout article li { color:#555e53; }
.policy-callout { background:#f0f4e5; }
.policy-callout strong { color:#596c2d; }
@media (max-width:780px) { .welcome-step { grid-template-columns:1fr; } .hero-art { height:310px; } .complete-art { min-height:280px; } }
@media (max-width:560px) { .topline { justify-content:space-between; gap:12px; font-size:9px; } .site-header { top:36px; width:100%; min-height:66px; padding:7px 14px; border-radius:0; } .brand-mark { width:32px; height:32px; } .brand-words strong { font-size:23px; } .brand-words small { font-size:7px; } .funnel-page { padding:118px 8px 36px; } .welcome-step { padding:30px 20px 38px; } .hero-art { height:270px; } .hero-house { transform:translateX(-50%) scale(.8); transform-origin:center bottom; } .option-list button { grid-template-columns:48px minmax(0,1fr) auto; } .policy-page { padding-top:66px; } }