/* ---------------------------------------------------------
   SAFE & SOUND — ADU SERIES 352828
   Namespaced, builder-facing, quiet, structural
   --------------------------------------------------------- */

.sascadu-body {
  font-family: system-ui, sans-serif;
  background: #;
  color: #222;
  margin: 0;
  padding: 0;
}

.sascadu-body {
  background: rgba(245, 244, 242, 0.85); /* slightly transparent */
}


/* Shared container */
.sascadu-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px;
}

/* Section spacing */
.sascadu-page section {
  padding: 80px 0;
}

@media (max-width: 700px) {
  .sascadu-page section {
    padding: 60px 0;
  }
}

/* ---------------------------------------------------------
   HEADINGS
   --------------------------------------------------------- */

.sascadu-page h1,
.sascadu-page h2,
.sascadu-page h3 {
  font-weight: 500;
  letter-spacing: 0.5px;
  margin-top: 0;
  color: #1f1f1f;
}

.sascadu-page h1 {
  font-size: 0.9rem;
  margin-bottom: 0.5rem;
}

.sascadu-page h2 {
  font-size: 1.9rem;
  margin-bottom: 1.5rem;
}

.sascadu-page h3 {
  font-size: 1.25rem;
  margin-bottom: 0.5rem;
}

/* ---------------------------------------------------------
   INTRO TEXT
   --------------------------------------------------------- */

.sascadu-intro {
  font-size: 0.9rem;
  max-width: 700px;
  line-height: .9;
  color: #444;
}

/* ---------------------------------------------------------
   FRAMING + VALUE
   --------------------------------------------------------- */

.sascadu-framing p,
.sascadu-value p {
  max-width: 750px;
  line-height: 1.6;
  margin-bottom: 1.2rem;
  color: #333;

}

/* ---------------------------------------------------------
   CATALOG GRID
   --------------------------------------------------------- */

.sascadu-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-top: 40px;
}

@media (max-width: 900px) {
  .sascadu-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .sascadu-grid {
    grid-template-columns: 1fr;
  }
}

.sascadu-card {
  background: #ffffff;
  border: 1px solid #ddd;
  padding: 24px;
  border-radius: 8px;
}

.sascadu-card p {
  margin: 0.5rem 0 1rem;
  color: #555;
}

.sascadu-image {
  background: #e7e5e2;
  height: 160px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  font-size: 1rem;
  letter-spacing: 0.5px;
}


















/* ---------------------------------------------------------
   SAFE & SOUND — LIGHTBOX (FINAL, CLEAN, GHOST-FREE)
   --------------------------------------------------------- */

.sascadu-lightbox.hidden {
  display: none;
}

.sascadu-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 3rem 1rem;
  z-index: 99999;
  overflow-y: auto;
}

/* Close button */
.sascadu-lightbox-close {
  position: fixed;
  top: 20px;
  right: 30px;
  font-size: 2rem;
  color: white;
  cursor: pointer;
  z-index: 100000;
}

/* Image groups */
.sascadu-lightbox-content figure {
  margin: 0 0 2.5rem 0;
  text-align: center;
}

/* Images */
.sascadu-lightbox-content img {
  width: 100%;
  max-width: 700px;
  height: auto;
  border-radius: 4px;
  margin: 0 auto 1.5rem auto;
  display: block;
}

/* Captions */
.sascadu-lightbox-content figcaption {
  font-size: 0.85rem;
  color: #dcdcdc;
  margin-top: 0.5rem;
  opacity: 0.8;
}


















.refuge-gallery {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.92);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 3rem 1rem;
  z-index: 99999;
}

.refuge-gallery.hidden {
  display: none;
}

.refuge-gallery-frame {
  text-align: center;
  max-width: 900px;
}

.refuge-gallery-frame img {
  width: 100%;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 0 40px rgba(0,0,0,0.6);
}

.refuge-gallery-frame figcaption {
  margin-top: 1rem;
  font-size: 1rem;
  color: #e6e6e6;
  opacity: 0.9;
}

/* Close button */
.refuge-gallery-close {
  position: fixed;
  top: 30px;
  right: 40px;
  font-size: 3rem;
  color: white;
  cursor: pointer;
  z-index: 100000;
}

/* Arrows */
.refuge-gallery-arrow {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  font-size: 3rem;
  color: white;
  background: none;
  border: none;
  cursor: pointer;
  padding: 1rem;
  opacity: 0.8;
  transition: opacity 0.2s ease;
  z-index: 100000;
}

.refuge-gallery-arrow:hover {
  opacity: 1;
}

.refuge-gallery-arrow.left {
  left: 40px;
}

.refuge-gallery-arrow.right {
  right: 40px;
}

 


















/* MODAL BASE */
.sascadu-modal.hidden {
  display: none;
}

.sascadu-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.75);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 4rem 1rem;
  z-index: 99990;
  overflow-y: auto;
}

/* MODAL CONTENT */
.sascadu-modal-content {
  background: #f5f2e9;
  color: #424035;
  max-width: 800px;
  width: 100%;
  padding: 2.5rem;
  border-radius: 8px;
  box-shadow: 0 0 40px rgba(0,0,0,0.4);
}

/* CLOSE BUTTON */
.sascadu-modal-close {
  position: absolute;
  top: 30px;
  right: 40px;
  font-size: 2.5rem;
  color: white;
  cursor: pointer;
  z-index: 100000;
}

/* TYPOGRAPHY */
.sascadu-modal-content h2 {
  margin-top: 0;
  font-size: 2rem;
  font-weight: 600;
}

.sascadu-modal-content h3 {
  margin-top: 2rem;
  font-size: 1.3rem;
  font-weight: 600;
}

.sascadu-model-identity {
  font-size: 1.1rem;
  margin-bottom: 1rem;
  opacity: 0.9;
}

.sascadu-model-description {
  line-height: 1.6;
  margin-bottom: 2rem;
}

/* LISTS */
.sascadu-spec-list,
.sascadu-use-list {
  margin: 1rem 0 2rem 1.2rem;
  padding: 0;
}

.sascadu-spec-list li,
.sascadu-use-list li {
  margin-bottom: 0.5rem;
}

/* GALLERY BUTTON */
.sascadu-open-gallery {
  background: #424035;
  color: #f5f2e9;
  padding: 0.75rem 1.25rem;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  margin-bottom: 1rem;
}

.sascadu-open-gallery:hover {
  background: #2f2d26;
}




 




.sascadu-model-hero {
  margin: 1.5rem 0 2rem 0;
  text-align: center;
}

.sascadu-model-hero img {
  width: 100%;
  max-width: 700px;
  border-radius: 6px;
  display: block;
  margin: 0 auto;
}

.sascadu-model-hero figcaption {
  font-size: 0.9rem;
  color: #555;
  margin-top: 0.5rem;
  opacity: 0.85;
}

.sascadu-open-gallery {
  background: #f05253;
  color: #fff;
  padding: 0.75rem 1.25rem;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  margin-bottom: 1rem;
}

.sascadu-open-gallery:hover {
  background: #d64546;
}
#sentinel-hero {
  transition: opacity 1s ease;
}

.sascadu-hero-fade {
  opacity: 0;
}


/* ---------------------------------------------------------
   BUILDER VIDEO
   --------------------------------------------------------- */

.sascadu-video-embed {
  margin-top: 24px;
}

.sascadu-video-embed video {
  width: 100%;
  max-width: 900px;
  border-radius: 8px;
  display: block;
  margin: 0 auto;
}

/* ---------------------------------------------------------
   NEXT STEPS GRID
   --------------------------------------------------------- */

.sascadu-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  margin-top: 40px;
}

@media (max-width: 900px) {
  .sascadu-steps-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .sascadu-steps-grid {
    grid-template-columns: 1fr;
  }
}

.sascadu-step {
  background: #ffffff;
  border: 1px solid #ddd;
  padding: 24px;
  border-radius: 8px;
}

.sascadu-step p {
  color: #444;
  line-height: 1.55;
}

.sascadu-step-contact {
  margin-top: 0.75rem;
  font-weight: 600;
  color: #1f1f1f;
}

/* ---------------------------------------------------------
   DELIVERY & CREW
   --------------------------------------------------------- */

.sascadu-delivery p,
.sascadu-crew p {
  max-width: 750px;
  line-height: 1.6;
  color: #333;
}

/* ---------------------------------------------------------
   PILLS (Back / Request)
   --------------------------------------------------------- */

.sascadu-pill {
  display: inline-block;
  padding: 12px 22px;
  margin-right: 12px;
  border-radius: 50px;
  background: #b7f2d0;
  color: #1a1a1a;
  text-decoration: none;
  font-weight: 500;
  transition: background 0.2s ease;
}

.sascadu-pill:hover {
  background: #a2e8c2;
}

/* ---------------------------------------------------------
   FOOTER IDENTITY
   --------------------------------------------------------- */

.sascadu-utah {
  font-size: 1rem;
  color: #555;
  letter-spacing: 0.4px;
  text-align: center;
}






/* Center section headers and intro blocks */
.sascadu-identity h1,
.sascadu-identity .sascadu-intro,
.sascadu-framing h2,
.sascadu-value h2,
.sascadu-catalog h2,
.sascadu-catalog-intro,
.sascadu-builder-video h2,
.sascadu-video-intro,
.sascadu-nextsteps h2,
.sascadu-next-intro,
.sascadu-delivery h2,
.sascadu-crew h2,
.sascadu-return,
.sascadu-identity-footer {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

 

/* Center the paragraph blocks without centering the text */
.sascadu-framing p,
.sascadu-value p,
.sascadu-delivery p {
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
  text-align: left; /* keep the authored rag */
}

/* The Crew copy should be centered (cinematic beat) */
.sascadu-crew p {
  text-align: center !important;
  margin-left: auto;
  margin-right: auto;
}




/**************************cinematics*****************************/

.sascadu-card--focused {
  grid-column: 1 / -1;
  background: #fefefe;
  box-shadow: 0 0 0 4px #b7f2d0;
  transform: scale(1.02);
  transition: all 0.3s ease;
}

const params = new URLSearchParams(window.location.search);
const model = params.get('model');
if (model) {
  const target = document.querySelector(`.sascadu-card[data-model="${model}"]`);
  if (target) {
    target.classList.add('sascadu-card--focused');
    setTimeout(() => {
      target.scrollIntoView({ behavior: 'smooth', block: 'center' });
    }, 300);
  }
}








/*************************everything below this is for if i keep big headings***********************************/

/*************************everything below this is for if i keep big headings***********************************/

/*************************everything below this is for if i keep big headings***********************************/

/* Add spacing when pills stack on mobile */
@media (max-width: 600px) {
  .sascadu-pill {
    display: block;
    margin: 12px auto;
    text-align: center;
  }
}

/* Add spacing when pills stack on mobile */
@media (max-width: 600px) {
  .sascadu-pill {
    display: block;
    margin: 12px auto 0 auto;
    text-align: center;
  }
}

/* Safe & Sound H1 — rounded, modern, non‑Refuge look */
.sascadu-identity h1 {
  font-family: 'Nunito', Arial Rounded MT Bold, system-ui, sans-serif;
  font-weight: 400;
  letter-spacing: 0.5px;
}

.sascadu-page h2,
.sascadu-page h3 {
  font-family: 'Playfair Display', serif;
  font-weight: 600;
  letter-spacing: 0.2px;
  line-height: 1.15;
  color: #1a1a1a;
  margin-top: 0;
}

/* ---------------------------------------------------------
   WIDE SCREENS — reduced by 25%
   Original: 4.2rem → New: 3.15rem
   Original: 1.8rem → New: 1.35rem
--------------------------------------------------------- */
@media (min-width: 1400px) {
  .sascadu-page h1 {
    font-size: 0.9rem;
  }
  .sascadu-page h2 {
    font-size: 3.15rem;
  }
  .sascadu-page h3 {
    font-size: 1.35rem;
  }
}

/* ---------------------------------------------------------
   MEDIUM SCREENS — reduced by 25%
   Original: 3.5rem → New: 2.625rem
   Original: 3.8rem → New: 2.85rem
   Original: 1.4rem → New: 1.05rem
--------------------------------------------------------- */
@media (min-width: 900px) and (max-width: 1399px) {
  .sascadu-page h1 {
    font-size: 0.9rem;
  }
  .sascadu-page h2 {
    font-size: 2.85rem;
  }
  .sascadu-page h3 {
    font-size: 1.05rem;
  }
}

/* Base section spacing */
.sascadu-section {
  padding-top: 3.5rem;
  padding-bottom: 3.5rem;
}

/* ---------------------------------------------------------
   MEDIUM SECTION SPACING — reduced by 25%
   Original: 5rem → New: 3.75rem
--------------------------------------------------------- */
@media (min-width: 900px) and (max-width: 1399px) {
  .sascadu-section {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }
}

/* ---------------------------------------------------------
   WIDE SECTION SPACING — reduced by 25%
   Original: 6rem → New: 4.5rem
--------------------------------------------------------- */
@media (min-width: 1400px) {
  .sascadu-section {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
  }
}

.sascadu-page h1,
.sascadu-page h2 {
  line-height: 1.1;
}

.sascadu-page p {
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
}

.sascadu-crew {
  padding-top: 6rem;
  padding-bottom: 6rem;
}

.sascadu-card h3 {
  font-size: 1.4rem;
}

@media (min-width: 1400px) {
  .sascadu-card h3 {
    font-size: 1.8rem;
  }
}

@media (max-width: 600px) {
  .sascadu-pill {
    margin-top: 12px;
  }
}

/* ---------------------------------------------------------
   SAFE & SOUND — REAL SPACING OVERRIDES
--------------------------------------------------------- */

.sascadu-crew::before {
  content: "";
  display: block;
  width: 120px;
  height: 4px;
  background: #b7f2d0;
  margin: 0 auto 2.5rem auto;
  border-radius: 2px;
}


.hero {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.hero-left {
  flex: 1;
}

.hero-right {
  flex: 1;
}

.hero-video-wrapper {
  width: 100%;
  aspect-ratio: 16/9; /* or 4/5 or whatever fits your design */
  overflow: hidden;
  border-radius: 8px; /* optional */
}

.hero-video-wrapper video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}



/* Tighten spacing between the two‑column block and the hr */
.sascadu-page section.sascadu-two-col {
  padding-bottom: 1.5rem !important;
}

/* Tighten spacing above the WHY block */
.sascadu-page section.sascadu-why {
  padding-top: 1.5rem !important;
}


.sascadu-page section.sascadu-two-col {
  padding-bottom: 1rem !important;
}

.sascadu-page section.sascadu-why {
  padding-top: 1rem !important;
}
.sascadu-page section.sascadu-framing {
  padding-bottom: 1rem !important;
  
}

/* Crew gets cinematic air (unchanged unless you want it reduced too) */
.sascadu-crew {
  padding-top: 7rem !important;
  padding-bottom: 7rem !important;
}


.sascadu-card .sascadu-image {
  width: 100%;
  height: 180px; /* adjust as needed */
  overflow: hidden;
  border-radius: 6px;
  background: #0001; /* subtle fallback */
}

.sascadu-card .sascadu-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}



/* GLOBAL TEXT COLOR OVERRIDE */
.sascadu-page,
.sascadu-page p,
.sascadu-page h1,
.sascadu-page h2,
.sascadu-page h3,
.sascadu-card p,
.sascadu-card h3,
.sascadu-modal-content,
.sascadu-modal-content p,
.sascadu-modal-content h2,
.sascadu-modal-content h3,
.sascadu-spec-list li,
.sascadu-use-list li {
  color: #514040 !important;
}



/* BACKGROUND OUTSIDE THE GRID */
.sascadu-body,
.sascadu-page section:not(.sascadu-catalog),
.sascadu-container:not(.sascadu-grid),
.sascadu-page {
/*  background-color: #  !important;*/
}



.sascadu-card {
  background: #b8d3c2;
}


body {
  background: radial-gradient(
    ellipse at center,
    #e0d5d5 0%,      /* lighter, breathable center */
    #d7c8c8 35%,     /* soft rose expansion */
    #c9b4b4 60%,     /* mid‑rose bridge */
    #bba6a6 80%,     /* dusk‑rose transition */
    #968181 100%     /* unified dark perimeter */
  ) !important;
}











.sascadu-bottom-band {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin-top: 0px;
  padding: 0 !important;
}

.sascadu-bottom-img {
  width: 100%;
  height: auto;
  display: block;

  /* adjust this until the house sits where you want */
  transform: translateY(0px);

  /* remove or soften this if you don't want gray */
  filter: grayscale(40%) contrast(1.05) brightness(0.9);
}
 


.sascadu-bottom-overlay {
  position: absolute;
  bottom: 30px; /* raise text higher — try 60, 80, or 100px */
  width: 100%;
  text-align: center;
  color: #f2eaea;
  font-size: 1.1rem;
    background: linear-gradient(to top, rgba(0,0,0,0.25), rgba(0,0,0,0));
  padding: 20px;
}
 

.sascadu-bottom-overlay {
  color: #f2eaea !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4); /* optional but helps readability */
}
.site-footer,
.site-footer p,
.site-footer a,
.footer-bottom {
  color: #e5e5e5 !important;
}


.sascadu-bottom-band .sascadu-bottom-overlay,
.sascadu-bottom-band .sascadu-bottom-overlay p {
  color: #f05354 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.35); /* optional but helps readability */
}




/* ---------------------------------------------------------
   SAFE & SOUND — TWO COLUMN AUTHORSHIP
   --------------------------------------------------------- */

.sascadu-two-col {
  display: flex;
  flex-direction: column;
  gap: 3rem;
  max-width: 1100px;
  margin: 0 auto;
  padding: 2rem 1rem;
}

.sascadu-two-col .col {
  flex: 1;
}

.sascadu-two-col .col h2 {
  margin-top: 0;
  margin-bottom: 0.6em;
}

.sascadu-two-col .col p {
  margin-top: 0;
  margin-bottom: 1.2em;
  line-height: 1.6;
}








/* ---------------------------------------------------------
   TWO-COLUMN HEADINGS — LEFT JUSTIFY
   --------------------------------------------------------- */

.sascadu-two-col .col h2 {
  text-align: left !important;
  margin-left: 0;
  margin-right: 0;
}

/* Optional secondary text block (only if used) */
.sascadu-two-col .sascadu-secondary {
  margin-top: 1.8rem;
  font-size: 1.15rem;
  line-height: 1.45;
  max-width: 90%;
  color: #514040;
}

/* GLOBAL PARAGRAPH RULE */
.sascadu-page p {
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
}







/* Safe & Sound label */
.sascadu-toplabel {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 0.15rem 0;
  line-height: 1.2;
  color: #444;
}

/* Builder-of-record lines */
.sascadu-intro {
  font-size: 0.9rem;
  line-height: 1.25;
  color: #444;
  margin-top: 0;
}
.sascadu-toplabel {
  font-size: 1rem;
  font-weight: 600;
  margin: 0 0 0.2rem 0;
  line-height: 1.25;
}

.sascadu-intro {
  font-size: 1rem;
  line-height: 1.3;
  margin-top: 0;
  color: #444;
}

.sascadu-right-title {
  font-size: 2.6rem;   /* go bigger if you want */
  line-height: 1.1;
  margin: 0 0 0.4rem 0;
  font-weight: 700;
}

.sascadu-right-sub {
  font-size: 1.2rem;
  margin: 0.05rem; 
  font-weight: 500;
}














/* HERO CROSSFADE FIX — LAYOUT SAFE */
.sascadu-model-hero {
  position: relative;
  height: 500px; /* correct height for your real images */
  margin-bottom: 2rem; /* restores spacing before description */
}

.sascadu-model-hero img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; /* ensures consistent height */
  object-fit: cover; /* prevents distortion */
  border-radius: 6px;
  transition: opacity 1s ease;
}

.sascadu-hero-hidden {
  opacity: 0;
}




/* FIX CAPTION POSITION AFTER CROSSFADE */
.sascadu-model-hero figcaption {
  position: relative;
  margin-top: 12px;   /* pushes caption below the image */
  padding-top: 4px;
  text-align: center;
  z-index: 5;         /* ensures it stays above background, below image */
  color: #555 !important;
}





















/* =========================================================
   SAFE & SOUND — GLOBAL SECTION SPACING OVERRIDES
   ========================================================= */

/* Base (small screens) */
.sascadu-page section {
  padding-top: 3.75rem !important;
  padding-bottom: 3.75rem !important;
}

/* Medium screens (900–1399px) */
@media (min-width: 900px) and (max-width: 1399px) {
  .sascadu-page section {
    padding-top: 3.75rem !important;
    padding-bottom: 3.75rem !important;
  }
}

/* Large screens (1400px+) */
@media (min-width: 1400px) {
  .sascadu-page section {
    padding-top: 4.5rem !important;
    padding-bottom: 4.5rem !important;
  }
}

/* Tighten ADU Series → Catalog transition */
.sascadu-page section.sascadu-adu-series {
  padding-bottom: 1rem !important;
}
.sascadu-page section.sascadu-catalog {
  padding-top: 1rem !important;
}

/* Medium + Large: collapse catalog bottom padding to remove footer gap */
@media (min-width: 900px) {
  .sascadu-page section.sascadu-catalog {
    padding-bottom: 1rem !important;
  }
}


/* =========================================================
   TWO-COLUMN BLOCK — STRUCTURAL + TYPOGRAPHY
   ========================================================= */

@media (min-width: 820px) {
  .sascadu-two-col {
    flex-direction: row;
    gap: 4rem;
  }
}

.sascadu-two-col .col p,
.sascadu-two-col .sascadu-phoneblock,
.sascadu-two-col .sascadu-contactname {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
}

/* Phone block */
.sascadu-two-col .sascadu-phoneblock {
  margin-top: 1.2rem;
  margin-bottom: 0 !important;
  font-family: "Perpetua", serif;
  font-weight: 900;
  font-size: 2.2rem;
  letter-spacing: 0.5px;
  color: #514040;
  line-height: 1;
}

/* Contact name */
.sascadu-two-col .sascadu-contactname {
  margin-top: 0 !important;
  font-size: 1.05rem;
  letter-spacing: 0.3px;
  opacity: 0.75;
  line-height: 1;
}

/* Left column flush */
.sascadu-two-col .col:first-child,
.sascadu-two-col .col:first-child section,
.sascadu-two-col .col:first-child .sascadu-framing {
  padding-left: 0 !important;
  margin-left: 0 !important;
}


/* =========================================================
   RIGHT COLUMN — TITLE SYSTEM
   ========================================================= */

.sascadu-right-title {
  font-family: 'Playfair Display', serif !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  margin-top: 0 !important;
  margin-bottom: 0.4rem !important;
  color: #1a1a1a !important;
}

/* Large + Medium */
@media (min-width: 900px) {
  .sascadu-right-title {
    font-size: 6rem !important;
  }
}

/* Small */
@media (max-width: 899px) {
  .sascadu-right-title {
    font-size: 3rem !important;
  }
}

/* Subline */
.sascadu-right-sub {
  margin-bottom: 0.05rem !important;
  line-height: 1.05 !important;
}

/* Secondary text under title */
.sascadu-secondary {
  margin-top: 1.2rem !important;
}


/* =========================================================
   WHY + ADU SERIES TYPOGRAPHY
   ========================================================= */

.sascadu-why p {
  font-size: 1.25rem;
  line-height: 1.45;
  opacity: 0.85;
  text-align: center;
}

.sascadu-why p,
.sascadu-adu-series p {
  margin-left: 0 !important;
  margin-right: 0 !important;
}






/* =========================================================
   CATALOG HEADER — SUBDOMINANT
   ========================================================= */

.sascadu-catalog h2 {
  font-size: 1.4rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.3px;
  opacity: 0.85;
  margin-bottom: 0.75rem;
}


/* =========================================================
   AUTHORED DIVIDER
   ========================================================= */

.sascadu-hr {
  border: none;
  height: 1px;
  width: 120px;
  margin: 3rem auto;
  background: rgba(81, 64, 64, 0.35);
  display: block;
}


/* =========================================================
   FOOTER + DISCLOSURE — SINGLE SOURCE OF TRUTH
   ========================================================= */

.sascadu-info-boundary,
.footer-disclosure {
  background: #352828;
  color: #e5e5e5 !important;
  font-size: 0.75rem;
  opacity: 0.85;
  text-align: center;
  padding: 1.5rem 1rem;
  line-height: 1.4;
  border-radius: 4px;
}

.site-footer,
.site-footer p,
.site-footer a,
.footer-bottom {
  color: #e5e5e5 !important;
}

.site-footer {
  padding: 3rem 1rem;
  background: #111;
}

.footer-content {
  display: flex;
  justify-content: center;
  gap: 4rem;
  flex-wrap: wrap;
  max-width: 1200px;
  margin: 0 auto 2rem auto;
}

.footer-column h4 {
  font-size: 1rem;
  margin-bottom: 0.75rem;
  opacity: 0.9;
}

.footer-column ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-column ul li {
  margin-bottom: 0.5rem;
}

.footer-column ul li a {
  color: #e5e5e5;
  text-decoration: none;
  opacity: 0.75;
}

.footer-column ul li a:hover {
  opacity: 1;
}

.footer-bottom {
  text-align: center;
  font-size: 0.85rem;
  opacity: 0.7;
  line-height: 1.4;
  margin-top: 2rem;
}























.sascadu-page section.sascadu-adu-series {
  padding-bottom: 1rem !important;
}

.sascadu-page section.sascadu-catalog {
  padding-top: 1rem !important;
}



































/* =========================================================
   SAFE & SOUND — FINAL SPACING CORRECTION LAYER
   (This overrides EVERYTHING above it)
   ========================================================= */

/* Base spacing (small screens) */
.sascadu-page section {
  padding-top: 2rem !important;
  padding-bottom: 2rem !important;
}

/* Medium screens */
@media (min-width: 900px) and (max-width: 1399px) {
  .sascadu-page section {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
  }
}

/* Large screens */
@media (min-width: 1400px) {
  .sascadu-page section {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
}

/* ADU Series → Catalog */
.sascadu-page section.sascadu-adu-series {
  padding-bottom: 1rem !important;
}
.sascadu-page section.sascadu-catalog {
  padding-top: 1rem !important;
}

/* Catalog → Bottom Band → Footer (fix medium + large gap) */
@media (min-width: 900px) {
  .sascadu-page section.sascadu-catalog {
    padding-bottom: 1rem !important;
  }
}

/* Two‑column → hr → WHY */
.sascadu-page section.sascadu-framing {
  padding-bottom: 1rem !important;
 
}
.sascadu-page section.sascadu-why {
  padding-top: 1rem !important;
}

/* Bottom‑band text (force light) */
.sascadu-bottom-band .sascadu-bottom-overlay,
.sascadu-bottom-band .sascadu-bottom-overlay p {
  color: #f2eaea !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.35);
}

/* Footer text (force light) */
.site-footer,
.site-footer p,
.site-footer a,
.footer-bottom {
  color: #e5e5e5 !important;
}
















/* =========================================================
   SAFE & SOUND — FINAL FOOTING FIX
   (forces the footer to touch the bottom photo)
   ========================================================= */

/* Remove ALL bottom padding from the section above the photo */
.sascadu-page section.sascadu-catalog {
  padding-bottom: 0 !important;
}

/* Medium screens */
@media (min-width: 900px) and (max-width: 1399px) {
  .sascadu-page section.sascadu-catalog {
    padding-bottom: 0 !important;
  }
}

/* Large screens */
@media (min-width: 1400px) {
  .sascadu-page section.sascadu-catalog {
    padding-bottom: 0 !important;
  }
}

/* Ensure the bottom band itself has no margin */
.sascadu-bottom-band {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Ensure the footer starts immediately after the image */
.site-footer {
  margin-top: 0 !important;
}





.sascadu-page section.sascadu-why {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.sascadu-why p {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}













.only-wide {
  display: none;
}

@media (min-width: 900px) {
  .only-wide {
    display: inline;
  }
}




.hidden {
  display: none !important;
}
 



.sascadu-lightbox-primary {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.sascadu-lightbox-primary.hidden {
  display: none !important;
}

.sascadu-lightbox-content {
  max-width: 90vw;
  max-height: 90vh;
  overflow-y: auto;
  background: #fff;
  padding: 20px;
  border-radius: 4px;
}






































/* INLINE SECONDARY GALLERY INSIDE MODAL */
.sascadu-lightbox-secondary {
  position: relative;
  background: #fff;
  padding: 20px;
  margin-bottom: 20px;
  border: 1px solid #ddd;
  border-radius: 6px;
  z-index: 5; /* above hero, below modal close */
}

.sascadu-lightbox-secondary.hidden {
  display: none;
}

.sascadu-lightbox-close-secondary {
  float: right;
  font-size: 24px;
  cursor: pointer;
  margin-bottom: 10px;
}
.sascadu-lightbox-secondary {
  display: block;
  width: 100%;
}
.sascadu-lightbox-secondary img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  margin-bottom: 12px;
}

.sascadu-lightbox-secondary figure {
  margin: 0 0 20px 0;
}

.sascadu-lightbox-secondary figcaption {
  font-size: 0.85rem;
  color: #555;
  margin-top: 4px;
}
.sascadu-open-gallery-secondary {
  display: inline-block;
  padding: 10px 16px;
  background: #f2f2f2;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
  font-size: 0.9rem;
  margin-bottom: 20px;
}

.sascadu-open-gallery-secondary:hover {
  background: #e6e6e6;
}



/* Ensure supporting images fit inside modal */
.sascadu-modal-content figure img {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 4px; /* optional, matches your geometry */
  object-fit: contain;
}
/* Allow modal to scroll when content is tall */
.sascadu-modal-content {
  max-height: 90vh;
  overflow-y: auto;
}






































/* TREADMILL CONTAINER */
.sascadu-treadmill {
  position: relative;
  height: 100vh;
  overflow: hidden;
  margin-top: 0;
}

/* TRACK HOLDS ALL SCENES */
.sascadu-track {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* EACH SCENE */
.sascadu-track .scene {
  height: 100vh;
  display: flex;
  align-items: center;
  font-size: 1.4rem;
  line-height: 1.5;
  opacity: 0.15;
  transition: opacity 0.6s ease;
  padding-right: 2rem;
}

/* ACTIVE SCENE */
.sascadu-track .scene.active {
  opacity: 1;
}

/* MOBILE — left column scrolls normally, treadmill starts immediately */
@media (max-width: 768px) {
  .sascadu-treadmill {
    height: 100vh;
  }
  .sascadu-track .scene {
    font-size: 1.2rem;
  }
}















/*********
/*********
/*********
/*********
/********* 
/*********


<div id="simple-viewer">
  <div id="simple-text"></div>

  <div class="simple-arrows">
    <button id="simple-left">←</button>
    <button id="simple-right">→</button>
  </div>
</div>






body {
  background: #111;
  color: white;
  font-family: sans-serif;
  margin: 0;
  padding: 0;
}

#simple-viewer {
  width: 100%;
  max-width: 600px;
   
  text-align: center;
  font-size: 1.4rem;
  line-height: 1.4;
}

#simple-text {
  opacity: 1;
  transition: opacity 0.25s ease;
  min-height: 3rem;
}

.simple-arrows {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.5rem;
}

.simple-arrows button {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: #111;
  border: 2px solid #666;
  color: #eee;
  font-size: 1.2rem;
  cursor: pointer;
  transition: border-color 0.2s, color 0.2s;
}

.simple-arrows button:hover {
  border-color: #fff;
  color: #fff;
}









#simple-viewer {
  width: 100%;
  max-width: 600px;
  margin: 1rem auto;
  text-align: left;
  font-size: 1.5rem;
  line-height: 1.2;
   
  font-family: sans-serif;
}

#simple-text {
  opacity: 1;
  transition: opacity 0.25s ease;
  min-height: 1rem;
}

.simple-arrows {
  display: flex;
  justify-content: center;
  gap: 4rem;
  margin-top: 0.5rem;
}

.simple-arrows button {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: #f05354;
  border: 0px !important;
  color: #000;
  font-size: 1.5rem;
  
  cursor: pointer;
}
.sascadu-treadmill {
  position: relative;
  height: auto;
  overflow: visible;
  margin-top: 0;
}



.sascadu-treadmill {
  position: relative;
  height: 80px;
  overflow: hidden;
  margin-top: 20px;
}



#simple-viewer {
  margin-top: 0;
}



*********
*********
*********
*********
********* 
*********/











.hero-video-wrapper {
  width: 100%;
  max-width: 600px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 16px;
  background: #000; /* so you SEE the box even before video loads */
}
.hero-video-wrapper video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.hero {
  display: flex;
  gap: 2rem;
  align-items: flex-start;
}






.scroll-grow {
  transform: scale(0.85);
  transition: transform 0.2s ease-out;
  will-change: transform;
}
.scroll-grow {
  transform: scale(0.85);
  transition: transform 0.1s linear;
  will-change: transform;
}






.pill-outline-link {
  background-color: #000 !important;
}