@font-face{font-family:"Instrument Serif";src:url(fonts/InstrumentSerif-Regular.ttf);font-display:swap}
@font-face{font-family:"Instrument Serif";font-style:italic;src:url(fonts/InstrumentSerif-Italic.ttf);font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(fonts/InstrumentSans.ttf);font-weight:400 700;font-display:swap}
@font-face{font-family:"Sprat";src:url(fonts/Sprat-CondensedThin.woff2) format("woff2");font-weight:200;font-display:swap}
@font-face{font-family:"Sprat";src:url(fonts/Sprat-CondensedLight.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Mazius";src:url(fonts/MaziusDisplay-Regular.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Mazius";font-style:italic;src:url(fonts/MaziusDisplay-Extraitalic.woff2) format("woff2");font-display:swap}
:root{--linen:#E9E4DC;--sand:#DCD3C6;--stone:#B8AFA3;--taupe:#8C8173;--ink:#2B2826;--paper:#F7F5F1;--terra:#B9876A;
--serif:"Instrument Serif",Georgia,serif;--sans:"Instrument Sans",Helvetica,Arial,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased}
body{background:var(--paper);color:var(--ink);font:400 15px/1.75 var(--sans)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
.caps{font:500 11px/1.6 var(--sans);letter-spacing:.28em;text-transform:uppercase}
.muted{color:var(--taupe)}
.serif{font-family:var(--serif);font-weight:400}
.it{font-style:italic}
.wrap{max-width:1240px;margin:0 auto;padding:0 6vw}
.btn{display:inline-block;border:1px solid var(--ink);padding:15px 30px;font:500 11px var(--sans);letter-spacing:.26em;text-transform:uppercase;transition:.3s}
.btn:hover{background:var(--ink);color:var(--paper)}
.link{border-bottom:1px solid var(--stone);padding-bottom:3px}
.link:hover{border-color:var(--terra)}
/* HOME */
.home{min-height:100svh;display:flex;flex-direction:column;position:relative}
.home:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(247,245,241,.25),rgba(233,228,220,.05) 50%,rgba(43,40,38,.12))}
.home>*{position:relative}
.home-top,.home-foot{display:flex;justify-content:space-between;padding:32px 5vw;color:var(--ink)}
.home-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 6vw 6vh}
.brand{font:400 clamp(52px,8.5vw,128px)/.92 var(--serif);letter-spacing:-.015em}
.brand em{font-style:italic}
.tag{margin:26px 0 56px;color:#5f574e}
.dd{position:relative;width:min(340px,86vw)}
.dd-btn{width:100%;display:flex;justify-content:space-between;align-items:center;background:rgba(247,245,241,.72);backdrop-filter:blur(8px);border:1px solid rgba(43,40,38,.35);padding:18px 24px;font:500 11px var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--ink);cursor:pointer}
.dd-btn svg{transition:transform .3s}
.dd.open .dd-btn svg{transform:rotate(180deg)}
.dd-list{list-style:none;position:absolute;left:0;right:0;top:calc(100% - 1px);background:rgba(247,245,241,.96);backdrop-filter:blur(8px);border:1px solid rgba(43,40,38,.35);text-align:left;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.3s;z-index:5}
.dd-list{max-height:min(52vh,420px);overflow:auto}
.dd.open .dd-list{opacity:1;visibility:visible;transform:none}
.dd-list li a,.dd-list li span{display:flex;justify-content:space-between;align-items:baseline;padding:14px 24px;font:400 21px/1.2 var(--serif)}
.dd-list li+li{border-top:1px solid var(--linen)}
.dd-list li a:hover{background:var(--linen)}
.dd-list li a small{color:var(--terra)}
.dd-list li span{color:var(--stone)}
.dd-list small{font:500 9px var(--sans);letter-spacing:.24em;text-transform:uppercase}
/* NAV */
.nav{display:flex;justify-content:space-between;align-items:center;padding:26px 5vw;border-bottom:1px solid var(--linen);background:var(--paper);position:sticky;top:0;z-index:10}
.logo{font:400 22px/1 var(--serif)}.logo em{font-style:italic}
.logo small{display:block;font:500 8.5px var(--sans);letter-spacing:.34em;text-transform:uppercase;color:var(--taupe);margin-top:6px}
.nav ul{display:flex;gap:38px;list-style:none}
.nav ul a{font:500 10.5px var(--sans);letter-spacing:.24em;text-transform:uppercase}
.nav ul a.on,.nav ul a:hover{border-bottom:1px solid var(--ink)}
.nav .btn{padding:12px 20px}
/* sections */
.intro{text-align:center;padding:120px 6vw 100px;max-width:820px;margin:0 auto}
.intro h1{font:400 clamp(40px,5.4vw,72px)/1.05 var(--serif);margin:22px 0 30px}
.intro p{color:#5f574e;max-width:560px;margin:0 auto}
.sec{padding:110px 0}
.sec-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:56px;gap:30px}
.sec-head h2{font:400 clamp(32px,3.8vw,50px)/1.1 var(--serif)}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:72px 48px}
.card .ph{aspect-ratio:4/3.3;overflow:hidden;background:var(--sand);display:flex;align-items:center;justify-content:center}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s}
.card:hover .ph img{transform:scale(1.03)}
.card h3{font:400 34px/1.1 var(--serif);margin:26px 0 6px;display:flex;justify-content:space-between;align-items:baseline}
.card h3 small{font:500 9.5px var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--taupe)}
.card h3 small.new{color:var(--terra)}
.card p.adj{color:var(--taupe)}
.card p.d{color:#5f574e;margin-top:10px;max-width:480px}
.swatch{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px}
.swatch .nm{font-size:clamp(44px,5vw,70px);line-height:1}
.chips{display:flex;gap:8px}.chips i{width:22px;height:22px;border-radius:50%;border:1px solid rgba(43,40,38,.12)}
.full .card:first-child{grid-column:1/-1}
.full .card:first-child .ph{aspect-ratio:16/8}
.split{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;border-top:1px solid var(--stone);padding-top:40px}
.steps .n{font:italic 400 40px var(--serif);color:var(--terra)}
.steps h4{font:400 22px var(--serif);margin:8px 0}
.steps p{color:#5f574e;font-size:14px}
.band{background:var(--linen)}
.dark{background:var(--ink);color:var(--paper)}
.dark .muted{color:var(--stone)}
.dark .btn{border-color:var(--paper)}.dark .btn:hover{background:var(--paper);color:var(--ink)}
.faq details{border-top:1px solid var(--stone);padding:22px 0}
.faq details:last-child{border-bottom:1px solid var(--stone)}
.faq summary{list-style:none;cursor:pointer;font:400 22px var(--serif);display:flex;justify-content:space-between}
.faq summary:after{content:"+";color:var(--taupe)}
.faq details[open] summary:after{content:"–"}
.faq p{color:#5f574e;padding-top:12px;max-width:640px}
footer{padding:70px 5vw 40px;border-top:1px solid var(--linen);display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;align-items:end}
/* collection page */
.c-hero{display:grid;grid-template-columns:1fr 1fr;min-height:min(calc(100svh - 86px),820px)}
.c-hero .l{background:var(--linen);display:flex;flex-direction:column;justify-content:center;padding:8vw}
.c-hero .r{background:var(--sand);position:relative;min-height:420px}
.c-hero .r img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.c-name{font:400 clamp(72px,10vw,150px)/.9 "Mazius",var(--serif);letter-spacing:-.01em;margin:24px 0 18px}
.c-name em{font-style:italic}
.mood{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.mood img{width:100%;aspect-ratio:4/5;object-fit:cover}
.pal{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.pal div{aspect-ratio:1/1.1;padding:18px;display:flex;flex-direction:column;justify-content:flex-end}
.pieces{columns:3;column-gap:40px;list-style:none}
.pieces li{break-inside:avoid;border-top:1px solid var(--stone);padding:14px 0;font:400 20px var(--serif);display:flex;justify-content:space-between}
.pieces li small{font:500 9px var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--taupe);align-self:center}
.type{display:grid;grid-template-columns:1.2fr 1fr;gap:6vw;align-items:center}
.menu-t{display:none;background:none;border:0;font:500 10.5px var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ink)}
@media (max-width:860px){
 body{font-size:14.5px}
 .nav{padding:18px 6vw}.nav ul{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);flex-direction:column;gap:0;border-bottom:1px solid var(--linen)}
 .nav.open ul{display:flex}.nav ul li a{display:block;padding:16px 6vw;border-top:1px solid var(--linen)}
 .nav .btn{display:none}.menu-t{display:block}
 .grid,.split,.c-hero,.type{grid-template-columns:1fr}.grid{gap:56px}
 .full .card:first-child .ph{aspect-ratio:4/3.3}
 .steps{grid-template-columns:1fr 1fr}.mood{grid-template-columns:1fr 1fr}.pal{grid-template-columns:1fr 1fr}
 .pieces{columns:1}.sec{padding:80px 0}.intro{padding:80px 6vw 64px}
 .c-hero .r{aspect-ratio:1}.c-hero .l{padding:72px 6vw}
 .sec-head{flex-direction:column;align-items:start}
 .home-top,.home-foot{padding:22px 6vw}
}
.type>div,.split>*,.grid>*{min-width:0}.type img{width:100%}
@font-face{font-family:"Switzer";src:url(fonts/Switzer-Extralight.woff2) format("woff2");font-weight:200;font-display:swap}
@font-face{font-family:"Switzer";src:url(fonts/Switzer-Light.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Switzer";src:url(fonts/Switzer-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Switzer";src:url(fonts/Switzer-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Gambetta";src:url(fonts/Gambetta-LightItalic.woff2) format("woff2");font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:"Gambetta";src:url(fonts/Gambetta-Italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
:root{--sans:"Switzer","Helvetica Neue",Arial,sans-serif;--serif:"Gambetta",Georgia,serif}
body{font-weight:300}
.caps,.btn,.nav ul a,.dd-btn,.card h3 small,.pieces li small,.dd-list small,.menu-t{font-family:var(--sans)}
.serif,.intro h1,.sec-head h2,.card h3,.steps h4,.faq summary,.pieces li,.dd-list li a,.dd-list li span{font-family:var(--serif);font-style:italic;font-weight:300}
.intro h1 em,.serif em{font-style:normal;font-family:var(--sans);font-weight:200}
.steps .n{font-family:var(--serif)}
.logo img{height:46px;width:auto}
.home-logo{width:min(300px,62vw);height:auto}
footer .logo img{height:40px}
@media(max-width:860px){.nav>.caps{display:none}}
/* home v4: Glacier photo + frosted panel */
.home{background:#d9d3cc center/cover}
.home:before{background:linear-gradient(180deg,rgba(247,245,241,.18),rgba(233,228,220,0) 45%,rgba(43,40,38,.18))}
.home-panel{background:rgba(247,245,241,.62);-webkit-backdrop-filter:blur(14px) saturate(.9);backdrop-filter:blur(14px) saturate(.9);border:1px solid rgba(255,255,255,.45);padding:clamp(36px,5vw,64px) clamp(28px,5vw,72px) clamp(40px,5vw,60px);display:flex;flex-direction:column;align-items:center;box-shadow:0 30px 80px rgba(43,40,38,.12)}
.home-panel .tag{margin:26px 0 40px}
.home-top,.home-foot{color:var(--paper);text-shadow:0 1px 8px rgba(43,40,38,.35)}
.home-top .link{border-color:rgba(247,245,241,.6)}

.home-top{color:var(--ink);text-shadow:0 1px 10px rgba(247,245,241,.7)}.home-top .link{border-color:var(--stone)}
/* home v5: flowers bg, delicate panel */
.home{background-image:url(img/home_bg.webp);background-position:center}
@media(max-width:700px){.home{background-image:url(img/home_bg_m.webp)}}
.home-panel{padding:34px 40px 36px;width:min(300px,82vw);background:rgba(247,245,241,.58);box-shadow:0 20px 60px rgba(43,40,38,.08)}
.home-logo{width:min(150px,40vw)}
.home-panel .tag{margin:18px 0 22px;font-size:9px;letter-spacing:.3em}
.home-panel .dd{width:100%}
.home-panel .dd-btn{padding:12px 16px;font-size:9px}
.home-panel .dd-list a,.home-panel .dd-list span{font-size:10px}
@media(max-width:700px){.home-panel{width:min(250px,72vw);padding:28px 26px 30px}.home-logo{width:110px}}
.home-foot{color:var(--ink);text-shadow:0 1px 10px rgba(247,245,241,.8)}
.home-panel{padding:40px 40px 38px}.home-panel .home-logo{width:min(210px,62vw)}.home-panel .tag{margin:26px 0 24px}
@media(max-width:700px){.home-panel{padding:34px 26px 32px}.home-panel .home-logo{width:170px}}
