.home-header,
.home-hero {
  --home-green: #06493e;
  --home-ink: #083e35;
  --home-gold: #ffbe30;
  --home-orange: #eb720c;
  --home-paper: #f5f0e4;
  --home-script: var(--landing-handwritten, "Segoe Script", "Bradley Hand", cursive);
}

.home-header {
  border: 0;
  color: #fffdfa;
  background-color: var(--home-green);
  background-image: url('/images/grain.webp'), linear-gradient(142deg, #2d6654 0 40%, transparent 40.2%);
}

.home-header .header-inner {
  min-height: clamp(76px, 7vw, 118px);
  gap: clamp(18px, 3.1vw, 53px);
}

.home-header .wordmark { font-size: clamp(1.02rem, 1.44vw, 1.34rem); }

.home-header .brand-icon {
  width: 32px;
  height: 32px;
  border: 1px solid #f5f0e47d;
  color: var(--home-paper);
  background: transparent;
  font-size: .73rem;
  letter-spacing: -.035em;
}

.home-header .site-nav { margin-right: auto; gap: clamp(13px, 2.45vw, 39px); }
.home-header .site-nav a { font-size: clamp(.87rem, 1.12vw, 1.04rem); white-space: nowrap; }
.home-header .header-cta { padding-inline: 22px; white-space: nowrap; }
.home-header .button-primary, .home-hero .button-primary { background: var(--home-gold); color: var(--home-ink); }
.home-header .button-primary:hover, .home-hero .button-primary:hover { background: #ffd163; }
.home-header :focus-visible, .home-stage :focus-visible { outline-color: #ffe3a4; }

.home-hero {
  position: relative;
  padding: 0 0 39px;
  color: #fffdfa;
}

.home-stage {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--home-green);
  border-radius: 0 0 26px 26px;
}

.home-stage::before,
.home-stage::after {
  position: absolute;
  z-index: -2;
  content: "";
  pointer-events: none;
}

.home-stage::before {
  top: -127%;
  left: -13%;
  width: 54%;
  height: 251%;
  border-radius: 0 0 55% 44%;
  transform: rotate(23deg);
  background: linear-gradient(132deg, #396c59, #2a594e 81%);
}

.home-stage::after {
  right: -19%;
  bottom: -125%;
  width: 57%;
  height: 211%;
  border-radius: 54% 44% 0 0;
  transform: rotate(-19deg);
  background: linear-gradient(151deg, #2b584c, #153f37 73%);
}

.home-polaroids::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .8;
  background-image: url('/images/grain.webp');
  content: "";
  pointer-events: none;
}

.home-promises {
  position: relative;
  z-index: 1;
  background: #00352e7a;
  color: #f7f3e9;
}

.home-promise-list {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(9px, 1.8vw, 25px);
  min-height: 41px;
  margin-block: 0;
  padding: 7px 0;
  list-style: none;
  font-size: clamp(.75rem, 1.05vw, .99rem);
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}

.home-promise-list li { display: flex; align-items: center; gap: clamp(9px, 1.8vw, 25px); }
.home-promise-list li + li::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--home-gold); flex: none; }

.home-hero-copy {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: clamp(13px, 1.55vw, 25px);
  width: min(61%, 960px);
  min-height: clamp(492px, 35vw, 640px);
  align-content: center;
  padding-block: 28px 66px;
  text-align: center;
}

.home-script {
  color: #ffc84c;
  font-family: var(--home-script);
  font-size: clamp(1.65rem, 3.55vw, 3.7rem);
  -webkit-text-stroke: .18px currentColor;
  line-height: 1.18;
  letter-spacing: -.05em;
  text-wrap: balance;
}

.home-hero h1 {
  max-width: 18em;
  color: #fffdfa;
  font-size: clamp(2.35rem, 4.1vw, 4.2rem);
  line-height: 1.06;
  text-wrap: balance;
}

.home-intro {
  max-width: 46ch;
  color: #f7f2e8;
  font-size: clamp(1rem, 1.5vw, 1.29rem);
  line-height: 1.42;
  text-wrap: balance;
}

.home-hero .hero-actions { justify-content: center; gap: 12px; margin-top: 1px; }
.home-hero .hero-actions .button { min-height: clamp(52px, 4.4vw, 72px); padding-inline: clamp(16px, 2.4vw, 42px); font-size: clamp(.99rem, 1.5vw, 1.27rem); }
.home-hero .hero-actions .button-secondary { color: #fffdfa; border-color: #fffdfaaf; background: #ffffff13; }
.home-hero .hero-actions .button-secondary:hover { background: #ffffff24; }
.home-reassurance { color: #dce8df; font-size: clamp(.79rem, 1vw, .92rem); }

.home-polaroid {
  position: absolute;
  z-index: 0;
  width: clamp(175px, 20.6vw, 390px);
  margin: 0;
  padding: clamp(9px, 1.15vw, 20px);
  border: clamp(6px, .73vw, 13px) solid #fffdfa;
  border-radius: clamp(17px, 1.95vw, 32px);
  color: var(--home-ink);
  background: #fffdfa;
  box-shadow: 0 13px 30px #032b2438;
  pointer-events: none;
}

.home-polaroid img {
  aspect-ratio: 1.13;
  border-radius: clamp(7px, .75vw, 13px);
  background: #ceb29a;
  object-fit: cover;
}

.home-polaroid figcaption {
  padding-top: 9px;
  font-size: clamp(1.1rem, 1.92vw, 2rem);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -.045em;
}

.home-polaroid--left-back { bottom: -17%; left: -3.5%; width: clamp(202px, 27vw, 475px); transform: rotate(11deg); }
.home-polaroid--right-back { top: 5%; right: -6%; width: clamp(180px, 22vw, 425px); transform: rotate(-13deg); }
.home-polaroid--left-front { top: 14%; left: -4%; transform: rotate(-12deg); border-color: var(--home-orange); }
.home-polaroid--left-front figcaption { text-align: right; }
.home-polaroid--right-front { right: -3.5%; bottom: -5%; transform: rotate(12deg); border-color: var(--home-orange); }

.home-price-ribbon {
  position: relative;
  z-index: 2;
  display: grid;
  width: max-content;
  max-width: calc(100% - 36px);
  justify-items: center;
  gap: 1px;
  margin: -34px auto 0;
  padding: 8px clamp(15px, 3vw, 44px) 10px;
  border: 1px solid var(--home-orange);
  border-radius: 28px;
  background: #fffdfa;
  color: var(--home-ink);
  box-shadow: 0 4px 12px #46320e12;
  text-align: center;
}

.home-ribbon-advance,
.home-ribbon-label,
.home-ribbon-standard { color: inherit; line-height: 1.25; }
.home-ribbon-advance { font-size: .95rem; font-weight: 700; }
.home-ribbon-advance strong { font-size: clamp(1.8rem, 3.3vw, 2.5rem); line-height: 1.05; white-space: nowrap; }
.home-ribbon-label { font-size: .9rem; font-weight: 650; }
.home-ribbon-standard { color: #45635b; font-size: .79rem; }
.home-ribbon-standard strong { white-space: nowrap; }

@media (max-width: 1000px) {
  .home-header .header-inner { gap: 18px; }
  .home-header .site-nav { gap: 13px; }
  .home-hero-copy { width: 64%; }
  .home-polaroid--left-front { left: -6%; }
  .home-polaroid--right-front { right: -6%; }
}

@media (max-width: 880px) {
  .home-header .header-inner { min-height: 68px; }
  .home-header .header-cta { display: none; }
  .home-header .nav-toggle { display: inline-flex; align-items: center; color: #fffdfa; border-color: #f5f0e482; }
  .home-header .site-nav { position: absolute; inset: 100% 0 auto; display: none; margin: 0; padding: 10px 20px 18px; background: var(--home-green); box-shadow: 0 13px 24px #042b2645; }
  .home-header .site-nav.is-open, .home-header .nav-toggle[aria-expanded="true"] ~ .site-nav { display: grid; }
  .home-header .site-nav a { padding: 7px 0; }
}

@media (max-width: 760px) {
  .home-hero { padding: 0 0 27px; }
  .home-hero-copy { width: calc(100% - 38px); max-width: 560px; min-height: auto; gap: 15px; padding-block: 28px 168px; }
  .home-script { font-size: clamp(1.9rem, 5.8vw, 2.65rem); }
  .home-hero h1 { font-size: clamp(2.05rem, 6.8vw, 3.15rem); }
  .home-promise-list { gap: 7px; }
  .home-promise-list li { gap: 7px; }
  .home-polaroid--left-back, .home-polaroid--right-back { display: none; }
  .home-polaroid--left-front, .home-polaroid--right-front { top: auto; bottom: 2px; width: clamp(117px, 33vw, 182px); padding: 5px; border-width: 5px; border-radius: 14px; }
  .home-polaroid--left-front { left: max(13px, calc(50% - 177px)); }
  .home-polaroid--right-front { right: max(13px, calc(50% - 177px)); }
  .home-polaroid img { aspect-ratio: 1.43; border-radius: 7px; }
  .home-polaroid figcaption { padding-top: 4px; font-size: .76rem; }
  .home-price-ribbon { margin-top: -24px; border-radius: 19px; }
}

@media (max-width: 480px) {
  .home-hero .hero-actions { width: min(100%, 330px); display: grid; gap: 8px; }
  .home-hero .hero-actions .button { min-height: 48px; }
  .home-hero-copy { gap: 12px; padding-block: 23px 146px; }
  .home-stage::before { width: 82%; left: -41%; }
  .home-stage::after { width: 105%; right: -62%; }
  .home-promise-list { width: calc(100% - 19px); }
  .home-ribbon-advance { font-size: .82rem; }
  .home-ribbon-label { font-size: .78rem; }
  .home-ribbon-standard { font-size: .74rem; }
}