/* Shared public-site layout. Load after page styles and the phpBB child theme. */
:root{--ubb-width:1180px;--ubb-gutter:28px;--ubb-ink:#101010;--ubb-paper:#f7f5ef;--ubb-red:#f20d18;--ubb-yellow:#ffd400}
.site-header,.ubb-header{height:80px;min-height:80px;padding:0 max(var(--ubb-gutter),calc((100% - var(--ubb-width))/2));flex-wrap:nowrap}
.header-logo,.ubb-brand img{display:block;width:92px;height:92px;margin:0;object-fit:contain}
.main-nav,.ubb-nav{gap:8px}
.main-nav a,.ubb-nav a,.ubb-nav a:visited{font:900 14px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.08em;padding:12px 10px;white-space:nowrap}
.main-nav a[aria-current="page"]{border-bottom-color:var(--ubb-red)}
.nav-toggle,.ubb-toggle{min-width:44px;min-height:44px;cursor:pointer}
.site-header a:focus-visible,.nav-toggle:focus-visible{outline:3px solid #0864ad;outline-offset:4px}

/* Matching section introductions; the homepage retains its larger hero. */
.videos-hero,.polls-hero,.games-hero,.rabbit-hero,.building-hero,.contact-hero{padding:44px var(--ubb-gutter);background:repeating-linear-gradient(115deg,transparent 0 70px,#ffffff08 70px 73px),var(--ubb-ink);color:#fff;text-align:center}
.videos-hero::before,.games-hero::before{content:none}
.videos-hero h1,.polls-hero h1,.games-hero h1,.rabbit-hero h1,.building-hero h1,.contact-hero h1{max-width:1050px;margin:12px auto 16px;font-size:clamp(2.25rem,5vw,4rem);line-height:1.05;letter-spacing:-.04em;font-weight:900;text-transform:uppercase}
.videos-hero p,.polls-hero p,.games-hero p,.rabbit-hero p,.building-hero p,.contact-hero p{max-width:700px;margin:0 auto;color:#ddd;font-size:1.05rem;line-height:1.6}
.content-wrap,.videos-wrap,.polls-wrap,.rabbit-wrap,.games-page{max-width:var(--ubb-width);padding:44px var(--ubb-gutter) 52px;margin:0 auto}
.building-wrap,.contact-page{padding:44px var(--ubb-gutter) 52px}
.section-heading,.videos-heading{margin-bottom:26px}
.section-heading h2,.videos-heading h2,.polls-wrap>h2{font-size:clamp(1.7rem,3.2vw,2.6rem);line-height:1.15;margin:8px 0 16px}
.video-tabs,.polls-tabs{gap:10px;margin:24px 0}
.video-mobile-filter{margin-bottom:22px}
.game-grid,.video-grid,.poll-grid,.rabbit-grid{column-gap:24px}
.game-card,.video-card,.poll-card,.rabbit-card,.building-card,.contact-panel,.contact-success{border:3px solid var(--ubb-ink);box-shadow:6px 6px 0 var(--ubb-ink)}
.game-card-body,.video-card-copy,.poll-card,.rabbit-card{padding:24px}
.game-card-body h2{font-size:clamp(1.6rem,2.6vw,2rem)}
.feature-band{margin-bottom:52px;gap:24px}
.feature-card{padding:28px;min-height:240px}
.feature-card h2{font-size:1.9rem}
.games-note{padding:44px 0 0}
.games-note .scribble{color:#b50916}
.games-note h2{font-size:clamp(1.6rem,3vw,2.4rem);max-width:780px;margin:12px auto}

/* One contact invitation style across the public pages and forum. */
.bottom-callout,.ubb-contact{padding:36px var(--ubb-gutter);background:var(--ubb-red);color:white;text-align:center;font:16px/1.6 Arial,Helvetica,sans-serif}
.bottom-callout .scribble,.ubb-contact .ubb-kicker{font-size:18px;line-height:1.4;color:var(--ubb-yellow);margin:0 auto 12px;font-weight:900;transform:none}
.bottom-callout h2,.ubb-contact h2{max-width:980px;margin:0 auto 16px;border:0;color:white;font:900 clamp(1.6rem,3vw,2.5rem)/1.15 Arial,Helvetica,sans-serif;text-transform:uppercase}
.bottom-callout>p:not(.scribble),.ubb-contact>p:not(.ubb-kicker){max-width:700px;margin:0 auto 16px;font-size:16px;line-height:1.6}
.bottom-contact{max-width:700px;margin:16px auto 0}
.bottom-contact p{margin:0 0 18px;font-size:16px;line-height:1.6}
.bottom-contact-button,.ubb-contact a.ubb-contact-button{padding:12px 22px;min-height:48px;line-height:1.4;background:var(--ubb-yellow);color:var(--ubb-ink);border:3px solid var(--ubb-ink);box-shadow:4px 4px 0 var(--ubb-ink);font-size:15px}
.site-footer,.ubb-footer{padding:20px var(--ubb-gutter);background:var(--ubb-ink);color:#bbb;text-align:center;font:14px/1.6 Arial,Helvetica,sans-serif}
.site-footer p,.ubb-footer p{margin:0;font:inherit}
.site-footer .ubb-privacy-links,.ubb-footer .ubb-privacy-links{margin:8px 0 0;gap:18px;font:14px/1.5 Arial,Helvetica,sans-serif}
.site-footer .ubb-privacy-links a,.ubb-footer .ubb-privacy-links a,.ubb-footer .ubb-privacy-links a:visited{color:inherit}
#phpbb .wrap{box-sizing:border-box;width:100%;max-width:var(--ubb-width);margin:28px auto 36px;padding:0 var(--ubb-gutter)}
#phpbb .headerbar{padding:20px}

@media(max-width:1000px){
 .site-header,.ubb-header{height:68px;min-height:68px;padding:0 20px}
 .header-logo,.ubb-brand img{width:78px;height:78px;margin:0}
 .nav-toggle,.ubb-toggle:not([hidden]){display:block}
 .main-nav,.ubb-nav.ubb-collapsible{display:none;position:absolute;top:68px;left:0;right:0;width:100%;padding:14px 20px;flex-direction:column;gap:4px;background:var(--ubb-paper);border-bottom:3px solid var(--ubb-ink);max-height:calc(100dvh - 68px);overflow:auto}
 .main-nav.open,.ubb-nav.ubb-open{display:flex}
 .main-nav a,.ubb-nav a{padding:12px 10px}
}
@media(max-width:900px){
 .hero{min-height:0;padding:32px 20px 28px}
 .hero-art{width:min(260px,calc(100% - 32px));margin:0 auto 22px}
 .hero-copy{padding:0;max-width:580px}
 .hero h1{font-size:clamp(2.3rem,7vw,3.5rem);line-height:1;margin:12px 0 16px}
 .hero-copy>p{font-size:1rem;line-height:1.5;margin:14px 0}
 .bored-button{margin-top:4px;padding:14px 22px;font-size:1.25rem}
 .hero-copy .bored-result{min-height:42px!important;margin:14px 0 0;font-size:.85rem!important}
}
@media(max-width:650px){
 :root{--ubb-gutter:20px}
 .videos-hero,.polls-hero,.games-hero,.rabbit-hero,.building-hero,.contact-hero{padding:32px 20px}
 .videos-hero h1,.polls-hero h1,.games-hero h1,.rabbit-hero h1,.building-hero h1,.contact-hero h1{font-size:2.25rem}
 .content-wrap,.videos-wrap,.polls-wrap,.rabbit-wrap,.games-page,.building-wrap,.contact-page{padding:30px 20px 38px}
 .section-heading,.videos-heading{margin-bottom:22px}
 .section-heading h2,.videos-heading h2,.polls-wrap>h2{font-size:1.7rem}
 .hero-art{width:210px}
 .hero h1{font-size:2.3rem}
 .game-card-body,.video-card-copy,.poll-card,.rabbit-card{padding:20px}
 .feature-band{margin-bottom:38px}
 .feature-card{padding:24px;min-height:0}
 .bottom-callout,.ubb-contact{padding:30px 20px}
 .site-footer,.ubb-footer{padding:18px 20px}
 #phpbb .wrap{padding:0 16px;margin:24px auto 30px}
}