/* SITEWALK public homepage · Daylight: warm stone, white, graphite ink, one orange; Figtree; the dot-and-ring mark. */
@font-face{font-family:Figtree;src:url(/font/figtree.woff2) format('woff2');font-weight:300 800;font-display:swap}
:root{--stone:#EEEAE3;--white:#FFFEFC;--ink:#23211E;--ink2:#5F5A52;--ink3:#9B958B;--line:rgba(35,33,30,.09);--line2:rgba(35,33,30,.16);
 --sun:#EC6A1E;--sunlo:rgba(236,106,30,.12);--warn:#B4501A;
 --sh:0 1px 0 rgba(255,255,255,.95) inset,0 12px 32px -14px rgba(74,56,32,.26),0 2px 6px rgba(74,56,32,.06);--r:24px;color-scheme:light}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--stone);color:var(--ink);font:17px/1.5 Figtree,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
[hidden]{display:none!important}
.mk{display:block}.mk .ring{fill:none;stroke:var(--sun);stroke-opacity:.42;stroke-width:2.2}.mk .dot{fill:var(--sun)}
.grow{flex:1}

.hbar{display:flex;align-items:center;gap:12px;width:100%;max-width:1240px;margin:0 auto;padding:calc(20px + env(safe-area-inset-top)) 32px 0}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;font-weight:750;font-size:25px;letter-spacing:-.045em}
.brand .mk{width:34px;height:34px}
.signin{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;background:var(--white);box-shadow:var(--sh);text-decoration:none;font-weight:650;font-size:15px}

main{flex:1;width:100%;max-width:1240px;margin:0 auto;padding:18px 32px 40px}
.hero{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:48px;align-items:center;margin-top:28px}
h1{font-size:clamp(40px,5.2vw,68px);font-weight:720;letter-spacing:-.03em;line-height:1.02;margin:0 0 18px}
.lead{font-size:clamp(18px,1.6vw,21px);color:var(--ink2);margin:0 0 30px;max-width:30em}
.ctas{display:flex;flex-direction:column;gap:12px;max-width:380px}
.ctas a{display:flex;align-items:center;justify-content:center;gap:12px;min-height:58px;padding:0 26px;border-radius:999px;text-decoration:none;font-weight:700;font-size:18px}
.google{background:var(--ink);color:#fff}
.google .g{width:22px;height:22px;background:#fff;border-radius:50%;padding:4px;box-sizing:content-box;flex:none}
.start{background:var(--sun);color:#fff;justify-content:space-between!important;box-shadow:0 10px 24px -12px rgba(236,106,30,.7)}
.start b{font-size:20px}
.ctas a:hover{filter:brightness(1.06)}
.ctas a:active{transform:scale(.985)}
.err{color:var(--warn);font-weight:600;min-height:1.5em;margin:14px 0 0;max-width:380px}

.pic{position:relative;margin:0;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);background:#DAD4CA;aspect-ratio:16/10}
.pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.pic figcaption{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:9px;background:rgba(253,252,249,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
 border-radius:999px;padding:8px 14px;font-weight:650;font-size:14px}
.pic figcaption i{width:9px;height:9px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 4px var(--sunlo)}

.gains{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:44px}
.gain{display:flex;gap:14px;align-items:flex-start;background:var(--white);border-radius:20px;box-shadow:var(--sh);padding:22px 22px 24px}
.gain .num{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--sunlo);color:#A6460F;font-weight:750;font-size:16px}
.gain p{margin:4px 0 0;color:var(--ink2);font-size:17px}
.gain b{color:var(--ink);font-weight:700}
body.invited .gains{display:none}

.hfoot{display:flex;align-items:center;gap:16px;width:100%;max-width:1240px;margin:0 auto;padding:18px 32px calc(26px + env(safe-area-inset-bottom));color:var(--ink3);font-size:14px}
.legal{display:flex;gap:18px}
.legal a{color:var(--ink2);text-decoration:none;font-weight:600}
.legal a:hover{text-decoration:underline}

@media (max-width:900px){
 .hbar{padding:calc(12px + env(safe-area-inset-top)) 16px 0}
 main{padding:8px 16px 28px}
 .hero{grid-template-columns:1fr;gap:24px;margin-top:14px}
 .pic{order:-1;aspect-ratio:16/11}
 h1{margin-bottom:12px}
 .lead{margin-bottom:22px}
 .ctas{max-width:none}
 .gains{grid-template-columns:1fr;gap:12px;margin-top:28px}
 .gain{padding:18px}
 .hfoot{padding:12px 16px calc(20px + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* /start: name your company */
body.startpage main{max-width:620px;padding-top:30px}
.card{background:var(--white);border-radius:var(--r);box-shadow:var(--sh);padding:32px}
.card h1{font-size:clamp(32px,5vw,44px)}
.card .lead{margin-bottom:22px}
.field{display:block;margin:0 0 16px}
.field span{display:block;font-weight:700;margin:0 0 8px}
.field input{width:100%;height:58px;border-radius:16px;border:1.5px solid var(--line2);background:var(--white);padding:0 18px;font:inherit;font-size:18px;color:var(--ink)}
.field input:focus{outline:none;border-color:var(--sun)}
.card button{width:100%;min-height:58px;border:0;border-radius:999px;background:var(--sun);color:#fff;font:inherit;font-weight:700;font-size:18px;cursor:pointer;margin-top:6px;
 box-shadow:0 10px 24px -12px rgba(236,106,30,.7)}
.card button:disabled{opacity:.55;cursor:default}
.small{color:var(--ink3);font-size:14.5px;margin:16px 0 0}
@media (max-width:900px){.card{padding:22px}}