
    :root {
      --ink:          #1a1523;
      --muted:        #5a5566;
      --border:       #e4dff0;
      --bg-page:      #faf8f5;
      --warm:         #f2ece3;
      --warm-dark:    #e8dfd3;
      --accent:       #7c5cbf;
      --accent-hover: #6848ab;
      --accent-light: #e8dff8;
      --accent-text:  #5a3e9a;
      --radius:       0.875rem;
      --radius-pill:  100px;
      --radius-card:  1.125rem;
      --dur:          220ms;
      --ease:         cubic-bezier(0.0,0.0,0.2,1);
    }

    * { -webkit-font-smoothing: antialiased; box-sizing: border-box; }

    body {
      font-family: 'Montserrat', system-ui, sans-serif;
      color: var(--ink);
      background: var(--bg-page);
      line-height: 1.65;
    }

    h1,h2,h3,h4,h5 {
      font-family: 'Fraunces', Georgia, serif;
      font-weight: 400;
      letter-spacing: -0.02em;
      color: var(--ink);
    }
    p, li { color: var(--muted); }
    .lead { font-size: 1.1rem; color: var(--ink); line-height: 1.6; }
    .eyebrow { font-family: 'Montserrat', sans-serif; font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent); display: block; }
    a { color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 2px; }
    a:visited { color: var(--accent-text); }
    /* Reset :visited color for button-styled links — visited state must not alter button appearance */
    a.btn:visited,
    a.btn-primary:visited      { color: #fff; }
    a.btn-outline-dark:visited { color: var(--ink); }
    a.btn-link:visited         { color: var(--accent); }
    a.nav-cta:visited,
    .nav-link.nav-cta:visited  { color: #fff !important; }
    a.nav-link:visited         { color: var(--muted) !important; }
    a.btn-outline-dark:visited:hover { color: var(--bg-page); }
    a:hover { color: var(--accent-hover); text-decoration-thickness: 2px; }
    a:active { color: var(--accent-hover); }

    img { max-width: 100%; height: auto; }
    section { scroll-margin-top: 5rem; }

    /* ── Hebrew type ── */
    .he { font-family: 'Noto Sans Hebrew', 'Montserrat', sans-serif !important; }
    [dir="rtl"] { font-family: 'Noto Sans Hebrew', 'Montserrat', sans-serif; }
    [dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3 {
      font-family: 'Noto Sans Hebrew', sans-serif;
      letter-spacing: 0;
    }

    /* ── Nav ── */
    .navbar { background: var(--bg-page); border-bottom: 0.5px solid var(--border) !important; padding: 0.75rem 0; }
    .navbar-brand-text { font-family: 'Fraunces', serif; font-size: 1rem; font-weight: 400; color: var(--ink); text-decoration: none; }
    .navbar-brand img { transition: transform var(--dur) var(--ease); }
    .navbar-brand img:hover { transform: scale(1.06); }
    .nav-link { font-weight: 400; font-size: 0.9rem; color: var(--muted) !important; transition: color var(--dur) var(--ease); padding: 0.4rem 0.6rem !important; }
    .nav-link:hover, .nav-link.active { color: var(--ink) !important; }
    .nav-link.active { font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
    .nav-cta { background: var(--accent); color: #fff !important; border-radius: var(--radius-pill); padding: 0.45rem 1.2rem !important; font-weight: 500; font-size: 0.8rem; transition: background var(--dur) var(--ease); }
    .nav-cta:hover { background: var(--accent-hover) !important; transform: translateY(-1px); }
    /* ── Buttons ── */
    .btn { border-radius: var(--radius-pill); font-weight: 500; font-family: 'Montserrat', sans-serif; font-size: 0.875rem; transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease), transform var(--dur) var(--ease); }
    .btn:hover { transform: translateY(-1px); }
    .btn:active { transform: translateY(0) scale(0.98); }
    .btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
    .btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: #fff; }
    .btn-outline-dark { border-color: var(--ink); color: var(--ink); }
    .btn-outline-dark:hover { background: var(--ink); color: var(--bg-page); }
    .btn-outline-accent { border-color: var(--accent); color: var(--accent); background: transparent; }
    .btn-outline-accent:hover { background: var(--accent); color: #fff; }

    /* ── Tags ── */
    .tag { display: inline-block; background: var(--accent-light); color: var(--accent-text); border-radius: var(--radius-pill); padding: 0.2rem 0.7rem; font-size: 0.7rem; font-weight: 500; margin: 0.15rem 0.2rem 0.15rem 0; }
    .tag.neutral { background: var(--border); color: var(--muted); }
    .tag.warm { background: #fdf2e5; color: #8c5e15; }
    .tag.he-tag { font-family: 'Noto Sans Hebrew', sans-serif; }

    /* ── Language toggle ── */
    .lang-toggle {
      display: inline-flex;
      background: var(--warm-dark);
      border-radius: var(--radius-pill);
      padding: 0.2rem;
      gap: 0.1rem;
    }
    .lang-btn {
      border: none;
      border-radius: var(--radius-pill);
      background: transparent;
      color: var(--muted);
      font-family: 'Montserrat', sans-serif;
      font-size: 0.78rem;
      font-weight: 500;
      padding: 0.3rem 0.9rem;
      cursor: pointer;
      transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
    }
    .lang-btn.active {
      background: var(--bg-page);
      color: var(--ink);
      box-shadow: 0 1px 4px rgba(26,21,35,0.08);
    }
    .lang-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

    /* ── Hero ── */
    .page-hero {
      background: var(--warm);
      border-bottom: 0.5px solid var(--border);
      padding: 4rem 0 3.5rem;
      position: relative;
      overflow: hidden;
    }
    .page-hero::before {
      content: '';
      position: absolute;
      top: -20%; right: -6%;
      width: 42vw; height: 42vw;
      max-width: 380px; max-height: 380px;
      border-radius: 50%;
      background: var(--accent-light);
      opacity: 0.35;
      pointer-events: none;
    }
    @keyframes fadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
    .page-hero .container > * { animation: fadeUp 340ms var(--ease) both; }
    .page-hero .container > *:nth-child(1) { animation-delay: 0ms; }
    .page-hero .container > *:nth-child(2) { animation-delay: 60ms; }
    .page-hero .container > *:nth-child(3) { animation-delay: 120ms; }
    .page-hero .container > *:nth-child(4) { animation-delay: 180ms; }

    /* ── Section divider ── */
    .lang-section { scroll-margin-top: 5rem; }
    .lang-divider {
      display: flex;
      align-items: center;
      gap: 1rem;
      margin: 0 0 2.5rem;
    }
    .lang-divider-line { flex: 1; height: 0.5px; background: var(--border); }
    .lang-divider-label {
      font-family: 'Montserrat', sans-serif;
      font-size: 0.7rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: var(--muted);
      white-space: nowrap;
    }

    /* ── Book cards ── */
    .book-card {
      background: var(--bg-page);
      border: 0.5px solid var(--border);
      border-radius: var(--radius-card);
      overflow: hidden;
      height: 100%;
      display: flex;
      flex-direction: column;
      transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
    }
    .book-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 14px 36px rgba(26,21,35,0.09);
    }
    .book-img-wrap {
      background: var(--warm);
      aspect-ratio: 1/1;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 1.5rem;
    }
    .book-img-wrap img {
      max-height: 100%;
      width: auto;
      max-width: 100%;
      object-fit: contain;
      display: block;
      transition: transform 400ms var(--ease);
      border-radius: 6px;
      box-shadow: 0 8px 24px rgba(26,21,35,0.12);
    }
    /* Full-bleed square covers (Opa & Emma series) */
    .book-img-wrap.cover-full { padding: 0; }
    .book-img-wrap.cover-full img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 0;
      box-shadow: none;
    }
    .book-card:hover .book-img-wrap img { transform: scale(1.03); }
    .book-body {
      padding: 1.25rem 1.25rem 0.5rem;
      flex: 1;
    }
    .book-body h3 {
      font-size: 1rem;
      margin-bottom: 0.35rem;
      line-height: 1.3;
    }
    .book-body p { font-size: 0.85rem; margin-bottom: 0.75rem; }
    .book-footer {
      padding: 0.75rem 1.25rem 1.25rem;
      display: flex;
      gap: 0.5rem;
      flex-wrap: wrap;
    }
    .book-footer .btn { font-size: 0.78rem; padding: 0.35rem 0.9rem; }

    /* ── New-release badge ── */
    .book-img-wrap { position: relative; }
    .badge-new {
      position: absolute;
      top: 0.75rem; left: 0.75rem;
      background: var(--accent);
      color: #fff;
      font-family: 'Montserrat', sans-serif;
      font-size: 0.65rem;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      border-radius: var(--radius-pill);
      padding: 0.25rem 0.7rem;
      z-index: 2;
      box-shadow: 0 2px 8px rgba(26,21,35,0.18);
    }

    /* ── Series intro band ── */
    .series-intro {
      background: var(--warm);
      border: 0.5px solid var(--border);
      border-radius: var(--radius-card);
      padding: 1.5rem 1.75rem;
      margin-bottom: 1.5rem;
    }
    .series-intro h3 { font-size: 1.35rem; margin-bottom: 0.35rem; }
    .series-intro p { font-size: 0.9rem; margin: 0; max-width: 62ch; }

    /* ── Why books section ── */
    .why-section {
      background: var(--ink);
      padding: 3.5rem 0;
    }
    .why-section h2 { color: var(--bg-page); }
    .why-section p { color: #a094b8; }
    .why-section .eyebrow { color: var(--accent-light); }
    .why-point {
      border-left: 2px solid var(--accent);
      padding-left: 1rem;
      margin-bottom: 1.25rem;
    }
    .why-point:last-child { margin-bottom: 0; }
    .why-point h5 { color: var(--bg-page); font-family: 'Montserrat', sans-serif; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.2rem; }
    .why-point p { color: #8b7fa0; font-size: 0.85rem; margin: 0; }

    /* ── Custom book print section ── */
    .custom-section {
      background: var(--accent-light);
      border: 0.5px solid var(--border);
      border-radius: var(--radius-card);
      padding: 2rem 2rem;
    }
    .custom-section h2 { font-size: 1.5rem; margin-bottom: 0.5rem; }

    /* ── Platform badges ── */
    .platform-badge {
      display: inline-flex;
      align-items: center;
      gap: 0.4rem;
      background: var(--bg-page);
      border: 0.5px solid var(--border);
      border-radius: var(--radius-pill);
      padding: 0.35rem 0.9rem;
      font-size: 0.78rem;
      font-weight: 500;
      color: var(--ink);
      text-decoration: none;
      transition: background var(--dur) var(--ease), transform var(--dur) var(--ease);
    }
    .platform-badge:hover { background: var(--warm); color: var(--ink); transform: translateY(-1px); }
    .platform-badge i { color: var(--accent); font-size: 0.85rem; }

    /* ── Footer ── */
    .footer-cta { background: var(--ink); }
    .footer-cta h2 { color: var(--bg-page); font-weight: 400; }
    .footer-cta p { color: #8b7fa0; }
    .footer-nav a { color: #8b7fa0; font-size: 0.85rem; text-decoration: none; }
    .footer-nav a:hover { color: var(--accent-light); }
    .footer-copy { color: #a090b8; font-size: 0.75rem; }
    a .bi { color: var(--accent); transition: color var(--dur) var(--ease), transform var(--dur) var(--ease); }
    a:hover .bi { color: var(--accent-hover); transform: scale(1.1); }
    .list-inline-item a .bi { font-size: 1.3rem; color: var(--muted); }
    .list-inline-item a:hover .bi { color: var(--accent); transform: translateY(-2px) scale(1.05); }

    /* ── Language section visibility ── */
    .en-section { display: block; }
    .he-section { display: block; }

    @media (max-width: 767px) {
      .page-hero { padding: 3rem 0 2.5rem; }
      .custom-section { padding: 1.5rem 1.25rem; }
      .book-img-wrap { padding: 1rem 1rem 0; }
    }
  
    /* A11Y FIX: eyebrow on warm/services bg — accent needs darkening for 4.5:1 */
    .services .eyebrow,
    .bg-light .eyebrow,
    section.bg-light .eyebrow,
    section.services .eyebrow { color: var(--accent-text); }
  
    /* A11Y FIX: Respect user motion preferences */
    @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;
      }
      .marquee-track { animation: none !important; }
    }
  
/* Shared book catalogue and Opa & Emma additions. */
.catalogue-nav {display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.8rem}
.catalogue-nav a {padding:.5rem 1rem;border:1px solid var(--border);border-radius:100px;background:var(--bg-page);font-size:.82rem;text-decoration:none;color:var(--ink)}
.series-feature {display:grid;grid-template-columns:1.5fr 1fr;gap:3rem;align-items:center;padding:2.5rem;border:1px solid var(--border);border-radius:1.5rem;background:var(--warm)}
.series-covers {display:flex;gap:1rem;align-items:center;justify-content:center}
.series-covers img {width:46%;max-height:245px;object-fit:contain;border-radius:.5rem;box-shadow:0 8px 22px #1a152318}
.catalogue-heading {max-width:46rem;margin-bottom:2rem}
.catalogue-heading p {margin-bottom:0}
.book-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.book-grid.two {grid-template-columns:repeat(2,minmax(0,1fr))}
.book-card {min-width:0;height:100%}
.book-img-wrap,.book-img-wrap.cover-full {height:310px;aspect-ratio:auto;padding:0;background:var(--warm)}
.book-img-wrap img,.book-img-wrap.cover-full img {width:100%;height:100%;object-fit:cover;object-position:center top;border-radius:0;box-shadow:none}
.oe-hero {padding:4rem 0;background:var(--warm);border-bottom:1px solid var(--border)}
.oe-hero-grid {display:grid;grid-template-columns:1.1fr 1fr;gap:3rem;align-items:center}
.oe-hero h1 {font-size:clamp(2.7rem,6vw,5rem);line-height:1.05;margin:1rem 0 1.4rem}
.oe-hero .series-covers img {max-height:360px}
.section-pad {padding:4rem 0}
.watch-panel {padding:2.5rem;border-radius:1.5rem;background:var(--accent-light);border:1px solid var(--border)}
.video-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;margin-top:2rem}
.video-card {background:var(--bg-page);border:1px solid var(--border);border-radius:1rem;padding:1.5rem}
.video-card h3 {font-size:1.45rem}
.video-slot {aspect-ratio:16/9;display:grid;place-items:center;background:var(--warm);border-radius:.7rem;margin-bottom:1rem;overflow:hidden}
.video-slot button {border:0;border-radius:100px;padding:.85rem 1.2rem;background:var(--accent-text);color:white;font:inherit;cursor:pointer}
.video-slot iframe {width:100%;height:100%;border:0}
.breadcrumbs {font-size:.85rem;margin-bottom:1.5rem}
a:focus-visible,button:focus-visible {outline:3px solid var(--accent-text);outline-offset:4px}
.eyebrow {color:var(--accent-text)}
@media(max-width:991px){.book-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.series-feature,.oe-hero-grid{grid-template-columns:1fr;gap:1.8rem}.section-pad{padding:2.8rem 0}.series-feature,.watch-panel{padding:1.5rem}.oe-hero{padding:2.5rem 0}.video-grid{grid-template-columns:1fr}.oe-hero .series-covers img{max-height:250px}}
@media(max-width:575px){.book-grid,.book-grid.two{grid-template-columns:1fr}.book-img-wrap,.book-img-wrap.cover-full{height:300px}}
