/* LeafHaven — a slower, warmer world. */
.shell { width:min(1200px, calc(100% - 80px)); margin-inline:auto; }
.eyebrow { margin:0 0 18px; color:var(--forest); font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.section-title { margin:0; font-family:var(--font-display); font-size:clamp(32px,3.7vw,49px); font-weight:600; line-height:1.4; letter-spacing:-.035em; }
.section-head,.owner-head { display:flex; justify-content:space-between; align-items:flex-end; gap:50px; margin-bottom:38px; }
.section-lead { max-width:380px; margin:0; color:var(--muted); font-size:14px; line-height:1.9; }
.hero { position:relative; padding:66px 0 88px; overflow:hidden; }
.hero-grid { display:grid; grid-template-columns:1fr 1.03fr; gap:48px; align-items:center; }
.hero-content { padding:20px 0; }
.season { display:flex; align-items:center; gap:10px; color:var(--forest); font-size:11px; letter-spacing:.08em; font-weight:600; margin-bottom:24px; }
.season-dot,.photo-dot { width:6px; height:6px; background:#78964c; border-radius:50%; flex-shrink:0; }
.hero h1 { margin:0; font-family:var(--font-display); color:#263c30; font-size:clamp(42px,5vw,70px); line-height:1.38; font-weight:600; letter-spacing:-.055em; }
.hero h1 span { color:#62854b; position:relative; white-space:nowrap; }
.hero h1 span::after { content:''; position:absolute; left:0; right:8px; height:6px; border-radius:50%; bottom:-6px; background:#ccd7b6; transform:rotate(-3deg); }
.hero-intro { margin:25px 0 0; color:var(--muted); font-size:15px; line-height:2; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:31px; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:10px; min-height:49px; padding:0 21px; border:1px solid transparent; border-radius:8px; font-size:13px; font-weight:600; cursor:pointer; transition:background-color .18s, border-color .18s, transform .18s; }
.button-primary { background:var(--forest); color:#fff; }
.button-primary:hover { background:#34624c; transform:translateY(-2px); }
.button-ghost { border-color:var(--line); color:var(--forest); background:transparent; }
.button-ghost:hover { background:#eceee5; border-color:#b3c0a5; transform:translateY(-2px); }
.button-icon { font-size:20px; font-weight:400; }
.hero-footnote { display:flex; align-items:center; gap:12px; color:#737b6c; font-size:11px; margin-top:30px; }
.tiny-avatars { display:flex; padding-left:4px; }
.tiny-avatars img { width:29px; height:29px; border:2px solid var(--canvas); border-radius:50%; background:#e3e6d8; object-fit:contain; margin-left:-4px; }
.hero-visual { position:relative; padding:10px 0 38px 0; }
.hero-photo { position:relative; margin:0 0 0 20px; padding:10px 10px 0; border:1px solid #dedfd4; background:#fdfcf8; border-radius:105px 14px 14px 14px; transform:rotate(2deg); box-shadow:0 12px 30px #3443330a; }
.hero-photo>img { width:100%; height:435px; object-fit:cover; object-position:57% center; border-radius:96px 7px 7px 7px; }
.hero-photo figcaption { min-height:42px; display:flex; gap:8px; align-items:center; color:#6c7765; font-size:8px; letter-spacing:.09em; }
.hero-photo figcaption>span:last-child { margin-left:auto; }
.hero-stamp { position:absolute; top:-14px; right:-22px; display:grid; align-content:center; text-align:center; width:106px; height:106px; border:1px solid #c1cba8; border-radius:50%; color:#42623c; font-family:var(--font-display); line-height:1.5; font-size:18px; background:#e7ebd7; transform:rotate(11deg); }
.hero-stamp span { margin-top:5px; font-family:var(--font-sans); font-size:6px; letter-spacing:.1em; }
.hero-small-photo { position:absolute; left:-18px; bottom:0; width:220px; background:#fdfcf8; padding:7px 7px 0; border:1px solid #dedfd4; border-radius:9px; transform:rotate(-5deg); box-shadow:0 10px 25px #24352b14; }
.hero-small-photo img { width:100%; height:112px; object-fit:cover; border-radius:4px; }
.hero-small-photo span { display:block; padding:8px 2px; font-size:10px; color:#57634f; }
.quickbar { background:#edeedc; border-block:1px solid #dfe2ce; }
.quickbar-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr; min-height:96px; }
.quick-item { display:flex; flex-direction:column; justify-content:center; padding:20px 26px; border-left:1px solid #daddc9; min-width:0; }
.quick-item:first-child { padding-left:0; border-left:0; }
.quick-label { color:#788168; font-size:10px; letter-spacing:.08em; }
.quick-value { margin-top:6px; color:#3b5133; font-weight:600; font-size:14px; overflow-wrap:anywhere; }
.quick-value.address { font-family:var(--font-mono); font-size:18px; }
.status-wrap { display:flex; gap:8px; align-items:center; }
.status-light { width:6px; height:6px; border-radius:50%; background:#b5934e; flex-shrink:0; }
.status-light.online { background:#648d4d; }.status-light.offline { background:#9d8d69; }
.about { padding:100px 0 92px; }
.story-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.story-grid .section-title { max-width:390px; }
.story-copy { color:var(--muted); font-size:14px; line-height:1.95; }
.story-copy p { margin:0 0 15px; }
.manifesto { margin-top:23px; padding-left:18px; border-left:2px solid #95a36c; color:var(--forest); font-size:15px; }
.feature-list { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:45px; }
.feature { display:flex; align-items:baseline; gap:18px; border-top:1px solid var(--line); padding:26px 0 0; }
.feature-index { color:#8c9b78; font-size:12px; font-family:var(--font-mono); }
.feature h3 { margin:0; font-size:16px; font-weight:600; }
.feature p { margin:8px 0 0; color:var(--muted); font-size:13px; line-height:1.9; }
.worlds { padding:86px 0 94px; background:#edf0e6; }
.gallery { display:grid; grid-template-columns:1.16fr .84fr; grid-template-rows:repeat(2,230px); gap:18px; }
.shot { position:relative; margin:0; min-height:0; overflow:hidden; border-radius:12px; background:#1d3326; }
.shot:first-child { grid-row:1/3; }
.shot img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.3,1); }
.shot:hover img { transform:scale(1.035); }
.shot-caption { position:absolute; inset:auto 0 0; display:flex; justify-content:space-between; align-items:end; padding:45px 22px 20px; background:linear-gradient(transparent,#132317bd); color:#fff; }
.shot-caption strong { font-size:16px; font-weight:500; }.shot-caption span { color:#d7dfcf; font-size:11px; }
.workshops { padding:94px 0; }
.workshop-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.workshop-card { min-width:0; padding:27px 22px 22px; border:1px solid var(--line); background:#fafaf5; border-radius:12px; transition:transform .22s, background-color .22s, border-color .22s; }
.workshop-card:hover { transform:translateY(-4px); background:#eef1e5; border-color:#b7c5a3; }
.workshop-icon { display:grid; place-items:center; color:#547244; font-size:30px; font-family:var(--font-display); width:46px; height:46px; margin-bottom:24px; border-radius:11px; background:#e9eedd; }
img.pixel-icon { image-rendering:pixelated; padding:11px; object-fit:contain; }
.workshop-card:nth-child(3) .workshop-icon { color:#9c7b4f; background:#f0e8d9; }
.workshop-card:nth-child(4) .workshop-icon { color:#826984; background:#f0e8ed; font-size:23px; }
.workshop-card small { color:#8b917f; letter-spacing:.07em; font-size:8px; }
.workshop-card h3 { display:flex; justify-content:space-between; margin:9px 0; font-size:18px; font-weight:600; }.workshop-card h3 span { font-size:17px; color:#8b9b79; }
.workshop-card p { min-height:48px; color:var(--muted); font-size:12px; line-height:1.8; margin:0; }
.workshop-link { display:block; margin-top:25px; padding-top:17px; border-top:1px solid var(--line); color:#657750; font-size:10px; }
.rules { padding:15px 0 96px; }
.rules-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.rule { padding-top:22px; border-top:1px solid var(--line); }
.rule-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }.rule-number { font-family:var(--font-mono); font-size:12px; color:#889b6c; }.rule-tag { font-size:10px; color:#939784; }
.rule h3 { margin:25px 0 12px; font-size:15px; font-weight:600; }.rule p { margin:0; font-size:12px; color:var(--muted); line-height:1.9; }
.join { position:relative; background:#264836; color:#f4f2e6; padding:86px 0; overflow:hidden; }
.join::after { content:''; position:absolute; width:340px; height:340px; border:1px solid #c0cfaa1a; border-radius:65% 0 65% 0; left:-150px; bottom:-230px; transform:rotate(-25deg); pointer-events:none; }
.join-grid { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; }
.join .eyebrow { color:#b6c89c; }.join .section-title { color:#faf8ed; }.join-note { margin:20px 0 0; max-width:430px; color:#bbcab9; font-size:14px; line-height:1.9; }.join-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.join .button-primary { background:#e0e9c6; color:#244731; }.join .button-primary:hover { background:#edf3d9; }.join .button-ghost { color:#eef1e6; border-color:#637b62; }.join .button-ghost:hover { background:#395941; }
.steps { display:grid; gap:0; }.step { display:flex; gap:17px; align-items:flex-start; padding:20px 0; border-bottom:1px solid #aec19e2b; }.step:last-child { border-bottom:0; }.step-num { display:grid; place-items:center; flex-shrink:0; width:30px; height:30px; border:1px solid #8aa27c55; border-radius:50%; color:#bace9e; font-size:10px; font-family:var(--font-mono); }.step h3 { margin:0; font-size:14px; font-weight:500; }.step p { margin:5px 0 0; color:#bbcab9; font-size:12px; }.step code { color:#e2eccf; background:#ffffff0d; padding:2px 4px; border-radius:3px; }
.owner { padding:94px 0; }.owner-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }.owner-card { border:1px solid var(--line); border-radius:12px; overflow:hidden; background:#fafaf5; }.owner-portrait { width:100%; height:205px; object-fit:contain; padding:22px; background:#ecefe3; image-rendering:pixelated; }.owner-card:nth-child(2) .owner-portrait { background:#eeece2; }.owner-card:nth-child(3) .owner-portrait { background:#e5ebe4; }.owner-copy { padding:25px; }.owner-copy h3 { margin:0; font-size:18px; font-weight:600; }.owner-role { margin:8px 0 0; font-size:9px; letter-spacing:.08em; color:#7d8c65; }.owner-copy>p:not(.owner-role) { color:var(--muted); font-size:12px; line-height:1.9; }.contact-list { display:flex; gap:5px; flex-wrap:wrap; margin-top:18px; }.contact-pill { color:#67735a; padding:4px 6px; font-size:9px; border:1px solid var(--line); border-radius:4px; }
@media (max-width:1080px) { .shell { width:calc(100% - 64px); }.hero-grid { gap:28px; }.hero h1 { font-size:52px; }.hero-photo>img { height:390px; }.hero-stamp { right:-12px; width:90px; height:90px; font-size:16px; }.hero-small-photo { width:185px; }.workshop-grid { grid-template-columns:repeat(2,1fr); }.rules-grid { grid-template-columns:repeat(2,1fr); }.join-grid { gap:48px; } }
@media (max-width:760px) { .shell { width:calc(100% - 40px); }.hero { padding:30px 0 55px; }.hero-grid { grid-template-columns:1fr; gap:30px; }.hero-content { padding:12px 0 0; }.hero h1 { font-size:clamp(40px,8.8vw,62px); line-height:1.42; }.season { font-size:9px; margin-bottom:20px; }.hero-intro { font-size:14px; margin-top:22px; }.hero-footnote { margin-top:22px; }.hero-visual { max-width:580px; width:100%; margin:auto; padding:14px 6px 26px 8px; }.hero-photo { margin-left:20px; border-radius:70px 12px 12px 12px; }.hero-photo>img { height:340px; border-radius:62px 6px 6px 6px; }.hero-stamp { top:0; right:-3px; width:80px; height:80px; font-size:14px; }.hero-small-photo { width:165px; left:0; }.hero-small-photo img { height:85px; }.hero-small-photo span { font-size:8px; }.hero-photo figcaption { font-size:6px; }.quickbar-grid { grid-template-columns:1fr 1fr; min-height:0; }.quick-item { padding:20px; }.quick-item:nth-child(3) { padding-left:0; border-left:0; border-top:1px solid #daddc9; }.quick-item:nth-child(4) { border-top:1px solid #daddc9; }.quick-value { font-size:12px; }.quick-value.address { font-size:16px; }.about,.worlds,.workshops,.owner { padding:64px 0; }.story-grid { grid-template-columns:1fr; gap:26px; }.story-grid .section-title { max-width:340px; }.feature-list { grid-template-columns:1fr; gap:0; margin-top:30px; }.feature { padding:22px 0; }.section-head,.owner-head { display:block; margin-bottom:28px; }.section-lead { margin-top:16px; }.gallery { grid-template-columns:1fr 1fr; grid-template-rows:330px 180px; gap:10px; }.shot:first-child { grid-column:1/-1; grid-row:auto; }.shot-caption { padding:38px 14px 14px; display:block; }.shot-caption strong { font-size:13px; }.shot-caption span { display:block; margin-top:4px; font-size:9px; }.workshop-grid { gap:12px; }.workshop-card { padding:22px 18px; }.workshop-card h3 { font-size:16px; }.workshop-card small { font-size:7px; }.workshop-card p { font-size:11px; min-height:42px; }.workshop-link { font-size:9px; margin-top:20px; }.rules { padding:0 0 64px; }.rules-grid { gap:28px 20px; }.rule h3 { font-size:14px; }.rule-tag { font-size:9px; }.join { padding:64px 0; }.join-grid { grid-template-columns:1fr; gap:32px; }.owner-grid { grid-template-columns:1fr; gap:18px; }.owner-card { display:grid; grid-template-columns:115px 1fr; }.owner-portrait { height:100%; min-height:180px; padding:13px; }.owner-copy { padding:20px; }.owner-copy h3 { font-size:16px; }.owner-role { font-size:8px; }.owner-copy>p:not(.owner-role) { font-size:11px; }.contact-pill { font-size:8px; }.section-title { font-size:32px; } }
@media (max-width:380px) { .hero h1 { font-size:37px; }.hero-actions { display:grid; }.hero-photo>img { height:280px; }.workshop-grid { grid-template-columns:1fr; }.workshop-card p { min-height:0; }.owner-card { grid-template-columns:1fr; }.owner-portrait { height:160px; min-height:0; }.rules-grid { grid-template-columns:1fr; } }
@media(max-width:760px) { .hero-actions { display:grid; grid-template-columns:1fr; gap:10px; } }