/* Estilos exclusivos da página de jogos. Requer css/sinapses.css da homepage. */
.games-page { overflow-x: hidden; }
.games-hero { position: relative; overflow: hidden; min-height: 730px; display: flex; align-items: center; color: white; background: radial-gradient(circle at 78% 42%, #294d51 0, transparent 36%), linear-gradient(115deg,#0d1928,#14283a 60%,#101c2c); }
.games-hero-grid { position: absolute; inset: 0; opacity: .16; background-image: linear-gradient(#ffffff18 1px,transparent 1px),linear-gradient(90deg,#ffffff18 1px,transparent 1px); background-size: 62px 62px; }
.games-hero-layout { position: relative; display: grid; grid-template-columns: 1.12fr .88fr; align-items: center; gap: 35px; padding-top: 120px; padding-bottom: 90px; }
.games-hero-copy { position: relative; z-index: 2; }
.games-hero h1 { margin: 0; font: 800 clamp(55px,6.6vw,88px)/1.05 var(--font-display); letter-spacing: -.07em; }
.games-hero h1 span { color: var(--green); }
.games-hero-lead { max-width: 570px; font-size: clamp(19px,2vw,24px); font-weight: 600; line-height: 1.5; letter-spacing: -.025em; }
.games-hero-detail { max-width: 565px; margin: 20px 0 28px; color: #c0ccd1; font-size: 14px; line-height: 1.9; }
.games-hero-art { position: relative; min-height: 390px; }
.games-art-window { position: absolute; inset: 30px 12px 22px 18px; border: 1px solid #a7d96e75; border-radius: 12px; background: linear-gradient(150deg,#244354,#172b3c); transform: rotate(3deg); box-shadow: 0 30px 80px #0005; }
.games-art-top { display: flex; gap: 6px; align-items: center; padding: 17px 19px; border-bottom: 1px solid #ffffff20; }
.games-art-top i { width: 7px; height: 7px; border-radius: 50%; background: #ffffff55; }
.games-art-top span { margin-left: auto; color: #ffffff99; font-size: 9px; text-transform: uppercase; letter-spacing: .13em; }
.games-art-title { padding: 38px 20px 22px; text-align: center; font: 800 clamp(32px,4vw,50px)/1.1 var(--font-display); letter-spacing: -.05em; }
.games-art-title em { color: var(--green); font-style: normal; }
.games-art-tiles { display: flex; justify-content: center; gap: 5px; padding: 0 12px; }
.games-art-tiles span { display: grid; place-items: center; width: 39px; height: 44px; border-radius: 4px; color: #1a2d31; background: var(--green); font: 800 19px var(--font-display); }
.games-art-footer { display: flex; justify-content: space-between; align-items: center; margin: 35px 22px 0; padding-top: 15px; border-top: 1px solid #ffffff25; color: #ffffff80; font-size: 9px; letter-spacing: .12em; }
.games-art-footer b { color: var(--green); font-size: 22px; }
.games-float { position: absolute; z-index: 2; padding: 11px 15px; border: 1px solid #ffffff26; border-radius: 5px; color: white; background: #2c4a53; font-size: 11px; box-shadow: 0 12px 35px #0004; }
.games-float-top { right: -10px; top: 5px; }.games-float-bottom { left: -10px; bottom: 5px; }
.games-intro-band { background: var(--green); }
.games-intro-inner { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-block: 26px; }
.games-intro-inner p { margin: 0; color: var(--navy); font: 500 clamp(19px,2.5vw,28px)/1.4 var(--font-display); letter-spacing: -.035em; }
.games-intro-inner strong { font-weight: 800; }.games-intro-inner>span { color: #102c2d66; font-size: 40px; }
.games-section-heading { margin-bottom: 45px; }
.games-section-heading h2, .games-publico h2, .games-contact h2 { font-size: clamp(40px,5vw,62px); }
.games-section-heading h2 span, .games-publico h2 span { color: #729d36; }
.games-benefits { background: var(--paper); }
.games-benefit-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.games-benefit { min-height: 285px; padding: 28px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.games-benefit-number, .game-demo-kicker { color: #77907b; font-size: 10px; font-weight: 700; letter-spacing: .13em; }
.games-benefit-icon { display: grid; place-items: center; width: 53px; height: 53px; margin: 31px 0 22px; border-radius: 12px; color: #5d8831; background: #e8f2da; font-size: 27px; }
.games-benefit h3 { margin: 0 0 12px; color: var(--navy); font: 800 22px var(--font-display); letter-spacing: -.04em; }
.games-benefit p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.85; }
.games-demos { background: #edf1eb; }
.games-section-description { max-width: 680px; margin: 22px 0 0; color: var(--muted); font-size: 15px; line-height: 1.8; }
.game-demo { margin-top: 28px; padding: 30px; border: 1px solid #d9e2d8; border-radius: 9px; background: white; }
.game-demo-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 22px; }
.game-demo h3 { margin: 9px 0 5px; color: var(--navy); font: 800 clamp(29px,3vw,40px) var(--font-display); letter-spacing: -.05em; }
.game-demo-heading p { margin: 0; color: var(--muted); font-size: 14px; }
.game-external { flex-shrink: 0; color: #557d2d; font-size: 12px; font-weight: 700; }
.game-external:hover { text-decoration: underline; }
.game-frame-wrap { overflow: hidden; border: 1px solid #d7e2d3; border-radius: 6px; background: #f8faf6; }
.game-frame-wrap iframe { display: block; width: 100%; height: 680px; border: 0; }
.game-frame-tall iframe { height: 1100px; }
.games-publico { background: white; }
.games-publico-grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: clamp(30px,7vw,100px); }
.games-publico-visual { position: relative; display: grid; place-items: center; min-height: 390px; padding: 35px; border-radius: 9px; background: linear-gradient(145deg,#dce8d6,#eef3e8); }
.games-publico-visual img { max-width: min(100%,330px); max-height: 220px; object-fit: contain; }
.games-publico-tag { position: absolute; top: 22px; left: 24px; color: #6c826c; font-size: 10px; font-weight: 700; letter-spacing: .13em; }
.games-publico-copy>p:not(.eyebrow) { color: var(--muted); font-size: 14px; line-height: 1.8; }
.games-publico-links { margin-top: 25px; border-top: 1px solid var(--line); }
.games-publico-links a { display: flex; justify-content: space-between; align-items: center; padding: 17px 0; border-bottom: 1px solid var(--line); }
.games-publico-links a:hover strong { color: #729d36; }
.games-publico-links strong,.games-publico-links small { display: block; }
.games-publico-links strong { color: var(--navy); font: 800 16px var(--font-display); }
.games-publico-links small { margin-top: 4px; color: var(--muted); font-size: 12px; }
.games-publico-links b { color: #729d36; }
.games-contact { overflow: hidden; color: white; background: #101c2c; }
.games-contact-inner { display: flex; justify-content: space-between; align-items: center; gap: 25px; padding-block: 100px; }
.games-contact h2 span { color: var(--green); }
.games-contact p:not(.eyebrow) { max-width: 480px; margin: 22px 0 27px; color: #c1cbd1; font-size: 15px; line-height: 1.8; }
.games-contact-symbol { display: grid; place-items: center; width: 220px; height: 220px; border: 1px solid #b7e36a55; border-radius: 50%; box-shadow: 0 0 0 40px #b7e36a08,0 0 0 80px #b7e36a05; font: 800 100px var(--font-display); }
.games-contact-symbol span,.games-footer-brand span { color: var(--green); }
.games-footer { color: #aab7be; background: #0b1522; }
.games-footer-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; padding-block: 27px; font-size: 11px; }
.games-footer-brand { color: white; font: 800 21px var(--font-display); }
@media (max-width: 900px) {
 .games-hero-layout { grid-template-columns: 1fr; padding-top: 160px; }
 .games-hero-art { width: min(100%,440px); min-height: 365px; margin-inline: auto; }
 .games-publico-grid { grid-template-columns: 1fr; }
 .games-benefit-grid { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
 .games-hero-layout { padding-top: 145px; padding-bottom: 70px; }
 .games-hero h1 { font-size: clamp(49px,12vw,70px); }
 .games-hero-art { min-height: 310px; }
 .games-art-title { padding-top: 28px; font-size: 33px; }
 .games-art-tiles span { width: 31px; height: 36px; font-size: 15px; }
 .games-art-footer { margin-top: 24px; }
 .games-float { font-size: 9px; }
 .game-demo { padding: 16px; }
 .game-demo-heading { align-items: start; flex-direction: column; gap: 12px; }
 .game-frame-wrap iframe { height: 620px; }
 .game-frame-tall iframe { height: 1100px; }
 .games-publico-visual { min-height: 260px; }
 .games-contact-inner { padding-block: 75px; }
 .games-contact-symbol { display: none; }
 .games-footer-inner { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { .games-page *, .games-page *::before, .games-page *::after { scroll-behavior: auto !important; } }
