/* Original hero styles isolated to preserve the rest of the site. */
.hero{
  --ink: #2c2a2a;
  --muted: #766c69;
  --soft-text: #9a8780;
  --ivory: #fffdfb;
  --paper: #fbf8f5;
  --paper-deep: #f5efeb;
  --line: #eaded8;
  --coral: #e78989;
  --coral-deep: #df7476;
  --coral-soft: #f9e4e3;
  --green: #5d8580;
  --green-deep: #29524e;
  --green-soft: #e6efeb;
  --lilac: #ece8fb;
  --shadow: 0 28px 70px rgba(81, 59, 54, 0.13);
  --content: min(1280px, calc(100% - 300px));
}
.hero{
  min-height: 760px;
  height: 100vh;
  overflow: hidden;
  background:
    radial-gradient(circle at 11% 85%, rgba(236, 232, 251, 0.7) 0 7%, transparent 7.1%),
    linear-gradient(135deg, #fffdfb 0%, #fbf8f5 58%, #f4eee9 100%);
}
.hero-inner{
  width: var(--content);
  height: 100%;
  margin: 0 auto;
  padding-top: 76px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(460px, 0.85fr);
  gap: 7%;
  align-items: center;
}
.hero .eyebrow{
  color: var(--coral-deep);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.18em;
}
.hero-copy h1{
  margin: 28px 0 30px;
  color: var(--green-deep);
  font-size: clamp(52px, 4vw, 72px);
  font-weight: 760;
  line-height: 1.2;
  letter-spacing: -0.045em;
}
.hero-description{
  color: var(--muted);
  font-size: 20px;
  line-height: 1.85;
  letter-spacing: -0.02em;
}
.hero .store-buttons{
  margin-top: 38px;
  display: flex;
  align-items: center;
  gap: 24px;
}
.hero .store-buttons a{
  display: block;
  width: 158px;
  border-radius: 9px;
  transition: transform 0.2s ease, filter 0.2s ease;
}
.hero .store-buttons a:hover,.hero .store-buttons a:focus-visible{
  filter: brightness(1.08);
  transform: translateY(-2px);
}
.hero .store-buttons img{
  width: 100%;
  height: auto;
}
.hero .store-buttons .app-store-badge{
  width: 158px;
  height: 50px;
  max-width: none;
  box-sizing: border-box;
  border: 1px solid #3f3d3c;
  border-radius: 9px;
  background: #2c2a2a;
  object-fit: contain;
}
.hero .google-play-custom{
  display: flex;
  width: 158px;
  height: 50px;
  box-sizing: border-box;
  align-items: center;
  padding: 0 12px 0 18px;
  border: 1px solid #3f3d3c;
  border-radius: 9px;
  background: #252322;
  color: #fff;
}
.hero .store-buttons .google-play-custom img{
  width: 28px;
  height: 31px;
  flex: 0 0 auto;
  object-fit: contain;
}
.hero .google-play-copy{
  display: flex;
  min-width: 0;
  margin-left: 9px;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1;
  white-space: nowrap;
}
.hero .google-play-copy small{
  margin-bottom: 3px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 8.7px;
  font-weight: 400;
}
.hero .google-play-copy strong{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15.3px;
  font-weight: 600;
  letter-spacing: -0.3px;
}
.hero-note{
  margin-top: 16px;
  color: var(--soft-text);
  font-size: 14px;
}
.hero-visual{
  position: relative;
  height: min(680px, 76vh);
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-orb{
  position: absolute;
  width: min(540px, 42vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,0.75), transparent 34%),
    linear-gradient(145deg, #b9cec4, #6f9587);
  box-shadow: inset -20px -30px 60px rgba(41, 82, 78, 0.18);
}
.hero-leaves{
  position: absolute;
  right: 4%;
  bottom: 8%;
  z-index: 1;
  width: 175px;
  height: 310px;
  border-left: 5px solid rgba(54, 91, 68, 0.58);
  border-radius: 50%;
  transform: rotate(18deg);
}
.hero-leaves i{
  position: absolute;
  width: 75px;
  height: 31px;
  border-radius: 100% 0 100% 0;
  background: linear-gradient(135deg, #799f83, #3f765a);
  box-shadow: 0 6px 14px rgba(41, 82, 78, 0.16);
  opacity: 0.82;
}
.hero-leaves i:nth-child(1){ top: 32px; left: -4px; transform: rotate(21deg); }
.hero-leaves i:nth-child(2){ top: 88px; left: -73px; transform: scaleX(-1) rotate(20deg); }
.hero-leaves i:nth-child(3){ top: 142px; left: -2px; transform: rotate(17deg); }
.hero-leaves i:nth-child(4){ top: 202px; left: -69px; transform: scaleX(-1) rotate(16deg); }
.hero-leaves i:nth-child(5){ top: 250px; left: 0; transform: rotate(12deg); }
.hero .download-content > p:not(.eyebrow):not(.store-status){
  color: var(--muted);
  font-size: 18px;
}
.hero .store-buttons-center{
  justify-content: center;
}
@media (max-width: 1200px){.hero{
    --content: calc(100% - 64px);
  }
.hero-inner{
    grid-template-columns: minmax(0, 1fr) minmax(390px, 0.8fr);
    gap: 3%;
  }
.hero-copy h1{
    font-size: 54px;
  }
.hero-description{
    font-size: 18px;
  }
.hero-orb{
    width: min(500px, 48vw);
  }}
@media (max-width: 900px){.hero{
    height: auto;
    min-height: 100svh;
  }
.hero-inner{
    min-height: 880px;
    padding: 130px 0 80px;
    grid-template-columns: 1fr 380px;
    gap: 0;
  }
.hero-copy h1{
    font-size: 46px;
  }
.hero-description br{
    display: none;
  }
.hero-visual{
    height: 610px;
  }
.hero-orb{
    width: 400px;
  }
.hero-leaves{
    right: -10%;
    transform: scale(0.75) rotate(18deg);
  }}
@media (max-width: 768px){.hero{
    --content: calc(100% - 40px);
  }
.hero-inner{
    min-height: 100svh;
    padding: 122px 0 86px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
.hero-copy{
    position: relative;
    z-index: 3;
  }
.hero-copy h1{
    margin: 20px 0 24px;
    font-size: clamp(39px, 11.2vw, 54px);
  }
.hero-description{
    font-size: 16px;
    line-height: 1.8;
  }
.hero .store-buttons{
    margin-top: 30px;
  }
.hero .store-buttons a{
    width: min(145px, calc(50% - 6px));
  }
.hero-visual{
    height: 570px;
    margin-top: 20px;
  }
.hero-orb{
    width: min(420px, 108vw);
  }
.hero-leaves{
    right: -3%;
    bottom: 4%;
  }
.hero .download-content > p:not(.eyebrow):not(.store-status){
    font-size: 16px;
  }}
@media (max-width: 420px){.hero-copy h1{
    font-size: 38px;
  }
.hero-visual{
    height: 535px;
  }}
.hero{
  min-height: 720px;
  height: 100vh;
  background-color: #fbf8f5;
  background-image: url("../img/hero-bg.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero-inner{
  display: block;
  padding-top: 0;
}
.hero-copy{
  width: 54%;
  height: 100%;
  padding-top: clamp(160px, 18vh, 220px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.hero-copy h1{
  margin: 44px 0 54px;
  color: #625d5b;
  font-size: clamp(38px, 3.25vw, 58px);
  font-weight: 760;
  line-height: 1.08;
  letter-spacing: -0.055em;
}
.hero-copy h1 > span:first-child{
  display: block;
}
.hero-title-line{
  margin-top: 18px;
  display: flex;
  align-items: center;
  gap: 18px;
  white-space: nowrap;
}
.hero-title-line img{
  width: clamp(148px, 11.8vw, 212px);
  height: auto;
  flex: 0 0 auto;
}
.hero-title-line b{
  font-weight: inherit;
}
.hero-description{
  color: #2f2b2a;
  font-size: clamp(16px, 1.1vw, 19px);
  line-height: 1.9;
}
.hero .store-buttons{
  margin-top: 44px;
}
.hero .download-content > p:not(.eyebrow):not(.store-status){
  color: #665f5c;
  font-size: clamp(16px, 1.25vw, 20px);
  line-height: 1.8;
}
.hero .download-content .store-buttons{
  margin-top: 44px;
}
@media (max-width: 1200px){.hero-copy{
    width: 58%;
  }
.hero-copy h1{
    font-size: 42px;
  }
.hero-title-line img{
    width: 154px;
  }}
@media (max-width: 900px){.hero{
    min-height: 900px;
    height: auto;
    background-position: 58% bottom;
    background-size: auto 62%;
  }
.hero-inner{
    min-height: 900px;
    padding: 0;
  }
.hero-copy{
    width: 100%;
    height: auto;
    padding-top: 132px;
  }
.hero-copy h1{
    margin: 32px 0 40px;
    font-size: clamp(36px, 5.2vw, 44px);
  }
.hero-description{
    font-size: 16px;
  }}
@media (max-width: 768px){.hero{
    min-height: 940px;
    background-position: 62% bottom;
    background-size: auto 54%;
  }
.hero-inner{
    min-height: 940px;
  }
.hero-copy{
    padding-top: 112px;
  }
.hero-copy h1{
    margin: 28px 0 36px;
    font-size: clamp(30px, 7.5vw, 38px);
  }
.hero-title-line{
    gap: 14px;
  }
.hero-title-line img{
    width: clamp(108px, 28vw, 144px);
  }
.hero-description{
    font-size: 14px;
    line-height: 1.85;
  }
.hero-description br{
    display: initial;
  }
.hero .store-buttons{
    margin-top: 32px;
  }
.hero .download-content > p:not(.eyebrow):not(.store-status){
    font-size: 15px;
  }}
@media (max-width: 420px){.hero{
    min-height: 880px;
    background-position: 64% bottom;
    background-size: auto 49%;
  }
.hero-inner{
    min-height: 880px;
  }
.hero-copy h1{
    font-size: clamp(28px, 7.8vw, 32px);
  }
.hero-title-line img{
    width: clamp(100px, 27.5vw, 116px);
  }
.hero-title-line b{
    font-size: 0.88em;
  }}
.hero-title-line img[src="img/nowa-hero-logo-transparent-final.png"]{
  image-rendering: auto;
}
@media (max-width: 768px){.hero{
    --content: calc(100% - 48px);
  }
.hero .store-buttons{
    --store-badge-width: min(148px, calc((100vw - 68px) / 2));
    gap: 20px;
  }
.hero .store-buttons a{
    width: var(--store-badge-width);
    min-height: 44px;
    flex: 0 0 var(--store-badge-width);
  }
.hero .store-buttons .app-store-badge,.hero .google-play-custom{
    width: var(--store-badge-width);
    height: calc(var(--store-badge-width) * 0.316456);
  }
.hero .google-play-custom{
    padding: 0 calc(var(--store-badge-width) * 0.075949)
      0 calc(var(--store-badge-width) * 0.113924);
  }
.hero .store-buttons .google-play-custom img{
    width: calc(var(--store-badge-width) * 0.177215);
    height: calc(var(--store-badge-width) * 0.196203);
  }
.hero .google-play-copy{
    margin-left: calc(var(--store-badge-width) * 0.056962);
  }
.hero .google-play-copy small{
    margin-bottom: calc(var(--store-badge-width) * 0.018987);
    font-size: calc(var(--store-badge-width) * 0.055063);
  }
.hero .google-play-copy strong{
    font-size: calc(var(--store-badge-width) * 0.096835);
  }}
@media (min-width: 901px){.introduction-site .hero{
    min-height: max(780px, 100vh);
    height: auto;
  }
.introduction-site .hero-inner{
    min-height: inherit;
  }
.introduction-site .hero-copy{
    width: 66%;
    max-width: 850px;
    height: auto;
    min-height: inherit;
    padding-top: 112px;
    padding-bottom: 96px;
    justify-content: center;
  }
.introduction-site .hero-copy h1{
    margin: 44px 0 64px;
    font-size: clamp(50.6px, 4.51vw, 79.2px);
    font-weight: 720;
    line-height: 1.22;
    letter-spacing: -0.04em;
  }
.introduction-site .hero-title-line{
    margin-top: 28px;
    gap: 0.25em;
  }
.introduction-site .hero-title-line img{
    width: 3.4em;
  }
.introduction-site .hero-description{
    font-size: clamp(19px, 1.4vw, 23px);
    line-height: 1.85;
  }
.introduction-site .hero .store-buttons,.hero .introduction-site .download-content .store-buttons{
    margin-top: 56px;
    gap: 48px;
  }
.introduction-site .hero .store-buttons a,.hero .introduction-site .download-content .store-buttons a{
    width: 205.4px;
    flex: 0 0 205.4px;
    border-radius: 11.7px;
  }
.introduction-site .hero .app-store-badge,.introduction-site .hero .google-play-custom,.hero .introduction-site .download-content .app-store-badge,.hero .introduction-site .download-content .google-play-custom{
    width: 205.4px;
    height: 65px;
    border-width: 1.3px;
    border-radius: 11.7px;
  }
.introduction-site .hero .google-play-custom,.hero .introduction-site .download-content .google-play-custom{
    padding: 0 15.6px 0 23.4px;
  }
.introduction-site .hero .google-play-custom img,.hero .introduction-site .download-content .google-play-custom img{
    width: 36.4px;
    height: 40.3px;
  }
.introduction-site .hero .google-play-copy,.hero .introduction-site .download-content .google-play-copy{
    margin-left: 11.7px;
  }
.introduction-site .hero .google-play-copy small,.hero .introduction-site .download-content .google-play-copy small{
    margin-bottom: 3.9px;
    font-size: 11.31px;
  }
.introduction-site .hero .google-play-copy strong,.hero .introduction-site .download-content .google-play-copy strong{
    font-size: 19.89px;
    letter-spacing: -0.39px;
  }
.hero .introduction-site .eyebrow,.introduction-site .hero .eyebrow{
    font-size: 21px;
  }
.hero .introduction-site .download-content > p:not(.eyebrow):not(.store-status){
    font-size: clamp(20px, 1.5vw, 24px);
    line-height: 1.9;
  }}