@import url('https://fonts.googleapis.com/css2?family=DM+Mono&family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{--bg:#f8f7f3;--ink:#161616;--accent:#a66a55;--line:rgba(22,22,22,.16);--display:'Playfair Display',serif;--sans:'DM Sans',sans-serif;--mono:'DM Mono',monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.45}.wrap{width:min(1180px,calc(100% - 48px));margin:auto}.demo-nav{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{font:600 19px var(--display);letter-spacing:-.6px}.demo-nav nav{display:flex;gap:24px}.demo-nav a,.button{color:inherit;text-decoration:none;font-size:12px}.button{display:inline-flex;align-items:center;gap:14px;border:1px solid currentColor;padding:13px 17px;transition:.2s transform,.2s background}.button:hover{transform:translateY(-2px)}.eyebrow{font:10px var(--mono);letter-spacing:1px;text-transform:uppercase;opacity:.65}.hero{min-height:620px;padding:62px 0;display:grid;align-items:center;gap:45px}.hero h1{font:clamp(48px,7vw,95px)/.95 var(--display);letter-spacing:-4px;margin:0}.hero p{max-width:430px;font-size:16px;opacity:.7}.section{padding:100px 0}.section-title{font:clamp(34px,4vw,57px)/1 var(--display);letter-spacing:-2px;margin:0 0 35px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.card{border:1px solid var(--line);padding:22px;min-height:200px;position:relative}.card small{font:10px var(--mono);opacity:.6}.card h3{font:25px var(--display);font-weight:500;margin:26px 0 8px}.card p{font-size:13px;opacity:.65;margin:0}.label{font:10px var(--mono);letter-spacing:1px;text-transform:uppercase}.footer{padding:26px 0;border-top:1px solid var(--line);font-size:11px;opacity:.65;display:flex;justify-content:space-between}.visual{position:relative;overflow:hidden;min-height:390px}.fade{opacity:0;transform:translateY(16px);transition:.7s ease}.fade.in{opacity:1;transform:none}@media(max-width:700px){.wrap{width:min(100% - 32px,1180px)}.demo-nav{height:64px}.demo-nav nav{display:none}.hero{min-height:540px;padding:48px 0;gap:30px}.hero h1{letter-spacing:-2.5px}.section{padding:65px 0}.cards{grid-template-columns:1fr}.visual{min-height:300px}.footer{gap:15px}.demo-nav .button{padding:10px 12px}.hero p{font-size:14px}}