@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("../fonts/archivo-variable.ttf") format("truetype");
}
.environment-page {
  --bg:#F5F5F5;
  --panel:#E9E9E9;
  --ink:#292929;
  --muted:#5C5C5C;
  --moss:#454545;
  --fern:#6A6A6A;
  --line:#D4D4D4;
  --card:#FDFDFD;
  --forest:var(--bg-soft);
  --on-forest:var(--primary);
  --on-forest-muted:#526273;
  --on-forest-subtle:#5A6672;
  --forest-shade:linear-gradient(180deg,rgba(249,246,247,.92) 0%,rgba(249,246,247,.96) 55%,var(--bg-soft) 100%);
  color-scheme:light;
  box-sizing:border-box;
}
@media (prefers-color-scheme:dark) {
  .environment-page:not([data-theme="light"]) { --bg:#171717;--panel:#222222;--ink:#EEEEEE;--muted:#B5B5B5;--moss:#CACACA;--fern:#B9B9B9;--line:#3D3D3D;--card:#1E1E1E;color-scheme:dark }
}
.environment-page *,
.environment-page *::before,
.environment-page *::after { box-sizing:inherit }
.environment-page { margin:0;background:var(--bg);color:var(--ink);font-family:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:1.0625rem;line-height:1.6 }
.environment-page a { color:inherit }
.environment-page a:focus-visible { outline:3px solid var(--fern);outline-offset:3px }
.environment-page .wrap { max-width:1200px;margin:0 auto;padding:0 clamp(1.25rem,4vw,2.5rem) }
.environment-page .hero {
  --forest:#14281C;
  --on-forest:#FFFFFF;
  --on-forest-muted:#F1F5F2;
  --on-forest-subtle:#E1EAE4;
  --forest-shade:linear-gradient(180deg,rgba(8,24,16,.68) 0%,rgba(8,24,16,.72) 45%,rgba(8,24,16,.86) 100%);
  position:relative;overflow:hidden;background:var(--forest);min-height:min(88vh,760px);display:flex;align-items:flex-end
}
.environment-page .hero-art { position:absolute;inset:0 }
.environment-page .hero-art img { width:100%;height:100%;object-fit:cover;display:block }
.environment-page .hero-art::after { content:'';position:absolute;inset:0;background:var(--forest-shade) }
.environment-page .hero-text { position:relative;z-index:2;width:100%;padding-top:8rem;padding-bottom:clamp(3rem,7vw,5.5rem);color:var(--on-forest) }
.environment-page .hero--text { display:block;min-height:0 }
.environment-page .hero--text .hero-text { padding-block:clamp(3rem,6vw,5rem) }
.environment-page .hero--text h1 { font-size:clamp(2.4rem,4.8vw,4.25rem);max-width:20ch }
.environment-page .hero--text .lead { max-width:70ch }
.environment-page .crumb { font-size:.9rem;color:var(--on-forest-subtle);margin:0 0 1.2rem }
.environment-page .crumb a { text-decoration:none }
.environment-page h1 { font-weight:800;font-stretch:118%;font-size:clamp(2.6rem,6.8vw,5.6rem);line-height:.98;letter-spacing:-.025em;margin:0;max-width:13ch }
.environment-page .lead { font-size:clamp(1.05rem,1.6vw,1.28rem);color:var(--on-forest-muted);max-width:52ch;margin:1.5rem 0 0 }
.environment-page section.block { padding:clamp(4rem,9vw,6.5rem) 0 }
.environment-page .split { display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:start }
@media (max-width:860px) {
  .environment-page .split { grid-template-columns:1fr }
}
.environment-page .sticky { position:sticky;top:100px }
@media (max-width:860px) {
  .environment-page .sticky { position:static }
}
.environment-page h2 { font-weight:800;font-stretch:112%;font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.08;letter-spacing:-.02em;margin:0 0 1.1rem;max-width:18ch;color:var(--moss) }
.environment-page h3 { font-weight:700;font-size:1.18rem;margin:0 0 .45rem;line-height:1.3 }
.environment-page p { margin:0 0 1rem;max-width:66ch }
.environment-page .muted { color:var(--muted) }
.environment-page .steps { list-style:none;margin:0;padding:0;counter-reset:s }
.environment-page .steps li { counter-increment:s;display:grid;grid-template-columns:3.4rem 1fr;gap:1rem;padding:1.4rem 0;border-top:1px solid var(--line) }
.environment-page .steps li:last-child { border-bottom:1px solid var(--line) }
.environment-page .steps li::before { content:counter(s);display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50% 50% 50% 0;background:var(--moss);color:var(--bg);font-weight:800 }
.environment-page .steps p { margin:0;color:var(--muted) }
.environment-page figure { margin:0 }
.environment-page .scene { border-radius:18px;overflow:hidden;background:var(--card);border:1px solid var(--line) }
.environment-page .scene img { display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;background:var(--forest) }
.environment-page .scene.small { margin-top:2rem }
.environment-page .scene.small img { aspect-ratio:4/3 }
.environment-page .scene.scene--natural img { aspect-ratio:auto }
.environment-page .scene figcaption { padding:1.3rem 1.4rem 1.5rem }
.environment-page .scene figcaption p { margin:0;color:var(--muted) }
.environment-page .gallery { padding:clamp(4rem,9vw,6rem) 0;background:var(--panel) }
.environment-page .scenes { display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:1rem }
@media (max-width:900px) {
  .environment-page .scenes { grid-template-columns:1fr }
}
.environment-page .pillars { display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1rem }
@media (max-width:780px) {
  .environment-page .pillars { grid-template-columns:1fr }
}
.environment-page .pillar { background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden }
.environment-page .pillar .scene { border:0;border-radius:0 }
.environment-page .pillar .scene img { aspect-ratio:16/9 }
.environment-page .pbody { padding:1.5rem 1.6rem 1.8rem }
.environment-page .pbody ul { margin:.6rem 0 0;padding-left:1.1rem;color:var(--muted) }
.environment-page .pbody li { margin:.3rem 0 }
.environment-page .panorama {
  --forest:#EBE8E9;
  --forest-shade:linear-gradient(180deg,rgba(235,232,233,.78) 0%,rgba(235,232,233,.84) 55%,rgba(235,232,233,.92) 100%);
  position:relative;background:var(--forest);
}
.environment-page .panorama img { display:block;width:100%;height:clamp(320px,42vw,560px);object-fit:cover }
.environment-page .panorama::after { content:'';position:absolute;inset:0;background:var(--forest-shade) }
.environment-page .panorama figcaption {
  position:absolute;left:0;right:0;
  top:50%;
  transform:translateY(-50%);
  text-align:center;
  text-wrap:balance;
  font-weight:700;font-stretch:108%;
  font-size:calc(clamp(1.3rem,2.8vw,2.2rem) + 4px);
  line-height:1.25;color:var(--on-forest);z-index:2;max-width:1200px;
}

.environment-page h1,
.environment-page h2,
.environment-page h3 { font-family: "Archivo", "Inter", sans-serif; }
.environment-page h1 { color: inherit; }
.environment-page h3 { color: var(--ink); }
.environment-page .lead { font-weight: 400; line-height: 1.6; }