/* Shared app identity. Policy articles are deliberately outside content rules. */
.nature-site {
  --site-header-size:74px;
  --band-space:clamp(.9rem,2.5svh,1.75rem);
  background:#fcfefd;
}
.nature-site .site-header {
  position:sticky;
  isolation:isolate;
  background:linear-gradient(105deg,#eef3c7,#d7f0df 43%,#cbeaf7);
  border-bottom:1px solid #b9dce4;
  box-shadow:0 2px 12px #2b66720a;
}
.nature-site .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;
}
.nature-site .nav-wrap { min-height:var(--site-header-size); flex-wrap:nowrap; }
.nature-site .brand { color:#285b6e; }
.nature-site .nav-links a { color:#315b69; }
.nature-site .nav-links a:hover,
.nature-site .nav-links a:focus-visible,
.nature-site .nav-links a[aria-current] { color:#16627c; background:#ffffffc7; }
.nature-site main { position:relative; isolation:isolate; }
.nature-site main::before {
  content:"";
  position:fixed;
  inset:var(--site-header-size) 0 0;
  z-index:-1;
  background:url('/assets/nature-content-background.png') right bottom / auto 100% no-repeat;
  opacity:.1;
  pointer-events:none;
}
.nature-site .site-footer {
  position:relative;
  isolation:isolate;
  background:#f1f8f5;
  border-top:1px solid #d2e5e3;
}
.nature-site .site-footer::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:url('/assets/nature-header-plant.png') center bottom / 100% 90px no-repeat;
  opacity:.12;
  pointer-events:none;
}

/* Interior bands use the same landscape, with a short, readable content column. */
.nature-site .page-hero {
  position:relative;
  isolation:isolate;
  padding:clamp(1.25rem,3.4svh,2.25rem) 0;
  margin-bottom:0;
  background:linear-gradient(120deg,#edf9ff,#ddf4f5 52%,#def3e4);
  border-bottom:1px solid #d1e9e6;
}
.nature-site .page-hero::before {
  content:"";
  position:absolute;
  inset:0 0 0 58%;
  z-index:-1;
  background:url('/assets/nature-intro-slide-background-3.png') right 62% / 380px auto no-repeat;
  opacity:.46;
  pointer-events:none;
}
.nature-site .page-hero::after {
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:46px;
  z-index:-1;
  background:url('/assets/nature-header-plant.png') center bottom / 100% 100% no-repeat;
  opacity:.18;
  pointer-events:none;
}
.nature-site .page-hero > .container { position:relative; display:grid; gap:.7rem; }
.nature-site .page-hero .product-name {
  max-width:75%;
  margin:0;
  gap:.8rem;
  justify-content:flex-start;
  font-size:1.2rem;
}
.nature-site .page-hero .product-name img { width:50px; height:50px; flex:0 0 50px; }
.nature-site .page-hero .product-name small { font-size:.82rem; margin-top:.15rem; }
.nature-site .page-hero h1 {
  max-width:78%;
  margin:0;
  color:#285b70;
  font-size:clamp(2rem,min(4.1vw,7.5svh),3.3rem);
  line-height:1.22;
}
.nature-site .page-hero .lead { max-width:min(78%,760px); margin:0; color:#46606c; font-size:1rem; line-height:1.65; }

/* Non-policy content follows the app's grouped cards and soft category accents. */
.nature-content-page .section { --section-accent:#4ab9a6; --section-tint:#eef8f5; }
.nature-content-page [aria-labelledby="logging"],
.nature-content-page [aria-labelledby="data"] { --section-accent:#45aedd; --section-tint:#edf7fc; }
.nature-content-page [aria-labelledby="review"],
.nature-content-page [aria-labelledby="reflect"] { --section-accent:#9b82c3; --section-tint:#f4f0f9; }
.nature-content-page [aria-labelledby="practice"] { --section-accent:#c87f78; --section-tint:#fcf3f2; }
.nature-content-page [aria-labelledby="preferences"] { --section-accent:#b49b54; --section-tint:#fbf8ed; }
.nature-content-page .section > .container {
  border:1px solid #d7e7ec;
  border-left:3px solid var(--section-accent);
  border-radius:13px;
  background:#ffffffed;
  box-shadow:0 3px 9px #315a6a08;
}
.nature-content-page .section-heading { background:var(--section-tint); border-radius:12px 12px 0 0; }
.nature-content-page .eyebrow { font-family:Comfortaa,system-ui,sans-serif; text-transform:none; letter-spacing:.025em; font-weight:600; }
.nature-content-page .showcase-card { border:1px solid #dae6ec; border-radius:12px; box-shadow:0 2px 6px #315a6a08; }
.nature-content-page .showcase-screen { background:linear-gradient(155deg,#f6fbfd,#edf7f5); border-bottom:1px solid #dbeaf0; }
.nature-content-page .showcase-screen img { border:1px solid #d1e3e9; border-radius:9px; box-shadow:0 4px 16px #315a6a12; }
.nature-content-page .showcase-card h3 { color:#315e71; font-size:1rem; }
.nature-content-page .showcase-card p { color:#596a73; font-size:.94rem; }
.nature-content-page .carousel-arrow { border-radius:11px; background:#f0f9fd; border-color:#c5e5f3; color:#278fb7; }
.nature-content-page .preference-grid > div,
.nature-content-page .cloud-plan-card { border-left:3px solid #49b8a6; border-radius:11px; box-shadow:0 2px 5px #315a6a06; }
.nature-content-page .cloud-plan-card + .cloud-plan-card { border-left-color:#46add9; }
.nature-content-page .about-panel { border-radius:13px; border-left-color:#4ab9a6; box-shadow:0 3px 9px #315a6a08; }
.nature-content-page .about-panel .about-purpose { background:#eef8f5; }
.nature-content-page.legal-page .legal-section {
  padding:1.25rem 1.4rem;
  border:1px solid #d7e7ec;
  border-left:3px solid #4ab9a6;
  border-radius:12px;
  background:#ffffffed;
  box-shadow:0 3px 9px #315a6a08;
}
.nature-content-page.legal-page .legal-section:nth-of-type(even) { border-left-color:#45aedd; }
.nature-content-page.legal-page .legal-section h2 { color:#315e71; border-bottom:1px solid #d9eaf0; }
.nature-content-page.legal-page .legal-notice { border-left-color:#c87f78; background:#fff8f7; }
.nature-content-page .support-actions a { background:#eff9fd; border-color:#c5e5f3; color:#16627c; }

/* Home: scale the band to the space below navigation rather than a fixed phone height. */
.nature-site.home-page .product-hero {
  padding:var(--band-space) 0;
  min-height:0;
}
.nature-site.home-page .product-hero-grid {
  grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr);
  gap:clamp(1.25rem,3vw,2.5rem);
}
.nature-site.home-page .nature-hero-copy { padding:clamp(1rem,2.7svh,1.6rem); }
.nature-site.home-page .product-name { margin:0 0 clamp(.65rem,1.6svh,1rem); font-size:clamp(1.1rem,1.6vw,1.35rem); }
.nature-site.home-page .product-name img { width:52px; height:52px; flex-basis:52px; }
.nature-site.home-page .product-hero h1 { font-size:clamp(2rem,min(3.5vw,6.5svh),3.25rem); line-height:1.2; margin-bottom:clamp(.7rem,1.9svh,1.1rem); }
.nature-site.home-page .product-hero .lead { font-size:clamp(.94rem,min(1.35vw,2.05svh),1.04rem); line-height:1.6; }
.nature-site.home-page .hero-actions { margin-top:clamp(.7rem,1.9svh,1.15rem); }
.nature-site.home-page .hero-core-note { margin-top:.65rem; font-size:.9rem; }
.nature-site.home-page .hero-fan {
  height:clamp(290px,calc(100svh - var(--site-header-size) - 2 * var(--band-space) - 24px),500px);
  width:min(430px,100%);
  margin:0;
}
.nature-site.home-page .fan-card { max-height:calc(100% - 2.5rem); }

/* Short desktop and landscape windows keep the entire band compact, without clipping text. */
@media(min-width:821px) and (max-height:620px) {
  .nature-site { --site-header-size:64px; --band-space:.75rem; }
  .nature-site.home-page .nature-hero-copy { padding:.9rem 1.1rem; }
  .nature-site.home-page .product-name { gap:.7rem; margin-bottom:.65rem; font-size:1.1rem; }
  .nature-site.home-page .product-name img { width:40px; height:40px; flex-basis:40px; }
  .nature-site.home-page .product-name small { font-size:.78rem; margin-top:.1rem; }
  .nature-site.home-page .product-hero h1 { font-size:clamp(1.9rem,5.8svh,2.5rem); margin-bottom:.6rem; }
  .nature-site.home-page .product-hero .lead { font-size:.92rem; line-height:1.5; }
  .nature-site.home-page .hero-actions { margin-top:.65rem; gap:.6rem; }
  .nature-site.home-page .hero-core-note { margin-top:.4rem; font-size:.85rem; }
  .nature-site.home-page .hero-fan { height:clamp(250px,calc(100svh - 112px),430px); --fan-spread:clamp(48px,6vw,78px); }
  .nature-site .page-hero { padding:1rem 0; }
}
@media(max-width:820px) {
  .nature-site { --site-header-size:70px; }
  .nature-site .nav-wrap { flex-wrap:nowrap; }
  .nature-site .page-hero { padding:1.4rem 0 1.75rem; }
  .nature-site .page-hero::before { inset:0 0 0 45%; background-size:280px auto; opacity:.23; }
  .nature-site .page-hero .product-name { max-width:100%; }
  .nature-site .page-hero h1 { max-width:100%; font-size:clamp(1.9rem,5vw,2.7rem); }
  .nature-site .page-hero .lead { max-width:100%; font-size:.98rem; }
  .nature-site.home-page .product-hero-grid { grid-template-columns:minmax(0,1fr); gap:1rem; }
  .nature-site.home-page .nature-hero-copy { max-width:640px; padding:1.35rem; }
  .nature-site.home-page .product-hero h1 { font-size:clamp(2rem,6.3vw,3rem); }
  .nature-site.home-page .product-hero .lead { font-size:1rem; }
  .nature-site.home-page .hero-fan { width:min(400px,100%); height:clamp(300px,52svh,430px); }
  .nature-site.home-page .product-hero { padding:1.25rem 0 2rem; }
  .nature-site .site-header::before { background-size:auto 100%; }
}
@media(max-width:680px) {
  .nature-site .page-hero .product-name { gap:.65rem; font-size:1.05rem; }
  .nature-site .page-hero .product-name img { width:44px; height:44px; flex-basis:44px; }
  .nature-site .page-hero .product-name small { font-size:.77rem; }
  .nature-site .page-hero h1 { font-size:clamp(1.8rem,7vw,2.3rem); }
  .nature-site.home-page .nature-hero-copy { padding:1.2rem 1rem; }
  .nature-content-page.legal-page .legal-section { padding:1.1rem 1rem; }
}

/* Keep navigation in document flow in mobile and embedded browser viewports. */
@media(max-width:820px), (hover:none) and (pointer:coarse) {
  .nature-site .site-header {
    position:relative;
    top:auto;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  .nature-site section[id],
  .nature-site .tools-carousel { scroll-margin-top:1rem; }
}
@media(max-width:680px) {
  .nature-site .nav-wrap { flex-wrap:wrap; }
  .nature-site .nav-links {
    position:static;
    flex-basis:100%;
    width:100%;
    margin:0 0 .75rem;
    max-height:none;
    box-shadow:none;
  }
}
