/* Own additions on top of the original Rocketspark stylesheets. */

/* Rocketspark's script showed these after measuring; here they are simply visible. */
#logo { display: block; opacity: 1; width: 6.938rem; }
#nav_wrapper { opacity: 1; }

/* Hero slideshow (replaces jQuery Cycle): photos on top of each other, fading. */
.dst-cycle { position: relative; }
/* Hidden photos are also visibility: hidden (as with jQuery Cycle), after the fade-out. */
.dst-cycle > .feature-slide { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; z-index: 94; visibility: hidden; transition: opacity 1.5s ease-in-out, visibility 0s linear 1.5s; }
.dst-cycle > .feature-slide:first-child { position: relative; }
.dst-cycle > .feature-slide.cycle-slide-active { opacity: 1; z-index: 99; visibility: visible; transition: opacity 1.5s ease-in-out, visibility 0s; }

/* The replacement fonts are a little narrower in capitals than Effra and Industry. */
#nav .text-scaling, #footer-nav .text-scaling, .mobile-menu-container .text-scaling { letter-spacing: 0.035em; }

/* Icons that were glyphs of Rocketspark's icon font. */
.dst-icon { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.dst-icon svg { display: block; }

/* Blog share links: look like the old X, Facebook, Pinterest and LinkedIn widgets (66, 67, 50
   and 62 px wide, 20 px high), without their scripts. */
.blog_shareButtons .dst-share { display: flex; align-items: center; justify-content: center; gap: 4px; height: 20px; box-sizing: border-box; color: #fff !important; text-decoration: none !important; font: 700 11px/20px "Helvetica Neue", Helvetica, Arial, sans-serif; white-space: nowrap; }
.blog_shareButtons .dst-share svg { flex-shrink: 0; display: block; }
.dst-share--x { width: 66px; background: #000; border-radius: 9999px; font-size: 13px !important; gap: 5px !important; }
.dst-share--facebook { width: 67px; background: #1877f2; border-radius: 4px; }
.dst-share--pinterest { width: 50px; background: #e60023; border-radius: 2px; gap: 3px !important; }
.dst-share--linkedin { width: 62px; background: #0073b1; border-radius: 2px; }


/* Cookie choice: the old grey bar with its ×; "Accept" and "Decline" look like the policy link. */
.eu-cookie[hidden] { display: none !important; }
.eu-cookie .eu-cookie-choice { font: inherit; color: inherit; background: none; border: 0; padding: 0 0 0 6px; text-decoration: underline; cursor: pointer; }
.eu-cookie .eu-cookie-choice[data-cookie-choice="yes"] { font-weight: 700; }

/* Fade-in of animated sections (site.js adds ._82471570 when they come into view). */
._bfc08580 .block, ._bfc08580 .column { transition: opacity 0.8s ease; }
@media (prefers-reduced-motion: reduce) { ._bfc08580 .block, ._bfc08580 .column { opacity: 1 !important; transition: none; } }

/* Enlarged photo (same look as Rocketspark's image popup). */
.dst-lightbox { position: fixed; inset: 0; z-index: 999999; background: rgba(0, 0, 0, 0.85); }
.dst-lightbox__frame { position: absolute; inset: 18px; display: flex; align-items: center; justify-content: center; padding-bottom: 25px; box-sizing: border-box; pointer-events: none; }
.dst-lightbox__frame img { max-width: calc(100vw - 36px - 2 * 60px); max-height: calc(100vh - 36px - 25px); pointer-events: auto; }
.dst-lightbox button { position: absolute; background: none; border: 0; padding: 0; cursor: pointer; display: flex; align-items: center; z-index: 1; }
.dst-lightbox__close { top: 45px; right: 47px; width: 24px; height: 24px; }
.dst-lightbox__prev, .dst-lightbox__next { top: 18px; bottom: 18px; width: 301px; max-width: 20vw; }
.dst-lightbox__prev { left: 18px; justify-content: flex-start; padding-left: 14px !important; }
.dst-lightbox__next { right: 18px; justify-content: flex-end; padding-right: 14px !important; }
/* Effra Medium (buttons) looks heavier than Source Sans 3 at 500. */
:root { --button-font-weight: 600; }

/* YouTube video before it is clicked: the video's picture with a play button (site.js loads the player). */
.dst-video { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: #000; cursor: pointer; overflow: hidden; }
.dst-video img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dst-video__play { position: absolute; left: 50%; top: 50%; width: 68px; height: 48px; transform: translate(-50%, -50%); transition: opacity 0.2s; opacity: 0.9; }
.dst-video:hover .dst-video__play, .dst-video:focus-visible .dst-video__play { opacity: 1; }
