/* (Wed, 06/10/2026) Claude Opus 4.8 */

/* FONTS */
@font-face{
font-family: "Public Sans";
font-style: normal; font-weight: 300; font-display: swap;
src: url("/_fonts/public-sans/public-sans-300.woff2") format("woff2"), 
     url("/_fonts/public-sans/public-sans-300.ttf") format("truetype");
}
@font-face{
font-family: "Public Sans";
font-style: italic; font-weight: 300; font-display: swap;
src: url("/_fonts/public-sans/public-sans-italic-300.woff2") format("woff2"), 
     url("/_fonts/public-sans/public-sans-italic-300.ttf") format("truetype");
}
@font-face{
font-family: "Public Sans";
font-style: normal; font-weight: 400; font-display: swap;
src: url("/_fonts/public-sans/public-sans-400.woff2") format("woff2"), 
     url("/_fonts/public-sans/public-sans-400.ttf") format("truetype");
}
@font-face{
font-family: "Public Sans";
font-style: italic; font-weight: 400; font-display: swap;
src: url("/_fonts/public-sans/public-sans-italic-400.woff2") format("woff2"), 
     url("/_fonts/public-sans/public-sans-italic-400.ttf") format("truetype");
}
@font-face{
font-family: "Public Sans";
font-style: normal; font-weight: 600; font-display: swap;
src: url("/_fonts/public-sans/public-sans-semibold-600.woff2") format("woff2"), 
     url("/_fonts/public-sans/public-sans-semibold-600.ttf") format("truetype");
}
@font-face{
font-family: "Public Sans";
font-style: italic; font-weight: 600; font-display: swap;
src: url("/_fonts/public-sans/public-sans-semibold-italic-600.woff2") format("woff2"), 
     url("/_fonts/public-sans/public-sans-semibold-italic-600.ttf") format("truetype");
}

/* BASE STYLES */
*, ::before, ::after {box-sizing: border-box; border-width: 0; border-style: solid; border-color: #e5e7eb;}
html {line-height: 1.5; -webkit-text-size-adjust: 100%; -moz-tab-size: 4; tab-size: 4; }
body {margin: 0; padding: 0; line-height: inherit; font-family: "Public Sans", Arial, sans-serif; font-style: normal; font-size: 16px; font-weight: 400; background-color: #fff; color: #020202;}
/* RESETS */
*, *::before, *::after {box-sizing: border-box;}
* {margin: 0; padding: 0;}
/*html {height: 100%;}*/
body {min-height: 100vh;}
img, picture, video, canvas, svg {display: block; max-width: 100%; height: auto;}
input, button, textarea, select {font: inherit;}
svg {overflow: visible;}  
p, h1, h2, h3, h4, h5, h6 {overflow-wrap: break-word;}
p {line-height: 1.625; margin-bottom: 1.5em;}
ul {margin-left: 1.125em;}

:root {margin: 0; padding: 0; --primary-color: #000; --body-fonts: 'Libre Franklin', Arial, Helvetica, sans-serif;}
html {font-size: 100%; line-height: 1.25; scroll-behavior: smooth; scrollbar-gutter: stable;}

a {color: #020202;}
a {text-decoration: underline;}
a:hover {text-decoration: none;}

h1 {text-wrap: balance; font-weight: 400;}

/* Layout & Containers */
.container {width: 100%; margin-right: auto; margin-left: auto; padding-right: 1.5rem; padding-left: 1.5rem;}
@media (min-width: 640px) {.container {max-width: 640px;}}
@media (min-width: 768px) {.container {max-width: 768px;}}
@media (min-width: 1024px) {.container {max-width: 1024px;}}
@media (min-width: 1280px) {.container {max-width: 1280px;}}

.flex {display: flex;}
.flex-col {flex-direction: column;}
@media (min-width: 640px) {.sm\:flex-row {flex-direction: row;}}
.items-center {align-items: center;}
.justify-between {justify-content: space-between;}
.justify-center {justify-content: center;}
.gap-1 {gap: 0.25rem;}
.gap-2 {gap: 0.5rem;}
.gap-4 {gap: 1rem;}
.gap-6 {gap: 1.5rem;}
.gap-8 {gap: 2rem;}
.gap-12 {gap: 3rem;}
.gap-16 {gap: 4rem;}

.space-x-4 > :not([hidden]) ~ :not([hidden]) {margin-left: 1rem;}
.space-x-8 > :not([hidden]) ~ :not([hidden]) {margin-left: 2rem;}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {margin-top: 0.25rem;}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {margin-top: 0.5rem;}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {margin-top: 1rem;}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {margin-top: 1.5rem;}
.space-y-8 > :not([hidden]) ~ :not([hidden]) {margin-top: 2rem;}

.grid {display: grid;}
.grid-cols-1 {grid-template-columns: repeat(1, minmax(0, 1fr));}
@media (min-width: 768px) {.md\:grid-cols-2 {grid-template-columns: repeat(2, minmax(0, 1fr));} .md\:grid-cols-3 {grid-template-columns: repeat(3, minmax(0, 1fr));} .md\:grid-cols-4 {grid-template-columns: repeat(4, minmax(0, 1fr));}}
@media (min-width: 1024px) {.lg\:grid-cols-2 {grid-template-columns: repeat(2, minmax(0, 1fr));} .lg\:grid-cols-4 {grid-template-columns: repeat(4, minmax(0, 1fr));}}

/* POSITIONING */
.fixed {position: fixed;}
.absolute {position: absolute;}
.relative {position: relative;}
.inset-0 {top: 0; right: 0; bottom: 0; left: 0; position: absolute;}
.top-0 {top: 0px;}
.top-full {top: 100%;}
.left-0 {left: 0px;}
.right-0 {right: 0px;}
.bottom-0 {bottom: 0px;}
.z-0 {z-index: 0;}
.z-10 {z-index: 10;}
.z-30 {z-index: 30;}
.z-40 {z-index: 40;}
.z-50 {z-index: 50;}

/* Sizing */
.h-10 {height: 2.5rem;}
.h-24 {height: 6rem;}
.h-32 {height: 8rem;}
.h-40 {height: 10rem;}
.h-56 {height: 14rem;}
.h-full {height: 100%;}
.w-10 {width: 2.5rem;}
.w-full {width: 100%;}
.w-max-full {max-width: 100%;}
.min-h-\[110vh\] {min-height: 110vh;}
.min-w-\[220px\] {min-width: 220px;}
.aspect-square {aspect-ratio: 1 / 1;}
.scalable {width: auto; height: auto; max-width: 100% !important;}

/* Colors */
.bg-wht {background-color: #fff;}
.bg-blk {background-color: #020202;}
.bg-blk-20 {background-color: rgba(0, 0, 0, 0.2);}
.bg-blk-9595 {background-color: rgba(0, 0, 0, 0.95);}
.bg-accent {background-color: #D31212;}
.bg-secondary {background-color: #FFD700;}
.bg-\[\#FDFCFB\] {background-color: #FDFCFB;}
.bg-transparent {background-color: transparent;}

.clr-wht {color: #fff;}
.clr-blk {color: #020202;}
.clr-red {color: #d31212;}
.clr-gry {color: #4b5563;}

.text-gray-500 {color: #6b7280;}
.text-gray-600 {color: #4b5563;}
.text-muted-foreground {color: #6B7280;}
.text-white\/70 {color: rgba(255, 255, 255, 0.7);}
.text-white\/90 {color: rgba(255, 255, 255, 0.9);}

.bld-y {font-weight: bold;}
.bld-n {font-weight: normal;}

/* --- PADDING --- */
/* padding (all sides) */
.p-1  {padding: 0.25rem;}
.p-2  {padding: 0.5rem;}
.p-3  {padding: 0.75rem;}
.p-4  {padding: 1rem;}
.p-5  {padding: 1.25rem;}
.p-6  {padding: 1.5rem;}
.p-7  {padding: 1.75rem;}
.p-8  {padding: 2rem;}
.p-9  {padding: 2.25rem;}
.p-10 {padding: 2.5rem;}
.p-12 {padding: 3rem;}
.p-14 {padding: 3.5rem;}
.p-16 {padding: 4rem;}
.p-20 {padding: 5rem;}
.p-24 {padding: 6rem;}
.p-28 {padding: 7rem;}
.p-32 {padding: 8rem;}

/* padding left/right */
.px-1  {padding-left: 0.25rem; padding-right: 0.25rem;}
.px-2  {padding-left: 0.5rem;  padding-right: 0.5rem;}
.px-3  {padding-left: 0.75rem; padding-right: 0.75rem;}
.px-4  {padding-left: 1rem;    padding-right: 1rem;}
.px-5  {padding-left: 1.25rem; padding-right: 1.25rem;}
.px-6  {padding-left: 1.5rem;  padding-right: 1.5rem;}
.px-7  {padding-left: 1.75rem; padding-right: 1.75rem;}
.px-8  {padding-left: 2rem;    padding-right: 2rem;}
.px-9  {padding-left: 2.25rem; padding-right: 2.25rem;}
.px-10 {padding-left: 2.5rem;  padding-right: 2.5rem;}
.px-12 {padding-left: 3rem;    padding-right: 3rem;}
.px-14 {padding-left: 3.5rem;  padding-right: 3.5rem;}
.px-16 {padding-left: 4rem;    padding-right: 4rem;}
.px-20 {padding-left: 5rem;    padding-right: 5rem;}
.px-24 {padding-left: 6rem;    padding-right: 6rem;}
.px-28 {padding-left: 7rem;    padding-right: 7rem;}
.px-32 {padding-left: 8rem;    padding-right: 8rem;}

/* padding top/bottom */
.py-1  {padding-top: 0.25rem; padding-bottom: 0.25rem;}
.py-2  {padding-top: 0.5rem;  padding-bottom: 0.5rem;}
.py-3  {padding-top: 0.75rem; padding-bottom: 0.75rem;}
.py-4  {padding-top: 1rem;    padding-bottom: 1rem;}
.py-5  {padding-top: 1.25rem; padding-bottom: 1.25rem;}
.py-6  {padding-top: 1.5rem;  padding-bottom: 1.5rem;}
.py-7  {padding-top: 1.75rem; padding-bottom: 1.75rem;}
.py-8  {padding-top: 2rem;    padding-bottom: 2rem;}
.py-9  {padding-top: 2.25rem; padding-bottom: 2.25rem;}
.py-10 {padding-top: 2.5rem;  padding-bottom: 2.5rem;}
.py-12 {padding-top: 3rem;    padding-bottom: 3rem;}
.py-14 {padding-top: 3.5rem;  padding-bottom: 3.5rem;}
.py-16 {padding-top: 4rem;    padding-bottom: 4rem;}
.py-20 {padding-top: 5rem;    padding-bottom: 5rem;}
.py-24 {padding-top: 6rem;    padding-bottom: 6rem;}
.py-28 {padding-top: 7rem;    padding-bottom: 7rem;}
.py-32 {padding-top: 8rem;    padding-bottom: 8rem;}

/* padding top */
.pt-1  {padding-top: 0.25rem;}
.pt-2  {padding-top: 0.5rem;}
.pt-3  {padding-top: 0.75rem;}
.pt-4  {padding-top: 1rem;}
.pt-5  {padding-top: 1.25rem;}
.pt-6  {padding-top: 1.5rem;}
.pt-7  {padding-top: 1.75rem;}
.pt-8  {padding-top: 2rem;}
.pt-10 {padding-top: 2.5rem;}
.pt-12 {padding-top: 3rem;}
.pt-14 {padding-top: 3.5rem;}
.pt-16 {padding-top: 4rem;}
.pt-20 {padding-top: 5rem;}
.pt-24 {padding-top: 6rem;}
.pt-28 {padding-top: 7rem;}
.pt-32 {padding-top: 8rem;}

/* padding bottom */
.pb-1  {padding-bottom: 0.25rem;}
.pb-2  {padding-bottom: 0.5rem;}
.pb-3  {padding-bottom: 0.75rem;}
.pb-4  {padding-bottom: 1rem;}
.pb-5  {padding-bottom: 1.25rem;}
.pb-6  {padding-bottom: 1.5rem;}
.pb-7  {padding-bottom: 1.75rem;}
.pb-8  {padding-bottom: 2rem;}
.pb-10 {padding-bottom: 2.5rem;}
.pb-12 {padding-bottom: 3rem;}
.pb-14 {padding-bottom: 3.5rem;}
.pb-16 {padding-bottom: 4rem;}
.pb-20 {padding-bottom: 5rem;}
.pb-24 {padding-bottom: 6rem;}
.pb-28 {padding-bottom: 7rem;}
.pb-32 {padding-bottom: 8rem;}

/* --- MARGINS --- */
/* Margin utilities (mirrors the expanded padding scale: 1 unit = 0.25rem) */

/* margin (all sides) */
.m-0  {margin: 0;}
.m-1  {margin: 0.25rem;}
.m-2  {margin: 0.5rem;}
.m-3  {margin: 0.75rem;}
.m-4  {margin: 1rem;}
.m-5  {margin: 1.25rem;}
.m-6  {margin: 1.5rem;}
.m-7  {margin: 1.75rem;}
.m-8  {margin: 2rem;}
.m-9  {margin: 2.25rem;}
.m-10 {margin: 2.5rem;}
.m-12 {margin: 3rem;}
.m-14 {margin: 3.5rem;}
.m-16 {margin: 4rem;}
.m-20 {margin: 5rem;}
.m-24 {margin: 6rem;}
.m-28 {margin: 7rem;}
.m-32 {margin: 8rem;}

/* margin left/right */
.mx-auto {margin-left: auto; margin-right: auto;}
.mx-0  {margin-left: 0; margin-right: 0;}
.mx-1  {margin-left: 0.25rem; margin-right: 0.25rem;}
.mx-2  {margin-left: 0.5rem;  margin-right: 0.5rem;}
.mx-3  {margin-left: 0.75rem; margin-right: 0.75rem;}
.mx-4  {margin-left: 1rem;    margin-right: 1rem;}
.mx-5  {margin-left: 1.25rem; margin-right: 1.25rem;}
.mx-6  {margin-left: 1.5rem;  margin-right: 1.5rem;}
.mx-7  {margin-left: 1.75rem; margin-right: 1.75rem;}
.mx-8  {margin-left: 2rem;    margin-right: 2rem;}
.mx-9  {margin-left: 2.25rem; margin-right: 2.25rem;}
.mx-10 {margin-left: 2.5rem;  margin-right: 2.5rem;}
.mx-12 {margin-left: 3rem;    margin-right: 3rem;}
.mx-14 {margin-left: 3.5rem;  margin-right: 3.5rem;}
.mx-16 {margin-left: 4rem;    margin-right: 4rem;}
.mx-20 {margin-left: 5rem;    margin-right: 5rem;}
.mx-24 {margin-left: 6rem;    margin-right: 6rem;}
.mx-28 {margin-left: 7rem;    margin-right: 7rem;}
.mx-32 {margin-left: 8rem;    margin-right: 8rem;}

/* margin top/bottom */
.my-0  {margin-top: 0; margin-bottom: 0;}
.my-1  {margin-top: 0.25rem; margin-bottom: 0.25rem;}
.my-2  {margin-top: 0.5rem;  margin-bottom: 0.5rem;}
.my-3  {margin-top: 0.75rem; margin-bottom: 0.75rem;}
.my-4  {margin-top: 1rem;    margin-bottom: 1rem;}
.my-5  {margin-top: 1.25rem; margin-bottom: 1.25rem;}
.my-6  {margin-top: 1.5rem;  margin-bottom: 1.5rem;}
.my-7  {margin-top: 1.75rem; margin-bottom: 1.75rem;}
.my-8  {margin-top: 2rem;    margin-bottom: 2rem;}
.my-9  {margin-top: 2.25rem; margin-bottom: 2.25rem;}
.my-10 {margin-top: 2.5rem;  margin-bottom: 2.5rem;}
.my-12 {margin-top: 3rem;    margin-bottom: 3rem;}
.my-14 {margin-top: 3.5rem;  margin-bottom: 3.5rem;}
.my-16 {margin-top: 4rem;    margin-bottom: 4rem;}
.my-20 {margin-top: 5rem;    margin-bottom: 5rem;}
.my-24 {margin-top: 6rem;    margin-bottom: 6rem;}
.my-28 {margin-top: 7rem;    margin-bottom: 7rem;}
.my-32 {margin-top: 8rem;    margin-bottom: 8rem;}

/* margin top */
.mt-0  {margin-top: 0;}
.mt-1  {margin-top: 0.25rem;}
.mt-2  {margin-top: 0.5rem;}
.mt-3  {margin-top: 0.75rem;}
.mt-4  {margin-top: 1rem;}
.mt-5  {margin-top: 1.25rem;}
.mt-6  {margin-top: 1.5rem;}
.mt-7  {margin-top: 1.75rem;}
.mt-8  {margin-top: 2rem;}
.mt-10 {margin-top: 2.5rem;}
.mt-12 {margin-top: 3rem;}
.mt-14 {margin-top: 3.5rem;}
.mt-16 {margin-top: 4rem;}
.mt-20 {margin-top: 5rem;}
.mt-24 {margin-top: 6rem;}
.mt-28 {margin-top: 7rem;}
.mt-32 {margin-top: 8rem;}

/* margin bottom */
.mb-0  {margin-bottom: 0;}
.mb-1  {margin-bottom: 0.25rem;}
.mb-2  {margin-bottom: 0.5rem;}
.mb-3  {margin-bottom: 0.75rem;}
.mb-4  {margin-bottom: 1rem;}
.mb-5  {margin-bottom: 1.25rem;}
.mb-6  {margin-bottom: 1.5rem;}
.mb-7  {margin-bottom: 1.75rem;}
.mb-8  {margin-bottom: 2rem;}
.mb-10 {margin-bottom: 2.5rem;}
.mb-12 {margin-bottom: 3rem;}
.mb-14 {margin-bottom: 3.5rem;}
.mb-16 {margin-bottom: 4rem;}
.mb-20 {margin-bottom: 5rem;}
.mb-24 {margin-bottom: 6rem;}
.mb-28 {margin-bottom: 7rem;}
.mb-32 {margin-bottom: 8rem;}

/* margin left */
.ml-0  {margin-left: 0;}
.ml-1  {margin-left: 0.25rem;}
.ml-2  {margin-left: 0.5rem;}
.ml-3  {margin-left: 0.75rem;}
.ml-4  {margin-left: 1rem;}
.ml-5  {margin-left: 1.25rem;}
.ml-6  {margin-left: 1.5rem;}
.ml-7  {margin-left: 1.75rem;}
.ml-8  {margin-left: 2rem;}
.ml-10 {margin-left: 2.5rem;}
.ml-12 {margin-left: 3rem;}
.ml-14 {margin-left: 3.5rem;}
.ml-16 {margin-left: 4rem;}
.ml-20 {margin-left: 5rem;}
.ml-24 {margin-left: 6rem;}
.ml-28 {margin-left: 7rem;}
.ml-32 {margin-left: 8rem;}

/* margin right */
.mr-0  {margin-right: 0;}
.mr-1  {margin-right: 0.25rem;}
.mr-2  {margin-right: 0.5rem;}
.mr-3  {margin-right: 0.75rem;}
.mr-4  {margin-right: 1rem;}
.mr-5  {margin-right: 1.25rem;}
.mr-6  {margin-right: 1.5rem;}
.mr-7  {margin-right: 1.75rem;}
.mr-8  {margin-right: 2rem;}
.mr-10 {margin-right: 2.5rem;}
.mr-12 {margin-right: 3rem;}
.mr-14 {margin-right: 3.5rem;}
.mr-16 {margin-right: 4rem;}
.mr-20 {margin-right: 5rem;}
.mr-24 {margin-right: 6rem;}
.mr-28 {margin-right: 7rem;}
.mr-32 {margin-right: 8rem;}

/* negative margin (all sides) */
.-m-1  {margin: -0.25rem;}
.-m-2  {margin: -0.5rem;}
.-m-3  {margin: -0.75rem;}
.-m-4  {margin: -1rem;}
.-m-5  {margin: -1.25rem;}
.-m-6  {margin: -1.5rem;}
.-m-7  {margin: -1.75rem;}
.-m-8  {margin: -2rem;}
.-m-9  {margin: -2.25rem;}
.-m-10 {margin: -2.5rem;}
.-m-12 {margin: -3rem;}
.-m-14 {margin: -3.5rem;}
.-m-16 {margin: -4rem;}
.-m-20 {margin: -5rem;}
.-m-24 {margin: -6rem;}
.-m-28 {margin: -7rem;}
.-m-32 {margin: -8rem;}

/* negative margin left/right */
.-mx-1  {margin-left: -0.25rem; margin-right: -0.25rem;}
.-mx-2  {margin-left: -0.5rem;  margin-right: -0.5rem;}
.-mx-3  {margin-left: -0.75rem; margin-right: -0.75rem;}
.-mx-4  {margin-left: -1rem;    margin-right: -1rem;}
.-mx-5  {margin-left: -1.25rem; margin-right: -1.25rem;}
.-mx-6  {margin-left: -1.5rem;  margin-right: -1.5rem;}
.-mx-7  {margin-left: -1.75rem; margin-right: -1.75rem;}
.-mx-8  {margin-left: -2rem;    margin-right: -2rem;}
.-mx-9  {margin-left: -2.25rem; margin-right: -2.25rem;}
.-mx-10 {margin-left: -2.5rem;  margin-right: -2.5rem;}
.-mx-12 {margin-left: -3rem;    margin-right: -3rem;}
.-mx-14 {margin-left: -3.5rem;  margin-right: -3.5rem;}
.-mx-16 {margin-left: -4rem;    margin-right: -4rem;}
.-mx-20 {margin-left: -5rem;    margin-right: -5rem;}
.-mx-24 {margin-left: -6rem;    margin-right: -6rem;}
.-mx-28 {margin-left: -7rem;    margin-right: -7rem;}
.-mx-32 {margin-left: -8rem;    margin-right: -8rem;}

/* negative margin top/bottom */
.-my-1  {margin-top: -0.25rem; margin-bottom: -0.25rem;}
.-my-2  {margin-top: -0.5rem;  margin-bottom: -0.5rem;}
.-my-3  {margin-top: -0.75rem; margin-bottom: -0.75rem;}
.-my-4  {margin-top: -1rem;    margin-bottom: -1rem;}
.-my-5  {margin-top: -1.25rem; margin-bottom: -1.25rem;}
.-my-6  {margin-top: -1.5rem;  margin-bottom: -1.5rem;}
.-my-7  {margin-top: -1.75rem; margin-bottom: -1.75rem;}
.-my-8  {margin-top: -2rem;    margin-bottom: -2rem;}
.-my-9  {margin-top: -2.25rem; margin-bottom: -2.25rem;}
.-my-10 {margin-top: -2.5rem;  margin-bottom: -2.5rem;}
.-my-12 {margin-top: -3rem;    margin-bottom: -3rem;}
.-my-14 {margin-top: -3.5rem;  margin-bottom: -3.5rem;}
.-my-16 {margin-top: -4rem;    margin-bottom: -4rem;}
.-my-20 {margin-top: -5rem;    margin-bottom: -5rem;}
.-my-24 {margin-top: -6rem;    margin-bottom: -6rem;}
.-my-28 {margin-top: -7rem;    margin-bottom: -7rem;}
.-my-32 {margin-top: -8rem;    margin-bottom: -8rem;}

/* negative margin top */
.-mt-1  {margin-top: -0.25rem;}
.-mt-2  {margin-top: -0.5rem;}
.-mt-3  {margin-top: -0.75rem;}
.-mt-4  {margin-top: -1rem;}
.-mt-5  {margin-top: -1.25rem;}
.-mt-6  {margin-top: -1.5rem;}
.-mt-7  {margin-top: -1.75rem;}
.-mt-8  {margin-top: -2rem;}
.-mt-9  {margin-top: -2.25rem;}
.-mt-10 {margin-top: -2.5rem;}
.-mt-12 {margin-top: -3rem;}
.-mt-14 {margin-top: -3.5rem;}
.-mt-16 {margin-top: -4rem;}
.-mt-20 {margin-top: -5rem;}
.-mt-24 {margin-top: -6rem;}
.-mt-28 {margin-top: -7rem;}
.-mt-32 {margin-top: -8rem;}

/* negative margin bottom */
.-mb-1  {margin-bottom: -0.25rem;}
.-mb-2  {margin-bottom: -0.5rem;}
.-mb-3  {margin-bottom: -0.75rem;}
.-mb-4  {margin-bottom: -1rem;}
.-mb-5  {margin-bottom: -1.25rem;}
.-mb-6  {margin-bottom: -1.5rem;}
.-mb-7  {margin-bottom: -1.75rem;}
.-mb-8  {margin-bottom: -2rem;}
.-mb-9  {margin-bottom: -2.25rem;}
.-mb-10 {margin-bottom: -2.5rem;}
.-mb-12 {margin-bottom: -3rem;}
.-mb-14 {margin-bottom: -3.5rem;}
.-mb-16 {margin-bottom: -4rem;}
.-mb-20 {margin-bottom: -5rem;}
.-mb-24 {margin-bottom: -6rem;}
.-mb-28 {margin-bottom: -7rem;}
.-mb-32 {margin-bottom: -8rem;}

/* negative margin left */
.-ml-1  {margin-left: -0.25rem;}
.-ml-2  {margin-left: -0.5rem;}
.-ml-3  {margin-left: -0.75rem;}
.-ml-4  {margin-left: -1rem;}
.-ml-5  {margin-left: -1.25rem;}
.-ml-6  {margin-left: -1.5rem;}
.-ml-7  {margin-left: -1.75rem;}
.-ml-8  {margin-left: -2rem;}
.-ml-9  {margin-left: -2.25rem;}
.-ml-10 {margin-left: -2.5rem;}
.-ml-12 {margin-left: -3rem;}
.-ml-14 {margin-left: -3.5rem;}
.-ml-16 {margin-left: -4rem;}
.-ml-20 {margin-left: -5rem;}
.-ml-24 {margin-left: -6rem;}
.-ml-28 {margin-left: -7rem;}
.-ml-32 {margin-left: -8rem;}

/* negative margin right */
.-mr-1  {margin-right: -0.25rem;}
.-mr-2  {margin-right: -0.5rem;}
.-mr-3  {margin-right: -0.75rem;}
.-mr-4  {margin-right: -1rem;}
.-mr-5  {margin-right: -1.25rem;}
.-mr-6  {margin-right: -1.5rem;}
.-mr-7  {margin-right: -1.75rem;}
.-mr-8  {margin-right: -2rem;}
.-mr-9  {margin-right: -2.25rem;}
.-mr-10 {margin-right: -2.5rem;}
.-mr-12 {margin-right: -3rem;}
.-mr-14 {margin-right: -3.5rem;}
.-mr-16 {margin-right: -4rem;}
.-mr-20 {margin-right: -5rem;}
.-mr-24 {margin-right: -6rem;}
.-mr-28 {margin-right: -7rem;}
.-mr-32 {margin-right: -8rem;}

/* Alignment */
.ctr {text-align: center;}
.bal {text-wrap: balance;}

/* Borders */
.bdr-1 {border-width: 1px;}
.bdr-t { border-top-width: 1px; }
.bdr-b { border-bottom-width: 1px; }
.bdr-blk {border-color: #020202;}
.bdr-blk\/5 {border-color: rgba(0, 0, 0, 0.05);}
.bdr-blk\/10 {border-color: rgba(0, 0, 0, 0.1);}
.bdr-wht {border-color: #fff;}
.bdr-wht\/10 {border-color: rgba(255, 255, 255, 0.1);}
.bdr-none {border-style: none;}

/* Effects */
.shadow-sm {box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);}
.shadow-md {box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);}
.shadow-lg {box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);}
.shadow-xl {box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);}
.shadow-2xl {box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);}
.backdrop-blur-sm {-webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);}
.backdrop-blur-md {-webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);}
.transition-all {transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms;}
.transition-colors {transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms;}
.transition-opacity {transition-property: opacity; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms;}
.duration-300 {transition-duration: 300ms;}
.duration-500 {transition-duration: 500ms;}

/* Utilities */
.hidden {display: none;}
@media (min-width: 1024px) {.lg\:flex {display: flex;} .lg\:hidden {display: none;} }
.upr {text-transform: uppercase;}
.ltr-spc-wider {letter-spacing:  0.05em;}

/* FONT SIZES */
.fnt-75 {font-size:0.75rem;}
.fnt-875 {font-size:0.875rem;} /* 14px */
.fnt-100 {font-size:1rem;}
.fnt-1125 {font-size:1.125rem;}
.fnt-125 {font-size:1.25rem;}
.fnt-150 {font-size:1.5rem;}
.fnt-175 {font-size:1.75rem;}
.fnt-200 {font-size: clamp(1.5rem, 3.5vw, 2rem);}
.fnt-225 {font-size:2.25rem;}
.fnt-250 {font-size:2.5rem;}
.fnt-275 {font-size:2.75rem;}
.fnt-300 {font-size:3rem;}
.fnt-325 {font-size:3.25rem;}
.fnt-350 {font-size:3.5rem;}
.fnt-375 {font-size:3.75rem;}
.fnt-400 {font-size:4rem;}
.fnt-425 {font-size:4.25rem;}
.fnt-450 {font-size:4.5rem;}
.fnt-475 {font-size:4.75rem;}
.fnt-500 {font-size:5rem;}
.fnt-600 {font-size:6rem;}
.fnt-700 {font-size:7rem;}
.fnt-800 {font-size:8rem;}
.fnt-900 {font-size:9rem;}
.fnt-1000 {font-size:10rem;}

/* LINE HEIGHTS */
/* lne-: 0.25 increments from 1.0 through 2.0 */
.lne-100 {line-height:1;}
.lne-125 {line-height:1.25;}
.lne-150 {line-height:1.5;}
.lne-1625 {line-height:1.625;}
.lne-175 {line-height:1.75;}
.lne-200 {line-height:2;}

.text-center {text-align: center;}
.italic {font-style: italic;}
.it-y {font-style: italic;}
.it-n {font-style: normal;}
.object-cover {object-fit: cover;}
.object-bottom {object-position: bottom;}
.overflow-hidden {overflow: hidden;}
.antialiased {-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.whitespace-nowrap {white-space: nowrap;}
.pointer-events-none {pointer-events: none;}

.blk {display: block;}
.blk-inl {display: inline-block;}

.leading-none {line-height: 1;}
.leading-tight {line-height: 1.25;}
.lne-150 {line-height: 1.625;}
.opacity-80 {opacity: 0.8;}
.opacity-0 {opacity: 0;}
.opacity-100 {opacity: 1;}

/* radius */
.rad-03 {border-radius: 3px;}
.rad-05 {border-radius: 5px;}
.rad-10 {border-radius: 10px;}

/* Custom Effects */
.drop-shadow-2xl {filter: drop-shadow(0 25px 25px rgba(0, 0, 0, 0.15));}

/* Interactive States */
.hover\:bg-wht:hover {background-color: #fff;}
.hover\:bg-blk:hover {background-color: #020202;}
.hover\:bg-accent:hover {background-color: #D31212;}
.hover\:text-accent:hover {color: #D31212;}
.hover\:text-wht:hover {color: #fff;}
.hover\:clr-blk:hover {color: #020202;}

a[href^="tel:"] {color: inherit; text-decoration: none;}
a[href^="tel:"]:hover {text-decoration: underline;}

/* =====================================================================
   MAIN NAVIGATION + LOGO  —  consolidated
   Global header / nav / logo base styles (the HOME-page look), gathered
   here from where they were previously scattered. Interior-page header
   overrides follow in the clearly-marked block immediately after this.
   ===================================================================== */
/* ---- Logo: two images, opacity + visibility switching. Visibility removes the
   hidden logo from the accessibility tree so a screen reader reads only one name. ---- */
/* (Wed, 06/10/2026) Claude Opus 4.8 */
header {background-color: #020202;}
#logo-wrap {position: relative; display: block; height: 180px;}
#logo-large {display: block; height: 180px; opacity: 1; visibility: visible; transition: opacity 0.15s ease, visibility 0s linear 0s;
filter: drop-shadow(0 25px 25px rgba(0,0,0,0.15));}
#logo-small {display: block; position: absolute; top: 0; left: 0; height: 50px; opacity: 0; visibility: hidden;pointer-events: none;
transition: opacity 0.15s ease, visibility 0s linear 0.15s; filter: drop-shadow(0 25px 25px rgba(0,0,0,0.15));}
.logo-is-small #logo-large {opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.15s ease, visibility 0s linear 0.15s;}
.logo-is-small #logo-small {opacity: 1; visibility: visible; pointer-events: auto; transition: opacity 0.15s ease, visibility 0s linear 0s;}
.logo-is-small #logo-wrap  {height: 50px;}

/* Navbar background + nav-overlay gradient */
.bg-white-solid {background-color: #fff !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;}
/* Direct gradient for nav overlay (relocated up from the old Version-17 area) */
.nav-gradient-bg {background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), transparent);}

/* Desktop + mobile menu link typography */
.nav-link, .mobile-link {text-decoration: none; font-size: 1.25rem; color: #fff; font-weight: 700;}
.nav-link {color: #fff; font-weight: 700; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8), 0 0 6px rgba(0, 0, 0, 0.4);}
.mobile-link {display: block; color: #f5f5f0; font-weight: 500; font-size: 22px; line-height: 1.3; padding: 0.85rem 0; border-top: 0.5px solid rgba(245, 245, 240, 0.22); text-decoration: none;}
.mobile-link:last-child {border-bottom: 0.5px solid rgba(245, 245, 240, 0.22);}
.nav-link:hover {color: #d31212;}
.mobile-link:hover, .mobile-link:active, .mobile-link:focus {color: #d31212;}

/* Scrolled state */
.navbar-scrolled .nav-link {color: #020202; font-weight: 500; text-shadow: none;}
.navbar-scrolled #mobile-toggle .bars {filter: none;}
/* Navbar bottom border for contrast */
.navbar-scrolled-border {border-bottom: 1px solid rgba(0,0,0,0.15);}

/* Mobile slide-out menu panel */
/* Mobile slide-out menu — full-height panel from right edge */
#mobile-menu {position: fixed; top: 0; right: 0; height: 100vh; height: 100dvh; width: 100%; max-width: 330px; background: #111; display: flex; flex-direction: column; align-items: stretch; padding: 5.5rem 2rem 2rem; box-shadow: -8px 0 24px rgba(0, 0, 0, 0.35); transform: translateX(100%); visibility: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; z-index: 9990; transition: transform 0.3s ease-in-out, visibility 0s linear 0.3s;}
/* Keep the panel rendered when closed (not display:none) so it can animate */
#mobile-menu.hidden {display: flex; transform: translateX(100%); visibility: hidden;}
#mobile-menu.active {display: flex; transform: translateX(0); visibility: visible; transition: transform 0.3s ease-in-out, visibility 0s;}

/* Hamburger toggle */
/* Hamburger icon as three bars; classic morph to an X when the menu is open */
#mobile-toggle .bars {position: relative; display: block; width: 40px; height: 40px; filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.8)) drop-shadow(0 0 6px rgba(0, 0, 0, 0.4));}
#mobile-toggle .bar {position: absolute; left: 6px; width: 28px; height: 3px; background: currentColor; border-radius: 2px; transform-origin: center; transition: top 0.3s ease-in-out, transform 0.3s ease-in-out, opacity 0.3s ease-in-out;}
#mobile-toggle .bar1 {top: 13px;}
#mobile-toggle .bar2 {top: 20px;}
#mobile-toggle .bar3 {top: 27px;}
#navbar.menu-open #mobile-toggle .bar1 {top: 20px; transform: rotate(45deg);}
#navbar.menu-open #mobile-toggle .bar2 {opacity: 0;}
#navbar.menu-open #mobile-toggle .bar3 {top: 20px; transform: rotate(-45deg);}

/* Mobile toggle colour (state-driven) */
/* Mobile toggle colour, driven by state classes (previously set inline by JS) */
#mobile-toggle {color: #fff;}
.navbar-scrolled #mobile-toggle {color: #020202;}
#navbar.menu-open #mobile-toggle {color: #f5f5f0;}

/* Responsive breakpoints for the nav */
/* Mobile Menu Critical Fix */
@media (max-width: 1024px) {
#logo-wrap  {height: 140px;}
#logo-large {height: 140px;}
#mobile-toggle {display: block !important; visibility: visible !important; opacity: 1 !important; z-index: 9999 !important;}
/* When the menu is open, pin the close (X) to the panel's top-right so it isn't
   offset by the centered nav container or pushed down by the tall logo */
#navbar.menu-open #mobile-toggle {position: fixed; top: 1.25rem; right: 1.5rem;}
.lg\:flex {display: none !important;}
}

@media (max-width: 480px) {#mobile-menu .text-2xl {font-size: 1.25rem; line-height: 1.75rem;}}

/* =====================  END MAIN NAVIGATION + LOGO  ===================== */

/* Main content offset below the fixed header. Only interior <main> carries
   .page-body (home offsets its own hero), so no scoping is needed.
   142px = 110px logo + 2 x 1rem padding. */
.page-body {padding-top: 142px; padding-bottom: 75px;}
@media (max-width: 600px) {.page-body {padding-top: 130px;}}

/* ---- Sitewide CTA button colour variants ---- */
.cta-red {background-color: #d31212; color: #fff;}
.cta-red:hover {background-color: #fff; color: #d31212;}
.cta-wht {background-color: #fff; color: #020202;}
.cta-wht:hover {background-color: #d31212; color: #fff;}

a.undl-no {text-decoration: none !important;}
a.undl-y {text-decoration: underline !important;}

/* #####################################################################
   INTERIOR-PAGE NAV / HEADER OVERRIDES  —  START
   Formerly the separate file interior-header-sub-pgs.css, now merged in.
   Every selector is scoped with  body:not(#homepg)  so these apply on
   EVERY page EXCEPT the home page (home uses <body id="homepg">).
   :not() with a single #id is safe back to IE9, so it clears the IE11 floor.
   ##################################################################### */
/* Opaque white header at rest (home header is transparent over the hero) */
body:not(#homepg) #navbar {background-color: #fff;}
/* No gradient on interior pages: hide the element and null the gradient class */
body:not(#homepg) #nav-gradient {display: none;}
body:not(#homepg) .nav-gradient-bg {background-image: none;}
/* Desktop nav links: black, no shadow, red on hover */
body:not(#homepg) .nav-link {color: #020202; text-shadow: none;}
body:not(#homepg) .nav-link:hover {color: #d31212;}
/* Cancel the home's -mt-6 (which aligned links to the taller home logo) */
body:not(#homepg) #standard-menu {margin-top: 0;}
/* "Large" logo capped at 110px at every width */
body:not(#homepg) #logo-wrap {height: 110px;}
body:not(#homepg) #logo-large {height: 110px;}
/* Logos are always on white here, so drop the drop-shadow */
body:not(#homepg) #logo-large, body:not(#homepg) #logo-small {filter: none;}
@media (max-width: 1024px) {
body:not(#homepg) #logo-wrap {height: 110px;}
body:not(#homepg) #logo-large {height: 110px;}
}
/* On scroll the JS shows the 50px #logo-small; shrink ONLY the wrap so the bar
   collapses to ~70px and the logo centers. Must out-specify the 110px cap above.
   Deliberately do NOT shrink #logo-large: it stays in-flow (hidden) at its cap so
   the wrap keeps its natural width — otherwise the global img max-width:100% would
   clamp the absolutely-positioned #logo-small and distort its 120x50 ratio.
   (Mirrors the home page, which shrinks the wrap only.) */
body:not(#homepg) .logo-is-small #logo-wrap {height: 50px;}
/* Mobile toggle: black bars, no shadow (no photo behind them here) */
body:not(#homepg) #mobile-toggle {color: #020202;}
body:not(#homepg) #mobile-toggle .bars {filter: none;}
/* #####  INTERIOR-PAGE NAV / HEADER OVERRIDES  —  END  ##### */


/* FOOTER */
footer { background-image: url(/_img/ele/bkgd-ftr.jpg); background-repeat: no-repeat; background-position: center top; }
/* Widen the container for the footer only, to give #footer-grid room for padding */
footer .container {max-width: 1440px;}
/* White grid box padding */
#footer-grid {padding: 20px 30px;}
.footer-text {font-size: 16px !important; font-style: normal !important; color: #4b5563;}
footer a {color: #4b5563; text-decoration: none;}
footer a:hover {text-decoration: underline;}

/* ============================================================
   FOOTER BREAKPOINT — stack and center at 768px (matches md: columns)
   ============================================================ */
@media (max-width: 768px) {#footer-grid {grid-template-columns: 1fr; text-align: center; gap: 2.5rem; max-width: 360px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px;}
#footer-grid address, #footer-grid .footer-text, #footer-grid .space-y-2, #footer-grid .space-y-4 {text-align: center;}
#footer-grid h3, #footer-grid h4 {text-align: center;}
}
/* Footer bottom bar: hide border and tighten spacing when stacked */
@media (max-width: 767px) {footer .container > div:last-child {border-top-width: 0; gap: 0.25rem;}}

/* ============================================================
   VERSION 17 ADDITIONS — Arbitrary value replacements,
   missing utilities, compat fixes, and ticker styles
   ============================================================ */

/* Arbitrary value replacements */
.min-w-220 {min-width: 220px;}
.bg-off-white {background-color: #fdfcfb;}

/* Flex utilities */
.flex-1 {flex: 1 1 0%;}
.flex-2 {flex: 2 1 0%;}
.flex-grow {flex-grow: 1;}
.justify-start {justify-content: flex-start;}
.mx-auto {margin-left: auto; margin-right: auto;}

/* Sizing */
.h-auto {height: auto;}
.max-w-xs {max-width: 20rem;}
.max-w-4xl {max-width: 56rem;}

/* Z-index */
.-z-10 {z-index: -10;}

/* Interactive */
.cursor-pointer {cursor: pointer;}
.outline-none {outline: none;}

/* Flex order */
.order-1 {order: 1;}
.order-2 {order: 2;}
@media (min-width: 768px) {
.md\:order-1 {order: 1;}
.md\:order-2 {order: 2;}
.md\:flex-row {flex-direction: row;}
}
@media (min-width: 1024px) {
.lg\:flex-row {flex-direction: row;}
.lg\:gap-16 {gap: 4rem;}
}

/* ACCESSIBILITY */
.skip-link {position: fixed; top: -100px; left: 50%; transform: translateX(-50%); background: #1d5c9e; color: #fff; padding: 12px 28px; font-size: 16px;
font-weight: 700; text-decoration: none; z-index: 10000; border-radius: 0 0 6px 6px; letter-spacing: 0.5px; transition: top 0.2s ease; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);}
.skip-link:focus {top: 0; outline: none; box-shadow: 0 4px 16px rgba(74, 144, 217, 0.6);}

/* IMAGE ZOOM - SITEWIDE */
/* (Mon, 06/08/2026) Claude Opus 4.8 */
.iz-thumb {display: inline-block; margin: 0 12px 12px 0; padding: 0; border: 0; background: none; cursor: pointer; line-height: 0;}
.iz-thumb img {display: block;}
.iz-box {position: fixed; top: 50%; left: 50%; z-index: 1000; max-width: 90vw; background: #000000; box-shadow: 0 4px 18px rgba(0, 0, 0, 0.45); opacity: 0;
 visibility: hidden; pointer-events: none; transform: translate(-50%, -50%) scale(0.92); transition: opacity 0.18s ease-out, transform 0.18s ease-out, visibility 0.18s;}
.iz-box.iz-open {opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, -50%) scale(1);}
@media (prefers-reduced-motion: reduce) {
.iz-box {transition: none; transform: translate(-50%, -50%);}
.iz-box.iz-open {transform: translate(-50%, -50%);}
}
.iz-large {display: block; max-width: 90vw; max-height: 72vh; width: auto; height: auto;}
.iz-caption {margin: 0; padding: 8px 12px; background: #000000; color: #ffffff; font-family: sans-serif; font-size: 14px; line-height: 1.3;}
.iz-close {position: absolute; top: 0; right: 0; width: 34px; height: 34px; margin: 0; padding: 0; border: 0; background: #000000; color: #ffffff; font-family: sans-serif;
font-size: 22px; line-height: 34px; text-align: center; cursor: pointer;}
.iz-close:hover, .iz-close:focus {background: #333333; outline: none;}

@media print {
.skip-link {display:none !important;}    
}

/* SECTION IMAGE */
.section-image {margin: 0 auto 2rem auto; max-width: 580px;}
.section-image img {display: block; width: 100%; max-width: 100%; height: auto;} 
.section-image figcaption {margin-top: 0.5rem; font-size: 0.95rem; text-align: center;}

.hours-block {padding: 18px 15px 0; border: 1px solid #de1212; border-radius: 3px; max-width: 560px; margin-left: 0; margin-right: auto;}

/* ---- Large photo capped at 580 square, centered in its column ---- */
.photo-block-580 {max-width: 580px; margin-left: auto; margin-right: auto;}