/* Holiday themes: loaded only while a theme is on (see functions/_lib/themes.js).
   Artwork lives in /assets/img/themes/ (generated by scripts/build-theme-art.py). */

/* greeting strip at the very top */
.theme-bar { display: flex; align-items: center; justify-content: center; min-height: 34px; padding: 6px 16px; font: 700 14px/1.3 var(--nav); letter-spacing: .6px; text-align: center; position: relative; overflow: hidden; }
.theme-bar .top-msg { position: relative; z-index: 1; text-shadow: 0 1px 2px rgba(0, 0, 0, .25); }
body[data-theme] .hero-inner { padding-top: calc(var(--header-h) + 40px); }
@media (max-width: 760px) { body[data-theme] .hero-inner { padding-top: calc(var(--header-h) + 40px); } }

/* garland hanging under the header */
.site-header { overflow: visible; }
.theme-garland { position: absolute; left: 0; right: 0; top: calc(100% - 6px); height: 70px; pointer-events: none; background-repeat: repeat-x; background-size: 300px 70px; z-index: 2; }
.site-header.is-small .theme-garland { opacity: 0; visibility: hidden; } /* never covers content once the page scrolls */
.theme-garland { transition: opacity .25s, visibility .25s; }
/* inner pages: leave room under the header so the garland hangs in empty space, not over search boxes */
body[data-theme]:not(.home) .site-header { margin-bottom: 58px; }

/* big holiday greeting on the homepage hero */
.theme-hello { margin: 0 0 4px; font-family: var(--theme-font); font-size: clamp(42px, 7vw, 88px); line-height: 1.05; color: #fff; text-shadow: 0 3px 14px rgba(0, 0, 0, .55), 0 0 2px rgba(0, 0, 0, .4); animation: themeHello 1.1s cubic-bezier(.2, 1.3, .4, 1) both; }
@keyframes themeHello { from { opacity: 0; transform: translateY(18px) scale(.94); } to { opacity: 1; transform: none; } }
body[data-theme] .hero::before { background: var(--theme-tint, rgba(0, 0, 0, .35)); }

/* listing cards: themed frame + corner ornament */
body[data-theme] .card { position: relative; overflow: visible; box-shadow: 0 0 0 3px var(--green), 0 8px 20px rgba(0, 0, 0, .12); }
body[data-theme] .card-media { border-radius: 6px 6px 0 0; overflow: hidden; }
body[data-theme] .card::after { content: ''; position: absolute; top: -14px; left: -12px; width: 50px; height: 50px; background: var(--theme-corner) center/contain no-repeat; z-index: 3; pointer-events: none; transform-origin: 50% 8%; transform: rotate(calc(-10deg + var(--sway, 0) * 1deg)); will-change: transform; }
body[data-theme] .section .wrap > h2, body[data-theme] h1.page-title { position: relative; }

/* holiday scene above the footer */
.theme-scene { height: 150px; background-repeat: repeat-x; background-position: bottom; background-size: 720px 150px; margin-top: 30px; }
body[data-theme] .site-footer { border-top: 0; }

/* falling decorations / fireworks canvas */
#theme-fx { position: fixed; inset: 0; pointer-events: none; z-index: 40; }

/* ---------- Halloween */
.theme-halloween { --green: #e0701b; --green-dark: #b85712; --green-pale: #f7d3b4; --theme-tint: linear-gradient(180deg, rgba(26, 16, 35, .55), rgba(59, 31, 82, .45)); --theme-corner: url(/assets/img/themes/halloween-corner.svg); }
.theme-halloween .theme-bar { background: linear-gradient(90deg, #1a1023, #3b1f52 50%, #1a1023); color: #ffa94d; }
.theme-halloween .theme-garland { background-image: url(/assets/img/themes/halloween-garland.svg); }
.theme-halloween .theme-hello { color: #ff8a2a; text-shadow: 0 0 18px rgba(255, 122, 26, .55), 0 3px 10px rgba(0, 0, 0, .7); }
.theme-halloween .theme-scene { background-image: url(/assets/img/themes/halloween-footer.svg); background-color: #3b1f52; }

/* ---------- Thanksgiving */
.theme-thanksgiving { --green: #c8641e; --green-dark: #a34f14; --green-pale: #f5d3b3; --theme-tint: linear-gradient(180deg, rgba(122, 59, 18, .45), rgba(0, 0, 0, .3)); --theme-corner: url(/assets/img/themes/thanksgiving-corner.svg); }
.theme-thanksgiving .theme-bar { background: linear-gradient(90deg, #7a3b12, #a9561c 50%, #7a3b12); color: #fde7c8; }
.theme-thanksgiving .theme-garland { background-image: url(/assets/img/themes/thanksgiving-garland.svg); }
.theme-thanksgiving .theme-hello { color: #ffd59a; }
.theme-thanksgiving .theme-scene { background-image: url(/assets/img/themes/thanksgiving-footer.svg); background-color: #f6e3c8; }

/* ---------- Christmas */
.theme-christmas { --green: #1f7a45; --green-dark: #17603a; --green-pale: #c9e6d3; --theme-tint: linear-gradient(180deg, rgba(120, 15, 25, .45), rgba(10, 50, 28, .4)); --theme-corner: url(/assets/img/themes/christmas-corner.svg); }
.theme-christmas .theme-bar { background: repeating-linear-gradient(135deg, #b3202e 0 14px, #c62f3d 14px 28px); color: #fff; }
.theme-christmas .theme-garland { background-image: url(/assets/img/themes/christmas-garland.svg); }
.theme-christmas .theme-hello { color: #fff; text-shadow: 0 0 16px rgba(255, 255, 255, .5), 0 3px 10px rgba(120, 0, 0, .8); }
.theme-christmas .theme-scene { background-image: url(/assets/img/themes/christmas-footer.svg); background-color: #16324a; }

/* ---------- New Year's */
.theme-newyear { --green: #b8912f; --green-dark: #93731f; --green-pale: #f1e2b5; --theme-tint: linear-gradient(180deg, rgba(5, 8, 20, .62), rgba(5, 8, 20, .4)); --theme-corner: url(/assets/img/themes/newyear-corner.svg); }
.theme-newyear .theme-bar { background: linear-gradient(90deg, #0b0f1a, #1c2333 50%, #0b0f1a); color: #f0d27a; }
.theme-newyear .theme-garland { background-image: url(/assets/img/themes/newyear-garland.svg); }
.theme-newyear .theme-hello { color: #f0d27a; text-shadow: 0 0 20px rgba(240, 210, 122, .6), 0 3px 10px rgba(0, 0, 0, .8); }
.theme-newyear .theme-scene { background-image: url(/assets/img/themes/newyear-footer.svg); background-color: #0b1226; }

/* ---------- Valentine's Day */
.theme-valentines { --green: #d6336c; --green-dark: #b02457; --green-pale: #f9cfdd; --theme-tint: linear-gradient(180deg, rgba(194, 37, 92, .42), rgba(60, 0, 25, .3)); --theme-corner: url(/assets/img/themes/valentines-corner.svg); }
.theme-valentines .theme-bar { background: linear-gradient(90deg, #c2255c, #e25b8a 50%, #c2255c); color: #fff; }
.theme-valentines .theme-garland { background-image: url(/assets/img/themes/valentines-garland.svg); }
.theme-valentines .theme-hello { color: #fff0f5; text-shadow: 0 0 18px rgba(226, 91, 138, .8), 0 3px 10px rgba(80, 0, 30, .7); }
.theme-valentines .theme-scene { background-image: url(/assets/img/themes/valentines-footer.svg); background-color: #fde3ec; }

/* ---------- St. Patrick's Day */
.theme-stpatricks { --green: #1e8a3c; --green-dark: #166d2f; --green-pale: #bfe3c8; --theme-tint: linear-gradient(180deg, rgba(10, 70, 30, .5), rgba(0, 0, 0, .3)); --theme-corner: url(/assets/img/themes/stpatricks-corner.svg); }
.theme-stpatricks .theme-bar { background: linear-gradient(90deg, #136b2c, #1e8a3c 50%, #136b2c); color: #fff; }
.theme-stpatricks .theme-garland { background-image: url(/assets/img/themes/stpatricks-garland.svg); }
.theme-stpatricks .theme-hello { color: #e9ffe9; text-shadow: 0 0 16px rgba(212, 175, 55, .7), 0 3px 10px rgba(0, 40, 10, .8); }
.theme-stpatricks .theme-scene { background-image: url(/assets/img/themes/stpatricks-footer.svg); background-color: #dff1e2; }

/* ---------- 4th of July */
.theme-july4 { --green: #1f4e9c; --green-dark: #173c79; --green-pale: #c9d7f0; --theme-tint: linear-gradient(180deg, rgba(10, 20, 60, .55), rgba(120, 10, 25, .3)); --theme-corner: url(/assets/img/themes/july4-corner.svg); }
.theme-july4 .theme-bar { background: #1f3d8a; color: #fff; }
.theme-july4 .theme-garland { background-image: url(/assets/img/themes/july4-garland.svg); }
.theme-july4 .theme-hello { color: #fff; text-shadow: 0 0 16px rgba(178, 34, 52, .8), 0 3px 10px rgba(0, 0, 40, .8); }
.theme-july4 .theme-scene { background-image: url(/assets/img/themes/july4-footer.svg); background-color: #0d1b42; }

/* ---------- College World Series (generic baseball look, no event marks) */
.theme-cws { --green: #b8202f; --green-dark: #8f1824; --green-pale: #f3c9cd; --theme-tint: linear-gradient(180deg, rgba(10, 20, 48, .55), rgba(10, 20, 48, .3)); --theme-corner: url(/assets/img/themes/cws-corner.svg); }
.theme-cws .theme-bar { background: linear-gradient(90deg, #0f1f45, #1f3568 50%, #0f1f45); color: #fff; }
.theme-cws .theme-bar::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: repeating-linear-gradient(90deg, #d0283a 0 10px, transparent 10px 16px); }
.theme-cws .theme-garland { background-image: url(/assets/img/themes/cws-garland.svg); }
.theme-cws .theme-hello { color: #fff; letter-spacing: 2px; text-transform: uppercase; font-size: clamp(34px, 5.6vw, 72px); text-shadow: 0 0 0 #d0283a, 3px 3px 0 #b8202f, 0 6px 16px rgba(0, 0, 0, .6); }
.theme-cws .theme-scene { background-image: url(/assets/img/themes/cws-footer.svg); background-color: #1f6a2c; }

/* ---------- Berkshire Hathaway annual meeting (generic shareholders-weekend look, no company marks) */
.theme-berkshire { --green: #1f3157; --green-dark: #0c1630; --green-pale: #d6dcea; --theme-tint: linear-gradient(180deg, rgba(12, 22, 48, .6), rgba(12, 22, 48, .35)); --theme-corner: url(/assets/img/themes/berkshire-corner.svg); }
.theme-berkshire .theme-bar { background: linear-gradient(90deg, #0c1630, #1f3157 50%, #0c1630); color: #f0d27a; letter-spacing: 1.2px; text-transform: uppercase; font-size: 12.5px; }
.theme-berkshire .theme-bar::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: linear-gradient(90deg, transparent, #e2b84a, transparent); }
.theme-berkshire .theme-garland { background-image: url(/assets/img/themes/berkshire-garland.svg); }
.theme-berkshire .theme-hello { color: #f0d27a; letter-spacing: 3px; font-size: clamp(34px, 5.4vw, 70px); text-shadow: 0 0 18px rgba(226, 184, 74, .45), 0 3px 10px rgba(0, 0, 0, .8); }
.theme-berkshire .theme-scene { background-image: url(/assets/img/themes/berkshire-footer.svg); background-color: #0c1630; background-repeat: no-repeat; background-size: 100% 100%; } /* one rising line across the full width (no seam) */

@media (max-width: 760px) {
  .theme-bar { font-size: 12px; min-height: 30px; }
  .theme-garland { height: 46px; background-size: 197px 46px; }
  body[data-theme]:not(.home) .site-header { margin-bottom: 44px; }
  body[data-theme] .card::after { width: 36px; height: 36px; top: -10px; left: -8px; }
  .theme-scene { height: 110px; background-size: 528px 110px; }
}
body[data-theme] .header-inner { position: relative; z-index: 3; } body[data-theme] .menu .sub { z-index: 10; } body[data-theme] .mobile-menu { position: relative; z-index: 4; }
