:root
{
	--red:#e30613;
	--red2:#b6000c;
	--black:#050505;
	--near:#090909;
	--panel:#101010;
	--line:#393939;
	--white:#f4f4f4;
	--muted:#b6b6b6;
	--title:'Anton', Impact, sans-serif;
	--body:'Inter', Arial, sans-serif

}

*
{
	box-sizing:border-box

}

html

{
	scroll-behavior:smooth

}

body

{
	margin:0;
	background:var(--black);
	color:var(--white);
	font-family:var(--body);
	font-size:16px;
	line-height:1.55

}

a

{
	color:inherit;
	text-decoration:none

}

img

{
	max-width:100%;
	display:block

}

.shell

{
	width:min(1470px,calc(100% - 76px));
	margin:auto

}

.skip-link

{
	position:absolute;
	left:-9999px

}

.skip-link:focus

{
	left:20px;
	top:20px;
	z-index:9999;
	background:#fff;
	color:#000;
	padding:10px

}

.section-black

{
	background:#060606

}

.section-dark

{
	background:#0c0c0c

}

.site-header

{
	height:82px;
	background:rgba(4,4,4,.96);
	border-bottom:1px solid #111;
	position:sticky;
	top:0;
	z-index:100

}

.header-inner

{
	height:100%;
	display:flex;
	align-items:center;
	gap:30px

}

.brand

{
	width:315px;
	line-height:1

}

.brand-main

{
	font-family:var(--title);
	font-size:35px;
	letter-spacing:1px;
	display:block

}

.brand-main b

{
	color:var(--red);
	font-weight:400

}

.brand small

{
	display:block;
	font-size:7px;
	letter-spacing:2.1px;
	margin-top:2px;
	color:#d8d8d8

}

.primary-nav

{
	margin-left:auto;
	display:flex;
	align-items:center;
	gap:35px

}

.primary-nav a

{
	font-family:var(--title);
	text-transform:uppercase;
	font-size:14px;
	letter-spacing:.5px;
	position:relative

}

.primary-nav a.active:after,.primary-nav a:hover:after

{
	content:"";
	position:absolute;
	height:2px;
	background:var(--red);
	left:0;
	right:0;
	bottom:-13px

}

.btn

{
	min-height:52px;
	padding:0 34px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:16px;
	font-family:var(--title);
	text-transform:uppercase;
	letter-spacing:.7px;
	font-size:15px;
	border:1px solid transparent;
	transition:.2s

}

.btn span

{
	font-size:26px;
	font-family:Arial

}

.btn-red

{
	background:linear-gradient(90deg,var(--red),#c4000d)

}

.btn-red:hover

{
	background:#ff1220

}

.btn-outline

{
	border-color: var(--red);
	background: rgba(0,0,0,.18)

}

.btn-outline:hover

{
	background: rgba(227,6,19,.12)

}

.btn-small

{
	min-height: 35px;
	padding: 0 18px;
	font-size: 12px

}

.header-cta

{
	margin-left: 26px

}

.nav-toggle

{
	display: none

}

.hero

{
	height: 760px;
	position: relative;
	overflow: hidden;
	background: #070707

}

.hero-photo

{
	position: absolute;
	inset: 0;


}

.hero-photo-live {
    position: absolute;
    inset: 0;

    background-image:
		
		linear-gradient(
           180deg,
			
           rgba(0, 0, 0, 0.30) 0%,
           rgba(0, 0, 0, 0.08) 18%,
           rgba(0, 0, 0, 0.00) 38%,
           rgba(0, 0, 0, 0.00) 72%,
           rgba(0, 0, 0, 0.25) 100%
),
		
	
        linear-gradient(
            90deg,
			
            rgba(0, 0, 0, 1.00) 0%,
			rgba(0, 0, 0, 1.00) 18%,
            rgba(0, 0, 0, 0.94) 28%,
            rgba(0, 0, 0, 0.78) 38%,
			rgba(0, 0, 0, 0.52) 48%,
			rgba(0, 0, 0, 0.26) 58%,
			rgba(0, 0, 0, 0.08) 68%,
			
            rgba(0, 0, 0, 0.12) 76%,
            rgba(0, 0, 0, 0.30) 86%,
			rgba(0, 0, 0, 0.70) 96%,
			rgba(0, 0, 0, 0.92) 100%
			
        ),
		
        url('../images/hero/GEO_Deadlift_Hero.JPG');

    background-size:
        100% 100%,    /* Vertical vignette */
		100% 100%,	  /* Horizontal vigentte */
        80% auto;     /* Base photo */

    background-position:
        center,
		center,   
        95% 42%; 

    background-repeat:
        no-repeat,
		no-repeat,
        no-repeat;
}

.photo-placeholder

{
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg,#272727,#0d0d0d 50%,#1a1a1a)

}

.photo-placeholder span

{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%);
	font-size:11px;
	letter-spacing:2px;
	color:#777;
	white-space:nowrap

}

.hero-content

{
	height:100%;
	position:relative;
	z-index:3;
	display:flex;
	align-items:center

}

.hero-copy

{
	margin-top:28px

}

.hero h1

{
	font-family:var(--title);
	font-weight:400;
	font-size:103px;
	letter-spacing:1px;
	margin:0;
	line-height:.96

}

.hero h1 b

{
	font-weight:400;
	color:var(--red)

}

.hero-subtitle

{
	font-size:28px;
	line-height:1.35;
	text-transform:uppercase;
	letter-spacing:7px;
	margin:14px 0 22px

}

.red-rule

{
	height:4px;
	width:61px;
	background:var(--red);
	margin:18px 0

}

.hero-tagline

{
	text-transform:uppercase;
	letter-spacing:3px;
	font-size:15px;
	font-weight:700;
	color:#cfcfcf;
	line-height:1.65

}

.hero-actions

{
	display:flex;
	gap:22px;
	margin-top:25px

}

.sport-rail

{
	position: absolute;
	z-index: 5;
	bottom: 38px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 38px;
	text-transform: uppercase;
	font-family: var(--title);
	font-size: 16px

}

.sport-rail b
{
	font-weight: 400;
	letter-spacing: 4px;
	word-spacing: 4px;
	font-spacing: 400;
	white-space: nowrap;
}

.sport-rail i

{
	font-style:normal;
	color:var(--red);
	font-size:30px

}

.sport-rail>span

{
	font-size:35px;
	color:#777

}

.hero-chevron

{
	position:absolute;
	bottom:-1px;
	left:0;
	right:0;
	height:62px;
	z-index:6

}

.hero-chevron:before,.hero-chevron:after

{
	content:"";
	position:absolute;
	top:17px;
	width:51%;
	height:2px;
	background:var(--red)

}

.hero-chevron:before

{
	left:0;
	transform:skewY(4deg);
	transform-origin:right

}

.hero-chevron:after

{
	right:0;
	transform:skewY(-4deg);
	transform-origin:left

}

.hero-chevron span:first-child,.hero-chevron span:last-child

{
	position:absolute;
	bottom:5px;
	width:50%;
	height:2px;
	background:#5d0007

}

.hero-chevron span:first-child

{
	left:0;
	transform:skewY(-3deg);
	transform-origin:right

}

.hero-chevron span:last-child

{
	right:0;
	transform:skewY(3deg);
	transform-origin:left

}

.story

{
	padding:0 0 12px

}

.story-grid

{
	display:grid;
	grid-template-columns:34% 66%;
	min-height:465px

}

.story-copy

{
	padding:46px 58px 35px 0

}

.story-copy h2,.center-title,.why h2,.featured-event h2,.moments h2,.future h2,.voices h2

{
	font-family:var(--title);
	font-weight:400;
	text-transform:uppercase;
	line-height:1.04;
	margin:0

}

.story-copy h2

{
	font-size:53px

}

.story-copy p

{
	color:#d0d0d0;
	max-width:390px;
	margin:11px 0

}

.story-copy strong

{
	color:#fff

}

.story-photo

{
	margin-right: 0;
	position: relative;
	overflow: hidden;

}

.story-photo-live
{
	background-image:
		linear-gradient(
		90deg,
		rgba(12, 12, 12, 1.00) 0%,
		rgba(12, 12, 12, 0.72) 10%,
		rgba(12, 12, 12, 0.30) 20%,
		rgba(12, 12, 12, 0.00) 32%
			
		),
		
		url('../images/hero/Story_Placeholder.jpg');
	
	background-size:
		100% 100%,
		cover;
	
	background_position:
		center,
		center;
	
	background-repeat:
		no-repeat,
		no-repeat;
}

.story-photo:before

{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(90deg,#0c0c0c 0,transparent 22%)

}

.services

{
	padding:20px 0 26px;
	border-top:1px solid #2a2a2a;
	border-bottom:1px solid #2c2c2c

}

.center-title

{
	text-align:center;
	font-size:43px;
	margin-bottom:13px

}

.center-title:after

{
	content:"";
	display:block;
	width:3px;
	height:22px;
	background:var(--red);
	margin:4px auto -4px

}

.service-grid

{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:26px

}

.service-card

{
	min-height:304px;
	border:1px solid #4a4a4a;
	background:linear-gradient(180deg,#101010,#080808);
	padding:22px 36px;
	position:relative

}

.service-card:after

{
	content:"";
	position:absolute;
	height:4px;
	left:0;
	right:0;
	bottom:0;
	background:linear-gradient(90deg,#480005,var(--red),#480005)

}
.service-icon

{
	height:72px;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:54px;
	line-height:1;
	color:var(--red)

}

.service-card h3

{
	font-family:var(--title);
	font-weight:400;
	text-align:center;
	text-transform:uppercase;
	font-size:22px;
	margin:5px 0 12px

}

.service-card ul

{
	margin:0;
	padding-left:18px;
	color:#d7d7d7;
	font-size:13px;
	line-height:1.65

}

.why

{
	position:relative;
	padding:36px 0 31px;
	border-bottom:1px solid #4b0004;
	overflow:hidden

}

.why-grid

{
	display:grid;
	grid-template-columns:2.5fr repeat(4,1fr);
	align-items:center

}

.why h2

{
	font-size:39px;
	letter-spacing: 1px;
	word-spacing: 3px;
	line-height: 1.08;

}

.why h2 span

{
	color:var(--red)

}

.why-item

{
	min-height:105px;
	border-left:1px solid #555;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-align:center;
	text-transform:uppercase

}

.why-item strong

{
	color:var(--red);
	font-size:38px;
	line-height:1

}

.why-item b

{
	font-family: var(--title);
	font-weight: 400;
	font-size: 17px;
	line-height: 1.25;
	margin-top: 10px

}

.side-chevron

{
	position: absolute;
	width: 45px;
	height: 45px;
	top: 50%;
	border-top: 2px solid var(--red);
	border-right: 2px solid var(--red)

}

.side-chevron-left

{
	left: -15px;
	transform: translateY(-50%) rotate(45deg)

}

.side-chevron-right

{
	right: -15px;
	transform: translateY(-50%) rotate(225deg)

}

.featured-event

{
	padding: 0 0 20px

}

.event-frame

{
	border: 1px solid var(--red);
	display: grid;
	grid-template-columns: 50% 50%;
	min-height: 385px

}

.event-photo

{
	min-height: 385px

}

.featured-event-photo

{
	background-image:
		url('../images/events/USPA_Logo.jpg'),
		linear-gradient(
			135deg,
			#17191b 0%,
			#090a0b 55%,
			#111214 100%
	);
	
	background-size: 
		72% auto,
		100% 100%;
	
	background-position: 
		center,
		center;
	
	background-repeat: 
		no-repeat,
		no-repeat;
	
	background-color:
		#050505;
	
}

.event-info

{
	padding: 29px 42px

}

.event-info small

{
	color: var(--red);
	text-transform: uppercase;
	letter-spacing: 2px

}

.event-info h2

{
	font-size: 44px;
	margin: 6px 0 10px

}

.event-info>p

{
	text-transform: uppercase;
	letter-spacing: 1.4px

}

.event-meta

{
	font-size: 13px;
	color: #ddd

}

.event-actions

{
	display: flex;
	gap: 18px;
	margin: 18px 0

}

.event-links

{
	border-top:1px solid #222;
	margin-top:17px;
	padding-top:14px;
	display:grid;
	grid-template-columns:repeat(5,1fr)

}

.event-links span

{
	text-align:center;
	font-size:25px

}

.event-links b

{
	display:block;
	font-family:var(--title);
	font-weight:400;
	text-transform:uppercase;
	font-size:12px;
	margin-top:7px

}

.moments

{
	padding:14px 0 10px;

}

.moments-heading

{
	display:flex;
	align-items:center;
	justify-content:space-between;

}

.moments h2

{
	font-size:37px

}

.moments-heading a

{
	font-size:11px;
	color:var(--red);
	text-transform:uppercase;
	letter-spacing:1.2px

}

.moments-grid

{
	display: grid;
	overflow: visible;
	
	grid-template-columns:
		1.25fr
		1fr
		1fr
		0.85fr;
	
	grid-template-rows:
		1fr
		1fr;
	
	height: 500px;
	gap: 4px;
	margin-top: 9px;

}

.moment-photo

{
	position: relative;
	overflow: visible;
	
	border: 1px solid #555;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	
	transition:
		filter 0.3s ease;
}
.moment-photo img

{
	display: none;
	ponter-events: none;
}

.moment-photo:hover img

{ 
	display: block;
	
	position: absolute;
	z-index: 20;
	
	width: auto;
	height: auto;
	max-width: min(900px, 80vw);
	max-height: min(650px, 80vh);
	
	padding: 6px;
	background: #080808;
	border: 1px solid #85898d;
	
	object-fit: contain;
	
	left: 50%;
	top: 50%;
	
	transform: translate(-50%, -50%);
	
	background: #050505;
	border: 1px solid #888;
	box-shadow:
		0 0 0 2px #111,
		0 10px 30px rgba(0, 0, 0, 0.75);
}

.moment-01

{
	grid-column: 1;
	grid-row: 1 / 3;
	
	background-image: url('../images/gallery/IMG_8371.JPG');
	
	background-position: 38% center;
}
.moment-01:hover img

{
	left: 0;
	
	transform: translate(0, -50%);
}

.moment-02

{
	grid-column: 2 / 4;
	grid-row: 1;
	
	background-image: url('../images/gallery/IMG_9736.JPG');
	
	background-position: center 50%;
}

.moment-03

{
	grid-column: 2;
	grid-row: 2;
	
	background-image: url('../images/gallery/IMG_1507.JPG');
	
	background-position: center 30%;
}

.moment-04

{
	grid-column: 3;
	grid-row: 2;
	
	background-image: url('../images/gallery/IMG_0729.JPG');
	
	background-position: center 40%;
}

.moment-05

{
	grid-column: 4;
	grid-row: 1 / 3;
	
	background-image: url('../images/gallery/IMG_1367.JPG');
	
	background-position: 55% center;
}

.moment-05:hover img

{
	left: auto;
	right: 0;
	
	transform: translate(0, -50%);
}

.future

{
	padding:0 0 19px

}

.future-top

{
	display:grid;
	grid-template-columns:31% 69%;
	min-height:365px

}

.future-copy

{
	padding:36px 40px 25px 5px

}

.future h2

{
	font-size:49px

}

.future-copy p

{
	color:#d0d0d0;
	font-size:14px

}

.facility-main

{
	min-height:365px

}

.facility-grid

{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:10px;
	margin-top:-105px;
	position:relative;
	z-index:3;
	padding-left:31%

}

.facility-grid>div>div

{
	height:110px;
	border:1px solid #888

}

.facility-grid small

{
	font-family:var(--title);
	text-transform:uppercase;
	display:block;
	text-align:center;
	font-size:12px;
	margin-top:7px

}

.voices

{
	padding:15px 0 8px;
	border-top:1px solid #333

}

.voices h2

{
	font-size:32px;
	margin-bottom:10px

}
.quote-grid

{
	display:grid;
	grid-template-columns:repeat(6,1fr);
	gap:9px

}

.quote-grid blockquote

{
	margin:0;
	padding:15px 13px;
	background:#111;
	border:1px solid #1b1b1b;
	min-height:102px;
	font-size:10px;
	color:#ddd;
	position:relative

}

.quote-grid blockquote:before

{
	content:'“';
	font-family:Georgia;
	font-size:43px;
	color:var(--red);
	position:absolute;
	left:7px;
	top:2px

}

.quote-grid blockquote

{
	padding-left:29px

}

.quote-grid cite

{
	display:block;
	color:var(--red);
	text-transform:uppercase;
	font-style:normal;
	font-family:var(--title);
	font-size:11px;
	margin-top:5px

}

.site-footer

{
	background:#030303;
	border-top:1px solid #333;
	padding:17px 0 9px

}

.footer-grid

{
	display:grid;
	grid-template-columns:1.7fr repeat(3,1fr) 1.6fr;
	gap:45px

}

.footer-brand .brand

{
	display:block;
	width:auto

}

.footer-brand p

{
	font-size:10px;
	color:#888

}

.footer-grid h3

{
	font-family:var(--title);
	font-weight:400;
	text-transform:uppercase;
	font-size:13px;
	letter-spacing:1px;
	margin:4px 0 5px

}

.footer-grid>div:not(:first-child)>a:not(.btn)

{
	display:block;
	font-size:9px;
	text-transform:uppercase;
	margin:2px 0;
	color:#ddd

}

.footer-grid p

{
	font-size:10px;
	margin:2px 0 7px;
	color:#cfcfcf

}

.footer-bottom

{
	border-top:1px solid #222;
	margin-top:13px;
	padding-top:7px;
	display:flex;
	justify-content:space-between;
	font-size:9px;
	color:#777

}





/* =========================================================
   Material Pass
   Matte carbon + polished metal + illuminated PRLiveTV red
   ========================================================= */
:root
{
  --metal-dark:#292b2d;
  --metal-mid:#777b80;
  --metal-light:#d7d9dc;
  --metal-white:#f2f3f4;
  --carbon-1:#0c0d0e;
  --carbon-2:#121315;
  --glow:rgba(227,6,19,.52);
	
}

/* Subtle carbon weave: visible up close, nearly black at a glance */

.section-black,
.section-dark,
.site-footer

{
  background-color:#070708;
  background-image:
    linear-gradient(45deg, rgba(255,255,255,.018) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.018) 75%),
    linear-gradient(45deg, rgba(255,255,255,.018) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.018) 75%),
    linear-gradient(180deg, rgba(255,255,255,.012), rgba(0,0,0,.12));
  background-size:8px 8px,8px 8px,100% 100%;
  background-position:0 0,4px 4px,0 0;
	
}

/* Header: polished lower rail and restrained red seam */

.site-header

{
  background:linear-gradient(180deg,#08090a 0%,#020303 100%);
  border-bottom:1px solid #8b8e92;
  box-shadow:0 2px 0 #202225,0 3px 0 rgba(227,6,19,.65),0 5px 18px rgba(0,0,0,.72);
	
}
.site-header:after

{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent 0%,#85888c 12%,#f0f1f2 36%,#707479 52%,#e9eaec 74%,transparent 100%);
  opacity:.65;pointer-events:none;
	
}

/* Buttons borrow the beveled broadcast-card construction */

.btn

{
	position:relative;
	overflow:hidden;
	border-color:#52565a;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 1px 0 #050505;
	clip-path:polygon(0 0,93% 0,100% 50%,93% 100%,0 100%)

}

.btn:before

{
	content:"";
	position:absolute;
	inset:1px;
	pointer-events:none;
	border-top:1px solid rgba(255,255,255,.14);
	border-bottom:1px solid rgba(0,0,0,.9)
		
}

.btn:after

{
	content:"";
	position:absolute;
	top:-30%;
	bottom:-30%;
	width:44%;
	left:-60%;
	transform:skewX(-18deg);
	background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);
	transition:left .38s ease;
	pointer-events:none

}

.btn:hover:after

{
	left:130%

}

.btn-red

{
	background:linear-gradient(180deg,#f00b19 0%,#c9000d 48%,#8f0008 100%);
	border-color:#e0e1e3;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 9px rgba(227,6,19,.23)

}

.btn-outline

{
	background:linear-gradient(180deg,rgba(43,45,48,.88),rgba(6,7,8,.94));
	border-color:#7f8388;
	box-shadow:inset 0 0 0 1px #1c1e20,0 0 0 1px rgba(0,0,0,.75)

}

.btn-outline:hover

{
	background:linear-gradient(180deg,#35383b,#0b0c0d);
	border-color:#d5d7d9

}

/* Brand plate: subtle metal embossing without turning it into chrome text */


.brand-main

{
	filter:drop-shadow(0 1px 0 #65686c) drop-shadow(0 2px 2px #000)

}

.brand small

{
	color:#d8dadd;
	text-shadow:0 1px 0 #000

}

/* Hero transition now has a metal spine + glowing red seam */

.hero-chevron:before,.hero-chevron:after

{
	height:3px;
	background:linear-gradient(180deg,#f1f2f3 0%,#5a5e63 44%,#242629 52%,#b8bbc0 100%);
	box-shadow:0 2px 0 rgba(227,6,19,.9),0 3px 9px var(--glow)

}

.hero-chevron span:first-child,.hero-chevron span:last-child

{
	height:2px;
	background:linear-gradient(90deg,#300004,var(--red),#300004);
	box-shadow:0 0 7px var(--glow)

}

/* Section headings get a broadcast-package metal/red underline */

.center-title:after,.red-rule

{
	background:linear-gradient(90deg,#5b5e62 0%,#eceef0 24%,var(--red) 46%,#ff1727 55%,#777a7f 78%,#222 100%);
	box-shadow:0 0 7px rgba(227,6,19,.38)

}

/* Service cards: carbon field, polished frame, red powered lower seam */

.service-card
{
  border:1px solid #7b7e82;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(0,0,0,.15)),
    linear-gradient(135deg,#17191b 0%,#090a0b 55%,#111214 100%);
  box-shadow:inset 0 0 0 1px #26282a,inset 0 1px 0 rgba(255,255,255,.08),0 7px 20px rgba(0,0,0,.38);
  clip-path:polygon(0 0,94% 0,100% 10%,100% 100%,0 100%);
	
}
.service-card:before
{
  content:"";
	position:absolute;
	left:1px;
	right:1px;
	top:1px;
	height:2px;
  background:linear-gradient(90deg,#232528,#9ca0a5,#f1f2f3,#64686d,#1d1f21);
	opacity:.72
		
}

.service-card:after

{
	height:4px;
	background:linear-gradient(90deg,#1c0002 0%,#8e0008 20%,#ff1020 50%,#8e0008 80%,#1c0002 100%);
	box-shadow:0 -2px 9px var(--glow)

}

.service-icon

{
	text-shadow:0 0 9px rgba(227,6,19,.45)

}

/* Why strip: metal rails and layered edge chevrons */

.why

{
	border-top:1px solid #797c80;
	border-bottom:1px solid #797c80;
	box-shadow:inset 0 2px 0 #181a1c,inset 0 -2px 0 #181a1c

}

.why:before,.why:after

{
	content:"";
	position:absolute;
	left:0;
	right:0;
	height:2px;
	background:linear-gradient(90deg,transparent,#55595d,#e6e8ea,#585c60,transparent);
	opacity:.55

}

.why:before

{
	top:2px

}

.why:after

{
	bottom:2px

}

.side-chevron

{
	width:58px;
	height:58px;
	border-top:3px solid #c7c9cc;
	border-right:3px solid #c7c9cc;
	filter:drop-shadow(3px 3px 0 #202225) drop-shadow(5px 5px 0 var(--red)) drop-shadow(7px 7px 5px rgba(227,6,19,.3))

}

/* Featured Event — strongest use of the broadcast-package visual language */

.event-frame

{
  position:relative;
  border:0;
  background:linear-gradient(135deg,#aeb1b5 0%,#3d4044 12%,#e2e4e6 22%,#5c6065 40%,#242629 58%,#aeb1b5 78%,#33363a 100%);
  padding:3px;
  box-shadow:0 0 0 1px #080808,0 8px 28px rgba(0,0,0,.58),0 0 10px rgba(227,6,19,.10);
  clip-path:polygon(0 0,97% 0,100% 50%,97% 100%,0 100%);
	
}
.event-frame:before

{
  content:"";
	position:absolute;
	inset:7px 12px 7px 7px;
	z-index:0;
	pointer-events:none;
  border:1px solid rgba(227,6,19,.85);
	box-shadow:inset 0 0 7px rgba(227,6,19,.22),0 0 7px rgba(227,6,19,.22);
  clip-path:polygon(0 0,97% 0,100% 50%,97% 100%,0 100%);
	
}

.event-frame:after
{
  content:"";
	position:absolute;
	right:8px;
	top:8%;
	bottom:8%;
	width:58px;
	z-index:1;
	pointer-events:none;
  background:linear-gradient(135deg,transparent 0 34%,#292c2f 34% 40%,#c8cbcf 40% 44%,var(--red) 44% 48%,#17191b 48% 54%,#777b80 54% 58%,transparent 58% 100%);
  filter:drop-shadow(-2px 0 3px rgba(0,0,0,.9)) drop-shadow(-4px 0 5px rgba(227,6,19,.18));
	
}

.event-photo,.event-info

{
	position:relative;
	z-index:2;
	background-color:#090a0b

}

.event-info

{
  background-image:
    linear-gradient(135deg,rgba(255,255,255,.025),transparent 36%),
    linear-gradient(180deg,#111214,#070808);
  padding-right:78px;
	
}

.event-info small
{font-weight:800;
	text-shadow:0 0 7px rgba(227,6,19,.35)

}

.event-links

{
	border-top:1px solid #6b6e72;
	box-shadow:inset 0 1px 0 #181a1c

}

.event-links span

{
	color:#d8dade;
	text-shadow:0 1px 0 #000

}

.event-links span:hover

{
	color:#fff

}

/* Gallery tiles receive a restrained silver rail */

.moments-grid>div,.facility-grid>div>div

{
  border:1px solid #777b80;
  box-shadow:inset 0 0 0 1px #1b1d1f,0 2px 0 #070707;
	
}

.moments-grid>div:after,.facility-grid>div>div:after

{
  content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	height:2px;
	background:linear-gradient(90deg,transparent,#666a6e,var(--red),#666a6e,transparent);
	opacity:.75
		
}


/* Future facility panel gets the same premium framing but quieter than event card */

.facility-main

{
	border-top:1px solid #85898d;
	border-bottom:1px solid #3d4044;
	
	box-shadow:
		inset 0 1px 0 #1b1d1f,
		inset 0 -1px 0 #000;
	
	min-height: 500px;
	
	background-size: cover;
	background-position: 20% center;
	background-repeat: no-repeat;

}

/*Facilty Thumbnails */

.facility-thumb {
	position: relative;
	overflow: visible;
	
	min-height: 180px;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	
	border-top: 1px solid #85898d;
	border-bottom: 1px solid #3d4044;
	
	box-shadow:
		inset 0 1px 0 #1b1d1f,
		inset 0 -1px 0 #000;
	
}

.facility-thumb img

{
	display: none;
	pointer-events: none;
}

.facility-thumb:hover img

{
	display: block;
	
	position: absolute;
	z-index: 30;
	
	width: auto;
	height: auto;
	
	max-width: min(900px, 80vw);
	max-height: min(700px, 80vh);
	
	object-fit: contain;
	
	left: 50%;
	bottom: calc(100% + 12px);
	transform: translate(-50%);
	
	padding: 6px;
	
	background: #080808;
	border: 1px solid #85898d;
	
	box-shadow:
		0 0 0 2px #111,
		0 0 18px rgba(227, 6, 19, 0.20),
		0 15px 40px rgba(0, 0, 0, 0.90);
	
}

.arena-thumb {
	background-image: url('../images/facility/Arena_Mockup.jpg');
	
}

.studio-thumb {
	background-image: url('../images/facility/Production_Mockup.jpg');
	
}

.lounge-thumb {
	background-image: url('../images/facility/Lounge_Mockup.jpg');
	
}

.offices-thumb {
	background-image: url('../images/facility/Office_Mockup.jpg');
	
}

/* Quotes: small red illuminated seam, otherwise subdued */

.quote-grid blockquote

{
	border:1px solid #45484b;
	background:linear-gradient(180deg,#121416,#090a0b);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.035)

}

.quote-grid blockquote:after

{
	content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	height:2px;
	background:linear-gradient(90deg,#220003,var(--red),#220003);
	opacity:.8;
	box-shadow:0 0 5px rgba(227,6,19,.28)

}

/* Footer top rail */

.site-footer

{
	border-top:1px solid #93969a;
	box-shadow:inset 0 2px 0 #1e2022

}

.footer-bottom

{
	border-top:1px solid #53565a
		
}

@media (prefers-reduced-motion: reduce)

{
	.btn:after
	
	{
		display:none
	}
}

/* =========================================================
   PRLiveTV purpose-built broadcast chevron divider (V6)
   Replaces the previous full-width shallow-V line treatment.
   ========================================================= */

.hero-chevron

{
	display:none!important

}

.hero

{
	overflow:hidden

}

.sport-rail

{
	bottom:96px!important;
	z-index:8!important

}

.broadcast-chevron-divider

{
  position:absolute;
  z-index:7;
  left:0;
  right:0;
  bottom:-1px;
  height:92px;
  pointer-events:none;
	
}

.broadcast-chevron-divider svg

{display:block;
	width:100%;
	height:100%;
	overflow:visible

		
}
.broadcast-chevron-divider:after

{
  content:"";
  position:absolute;
  left:50%;
  bottom:5px;
  width:78px;
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,#e30613,transparent);
  box-shadow:0 0 9px rgba(227,6,19,.55);
  opacity:.8;
}