html, body {
  min-height: 100vh;
}
body {
  display: flex;
  flex-direction: column;
}

img.fade-in {
  opacity: 0;
  transition: opacity .6s;
}
img.loaded {
  opacity: 1 !important;
}

/*

added in index.php

 */
.big-h1 {
    font-size: 3rem;
}

@media (min-width:1000px) {
    .big-h1 {
        font-size: 5rem;
    }
}

.icon-filter {
    filter: brightness(0) saturate(100%) invert(74%) sepia(20%) saturate(441%) hue-rotate(348deg) brightness(91%) contrast(80%);
}

.icon-size {
    max-width: 100%;
    width: 70px;
}
@media (min-width:1200px) {
  .icon-size {
    width: 90px;
  }
}

#arms-race-storepoint #storepoint-container #storepoint-panel,
#arms-race-storepoint #storepoint-container #storepoint-map {
    border: 1px solid var(--dominos-dough-700) !important;
    border-radius: var(--dominos-radius-lg);
    overflow: hidden;
}
#arms-race-storepoint #storepoint-container #storepoint-map {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0 !important;
  margin: 0 !important;
}
#arms-race-storepoint #storepoint-container #storepoint-panel {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-top: 0 !important;
}

@media (min-width:768px) {
  #arms-race-storepoint #storepoint-container #storepoint-panel,
  #arms-race-storepoint #storepoint-container #storepoint-map {
      border: 1px solid var(--dominos-dough-700) !important;
      border-radius: var(--dominos-radius-lg);
  }
    #arms-race-storepoint #storepoint-container #storepoint-panel {
        border-right: 0 !important;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    #arms-race-storepoint #storepoint-container #storepoint-map {
        border-left: 0 !important;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
}

/*

added in how-it-works.php

 */

details summary {
  font-weight: 700; /* WCAG 1.4.3: bold + font-size >= 1rem qualifies Large Text bold at 14pt+ — relaxes contrast to 3:1 */
  font-size: 1.25rem;
  cursor: pointer;
}

.img-banner {
    object-fit: cover !important;
    width: 100%;
}

.sidebar-nav {
  text-align: center;
}
.sidebar-nav:before {
    content: "Jump To";
    display: block;
    text-transform: uppercase;
    font-size: 11px;
    padding: .2rem .5rem;
}

.sidebar-nav a {
    border: 1px solid var(--dominos-dough-700);
    border-radius: 999rem;
    color: var(--dominos-blue-accessible);
    display: inline-block;
    font-size: 14px;
    letter-spacing: .02em;
    line-height: 1.2;
    margin: 0 5px 5px 0;
    padding: .45rem .5rem;
    text-decoration: none;
    text-transform: uppercase;
    transition: all .2s;
    white-space: nowrap;
}

.sidebar-nav a:hover,
.sidebar-nav a.active {
    background-color: #fff;
}

@media (min-width: 768px) {
  .sidebar-nav {
    text-align: left;
  }
    .sidebar-nav:before {

    }

    .sidebar-nav a {
      border-radius: 0;
      border-width: 1px 0;
      display: block;
      margin: 0;
      white-space: normal;
    }

    .sidebar-nav a+a {
      border-top: 0;
    }
}

/* The legacy .tshirt-slideshow / .slick-* rules used to live here.
   Removed when how-it-works.php migrated to Embla — those styles now live inline
   in how-it-works.php under the .embla-slideshow scope. */

figure.frame {
  background-color: var(--dominos-dough-700);
  border: var(--bs-border-width) var(--bs-border-style) var(--dominos-dough-700) !important;
  border-radius: var(--dominos-radius-lg);
  overflow: hidden;
}
figure.frame img {
  max-width: 100%;
}
figure.frame figcaption {
  color: var(--dominos-lava-1100); /* WCAG 1.4.3: #472b10 on #c0a58b = 5.81:1 — passes 4.5:1 normal text; white (#fff) was only 2.33:1 and failed even Large Text 3:1 threshold */
  font-size: 1rem;
  line-height: 1.3;
  padding: 0.5em 0.5em 0.65em;
  text-align: center;
}
figure.frame figcaption a {
  /* text-decoration: underline; */
}

.rich-text ul ul,
.rich-text ol ol,
.rich-text ul ol,
.rich-text ol ul,
main li > ul:not([class]),
main li > ol:not([class])
{
  margin-top: .5em;
}
/* The same spacing for the plain unclassed lists in the page copy, which the .rich-text wrapper
   never reached, plus one line-height for both. :not([class]) keeps it off the navbar, the
   footer nav and the FAQ accordion -- component lists all carry a class (Kirk, 2026-09-01). */
.rich-text li,
main ul:not([class]) > li,
main ol:not([class]) > li {
  line-height: 1.3;
  margin-bottom: .5em;
}

/* The copyright bar reads at body size rather than one notch down -- it is a real footer row,
   not fine print (Kirk, 2026-09-01). */
.site-copyright,
.site-copyright small {
  font-size: 1rem;
}

/* One centered inline run -- policy links, copyright, icon attribution -- so it wraps as a
   single block on narrow screens instead of splitting into columns. Each phrase is nowrap so a
   wrap only ever lands on a separator, never inside "Terms & Conditions". */
.site-copyright a,
.site-copyright .site-copyright-item {
  display: inline-block;
  white-space: nowrap;
}

/* Inherit the bar's own light text instead of the brand link color, which is far too dark on
   bg-dark; the underline carries the affordance. */
.site-copyright a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.2em;
  text-decoration-thickness: 1px;
}
.site-copyright a:hover,
.site-copyright a:focus-visible {
  color: #fff;
  text-decoration-thickness: 2px;
}

/* 0.6 is the lowest that clears 4.5:1 on bg-dark; 0.5 tripped the monthly contrast scan. */
.site-copyright-sep {
  opacity: 0.6;
  padding: 0 0.35rem;
}

/*

added on i-want-to-run-a-fundraiser

 */

/* open close (texter) accordion markup */
:root {
  --open-close-icon-size: 36px;
  --open-close-padding: 1rem;
}
.faq-q {
  margin: 0;
  padding: 0;
  /* font-size: inherit;  */
}
.faq-trigger{
  appearance: none;
  background: transparent;
  border-radius: var(--dominos-radius-lg);
  border: 1px solid var(--dominos-form-border); /* 3.21:1 vs white — passes WCAG 1.4.11 (3:1 UI); was --dominos-dough-300 at 1.24:1 */
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease;
  cursor: pointer;
  width: 100%;
  text-align: left;
  font: inherit;
  font-weight: 700;      /* WCAG 1.4.3: combined with h2 inherited size (>=1.5rem = 18pt) this qualifies as Large Text via 14pt-bold OR 18pt-regular — relaxes contrast threshold to 3:1 which brand blue passes */
  align-items: center;
  color: var(--dominos-blue);
  display: flex;
  gap: var(--open-close-padding);
  padding: var(--open-close-padding);
}
.faq-trigger:hover{
  background-color: #fff;
}
.faq-trigger:focus-visible{
  outline: 2px solid var(--dominos-blue);
  outline-offset: 2px;
}
.opener-icon{
  align-items: center;
  box-sizing: border-box;
  width: var(--open-close-icon-size);
  height: var(--open-close-icon-size);
  flex: var(--open-close-icon-size) 0 0;
  line-height: 1;
  border-radius: 999px;
  border: 1px solid var(--dominos-form-border); /* 3.21:1 vs white — WCAG 1.4.11 */
  display: inline-flex;
  font-variation-settings: "wdth" 100;
  justify-content: center;
  transition: transform .18s ease, box-shadow .18s ease;
  user-select: none;
}
.faq-trigger.is-open{
  border-radius: var(--dominos-radius-lg) var(--dominos-radius-lg) 0 0;
  background: #fff;
  border-bottom: 0;
}
.faq-trigger.is-open .opener-icon{
  transform: rotate(45deg);
}
.texter{
  display: none;
  border-radius: 0 0 var(--dominos-radius-lg) var(--dominos-radius-lg);
  border: 1px solid var(--dominos-form-border); /* 3.21:1 vs white — WCAG 1.4.11 */
  border-top: 0;
  background: #fff;
  padding: 0.5rem calc(2 * var(--open-close-padding)) calc(2 * var(--open-close-padding)) calc((2 * var(--open-close-padding)) + var(--open-close-icon-size));
}
.texter + .faq-q {
  margin-top: 1rem;
}
.texter > :first-child {
  margin-top: 0;
}
.texter > :last-child {
  margin-bottom: 0;
}
.texter + .faq-trigger {
  margin-top: 1rem;
}
@media (max-width:520px){
  :root {
    --open-close-icon-size: 24px;
    --open-close-padding: 0.75rem;
  }
}
@media print {
  .texter {
    display: block;
  }
}


/*

added in /contact

*/

/* cognito forms */

html .cog-cognito .el-input__inner,
html .cog-cognito .el-textarea__inner,
:root:root:root:root:root .cog-cognito .el-input__inner,
:root:root:root:root:root .cog-cognito .el-textarea__inner
{
  background-color: var(--dominos-form-control-bg);
  border: 1px solid var(--dominos-lava-800);
  border-radius: var(--dominos-radius-lg);
  padding: .5rem .75rem !important;
}
html .cog-cognito .el-input__inner:focus,
html .cog-cognito .el-textarea__inner:focus,
:root:root:root:root:root .cog-cognito .el-input__inner:focus,
:root:root:root:root:root .cog-cognito .el-textarea__inner:focus {
  background-color: #fff;
}
html .cog-toggle--native,
:root:root:root:root:root .cog-toggle--native
{
  padding: .5rem 0 !important;
}
html .cog-toggle--native [type=range],
:root:root:root:root:root .cog-toggle--native [type=range]
{
  margin: 0 .3rem !important;
}
.cog-upload .el-button
{
  padding: 10px 20px !important;
}
html .cog-checkable .el-radio__label.el-radio__label,
html .cog-checkable .el-checkbox__label.el-checkbox__label,
:root:root:root:root:root .cog-checkable .el-radio__label.el-radio__label,
:root:root:root:root:root .cog-checkable .el-checkbox__label.el-checkbox__label
{
  margin-left: 3px;
}
.cog-page__navigation {
  justify-content: center !important;
}
.cog-button {
  border-radius: var(--dominos-button-radius);
  box-sizing: border-box;
  cursor: pointer;
  font-family: var(--dominos-font-title) !important;
  font-variation-settings: "wght" 700, "wdth" 50, "slnt" 0 !important;
  letter-spacing: 0;
  text-align: center;
  text-decoration: none;
  transition: all .2s !important;
  appearance: none;
  -webkit-appearance: none;
  background-color: var(--dominos-red) !important;
  border: 1px solid var(--dominos-red);
  color: var(--dominos-dough-100) !important;
  display: inline-block;
  font-size: 1.2rem !important;
  line-height: 1.2;
  padding: 1rem 2rem;
}
.cog-button--secondary {
  background-color: var(--dominos-blue) !important;
  border-color: var(--dominos-blue);
  color: var(--dominos-dough-100) !important;
}
.cog-upload {
  background-color: var(--dominos-form-control-bg) !important;
  border: 1px solid var(--dominos-lava-800) !important;
  border-radius: var(--dominos-radius-lg) !important;
}
html .cog-upload .el-upload-dragger>div, :root:root:root:root:root .cog-upload .el-upload-dragger>div {
  background-color: transparent !important;
}
.cog-cognito input[type="radio"] {
  height: 1.4rem; /* set this to the same as the body line-height */
}
select + .el-input__suffix {
  display: none !important;
}

/* ── Gallery slideshow (Embla carousel) + clickable card affordance ─────────
   Lifted verbatim from stpwindows/results.php <style> block — single source
   of truth; keep in sync when changing either file.
   ────────────────────────────────────────────────────────────────────────── */

/* Pre-init CLS avoidance: reserve 3:1 aspect ratio and hide extra slides until Embla wraps them. */
.header-slideshow:not(.embla-initialized) > *:not(:first-child) { display:none; }
.header-slideshow:not(.embla-initialized) { aspect-ratio:3/1; max-height:450px; overflow:hidden; }
/* Embla layout — from embla-carousel.com/examples/predefined, Dominos palette */
.embla__viewport { overflow: hidden; }
.embla__container { display: flex; touch-action: pan-y pinch-zoom; }
.embla__slide { transform: translate3d(0,0,0); flex: 0 0 100%; min-width: 0; }
.embla__slide > * { width: 100%; display: block; }
.embla__controls {
  display: grid;
  grid-template-columns: auto 1fr;
  justify-content: space-between;
  gap: 0.8rem;
  margin-top: 0.75rem;
}
.embla__buttons {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 0.4rem; align-items: center;
}
.embla__btn {
  -webkit-appearance: none;
  appearance: none;
  background-color: transparent;
  touch-action: manipulation;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
  padding: 0;
  margin: 0;
  width: 2.75rem;
  height: 2.75rem;
  border: 0.1rem solid var(--dominos-form-border);
  border-radius: 50%;
  color: var(--dominos-lava-1000);
}
.embla__btn--disabled { color: var(--dominos-dough-700); border-color: var(--dominos-dough-300); }
.embla__btn svg { width: 55%; height: 55%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.embla__dots {
  display: flex; flex-wrap: wrap; justify-content: flex-end;
  align-items: center;
  margin-right: calc((1.8rem - 0.9rem) / 2 * -1);
}
.embla__dot {
  -webkit-appearance: none; appearance: none;
  background-color: transparent; touch-action: manipulation;
  cursor: pointer; border: 0; padding: 0; margin: 0;
  width: 2.75rem; height: 2.75rem;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; position: relative;
}
.embla__dot:before, .embla__dot:after {
  --size: 0.7rem;
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  position: absolute; display: flex; align-items: center; content: '';
}
.embla__dot:before {
  border: 0.15rem solid var(--dominos-dough-300);
  border: 0;
  background-color: var(--dominos-dough-300)
}
.embla__dot:after {
  border: 0.15rem solid var(--dominos-lava-1000);
  border: 0;
  background-color: var(--dominos-lava-1000);
  opacity: 0;
}
.embla__dot--selected:after { opacity: 1; }
.header-slideshow:not(.multiimage) .embla__controls { display: none; }

.intrinsic-holder{position:relative;overflow:hidden}.intrinsic-holder>img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}

/* Clickable card affordance — homepage group-type icon cards */
a.card[href]{transition:transform .18s ease, box-shadow .18s ease; cursor:pointer}
a.card[href]:hover,a.card[href]:focus-visible{transform:translateY(-4px);}
a.card[href]:focus-visible{outline:2px solid var(--dominos-blue); outline-offset:2px}

/* Hero video tile: the shared .vid-tile from dominos-bootstrap-overrides.css with a bigger
   button and a cover-fit poster (the hero's poster is already 16:9). */
#hero-video-holder .vid-poster{object-fit:cover}
#hero-video-holder .vid-play{width:84px;height:84px;margin:-42px 0 0 -42px}
#hero-video-holder .vid-play::after{border-width:15px 0 15px 26px}

/* ── Steady-height fade carousel ─────────────────────────────────────────────
   Add .carousel-steady next to .carousel-fade and the carousel holds the height of its TALLEST
   slide, instead of growing and shrinking with each slide's text. Every slide sits in the same grid
   cell, so they all count toward the height; slides that are not showing (or fading) are
   visibility:hidden, which keeps their space but hides them from clicks, Tab and screen readers. */
.carousel-steady .carousel-inner {
  display: grid;
}
.carousel-steady .carousel-item {
  display: block;
  grid-area: 1 / 1;
  margin-right: 0;
}
.carousel-steady .carousel-item:not(.active):not(.carousel-item-next):not(.carousel-item-prev) {
  visibility: hidden;
}

/* The testimonial slider (includes/testimonials-slider.php) fades over a full second. */
#reviews-carousel .carousel-item {
  transition: opacity 1s ease-in-out !important;
}