:root{
  --bg:#f5f1e7;
  --paper:#fbf9f3;
  --paper-2:#eef3e9;
  --water:#e8f1f0;
  --earth:#e7dfcf;
  --text:#18342a;
  --text-soft:#365247;
  --muted:#6e8076;
  --line:#18342a1f;
  --accent:#477a4e;
  --accent-2:#78986d;
  --serif:"Playfair Display",Georgia,serif;
  --sans:"DM Sans",Arial,sans-serif;
  --max:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:var(--sans);
  line-height:1.55;
  overflow-x:hidden;
}

/* A quiet paper/air texture — deliberately organic, not decorative. */
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.28;
  z-index:-2;
  background:
    radial-gradient(circle at 12% 18%,#7e9f7414 0 1px,transparent 1.5px),
    radial-gradient(circle at 82% 68%,#477a4e10 0 1px,transparent 1.5px);
  background-size:23px 23px,31px 31px;
}

body:after{
  content:"";
  position:fixed;
  width:42vw;
  height:42vw;
  max-width:620px;
  max-height:620px;
  right:-18vw;
  top:10vh;
  border-radius:55% 45% 60% 40%;
  background:radial-gradient(circle at 35% 35%,#a9c49a2e,transparent 66%);
  filter:blur(2px);
  pointer-events:none;
  z-index:-1;
}

header{
  position:absolute;
  top:0;
  width:100%;
  height:86px;
  padding:0 5%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  z-index:5;
}
header a{
  color:var(--muted);
  text-decoration:none;
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.brand{color:var(--text)!important}
.brand b{color:var(--accent);font-size:24px;margin-right:9px}

.hero{
  height:100svh;
  min-height:650px;
  display:grid;
  place-items:center;
  text-align:center;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse at 50% 58%,#d9e7d42e,transparent 42%),
    linear-gradient(180deg,#f8f5ec 0%,#f2eee2 72%,#e9eee4 100%);
}

/* Soft horizon + leaf-like forms instead of the old technical rings. */
.hero:before{
  content:"";
  position:absolute;
  width:76vw;
  height:38vw;
  max-height:470px;
  left:50%;
  bottom:-12vw;
  transform:translateX(-50%);
  border-radius:50% 50% 0 0;
  background:linear-gradient(180deg,#a8c39a38,#6f986b18);
  filter:blur(1px);
}
.hero:after{
  content:"";
  position:absolute;
  width:180px;
  height:340px;
  left:13%;
  bottom:-90px;
  border-radius:90% 10% 80% 20%;
  background:linear-gradient(145deg,#70966b25,#477a4e08);
  transform:rotate(18deg);
}

.hero-copy{z-index:2;padding:0 24px}
.eyebrow{
  font-size:10px;
  letter-spacing:.28em;
  color:var(--muted);
  text-transform:uppercase;
  margin:0 0 25px;
}
.hero h1{
  font:500 clamp(48px,8vw,105px)/.98 var(--serif);
  letter-spacing:-.045em;
  margin:0;
  color:var(--text);
}
.hero h1 i,.statement i,.final{color:var(--accent)}
.hero-copy>p:not(.eyebrow){font-size:18px;color:var(--text-soft);margin:30px 0}
.scroll{
  display:inline-block;
  margin-top:42px!important;
  font-size:10px!important;
  letter-spacing:.2em;
  color:var(--accent)!important;
  text-decoration:none;
}

/* Retained class names so the existing HTML structure stays intact. */
.orb{position:absolute;border:0;border-radius:50%;left:auto;top:auto;transform:none}
.o1{width:0;height:0}
.o2{width:0;height:0}

.section{max-width:var(--max);margin:auto;padding:170px 24px;position:relative}
.section>small{position:absolute;top:85px;color:#8a9a91;font-size:10px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:10%;padding-left:7%}
.section h2{font:500 clamp(43px,6vw,78px)/1.04 var(--serif);letter-spacing:-.04em;margin:0}
.large{font-size:clamp(19px,2.3vw,27px);color:var(--text-soft);line-height:1.45}
.large strong{color:var(--text);font-weight:500}

.statement{
  padding:170px 24px;
  text-align:center;
  background:linear-gradient(180deg,#eaf1e7 0%,#eef3e9 100%);
  position:relative;
  overflow:hidden;
}
.statement:before{
  content:"";
  position:absolute;
  width:280px;
  height:280px;
  left:-110px;
  top:50%;
  transform:translateY(-50%);
  border-radius:50%;
  background:#91ad8624;
}
.statement div{height:1px;background:var(--line);max-width:760px;margin:auto}
.statement h2{font:500 clamp(40px,6vw,76px)/1.08 var(--serif);margin:75px 0;color:var(--text)}

.questions{max-width:980px}
.ql{border-top:1px solid var(--line);margin-top:60px}
.ql>div{display:grid;grid-template-columns:60px 1fr;border-bottom:1px solid var(--line);padding:30px 0}
.ql span{font-size:10px;color:#8a9a91}
.ql p{font:500 clamp(25px,3.2vw,43px)/1.2 var(--serif);margin:0}

.heading{padding-left:7%;margin-bottom:65px}
.cards{
  margin-left:7%;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--line);
}
.cards a{
  min-height:330px;
  background:var(--paper);
  color:var(--text);
  text-decoration:none;
  padding:30px;
  position:relative;
  transition:background .35s ease,transform .35s ease,box-shadow .35s ease;
}
.cards a:nth-child(2){background:#edf3eb}
.cards a:nth-child(3){background:#eef3f1}
.cards a:hover{
  background:#ffffff;
  transform:translateY(-5px);
  box-shadow:0 18px 45px #18342a12;
}
.cards em{font-style:normal;font-size:10px;color:#8a9a91}
.cards h3{font:500 clamp(30px,3.5vw,48px)/1 var(--serif);margin:145px 0 18px}
.cards p{color:var(--muted);max-width:220px;font-size:14px}
.cards b{position:absolute;right:28px;bottom:28px;color:var(--accent);font-size:21px}

.pause{
  max-width:none;
  min-height:720px;
  padding:100px 8%;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9%;
  align-items:center;
  background:linear-gradient(135deg,#e9e2d2 0%,#edf2e9 100%);
}
.pause-art{
  height:560px;
  border-radius:52% 48% 42% 58% / 58% 48% 52% 42%;
  position:relative;
  background:
    radial-gradient(circle at 48% 34%,#f8f4e8 0 7%,transparent 7.5%),
    radial-gradient(ellipse at 50% 34%,#a5be952e 0 25%,transparent 56%),
    linear-gradient(155deg,#a9c29a,#dfe8d7 48%,#c5d5c0);
  overflow:hidden;
  box-shadow:0 30px 70px #18342a12;
}
.pause-art:before,
.pause-art:after{
  content:"";
  position:absolute;
  width:150px;
  height:310px;
  border-radius:100% 0 100% 0;
  background:#477a4e20;
}
.pause-art:before{left:10%;bottom:-80px;transform:rotate(-25deg)}
.pause-art:after{right:7%;top:-75px;transform:rotate(30deg);background:#78986d20}
.pause-art span{
  position:absolute;
  left:50%;
  top:34%;
  width:110px;
  height:110px;
  border-radius:50%;
  background:#f7f1df99;
  box-shadow:0 0 80px #ffffff55;
  transform:translateX(-50%);
}
.pause h2{font:500 clamp(50px,6vw,82px)/1 var(--serif);margin:0 0 30px}
.pause p{font-size:19px;color:var(--text-soft);line-height:1.65}
.pause strong{color:var(--text);font-weight:500}

.ending{
  min-height:90svh;
  max-width:850px;
  margin:auto;
  text-align:center;
  padding:160px 24px;
  display:grid;
  place-items:center;
}
.ending>h2{font:500 clamp(62px,10vw,125px)/.9 var(--serif);letter-spacing:-.05em;margin:0 0 65px}
.lines{font:500 clamp(24px,3vw,38px)/1.35 var(--serif);color:var(--text-soft)}
.lines p{margin:0}
.final{font:italic var(--serif);font-size:clamp(28px,4vw,48px);margin:70px 0}
nav{display:flex;gap:35px;border-top:1px solid var(--line);padding-top:28px}
nav a{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-decoration:none}
nav a:hover{color:var(--accent)}
footer{
  border-top:1px solid var(--line);
  margin:0 24px;
  padding:25px 0;
  color:#82928a;
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
  display:flex;
  justify-content:space-between;
}

@media(max-width:800px){
  .hero{min-height:620px}
  .hero h1{font-size:clamp(45px,13vw,70px)}
  .hero:before{width:130vw;height:55vw;bottom:-10vw}
  .hero:after{left:-45px}
  .split,.pause{grid-template-columns:1fr}
  .split,.heading{padding-left:8%}
  .cards{grid-template-columns:1fr;margin-left:7%}
  .cards a{min-height:250px}
  .cards h3{margin-top:105px}
  .pause{padding:90px 24px}
  .pause-art{height:400px;order:2}
  .section{padding:130px 24px}
  .ql>div{grid-template-columns:40px 1fr}
  footer{flex-direction:column;gap:10px}
}