@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root { --navy:#071b35; --sky:#47c5ff; --ink:#112d44; }
* { box-sizing:border-box; }
html { min-width:280px; scroll-behavior:smooth; }
body { margin:0; background:#071b35; color:#fff; font-family:'DM Sans',Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; }
.skip-link { position:absolute; z-index:10; left:12px; top:-80px; padding:12px; background:#fff; color:var(--navy); }
.skip-link:focus { top:12px; }
a:focus-visible { outline:3px solid var(--sky); outline-offset:4px; }
.page { min-height:100svh; background:radial-gradient(circle at 50% 0,#0b436c 0,#071b35 38%); }
.page-inner { width:min(100%,780px); margin:0 auto; overflow:hidden; background:var(--navy); box-shadow:0 0 90px #0003; }
.masthead { height:76px; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:0 clamp(20px,6vw,48px); border-bottom:1px solid #ffffff24; }
.masthead img { display:block; width:139px; height:auto; }
.masthead>span { color:#9bc4dc; font-size:9px; font-weight:700; letter-spacing:.2em; white-space:nowrap; }
.masthead>span span { margin-left:7px; color:var(--sky); }
.hero { position:relative; min-height:590px; overflow:hidden; background:#092947 url('assets/banner-padel-poster.webp') center 42%/cover no-repeat; }
.hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 42%; }
.hero::before { content:''; position:absolute; z-index:1; inset:0; background:linear-gradient(90deg,#061b33ed 0%,#062d50c9 43%,#071b3552 100%),linear-gradient(0deg,#061b3380,transparent 33%); pointer-events:none; }
.hero-copy { position:relative; z-index:2; width:57%; padding:85px 0 100px clamp(20px,6vw,48px); }
.eyebrow { margin:0 0 19px; color:#75ceff; font-size:10px; font-weight:700; letter-spacing:.19em; }
h1 { margin:0; font-family:Arial,sans-serif; font-size:clamp(52px,7.5vw,79px); font-weight:800; line-height:.96; letter-spacing:-.045em; white-space:nowrap; }
h1 em { color:var(--sky); font-style:normal; }
h2 em { color:var(--sky); font-weight:400; font-style:italic; }
.hero-copy>p:not(.eyebrow) { max-width:315px; margin:23px 0 0; color:#d5e5ef; font-family:Georgia,'Times New Roman',serif; font-size:16px; line-height:1.55; }
.hero-foot { position:absolute; z-index:2; left:clamp(20px,6vw,48px); right:clamp(20px,6vw,48px); bottom:22px; display:flex; justify-content:space-between; color:#b6d5e7; font-size:9px; font-weight:700; letter-spacing:.16em; }
.section { padding:58px clamp(20px,6vw,48px); }.section-head { margin-bottom:25px; }.section-head .eyebrow { margin-bottom:10px; }
h2 { margin:0; font-family:Georgia,'Times New Roman',serif; font-size:clamp(39px,6vw,60px); font-weight:700; line-height:1.03; letter-spacing:-.055em; }
.buy-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.buy-card { position:relative; isolation:isolate; min-width:0; min-height:264px; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; padding:20px; border:1px solid #ffffff2b; border-radius:26px; color:#fff; background:#09243d; box-shadow:0 18px 34px #0003; transition:transform .25s,box-shadow .25s; }
.buy-card:hover,.product-card:hover { transform:translateY(-4px); }.buy-card:hover { box-shadow:0 24px 42px #0006; }
.buy-photo { position:absolute; z-index:-2; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; transition:transform .5s; }.buy-card:hover .buy-photo { transform:scale(1.05); }
.buy-card::before { content:''; position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,#061b3370 0%,#061b3300 28%,#061b33e8 100%); }
.buy-card.mercadolibre::before { background:linear-gradient(180deg,#061b335c 0%,#061b3350 35%,#061b33e8 78%,#061b33f7 100%); }
.buy-card.shopify .buy-photo { object-position:43% center; }.buy-card.mercadolibre .buy-photo { object-position:50% center; }
.buy-top { align-self:flex-start; padding:8px 11px; border:1px solid #ffffff80; border-radius:999px; background:#051c33a3; font-size:9px; font-weight:800; letter-spacing:.13em; }
.buy-copy { display:block; max-width:calc(100% - 38px); margin-top:auto; }.buy-card strong { display:block; font:800 clamp(32px,4.5vw,45px)/.91 'DM Sans',Arial,sans-serif; letter-spacing:-.055em; text-shadow:0 2px 12px #0008; }.buy-bottom { display:block; margin-top:9px; color:#e0edf5; font:italic 13px/1.3 Georgia,'Times New Roman',serif; }
.buy-logo { position:absolute; right:18px; bottom:18px; display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:#fff; box-shadow:0 4px 14px #0005; }
.buy-logo img { display:block; width:26px; height:26px; object-fit:contain; }.shopify .buy-logo { background:#95bf47; }.shopify .buy-logo img { filter:invert(1); }.mercadolibre .buy-logo img { width:40px; height:40px; }
.products-section { padding-top:50px; background:linear-gradient(145deg,#f2f7fa,#e4eef5); color:var(--ink); }.products-section .eyebrow,.products-section h2 em { color:#0073bd; }
.product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
.product-card { min-width:0; display:flex; flex-direction:column; overflow:hidden; padding:0 0 16px; border:1px solid #dce8ef; border-radius:25px; background:#fff; box-shadow:0 14px 30px #183d5915; transition:transform .25s,box-shadow .25s; }.product-card:hover { box-shadow:0 22px 38px #183d5929; }
.product-media { position:relative; isolation:isolate; height:207px; display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:0 0 34px 34px; }.product-media::before { content:''; position:absolute; z-index:-1; left:12%; right:12%; top:17%; bottom:7%; border-radius:50%; filter:blur(8px); opacity:.7; }
.product-media.whey { background:linear-gradient(145deg,#d5e8f3,#ecf6fa); }.product-media.whey::before { background:#a8d6ed; }.product-media.creatina { background:linear-gradient(145deg,#f3e5e5,#f9f2f0); }.product-media.creatina::before { background:#e8cecf; }.product-media.colageno { background:linear-gradient(145deg,#e4e7f1,#f1eff8); }.product-media.colageno::before { background:#d3d5ea; }
.product-media img { display:block; width:100%; height:100%; object-fit:contain; transition:transform .35s; }.product-card:hover .product-media img { transform:scale(1.05); }.product-media.whey img { width:114%; max-width:none; }
.product-meta { align-self:flex-start; margin:16px 15px 10px; padding:7px 10px; border-radius:999px; background:#e8f3fa; color:#276382; font-size:9px; font-weight:800; letter-spacing:.1em; }.product-card strong { margin:0 15px 17px; font-family:'DM Sans',Arial,sans-serif; font-size:23px; font-weight:800; line-height:1.03; letter-spacing:-.045em; }
.product-action { display:flex; justify-content:space-between; align-items:center; gap:5px; margin:auto 14px 0; padding:11px 12px; border-radius:999px; background:#0b4771; color:#fff; font-size:9px; font-weight:800; letter-spacing:.07em; }.product-action span { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; background:#7bd2ff; color:#073551; font-size:17px; font-weight:400; }
.ugc-section { overflow:hidden; padding-right:0; background:#e4edf3; color:var(--ink); }
.ugc-section .section-head { padding-right:clamp(20px,6vw,48px); }
.ugc-section .eyebrow,.ugc-section h2 em { color:#0073bd; }
.ugc-intro { max-width:430px; margin:15px 0 0; color:#48677d; font-size:13px; line-height:1.7; }
.ugc-sound:focus-visible { outline:3px solid #0073bd; outline-offset:3px; }
.ugc-viewport { overflow:hidden; touch-action:pan-y; }.ugc-track { display:flex; gap:12px; width:max-content; will-change:transform; }.ugc-card { flex:0 0 212px; width:212px; overflow:hidden; border-radius:18px; background:#113755; box-shadow:0 10px 22px #0b2c4540; }.ugc-media { position:relative; aspect-ratio:9/13; overflow:hidden; border-radius:inherit; background:#113755; }.ugc-media video { display:block; width:100%; height:100%; object-fit:cover; }.ugc-sound { position:absolute; z-index:1; right:10px; bottom:10px; min-height:32px; padding:0 11px; border:1px solid #ffffffa8; border-radius:999px; background:#071b35db; color:#fff; font:700 9px 'DM Sans',Arial,sans-serif; letter-spacing:.1em; cursor:pointer; }.ugc-card:not(.is-active) .ugc-sound { display:none; }.ugc-fallback { display:block; padding:24px; background:#fff; color:#005b93; text-decoration:underline; }
.ugc-more { display:inline-flex; align-items:center; gap:18px; margin:24px clamp(20px,6vw,48px) 0 0; padding-bottom:6px; border-bottom:1px solid #0073bd; color:#005b93; font-size:10px; font-weight:700; letter-spacing:.08em; }.ugc-more span { font-size:17px; }
.social-section { padding-block:65px; background:#092644; }.social-icons { display:flex; align-items:center; justify-content:center; gap:clamp(14px,5vw,50px); }.social-icons a { display:grid; place-items:center; width:90px; height:90px; border-radius:20px; transition:transform .2s,background .2s; }.social-icons a:hover { transform:translateY(-4px) scale(1.06); background:#ffffff0e; }.social-icons img { display:block; width:60px; height:60px; object-fit:contain; }.social-icons a:first-child img { filter:drop-shadow(-2px 1px 0 #25f4ee) drop-shadow(2px -1px 0 #fe2c55); }.social-icons a:nth-child(3) img { width:70px; height:70px; }
.footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:28px clamp(20px,6vw,48px); border-top:1px solid #ffffff24; }.footer img { width:125px; height:auto; }.footer span { color:#88acc6; font-size:9px; font-weight:700; letter-spacing:.18em; }
@media(max-width:620px) { .hero { min-height:0; }.hero::before { background:linear-gradient(180deg,#061b33ed 0%,#062d50d9 42%,#071b3533 100%); }.hero-video { object-position:center 35%; }.hero-copy { width:100%; padding:51px 23px 300px; }h1 { font-size:clamp(55px,12vw,76px); }.hero-copy>p:not(.eyebrow) { max-width:340px; margin:19px 0 0; }.hero-foot { display:none; }.section { padding:44px 20px; }.buy-grid { grid-template-columns:1fr; }.buy-card { min-height:218px; }.buy-card strong { font-size:42px; }.products-section { padding-top:42px; }.product-grid { grid-template-columns:1fr; gap:12px; }.product-card { display:grid; grid-template-columns:42% minmax(0,1fr); grid-template-rows:auto auto 1fr; min-height:185px; padding:0; border-radius:22px; }.product-media { grid-row:1/4; height:100%; min-height:185px; border-radius:0 32px 32px 0; }.product-meta { margin:18px 14px 10px; font-size:8px; }.product-card strong { margin:0 14px 10px; font-size:23px; }.product-action { margin:auto 12px 12px; padding:9px 10px; font-size:8px; } }
@media(max-width:620px) { .product-media img { width:122%; height:122%; max-width:none; }.product-media.whey img { width:138%; } }
@media(max-width:420px) { .masthead { height:66px; padding-inline:18px; }.masthead img { width:120px; }.masthead>span { font-size:8px; letter-spacing:.12em; }.hero-copy { padding-inline:19px; padding-bottom:288px; }h1 { font-size:clamp(35px,10vw,42px); }h2 { font-size:clamp(37px,9vw,46px); }.buy-card { min-height:205px; padding:17px; }.buy-card strong { font-size:39px; }.buy-logo { right:16px; bottom:16px; }.product-card strong { font-size:21px; }.social-section { padding-block:50px; }.social-icons a { width:76px; height:76px; }.social-icons img { width:53px; height:53px; }.social-icons a:nth-child(3) img { width:62px; height:62px; }.footer { padding-inline:20px; } }
@media(max-width:320px) { .buy-card strong { font-size:34px; }.product-card { grid-template-columns:40% minmax(0,1fr); }.product-card strong { font-size:19px; }.product-action { font-size:7px; letter-spacing:0; } }
@media(max-width:620px) { .ugc-section { padding-right:0; }.ugc-section .section-head { padding-right:20px; }.ugc-card { flex-basis: min(60vw,230px); width:min(60vw,230px); } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.buy-card,.buy-photo,.product-card,.product-media img,.social-icons a { transition:none; }.hero-video { display:none; } }