/* Haven Media Solutions — site stylesheet (self-contained; tokens inlined) */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&family=Mulish:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

:root{
  --green-50:#f1f7e9;--green-100:#e0efcb;--green-200:#c8e29f;--green-300:#b0d060;--green-400:#93c13f;--green-500:#70b030;--green-600:#5c9a28;--green-700:#4a7d20;--green-800:#3a6119;--green-900:#2b4813;
  --neutral-0:#ffffff;--neutral-50:#f7f8f9;--neutral-100:#eef0f2;--neutral-200:#dde1e5;--neutral-300:#c3c9cf;--neutral-400:#9ba2ab;--neutral-500:#808891;--neutral-600:#5e656e;--neutral-700:#454b52;--neutral-800:#33383d;--neutral-900:#23262a;--ink:#3a3a3a;
  --info-500:#2e7cd6;--warning-500:#e8a33d;--danger-500:#d9534f;
  --primary:var(--green-500);--primary-hover:var(--green-600);--primary-active:var(--green-700);--primary-subtle:var(--green-50);--accent:var(--green-300);
  --text-heading:var(--neutral-900);--text-body:var(--neutral-700);--text-muted:var(--neutral-500);--text-link:var(--green-600);--text-link-hover:var(--green-700);
  --surface:var(--neutral-0);--surface-subtle:var(--neutral-50);--surface-muted:var(--neutral-100);--surface-inverse:var(--neutral-900);
  --border:var(--neutral-200);--border-strong:var(--neutral-300);--ring:rgba(112,176,48,0.4);
  --font-display:'Jost','Segoe UI',system-ui,sans-serif;--font-body:'Mulish','Segoe UI',system-ui,sans-serif;
  --fw-light:300;--fw-regular:400;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--fw-extrabold:800;
  --text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-md:1.125rem;--text-lg:1.375rem;--text-xl:1.75rem;--text-2xl:2.25rem;--text-3xl:3rem;--text-4xl:3.75rem;--text-5xl:4.75rem;
  --leading-relaxed:1.7;--tracking-tight:-0.02em;--tracking-caps:0.12em;
  --radius-xs:4px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-pill:999px;
  --shadow-xs:0 1px 2px rgba(35,38,42,.06);--shadow-sm:0 2px 6px rgba(35,38,42,.08);--shadow-md:0 8px 24px rgba(35,38,42,.10);--shadow-lg:0 18px 48px rgba(35,38,42,.14);--shadow-green:0 12px 28px rgba(112,176,48,.30);
  --container-md:880px;--container-lg:1120px;--container-xl:1280px;--gutter:clamp(1.25rem,4vw,3rem);
  --ease-out:cubic-bezier(0.16,1,0.3,1);--ease-standard:cubic-bezier(0.4,0,0.2,1);--dur-fast:140ms;--dur-base:220ms;--dur-slow:380ms;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-body);color:var(--text-body);background:var(--surface);line-height:var(--leading-relaxed);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:var(--text-link);text-decoration:none}
a:hover{color:var(--text-link-hover)}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--fw-medium);letter-spacing:var(--tracking-tight);color:var(--text-heading);line-height:1.08;margin:0}
p{margin:0}
.container{max-width:var(--container-xl);margin:0 auto;padding-inline:var(--gutter)}
.container-md{max-width:var(--container-md);margin:0 auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(3.5rem,6vw,5.5rem)}
.eyebrow{font-family:var(--font-body);font-weight:var(--fw-bold);font-size:var(--text-sm);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--primary)}
.lede{font-size:var(--text-md);line-height:var(--leading-relaxed);color:var(--text-muted)}
.text-center{text-align:center}
.muted{color:var(--text-muted)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--font-body);font-weight:var(--fw-semibold);font-size:var(--text-base);line-height:1;padding:.7rem 1.3rem;border-radius:var(--radius-sm);border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:transform var(--dur-fast) var(--ease-standard),box-shadow var(--dur-base),background var(--dur-base),color var(--dur-base)}
.btn-lg{padding:.95rem 1.8rem;font-size:var(--text-md)}
.btn-sm{padding:.5rem .9rem;font-size:var(--text-sm)}
.btn-pill{border-radius:var(--radius-pill)}
.btn-primary{background:var(--primary);color:#fff;box-shadow:var(--shadow-green)}
.btn-primary:hover{background:var(--primary-hover);color:#fff;transform:translateY(-1px);box-shadow:var(--shadow-lg)}
.btn-primary:active{transform:scale(.985)}
.btn-secondary{background:var(--surface);color:var(--text-heading);border-color:var(--border-strong);box-shadow:var(--shadow-xs)}
.btn-secondary:hover{background:var(--surface-subtle);color:var(--text-heading);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--primary-hover)}
.btn-ghost:hover{background:var(--primary-subtle);color:var(--primary-hover)}
.btn-white{background:#fff;color:var(--green-700)}
.btn-white:hover{background:var(--green-50);color:var(--green-700);transform:translateY(-1px)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;padding-block:.85rem}
.site-header .logo{height:32px}
.nav{display:flex;align-items:center;gap:1.8rem;font-size:var(--text-sm);font-weight:var(--fw-semibold)}
.nav a{color:var(--text-heading)}
.nav a:hover{color:var(--primary-hover)}
.has-dropdown{position:relative}
.has-dropdown>button{background:none;border:none;font:inherit;font-weight:var(--fw-semibold);color:var(--text-heading);cursor:pointer;display:inline-flex;align-items:center;gap:5px;padding:0}
.has-dropdown>button:hover{color:var(--primary-hover)}
.dropdown{position:absolute;top:100%;left:50%;transform:translateX(-50%);padding-top:14px;opacity:0;visibility:hidden;transition:opacity var(--dur-base)}
.has-dropdown:hover .dropdown,.has-dropdown.open .dropdown{opacity:1;visibility:visible}
.dropdown-inner{background:#fff;border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:8px;min-width:260px}
.dropdown-inner a{display:block;padding:.6rem .8rem;border-radius:var(--radius-sm);color:var(--text-body);font-weight:var(--fw-medium)}
.dropdown-inner a:hover{background:var(--green-50);color:var(--primary-hover)}
.hamburger{display:none;background:none;border:none;cursor:pointer;padding:6px}
.hamburger span{display:block;width:24px;height:2px;background:var(--text-heading);margin:5px 0;transition:var(--dur-base)}

/* hero */
.hero{position:relative;overflow:hidden}
.hero .glow{position:absolute;top:-160px;right:-140px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(112,176,48,.16),transparent 68%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero h1{font-size:clamp(2.6rem,5vw,var(--text-5xl));line-height:1.03;margin:1rem 0 1.2rem}
.hero .green{color:var(--primary)}
.hero-img{width:100%;aspect-ratio:4/3.4;object-fit:cover;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg)}
.cta-row{display:flex;gap:.9rem;flex-wrap:wrap;align-items:center}
.stat-row{display:flex;gap:2.2rem;margin-top:2.6rem;flex-wrap:wrap}
.stat .num{font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:var(--text-3xl);line-height:1;color:var(--primary)}
.stat .lbl{margin-top:.4rem;font-size:var(--text-sm);color:var(--text-muted)}

/* cards */
.card{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:2rem;transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base)}
.card-link:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.card .icon{width:52px;height:52px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--green-300),var(--green-500));display:flex;align-items:center;justify-content:center;color:#fff;margin-bottom:18px}
.card h3{font-size:var(--text-lg);margin-bottom:.5rem}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem}
.section-head{max-width:720px;margin:0 auto 3rem;text-align:center;display:flex;flex-direction:column;gap:.9rem;align-items:center}

/* feature list */
.feature-list{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem 2rem}
.feature{display:flex;gap:14px;align-items:flex-start}
.feature .check{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--green-50);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:var(--fw-bold)}
.feature h4{font-family:var(--font-display);font-weight:var(--fw-medium);font-size:var(--text-md);margin-bottom:.2rem}
.feature p{font-size:var(--text-sm);color:var(--text-muted);line-height:1.55}

/* process */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:3rem}
.step{text-align:center}
.step .bubble{width:64px;height:64px;border-radius:50%;margin:0 auto 20px;background:var(--green-50);color:var(--primary);display:flex;align-items:center;justify-content:center;position:relative}
.step .n{position:absolute;top:-8px;right:-8px;background:var(--primary);color:#fff;font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:12px;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.step h3{font-size:var(--text-lg);margin-bottom:.6rem}
.step p{font-size:var(--text-base);color:var(--text-muted);max-width:300px;margin:0 auto}

/* accordion */
.acc-item{border:1px solid var(--border);border-radius:var(--radius-md);background:#fff;overflow:hidden;margin-bottom:.75rem}
.acc-q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;text-align:left;padding:1.1rem 1.25rem;background:none;border:none;cursor:pointer;font-family:var(--font-display);font-weight:var(--fw-medium);font-size:var(--text-md);color:var(--text-heading)}
.acc-q .plus{flex-shrink:0;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--green-50);color:var(--primary);font-size:16px;transition:var(--dur-base)}
.acc-item.open .plus{background:var(--primary);color:#fff;transform:rotate(45deg)}
.acc-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--dur-slow) var(--ease-out)}
.acc-item.open .acc-a{grid-template-rows:1fr}
.acc-a>div{overflow:hidden}
.acc-a p{padding:0 1.25rem 1.2rem;color:var(--text-body)}

/* bands */
.band-dark{background:var(--neutral-900);position:relative;overflow:hidden;color:#fff}
.band-dark .glow{position:absolute;bottom:-180px;left:-120px;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(112,176,48,.22),transparent 70%)}
.band-dark h2{color:#fff}
.band-green{background:linear-gradient(150deg,var(--green-400),var(--green-500) 55%,var(--green-600));color:#fff}
.band-green h2{color:#fff}

/* forms */
.form-card{background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:clamp(1.6rem,3vw,2.4rem)}
.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}
.field label{font-size:var(--text-sm);font-weight:var(--fw-semibold);color:var(--text-heading)}
.field .req{color:var(--danger-500)}
.field input,.field textarea,.field select{font-family:var(--font-body);font-size:var(--text-base);color:var(--text-heading);padding:.7rem .9rem;border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:#fff;outline:none;transition:border-color var(--dur-base),box-shadow var(--dur-base);width:100%}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--ring)}
.field textarea{resize:vertical;min-height:120px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form-status{margin-top:1rem;padding:.85rem 1rem;border-radius:var(--radius-sm);font-size:var(--text-sm);display:none}
.form-status.show{display:block}
.form-status.ok{background:var(--green-50);color:var(--green-800)}
.form-status.err{background:#fbebeb;color:var(--danger-500)}
.form-success{text-align:center;padding:1.5rem 0;display:none}
.form-success.show{display:block}
.form-success .circle{width:64px;height:64px;border-radius:50%;background:var(--green-50);color:var(--primary);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;font-size:30px}

/* footer */
.site-footer{background:var(--neutral-900);color:var(--neutral-300)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:2rem;padding-block:clamp(2.5rem,5vw,4rem) 2rem}
.footer-logo{height:34px;margin-bottom:16px}
.footer-col h4{font-family:var(--font-body);font-weight:var(--fw-bold);font-size:var(--text-sm);letter-spacing:var(--tracking-caps);text-transform:uppercase;color:var(--green-300);margin-bottom:14px}
.footer-col a{display:block;color:var(--neutral-300);font-size:var(--text-sm);padding-block:4.5px}
.footer-col a:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding-block:1.2rem;text-align:center;color:var(--neutral-500);font-size:var(--text-xs)}
.footer-contact{color:var(--neutral-300);font-size:var(--text-sm)}
.footer-contact a{color:var(--neutral-300)}

/* utility */
.mt-1{margin-top:1rem}.mt-2{margin-top:2rem}.mb-1{margin-bottom:1rem}
.pill-tag{display:inline-flex;align-items:center;gap:.35rem;font-size:var(--text-xs);font-weight:var(--fw-bold);padding:.3rem .7rem;border-radius:var(--radius-pill);background:var(--green-50);color:var(--green-700)}

@media(max-width:860px){
  .nav{position:fixed;inset:64px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-bottom:1px solid var(--border);padding:1rem var(--gutter);box-shadow:var(--shadow-md);display:none}
  .nav.open{display:flex}
  .nav>a,.has-dropdown>button{padding:.8rem 0;border-bottom:1px solid var(--border)}
  .has-dropdown{position:static}
  .dropdown{position:static;transform:none;padding-top:0;opacity:1;visibility:visible;max-height:0;overflow:hidden;transition:max-height var(--dur-base)}
  .has-dropdown.open .dropdown{max-height:600px}
  .dropdown-inner{border:none;box-shadow:none;padding:0 0 .5rem 1rem;min-width:0}
  .hamburger{display:block}
  .hero-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .feature-list{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
