/* ==========================================================================
   Homepage layer — Contemporary Manuscript
   Paint-only overrides. All geometry remains owned by the existing page CSS.
   ========================================================================== */

:root[data-theme="dark"] .hero h1 {
  color: var(--text);
}

:root[data-theme="dark"] .hero h1 .accent,
:root[data-theme="dark"] .section-head h2 .accent {
  color: var(--gold-light);
  background: linear-gradient(135deg, #e2cb91 0%, #b89550 54%, #d6bb79 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

:root[data-theme="dark"] .hero p.lead,
:root[data-theme="dark"] .section-head p {
  color: var(--muted);
}

:root[data-theme="dark"] .hero-chip {
  color: rgba(243, 238, 228, .84);
  background: rgba(243, 238, 228, .02);
  border-color: rgba(185, 154, 89, .22);
  box-shadow: none;
}

:root[data-theme="dark"] .hero-chip i {
  color: var(--gold-light);
}

:root[data-theme="dark"] .hero-chip:hover {
  color: var(--text);
  background: rgba(185, 154, 89, .065);
  border-color: rgba(185, 154, 89, .42);
  box-shadow: 0 8px 18px rgba(0, 0, 0, .16);
}

/* Parchment changes paint and silhouette only; card dimensions stay untouched. */
:root[data-theme="dark"] .testimonial-stack {
  filter: drop-shadow(0 32px 46px rgba(0, 0, 0, .4));
}

:root[data-theme="dark"] .testimonial-stack:focus-visible {
  outline: none;
  box-shadow: none;
}

:root[data-theme="dark"] .testimonial-stack::before {
  content: "";
  position: absolute;
  inset: -14% -18%;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(45deg, transparent 48.8%, rgba(185, 154, 89, .14) 49.2%, rgba(185, 154, 89, .14) 50.2%, transparent 50.6%),
    linear-gradient(-45deg, transparent 48.8%, rgba(185, 154, 89, .1) 49.2%, rgba(185, 154, 89, .1) 50.2%, transparent 50.6%);
  background-size: 64px 64px;
  mask-image: radial-gradient(circle, #000 12%, transparent 70%);
  -webkit-mask-image: radial-gradient(circle, #000 12%, transparent 70%);
  opacity: .48;
  animation: manuscript-paper-halo 14s ease-in-out infinite alternate;
}

:root[data-theme="dark"] .testimonial-stack::after {
  content: "";
  position: absolute;
  left: -31px;
  bottom: -23px;
  z-index: 6;
  width: 88px;
  height: 86px;
  pointer-events: none;
  background: url("https://Coursestudents.b-cdn.net/Website/Assets/Illustrators/Signaturee.webp") center / contain no-repeat;
  filter:
    drop-shadow(0 15px 20px rgba(0, 0, 0, .4))
    saturate(.92)
    contrast(1.03);
  opacity: .98;
  transform: rotate(-7deg);
}

@keyframes manuscript-paper-halo {
  from { transform: translate3d(-7px, 5px, 0) rotate(-.45deg); opacity: .34; }
  to { transform: translate3d(6px, -4px, 0) rotate(.45deg); opacity: .54; }
}

:root[data-theme="dark"] .t-card {
  color: #352d24;
  background:
    radial-gradient(circle at 18% 16%, rgba(99, 74, 37, .08) 0 1px, transparent 1.5px),
    radial-gradient(circle at 78% 68%, rgba(99, 74, 37, .055) 0 1px, transparent 1.5px),
    repeating-linear-gradient(2deg, rgba(83, 62, 31, .018) 0 1px, transparent 1px 5px),
    linear-gradient(145deg, #ede4d2 0%, #e2d6bf 48%, #d6c8ac 100%);
  background-size: 19px 21px, 27px 23px, auto, auto;
  border-color: rgba(122, 94, 49, .36);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .42),
    inset -12px -8px 22px rgba(91, 65, 29, .055);
  filter:
    drop-shadow(7px 12px 9px rgba(50, 31, 14, .2))
    drop-shadow(0 24px 30px rgba(0, 0, 0, .3));
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transform-origin: 50% 56%;
  transition:
    transform .44s cubic-bezier(.22, 1, .36, 1),
    filter .44s ease,
    background .44s ease;
  clip-path: polygon(
    1.5% 1.2%, 9% .4%, 17% 1%, 26% .2%, 36% 1.1%, 47% .35%, 60% .9%, 72% .25%, 83% 1%, 96% .35%, 99.2% 3%,
    98.7% 14%, 99.4% 28%, 98.8% 42%, 99.5% 58%, 98.8% 73%, 99.3% 88%, 97.8% 98.7%,
    87% 99.4%, 75% 98.8%, 62% 99.5%, 49% 98.9%, 37% 99.5%, 23% 98.8%, 9% 99.4%, 1.2% 97.2%,
    .7% 84%, 1.3% 69%, .6% 53%, 1.2% 39%, .55% 24%, 1.1% 10%
  );
}

:root[data-theme="dark"] .t-card.t-front {
  filter:
    drop-shadow(9px 13px 8px rgba(61, 39, 18, .28))
    drop-shadow(0 28px 34px rgba(0, 0, 0, .34));
}

:root[data-theme="dark"] .testimonial-stack:focus-visible .t-card.t-front {
  filter:
    drop-shadow(0 0 2px rgba(213, 185, 113, .88))
    drop-shadow(9px 13px 8px rgba(61, 39, 18, .28))
    drop-shadow(0 28px 34px rgba(0, 0, 0, .34));
}

:root[data-theme="dark"] .t-card.t-middle {
  transform: translate(30px, -10px) rotate(1.7deg) scale(.984);
  background:
    radial-gradient(circle at 21% 18%, rgba(99, 74, 37, .09) 0 1px, transparent 1.5px),
    radial-gradient(circle at 76% 70%, rgba(99, 74, 37, .06) 0 1px, transparent 1.5px),
    repeating-linear-gradient(1deg, rgba(83, 62, 31, .022) 0 1px, transparent 1px 5px),
    linear-gradient(145deg, #e7dcc6 0%, #d9c8a9 100%);
  background-size: 19px 21px, 27px 23px, auto, auto;
  border-color: rgba(103, 75, 36, .46);
  filter:
    drop-shadow(7px 12px 9px rgba(47, 28, 12, .24))
    drop-shadow(0 22px 27px rgba(0, 0, 0, .28));
}

:root[data-theme="dark"] .t-card.t-back {
  transform: translate(58px, 14px) rotate(7.2deg) scale(.965);
  background:
    radial-gradient(circle at 19% 17%, rgba(91, 65, 31, .1) 0 1px, transparent 1.5px),
    radial-gradient(circle at 79% 67%, rgba(91, 65, 31, .07) 0 1px, transparent 1.5px),
    repeating-linear-gradient(2deg, rgba(75, 52, 25, .025) 0 1px, transparent 1px 5px),
    linear-gradient(145deg, #ddceb3 0%, #cdb894 100%);
  background-size: 19px 21px, 27px 23px, auto, auto;
  border-color: rgba(94, 65, 30, .5);
  filter:
    drop-shadow(5px 12px 10px rgba(42, 24, 10, .22))
    drop-shadow(0 22px 30px rgba(0, 0, 0, .3));
}

@media (hover: hover) and (pointer: fine) {
  :root[data-theme="dark"] .testimonial-stack:hover .t-card.t-front,
  :root[data-theme="dark"] .testimonial-stack:focus-visible .t-card.t-front {
    transform: translate(-4px, 4px) rotate(-6deg);
    border-color: rgba(212, 160, 23, .55);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, .5),
      0 12px 32px rgba(212, 160, 23, .12);
    filter:
      drop-shadow(11px 16px 10px rgba(61, 39, 18, .35))
      drop-shadow(0 32px 38px rgba(0, 0, 0, .42));
  }

  :root[data-theme="dark"] .testimonial-stack:hover .t-card.t-middle,
  :root[data-theme="dark"] .testimonial-stack:focus-visible .t-card.t-middle {
    transform: translate(35px, -15px) rotate(2.2deg) scale(.982);
    border-color: rgba(185, 154, 89, .5);
    filter:
      drop-shadow(9px 15px 10px rgba(47, 28, 12, .32))
      drop-shadow(0 26px 32px rgba(0, 0, 0, .35));
  }

  :root[data-theme="dark"] .testimonial-stack:hover .t-card.t-back,
  :root[data-theme="dark"] .testimonial-stack:focus-visible .t-card.t-back {
    transform: translate(65px, 18px) rotate(7.8deg) scale(.96);
    border-color: rgba(144, 108, 52, .54);
    filter:
      drop-shadow(7px 14px 11px rgba(42, 24, 10, .28))
      drop-shadow(0 26px 34px rgba(0, 0, 0, .36));
  }
}

:root[data-theme="dark"] .t-card::before {
  background: linear-gradient(90deg, transparent, rgba(122, 94, 49, .54), transparent);
  opacity: .62;
}

:root[data-theme="dark"] .t-card.t-audio-card {
  background:
    radial-gradient(circle at 18% 16%, rgba(99, 74, 37, .08) 0 1px, transparent 1.5px),
    radial-gradient(circle at 78% 68%, rgba(99, 74, 37, .055) 0 1px, transparent 1.5px),
    repeating-linear-gradient(2deg, rgba(83, 62, 31, .018) 0 1px, transparent 1px 5px),
    linear-gradient(145deg, #eee5d3 0%, #e1d5bc 51%, #d3c4a7 100%);
  border-color: rgba(122, 94, 49, .4);
}

:root[data-theme="dark"] .t-audio-media {
  background: transparent;
}

:root[data-theme="dark"] .t-audio-media::after {
  background: linear-gradient(90deg, transparent, rgba(122, 94, 49, .34), transparent);
}

:root[data-theme="dark"] .t-audio-kicker {
  color: #56442e;
  background: rgba(255, 255, 255, .18);
  border-color: rgba(122, 94, 49, .42);
  box-shadow: none;
  backdrop-filter: none;
}

:root[data-theme="dark"] .t-audio-kicker i {
  color: #8c2432;
}

:root[data-theme="dark"] .t-audio-play {
  color: #f4e7cf;
  background:
    radial-gradient(circle at 35% 28%, rgba(255, 255, 255, .18), transparent 26%),
    linear-gradient(145deg, #8f2232, #65121e);
  border-color: rgba(174, 135, 67, .72);
  box-shadow:
    0 0 0 6px rgba(122, 94, 49, .1),
    0 14px 28px rgba(62, 34, 22, .24),
    inset 0 1px 0 rgba(255, 255, 255, .12);
}

:root[data-theme="dark"] .t-audio-wave span {
  background: rgba(69, 55, 40, .46);
}

:root[data-theme="dark"] .t-audio-card.is-playing .t-audio-wave span {
  background: linear-gradient(180deg, #a82a3a, #775c2e);
}

:root[data-theme="dark"] .t-audio-progress {
  color: rgba(53, 45, 36, .72);
}

:root[data-theme="dark"] .t-audio-bar {
  background: rgba(53, 45, 36, .18);
}

:root[data-theme="dark"] .t-audio-bar > i {
  background: linear-gradient(90deg, #8b2432, #b29352);
}

:root[data-theme="dark"] .t-audio-copy {
  color: #3b2f25;
  background: rgba(255, 255, 255, .11);
  border-color: rgba(122, 94, 49, .3);
}

:root[data-theme="dark"] .t-audio-copy strong,
:root[data-theme="dark"] .t-author strong {
  color: #7b1b29;
  background: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-text-fill-color: currentColor;
}

:root[data-theme="dark"] .t-audio-copy span,
:root[data-theme="dark"] .t-author span {
  color: rgba(53, 45, 36, .66);
}

:root[data-theme="dark"] .t-quote {
  color: #8f2634;
  background: rgba(122, 94, 49, .09);
  border-color: rgba(122, 94, 49, .25);
}

:root[data-theme="dark"] .t-text {
  color: rgba(53, 45, 36, .8);
}

:root[data-theme="dark"] .stats-inner {
  background:
    linear-gradient(115deg, rgba(168, 42, 58, .085), transparent 38%),
    linear-gradient(180deg, #171918, #101212);
  border-color: rgba(185, 154, 89, .22);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
  padding: 28px 32px;
  gap: 18px;
}

:root[data-theme="dark"] .stats-inner .stat {
  padding: 20px 18px;
  border-radius: 16px;
}

:root[data-theme="dark"] .stats-inner::before {
  background: linear-gradient(90deg, transparent, var(--crimson-action), var(--gold), transparent);
  opacity: .68;
}

:root[data-theme="dark"] .stat-num,
:root[data-theme="dark"] .trusted-stat {
  color: var(--gold-light);
  background: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-text-fill-color: currentColor;
}

:root[data-theme="dark"] .stat-label {
  color: var(--muted);
}

:root[data-theme="dark"] .tv-card {
  color: var(--text);
  background: linear-gradient(180deg, #181a19, #111313);
  border-color: var(--line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .018);
}

:root[data-theme="dark"] .tv-card:hover,
:root[data-theme="dark"] .tv-card:focus-visible {
  border-color: var(--line-strong);
  box-shadow: 0 26px 56px rgba(0, 0, 0, .32);
}

:root[data-theme="dark"] .tv-thumb::before {
  color: rgba(213, 185, 113, .055);
}

:root[data-theme="dark"] .tv-thumb::after {
  background: linear-gradient(180deg, rgba(9, 11, 11, .04), rgba(9, 11, 11, .58));
}

:root[data-theme="dark"] .tv-play {
  color: #f5e8d2;
  background: linear-gradient(145deg, #8b2231, #60111d);
  border-color: rgba(213, 185, 113, .42);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .36);
}

:root[data-theme="dark"] .tv-views,
:root[data-theme="dark"] .tv-ribbon {
  color: #f5ecdc;
  background: rgba(13, 15, 15, .9);
  border-color: rgba(185, 154, 89, .32);
  box-shadow: 0 12px 24px rgba(0, 0, 0, .3);
}

:root[data-theme="dark"] .tv-cta {
  color: var(--gold-light);
}

@media (max-width: 768px) {
  :root[data-theme="dark"] .t-card.t-middle {
    transform: translate(20px, -8px) rotate(1.4deg) scale(.985);
  }

  :root[data-theme="dark"] .t-card.t-back {
    transform: translate(40px, 9px) rotate(6.8deg) scale(.965);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root[data-theme="dark"] .testimonial-stack::before {
    animation: none;
  }
}
