/* ============================================================
   Deploy Marketing — mobile-first. Base styles are the phone;
   media queries scale up. Palette: warm off-white, army green,
   charcoal, restrained muted gold.
   ============================================================ */
:root{
  --paper:#fafaf6; --paper2:#f1f0e9; --card:#fff;
  --charcoal:#1c1c1a; --charcoal2:#262623;
  --forest:#3a5a48; --forest-lt:#4d7460; --forest-wash:rgba(58,90,72,.08);
  --gold:#a87f2c; --gold-wash:rgba(168,127,44,.1);
  --ink:#1c1c1a; --ink2:#56564f; --ink3:#8b8b81;
  --line:rgba(28,28,26,.12); --line2:rgba(28,28,26,.06);
  --cream:#f2ede2; --cream2:rgba(242,237,226,.68); --cream3:rgba(242,237,226,.42);
  --dline:rgba(242,237,226,.16);
  --serif:'Fraunces',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --e:cubic-bezier(.16,.7,.2,1); --r:14px; --rl:20px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:78px}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);
  font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;padding-bottom:64px}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-9999px;background:var(--forest);color:#fff;padding:12px 20px;z-index:300}
.skip:focus{left:0;top:0}
:focus-visible{outline:2.5px solid var(--forest);outline-offset:3px;border-radius:3px}

h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.08;letter-spacing:-.02em}
h1{font-size:2.35rem;font-style:italic}
h2{font-size:1.85rem;font-style:italic}
h3{font-size:1.2rem;font-style:normal;letter-spacing:-.01em;line-height:1.3}
h1 em,h2 em{font-style:italic;color:var(--forest)}
.eyebrow{font-family:var(--sans);font-size:.68rem;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold);display:block;margin-bottom:14px}
.lede{font-size:1.02rem;color:var(--ink2);line-height:1.6}
p{margin-bottom:1em}p:last-child{margin-bottom:0}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:16px 26px;border-radius:100px;font-weight:600;font-size:.97rem;
  font-family:var(--sans);cursor:pointer;border:1.5px solid transparent;
  transition:.3s var(--e);text-align:center;width:100%}
.btn+.btn{margin-top:10px}
.btn-g{background:var(--gold);color:#fff}
.btn-g:hover{filter:brightness(1.08)}
.btn-f{background:var(--forest);color:#fff}
.btn-f:hover{background:#2f4b3b}
.btn-o{border-color:var(--line);color:var(--ink)}
.btn-o:hover{border-color:var(--ink)}
.btn-w{border-color:rgba(242,237,226,.35);color:var(--cream)}
.btn-w:hover{background:rgba(242,237,226,.1);border-color:var(--cream)}

[data-rv]{opacity:0;transform:translateY(20px);transition:opacity .8s var(--e),transform .8s var(--e)}
[data-rv].in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  [data-rv]{opacity:1;transform:none;transition:none}}

/* ---------- NAV ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:14px 0;transition:.3s var(--e)}
nav.solid{background:rgba(28,28,26,.95);border-bottom:1px solid var(--dline);padding:10px 0}
nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px}
.logo{font-family:var(--serif);font-style:italic;font-weight:600;font-size:1.12rem;color:var(--cream)}
.logo b{color:var(--forest-lt);font-weight:600}
.navlinks{display:none}
.navcall{font-weight:700;font-size:.92rem;color:var(--gold);white-space:nowrap}
.burger{width:42px;height:38px;border:1px solid var(--dline);border-radius:9px;background:rgba(255,255,255,.05);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;
  position:relative;z-index:120;flex:none}
.burger span{width:17px;height:1.6px;background:var(--cream);border-radius:2px;transition:.28s var(--e)}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}
.scrim{position:fixed;inset:0;background:rgba(28,28,26,.5);opacity:0;pointer-events:none;
  transition:.3s;z-index:95}
.scrim.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(84vw,320px);background:var(--charcoal);
  border-left:1px solid var(--dline);padding:84px 22px 30px;transform:translateX(103%);
  transition:transform .34s var(--e);z-index:110;overflow-y:auto}
.drawer.open{transform:none}
.drawer a{display:block;padding:16px 2px;border-bottom:1px solid var(--dline);color:var(--cream);font-size:1rem}
.drawer a.dtap{color:var(--gold);font-weight:700}
.drawer .btn{margin-top:22px;border-bottom:none}
body.lock{overflow:hidden}

/* ---------- HERO ---------- */
.hero{background:var(--charcoal);color:var(--cream);padding:104px 0 52px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;top:-30%;right:-40%;width:90vw;height:90vw;
  background:radial-gradient(circle,rgba(58,90,72,.4),transparent 66%);border-radius:50%}
.hero .wrap{position:relative}
.tagline{display:inline-flex;align-items:center;gap:8px;font-size:.72rem;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--cream3);margin-bottom:22px}
.tagline i{width:5px;height:5px;border-radius:50%;background:var(--gold);display:block}
.hero h1{color:var(--cream);margin-bottom:20px}
.hero h1 em{color:#8fb89f}
.hero .lede{color:var(--cream2);margin-bottom:28px}
.herodetail{display:none}
@media(min-width:960px){
  .herowrap{display:grid;grid-template-columns:1.45fr .8fr;gap:56px;align-items:end}
  .herodetail{display:block;border-left:1px solid var(--dline);padding-left:26px}
  .herodetail .r{padding:14px 0;border-bottom:1px solid var(--dline)}
  .herodetail .r:last-child{border-bottom:0}
  .herodetail a.rlink{display:block;text-decoration:none;color:inherit}
  .herodetail a.rlink .k{color:var(--gold)}
  .herodetail a.rlink:hover .k{text-decoration:underline}
  .herodetail .k{font-family:var(--serif);font-style:italic;font-size:1.05rem;color:var(--cream)}
  .herodetail .v{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cream3);margin-top:5px}
}
.hero .lede b{color:var(--cream);font-weight:600}
.herocta{margin-bottom:20px}
.underline{font-size:.86rem;color:var(--cream3)}
.underline a{color:var(--cream);border-bottom:1px solid var(--dline);padding-bottom:1px}
.sig{display:inline-flex;align-items:center;gap:13px;margin-top:26px;padding-top:22px;
  border-top:1px solid var(--dline);text-decoration:none;color:inherit}
.sig img{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none;
  border:1px solid rgba(203,161,78,.55)}
.sigtxt{display:flex;flex-direction:column;line-height:1.3}
.sigtxt b{font-size:.94rem;font-weight:700;color:var(--cream)}
.sigtxt i{font-style:normal;font-size:.72rem;letter-spacing:.05em;color:var(--cream3);margin-top:3px}
.sig:hover .sigtxt b{color:var(--gold)}

/* ---------- PROOF STRIP ---------- */
.proof{background:var(--charcoal2);border-top:1px solid var(--dline)}
.proof .g{display:grid;grid-template-columns:1fr 1fr}
.proof .i{padding:20px 16px;border-bottom:1px solid var(--dline);border-right:1px solid var(--dline)}
.proof .i:nth-child(2n){border-right:none}
.proof .i:nth-last-child(-n+2){border-bottom:none}
.proof .k{font-family:var(--serif);font-style:italic;font-size:1.12rem;color:var(--cream);line-height:1.2}
.proof .v{font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--cream3);margin-top:5px}

section{padding:56px 0}
.shead{margin-bottom:32px}
.shead h2{margin-bottom:14px}

/* ---------- SERVICES ---------- */
.svc{display:grid;gap:14px}
.s-card{background:var(--card);border:1px solid var(--line);border-radius:var(--rl);padding:26px 22px}
.s-card.accent{border-color:var(--gold)}
.s-card .n{font-size:.68rem;letter-spacing:.2em;color:var(--ink3);font-weight:700;margin-bottom:12px}
.s-card h3{font-family:var(--serif);font-style:italic;font-size:1.42rem;margin-bottom:10px}
.s-card .sub{color:var(--ink2);font-size:.95rem;margin-bottom:16px}
.s-card ul{list-style:none}
.s-card li{position:relative;padding:7px 0 7px 22px;font-size:.92rem;color:var(--ink2)}
.s-card li::before{content:"";position:absolute;left:1px;top:14px;width:8px;height:4px;
  border-left:1.7px solid var(--forest);border-bottom:1.7px solid var(--forest);transform:rotate(-45deg)}
.s-card .from{margin-top:16px;padding-top:14px;border-top:1px solid var(--line2);
  font-size:.86rem;font-weight:700;color:var(--forest)}
.s-card .from span{color:var(--ink3);font-weight:500}
.s-card .go{display:inline-flex;align-items:center;justify-content:center;width:100%;margin-top:16px;
  padding:14px 18px;border-radius:100px;background:var(--forest);color:#fff;
  font-size:.92rem;font-weight:700;text-decoration:none}
.s-card.accent .go{background:var(--gold);color:#14180f}
.s-card .go:hover{filter:brightness(1.08)}

/* ---------- WORK ---------- */
.work{display:grid;gap:20px}
.proj{border:1px solid var(--line);border-radius:var(--rl);overflow:hidden;background:var(--card);
  transition:.35s var(--e)}
.proj:hover{transform:translateY(-4px);box-shadow:0 20px 46px rgba(28,28,26,.12)}
.proj .shot{aspect-ratio:8/5;overflow:hidden;background:var(--charcoal);border-bottom:1px solid var(--line2)}
.proj .shot img{width:100%;height:100%;object-fit:cover;object-position:top center;
  transition:transform .7s var(--e)}
.proj:hover .shot img{transform:scale(1.04)}
.proj .m{padding:22px 20px 24px}
.badge{display:inline-block;font-size:.63rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  padding:4px 9px;border-radius:20px;margin-bottom:11px}
.badge.live{background:var(--forest-wash);color:var(--forest)}
.badge.demo{background:rgba(28,28,26,.07);color:var(--ink3)}
.proj h3{margin-bottom:4px}
.proj .cat{font-size:.8rem;color:var(--ink3);margin-bottom:12px}
.proj p{font-size:.92rem;color:var(--ink2);margin-bottom:14px}
.proj .visit{display:inline-flex;align-items:center;gap:6px;font-size:.86rem;font-weight:700;
  color:var(--gold);transition:gap .25s var(--e)}
.proj .visit:hover{gap:11px}
.worknote{margin-top:26px;font-size:.85rem;color:var(--ink3);line-height:1.6;
  background:var(--paper2);border-radius:var(--r);padding:16px 18px}

/* ---------- PRICING ---------- */
.pricing{background:var(--paper2)}
.tiers{display:grid;gap:14px}
.tier{background:var(--card);border:1px solid var(--line);border-radius:var(--rl);padding:26px 22px;
  display:flex;flex-direction:column}
.tier.feat{border-color:var(--forest);border-width:1.5px}
.tier .n{font-size:.68rem;letter-spacing:.2em;color:var(--ink3);font-weight:700;margin-bottom:11px}
.tier h3{font-family:var(--serif);font-style:italic;font-size:1.34rem;margin-bottom:7px}
.tier .amt{font-size:1rem;font-weight:700;color:var(--forest);margin-bottom:13px}
.tier .amt span{font-weight:500;font-size:.86rem;color:var(--ink3)}
.tier .blurb{font-size:.92rem;color:var(--ink2);margin-bottom:15px}
.tier ul{list-style:none;flex:1;margin-bottom:17px}
.tier li{position:relative;padding:6px 0 6px 21px;font-size:.89rem;color:var(--ink2)}
.tier li::before{content:"";position:absolute;left:1px;top:13px;width:8px;height:4px;
  border-left:1.7px solid var(--forest);border-bottom:1.7px solid var(--forest);transform:rotate(-45deg)}
.tier .fine{font-size:.78rem;color:var(--ink3);margin-top:12px;line-height:1.55}
.ownership{margin-top:22px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:20px 20px;font-size:.89rem;color:var(--ink2);line-height:1.62}
.ownership b{color:var(--ink)}

/* ---------- FOUNDER ---------- */
.hero,.founder-sec,.final,nav,footer,.drawer{--gold:#cba14e}
.founder-sec{background:var(--charcoal);color:var(--cream)}
.founder-sec h2{color:var(--cream)}.founder-sec h2 em{color:#8fb89f}
.founder-sec p{color:var(--cream2)}
.portrait{border-radius:var(--rl);overflow:hidden;border:1px solid var(--dline);margin-bottom:28px;
  aspect-ratio:4/5;background:var(--charcoal2)}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 16%}
.sig{margin-top:22px;padding-top:18px;border-top:1px solid var(--dline);font-size:.86rem;color:var(--cream3)}
.sig b{color:var(--cream)}

/* ---------- PROCESS ---------- */
.steps{display:grid;gap:0;border-top:1px solid var(--line)}
.step{display:flex;gap:16px;padding:22px 0;border-bottom:1px solid var(--line)}
.step .num{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--gold);
  line-height:1;flex:none;width:34px}
.step b{display:block;font-size:1.02rem;margin-bottom:4px}
.step span{font-size:.93rem;color:var(--ink2)}

/* ---------- TESTIMONIAL ---------- */
.quote-sec{background:var(--paper2)}
.quote{background:var(--card);border:1px solid var(--line);border-radius:var(--rl);padding:30px 24px}
.stars{color:#c9982f;letter-spacing:2px;font-size:1.05rem;margin-bottom:16px}
.quote blockquote{font-family:var(--serif);font-style:italic;font-size:1.24rem;line-height:1.44;
  margin-bottom:20px}
.quote .who{padding-top:17px;border-top:1px solid var(--line2);display:flex;align-items:center;gap:12px}
.quote .av{width:40px;height:40px;border-radius:50%;background:var(--forest);color:#fff;flex:none;
  display:grid;place-items:center;font-weight:600;font-size:.85rem}
.quote .nm{font-weight:600;font-size:.92rem}
.quote .rl{font-size:.8rem;color:var(--ink3)}
.quotes{display:grid;gap:18px}
.quote{display:flex;flex-direction:column}
.quote .who{margin-top:auto}
.quote-sec .verify{margin-top:22px;text-align:center;font-size:.85rem;color:var(--ink3)}
.quote-sec .verify a{color:var(--gold);font-weight:600}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line)}
summary{padding:20px 38px 20px 0;font-weight:600;font-size:1rem;cursor:pointer;list-style:none;position:relative}
summary::-webkit-details-marker{display:none}
summary::after{content:"";position:absolute;right:4px;top:50%;width:9px;height:9px;
  border-right:2px solid var(--ink3);border-bottom:2px solid var(--ink3);
  transform:translateY(-70%) rotate(45deg);transition:.28s var(--e)}
details[open] summary::after{transform:translateY(-30%) rotate(225deg);border-color:var(--forest)}
details .a{padding:0 4px 22px 0;color:var(--ink2);font-size:.95rem;margin-top:-4px}

/* ---------- FINAL CTA ---------- */
.final{background:var(--charcoal);color:var(--cream)}
.final h2{color:var(--cream)}.final h2 em{color:#8fb89f}
.final .lede{color:var(--cream2);margin-bottom:26px}
.bigcall{display:flex;align-items:center;gap:14px;background:rgba(242,237,226,.06);
  border:1px solid var(--dline);border-radius:var(--r);padding:18px 20px;margin-bottom:12px;
  transition:.3s var(--e)}
.bigcall:hover{background:rgba(242,237,226,.11);border-color:var(--gold)}
.bigcall .ic{width:40px;height:40px;border-radius:50%;background:var(--gold);color:var(--charcoal);
  display:grid;place-items:center;flex:none}
.bigcall .lb{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream3)}
.bigcall .nu{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--cream);line-height:1.2}
.audit{margin-top:26px;background:rgba(242,237,226,.05);border:1px solid var(--dline);
  border-radius:var(--rl);padding:24px 20px}
.audit h3{font-family:var(--serif);font-style:italic;font-size:1.24rem;color:var(--cream);margin-bottom:6px}
.audit p{font-size:.9rem;color:var(--cream2);margin-bottom:18px}
.fg{margin-bottom:12px}
label{display:block;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--cream3);margin-bottom:6px;font-weight:700}
input,textarea{width:100%;background:rgba(242,237,226,.06);border:1px solid var(--dline);
  border-radius:10px;padding:13px 14px;color:var(--cream);font-family:inherit;font-size:1rem}
input:focus,textarea:focus{outline:none;border-color:var(--gold);background:rgba(242,237,226,.1)}
input::placeholder,textarea::placeholder{color:rgba(242,237,226,.35)}
textarea{min-height:74px;resize:vertical}
.audit .fine{font-size:.78rem;color:var(--cream3);text-align:center;margin-top:11px}

footer{background:var(--charcoal);color:var(--cream3);border-top:1px solid var(--dline);
  padding:30px 0;font-size:.84rem}
footer a{color:var(--cream2)}footer a:hover{color:var(--gold)}
.fcols{display:grid;gap:22px}
.fcols b{color:var(--cream);display:block;margin-bottom:7px;font-size:.8rem;
  letter-spacing:.1em;text-transform:uppercase}
.fcols a{display:block;padding:3px 0}
.fbase{margin-top:24px;padding-top:18px;border-top:1px solid var(--dline);line-height:1.7}

/* ---------- STICKY CALL BAR ---------- */
.callbar{position:fixed;bottom:0;left:0;right:0;z-index:98;display:grid;grid-template-columns:1fr 1fr;
  gap:9px;padding:9px 14px calc(9px + env(safe-area-inset-bottom));
  background:var(--paper);border-top:1px solid var(--line)}
.callbar a{display:flex;align-items:center;justify-content:center;gap:7px;padding:14px 8px;
  border-radius:100px;font-weight:700;font-size:.94rem}
.callbar .c{background:var(--forest);color:#fff}
.callbar .t{background:var(--card);color:var(--ink);border:1.5px solid var(--line)}

/* ============================================================
   SCALE UP
   ============================================================ */
@media(min-width:600px){
  body{font-size:17px}
  .wrap{padding:0 32px}
  h1{font-size:3.1rem}h2{font-size:2.3rem}
  .btn{width:auto}.btn+.btn{margin-top:0}
  .herocta{display:flex;gap:12px;flex-wrap:wrap}
  .proof .g{grid-template-columns:repeat(4,1fr)}
  .proof .i{border-bottom:none}
  .proof .i:nth-child(2n){border-right:1px solid var(--dline)}
  .proof .i:last-child{border-right:none}
  .lede{font-size:1.1rem;max-width:60ch}
}
@media(min-width:860px){
  section{padding:88px 0}
  .hero{padding:150px 0 84px}
  h1{font-size:3.9rem}h2{font-size:2.7rem}
  .shead{margin-bottom:48px;max-width:62ch}
  .svc{grid-template-columns:repeat(3,1fr);gap:18px}
  .s-card{padding:32px 28px}
  .work{grid-template-columns:repeat(2,1fr);gap:24px}
  .tiers{grid-template-columns:repeat(3,1fr);gap:18px}
  .tier{padding:32px 28px}
  .founder{display:grid;grid-template-columns:.78fr 1.22fr;gap:56px;align-items:center}
  .portrait{margin-bottom:0}
  .steps{grid-template-columns:repeat(2,1fr);gap:0 40px}
  .quotes{grid-template-columns:repeat(3,1fr)}
  .quote{padding:32px 28px}
  .quote blockquote{font-size:1.2rem}
  .final .fg2{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
  .audit{margin-top:0}
  .fcols{grid-template-columns:repeat(4,1fr)}
  .callbar{display:none}
  body{padding-bottom:0}
  .navlinks{display:flex;align-items:center;gap:26px;font-size:.9rem;font-weight:500}
  .navlinks a{color:rgba(242,237,226,.72)}
  .navlinks a:hover{color:var(--cream)}
  .navlinks a.navtap{color:var(--gold);font-weight:700}
  .navlinks a.navtap b{font-weight:700;opacity:.7;font-size:.82rem}
  .navlinks a.navtap:hover{color:var(--gold);text-decoration:underline}
  .burger{display:none}
  .drawer{display:none}
}
@media(min-width:1100px){h1{font-size:4.4rem}}