/* Generated gouache wordmark and watercolor paper; readable copy stays HTML. */
:root {
  --paint-coral: #e85f58;
  --paint-green: #50865a;
  --paint-paper: #fff9ed;
  background-color: var(--paint-paper);
  background-image: url('/assets/brand/paper-v1.webp');
  background-size: 800px 800px;
}
.brand-painted {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  min-width: 0;
  width: 245px;
}
.brand-wordmark,
.footer-wordmark {
  width: 100%;
  height: auto;
}
.brand-painted .brand-sub {
  grid-column: 1;
  margin: 0;
  letter-spacing: 0;
  font-weight: 700;
}
.footer-wordmark {
  width: 240px;
}
.top {
  background-color: #fffdf8;
}
.hero-reference {
  background-color: var(--paint-paper);
  background-image: url('/assets/brand/paper-v1.webp');
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
}
.hero-reference h1 em {
  color: var(--paint-green);
}
.hero-reference .hero-coral,
.hero-reference .hero-price-value strong,
.flow-highlight {
  color: var(--paint-coral);
}
.hero-reference .hero-cocoa {
  color: var(--ink);
}
.hero-reference .hero-price-note {
  font-size: 12px;
  line-height: 1.65;
}
.hero-button {
  font-size: 20px;
  background: linear-gradient(180deg, #ed6a63, #e45c55);
  box-shadow: 0 4px 0 #ebb8a1;
  border-radius: 999px;
}
.top .nav-cta {
  font-size: 19px;
  background: linear-gradient(180deg, #ed6a63, #e45c55);
}
.phone-preview {
  border-color: #5c473a;
}
.original-badge {
  background: #fff0de;
  border-color: #efae90;
  color: var(--ink);
}
.composition-paw {
  color: #ecc9a3;
}
.feature-tile {
  background-image: linear-gradient(#eef6eae8, #eef6eae8), url('/assets/brand/paper-v1.webp');
  background-size: cover;
}
.feature-tile:nth-child(2n) {
  background-image: linear-gradient(#fff0e4e8, #fff0e4e8), url('/assets/brand/paper-v1.webp');
}
.flow {
  background-color: var(--paint-paper);
  background-image: linear-gradient(#fffdf7bb, #fffdf7bb), url('/assets/brand/paper-v1.webp');
  background-size: cover;
  background-position: center bottom;
}
.flow-grid li {
  background: #fffdf8ed;
}
.flow-grid li > span {
  color: var(--ink);
  background: #ffc1b2;
}
.flow-grid li:nth-child(2n) > span {
  color: white;
  background: #42724a;
}
.price-section,
.closing {
  background-color: var(--paint-paper);
  background-image: url('/assets/brand/paper-v1.webp');
  background-size: cover;
  background-position: center bottom;
}
.price-card {
  background: #fffdf8f5;
}
.reason-grid article {
  background-color: #fffdf8;
}
.section-heading h2,
.reasons h2 {
  color: var(--paint-green);
}
@media (max-width: 900px) {
  .brand-painted {
    width: 220px;
  }
}
@media (max-width: 600px) {
  .hero-reference,
  .price-section,
  .closing {
    background-image: url('/assets/brand/paper-mobile-v1.webp');
  }
  .flow {
    background-image:
      linear-gradient(#fffdf7bb, #fffdf7bb), url('/assets/brand/paper-mobile-v1.webp');
  }
  .brand-painted {
    width: 170px;
    flex-shrink: 1;
  }
  .top nav,
  .mobile-menu {
    flex-shrink: 0;
  }
  .top .nav-cta {
    font-size: 19px;
    padding: 10px;
  }
  .hero-reference .hero-button {
    font-size: 20px;
  }
}
@media (max-width: 360px) {
  .top .nav-cta {
    display: none;
  }
  .brand-painted {
    width: 190px;
  }
}
