
:root {
  --ink:#123d3c;
  --ink-2:#175b58;
  --river:#18a79f;
  --river-light:#79dfb5;
  --sage:#99df79;
  --rust:#ed7041;
  --amber:#f3ad3f;
  --cream:#fbf4e8;
  --paper:#fffaf1;
  --white:#ffffff;
  --line:#d7cebf;
  --muted:#64706d;
  --shadow:0 16px 42px rgba(23,43,44,.09);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"Manrope",sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.55;
  overflow-x:hidden;
}
a{color:inherit}
img{max-width:100%}
.shell{max-width:1220px;margin:0 auto;padding:0 34px}
.serif{font-family:"Newsreader",Georgia,serif}
.kicker{
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.17em;
  color:#0f9f97;
}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s ease}
.reveal.show{opacity:1;transform:none}

/* TOPOGRAPHIC MOTIF */
.topo{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.34;
  overflow:hidden;
}
.topo svg{width:100%;height:100%}
.topo path{fill:none;stroke:#57b7a9;stroke-width:1.15;vector-effect:non-scaling-stroke}
.ambient-glow{
  position:absolute;
  width:430px;
  height:430px;
  border-radius:50%;
  filter:blur(58px);
  opacity:.18;
  pointer-events:none;
  animation:driftGlow 10s ease-in-out infinite alternate;
}
.glow-teal{background:#27c9ae}
.glow-lime{background:#9de95c}
.glow-rust{background:#f08a4b}
@keyframes driftGlow{
  from{transform:translate3d(-10px,-6px,0) scale(.96)}
  to{transform:translate3d(18px,12px,0) scale(1.05)}
}


/* HEADER */
.site-header{
  position:sticky;
  top:0;
  z-index:80;
  background:rgba(251,248,241,.94);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(23,43,44,.14);
}
.nav{
  height:78px;
  display:grid;
  grid-template-columns:250px 1fr auto;
  align-items:center;
  gap:30px;
}
.brand{
  display:flex;
  align-items:center;
  gap:11px;
  text-decoration:none;
}
.brand img{
  width:44px;
  height:42px;
  object-fit:cover;
  object-position:left center;
  border-radius:7px;
}
.brand-copy strong{
  display:block;
  font-weight:800;
  font-size:17px;
  letter-spacing:-.02em;
}
.brand-copy span{
  display:block;
  font-size:7px;
  margin-top:1px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--river);
  font-weight:800;
}
.nav-links{
  display:flex;
  justify-content:center;
  gap:28px;
}
.nav-links a{
  text-decoration:none;
  font-size:12px;
  font-weight:700;
  color:#48605e;
  transition:color .18s ease;
}
.nav-links a:hover{color:var(--ink)}
.nav-action{
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  padding:11px 0 8px;
  border-bottom:2px solid var(--river);
}
.nav-action .arr{transition:transform .18s ease}
.nav-action:hover .arr{transform:translateX(4px)}
.nav-tools{display:flex;align-items:center;gap:18px}
.menu-toggle{
  display:none;
  width:42px;
  height:42px;
  border:1px solid rgba(23,43,44,.22);
  background:transparent;
  cursor:pointer;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
}
.menu-toggle span{
  width:19px;
  height:2px;
  background:var(--ink);
  transition:transform .2s ease,opacity .2s ease;
}
.menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.open span:nth-child(2){opacity:0}
.menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{
  display:none;
  border-top:1px solid rgba(23,43,44,.12);
  background:rgba(251,248,241,.99);
}
.mobile-menu.open{display:block}
.mobile-menu-inner{
  padding-top:14px;
  padding-bottom:18px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2px 22px;
}
.mobile-menu a{
  text-decoration:none;
  padding:12px 0;
  border-bottom:1px solid rgba(23,43,44,.1);
  font-size:12px;
  font-weight:700;
  color:#425b58;
}
.mobile-menu .mobile-cta{
  grid-column:1/-1;
  margin-top:9px;
  padding:14px 16px;
  background:linear-gradient(135deg,#20b5aa,#0b746f);
  color:#fff;
  border:0;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:10px;
  text-align:center;
}

/* HERO */
.hero{
  min-height:725px;
  position:relative;
  display:flex;
  align-items:center;
  border-bottom:1px solid var(--line);
}
.hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1.06fr .94fr;
  gap:72px;
  align-items:center;
  width:100%;
  padding-top:70px;
  padding-bottom:72px;
}
.hero-copy{max-width:700px}
.hero-note{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:22px;
}
.hero-note::before{
  content:"";
  width:56px;
  height:1px;
  background:#f07a46;
}
.hero h1{
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(58px,7.2vw,100px);
  line-height:.91;
  font-weight:500;
  letter-spacing:-.05em;
  margin-bottom:28px;
}
.hero h1 em{
  font-style:italic;
  color:#0aa39b;
  font-weight:400;
}
.hero-lede{
  max-width:610px;
  font-size:18px;
  color:#556461;
  margin-bottom:31px;
}
.hero-actions{
  display:flex;
  align-items:center;
  gap:28px;
  flex-wrap:wrap;
}
.primary{
  display:inline-flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
  padding:15px 22px;
  background:var(--ink);
  color:#fff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  box-shadow:8px 8px 0 #b8eadf;
  transition:transform .18s ease,box-shadow .18s ease;
}
.primary:hover{transform:translate(-2px,-2px);box-shadow:11px 11px 0 #b8eadf}
.text-link{
  color:var(--ink);
  font-weight:800;
  text-decoration:none;
  font-size:12px;
  border-bottom:1px solid var(--ink);
  padding-bottom:4px;
}
.hero-facts{
  margin-top:42px;
  display:flex;
  gap:32px;
  flex-wrap:wrap;
}
.fact{
  min-width:130px;
  padding-top:12px;
  border-top:1px solid var(--line);
}
.fact strong{
  display:block;
  font-family:"Newsreader",Georgia,serif;
  font-size:21px;
  font-weight:600;
}
.fact span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}

/* HERO DESIGN MAP */
.design-map{
  position:relative;
  min-height:550px;
}
.river-path{
  position:absolute;
  inset:10px 0 0 0;
}
.river-path svg{width:100%;height:100%}
.river-path path.main{
  fill:none;
  stroke:url(#riverGradient);
  stroke-width:38;
  stroke-linecap:round;
  opacity:.85;
}
.river-path path.inner{
  fill:none;
  stroke:#edf5ef;
  stroke-width:8;
  stroke-linecap:round;
  opacity:.95;
}
.map-label{
  position:absolute;
  background:var(--paper);
  border:1px solid var(--line);
  padding:10px 13px;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.09em;
  color:#63706c;
  box-shadow:0 8px 22px rgba(23,43,44,.06);
}
.map-label strong{
  display:block;
  font-family:"Newsreader",Georgia,serif;
  font-size:17px;
  color:var(--ink);
  text-transform:none;
  letter-spacing:0;
  margin-bottom:1px;
}
.label-one{top:50px;right:18px}
.label-two{top:228px;left:8px}
.label-three{bottom:58px;right:8px}

.specimen{
  position:absolute;
  border:1px solid rgba(23,43,44,.16);
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}
.specimen-a{
  width:245px;
  height:164px;
  left:34px;
  top:46px;
  transform:rotate(-4deg);
  background:#f4eadb;
}
.specimen-b{
  width:265px;
  height:178px;
  right:18px;
  top:177px;
  transform:rotate(3deg);
  background:#17241f;
}
.specimen-c{
  width:245px;
  height:164px;
  left:70px;
  bottom:27px;
  transform:rotate(-1.5deg);
  background:#eef4f7;
}
.spec-bar{height:22px;border-bottom:1px solid rgba(0,0,0,.08);display:flex;align-items:center;gap:4px;padding:0 8px}
.spec-dot{width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.4}
.specimen-a .spec-inner{padding:16px 18px}
.specimen-a .mini-brand{font-family:"Newsreader",Georgia,serif;color:#671b1d;font-size:22px}
.specimen-a .mini-head{font-family:"Newsreader",Georgia,serif;font-size:25px;line-height:.9;margin-top:17px}
.specimen-a .mini-rule{height:1px;background:#af7d3a;margin:12px 0}
.specimen-a .mini-copy{height:5px;background:#c5b9a9;width:70%;margin-top:5px}
.specimen-b{color:#f2eee6}
.specimen-b .spec-bar{border-bottom-color:#ffffff1f}
.specimen-b .spec-inner{padding:17px 18px}
.specimen-b .mini-brand{font-size:15px;letter-spacing:.16em;text-transform:uppercase;color:#9dd1a6}
.specimen-b .mini-head{font-family:"Newsreader",Georgia,serif;font-size:30px;line-height:.92;margin-top:16px}
.specimen-b .mini-accent{height:46px;background:linear-gradient(90deg,#315543,#a48759);margin-top:13px}
.specimen-c .spec-inner{padding:15px 18px}
.specimen-c .mini-brand{font-weight:800;font-size:14px;color:#264d61}
.specimen-c .mini-head{font-size:24px;line-height:1.03;margin-top:18px;font-weight:800}
.specimen-c .mini-row{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:13px}
.specimen-c .mini-row span{height:31px;border:1px solid #b8cbd4;background:#fff}

/* WORK / DESIGN PROOF */
.work{
  padding:98px 0 105px;
  border-bottom:1px solid var(--line);
}
.work-head{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:78px;
  align-items:end;
  margin-bottom:58px;
}
.work h2,.mockup h2,.manifesto h2,.process h2,.pricing h2,.local h2,.closing h2{
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(43px,5.2vw,68px);
  line-height:.98;
  letter-spacing:-.04em;
  font-weight:500;
}
.work-head p{
  color:var(--muted);
  max-width:500px;
  font-size:15px;
}
.study-list{border-top:1px solid var(--ink)}
.study{
  display:grid;
  grid-template-columns:150px 1fr 250px;
  gap:40px;
  align-items:center;
  padding:28px 0;
  border-bottom:1px solid var(--line);
  transition:padding-left .22s ease,background .22s ease;
}
.study:hover{padding-left:12px;background:rgba(47,137,131,.035)}
.study .type{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.13em;
  color:var(--river);
  font-weight:800;
}
.study h3{
  font-family:"Newsreader",Georgia,serif;
  font-size:31px;
  font-weight:500;
}
.study p{font-size:12px;color:var(--muted)}
.swatches{display:flex;justify-content:flex-end;gap:7px}
.swatches i{display:block;width:40px;height:40px;border-radius:50%;border:1px solid #ffffff88;box-shadow:0 0 0 1px #0000000e}
.s1 i:nth-child(1){background:#5b1718} .s1 i:nth-child(2){background:#e9decb} .s1 i:nth-child(3){background:#b38245}
.s2 i:nth-child(1){background:#182720} .s2 i:nth-child(2){background:#789d78} .s2 i:nth-child(3){background:#b89060}
.s3 i:nth-child(1){background:#214757} .s3 i:nth-child(2){background:#eaf2f4} .s3 i:nth-child(3){background:#e2a85b}

/* MOCKUP OFFER */
.mockup{
  position:relative;
  background:radial-gradient(circle at 8% 25%,rgba(133,236,116,.18),transparent 28%),radial-gradient(circle at 92% 72%,rgba(232,125,74,.17),transparent 27%),linear-gradient(135deg,#0d3938 0%,#102d2d 52%,#0c2424 100%);
  color:#f7f3e9;
  padding:104px 0 110px;
  overflow:hidden;
}
.mockup .topo{opacity:.13}
.mockup .topo path{stroke:#72d5c0}
.mockup-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:.92fr 1.08fr;
  gap:95px;
  align-items:center;
}
.mockup .kicker{color:#7be0c9}
.mockup h2{color:#fff;margin:10px 0 20px}
.mockup-copy p{color:#c1cbc7;max-width:500px}
.zero{
  margin-top:34px;
  font-family:"Newsreader",Georgia,serif;
  font-size:72px;
  line-height:.85;
  color:#7be0c9;
}
.zero span{display:block;font-family:"Manrope",sans-serif;font-size:10px;text-transform:uppercase;letter-spacing:.16em;color:#b8c5c1;margin-top:11px}
.mockup-flow{position:relative;padding-left:28px}
.mockup-flow::before{
  content:"";
  position:absolute;
  left:3px;
  top:12px;
  bottom:16px;
  width:1px;
  background:#5f7c77;
}
.flow-step{position:relative;padding:0 0 30px 28px}
.flow-step::before{
  content:"";
  position:absolute;
  left:-30px;
  top:8px;
  width:11px;
  height:11px;
  border:2px solid #7be0c9;
  background:var(--ink);
  border-radius:50%;
}
.flow-step strong{
  display:block;
  font-family:"Newsreader",Georgia,serif;
  font-size:25px;
  font-weight:500;
  color:#fff;
}
.flow-step p{font-size:12px;color:#9eaeaa;margin-top:4px}
.mockup .primary{background:linear-gradient(135deg,#82e85f,#66d6b6);color:#103738;box-shadow:8px 8px 0 #244f4b;margin-top:10px}
.mockup-proof{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 16px}
.mockup-proof>div{
  min-width:155px;
  padding:15px 17px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.055);
}
.mockup-proof strong{
  display:block;
  font-family:"Newsreader",Georgia,serif;
  font-size:28px;
  line-height:1;
  color:#8de96b;
}
.mockup-proof span{
  display:block;
  margin-top:6px;
  font-size:9px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#b9c9c4;
}

/* MANIFESTO */
.manifesto{
  padding:102px 0;
  border-bottom:1px solid var(--line);
}
.manifesto-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:80px;
}
.manifesto-intro{position:sticky;top:120px;align-self:start}
.manifesto-intro p{color:var(--muted);margin-top:18px;max-width:380px}
.manifesto-list{border-top:1px solid var(--ink)}
.manifesto-item{
  padding:25px 0;
  border-bottom:1px solid var(--line);
}
.manifesto-item h3{
  font-family:"Newsreader",Georgia,serif;
  font-size:28px;
  font-weight:500;
  margin-bottom:5px;
}
.manifesto-item p{font-size:13px;color:var(--muted);max-width:610px}

/* PROCESS RIVER */
.process{
  padding:100px 0 110px;
  position:relative;
  overflow:hidden;
  background:radial-gradient(circle at 85% 10%,rgba(87,214,177,.16),transparent 24%),linear-gradient(180deg,#fffaf1 0%,#edf9f3 100%);
  border-bottom:1px solid var(--line);
}
.process-head{max-width:680px;margin-bottom:62px}
.process-head p{color:var(--muted);margin-top:16px}
.process-map{
  position:relative;
  min-height:520px;
}
.process-map svg{
  position:absolute;
  inset:20px 7% 0 6%;
  width:87%;
  height:430px;
}
.process-map .river{
  fill:none;
  stroke:#22b9a4;
  stroke-width:17;
  stroke-linecap:round;
  opacity:.65;
}
.process-map .river-inner{
  fill:none;
  stroke:#f8f6ef;
  stroke-width:4;
  stroke-linecap:round;
}
.process-step{
  position:absolute;
  max-width:240px;
}
.process-step .pin{
  width:18px;
  height:18px;
  border-radius:50%;
  background:#f07a46;
  border:4px solid #eef8f2;
  box-shadow:0 0 0 1px var(--rust);
  margin-bottom:11px;
}
.process-step strong{
  display:block;
  font-family:"Newsreader",Georgia,serif;
  font-size:24px;
  font-weight:500;
}
.process-step p{font-size:12px;color:var(--muted);margin-top:4px}
.p1{left:2%;top:15px}
.p2{left:29%;top:225px}
.p3{right:30%;top:52px}
.p4{right:2%;top:305px}

/* PRICING — POLISHED CARD PRESENTATION */
.pricing{
  padding:106px 0 102px;
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 95% 10%,rgba(55,196,171,.12),transparent 24%),
    linear-gradient(180deg,#fffaf1 0%,#fbf5e9 100%);
}
.pricing-intro{
  max-width:900px;
  margin-bottom:54px;
}
.pricing-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:9px 15px;
  background:#e7f3ee;
  color:#175b58;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:800;
  border-radius:999px;
  margin-bottom:22px;
}
.pricing-kicker span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#49b99a;
}
.pricing-intro h2{
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(46px,5.4vw,72px);
  line-height:.96;
  letter-spacing:-.045em;
  font-weight:500;
  max-width:900px;
}
.pricing-intro p{
  color:var(--muted);
  margin-top:16px;
  font-size:14px;
}
.pricing-cards{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:22px;
  align-items:stretch;
}
.pricing-card{
  min-height:455px;
  padding:42px 38px 34px;
  position:relative;
  border:1px solid rgba(20,61,60,.14);
  box-shadow:0 16px 34px rgba(23,43,44,.07);
  display:flex;
  flex-direction:column;
  transition:transform .24s ease,box-shadow .24s ease;
}
.pricing-card:hover{
  transform:translateY(-5px);
  box-shadow:0 22px 44px rgba(23,43,44,.11);
}
.build-card{
  background:linear-gradient(145deg,#eefaf6,#f8fcf9);
  border:2px solid #5ac8ad;
}
.standard-card{
  background:#fff;
}
.premium-card{
  color:#fff;
  background:
    radial-gradient(circle at 95% 0%,rgba(104,220,174,.17),transparent 32%),
    linear-gradient(145deg,#123d3c,#0d2e2e);
  border-color:#123d3c;
}
.price-badge{
  position:absolute;
  top:-18px;
  left:30px;
  padding:10px 17px;
  border-radius:999px;
  background:linear-gradient(135deg,#f29c45,#ef7147);
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:10px;
  font-weight:800;
  box-shadow:0 8px 18px rgba(218,112,64,.16);
}
.price-badge.popular{
  left:auto;
  right:28px;
}
.card-label{
  margin-top:10px;
  color:#6a756f;
  font-family:"Newsreader",Georgia,serif;
  font-size:19px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.premium-card .card-label{color:#f4f5ef}
.price-line{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin:38px 0 38px;
}
.price-line strong{
  font-family:"Newsreader",Georgia,serif;
  font-size:60px;
  font-weight:600;
  line-height:.9;
  letter-spacing:-.04em;
  color:#123d3c;
}
.premium-card .price-line strong{color:#fff}
.price-suffix{
  font-size:17px;
  color:#7f8783;
}
.premium-card .price-suffix{color:#f2f3ed}
.build-price-line{gap:12px}
.was-price{
  position:relative;
  font-family:"Newsreader",Georgia,serif;
  font-size:28px;
  color:#818985;
}
.was-price::after{
  content:"";
  position:absolute;
  left:-2px;
  top:54%;
  width:0;
  height:2px;
  background:#7d8581;
  transform:rotate(-4deg);
  transform-origin:left center;
}
.now-price{
  color:#17a49b!important;
  transform:translateY(8px);
  opacity:.35;
}
.pricing.pricing-animate .was-price::after{
  animation:priceStrike .65s ease forwards .18s;
}
.pricing.pricing-animate .now-price{
  animation:priceReveal .7s cubic-bezier(.2,.8,.2,1) forwards .42s;
}
@keyframes priceStrike{
  to{width:104%}
}
@keyframes priceReveal{
  0%{transform:translateY(8px) scale(.96);opacity:.35}
  70%{transform:translateY(-2px) scale(1.035);opacity:1}
  100%{transform:none;opacity:1}
}
.price-features{
  list-style:none;
  margin-top:auto;
}
.price-features li{
  position:relative;
  padding:10px 0 10px 34px;
  color:#596561;
  font-size:14px;
  border-bottom:1px solid rgba(23,43,44,.07);
}
.price-features li:last-child{border-bottom:0}
.price-features li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:8px;
  font-size:20px;
  line-height:1;
  font-weight:800;
  color:#199a7c;
}
.premium-card .price-features li{
  color:#d9e1dd;
  border-bottom-color:rgba(255,255,255,.08);
}
.premium-card .price-features li::before{color:#8dea65}
.offer-note{
  margin-top:20px;
  color:#e36741;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:9px;
  font-weight:800;
}
.pricing-foot{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:42px;
  margin-top:36px;
  padding-top:25px;
  border-top:1px solid var(--ink);
}
.pricing-foot p{
  color:var(--muted);
  font-size:12px;
}
.pricing-foot strong{color:var(--ink)}
@media(max-width:930px){
  .pricing-cards{grid-template-columns:1fr 1fr}
  .build-card{grid-column:1/-1;min-height:390px}
  .pricing-foot{grid-template-columns:1fr}
}
@media(max-width:620px){
  .pricing{padding-top:76px;padding-bottom:78px}
  .pricing-cards{grid-template-columns:1fr}
  .build-card{grid-column:auto}
  .pricing-card{min-height:auto;padding:38px 26px 28px}
  .price-line{margin:30px 0}
  .price-line strong{font-size:52px}
  .was-price{font-size:24px}
  .price-badge{left:22px}
  .price-badge.popular{right:20px}
}

/* LOCAL */
.local{
  padding:92px 0;
}
.local-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:80px;
  align-items:center;
}
.local-copy p{
  margin-top:18px;
  color:var(--muted);
  font-size:15px;
  max-width:600px;
}
.local-note{
  border-left:3px solid var(--river-light);
  padding-left:40px;
}
.local-note strong{
  display:block;
  font-family:"Newsreader",Georgia,serif;
  font-size:30px;
  font-weight:500;
  margin-bottom:12px;
}
.local-note p{font-size:13px;color:var(--muted)}
.local-note a{display:inline-block;margin-top:16px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;text-decoration:none;border-bottom:1px solid var(--river);padding-bottom:4px}

/* CLOSING */
.closing{
  padding:112px 0 106px;
  background:radial-gradient(circle at 8% 20%,rgba(118,229,177,.18),transparent 24%),radial-gradient(circle at 92% 85%,rgba(238,125,72,.15),transparent 22%),linear-gradient(120deg,#fffaf1 0%,#eefaf4 100%);
  position:relative;
  overflow:hidden;
  border-top:1px solid var(--line);
}
.closing-inner{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:70px;
  align-items:end;
}
.closing h2{max-width:760px}
.closing-side p{font-size:14px;color:var(--muted);margin-bottom:23px}

/* FOOTER */
footer{
  background:#0e3434;
  color:#b8c3bf;
  padding:44px 0 34px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1fr auto;
  gap:50px;
  align-items:end;
}
.footer-brand strong{display:block;color:#fff;font-size:18px}
.footer-brand span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.16em;color:#7fb9ad;margin-top:4px}
.footer-contact{text-align:right;font-size:11px;line-height:1.9}
.footer-contact a{text-decoration:none;color:#e0e8e4;margin-left:15px}
.footer-note{
  margin-top:28px;
  padding-top:20px;
  border-top:1px solid #ffffff1d;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:#778783;
  display:flex;
  justify-content:space-between;
  gap:20px;
}

@media(max-width:930px){
  .nav{grid-template-columns:1fr auto}
  .nav-links{display:none}
  .menu-toggle{display:flex}
  .nav-tools{gap:14px}
  .hero-grid,.work-head,.mockup-grid,.manifesto-grid,.pricing-head,.local-grid,.closing-inner{grid-template-columns:1fr}
  .price-stage{grid-template-columns:1fr}
  .design-map{min-height:500px;max-width:600px}
  .study{grid-template-columns:120px 1fr}
  .swatches{display:none}
  .manifesto-intro{position:static}
  .process-map{min-height:auto;display:grid;grid-template-columns:1fr 1fr;gap:26px}
  .process-map svg{display:none}
  .process-step{position:static;max-width:none;border-top:1px solid var(--line);padding-top:18px}
}
@media(max-width:620px){
  .shell{padding:0 20px}
  .site-header .nav{height:70px}
  .brand img{width:38px;height:37px}
  .nav-action{display:none}
  .mobile-menu-inner{grid-template-columns:1fr}
  .brand-copy strong{font-size:15px}
  .hero{min-height:auto}
  .hero-grid{padding-top:50px;padding-bottom:55px;gap:40px}
  .hero h1{font-size:56px}
  .hero-lede{font-size:16px}
  .design-map{min-height:420px}
  .specimen-a{width:205px;height:140px;left:0}
  .specimen-b{width:220px;height:150px;right:0}
  .specimen-c{width:200px;height:140px;left:30px}
  .map-label{display:none}
  .work,.manifesto,.process,.pricing,.local,.closing{padding-top:72px;padding-bottom:76px}
  .study{grid-template-columns:1fr;gap:8px}
  .study h3{font-size:26px}
  .mockup{padding:76px 0}
  .price-stage{grid-template-columns:1fr}
  .plan-stack{grid-template-columns:1fr}
  .build-panel,.plan-card{min-height:auto}
  .build-price strong{font-size:64px}
  .extras-row{grid-template-columns:1fr}
  .extras-row>div{border-right:0;border-bottom:1px solid var(--line);padding:16px 0}
  .process-map{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-contact{text-align:left}
  .footer-contact a{margin-left:0;margin-right:12px}
  .footer-note{display:block}
  .footer-note span:last-child{display:block;margin-top:8px}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .reveal{opacity:1!important;transform:none!important;transition:none!important}
}



/* =========================================================
   SHARED PRODUCTION SITE STYLES
   ========================================================= */

.nav-links a.active{
  color:var(--ink);
  position:relative;
}
.nav-links a.active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  height:2px;
  background:linear-gradient(90deg,var(--river),var(--river-light));
}
.page-main{
  min-height:60vh;
}
.subhero{
  position:relative;
  overflow:hidden;
  padding:108px 0 88px;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 88% 16%,rgba(39,201,174,.13),transparent 25%),
    radial-gradient(circle at 8% 90%,rgba(157,233,92,.09),transparent 25%),
    linear-gradient(180deg,#fffaf1,#fbf5e9);
}
.subhero .shell{position:relative;z-index:2}
.subhero-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:75px;
  align-items:end;
}
.subhero h1{
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(58px,7vw,92px);
  line-height:.91;
  font-weight:500;
  letter-spacing:-.05em;
  margin:14px 0 24px;
  max-width:820px;
}
.subhero h1 em{
  color:#0aa39b;
  font-style:italic;
  font-weight:400;
}
.subhero-lede{
  font-size:18px;
  color:#556461;
  max-width:640px;
}
.subhero-note{
  border-left:3px solid var(--river-light);
  padding:22px 0 22px 30px;
  color:var(--muted);
  font-size:14px;
}
.subhero-note strong{
  display:block;
  font-family:"Newsreader",Georgia,serif;
  color:var(--ink);
  font-size:28px;
  line-height:1.05;
  font-weight:500;
  margin-bottom:10px;
}

.content-section{
  padding:90px 0;
  border-bottom:1px solid var(--line);
  position:relative;
  overflow:hidden;
}
.content-section.soft{
  background:linear-gradient(180deg,#fffaf1 0%,#f0faf5 100%);
}
.content-head{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:70px;
  align-items:start;
  margin-bottom:52px;
}
.content-head h2{
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(42px,5vw,65px);
  line-height:.98;
  letter-spacing:-.04em;
  font-weight:500;
}
.content-head p{
  color:var(--muted);
  font-size:15px;
  max-width:590px;
}

.editorial-copy{
  max-width:780px;
}
.editorial-copy p{
  font-family:"Newsreader",Georgia,serif;
  font-size:22px;
  line-height:1.52;
  color:#43514e;
  margin-bottom:22px;
}
.editorial-copy p.small{
  font-family:"Manrope",sans-serif;
  font-size:14px;
  color:var(--muted);
}

.rule-list{
  border-top:1px solid var(--ink);
}
.rule-item{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:42px;
  padding:26px 0;
  border-bottom:1px solid var(--line);
}
.rule-item .label{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.13em;
  color:var(--river);
  font-weight:800;
  padding-top:7px;
}
.rule-item h3{
  font-family:"Newsreader",Georgia,serif;
  font-size:28px;
  font-weight:500;
  margin-bottom:6px;
}
.rule-item p{
  color:var(--muted);
  font-size:13px;
  max-width:650px;
}

.color-band{
  position:relative;
  overflow:hidden;
  padding:86px 0;
  color:#f7f3e9;
  background:
    radial-gradient(circle at 8% 30%,rgba(133,236,116,.18),transparent 27%),
    radial-gradient(circle at 92% 76%,rgba(232,125,74,.16),transparent 27%),
    linear-gradient(135deg,#0d3938,#102d2d 52%,#0c2424);
}
.color-band .shell{position:relative;z-index:2}
.color-band-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:75px;
  align-items:center;
}
.color-band h2{
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(42px,5.1vw,68px);
  line-height:.98;
  letter-spacing:-.04em;
  font-weight:500;
  color:#fff;
}
.color-band p{
  color:#bccac6;
  margin-top:18px;
  max-width:560px;
  font-size:14px;
}
.color-band .kicker{color:#7be0c9}
.color-band-stat{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.color-band-stat>div{
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.055);
  padding:24px;
}
.color-band-stat strong{
  display:block;
  font-family:"Newsreader",Georgia,serif;
  color:#8de96b;
  font-size:39px;
  line-height:1;
  font-weight:500;
}
.color-band-stat span{
  display:block;
  margin-top:7px;
  color:#bac8c4;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
}

.cta-strip{
  padding:85px 0;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 20%,rgba(118,229,177,.18),transparent 24%),
    radial-gradient(circle at 92% 85%,rgba(238,125,72,.15),transparent 22%),
    linear-gradient(120deg,#fffaf1,#eefaf4);
}
.cta-strip-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:70px;
  align-items:end;
}
.cta-strip h2{
  font-family:"Newsreader",Georgia,serif;
  font-size:clamp(42px,5vw,68px);
  line-height:.98;
  letter-spacing:-.04em;
  font-weight:500;
}
.cta-strip p{
  color:var(--muted);
  font-size:14px;
  margin-bottom:24px;
}

/* About page */
.about-origin{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:82px;
  align-items:start;
}
.about-aside{
  border-top:1px solid var(--ink);
}
.about-aside .aside-row{
  padding:19px 0;
  border-bottom:1px solid var(--line);
}
.about-aside .aside-row span{
  display:block;
  color:var(--river);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:800;
  margin-bottom:5px;
}
.about-aside .aside-row strong{
  font-family:"Newsreader",Georgia,serif;
  font-size:22px;
  font-weight:500;
}

/* Form page */
.form-layout{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:72px;
  align-items:start;
}
.form-intro{
  position:sticky;
  top:120px;
}
.form-intro h2{
  font-family:"Newsreader",Georgia,serif;
  font-size:43px;
  line-height:1;
  letter-spacing:-.035em;
  font-weight:500;
  margin:10px 0 17px;
}
.form-intro p{color:var(--muted);font-size:14px}
.no-risk{
  margin-top:28px;
  border-top:1px solid var(--ink);
}
.no-risk div{
  padding:16px 0;
  border-bottom:1px solid var(--line);
  font-size:12px;
  color:var(--muted);
}
.no-risk strong{
  color:var(--ink);
  font-family:"Newsreader",Georgia,serif;
  font-size:20px;
  font-weight:500;
  display:block;
  margin-bottom:2px;
}
.form-card{
  background:#fff;
  border:1px solid rgba(20,61,60,.14);
  box-shadow:0 18px 45px rgba(23,43,44,.09);
  padding:42px;
  position:relative;
}
.form-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:linear-gradient(180deg,var(--river),var(--river-light),var(--rust));
}
.field-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.field-group{margin-bottom:21px}
.field-group label{
  display:block;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-weight:800;
  color:#425b58;
  margin-bottom:7px;
}
.field-group label .opt{
  text-transform:none;
  letter-spacing:0;
  font-weight:500;
  color:#87908c;
}
.form-card input,
.form-card select,
.form-card textarea{
  width:100%;
  border:1px solid #d8d9d3;
  background:#fffdf8;
  color:var(--ink);
  padding:13px 14px;
  font:14px "Manrope",sans-serif;
  border-radius:0;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.form-card input:focus,
.form-card select:focus,
.form-card textarea:focus{
  outline:none;
  border-color:var(--river);
  box-shadow:0 0 0 3px rgba(24,167,159,.10);
  background:#fff;
}
.form-card textarea{min-height:130px;resize:vertical}
.submit-btn{
  width:100%;
  border:0;
  cursor:pointer;
  padding:16px 20px;
  background:linear-gradient(135deg,#20b5aa,#0b746f);
  color:#fff;
  font:800 11px "Manrope",sans-serif;
  text-transform:uppercase;
  letter-spacing:.08em;
  box-shadow:7px 7px 0 #c8eee4;
  transition:transform .18s ease,box-shadow .18s ease;
}
.submit-btn:hover{
  transform:translate(-2px,-2px);
  box-shadow:10px 10px 0 #c8eee4;
}
.form-note{
  color:var(--muted);
  font-size:10px;
  text-align:center;
  margin-top:17px;
}

/* Payments */
.payment-hero h1{max-width:920px}
.secure-chip{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:9px 14px;
  border:1px solid var(--line);
  background:#fff;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-weight:800;
  color:#52615e;
  margin-top:26px;
}
.secure-chip::before{
  content:"✓";
  display:grid;
  place-items:center;
  width:22px;
  height:22px;
  background:#e8f7f1;
  color:#158d74;
  border-radius:50%;
}
.payment-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}
.payment-card{
  position:relative;
  background:#fff;
  border:1px solid rgba(20,61,60,.14);
  box-shadow:0 14px 32px rgba(23,43,44,.06);
  padding:32px;
  overflow:hidden;
}
.payment-card.dark{
  background:
    radial-gradient(circle at 100% 0%,rgba(104,220,174,.16),transparent 35%),
    linear-gradient(145deg,#123d3c,#0d2e2e);
  color:#fff;
}
.payment-card .tag{
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:800;
  color:var(--river);
  margin-bottom:10px;
}
.payment-card.dark .tag{color:#8de96b}
.payment-card h3{
  font-family:"Newsreader",Georgia,serif;
  font-size:31px;
  line-height:1;
  font-weight:500;
  margin-bottom:12px;
}
.payment-card p{
  color:var(--muted);
  font-size:13px;
}
.payment-card.dark p{color:#c6d2ce}
.checks{
  list-style:none;
  margin:20px 0 25px;
}
.checks li{
  position:relative;
  padding:6px 0 6px 25px;
  color:var(--muted);
  font-size:12px;
}
.payment-card.dark .checks li{color:#d4dfdb}
.checks li::before{
  content:"✓";
  position:absolute;
  left:0;
  color:#16977c;
  font-weight:800;
}
.payment-card.dark .checks li::before{color:#8de96b}
.action-btn{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  width:100%;
  text-decoration:none;
  padding:14px 16px;
  background:linear-gradient(135deg,#20b5aa,#0b746f);
  color:#fff;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.07em;
  transition:transform .18s ease,box-shadow .18s ease;
}
.action-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(18,61,60,.16);
}
.dark .action-btn{
  background:linear-gradient(135deg,#82e85f,#66d6b6);
  color:#103738;
}
.secondary-btn{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  width:100%;
  margin-top:9px;
  text-decoration:none;
  padding:12px 15px;
  border:1px solid rgba(18,61,60,.22);
  background:transparent;
  color:var(--ink);
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.dark .secondary-btn{
  color:#fff;
  border-color:rgba(255,255,255,.22);
}
.payment-note{
  margin-top:9px!important;
  text-align:center;
  font-size:9px!important;
}
.portal-panel{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:50px;
  padding:40px;
  color:#f7f3e9;
  background:
    radial-gradient(circle at 92% 10%,rgba(139,233,107,.15),transparent 30%),
    linear-gradient(135deg,#0d3938,#102d2d);
}
.portal-panel h3{
  font-family:"Newsreader",Georgia,serif;
  font-size:40px;
  font-weight:500;
  line-height:1;
}
.portal-panel p{color:#b9c8c4;margin-top:12px;font-size:13px}
.portal-panel .portal-action{align-self:center}

/* Utility pages */
.utility-page{
  min-height:calc(100vh - 78px);
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  padding:70px 20px;
  background:
    radial-gradient(circle at 85% 15%,rgba(39,201,174,.15),transparent 25%),
    radial-gradient(circle at 12% 86%,rgba(240,138,75,.11),transparent 24%),
    #fffaf1;
}
.utility-card{
  position:relative;
  z-index:2;
  width:min(700px,100%);
  padding:52px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.84);
  box-shadow:var(--shadow);
  text-align:center;
}
.utility-card .big-mark{
  font-family:"Newsreader",Georgia,serif;
  font-size:74px;
  color:var(--river);
  line-height:1;
}
.utility-card h1{
  font-family:"Newsreader",Georgia,serif;
  font-size:48px;
  line-height:1;
  font-weight:500;
  letter-spacing:-.035em;
  margin:16px 0;
}
.utility-card p{color:var(--muted);max-width:540px;margin:0 auto 25px}

/* Shared footer */
.footer-links{
  margin-top:12px;
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
.footer-links a{
  margin-left:0!important;
  color:#cbd7d3!important;
  font-size:10px;
}

/* Responsive */
@media(max-width:930px){
  .subhero-grid,.content-head,.about-origin,.form-layout,.color-band-grid,.cta-strip-grid,.portal-panel{
    grid-template-columns:1fr;
  }
  .form-intro{position:static}
  .payment-grid{grid-template-columns:1fr}
  .subhero-note{max-width:650px}
}
@media(max-width:700px){
  .rule-item{grid-template-columns:1fr;gap:5px}
  .rule-item .label{padding-top:0}
  .field-row{grid-template-columns:1fr}
  .form-card{padding:30px 23px}
  .color-band-stat{grid-template-columns:1fr 1fr}
  .portal-panel{padding:28px 23px}
}
@media(max-width:620px){
  .subhero{padding:72px 0 60px}
  .subhero h1{font-size:55px}
  .content-section{padding:68px 0}
  .color-band{padding:66px 0}
  .cta-strip{padding:68px 0}
  .color-band-stat{grid-template-columns:1fr}
  .utility-card{padding:38px 24px}
  .utility-card h1{font-size:41px}
}


/* =========================================================
   HOMEPAGE HERO — ABSTRACT DRIFTLESS RIVER
   ========================================================= */
.hero-river{
  min-height:720px;
  position:relative;
  display:flex;
  align-items:center;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 88% 30%,rgba(69,192,177,.08),transparent 30%),
    linear-gradient(180deg,#fffaf1 0%,#fffdf7 100%);
}
.hero-river .hero-grid{
  grid-template-columns:1.08fr .92fr;
  gap:62px;
  padding-top:70px;
  padding-bottom:70px;
}
.hero-soft-glow{
  width:380px;
  height:380px;
  right:-130px;
  top:120px;
  opacity:.08;
  filter:blur(72px);
  animation:none;
}
.river-art{
  min-height:560px;
  position:relative;
  isolation:isolate;
}
.river-contours,
.river-main{
  position:absolute;
  inset:-12px -22px -14px -8px;
  width:calc(100% + 30px);
  height:calc(100% + 26px);
  overflow:visible;
}
.river-contours{
  z-index:0;
}
.river-contours path{
  fill:none;
  stroke:#8acfc6;
  stroke-width:1.2;
  opacity:.42;
}
.river-main{
  z-index:1;
}
.river-shadow{
  fill:none;
  stroke:#0f5e5d;
  stroke-width:76;
  stroke-linecap:round;
  opacity:.10;
  transform:translate(8px,9px);
}
.river-body{
  fill:none;
  stroke:url(#heroRiverGradient);
  stroke-width:66;
  stroke-linecap:round;
  opacity:.93;
}
.river-highlight{
  fill:none;
  stroke:rgba(245,255,251,.66);
  stroke-width:6;
  stroke-linecap:round;
}
.river-label{
  position:absolute;
  right:5px;
  top:245px;
  z-index:5;
  padding:13px 16px 12px;
  background:rgba(255,250,241,.88);
  border-left:2px solid var(--rust);
  backdrop-filter:blur(5px);
}
.river-label span,
.river-label strong{
  display:block;
  text-transform:uppercase;
  letter-spacing:.13em;
}
.river-label span{
  font-size:8px;
  color:#697672;
  margin-bottom:3px;
}
.river-label strong{
  font-size:10px;
  color:var(--ink);
}

/* deliberately generic website fragments: proof of web design, not fake clients */
.web-fragment{
  position:absolute;
  z-index:4;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(18,61,60,.14);
  box-shadow:0 14px 34px rgba(18,61,60,.09);
  overflow:hidden;
  backdrop-filter:blur(4px);
}
.fragment-one{
  width:250px;
  height:160px;
  left:12px;
  top:84px;
  transform:rotate(-2deg);
  animation:fragmentFloatA 7s ease-in-out infinite alternate;
}
.fragment-two{
  width:218px;
  height:145px;
  left:60px;
  bottom:72px;
  transform:rotate(1.6deg);
  animation:fragmentFloatB 8s ease-in-out infinite alternate;
}
.fragment-three{
  width:182px;
  height:132px;
  right:8px;
  bottom:102px;
  transform:rotate(3deg);
  animation:fragmentFloatC 9s ease-in-out infinite alternate;
}
@keyframes fragmentFloatA{
  from{transform:translateY(0) rotate(-2deg)}
  to{transform:translateY(-4px) rotate(-1.4deg)}
}
@keyframes fragmentFloatB{
  from{transform:translateY(0) rotate(1.6deg)}
  to{transform:translateY(3px) rotate(1deg)}
}
@keyframes fragmentFloatC{
  from{transform:translateY(0) rotate(3deg)}
  to{transform:translateY(-3px) rotate(2.4deg)}
}
.fragment-bar{
  height:22px;
  display:flex;
  align-items:center;
  gap:4px;
  padding:0 9px;
  border-bottom:1px solid rgba(18,61,60,.08);
}
.fragment-bar i{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#8baca7;
}
.fragment-body{
  padding:15px 16px;
}
.fragment-body b{
  display:block;
  height:7px;
  width:78%;
  border-radius:10px;
  background:#d8e4e0;
  margin-bottom:7px;
}
.fragment-body b.short{width:58%}
.fragment-body b.shorter{width:42%}
.fragment-body b.headline{
  width:72%;
  height:11px;
  background:#244b4a;
}
.fragment-body b.small-head{width:58%}
.fragment-layout-a{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:14px;
  align-items:start;
}
.fragment-image{
  height:80px;
  background:
    linear-gradient(145deg,#d9eee8 0 48%,#b5d7cf 49% 64%,#8fc3ba 65% 100%);
}
.fragment-cta{
  display:block;
  width:42px;
  height:15px;
  margin-top:16px;
  background:#176e6b;
}
.fragment-cta.wide{
  width:62px;
  margin-top:17px;
}
.fragment-icons{
  display:flex;
  gap:10px;
  margin-top:22px;
}
.fragment-icons span{
  width:34px;
  height:34px;
  border-radius:50%;
  background:#e0f2ed;
  border:1px solid #c4ded7;
}
.fragment-icons span:nth-child(2){background:#d7eef4}
.fragment-icons span:nth-child(3){background:#f7e4d4}

/* remove old right-side design-map behavior if stale styles remain */
.hero-river .design-map,
.hero-river .river-path,
.hero-river .specimen,
.hero-river .map-label{
  display:none!important;
}

@media(max-width:1050px){
  .hero-river .hero-grid{
    grid-template-columns:1fr .82fr;
    gap:40px;
  }
  .river-art{
    min-height:515px;
  }
  .fragment-one{width:220px;height:148px}
  .fragment-two{width:195px;height:136px}
  .fragment-three{width:165px;height:122px}
}
@media(max-width:930px){
  .hero-river .hero-grid{
    grid-template-columns:1fr;
    gap:34px;
  }
  .hero-river{
    min-height:auto;
  }
  .river-art{
    min-height:420px;
    max-width:620px;
    width:100%;
    margin:0 auto;
  }
  .river-contours,
  .river-main{
    inset:-25px 0 -15px 0;
    width:100%;
  }
  .river-label{
    right:8%;
    top:178px;
  }
  .fragment-one{
    left:7%;
    top:45px;
  }
  .fragment-two{
    left:13%;
    bottom:36px;
  }
  .fragment-three{
    right:7%;
    bottom:58px;
  }
}
@media(max-width:620px){
  .hero-river .hero-grid{
    padding-top:48px;
    padding-bottom:42px;
  }
  .hero-river h1{
    font-size:56px;
  }
  .river-art{
    min-height:335px;
    margin-top:4px;
  }
  .river-main .river-body{
    stroke-width:54;
  }
  .river-main .river-shadow{
    stroke-width:62;
  }
  .fragment-one{
    width:170px;
    height:118px;
    left:2%;
    top:34px;
  }
  .fragment-two{
    width:150px;
    height:108px;
    left:9%;
    bottom:24px;
  }
  .fragment-three{
    width:132px;
    height:100px;
    right:1%;
    bottom:44px;
  }
  .fragment-layout-a{
    grid-template-columns:55px 1fr;
    gap:9px;
  }
  .fragment-image{height:55px}
  .fragment-body{padding:10px}
  .fragment-body b{height:5px;margin-bottom:5px}
  .fragment-body b.headline{height:8px}
  .fragment-icons{gap:6px;margin-top:14px}
  .fragment-icons span{width:24px;height:24px}
  .river-label{
    top:142px;
    right:2%;
    padding:9px 10px;
  }
}
@media(prefers-reduced-motion:reduce){
  .fragment-one,.fragment-two,.fragment-three{
    animation:none!important;
  }
}


/* =========================================================
   FINAL SITE CONSISTENCY PASS — MATCH APPROVED HOMEPAGE
   ========================================================= */

/* Final header / real Driftless Pages logo */
.approved-header{
  background:rgba(255,253,248,.98);
  border-bottom:1px solid rgba(18,61,60,.11);
}
.approved-header .nav{
  height:86px;
  grid-template-columns:300px 1fr auto;
}
.approved-brand{
  display:block;
  width:275px;
  height:64px;
  overflow:hidden;
}
.approved-brand img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:left center!important;
  border-radius:0!important;
}
.approved-header .nav-links{
  gap:27px;
}
.approved-header .nav-links a{
  font-family:"Newsreader",Georgia,serif;
  font-size:15px;
  font-weight:500;
  color:#173d3d;
}
.approved-header .nav-links a.active{
  color:#123d3c;
}
.approved-header .nav-links a.active::after{
  bottom:-14px;
  background:linear-gradient(90deg,#18a79f,#79dfb5);
}
.header-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:142px;
  padding:12px 20px;
  border-radius:999px;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:9px;
  font-weight:800;
  background:linear-gradient(135deg,#20afa7,#087773);
  color:#fff;
  box-shadow:0 7px 18px rgba(18,61,60,.10);
  transition:transform .18s ease,box-shadow .18s ease;
}
.header-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(18,61,60,.15);
}

/* Final homepage uses slightly stronger teal accents; keep subpages aligned */
.subhero h1 em{
  color:#0b9b99;
}
.subhero{
  background:
    radial-gradient(circle at 88% 16%,rgba(39,201,174,.11),transparent 25%),
    radial-gradient(circle at 8% 90%,rgba(157,233,92,.07),transparent 25%),
    linear-gradient(180deg,#fffdf8,#fffaf1);
}
.subhero-note{
  border-left-color:#79dfb5;
}
.form-card::before{
  background:linear-gradient(180deg,#18a79f,#79dfb5,#ed7041);
}
.submit-btn,
.action-btn{
  background:linear-gradient(135deg,#20afa7,#087773);
}
.dark .action-btn{
  background:linear-gradient(135deg,#82e85f,#66d6b6);
}
.secure-chip::before,
.proof-check{
  color:#158d74;
}

/* Mobile behavior synchronized with final homepage */
@media(max-width:1100px){
  .approved-header .nav{
    grid-template-columns:250px 1fr auto;
  }
  .approved-brand{
    width:235px;
  }
  .approved-header .nav-links{
    gap:18px;
  }
  .approved-header .nav-links a{
    font-size:13px;
  }
}
@media(max-width:930px){
  .approved-header .nav{
    grid-template-columns:1fr auto;
  }
  .approved-brand{
    width:230px;
    height:58px;
  }
  .approved-header .nav-links{
    display:none;
  }
  .approved-header .menu-toggle{
    display:flex;
  }
  .header-cta{
    display:none;
  }
}
@media(max-width:620px){
  .approved-header .nav{
    height:72px;
  }
  .approved-brand{
    width:185px;
    height:48px;
  }
}
