:root{--ink:#0d0d12;--paper:#f6f2ec;--coral:#ff5b36;--yellow:#ffc933;--red:#e8412a;--lilac:#cdbdff;--pink:#ff2e88;--muted:#8b8d96;--gold:#d9b36a;--serif:"Cormorant Garamond","Playfair Display",Georgia,serif}
*{box-sizing:border-box;margin:0;padding:0} html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:Heebo,"Segoe UI",Arial,sans-serif;background:var(--ink);color:#fff;font-size:18px;line-height:1.55;overflow-x:hidden}
body{position:relative}
.bg{position:absolute;top:0;left:0;right:0;height:100%;z-index:-1;overflow:hidden;pointer-events:none}
.bg i{position:absolute;border-radius:50%;filter:blur(140px);opacity:.34}
.bg i:nth-child(1){width:680px;height:680px;background:var(--coral);top:-200px;right:-140px;opacity:.45}
.bg i:nth-child(2){width:640px;height:640px;background:#7b5cff;top:24%;left:-260px}
.bg i:nth-child(3){width:560px;height:560px;background:var(--pink);top:46%;right:-220px;opacity:.26}
.bg i:nth-child(4){width:640px;height:640px;background:#7b5cff;top:68%;left:-200px;opacity:.28}
.bg i:nth-child(5){width:520px;height:520px;background:var(--coral);top:84%;right:-160px;opacity:.22}
.serif{font-family:var(--serif);font-style:italic;font-weight:600}
.wrap{max-width:1320px;margin:0 auto;padding:0 48px}
/* nav */
nav{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:26px 48px;color:#fff}
.logo{font-family:var(--serif);font-size:38px;font-weight:600;letter-spacing:1px} .logo i{color:var(--gold);font-style:italic}
.links{display:flex;gap:38px;font-weight:500;font-size:16px;opacity:.85}
.pill{display:inline-flex;align-items:center;gap:10px;background:var(--red);color:#fff;border-radius:999px;padding:14px 30px;font-weight:800;font-size:17px;box-shadow:0 10px 30px rgba(232,65,42,.45)}
.pill.y{background:var(--yellow);color:#17171d;box-shadow:0 10px 30px rgba(255,201,51,.35)}
.pill.line{background:transparent;border:1.5px solid rgba(255,255,255,.45);box-shadow:none}
/* hero: cafe background (assets/bg_cafe.jpg) + text on the right + diagonal moving galleries on the left */
.hero{position:relative;min-height:900px;color:#fff;overflow:hidden;background:#2b1b16;display:grid;grid-template-columns:1fr 1fr;align-items:center}
.hero-bg{position:absolute;inset:0;background:url(assets/bg_cafe.jpg) center/cover no-repeat}
.hero-shade{position:absolute;inset:0;background:linear-gradient(270deg,rgba(24,15,12,.82) 0%,rgba(24,15,12,.62) 45%,rgba(24,15,12,.3) 100%),linear-gradient(rgba(0,0,0,.45),transparent 22%),linear-gradient(transparent 72%,rgba(13,13,18,.95))}
.hero-text{position:relative;z-index:5;padding:130px 0 60px;margin-right:calc((100vw - 1320px)/2 + 48px);max-width:640px}
.tag-y{display:inline-block;background:var(--yellow);color:#17171d;font-weight:800;font-size:16px;border-radius:999px;padding:9px 22px}
h1{font-size:76px;line-height:1.02;font-weight:900;letter-spacing:-3px;margin:26px 0 22px;text-shadow:0 6px 34px rgba(0,0,0,.45)}
h1 em{font-style:normal;color:var(--yellow)}
.lead{font-size:21px;font-weight:300;color:#f3ebe5;max-width:540px;line-height:1.7}
.cta{display:flex;gap:16px;margin-top:34px}
.stats{display:flex;gap:44px;margin-top:40px;padding-top:24px;border-top:1px solid rgba(255,255,255,.2)}
.stats b{display:block;font-family:var(--serif);font-size:44px;font-weight:600;color:var(--gold);line-height:1.1} .stats span{font-size:14px;color:#cfc6c0}
.hero-gal{position:relative;z-index:4;height:900px;display:flex;gap:16px;justify-content:center;transform:rotate(-7deg) scale(1.08);margin-left:-40px;direction:ltr;
 -webkit-mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent)}
.col{width:210px;display:flex;flex-direction:column;gap:16px;animation:up 46s linear infinite} .col.down{animation-name:down;animation-duration:54s} .col.slow{animation-duration:62s}
.col img{width:100%;aspect-ratio:3/4.3;object-fit:cover;border-radius:24px;display:block;box-shadow:0 18px 40px rgba(0,0,0,.4)}
@keyframes up{to{transform:translateY(-50%)}} @keyframes down{from{transform:translateY(-50%)}to{transform:translateY(0)}}
/* ticker */
.tickwrap{overflow:hidden;margin-top:-40px;padding:34px 0 14px;position:relative;z-index:6}
.ticker{background:var(--coral);color:#fff;overflow:hidden;white-space:nowrap;direction:ltr;transform:rotate(-1.2deg);margin:0 -30px;box-shadow:0 14px 34px rgba(0,0,0,.25)}
.track{display:inline-flex;animation:tick 32s linear infinite;padding:16px 0} .track span{font-weight:900;font-size:26px;letter-spacing:1px;padding:0 26px;direction:rtl} .track span.o{font-weight:300}
@keyframes tick{to{transform:translateX(-50%)}}
section{padding:120px 0 40px}
h2{font-size:64px;line-height:1.02;font-weight:900;letter-spacing:-2px} h2 .serif{color:var(--gold);font-weight:600}
.kicker{display:flex;align-items:center;gap:14px;font-size:14px;letter-spacing:3px;text-transform:uppercase;color:var(--gold);font-weight:800;margin-bottom:16px}
.kicker::before{content:"";width:44px;height:1px;background:var(--gold)}
/* New York background for the scrolling part (assets/bg_newyork.jpg), fixed so it stays while the content scrolls */
.ny{position:relative;background:linear-gradient(270deg,rgba(13,13,18,.78) 0%,rgba(13,13,18,.35) 55%,rgba(13,13,18,.55) 100%),linear-gradient(rgba(13,13,18,.35),rgba(13,13,18,.7)),url(assets/bg_newyork.jpg) center/cover fixed no-repeat;padding-bottom:60px}
/* before-after */
.ba{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;align-items:center}
.stage{position:relative;height:640px}
.gcard{position:absolute;right:0;top:40px;width:300px;height:400px;border-radius:26px;overflow:hidden;background:#e3dfd8;box-shadow:0 24px 50px rgba(0,0,0,.18);transform:rotate(5deg);z-index:2;border:6px solid #fff}
.gcard img{width:100%;height:100%;object-fit:contain}
.rcard{position:absolute;left:0;top:0;width:410px;height:590px;border-radius:30px;overflow:hidden;box-shadow:0 34px 70px rgba(0,0,0,.28);transform:rotate(-3deg);border:6px solid #fff;background:#ddd}
.rcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s} .rcard img.on{opacity:1}
.tagc{position:absolute;z-index:5;background:#fff;color:var(--ink);border-radius:999px;padding:8px 18px;font-weight:800;font-size:14px;box-shadow:0 8px 20px rgba(0,0,0,.18)}
.arrow{position:absolute;z-index:6;right:240px;top:360px;width:78px;height:78px;border-radius:50%;background:var(--ink);color:#fff;font-size:34px;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.ba p{color:#c9cad3;max-width:470px;margin-top:20px;font-size:20px;font-weight:300}
/* looks carousel */
.looks{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.11);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);color:#fff;border-radius:48px;margin:90px 28px 0;padding:90px 0 80px}
.tabs{display:flex;gap:12px;margin:34px 0 40px;flex-wrap:wrap}
.tab{border:1.5px solid rgba(255,255,255,.25);border-radius:999px;padding:11px 26px;font-weight:700;font-size:16px;cursor:pointer;color:#d6d6de;transition:.3s}
.tab.on{background:#fff;color:var(--ink);border-color:#fff}
.slides{position:relative;height:560px}
.slide{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s;pointer-events:none}
.slide.on{opacity:1;transform:none;pointer-events:auto}
.slide .c{border-radius:28px;overflow:hidden;position:relative;background:#222}
.slide .c:nth-child(2){margin-top:-28px;margin-bottom:28px}
.slide .c img{width:100%;height:100%;object-fit:cover;transition:transform .8s} .slide .c:hover img{transform:scale(1.06)}
.slide .c span{position:absolute;bottom:16px;right:16px;background:rgba(13,13,18,.65);backdrop-filter:blur(8px);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:700}
.dots{display:flex;gap:8px;margin-top:36px} .dots i{height:4px;width:34px;border-radius:4px;background:rgba(255,255,255,.2);overflow:hidden;position:relative} .dots i.on::after{content:"";position:absolute;inset:0;background:var(--coral);animation:fill 5s linear}
@keyframes fill{from{transform:translateX(100%)}to{transform:none}}
/* steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:60px}
.step .n{font-family:var(--serif);font-size:150px;font-weight:500;line-height:.9;color:transparent;-webkit-text-stroke:1.5px var(--gold);letter-spacing:-2px}
.step h3{font-size:28px;margin:10px 0 8px;font-weight:800} .step p{color:#b9bbc5;font-size:18px;font-weight:300}
/* who */
.who{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
.wc{position:relative;height:520px;border-radius:32px;overflow:hidden;color:#fff;display:flex;align-items:flex-end;padding:30px}
.wc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1s} .wc:hover img{transform:scale(1.07)}
.wc::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 38%,rgba(13,13,18,.88))}
.wc div{position:relative;z-index:2} .wc b{display:block;font-size:34px;font-weight:900;letter-spacing:-1px} .wc span{font-size:17px;color:#e6e6ee}
/* cta/form */
.final{margin:120px 28px 28px;border-radius:48px;background:linear-gradient(120deg,var(--coral),var(--pink) 55%,#8d6bff);color:#fff;padding:90px 0;position:relative;overflow:hidden}
.final .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center}
.final h2{font-size:72px} .final p{font-size:21px;margin-top:20px;font-weight:300;max-width:480px}
.form{background:#fff;color:var(--ink);border-radius:30px;padding:34px;box-shadow:0 30px 70px rgba(0,0,0,.3)}
.form h4{font-size:24px;font-weight:800;margin-bottom:14px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:12px} .f{background:#f4f1ec;border-radius:14px;padding:13px 16px;color:#85868f;font-size:16px;margin-bottom:12px}
.chk{display:flex;gap:10px;font-size:13.5px;color:#777;margin:6px 0 18px} .chk i{width:18px;height:18px;border-radius:5px;border:1.6px solid #bbb;flex:none;margin-top:3px}
.form .pill{width:100%;justify-content:center;border:0;box-shadow:none;background:var(--ink)}
footer{padding:44px 48px;display:flex;justify-content:space-between;color:#8b8d96;font-size:15px} footer b{color:#fff}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}