@font-face{font-family:"Big Shoulders Display";src:url("/fonts/bigshoulders-latin-ext.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Big Shoulders Display";src:url("/fonts/bigshoulders-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:Asap;src:url("/fonts/asap-latin-ext.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:Asap;src:url("/fonts/asap-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root{
  --ink:#120308;--cinnabar:#e01420;--gold:#ffd24a;--amber:#ffb000;--jade:#1ec87a;--ivory:#fff4d8;--bronze:#c48428;--cream:#ffe9b8;--line:#3a1a14;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0;background:var(--ink);color:var(--ivory);font-family:Asap,system-ui,sans-serif;font-weight:450;}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--ivory)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* ===== header ===== */
.fxa-head{position:relative;z-index:40;display:flex;align-items:center;gap:14px;min-height:68px;padding:6px 18px 6px 12px;background:linear-gradient(180deg,rgba(10,2,4,.94),rgba(18,3,8,.88));border-bottom:1px solid rgba(255,210,74,.35);}
.fxa-brand{display:flex;align-items:center;gap:10px;color:var(--gold);flex-shrink:0}
.fxa-brand img{width:58px;height:58px;border-radius:50%;box-shadow:0 0 0 2px #ffd24a,0 0 16px rgba(255,210,74,.4)}
.fxa-word{font-family:"Big Shoulders Display",sans-serif;font-weight:900;font-size:52px;line-height:1;letter-spacing:.04em;color:var(--gold);text-shadow:0 2px 0 #3a0a08,0 0 18px rgba(255,210,74,.35)}
.fxa-nav{display:flex;align-items:center;gap:8px;margin-left:8px;flex-wrap:wrap}
.fxa-nav a{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,210,74,.4);background:rgba(40,8,8,.55);color:var(--ivory);font-weight:700;font-size:14px}
.fxa-nav a:hover,.fxa-nav a.is-here{background:var(--cinnabar);border-color:#ffd24a;color:#fff}
.fxa-nav svg{width:16px;height:16px;fill:currentColor}
.fxa-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 22px;border-radius:999px;background:linear-gradient(180deg,#ff2a32,#b10c16);color:#fff8e8!important;font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:22px;letter-spacing:.04em;border:2px solid var(--gold);box-shadow:0 4px 0 #5a060a,0 0 18px rgba(224,20,32,.45);text-shadow:0 1px 0 #5a060a}
.fxa-cta:hover{filter:brightness(1.08);color:#fff!important}
.fxa-head .fxa-cta{margin-left:auto;height:44px;font-size:20px}
.fxa-burger{display:none;margin-left:auto;width:42px;height:42px;border:1px solid var(--gold);border-radius:10px;background:#2a0808;color:var(--gold);font-size:22px}

/* ticker */
.fxa-tick{height:28px;overflow:hidden;background:#1a0508;border-bottom:1px solid rgba(255,210,74,.25);color:var(--gold);font-family:"Big Shoulders Display",sans-serif;font-weight:700;font-size:15px;letter-spacing:.12em;display:flex;align-items:center}
.fxa-tick-run{display:flex;gap:48px;white-space:nowrap;animation:fxa-marq 36s linear infinite;padding-left:100%}
@keyframes fxa-marq{to{transform:translateX(-100%)}}

/* ===== home playfield 1280x800 ===== */
.fxa-wrap{max-width:1280px;margin:0 auto;position:relative}
.fxa-stage{
  position:relative;width:1280px;height:800px;margin:0 auto;overflow:hidden;
  background:var(--ink) url("/img/trena-rtp-hero.webp") no-repeat left top / 1280px 800px;
}
.fxa-stage .fxa-head{position:absolute;left:0;right:0;top:0}
.fxa-stage .fxa-tick{position:absolute;left:0;right:0;top:68px}

/* tiles clipped onto the tape */
.fxa-tile{position:absolute;width:150px;z-index:8;display:block;color:inherit;filter:drop-shadow(0 6px 10px rgba(0,0,0,.55))}
.fxa-tile img{width:150px;height:150px;object-fit:cover;border-radius:10px;border:3px solid #ffd24a;box-shadow:inset 0 0 0 1px #7a4a10}
.fxa-plaque{display:block;margin-top:-6px;background:linear-gradient(180deg,#2a0a0c,#120306);color:var(--ivory);font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:16px;line-height:1.15;letter-spacing:.03em;text-align:center;padding:6px 6px 7px;border:2px solid #ffd24a;border-radius:0 0 10px 10px}
.fxa-badge{position:absolute;top:22px;left:-6px;z-index:2;font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:13px;letter-spacing:.06em;padding:3px 8px;border-radius:6px;color:#fff;border:1px solid #fff4d8}
.fxa-badge--hot{background:#e01420}
.fxa-badge--novo{background:#0a8a48}
.fxa-clip{position:absolute;top:-18px;left:50%;transform:translateX(-50%);width:28px;height:28px;z-index:3;background:
  radial-gradient(circle at 50% 40%, #ffe9a0 0 28%, #c48428 29% 70%, #7a4a10 71%);
  border-radius:6px 6px 8px 8px;box-shadow:0 2px 0 #3a1a08;
}
.fxa-clip:after{content:"";position:absolute;left:8px;top:-8px;width:12px;height:16px;border:3px solid #ffd24a;border-bottom:none;border-radius:8px 8px 0 0;background:transparent}

/* irregular clip positions — top row above the tape, bottom row on the desk */
.fxa-t1{left:200px;top:118px}
.fxa-t2{left:368px;top:110px}
.fxa-t3{left:532px;top:116px}
.fxa-t4{left:692px;top:112px}
.fxa-t5{left:196px;top:592px}
.fxa-t6{left:360px;top:586px}
.fxa-t7{left:524px;top:590px}
.fxa-t8{left:684px;top:582px}

/* H1 + CTA sitting on the tape face */
.fxa-hero-type{position:absolute;left:190px;top:348px;width:640px;z-index:12;text-align:center;pointer-events:none}
.fxa-hero-type h1{margin:0;font-family:"Big Shoulders Display",sans-serif;font-weight:900;font-size:86px;line-height:.92;letter-spacing:.02em;
  color:#ffd24a;
  text-shadow:
    -3px -3px 0 #1a0406, 3px -3px 0 #1a0406, -3px 3px 0 #1a0406, 3px 3px 0 #1a0406,
    -3px 0 0 #1a0406, 3px 0 0 #1a0406, 0 -3px 0 #1a0406, 0 3px 0 #1a0406,
    0 4px 0 #3a0a08, 0 0 16px rgba(255,210,74,.4);
}
.fxa-hero-type .fxa-cta{pointer-events:auto;margin-top:8px;height:44px;font-size:26px;padding:0 28px}

/* promo medallions at the left hook / silk */
.fxa-promo{position:absolute;z-index:9;width:92px;text-align:center;color:var(--ivory);display:block;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
.fxa-promo img{width:92px;height:92px;border-radius:50%;border:3px solid var(--gold)}
.fxa-promo strong{display:block;margin-top:4px;font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:15px;line-height:1.15;color:var(--gold);text-shadow:0 2px 4px #000}
.fxa-p1{left:16px;top:508px}
.fxa-p2{left:20px;top:612px}
.fxa-p3{left:14px;top:688px}

/* below-fold */
.fxa-rest{background:linear-gradient(180deg,#1a070a,#120308 40%);padding:48px 24px 24px;max-width:1280px;margin:0 auto}
.fxa-sec{margin:0 auto 48px;max-width:1080px}
.fxa-sec h2{font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:42px;color:var(--gold);margin:0 0 12px;letter-spacing:.03em}
.fxa-sec p,.fxa-prose p{font-size:18px;line-height:1.65;color:#f3e6c8;margin:0 0 14px}
.fxa-sec ul,.fxa-prose ul{margin:0 0 14px;padding-left:1.2em;color:#f3e6c8;font-size:18px;line-height:1.6}
.fxa-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.fxa-card{background:#1c080c;border:1px solid rgba(255,210,74,.3);border-radius:14px;padding:14px;color:inherit}
.fxa-card h3{font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:24px;color:var(--gold);margin:10px 0 6px}
.fxa-rank{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.fxa-rank li{list-style:none;background:#1c080c;border:1px solid rgba(255,210,74,.25);border-radius:12px;padding:12px 14px;display:flex;justify-content:space-between;gap:10px;align-items:center}
.fxa-rank{margin:0;padding:0}
.fxa-faqs details{background:#1c080c;border:1px solid rgba(255,210,74,.25);border-radius:12px;padding:12px 16px;margin:0 0 10px}
.fxa-faqs summary{font-weight:700;color:var(--gold);cursor:pointer;font-size:18px}
.fxa-foot{border-top:1px solid rgba(255,210,74,.25);padding:28px 24px 40px;text-align:center;color:#d8c4a0;font-size:15px;max-width:1280px;margin:0 auto}
.fxa-foot a{margin:0 8px}
.fxa-note{font-size:14px;color:#c9b08a;margin-top:8px}
.fxa-crumb{font-size:14px;color:#c9b08a;margin:8px 0 16px}
.fxa-prose{max-width:800px;margin:0 auto;padding:24px 20px 48px}
.fxa-prose h1{font-family:"Big Shoulders Display",sans-serif;font-weight:900;font-size:52px;color:var(--gold);line-height:1.05;margin:0 0 12px}
.fxa-prose h2{font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:32px;color:var(--gold);margin:28px 0 10px}
.fxa-heroimg{width:100%;max-width:1200px;margin:0 auto 20px;border-radius:16px;border:2px solid rgba(255,210,74,.4)}
.fxa-pagehead{padding-top:0}

/* reviews hub */
.fxa-busca{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:16px 0 20px}
.fxa-busca input{flex:1;min-width:220px;height:44px;border-radius:10px;border:1px solid var(--gold);background:#1a070a;color:var(--ivory);padding:0 14px;font:inherit}
.fxa-slips{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.fxa-slip{background:#1c080c;border:1px solid rgba(255,210,74,.28);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px}
.fxa-slip.is-hide{display:none}
.fxa-slip-top{display:flex;align-items:center;gap:10px}
.fxa-platlogo{width:56px;height:56px;object-fit:contain;background:#0c0304;border-radius:10px;border:1px solid rgba(255,210,74,.3);padding:4px}
.fxa-badge-txt{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:10px;background:#2a0c10;border:1px solid var(--gold);font-family:"Big Shoulders Display",sans-serif;font-weight:800;color:var(--gold);font-size:14px;text-align:center;line-height:1.1}
.fxa-ind{font-size:12px;color:#c9b08a;letter-spacing:.04em;text-transform:uppercase}
.fxa-grp{display:inline-block;font-size:12px;padding:2px 8px;border-radius:999px;border:1px solid rgba(255,210,74,.4);color:var(--gold)}
.fxa-more{display:block;margin:24px auto;height:48px;padding:0 24px;border-radius:999px;border:2px solid var(--gold);background:#2a0a0c;color:var(--gold);font-family:"Big Shoulders Display",sans-serif;font-weight:800;font-size:20px;cursor:pointer}
.fxa-revhero{display:grid;grid-template-columns:160px 1fr;gap:18px;align-items:center;margin:0 0 20px}
.fxa-revhero img.fxa-mainlogo{width:160px;height:160px;object-fit:contain;background:#0c0304;border-radius:16px;border:2px solid var(--gold);padding:8px}

@media (max-width:1279px) and (min-width:760px){
  .fxa-home-scale{--s:calc(100vw / 1280);height:calc(800px * var(--s));overflow:hidden}
  .fxa-stage{transform:scale(var(--s));transform-origin:top left}
}
@media (max-width:759px){
  .fxa-word{font-size:36px}
  .fxa-brand img{width:46px;height:46px}
  .fxa-burger{display:block}
  .fxa-head{flex-wrap:wrap}
  .fxa-head .fxa-cta{width:100%;margin:8px 0 0}
  .fxa-nav{display:none;flex-direction:column;width:100%;align-items:stretch}
  .fxa-nav.is-open{display:flex}
  .fxa-stage{width:100%;height:auto;min-height:0;background:#120308 url("/img/trena-rtp-hero.webp") no-repeat center 0 / 180% auto;padding:0 0 24px;display:block}
  .fxa-stage .fxa-head{position:relative;width:100%}
  .fxa-stage .fxa-tick{position:relative;top:auto;width:100%}
  .fxa-hero-type{position:relative;left:auto;top:auto;width:100%;padding:18px 8px 12px}
  .fxa-hero-type h1{font-size:48px;text-shadow:-2px -2px 0 #1a0406,2px -2px 0 #1a0406,-2px 2px 0 #1a0406,2px 2px 0 #1a0406,0 3px 0 #3a0a08}
  .fxa-tile{position:relative;left:auto!important;top:auto!important;display:inline-block;vertical-align:top;width:46%;margin:10px 2%}
  .fxa-tile img{width:100%;height:auto;aspect-ratio:1}
  .fxa-promo{position:relative;left:auto!important;top:auto!important;display:inline-block;margin:10px;width:88px}
  .fxa-grid,.fxa-rank{grid-template-columns:1fr}
  .fxa-revhero{grid-template-columns:1fr}
  .fxa-prose h1{font-size:36px}
}
