:root { color-scheme: light; --pink:#ff007f; --pink-strong:#f9007a; --black:#141216; --muted:#6d6671; --white:#fff; --shadow:0 12px 25px rgba(121,42,77,.10); --font:'Manrope','DM Sans',Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--black); font-family:var(--font); background:#fff6fb; min-width:320px; overflow-x:hidden; }
a { color:inherit; }
button { font:inherit; }
.svg-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.background-swash { position:fixed; z-index:-1; pointer-events:none; filter:blur(1px); border-radius:50%; }
.background-swash--left { top:9%; left:-16%; width:40vw; height:64vh; transform:rotate(-26deg); border:48px solid rgba(255,0,123,.20); border-right-color:transparent; }
.background-swash--right { right:-15%; bottom:-13%; width:48vw; height:75vh; transform:rotate(20deg); background:radial-gradient(ellipse at 60% 65%,#ffb4d7a3 0%,#ff71af52 32%,transparent 70%); }
.landing { width:min(100%, 620px); margin:18px auto 26px; padding:0 24px 20px; background:linear-gradient(160deg,rgba(255,255,255,.98) 10%,#fff9fc 73%,#fff 100%); border-radius:40px; box-shadow:0 14px 78px rgba(113,29,70,.10); isolation:isolate; overflow:hidden; }
.hero { position:relative; height:443px; padding-top:36px; text-align:center; isolation:isolate; }
.brand-logo { width:min(88%,410px); height:auto; max-height:92px; object-fit:contain; display:block; margin:0 auto; position:relative; z-index:4; }
.hero h1 { position:relative; z-index:4; font-size:clamp(24px,4.7vw,31px); font-weight:800; letter-spacing:-1.3px; line-height:1.24; margin:6px auto 6px; max-width:480px; text-wrap:balance; }
.hero h1 span { display:block; color:var(--pink); }
.hero-subtitle { position:relative; z-index:4; font-size:12px; color:#625d65; font-weight:600; margin:8px auto; max-width:450px; line-height:1.6; }
.hero-orbit { position:absolute; right:-105px; bottom:-111px; width:430px; height:345px; background:radial-gradient(circle at 46% 35%,rgba(255,190,222,.7),rgba(255,203,228,.22) 52%,transparent 71%); border-radius:50%; z-index:0; }
.hero-paint { position:absolute; width:105%; height:92px; border-radius:50%; border-top:20px solid rgba(255,91,162,.19); transform:rotate(-23deg); left:-19%; bottom:-80px; z-index:0; }
.hero-athlete { position:absolute; width:201px; height:215px; object-fit:cover; object-position:49% 11%; right:-13px; bottom:-3px; z-index:2; -webkit-mask-image:linear-gradient(to right,transparent 0%,black 22%),linear-gradient(to bottom,transparent 0%,black 10%,black 82%,transparent 100%); -webkit-mask-composite:source-in; mask-image:linear-gradient(to right,transparent 0%,black 22%),linear-gradient(to bottom,transparent 0%,black 10%,black 82%,transparent 100%); mask-composite:intersect; pointer-events:none; }
.mantra { position:absolute; color:var(--pink); font:700 37px/.78 'Caveat',cursive; left:35px; bottom:58px; text-align:center; transform:rotate(-11deg); z-index:3; text-shadow:0 3px 6px rgba(255,255,255,.7); }
.mantra span { display:block; margin:10px 0; }
.mantra-heart { display:block; margin:2px auto 0; transform:rotate(15deg); }
.social-links { display:grid; gap:10px; position:relative; z-index:5; margin-top:-4px; }
.social-card { background:rgba(255,255,255,.97); border:1px solid rgba(247,215,231,.55); border-radius:22px; min-height:78px; padding:12px 18px 12px 18px; display:flex; align-items:center; gap:18px; text-decoration:none; box-shadow:var(--shadow); transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
.social-card:hover,.social-card:focus-visible { transform:translateY(-3px); box-shadow:0 17px 32px rgba(162,21,90,.18); border-color:#ffc8e3; }
.social-card:focus-visible,.main-cta:focus-visible,.reel-tile:focus-visible,.dialog-close:focus-visible { outline:3px solid #fda7d1; outline-offset:3px; }
.social-card--whatsapp { background:linear-gradient(105deg,#ecfff2 0%,#f7fff9 65%,#effff5 100%); min-height:101px; }
.social-icon { flex:0 0 53px; width:53px; height:53px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:white; box-shadow:0 3px 9px rgba(0,0,0,.07); }
.social-icon--web { background:linear-gradient(140deg,#ff3c9f,var(--pink)); }
.social-icon--facebook { background:#1977f3; }
.social-icon--instagram { background:radial-gradient(circle at 25% 102%,#fed672 4%,#fa7e1e 25%,#d62976 54%,#962fbf 76%,#4f5bd5 100%); }
.social-icon--tiktok { background:#0c0c0d; }
.social-icon--whatsapp { background:#16cb5b; }
.social-copy { display:flex; min-width:0; flex:1; flex-direction:column; gap:1px; }
.social-copy strong { font-size:19px; font-weight:800; letter-spacing:-.65px; line-height:1.18; }
.social-detail { color:var(--pink); font-size:14px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.4; letter-spacing:-.25px; }
.social-copy small { font-size:10.8px; line-height:1.4; font-weight:600; color:#666; margin-top:3px; }
.social-arrow { flex:0 0 21px; stroke:none; transition:transform .2s; }
.social-card:hover .social-arrow { transform:translateX(3px); }
.reels { margin-top:30px; }
.section-title { display:flex; align-items:center; gap:20px; }
.section-title h2 { font-size:31px; letter-spacing:-1.4px; margin:0; font-weight:800; line-height:1.2; white-space:nowrap; }
.section-title h2 span { color:var(--pink); }
.section-line { flex:1; height:2px; background:linear-gradient(90deg,var(--pink),rgba(255,0,127,0)); margin-top:8px; }
.reels-intro { font-size:11px; font-weight:600; margin:8px 0 14px; color:#766c76; }
.reel-track { display:flex; gap:10px; width:100%; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:1px; scrollbar-width:none; padding:2px 2px 7px; }
.reel-track::-webkit-scrollbar { display:none; }
.reel-tile { position:relative; isolation:isolate; flex:0 0 calc((100% - 24px)/3); min-width:0; aspect-ratio:200/311; border:0; border-radius:19px; overflow:hidden; display:block; box-shadow:0 5px 15px rgba(52,23,46,.07); scroll-snap-align:start; padding:0; text-decoration:none; color:#fff; background:linear-gradient(145deg,#2e1c30,#df3c8d); }
.reel-tile img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.reel-tile--live { cursor:pointer; }
.reel-tile--live:hover img { transform:scale(1.045); }
.reel-no-cover { display:grid; place-items:center; height:100%; background:radial-gradient(ellipse at 40% 10%,#ff82bc 0,#a80b64 44%,#261425 95%); opacity:.65; }
.reel-tile-shade { position:absolute; inset:0; background:linear-gradient(180deg,transparent 33%,rgba(35,4,26,.13) 60%,rgba(34,7,29,.83) 100%); z-index:1; }
.reel-play { position:absolute; z-index:2; left:50%; top:45%; transform:translate(-50%,-50%); border:2px solid rgba(255,255,255,.93); background:rgba(14,8,14,.28); display:grid; place-items:center; width:48px; height:48px; border-radius:50%; backdrop-filter:blur(2px); }
.reel-play svg { margin-left:2px; }
.reel-tile-caption { position:absolute; z-index:2; bottom:12px; left:9px; right:9px; display:grid; gap:5px; text-align:left; }
.reel-tile-caption em { font:700 22px/.9 'Caveat',cursive; color:#fff; }
.reel-tile-caption b { font-size:10px; font-weight:800; line-height:1.2; word-wrap:break-word; }
.reel-pagination { display:flex; align-items:center; justify-content:center; gap:8px; padding:10px 0 0; }
.reel-pagination span { width:8px; height:8px; border-radius:50%; background:#e1dce0; transition:all .3s; }
.reel-pagination span.active { background:var(--pink); width:10px; height:10px; }
.cta-wrap { margin:23px 0 0; }
.main-cta { display:flex; gap:15px; align-items:center; justify-content:space-between; text-align:center; min-height:74px; padding:14px 22px; color:white; font-size:20px; font-weight:800; letter-spacing:-.6px; text-decoration:none; border-radius:100px; background:linear-gradient(118deg,#fe007d,#ff0082 70%,#f80077); box-shadow:0 13px 26px rgba(252,0,119,.24); transition:transform .2s,box-shadow .2s; }
.main-cta:hover { transform:translateY(-3px); box-shadow:0 17px 28px rgba(252,0,119,.31); }
.main-cta span { flex:1; }
.main-cta svg { flex:none; }
.cta-hint { text-align:center; color:#82727c; font-size:10.5px; margin:15px 10px 0; font-weight:600; }
.cta-hint span,.footer-heart span { color:var(--pink); }
.site-footer { display:flex; justify-content:space-between; gap:10px; margin:30px -5px 0; padding-top:13px; font-size:10px; color:#a295a1; border-top:1px solid #f6e5ee; }
.video-dialog { color:white; position:fixed; padding:12px; width:min(92vw,450px); max-width:450px; max-height:92dvh; border:1px solid rgba(255,255,255,.12); border-radius:22px; background:#16121a; box-shadow:0 30px 80px rgba(0,0,0,.35); overflow:hidden; }
.video-dialog::backdrop { background:rgba(19,8,18,.82); backdrop-filter:blur(8px); }
.dialog-top { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:5px 5px 12px; }
.dialog-top strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:14px; }
.dialog-close { color:#fff; background:rgba(255,255,255,.12); border:0; border-radius:50%; width:34px; height:34px; display:grid; place-items:center; cursor:pointer; }
.video-dialog video { display:block; background:#000; width:100%; max-height:calc(92dvh - 85px); aspect-ratio:9/16; border-radius:12px; }
@media(min-width:760px) {
  .landing { border:1px solid #ffe1ef; }
}
@media(max-width:619px) {
  body { background:#fff; }
  .background-swash { display:none; }
  .landing { margin:0 auto; padding:0 20px 16px; width:100%; box-shadow:none; border-radius:0; }
  .hero { padding-top:22px; height:405px; }
  .brand-logo { width:min(96%,360px); }
  .hero h1 { font-size:26px; margin-top:0; letter-spacing:-1.15px; }
  .hero-subtitle { font-size:11.5px; }
  .hero-athlete { width:190px; height:210px; right:-14px; bottom:-3px; }
  .hero-orbit { width:330px; height:278px; right:-115px; bottom:-76px; }
  .hero-paint { bottom:-72px; }
  .mantra { font-size:34px; left:16px; bottom:46px; }
  .social-card { min-height:69px; border-radius:20px; padding:10px 14px; gap:13px; }
  .social-card--whatsapp { min-height:91px; }
  .social-icon { flex-basis:49px; width:49px; height:49px; }
  .social-icon svg { width:28px; height:28px; }
  .social-copy strong { font-size:17px; }
  .social-detail { font-size:13.5px; }
  .social-arrow { width:18px; height:18px; }
  .reels { margin-top:26px; }
  .section-title h2 { font-size:28px; }
  .main-cta { font-size:17px; min-height:68px; padding:13px 17px; gap:10px; }
}
@media(max-width:370px) {
  .landing { padding-inline:15px; }
  .hero { height:382px; }
  .hero h1 { font-size:23px; }
  .hero-subtitle { font-size:10px; }
  .hero-athlete { width:177px; height:193px; right:-16px; }
  .mantra { font-size:29px; left:10px; bottom:37px; }
  .social-card { gap:10px; padding-inline:11px; }
  .social-copy strong { font-size:16px; }
  .social-detail { font-size:11.7px; }
  .social-copy small { font-size:9.5px; }
  .social-icon { flex-basis:46px; width:46px; height:46px; }
  .main-cta { font-size:15px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; } }