:root{
  --bg:#0a0a0b; --bg2:#101014; --card:#141419; --line:#26262e;
  --ink:#f4f1ea; --mut:#a7a39b; --dim:#6f6b64;
  --gold:#e6a95c; --gold-h:#f2bd75; --teal:#4bb3a7;
  --r:14px; --wrap:1120px;
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --disp:'Fraunces',Georgia,'Times New Roman',serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--font);
  line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 20px}
.narrow{max-width:760px}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.5em;justify-content:center;
  background:var(--gold);color:#20160a;font-weight:700;font-size:15px;
  padding:13px 22px;border-radius:999px;border:0;cursor:pointer;
  transition:transform .12s ease,background .15s ease,box-shadow .15s ease;
  box-shadow:0 6px 22px -8px rgba(230,169,92,.6)}
.btn:hover{background:var(--gold-h);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-lg{padding:16px 30px;font-size:17px}
.btn-sm{padding:9px 16px;font-size:13.5px}
.btn-block{display:flex;width:100%;margin-top:6px}
.btn-ghost{background:transparent;color:var(--ink);box-shadow:none;
  border:1px solid var(--line)}
.btn-ghost:hover{background:#17171d;border-color:#3a3a44}

/* promo */
.promo{background:linear-gradient(90deg,#2a1f10,#3a2a14);color:var(--gold-h);
  font-size:13.5px;text-align:center;padding:9px 40px 9px 16px;position:relative;
  border-bottom:1px solid #3a2a14}
.promo strong{color:#fff}
.promo-x{position:absolute;right:10px;top:50%;transform:translateY(-50%);
  background:none;border:0;color:var(--gold-h);font-size:20px;cursor:pointer;line-height:1}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(10,10,11,.82);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:60px}
.brand{font-weight:700;letter-spacing:.14em;font-size:14px}
.brand span{color:var(--gold);letter-spacing:.02em;font-weight:600;
  font-family:var(--disp);font-style:italic;margin-left:6px;letter-spacing:0}

/* hero */
.hero{padding:64px 0 34px;position:relative;
  background:radial-gradient(120% 90% at 50% -10%,#1b160f 0%,var(--bg) 55%)}
.eyebrow{color:var(--gold);font-size:12.5px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;margin-bottom:18px}
h1{font-family:var(--disp);font-weight:500;font-size:clamp(36px,7vw,64px);
  line-height:1.03;letter-spacing:-.01em;margin-bottom:18px}
h1 em{font-style:italic;color:var(--gold)}
.lede{color:var(--mut);font-size:clamp(16px,2.4vw,19px);max-width:600px;margin-bottom:26px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:34px}
.micro{color:var(--dim);font-size:13px;text-align:center;margin-top:12px}

/* before/after slider */
.ba{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;
  border:1px solid var(--line);user-select:none;touch-action:pan-y;
  background:#000;box-shadow:0 30px 80px -40px rgba(0,0,0,.9);cursor:ew-resize}
.ba-hero{margin-top:8px}
.ba-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba-after{clip-path:inset(0 0 0 50%)}
.ba-divider{position:absolute;top:0;bottom:0;left:50%;width:2px;
  background:rgba(255,255,255,.9);transform:translateX(-1px);pointer-events:none}
.ba-handle{position:absolute;top:50%;left:50%;width:42px;height:42px;
  transform:translate(-50%,-50%);border-radius:50%;background:rgba(255,255,255,.95);
  box-shadow:0 2px 12px rgba(0,0,0,.5)}
.ba-handle::before,.ba-handle::after{content:'';position:absolute;top:50%;
  width:0;height:0;border:6px solid transparent}
.ba-handle::before{left:9px;transform:translateY(-50%);border-right-color:#20160a}
.ba-handle::after{right:9px;transform:translateY(-50%);border-left-color:#20160a}
.ba-tag{position:absolute;bottom:12px;font-size:11px;font-weight:700;letter-spacing:.1em;
  padding:5px 10px;border-radius:999px;background:rgba(0,0,0,.6);
  backdrop-filter:blur(4px);pointer-events:none}
.ba-tag-l{left:12px;color:#dcd8d0}
.ba-tag-r{right:12px;color:var(--gold-h)}

/* value bar */
.valuebar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:var(--bg2)}
.valuebar-in{display:flex;flex-wrap:wrap;gap:10px 34px;justify-content:center;
  padding:18px 20px;color:var(--mut);font-size:14px}
.valuebar-in b{color:var(--ink);font-family:var(--disp);font-weight:600}

/* sections */
.section{padding:72px 0}
.section-alt{background:var(--bg2)}
.h2{font-family:var(--disp);font-weight:500;font-size:clamp(27px,4.5vw,40px);
  line-height:1.1;text-align:center;letter-spacing:-.01em;margin-bottom:12px}
.h2.left{text-align:left}
.sub{color:var(--mut);text-align:center;max-width:620px;margin:0 auto 40px;font-size:16px}

/* looks */
.looks{display:flex;flex-direction:column;gap:26px}
.look{display:grid;grid-template-columns:1.35fr 1fr;gap:26px;align-items:center;
  background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px}
.look:nth-child(even){grid-template-columns:1fr 1.35fr}
.look:nth-child(even) .look-copy{order:-1}
.look-copy{padding:8px 14px}
.look-no{font-family:var(--disp);font-size:14px;color:var(--gold);font-weight:600}
.look-copy h3{font-family:var(--disp);font-weight:600;font-size:26px;margin:2px 0 10px}
.look-copy p{color:var(--mut);font-size:15.5px}

/* gallery */
.gallery{max-width:900px;margin:0 auto}
.gal-tabs,.gal-looks{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.gal-tabs{margin-bottom:16px}
.gal-looks{margin-top:16px}
.gal-tab,.gal-looks button{background:var(--card);color:var(--mut);border:1px solid var(--line);
  padding:9px 16px;border-radius:999px;font-size:13.5px;font-weight:600;cursor:pointer;
  font-family:var(--font);transition:.15s}
.gal-tab:hover,.gal-looks button:hover{color:var(--ink);border-color:#3a3a44}
.gal-tab.is-on,.gal-looks button.is-on{background:var(--gold);color:#20160a;border-color:var(--gold)}
.gal-stage{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);
  aspect-ratio:16/9;background:#000}
.gal-stage img{width:100%;height:100%;object-fit:cover}
.gal-look{position:absolute;bottom:12px;right:12px;font-size:12px;font-weight:700;
  letter-spacing:.08em;color:var(--gold-h);background:rgba(0,0,0,.6);
  padding:6px 12px;border-radius:999px;backdrop-filter:blur(4px)}

/* why / grid2 */
.grid2{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center}
.ticks{list-style:none;display:flex;flex-direction:column;gap:16px;margin-top:8px}
.ticks li{color:var(--mut);font-size:15.5px;padding-left:30px;position:relative}
.ticks li::before{content:'';position:absolute;left:0;top:7px;width:16px;height:16px;
  border-radius:50%;background:var(--gold);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/12px no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/12px no-repeat}
.ticks b{color:var(--ink)}
.founder{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:14px;padding:28px}
.founder-quote{font-family:var(--disp);font-style:italic;font-size:19px;line-height:1.4;color:var(--ink)}
.founder-name{color:var(--gold);font-size:14px;font-weight:600;margin-top:14px}

/* pricing */
.price-card{max-width:560px;margin:0 auto;background:var(--card);
  border:1px solid var(--line);border-radius:18px;padding:30px;
  box-shadow:0 40px 100px -50px rgba(230,169,92,.35)}
.price-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:20px}
.price-top h3{font-family:var(--disp);font-weight:600;font-size:22px}
.price-sub{color:var(--mut);font-size:14px;margin-top:4px}
.price-tag{font-family:var(--disp);font-weight:600;font-size:44px;color:var(--gold);line-height:1}
.price-list{list-style:none;display:flex;flex-direction:column;gap:11px;margin-bottom:24px}
.price-list li{color:var(--mut);font-size:14.5px;padding-left:26px;position:relative}
.price-list li::before{content:'✓';position:absolute;left:0;color:var(--gold);font-weight:700}
.price-trust{text-align:center;color:var(--dim);font-size:12.5px;margin-top:14px}

/* faq */
.faq{display:flex;flex-direction:column;gap:10px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:4px 18px}
.faq summary{cursor:pointer;padding:15px 0;font-weight:600;font-size:16px;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';color:var(--gold);font-size:22px;font-weight:400;transition:.2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--mut);font-size:15px;padding:0 0 16px}
.faq code{background:#0d0d10;padding:1px 6px;border-radius:5px;font-size:13px;color:var(--gold-h)}

/* final + footer */
.finalcta{text-align:center;background:radial-gradient(90% 120% at 50% 120%,#1b160f,var(--bg) 60%)}
.finalcta .h2{margin-bottom:24px}
.foot{border-top:1px solid var(--line);padding:26px 0;color:var(--dim);font-size:12.5px}
.foot-in{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

/* sticky mobile buy */
.stickybuy{position:fixed;bottom:0;left:0;right:0;z-index:60;display:none;
  align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;
  background:rgba(16,16,20,.94);backdrop-filter:blur(12px);border-top:1px solid var(--line)}
.sb-price{font-size:14px;color:var(--mut)}
.sb-price b{color:var(--ink)}
.stickybuy .btn{padding:11px 20px;font-size:14px}

@media(max-width:720px){
  .section{padding:52px 0}
  .look{grid-template-columns:1fr!important;gap:4px;padding:12px}
  .look:nth-child(even) .look-copy{order:0}
  .look-copy{padding:6px 6px 10px}
  .grid2{grid-template-columns:1fr;gap:26px}
  .nav .btn-sm{display:none}
  .stickybuy{display:flex}
  body{padding-bottom:70px}
  .foot-in{flex-direction:column;gap:6px}
}
