@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,100..900;9..144,400;9..144,700;9..144,900&family=Inter:wght@300;400;500;600&display=swap');

:root { --bg:#070709; --orange:#FF6A00; --purple:#7A2CFF; --text:#EDE8E3; }

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:#070709; margin:0; color:var(--text); font-family:"Inter",system-ui,sans-serif; overflow-x:hidden; }

h1,h2,.display { font-family:"Fraunces",serif; }

/* PRIMEIRA VERSÃO: scrollbar laranja fina 6px - como pediste */
* { scrollbar-width: thin; scrollbar-color: var(--orange) #070709; }
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:#070709; }
::-webkit-scrollbar-thumb { background:linear-gradient(180deg, #FF6A00, #7A2CFF); border-radius:10px; }
::-webkit-scrollbar-thumb:hover { background:#FF6A00; }

/* Cursor custom só desktop - PRIMEIRA VERSÃO com círculo laranja */
@media(min-width:768px){
  html, body, a, button { cursor: none !important; }
}
@media(max-width:767px){
  .cursor-ring, .cursor-dot { display:none !important; }
}

.reveal { opacity:0; transform: translateY(24px); transition: all 0.9s cubic-bezier(0.16,1,0.3,1); }
.reveal.in-view { opacity:1; transform: translateY(0); }

.grain { position:absolute; inset:0; pointer-events:none; opacity:0.06; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.05'/%3E%3C/svg%3E"); }

.cursor-ring { position:fixed; top:0; left:0; width:44px; height:44px; margin-left:-22px; margin-top:-22px; pointer-events:none; z-index:1000; mix-blend:normal; transition: transform 0.15s; }
.cursor-dot { position:fixed; top:0; left:0; width:6px; height:6px; margin-left:-3px; margin-top:-3px; border-radius:50%; background:#FF6A00; pointer-events:none; z-index:1001; box-shadow:0 0 12px #FF6A00; }
.cursor-ring.hover { transform: scale(1.5); }
.cursor-ring.hover .ring-inner { border-color:#FF6A00; background: rgba(255,106,0,0.1); }
