#thread-studio.coastal-studio{position:relative;isolation:isolate;overflow:hidden;width:100%;height:570px;min-width:0;border-radius:48% 48% 18px 18px;perspective:1200px;background:#e8dfcf}
.coastal-camera{position:absolute;inset:-12px;transform:scale(1.045);will-change:transform}
.coastal-camera img{display:block;width:100%;height:100%;object-fit:cover;object-position:35% center}
.coastal-sun{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 80% 8%,#fff3d833,transparent 55%);mix-blend-mode:screen;animation:coastal-light 9s ease-in-out infinite alternate}
@keyframes coastal-light{from{opacity:.35}to{opacity:.85}}
.coastal-motion{position:absolute;bottom:18px;left:18px;z-index:1;border:1px solid #ffffff60;border-radius:50%;width:36px;height:36px;background:#faf8f3cc;color:#584632;cursor:pointer;backdrop-filter:blur(8px)}
.coastal-motion:focus-visible{outline:2px solid #584632;outline-offset:3px}
.is-paused .coastal-sun{animation-play-state:paused}
@media(max-width:760px){.hero>#thread-studio.coastal-studio{order:-1;width:100%;height:430px;border-radius:42% 42% 14px 14px}}
@media(prefers-reduced-motion:reduce){.coastal-sun{animation:none}}

.hero.wrap{position:relative;isolation:isolate;display:flex;align-items:center;min-height:640px;padding:70px 5%;margin-top:24px;margin-bottom:24px;overflow:hidden;border-radius:18px;border:0}
.hero>#thread-studio.coastal-studio{position:absolute;inset:0;z-index:-2;width:100%;height:100%;border-radius:0}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(270deg,rgba(250,248,243,.93) 0%,rgba(250,248,243,.81) 25%,rgba(250,248,243,.27) 49%,transparent 67%)}
.hero .coastal-camera img{object-position:center}
.hero .hero-copy{width:48%;max-width:550px;padding:0;text-align:right}
.hero .hero-copy h1{font-size:clamp(38px,4.5vw,68px);margin:22px 0;max-width:none}
.hero .hero-copy p{color:#514638}
.hero .hero-kicker,.hero .hero-note{color:#66543e}
.hero .coastal-motion{z-index:3;pointer-events:auto}
@media(max-width:760px){.hero.wrap{min-height:650px;padding:35px 25px;justify-content:flex-start;align-items:stretch;margin-top:14px;border-radius:12px}.hero .hero-copy{width:100%;max-width:none}.hero .hero-copy h1{font-size:39px;margin:15px 0}.hero::after{background:linear-gradient(180deg,rgba(250,248,243,.96),rgba(250,248,243,.88) 34%,rgba(250,248,243,.12) 65%,transparent 80%)}.hero .coastal-camera img{object-position:30% center}.hero .hero-actions{justify-content:flex-start}.hero .hero-note{margin-top:20px}}
.hero.wrap{width:100%;max-width:none;margin-inline:0;border-radius:0;padding-inline:max(5%,calc((100% - 1280px)/2));min-height:clamp(600px,46vw,780px)}
.hero.wrap::after{background:linear-gradient(270deg,rgba(250,248,243,.94),rgba(250,248,243,.82) 24%,rgba(250,248,243,.12) 43%,transparent 57%)}
@media(max-width:760px){.hero.wrap{width:100%;max-width:none;margin-inline:0;border-radius:0;padding:30px 24px;min-height:780px}.hero.wrap::after{background:linear-gradient(180deg,rgba(250,248,243,.98),rgba(250,248,243,.91) 30%,transparent 55%)}.hero .coastal-camera img{object-position:28% bottom}}
@media(max-width:760px){.hero .coastal-camera{background:#eeeae2}.hero .coastal-camera img{position:absolute;bottom:0;width:100%;height:58%;object-fit:cover;object-position:25% bottom}.hero.wrap::after{background:linear-gradient(180deg,#faf8f3 0%,rgba(250,248,243,.97) 30%,rgba(250,248,243,.65) 43%,transparent 63%)}}
.announcement{padding-block:3px}
.header{height:66px}
.header .brand-mark{height:40px;width:36px;font-size:29px}
.header .brand b{font-size:21px}
.hero.wrap{margin-top:0}
@media(max-width:760px){.announcement{padding-block:3px}.header{height:60px}.mobile-nav{padding-block:7px}.hero.wrap{margin-top:0}}
.brand-logo{display:block;object-fit:contain;flex:none}
.header .brand-logo{width:90px;height:60px}
.footer-main .brand-logo{width:150px;height:100px}
@media(max-width:760px){.header .brand-logo{width:81px;height:54px}}
.brand-name{display:flex;flex-direction:column;gap:3px;white-space:nowrap}
.brand-name small{font-size:9px;letter-spacing:2px;text-align:center}
.header .brand{gap:10px}
@media(max-width:760px){.header .brand{gap:6px}.header .brand-logo{width:66px;height:44px}.header .brand-name b{font-size:18px}.brand-name small{font-size:8px;letter-spacing:1.3px}.footer-main .brand-logo{width:90px;height:60px}}
.hero.wrap{min-height:0;height:clamp(420px,calc(100svh - 180px),620px);padding-block:30px;margin-bottom:12px}
.benefits{padding-block:8px;min-height:52px}
.benefits i{font-size:20px}
@media(max-width:760px){.hero.wrap{height:clamp(460px,calc(100svh - 210px),600px);padding-block:24px;margin-bottom:8px}.hero .hero-copy h1{font-size:34px;margin:10px 0}.hero .hero-copy p{margin-block:12px}.hero .hero-actions{margin-top:18px}.benefits{padding-block:7px;gap:6px 0;min-height:70px}.benefits i{font-size:17px}}
@media(min-width:761px){.hero.wrap{height:auto;min-height:0;aspect-ratio:3/1;padding-block:18px}.hero .coastal-camera{inset:0}.hero .coastal-camera img{object-fit:contain;object-position:center}.hero .hero-copy h1{margin-block:12px;font-size:clamp(32px,4.5vw,64px)}.hero .hero-copy p{margin-block:14px}.hero .hero-actions{margin-top:22px}}
@media(min-width:1001px){.category-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.category-tile{padding:14px 10px}.category-tile img{width:55px}.category-tile>i{display:none}}
.shop{padding-top:28px}.shop>.section-heading{margin-bottom:16px}.shop-toolbar{margin-bottom:22px;padding-bottom:12px}
@media(max-width:760px){.shop{padding-top:22px}.shop>.section-heading{margin-bottom:12px}}
#collections .category-grid{scroll-margin-top:-24px}
