/* GoSnaggle public pages and guides. */
:root {
  --green: #138a36;
  --green-dark: #0b6f2a;
  --green-soft: #eaf7ee;
  --navy: #071c2f;
  --text: #263543;
  --muted: #65727e;
  --cream: #fffaf0;
  --border: #dfe8df;
  --white: #ffffff;
  --gold: #f3b436;
  --blue: #226d8c;
  --error: #a2332f;
  --error-soft: #fff0ef;
  --shadow: 0 16px 38px rgba(14, 60, 34, .1);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
  background: #f7fff8;
  line-height: 1.62;
}

a {
  color: var(--green-dark);
}

img {
  display: block;
  max-width: 100%;
}

.container {
  width: min(1020px, calc(100% - 36px));
  margin: 0 auto;
}

.header {
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid var(--border);
}

.nav {
  min-height: 96px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.logo {
  display: inline-flex;
  align-items: center;
}

.logo img {
  height: 70px;
  width: auto;
}

.nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
}

.nav-links a {
  color: var(--muted);
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
}

.nav-links a:hover {
  color: var(--green);
}

.hero {
  padding: 58px 0 34px;
}

.eyebrow {
  color: var(--green-dark);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}

h1 {
  max-width: 840px;
  margin: 10px 0 18px;
  color: var(--navy);
  font-size: clamp(38px, 5.2vw, 62px);
  line-height: 1.02;
}

.lead {
  max-width: 760px;
  margin: 0;
  color: var(--text);
  font-size: 20px;
}

.section {
  padding: 36px 0;
}

.content-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 22px;
  box-shadow: var(--shadow);
  padding: clamp(24px, 4vw, 42px);
}

.content-card h2 {
  color: var(--navy);
  font-size: 30px;
  line-height: 1.15;
  margin: 34px 0 12px;
}

.content-card h2:first-child {
  margin-top: 0;
}

.content-card h3 {
  color: var(--navy);
  font-size: 21px;
  line-height: 1.25;
  margin: 26px 0 8px;
}

.content-card p {
  margin: 0 0 15px;
}

.content-card ul,
.content-card ol {
  margin: 0 0 18px 22px;
  padding: 0;
}

.content-card li {
  margin-bottom: 8px;
}

.callout {
  margin: 24px 0;
  padding: 18px;
  border: 1px solid rgba(19, 138, 54, .22);
  border-radius: 16px;
  background: var(--green-soft);
}

.source-list {
  display: grid;
  gap: 8px;
  margin-top: 20px;
}

.guide-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}

.guide-card {
  display: flex;
  min-height: 190px;
  flex-direction: column;
  justify-content: space-between;
  padding: 22px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--white);
  color: inherit;
  text-decoration: none;
  box-shadow: 0 10px 26px rgba(14, 60, 34, .06);
}

.guide-card:hover {
  border-color: rgba(19, 138, 54, .45);
}

.guide-card span {
  color: var(--green-dark);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.guide-card h2 {
  margin: 8px 0 10px;
  color: var(--navy);
  font-size: 24px;
  line-height: 1.18;
}

.guide-card p {
  margin: 0;
  color: var(--text);
}

.footer {
  margin-top: 36px;
  padding: 24px 0;
  border-top: 1px solid var(--border);
  background: #f3f8f4;
}

.footer-inner {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
}

.footer,
.footer a {
  color: var(--muted);
  font-size: 14px;
}

.footer a {
  text-decoration: none;
}

@media (max-width: 720px) {
  .nav,
  .footer-inner {
    flex-direction: column;
    align-items: flex-start;
    padding: 18px 0;
  }

  .logo img {
    height: 58px;
  }

  .guide-grid {
    grid-template-columns: 1fr;
  }
}


/* Home page */
body.public-home {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--navy);
  background: #f7fff8;
}

body.public-home img {
  max-width: 100%;
  display: block;
}

body.public-home a {
  color: inherit;
}

body.public-home .page {
  min-height: 100vh;
  overflow: hidden;
}

body.public-home .container {
  width: min(1120px, calc(100% - 36px));
  margin: 0 auto;
}

body.public-home .hero-bg {
  background:
    linear-gradient(90deg, rgba(248,255,248,.97) 0%, rgba(248,255,248,.9) 43%, rgba(248,255,248,.18) 74%),
    url('/images/gosnaggle-hero-bg2.webp');
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  padding-bottom: 54px;
}

body.public-home .header {
  padding: 30px 0 10px;
}

body.public-home .nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

body.public-home .logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  text-decoration: none;
}

body.public-home .logo-img {
  height: 78px;
  width: auto;
  display: block;
  max-width: none;
}

body.public-home .nav-actions {
  display: flex;
  align-items: center;
  gap: 18px;
}

body.public-home .nav-login {
  color: var(--muted);
  text-decoration: none;
  font-weight: 800;
  font-size: 14px;
}

body.public-home .nav-login:hover {
  color: var(--green);
}

body.public-home .nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 12px;
  background: var(--green);
  color: white;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 12px 25px rgba(19,138,54,.2);
}

body.public-home .hero {
  max-width: 690px;
  padding-top: 34px;
}

body.public-home .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(19, 138, 54, .2);
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  color: var(--green-dark);
  font-size: 14px;
  font-weight: 800;
  margin-bottom: 18px;
}

body.public-home h1 {
  font-size: clamp(44px, 5.4vw, 70px);
  line-height: 1.02;
  margin: 0 0 22px;
  color: var(--navy);
}

body.public-home h1 span {
  display: block;
  color: var(--green);
}

body.public-home .subhead {
  max-width: 620px;
  font-size: 22px;
  line-height: 1.55;
  color: var(--text);
  margin: 0 0 28px;
}

body.public-home .hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
}

body.public-home .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  padding: 0 30px;
  border-radius: 12px;
  border: 0;
  background: linear-gradient(135deg, var(--green), var(--green-dark));
  color: white;
  font-size: 18px;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 0 12px 25px rgba(19,138,54,.22);
}

body.public-home .btn-secondary {
  background: rgba(255,255,255,.92);
  color: var(--green-dark);
  border: 1px solid var(--border);
  box-shadow: none;
}

body.public-home .trial-note {
  margin-top: 14px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.45;
}

body.public-home .trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 24px;
}

body.public-home .trust-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.8);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 14px;
  font-weight: 800;
}

body.public-home .check {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 20px;
  background: var(--green-soft);
}

body.public-home .check::before {
  content: "";
  width: 8px;
  height: 4px;
  border-left: 2px solid var(--green);
  border-bottom: 2px solid var(--green);
  transform: rotate(-45deg) translate(1px, -1px);
}

body.public-home .section {
  padding: 58px 0;
}

body.public-home .section-soft {
  background: linear-gradient(135deg, #f4fff6 0%, #fffaf0 100%);
}

body.public-home .section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 24px;
}

body.public-home .section-head h2 {
  font-size: clamp(32px, 4vw, 46px);
  line-height: 1.05;
  margin: 0;
}

body.public-home .section-head p {
  max-width: 470px;
  margin: 0;
  color: var(--text);
  font-size: 18px;
  line-height: 1.45;
}

body.public-home .wins-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

body.public-home .win-card {
  background: rgba(255,255,255,.95);
  border: 1px solid var(--border);
  border-radius: 24px;
  box-shadow: var(--shadow);
  padding: 22px;
  position: relative;
  overflow: hidden;
}

body.public-home .win-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 7px;
  background: var(--green);
}

body.public-home .win-card.gold::before {
  background: var(--gold);
}

body.public-home .win-card.blue::before {
  background: var(--blue);
}

body.public-home .win-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

body.public-home .save-badge, body.public-home .dollar-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 900;
}

body.public-home .save-badge {
  background: var(--green-soft);
  color: var(--green-dark);
}

body.public-home .dollar-badge {
  background: #fff7d7;
  color: #7b4f00;
  border: 1px solid rgba(232, 178, 74, .42);
}

body.public-home .product-visual {
  height: 150px;
  margin: 0 0 16px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(223,232,223,.78);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

body.public-home .product-visual img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

body.public-home .win-copy {
  min-height: 88px;
  margin: 0 0 16px;
}

body.public-home .win-card h3 {
  margin: 0 0 6px;
  font-size: 22px;
  line-height: 1.25;
}

body.public-home .win-details {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.35;
}

body.public-home .price-list {
  display: grid;
  gap: 8px;
  margin: 0 0 16px;
}

body.public-home .price-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--border);
  color: var(--text);
  font-size: 15px;
}

body.public-home .price-row span {
  line-height: 1.35;
}

body.public-home .price-row strong {
  color: var(--navy);
  white-space: nowrap;
}

body.public-home .final-price {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

body.public-home .final-price > div {
  display: flex;
  min-width: 0;
  min-height: 76px;
  flex-direction: column;
  justify-content: center;
  padding: 13px 12px;
  border-radius: 16px;
  background: #f8faf8;
  border: 1px solid var(--border);
}

body.public-home .final-price > div + div {
  background: var(--green-soft);
  border-color: rgba(25, 135, 84, .22);
}

body.public-home .final-price span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  line-height: 1;
  margin-bottom: 6px;
}

body.public-home .final-price strong {
  display: block;
  color: var(--navy);
  font-size: 29px;
  line-height: 1;
  white-space: nowrap;
}

body.public-home .final-price > div + div strong {
  color: var(--green-dark);
}

body.public-home .fine-print {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  margin: 20px 0 0;
}

body.public-home .offer-card {
  display: grid;
  grid-template-columns: 150px 1fr auto;
  gap: 28px;
  align-items: center;
  padding: 34px;
  border-radius: 28px;
  background: rgba(255,255,255,.94);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
}

body.public-home .offer-image {
  width: 145px;
  height: auto;
  object-fit: contain;
}

body.public-home .offer-card h2 {
  font-size: clamp(31px, 4vw, 44px);
  line-height: 1.08;
  margin: 0 0 10px;
}

body.public-home .offer-card p {
  margin: 0;
  color: var(--text);
  font-size: 19px;
  line-height: 1.5;
}

body.public-home .price-lock {
  display: grid;
  gap: 5px;
  min-width: 172px;
  padding: 18px;
  border-radius: 18px;
  background: var(--green-soft);
  text-align: center;
}

body.public-home .price-lock span {
  color: var(--green-dark);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

body.public-home .price-lock strong {
  font-size: 34px;
  line-height: 1;
}

body.public-home .definition-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}

body.public-home .definition-card, body.public-home .faq-card {
  border: 1px solid var(--border);
  border-radius: 22px;
  background: white;
  padding: 26px;
  box-shadow: 0 12px 30px rgba(14, 60, 34, .06);
}

body.public-home .definition-card h2, body.public-home .faq-card h2 {
  font-size: 30px;
  line-height: 1.1;
  margin: 0 0 14px;
}

body.public-home .definition-card p, body.public-home .faq-card p {
  color: var(--text);
  font-size: 17px;
  line-height: 1.55;
  margin: 0;
}

body.public-home .definition-card p + p {
  margin-top: 12px;
}

body.public-home .faq-list {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

body.public-home .faq-item {
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

body.public-home .faq-item h3 {
  font-size: 18px;
  line-height: 1.25;
  margin: 0 0 8px;
}

body.public-home .faq-item p {
  font-size: 16px;
}

body.public-home .steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

body.public-home .step {
  padding: 24px 18px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: white;
  text-align: center;
}

body.public-home .step img {
  width: 70px;
  height: 70px;
  object-fit: contain;
  margin: 0 auto 12px;
}

body.public-home .step h3 {
  margin: 0 0 8px;
  font-size: 18px;
}

body.public-home .step p {
  margin: 0;
  color: var(--text);
  line-height: 1.45;
  font-size: 15px;
}

body.public-home .cta-panel {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 28px;
  align-items: center;
  padding: 38px;
  border-radius: 28px;
  background: var(--navy);
  color: white;
}

body.public-home .cta-panel h2 {
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.05;
  margin: 0 0 12px;
}

body.public-home .cta-panel p {
  color: rgba(255,255,255,.82);
  font-size: 19px;
  line-height: 1.45;
  margin: 0;
}

body.public-home .cta-panel .btn {
  background: white;
  color: var(--green-dark);
  box-shadow: none;
}

body.public-home .footer {
  background: #f3f8f4;
  border-top: 1px solid var(--border);
  padding: 24px 0;
}

body.public-home .footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}

body.public-home .footer-copyright {
  color: var(--muted);
  font-size: 14px;
}

body.public-home .footer-links {
  display: flex;
  gap: 24px;
}

body.public-home .footer-links a {
  color: var(--muted);
  text-decoration: none;
  font-size: 14px;
  transition: color .2s ease;
}

body.public-home .footer-links a:hover {
  color: var(--green);
}
@media (max-width: 940px) {
  .hero-bg {
    background:
      linear-gradient(180deg, rgba(248,255,248,.98), rgba(248,255,248,.92)),
      url('/images/gosnaggle-hero-bg2.webp');
    background-size: cover;
    background-position: center right;
  }

  body.public-home .wins-grid, body.public-home .steps {
    grid-template-columns: repeat(2, 1fr);
  }

  body.public-home .offer-card, body.public-home .definition-grid, body.public-home .cta-panel {
    grid-template-columns: 1fr;
    text-align: center;
  }

  body.public-home .offer-image {
    margin: 0 auto;
  }

  body.public-home .price-lock {
    width: min(240px, 100%);
    margin: 0 auto;
  }
}
@media (max-width: 620px) {
  .header {
    padding-top: 22px;
  }

  body.public-home .nav {
    align-items: flex-start;
  }

  body.public-home .logo-img {
    height: 62px;
  }

  body.public-home .nav-actions {
  display: flex;
  align-items: center;
  gap: 18px;
}

body.public-home .nav-login {
  color: var(--muted);
  text-decoration: none;
  font-weight: 800;
  font-size: 14px;
}

body.public-home .nav-login:hover {
  color: var(--green);
}

body.public-home .nav-cta {
    display: none;
  }

  body.public-home .hero {
    padding-top: 34px;
  }

  body.public-home h1 {
    font-size: 45px;
  }

  body.public-home .subhead {
    font-size: 19px;
  }

  body.public-home .hero-actions, body.public-home .hero-actions .btn {
    width: 100%;
  }

  body.public-home .hero-actions .btn {
    padding-inline: 18px;
  }

  body.public-home .section {
    padding: 44px 0;
  }

  body.public-home .section-head {
    display: block;
  }

  body.public-home .section-head p {
    margin-top: 12px;
    font-size: 16px;
  }

  body.public-home .wins-grid, body.public-home .steps {
    grid-template-columns: 1fr;
  }

  body.public-home .win-card h3 {
    min-height: auto;
  }

  body.public-home .product-visual {
    height: 180px;
  }

  body.public-home .offer-card, body.public-home .cta-panel {
    padding: 28px 20px;
  }

  body.public-home .footer-inner {
    flex-direction: column;
    text-align: center;
    gap: 12px;
  }
}


/* Trial signup */
body.public-signup {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--navy);
  background:
    linear-gradient(90deg, rgba(248,255,248,.98) 0%, rgba(248,255,248,.9) 48%, rgba(248,255,248,.22) 78%),
    url('/images/gosnaggle-hero-bg2.webp');
  background-size: cover;
  background-position: center right;
  background-attachment: fixed;
}

body.public-signup img {
  max-width: 100%;
  display: block;
}

body.public-signup a {
  color: var(--green-dark);
}

body.public-signup .container {
  width: min(1080px, calc(100% - 36px));
  margin: 0 auto;
}

body.public-signup .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

body.public-signup .header-login {
  color: var(--muted);
  text-decoration: none;
  font-weight: 800;
}

body.public-signup .header-login:hover {
  color: var(--green-dark);
}

body.public-signup .login-note {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
  margin: -2px 0 4px;
}

body.public-signup .header {
  padding: 30px 0 10px;
}

body.public-signup .logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

body.public-signup .logo-img {
  height: 78px;
  width: auto;
}

body.public-signup .main {
  padding: 32px 0 58px;
}

body.public-signup .layout {
  display: grid;
  grid-template-columns: .86fr 1.14fr;
  gap: 34px;
  align-items: start;
}

body.public-signup .intro {
  padding-top: 28px;
}

body.public-signup .eyebrow {
  display: inline-flex;
  padding: 8px 12px;
  border: 1px solid rgba(19, 138, 54, .2);
  border-radius: 999px;
  background: rgba(255,255,255,.8);
  color: var(--green-dark);
  font-size: 14px;
  font-weight: 800;
  margin-bottom: 18px;
}

body.public-signup h1 {
  font-size: clamp(42px, 5vw, 64px);
  line-height: 1;
  margin: 0 0 20px;
}

body.public-signup .intro p {
  color: var(--text);
  font-size: 21px;
  line-height: 1.5;
  margin: 0 0 24px;
}

body.public-signup .summary {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

body.public-signup .summary-row {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-weight: 800;
}

body.public-signup .check {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--green-soft);
  flex: 0 0 22px;
}

body.public-signup .check::before {
  content: "";
  width: 9px;
  height: 5px;
  border-left: 2px solid var(--green);
  border-bottom: 2px solid var(--green);
  transform: rotate(-45deg) translate(1px, -1px);
}

body.public-signup .signup-card {
  background: rgba(255,255,255,.95);
  border: 1px solid var(--border);
  border-radius: 28px;
  box-shadow: var(--shadow);
  padding: 34px;
}

body.public-signup .card-head {
  display: grid;
  grid-template-columns: 82px 1fr;
  gap: 18px;
  align-items: center;
  margin-bottom: 24px;
}

body.public-signup .card-head img {
  width: 82px;
  height: auto;
}

body.public-signup .card-head h2 {
  font-size: 31px;
  line-height: 1.1;
  margin: 0 0 6px;
}

body.public-signup .card-head p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.4;
  margin: 0;
}

body.public-signup .form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

body.public-signup .field {
  display: grid;
  gap: 7px;
}

body.public-signup .field-full {
  grid-column: 1 / -1;
}

body.public-signup label {
  color: var(--text);
  font-size: 14px;
  font-weight: 800;
}

body.public-signup input, body.public-signup select, body.public-signup textarea {
  width: 100%;
  border: 1px solid #ccd7d0;
  border-radius: 12px;
  background: white;
  color: var(--navy);
  font-size: 16px;
  padding: 0 15px;
}

body.public-signup input, body.public-signup select {
  height: 54px;
}

body.public-signup textarea {
  min-height: 96px;
  padding-top: 14px;
  line-height: 1.45;
  resize: vertical;
}

body.public-signup input:focus, body.public-signup select:focus, body.public-signup textarea:focus {
  outline: 3px solid rgba(19, 138, 54, .18);
  border-color: var(--green);
}

body.public-signup .store-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

body.public-signup .store-card {
  min-height: 54px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #ccd7d0;
  border-radius: 12px;
  background: white;
  color: var(--navy);
  font-size: 15px;
  font-weight: 800;
  padding: 0 14px;
}

body.public-signup .store-card input {
  width: 18px;
  height: 18px;
  padding: 0;
  accent-color: var(--green);
}

body.public-signup .section-title {
  grid-column: 1 / -1;
  margin-top: 12px;
  padding-top: 20px;
  border-top: 1px solid var(--border);
  font-size: 16px;
  font-weight: 900;
}

body.public-signup .payment-note {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  margin: -4px 0 0;
}

body.public-signup .field-note {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  margin: -2px 0 0;
}

body.public-signup .button {
  grid-column: 1 / -1;
  min-height: 62px;
  border: 0;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--green), var(--green-dark));
  color: white;
  font-size: 18px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 12px 25px rgba(19,138,54,.22);
}

body.public-signup .button:disabled {
  opacity: .68;
  cursor: wait;
}

body.public-signup .legal {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
  margin: 0;
}

body.public-signup .message {
  grid-column: 1 / -1;
  display: none;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.45;
}

body.public-signup .message.error {
  display: block;
  border: 1px solid rgba(162,51,47,.28);
  background: #fff0ef;
  color: var(--error);
}

body.public-signup .message.info {
  display: block;
  border: 1px solid rgba(19,138,54,.22);
  background: var(--green-soft);
  color: var(--green-dark);
}

body.public-signup .footer {
  background: rgba(243,248,244,.92);
  border-top: 1px solid var(--border);
  padding: 24px 0;
}

body.public-signup .footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}

body.public-signup .footer-copyright {
  color: var(--muted);
  font-size: 14px;
}

body.public-signup .footer-links {
  display: flex;
  gap: 24px;
}

body.public-signup .footer-links a {
  color: var(--muted);
  text-decoration: none;
  font-size: 14px;
}
@media (max-width: 900px) {
  body {
    background:
      linear-gradient(180deg, rgba(248,255,248,.98), rgba(248,255,248,.92)),
      url('/images/gosnaggle-hero-bg2.webp');
    background-size: cover;
    background-position: center right;
    background-attachment: scroll;
  }

  body.public-signup .layout {
    grid-template-columns: 1fr;
  }

  body.public-signup .intro {
    padding-top: 8px;
  }
}
@media (max-width: 620px) {
  .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

body.public-signup .header-login {
  color: var(--muted);
  text-decoration: none;
  font-weight: 800;
}

body.public-signup .header-login:hover {
  color: var(--green-dark);
}

body.public-signup .login-note {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 14px;
  text-align: center;
  margin: -2px 0 4px;
}

body.public-signup .header {
    padding-top: 22px;
  }

  body.public-signup .logo-img {
    height: 62px;
  }

  body.public-signup .main {
    padding-top: 18px;
  }

  body.public-signup .signup-card {
    padding: 26px 20px;
  }

  body.public-signup .card-head {
    grid-template-columns: 1fr;
    text-align: center;
  }

  body.public-signup .card-head img {
    margin: 0 auto;
  }

  body.public-signup .form-grid {
    grid-template-columns: 1fr;
  }

  body.public-signup .store-grid {
    grid-template-columns: 1fr;
  }

  body.public-signup .footer-inner {
    flex-direction: column;
    text-align: center;
    gap: 12px;
  }
}


/* Trial signup thanks */
body.public-signup-thanks { margin: 0; font-family: Arial, Helvetica, sans-serif; color: #071c2f; background: #f8fff8; }
body.public-signup-thanks .container { width: min(760px, calc(100% - 36px)); margin: 0 auto; padding: 56px 0; }
body.public-signup-thanks .logo { height: 76px; width: auto; margin-bottom: 36px; }
body.public-signup-thanks .panel { background: #fff; border: 1px solid #dfe8df; border-radius: 18px; padding: 34px; box-shadow: 0 18px 45px rgba(14, 60, 34, .12); }
body.public-signup-thanks h1 { font-size: 42px; line-height: 1.05; margin: 0 0 16px; }
body.public-signup-thanks p { color: #263543; font-size: 18px; line-height: 1.55; margin: 0 0 18px; }
body.public-signup-thanks a.button { display: inline-block; margin-top: 10px; padding: 15px 20px; border-radius: 12px; background: #138a36; color: #fff; text-decoration: none; font-weight: 800; }


/* Legal pages */
body.public-legal {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: #f7fff8;
  color: var(--text);
  line-height: 1.7;
}

body.public-legal .container {
  width: min(900px, calc(100% - 40px));
  margin: 0 auto;
}

body.public-legal .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

body.public-legal .header-login {
  color: var(--muted);
  text-decoration: none;
  font-weight: 800;
}

body.public-legal .header-login:hover {
  color: var(--green);
}

body.public-legal .header {
  padding: 30px 0;
  border-bottom: 1px solid var(--border);
  background: white;
}

body.public-legal .logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

body.public-legal .logo-img {
  height: 78px;
  width: auto;
}

body.public-legal .main {
  padding: 60px 0;
}

body.public-legal h1 {
  color: var(--navy);
  font-size: clamp(36px, 5vw, 54px);
  margin: 0 0 20px;
  letter-spacing: -1px;
}

body.public-legal .last-updated {
  color: var(--muted);
  margin-bottom: 40px;
}

body.public-legal .content {
  background: white;
  border-radius: 20px;
  padding: 40px;
  box-shadow: 0 10px 30px rgba(0,0,0,.05);
}

body.public-legal .content h2 {
  color: var(--navy);
  margin-top: 40px;
}

body.public-legal .content h2:first-child {
  margin-top: 0;
}

body.public-legal .placeholder {
  background: #f8faf8;
  border: 2px dashed var(--border);
  border-radius: 12px;
  padding: 30px;
  color: var(--muted);
  text-align: center;
  font-style: italic;
}

body.public-legal .footer {
  margin-top: 60px;
  padding: 24px 0;
  border-top: 1px solid var(--border);
}

body.public-legal .footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}

body.public-legal .footer-links {
  display: flex;
  gap: 24px;
}

body.public-legal .footer-links a {
  color: var(--muted);
  text-decoration: none;
}

body.public-legal .footer-links a:hover {
  color: var(--green);
}
@media (max-width: 700px) {
  .content {
    padding: 24px;
  }

  body.public-legal .footer-inner {
    flex-direction: column;
    text-align: center;
  }

  body.public-legal .logo-img {
    height: 58px;
  }
}


/* Login page */
body.public-login { margin:0; font-family:Arial, Helvetica, sans-serif; color:var(--navy); background:linear-gradient(90deg, rgba(248,255,248,.98) 0%, rgba(248,255,248,.9) 50%, rgba(248,255,248,.36) 100%), url('/images/gosnaggle-hero-bg2.webp'); background-size:cover; background-position:center right; min-height:100vh; }
body.public-login a { color:var(--green-dark); }
body.public-login .container { width:min(1040px, calc(100% - 36px)); margin:0 auto; }
body.public-login .header { padding:30px 0 10px; }
body.public-login .nav { display:flex; justify-content:space-between; align-items:center; gap:20px; }
body.public-login .logo-img { height:78px; width:auto; display:block; }
body.public-login .nav-link { color:var(--muted); text-decoration:none; font-weight:800; }
body.public-login .main { padding:42px 0 70px; }
body.public-login .layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:34px; align-items:center; }
body.public-login .eyebrow { display:inline-flex; padding:8px 12px; border:1px solid rgba(19,138,54,.2); border-radius:999px; background:rgba(255,255,255,.82); color:var(--green-dark); font-size:14px; font-weight:800; margin-bottom:18px; }
body.public-login h1 { font-size:clamp(42px, 5vw, 62px); line-height:1; margin:0 0 20px; }
body.public-login .intro p { color:var(--text); font-size:21px; line-height:1.5; margin:0; }
body.public-login .login-card { background:rgba(255,255,255,.96); border:1px solid var(--border); border-radius:24px; box-shadow:var(--shadow); padding:34px; }
body.public-login .login-card h2 { font-size:31px; line-height:1.1; margin:0 0 8px; }
body.public-login .login-card .subcopy { color:var(--muted); font-size:15px; line-height:1.45; margin:0 0 24px; }
body.public-login .field { display:grid; gap:7px; margin-bottom:14px; }
body.public-login label { color:var(--text); font-size:14px; font-weight:800; }
body.public-login input { width:100%; height:54px; border:1px solid #ccd7d0; border-radius:12px; background:white; color:var(--navy); font-size:16px; padding:0 15px; }
body.public-login input:focus { outline:3px solid rgba(19,138,54,.18); border-color:var(--green); }
body.public-login .button { width:100%; min-height:58px; border:0; border-radius:12px; background:linear-gradient(135deg,var(--green),var(--green-dark)); color:white; font-size:18px; font-weight:900; cursor:pointer; box-shadow:0 12px 25px rgba(19,138,54,.22); }
body.public-login .message { padding:12px 14px; border-radius:12px; font-size:14px; line-height:1.45; margin-bottom:14px; }
body.public-login .message.info { border:1px solid rgba(19,138,54,.22); background:var(--green-soft); color:var(--green-dark); }
body.public-login .message.error { border:1px solid rgba(162,51,47,.28); background:#fff0ef; color:var(--error); }
body.public-login .field-validation-valid { display:none; }
body.public-login .field-validation-error { display:block; color:var(--error); font-size:13px; line-height:1.35; }
body.public-login .validation-summary-errors { color:var(--error); margin-bottom:14px; }
body.public-login .validation-summary-errors ul { margin:0; padding-left:18px; }
body.public-login .small-note { color:var(--muted); font-size:13px; line-height:1.45; margin:16px 0 0; }
body.public-login .footer { background:rgba(243,248,244,.92); border-top:1px solid var(--border); padding:24px 0; }
body.public-login .footer-inner { display:flex; justify-content:space-between; align-items:center; gap:20px; }
body.public-login .footer-links { display:flex; gap:24px; }
body.public-login .footer-links a { color:var(--muted); text-decoration:none; font-size:14px; }@media (max-width: 820px) { body.public-login .layout { grid-template-columns:1fr; } body.public-login .intro { padding-top:8px; } }@media (max-width: 620px) { body.public-login .logo-img { height:62px; } body.public-login .login-card { padding:26px 20px; } body.public-login .footer-inner { flex-direction:column; text-align:center; gap:12px; } }


/* Profile page */
body.public-profile { margin:0; font-family:Arial, Helvetica, sans-serif; color:var(--navy); background:#f7fff8; }
body.public-profile a { color:var(--green-dark); }
body.public-profile .container { width:min(1080px, calc(100% - 36px)); margin:0 auto; }
body.public-profile .header { padding:30px 0 10px; background:linear-gradient(90deg, rgba(248,255,248,.98), rgba(248,255,248,.92)); }
body.public-profile .nav { display:flex; justify-content:space-between; align-items:center; gap:20px; }
body.public-profile .logo-img { height:78px; width:auto; display:block; }
body.public-profile .nav-actions { display:flex; align-items:center; gap:16px; }
body.public-profile .nav-link { color:var(--muted); text-decoration:none; font-weight:800; font-size:14px; }
body.public-profile .nav-link:hover { color:var(--green); }
body.public-profile .main { padding:36px 0 64px; }
body.public-profile .page-head { display:flex; justify-content:space-between; align-items:end; gap:22px; margin-bottom:22px; }
body.public-profile .page-head h1 { margin:0 0 8px; font-size:clamp(36px, 5vw, 58px); line-height:1; }
body.public-profile .page-head p { margin:0; color:var(--text); font-size:18px; line-height:1.5; max-width:650px; }
body.public-profile .layout { display:grid; grid-template-columns:1.35fr .65fr; gap:20px; align-items:start; }
body.public-profile .card { background:var(--white); border:1px solid var(--border); border-radius:22px; box-shadow:var(--shadow); padding:26px; }
body.public-profile .card h2 { margin:0 0 16px; color:var(--navy); font-size:26px; line-height:1.1; }
body.public-profile .form-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:16px; }
body.public-profile .field { display:grid; gap:7px; }
body.public-profile .field-wide { grid-column:1 / -1; }
body.public-profile label { color:var(--text); font-size:14px; font-weight:800; }
body.public-profile input, body.public-profile textarea { width:100%; border:1px solid #ccd7d0; border-radius:12px; background:white; color:var(--navy); font:inherit; font-size:16px; padding:0 15px; }
body.public-profile input { height:52px; }
body.public-profile textarea { min-height:104px; padding-top:14px; line-height:1.45; resize:vertical; }
body.public-profile input:focus, body.public-profile textarea:focus { outline:3px solid rgba(19,138,54,.18); border-color:var(--green); }
body.public-profile .store-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; }
body.public-profile .store-card { min-height:52px; display:flex; align-items:center; gap:10px; border:1px solid #ccd7d0; border-radius:12px; background:white; color:var(--navy); font-size:15px; font-weight:800; padding:0 14px; }
body.public-profile .store-card input { width:18px; height:18px; padding:0; accent-color:var(--green); }
body.public-profile .field-note { color:var(--muted); font-size:13px; line-height:1.45; margin:0; }
body.public-profile .button-row { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-top:22px; padding-top:18px; border-top:1px solid var(--border); }
body.public-profile .button, body.public-profile .link-button { min-height:50px; display:inline-flex; align-items:center; justify-content:center; padding:0 18px; border:0; border-radius:12px; background:linear-gradient(135deg,var(--green),var(--green-dark)); color:white; font-size:15px; font-weight:900; text-decoration:none; cursor:pointer; }
body.public-profile .button.secondary, body.public-profile .link-button.secondary { background:white; color:var(--green-dark); border:1px solid var(--border); }
body.public-profile .button.danger { background:var(--error); }
body.public-profile .message { padding:12px 14px; border-radius:12px; font-size:14px; line-height:1.45; margin-bottom:16px; }
body.public-profile .message.info { border:1px solid rgba(19,138,54,.22); background:var(--green-soft); color:var(--green-dark); }
body.public-profile .message.error { border:1px solid rgba(162,51,47,.28); background:var(--error-soft); color:var(--error); }
body.public-profile .validation-summary-errors, body.public-profile .field-validation-error { color:var(--error); font-size:13px; line-height:1.4; }
body.public-profile .field-validation-valid { display:none; }
body.public-profile .summary-list { display:grid; gap:14px; margin:0; }
body.public-profile .summary-row { display:grid; gap:4px; padding-bottom:14px; border-bottom:1px solid var(--border); }
body.public-profile .summary-row:last-child { border-bottom:0; padding-bottom:0; }
body.public-profile .summary-row span { color:var(--muted); font-size:12px; font-weight:900; text-transform:uppercase; }
body.public-profile .summary-row strong { color:var(--navy); font-size:18px; line-height:1.2; }
body.public-profile .status { display:inline-flex; min-height:28px; align-items:center; padding:0 10px; border-radius:999px; background:var(--green-soft); color:var(--green-dark); font-size:13px; font-weight:900; }
body.public-profile .status.canceled { background:var(--error-soft); color:var(--error); }
body.public-profile .danger-zone { margin-top:20px; border-color:rgba(162,51,47,.25); box-shadow:none; }
body.public-profile .danger-zone p { color:var(--text); line-height:1.5; margin:0 0 16px; }
body.public-profile .logout-form { margin:0; }
body.public-profile .footer { background:#f3f8f4; border-top:1px solid var(--border); padding:24px 0; }
body.public-profile .footer-inner { display:flex; justify-content:space-between; align-items:center; gap:20px; }
body.public-profile .footer-links { display:flex; gap:24px; }
body.public-profile .footer-links a { color:var(--muted); text-decoration:none; font-size:14px; }@media (max-width: 860px) { body.public-profile .layout { grid-template-columns:1fr; } body.public-profile .page-head { display:block; } body.public-profile .page-head .logout-form { margin-top:16px; } }@media (max-width: 620px) { body.public-profile .logo-img { height:62px; } body.public-profile .nav { align-items:flex-start; } body.public-profile .form-grid, body.public-profile .store-grid { grid-template-columns:1fr; } body.public-profile .card { padding:22px 18px; } body.public-profile .footer-inner { flex-direction:column; text-align:center; gap:12px; } }



