:root {
  --bg-base: #050505;
    --cyano: #00d1ff;
    --roxo: #7f00ff;
    --roxo-soft: #9d4dff;
    --laranja: #ff4d00;
    --green: #25d366;
    --gold: #ffd700;
    --pink: #ff3366;
    --white: #ffffff;
    --text: rgba(255, 255, 255, .94);
    --muted: rgba(255, 255, 255, .62);
    --faint: rgba(255, 255, 255, .38);
    --glass: #121216;
    --glass-strong: #181820;
    --border: rgba(255, 255, 255, .05);
    --border-hi: rgba(255, 255, 255, .12);
    --shadow: 0 12px 32px rgba(0, 0, 0, .28);
    --radius-xl: 28px;
    --radius-lg: 22px;
    --radius-md: 16px;
    --transition: all .45s cubic-bezier(.16, 1, .3, 1)
}
*, *:before, *:after {
  box-sizing:border-box;
    margin:0;
    padding:0;
    -webkit-tap-highlight-color: transparent
}
html {
  scroll-behavior:smooth;
    scroll-padding-top:20px;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    overflow-x:hidden
}
body {
  min-height:100vh;
    background-color:var(--bg-base);
    color:var(--text);
    font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif;
    line-height:1.6;
    overflow-x:hidden
}
body:before {
  display: none;
}
a {
  color:inherit;
    text-decoration:none
}
img {
  display:block;
    max-width:100%
}
button {
  border:0;
    background:none;
    color:inherit;
    font:inherit;
    cursor:pointer
}
.brand-glyph {
  display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:1.35em;
    font-size:.72em;
    line-height:1;
    font-weight:900;
    letter-spacing:-.02em
}
.page {
  position:relative;
    z-index:1;
    width:min(100%, 1180px);
    max-width:100vw;
    margin:0 auto;
    padding:22px;
    overflow-x:clip
}
.aurora {
  display: none;
}
.aurora span {
  position:absolute;
    width:280px;
    height:280px;
    border-radius:999px;
    filter:blur(48px);
    opacity:.20
}
.aurora span:nth-child(1) {
  left:6%;
    top:14%;
    background:var(--roxo)
}
.aurora span:nth-child(2) {
  right:7%;
    top:8%;
    background:var(--cyano);
    animation-delay:-4s
}
.aurora span:nth-child(3) {
  right:28%;
    bottom:4%;
    background:var(--laranja);
    animation-delay:-8s
}
@keyframes floaty {
  0%, to {
  transform:translateZ(0) scale(1)
}
50% {
  transform:translate3d(18px, -24px, 0) scale(1.08)
}
}
.glass {
  position:relative;
    background:var(--glass);
    border:1px solid var(--border);
    border-radius:var(--radius-xl);
    box-shadow:var(--shadow), inset 0 1px rgba(255, 255, 255, 0.05);
    overflow:hidden
}
.glass:before {
  content:"";
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background:radial-gradient(800px circle at 50% 0%, rgba(255, 255, 255, 0.06), transparent 50%);
    opacity:0;
    transition:opacity .45s ease;
    pointer-events:none
}
.glass:hover:before {
  opacity:1
}
.topbar {
  display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;
    margin-bottom:18px;
    padding:13px 14px;
    border-radius:999px;
    background:var(--glass);
    border:1px solid var(--border)
}
.brand {
  display:flex;
    align-items:center;
    gap:12px;
    min-width:0
}
.brand-logo {
  width:42px;
    height:42px;
    border-radius:50%;
    background:linear-gradient(145deg, #fff, #dfe8ff);
    padding:5px;
    box-shadow:0 0 24px #00d1ff47;
    flex:0 0 auto
}
.brand-logo img {
  width:100%;
    height:100%;
    object-fit:contain;
    filter:brightness(0)
}
.brand strong {
  display:block;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:.92rem;
    font-weight:900;
    line-height:1;
    text-transform:uppercase
}
.brand span {
  display:block;
    margin-top:2px;
    color:var(--faint);
    font-size:.63rem;
    font-weight:800;
    letter-spacing:.18em;
    text-transform:uppercase
}
.top-actions {
  display:flex;
    align-items:center;
    gap:8px
}
.icon-btn {
  width:42px;
    height:42px;
    border-radius:50%;
    display:grid;
    place-items:center;
    color:#ffffffd1;
    background:#ffffff0f;
    border:1px solid rgba(255, 255, 255, .1);
    transition:var(--transition)
}
.icon-btn:hover {
  color:#fff;
    border-color:#00d1ff61;
    transform:translateY(-2px);
    box-shadow:0 12px 28px #00000047
}
.hero {
  position:relative;
    display:grid;
    grid-template-columns:minmax(0, 1.05fr) minmax(340px, .95fr);
    gap:24px;
    align-items:stretch;
    margin-bottom:18px;
    isolation:isolate
}
.hero:before {
  content:"";
    position:absolute;
    top:36px;
    right:-8%;
    bottom:-34px;
    left:-8%;
    background:radial-gradient(44% 58% at 13% 52%, rgba(127, 0, 255, .28), transparent 72%), radial-gradient(42% 56% at 86% 42%, rgba(0, 209, 255, .18), transparent 72%);
    filter:blur(42px);
    opacity:.74;
    z-index:-1;
    pointer-events:none
}
.hero-panel {
  padding:clamp(26px, 4vw, 48px);
    min-height:560px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    isolation:isolate;
    min-width:0;
    overflow:visible
}
.hero-panel:after {
  content:"";
    position:absolute;
    left:-14%;
    right:-20%;
    bottom:-30%;
    height:270px;
    border-radius:999px;
    background:radial-gradient(closest-side, rgba(127, 0, 255, .45), rgba(0, 209, 255, .18) 58%, transparent 100%);
    filter:blur(62px);
    opacity:.68;
    z-index:0;
    pointer-events:none
}
.hero-panel>* {
  position:relative;
    z-index:1
}
.badge {
  display:inline-flex;
    align-items:center;
    gap:10px;
    width:fit-content;
    padding:8px 12px;
    border-radius:999px;
    border:1px solid rgba(0, 209, 255, .22);
    background:#00d1ff13;
    color:#ffffffe0;
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase
}
.badge-dot {
  width:8px;
    height:8px;
    border-radius:50%;
    background:var(--green);
    box-shadow:0 0 18px #25d366cc
}
.hero h1 {
  max-width:10ch;
    margin:22px 0 18px;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:clamp(3rem, 8.2vw, 6.7rem);
    line-height:.88;
    letter-spacing:-.085em;
    text-transform:uppercase
}
.gradient-text {
  display:inline-block;
    padding-right:.075em;
    background:linear-gradient(100deg, #20d7ff, #4d86ff 18%, #7b5cff, #a047ff 50%, #7b22ff 64%, #25c8ff, #20d7ff);
    background-size:320% 100%;
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
    animation:gradientFlow 8s ease-in-out infinite alternate
}
@keyframes gradientFlow {
  0% {
  background-position:0% center
}
to {
  background-position:100% center
}
}
.lead {
  max-width:620px;
    color:var(--muted);
    font-size:clamp(1rem, 1.8vw, 1.18rem);
    overflow-wrap:break-word
}
.lead strong {
  color:#fff
}
.bio-stage {
  position:relative;
    max-width:920px;
    margin:0 auto 18px;
    padding:10px 0 18px;
    isolation:isolate
}
.bio-stage:before {
  content:"";
    position:absolute;
    top:8%;
    right:-9%;
    bottom:2%;
    left:-9%;
    z-index:-1;
    pointer-events:none;
    background:radial-gradient(circle at 18% 24%, rgba(127, 0, 255, .36), transparent 30%), radial-gradient(circle at 82% 24%, rgba(0, 209, 255, .22), transparent 32%), radial-gradient(circle at 54% 91%, rgba(255, 77, 0, .2), transparent 34%);
    filter:blur(34px);
    opacity:.86
}
.phone-mockup {
  position:relative;
    width:min(100%, 720px);
    max-width:100%;
    margin:0 auto;
    padding:16px;
    border-radius:46px;
    background:#121216;
    border:1px solid var(--border);
    box-shadow:0 16px 40px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.05);
    overflow:hidden
}
.phone-mockup:before {
  content:"";
    position:absolute;
    top:0;
    left:50%;
    width:150px;
    height:26px;
    transform:translate(-50%);
    border-radius:0 0 22px 22px;
    background:#050505;
    border:1px solid rgba(255, 255, 255, .1);
    border-top:0;
    z-index:3
}
.phone-screen {
  position:relative;
    min-height:760px;
    padding:34px 18px 18px;
    border-radius:34px;
    overflow:hidden;
    background:#08080a;
    border:1px solid var(--border);
    box-shadow:inset 0 1px rgba(255, 255, 255, 0.05)
}
.phone-screen:before {
  display: none;
}
.phone-inner {
  position:relative;
    z-index:1;
    min-width:0
}
.mini-brand {
  display:flex;
    justify-content:center;
    margin-bottom:18px;
    color:#ffffffbd;
    font-weight:900;
    letter-spacing:.14em;
    text-transform:uppercase;
    font-size:.78rem
}
.bio-hero {
  display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(170px, .62fr);
    gap:18px;
    align-items:end;
    min-height:390px
}
.bio-copy {
  min-width:0;
    padding-bottom:10px
}
.bio-copy .badge {
  margin-bottom:16px;
    font-size:.64rem;
    letter-spacing:.12em
}
.bio-copy h1 {
  max-width:7.4ch;
    margin:0 0 14px;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:clamp(3rem, 6vw, 4.85rem);
    line-height:.86;
    letter-spacing:-.055em;
    text-transform:uppercase
}
.bio-copy h1 .gradient-text {
  display:block
}
.bio-copy p {
  max-width:32ch;
    color:#ffffffb8;
    font-size:.98rem;
    line-height:1.55
}
.bio-photo {
  align-self:stretch;
    min-width:0;
    display:flex;
    align-items:flex-end;
    justify-content:center
}
.bio-photo img {
  width:min(100%, 230px);
    height:100%;
    max-height:390px;
    object-fit:cover;
    object-position:56% 50%;
    border-radius:28px;
    filter:drop-shadow(0 22px 34px rgba(0, 0, 0, .38));
    -webkit-mask-image:linear-gradient(180deg, #000 72%, transparent 100%);
    mask-image:linear-gradient(180deg, #000 72%, transparent 100%)
}
.quick-actions {
  display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin:16px 0
}
.quick-actions .btn {
  min-height:58px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    padding:0 20px;
    gap:14px
}
.quick-actions .btn i {
  font-size:1.45rem;
    width:28px;
    height:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    margin-top:-1px
}
.quick-actions .btn span {
  display:flex;
    flex-direction:column;
    align-items:flex-start;
    text-align:left;
    line-height:1.25
}
.quick-actions .btn small {
  display:block;
    margin-top:1px;
    color:#ffffffb8;
    font-size:.72rem;
    font-weight:700;
    letter-spacing:0
}
.bio-stats {
  display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    margin:16px 0 18px;
    overflow:hidden;
    border-radius:24px;
    background:var(--glass-strong);
    border:1px solid var(--border);
    box-shadow:0 8px 24px rgba(0, 0, 0, 0.25), inset 0 1px rgba(255, 255, 255, 0.05)
}
.bio-stat {
  min-width:0;
    padding:16px 10px;
    background:transparent;
    text-align:center;
    transition:var(--transition)
}
.bio-stat:not(:last-child) {
  border-right:1px solid rgba(255, 255, 255, .07)
}
.bio-stat:hover {
  background:#ffffff08
}
.bio-stat strong {
  display:block;
    color:#fff;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:clamp(1.2rem, 5vw, 1.6rem);
    line-height:1;
    letter-spacing:-.02em;
    white-space:nowrap
}
.bio-stat span {
  display:block;
    margin-top:5px;
    color:#ffffff85;
    font-weight:800;
    font-size:.58rem;
    line-height:1.3;
    letter-spacing:.06em;
    text-transform:uppercase
}
.bio-card-grid {
  display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px
}
.bio-card {
  position:relative;
    min-height:214px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:13px;
    overflow:hidden;
    border-radius:24px;
    border:1px solid rgba(255, 255, 255, .12);
    background:#ffffff0e;
    box-shadow:inset 0 1px #ffffff14
}
.bio-card.tall {
  min-height:298px
}
.bio-card img {
  position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    filter:saturate(1.08) contrast(1.05);
    opacity:.86
}
.bio-card:after {
  content:"";
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background:radial-gradient(circle at 72% 18%, rgba(0, 209, 255, .12), transparent 34%), linear-gradient(180deg, #02040b24, #02040b99, #02040bf2)
}
.audio-mini img {
  filter:blur(1.6px) saturate(.92) brightness(.58) contrast(1.08);
    transform:scale(1.04);
    opacity:.78
}
.audio-mini:after {
  background:radial-gradient(circle at 18% 18%, rgba(0, 209, 255, .16), transparent 34%), linear-gradient(90deg, #02040beb, #02040bad 48%, #02040bd6)
}
.bio-card-content {
  position:relative;
    z-index:1
}
.bio-card-content strong {
  display:block;
    color:#fff;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:1rem;
    line-height:1.05;
    text-transform:uppercase
}
.bio-card-content p {
  margin-top:6px;
    color:#ffffffb8;
    font-size:.74rem;
    line-height:1.35
}
.mini-pill {
  width:fit-content;
    margin-top:10px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 11px;
    border-radius:999px;
    color:var(--cyano);
    font-size:.72rem;
    font-weight:900;
    text-transform:uppercase;
    background:#00d1ff17;
    border:1px solid rgba(0, 209, 255, .18)
}
.audio-mini {
  min-height:132px;
    background:linear-gradient(135deg, #7f00ff38, #00d1ff14), #ffffff0b
}
.audio-mini audio {
  width:100%;
    height:36px;
    margin-top:10px;
    filter:invert(1) hue-rotate(160deg) saturate(1.2);
    opacity:.72
}
.premium-strip {
  display:grid;
    grid-template-columns:auto 1fr auto;
    gap:12px;
    align-items:center;
    margin-top:12px;
    padding:14px;
    border-radius:22px;
    border:1px solid rgba(255, 255, 255, .12);
    background:#ffffff0e
}
.premium-strip i {
  color:var(--gold);
    font-size:1.55rem
}
.premium-strip strong {
  display:block;
    color:#fff;
    line-height:1.1
}
.premium-strip p {
  color:var(--muted);
    font-size:.78rem
}
.premium-strip span {
  color:#ffad3d;
    font-weight:900;
    font-size:.75rem;
    text-transform:uppercase;
    text-align:right
}
.phone-footer-link {
  margin-top:12px;
    min-height:50px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:0 16px;
    border-radius:999px;
    color:#ffffffd1;
    background:#ffffff0e;
    border:1px solid rgba(255, 255, 255, .11)
}
.float-social {
  position:absolute;
    z-index:4;
    width:64px;
    height:64px;
    display:grid;
    place-items:center;
    border-radius:22px;
    color:#fff;
    font-size:1.9rem;
    border:1px solid rgba(255, 255, 255, .22);
    box-shadow:0 22px 44px #0000006b;
    transition:transform .5s cubic-bezier(.16, 1, .3, 1), box-shadow .5s cubic-bezier(.16, 1, .3, 1), border-color .5s cubic-bezier(.16, 1, .3, 1);
    transform:rotate(-9deg)
}
.float-social.whats {
  left:-18px;
    top:95px;
    background:linear-gradient(145deg, #31e87c, #0d8d51);
    box-shadow:0 22px 44px #0000006b, 0 0 #25d36600
}
.float-social.whats:hover {
  transform:scale(1.1) rotate(5deg) translateY(-5px);
    border-color:#25d366cc;
    box-shadow:0 26px 54px #0000007a, 0 0 28px #25d36699
}
.float-social.ig {
  left:-22px;
    top:280px;
    background:linear-gradient(145deg, #ff7a18, #e026b8 52%, #5b4dff);
    transform:rotate(11deg);
    box-shadow:0 22px 44px #0000006b, 0 0 #e026b800
}
.float-social.ig:hover {
  transform:scale(1.1) rotate(-3deg) translateY(-5px);
    border-color:#e026b8cc;
    box-shadow:0 26px 54px #0000007a, 0 0 28px #e026b899
}
.float-social.yt {
  right:-22px;
    top:210px;
    background:linear-gradient(145deg, #ff4b4b, #7f1010);
    transform:rotate(10deg);
    box-shadow:0 22px 44px #0000006b, 0 0 #ff4b4b00
}
.float-social.yt:hover {
  transform:scale(1.1) rotate(-5deg) translateY(-5px);
    border-color:#ff4b4bcc;
    box-shadow:0 26px 54px #0000007a, 0 0 28px #ff4b4b99
}
.float-social.wave {
  right:-18px;
    top:610px;
    background:linear-gradient(145deg, #6b5cff, #00d1ff);
    transform:rotate(-7deg);
    box-shadow:0 22px 44px #0000006b, 0 0 #00d1ff00
}
.float-social.wave:hover {
  transform:scale(1.1) rotate(5deg) translateY(-5px);
    border-color:#00d1ffcc;
    box-shadow:0 26px 54px #0000007a, 0 0 28px #00d1ff99
}
.hero-cta {
  display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin:26px 0 22px
}
.btn {
  min-height:54px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    border-radius:999px;
    padding:0 18px;
    font-weight:900;
    letter-spacing:-.02em;
    border:1px solid rgba(255, 255, 255, .12);
    transition:var(--transition);
    position:relative;
    overflow:hidden
}
.btn:after {
  content:"";
    position:absolute;
    top:0;
    left:-150%;
    width:120%;
    height:100%;
    background:linear-gradient(90deg, transparent, rgba(255, 255, 255, .18), transparent);
    transform:skew(-25deg);
    transition:left .75s ease
}
.btn-primary {
  background:linear-gradient(135deg, var(--roxo), var(--cyano));
    color:#fff;
    box-shadow:0 18px 40px #00d1ff2e
}
.btn-dark {
  background:#fff1;
    color:#ffffffe6
}
.btn-whatsapp {
  background:linear-gradient(135deg, #128c7e, var(--green))
}
.btn:hover {
  transform:translateY(-3px);
    border-color:#ffffff38;
    box-shadow:0 22px 46px #00000057
}
.btn:hover:after {
  left:150%
}
.stats {
  display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px
}
.stat {
  min-height:104px;
    padding:16px;
    border-radius:20px;
    border:1px solid rgba(255, 255, 255, .09);
    background:#ffffff0b
}
.stat strong {
  display:block;
    color:#fff;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:clamp(1.24rem, 3vw, 2.1rem);
    line-height:1
}
.stat span {
  display:block;
    margin-top:8px;
    color:var(--faint);
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase
}
.portrait-panel {
  min-height:560px;
    padding:18px;
    display:flex;
    align-items:stretch
}
.portrait {
  position:relative;
    width:100%;
    min-height:100%;
    border-radius:24px;
    overflow:hidden;
    background:#080811
}
.portrait img {
  width:100%;
    height:100%;
    min-height:524px;
    object-fit:cover;
    object-position:center top;
    filter:saturate(1.05) contrast(1.04)
}
.portrait:after {
  content:"";
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background:linear-gradient(180deg, transparent 28%, rgba(5, 5, 5, .18) 62%, rgba(5, 5, 5, .88));
    pointer-events:none
}
.floating-card {
  position:absolute;
    left:18px;
    right:18px;
    bottom:18px;
    display:grid;
    grid-template-columns:1fr auto;
    gap:14px;
    align-items:center;
    padding:16px;
    border-radius:22px;
    background:#050505;
    border:1px solid var(--border);
    z-index:2
}
.floating-card small {
  display:block;
    color:var(--faint);
    font-size:.68rem;
    font-weight:900;
    letter-spacing:.14em;
    text-transform:uppercase
}
.floating-card strong {
  display:block;
    margin-top:4px;
    color:#fff;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:1.02rem
}
.floating-card .queue {
  margin-top:6px;
    color:#ffffffad;
    font-size:.78rem;
    font-weight:800;
    letter-spacing:-.01em
}
.floating-card .queue b {
  color:var(--cyano);
    font-weight:900
}
.pulse {
  width:54px;
    height:54px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg, var(--roxo), var(--cyano));
    box-shadow:0 0 #00d1ff99;
    animation:pulse 2.2s infinite
}
@keyframes pulse {
  0% {
  box-shadow:0 0 #00d1ff6b
}
70% {
  box-shadow:0 0 0 16px #00d1ff00
}
to {
  box-shadow:0 0 #00d1ff00
}
}
.section {
  width:min(100%, 720px);
    margin:14px auto 0;
    padding:clamp(22px, 3vw, 34px);
    border-radius:34px
}
.section-head {
  display:block;
    margin-bottom:18px
}
.kicker {
  color:var(--roxo-soft);
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.18em;
    text-transform:uppercase
}
.section h2 {
  margin-top:4px;
    color:#fff;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:clamp(1.5rem, 4vw, 2.6rem);
    line-height:1.05;
    letter-spacing:-.055em
}
.section-copy {
  margin-top:10px;
    color:var(--muted);
    max-width:52ch
}
.link-grid {
  display:grid;
    grid-template-columns:minmax(0, 1fr);
    gap:12px;
    max-width:100%
}
.link-card {
  display:grid;
    grid-template-columns:auto 1fr auto;
    gap:14px;
    align-items:center;
    min-height:92px;
    padding:16px;
    border-radius:22px;
    background:#ffffff0b;
    border:1px solid rgba(255, 255, 255, .085);
    transition:var(--transition)
}
.link-card:hover {
  transform:translateY(-3px);
    background:#ffffff13;
    border-color:#00d1ff40
}
.link-card.primary {
  background:linear-gradient(135deg, #7f00ff85, #00d1ff3d);
    border-color:#00d1ff57
}
.icon {
  width:48px;
    height:48px;
    border-radius:16px;
    display:grid;
    place-items:center;
    background:#ffffff14;
    color:#fff;
    font-size:1.18rem
}
.icon.whats {
  color:var(--green)
}
.icon.yt {
  color:#ff3030
}
.icon.ig {
  color:#ff66c4
}
.icon.sc {
  color:#f70
}
.icon.web {
  color:var(--cyano)
}
.icon.feedback {
  color:var(--gold)
}
.link-title {
  display:block;
    color:#fff;
    font-weight:900;
    letter-spacing:-.02em
}
.link-sub {
  display:block;
    margin-top:2px;
    color:var(--muted);
    font-size:.86rem;
    line-height:1.35
}
.arrow {
  color:var(--faint)
}
.audio-grid {
  display:grid;
    grid-template-columns:minmax(0, 1fr);
    gap:12px
}
.audio-card {
  position:relative;
    padding:18px;
    border-radius:24px;
    background:radial-gradient(circle at 84% 0%, rgba(0, 209, 255, .1), transparent 32%), linear-gradient(135deg, #ffffff12, #ffffff08);
    border:1px solid rgba(255, 255, 255, .105);
    overflow:hidden;
    box-shadow:inset 0 1px #ffffff14
}
.audio-top {
  display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:14px
}
.audio-title {
  color:#fff;
    font-weight:900
}
.audio-desc {
  color:var(--muted);
    font-size:.88rem
}
.audio-card>audio, .custom-player audio {
  display:none
}
.custom-player {
  display:grid;
    grid-template-columns:auto auto minmax(0, 1fr) auto auto;
    gap:12px;
    align-items:center;
    min-height:48px;
    padding:8px 12px 8px 8px;
    border-radius:999px;
    background:#02070ac2;
    border:1px solid rgba(255, 255, 255, .08);
    box-shadow:inset 0 1px #ffffff0f
}
.player-toggle {
  width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border-radius:50%;
    color:#fff;
    background:linear-gradient(135deg, #7f00ffad, #00d1ff7a);
    box-shadow:0 10px 22px #00d1ff24;
    transition:var(--transition)
}
.player-toggle:hover {
  transform:scale(1.08);
    filter:brightness(1.15);
    box-shadow:0 12px 26px #00d1ff47
}
.player-time, .player-duration {
  color:#fffc;
    font-size:.78rem;
    font-weight:800;
    font-variant-numeric:tabular-nums;
    white-space:nowrap
}
.player-duration {
  color:#ffffff75
}
.player-progress {
  width:100%;
    height:6px;
    accent-color:var(--cyano);
    cursor:pointer
}
.player-progress::-webkit-slider-runnable-track {
  height:6px;
    border-radius:999px;
    background:linear-gradient(90deg, #00d1ffb3, #9d4dff8a)
}
.player-progress::-webkit-slider-thumb {
  width:16px;
    height:16px;
    margin-top:-5px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 0 5px #00d1ff24
}
.player-progress::-moz-range-track {
  height:6px;
    border-radius:999px;
    background:#fff3
}
.player-progress::-moz-range-progress {
  height:6px;
    border-radius:999px;
    background:linear-gradient(90deg, #00d1ffb3, #9d4dff8a)
}
.player-progress::-moz-range-thumb {
  width:16px;
    height:16px;
    border:0;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 0 5px #00d1ff24
}
.player-more {
  color:#ffffffb8;
    font-size:1rem
}
audio {
  width:100%;
    height:44px;
    filter:invert(1) hue-rotate(180deg) saturate(.6)
}
.video-shell {
  display:grid;
    grid-template-columns:1fr;
    gap:14px;
    align-items:stretch;
    min-width:0
}
.video-shell>* {
  min-width:0
}
.video-box {
  position:relative;
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:0;
    border-radius:24px;
    border:1px solid rgba(255, 255, 255, .095);
    background:#05050594;
    aspect-ratio:16 / 9;
    overflow:hidden
}
.video-box iframe {
  position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    min-height:0;
    border:0;
    display:block
}
.video-info {
  min-width:0;
    padding:22px;
    border-radius:24px;
    background:#ffffff0b;
    border:1px solid rgba(255, 255, 255, .085)
}
.video-info strong {
  display:block;
    color:#fff;
    font-family:Tactic Sans Extended, Montserrat, sans-serif;
    font-size:1.38rem;
    line-height:1.08;
    margin-bottom:10px;
    letter-spacing:-.04em
}
.video-info p {
  color:var(--muted)
}
.materials {
  display:grid;
    grid-template-columns:minmax(0, 1fr);
    gap:14px
}
.material {
  min-height:122px;
    display:grid;
    grid-template-columns:auto minmax(0, 1fr) auto;
    gap:16px;
    align-items:center;
    padding:18px 20px;
    border-radius:26px;
    background:var(--glass);
    border:1px solid var(--border);
    transition:var(--transition);
    overflow:hidden;
    position:relative;
    box-shadow:0 12px 24px rgba(0,0,0,0.2), inset 0 1px rgba(255, 255, 255, 0.05)
}
.material:before {
  content:"";
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    opacity:.52;
    pointer-events:none;
    background:linear-gradient(90deg, rgba(255, 255, 255, .03), transparent 18%, transparent 82%, rgba(255, 255, 255, .02)), radial-gradient(circle at 82% 18%, rgba(255, 255, 255, .07), transparent 23%)
}
.material:after {
  content:"";
    position:absolute;
    top:14px;
    right:14px;
    bottom:14px;
    left:14px;
    border-radius:22px;
    pointer-events:none;
    border:1px solid rgba(255, 255, 255, .02)
}
.material.rodeio {
  background:var(--glass);
    border-color:var(--border)
}
.material.rodeio-alt {
  background:var(--glass);
    border-color:var(--border)
}
.material.dj {
  background:var(--glass);
    border-color:var(--border)
}
.material>* {
  position:relative;
    z-index:1
}
.material:hover {
  transform:translateY(-3px)
}
.material.rodeio:hover, .material.rodeio-alt:hover, .material.dj:hover {
  border-color:var(--border-hi);
    background:var(--glass-strong);
    box-shadow:0 12px 32px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .08)
}
.material-visual {
  width:60px;
    height:60px;
    border-radius:50%;
    display:grid;
    place-items:center;
    position:relative;
    background:linear-gradient(135deg, #ffffff14, #ffffff05);
    border:1px solid rgba(255, 255, 255, .14);
    box-shadow:0 8px 24px #0000002e, inset 0 1px #ffffff38, inset 0 -4px 12px #00000026;
    overflow:hidden;
    flex-shrink:0
}
.material-visual:before {
  content:"";
    position:absolute;
    top:2px;
    left:50%;
    width:80%;
    height:40%;
    transform:translate(-50%);
    border-radius:50% 50% 45% 45%;
    background:linear-gradient(180deg, #ffffff59, #fff0);
    pointer-events:none
}
.rodeio .material-visual i {
  color:#ff9d42;
    text-shadow:0 0 12px rgba(255, 157, 66, .45)
}
.rodeio-alt .material-visual i {
  color:#ff5722;
    text-shadow:0 0 12px rgba(255, 87, 34, .45)
}
.dj .material-visual i {
  color:#00d1ff;
    text-shadow:0 0 12px rgba(0, 209, 255, .45)
}
.material strong {
  display:block;
    color:#fff;
    font-weight:900;
    font-size:1.12rem;
    letter-spacing:-.025em;
    text-shadow:0 1px 4px rgba(0, 0, 0, .25)
}
.material p {
  margin-top:8px;
    color:#ffffffd1;
    font-size:.9rem;
    max-width:44ch;
    overflow-wrap:break-word;
    line-height:1.45;
    text-shadow:0 1px 3px rgba(0, 0, 0, .25)
}
.material-action {
  display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:42px;
    padding:0 14px;
    border-radius:999px;
    background:#ffffff13;
    border:1px solid rgba(255, 255, 255, .12);
    color:#fff;
    font-weight:900;
    font-size:.76rem;
    text-transform:uppercase;
    letter-spacing:.06em;
    white-space:nowrap;
    box-shadow:inset 0 1px #ffffff14
}
.email-strip {
  display:grid;
    grid-template-columns:1fr auto;
    gap:14px;
    align-items:center;
    width:min(100%, 720px);
    padding:18px;
    margin:14px auto 0;
    min-width:0;
    border-radius:34px
}
.email-strip p {
  color:var(--muted)
}
.email-strip>div {
  min-width:0
}
.email-copy {
  max-width:100%;
    min-width:0;
    min-height:48px;
    border-radius:999px;
    padding:0 16px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:#fff;
    font-weight:900;
    line-height:1.2;
    text-align:left;
    white-space:nowrap;
    overflow-wrap:normal;
    background:#ffffff12;
    border:1px solid rgba(255, 255, 255, .12);
    transition:var(--transition);
    position:relative;
    overflow:hidden
}
.email-copy:after {
  content:"";
    position:absolute;
    top:0;
    left:-150%;
    width:120%;
    height:100%;
    background:linear-gradient(90deg, transparent, rgba(255, 255, 255, .14), transparent);
    transform:skew(-25deg);
    transition:left .75s ease
}
.email-copy i {
  flex:0 0 auto
}
.email-copy:hover {
  background:#ffffff1a;
    border-color:#00d1ff59;
    transform:translateY(-2px);
    box-shadow:0 12px 28px #00d1ff14
}
.email-copy:hover:after {
  left:150%
}
footer {
  padding:24px 0 8px;
    text-align:center;
    color:var(--faint);
    font-size:.84rem
}
.reveal {
  opacity:0;
    transform:translateY(18px);
    transition:opacity .7s ease, transform .7s cubic-bezier(.16, 1, .3, 1)
}
.reveal.visible {
  opacity:1;
    transform:translateY(0)
}
.btn:active, .link-card:active, .material:active, .icon-btn:active {
  transform:scale(.975) translate3d(0, 0, 0);
    filter:brightness(.92);
    transition:transform .1s cubic-bezier(.16, 1, .3, 1)
}
@media(max-width:900px) {
  .page {
  padding:14px
}
.bio-stage {
  padding-top:4px
}
.phone-mockup {
  width:min(100%, 560px)
}
.float-social {
  width:52px;
    height:52px;
    border-radius:18px;
    font-size:1.45rem
}
.float-social.whats, .float-social.ig {
  left:-6px
}
.float-social.yt, .float-social.wave {
  right:-6px
}
.hero {
  grid-template-columns:1fr
}
.hero-panel, .portrait-panel {
  min-height:auto
}
.portrait img {
  min-height:440px
}
.video-shell, .materials {
  grid-template-columns:1fr
}
}
@media(max-width:640px) {
  html, body {
  width:100%;
    max-width:100%;
    overflow-x:hidden
}

.page {
  padding:8px 6px 10px;
    width:100%;
    max-width:100vw;
    overflow-x:hidden
}
.topbar {
  display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    width:calc(100vw - 76px);
    max-width:calc(100vw - 76px);
    position:static;
    gap:10px;
    padding:9px;
    border-radius:22px;
    margin-bottom:10px;
    overflow:hidden
}
.brand {
  min-width:0
}
.brand strong {
  max-width:128px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.brand span {
  display:none
}
.top-actions {
  flex-shrink:0;
    gap:6px
}
.top-actions .icon-btn:nth-child(2) {
  display:none
}
.icon-btn {
  width:34px;
    height:34px;
    font-size:.88rem
}
.hero {
  gap:10px
}
.bio-stage {
  margin-bottom:10px;
    width:min(100%, calc(100vw - 12px));
    max-width:calc(100vw - 12px);
    overflow:hidden
}
.phone-mockup {
  width:min(100%, calc(100vw - 12px));
    max-width:calc(100vw - 12px);
    min-width:0;
    padding:0;
    border:none;
    background:none;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    border-radius:0
}
.phone-mockup:before {
  display:none
}
.phone-screen {
  width:min(100%, calc(100vw - 12px));
    min-height:auto;
    padding:22px 16px 16px;
    border-radius:24px;
    max-width:calc(100vw - 12px);
    min-width:0;
    overflow:hidden;
    background:#08080a;
    border:1px solid var(--border);
    box-shadow:var(--shadow), inset 0 1px rgba(255, 255, 255, 0.05)
}
.phone-inner {
  width:100%;
    min-width:0;
    margin:0 auto;
    overflow:visible
}
.mini-brand {
  margin-bottom:12px;
    font-size:.68rem
}
.bio-hero {
  grid-template-columns:1fr;
    gap:12px;
    min-height:auto;
    overflow:hidden;
    width:100%;
    max-width:100%
}
.bio-copy {
  display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    padding-bottom:10px;
    width:100%;
    max-width:100%;
    min-width:0
}
.bio-photo {
  order:-1;
    align-items:stretch
}
.bio-copy .badge {
  margin-bottom:13px;
    max-width:210px;
    white-space:normal
}
.bio-copy h1 {
  max-width:8.2ch;
    width:auto;
    font-size:clamp(2rem, 9vw, 2.45rem);
    letter-spacing:-.035em;
    line-height:.98;
    overflow-wrap:normal;
    word-break:normal
}
.bio-copy p {
  font-size:.86rem;
    line-height:1.48
}
.bio-photo img {
  width:100%;
    height:clamp(160px, 45vw, 220px);
    max-height:220px;
    border-radius:22px;
    object-position:56% 34%
}
.quick-actions {
  margin:12px 0;
    width:100%;
    overflow:visible
}
.quick-actions .btn {
  width:100%;
    max-width:100%;
    min-width:0;
    min-height:56px;
    border-radius:20px;
    padding:0 16px;
    gap:12px
}
.quick-actions .btn i {
  font-size:1.32rem;
    width:24px;
    height:24px
}
.bio-stats {
  grid-template-columns:repeat(2, minmax(0, 1fr));
    width:min(100%, 320px);
    max-width:calc(100vw - 70px);
    margin:12px auto 14px;
    border-radius:20px;
    overflow:hidden
}
.bio-stat:last-child {
  grid-column:1 / -1
}
.bio-stat {
  padding:12px 5px
}
.bio-stat strong {
  font-size:clamp(1.08rem, 5vw, 1.38rem);
    letter-spacing:-.04em
}
.bio-stat span {
  font-size:.48rem
}
.bio-card-grid {
  gap:9px;
    min-width:0;
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr))
}
.bio-card {
  min-height:220px;
    padding:11px;
    border-radius:20px;
    min-width:0
}
.bio-card.tall {
  min-height:244px
}
.bio-card.audio-mini {
  grid-column:span 2
}
.bio-card-content strong {
  font-size:clamp(.78rem, 3.7vw, .88rem);
    overflow-wrap:break-word
}
.bio-card-content p {
  font-size:clamp(.62rem, 3vw, .68rem);
    overflow-wrap:break-word
}
.audio-mini {
  min-height:126px
}
.audio-mini audio {
  max-width:100%;
    min-width:0
}
.premium-strip {
  grid-template-columns:auto 1fr;
    min-width:0
}
.premium-strip p {
  overflow-wrap:anywhere
}
.premium-strip span {
  grid-column:2;
    text-align:left
}
.phone-footer-link {
  max-width:100%;
    min-width:0;
    overflow:hidden
}
.phone-footer-link span {
  min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.float-social {
  display:none
}
.hero:before {
  top:18px;
    right:-4%;
    bottom:-24px;
    left:-4%;
    filter:blur(34px);
    opacity:.52
}
.hero-panel, .section {
  border-radius:26px;
    padding:20px
}
.hero-panel:after {
  left:-34%;
    right:-34%;
    bottom:-18%;
    height:220px;
    filter:blur(54px);
    opacity:.42
}
.badge {
  max-width:100%;
    padding:7px 10px;
    font-size:.62rem;
    letter-spacing:.13em
}
.hero h1 {
  max-width:100%;
    margin:18px 0 14px;
    font-size:3.35rem;
    line-height:.9;
    letter-spacing:-.035em;
    overflow-wrap:normal
}
.lead {
  max-width:100%;
    font-size:1rem;
    line-height:1.65
}
.hero-cta, .stats, .link-grid, .audio-grid, .email-strip {
  grid-template-columns:1fr
}
.hero-cta {
  display:grid
}
.btn {
  width:100%;
    min-height:52px
}
.section-head {
  display:block
}
.section-copy {
  margin-top:8px
}
.link-card {
  min-height:86px;
    grid-template-columns:auto 1fr
}
.arrow {
  display:none
}
.portrait img {
  min-height:380px
}
.floating-card {
  grid-template-columns:1fr auto
}
.materials {
  gap:10px
}
.material {
  grid-template-columns:auto 1fr;
    gap:14px 16px;
    min-height:auto;
    padding:18px
}
.material-copy {
  grid-column:2
}
.material-action {
  grid-column:1 / -1;
    width:100%;
    justify-content:center;
    margin-top:4px;
    justify-self:stretch
}
.custom-player {
  grid-template-columns:auto auto minmax(0, 1fr) auto
}
.player-more {
  display:none
}
.email-copy {
  justify-content:center;
    width:100%;
    padding:14px;
    border-radius:24px;
    font-size:clamp(.73rem, 3.35vw, .94rem)
}
}
@media(max-width:430px) {
  .hero-panel, .section {
  padding:17px
}
.bio-hero {
  grid-template-columns:1fr;
    gap:12px;
    min-height:auto
}
.bio-photo {
  order:-1;
    align-items:stretch
}
.bio-photo img {
  width:100%;
    object-position:56% 34%
}
.bio-copy h1 {
  max-width:8.2ch;
    font-size:2.28rem;
    letter-spacing:-.035em
}
.bio-stats {
  grid-template-columns:repeat(2, minmax(0, 1fr))
}
.bio-stat:last-child {
  grid-column:1 / -1
}
.bio-card {
  min-height:174px
}
.bio-card.tall {
  min-height:226px
}
.bio-card-grid {
  grid-template-columns:1fr
}
.bio-card, .bio-card.tall {
  min-height:220px
}
.bio-card.audio-mini {
  grid-column:span 1
}
.mini-pill {
  padding:7px 9px;
    font-size:.65rem
}
.hero h1 {
  font-size:3rem;
    letter-spacing:-.03em
}
.stats {
  gap:8px
}
.stat {
  min-height:92px;
    padding:14px
}
.portrait img {
  min-height:330px
}
.video-shell {
  gap:12px
}
.video-box {
  border-radius:20px
}
.video-info {
  padding:18px;
    border-radius:20px
}
.video-info strong {
  font-size:clamp(1.35rem, 8vw, 2rem);
    line-height:1.05
}
}
@media(max-width:380px) {
  .page {
  padding:8px
}
.topbar, .bio-stage {
  width:100%;
    max-width:100%
}
.brand-logo {
  width:38px;
    height:38px
}
.brand strong {
  max-width:112px;
    font-size:.84rem
}
.top-actions {
  gap:5px
}
.icon-btn {
  width:32px;
    height:32px;
    font-size:.82rem
}
.phone-screen {
  padding-left:10px;
    padding-right:10px
}
.bio-hero {
  grid-template-columns:1fr
}
.bio-copy h1 {
  font-size:2.18rem
}
.bio-copy p {
  font-size:.8rem
}
.bio-photo img {
  width:100%
}
.bio-stat span {
  font-size:.56rem
}
.bio-card-grid {
  grid-template-columns:1fr
}
.bio-card, .bio-card.tall {
  min-height:210px
}
.hero-panel, .section {
  padding:15px
}
.hero h1 {
  font-size:2.66rem
}
.email-strip {
  padding:15px
}
.email-copy {
  gap:8px;
    padding:13px 12px;
    font-size:clamp(.68rem, 3.45vw, .82rem)
}
}
.topbar {
  display:none!important
}
@media(max-width:900px) {
  .aurora span {
  display: none;
}
.glass, .topbar, .hero-panel, .section, .link-card, .material, .email-strip {
  backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important
}
.hero:before, .hero-panel:after, .bio-stage:before, .section:before, .phone-mockup:before {
  display: none;
}
.reveal {
  transition:opacity .28s ease, transform .28s ease
}
}
@media(hover:none) {
  .glass:before, .link-card:before, .material:before, .email-copy:after {
  display:none
}
}
@media(prefers-reduced-motion:reduce) {
  *, *:before, *:after {
  animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important
}
}