/* ===== Nick Boutique — Landing Page ===== */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:600;font-display:swap;src:url('assets/fonts/cormorant-garamond-600.woff2') format('woff2');}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/cormorant-garamond-700.woff2') format('woff2');}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/montserrat-400.woff2') format('woff2');}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;src:url('assets/fonts/montserrat-600.woff2') format('woff2');}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/montserrat-700.woff2') format('woff2');}

:root{
  --black:#0c0b0a;
  --black-2:#15130f;
  --black-3:#1d1a14;
  --cream:#f4ecdc;
  --cream-2:#efe4cd;
  --cream-soft:#fbf7ee;
  --gold:#c9a24a;
  --gold-2:#e7c873;
  --gold-3:#a8842f;
  --gold-grad:linear-gradient(135deg,#a8842f 0%,#e7c873 45%,#c9a24a 70%,#f3e2a9 100%);
  --txt-on-dark:#f4ecdc;
  --txt-muted:#bcae93;
  --radius:18px;
  --maxw:1140px;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Montserrat","Helvetica Neue",Arial,sans-serif;
  --shadow:0 24px 60px -22px rgba(0,0,0,.65);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background:var(--black);
  color:var(--txt-on-dark);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 22px}

.serif{font-family:var(--serif)}
.gold-text{
  background:var(--gold-grad);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.eyebrow{
  font-size:.74rem;letter-spacing:.42em;text-transform:uppercase;
  color:var(--gold-2);font-weight:600;
}

/* ===== Top bar / logo ===== */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(12,11,10,.72);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(201,162,74,.16);
}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;min-height:78px}
.brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.brand .logo-svg{width:42px;height:42px}
.brand-logo{height:clamp(40px,9vw,58px);width:auto;display:block}
.brand--footer{justify-content:center}
footer .brand-logo{height:clamp(74px,16vw,104px);width:auto;margin:0 auto}
.brand .logo-txt{display:flex;flex-direction:column;line-height:1}
.brand .logo-txt b{font-family:var(--serif);font-size:1.32rem;letter-spacing:.06em;font-weight:600}
.brand .logo-txt span{font-size:.58rem;letter-spacing:.46em;color:var(--gold-2);text-transform:uppercase;margin-top:3px}
.topbar .pill{
  display:inline-flex;align-items:center;gap:8px;font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--txt-muted);
}
.topbar .pill .dot{width:7px;height:7px;border-radius:50%;background:#3ad17a;box-shadow:0 0 0 4px rgba(58,209,122,.18)}

/* ===== Buttons ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--sans);font-weight:700;font-size:1rem;letter-spacing:.02em;
  padding:17px 30px;border-radius:999px;border:none;cursor:pointer;
  background:var(--gold-grad);color:#231a06;
  box-shadow:0 16px 34px -12px rgba(201,162,74,.7);
  transition:transform .25s ease,box-shadow .25s ease,filter .25s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 22px 44px -12px rgba(201,162,74,.85);filter:brightness(1.04)}
.btn:active{transform:translateY(0)}
.btn--ghost{background:transparent;color:var(--cream);border:1px solid rgba(201,162,74,.5);box-shadow:none}
.btn--block{width:100%}

/* ===== Hero ===== */
.hero{position:relative;padding:64px 0 40px;overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(900px 420px at 80% -8%,rgba(201,162,74,.18),transparent 60%),
    radial-gradient(640px 420px at 0% 100%,rgba(231,200,115,.08),transparent 60%);
}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}
.hero-copy h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.5rem,5.4vw,4.1rem);line-height:1.04;margin:18px 0 16px}
.hero-copy .sub{font-size:1.08rem;color:var(--txt-muted);max-width:540px;margin-bottom:28px}
.hero-copy .sub b{color:var(--cream);font-weight:600}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero-trust{display:flex;gap:26px;margin-top:34px;flex-wrap:wrap}
.hero-trust .t b{display:block;font-family:var(--serif);font-size:1.9rem;color:var(--gold-2);line-height:1}
.hero-trust .t span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--txt-muted)}

.hero-art{position:relative;display:flex;justify-content:center;align-items:center;min-height:380px}
.hero-art .glow{position:absolute;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(231,200,115,.22),transparent 65%);filter:blur(6px)}

/* Hero video */
.hero-video{position:relative}
.hero-video .vsl-frame{max-width:none}
.play-overlay{
  position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;cursor:pointer;border:none;
  background:radial-gradient(circle at 50% 50%,rgba(12,11,10,.25),rgba(12,11,10,.55));
  transition:opacity .35s ease;color:var(--cream);font-family:var(--sans);
}
.play-overlay.hide{opacity:0;pointer-events:none}
.po-circle{
  position:relative;width:88px;height:88px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--gold-grad);color:#231a06;box-shadow:0 12px 34px -8px rgba(201,162,74,.85);
  padding-left:5px;animation:playbeat 1.8s ease-in-out infinite;
}
.po-circle svg{animation:playnudge 1.8s ease-in-out infinite}
.po-circle::after,.po-circle::before{content:"";position:absolute;left:50%;top:50%;width:88px;height:88px;
  margin:-44px 0 0 -44px;border-radius:50%;border:2px solid rgba(231,200,115,.65);animation:pulse 2.4s ease-out infinite}
.po-circle::before{animation-delay:1.2s}
.play-overlay:hover .po-circle{transform:scale(1.08)}
@keyframes playbeat{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@keyframes playnudge{0%,100%{transform:translateX(0)}50%{transform:translateX(2px)}}
.po-label{font-weight:700;font-size:.86rem;letter-spacing:.16em;text-transform:uppercase;
  background:rgba(12,11,10,.55);padding:7px 16px;border-radius:999px;backdrop-filter:blur(4px)}

/* ===== Reveal animation ===== */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}

/* ===== Section base ===== */
.section{padding:74px 0;position:relative}
.section-head{text-align:center;max-width:680px;margin:0 auto 44px}
.section-head h2{font-family:var(--serif);font-weight:600;font-size:clamp(2rem,4vw,2.9rem);line-height:1.08;margin:12px 0 12px}
.section-head p{color:var(--txt-muted)}

/* ===== VSL ===== */
.vsl{background:linear-gradient(180deg,var(--black) 0%,var(--black-2) 100%)}
.vsl-frame{
  max-width:780px;margin:0 auto;position:relative;border-radius:24px;overflow:hidden;
  border:1px solid rgba(201,162,74,.35);box-shadow:var(--shadow);
  background:#000;
}
.vsl-frame::after{content:"";position:absolute;inset:0;border-radius:24px;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(231,200,115,.18)}
.vsl-frame video{width:100%;display:block;aspect-ratio:16/9;object-fit:contain;background:#000}
.vsl-caption{text-align:center;color:var(--txt-muted);font-size:.86rem;margin-top:18px;letter-spacing:.04em}

/* ===== Form / Cadastro ===== */
.cadastro{background:
  radial-gradient(700px 380px at 50% 0%,rgba(201,162,74,.12),transparent 60%),var(--black-2)}
.card-form{
  max-width:560px;margin:0 auto;background:linear-gradient(180deg,#fbf7ee 0%,#f1e6cf 100%);
  color:#1c1813;border-radius:24px;padding:38px 34px;box-shadow:var(--shadow);
  border:1px solid rgba(201,162,74,.4);
}
.card-form .badge{display:inline-flex;align-items:center;gap:8px;font-size:.7rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold-3);font-weight:700;margin-bottom:10px}
.card-form h3{font-family:var(--serif);font-size:2rem;line-height:1.1;margin-bottom:6px;color:#1c1813}
.card-form .lead{color:#6a5f49;font-size:.96rem;margin-bottom:24px}
.field{margin-bottom:16px}
.field label{display:block;font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:#7a6c4e;margin-bottom:7px}
.field input{
  width:100%;padding:15px 16px;border-radius:13px;border:1.5px solid #d9c89e;
  background:#fffdf8;font-size:1rem;font-family:var(--sans);color:#1c1813;transition:border-color .2s,box-shadow .2s;
}
.field input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(201,162,74,.18)}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-foot{font-size:.76rem;color:#8a7d61;text-align:center;margin-top:14px;display:flex;gap:7px;justify-content:center;align-items:center}
.err{color:#b3402f;font-size:.78rem;margin-top:6px;display:none}
.field.invalid input{border-color:#cf5b48}
.field.invalid .err{display:block}

/* ===== Story strip (curadoria / SVG animations) ===== */
.story{background:var(--black)}
.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.story-card{
  background:linear-gradient(180deg,var(--black-3),#15120c);
  border:1px solid rgba(201,162,74,.18);border-radius:var(--radius);
  padding:30px 26px;text-align:center;transition:transform .35s ease,border-color .35s;
}
.story-card:hover{transform:translateY(-6px);border-color:rgba(201,162,74,.5)}
.story-card .ico{width:84px;height:84px;margin:0 auto 16px}
.story-card h4{font-family:var(--serif);font-size:1.5rem;margin-bottom:8px;color:var(--gold-2)}
.story-card p{color:var(--txt-muted);font-size:.92rem}

.curadoria{margin-top:48px;background:linear-gradient(135deg,#15130f,#0c0b0a);
  border:1px solid rgba(201,162,74,.2);border-radius:24px;padding:38px;
  display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}
.curadoria h3{font-family:var(--serif);font-size:2.1rem;margin-bottom:10px}
.curadoria p{color:var(--txt-muted);margin-bottom:18px}
.check-list{list-style:none;display:grid;gap:12px}
.check-list li{display:flex;align-items:center;gap:12px;font-size:.98rem}
.check-list .ck{width:26px;height:26px;flex:0 0 26px}

/* ===== Carrossel provas sociais ===== */
.proofs{background:linear-gradient(180deg,var(--black-2),var(--black))}
.marquee{position:relative;width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee:hover .track{animation-play-state:paused}
.track{display:flex;gap:18px;width:max-content;animation:scrollx 60s linear infinite;
  will-change:transform;transform:translate3d(0,0,0);backface-visibility:hidden}
.track.rev{animation-direction:reverse;animation-duration:70s;margin-top:18px}
.proof{
  flex:0 0 auto;width:230px;border-radius:16px;overflow:hidden;
  border:1px solid rgba(201,162,74,.28);background:#000;box-shadow:0 14px 30px -16px rgba(0,0,0,.8);
  transition:transform .3s ease,border-color .3s;
}
.proof:hover{transform:translateY(-6px) scale(1.02);border-color:var(--gold-2)}
.proof img{width:100%;height:330px;object-fit:cover;display:block}
@keyframes scrollx{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* ===== Final CTA ===== */
.final-cta{text-align:center;background:
  radial-gradient(700px 360px at 50% 120%,rgba(201,162,74,.16),transparent 60%),var(--black)}
.final-cta h2{font-family:var(--serif);font-size:clamp(2rem,4.4vw,3rem);margin-bottom:14px}
.final-cta p{color:var(--txt-muted);max-width:520px;margin:0 auto 26px}

/* ===== Footer ===== */
footer{background:var(--black-2);border-top:1px solid rgba(201,162,74,.16);padding:34px 0;text-align:center}
footer .brand{justify-content:center;margin-bottom:10px}
footer small{color:var(--txt-muted);font-size:.78rem;letter-spacing:.04em}
footer .admin-link{color:var(--gold-3);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;margin-top:8px;display:inline-block;opacity:.7}

/* ===== Toast ===== */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(220%);
  background:var(--gold-grad);color:#231a06;font-weight:700;padding:14px 24px;border-radius:999px;
  box-shadow:var(--shadow);z-index:200;opacity:0;pointer-events:none;
  transition:transform .4s cubic-bezier(.2,.9,.3,1.2),opacity .3s ease}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1}

/* ===== SVG animation helpers ===== */
.spin-slow{transform-origin:center;animation:spin 14s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.float{animation:float 5s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.draw{stroke-dasharray:600;stroke-dashoffset:600;animation:draw 2.6s ease forwards}
.draw.d2{animation-delay:.5s}
.draw.d3{animation-delay:1s}
@keyframes draw{to{stroke-dashoffset:0}}
.twinkle{animation:tw 2.6s ease-in-out infinite}
.twinkle.t2{animation-delay:.8s}
.twinkle.t3{animation-delay:1.5s}
@keyframes tw{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
.pulse-ring{transform-origin:center;animation:pulse 3s ease-out infinite}
@keyframes pulse{0%{transform:scale(.85);opacity:.8}70%{transform:scale(1.25);opacity:0}100%{opacity:0}}

/* ===== Responsive ===== */
@media (max-width:880px){
  .hero .wrap{grid-template-columns:1fr;gap:26px}
  .hero-art{order:-1;min-height:280px}
  .story-grid{grid-template-columns:1fr}
  .curadoria{grid-template-columns:1fr;padding:30px 24px}
  .curadoria .cur-art{order:-1}
  .topbar .pill{display:none}
}
@media (max-width:520px){
  .row-2{grid-template-columns:1fr}
  .section{padding:54px 0}
  .hero-trust{gap:18px}
  .proof{width:185px}
  .proof img{height:270px}
}
