/* Swiss Soil — tokens + base. Archivo (width axis = hierarchy). Warm ground, deep soil ink, moss + slate accents. */
*,*::before,*::after{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul{list-style:none;padding:0}
:root{
  --peat:#f1ecdf; --peat-2:#e7e0cf; --line:rgba(46,36,26,.16); --line-2:rgba(46,36,26,.3);
  --bone:#2b2119; --bone-2:#4a3d31; --ash:#7d6f5f;
  --soil:#3b2f24; --moss:#5f6b3a; --moss-2:#7a8750; --slate:#3f5b66; --slate-2:#5a7a87; --ferric:#3b2f24;
  --f:'Archivo',system-ui,sans-serif;
  --w:1320px;--pad:clamp(20px,4vw,56px);
}
body{background:var(--peat);color:var(--bone);font-family:var(--f);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--moss);color:#fff}
:focus-visible{outline:2px solid var(--moss);outline-offset:3px}
.disp{font-weight:300;font-variation-settings:"wdth" 72;letter-spacing:-.025em;line-height:.94;text-wrap:balance}
h1.disp{font-size:clamp(52px,6.6vw,112px)}
h2.disp{font-size:clamp(36px,4.6vw,72px)}
h3{font-weight:400;font-variation-settings:"wdth" 82;font-size:clamp(22px,2vw,30px);letter-spacing:-.02em;line-height:1.1}
.mono{font-size:12px;font-weight:500;font-variation-settings:"wdth" 112;letter-spacing:.1em;text-transform:uppercase;color:var(--ash)}
.lead{font-size:clamp(19px,1.6vw,24px);line-height:1.4;color:var(--bone);max-width:52ch;font-variation-settings:"wdth" 96}
p{color:var(--bone-2);max-width:60ch}
.acc{color:var(--moss)}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--pad)}
.sec{padding:clamp(96px,11vw,176px) 0;position:relative}
.sec+.sec{border-top:1px solid var(--line)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,112px);align-items:start}
.sec-head{display:grid;grid-template-columns:1fr;gap:18px;margin-bottom:clamp(40px,5vw,80px)}
.sec-head h2{max-width:24ch}
.sec-head .mono{color:var(--moss)}
.btn{display:inline-flex;align-items:center;gap:12px;font-size:14px;font-weight:500;font-variation-settings:"wdth" 100;padding:16px 24px;border:1px solid var(--bone);border-radius:999px;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--bone);color:var(--peat)}
.btn:active,.dbtns button:active,.replay:active{transform:scale(.97);transition:transform .1s ease-out}
.btn-acc{background:var(--moss);border-color:var(--moss);color:#fff}
.btn-acc:hover{background:var(--soil);border-color:var(--soil);color:#fff}
.btn-light{background:var(--peat);border-color:var(--peat);color:var(--bone)}
.btn-light:hover{background:#fff;border-color:#fff;color:var(--bone)}
.btn-ghost{border-color:rgba(241,236,223,.6);color:var(--peat)}
.btn-ghost:hover{background:var(--peat);color:var(--bone)}
.btn .ar{width:12px;height:12px;display:inline-block;border-right:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:rotate(45deg) scale(.75)}
.hd{position:fixed;inset:0 0 auto 0;z-index:50;color:var(--peat);transition:color .35s,background-color .35s,box-shadow .35s}
.hd.on{color:var(--bone);background:rgba(241,236,223,.72);-webkit-backdrop-filter:blur(20px) saturate(160%);backdrop-filter:blur(20px) saturate(160%);box-shadow:0 1px 0 rgba(46,36,26,.08)}
.hd.on .lg{border-left-color:var(--line-2)}
@media(prefers-reduced-transparency:reduce){.hd.on{background:var(--peat);backdrop-filter:none;-webkit-backdrop-filter:none}}
.hd-in{max-width:var(--w);margin:0 auto;padding:22px var(--pad);display:flex;justify-content:space-between;align-items:center;transition:padding .35s}
.hd.on .hd-in{padding:14px var(--pad)}
.hd .wm{height:clamp(30px,3vw,44px);width:auto;color:currentColor;transition:height .35s,opacity .45s cubic-bezier(.22,.68,.24,1)}
.hd.wm-off .wm{opacity:0;pointer-events:none}
.hd.on .wm{height:26px}
.hd nav{display:flex;gap:22px;font-size:13px;font-weight:500;letter-spacing:.01em;white-space:nowrap}
.hd nav a{opacity:.72}.hd nav a:hover,.hd nav a[aria-current]{opacity:1}
.hd .lg{display:flex;gap:10px;margin-left:10px;padding-left:16px;border-left:1px solid rgba(241,236,223,.35)}
.hd .lg a{opacity:.5}.hd .lg a[aria-current]{opacity:1}
@media(max-width:900px){.two,.sec-head{grid-template-columns:1fr}.hd nav{display:none}}
