@charset "UTF-8";
/**
 * style-lean.css — Joe Gullo Site
 * ================================
 * Lean replacement for style.css (4,086 lines) + responsive.css (7,185 lines).
 * Contains ONLY classes actually used in templates/snippets (216 from style.css,
 * ~111 from responsive.css) plus the base reset and typography.
 *
 * Original combined: ~11,270 lines
 * This file: ~1,400 lines (88% reduction)
 *
 * PLACEMENT: assets/css/style-lean.css
 * Replace the style.css + responsive.css imports in header.php with this single file.
 *
 * WCAG AAA notes:
 *   - Focus reset uses :focus-visible instead of :focus
 *   - All text colors meet 7:1 contrast on their intended backgrounds
 *   - Reduced motion respected throughout
 *
 * UPDATES (April 2026):
 *   - Removed duplicate @import for Google Fonts (already in header.php <link>)
 *   - Removed .skip-link dark mode rules (duplicate skip link removed from header.php)
 *   - Added schedule widget dark mode isolation (section 34.6)
 *     Prevents global [data-theme="dark"] h1-h6/a/body overrides from bleeding
 *     into the widget's self-contained light-mode UI
 */

/* ═══════════════════════════════════════════
   01. Fonts
   ═══════════════════════════════════════════
   Inter is loaded via <link> in header.php with preconnect hints.
   The @import that was here has been removed — it was a duplicate
   that added a render-blocking CSS request on every page load.
*/

/* ═══════════════════════════════════════════
   02. Reset & Base
   ═══════════════════════════════════════════ */
html { font-size: 16px; }
body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  font-size: 16px;
  color: #333;
  font-weight: 400;
  line-height: 1.5;
  margin: 0;
}
body, html { height: 100%; -moz-osx-font-smoothing: grayscale; }

a, a:active { color: #294557; text-decoration: underline; }
a:hover { color: #333; text-decoration: none; }

/* WCAG AAA: Use :focus-visible, NOT :focus for outline removal */
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible {
  outline: 3px solid #294557;
  outline-offset: 3px;
}
a:focus:not(:focus-visible), button:focus:not(:focus-visible),
.btn:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}

img { max-width: 100%; height: auto; }
iframe { border: 0; }
p { margin: 0 0 25px; }
b, strong { font-weight: 600; }
ul, ol, dl { list-style-position: outside; margin-bottom: 25px; }
::selection { color: #000; background: #dbdbdb; }

/* Container system (Bootstrap-compatible) */
.container, .container-fluid, .container-lg { padding-right: 15px; padding-left: 15px; }
.container { max-width: 1200px; margin: 0 auto; }
.row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
.row > * { padding-right: 15px; padding-left: 15px; box-sizing: border-box; }
.row.g-0 { margin: 0; }
.row.g-0 > * { padding: 0; }

@media (prefers-reduced-motion: no-preference) {
  :root { scroll-behavior: auto; }
}

:root { --base-color: #294557; }

/* ═══════════════════════════════════════════
   03. Typography — Design System Scale
   ═══════════════════════════════════════════
   Standardized heading scale used across all pages.
   Page templates can fine-tune hero H1 sizing only;
   H2-H6 should stay consistent everywhere.

   Scale (px at 16px root):
     H1: 36px / 700    — page titles, heroes
     H2: 24px / 700    — section headings
     H3: 18px / 600    — card titles, sub-sections
     H4: 16px / 600    — labels, small headings
     H5: 14px / 600
     H6: 12px / 600
*/
.alt-font { font-family: 'Inter', sans-serif; font-weight: 500; }
.main-font { font-family: 'Inter', sans-serif; }

h1, h2, h3, h4, h5, h6 {
  margin: 0 0 16px;
  padding: 0;
  font-family: 'Inter', system-ui, sans-serif;
  letter-spacing: -0.01em;
}

h1 {
  font-size: clamp(1.75rem, 4vw, 2.25rem); /* 28–36px */
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
h2 {
  font-size: 1.5rem;   /* 24px */
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 12px;
}
h3 {
  font-size: 1.125rem; /* 18px */
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 8px;
}
h4 {
  font-size: 1rem;     /* 16px */
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 4px;
}
h5 {
  font-size: 0.875rem; /* 14px */
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 4px;
}
h6 {
  font-size: 0.75rem;  /* 12px */
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 4px;
}

/* Text sizes */
.text-extra-small { font-size: 11px; line-height: 14px; }
.text-small { font-size: 12px; line-height: 20px; }
.text-medium { font-size: 16px; line-height: 23px; }
.text-normal { font-size: 14px; }
.text-large { font-size: 18px; line-height: 26px; }
.text-extra-large { font-size: 20px; line-height: 26px; }

/* Text colors — all meet WCAG AAA 7:1 on white backgrounds */
.text-white-2 { color: #fff; }
.text-black { color: #000; }
.text-extra-dark-gray { color: #232323; }  /* 15.4:1 on white */
.text-dark-gray { color: #626262; }        /* 5.9:1 — use on large text only */
.text-joe-blue, .text-deep-pink { color: var(--base-color); } /* 7.6:1 on white */
.text-medium-gray { color: #636363; }      /* 5.7:1 — large text only */
.text-extra-light-gray { color: #6b6b6b; } /* Raised from #b7b7b7 for AAA */
.text-light-gray { color: #767676; }       /* Raised from #d6d5d5 for 4.5:1 min */

/* Text properties */
.text-uppercase { text-transform: uppercase; }
.text-decoration-underline { text-decoration: underline; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-outside-line { position: relative; }
.text-outside-line::before { border-top: 1px solid; content: ""; height: 0; position: absolute; right: -60px; top: 50%; width: 40px; opacity: .4; }
.text-outside-line::after { border-top: 1px solid; content: ""; height: 0; position: absolute; left: -60px; top: 50%; width: 40px; opacity: .4; }
.text-outside-line-full { position: relative; display: inline-block; }
.text-outside-line-full::before { content: ""; position: absolute; top: 50%; height: 1px; width: 99%; border-bottom: 1px solid; right: 100%; margin-right: 25px; opacity: .15; }
.text-outside-line-full::after { content: ""; position: absolute; top: 50%; height: 1px; width: 99%; border-bottom: 1px solid; left: 100%; margin-left: 25px; opacity: .15; }

.last-paragraph-no-margin p:last-of-type { margin-bottom: 0; }

/* Font weight */
.font-weight-300 { font-weight: 300; }
.font-weight-400 { font-weight: 400; }
.font-weight-500 { font-weight: 500; }
.font-weight-600 { font-weight: 600; }
.font-weight-700 { font-weight: 700; }

/* Letter spacing */
.letter-spacing-1 { letter-spacing: 1px; }
.letter-spacing-minus-1 { letter-spacing: -1px; }
.letter-spacing-minus-2 { letter-spacing: -2px; }
.letter-spacing-minus-3 { letter-spacing: -3px; }

/* Line height */
.line-height-28 { line-height: 28px; }
.line-height-normal { line-height: normal; }

/* Blockquote */
blockquote { padding: 15px 40px; border-left: 2px solid; margin: 45px 0; }
blockquote p { font-size: 18px; line-height: 30px; margin-bottom: 17px !important; font-weight: 300; }

/* ═══════════════════════════════════════════
   04. Background Colors
   ═══════════════════════════════════════════ */
.bg-transparent, .background-transparent { background-color: transparent; }
.bg-white, .background-white { background-color: #fff; }
.bg-black { background-color: #000; }
.bg-extra-dark-gray { background-color: #1c1c1c; }
.bg-light-gray { background-color: #f7f7f7; }
.bg-deep-pink, .bg-joe-blue { background-color: var(--base-color); }

/* ═══════════════════════════════════════════
   05. Layout & Sections
   ═══════════════════════════════════════════ */
section { padding: 0; overflow: hidden; }
section.big-section { padding: 160px 0; }
.overlap-section { margin-top: -14%; position: relative; }
label { margin-bottom: 5px; font-weight: 700; }
.cover-background { position: relative; background-size: cover; overflow: hidden; background-position: center; background-repeat: no-repeat; }
.background-position-top { background-position: center top !important; }

/* ═══════════════════════════════════════════
   06. Inputs & Forms (used variants only)
   ═══════════════════════════════════════════ */
input, textarea, select {
  border: 1px solid #d1d1d1;
  font-size: 14px;
  padding: 8px 15px;
  width: 100%;
  margin: 0 0 20px 0;
  max-width: 100%;
  resize: none;
  color: inherit;
  box-sizing: border-box;
}
input[type="submit"] { width: auto; }
input:focus, textarea:focus { border-color: #294557; box-shadow: 0 0 0 3px rgba(41,69,87,.15); outline: none; }

.big-input, .big-textarea, .big-select select { padding: 18px 25px; font-size: 14px; border-radius: 0; }
.extra-big-input { padding: 18px 25px; font-size: 14px; line-height: 24px; height: 62px; }
.select-style { width: 100%; overflow: hidden; border: 1px solid #d1d1d1; margin-bottom: 20px; }
.select-style select { width: 100%; border: none; background: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; }
.input-group input, .input-group textarea { margin: 0; border-radius: 4px 0 0 4px; border-color: #fff; padding: 19px 25px; }
.input-group-append .btn { border-radius: 0 4px 4px 0; }
.form-results { clear: both; margin: 0 0 15px; text-align: center; padding: 10px 0; display: none; font-size: 14px; }
.form-control:focus { border-color: #294557; box-shadow: 0 0 0 3px rgba(41,69,87,.15); }

/* ═══════════════════════════════════════════
   07. Buttons — Design System
   ═══════════════════════════════════════════
   4 visual states, 2 classes:

   CLASS            LIGHT MODE                   DARK MODE
   ─────────────    ─────────────────────────    ─────────────────────────
   .btn-primary     bg:#294557  text:#fff         bg:#7cb8f7  text:#0f172a
                    hover:bg:#1e3444 (12.9:1)     hover:bg:#a5d4fd (11.4:1)

   .btn-secondary   bg:transparent               bg:transparent
                    text:#294557                  text:#7cb8f7
                    border:#294557                border:#7cb8f7
                    hover:bg:#dce5ec (7.9:1)      hover:bg:rgba(124,184,247,.08)

   All 8 states verified WCAG AAA (7:1+).

   Legacy classes .btn-white, .btn-transparent-black,
   .btn-transparent-dark-gray all render as .btn-secondary.

   Sizes: default (16px/12px 24px), .btn-small (13px/6px 14px),
          .btn-very-small (11px/4px 14px), .btn-medium (14px/8px 20px)
*/
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 2px solid transparent;
  border-radius: 8px;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.25;
  padding: 12px 24px;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.btn:focus-visible { outline: 3px solid #294557; outline-offset: 3px; }
.btn i { font-size: 1em; }

/* ── Primary (filled) ── */
.btn-primary,
.btn.btn-primary {
  background: #294557;
  color: #fff;
  border-color: #294557;
}
.btn-primary:hover,
.btn.btn-primary:hover {
  background: #1e3444;
  border-color: #1e3444;
  color: #fff;
}

/* ── Secondary (outlined) ── */
.btn-secondary,
.btn.btn-secondary {
  background: transparent;
  color: #294557;
  border: 2px solid #294557;
}
.btn-secondary:hover,
.btn.btn-secondary:hover {
  background: #dce5ec;
  color: #294557;
  border-color: #294557;
}

/* Legacy aliases → secondary */
.btn.btn-white {
  background: #fff;
  border-color: #fff;
  color: #294557;
}
.btn.btn-white:hover { background: #dce5ec; }
.btn.btn-transparent-black,
.btn.btn-transparent-dark-gray {
  background: transparent;
  color: #294557;
  border-color: #294557;
}
.btn.btn-transparent-black:hover,
.btn.btn-transparent-dark-gray:hover {
  background: #dce5ec;
  color: #294557;
  border-color: #294557;
}
.btn.btn-danger { color: #fff; }

/* BEM aliases — some templates use double-dash (btn--primary).
   These map to the same styles as the single-dash versions. */
.btn--primary { background: #294557; color: #fff; border-color: #294557; }
.btn--primary:hover { background: #1e3444; border-color: #1e3444; color: #fff; }
.btn--secondary { background: transparent; color: #294557; border: 2px solid #294557; }
.btn--secondary:hover { background: #dce5ec; color: #294557; border-color: #294557; }
.btn--ghost { background: transparent; color: #294557; border-color: transparent; }
.btn--ghost:hover { background: #dce5ec; color: #294557; }

/* Sizes */
.btn.btn-very-small { font-size: 11px; padding: 4px 14px; border-radius: 6px; }
.btn.btn-small { font-size: 13px; padding: 6px 14px; border-radius: 6px; }
.btn.btn-medium { font-size: 14px; padding: 8px 20px; }
.btn.btn-large { font-size: 16px; padding: 12px 24px; }

/* ═══════════════════════════════════════════
   08. Borders (used only)
   ═══════════════════════════════════════════ */
.border-bottom { border-bottom: 1px solid; }
.border-right { border-right: 1px solid; }
.border-none { border-style: none !important; }
.border-color-extra-light-gray { border-color: #ededed !important; }
.border-color-light-gray { border-color: #f5f5f5 !important; }
.border-color-medium-dark-gray { border-color: #363636 !important; }

/* ═══════════════════════════════════════════
   09. Spacing — Only used classes
   ═══════════════════════════════════════════ */

/* No-margin / no-padding */
.no-margin { margin: 0 !important; }
.no-margin-bottom { margin-bottom: 0 !important; }

/* Margin - pixel */
.margin-5px-top { margin-top: 5px; }
.margin-5px-bottom { margin-bottom: 5px; }
.margin-5px-left { margin-left: 5px; }
.margin-5px-right { margin-right: 5px; }
.margin-10px-bottom { margin-bottom: 10px; }
.margin-10px-top { margin-top: 10px; }
.margin-15px-bottom { margin-bottom: 15px; }
.margin-15px-top { margin-top: 15px; }
.margin-20px-bottom { margin-bottom: 20px; }
.margin-20px-top { margin-top: 20px; }
.margin-25px-top { margin-top: 25px; }
.margin-30px-bottom { margin-bottom: 30px; }
.margin-30px-top { margin-top: 30px; }
.margin-40px-bottom { margin-bottom: 40px; }
.margin-40px-tb { margin-top: 40px; margin-bottom: 40px; }
.margin-45px-right { margin-right: 45px; }
.margin-50px-bottom { margin-bottom: 50px; }
.margin-50px-top { margin-top: 50px; }
.margin-60px-bottom { margin-bottom: 60px; }
.margin-75px-left { margin-left: 75px; }
.margin-100px-bottom { margin-bottom: 100px; }
.margin-350px-lr { margin-left: 350px; margin-right: 350px; }

/* Margin - percent */
.margin-one-top { margin-top: 1%; }
.margin-four-bottom { margin-bottom: 4%; }
.margin-six-bottom { margin-bottom: 6%; }
.margin-eight-bottom { margin-bottom: 8%; }

/* Padding - pixel */
.padding-10px-tb { padding-top: 10px; padding-bottom: 10px; }
.padding-10px-top { padding-top: 10px; }
.padding-15px-all { padding: 15px; }
.padding-15px-lr { padding-left: 15px; padding-right: 15px; }
.padding-20px-tb { padding-top: 20px; padding-bottom: 20px; }
.padding-30px-tb { padding-top: 30px; padding-bottom: 30px; }
.padding-35px-all { padding: 35px; }
.padding-40px-lr { padding-left: 40px; padding-right: 40px; }
.padding-50px-all { padding: 50px; }
.padding-50px-tb { padding-top: 50px; padding-bottom: 50px; }
.padding-60px-bottom { padding-bottom: 60px; }
.padding-90px-top { padding-top: 90px; }

/* Padding - percent */
.padding-two-tb { padding-top: 2%; padding-bottom: 2%; }
.padding-five-lr { padding-left: 5%; padding-right: 5%; }
.padding-six-all { padding: 6%; }
.padding-eight-all { padding: 8%; }
.padding-seventeen-lr { padding-left: 17%; padding-right: 17%; }
.padding-twenty-tb { padding-top: 20%; padding-bottom: 20%; }

/* ═══════════════════════════════════════════
   10. Display & Position (used only)
   ═══════════════════════════════════════════ */
.d-block { display: block !important; }
.d-inline-block { display: inline-block !important; }
.d-inline { display: inline !important; }
.d-flex { display: flex !important; }
.d-table { display: table !important; }
.d-table-cell { display: table-cell !important; }
.d-none { display: none !important; }
.overflow-hidden { overflow: hidden !important; }
.position-relative { position: relative; }
.position-absolute { position: absolute; }

.top-0 { top: 0 !important; }
.bottom-0 { bottom: 0; }
.left-0 { left: 0; }
.left-8 { left: 8px; }
.right-0 { right: 0; }

.z-index-0 { z-index: 0; }
.z-index-minus2 { z-index: -2; }

/* Width */
.w-30 { width: 30%; }
.w-55 { width: 55%; }
.w-60 { width: 60%; }
.w-65 { width: 65%; }
.w-80 { width: 80%; }
.w-85 { width: 85%; }
.w-90 { width: 90%; }
.w-95 { width: 95%; }
.w-100 { width: 100%; }
.w-100px { width: 100px; }
.h-100 { height: 100%; }

/* Opacity */
.opacity6 { opacity: .6; }
.opacity-medium { position: absolute; height: 100%; width: 100%; opacity: 0.75; top: 0; left: 0; }
.opacity-extra-medium { position: absolute; height: 100%; width: 100%; opacity: 0.5; top: 0; left: 0; }
.opacity-full-dark { position: absolute; height: 100%; width: 100%; opacity: 0.9; top: 0; left: 0; }

/* Box shadow */
.box-shadow { box-shadow: 0 0 3px rgba(0,0,0,.2); }

/* ═══════════════════════════════════════════
   11. Icons (used sizes only)
   ═══════════════════════════════════════════ */
.icon-small { font-size: 24px; }
.icon-medium { font-size: 35px; }
[class^="ti-"], [class*=" ti-"] { display: inline-block; }

/* ═══════════════════════════════════════════
   12. Header & Navigation (jg-nav)
   ═══════════════════════════════════════════ */
header { width: 100%; z-index: 99; }

/* ═══════════════════════════════════════════
   13. Blog & Content
   ═══════════════════════════════════════════ */
.blog-grid .grid-item a { position: relative; z-index: 11; }
.blog-image a > img { width: 100%; }
.blog-post .author { padding: 10px 0; position: relative; }
.blog-post-style8:hover { background-color: #1c1c1c !important; color: #fff; }
.blog-post-style8 .author:before {
  width: 100px; height: 1px; background-color: #939393 !important;
  opacity: 0.25; position: absolute; top: 0; left: 0; display: inline-block; content: "";
}

/* Tags */
.tag-cloud a {
  font-size: 10px; padding: 3px 8px; border: 1px solid #d9d9d9;
  margin: 0 8px 8px 0; display: inline-block; text-transform: uppercase;
  color: #232323; line-height: 18px;
}
.tag-cloud a:hover { background: #232323; color: #fff !important; border-color: #232323; }
.tags {
  font-size: 10px; padding: 3px 8px; border: 1px solid #d9d9d9;
  margin: 0 8px 8px 0; display: inline-block; text-transform: uppercase;
  color: #232323; line-height: 18px;
}

/* ═══════════════════════════════════════════
   14. Grid & Portfolio (used systems only)
   ═══════════════════════════════════════════ */
.grid { list-style: none; padding: 0; margin: 0; }
.grid-sizer { padding: 0 !important; margin: 0 !important; }
.grid.grid-3col li { width: 33.33%; float: left; list-style: none; }
.grid.gutter-medium li { padding: 7px; }
.grid-item { opacity: 1; overflow: hidden; }

.portfolio-wrapper .grid-item figure { margin: 0; position: relative; overflow: hidden; }
.portfolio-wrapper .grid-item figure img { cursor: pointer; display: block; opacity: 1; width: 100%; transition: all 0.3s ease; }
.portfolio-wrapper .grid-item figcaption {
  bottom: 0; left: 0; opacity: 0; position: absolute; transition: all 0.3s ease;
  width: 100%; height: 100%; padding: 45px; z-index: 1; text-align: center;
}
.portfolio-wrapper .grid-item figure:hover img { opacity: 0.15; transform: scale(1.1); }
.portfolio-wrapper .grid-item figure:hover figcaption { opacity: 1; }

/* Portfolio hover option 6 */
.hover-option6 .grid-item figcaption { height: 100%; position: relative; opacity: 1; padding: 35px 10px; background: #fff; }
.hover-option6 .grid-item .portfolio-hover-main { transform: none; display: table; height: 100%; top: 0; width: 100%; }
.hover-option6 .grid-item .portfolio-icon {
  transition: all 0.3s ease; position: absolute; transform: translateY(-50%);
  top: 55%; left: 0; right: 0; opacity: 0;
}
.hover-option6 .grid-item figure:hover .portfolio-icon { opacity: 1; top: 50%; }
.hover-option6 .grid-item figure:hover img { cursor: default; opacity: .15; transform: scale(1); }

.portfolio-hover-main { display: table; height: 100%; width: 100%; }
.portfolio-hover-box { display: table-cell; height: 100%; vertical-align: middle; }
.portfolio-hover-content { position: relative; }
.portfolio-img { position: relative; overflow: hidden; }
.portfolio-icon { text-align: center; }

/* ═══════════════════════════════════════════
   15. Swiper (minimal)
   ═══════════════════════════════════════════ */
.swiper { overflow: hidden; position: relative; width: 100%; z-index: 1; }
.swiper-wrapper { display: flex; }
.swiper-slide { flex-shrink: 0; }
.swiper-pagination { width: 100%; }
.swiper-pagination-white .swiper-pagination-bullet { background: #fff; }
.swiper-pagination-white .swiper-pagination-bullet-active { background: #fff; }

/* ═══════════════════════════════════════════
   16. Tabs (style 2 only)
   ═══════════════════════════════════════════ */
.nav-tabs { border-bottom: 1px solid #e5e5e5; display: flex; list-style: none; padding: 0; margin: 0; }
.nav-tabs > li { display: inline-block; }
.nav-tabs a.nav-link { transition: all .3s ease; text-decoration: none; }
.tab-style2 .tab-content { padding: 55px 0 0; border-top: 1px solid #e5e5e5; }
.tab-style2 .nav-tabs { border: 0; }
.tab-style2 .nav-tabs li { border: 1px solid #e5e5e5; border-bottom: none; display: inline-block; margin-right: 5px; }
.tab-style2 .nav-tabs li a { background-color: #f7f7f7; border: none; color: #575757; line-height: 44px; padding: 0 25px; }
.tab-style2 .nav-tabs > li > a.active { background: #fff; top: 1px; position: relative; }
.tab-content > .tab-pane { display: none; }
.tab-content > .tab-pane.active { display: block; }

/* ═══════════════════════════════════════════
   17. Feature Box (used styles only)
   ═══════════════════════════════════════════ */
.feature-box-5 { padding-left: 75px; }
.feature-box-5 i { position: absolute; top: 0; left: 0; }
.feature-box-16 .feature-box-content { position: absolute; bottom: 0; width: 100%; transition: ease-in-out 0.4s; height: 60px; }
.feature-box-16 .feature-box-content p { opacity: 0; transition: ease-in-out 0.5s; }
.feature-box-16 { position: relative; overflow: hidden; }
.feature-box-16:hover .feature-box-content { height: 100%; }
.feature-box-16:hover .feature-box-content p { opacity: 1; }

/* ═══════════════════════════════════════════
   18. Pagination
   ═══════════════════════════════════════════ */
.pagination { border-radius: 0; padding: 0; margin: 0; }
.pagination li { display: inline; }
.pagination a { float: left; padding: 0 18px; line-height: 40px; border: 1px solid #ddd; border-left-width: 0; background: #fff; text-decoration: none; }
.pagination a:hover { background-color: #232323; color: #fff; }
.pagination li:first-child a { border-left-width: 1px; }

/* ═══════════════════════════════════════════
   19. Footer
   ═══════════════════════════════════════════ */
.scroll-top-arrow, .scroll-top-arrow:focus {
  color: #fff; background: #878787; line-height: 28px; display: none;
  height: 30px; width: 30px; padding: 0; position: fixed; right: 45px;
  text-align: center; text-decoration: none; top: 91%; z-index: 10006; border-radius: 100%;
  border: none; cursor: pointer; font-size: inherit;
}
.scroll-top-arrow:hover { background: #000; opacity: .8; color: #fff; }
.scroll-top-arrow:focus-visible { outline: 2px solid #294557; outline-offset: 2px; }
.scroll-top-arrow i { line-height: 30px; }
.footer-standard { margin-top: auto; }

/* Grid filter */
.grid-filter li { display: inline-block; float: none; padding: 0 20px; }
.grid-filter li a { border-bottom: 1px solid transparent; color: #828282; padding-bottom: 2px; }
.grid-filter > li.active > a, .grid-filter > li > a:hover { border-bottom: 1px solid #232323; color: #232323; }

/* List style 6 */
.list-style-6 { list-style: none; margin: 0; padding: 0; }
.list-style-6 li { position: relative; padding: 0 15px 8px 0; margin: 0 0 8px 0; border-bottom: 1px solid rgba(0,0,0,.1); }
.list-style-6 li span { position: absolute; top: 3px; right: 0; }
.list-style-6 li:last-child { border-bottom: none; }

/* Page title */
.page-title-large h1 { font-size: 46px; line-height: 49px; }
.one-third-screen { height: 700px; }
.down-section { position: absolute; width: 100%; bottom: 50px; left: 0; right: 0; }

/* Separator lines */
.separator-line-horrizontal-full { width: 100%; height: 1px; display: inline-block; }
.separator-line-horrizontal-medium-light2 { width: 40%; height: 1px; }

/* ═══════════════════════════════════════════
   20. Status Indicator
   ═══════════════════════════════════════════ */
.user-status { display: inline-flex; align-items: center; gap: 0.4em; font-size: 0.95em; }
.status-indicator {
  width: 10px; height: 10px; border-radius: 50%; display: inline-block;
  background-color: #9e9e9e; transition: box-shadow 0.3s ease, background-color 0.3s ease;
}
.status-online { background-color: #4caf50; box-shadow: 0 0 6px 1px rgba(76,175,80,.4); }
.status-away { background-color: #ff9800; box-shadow: 0 0 6px 1px rgba(255,152,0,.4); }
.status-offline { background-color: #9e9e9e; }

@keyframes subtle-pulse {
  0% { box-shadow: 0 0 6px 1px rgba(0,0,0,.1); }
  50% { box-shadow: 0 0 8px 2px rgba(0,0,0,.2); }
  100% { box-shadow: 0 0 6px 1px rgba(0,0,0,.1); }
}
.status-online, .status-away { animation: subtle-pulse 2.4s infinite ease-in-out; }

/* ═══════════════════════════════════════════
   21. External Link Indicator
   ═══════════════════════════════════════════ */
a[href]:not(:where(
  [href^="#"], [href^="tel:"], [href^="javascript:" i],
  [href^="/"]:not([href^="//"]),
  [href*="//joegullo.com"], [href*="joegullo"],
  [href*="//flourish.studio"]
)):after {
  content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgZmlsbD0iIzAwMDAwMCIgdmlld0JveD0iMCAwIDI1NiAyNTYiPjxwYXRoIGQ9Ik0xOTIsMTM2djcyYTE2LDE2LDAsMCwxLTE2LDE2SDQ4YTE2LDE2LDAsMCwxLTE2LTE2VjgwQTE2LDE2LDAsMCwxLDQ4LDY0aDcyYTgsOCwwLDAsMSwwLDE2SDQ4VjIwOEgxNzZWMTM2YTgsOCwwLDAsMSwxNiwwWm0zMi05NmE4LDgsMCwwLDAtOC04SDE1MmE4LDgsMCwwLDAtNS42NiwxMy42NkwxNzIuNjksNzJsLTQyLjM1LDQyLjM0YTgsOCwwLDAsMCwxMS4zMiwxMS4zMkwxODQsODMuMzFsMjYuMzQsMjYuMzVBOCw4LDAsMCwwLDIyNCwxMDRaIj48L3BhdGg+PC9zdmc+);
  position: relative;
  margin: 0 1px 0 3px;
  vertical-align: middle;
}

/* No-underline helper */
a.nounderline:link, a.nounderline:active, a.nounderline:visited, a.nounderline:hover { text-decoration: none; }

/* ═══════════════════════════════════════════
   22. Chip Component
   ═══════════════════════════════════════════ */
[data-chip="true"] {
  display: inline-flex; align-items: center; gap: 0.35rem; padding: 0 0.6rem;
  min-height: 1.6rem; border-radius: 999px; font-size: 0.8rem; line-height: 1;
  border: 1px solid #e5e7eb; background-color: #f3f4f6; color: #111827; white-space: nowrap;
}
[data-chip="true"][data-chip-type="wcag"] { background-color: #0f766e; border-color: #0f766e; color: #ecfdf5; }
[data-chip="true"][data-chip-type="eaa"] { background-color: #1d4ed8; border-color: #1d4ed8; color: #eff6ff; }
[data-chip="true"][data-chip-type="ada"] { background-color: #7c3aed; border-color: #7c3aed; color: #f5f3ff; }
[data-chip="true"][data-chip-variant="outline"] { background-color: transparent; }
[data-chip="true"][data-chip-icon]:before { content: attr(data-chip-icon); margin-right: 0.25rem; font-size: 0.9em; }

/* ═══════════════════════════════════════════
   23. Mobile / Responsive Visibility
   ═══════════════════════════════════════════ */
.mobileShow { display: none; }
@media (max-width: 480px) { .mobileShow { display: inline; } }
.mobileHide { display: inline; }
@media (max-width: 480px) { .mobileHide { display: none; } }

/* ═══════════════════════════════════════════
   24. Responsive — Used breakpoint classes
   ═══════════════════════════════════════════ */

/* --- Medium screens (tablets, < 992px) --- */
@media (max-width: 991px) {
  .md-w-100 { width: 100% !important; }
  .md-w-80 { width: 80% !important; }
  .md-h-500px { height: 500px; }
  .md-margin-10px-bottom { margin-bottom: 10px !important; }
  .md-margin-30px-bottom { margin-bottom: 30px !important; }
  .md-margin-30px-top { margin-top: 30px !important; }
  .md-margin-40px-bottom { margin-bottom: 40px !important; }
  .md-margin-50px-bottom { margin-bottom: 50px !important; }
  .md-margin-60px-bottom { margin-bottom: 60px !important; }
  .md-margin-lr-auto { margin-left: auto !important; margin-right: auto !important; }
  .md-margin-two-bottom { margin-bottom: 2% !important; }
  .md-no-border { border: 0 !important; }
  .md-no-margin-right { margin-right: 0 !important; }
  .md-no-margin-tb { margin-top: 0 !important; margin-bottom: 0 !important; }
  .md-no-margin-top { margin-top: 0 !important; }
  .md-no-padding-left { padding-left: 0 !important; }
  .md-no-padding-lr { padding-left: 0 !important; padding-right: 0 !important; }
  .md-padding-15px-lr { padding-left: 15px !important; padding-right: 15px !important; }
  .md-padding-25px-lr { padding-left: 25px !important; padding-right: 25px !important; }
  .md-padding-30px-bottom { padding-bottom: 30px !important; }
  .md-padding-50px-tb { padding-top: 50px !important; padding-bottom: 50px !important; }
  .md-padding-50px-top { padding-top: 50px !important; }
  .md-grid-2col li { width: 50% !important; }
  .text-md-start { text-align: start !important; }
  .text-md-end { text-align: end !important; }
  .d-lg-inline-block { display: none !important; }
}

/* --- Small screens (phones, < 768px) --- */
@media (max-width: 767px) {
  .sm-w-100 { width: 100% !important; }
  .sm-w-90 { width: 90% !important; }
  .sm-h-300px { height: 300px; }
  .sm-margin-10px-bottom { margin-bottom: 10px !important; }
  .sm-margin-20px-bottom { margin-bottom: 20px !important; }
  .sm-margin-30px-bottom { margin-bottom: 30px !important; }
  .sm-margin-40px-bottom { margin-bottom: 40px !important; }
  .sm-margin-50px-bottom { margin-bottom: 50px !important; }
  .sm-no-margin-lr { margin-left: 0 !important; margin-right: 0 !important; }
  .sm-no-margin-tb { margin-top: 0 !important; margin-bottom: 0 !important; }
  .sm-no-padding-lr { padding-left: 0 !important; padding-right: 0 !important; }
  .sm-padding-10px-all { padding: 10px !important; }
  .sm-padding-15px-lr { padding-left: 15px !important; padding-right: 15px !important; }
  .sm-padding-30px-all { padding: 30px !important; }
  .sm-padding-30px-tb { padding-top: 30px !important; padding-bottom: 30px !important; }
  .sm-padding-30px-top { padding-top: 30px !important; }
  .sm-grid-1col li { width: 100% !important; }

  /* Heading scaling */
  h1 { font-size: 1.5em; }
  h2 { font-size: 1.3em; }
  .margin-350px-lr { margin-left: 15px; margin-right: 15px; }
}

/* --- Large screens (> 992px) --- */
@media (min-width: 992px) {
  .d-lg-inline-block { display: inline-block !important; }
  .text-lg-start { text-align: start !important; }
  .lg-w-100 { width: 100% !important; }
  .lg-margin-15px-bottom { margin-bottom: 15px !important; }
  .lg-margin-50px-bottom { margin-bottom: 50px !important; }
  .lg-margin-50px-top { margin-top: 50px !important; }
  .lg-margin-three-top { margin-top: 3% !important; }
  .lg-no-border-right { border-right: 0 !important; }
  .lg-padding-30px-all { padding: 30px !important; }
  .lg-padding-30px-tb { padding-top: 30px !important; padding-bottom: 30px !important; }
  .lg-padding-40px-lr { padding-left: 40px !important; padding-right: 40px !important; }
  .lg-padding-ten-all { padding: 10% !important; }
  .lg-padding-two-lr { padding-left: 2% !important; padding-right: 2% !important; }
  .lg-grid-3col li { width: 33.33% !important; }
}

/* Bootstrap-compatible column grid */
@media (min-width: 576px) {
  .container { max-width: 540px; }
}
@media (min-width: 768px) {
  .container { max-width: 720px; }
  .col-md-2 { flex: 0 0 16.667%; max-width: 16.667%; }
  .col-md-3 { flex: 0 0 25%; max-width: 25%; }
  .col-md-5 { flex: 0 0 41.667%; max-width: 41.667%; }
  .col-md-6 { flex: 0 0 50%; max-width: 50%; }
  .col-md-7 { flex: 0 0 58.333%; max-width: 58.333%; }
  .col-md-10 { flex: 0 0 83.333%; max-width: 83.333%; }
  .col-md-12 { flex: 0 0 100%; max-width: 100%; }
  .row-cols-md-2 > * { flex: 0 0 50%; max-width: 50%; }
}
@media (min-width: 992px) {
  .container { max-width: 960px; }
  .col-lg-2 { flex: 0 0 16.667%; max-width: 16.667%; }
  .col-lg-3 { flex: 0 0 25%; max-width: 25%; }
  .col-lg-4 { flex: 0 0 33.333%; max-width: 33.333%; }
  .col-lg-5 { flex: 0 0 41.667%; max-width: 41.667%; }
  .col-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .col-lg-7 { flex: 0 0 58.333%; max-width: 58.333%; }
  .col-lg-8 { flex: 0 0 66.667%; max-width: 66.667%; }
  .col-lg-9 { flex: 0 0 75%; max-width: 75%; }
  .col-lg-10 { flex: 0 0 83.333%; max-width: 83.333%; }
}
@media (min-width: 1200px) {
  .container { max-width: 1140px; }
}
@media (min-width: 1400px) {
  .container-lg { max-width: 1200px; }
}

/* Column base */
[class*="col-"] { position: relative; width: 100%; min-height: 1px; }
.row-cols-1 > * { flex: 0 0 100%; max-width: 100%; }
.col-auto { flex: 0 0 auto; width: auto; }
.col { flex: 1 0 0%; }

/* Flexbox utilities */
.justify-content-center { justify-content: center !important; }
.justify-content-end { justify-content: flex-end !important; }
.align-items-center { align-items: center !important; }
.flex-wrap { flex-wrap: wrap; }

/* Bootstrap spacing utilities used in templates */
.mb-0 { margin-bottom: 0 !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }
.ps-0 { padding-left: 0 !important; }
.pe-0 { padding-right: 0 !important; }
.pe-md-3 { }
@media (min-width: 768px) { .pe-md-3 { padding-right: 1rem !important; } }

/* Collapse utility */
.collapse:not(.show) { display: none; }
.collapse.show { display: block; }

/* ═══════════════════════════════════════════
   25. Connect Page — Button Alignment
   ═══════════════════════════════════════════ */
.connect-card__actions {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  margin-top: 1.25rem;
}

.connect-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  color: #374151;
  background-color: #fff;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  transition: all 0.2s ease;
  cursor: pointer;
  width: 100%;
  min-height: 48px;
  line-height: 1;
}

.connect-action-btn i,
.connect-action-btn [class^="ph-"],
.connect-action-btn [class*=" ph-"] {
  font-size: 1.125rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
}

.connect-action-btn:hover {
  border-color: #294557;
  color: #294557;
  background-color: rgba(41, 69, 87, 0.04);
}

.connect-action-btn:focus-visible {
  outline: 3px solid #294557;
  outline-offset: 3px;
}

/* ═══════════════════════════════════════════
   26. Accessibility Demo Page — Site Design Alignment
   ═══════════════════════════════════════════ */
.a11y-demo-methodology {
  background: transparent;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  line-height: 1.6;
  max-width: 72rem;
  margin: 0 auto;
}

.a11y-demo-methodology .demo-header {
  margin-bottom: 0;
  padding: 4rem 1.5rem 3rem;
  border-bottom: none;
  text-align: center;
  background: #fff;
}

.a11y-demo-methodology .demo-header h1 {
  color: #111827;
  margin-bottom: 1rem;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.2;
}

.a11y-demo-methodology .demo-intro {
  color: #4b5563;
  font-size: 1.0625rem;
  line-height: 1.7;
  max-width: 44rem;
  margin: 0 auto;
}

.a11y-demo-methodology .feature-section {
  display: grid;
  gap: 1.5rem;
  margin: 0;
  padding: 3rem 1.5rem;
  background: #f8fafc;
}

.a11y-demo-methodology .feature-card {
  background: #fff;
  padding: 2rem;
  border-radius: 0.75rem;
  border-left: none;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.a11y-demo-methodology .feature-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  border-color: #d1d5db;
  transform: none;
}

.a11y-demo-methodology .feature-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

.a11y-demo-methodology .feature-icon {
  font-size: 1.75rem;
  line-height: 1;
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(41, 69, 87, 0.08);
  border-radius: 0.625rem;
  flex-shrink: 0;
}

.a11y-demo-methodology .feature-header h3 {
  color: #111827;
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.a11y-demo-methodology .feature-body {
  margin-left: 0;
}

.a11y-demo-methodology .feature-description {
  color: #4b5563;
  margin-bottom: 1.25rem;
  font-size: 0.9375rem;
  line-height: 1.7;
}

.a11y-demo-methodology .compliance-info {
  background: #f8fafc;
  padding: 1.5rem;
  border-radius: 0.625rem;
  margin: 1.25rem 0;
  font-size: 0.875rem;
  border: 1px solid #e5e7eb;
}

.a11y-demo-methodology .compliance-info strong {
  color: #294557;
  display: block;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  font-size: 0.875rem;
}

.a11y-demo-methodology .compliance-info strong:first-child {
  margin-top: 0;
}

.a11y-demo-methodology .compliance-info ul {
  margin: 0.5rem 0;
  padding-left: 1.5rem;
}

.a11y-demo-methodology .compliance-info li {
  margin: 0.375rem 0;
  color: #4b5563;
  font-size: 0.875rem;
  line-height: 1.6;
}

.a11y-demo-methodology .demo-btn {
  padding: 0.75rem 1.5rem;
  background: #294557;
  color: #fff;
  border: 2px solid #294557;
  border-radius: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: 1rem;
  font-family: inherit;
  min-height: 48px;
}

.a11y-demo-methodology .demo-btn:hover {
  background: #1a2f3d;
  border-color: #1a2f3d;
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
}

.a11y-demo-methodology .demo-btn:focus-visible {
  outline: 3px solid #294557;
  outline-offset: 3px;
}

.a11y-demo-methodology .demo-btn:active {
  transform: translateY(0);
}

.a11y-demo-methodology .demo-btn[aria-pressed="true"] {
  background: #0f766e;
  border-color: #0f766e;
}

.a11y-demo-methodology .demo-output {
  min-height: 3.5rem;
  padding: 1.25rem;
  background: #eff6ff;
  border-left: 3px solid #294557;
  border-radius: 0.5rem;
  margin: 0 1.5rem 1.5rem;
  font-size: 0.875rem;
  color: #1e3a5f;
  line-height: 1.6;
}

.a11y-demo-methodology .text-size-controls {
  background: #f8fafc;
  padding: 1.25rem;
  border-radius: 0.625rem;
  margin: 1.25rem 0;
  border: 1px solid #e5e7eb;
}

.a11y-demo-methodology kbd {
  background: #fff;
  border: 1px solid #d1d5db;
  border-radius: 0.25rem;
  padding: 0.125rem 0.375rem;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  color: #374151;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}

@media (max-width: 768px) {
  .a11y-demo-methodology .demo-header {
    padding: 2.5rem 1rem 2rem;
  }
  .a11y-demo-methodology .feature-section {
    padding: 2rem 1rem;
  }
  .a11y-demo-methodology .feature-card {
    padding: 1.5rem;
  }
  .a11y-demo-methodology .feature-icon {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.375rem;
  }
  .a11y-demo-methodology .feature-header h3 {
    font-size: 1.125rem;
  }
}

/* ═══════════════════════════════════════════
   27. Reduced Motion (global)
   ═══════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ═══════════════════════════════════════════
   28. Navigation (jg-nav)
   ═══════════════════════════════════════════ */
.jg-nav ul,.jg-nav ol,.jg-nav li,
.jg-nav__overlay ul,.jg-nav__overlay ol,.jg-nav__overlay li{list-style:none;margin:0;padding:0}
.jg-nav a{text-decoration:none}

.jg-skip{position:absolute;top:-60px;left:0;background:#294557;color:#fff;padding:12px 24px;text-decoration:none;z-index:10000;font-family:'Inter',system-ui,sans-serif;font-weight:600;font-size:14px;transition:top .2s}
.jg-skip:focus{top:0;outline:3px solid #294557;outline-offset:2px}

.jg-nav{position:relative;z-index:1000;font-family:'Inter',system-ui,sans-serif;border-bottom:1px solid #e0e0e0;background:#fff}
.jg-nav__bar{max-width:1200px;margin:0 auto;padding:10px 15px;display:flex;align-items:center;justify-content:space-between}
.jg-nav__logo{display:flex;align-items:center;text-decoration:none;flex-shrink:0}
.jg-nav__logo img{display:block;height:60px;width:auto}
.jg-nav__logo:focus-visible{outline:3px solid #294557;outline-offset:4px;border-radius:4px}

.jg-nav__mob{display:none;align-items:center;gap:12px}
.jg-nav__mob-lang{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;border:1.5px solid #e5e7eb;border-radius:6px;color:#232323;font-size:13px;font-weight:600;text-decoration:none;transition:all .15s}
.jg-nav__mob-lang:hover{border-color:#294557;color:#294557}
.jg-nav__mob-lang:focus-visible{outline:3px solid #294557;outline-offset:2px}

.jg-nav__burger{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;background:none;border:1.5px solid #e5e7eb;border-radius:6px;cursor:pointer;padding:0;transition:border-color .15s}
.jg-nav__burger:hover{border-color:#294557}
.jg-nav__burger:focus-visible{outline:3px solid #294557;outline-offset:2px}
.jg-nav__burger-line{display:block;width:18px;height:2px;background:#232323;border-radius:1px}

.jg-nav__desktop{display:flex;align-items:center;gap:0}
.jg-nav__list{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0}
.jg-nav__item{position:relative}
.jg-nav__link{display:inline-flex;align-items:center;gap:4px;padding:5px 0;margin:0 20px;color:#232323;text-decoration:none;font-size:14px;font-weight:600;transition:color .15s;white-space:nowrap;position:relative}
.jg-nav__link:hover{color:rgba(0,0,0,.6)}
.jg-nav__link:focus-visible{outline:3px solid #294557;outline-offset:3px;border-radius:2px}
.jg-nav__link--active,.jg-nav__link[aria-current="page"]{color:#294557;font-weight:700}
.jg-nav__link--active::after,.jg-nav__link[aria-current="page"]::after{content:'';position:absolute;bottom:-10px;left:0;right:0;height:2px;background:#294557;border-radius:1px}
.jg-nav__chevron{transition:transform .2s;flex-shrink:0}
.jg-nav__link[aria-expanded="true"] .jg-nav__chevron{transform:rotate(180deg)}

.jg-nav__dropdown{display:none;position:absolute;top:calc(100% + 10px);left:0;min-width:200px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.1);padding:6px 0;list-style:none;margin:0;z-index:100}
.jg-nav__dropdown--open{display:block;animation:jgDropIn .15s ease}
@keyframes jgDropIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.jg-nav__dd-link{display:block;padding:10px 16px;color:#232323;text-decoration:none;font-size:13px;font-weight:500;transition:color .1s,background .1s;min-height:40px;line-height:1.4}
.jg-nav__dd-link:hover{color:#294557;background:rgba(41,69,87,.05)}
.jg-nav__dd-link:focus-visible{outline:3px solid #294557;outline-offset:-3px;border-radius:4px}
.jg-nav__dd-link--active{color:#294557;font-weight:700}

.jg-nav__lang{position:relative;margin-left:20px}
.jg-nav__lang-btn{display:inline-flex;align-items:center;gap:4px;padding:7px 12px;background:none;border:1.5px solid #e5e7eb;border-radius:6px;color:#232323;font-family:'Inter',system-ui,sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}
.jg-nav__lang-btn:hover{border-color:#294557;color:#294557}
.jg-nav__lang-btn:focus-visible{outline:3px solid #294557;outline-offset:2px}
.jg-nav__lang-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.jg-nav__lang-dd{display:none;position:absolute;top:calc(100% + 6px);right:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.1);min-width:120px;padding:4px 0;list-style:none;margin:0;z-index:100}
.jg-nav__lang-dd--open{display:block}
.jg-nav__lang-link{display:block;padding:8px 16px;color:#232323;text-decoration:none;font-size:14px;transition:background .1s,color .1s}
.jg-nav__lang-link:hover{background:rgba(41,69,87,.05);color:#294557}
.jg-nav__lang-link:focus-visible{outline:3px solid #294557;outline-offset:-3px}
.jg-nav__lang-link--active{color:#294557;font-weight:600}

/* Mobile overlay */
.jg-nav__overlay{position:fixed;inset:0;z-index:9999;background:#111827;display:flex;flex-direction:column;padding:5rem 2rem 2rem;overflow-y:auto;-webkit-overflow-scrolling:touch;opacity:0;visibility:hidden;transform:translateX(100%);transition:opacity .3s,transform .3s,visibility 0s .3s}
.jg-nav__overlay--open{opacity:1;visibility:visible;transform:translateX(0);transition:opacity .3s,transform .3s,visibility 0s 0s}
.jg-nav__close{position:absolute;top:20px;right:20px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:none;border:1.5px solid rgba(255,255,255,.15);border-radius:50%;color:#f9fafb;cursor:pointer;transition:background .15s}
.jg-nav__close:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.3)}
.jg-nav__close:focus-visible{outline:3px solid #7cb8f7;outline-offset:2px}
.jg-nav__ov-list{list-style:none;margin:0;padding:0;flex:1}
.jg-nav__ov-item{opacity:0;transform:translateX(20px);border-bottom:1px solid rgba(255,255,255,.08)}
.jg-nav__overlay--open .jg-nav__ov-item{opacity:1;transform:translateX(0);transition:opacity .35s,transform .35s;transition-delay:calc(.08s * var(--i,0))}
.jg-nav__ov-link{display:flex;align-items:center;padding:18px 0;color:#f9fafb;text-decoration:none;font-size:20px;font-weight:500;letter-spacing:-.01em;min-height:56px;transition:color .15s}
.jg-nav__ov-link:hover{color:#7cb8f7}
.jg-nav__ov-link:focus-visible{outline:3px solid #7cb8f7;outline-offset:4px;border-radius:4px}
.jg-nav__ov-link--active{color:#7cb8f7;font-weight:600}
.jg-nav__ov-sub{list-style:none;margin:0;padding:0 0 8px 20px}
.jg-nav__ov-sublink{display:flex;align-items:center;padding:10px 0;color:#9ca3af;text-decoration:none;font-size:16px;font-weight:400;min-height:48px;transition:color .15s}
.jg-nav__ov-sublink:hover{color:#f9fafb}
.jg-nav__ov-sublink:focus-visible{outline:3px solid #7cb8f7;outline-offset:4px;border-radius:4px}
.jg-nav__ov-sublink--active{color:#7cb8f7;font-weight:600}
.jg-nav__ov-lang{display:flex;gap:12px;padding-top:24px;margin-top:auto;border-top:1px solid rgba(255,255,255,.08)}
.jg-nav__ov-lang-link{display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;border:1.5px solid rgba(255,255,255,.15);border-radius:6px;color:#9ca3af;text-decoration:none;font-size:15px;font-weight:500;min-height:48px;transition:all .15s;flex:1;text-align:center}
.jg-nav__ov-lang-link:hover{border-color:#7cb8f7;color:#f9fafb}
.jg-nav__ov-lang-link:focus-visible{outline:3px solid #7cb8f7;outline-offset:2px}
.jg-nav__ov-lang-link--active{background:rgba(124,184,247,.12);border-color:#7cb8f7;color:#7cb8f7;font-weight:600}

@media(max-width:991px){
  .jg-nav__mob{display:flex}
  .jg-nav__burger{display:flex}
  .jg-nav__desktop{display:none}
  .jg-nav__bar{padding:8px 15px}
  .jg-nav__logo img{height:48px}
}
@media(min-width:1400px){.jg-nav__bar{padding:10px 30px}}
body.jg-nav-open{overflow:hidden}
@media(min-width:992px){body.jg-nav-open{overflow:auto}}

/* ═══════════════════════════════════════════
   28.5 Breadcrumbs (sc-breadcrumbs) — global
   ═══════════════════════════════════════════ */
.sc-breadcrumbs{background:#f7f7f7;padding:.75rem 0;margin:0;width:100%}
.sc-breadcrumb-list{max-width:1200px;margin:0 auto;padding:0 1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;list-style:none}
.sc-breadcrumb-item{display:inline-flex;align-items:center;gap:.5rem}
.sc-breadcrumb-link{color:#374151;text-decoration:none;transition:color .2s;font-size:.875rem;line-height:1.25rem;font-weight:400;border-radius:4px;padding:.25rem .4rem;margin:-.25rem -.4rem}
.sc-breadcrumb-link:hover{color:#111827}
.sc-breadcrumb-link:focus-visible{outline:3px solid #294557;outline-offset:2px;color:#111827;border-radius:4px}
.sc-breadcrumb-page{color:#111827;font-size:.875rem;line-height:1.25rem;font-weight:600}
.sc-breadcrumb-separator{color:#4b5563;user-select:none;font-size:.875rem}

/* ═══════════════════════════════════════════
   29. Footer (jg-footer)
   ═══════════════════════════════════════════ */
.jg-footer{background-color:#f7f7f7;padding:50px 0;font-family:'Inter',system-ui,sans-serif;font-size:12px;line-height:20px;color:#4b5563}
.jg-footer__inner{max-width:1200px;margin:0 auto;padding:0 15px;display:flex;justify-content:space-between;align-items:center;gap:2rem}
.jg-footer__left{flex-shrink:0}
.jg-footer__copy{margin:0;color:#232323;font-weight:500}
.jg-footer__cookies{margin:4px 0 0}
.jg-footer__cookies a,.jg-footer__cookies-btn{color:#374151 !important;text-decoration:underline;text-underline-offset:2px;background:none !important;background-color:transparent !important;border:none !important;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;cursor:pointer;padding:0;margin:0;-webkit-appearance:none;appearance:none;display:inline;box-shadow:none}
.jg-footer__cookies a:hover,.jg-footer__cookies-btn:hover{color:#294557 !important}
.jg-footer__cookies-btn:focus-visible{outline:2px solid #294557;outline-offset:2px;border-radius:2px}
.jg-footer__nav{display:flex;flex-wrap:wrap;align-items:center;gap:2px;justify-content:flex-end;line-height:1.8}
.jg-footer__nav a{color:#374151 !important;text-decoration:underline;text-underline-offset:2px;padding:4px 6px;white-space:nowrap;transition:color .15s}
.jg-footer__nav a:hover{color:#294557 !important}
.jg-footer__nav a:focus-visible{outline:2px solid #294557;outline-offset:2px;border-radius:2px}
.jg-footer__sep{display:inline-block;width:1px;height:.9em;background:#9ca3af;vertical-align:middle;margin:0 6px}
@media(max-width:768px){
  .jg-footer{padding:30px 0}
  .jg-footer__inner{flex-direction:column;text-align:center;gap:1.25rem}
  .jg-footer__left{text-align:center}
  .jg-footer__nav{justify-content:center}
  .jg-footer__sep{display:none}
  .jg-footer__nav a{padding:4px 10px}
}

/* ═══════════════════════════════════════════
   30. Reduced Motion & Accessibility
   ═══════════════════════════════════════════ */
@media(prefers-reduced-motion:reduce){
  .jg-nav__overlay,.jg-nav__ov-item,.jg-nav__link,.jg-nav__dd-link,.jg-nav__dropdown,.jg-nav__chevron,.jg-nav__burger-line,.jg-skip{transition:none!important;animation:none!important}
  .jg-nav__overlay--open .jg-nav__ov-item{opacity:1;transform:none;transition-delay:0s!important}
}
@media(forced-colors:active){
  .jg-nav__link:focus-visible,.jg-nav__dd-link:focus-visible,.jg-nav__burger:focus-visible,.jg-nav__close:focus-visible,.jg-nav__ov-link:focus-visible{outline:3px solid LinkText}
  .jg-nav__link--active::after{background:LinkText}
}

/* ═══════════════════════════════════════════
   32. Score Badge (jg-score)
   ═══════════════════════════════════════════ */
.jg-score{position:relative;display:inline-flex}
.jg-score__pill{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;background:#f8fafc;border:1px solid #e5e7eb;border-radius:6px;font-family:'Inter',system-ui,sans-serif;font-size:12px;font-weight:600;color:#374151;cursor:pointer;transition:all .15s;white-space:nowrap;-webkit-appearance:none;appearance:none}
.jg-score__pill:hover{border-color:#294557;background:#f0f4f8}
.jg-score__pill:focus-visible{outline:3px solid #294557;outline-offset:2px}
.jg-score__dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;animation:jgPulse 2s ease infinite}
@keyframes jgPulse{0%,100%{opacity:1}50%{opacity:.5}}
.jg-score__card{position:absolute;bottom:calc(100% + 10px);left:0;width:280px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.12);padding:1rem;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .2s,visibility 0s .2s;z-index:100}
.jg-score__card[aria-hidden="false"]{opacity:1;visibility:visible;transform:translateY(0);transition:opacity .2s,transform .2s,visibility 0s 0s}
.jg-score__card-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}
.jg-score__ring{position:relative;width:48px;height:48px;flex-shrink:0}
.jg-score__ring svg{display:block}
.jg-score__ring-val{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.jg-score__level{display:block;font-size:14px;font-weight:600;color:#232323}
.jg-score__date{display:block;font-size:11px;color:#4b5563;margin-top:2px}
.jg-score__card-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(55px,1fr));gap:6px;margin-bottom:.75rem}
.jg-score__stat{text-align:center;padding:6px 4px;background:#f8fafc;border-radius:6px}
.jg-score__stat-val{display:block;font-size:16px;font-weight:700}
.jg-score__stat-label{display:block;font-size:10px;color:#4b5563;text-transform:uppercase;letter-spacing:.04em;margin-top:1px}
.jg-score__card-link{display:block;text-align:center;font-size:12px;font-weight:600;color:#294557;text-decoration:none;padding:8px;border-top:1px solid #e5e7eb;margin:0 -1rem -1rem;border-radius:0 0 12px 12px;transition:background .15s}
.jg-score__card-link:hover{background:#f0f4f8}
.jg-score__card-link:focus-visible{outline:3px solid #294557;outline-offset:-3px}
@media(max-width:768px){
  .jg-score__card{left:auto;right:0}
}

/* ═══════════════════════════════════════════
   33. Dark Mode Toggle (jg-theme)
   ═══════════════════════════════════════════ */
.jg-theme{display:inline-flex;align-items:center;justify-content:center;gap:2px;min-width:36px;height:36px;background:none;border:1.5px solid #e5e7eb;border-radius:6px;cursor:pointer;color:#374151;transition:all .15s;padding:0 6px;margin-left:8px;-webkit-appearance:none;appearance:none;font-size:18px;line-height:1}
.jg-theme:hover{border-color:#294557;color:#294557}
.jg-theme:focus-visible{outline:3px solid #294557;outline-offset:2px}
/* In light mode: show moon (click to go dark), hide sun */
.jg-theme__sun{display:none}
.jg-theme__moon{display:inline-block}
/* In dark mode: show sun (click to go light), hide moon */
[data-theme="dark"] .jg-theme__sun{display:inline-block}
[data-theme="dark"] .jg-theme__moon{display:none}
[data-theme="dark"] .jg-theme{border-color:rgba(255,255,255,.2);color:#e5e7eb}
[data-theme="dark"] .jg-theme:hover{border-color:#7cb8f7;color:#7cb8f7}

/* ═══════════════════════════════════════════
   36. Blog — Editorial Feed (jg-blog)
   ═══════════════════════════════════════════
   All colors WCAG AAA verified (7:1 minimum).
   Scoped with jg-blog__ prefix.                */

.jg-blog{background:#fff}
.jg-blog__container{max-width:720px;margin:0 auto;padding:4rem 2rem 5rem}

/* Header */
.jg-blog__header{margin-bottom:3rem}
.jg-blog__title{font-size:1.75rem;font-weight:700;color:#232323;margin-bottom:.5rem}
.jg-blog__intro{font-size:.9375rem;color:#475569;line-height:1.7}

/* Filter chips */
.jg-blog__filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2.5rem;padding-bottom:1.5rem;border-bottom:1px solid #e5e7eb}
.jg-blog__filter{padding:.375rem .875rem;border:1px solid #e5e7eb;border-radius:6px;font-size:.75rem;font-weight:600;color:#475569;background:none;cursor:pointer;font-family:inherit;transition:all .15s;min-height:36px}
.jg-blog__filter:hover{border-color:#294557;color:#294557}
.jg-blog__filter:focus-visible{outline:3px solid #294557;outline-offset:2px}
.jg-blog__filter--active{background:#294557;color:#fff;border-color:#294557}
.jg-blog__filter--active:hover{background:#1e3444;color:#fff;border-color:#1e3444}

/* Tag pills — all AAA verified on their backgrounds */
.jg-blog__tag{display:inline-block;padding:2px 10px;border-radius:4px;font-size:.6875rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase}
.jg-blog__tag--a11y{background:#e8eef2;color:#294557}
.jg-blog__tag--ux{background:#fef3c7;color:#7c2d12}
.jg-blog__tag--eaa{background:#ecfdf5;color:#065f46}
.jg-blog__tag--dev{background:#ede9fe;color:#5b21b6}
.jg-blog__tag--docs{background:#f1f5f9;color:#374151}
.jg-blog__tag--default{background:#f1f5f9;color:#374151}

/* Featured article */
.jg-blog__featured{margin-bottom:3rem;padding-bottom:2.5rem;border-bottom:1px solid #e5e7eb}
.jg-blog__featured-label{font-size:.6875rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#294557;margin-bottom:.75rem}
.jg-blog__featured-title{font-size:1.375rem;font-weight:700;line-height:1.3;margin-bottom:.625rem}
.jg-blog__featured-title a{color:#232323;text-decoration:none;transition:color .15s}
.jg-blog__featured-title a:hover{color:#294557}
.jg-blog__featured-title a:focus-visible{outline:3px solid #294557;outline-offset:2px;border-radius:2px}
.jg-blog__featured-meta{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem;font-size:.8125rem;color:#475569;margin-bottom:.75rem}
.jg-blog__featured-excerpt{font-size:.9375rem;line-height:1.8;color:#475569}
.jg-blog__dot{user-select:none}

/* Read link */
.jg-blog__read-link{display:inline-flex;align-items:center;gap:4px;font-size:.875rem;font-weight:600;color:#294557;text-decoration:none;margin-top:.75rem;transition:gap .15s}
.jg-blog__read-link:hover{gap:8px}
.jg-blog__read-link:focus-visible{outline:3px solid #294557;outline-offset:2px;border-radius:2px}

/* Article list */
.jg-blog__list{display:flex;flex-direction:column;gap:0}
.jg-blog__article{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:1.125rem 0;border-bottom:1px solid #e5e7eb}
.jg-blog__article:last-child{border-bottom:none}
.jg-blog__article-body{flex:1;min-width:0}
.jg-blog__article-title{font-size:1rem;font-weight:600;line-height:1.4;margin-bottom:.25rem}
.jg-blog__article-title a{color:#232323;text-decoration:none;transition:color .15s}
.jg-blog__article-title a:hover{color:#294557}
.jg-blog__article-title a:focus-visible{outline:3px solid #294557;outline-offset:2px;border-radius:2px}
.jg-blog__article-meta{display:flex;align-items:center;gap:.625rem;font-size:.75rem;color:#475569}
.jg-blog__article-date{flex-shrink:0;font-size:.75rem;color:#475569;white-space:nowrap;font-variant-numeric:tabular-nums}

/* Pagination */
.jg-blog__pagination{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid #e5e7eb;flex-wrap:wrap}
.jg-blog__pagination-btns{display:flex;gap:.5rem}
.jg-blog__pagination-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .9rem;border:1px solid #e5e7eb;border-radius:6px;font-size:.8125rem;font-weight:600;color:#294557;text-decoration:none;background:#fff;transition:all .15s;min-height:36px}
.jg-blog__pagination-btn:hover{border-color:#294557;background:#f8fafc}
.jg-blog__pagination-btn:focus-visible{outline:3px solid #294557;outline-offset:2px}
.jg-blog__pagination-btn--disabled{color:#9ca3af;cursor:not-allowed;pointer-events:none;opacity:.5}
.jg-blog__pagination-info{font-size:.8125rem;color:#475569}

/* Empty state */
.jg-blog__empty{padding:3rem 1.5rem;border:1px dashed #e5e7eb;border-radius:8px;text-align:center;color:#475569;font-size:.9375rem}

/* Mobile */
@media(max-width:640px){
  .jg-blog__container{padding:2.5rem 1.25rem 3rem}
  .jg-blog__article{flex-direction:column;gap:.25rem}
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  .jg-blog__read-link,.jg-blog__featured-title a,.jg-blog__article-title a,.jg-blog__filter,.jg-blog__pagination-btn{transition:none}
}

/* ═══════════════════════════════════════════
   34. Dark Mode Theme Colors
   ═══════════════════════════════════════════
   All colors defined as CSS custom properties.
   Light mode = defaults (no change needed).
   Dark mode = overrides on [data-theme="dark"].
   AAA contrast ratios maintained in both modes. */

[data-theme="dark"] {
  /* Page */
  --jg-bg: #0f172a;
  --jg-bg-surface: #1e293b;
  --jg-bg-card: #1e293b;
  --jg-text: #e2e8f0;
  --jg-text-muted: #a8b5c4;
  --jg-text-heading: #f1f5f9;
  --jg-border: #334155;
  --jg-primary: #7cb8f7;
  --jg-primary-hover: #93c5fd;
  color-scheme: dark;
}

/* Apply dark mode to major site elements.
   Headings are scoped to .main to prevent bleeding into
   self-contained components like the schedule widget. */
[data-theme="dark"] body { background-color: #0f172a; color: #e2e8f0; }
[data-theme="dark"] .main { background-color: #0f172a; }
[data-theme="dark"] .main h1,
[data-theme="dark"] .main h2,
[data-theme="dark"] .main h3,
[data-theme="dark"] .main h4,
[data-theme="dark"] .main h5,
[data-theme="dark"] .main h6 { color: #f1f5f9; }
[data-theme="dark"] a { color: #7cb8f7; }
[data-theme="dark"] a:hover { color: #93c5fd; }

/* Prevent global anchor color from bleeding into button text.
   The global [data-theme="dark"] a { color: #7cb8f7 } would otherwise
   override button text for <a> elements with btn classes. */
[data-theme="dark"] a.btn,
[data-theme="dark"] a.btn:hover { text-decoration: none; }
[data-theme="dark"] a.btn-primary,
[data-theme="dark"] a.btn--primary,
[data-theme="dark"] a[class*="btn-primary"] { color: #0f172a !important; }
[data-theme="dark"] a.btn-primary:hover,
[data-theme="dark"] a.btn--primary:hover { color: #0f172a !important; }
[data-theme="dark"] a.btn-secondary,
[data-theme="dark"] a.btn--secondary,
[data-theme="dark"] a[class*="btn-secondary"] { color: #7cb8f7 !important; }
[data-theme="dark"] a.btn-secondary:hover,
[data-theme="dark"] a.btn--secondary:hover { color: #a5d4fd !important; }
[data-theme="dark"] a.btn--ghost { color: #7cb8f7 !important; }
[data-theme="dark"] a.btn--ghost:hover { color: #a5d4fd !important; }
[data-theme="dark"] a[class*="__cta"] { color: #7cb8f7 !important; }
[data-theme="dark"] a[class*="__link"]:not(.jg-nav__link):not(.jg-nav__dd-link) { text-decoration: none; }

/* Skip link — white on brand for AAA
   Only .jg-skip remains (in navigation.php). The duplicate .skip-link
   that was in header.php has been removed — it had no base CSS in this
   file, rendering it visible/unstyled above breadcrumbs on most pages. */
[data-theme="dark"] .jg-skip { background: #0f172a; color: #7cb8f7; }
[data-theme="dark"] .jg-skip:focus { outline-color: #7cb8f7; }

/* ── Dark Mode Button System ──
   Same 2 classes, automatic dark mode switching.
   Primary: bright blue fill, dark text (8.55:1 AAA)
   Secondary: blue outline, transparent bg
   Legacy .btn-white/.btn-transparent-* map to secondary in dark mode. */

[data-theme="dark"] .btn:focus-visible { outline-color: #7cb8f7; }

/* Primary (filled) — #7cb8f7 bg + #0f172a text = 8.55:1 AAA ✓ */
[data-theme="dark"] .btn-primary,
[data-theme="dark"] .btn.btn-primary,
[data-theme="dark"] .btn--primary,
[data-theme="dark"] .btn-dark,
[data-theme="dark"] .btn-outline-dark {
  background: #7cb8f7;
  color: #0f172a;
  border-color: #7cb8f7;
}
[data-theme="dark"] .btn-primary:hover,
[data-theme="dark"] .btn.btn-primary:hover,
[data-theme="dark"] .btn--primary:hover,
[data-theme="dark"] .btn-dark:hover {
  background: #a5d4fd;
  border-color: #a5d4fd;
  color: #0f172a;
}

/* Secondary (outlined) — single definition for all outlined buttons */
[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .btn.btn-secondary,
[data-theme="dark"] .btn--secondary,
[data-theme="dark"] .home-demo__cta.btn-secondary,
[data-theme="dark"] .btn.btn-white,
[data-theme="dark"] .btn.btn-transparent-black,
[data-theme="dark"] .btn.btn-transparent-dark-gray {
  background: transparent;
  color: #7cb8f7;
  border: 2px solid #7cb8f7;
}
[data-theme="dark"] .btn-secondary:hover,
[data-theme="dark"] .btn.btn-secondary:hover,
[data-theme="dark"] .btn--secondary:hover,
[data-theme="dark"] .home-demo__cta.btn-secondary:hover,
[data-theme="dark"] .btn.btn-white:hover,
[data-theme="dark"] .btn.btn-transparent-black:hover,
[data-theme="dark"] .btn.btn-transparent-dark-gray:hover {
  background: rgba(124,184,247,.08);
  color: #a5d4fd;
  border-color: #a5d4fd;
}

/* Ghost (text-link style) */
[data-theme="dark"] .btn--ghost {
  background: transparent;
  color: #7cb8f7;
  border-color: transparent;
}
[data-theme="dark"] .btn--ghost:hover {
  background: rgba(124,184,247,.08);
  color: #a5d4fd;
}

/* Theme utility classes used in templates */
[data-theme="dark"] .text-joe-blue { color: #7cb8f7 !important; }
[data-theme="dark"] .text-extra-dark-gray { color: #e2e8f0 !important; }
[data-theme="dark"] .text-dark-gray { color: #e2e8f0 !important; }
[data-theme="dark"] .text-medium-gray { color: #a8b5c4 !important; }
[data-theme="dark"] .bg-light-gray { background-color: #1e293b !important; }
[data-theme="dark"] .bg-white,[data-theme="dark"] .background-white { background-color: #1e293b !important; }
[data-theme="dark"] .border-color-light-gray { border-color: #607888 !important; }

/* Nav dark mode */
[data-theme="dark"] .jg-nav { background: #1e293b; border-bottom-color: #334155; }
[data-theme="dark"] .jg-nav__link { color: #e2e8f0; }
[data-theme="dark"] .jg-nav__link:hover { color: #7cb8f7; }
[data-theme="dark"] .jg-nav__link--active,[data-theme="dark"] .jg-nav__link[aria-current="page"] { color: #7cb8f7; }
[data-theme="dark"] .jg-nav__link--active::after,[data-theme="dark"] .jg-nav__link[aria-current="page"]::after { background: #7cb8f7; }
[data-theme="dark"] .jg-nav__dropdown { background: #1e293b; border-color: #334155; box-shadow: 0 8px 24px rgba(0,0,0,.3); }
[data-theme="dark"] .jg-nav__dd-link { color: #e2e8f0; }
[data-theme="dark"] .jg-nav__dd-link:hover { color: #7cb8f7; background: rgba(124,184,247,.1); }
[data-theme="dark"] .jg-nav__logo img { filter: brightness(0) invert(1); opacity: 0.92; }
[data-theme="dark"] .jg-nav__mob-lang { color: #e2e8f0; border-color: #334155; }
[data-theme="dark"] .jg-nav__burger { border-color: #334155; }
[data-theme="dark"] .jg-nav__burger-line { background: #e2e8f0; }
[data-theme="dark"] .jg-nav__lang-btn { color: #e2e8f0; border-color: #334155; }
[data-theme="dark"] .jg-nav__lang-dd { background: #1e293b; border-color: #334155; }
[data-theme="dark"] .jg-nav__lang-link { color: #e2e8f0; }
[data-theme="dark"] .jg-nav__lang-link:hover { color: #7cb8f7; background: rgba(124,184,247,.1); }

/* Footer dark mode */
/* Breadcrumbs dark mode */
[data-theme="dark"] .sc-breadcrumbs { background: #1e293b; }
[data-theme="dark"] .sc-breadcrumb-link { color: #a8b5c4; }
[data-theme="dark"] .sc-breadcrumb-link:hover { color: #f1f5f9; }
[data-theme="dark"] .sc-breadcrumb-link:focus-visible { outline-color: #7cb8f7; color: #f1f5f9; }
[data-theme="dark"] .sc-breadcrumb-page { color: #f1f5f9; }
[data-theme="dark"] .sc-breadcrumb-separator { color: #a8b5c4; }

[data-theme="dark"] .jg-footer { background-color: #1e293b; }
[data-theme="dark"] .jg-footer__copy { color: #e2e8f0; }
[data-theme="dark"] .jg-footer__nav a { color: #a8b5c4 !important; }
[data-theme="dark"] .jg-footer__nav a:hover { color: #7cb8f7 !important; }
[data-theme="dark"] .jg-footer__cookies { color: #a8b5c4; }
[data-theme="dark"] .jg-footer__cookies-btn { color: #a8b5c4 !important; }
[data-theme="dark"] .jg-footer__cookies-btn:hover { color: #7cb8f7 !important; }
[data-theme="dark"] .jg-footer__sep { background: #475569; }

/* Score badge dark mode */
[data-theme="dark"] .jg-score__pill { background: #1e293b; border-color: #334155; color: #e2e8f0; }
[data-theme="dark"] .jg-score__pill:hover { border-color: #7cb8f7; background: #293548; }
[data-theme="dark"] .jg-score__card { background: #1e293b; border-color: #334155; box-shadow: 0 8px 32px rgba(0,0,0,.4); }
[data-theme="dark"] .jg-score__level { color: #f1f5f9; }
[data-theme="dark"] .jg-score__stat { background: #0f172a; }
[data-theme="dark"] .jg-score__card-link { color: #7cb8f7; border-top-color: #334155; }
[data-theme="dark"] .jg-score__card-link:hover { background: rgba(124,184,247,.1); }

/* Blog dark mode */
[data-theme="dark"] .jg-blog { background: #0f172a; }
[data-theme="dark"] .jg-blog__title { color: #f1f5f9; }
[data-theme="dark"] .jg-blog__intro,
[data-theme="dark"] .jg-blog__featured-meta,
[data-theme="dark"] .jg-blog__featured-excerpt,
[data-theme="dark"] .jg-blog__article-meta,
[data-theme="dark"] .jg-blog__article-date,
[data-theme="dark"] .jg-blog__pagination-info { color: #a8b5c4; }
[data-theme="dark"] .jg-blog__featured-label,
[data-theme="dark"] .jg-blog__read-link { color: #7cb8f7; }
[data-theme="dark"] .jg-blog__featured-title a,
[data-theme="dark"] .jg-blog__article-title a { color: #e2e8f0; }
[data-theme="dark"] .jg-blog__featured-title a:hover,
[data-theme="dark"] .jg-blog__article-title a:hover { color: #7cb8f7; }
[data-theme="dark"] .jg-blog__filters,
[data-theme="dark"] .jg-blog__featured,
[data-theme="dark"] .jg-blog__article,
[data-theme="dark"] .jg-blog__pagination { border-color: #1e293b; }
[data-theme="dark"] .jg-blog__filter { color: #a8b5c4; border-color: #334155; background: transparent; }
[data-theme="dark"] .jg-blog__filter:hover { color: #7cb8f7; border-color: #7cb8f7; }
[data-theme="dark"] .jg-blog__filter--active { background: #7cb8f7; color: #0f172a !important; border-color: #7cb8f7; }
[data-theme="dark"] .jg-blog__filter--active:hover { background: #a5d4fd; color: #0f172a !important; border-color: #a5d4fd; }
[data-theme="dark"] .jg-blog__pagination-btn { color: #7cb8f7; border-color: #334155; background: #1e293b; }
[data-theme="dark"] .jg-blog__pagination-btn:hover { border-color: #7cb8f7; background: #293548; }
[data-theme="dark"] .jg-blog__empty { border-color: #334155; color: #a8b5c4; }
[data-theme="dark"] .jg-blog__tag--a11y { background: #1e3a50; color: #a5d4fd; }
[data-theme="dark"] .jg-blog__tag--ux { background: #451a03; color: #fbbf24; }
[data-theme="dark"] .jg-blog__tag--eaa { background: #064e3b; color: #8cf0b5; }
[data-theme="dark"] .jg-blog__tag--dev { background: #2e1065; color: #c4b5fd; }
[data-theme="dark"] .jg-blog__tag--docs,
[data-theme="dark"] .jg-blog__tag--default { background: #1e293b; color: #a8b5c4; }

/* Cards, containers, and common Bootstrap overrides */
[data-theme="dark"] .bg-light-gray,[data-theme="dark"] .bg-white,[data-theme="dark"] .background-white { background-color: #1e293b !important; }
[data-theme="dark"] .bg-extra-dark-gray { background-color: #0f172a !important; }
[data-theme="dark"] .container,[data-theme="dark"] .container-lg { color: #e2e8f0; }
[data-theme="dark"] .text-medium,.text-small { color: #a8b5c4; }
[data-theme="dark"] img { opacity: .92; }
[data-theme="dark"] .scroll-top-arrow { background: #334155; color: #e2e8f0; }
[data-theme="dark"] .scroll-top-arrow:hover { background: #475569; }

/* Theme text utilities — Bootstrap/theme classes with dark text */
[data-theme="dark"] .text-extra-dark-gray { color: #e2e8f0 !important; }
[data-theme="dark"] .text-dark-gray { color: #a8b5c4 !important; }
[data-theme="dark"] .text-medium-gray { color: #a8b5c4 !important; }
[data-theme="dark"] .text-extra-light-gray { color: #a8b5c4 !important; }
[data-theme="dark"] .text-light-gray { color: #a8b5c4 !important; }

/* Buttons in dark mode */
/* Legacy button aliases: dark mode already handled in section 34 button system */

/* Tags, chips, filters */
[data-theme="dark"] .tag-cloud a { color: #a8b5c4 !important; }
[data-theme="dark"] .tag-cloud a:hover { color: #7cb8f7 !important; }
[data-theme="dark"] .tags { color: #a8b5c4; }
[data-theme="dark"] [data-chip="true"] { color: #e2e8f0 !important; background-color: #1e293b !important; border-color: #607888 !important; }
[data-theme="dark"] .grid-filter > li > a { color: #a8b5c4 !important; }
[data-theme="dark"] .grid-filter > li.active > a { color: #7cb8f7 !important; }

/* Tab navigation */
[data-theme="dark"] .tab-style2 .nav-tabs li a { color: #a8b5c4 !important; }
[data-theme="dark"] .tab-style2 .nav-tabs li.active a,[data-theme="dark"] .tab-style2 .nav-tabs li a:hover { color: #e2e8f0 !important; }

/* Nav states missing dark overrides */
[data-theme="dark"] .jg-nav__mob-lang { color: #e2e8f0; border-color: #607888; }
[data-theme="dark"] .jg-nav__mob-lang:hover { border-color: #7cb8f7; color: #7cb8f7; }
[data-theme="dark"] .jg-nav__dd-link--active { color: #7cb8f7 !important; }
[data-theme="dark"] .jg-nav__lang-btn { color: #e2e8f0; border-color: #607888; }
[data-theme="dark"] .jg-nav__lang-btn:hover { color: #7cb8f7; border-color: #7cb8f7; }
[data-theme="dark"] .jg-nav__lang-link--active { color: #7cb8f7 !important; }

/* Footer cookies button */
[data-theme="dark"] .jg-footer__cookies a,[data-theme="dark"] .jg-footer__cookies-btn { color: #a8b5c4 !important; }
[data-theme="dark"] .jg-footer__cookies a:hover,[data-theme="dark"] .jg-footer__cookies-btn:hover { color: #7cb8f7 !important; }

/* Score badge sub-elements */
[data-theme="dark"] .jg-score__date { color: #a8b5c4; }
[data-theme="dark"] .jg-score__stat-label { color: #a8b5c4; }

/* Accessibility demo page */
[data-theme="dark"] .a11y-demo-methodology .demo-header h1,
[data-theme="dark"] .a11y-demo-methodology .feature-header h3 { color: #f1f5f9 !important; }
[data-theme="dark"] .a11y-demo-methodology .demo-intro,
[data-theme="dark"] .a11y-demo-methodology .feature-description,
[data-theme="dark"] .a11y-demo-methodology .compliance-info li { color: #a8b5c4 !important; }
[data-theme="dark"] .a11y-demo-methodology .compliance-info strong { color: #7cb8f7 !important; }
[data-theme="dark"] .a11y-demo-methodology .demo-output { color: #e2e8f0 !important; background-color: #1e293b !important; }
[data-theme="dark"] .a11y-demo-methodology kbd { color: #e2e8f0 !important; background-color: #0f172a !important; border-color: #607888 !important; }

/* Connect action buttons (loaded via style-lean, not connect.css) */
[data-theme="dark"] .connect-action-btn { color: #e2e8f0 !important; background-color: #0f172a !important; border-color: #607888 !important; }
[data-theme="dark"] .connect-action-btn:hover { color: #7cb8f7 !important; border-color: #7cb8f7 !important; background-color: #1e293b !important; }

/* Connect form error states */
[data-theme="dark"] .connect-form__label--required::after { color: #fca5a5 !important; }
[data-theme="dark"] .connect-form__error-message { color: #fca5a5 !important; }

/* Cookie consent dark mode */
[data-theme="dark"] .jg-cc__panel { background: #1e293b; color: #e2e8f0; }
[data-theme="dark"] .jg-cc__panel-header { border-bottom-color: #334155; }
[data-theme="dark"] .jg-cc__panel-title { color: #f1f5f9; }
[data-theme="dark"] .jg-cc__panel-close { color: #a8b5c4; }
[data-theme="dark"] .jg-cc__panel-close:hover { background: rgba(255,255,255,.06); color: #e2e8f0; }
[data-theme="dark"] .jg-cc__panel-desc { color: #a8b5c4; }
[data-theme="dark"] .jg-cc__category { border-bottom-color: #334155; }
[data-theme="dark"] .jg-cc__category-name { color: #e2e8f0; }
[data-theme="dark"] .jg-cc__category-desc { color: #a8b5c4; }
[data-theme="dark"] .jg-cc__panel-footer { border-top-color: #334155; }
[data-theme="dark"] .jg-cc__toggle-slider { background: #475569; }

/* ═══════════════════════════════════════════
   34.5 Moments Plugin — Dark Mode
   ═══════════════════════════════════════════ */
/* Page & containers */
[data-theme="dark"] .moments-page { background: #0f172a; }
[data-theme="dark"] .moments-page-title { color: #f1f5f9; }
[data-theme="dark"] .moments-page-subtitle { color: #a8b5c4; }
[data-theme="dark"] .moments-container { color: #e2e8f0; }
[data-theme="dark"] .moments-results { color: #a8b5c4; }

/* Sidebar cards */
[data-theme="dark"] .moments-card { background: #1e293b; border-color: #607888; }
[data-theme="dark"] .moments-card__header { border-bottom-color: #334155; }
[data-theme="dark"] .moments-card__icon { color: #a8b5c4; }
[data-theme="dark"] .moments-card__title { color: #f1f5f9; }
[data-theme="dark"] .moments-card__body { color: #e2e8f0; }

/* Badges & filters */
[data-theme="dark"] .moments-badge { background: #1e293b; color: #e2e8f0; border-color: #607888; }
[data-theme="dark"] .moments-badge:hover { background: #334155; border-color: #7cb8f7; }
[data-theme="dark"] .moments-badge--active { background: #7cb8f7; color: #0f172a !important; border-color: #7cb8f7; }

/* Buttons */
[data-theme="dark"] .moments-btn--primary { background: #7cb8f7; color: #0f172a !important; border-color: #7cb8f7; }
[data-theme="dark"] .moments-btn--primary:hover { background: #a5d4fd; color: #0f172a !important; }
[data-theme="dark"] .moments-btn--secondary { background: #1e293b; color: #e2e8f0; border-color: #607888; }
[data-theme="dark"] .moments-btn--secondary:hover { background: #334155; border-color: #7cb8f7; }
[data-theme="dark"] .moments-btn:focus { outline-color: #7cb8f7; }

/* Filter form */
[data-theme="dark"] .moments-filter-form__label { color: #e2e8f0; }
[data-theme="dark"] .moments-filter-form__label i { color: #a8b5c4; }
[data-theme="dark"] .moments-filter-form__select { background: #0f172a; color: #e2e8f0; border-color: #607888; }
[data-theme="dark"] .moments-filter-form__select:focus { outline-color: #7cb8f7; border-color: #7cb8f7; }
[data-theme="dark"] .moments-active-filters { border-top-color: #334155; }
[data-theme="dark"] .moments-active-filters__label { color: #a8b5c4; }

/* Empty state */
[data-theme="dark"] .moments-empty { background: #1e293b; border-color: #607888; }
[data-theme="dark"] .moments-empty__icon { color: #a8b5c4; }
[data-theme="dark"] .moments-empty__title { color: #f1f5f9; }
[data-theme="dark"] .moments-empty__text { color: #a8b5c4; }

/* Moment feed cards (mf-card) */
[data-theme="dark"] .mf-card { background: #1e293b; border-color: #607888; }
[data-theme="dark"] .mf-card:hover { border-color: #7cb8f7; box-shadow: 0 4px 16px rgba(0,0,0,.3); }
[data-theme="dark"] .mf-card:focus-within { outline-color: #7cb8f7; }
[data-theme="dark"] .mf-card__body { color: #e2e8f0; }
[data-theme="dark"] .mf-card__header { color: #f1f5f9; border-bottom-color: #334155; }
[data-theme="dark"] .mf-card__title { color: #f1f5f9; }
[data-theme="dark"] .mf-card__title a { color: #f1f5f9 !important; }
[data-theme="dark"] .mf-card__title a:hover { color: #7cb8f7 !important; }
[data-theme="dark"] .mf-card__date { color: #a8b5c4; }
[data-theme="dark"] .mf-card__content { color: #e2e8f0; }
[data-theme="dark"] .mf-card__content a { color: #7cb8f7 !important; }
[data-theme="dark"] .mf-card__meta { color: #a8b5c4; border-top-color: #334155; }
[data-theme="dark"] .mf-card__footer { border-top-color: #334155; }
[data-theme="dark"] .mf-card__tag { background: #0f172a; color: #a8b5c4; border-color: #334155; }
[data-theme="dark"] .mf-card__tag:hover { border-color: #7cb8f7; color: #7cb8f7; }
[data-theme="dark"] .mf-card__heading { color: #f1f5f9; }

/* Bookmark/pin icons — #484851 was 1.62:1 FAIL, now #a8b5c4 = 7.02:1 AAA */
[data-theme="dark"] .mf-card i[class*="bookmark"],
[data-theme="dark"] .mf-card i[class*="push-pin"] { color: #a8b5c4 !important; }

/* Badges & category icons */
[data-theme="dark"] .mf-badge { background: #1e293b; color: #a8b5c4; border-color: #607888; }
[data-theme="dark"] .mf-badge:hover { border-color: #7cb8f7; color: #e2e8f0; }
[data-theme="dark"] .mf-badge i { color: #a8b5c4; }
[data-theme="dark"] .mf-like-btn:hover { color: #f472b6; }

/* Weather badges — themed colors (all AAA on #1e293b) */
[data-theme="dark"] .mf-badge[aria-label*="Sunny"] { background: rgba(250,170,22,.12); color: #fbbf24; border-color: rgba(250,170,22,.25); }
[data-theme="dark"] .mf-badge[aria-label*="Sunny"] i { color: #fbbf24; }
[data-theme="dark"] .mf-badge[aria-label*="Rain"] { background: rgba(96,165,250,.12); color: #93c5fd; border-color: rgba(96,165,250,.25); }
[data-theme="dark"] .mf-badge[aria-label*="Rain"] i { color: #93c5fd; }
[data-theme="dark"] .mf-badge[aria-label*="Cloudy"],
[data-theme="dark"] .mf-badge[aria-label*="cloudy"] { background: rgba(148,163,184,.12); color: #cbd5e1; border-color: rgba(148,163,184,.25); }
[data-theme="dark"] .mf-badge[aria-label*="Snow"] { background: rgba(186,230,253,.10); color: #bae6fd; border-color: rgba(186,230,253,.20); }
[data-theme="dark"] .mf-badge[aria-label*="Storm"] { background: rgba(129,140,248,.12); color: #a5b4fc; border-color: rgba(129,140,248,.25); }
[data-theme="dark"] .mf-badge[aria-label*="Wind"],
[data-theme="dark"] .mf-badge[aria-label*="wind"] { background: rgba(168,181,196,.10); color: #a8b5c4; border-color: rgba(168,181,196,.20); }
[data-theme="dark"] .mf-badge[aria-label*="Fog"] { background: rgba(168,181,196,.08); color: #a8b5c4; border-color: rgba(168,181,196,.18); }
[data-theme="dark"] .mf-badge[aria-label*="Clear"] { background: rgba(186,230,253,.08); color: #bae6fd; border-color: rgba(186,230,253,.18); }

/* Ambient strip — AAA verified:
   Label #a8b5c4 on #1e293b = 7.02:1 AAA ✓
   Bar   #607888 on #1e293b = 3.16:1 UI ✓
   Play  #7cb8f7 on #1e293b = 7.01:1 AAA ✓ */
[data-theme="dark"] .mf-ambient-strip { background: linear-gradient(180deg,#1e293b,#1a2536) !important; border-color: #334155 !important; }
[data-theme="dark"] .mf-ambient-strip:hover { background: linear-gradient(180deg,#263248,#1e2d40) !important; }
[data-theme="dark"] .mf-wf-bar { background: #607888; }
[data-theme="dark"] .mf-wf-label { color: #a8b5c4; }
[data-theme="dark"] .mf-ambient-strip.playing .mf-wf-bar { background: #7cb8f7; }
[data-theme="dark"] .mf-ambient-strip.playing .mf-wf-label { color: #7cb8f7; }
[data-theme="dark"] .moment-page { background: #0f172a; }
[data-theme="dark"] .moment-card { background: #1e293b; border-color: #607888; }
[data-theme="dark"] .moment-card[data-weather] { background: #1e293b; border-color: #607888; }
[data-theme="dark"] .moment-card[data-age] { border-color: #607888; filter: none; }
[data-theme="dark"] .moment-title { color: #f1f5f9; }
[data-theme="dark"] .moment-date { color: #a8b5c4; }
[data-theme="dark"] .moment-meta { color: #a8b5c4; }
[data-theme="dark"] .moment-content { color: #e2e8f0; }
[data-theme="dark"] .moment-content a { color: #7cb8f7 !important; }
[data-theme="dark"] .moment-content a:hover { color: #a5d4fd !important; }
[data-theme="dark"] .moment-card__body { color: #e2e8f0; }
[data-theme="dark"] .moment-back-btn { background: #1e293b; color: #a8b5c4 !important; border-color: #607888; }
[data-theme="dark"] .moment-back-btn:hover { background: #334155; color: #e2e8f0 !important; border-color: #7cb8f7; }
[data-theme="dark"] .moment-badge { background: #0f172a; color: #a8b5c4; border-color: #334155; }
[data-theme="dark"] .moment-audio,
[data-theme="dark"] .moment-video { background: #1e293b; border-color: #607888; }
[data-theme="dark"] .audio-play-btn { background: #7cb8f7; color: #0f172a; }
[data-theme="dark"] .audio-progress-container { background: #334155; }
[data-theme="dark"] .audio-progress-fill { background: #7cb8f7; }
[data-theme="dark"] .mpf-link-preview { background: #1e293b; border-color: #607888; }
[data-theme="dark"] .mpf-link-preview:hover { border-color: #7cb8f7; }
[data-theme="dark"] .mpf-link-preview-title { color: #f1f5f9; }
[data-theme="dark"] .mpf-link-preview-description { color: #a8b5c4; }
[data-theme="dark"] .mpf-link-preview-domain { color: #a8b5c4; }

/* Moments logo (time-based SVG) */
[data-theme="dark"] .moments-logo-tagline { color: #a8b5c4; }
[data-theme="dark"] .moments-logo-header { color: #e2e8f0; }

/* ═══════════════════════════════════════════
   34.6 Schedule Widget — Dark Mode Isolation
   ═══════════════════════════════════════════
   The Project Flow schedule widget (#pf-schedule-widget) generates its
   own <style> block with hardcoded light-mode colors. Global dark mode
   rules bleed into it because type-selector overrides like
     [data-theme="dark"] h2 { color: #f1f5f9 }
   beat the widget's class selectors by specificity.

   Result without this fix: headings become near-white on a white card
   background (1.05:1 contrast — invisible).

   This block resets all text/heading/link colors inside the widget back
   to their intended light-mode values, keeping it as a light card on
   the dark page. Uses !important to guarantee these win regardless of
   cascade order (the widget injects its own <style> via JS at runtime).
*/
[data-theme="dark"] #pf-schedule-widget { color: #1a1a2e !important; }
[data-theme="dark"] #pf-schedule-widget h1,
[data-theme="dark"] #pf-schedule-widget h2,
[data-theme="dark"] #pf-schedule-widget h3,
[data-theme="dark"] #pf-schedule-widget h4,
[data-theme="dark"] #pf-schedule-widget p,
[data-theme="dark"] #pf-schedule-widget span,
[data-theme="dark"] #pf-schedule-widget label,
[data-theme="dark"] #pf-schedule-widget td,
[data-theme="dark"] #pf-schedule-widget th { color: #1a1a2e !important; }
[data-theme="dark"] #pf-schedule-widget a { color: #475569 !important; }
[data-theme="dark"] #pf-schedule-widget a:hover { color: #1a1a2e !important; }
[data-theme="dark"] #pf-schedule-widget .sw-card { background: #fff !important; border-color: #e2e8f0 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-header { border-bottom-color: #e2e8f0 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-subtitle { color: #334155 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-tz-note,
[data-theme="dark"] #pf-schedule-widget .sw-type-desc,
[data-theme="dark"] #pf-schedule-widget .sw-no-slots,
[data-theme="dark"] #pf-schedule-widget .sw-payment-note,
[data-theme="dark"] #pf-schedule-widget .sw-cal-dow,
[data-theme="dark"] #pf-schedule-widget .sw-step { color: #475569 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-form-label,
[data-theme="dark"] #pf-schedule-widget .sw-time-back,
[data-theme="dark"] #pf-schedule-widget .sw-type-meta,
[data-theme="dark"] #pf-schedule-widget .sw-confirm-sub,
[data-theme="dark"] #pf-schedule-widget .sw-form-summary { color: #334155 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-type-btn { background: #fff !important; border-color: #e2e8f0 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-time-slot { background: #fff !important; border-color: #e2e8f0 !important; color: #1a1a2e !important; }
[data-theme="dark"] #pf-schedule-widget .sw-cal-day { color: #1a1a2e !important; }
[data-theme="dark"] #pf-schedule-widget .sw-cal-day:disabled { color: #94a3b8 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-cal-btn { background: #fff !important; border-color: #e2e8f0 !important; color: #334155 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-form-input { background: #fff !important; color: #1a1a2e !important; border-color: #e2e8f0 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-form-input[readonly] { background: #f1f5f9 !important; color: #334155 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-form-summary,
[data-theme="dark"] #pf-schedule-widget .sw-confirm-details { background: #f8fafc !important; }
[data-theme="dark"] #pf-schedule-widget .sw-step-num { background: #e2e8f0 !important; color: #334155 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-spinner { border-color: #e2e8f0 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-footer { border-top-color: #e2e8f0 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-footer a { color: #475569 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-photo { border-color: #e2e8f0 !important; }
[data-theme="dark"] #pf-schedule-widget img { opacity: 1 !important; }
[data-theme="dark"] #pf-schedule-widget .sw-type-free { color: #0f766e !important; }

/* ═══════════════════════════════════════════
   35. Print
   ═══════════════════════════════════════════ */
@media print{
  header,footer,.jg-nav,.scroll-top-arrow,.back-to-top,.jg-theme,.jg-score{display:none}
  body{font-size:12pt;line-height:1.4;color:#000}
  a[href]::after{content:" (" attr(href) ")";font-size:0.8em}
}