/* Homepage only. A native, lightweight take on 21st.dev's Woven Light Hero. */
.sonder-home .sh-hero-grid{grid-template-columns:.96fr 1.04fr;gap:5%;padding-block:24px 30px;min-height:590px}
.sonder-home .sh-hero-copy h1 em{position:relative;display:inline-block}
.sonder-home .sh-hero-copy h1 em:after{content:"";position:absolute;left:2%;right:0;bottom:-8px;height:9px;border-top:2px solid #8a9d56;border-radius:50%;transform:rotate(-2deg);opacity:.65}
.sonder-home .sh-playground{position:relative;isolation:isolate;align-self:center;display:block;border:1px solid #dce2cd;border-radius:22px;background:radial-gradient(ellipse at 66% 27%,#e6f3b5 0%,#e7edda 38%,#edf0e6 70%);box-shadow:inset 0 1px 0 #fff9;min-width:0;overflow:hidden}
.sonder-home .sh-playground:before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#45603a24 .65px,transparent .65px);background-size:18px 18px;mask-image:linear-gradient(145deg,#0009,transparent 42%,#0005);pointer-events:none}
.sonder-home .sh-playground-top{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:23px 25px 0;font-size:10px;line-height:1.4;letter-spacing:.075em;text-transform:uppercase;color:#47523d}
.sonder-home .sh-playground-edition{display:inline-flex;align-items:center;gap:8px;font-variant-numeric:tabular-nums}
.sonder-home .sh-playground-edition>span:first-child{font-size:20px;line-height:1;color:#536c35}
.sonder-home .sh-playground .sh-sculpture{height:385px;max-width:none;margin:0;overflow:hidden}
.sonder-home .sh-playground .sh-sculpture-glow{inset:10% 4%;background:radial-gradient(ellipse at 50% 46%,#f4ffd15c,transparent 62%);filter:none}
.sonder-home .sh-playground .sh-sculpture-shadow{bottom:2%;left:23%;right:23%;height:7%;background:radial-gradient(ellipse,#273b252e,transparent 70%);filter:blur(7px)}
.sonder-home .sh-playground .sh-sculpture-fallback{inset:14% 23%;border-width:46px;transform:rotate(-28deg) rotateY(22deg);box-shadow:inset 8px 6px 13px #273f35,8px 12px 14px #253a2433,-5px -4px 5px #f3ffca}
.sonder-home .sh-playground-cross{position:absolute;z-index:1;font-size:17px;color:#72856480;line-height:1;pointer-events:none}
.sonder-home .sh-playground-cross-a{top:22%;left:7%}
.sonder-home .sh-playground-cross-b{bottom:17%;right:7%}
.sonder-home .sh-playground-bottom{position:relative;z-index:3;padding:0 25px 22px}
.sonder-home .sh-playground-bottom>p{font-size:23px;letter-spacing:-.04em;line-height:1.2;margin:4px 0 17px;color:#283b29}
.sonder-home .sh-playground-bottom em{font-family:Sonder Instrument,Georgia,serif;font-weight:400;font-size:1.22em}
.sonder-home .sh-playground-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:44px}
.sonder-home .sh-playground-tools[hidden],.sonder-home .sh-motion-toggle[hidden]{display:none}
.sonder-home .sh-shape-picker{display:inline-flex;gap:3px;border:1px solid #c8d0ba;padding:3px;border-radius:999px;background:#ffffff35}
.sonder-home .sh-shape-picker button{font:inherit;font-size:12px;font-weight:600;line-height:1.2;min-height:38px;min-width:61px;padding:10px 15px;border:0;border-radius:999px;color:#405038;background:transparent;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.sonder-home .sh-shape-picker button:hover{background:#d3debe}
.sonder-home .sh-shape-picker button[aria-pressed="true"]{background:#283e2d;color:#f6f8e9;box-shadow:0 2px 5px #263b221a}
.sonder-home .sh-playground :where(button):focus-visible{outline:2px solid #294426;outline-offset:3px}
.sonder-home .sh-motion-toggle{font:inherit;font-size:11px;line-height:1.4;color:#47523d;min-height:44px;padding:6px 0 6px 8px;border:0;background:none;text-decoration:underline;text-underline-offset:4px;cursor:pointer;white-space:nowrap}
.sonder-home .sh-motion-toggle:hover{color:#152c1a}
.sonder-home .sh-hero-explore{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;min-height:30px;text-decoration:none}
.sonder-home .sh-hero-explore>span{font-size:17px;transition:transform .25s}
.sonder-home .sh-hero-explore:hover>span{transform:translateY(4px)}
@media(min-width:1600px){.sonder-home .sh-playground .sh-sculpture{height:435px}.sonder-home .sh-hero-grid{padding-bottom:42px}}
@media(min-width:701px) and (max-width:1100px){.sonder-home .sh-hero-grid{gap:4%;grid-template-columns:1fr 1fr;min-height:530px}.sonder-home .sh-hero-copy h1{font-size:clamp(49px,6.15vw,67px)}.sonder-home .sh-playground-top{padding:20px 18px 0;font-size:9px}.sonder-home .sh-playground .sh-sculpture{height:315px}.sonder-home .sh-playground-bottom{padding:0 18px 16px}.sonder-home .sh-playground-tools{gap:7px;flex-wrap:wrap}.sonder-home .sh-shape-picker button{padding-inline:12px;min-width:55px}.sonder-home .sh-playground-bottom>p{font-size:21px}.sonder-home .sh-hero-copy .sh-actions{gap:16px;flex-wrap:wrap}}
@media(max-width:700px){.sonder-home .sh-hero-grid{grid-template-columns:1fr;gap:30px;min-height:0;padding:0 0 22px}.sonder-home .sh-hero-copy h1{font-size:clamp(53px,14vw,84px)}.sonder-home .sh-hero-copy h1 em:after{bottom:-7px;height:7px}.sonder-home .sh-hero-copy .sh-actions{flex-wrap:wrap;gap:16px 22px}.sonder-home .sh-playground{border-radius:18px;width:100%;max-width:500px;justify-self:center;margin-top:0}.sonder-home .sh-playground-top{padding:18px 18px 0;font-size:9px;gap:12px}.sonder-home .sh-playground .sh-sculpture{height:300px;max-width:none}.sonder-home .sh-playground-bottom{padding:0 18px 16px}.sonder-home .sh-playground-bottom>p{font-size:22px;margin-bottom:14px}.sonder-home .sh-playground-tools{gap:8px;flex-wrap:wrap}.sonder-home .sh-shape-picker button{min-height:40px;min-width:57px;padding-inline:13px}.sonder-home .sh-motion-toggle{font-size:10px;padding-left:4px}.sonder-home .sh-hero-explore{gap:9px;max-width:48%;font-size:9px;text-align:right;line-height:1.4}.sonder-home .sh-hero-end{align-items:center;gap:14px}.sonder-home .sh-hero-end>span{max-width:48%;line-height:1.4}.sonder-home .sh-playground .sh-sculpture-fallback{inset:17% 20%;border-width:38px}}
@media(max-width:370px){.sonder-home .sh-playground .sh-sculpture{height:250px}.sonder-home .sh-playground-top,.sonder-home .sh-playground-bottom{padding-inline:14px}.sonder-home .sh-playground-top{font-size:8px}.sonder-home .sh-shape-picker button{min-width:56px;padding-inline:11px}.sonder-home .sh-motion-toggle{margin-left:auto}.sonder-home .sh-playground-bottom>p{font-size:21px}}
@media(prefers-reduced-motion:reduce){.sonder-home .sh-playground *,.sonder-home .sh-hero-explore>span{transition:none!important}.sonder-home .sh-hero-explore:hover>span{transform:none}}
/* A little more room for the new photography and the supplied portrait film. */
.sonder-home .sh-project-image{aspect-ratio:1/1}
.sonder-home .sh-project-image>img{object-position:50% 50%}
.sonder-home .sh-film-card{position:relative;min-width:0}
.sonder-home .sh-film-card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none}
.sonder-home .sh-film-card[data-film-ready] video{opacity:1}
.sonder-home .sh-film-card .sh-project-kicker{right:122px;line-height:1.4}
.sonder-home .sh-film-toggle{position:absolute;z-index:4;right:14px;top:12px;min-height:44px;min-width:86px;padding:10px 13px;background:#f7f5efed;color:#223023;border:1px solid #ffffff6b;border-radius:999px;font:inherit;font-size:11px;line-height:1.2;cursor:pointer;box-shadow:0 2px 8px #16271d14;transition:background .2s}
.sonder-home .sh-film-toggle[hidden]{display:none}
.sonder-home .sh-film-toggle:hover{background:#d5ef5e}
.sonder-home .sh-film-toggle:focus-visible{outline-color:white;outline-offset:3px}