@font-face{font-family:"Host";src:url(fonts/host-grotesk-var.woff2) format("woff2");font-weight:300 800;font-display:swap}
:root{
  --ivory:#f3efe7;--paper:#ebe5d9;--ink:#141511;--ink-2:#55574e;--night:#0c0c0a;--green:#1f2a22;--green-2:#2f3d31;--sage:#9aa58c;
  --line:rgba(20,21,17,.14);--line-l:rgba(243,239,231,.18);
  --pad:clamp(20px,4.4vw,72px);--max:1440px;
  --ease:cubic-bezier(.2,.7,.1,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;background:var(--night)}
body{font-family:"Host",system-ui,sans-serif;font-size:17px;line-height:1.55;color:var(--ink);background:var(--ivory);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ol,ul{list-style:none}
h1,h2,h3{font-weight:400}
.kicker{font-size:15px;font-weight:500;letter-spacing:0;color:var(--ink-2);display:flex;align-items:center;gap:12px}
.kicker::before{content:"";width:28px;height:1px;background:currentColor;opacity:.6}
.kicker--light{color:rgba(243,239,231,.72)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 26px;border-radius:999px;font-size:16px;font-weight:500;white-space:nowrap;transition:background .3s,color .3s,border-color .3s,transform .3s var(--ease)}
.btn:active{transform:scale(.97)}
.btn--ivory{background:var(--ivory);color:var(--ink)}
.btn--ivory:hover{background:#fff}
.btn--line{border:1px solid rgba(243,239,231,.5);color:var(--ivory)}
.btn--line:hover{border-color:var(--ivory);background:rgba(243,239,231,.08)}
.btn--ink{background:var(--ink);color:var(--ivory)}
.btn--ink:hover{background:var(--green-2)}

/* header */
.hd{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:24px;height:72px;padding:0 var(--pad);color:var(--ivory);transition:transform .5s var(--ease),background .4s,color .4s}
.hd.is-solid{background:var(--ivory);color:var(--ink);box-shadow:0 1px 0 var(--line)}
.hd.is-hidden{transform:translateY(-100%)}
.logo{display:flex;align-items:baseline;gap:7px;font-size:21px;font-weight:600;letter-spacing:-.03em}
.logo span{font-weight:300}
.hd__nav{display:flex;gap:30px;font-size:15px;margin-left:auto}
.hd__nav a{opacity:.82;transition:opacity .25s}
.hd__nav a:hover{opacity:1}
.hd__call{height:40px;display:inline-flex;align-items:center;padding:0 18px;border-radius:999px;border:1px solid currentColor;font-size:15px;font-weight:500;transition:background .3s,color .3s}
.hd__call:hover{background:var(--ivory);color:var(--ink);border-color:var(--ivory)}
.hd.is-solid .hd__call:hover{background:var(--ink);color:var(--ivory);border-color:var(--ink)}

/* 1 hero */
.hero{position:relative;height:100svh;min-height:620px;color:var(--ivory);background:var(--night);overflow:hidden}
.hero__pic,.hero__pic img{position:absolute;inset:0;width:100%;height:100%}
.hero__pic img{object-fit:cover;object-position:50% 46%}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,12,10,.55) 0%,rgba(12,12,10,0) 22%,rgba(12,12,10,0) 48%,rgba(12,12,10,.78) 100%),linear-gradient(90deg,rgba(12,12,10,.5) 0%,rgba(12,12,10,.18) 38%,rgba(12,12,10,0) 60%);pointer-events:none}
.hero__in{position:absolute;z-index:2;left:var(--pad);right:var(--pad);bottom:clamp(32px,6vh,64px)}
.hero__k{display:flex;gap:10px;font-size:15px;color:rgba(243,239,231,.82);margin-bottom:22px}
.hero__k span::before{content:"·";margin-right:10px}
.hero h1{font-size:clamp(46px,8.6vw,148px);line-height:.94;letter-spacing:-.045em;font-weight:400;max-width:12ch}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.hero h1 .ln>span{display:inline-block}
.hero h1 .ln:nth-child(2){padding-left:clamp(0px,9vw,150px)}
.hero__row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-top:clamp(26px,4vh,44px);padding-top:24px;border-top:1px solid var(--line-l)}
.hero__sub{max-width:44ch;color:rgba(243,239,231,.86);font-size:17px}
.hero__cta{display:flex;gap:12px}
.hero__rate{position:absolute;right:0;top:calc(-1 * clamp(150px,20vh,220px));display:flex;align-items:center;gap:12px;font-size:15px;color:rgba(243,239,231,.86)}
.stars{display:flex;gap:3px}
.stars i{width:14px;height:14px;background:linear-gradient(90deg,var(--ivory) calc(var(--f)*100%),rgba(243,239,231,.28) 0);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.9 7.1.6-5.4 4.7 1.7 7.3L12 17.8 5.7 21.5l1.7-7.3L2 9.5l7.1-.6z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.9 7.1.6-5.4 4.7 1.7 7.3L12 17.8 5.7 21.5l1.7-7.3L2 9.5l7.1-.6z'/%3E%3C/svg%3E") center/contain no-repeat}

/* 2 atelier */
.atelier{padding:clamp(96px,14vw,200px) var(--pad) clamp(88px,11vw,160px);max-width:var(--max);margin:0 auto}
.atelier__top{display:grid;grid-template-columns:1fr 3fr;gap:40px;align-items:start}
.atelier__top .kicker{padding-top:.9em}
.atelier__lead{font-size:clamp(28px,3.9vw,60px);line-height:1.1;letter-spacing:-.035em;font-weight:400;max-width:21ch}
.atelier__lead .w{transition:color .4s}
.js-fx .atelier__lead .w{color:rgba(20,21,17,.16)}
.js-fx .atelier__lead .w.is-on{color:var(--ink)}
.atelier__grid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(32px,5vw,88px);margin-top:clamp(64px,9vw,128px);align-items:end}
.atelier__pic{aspect-ratio:7/5;overflow:hidden;border-radius:4px;background:var(--paper)}
.atelier__pic img{width:100%;height:100%;object-fit:cover}
.atelier__notes{counter-reset:n}
.atelier__notes li{counter-increment:n;display:grid;grid-template-columns:44px 1fr;gap:4px 0;padding:24px 0;border-top:1px solid var(--line)}
.atelier__notes li:last-child{border-bottom:1px solid var(--line)}
.atelier__notes li::before{content:"0" counter(n);grid-row:span 2;font-size:14px;color:var(--ink-2);padding-top:4px}
.atelier__notes b{font-size:22px;font-weight:500;letter-spacing:-.02em}
.atelier__notes span{color:var(--ink-2);max-width:40ch}

/* 3 light the table */
.light{position:relative;background:var(--night);color:var(--ivory)}
.light__stage{position:relative;height:100svh;min-height:560px;overflow:hidden}
.light__track{position:absolute;left:0;top:50%;height:var(--th,100%);aspect-ratio:12/5;transform:translate3d(0,-50%,0);will-change:transform}
.light__img{position:absolute;inset:0;width:100%;height:100%}
.light__img--lit{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.js-fx .light__img--lit{-webkit-mask-image:linear-gradient(transparent,transparent);mask-image:linear-gradient(transparent,transparent)}
.light__glows{position:absolute;inset:0;pointer-events:none}
.glow{position:absolute;left:0;top:0;width:var(--gs,180px);height:var(--gs,180px);margin:calc(var(--gs,180px)/-2) 0 0 calc(var(--gs,180px)/-2);border-radius:50%;background:radial-gradient(closest-side,rgba(255,214,150,.75),rgba(255,170,80,.28) 45%,rgba(255,150,60,0));mix-blend-mode:screen;opacity:0;will-change:opacity,transform}
.glow::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:flick 2.6s ease-in-out infinite alternate;animation-delay:var(--dl,0s);opacity:.6}
@keyframes flick{0%{transform:scale(.92);opacity:.45}40%{transform:scale(1.04);opacity:.7}70%{transform:scale(.97);opacity:.5}100%{transform:scale(1.02);opacity:.66}}
.light__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,12,10,.5) 0%,rgba(12,12,10,0) 22%,rgba(12,12,10,0) 52%,rgba(12,12,10,.86) 100%);pointer-events:none}
.light__head{position:absolute;z-index:3;left:var(--pad);bottom:clamp(32px,6vh,60px);max-width:560px}
.light__t{font-size:clamp(40px,5.6vw,92px);line-height:.98;letter-spacing:-.045em;margin-top:14px}
.light__d{margin-top:16px;color:rgba(243,239,231,.82);max-width:44ch}
.light__hint{position:absolute;z-index:3;right:var(--pad);bottom:clamp(32px,6vh,60px);display:flex;align-items:center;gap:14px;font-size:15px;color:rgba(243,239,231,.84)}
.light__hint i{position:relative;width:clamp(80px,12vw,180px);height:1px;background:rgba(243,239,231,.25);overflow:hidden}
.light__hint i::after{content:"";position:absolute;inset:0;background:#f2d3a2;transform-origin:0 50%;transform:scaleX(var(--p,0))}
.light__end{position:absolute;z-index:3;right:var(--pad);bottom:clamp(32px,6vh,60px);display:flex;align-items:center;gap:22px;opacity:0;visibility:hidden}
.light__et{font-size:clamp(18px,1.6vw,22px);letter-spacing:-.015em;max-width:24ch;text-align:right}
.hd.in-dark{transform:translateY(-100%)}

/* 4 collection */
.col{background:var(--paper);padding:clamp(88px,11vw,160px) var(--pad) clamp(80px,10vw,140px)}
.col__head{max-width:var(--max);margin:0 auto;display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding-bottom:28px;border-bottom:1px solid var(--line)}
.col__lead{color:var(--ink-2)}
.col__body{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:5fr 6fr;gap:clamp(40px,6vw,110px);position:relative}
.col__pics{position:sticky;top:max(96px,calc(50svh - min(39svh,350px)));height:min(78svh,700px);aspect-ratio:9/11;margin-top:clamp(48px,6vw,80px);border-radius:4px;overflow:hidden;background:#111;justify-self:start;align-self:start;max-width:100%}
.cp{position:absolute;inset:0;clip-path:inset(100% 0 0 0);transition:clip-path 1s cubic-bezier(.7,0,.2,1)}
.cp img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.6s var(--ease)}
.cp.on,.cp.was{clip-path:inset(0 0 0 0)}
.cp.on{z-index:2}
.cp.on img{transform:scale(1)}
.col__list{padding:clamp(48px,6vw,80px) 0 0}
.ci{min-height:min(56svh,520px);display:grid;grid-template-columns:56px 1fr;align-content:center;padding:32px 0;border-bottom:1px solid var(--line)}
.ci__n{font-size:14px;color:var(--ink-2);padding-top:.9em}
.ci h3{font-size:clamp(32px,4.2vw,64px);line-height:1;letter-spacing:-.04em;transition:color .5s}
.ci p{grid-column:2;margin-top:18px;max-width:40ch;color:var(--ink-2);transition:opacity .5s}
.js-fx .ci:not(.on) h3{color:rgba(20,21,17,.24)}
.js-fx .ci:not(.on) p{opacity:.35}
.trust{max-width:var(--max);margin:clamp(72px,9vw,128px) auto 0;display:grid;grid-template-columns:5fr 4fr auto;gap:32px 56px;align-items:end}
.trust__t{font-size:clamp(28px,3.2vw,46px);line-height:1.06;letter-spacing:-.035em}
.trust__t span{color:var(--ink-2)}
.trust__d{color:var(--ink-2);max-width:44ch}

/* 5 events */
.ev{background:var(--green);color:var(--ivory);padding:clamp(88px,11vw,160px) var(--pad);display:grid;grid-template-columns:5fr 7fr;gap:clamp(40px,6vw,110px)}
.ev__side{position:sticky;top:clamp(96px,14vh,140px);align-self:start}
.ev__index{margin-top:28px;font-size:clamp(38px,4.6vw,76px);line-height:1;letter-spacing:-.045em}
.ev__index span{transition:color .5s}
.js-fx .ev__index span{color:rgba(243,239,231,.24)}
.js-fx .ev__index span.on{color:var(--ivory)}
.ev__d{margin:32px 0 30px;color:rgba(243,239,231,.76);max-width:40ch}
.ev__list{display:grid;gap:clamp(64px,8vw,120px)}
.ew figure{aspect-ratio:7/5;overflow:hidden;border-radius:4px;background:#18201a}
.ew img{width:100%;height:100%;object-fit:cover}
.ew__t{display:grid;grid-template-columns:1fr 1.3fr;gap:8px 32px;margin-top:22px;padding-top:20px;border-top:1px solid var(--line-l)}
.ew__c{font-size:15px;color:var(--sage);grid-row:span 2}
.ew h3{font-size:clamp(24px,2.2vw,32px);letter-spacing:-.03em;line-height:1.1}
.ew__t>p:last-child{color:rgba(243,239,231,.74);grid-column:2}

/* demo */
.demo{position:relative;overflow:hidden;height:min(110svh,1000px);background:var(--ivory);-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent);pointer-events:none}
.demo__blur{filter:blur(10px);padding:clamp(80px,10vw,140px) var(--pad) 0;opacity:.9}
.visit{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.visit img{aspect-ratio:3/4;object-fit:cover;width:100%;max-height:640px;border-radius:4px}
.visit h2,.form h2{font-size:56px;letter-spacing:-.04em;margin-bottom:24px}
.visit p,.form p{padding:16px 0;border-top:1px solid var(--line);font-size:22px}
.form{margin-top:80px}
.demo__card{position:relative;z-index:5;width:min(540px,calc(100% - 2*var(--pad)));margin:calc(-1 * min(78svh,720px)) auto clamp(80px,12vw,160px);padding:clamp(28px,3vw,44px);border-radius:14px;background:#fff;box-shadow:0 40px 80px -40px rgba(20,21,17,.45);text-align:center}
.demo__k{font-size:14px;font-weight:600;color:var(--green-2)}
.demo__t{margin-top:10px;font-size:clamp(22px,2.4vw,30px);font-weight:500;letter-spacing:-.03em;line-height:1.15}
.demo__d{margin:12px auto 24px;color:var(--ink-2);max-width:38ch}
main{background:var(--ivory)}

/* tablet / mobile */
@media (max-width:1000px){
  .hd__nav{display:none}
  .atelier__top{grid-template-columns:1fr;gap:20px}
  .atelier__top .kicker{padding-top:0}
  .atelier__grid{grid-template-columns:1fr}
  .trust{grid-template-columns:1fr;align-items:start}
  .trust .btn{justify-self:start}
  .ev{grid-template-columns:1fr}
  .ev__side{position:relative;top:0}
}
@media (max-width:760px){
  body{font-size:16px}
  .hd{height:64px}
  .logo{font-size:19px}
  .hd__call{height:38px;padding:0 15px;font-size:14px}
  .hero{min-height:600px}
  .hero__pic{bottom:auto;height:62%}
  .hero::after{background:linear-gradient(180deg,rgba(12,12,10,.5) 0%,rgba(12,12,10,0) 14%,rgba(12,12,10,.3) 24%,rgba(12,12,10,.82) 42%,#0c0c0a 60%)}
  .hero__k{flex-direction:column;gap:2px;margin-bottom:16px;font-size:14px}
  .hero__k span::before{display:none}
  .hero h1{font-size:clamp(44px,13.4vw,64px);max-width:none}
  .hero h1 .ln:nth-child(2){padding-left:0}
  .hero__row{flex-direction:column;align-items:stretch;gap:20px;margin-top:20px;padding-top:18px}
  .hero__sub{font-size:16px}
  .hero__cta{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .hero__cta .btn{padding:0 12px}
  .hero__rate{position:static;margin-top:18px}
  .light__head{right:var(--pad);bottom:32px}
  .light__d{font-size:15px;max-width:34ch}
  .light__hint{right:auto;left:var(--pad);bottom:auto;top:28px}
  .light__end{left:var(--pad);right:var(--pad);bottom:32px;flex-direction:column;align-items:flex-start;gap:18px}
  .light__et{text-align:left;font-size:24px;max-width:18ch}
  .light__shade{background:linear-gradient(180deg,rgba(12,12,10,.6) 0%,rgba(12,12,10,0) 16%,rgba(12,12,10,0) 44%,rgba(12,12,10,.9) 92%)}
  .col__head{flex-direction:column;gap:6px}
  .col__body{grid-template-columns:1fr;gap:0}
  .col__pics{top:76px;height:auto;width:100%;aspect-ratio:auto;height:min(50svh,440px);margin-top:28px;z-index:3;box-shadow:0 -80px 0 0 var(--paper),0 26px 22px 8px var(--paper)}
  .col__list{padding-top:8px}
  .ci{min-height:auto;height:max(240px,calc(100svh - 76px - min(50svh,440px) - 40px));align-content:start;grid-template-columns:40px 1fr;padding:26px 0 24px}
  .ci h3{font-size:clamp(28px,8vw,36px)}
  .ci__n{padding-top:.5em}
  .ci p{margin-top:12px;font-size:15px}
  .ev__index{font-size:clamp(36px,10.4vw,48px)}
  .ew__t{grid-template-columns:1fr}
  .ew__c{grid-row:auto}
  .ew__t>p:last-child{grid-column:1}
  .visit{grid-template-columns:1fr}
  .visit h2,.form h2{font-size:36px}
}

/* no motion */
.no-fx .light__img--lit{-webkit-mask-image:none;mask-image:none}
.no-fx .light__end{opacity:1;visibility:visible}
.no-fx .light__hint{display:none}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}