@font-face {
  font-family:Hanken;
  src:url('/assets/hanken-grotesk.ttf') format('truetype');
  font-weight:100 900;
  font-display:swap
}
:root {
  --forest:#153e35;
  --lime:#d6ef73;
  --paper:#f6f7ed;
  --ink:#172a24;
  --muted:#53655b;
  --line:#d2dacd;
  --white:#fff;
  --radius:12px;
  color-scheme:light
}
*,*::before,*::after {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:110px
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Hanken,system-ui,sans-serif;
  font-size:17px;
  line-height:1.55
}
body,button,input,textarea,select {
  font-family:Hanken,system-ui,sans-serif
}
h1,h2,h3,p,figure {
  margin:0
}
h1,h2,h3 {
  text-wrap:balance
}
h1 {
  font-size:clamp(2.6rem,5.6vw,5.1rem);
  font-weight:750;
  line-height:.99;
  letter-spacing:-.04em
}
h2 {
  font-size:clamp(2rem,4vw,3.6rem);
  font-weight:700;
  line-height:1.07;
  letter-spacing:-.035em
}
h3 {
  font-size:1.35rem;
  line-height:1.2;
  letter-spacing:-.02em
}
p {
  max-width:70ch
}
a {
  color:inherit;
  text-underline-offset:.2em
}
button,a,input,select,textarea {
  touch-action:manipulation
}
button {
  font-size:inherit
}
img {
  display:block;
  max-width:100%;
  height:auto
}
button {
  cursor:pointer
}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline:3px solid #7b47c7;
  outline-offset:5px
}
button:disabled {
  cursor:not-allowed;
  opacity:.55
}
.skip-link {
  position:fixed;
  top:8px;
  left:8px;
  transform:translateY(-160%);
  z-index:1000;
  background:var(--forest);
  color:white;
  padding:12px 18px
}
.skip-link:focus {
  transform:none
}
.site-header {
  max-width:1440px;
  margin:auto;
  padding:24px 5%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px
}
.brand {
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  font-size:26px;
  font-weight:750;
  letter-spacing:-1px;
  white-space:nowrap
}
.brand img {
  width:36px;
  height:36px
}
.site-nav {
  display:flex;
  gap:30px;
  align-items:center;
  font-size:15px;
  font-weight:600
}
.site-nav a {
  text-decoration:none
}
.site-nav a:hover {
  text-decoration:underline
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  background:var(--forest);
  color:white;
  border:1px solid transparent;
  border-radius:6px;
  padding:15px 22px;
  text-decoration:none;
  font-weight:650;
  font-size:16px;
  line-height:1.25;
  min-height:50px
}
.button:hover {
  background:#234f43;
  text-decoration:none
}
.button--small {
  min-height:44px;
  padding:11px 17px;
  font-size:14px
}
.button--light {
  background:var(--lime);
  color:var(--forest)
}
.button--light:hover {
  background:#e5f4a9
}
.button--outline {
  border-color:var(--forest);
  background:transparent;
  color:var(--forest)
}
.button--outline:hover {
  background:#e8eddf
}
.arrow {
  font-size:22px;
  font-weight:400;
  line-height:1
}
.wrap {
  max-width:1296px;
  margin:auto;
  width:90%
}
.hero {
  background:var(--lime);
  padding:62px 0 70px
}
.hero-grid {
  display:grid;
  grid-template-columns:minmax(290px,.78fr) minmax(0,1.25fr);
  gap:6%;
  align-items:center
}
.hero-copy h1 {
  max-width:9ch
}
.hero-copy>p {
  font-size:19px;
  line-height:1.5;
  margin:26px 0;
  max-width:36ch
}
.hero-copy .price-line {
  font-size:14px;
  margin:15px 0 0;
  max-width:none
}
.hero-copy .secondary-link {
  display:inline-flex;
  margin-top:21px;
  font-size:15px;
  font-weight:600
}
.preview-shell {
  min-width:0;
  background:white;
  border-radius:14px;
  padding:24px
}
.preview-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:20px;
  gap:16px
}
.sample-brand {
  font-size:21px;
  letter-spacing:-.025em;
  font-weight:650
}
.sample-note {
  color:var(--muted);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.07em
}
.preview-stage {
  min-height:315px;
  max-height:480px;
  overflow:auto;
  scrollbar-width:thin;
  overscroll-behavior:contain
}
.preview-stage .feedgrid-container {
  min-width:0;
  padding:0
}
.preview-caption {
  font-size:12px;
  color:var(--muted);
  margin-top:17px;
  max-width:100%
}
.preview-actions {
  margin-top:22px
}
.layout-tabs {
  display:flex;
  gap:6px;
  flex-wrap:wrap
}
.layout-tabs button {
  background:transparent;
  border:1px solid #b0c45d;
  color:var(--forest);
  padding:8px 12px;
  min-height:42px;
  border-radius:5px;
  font-weight:600;
  font-size:13px
}
.layout-tabs button[aria-pressed=true] {
  background:var(--forest);
  color:white;
  border-color:var(--forest)
}
.layout-tabs button:hover {
  border-color:var(--forest)
}
.layout-description {
  font-size:14px;
  min-height:42px;
  margin-top:12px;
  max-width:58ch
}
.intro-strip {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
  padding:28px 0;
  border-bottom:1px solid var(--line);
  font-size:15px
}
.intro-strip p {
  max-width:53ch
}
.intro-strip a {
  font-weight:650;
  white-space:nowrap
}
.section {
  padding:100px 0
}
.section-heading {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8%;
  align-items:end;
  margin-bottom:42px
}
.section-heading p {
  color:var(--muted);
  font-size:18px
}
.shop-post {
  display:grid;
  grid-template-columns:1fr .88fr;
  gap:9%;
  align-items:center
}
.tagged-photo {
  position:relative;
  max-width:570px;
  background:#edece3;
  border-radius:12px;
  overflow:hidden
}
.tagged-photo>img {
  aspect-ratio:1.08;
  object-fit:cover;
  width:100%
}
.product-tag {
  position:absolute;
  left:7%;
  right:7%;
  bottom:7%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  background:white;
  padding:18px 20px;
  border-radius:8px;
  font-size:15px
}
.product-tag span {
  font-weight:650
}
.product-tag small {
  display:block;
  color:var(--muted);
  font-weight:400;
  margin-top:2px
}
.product-tag button {
  border:0;
  background:var(--forest);
  color:#fff;
  padding:10px 15px;
  border-radius:4px;
  font-size:13px;
  min-height:42px
}
.section-copy h2 {
  max-width:12ch
}
.section-copy p {
  margin-top:24px;
  color:var(--muted);
  font-size:18px
}
.feature-lines {
  padding:0;
  margin:28px 0;
  list-style:none
}
.feature-lines li {
  padding:14px 0;
  border-bottom:1px solid var(--line);
  font-size:15px
}
.feature-lines li::before {
  content:'✓';
  margin-right:12px;
  color:var(--forest)
}
.section-copy a {
  font-weight:650;
  font-size:15px
}
.setup {
  background:#e7ece0
}
.setup-list {
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:36px;
  padding:0;
  margin:0;
  counter-reset:setup
}
.setup-list li {
  counter-increment:setup;
  border-top:1px solid #aab6a5;
  padding-top:24px
}
.setup-list li::before {
  content:counter(setup);
  display:block;
  font-size:40px;
  line-height:1;
  margin-bottom:30px;
  font-weight:500;
  color:var(--forest)
}
.setup-list p {
  color:var(--muted);
  margin-top:16px;
  font-size:16px
}
.setup-help {
  font-size:14px;
  margin-top:35px;
  color:var(--muted)
}
.video-section {
  padding-top:70px
}
.video-section[hidden] {
  display:none
}
.video-frame {
  width:100%;
  aspect-ratio:16/9;
  background:var(--forest);
  border-radius:12px;
  overflow:hidden;
  margin-top:26px
}
.video-frame video {
  width:100%;
  height:100%;
  display:block
}
.pricing {
  background:var(--forest);
  color:white
}
.price-layout {
  display:grid;
  grid-template-columns:.8fr 1fr;
  gap:14%;
  align-items:start
}
.price-layout h2 {
  max-width:10ch
}
.price-layout>div>p {
  color:#c4d6c8;
  margin-top:22px
}
.price {
  display:flex;
  align-items:baseline;
  gap:10px;
  margin:24px 0 4px
}
.price strong {
  font-size:80px;
  font-weight:650;
  line-height:1;
  letter-spacing:-.04em
}
.price span {
  font-size:15px;
  color:#dbe9dc
}
.pricing .price-note {
  font-size:14px;
  color:#dbe9dc;
  margin:12px 0 26px
}
.pricing-list {
  list-style:none;
  padding:0;
  margin:0
}
.pricing-list li {
  padding:17px 0;
  border-bottom:1px solid #486359;
  font-size:16px
}
.pricing-list li:first-child {
  border-top:1px solid #486359
}
.pricing-list strong {
  display:block;
  font-weight:600
}
.pricing-list span {
  font-size:14px;
  color:#c4d6c8
}
.pricing-fine {
  font-size:13px;
  color:#c4d6c8;
  margin-top:26px
}
.maker {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:9%;
  align-items:center
}
.maker img {
  width:100%;
  aspect-ratio:1.28;
  object-fit:cover;
  object-position:top;
  border-radius:12px
}
.maker p {
  margin-top:24px;
  color:var(--muted);
  font-size:18px
}
.maker .text-link {
  display:inline-block;
  margin-top:25px;
  font-size:15px;
  font-weight:650
}
.faq-wrap {
  max-width:850px;
  margin:auto
}
.faq h2 {
  margin-bottom:34px
}
.faq details {
  border-top:1px solid var(--line)
}
.faq details:last-of-type {
  border-bottom:1px solid var(--line)
}
.faq summary {
  cursor:pointer;
  list-style:none;
  position:relative;
  font-size:18px;
  font-weight:600;
  padding:23px 42px 23px 0
}
.faq summary::-webkit-details-marker {
  display:none
}
.faq summary::after {
  content:'+';
  position:absolute;
  right:5px;
  top:21px;
  font-size:24px;
  font-weight:400
}
.faq details[open] summary::after {
  content:'−'
}
.faq details p {
  padding:0 30px 24px 0;
  color:var(--muted);
  font-size:16px
}
.last-call {
  padding:58px 0 70px;
  text-align:center
}
.last-call h2 {
  font-size:clamp(2rem,4vw,3.4rem);
  max-width:15ch;
  margin:0 auto 26px
}
.last-call p {
  margin:15px auto 0;
  font-size:14px;
  color:var(--muted)
}
.site-footer {
  background:var(--forest);
  color:white;
  padding:48px 0 30px
}
.footer-top {
  display:flex;
  justify-content:space-between;
  gap:30px;
  align-items:flex-start
}
.site-footer .brand img {
  background:var(--lime)
}
.footer-links {
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  font-size:14px;
  max-width:580px;
  justify-content:flex-end
}
.footer-links a {
  text-decoration:none
}
.footer-links a:hover {
  text-decoration:underline
}
.footer-bottom {
  border-top:1px solid #486359;
  margin-top:40px;
  padding-top:22px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  color:#c4d6c8;
  font-size:12px
}
.footer-bottom p {
  max-width:none
}
.reading main {
  max-width:960px;
  width:90%;
  margin:55px auto 90px
}
.reading article {
  max-width:790px
}
.reading main h1 {
  font-size:clamp(2.4rem,5vw,4.4rem);
  max-width:20ch;
  margin-bottom:24px;
  line-height:1.05
}
.reading main h2 {
  font-size:2rem;
  margin:50px 0 20px
}
.reading main h3 {
  margin:30px 0 14px
}
.reading main p {
  margin:18px 0;
  color:var(--muted)
}
.reading main li {
  margin:9px 0
}
.reading .lead,.reading .dek,.reading .subtitle {
  font-size:20px
}
.reading .meta {
  font-size:13px;
  color:var(--muted)
}
.reading figure {
  margin:35px 0
}
.reading figure img {
  border-radius:12px;
  width:100%
}
.reading figcaption {
  font-size:13px;
  color:var(--muted);
  margin-top:10px
}
.reading table {
  border-collapse:collapse;
  width:100%;
  font-size:15px;
  margin:25px 0
}
.reading th,.reading td {
  text-align:left;
  padding:15px 12px;
  border-bottom:1px solid var(--line);
  vertical-align:top
}
.reading th {
  background:#e7ece0
}
.table-scroll {
  overflow-x:auto
}
.reading .cta-block {
  margin-top:48px;
  background:var(--lime);
  border-radius:12px;
  padding:30px
}
.reading .cta-block h2 {
  margin:0 0 14px
}
.reading .cta-block p {
  color:var(--forest)
}
.reading .article-list {
  list-style:none;
  padding:0;
  max-width:840px
}
.article-list li {
  border-top:1px solid var(--line);
  margin:0;
  padding:28px 0
}
.article-list a {
  text-decoration:none;
  display:block
}
.article-list h2 {
  margin:0!important;
  font-size:1.65rem!important
}
.article-list p {
  margin:9px 0 0!important;
  font-size:16px
}
.article-list a:hover h2 {
  text-decoration:underline
}
.reading .badge {
  display:none
}
.reading .form-card {
  max-width:760px
}
.reading .form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px
}
.reading label {
  display:block;
  font-weight:600;
  margin-bottom:8px;
  font-size:15px
}
.reading .form-group {
  margin:22px 0
}
.reading input,.reading textarea,.reading select {
  width:100%;
  padding:13px 14px;
  border:1px solid #a6b5a8;
  border-radius:5px;
  font-size:16px;
  background:white;
  color:var(--ink)
}
.reading textarea {
  min-height:150px;
  resize:vertical
}
.reading .optional {
  font-weight:400;
  color:var(--muted)
}
.reading button[type=submit] {
  min-height:50px;
  padding:13px 22px;
  color:white;
  background:var(--forest);
  border:0;
  border-radius:5px;
  font-weight:600;
  font-size:16px
}
.reading .error-banner,.reading .success-state {
  display:none
}
.reading .error-banner {
  padding:18px;
  background:#fff0e7;
  color:#743618;
  border-radius:8px
}
.reading .success-state {
  padding:30px;
  background:#e7ece0;
  border-radius:12px
}
.reading .success-icon {
  display:none
}
.reading .honeypot,.reading .hp-field {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden
}
.reading blockquote {
  border:0;
  margin:30px 0;
  padding:25px;
  background:#e7ece0;
  border-radius:10px
}
.reading .muted {
  color:var(--muted)
}
.preview-loading {
  padding:60px 0;
  text-align:center;
  font-size:14px
}
.feedgrid-lightbox {
  font-family:Hanken,system-ui,sans-serif
}
.preview-shell .feedgrid-item {
  border-radius:6px!important
}
.feedgrid-powered {
  display:none!important
}
@media(min-width:1500px) {
  .hero {
  padding:80px 0
}
.preview-stage {
  max-height:540px
}
}
@media(max-width:1000px) {
  .site-nav {
  gap:20px
}
.hero-grid {
  gap:4%;
  grid-template-columns:.85fr 1.15fr
}
.hero-copy h1 {
  font-size:clamp(2.7rem,5.8vw,4rem)
}
.preview-shell {
  padding:18px
}
.preview-stage {
  min-height:260px
}
.sample-note {
  display:none
}
.price-layout {
  gap:8%
}
.section {
  padding:76px 0
}
.shop-post,.maker {
  gap:6%
}
.setup-list {
  gap:24px
}
.price strong {
  font-size:70px
}
}
@media(max-width:740px) {
  html {
  scroll-padding-top:24px
}
.site-header {
  padding:18px 5%;
  gap:15px
}
.brand {
  font-size:23px
}
.brand img {
  width:31px;
  height:31px
}
.site-nav {
  gap:13px
}
.site-nav .nav-secondary {
  display:none
}
.site-nav .button {
  padding:10px 13px
}
.hero {
  padding:42px 0 44px
}
.hero-grid {
  display:flex;
  flex-direction:column;
  gap:34px;
  align-items:stretch
}
.hero-copy h1 {
  max-width:11ch;
  font-size:clamp(2.8rem,11.7vw,4.6rem)
}
.hero-copy>p {
  font-size:18px;
  max-width:35ch;
  margin:22px 0
}
.hero-copy .secondary-link {
  display:none
}
.hero-copy .price-line {
  font-size:13px;
  margin:12px 0 0
}
.preview-shell {
  padding:17px
}
.preview-header {
  margin-bottom:16px
}
.preview-stage {
  max-height:390px;
  min-height:250px
}
.sample-note {
  display:block;
  font-size:9px
}
.preview-caption {
  font-size:11px
}
.preview-actions {
  margin-top:18px
}
.layout-tabs {
  gap:7px
}
.layout-tabs button {
  font-size:13px;
  padding:8px 11px;
  min-height:43px
}
.layout-description {
  font-size:13px;
  min-height:40px
}
.intro-strip {
  display:block;
  font-size:14px;
  padding:24px 0
}
.intro-strip a {
  display:inline-block;
  margin-top:12px
}
.section {
  padding:60px 0
}
.section-heading,.shop-post,.price-layout,.maker {
  grid-template-columns:1fr;
  gap:30px
}
.section-heading {
  margin-bottom:30px
}
.section-heading p,.section-copy p,.maker p {
  font-size:17px
}
.section-copy h2 {
  max-width:15ch
}
.shop-post .section-copy {
  order:-1
}
.setup-list {
  display:block
}
.setup-list li {
  margin-bottom:28px;
  padding-left:55px;
  position:relative;
  padding-top:20px
}
.setup-list li::before {
  position:absolute;
  left:0;
  top:22px;
  font-size:31px
}
.setup-list p {
  margin-top:12px
}
.setup-list h3 {
  font-size:1.2rem
}
.setup-help {
  margin-top:10px
}
.price-layout h2 {
  max-width:13ch
}
.pricing .price-note {
  margin-bottom:22px
}
.price strong {
  font-size:76px
}
.pricing-list {
  margin-top:10px
}
.pricing-list li {
  padding:15px 0
}
.maker img {
  aspect-ratio:1.1
}
.faq summary {
  font-size:16px;
  padding:20px 38px 20px 0
}
.faq summary::after {
  top:18px
}
.faq details p {
  font-size:15px;
  padding-right:8px
}
.last-call {
  padding:30px 0 55px
}
.footer-top {
  display:block
}
.footer-links {
  justify-content:flex-start;
  margin-top:30px;
  gap:18px;
  font-size:13px
}
.footer-bottom {
  display:block;
  margin-top:32px
}
.footer-bottom p+p {
  margin-top:8px
}
.reading main {
  margin:35px auto 60px
}
.reading main h1 {
  font-size:2.8rem
}
.reading main h2 {
  font-size:1.8rem
}
.reading .lead,.reading .dek,.reading .subtitle {
  font-size:18px
}
.reading .form-row {
  grid-template-columns:1fr;
  gap:0
}
.reading table {
  font-size:13px
}
.reading th,.reading td {
  padding:12px 8px
}
.reading .cta-block {
  padding:24px
}
.product-tag {
  padding:14px;
  gap:12px;
  font-size:13px
}
.product-tag button {
  font-size:12px
}
}
.feedgrid-lightbox:not(.gf-open) {
  visibility:hidden
}
@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto
}
*,*::before,*::after {
  animation:none!important;
  transition:none!important
}
}