/* ==========================================================
   Deco signature: home page only
   1. Sunburst opens once behind the name (respects reduced motion)
   2. Praise as a night-gallery band with gilt hairlines
   3. Gallery spacing for the two home-page paintings
   ========================================================== */

/* ---------- 1. Sunburst opening ---------- */
@media (prefers-reduced-motion: no-preference) {
  .hero-sunburst .hsb-rays,
  .hero-sunburst .hsb-lines {
    transform-box: view-box;
    transform-origin: 50% 100%;
    animation: deco-fan-open 2.2s cubic-bezier(.2, .7, .2, 1) both;
  }
  .hero-sunburst .hsb-lines { animation-delay: .25s; }
  .hero-sunburst .hsb-arc,
  .hero-sunburst circle,
  .hero-sunburst .hsb-dots {
    animation: deco-fade-in 1.6s ease-out .9s both;
  }
  .hero-name {
    animation: deco-rise 1.4s cubic-bezier(.2, .7, .2, 1) .35s both;
  }
  .hero-genre {
    animation: deco-fade-in 1.2s ease-out 1.1s both;
  }
}
@keyframes deco-fan-open {
  from { transform: scale(.35, .1); opacity: 0; }
}
@keyframes deco-fade-in {
  from { opacity: 0; }
}
@keyframes deco-rise {
  from { opacity: 0; transform: translateY(10px); letter-spacing: .14em; }
}

/* ---------- 2. Praise in Eau de Nil: pale Deco green with gilt hairlines ---------- */
#praise {
  --ng-top: #dde8d4;
  --ng-bottom: #c6d8bf;
  --ng-gold: #7a5b22;
  --ng-gold-soft: rgba(122, 91, 34, .55);
  --ng-text: #142420;
  --ng-text-soft: #24382f;
  --ng-card: rgba(255, 252, 242, .86);
  --ng-glow: rgba(255, 246, 214, .55);
  --ng-ray: rgba(138, 106, 46, .07);
  position: relative;
  isolation: isolate;
  margin-block: var(--space-12, 3rem) var(--space-8, 2rem);
  padding-block: clamp(3.5rem, 7vw, 6.5rem) !important;
  background:
    radial-gradient(ellipse 900px 460px at 50% 0%, var(--ng-glow), transparent 70%),
    linear-gradient(180deg, var(--ng-top) 0%, var(--ng-bottom) 100%);
  color: var(--ng-text);
  overflow: hidden;
}
#praise::before {
  content: "";
  position: absolute;
  inset: clamp(10px, 1.6vw, 20px);
  border: 1px solid var(--ng-gold-soft);
  outline: 1px solid rgba(138, 106, 46, .18);
  outline-offset: 5px;
  pointer-events: none;
  z-index: -1;
}
#praise::after {
  content: "";
  position: absolute;
  left: 50%;
  top: -1px;
  width: min(1100px, 140vw);
  aspect-ratio: 2 / 1;
  transform: translateX(-50%);
  background: repeating-conic-gradient(from 90deg at 50% 0%, var(--ng-ray) 0deg 1.2deg, transparent 1.2deg 7.5deg);
  -webkit-mask-image: radial-gradient(ellipse 50% 100% at 50% 0%, #000 0%, transparent 72%);
          mask-image: radial-gradient(ellipse 50% 100% at 50% 0%, #000 0%, transparent 72%);
  pointer-events: none;
  z-index: -1;
}
#praise .deco-rule { color: var(--ng-gold); }
#praise .deco-rule::before,
#praise .deco-rule::after { background: linear-gradient(90deg, transparent, var(--ng-gold)) !important; }
#praise .section-title .eyebrow { color: #6f5420 !important; }
#praise .section-title .eyebrow::before { color: var(--ng-gold); }
#praise .section-title h2 { color: var(--color-forest, #23443a); letter-spacing: .08em; }

#praise .praise-card {
  background: var(--ng-card);
  border: 1px solid var(--ng-gold-soft);
  border-top: 1px solid var(--ng-gold-soft);
  box-shadow: inset 0 0 0 4px rgba(255, 252, 242, .5), inset 0 0 0 5px rgba(122, 91, 34, .3), 0 10px 24px -18px rgba(31, 46, 40, .45);
}
#praise .praise-card::before { color: var(--ng-gold); opacity: .42; }
#praise .praise-card.kirkus::after { color: var(--ng-gold); }
#praise .praise-quote { color: var(--ng-text); font-size: clamp(1.02rem, .95rem + .3vw, 1.15rem); }
#praise .praise-quote em, #praise .praise-quote i { color: var(--ng-text); }
#praise .praise-attr { border-top-color: var(--ng-gold-soft); }
#praise .praise-source,
#praise .praise-source em { color: var(--color-oxblood, #6b1f24); }
#praise .praise-book { color: #24463a; }
#praise .praise-context { color: var(--ng-text-soft); }
#praise .praise-note { color: var(--ng-text-soft); }
#praise .praise-note a,
#praise .praise-note .inline-link { color: var(--color-oxblood, #6b1f24); text-decoration-color: var(--ng-gold-soft); }
#praise .praise-note a:hover { color: var(--ng-text); }
/* "Read more praise" toggle: legible on the Eau de Nil band in both themes */
#praise .praise-more > summary { color: var(--ng-text); border-color: var(--ng-gold); background: var(--ng-card); font-weight: 600; }
#praise .praise-more > summary:hover,
#praise .praise-more > summary:focus-visible { background: rgba(138, 106, 46, .14); color: var(--ng-text); }
#praise .praise-more > summary:focus-visible { outline: 2px solid var(--ng-gold); outline-offset: 3px; }
#praise .praise-more-count { color: var(--ng-text-soft); }

/* dark theme: a deeper jade of the same family, never near-black */
[data-theme="dark"] #praise {
  --ng-top: #2f5246; --ng-bottom: #24443a;
  --ng-gold: #e8c77e; --ng-gold-soft: rgba(232, 199, 126, .62);
  --ng-text: #fcf7ea; --ng-text-soft: #efe7d2; --ng-card: rgba(10, 26, 21, .34);
  --ng-glow: rgba(255, 232, 180, .13); --ng-ray: rgba(232, 199, 126, .05);
}
[data-theme="dark"] #praise .section-title .eyebrow { color: #ecc88a !important; }
[data-theme="dark"] #praise .section-title h2 { color: #f5eedb; }
[data-theme="dark"] #praise .praise-source, [data-theme="dark"] #praise .praise-source em,
[data-theme="dark"] #praise .praise-note a { color: #ecc88a; }
[data-theme="dark"] #praise .praise-book { color: #e2eee5; }
[data-theme="dark"] #praise .praise-card::before { opacity: .5; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) #praise .section-title .eyebrow { color: #ecc88a !important; }
  :root:not([data-theme="light"]) #praise .section-title h2 { color: #f5eedb; }
  :root:not([data-theme="light"]) #praise .praise-source, :root:not([data-theme="light"]) #praise .praise-source em,
  :root:not([data-theme="light"]) #praise .praise-note a { color: #ecc88a; }
  :root:not([data-theme="light"]) #praise .praise-book { color: #e2eee5; }
  :root:not([data-theme="light"]) #praise .praise-card::before { opacity: .5; }
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) #praise {
    --ng-top: #2f5246; --ng-bottom: #24443a;
    --ng-gold: #e8c77e; --ng-gold-soft: rgba(232, 199, 126, .62);
    --ng-text: #fcf7ea; --ng-text-soft: #efe7d2; --ng-card: rgba(10, 26, 21, .34);
    --ng-glow: rgba(255, 232, 180, .13); --ng-ray: rgba(232, 199, 126, .05);
  }
}

/* ---------- 3. Home gallery paintings ---------- */
.home-gallery { padding-block: var(--space-6, 1.5rem) var(--space-10, 2.5rem); }
.home-gallery .deco-painting { margin-bottom: 0; }
[data-theme="dark"] #praise .praise-card{ box-shadow: inset 0 0 0 4px rgba(245,238,219,.03), inset 0 0 0 5px rgba(232,199,126,.32), 0 12px 26px -16px rgba(0,0,0,.55); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) #praise .praise-card{ box-shadow: inset 0 0 0 4px rgba(245,238,219,.03), inset 0 0 0 5px rgba(232,199,126,.32), 0 12px 26px -16px rgba(0,0,0,.55); } }

/* ---------- 4. Praise flourishes: gilt bridge, frame corners, chevron rule ---------- */
.deco-bridge {
  display: flex;
  justify-content: center;
  padding-block: var(--space-6, 1.5rem) var(--space-4, 1rem);
  color: var(--color-gold, #8a6a2e);
}
.deco-bridge svg { width: min(360px, 82vw); height: auto; display: block; }
.deco-bridge + #praise { margin-top: 0; }

#praise .praise-intro { color: var(--ng-text-soft); }

#praise .praise-corners {
  position: absolute;
  inset: calc(clamp(10px, 1.6vw, 20px) + 7px);
  pointer-events: none;
  z-index: -1;
  color: var(--ng-gold);
  opacity: .75;
}
#praise .praise-corners .pc { position: absolute; width: clamp(46px, 5.5vw, 68px); height: auto; }
#praise .pc-tl { top: 0; left: 0; }
#praise .pc-tr { top: 0; right: 0; transform: scaleX(-1); }
#praise .pc-bl { bottom: 0; left: 0; transform: scaleY(-1); }
#praise .pc-br { bottom: 0; right: 0; transform: scale(-1, -1); }

#praise .deco-chevrons {
  display: flex;
  justify-content: center;
  color: var(--ng-gold);
  margin: calc(-1 * var(--space-4, 1rem)) auto var(--space-10, 2.5rem);
}
#praise .deco-chevrons svg { width: min(220px, 64vw); height: auto; display: block; }

/* ---------- 5. Closing fan and single-column review gems ---------- */
.closing-deco .closing-fan {
  display: flex;
  justify-content: center;
  margin-top: var(--space-4, 1rem);
  color: var(--color-gold, #8a6a2e);
}
.closing-deco .closing-fan svg { width: min(320px, 78vw); height: auto; display: block; }

@media (max-width: 635px) {
  #praise .praise-card:not([hidden]) ~ .praise-card .praise-quote::before {
    content: "";
    position: absolute;
    left: 50%;
    top: calc(-1 * var(--praise-pad, 2rem) - var(--praise-gap, 2rem) / 2 - 7px);
    width: 92px;
    height: 14px;
    transform: translateX(-50%);
    background: var(--ng-gold);
    opacity: .8;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 92 14'%3E%3Cpath d='M46 1 L52 7 L46 13 L40 7 Z' fill='black'/%3E%3Cpath d='M4 7 H32 M60 7 H88' stroke='black' stroke-width='1.1'/%3E%3Ccircle cx='35.5' cy='7' r='1.3' fill='black'/%3E%3Ccircle cx='56.5' cy='7' r='1.3' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 92 14'%3E%3Cpath d='M46 1 L52 7 L46 13 L40 7 Z' fill='black'/%3E%3Cpath d='M4 7 H32 M60 7 H88' stroke='black' stroke-width='1.1'/%3E%3Ccircle cx='35.5' cy='7' r='1.3' fill='black'/%3E%3Ccircle cx='56.5' cy='7' r='1.3' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
    pointer-events: none;
  }
}
