/* topxcasino-online.com — layout editorial: secoes claras e escuras alternadas, rotulo de dia a esquerda */
:root{
  --cf-bg:#090F1E;
  --cf-sf:#111A2B;
  --cf-ac:#FF2400;
  --cf-acd:#C81D00;
  --cf-ink:#0E1626;
  --cf-mute:rgba(255,255,255,.74);
  --cf-line:rgba(255,255,255,.16);
  --cf-hf:Rubik,"Segoe UI",system-ui,sans-serif;
  --cf-bf:"Nunito Sans","Segoe UI",system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:16px;-webkit-text-size-adjust:100%}
body.cf{margin:0;background:var(--cf-bg);color:#fff;font:400 17px/1.65 var(--cf-bf);overflow-wrap:break-word}
body.cf img{max-width:100%;height:auto;display:block}
body.cf a{color:inherit}
body.cf h1,body.cf h2,body.cf h3{font-family:var(--cf-hf)}

/* ---------- cabecalho ---------- */
body.cf .shell{max-width:1120px;margin:0 auto;padding:0 20px}
body.cf .top{background:var(--cf-bg);border-bottom:1px solid var(--cf-line)}
body.cf .top-in{display:flex;align-items:center;gap:26px;min-height:72px}
body.cf .top-in>a:first-child{display:flex;align-items:center;flex:none}
body.cf .top nav{display:flex;flex:1;gap:4px;justify-content:center;flex-wrap:wrap}
body.cf .top nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;font:500 15px/1 var(--cf-hf);text-decoration:none;color:var(--cf-mute);border-bottom:2px solid transparent}
body.cf .top nav a:hover,body.cf .top nav a:focus-visible{color:#fff;border-bottom-color:var(--cf-ac)}
body.cf .btn,body.cf .cf-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;background:var(--cf-ac);color:#fff;font:700 16px/1.1 var(--cf-hf);text-decoration:none;border-radius:6px;box-shadow:0 5px 0 #8F1400;transition:transform .12s,box-shadow .12s}
body.cf .btn:hover,body.cf .cf-btn:hover,body.cf .btn:focus-visible,body.cf .cf-btn:focus-visible{transform:translateY(2px);box-shadow:0 3px 0 #8F1400}
body.cf .cf-btn{min-height:54px;padding:0 30px;font-size:18px}
body.cf .cf-btn::after{content:"\2192";font-weight:600}

/* ---------- hero ---------- */
.cf-hero{background:radial-gradient(70% 90% at 0% 0%,rgba(255,36,0,.22),transparent 70%),var(--cf-bg);position:relative}
.cf-hero-in{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);align-items:stretch;min-height:480px}
.cf-hero-tx{padding:64px 40px 52px max(20px,calc((100vw - 1120px)/2));max-width:100%}
.cf-kicker{display:flex;align-items:center;gap:12px;margin:0 0 18px;font:600 13px/1.3 var(--cf-hf);letter-spacing:.14em;text-transform:uppercase;color:#FF6B4D}
.cf-kicker::before{content:"";width:34px;height:3px;background:var(--cf-ac);flex:none}
.cf-hero h1{font-weight:800;font-size:clamp(32px,4.4vw,54px);line-height:1.08;letter-spacing:-.01em;margin:0 0 22px}
.cf-lead{font-size:19px;line-height:1.6;color:rgba(255,255,255,.88);margin:0 0 28px;max-width:40em}
.cf-cta{margin:28px 0 0}
.cf-hero .cf-cta{margin-top:0}
.cf-ad{margin:14px 0 0;font:600 12.5px/1.4 var(--cf-bf);letter-spacing:.02em;color:rgba(255,255,255,.62)}
.cf-main .cf-ad{margin:18px 0 0}
.cf-l .cf-ad{color:rgba(14,22,38,.62)}
.cf-date{margin:22px 0 0;font:600 14px/1.4 var(--cf-bf);color:var(--cf-mute)}
.cf-hero-fig{margin:0;position:relative;min-height:320px;overflow:hidden}
body.cf .cf-hero-fig img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cf-hero-fig::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--cf-bg) 0%,rgba(9,15,30,.55) 22%,rgba(9,15,30,0) 55%)}
.cf-hero-pg .cf-hero-in{min-height:400px}
.cf-hero-pg .cf-hero-tx{padding-top:52px;padding-bottom:48px}
.cf-hero-pg h1{font-size:clamp(30px,3.7vw,46px)}
body.cf .cf-fig-tall img{object-fit:contain;object-position:50% 100%;padding-top:16px}
.cf-fig-tall{background:radial-gradient(circle at 50% 60%,rgba(255,36,0,.35),transparent 62%)}
.cf-fig-tall::after,.cf-fig-small::after{display:none}
.cf-fig-small{background:radial-gradient(circle at 50% 50%,rgba(255,36,0,.28),transparent 64%)}
body.cf .cf-fig-small img{object-fit:contain;padding:44px}
.cf-hero-plain .cf-hero-in{grid-template-columns:1fr;min-height:0}
.cf-hero-plain .cf-hero-tx{padding-bottom:44px}

/* faixa dos dias */
.cf-week{max-width:1120px;margin:0 auto;padding:0 20px 44px;display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.cf-week a{display:flex;align-items:center;justify-content:center;min-height:48px;border:1px solid var(--cf-line);border-radius:4px;text-decoration:none;background:rgba(255,255,255,.03)}
.cf-week b{font:700 13px/1 var(--cf-hf);letter-spacing:.08em;text-transform:uppercase}
.cf-week a:hover,.cf-week a:focus-visible{background:var(--cf-ac);border-color:var(--cf-ac)}

/* ---------- secoes ---------- */
.cf-sec{padding:76px 0}
.cf-d{background:var(--cf-sf);color:#fff}
.cf-l{background:#fff;color:var(--cf-ink)}
.cf-wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.cf-row{display:grid;grid-template-columns:176px minmax(0,1fr);gap:44px;align-items:start}
.cf-day{position:sticky;top:24px;display:flex;flex-direction:column;gap:2px;font:800 clamp(34px,4vw,52px)/.95 var(--cf-hf);text-transform:uppercase;letter-spacing:-.02em}
.cf-day span{display:block;color:transparent;-webkit-text-stroke:2px var(--cf-ac)}
.cf-l .cf-day span{-webkit-text-stroke-color:var(--cf-acd)}
.cf-main{max-width:700px;min-width:0}
.cf-day span{overflow-wrap:normal;word-break:keep-all}
.cf-main h2{font-weight:700;font-size:clamp(25px,3vw,35px);line-height:1.18;letter-spacing:-.01em;margin:0 0 20px}
.cf-main h2+p{margin-top:0}
.cf-main p{margin:0 0 1.15em}
.cf-main p:last-child{margin-bottom:0}
.cf-main h2:not(:first-child){margin-top:1.7em}
.cf-main a{text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:var(--cf-ac)}
.cf-l .cf-main a:not(.cf-btn){color:var(--cf-acd);font-weight:700}
.cf-d .cf-main a:not(.cf-btn){font-weight:700}
.cf-main b{font-weight:700}
.cf-main .cf-cta{margin-top:32px}

/* listas */
.cf-list{list-style:none;margin:0 0 1.2em;padding:0}
.cf-list li{position:relative;padding:0 0 0 30px;margin:0 0 .9em}
.cf-list li::before{content:"";position:absolute;left:4px;top:.62em;width:10px;height:10px;background:var(--cf-ac);transform:rotate(45deg)}
.cf-steps{list-style:none;margin:0 0 1.2em;padding:0;counter-reset:cfs}
.cf-steps li{counter-increment:cfs;position:relative;padding:0 0 0 54px;margin:0 0 1em;min-height:38px}
.cf-steps li::before{content:counter(cfs);position:absolute;left:0;top:-2px;width:38px;height:38px;border-radius:50%;background:var(--cf-ac);color:#fff;font:700 18px/38px var(--cf-hf);text-align:center}
.cf-duo{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:26px 0}
.cf-duo>div{background:#F2F4F8;border-top:4px solid var(--cf-ac);padding:20px 22px 12px}
.cf-duo>div+div{background:#fff;border:1px solid rgba(14,22,38,.18);border-top:4px solid var(--cf-ink)}
.cf-duo h3{font-weight:700;font-size:18px;line-height:1.25;margin:0 0 12px}
.cf-duo ul{list-style:none;margin:0;padding:0}
.cf-duo li{position:relative;padding:0 0 0 22px;margin:0 0 .75em;font-size:16px;line-height:1.5}
.cf-duo li::before{content:"";position:absolute;left:2px;top:.5em;width:8px;height:8px;background:var(--cf-ac);transform:rotate(45deg)}

/* citacao */
.cf-quote{margin:1.8em 0;padding:4px 0 4px 26px;border-left:6px solid var(--cf-ac)}
.cf-quote p{margin:0!important;font:500 clamp(21px,2.5vw,29px)/1.32 var(--cf-hf);letter-spacing:-.005em}

/* mensagens */
.cf-msgs{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 1.4em}
.cf-msg{border:1px solid rgba(14,22,38,.2);border-left:5px solid var(--cf-ac);padding:16px 18px;background:#F7F8FB}
.cf-msg b{display:block;font:700 13px/1.3 var(--cf-hf);letter-spacing:.1em;text-transform:uppercase;color:var(--cf-acd);margin-bottom:6px}
.cf-msg p{margin:0!important;font-size:16px;line-height:1.55}

/* faq */
.cf-faq{border-top:1px solid var(--cf-line)}
.cf-l .cf-faq{border-top-color:rgba(14,22,38,.2)}
.cf-faq details{border-bottom:1px solid var(--cf-line)}
.cf-l .cf-faq details{border-bottom-color:rgba(14,22,38,.2)}
.cf-faq summary{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:60px;padding:12px 0;cursor:pointer;list-style:none}
.cf-faq summary::-webkit-details-marker{display:none}
.cf-faq summary h3{margin:0;font-weight:600;font-size:18px;line-height:1.3}
.cf-faq summary i{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cf-ac);color:#fff;font:600 22px/1 var(--cf-hf);font-style:normal;transition:transform .18s}
.cf-faq details[open] summary i{transform:rotate(45deg)}
.cf-faq details p{margin:0 0 18px!important;max-width:38em;font-size:17px}

/* fechamento */
.cf-close{background:var(--cf-acd);color:#fff;padding:60px 0}
.cf-close-in{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:48px;align-items:center}
body.cf .cf-close img{width:100%;max-width:320px;height:auto;border-radius:4px}
.cf-close h2{font-weight:800;font-size:clamp(26px,3.2vw,38px);line-height:1.15;margin:0 0 14px}
.cf-close p{margin:0 0 6px;font-size:18px;max-width:34em}
.cf-close a:not(.cf-btn){font-weight:700;text-decoration-thickness:2px;text-underline-offset:3px}
.cf-close .cf-btn{background:#fff;color:var(--cf-acd);box-shadow:0 5px 0 rgba(0,0,0,.3)}
.cf-close .cf-btn:hover,.cf-close .cf-btn:focus-visible{box-shadow:0 3px 0 rgba(0,0,0,.3)}
.cf-close .cf-ad{color:rgba(255,255,255,.88)}

/* mais neste guia */
.cf-more{background:var(--cf-bg);padding:44px 0 50px}
.cf-more h2{font-weight:700;font-size:20px;margin:0 0 16px;color:var(--cf-mute)}
.cf-more ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.cf-more a{display:inline-flex;align-items:center;min-height:46px;padding:0 20px;border:1px solid var(--cf-line);border-radius:999px;text-decoration:none;font:600 15px/1 var(--cf-hf)}
.cf-more a:hover,.cf-more a:focus-visible{border-color:var(--cf-ac);background:rgba(255,36,0,.14)}

/* rodape */
body.cf .foot{background:var(--cf-bg);border-top:3px solid var(--cf-ac);padding:40px 0 48px;color:var(--cf-mute)}
body.cf .foot-top{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;margin-bottom:22px;padding-bottom:22px;border-bottom:1px solid var(--cf-line)}
body.cf .foot-top nav{display:flex;flex-wrap:wrap;gap:2px 6px;justify-content:flex-end}
body.cf .foot-top nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;font:500 15px/1 var(--cf-hf);text-decoration:none;color:#fff}
body.cf .foot-top nav a:hover,body.cf .foot-top nav a:focus-visible{text-decoration:underline;text-decoration-color:var(--cf-ac);text-underline-offset:5px}
body.cf .foot p{margin:0 0 10px;font-size:14.5px;line-height:1.6;max-width:820px}
body.cf .foot p:last-child{margin-bottom:0}

/* ---------- tablet e celular ---------- */
@media (max-width:960px){
  body.cf .top-in{flex-wrap:wrap;gap:6px 14px;padding-top:10px;padding-bottom:10px}
  body.cf .top nav{order:3;flex:0 0 100%;justify-content:flex-start;gap:0}
  body.cf .top nav a{padding:0 11px}
  .cf-hero-in{grid-template-columns:1fr;min-height:0}
  .cf-hero-tx{padding:40px 20px 30px}
  .cf-hero-pg .cf-hero-tx{padding-top:36px}
  .cf-hero-fig{min-height:0;aspect-ratio:16/9;max-height:360px}
  body.cf .cf-hero-fig img{position:absolute}
  .cf-hero-fig::after{background:linear-gradient(180deg,var(--cf-bg) 0%,rgba(9,15,30,0) 40%)}
  .cf-fig-tall{aspect-ratio:4/3}
  .cf-fig-small{aspect-ratio:2/1}
  body.cf .cf-fig-small img{padding:18px}
  .cf-sec{padding:52px 0}
  .cf-row{grid-template-columns:1fr;gap:18px}
  .cf-day{position:static;flex-direction:row;flex-wrap:wrap;gap:8px;font-size:13px;line-height:1}
  .cf-day span{-webkit-text-stroke:0;color:var(--cf-ac);border:1.5px solid var(--cf-ac);padding:6px 11px;border-radius:3px;letter-spacing:.1em}
  .cf-l .cf-day span{color:var(--cf-acd);border-color:var(--cf-acd)}
  .cf-duo,.cf-msgs{grid-template-columns:1fr}
  .cf-close{padding:44px 0}
  .cf-close-in{grid-template-columns:1fr;gap:24px}
  body.cf .cf-close img{max-width:240px}
  body.cf .foot-top{flex-direction:column}
  body.cf .foot-top nav{justify-content:flex-start}
}
@media (max-width:520px){
  body.cf{font-size:17px}
  body.cf .top-in{min-height:0}
  body.cf .top-in>a:first-child img{width:80px;height:auto}
  body.cf .top .btn{margin-left:auto;padding:0 18px;font-size:15px}
  body.cf .top nav a{font-size:14px;padding:0 8px}
  .cf-lead{font-size:18px}
  .cf-cta .cf-btn{width:100%}
  .cf-week{gap:4px;padding:18px 16px 32px}
  .cf-week b{font-size:12px;letter-spacing:.04em}
  .cf-wrap{padding:0 16px}
  body.cf .shell{padding:0 16px}
  .cf-hero-tx{padding-left:16px;padding-right:16px}
  .cf-faq summary h3{font-size:17px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}body.cf .btn,body.cf .cf-btn,.cf-faq summary i{transition:none}}