/* Fieldstone Bookkeeping — site styles */
:root{
  --navy:#1F3350;
  --navy-deep:#152435;
  --sage:#9CAF88;
  --sage-deep:#7C9468;
  --ink:#232323;
  --grey:#6b6b66;
  --cream:#FAF7F1;
  --cream-2:#F1ECE1;
  --line:#E4DECF;
  --radius:14px;
  --shadow:0 12px 30px -12px rgba(31,51,80,0.18);
  --shadow-sm:0 4px 14px -6px rgba(31,51,80,0.15);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Work Sans', -apple-system, sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Fraunces', Georgia, serif;
  font-weight:600;
  color:var(--navy);
  letter-spacing:-0.01em;
  margin:0 0 0.4em;
}
h1{font-size:clamp(2.4rem,5vw,3.6rem); line-height:1.05; font-weight:560;}
h2{font-size:clamp(1.7rem,3vw,2.3rem); line-height:1.15;}
h3{font-size:1.25rem; line-height:1.3;}
p{margin:0 0 1em;}
a{color:var(--navy); text-decoration:none;}
.container{max-width:1120px; margin:0 auto; padding:0 28px;}
img{max-width:100%; display:block;}

/* texture backdrop */
.grain-bg{
  position:relative;
  background:
    radial-gradient(ellipse 900px 500px at 15% -10%, rgba(156,175,136,0.16), transparent 60%),
    radial-gradient(ellipse 700px 500px at 110% 10%, rgba(31,51,80,0.07), transparent 60%),
    var(--cream);
}

/* header */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(250,247,241,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  padding-top:14px; padding-bottom:14px;
}
.brand-mark img{height:38px; width:auto;}
nav.main-nav{display:flex; align-items:center; gap:2.2rem;}
nav.main-nav a{
  font-size:0.95rem; font-weight:500; color:var(--navy);
  position:relative; padding:4px 0;
}
nav.main-nav a::after{
  content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px;
  background:var(--sage); transition:width .25s ease;
}
nav.main-nav a:hover::after{width:100%;}
.btn{
  display:inline-flex; align-items:center; gap:.5em;
  font-family:'Work Sans',sans-serif; font-weight:600; font-size:.95rem;
  padding:.85em 1.6em; border-radius:999px; cursor:pointer; border:2px solid transparent;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.btn-primary{background:var(--navy); color:#fff; box-shadow:var(--shadow-sm);}
.btn-primary:hover{background:var(--navy-deep); transform:translateY(-2px); box-shadow:var(--shadow);}
.btn-outline{background:transparent; color:var(--navy); border-color:var(--navy);}
.btn-outline:hover{background:var(--navy); color:#fff; transform:translateY(-2px);}
.btn-sage{background:var(--sage); color:var(--navy-deep); box-shadow:var(--shadow-sm);}
.btn-sage:hover{background:var(--sage-deep); transform:translateY(-2px); color:#fff;}
.nav-toggle{display:none;}

/* hero */
.hero{padding:90px 0 70px; position:relative; overflow:hidden;}
.hero .container{display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center;}
.eyebrow{
  display:inline-flex; align-items:center; gap:.5em;
  font-size:.78rem; text-transform:uppercase; letter-spacing:.12em; font-weight:700;
  color:var(--sage-deep); background:rgba(156,175,136,0.16);
  padding:.45em 1em; border-radius:999px; margin-bottom:1.2em;
}
.eyebrow::before{content:"●"; font-size:.6em; color:var(--sage-deep);}
.hero p.lede{font-size:1.15rem; color:var(--grey); max-width:46ch;}
.hero-actions{display:flex; gap:1em; margin-top:1.8em; flex-wrap:wrap;}
.hero-art{
  position:relative; border-radius:22px; background:var(--navy);
  aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow); overflow:hidden;
}
.hero-art::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 30% 20%, rgba(156,175,136,0.35), transparent 55%),
    repeating-linear-gradient(135deg, rgba(255,255,255,0.035) 0 2px, transparent 2px 26px);
}
.hero-art img{width:58%; position:relative; z-index:1; filter:drop-shadow(0 20px 30px rgba(0,0,0,.35));}
.stone-row{display:flex; gap:10px; margin-top:2.2em;}
.stone-row span{
  width:10px; height:10px; border-radius:3px; background:var(--sage); opacity:.55;
}
.stone-row span:nth-child(2){opacity:.8;}
.stone-row span:nth-child(3){opacity:1; background:var(--navy);}

/* section generic */
section{padding:76px 0;}
.section-head{max-width:640px; margin:0 auto 46px; text-align:center;}
.section-head .eyebrow{display:inline-flex;}
.divider{width:56px; height:3px; background:var(--sage); margin:0 auto 22px; border-radius:2px;}

/* trust strip */
.trust-strip{background:var(--navy); color:#fff; padding:34px 0;}
.trust-strip .container{
  display:flex; flex-wrap:wrap; gap:2.2rem; justify-content:space-between; align-items:center;
}
.trust-strip .item{display:flex; align-items:center; gap:.7em; font-size:.95rem; color:#EAF0E6;}
.trust-strip .item b{color:#fff;}

/* cards */
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:26px;}
.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:34px 28px; box-shadow:var(--shadow-sm); transition:transform .2s ease, box-shadow .2s ease;
}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
.card .icon-tile{
  width:46px; height:46px; border-radius:12px; background:rgba(156,175,136,0.18);
  display:flex; align-items:center; justify-content:center; margin-bottom:1.1em;
  color:var(--sage-deep); font-size:1.3rem;
}
.card h3{margin-bottom:.5em;}
.card p{color:var(--grey); font-size:.98rem; margin-bottom:0;}

/* pricing */
.tier{
  background:#fff; border-radius:var(--radius); border:1px solid var(--line);
  padding:38px 30px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column;
  position:relative;
}
.tier.featured{border:2px solid var(--sage); box-shadow:var(--shadow);}
.tier.featured .badge{
  position:absolute; top:-14px; left:30px; background:var(--sage); color:var(--navy-deep);
  font-size:.75rem; font-weight:700; padding:.35em .9em; border-radius:999px; letter-spacing:.03em;
}
.tier h3{margin-bottom:.2em;}
.tier .tagline{color:var(--grey); font-size:.92rem; margin-bottom:1.4em;}
.tier ul{list-style:none; margin:0 0 1.8em; padding:0; flex:1;}
.tier li{
  display:flex; gap:.7em; align-items:flex-start; font-size:.94rem; color:var(--ink);
  margin-bottom:.8em;
}
.tier li::before{content:"✓"; color:var(--sage-deep); font-weight:700; flex-shrink:0;}

/* checklist / lead magnet */
.checklist-hero{
  background:var(--navy); color:#fff; position:relative; overflow:hidden; padding:100px 0;
}
.checklist-hero::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse 700px 500px at 85% 0%, rgba(156,175,136,0.25), transparent 60%);
}
.checklist-hero .container{position:relative; display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center;}
.checklist-hero .eyebrow{background:rgba(156,175,136,0.22); color:#D8E5CC;}
.checklist-hero .eyebrow::before{color:#D8E5CC;}
.checklist-hero p.lede{color:#C9D3DE;}
.form-card{
  background:#fff; border-radius:18px; padding:34px; box-shadow:0 30px 60px -20px rgba(0,0,0,.4);
  color:var(--ink);
}
.form-card h3{margin-bottom:.3em;}
.form-card p.sub{color:var(--grey); font-size:.92rem; margin-bottom:1.4em;}
.field{margin-bottom:1em;}
.field label{display:block; font-size:.85rem; font-weight:600; color:var(--navy); margin-bottom:.4em;}
.field input{
  width:100%; padding:.85em 1em; border-radius:10px; border:1.5px solid var(--line);
  font-family:inherit; font-size:.98rem; background:var(--cream); transition:border-color .2s ease;
}
.field input:focus{outline:none; border-color:var(--sage-deep);}
.form-note{font-size:.78rem; color:var(--grey); margin-top:.9em;}
.checklist-preview-list{list-style:none; margin:1.6em 0 0; padding:0;}
.checklist-preview-list li{
  display:flex; gap:.8em; align-items:flex-start; margin-bottom:.9em; color:#DCE4E0; font-size:.95rem;
}
.checklist-preview-list li span.n{
  background:var(--sage); color:var(--navy-deep); font-weight:700; font-size:.78rem;
  width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  flex-shrink:0; margin-top:2px;
}

/* thank you */
.thankyou{padding:130px 0; text-align:center;}
.thankyou .check-badge{
  width:76px; height:76px; border-radius:50%; background:var(--sage); color:var(--navy-deep);
  display:flex; align-items:center; justify-content:center; font-size:2.2rem; margin:0 auto 24px;
  box-shadow:var(--shadow);
}

/* about / story block */
.story{background:var(--cream-2);}
.story .container{display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:center;}
.story-art{
  background:var(--navy); border-radius:22px; aspect-ratio:4/5; position:relative; overflow:hidden;
  box-shadow:var(--shadow);
}
.story-art::before{
  content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(0deg, rgba(156,175,136,0.12) 0 8px, transparent 8px 40px);
}
.story-art img{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:52%;
  filter:drop-shadow(0 18px 26px rgba(0,0,0,.35));
}

/* contact */
.contact-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:flex-start;}
.contact-info .item{display:flex; gap:1em; align-items:flex-start; margin-bottom:1.6em;}
.contact-info .item .tile{
  width:42px; height:42px; border-radius:11px; background:rgba(31,51,80,0.08);
  display:flex; align-items:center; justify-content:center; color:var(--navy); flex-shrink:0;
}
.contact-info .item h4{margin:0 0 .2em; font-size:1rem; color:var(--navy); font-family:'Work Sans',sans-serif; font-weight:700;}
.contact-info .item p{margin:0; color:var(--grey); font-size:.95rem;}

/* CTA band */
.cta-band{
  background:var(--navy); border-radius:24px; padding:56px 46px; text-align:center; color:#fff;
  position:relative; overflow:hidden; margin:0 auto;
}
.cta-band::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse 600px 400px at 20% 0%, rgba(156,175,136,0.3), transparent 60%);
}
.cta-band > *{position:relative;}
.cta-band h2{color:#fff;}
.cta-band p{color:#C9D3DE; max-width:52ch; margin:0 auto 1.6em;}

/* footer */
footer.site-footer{background:var(--navy-deep); color:#B9C2CC; padding:56px 0 30px;}
footer.site-footer .container{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:40px;}
footer.site-footer img{height:30px; margin-bottom:14px;}
footer.site-footer h4{color:#fff; font-size:.9rem; font-weight:700; margin-bottom:1em; font-family:'Work Sans',sans-serif;}
footer.site-footer ul{list-style:none; margin:0; padding:0;}
footer.site-footer li{margin-bottom:.7em; font-size:.92rem;}
footer.site-footer a{color:#B9C2CC;}
footer.site-footer a:hover{color:#fff;}
.footer-bottom{
  max-width:1120px; margin:36px auto 0; padding:22px 28px 0; border-top:1px solid rgba(255,255,255,.1);
  font-size:.8rem; color:#8792A0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}

/* responsive */
@media (max-width:880px){
  .hero .container, .story .container, .checklist-hero .container, .contact-grid{
    grid-template-columns:1fr; gap:38px;
  }
  .grid-3{grid-template-columns:1fr;}
  .grid-2{grid-template-columns:1fr;}
  footer.site-footer .container{grid-template-columns:1fr; gap:26px;}
  nav.main-nav{display:none;}
  .hero-art, .story-art{max-width:340px; margin:0 auto;}
}