/* Chipê — eventos esportivos (tema marca: ipê #f5c800, fundo #0e0e0e) */

:root {
   --bg: #0e0e0e;
   --bg-card: #151515;
   --border: #222222;
   --border-soft: #2a2a2a;
   --white: #ffffff;
   --muted: #888888;
   --muted-dark: #555555;
   --ipe: #f5c800;
   --ipe-mid: #e6b800;
   --ipe-soft: rgba(245, 200, 0, 0.12);
   --black: #1a1a1a;
}
body {
   font-family: 'Barlow', sans-serif;
   background: var(--bg);
   color: var(--white);
   line-height: 1.65;
   font-size: 1rem;
}
a { color: var(--ipe); }
a:hover { color: #ffe566; }
.top-bar {
   position: sticky; top: 0; z-index: 20;
   background: rgba(14, 14, 14, 0.92);
   backdrop-filter: blur(8px);
   border-bottom: 1px solid var(--border);
}
.top-inner {
   max-width: 1040px;
   margin: 0 auto;
   padding: 14px 24px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 16px;
   flex-wrap: wrap;
}
.back {
   font-family: 'Barlow Condensed', sans-serif;
   font-weight: 600;
   font-size: 0.7rem;
   letter-spacing: 0.2em;
   text-transform: uppercase;
   color: var(--muted);
   text-decoration: none;
}
.back:hover { color: var(--ipe); }
.top-cta {
   font-family: 'Barlow Condensed', sans-serif;
   font-weight: 700;
   font-size: 0.75rem;
   letter-spacing: 0.12em;
   text-transform: uppercase;
   text-decoration: none;
   background: var(--ipe);
   color: var(--black);
   padding: 10px 22px;
   border-radius: 4px;
   transition: transform 0.2s, box-shadow 0.2s;
}
.top-cta:hover {
   color: var(--black);
   transform: translateY(-1px);
   box-shadow: 0 8px 24px rgba(245, 200, 0, 0.25);
}
.hero {
   max-width: 1040px;
   margin: 0 auto;
   padding: 56px 24px 72px;
}
.hero-kicker {
   font-family: 'Barlow Condensed', sans-serif;
   font-size: 0.72rem;
   letter-spacing: 0.28em;
   text-transform: uppercase;
   color: var(--ipe);
   margin-bottom: 16px;
}
.hero h1 {
   font-family: 'Bebas Neue', sans-serif;
   font-size: clamp(2.8rem, 9vw, 4.6rem);
   line-height: 0.98;
   letter-spacing: 0.02em;
   font-weight: 400;
   max-width: 18ch;
   margin-bottom: 20px;
}
.hero h1 em {
   font-style: normal;
   color: var(--ipe);
}
.hero-lede {
   font-size: 1.1rem;
   color: var(--muted);
   max-width: 38rem;
   margin-bottom: 28px;
}
.hero-actions {
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
   align-items: center;
}
.btn {
   display: inline-block;
   font-family: 'Barlow Condensed', sans-serif;
   font-weight: 700;
   font-size: 0.82rem;
   letter-spacing: 0.14em;
   text-transform: uppercase;
   text-decoration: none;
   padding: 14px 26px;
   border-radius: 4px;
   transition: transform 0.2s, background 0.2s, border-color 0.2s;
}
.btn-primary {
   background: var(--ipe);
   color: var(--black);
}
.btn-primary:hover {
   color: var(--black);
   background: #ffe566;
   transform: translateY(-2px);
}
.btn-ghost {
   border: 1px solid var(--border-soft);
   color: var(--white);
   background: transparent;
}
.btn-ghost:hover {
   border-color: var(--ipe);
   color: var(--ipe);
}
section.block {
   max-width: 1040px;
   margin: 0 auto;
   padding: 56px 24px;
   border-top: 1px solid var(--border);
}
.section-label {
   font-family: 'Barlow Condensed', sans-serif;
   font-size: 0.68rem;
   letter-spacing: 0.3em;
   text-transform: uppercase;
   color: var(--muted-dark);
   margin-bottom: 10px;
}
.block h2 {
   font-family: 'Barlow Condensed', sans-serif;
   font-weight: 800;
   font-size: clamp(1.6rem, 4vw, 2.1rem);
   text-transform: uppercase;
   letter-spacing: 0.04em;
   margin-bottom: 20px;
   max-width: 28rem;
}
.block h2 span { color: var(--ipe); }
.block-intro {
   color: var(--muted);
   max-width: 40rem;
   margin-bottom: 32px;
   font-size: 1.02rem;
}
.grid-2 {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 20px;
}
@media (max-width: 720px) {
   .grid-2 { grid-template-columns: 1fr; }
}
.card {
   background: var(--bg-card);
   border: 1px solid var(--border);
   border-radius: 16px;
   padding: 24px 26px;
}
.card h3 {
   font-family: 'Barlow Condensed', sans-serif;
   font-weight: 700;
   font-size: 1rem;
   letter-spacing: 0.08em;
   text-transform: uppercase;
   color: var(--ipe);
   margin-bottom: 10px;
}
.card p {
   color: #b0b0b0;
   font-size: 0.95rem;
   line-height: 1.65;
}
.closing {
   text-align: center;
   padding: 64px 24px 80px;
   border-top: 1px solid var(--border);
   background: linear-gradient(180deg, var(--bg) 0%, #121212 100%);
}
.closing h2 {
   font-family: 'Barlow Condensed', sans-serif;
   font-weight: 800;
   font-size: clamp(1.4rem, 3.5vw, 1.85rem);
   text-transform: uppercase;
   letter-spacing: 0.06em;
   max-width: 26rem;
   margin: 0 auto 16px;
}
.closing p {
   color: var(--muted);
   max-width: 32rem;
   margin: 0 auto 28px;
   font-size: 1rem;
}
.closing .hero-actions { justify-content: center; }