:root {
--bg:#edf0e7;
--ink:#293a28;
--accent:#526845
}

body {
background:var(--bg);
color:var(--ink)
}

* {
box-sizing:border-box
}

html,body {
margin:0
}

html {
color-scheme:light
}

body {
font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;
-webkit-font-smoothing:antialiased
}

.page {
height:100svh;
min-height:620px;
padding:0 5.5vw 32px;
display:grid;
grid-template-rows:80px minmax(0,1fr);
position:relative;
isolation:isolate
}

.brand {
display:flex;
align-items:center;
font-size:20px;
letter-spacing:.02em
}

.hero {
display:grid;
align-items:center;
min-height:0;
max-width:1400px;
width:100%;
margin:0 auto
}

.copy {
min-width:0;
position:relative
}

.copy h1 {
font-size:clamp(40px,4.55vw,68px);
line-height:1.17;
letter-spacing:-.04em;
margin:0;
font-weight:600;
overflow-wrap:anywhere
}

.copy p {
font-size:18px;
line-height:1.85;
margin:28px 0 0;
max-width:36em;
color:inherit;
opacity:.87
}

.art {
margin:0;
min-width:0;
min-height:0;
width:100%;
display:flex;
align-items:center;
justify-content:center
}

.art img {
display:block;
width:100%;
height:100%;
object-fit:contain;
max-height:620px
}

::selection {
background:var(--accent);
color:var(--bg)
}