/* ============ MARITANA BOSS · BIBLIOTECA DE PROMPTS ============ */
:root{
  --preto-palco:#050508;
  --ink:#0b0b12;
  --ciano:#57c8ff;
  --violeta:#9b4dff;
  --magenta:#f02fd0;
  --texto:#ececf4;
  --muted:#9494a8;
  --grad-neon:linear-gradient(100deg,#57c8ff 0%,#9b4dff 50%,#f02fd0 100%);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{background:var(--preto-palco);overflow-x:hidden;scroll-behavior:smooth}
body{
  background:var(--preto-palco);color:var(--texto);
  font-family:'Montserrat','Helvetica Neue',sans-serif;
  min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;
  position:relative;
}
a{text-decoration:none;color:inherit}
::selection{background:var(--magenta);color:#fff}

/* glows de fundo fixos */
.bg-glows{position:fixed;inset:0;z-index:0;pointer-events:none}
.bg-glows::before{content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 60% 40% at 8% -5%,rgba(87,200,255,.16),transparent 55%),
    radial-gradient(ellipse 55% 45% at 100% 100%,rgba(240,47,208,.12),transparent 55%),
    radial-gradient(ellipse 50% 40% at 50% 55%,rgba(155,77,255,.07),transparent 60%);}

/* film grain 35mm */
.film-grain{position:fixed;inset:-100%;width:300%;height:300%;pointer-events:none;
  z-index:91;opacity:.06;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 250 250' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain-shift .9s steps(4) infinite}
@keyframes grain-shift{0%{transform:translate(0,0)}25%{transform:translate(-2%,1.4%)}50%{transform:translate(1.6%,-1%)}75%{transform:translate(-1%,-1.8%)}100%{transform:translate(0,0)}}

.wrap{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:0 20px}

/* utilitários */
.grad-text{background:var(--grad-neon);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.serif-italic{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:500}
.glass{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  background:rgba(20,20,30,.55);
  box-shadow:inset 1px 1px 1px rgba(255,255,255,.1),0 8px 32px rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.08)}

/* ---------- NAVBAR ---------- */
.nav{position:sticky;top:0;z-index:80;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  background:rgba(5,5,8,.55);border-bottom:1px solid rgba(255,255,255,.06)}
.nav-in{max-width:1120px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.nav-logo{height:34px;width:auto;display:block;filter:drop-shadow(0 0 14px rgba(155,77,255,.5))}
.nav-back{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);
  display:inline-flex;align-items:center;gap:8px;transition:color .2s}
.nav-back:hover{color:var(--texto)}
.nav-back svg{width:15px;height:15px}
.nav-social{display:flex;gap:10px;align-items:center}
.nav-social a{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;
  border:1px solid rgba(255,255,255,.1);color:var(--muted);transition:.2s}
.nav-social a:hover{color:#fff;border-color:rgba(155,77,255,.6);box-shadow:0 0 18px rgba(155,77,255,.35)}
.nav-social svg{width:17px;height:17px}

/* ---------- HERO (galeria) ---------- */
.hero{text-align:center;padding:66px 0 30px}
.eyebrow{display:inline-block;font-size:11px;letter-spacing:3.5px;text-transform:uppercase;
  color:#a78bfa;padding:7px 18px;border-radius:100px;
  background:rgba(155,77,255,.12);border:1px solid rgba(155,77,255,.3)}
.hero h1{font-weight:900;letter-spacing:-1.5px;line-height:1.02;margin-top:22px;
  font-size:clamp(36px,7.5vw,74px);text-transform:uppercase}
.hero .accent{display:block;font-size:clamp(26px,5.4vw,52px);text-transform:none;letter-spacing:0;
  margin-top:2px;font-weight:500}
.hero p{max-width:520px;margin:20px auto 0;color:var(--muted);font-size:15px;line-height:1.7}
.hero .count{margin-top:26px;display:inline-flex;gap:22px;flex-wrap:wrap;justify-content:center}
.hero .count b{display:block;font-size:26px;font-weight:800}
.hero .count span{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}
.hero .count .grad-text{-webkit-text-fill-color:transparent}

/* ---------- GRID GALERIA ---------- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;
  padding:24px 0 90px}
.card{position:relative;border-radius:20px;overflow:hidden;display:block;
  border:1px solid rgba(255,255,255,.08);background:var(--ink);
  transform:translateY(0);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;
  isolation:isolate}
.card::after{content:'';position:absolute;inset:0;border-radius:20px;padding:1px;pointer-events:none;
  background:var(--grad-neon);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .35s;z-index:3}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 50px rgba(0,0,0,.6),0 0 40px rgba(155,77,255,.22)}
.card:hover::after{opacity:1}
.card-img{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;background:#111}
.card-img img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.card:hover .card-img img{transform:scale(1.07)}
.card-scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(5,5,8,.94) 0%,rgba(5,5,8,.5) 34%,transparent 62%);z-index:2}
.card-body{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:16px 16px 15px}
.card-tag{display:inline-block;font-size:9px;letter-spacing:2px;text-transform:uppercase;
  color:#3affe0;margin-bottom:7px}
.card-title{font-size:15px;font-weight:800;letter-spacing:.2px;line-height:1.2;text-transform:uppercase}
.card-cta{margin-top:9px;font-size:11px;letter-spacing:.5px;color:var(--muted);
  display:flex;align-items:center;gap:6px}
.card-cta svg{width:13px;height:13px}
.card:hover .card-cta{color:var(--ciano)}

/* ---------- FOOTER ---------- */
.foot{border-top:1px solid rgba(255,255,255,.06);padding:44px 0 60px;text-align:center;position:relative;z-index:1}
.foot img{height:30px;opacity:.9;margin:0 auto 18px;filter:drop-shadow(0 0 12px rgba(155,77,255,.45))}
.foot .fsoc{display:flex;gap:12px;justify-content:center;margin-bottom:18px}
.foot .fsoc a{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;
  border:1px solid rgba(255,255,255,.1);color:var(--muted);transition:.2s}
.foot .fsoc a:hover{color:#fff;border-color:rgba(240,47,208,.6);box-shadow:0 0 18px rgba(240,47,208,.35)}
.foot .fsoc svg{width:18px;height:18px}
.foot small{display:block;color:#5b5b6e;font-size:11px;line-height:1.7;max-width:440px;margin:0 auto}

/* ============ PÁGINA DE DETALHE ============ */
.pg{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:0 20px 80px}
.badge-row{display:flex;justify-content:center;padding:40px 0 0}
.badge{font-size:10px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:#a78bfa;
  padding:6px 16px;border-radius:100px;background:rgba(155,77,255,.14);border:1px solid rgba(155,77,255,.32)}
.d-head{text-align:center;padding:18px 0 0}
.d-head h1{font-weight:900;letter-spacing:-.5px;line-height:1.05;text-transform:uppercase;
  font-size:clamp(30px,7vw,56px)}
.d-head .sub{margin:16px auto 0;max-width:520px;color:var(--muted);font-size:15px;line-height:1.7}
.d-media{margin:30px auto 0;border-radius:22px;overflow:hidden;position:relative;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 10px 50px rgba(0,0,0,.55),0 0 60px rgba(155,77,255,.14)}
.d-media::after{content:'';position:absolute;inset:0;border-radius:22px;padding:1px;pointer-events:none;
  background:var(--grad-neon);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:.5}
.d-media img{width:100%;display:block;object-fit:cover;max-height:520px}
.d-gallery{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:30px}
.d-gallery .d-media{margin:0}
.d-gallery .d-media img{max-height:360px}
@media(max-width:520px){.d-gallery{grid-template-columns:1fr}}

.copy-hint{text-align:center;margin:30px 0 12px;font-size:13px;color:var(--texto);font-weight:600}
.copy-hint span{color:var(--ciano)}
.btn-copy{width:100%;max-width:460px;margin:0 auto;display:block;padding:20px 24px;border:none;
  border-radius:16px;background:var(--grad-neon);color:#fff;
  font-family:'Montserrat',sans-serif;font-weight:800;font-size:16px;letter-spacing:1.5px;text-transform:uppercase;
  cursor:pointer;position:relative;overflow:hidden;
  box-shadow:0 8px 30px rgba(155,77,255,.4),inset 0 0 0 1px rgba(255,255,255,.12);
  transition:transform .15s}
.btn-copy:active{transform:scale(.98)}
.btn-copy::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  animation:shimmer 3s ease-in-out infinite}
.btn-copy svg{width:20px;height:20px;vertical-align:-4px;margin-right:8px}
.btn-copy.done{background:linear-gradient(100deg,#3affe0 0%,#57c8ff 100%);
  box-shadow:0 8px 30px rgba(58,255,224,.45),inset 0 0 0 1px rgba(255,255,255,.15)}
.btn-copy.done::before{display:none}
@keyframes shimmer{0%{left:-100%}60%,100%{left:200%}}
.copy-ok{text-align:center;margin-top:12px;font-size:13px;color:#3affe0;height:18px;opacity:0;transition:opacity .25s;font-weight:600;letter-spacing:.5px}
.copy-ok.show{opacity:1}

.prompt-wrap{margin-top:34px}
.prompt-lbl{font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);
  display:flex;align-items:center;gap:10px;margin-bottom:12px}
.prompt-lbl::before{content:'';width:22px;height:1px;background:var(--grad-neon)}
.prompt-box{border-radius:18px;padding:22px;position:relative;
  max-height:440px;overflow:auto;border-left:2px solid transparent;
  background:linear-gradient(rgba(15,15,22,.7),rgba(15,15,22,.7)) padding-box,var(--grad-neon) border-box;
  border:1px solid transparent;border-left-width:3px}
.prompt-box pre{font-family:'SF Mono','JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;
  font-size:12.5px;line-height:1.7;color:#c9c9dc;white-space:pre-wrap;word-break:break-word}

/* botão back detalhe (topo) */
.d-back{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--muted);padding:26px 0 0;transition:color .2s}
.d-back:hover{color:var(--texto)}
.d-back svg{width:15px;height:15px}

/* ---------- OVERLAY / POPUP BÔNUS ---------- */
.ov{position:fixed;inset:0;background:rgba(4,4,10,.82);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  z-index:200;display:flex;align-items:center;justify-content:center;padding:18px;
  opacity:0;pointer-events:none;transition:opacity .3s ease}
.ov.show{opacity:1;pointer-events:all}
.popup{width:100%;max-width:420px;border-radius:26px;padding:34px 26px 26px;position:relative;overflow:hidden;text-align:center;
  background:linear-gradient(rgba(18,18,28,.94),rgba(11,11,19,.96)) padding-box,var(--grad-neon) border-box;
  border:1px solid transparent;
  box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 60px rgba(155,77,255,.25);
  transform:scale(.92) translateY(16px);transition:transform .4s cubic-bezier(.34,1.5,.64,1)}
.ov.show .popup{transform:scale(1) translateY(0)}
.popup::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-neon)}
.gift-scene{display:flex;justify-content:center;margin-bottom:18px}
.gift-wrap{width:92px;height:100px;position:relative}
.g-glow{position:absolute;inset:-14px;background:radial-gradient(circle,rgba(155,77,255,.4),transparent 70%);border-radius:50%;animation:glow-pulse 1.6s ease-in-out infinite}
.g-body{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:78px;height:56px;background:var(--grad-neon);border-radius:5px 5px 10px 10px;overflow:hidden;box-shadow:0 8px 26px rgba(155,77,255,.5)}
.g-body-riv{position:absolute;left:50%;transform:translateX(-50%);top:0;bottom:0;width:14px;background:rgba(255,255,255,.35)}
.g-lid{position:absolute;top:0;left:50%;transform:translateX(-50%);width:86px;height:26px;background:var(--grad-neon);border-radius:6px;display:flex;align-items:center;justify-content:center;z-index:2;transform-origin:center bottom;animation:lid-lift 1.8s ease-in-out infinite;box-shadow:0 0 20px rgba(240,47,208,.5)}
.g-lid-rib{width:15px;height:100%;background:rgba(255,255,255,.35);border-radius:3px}
.g-bow{position:absolute;top:-9px;left:50%;transform:translateX(-50%);width:32px;height:16px}
.g-bow::before,.g-bow::after{content:'';position:absolute;width:14px;height:14px;border-radius:50% 50% 0 50%;background:rgba(255,255,255,.55);top:0}
.g-bow::before{left:0;transform:rotate(-45deg)}
.g-bow::after{right:0;transform:rotate(45deg) scaleX(-1)}
@keyframes lid-lift{0%,100%{transform:translateX(-50%) translateY(0) rotate(0)}30%{transform:translateX(-50%) translateY(-18px) rotate(-12deg)}60%{transform:translateX(-50%) translateY(-18px) rotate(12deg)}85%{transform:translateX(-50%) translateY(-6px) rotate(0)}}
@keyframes glow-pulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}
.pop-copied{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;
  color:#062024;background:linear-gradient(100deg,#3affe0,#57c8ff);padding:7px 15px;border-radius:100px;margin-bottom:14px;
  box-shadow:0 4px 18px rgba(58,255,224,.35)}
.pop-copied svg{width:15px;height:15px}
.pop-title{font-family:'Montserrat',sans-serif;font-weight:800;font-size:21px;line-height:1.2;color:#fff;margin-bottom:10px}
.pop-title b{font-weight:800;background:var(--grad-neon);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.pop-sub{font-size:14px;color:var(--muted);line-height:1.65;margin-bottom:22px}
.btn-unlock{width:100%;padding:18px;border:none;border-radius:14px;background:var(--grad-neon);color:#fff;
  font-family:'Montserrat',sans-serif;font-weight:800;font-size:16px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;
  box-shadow:0 8px 28px rgba(155,77,255,.45);transition:transform .15s;position:relative;overflow:hidden}
.btn-unlock:active{transform:scale(.97)}
.btn-unlock::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 2.6s ease-in-out infinite}
.pop-close{display:block;margin-top:14px;font-size:12px;color:#6b6b80;cursor:pointer;padding:6px;letter-spacing:.5px}
.pop-close:hover{color:var(--texto)}
.pop-x{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#9494a8;font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}
.pop-x:hover{color:#fff;border-color:rgba(255,255,255,.3)}

/* toast/particles */
.pts{position:fixed;inset:0;pointer-events:none;z-index:99;overflow:hidden;opacity:0;transition:opacity .3s}
.pts.show{opacity:1}
.pt{position:absolute;border-radius:50%;animation:ptfall linear forwards}
@keyframes ptfall{0%{transform:translateY(-20px) rotate(0);opacity:1}100%{transform:translateY(100vh) rotate(360deg);opacity:0}}

/* fade-up entrada */
.fup{animation:fup .6s ease both}
.fup2{animation:fup .6s .1s ease both}
.fup3{animation:fup .6s .2s ease both}
@keyframes fup{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

@media(max-width:600px){
  .grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .card-title{font-size:13px}
  .hero{padding:44px 0 20px}
  .hero h1{font-size:clamp(28px,8.2vw,42px);letter-spacing:-1px}
  .hero .accent{font-size:clamp(21px,6vw,30px)}
  .hero p{font-size:14px;max-width:100%}
  .hero .count{gap:16px}
  .card-body{padding:13px 13px 12px}
  .d-head h1{font-size:clamp(26px,7.5vw,44px);word-break:break-word}
}