/* Jake the Jedi — night brand. Dark-only by design. */
:root {
  --night: #0B0A0A; --char: #15120F; --smoke: #231E1A; --smoke-2: #2C2622;
  --ember: #D95F18; --flame: #F2A33A; --coal: #7A2E0A;
  --teal: #4E7F82; --jade: #2F6B5E; --mist: #B8AFA3; --cream: #F7F2E8; --bone: #E8DFD0;
  --accent: var(--ember); --accent-soft: rgba(217, 95, 24, .14); --hair: rgba(247, 242, 232, .12);
  --display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --body: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --wrap: 1180px; --narrow: 720px; --gutter: 16px;
  --s1: .5rem; --s2: 1rem; --s3: 1.5rem; --s4: 2.5rem; --s5: 4rem; --s6: 6.5rem; --gap: 48px;
  --fs-0: .9rem; --fs-1: 1.0625rem; --fs-2: 1.25rem; --fs-3: clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem);
  --fs-4: clamp(1.85rem, 1.4rem + 2.2vw, 3rem); --fs-5: clamp(2.6rem, 1.6rem + 5.2vw, 5.6rem);
  color-scheme: dark;
}
html[data-element="fire"] { --accent: var(--ember); --accent-soft: rgba(217, 95, 24, .14); }
html[data-element="water"] { --accent: var(--teal); --accent-soft: rgba(78, 127, 130, .18); }
html[data-element="earth"] { --accent: var(--jade); --accent-soft: rgba(47, 107, 94, .2); }
html[data-element="air"] { --accent: var(--bone); --accent-soft: rgba(232, 223, 208, .1); }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--night); color: var(--cream); font-family: var(--body); font-size: var(--fs-1); line-height: 1.6; overflow-x: hidden; }
img, picture, video, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: var(--cream); text-decoration-color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--flame); }
:focus-visible { outline: 2px solid var(--flame); outline-offset: 3px; border-radius: 2px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: var(--gutter); top: -3rem; background: var(--ember); color: var(--night); padding: .5rem .9rem; z-index: 100; font-weight: 700; }
.skip:focus { top: var(--gutter); }

h1, h2, h3 { font-family: var(--display); font-weight: 600; line-height: 1.05; margin: 0 0 var(--s2); letter-spacing: -.005em; color: var(--cream); }
h1 { font-size: var(--fs-5); }
h2 { font-size: var(--fs-4); margin-top: 0; }
h3 { font-size: var(--fs-3); }
p { margin: 0 0 var(--s2); max-width: 68ch; }
.kicker { font-family: var(--body); font-variant: all-small-caps; letter-spacing: .14em; font-weight: 600; color: var(--accent); margin: 0 0 var(--s1); font-size: 1.05rem; }
html[data-element="air"] .kicker { color: var(--flame); }
html[data-element="water"] .kicker { color: #7FB3B6; }
html[data-element="earth"] .kicker { color: #6FAE9C; }
.lede { font-family: var(--display); font-size: var(--fs-3); font-weight: 500; line-height: 1.3; color: var(--bone); max-width: 32ch; }

.wrap { width: min(100% - 2 * var(--gutter), var(--wrap)); margin-inline: auto; }
.wrap--narrow { width: min(100% - 2 * var(--gutter), var(--narrow)); }
.main > .wrap { padding-block: var(--gap) var(--s5); }
@media (min-width: 900px) { :root { --gap: 72px; } }
.sec__lede { color: var(--bone); font-size: var(--fs-2); max-width: 60ch; margin-bottom: var(--s3); }

/* ---------- header ---------- */
.top { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; gap: var(--s2); padding: .85rem var(--gutter); background: linear-gradient(to bottom, rgba(11, 10, 10, .92), rgba(11, 10, 10, .75)); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--hair); }
.brand { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; color: var(--cream); }
.brand__name { font-family: var(--display); font-size: 1.35rem; font-weight: 700; letter-spacing: .04em; }
.mark { color: var(--cream); flex: none; }
.nav { display: none; }
.nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .25rem; }
.nav a { text-decoration: none; font-weight: 500; padding: .55rem .2rem; display: inline-block; }
.nav a[aria-current="page"] { color: var(--flame); box-shadow: inset 0 -1px 0 var(--accent); }
.nav__cta { margin-top: var(--s2); }
.nav-toggle { background: none; border: 1px solid var(--hair); border-radius: 999px; width: 44px; height: 44px; display: grid; place-items: center; gap: 5px; padding: 0; cursor: pointer; }
.nav-toggle span:not(.sr) { display: block; width: 18px; height: 2px; background: var(--cream); transition: transform .25s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(3.5px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { transform: translateY(-3.5px) rotate(-45deg); }
body.nav-open .nav { display: block; position: fixed; inset: 64px 0 0 0; background: var(--night); padding: var(--s3) var(--gutter); overflow: auto; z-index: 49; }
body.nav-open .nav a { font-family: var(--display); font-size: 1.9rem; font-weight: 600; }
@media (min-width: 880px) {
  .nav-toggle { display: none; }
  .nav { display: flex; align-items: center; gap: var(--s3); }
  .nav ul { flex-direction: row; gap: 1.1rem; }
  .nav a { font-size: .95rem; }
  .nav__cta { margin: 0; }
}

/* ---------- buttons ---------- */
.btn { display: inline-block; font-weight: 700; text-decoration: none; padding: .8rem 1.3rem; border: 1px solid var(--hair); border-radius: 2px; color: var(--cream); background: transparent; cursor: pointer; font-family: var(--body); font-size: 1rem; line-height: 1; transition: background .2s, border-color .2s, color .2s; }
.btn:hover { border-color: var(--flame); color: var(--flame); }
.btn--ember { background: var(--ember); border-color: var(--ember); color: var(--night); }
.btn--ember:hover { background: var(--flame); border-color: var(--flame); color: var(--night); }

/* ---------- hero: the one bold thing ---------- */
.hero { position: relative; isolation: isolate; min-height: 62svh; display: grid; align-items: end; overflow: hidden; }
.hero--big { min-height: 92svh; }
.hero--type { min-height: auto; padding: var(--s5) 0 var(--s2); }
.hero__media { position: absolute; inset: 0; z-index: -1; }
.hero__media picture, .hero__media img { width: 100%; height: 100%; object-fit: cover; }
.hero__media::after { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(to top, var(--night) 0%, rgba(11, 10, 10, .82) 18%, rgba(11, 10, 10, .35) 36%, rgba(11, 10, 10, 0) 48%); }
.hero--video .hero__media::after { background: linear-gradient(to top, var(--night) 0%, rgba(11, 10, 10, .9) 26%, rgba(11, 10, 10, .55) 50%, rgba(11, 10, 10, .08) 72%, rgba(11, 10, 10, 0) 100%); }
.hero__media--video { background: var(--night); }
.hero__media--video .video { max-width: none; aspect-ratio: auto; position: absolute; inset: 0; }
.hero__media--video .video__loop { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.hero__media--video .video__play { left: auto; right: var(--gutter); bottom: auto; top: var(--s3); z-index: 3; }
.hero--video { min-height: 78svh; }
@media (min-width: 900px) { .hero__media--video .video__loop { object-position: 50% 30%; } }
.hero__text { width: min(100% - 2 * var(--gutter), var(--wrap)); margin-inline: auto; padding: var(--s4) 0 var(--s3); position: relative; z-index: 1; animation: rise 1.1s cubic-bezier(.2, .7, .2, 1) both; }
.hero--big h1 { font-style: italic; font-weight: 500; max-width: 14ch; text-wrap: balance; }
.hero h1 { max-width: 16ch; text-wrap: balance; }
.hero--big .hero__text { padding-bottom: var(--s4); }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .hero__text { animation: none; } html { scroll-behavior: auto; } }

/* ---------- sections ---------- */
.sec { padding-block: var(--gap); border-top: 1px solid var(--hair); }
.sec:first-child { border-top: 0; padding-top: 0; }
.sec--prose p { font-size: var(--fs-2); line-height: 1.55; }
.sec--prose p:first-of-type { color: var(--cream); }
.sec--prose p + p { color: var(--bone); }
.sec--quote blockquote { margin: 0; padding-left: var(--s3); border-left: 2px solid var(--accent); }
.sec--quote p { font-family: var(--display); font-style: italic; font-size: var(--fs-4); line-height: 1.15; max-width: 24ch; color: var(--cream); }
.sec--quote cite { font-style: normal; color: var(--mist); font-size: var(--fs-0); }

.grid { display: grid; gap: var(--s2); grid-template-columns: 1fr; }
@media (min-width: 640px) { .grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .grid { grid-template-columns: repeat(4, 1fr); } .grid:has(> :nth-child(3):last-child) { grid-template-columns: repeat(3, 1fr); } .grid:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, 1fr); } .grid--3 { grid-template-columns: repeat(3, 1fr) !important; } .grid--2 { grid-template-columns: repeat(2, 1fr) !important; } }
.grid__item { display: block; background: var(--char); padding: var(--s3); border-top: 1px solid var(--accent); text-decoration: none; color: var(--cream); transition: background .25s, transform .25s; min-height: 100%; }
a.grid__item:hover { background: var(--smoke); color: var(--cream); }
.grid__item h3 { margin-bottom: var(--s1); }
.grid__item p { color: var(--bone); margin: 0; font-size: 1rem; }
.grid__glyph { display: block; color: var(--accent); margin-bottom: var(--s2); }
html[data-element="air"] .grid__glyph { color: var(--flame); }
.grid__meta { font-family: var(--body); font-variant: all-small-caps; letter-spacing: .12em; font-weight: 600; color: var(--accent) !important; font-size: .95rem !important; margin-top: var(--s2) !important; }
.grid__item--window { padding: 0; border-top: 0; overflow: hidden; display: flex; flex-direction: column; position: relative; }
.grid__item--window .grid__pic { display: block; margin: 0; }
.grid__item--window .grid__body { padding: var(--s3); border-top: 1px solid var(--accent); flex: 1; }
.grid__item--window .grid__glyph { margin-bottom: var(--s1); }
.grid__arrow { color: var(--accent); font-weight: 400; transition: transform .25s; display: inline-block; margin-left: .3em; }
a.grid__item--window:hover img { transform: scale(1.04); filter: brightness(1.06); }
a.grid__item--window:hover .grid__arrow { transform: translateX(4px); }
.grid__media { position: relative; overflow: hidden; background: var(--char); }
.grid__item--window .grid__media img, .grid__item--window .grid__media video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; transition: transform .6s cubic-bezier(.2, .7, .2, 1), filter .3s; }
@media (min-width: 640px) { .grid__item--window .grid__media img, .grid__item--window .grid__media video { aspect-ratio: 3 / 2; } }
.grid__item--span2 { grid-column: 1 / -1; }
.grid__item--span2 .grid__media img, .grid__item--span2 .grid__media video { aspect-ratio: 16 / 10; }
@media (min-width: 900px) { .grid__item--span2 .grid__media img, .grid__item--span2 .grid__media video { aspect-ratio: 16 / 9; } }
.grid--feature { gap: var(--s3); }
@media (min-width: 900px) { .grid--feature { grid-template-columns: repeat(2, 1fr) !important; } }
.grid__item--feature { background: transparent; }
.grid__item--feature .grid__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(11, 10, 10, .9) 0%, rgba(11, 10, 10, .45) 34%, rgba(11, 10, 10, 0) 60%); pointer-events: none; }
.grid__over { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: var(--s3); pointer-events: none; }
.grid__item--feature .grid__media { position: relative; }
.grid__item--feature .grid__over h3 { font-size: clamp(1.7rem, 1.3rem + 1.8vw, 2.6rem); margin: 0 0 .2rem; text-shadow: 0 2px 14px rgba(0, 0, 0, .6); }
.grid__item--feature .grid__over .grid__meta { margin-top: .2rem !important; }
.grid__item--feature .grid__body { border-top: 0; padding: var(--s2) 0 0; }
.grid__item--feature .grid__body p { font-size: 1.02rem; }
a.grid__item--feature:hover { background: transparent; }
.grid__item--video .video { max-width: none; aspect-ratio: auto; }
.grid__item--video .video__loop { aspect-ratio: 4 / 3; }
@media (min-width: 640px) { .grid__item--video .video__loop { aspect-ratio: 3 / 2; } }
.video--card .video__play { pointer-events: auto; left: auto; right: var(--s2); bottom: auto; top: var(--s2); z-index: 2; }
@media (prefers-reduced-motion: reduce) { a.grid__item--window:hover img { transform: none; } }

.sec--strip { padding-block: var(--s3); }
.strip__heading { font-family: var(--body); font-variant: all-small-caps; letter-spacing: .14em; font-weight: 600; color: var(--mist); margin: 0 0 var(--s1); font-size: .95rem; }
.strip { list-style: none; margin: 0; padding: var(--s2) 0; border-top: 1px solid var(--hair); border-bottom: 1px solid var(--hair); display: flex; flex-wrap: wrap; gap: .4rem 1.1em; }
.strip li { font-family: var(--body); font-variant: all-small-caps; letter-spacing: .1em; font-weight: 600; font-size: .95rem; color: var(--bone); white-space: nowrap; }
@media (min-width: 900px) { .strip li { font-size: 1.02rem; letter-spacing: .12em; } }
.strip li:not(:last-child)::after { content: "·"; color: var(--accent); margin-left: 1.1em; font-weight: 700; }

.plain { padding-left: 1.2rem; margin: 0; max-width: 68ch; }
.plain li { margin-bottom: .5rem; color: var(--bone); }
.plain li::marker { color: var(--accent); }

.offers { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--hair); }
.offer { display: grid; grid-template-columns: 1fr auto; gap: var(--s2); align-items: baseline; padding: var(--s3) 0; border-bottom: 1px solid var(--hair); }
.offer h3 { margin-bottom: .35rem; }
.offer h3 a { text-decoration: none; }
.offer h3 a:hover { color: var(--flame); }
.offer p { margin: 0; color: var(--bone); font-size: 1rem; max-width: 52ch; }
.offer__price { text-align: right; white-space: nowrap; font-family: var(--display); }
.offer__from { color: var(--mist); font-size: 1rem; font-family: var(--body); }
.offer__amt { font-size: var(--fs-3); font-weight: 600; color: var(--flame); }
.offer__unit { display: block; color: var(--mist); font-family: var(--body); font-size: var(--fs-0); }
.offer__ask { color: var(--mist); font-family: var(--body); font-size: 1rem; }

.gallery { display: grid; gap: .6rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .gallery { grid-template-columns: repeat(3, 1fr); gap: var(--s2); } }
.gallery__item { margin: 0; }
.gallery__item a { display: block; overflow: hidden; background: var(--char); transition: transform .3s cubic-bezier(.2, .7, .2, 1), box-shadow .3s; }
.gallery__item img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; transition: filter .3s, transform .6s cubic-bezier(.2, .7, .2, 1); }
.gallery__item--landscape img { aspect-ratio: 3 / 2; }
.gallery__item--lead { grid-column: 1 / -1; }
.gallery__item--lead img { aspect-ratio: 3 / 2; }
@media (min-width: 900px) { .gallery__item--lead { grid-column: span 2; grid-row: span 2; display: flex; flex-direction: column; } .gallery__item--lead a { flex: 1; min-height: 0; display: flex; } .gallery__item--lead picture { height: 100%; width: 100%; } .gallery__item--lead img { aspect-ratio: auto; height: 100%; object-fit: cover; } }
.gallery__item a:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(0, 0, 0, .45); }
.gallery__item a:hover img { filter: brightness(1.08); transform: scale(1.03); }
.gallery__item figcaption { color: var(--mist); font-size: var(--fs-0); padding-top: .5rem; }
@media (prefers-reduced-motion: reduce) { .gallery__item a:hover, .gallery__item a:hover img { transform: none; } }
.gallery-group + .gallery-group { margin-top: var(--s4); padding-top: var(--s4); border-top: 1px solid var(--hair); }
.gallery-group h2 { margin-bottom: var(--s1); }
.gallery-group__text { color: var(--bone); margin-bottom: var(--s2); }

.podcast { background: var(--char); border-top: 2px solid var(--accent); padding: var(--s3); max-width: 760px; }
.podcast h2 { margin-bottom: var(--s1); }
.podcast p { color: var(--bone); }
.podcast__embed { width: 100%; max-width: 660px; border: 0; border-radius: 10px; background: transparent; color-scheme: dark; overflow: hidden; display: block; margin: var(--s2) 0; }
.podcast__links { display: flex; flex-wrap: wrap; gap: .6rem; }
.podcast__link { display: inline-flex; align-items: center; gap: .5rem; }

/* ---------- social row ---------- */
.social { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; }
.social a { display: inline-flex; align-items: center; gap: .5rem; text-decoration: none; color: var(--bone); font-size: .95rem; padding: .25rem 0; }
.social a:hover { color: var(--flame); }
.social .ico { color: var(--cream); transition: color .2s; flex: none; }
.social a:hover .ico { color: var(--ember); }
.social--foot { flex-direction: column; gap: .2rem; }
.book__social { padding-top: var(--s4); }
.book__social h2 { font-size: var(--fs-3); }
.book__primary { background: var(--char); border-top: 2px solid var(--accent); padding: var(--s3); margin-bottom: var(--s4); max-width: 560px; }
.book__primary p { color: var(--mist); font-size: var(--fs-0); margin: var(--s2) 0 0; }
.btn--big { font-size: 1.1rem; padding: 1rem 1.6rem; }

.faq { border-bottom: 1px solid var(--hair); padding: .9rem 0; }
.faq summary { cursor: pointer; font-family: var(--display); font-size: var(--fs-3); font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: var(--s2); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--accent); font-weight: 400; }
.faq[open] summary::after { content: "–"; }
.faq p { color: var(--bone); padding-top: .5rem; }

.facts { display: grid; gap: 0; margin: 0; border-top: 1px solid var(--hair); max-width: 68ch; }
.facts__row { display: grid; grid-template-columns: minmax(7rem, 11rem) 1fr; gap: var(--s2); padding: .8rem 0; border-bottom: 1px solid var(--hair); }
.facts dt { color: var(--mist); font-size: var(--fs-0); }
.facts dd { margin: 0; color: var(--bone); }

.cta { background: var(--char); border-top: 2px solid var(--accent); padding: var(--s4) var(--s3); }
.cta h2 { margin-bottom: var(--s1); }
.cta p { color: var(--bone); }

/* ---------- video ---------- */
.video { position: relative; max-width: 420px; aspect-ratio: 9 / 16; background: var(--char); overflow: hidden; }
.video__loop, .video__full, .video__poster { width: 100%; height: 100%; object-fit: cover; }
.video__poster { position: absolute; inset: 0; z-index: 0; }
.video__loop, .video__full { position: relative; z-index: 1; }
.hero__media--video .video__poster { object-position: 50% 18%; }
@media (min-width: 900px) { .hero__media--video .video__poster { object-position: 50% 30%; } }
.video__play { position: absolute; left: var(--s2); bottom: var(--s2); display: inline-flex; align-items: center; gap: .6rem; background: rgba(11, 10, 10, .72); color: var(--cream); border: 1px solid var(--hair); padding: .55rem .9rem .55rem .6rem; border-radius: 999px; cursor: pointer; font: 600 .9rem var(--body); backdrop-filter: blur(6px); }
.video__ring { width: 26px; height: 26px; border-radius: 50%; border: 1.5px solid var(--flame); position: relative; }
.video__ring::after { content: ""; position: absolute; left: 9px; top: 6px; border-left: 9px solid var(--flame); border-top: 6px solid transparent; border-bottom: 6px solid transparent; }
.video--playing .video__play { display: none; }
.video__note { color: var(--mist); font-size: var(--fs-0); max-width: 420px; padding-top: .6rem; }
@media (prefers-reduced-motion: reduce) { .video__loop { display: none; } }

.video-fig { margin: 0; }
.sec--video .video { max-width: 420px; }
.sec--video-yt .video-fig { max-width: 900px; }
.yt { position: relative; aspect-ratio: 16 / 9; background: var(--char); max-width: 900px; }
.yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.embed { max-width: 900px; }
.embed--spotify-show iframe, .embed__spotify { width: 100%; max-width: 660px; border: 0; border-radius: 12px; display: block; }
.embed__apple { width: 100%; max-width: 660px; border: 0; border-radius: 10px; color-scheme: dark; display: block; }
.embed--tiktok-creator { max-width: 780px; min-height: 200px; }
.embed--tiktok-creator .tiktok-embed { margin: 0; }
.embed__links { margin-top: var(--s2); }
.embed__link { display: inline-flex; align-items: center; gap: .5rem; }
.handles { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 640px) { .handles { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1000px) { .handles { grid-template-columns: repeat(4, 1fr); } }
.handle { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: .7rem; align-items: center; background: var(--char); padding: .9rem 1rem; text-decoration: none; color: var(--cream); border-top: 1px solid var(--hair); transition: background .2s, border-color .2s; }
.handle .ico { grid-row: 1 / 3; color: var(--cream); }
.handle__name { font-weight: 600; font-size: .95rem; overflow-wrap: anywhere; }
.handle__follow { color: var(--accent); font-variant: all-small-caps; letter-spacing: .12em; font-weight: 700; font-size: .95rem; }
.handle:hover { background: var(--smoke); border-top-color: var(--accent); color: var(--cream); }
.ig { display: grid; gap: var(--s2); grid-template-columns: repeat(2, 1fr); margin-top: var(--s3); }
@media (min-width: 900px) { .ig { grid-template-columns: repeat(3, 1fr); } }
.ig__post { background: var(--char); }
.ig__post iframe { width: 100%; height: 540px; max-height: 540px; border: 0; display: block; }
.ig__fallback { display: block; padding: .6rem .9rem; font-size: var(--fs-0); color: var(--mist); text-decoration: none; }
.vids { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .vids { grid-template-columns: repeat(3, 1fr); } }
.vid a { display: block; text-decoration: none; color: var(--cream); background: var(--char); overflow: hidden; }
.vid img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; transition: transform .6s cubic-bezier(.2, .7, .2, 1), filter .3s; }
.vid a:hover img { transform: scale(1.03); filter: brightness(1.08); }
.vid__title { display: block; padding: .7rem .9rem 0; font-weight: 600; font-size: .95rem; line-height: 1.35; }
.vid__date { display: block; padding: .25rem .9rem .9rem; color: var(--mist); font-size: var(--fs-0); }
.vids__more { margin-top: var(--s2); }
.vids__empty .btn { display: inline-flex; align-items: center; gap: .5rem; }
@media (prefers-reduced-motion: reduce) { .vid a:hover img { transform: none; } }

/* ---------- journal ---------- */
.posts { list-style: none; margin: 0; padding: 0; }
.post { padding: var(--s3) 0; border-bottom: 1px solid var(--hair); }
.post a { text-decoration: none; }
.post h2 { font-size: var(--fs-3); margin-bottom: .35rem; }
.post time, .post__head time { color: var(--mist); font-size: var(--fs-0); display: block; }
.post__head { padding-top: var(--s4); margin-bottom: var(--s3); }
.post__head time { margin-bottom: var(--s2); }
.t-journalPost .sec--prose p { font-family: var(--display); font-size: 1.4rem; line-height: 1.5; max-width: 62ch; }

/* ---------- breadcrumbs ---------- */
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem; padding: 0; margin: 0 0 var(--s3); color: var(--mist); font-size: var(--fs-0); }
.crumbs li + li::before { content: "/"; margin-right: .4rem; color: var(--hair); }
.crumbs a { color: var(--mist); text-decoration: none; }
.crumbs a:hover { color: var(--flame); }

/* ---------- book form ---------- */
.book { display: grid; gap: var(--s2); max-width: 560px; }
.field { display: grid; gap: .35rem; }
.field label { font-weight: 600; font-size: .95rem; }
.field .opt { color: var(--mist); font-weight: 400; }
.field input, .field select, .field textarea { background: var(--char); color: var(--cream); border: 1px solid var(--hair); border-radius: 2px; padding: .75rem .85rem; font: inherit; width: 100%; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--accent); outline: none; }
.field--hp { position: absolute; left: -9999px; }
.book__alt { color: var(--mist); font-size: var(--fs-0); }
.book__done { background: var(--char); border-top: 2px solid var(--accent); padding: var(--s3); }

/* ---------- footer ---------- */
.foot { border-top: 1px solid var(--hair); padding: var(--s5) var(--gutter) var(--s4); background: var(--char); }
.foot__grid { width: min(100%, var(--wrap)); margin-inline: auto; display: grid; gap: var(--s3); grid-template-columns: 1fr; }
@media (min-width: 800px) { .foot__grid { grid-template-columns: 1.2fr 1fr 1fr 1.4fr; } }
.foot p { margin: 0 0 .3rem; }
.foot__name { font-family: var(--display); font-size: 1.4rem; font-weight: 600; margin-top: .6rem; }
.foot__place, .foot__fine { color: var(--mist); font-size: var(--fs-0); }
.foot ul { list-style: none; margin: 0; padding: 0; }
.foot li { margin-bottom: .3rem; }
.foot a { text-decoration: none; }
.foot a:hover { color: var(--flame); text-decoration: underline; }
.foot__fine { width: min(100%, var(--wrap)); margin: var(--s4) auto 0; }