/* Home-only trial of the current app's nature artwork and grouped card language. */
.home-page {
  --nature-blue:#3ca9d9;
  --nature-mint:#4ab9a6;
  --nature-line:#d7e7ec;
  background:#fcfefd;
}
.home-page .site-header {
  position:sticky;
  isolation:isolate;
  background:linear-gradient(105deg,#eef3c7 0%,#d7f0df 43%,#cbeaf7 100%);
  border-bottom:1px solid #b9dce4;
  box-shadow:0 2px 12px #2b66720a;
}
.home-page .site-header::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:url('/assets/nature-header-plant.png') center bottom / 100% 100% no-repeat;
  opacity:.28;
  pointer-events:none;
}
.home-page .nav-wrap { min-height:78px; }
.home-page .brand { color:#285b6e; }
.home-page .nav-links a { color:#315b69; }
.home-page .nav-links a:hover,
.home-page .nav-links a:focus-visible,
.home-page .nav-links a[aria-current] {
  color:#16627c;
  background:#ffffffc7;
  box-shadow:0 1px 5px #28627408;
}
.home-page main { position:relative; isolation:isolate; }
.home-page main::before {
  content:"";
  position:fixed;
  inset:78px 0 0;
  z-index:-1;
  background:url('/assets/nature-content-background.png') right bottom / auto 100% no-repeat;
  opacity:.12;
  pointer-events:none;
}
.home-page .product-hero {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:3.25rem 0 5.25rem;
  border-bottom:1px solid #d1e9e6;
  background:linear-gradient(120deg,#edf9ff 0%,#ddf4f5 49%,#def3e4 100%);
}
.home-page .product-hero::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0 0 0 38%;
  background:url('/assets/nature-intro-slide-background-3.png') right bottom / auto 100% no-repeat;
  opacity:.78;
  pointer-events:none;
}
.home-page .product-hero::after {
  content:"";
  position:absolute;
  z-index:-1;
  bottom:0;
  left:0;
  width:100%;
  height:96px;
  background:url('/assets/nature-header-plant.png') center bottom / 100% 100% no-repeat;
  opacity:.38;
  pointer-events:none;
}
.home-page .product-hero-grid {
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:2.5rem;
}
.home-page .nature-hero-copy {
  padding:2rem;
  border:1px solid #ffffffd9;
  border-radius:24px;
  background:#ffffffdf;
  box-shadow:0 8px 32px #2c68700b;
}
.home-page .product-name { margin:0 0 1.4rem; font-size:1.45rem; }
.home-page .product-name img { width:64px; height:64px; flex:0 0 64px; }
.home-page .product-hero h1 {
  color:#285b70;
  font-size:clamp(2.35rem,4.2vw,3.7rem);
  line-height:1.22;
  margin-bottom:1.25rem;
}
.home-page .product-hero .lead { color:#46606c; font-size:1.075rem; line-height:1.8; }
.home-page .hero-actions { margin-top:1.5rem; gap:.7rem; }
.home-page .hero-actions .text-link,
.home-page .hero-actions .button {
  padding:.75rem 1.15rem;
  border:1px solid #70bbd7;
  border-radius:12px;
  background:#eff9fd;
  color:#126481;
}
.home-page .hero-actions .text-link:hover,
.home-page .hero-actions .button:hover { background:#dff2fa; }
.home-page .availability-note {
  display:inline-flex;
  align-items:center;
  padding:.35rem .7rem;
  border-radius:999px;
  background:#e9f6ef;
  color:#296c59;
  font-size:.9rem;
}
.home-page .hero-core-note { margin-top:1.15rem; color:#46675d; font-size:.925rem; }
.home-page .hero-fan { width:min(440px,100%); height:530px; }
.home-page .fan-card { box-shadow:0 14px 35px #244c642c; border-radius:16px; border-width:3px; }
.home-page .release-summary { padding-top:1.1rem; }
.home-page .capture-note { font-size:.83rem; color:#60717a; }

/* Match the app's white surfaces, tinted headers, and narrow category accents. */
.home-page .section { --section-accent:#4ab9a6; --section-tint:#eef8f5; padding:1.1rem 0; }
.home-page .app-gallery { --section-accent:#45aedd; --section-tint:#edf7fc; }
.home-page .template-section { --section-accent:#4cb3dc; --section-tint:#edf8fc; }
.home-page [aria-labelledby="trends-title"] { --section-accent:#9b82c3; --section-tint:#f4f0f9; }
.home-page [aria-labelledby="reports-title"] { --section-accent:#48acd6; --section-tint:#eff8fc; }
.home-page [aria-labelledby="preferences-title"] { --section-accent:#b49b54; --section-tint:#fbf8ed; }
.home-page [aria-labelledby="boundaries-title"] { --section-accent:#c87f78; --section-tint:#fcf3f2; }
.home-page .section > .container {
  position:relative;
  isolation:isolate;
  padding:1.65rem;
  border:1px solid var(--nature-line);
  border-left:3px solid var(--section-accent);
  border-radius:13px;
  background:#ffffffed;
  box-shadow:0 3px 9px #315a6a08;
}
.home-page .section-heading {
  margin:-1.65rem -1.65rem 1.5rem;
  padding:1.35rem 1.65rem;
  border-radius:12px 12px 0 0;
  border-bottom:1px solid var(--nature-line);
  background:var(--section-tint);
}
.home-page .eyebrow {
  display:flex;
  align-items:center;
  gap:.65rem;
  font-family:Comfortaa,system-ui,sans-serif;
  font-size:.87rem;
  font-weight:600;
  text-transform:none;
  letter-spacing:.025em;
  color:#3c7176;
}
.home-page .section-heading .eyebrow { margin:0 0 .85rem; color:#3d6977; }
.home-section-icon {
  display:inline-grid;
  flex:0 0 32px;
  place-items:center;
  width:32px;
  height:32px;
  border:1px solid #c8e9f5;
  border-radius:50%;
  background:#e1f3fc;
  color:#2599ca;
}
.home-section-icon svg { width:19px; height:19px; }
.home-page .section-heading h2,
.home-page .privacy-grid h2 {
  font-size:clamp(1.55rem,2.6vw,2.1rem);
  color:#315e71;
  line-height:1.35;
}
.home-page .section-heading p { color:#50636e; font-size:1rem; line-height:1.75; }
.home-page .showcase-card { border:1px solid #dae6ec; border-radius:12px; box-shadow:0 2px 6px #315a6a08; }
.home-page .showcase-screen { background:linear-gradient(155deg,#f6fbfd,#edf7f5); border-bottom:1px solid #dbeaf0; }
.home-page .showcase-screen img { border:1px solid #d1e3e9; border-radius:9px; box-shadow:0 4px 16px #315a6a12; }
.home-page .showcase-card figcaption { padding:1rem 1.15rem; background:#fff; }
.home-page .showcase-card h3 { font-size:1rem; line-height:1.5; color:#315e71; }
.home-page .showcase-card p { font-size:.94rem; line-height:1.7; color:#596a73; }
.home-page .carousel-arrow { border-radius:11px; background:#f0f9fd; border-color:#c5e5f3; color:#278fb7; }
.home-page .carousel-hint { font-size:.83rem; }
.home-page .tool-note { font-size:.94rem; }
.home-page .cloud-plan-card,
.home-page .report-copy,
.home-page .preference-grid > div {
  padding:1.3rem;
  border:1px solid #d6e7ed;
  border-left:3px solid #49b8a6;
  border-radius:11px;
  background:#f7fbfa;
  box-shadow:0 2px 5px #315a6a06;
}
.home-page .cloud-plan-card + .cloud-plan-card,
.home-page .report-copy { background:#f3f9fd; border-left-color:#46add9; }
.home-page .preference-grid > div:nth-child(2) { background:#f2f9fc; border-left-color:#46add9; }
.home-page .preference-grid > div:nth-child(3) { background:#f7f4fb; border-left-color:#9b82c3; }
.home-page .privacy-point { background:#f5fbf8; border-radius:10px; }
.home-page .privacy-grid::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:12px;
  background:url('/assets/nature-intro-slide-background-1.png') left bottom / 350px auto no-repeat;
  opacity:.1;
  pointer-events:none;
}
.home-page [aria-labelledby="trends-title"] > .container::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:url('/assets/nature-intro-slide-background-2.png') right bottom / 300px auto no-repeat;
  opacity:.1;
  pointer-events:none;
}
.home-page .site-footer { background:#f5faf7; }

@media(max-width:1000px) and (min-width:821px) {
  .home-page .product-hero-grid { gap:1.5rem; }
  .home-page .nature-hero-copy { padding:1.5rem; }
  .home-page .hero-fan { --fan-spread:64px; height:470px; }
}
@media(max-width:820px) {
  .home-page .product-hero { padding:2rem 0 3.5rem; }
  .home-page .product-hero-grid { grid-template-columns:minmax(0,1fr); gap:1.5rem; }
  .home-page .nature-hero-copy { max-width:640px; justify-self:center; padding:1.75rem; }
  .home-page .product-hero::before { inset:35% 0 0; background-size:auto 100%; background-position:center bottom; opacity:.65; }
  .home-page .hero-fan { width:min(410px,100%); height:460px; margin:0; }
  .home-page .hero-actions { justify-content:center; }
}
@media(max-width:680px) {
  .home-page .nav-wrap { min-height:70px; }
  .home-page .site-header::before { background-size:auto 100%; }
  .home-page main::before { inset-block-start:70px; opacity:.09; }
  .home-page .product-hero { padding:1.25rem 0 3rem; }
  .home-page .nature-hero-copy { padding:1.35rem 1.1rem; border-radius:18px; }
  .home-page .product-name { gap:.65rem; font-size:1.15rem; margin-bottom:1.25rem; }
  .home-page .product-name img { width:54px; height:54px; flex-basis:54px; }
  .home-page .product-name small { font-size:.8rem; }
  .home-page .product-hero h1 { font-size:clamp(2rem,7.4vw,2.6rem); }
  .home-page .product-hero .lead { font-size:1rem; line-height:1.75; }
  .home-page .hero-fan { --fan-spread:clamp(48px,15vw,70px); height:410px; }
  .home-page .release-summary { padding-top:.75rem; }
  .home-page .capture-note { font-size:.8rem; }
  .home-page .section { padding:.7rem 0; }
  .home-page .section > .container { padding:1rem; }
  .home-page .section-heading { margin:-1rem -1rem 1.15rem; padding:1.1rem 1rem; }
  .home-page .section-heading h2 { font-size:1.55rem; }
  .home-page .section-heading p { font-size:.96rem; }
  .home-page .showcase-card figcaption { padding:1rem; }
  .home-page .privacy-grid::after { background-size:260px auto; }
}
