/* Mu Comando — Fortaleza de Cristal Nocturna: responsive rules for the WebEngine template. */

@media (max-width: 1080px) {
	.nav-frame, .global-top-bar-content, .site-hero__inner, .site-shell, .site-footer.footer { width: min(100% - 32px, 960px); }
	#navbar ul li a { padding-right: 12px; padding-left: 12px; }
	.header-info-container { width: min(330px, 39vw); }
	.site-hero h1 { font-size: 44px; }
}

@media (max-width: 820px) {
	body.site-body { background-size: auto 620px; background-attachment: scroll; }
	.nav-frame { grid-template-columns: 32px minmax(0, 1fr); }
	.nav-account { display: none; }
	#navbar ul { justify-content: flex-start; min-height: 60px; }
	#navbar ul li a { padding: 0 10px; font-size: 13px; }
	#header.site-hero, .site-hero__inner { min-height: 580px; }
	.site-hero__inner { padding-top: 52px; }
	.site-brand { max-width: 285px; }
	.site-hero__copy { max-width: 480px; }
	.site-hero h1 { font-size: 39px; }
	.site-hero__lead { font-size: 16px; }
	.header-info-container { right: 0; bottom: 55px; width: min(355px, 54vw); }
	.site-shell { margin-top: -24px; }
	.command-destinations { gap: 9px; }
	.command-destination { min-height: 136px; padding: 14px; }
	.command-destination strong { font-size: 17px; }
	#content.content-frame { padding: 23px 20px 28px; }
	.home-news-block { padding-right: 15px !important; }
	.footer-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 620px) {
	.global-top-bar { min-height: 30px; font-size: 10px; }
	.global-top-bar-content, .nav-frame, .site-hero__inner, .site-shell, .site-footer.footer { width: calc(100% - 24px); }
	.site-utility-links { white-space: nowrap; }
	.webengine-language-switcher:hover, .webengine-language-switcher:focus-within { width: 210px; }
	#navbar { position: relative; }
	.nav-frame { grid-template-columns: 27px minmax(0, 1fr); min-height: 48px; }
	.nav-symbol { width: 24px; }
	.nav-symbol img { width: 23px; height: 23px; }
	#navbar ul { justify-content: flex-start; min-height: 48px; max-height: 96px; overflow: auto; }
	#navbar ul li a { min-height: 48px; padding: 0 9px; font-size: 12px; }
	#header.site-hero, .site-hero__inner { min-height: 637px; }
	#header.site-hero::before { background-position: 61% center; }
	.site-hero__inner { padding-top: 36px; padding-bottom: 48px; }
	.site-brand { max-width: 237px; }
	.site-hero__copy { margin-top: 19px; }
	.site-hero h1 { max-width: 350px; font-size: 31px; }
	.site-hero__lead { max-width: 350px; margin: 16px 0 21px; font-size: 15px; line-height: 1.5; }
	.hero-actions { gap: 9px; }
	.btn-premium, .btn.btn-premium, .btn-ghost { min-height: 40px; padding: 10px 13px; font-size: 13px; }
	.header-info-container { right: auto; bottom: 24px; left: 0; width: 100%; }
	.header-info { padding: 13px; }
	.server-pulse__number-row strong { font-size: 22px; }
	.server-pulse__times { gap: 7px; }
	.site-hero--compact, .site-hero--compact .site-hero__inner { min-height: 350px !important; }
	.site-hero--compact .header-info-container { bottom: 23px; }
	.site-shell { margin-top: -13px; }
	.command-destinations { grid-template-columns: 1fr; gap: 8px; }
	.command-destination { min-height: 108px; }
	.command-destination strong { font-size: 18px; }
	#content.content-frame { padding: 19px 12px 23px; }
	#content.content-frame > .col-xs-12, #content.content-frame > .col-xs-8, #content.content-frame > .col-xs-4 { width: 100%; padding-right: 5px; padding-left: 5px; }
	#content.content-frame > .row > [class*='col-xs-'] { width: 100%; }
	.usercp-sidebar { padding-top: 15px !important; padding-left: 5px !important; }
	.home-news-block { padding-right: 5px !important; }
	.home-news-block .home-news-block-header h2 { font-size: 24px; }
	.home-news-block-article .col-xs-3:first-child { display: none; }
	.home-news-block-article .col-xs-6 { width: 73%; padding-left: 10px; }
	.home-news-block-article .col-xs-3:last-child { width: 27%; padding-right: 7px; }
	.home-news-block-article-date { font-size: 10px; }
	.rankings-table { display: block; overflow-x: auto; white-space: nowrap; }
	.rankings_menu a { min-width: 108px; }
	.panel > .panel-body { padding: 13px; }
	.site-footer.footer { margin-bottom: 32px; padding: 28px 20px 20px; }
	.footer-brand-row, .footer-legal-row { align-items: flex-start; flex-direction: column; }
	.footer-grid { grid-template-columns: 1fr 1fr; gap: 24px 18px; }
	.footer-column--wide { grid-column: span 2; }
	.footer-powered { align-self: start; text-align: left; }
}

@media (max-width: 390px) {
	.site-hero h1 { font-size: 28px; }
	.hero-actions { display: grid; grid-template-columns: 1fr; align-items: stretch; }
	.hero-actions .btn { justify-content: center; }
	.footer-grid { grid-template-columns: 1fr; }
	.footer-column--wide { grid-column: span 1; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
