/* meble7: homepage sections. */

.hero{min-height:100svh;position:relative;background:#5d4a3b;overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,18,14,.58) 0%,rgba(24,18,14,.15) 52%,rgba(24,18,14,.08)),linear-gradient(0deg,rgba(24,18,14,.25),transparent 45%)}
.hero-copy{position:relative;z-index:2;color:#fff;padding:31vh 7vw 8vh;max-width:780px}
.hero h1{font-size:clamp(4rem,8.4vw,8.9rem);line-height:.85;letter-spacing:-.045em;margin:0 0 28px}
.hero p{font-size:1.08rem;max-width:410px;margin:0 0 34px}
.hero :focus-visible{outline-color:#fff}
.scroll-note{position:absolute;z-index:2;bottom:32px;right:var(--gutter);color:#fff;font-size:.68rem;text-transform:uppercase;letter-spacing:.16em;writing-mode:vertical-rl}

.intro{padding:110px 7vw 85px;text-align:center}
.intro p{font-family:var(--serif);font-size:clamp(2rem,4.2vw,4.4rem);line-height:1.12;max-width:1120px;margin:0 auto 28px}
.intro .small{font-family:var(--sans);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

.category-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:auto;padding:0 var(--gutter);scrollbar-width:none}
.category-strip::-webkit-scrollbar{display:none}
.category-list{display:flex;list-style:none;margin:0;padding:0}
.category-list li{flex:1;min-width:145px}
.category-list a{display:block;padding:24px 18px;text-align:center;font-size:.77rem;text-transform:uppercase;letter-spacing:.12em;border-right:1px solid var(--line);transition:.25s}
.category-list li:first-child a{border-left:1px solid var(--line)}
.category-list a:hover,.category-list a:focus-visible{background:var(--ink);color:var(--paper)}
.category-list a:focus-visible{outline-offset:-4px;outline-color:var(--paper)}

.section{padding:112px var(--gutter)}
.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:42px}
.section-head h2{font-size:clamp(2.8rem,5vw,5.4rem);line-height:.95;margin:0;letter-spacing:-.035em}
.section-head p{color:var(--muted);max-width:350px;margin:0 0 7px;font-size:.92rem}
.editorial-grid{display:grid;grid-template-columns:1.18fr .82fr;gap:18px}
.editorial-card{display:block;position:relative;overflow:hidden;background:var(--stone);min-height:690px}
.editorial-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.editorial-card:hover img{transform:scale(1.025)}
.editorial-card:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,rgba(20,15,12,.7))}
.editorial-card:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.card-copy{position:absolute;z-index:2;left:40px;bottom:38px;color:#fff}
.card-copy h3{font-size:clamp(2.4rem,4vw,4.6rem);line-height:.95;margin:0 0 12px}
.card-copy span{font-size:.73rem;text-transform:uppercase;letter-spacing:.16em}

.collection-ticker{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;background:var(--sand)}
.ticker-track{display:flex;width:max-content;animation:ticker 28s linear infinite}
.collection-ticker:hover .ticker-track,.collection-ticker:focus-within .ticker-track{animation-play-state:paused}
.ticker-list{display:flex;gap:40px;list-style:none;margin:0;padding:0 40px 0 0}
.ticker-list li{font-family:var(--serif);font-size:2rem;line-height:1.2;white-space:nowrap}
.ticker-list a:hover{color:var(--accent)}
.ticker-list i{font-style:normal;color:var(--accent)}
@keyframes ticker{to{transform:translateX(-25%)}}

.feature{display:grid;grid-template-columns:1fr 1fr;min-height:780px}
.feature-image{position:relative;overflow:hidden}
.feature-image img{display:block;width:100%;height:100%;object-fit:cover}
.feature-copy{background:var(--dark);color:#f5f0e9;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:9vw}
.feature-copy h2{font-size:clamp(3.2rem,6vw,6.8rem);line-height:.9;margin:0 0 30px}
.feature-copy p{max-width:470px;color:#d9d0c6;margin:0 0 34px;font-size:1rem}
.feature-copy .details{align-self:stretch}
.feature-copy :focus-visible{outline-color:#f5f0e9}
.details{display:flex;gap:35px;margin-top:58px;padding-top:24px;border-top:1px solid rgba(255,255,255,.25);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#bfb6ad}

.story{padding:130px 7vw;display:grid;grid-template-columns:.65fr 1.35fr;gap:8vw}
.story .label{font-size:.73rem;text-transform:uppercase;letter-spacing:.17em;padding-top:13px}
.story figure{margin:0}
.story blockquote{font-family:var(--serif);font-size:clamp(2.5rem,4.7vw,5.1rem);line-height:1.08;margin:0}
.story figcaption{margin-top:28px;color:var(--muted);font-size:.85rem;letter-spacing:.12em;text-transform:uppercase}

.services{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.service{padding:58px 4vw;border-right:1px solid var(--line)}
.service:last-child{border-right:0}
.service .num{font-family:var(--serif);font-size:2rem;color:var(--accent)}
.service h3{font-family:var(--serif);font-size:1.7rem;font-weight:400;margin:44px 0 12px}
.service p{margin:0;color:var(--muted);max-width:330px;font-size:.9rem}

.newsletter{padding:130px 7vw;text-align:center}
.newsletter h2{font-size:clamp(3rem,6vw,6.8rem);line-height:.94;margin:0 auto 22px;max-width:900px}
.newsletter p{color:var(--muted);margin:0 auto 36px}
.newsletter-form{display:flex;max-width:550px;margin:auto;border-bottom:1px solid var(--ink)}
.newsletter-form input{flex:1;min-height:0;border:0;background:transparent;padding:15px 4px;font-size:1rem}
.newsletter-form input:focus-visible{outline:none}
.newsletter-form:focus-within{box-shadow:0 1px 0 0 var(--ink)}
.newsletter-form button{border:0;background:transparent;padding:15px 4px;text-transform:uppercase;letter-spacing:.13em;font-size:.72rem;cursor:pointer}

@media(max-width:900px){
	.hero-copy{padding:32vh 25px 8vh}
	.hero h1{font-size:clamp(4rem,18vw,6rem)}
	.scroll-note{display:none}
	.intro{padding:80px 24px 65px}
	.section{padding:78px 18px}
	.section-head{align-items:start;flex-direction:column;gap:20px}
	.editorial-grid{grid-template-columns:1fr}
	.editorial-card{min-height:78vh}
	.feature{grid-template-columns:1fr;min-height:0}
	.feature-image{height:75vh}
	.feature-copy{padding:80px 28px}
	.story{padding:85px 24px;grid-template-columns:1fr;gap:35px}
	.services{grid-template-columns:1fr}
	.service{border-right:0;border-bottom:1px solid var(--line)}
	.service:last-child{border-bottom:0}
	.service h3{margin-top:24px}
	.newsletter{padding:90px 24px}
}
@media(max-width:560px){
	.hero p{font-size:1rem}
	.card-copy{left:24px;bottom:26px}
	.editorial-card{min-height:64vh}
	.details{flex-direction:column;gap:10px}
	.newsletter-form{display:block;border:0}
	.newsletter-form input{width:100%;border-bottom:1px solid var(--ink)}
	.newsletter-form button{margin-top:14px}
	.category-strip{padding:0}
	.category-list li{min-width:135px}
	.story blockquote{font-size:2.35rem}
}
@media(prefers-reduced-motion:reduce){
	.ticker-track{animation:none}
	.collection-ticker{overflow-x:auto}
	.editorial-card img{transition:none}
}