/*
Theme Name:		Stavtar 2026
Author:			John Green @ Phire Group
Author URI:		https://phiregroup.com/
Version:		1.0
*/

:root {--dkblue: #0b0b23; --p2765: #160e44; --p7461: #0075bf; --p297: #6dcff6; --p801: #00aeef; --white: #ffffff; --dkgray: #5a5a5a; --midgray: #d9d9d9; --ltgray: #f2f2f2; --formgray: #949494; --ltblue: #c5ecfc; --onlinegreen: #8bde86; --mw: 73.125rem; --hs: 1.375rem; --vs: 3.125rem;}

/* basic styles */
* {margin: 0; padding: 0;}
*, ::before, ::after {box-sizing: border-box;}
html {font: medium/1.3 'DM Sans', sans-serif; letter-spacing: -.02em; -webkit-text-size-adjust: none; text-size-adjust: none; color: var(--dkgray); background-color: var(--white);}
a {text-decoration-thickness: from-font; color: inherit; transition: 0.3s ease-out;}
button {border-width: 0; font: inherit; color: inherit; background-color: transparent; cursor: pointer; touch-action: manipulation;}
dialog {overscroll-behavior: contain;}
dialog::backdrop {overflow: hidden; overscroll-behavior: contain;}
h1, h2, h3, h4, h5, h6 {text-wrap: balance;}
iframe {display: block; max-width: 100%; border: 0;}
img, picture, svg, video {height: auto; max-width: 100%; vertical-align: middle;}
input, select, textarea {font: inherit; letter-spacing: inherit; word-spacing: inherit;}
ol, ul {list-style: none;}
p {text-wrap: pretty;}
summary {list-style: none; cursor: pointer;}
summary::-webkit-details-marker {display: none;}
svg[width="0"][height="0"] {position: fixed;}
svg[width="0"][height="0"][aria-hidden="true"] {display: none;}
[hidden] {display: none !important;}

/* text styles */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 {font-weight: 400; font-family: Poppins, sans-serif; letter-spacing: 0;}
.h1 {font-size: 2.5rem; line-height: 1.2;}
.h2 {font-size: 1.875rem; line-height: 1.2;}
.h3 {font-size: 1.625rem; line-height: 1.3;}
.h4 {font-size: 1.25rem; line-height: 1.4;}
.sh {font: 500 1rem/1.4 'DM Mono', sans-serif; text-transform: uppercase; letter-spacing: .02em;}
.smtxt {font-size: .75rem; line-height: 1.5; letter-spacing: 0em;}

/* utility classes */
.btn {display: inline-flex; position: relative; justify-content: center; align-items: center; gap: 1rem; padding: 1rem 1.5rem; border: var(--borderwidth) solid transparent; border-radius: 2.5rem; line-height: 1; text-decoration: none; --borderwidth: 1px;}
.btn svg {transition: inherit;}
.btn:not(:hover) svg {translate: -0.375rem;}
.btn-blue {color: var(--p2765); background-color: var(--p297);}
.btn-blue:hover {color: var(--p2765); background-color: var(--white);}
.btn-white {color: var(--white); background-color: var(--p2765);}
.btn-white:hover {color: var(--p2765); background-color: var(--p297);}
.btn-grad::before {position: absolute; inset: 0; padding: var(--borderwidth); border-radius: inherit; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude; pointer-events: none; transition: inherit; background-image: linear-gradient(90deg, var(--color1), var(--color2)); content: "";}
.btn-grad:hover::before {background-image: linear-gradient(90deg, var(--color2), var(--color1));}
.btn-grad-white {color: var(--white); --color1: var(--light-gray); --color2: var(--p801);}
.btn-grad-color {color: var(--p2765); background-color: rgb(from var(--p297) r g b / 0.1); --color1: var(--p2765); --color2: var(--p801);}
.screen-reader-text {position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;}
.wrap {margin-inline: max(var(--hs), ((100% - var(--mw)) / 2));}
.wys *:where(:not(.btn)) {margin: revert; margin-bottom: 0; padding: revert; list-style: revert;}
.wys > :first-child {margin-top: 0;}

/* header */
.header-skip {display: block; padding: .5rem; text-align: center;}
.header-skip:not(:focus) {position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;}
.header-skip:focus {outline: none;}
.header-skip span {padding-right: .25rem; padding-left: .25rem;}
.header-skip:focus-visible span {outline: 1px solid;}

/* footer */
.pf {padding-block: var(--vs);}
.pf .wrap {display: grid; row-gap: 1.875rem; place-items: start;}
.pf .sh {color: var(--p7461);}
.pf-nav {display: grid; grid-template-columns: 1fr 1fr; gap: 1.875rem; width: 100%;}
.pf-nav ul {display: grid; gap: .75rem; margin-top: .75rem;}
.pf-nav a:not(:hover) {text-decoration: none;}
.pf-social {display: flex; gap: .625rem; margin-top: 1.25rem;}
.pf-social a:hover {color: var(--p2765)}
.pf-locations {display: flex; flex-wrap: wrap; gap: 1.875rem; width: 100%;}
.pf-locations h2 {flex-basis: 100%; grid-column: 1 / -1; margin-bottom: -.625rem;}
.pf-location {flex-grow: 1; flex-basis: min(7.75rem, 100%);}
.pf-location h3 {margin-bottom: .625rem; color: var(--p2765);}
.pf-location .online {margin-top: 1.25rem;}
.pf .desktoponly {display: none;}
.pf-badges {display: flex; flex-wrap: wrap; gap: 1.25rem; padding-block: .25rem;}
.pf-badges img {display: block; width: auto; max-height: 2.5rem;}
.pf-legal {display: flex; flex-wrap: wrap; gap: .625rem; justify-content: space-between; width: 100%;}
.pf-legalmenu {display: flex; gap: 1ch;}
.pf-legalmenu li:has(+ li)::after {margin-left: 1ch; content: '|';}
.pf-legalmenu a:not(:hover) {text-decoration: none;}

@media (width >= 48em) { /* 768px */

	:root {--vs: 6.25rem;}

	.pf {--vs: 3.125rem;} /* revert */
	.pf .mobileonly {display: none;}
	.pf .desktoponly {display: revert;}

}

@media (width >= 64em) { /* 1024px */

	.pf .wrap {grid-template: auto 1fr auto auto / 1fr repeat(2, clamp(12.5rem, -5.682rem + 28.409vw, 15.625rem)) auto; gap: 2.5rem 1.875rem;}
	.pf-cta {grid-area: 1 / 4;}
	.pf-nav {grid-area: 1 / 2 / 3 / 4;}
	.pf-abstract {grid-area: 1 / 1 / 3 / 2;}
	.pf-locations {grid-area: 3 / 1 / 4 / -1; margin-top: .625rem;}
	.pf-location {flex-basis: auto;}
	.pf-badges {grid-area: 2 / 4;}
	.pf-legal {grid-area: 4 / 1 / 5 / -1; margin-top: .625rem;}

}

@media print {

	*, *::before, *::after {border-color: #000 !important; text-shadow: none !important; color: #000 !important; background-color: transparent !important;}
	blockquote, figure {break-inside: avoid;}

}

@media (prefers-reduced-motion: no-preference) {

	html:focus-within {scroll-behavior: smooth;}

	@view-transition {navigation: auto;}

}

@media (prefers-reduced-motion: reduce) {

	*, *::before, *::after {scroll-behavior: auto !important; transition-duration: 1ms !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important;}

}

@media (forced-colors: active) {


}