:root {
    --dv-background: #f7f2e7;
    --dv-text: #13231b;
    --dv-muted: #35432f;
    --dv-forest: #16251b;
    --dv-light: #fff8e9;
    --dv-font-body: Georgia, "Times New Roman", serif;
    --dv-font-display: Georgia, "Times New Roman", serif;
    --dv-header-height: 88px;
    --dv-viewport-height: 100vh;
    --dv-scene-overlap: 110px;
    --dv-copy-edge: 13.8%;
    --dv-fade-depth: clamp(7rem, 14vw, 15rem);
    --bs-body-font-family: var(--dv-font-body);
    --bs-body-color: var(--dv-text);
    --bs-body-bg: var(--dv-background);
}

@supports (height: 100dvh) {
    :root { --dv-viewport-height: 100dvh; }
}
/* A stable minimum while mobile browser controls expand or collapse. */
@media (hover: none) and (pointer: coarse) {
    @supports (height: 100svh) {
        :root { --dv-viewport-height: 100svh; }
    }
}

* { box-sizing: border-box; }
body {
    min-width: 0;
    min-height: 100vh;
    margin: 0;
    background: var(--dv-background);
    color: var(--dv-text);
    font-family: var(--dv-font-body);
    -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-underline-offset: .25em; }
a:hover { color: inherit; }
a:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; border-radius: 2px; }
main:focus, section[tabindex="-1"]:focus { outline: none; }
img { display: block; max-width: 100%; height: auto; }
.site-header {
    position: relative;
    z-index: 5;
    min-height: var(--dv-header-height);
    color: var(--dv-light);
    background: linear-gradient(rgb(22 37 27 / .94), rgb(22 37 27 / .72));
}
.site-header::after {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 100% 0 auto;
    height: 3rem;
    background: linear-gradient(rgb(22 37 27 / .72), transparent);
    pointer-events: none;
}
.header-inner {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: var(--dv-header-height);
    width: auto;
    margin-inline: var(--dv-copy-edge);
    flex-wrap: wrap;
}
.site-name {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--dv-light);
    font-size: clamp(1.35rem, 2vw, 2rem);
    letter-spacing: .17em;
    text-transform: uppercase;
    text-decoration: none;
}
.project-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding-inline: .25rem;
    color: var(--dv-light);
    font-size: 1.2rem;
    text-decoration-thickness: 1px;
}
.header-inner a { text-shadow: 0 1px 2px #0b160d, 0 1px 5px #0b160d, 0 0 14px #0b160d; }
.header-inner a:focus-visible {
    background: var(--dv-forest);
    box-shadow: 0 0 0 8px var(--dv-forest);
}
.skip-link {
    position: absolute;
    min-height: 44px;
    top: .6rem;
    left: 1rem;
    z-index: 10;
    max-width: calc(100% - 2rem);
    padding: .6rem 1rem;
    background: var(--dv-light);
    color: var(--dv-forest);
    transform: translateY(-180%);
}
.skip-link:focus { transform: translateY(0); color: var(--dv-forest); }
.header-art {
    position: absolute;
    z-index: 1;
    inset: 0 0 auto;
    height: max(10rem, 26vw);
    overflow: clip;
    pointer-events: none;
}
.oak-top { display: block; position: absolute; width: 100%; top: -11vw; }
.oak-top img { width: 100%; }
.book-hero { position: relative; isolation: isolate; }
.hero-copy { position: relative; z-index: 2; min-width: 0; }
.book-cycle {
    margin: 0 0 1.2rem;
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .29em;
    text-transform: uppercase;
    line-height: 1.6;
}
h1 {
    max-width: 100%;
    margin: 0 0 1.4rem;
    font-size: clamp(3.75rem, 5.6vw, 6.5rem);
    font-weight: 400;
    letter-spacing: -.045em;
    line-height: .99;
    overflow-wrap: break-word;
    text-wrap: balance;
}
.book-description { margin: 0; font-size: clamp(1.2rem, 1.53vw, 1.5rem); line-height: 1.4; }
.hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    min-height: 0;
    margin-top: 18px;
}
.book-meta { margin: 18px 0 0; color: var(--dv-muted); font-size: 1rem; line-height: 1.5; }
.hero-art { pointer-events: none; overflow-x: clip; overflow-y: visible; clip-path: inset(0 0 -14vw); }
.hero-scene, .hero-scene img { display: block; width: 100%; height: 100%; }
.hero-scene img { object-fit: cover; }
.oak-side, .oak-bottom, .transition-mist { position: absolute; display: block; }
/* Transparent side groups stay decorative and can be cropped at each edge. */
.oak-side {
    aspect-ratio: 2 / 3;
    background-size: contain;
    background-repeat: no-repeat;
    mask-image: linear-gradient(#000 78%, transparent);
}
.oak-left {
    background-image: url("../images/home/oak-side-left.png");
    background-image: image-set(url("../images/home/oak-side-left.webp") type("image/webp"), url("../images/home/oak-side-left.png") type("image/png"));
}
.oak-right {
    background-image: url("../images/home/oak-side-right.png");
    background-image: image-set(url("../images/home/oak-side-right.webp") type("image/webp"), url("../images/home/oak-side-right.png") type("image/png"));
}
.oak-bottom img, .transition-mist img { width: 100%; }
.scene-fade {
    position: absolute;
    inset: auto 0 0;
    z-index: 3;
    height: max(var(--dv-fade-depth), calc(var(--dv-scene-overlap) + 4rem));
    mask-image: linear-gradient(transparent, #000 28%);
    background: radial-gradient(ellipse 64% 100% at 23% 0%, rgb(247 242 231 / .92),
        rgb(247 242 231 / .65) 38%, transparent 85%), linear-gradient(transparent, #172421);
}
.oak-bottom {
    z-index: 4;
    inset: auto 0 -29vw;
    width: 100%;
    mask-image: linear-gradient(#000 15%, #0008 42%, transparent 70%);
}
.transition-mist {
    z-index: 5;
    width: 100%;
    left: 0;
    bottom: -24vw;
    opacity: .46;
    mask-image: linear-gradient(transparent 15%, #000 40%, #0008 62%, transparent 80%);
}
.site-footer { min-height: 1rem; background: #101b19; }

@media (min-width: 992px) {
    .book-hero {
        /* Header stays in flow; reserve the following scene's overlap only once. */
        min-height: max(calc(56.28vw - var(--dv-header-height)),
            calc(var(--dv-viewport-height) - var(--dv-header-height) + var(--dv-scene-overlap)));
        padding-block: clamp(7rem, 8.5vw, 15rem) clamp(5rem, 7vw, 8rem);
    }
    .hero-copy { width: min(39vw, 36rem); margin-left: var(--dv-copy-edge); }
    .hero-art { position: absolute; z-index: -1; inset: calc(-1 * var(--dv-header-height)) 0 0; }
    .hero-scene img { object-position: right center; }
    .hero-text-wash {
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse 56% 78% at 21% 48%,
            rgb(250 244 230 / .96) 0%, rgb(250 244 230 / .88) 34%,
            rgb(250 244 230 / .58) 58%, transparent 83%);
    }
    .oak-left { width: 35%; top: -2rem; left: -3%; }
    .oak-right { width: 33%; top: 0; right: -9%; }
}

/* Narrow layouts keep the copy inside the landscape, independently of Bootstrap. */
@media (max-width: 991.98px), (min-width: 992px) and (max-aspect-ratio: 1 / 1) {
    :root { --dv-header-height: 76px; --dv-fade-depth: clamp(5rem, 14vw, 8rem); }
    :root { --dv-copy-edge: 8%; }
    .header-art { height: 18rem; }
    .oak-top { width: 112%; left: -6%; top: -10vw; }
    .book-hero {
        min-height: max(43rem,
            calc(var(--dv-viewport-height) - var(--dv-header-height) + var(--dv-scene-overlap)));
        padding: 5rem 0 15rem;
    }
    .hero-copy { width: 43%; margin-left: var(--dv-copy-edge); }
    h1 { font-size: clamp(2.75rem, 5.8vw, 3.5rem); line-height: 1.02; }
    .book-description { font-size: 1.16rem; line-height: 1.43; }
    .hero-actions { min-height: 0; gap: .65rem; margin-top: 1rem; }
    .hero-actions:empty { display: none; }
    .book-meta { margin-top: 1.2rem; font-size: .9rem; }
    .hero-art {
        position: absolute;
        z-index: -1;
        inset: calc(-1 * var(--dv-header-height)) 0 0;
        isolation: isolate;
    }
    /* Reuse the quiet left sky of the existing scene above the castle crop. */
    .hero-art::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image: url("../images/home/scene-wide-1440.jpg");
        background-image: image-set(url("../images/home/scene-wide-1440.webp") type("image/webp"), url("../images/home/scene-wide-1440.jpg") type("image/jpeg"));
        background-size: auto 150%;
        background-position: 30% top;
        background-repeat: no-repeat;
    }
    .hero-scene {
        position: absolute;
        width: 128%;
        height: auto;
        aspect-ratio: 1672 / 941;
        right: -5%;
        bottom: 0;
        mask-image: linear-gradient(transparent, #000 15%);
    }
    .hero-text-wash {
        position: absolute;
        inset: 0;
        background: radial-gradient(ellipse 57% 67% at 24% 35%,
            rgb(250 244 230 / .95), rgb(250 244 230 / .84) 38%,
            rgb(250 244 230 / .25) 75%, transparent);
    }
    .oak-left { width: 34%; left: -17%; top: 3rem; }
    .oak-right { width: 30%; right: -18%; top: 4rem; }
    .oak-bottom { bottom: -30vw; }
    .transition-mist { bottom: -26vw; opacity: .36; }
}

/* Tall tablets keep the whole fortress in a proportional lower scene.
   Extra sky is painted landscape, with the copy distributed through it. */
@media (min-width: 600px) and (max-aspect-ratio: 1 / 1) {
    .book-hero { padding-top: max(5rem, calc(var(--dv-viewport-height) / 5 - 8rem)); }
}

@media (max-width: 599.98px) {
    :root { --dv-header-height: 112px; --dv-copy-edge: 1.75rem; --dv-fade-depth: 5rem; --dv-scene-overlap: 90px; }
    @supports (height: 100svh) {
        :root { --dv-viewport-height: 100svh; }
    }
    .header-inner { flex-direction: column; align-items: stretch; gap: 0; padding-block: 6px; }
    .site-name { align-self: flex-start; }
    /* The existing sky extends under the transparent header. Shade it below the oak. */
    .site-header {
        /* Zero height normally; cover only extra rows when enlarged text wraps. */
        background: linear-gradient(var(--dv-forest) 50%, transparent) top /
            100% max(0px, calc(200% - 2 * var(--dv-header-height))) no-repeat;
    }
    .site-header::after { content: none; }
    .site-name { font-size: 1.12rem; letter-spacing: .1em; }
    .project-link { font-size: .95rem; }
    .header-art { height: 14rem; }
    .oak-top { width: 145%; max-width: none; left: -20%; top: -17vw; }
    .book-hero {
        min-height: max(calc(49rem - var(--dv-header-height)),
            calc(var(--dv-viewport-height) - var(--dv-header-height) + var(--dv-scene-overlap)));
        padding: 24px 0 250px;
    }
    .hero-copy { width: auto; margin-inline: var(--dv-copy-edge); }
    .book-cycle { font-size: .7rem; letter-spacing: .22em; margin-bottom: .7rem; }
    h1 { max-width: 9em; font-size: clamp(2.25rem, 10.8vw, 2.625rem); margin-bottom: .85rem; line-height: 1.02; }
    .book-description { font-size: 1.0625rem; line-height: 1.38; }
    .hero-actions { margin-top: .75rem; }
    .book-meta { margin-top: .9rem; font-size: .78rem; }
    .hero-art::before {
        background-image: url('../images/home/scene-wide-768.jpg');
        background-image: image-set(url('../images/home/scene-wide-768.webp') type('image/webp'), url('../images/home/scene-wide-768.jpg') type('image/jpeg'));
        background-position: 30% top;
    }
    .oak-left {
        background-image: url('../images/home/oak-side-left-256.png');
        background-image: image-set(url('../images/home/oak-side-left-256.webp') type('image/webp'), url('../images/home/oak-side-left-256.png') type('image/png'));
    }
    .oak-right {
        background-image: url('../images/home/oak-side-right-192.png');
        background-image: image-set(url('../images/home/oak-side-right-192.webp') type('image/webp'), url('../images/home/oak-side-right-192.png') type('image/png'));
    }
    .hero-scene { width: 120%; right: -10%; aspect-ratio: 720 / 590; }
    .hero-text-wash {
        background:
            radial-gradient(ellipse 140% 11rem at 50% 0,
                rgb(22 37 27 / .94), rgb(22 37 27 / .86) 28%,
                rgb(22 37 27 / .55) 50%, rgb(22 37 27 / .12) 78%, transparent),
            radial-gradient(ellipse 90% 36% at 50% 31%,
                rgb(250 244 230 / .94), rgb(250 244 230 / .80) 38%,
                rgb(250 244 230 / .45) 65%, rgb(250 244 230 / .12) 83%, transparent);
    }
    .oak-left {
        width: 65%; left: -20%; top: -2rem;
        mask-image: linear-gradient(#000 55%, transparent 72%);
    }
    .oak-right {
        width: 45%; right: -20%; top: -.5rem;
        mask-image: linear-gradient(#000 78%, transparent);
    }
    .oak-bottom { width: 130%; left: -15%; bottom: -34vw; }
    .transition-mist { bottom: -23vw; opacity: .38; }
}

@media (max-width: 299.98px) {
    :root { --dv-copy-edge: 1rem; }
}

/* About: preserve a complete viewport between the entry and exit blends. */
.grove-study {
    --about-entry: 145px;
    --about-exit: 96px;
    scroll-margin-top: calc(-1 * var(--about-entry));
    z-index: 4;
    position: relative;
    isolation: isolate;
    overflow-x: clip;
    overflow-y: visible;
    margin-top: calc(-1 * var(--dv-scene-overlap));
    min-height: calc(var(--dv-viewport-height) + var(--about-entry) + var(--about-exit));
    padding: calc(var(--about-entry) + clamp(280px, 35svh, 410px)) 0 calc(var(--about-exit) + 90px);
    color: #f3efdf;
    text-align: left;
    background: transparent;
}
.grove-study::before {
    content: "";
    position: absolute;
    z-index: -4;
    inset: 0;
    background: linear-gradient(transparent,#101b19 90px);
    pointer-events: none;
}
.grove-art {
    position: absolute;
    z-index: -3;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    pointer-events: none;
}
.grove-art picture {
    display: block;
    width: 100%;
    height: 100%;
}
.grove-art img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 40%;
    max-width: none;
    mask-image: linear-gradient(transparent,#000 145px);
}
.grove-copy-zone {
    position: relative;
    isolation: isolate;
    width: min(870px,100%);
    margin: auto;
    padding: 34px 0 42px;
}
/* Proportional stone crop follows content height;
no tiling, blur, or painted text. */
.stone-ground {
    position: absolute;
    z-index: -1;
    inset: -28px -45px -130px;
    pointer-events: none;
    background: #101b19 url('../images/home/about/stone-990.jpg') center / cover no-repeat;
    background-image: image-set(url('../images/home/about/stone-990.webp') type('image/webp'), url('../images/home/about/stone-990.jpg') type('image/jpeg'));
    mask-image: radial-gradient(ellipse 50% 50% at 50% 50%,#000 60%,#000e 78%,transparent 100%);
}
.grove-copy {
    position: relative;
    width: min(650px,calc(100% - 56px));
    margin: auto;
}
.grove-copy::before {
    content: none;
}
.grove-study .about-eyebrow {
    font-size: 13px;
    line-height: 1.5;
    letter-spacing: .2em;
    text-transform: uppercase;
    text-align: center;
    color: #d8d2bb;
    margin: 0 0 10px;
}
.grove-study h2 {
    font-weight: 400;
    font-size: 48px;
    line-height: 1.12;
    letter-spacing: -.025em;
    text-align: center;
    margin: 0 0 22px;
    text-wrap: balance;
}
.grove-study h2::after {
    content: none;
}
.grove-study .about-description p {
    font-size: 21px;
    line-height: 1.5;
    margin: 0 0 18px;
    text-align: left;
}
.grove-study .about-description p:last-child {
    margin-bottom: 0;
}
@media(max-width:599.98px) {
    .scene-fade {
        background: linear-gradient(transparent,#172421);
    }
    .grove-study {
        --about-entry: 110px;
        --about-exit: 66px;
        padding: 300px 0 calc(var(--about-exit) + 62px);
    }
    .grove-art img {
        object-position: 61% top;
        mask-image: linear-gradient(transparent,#000 110px);
    }
        .grove-copy-zone {
        padding: 28px 0 32px;
    }
    .stone-ground {
        inset: -20px -48px -115px;
        background-position: 55% center;
        mask-image: radial-gradient(ellipse 50% 50% at 50% 50%,#000 65%,#000e 80%,transparent 100%);
    }
    .grove-copy {
        width: calc(100% - 60px);
    }
    .grove-study .about-eyebrow {
        font-size: 11px;
        letter-spacing: .18em;
        margin-bottom: 12px;
    }
    .grove-study h2 {
        font-size: 36px;
        margin-bottom: 23px;
    }
    .grove-study .about-description p {
        font-size: 18px;
        line-height: 1.5;
        margin-bottom: 18px;
    }
}

/* Show the pond/bridge as well as the oak on portrait tablets. */
@media (min-width: 600px) and (max-width: 991.98px) {
    /* A wider upper view reveals both landmarks. The same scene supplies
       the forest floor below it; its soft join stays behind the stone. */
    .grove-art {
        background: url('../images/home/about/grove-wide-1536.jpg') center bottom / cover no-repeat;
        background-image: image-set(url('../images/home/about/grove-wide-1536.webp') type('image/webp'), url('../images/home/about/grove-wide-1536.jpg') type('image/jpeg'));
        mask-image: linear-gradient(transparent, #000 145px);
    }
    .grove-art img {
        height: 72%;
        object-position: 20% top;
        mask-image: linear-gradient(#000 72%, transparent);
    }
}

/* Available destinations use links; unavailable actions retain disabled semantics. */
.site-nav { display: flex; align-items: center; gap: clamp(14px, 2vw, 28px); }
.site-nav a { text-decoration-line:underline; text-decoration-thickness:1px; text-underline-offset:.2em; }
.site-action {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 48px; padding: 10px 18px; border: 1px solid #52614a;
  border-radius: 3px; background: #f5eedec9; color: #263a2b;
  font: inherit; font-size: 18px; line-height: 1.3; text-align: center; text-decoration:none;
}
.site-action:disabled { opacity: 1; cursor: default; }
.site-action .soon {
  font-size: 12px; line-height: 1.3; letter-spacing: .02em;
  padding: 2px 5px; border: 1px solid currentColor; border-radius: 3px;
}
.site-action.primary { background: #223c2c; border-color: #223c2c; color: #fff8e9; }
.site-action.nav-coming {
  min-height: 44px; padding: 0 4px; background: transparent; border: 0;
  color: #fff8e9; font-size: 1.2rem; gap: 6px;
  text-shadow: 0 1px 2px #0b160d, 0 1px 5px #0b160d, 0 0 14px #0b160d;
}
.site-action.nav-coming .soon { background: #24382a; }
.about-actions { display: flex; justify-content: center; margin-top: 26px; }
.site-action.on-stone, .site-action.social {
  color: #f5efdf; border-color: #929781; background: #182b24;
}
.author-socials { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.site-action.social { font-size: 17px; min-height: 44px; padding: 9px 14px; }

.site-action { max-width: 100%; }
/* Keep the longer cycle label beside the reading button on desktop. */
@media (min-width: 992px) {
  .home-page .hero-actions {
    width: max-content;
    max-width: 80vw;
    flex-wrap: nowrap;
  }
}
.site-action .soon { flex-shrink: 0; }
.site-action .action-label { min-width: 0; overflow-wrap: anywhere; }
.site-name { gap: 12px; flex-wrap: wrap; max-width: 100%; }
@media (max-width: 599.98px) {
  .site-name { gap: 10px; }
  .site-nav { justify-content: space-between; flex-wrap: wrap; gap: 0 6px; }
  .site-nav .project-link, .site-action.nav-coming { font-size: 16px; }
  .site-action.nav-coming { padding-inline: 0; gap: 5px; }
  .site-nav .soon { font-size: 12px; padding-inline: 3px; }
  .hero-actions { display: grid; grid-template-columns: 1fr; gap: 8px; margin-top: 14px; }
  .book-meta { margin-top: 14px; }
  .site-action { font-size: 17px; min-height: 44px; padding: 9px 12px; }
  .about-actions { margin-top: 24px; }
  .author-socials { gap: 10px; }
  .site-action.social { font-size: 16px; padding: 9px 12px; gap: 8px; }
}
.author-study {
  position: relative; isolation: isolate; z-index: 5;
  min-height: var(--dv-viewport-height);
  margin-top: -64px; padding: 190px 0 120px;
  display: grid; align-items: center;
  color: #f5efdf; overflow-x: clip;
}
.author-study::before {
  content: ''; position: absolute; inset: 0; z-index: -3;
  background: linear-gradient(transparent, #101b19 64px);
  pointer-events: none;
}
.author-art { position: absolute; inset: 0; z-index: -2; pointer-events: none; }
.author-art img {
  width: 100%; height: 100%; max-width: none; object-fit: cover;
  object-position: 42% center;
  mask-image: linear-gradient(transparent, #000a 55px, #000 125px);
}
.author-shade {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse 44% 66% at 79% 60%, #0a171aed 20%, #0a171ad9 64%, transparent 100%);
}
.author-copy { width: min(510px, 38%); margin-left: 57%; }
.author-copy .author-eyebrow {
  color: #d8d2bb; font-size: 13px; line-height: 1.5;
  letter-spacing: .2em; text-transform: uppercase; margin: 0 0 14px;
}
.author-copy h2 {
  font-size: 52px; font-weight: 400; line-height: 1.12;
  letter-spacing: -.02em; margin: 0 0 26px;
}
.author-copy p { font-size: 21px; line-height: 1.5; margin: 0 0 22px; }
.author-copy .author-caption { font-size: 17px; line-height: 1.5; color: #d8d2bb; margin: 28px 0 0; }
@media (max-width: 991.98px), (min-width: 992px) and (max-aspect-ratio: 1 / 1) {
  .author-study::before { background: linear-gradient(transparent, #101b19 42px); }
  .author-study { display: block; margin-top: -42px; padding: 480px 0 52px; }
  .author-art { height: 520px; }
  .author-art img {
    object-position: 20% center;
    mask-image: linear-gradient(transparent, #000c 32px, #000 65px, #000 81%, transparent 100%);
  }
  .author-shade {
    top: 425px;
    background: linear-gradient(#101b19b8, #101b19df);
    mask-image: linear-gradient(transparent, #000 110px);
  }
  .author-copy { width: calc(100% - 48px); margin-inline: auto; }
  .author-copy .author-eyebrow { font-size: 12px; margin-bottom: 12px; }
  .author-copy h2 { font-size: 37px; margin-bottom: 24px; }
  .author-copy p { font-size: 18px; line-height: 1.5; margin-bottom: 20px; }
  .author-copy .author-caption { font-size: 16px; line-height: 1.5; margin-top: 24px; }
}
@media (min-width: 600px) and (max-width: 991.98px), (min-width: 992px) and (max-aspect-ratio: 1 / 1) {
  .author-study { padding-top: 530px; }
  .author-art { height: 570px; }
  .author-shade { top: 475px;  }
  .author-copy { width: min(650px, calc(100% - 80px)); }
  .author-copy h2 { font-size: 48px; }
  .author-copy p { font-size: 21px; }
  .author-copy .author-caption { font-size: 17px; }
}

.author-forest { display: none; }
@media (max-width: 991.98px), (min-width: 992px) and (max-aspect-ratio: 1 / 1) {
  .author-forest { display: block; position: absolute; inset: 425px 0 0; z-index: -2; pointer-events: none; mask-image: linear-gradient(transparent, #000 110px); }
  .author-forest img { width: 100%; height: 100%; object-fit: cover; object-position: right bottom; }
}
@media (min-width: 600px) and (max-width: 991.98px), (min-width: 992px) and (max-aspect-ratio: 1 / 1) { .author-forest { top: 475px; } }
@media (max-width: 599.98px) { .author-art img { object-position: center; } }

a.site-action:focus-visible { outline:3px solid #fff8e9; outline-offset:4px; box-shadow:0 0 0 5px #263a2b; }
a.site-action:hover { text-decoration:underline; text-underline-offset:.2em; }
