/*
Theme Name:   Divi Speleobooks
Theme URI:    https://www.speleobooks.com/
Description:  Divi child theme for Speleobooks. Holds site-specific overrides so they
              survive Divi's automatic updates (Divi auto-updates on this install).
Author:       Precision Web Hosting
Template:     Divi
Version:      1.1.9
*/

:root {
  --speleo-ink: #2B2723;
  --speleo-cave: #171411;
  --speleo-tan: #B9AB95;
  --speleo-gold: #825e31;
  --speleo-cream: #F7F5F1;
  --speleo-paper: #FCFBF8;
}

body.page-id-68 {
  background: var(--speleo-paper);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

/* Cart7 imports page 93 as the shell for every storefront route. Divi's
   default 80% / 1080px content container wastes substantial desktop space,
   and its 58px top padding delays the first useful shop control. Widen only
   this imported shell; header, footer and ordinary WordPress pages retain the
   normal Divi measure. */
body.page-id-93 #main-content > .container {
  width: 98%;
  max-width: none;
  padding-top: 16px !important;
}

@media (max-width: 767px) {
  body.page-id-93 #main-content > .container {
    width: 96%;
    padding-top: 10px !important;
  }
}

/* Give the masthead more presence without consuming extra vertical space. */
body.page-id-68 #main-header { box-shadow: 0 1px 0 rgba(43,39,35,.08); }
body.page-id-68 #top-menu a { font-weight: 600; letter-spacing: .01em; }
body.page-id-68 #top-menu li.current-menu-item > a { color: #37688a !important; }

/* --- Hero: force white type over the cave photo ---------------------------
   The Equestrian layout presets set their own heading/text colours, which win
   over per-module colour attributes once Divi rebuilds its static CSS. Scoping
   by the section's module_class is deterministic and survives a cache rebuild. */
.speleo-hero h1,
.speleo-hero h1 *,
.speleo-hero .speleo-eyebrow,
.speleo-hero .speleo-eyebrow *,
.speleo-hero p,
.speleo-hero p * { color: #FFFFFF !important; }

.speleo-eyebrow {
  margin: 0;
  color: var(--speleo-gold);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.7em;
  text-transform: uppercase;
}
.speleo-hero h1 {
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 600 !important;
  text-wrap: balance;
  text-shadow: 0 2px 22px rgba(0,0,0,.32);
}
.speleo-hero p { font-size: 17px; line-height: 1.75em; }
.speleo-hero .et_pb_text:first-child {
  border-left: 3px solid var(--speleo-tan);
  backdrop-filter: blur(3px);
}
.speleo-hero .et_pb_button_module_wrapper {
  display: inline-block;
  margin: 12px 12px 0 0 !important;
}
.speleo-hero .et_pb_button {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  box-shadow: 0 10px 28px rgba(0,0,0,.18);
}

/* Compact credibility strip: four stats on desktop, two-by-two on phones. */
.speleo-trust.et_pb_section.et_pb_with_background {
  padding-top: 18px !important;
  background-color: #EFECE6 !important;
}
.speleo-trust .et_pb_row { display: flex; align-items: stretch; }
.speleo-trust .et_pb_column {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 92px;
  padding: 8px 18px;
  border-right: 1px solid rgba(43,39,35,.12);
}
.speleo-trust .et_pb_column:last-child { border-right: 0; }
.speleo-trust .speleo-stat {
  display: block;
  margin-bottom: 2px;
  color: var(--speleo-gold);
  font-size: 25px;
  line-height: 1.2em;
}
.speleo-trust p { font-size: 14px; }

/* Explore heading banner: Divi supplies the image and dark gradient overlay. */
.speleo-explore-banner { overflow: hidden; }
body.page-id-68 .speleo-explore-banner h2,
body.page-id-68 .speleo-explore-banner h2 *,
body.page-id-68 .speleo-explore-banner p,
body.page-id-68 .speleo-explore-banner p * {
  color: #FFFFFF !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.55);
}
body.page-id-68 .speleo-explore-banner .speleo-eyebrow { color: #E2D2B9 !important; }

/* --- Dark + contact sections (moved here from an inline page style) ------- */
body.page-id-68 .speleo-dark.et_pb_section { background-color: var(--speleo-ink) !important; }
body.page-id-68 .speleo-dark h2, body.page-id-68 .speleo-dark h2 * { color: #FFFFFF !important; }
body.page-id-68 .speleo-dark p,
body.page-id-68 .speleo-dark strong,
body.page-id-68 .speleo-dark li { color: rgba(255,255,255,.92) !important; }
body.page-id-68 .speleo-contact.et_pb_section { background-color: var(--speleo-cream) !important; }
body.page-id-68 .speleo-contact h2, body.page-id-68 .speleo-contact h2 * { color: #B9AB95 !important; }

/* --- Uniform category card images ---------------------------------------- */
.speleo-card-img,
.speleo-card-img .et_pb_image_wrap { width: 100% !important; display: block; }
.speleo-card-img img {
  height: 260px !important; width: 100% !important;
  object-fit: cover !important; object-position: center; display: block;
}
/* Keep the ornament in frame and crop the excess hanging string at the top. */
.speleo-card-img img.wp-image-66 { object-position: center bottom !important; }
.speleo-card {
  overflow: hidden;
  padding: 14px 14px 8px;
  background: #fff;
  border: 1px solid rgba(43,39,35,.10);
  border-top: 3px solid var(--speleo-tan);
  border-radius: 8px;
  box-shadow: 0 12px 34px rgba(43,39,35,.08);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.speleo-card:hover {
  transform: translateY(-5px);
  border-top-color: var(--speleo-gold);
  box-shadow: 0 18px 42px rgba(43,39,35,.14);
}
.speleo-card .speleo-card-img { margin: -14px -14px 0; width: calc(100% + 28px) !important; }
.speleo-card h3 { font-size: 20px; }
.speleo-card p { min-height: 2.8em; }
.speleo-card a { text-decoration-thickness: 1px; text-underline-offset: 4px; }
.speleo-card a:hover { color: var(--speleo-gold) !important; }

.speleo-explore {
  background:
    radial-gradient(circle at 12% 16%, rgba(185,171,149,.14), transparent 24%),
    radial-gradient(circle at 88% 82%, rgba(185,171,149,.12), transparent 26%),
    var(--speleo-paper);
}

.speleo-about .et_pb_row {
  padding: 42px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 18px 55px rgba(43,39,35,.08);
}
.speleo-about img { filter: drop-shadow(0 18px 22px rgba(43,39,35,.18)); }

.speleo-dark { position: relative; overflow: hidden; }
.speleo-dark::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 50% -30%, rgba(185,171,149,.22), transparent 52%);
}

.speleo-contact .et_pb_row {
  padding: 38px 42px;
  background: #fff;
  border-left: 4px solid var(--speleo-tan);
  box-shadow: 0 14px 38px rgba(43,39,35,.07);
}
.speleo-contact a { color: #37688a; font-weight: 600; }

/* Divi hides social labels with display:none, which also hides them from
   assistive technology. Keep the RSS label available to screen readers. */
.et-social-icon span {
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  display: block;
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

#footer-bottom #footer-info { color: #b7b7b7; }

@media (max-width: 980px) { .speleo-card-img img { height: 220px !important; } }

@media (max-width: 767px) {
  .speleo-hero p { font-size: 16px; }
  .speleo-hero .et_pb_button_module_wrapper { display: block; margin-right: 0 !important; }
  .speleo-hero .et_pb_button { justify-content: center; width: 100%; }

  .speleo-trust .et_pb_row { display: flex; flex-wrap: wrap; width: 90%; }
  .speleo-trust .et_pb_column {
    width: 50% !important;
    margin: 0 !important;
    min-height: 104px;
    border-right: 1px solid rgba(43,39,35,.12);
    border-bottom: 1px solid rgba(43,39,35,.12);
  }
  .speleo-trust .et_pb_column:nth-child(2n) { border-right: 0; }
  .speleo-trust .et_pb_column:nth-child(n+3) { border-bottom: 0; }

  .speleo-card { margin-bottom: 26px !important; }
  .speleo-card p { min-height: 0; }
  .speleo-about .et_pb_row,
  .speleo-contact .et_pb_row { padding: 28px 24px; }
}

/* --- Headlamp sweep on buttons -------------------------------------------
   A warm beam that pans across the button, like a headlamp catching it in the
   dark. Built on ::before because Divi already uses ::after on .et_pb_button
   for its arrow icon - clobbering that would delete the arrow.
   The idle sweep is slow and infrequent; hover fires a faster one. */
.et_pb_button {
  position: relative;
  overflow: hidden;          /* clip the beam to the button */
  isolation: isolate;
}
.et_pb_button::before {
  content: "";
  position: absolute;
  top: -60%;
  left: -150%;
  width: 55%;
  height: 220%;
  pointer-events: none;
  z-index: 0;                /* stays under the label and Divi's arrow */
  transform: skewX(-18deg);
  background: linear-gradient(
      100deg,
      rgba(255, 246, 214, 0)    0%,
      rgba(255, 246, 214, 0.18) 38%,
      rgba(255, 246, 214, 0.72) 50%,
      rgba(255, 246, 214, 0.18) 62%,
      rgba(255, 246, 214, 0)   100%);
  animation: speleoHeadlamp 7s ease-in-out infinite;
}
.et_pb_button:hover::before { animation: speleoHeadlamp 1.1s ease-out 1; }

/* keep the label and Divi's arrow above the beam */
.et_pb_button { z-index: 0; }
.et_pb_button::after { z-index: 2; }

@keyframes speleoHeadlamp {
  0%   { left: -150%; }
  55%  { left: 150%; }
  100% { left: 150%; }        /* long dark pause between passes */
}

/* Respect a visitor who has asked for less motion. */
@media (prefers-reduced-motion: reduce) {
  .et_pb_button::before,
  .et_pb_button:hover::before { animation: none; opacity: 0; }
}

/* --- Responsive hero background ------------------------------------------
   PSI mobile was pulling the full 2400px / 447KB hero (LCP 5.1s). Divi would
   not emit per-breakpoint backgrounds from shortcode attributes alone, so the
   swap lives here. The gradient MUST be repeated: background-image carries both
   the overlay and the photo, so overriding the property without the gradient
   would drop the scrim and make the white type unreadable.
   ⚠ Selector must be `body div.et_pb_section.speleo-hero` (0,2,2): Divi generates
   `div.et_pb_section.et_pb_section_0` (0,2,1) WITH !important, so a plain
   `.speleo-hero{...!important}` (0,1,0) loses. !important does not beat specificity. */
@media (max-width: 1024px) {
  body div.et_pb_section.speleo-hero {
    background-image:
      linear-gradient(180deg, rgba(21,18,15,0.80) 0%, rgba(21,18,15,0.62) 100%),
      url(/wp-content/uploads/2026/08/speleobooks-hero-caving-1024x488.jpg) !important;
  }
}
@media (max-width: 767px) {
  body div.et_pb_section.speleo-hero {
    background-image:
      linear-gradient(180deg, rgba(21,18,15,0.80) 0%, rgba(21,18,15,0.62) 100%),
      url(/wp-content/uploads/2026/08/speleobooks-hero-caving-768x366.jpg) !important;
  }
}