/* ============================================================
   Palimpsest · index.html
   Layout grammar for the homepage. Loads after the page's own
   styles and after palimpsest.css. The seven protected animation
   systems are restyled in place and never rebuilt.
   ============================================================ */

/* ── Ground, splash, chrome ── */
.pal-home .splash-left, .pal-home .splash-right { background-image: none; }
/* The opening: the same type as the page it opens onto. Timings untouched. */
.pal-home .splash::before { background: var(--oxide); width: 2px; }
.pal-home .splash-brand { font-family: var(--serif); font-weight: 400; font-style: normal; font-size: clamp(3.4rem, 8vw, 6.4rem); letter-spacing: -0.01em; line-height: 1.1; color: var(--vellum); }
.pal-home .splash-sub { margin-top: 0.9rem; gap: 14px; }
.pal-home .splash-sub-rule { background: var(--reveal); width: 34px; }
.pal-home .splash-sub-text { font-family: var(--mono); font-size: clamp(0.72rem, 1.3vw, 0.84rem); letter-spacing: 0.34em; color: var(--reveal-lit); }
.pal-home .splash-tagline { font-family: var(--serif); font-size: clamp(1.25rem, 2.4vw, 1.75rem); color: var(--vellum-dim); margin-top: 1.3rem; }
.pal-home .splash-rule { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='10'%3E%3Ccircle cx='5' cy='5' r='2' fill='%237FA79E' opacity='0.7'/%3E%3Ccircle cx='25' cy='5' r='2' fill='%237FA79E' opacity='0.7'/%3E%3Ccircle cx='45' cy='5' r='2' fill='%237FA79E' opacity='0.7'/%3E%3C/svg%3E"); margin-top: 1.4rem; }
.pal-home .splash-content::before, .pal-home .splash-content::after { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(9rem, 22vw, 16rem); color: var(--reveal); filter: blur(1.5px); }
.pal-home .splash-content::before { top: -5rem; transform: translateX(-50%) translateX(-7rem) rotate(-4deg); }
.pal-home .splash-content::after { bottom: -5.5rem; transform: translateX(-50%) translateX(7rem) rotate(3deg); }
.pal-home .scroll-progress { background: var(--oxide); height: 2px; }
.pal-home .hero::before, .pal-home .recognition::after, .pal-home .blueprint::before,
.pal-home .blueprint::after, .pal-home .about::after, .pal-home .invitation::before,
.pal-home .invitation::after, .pal-home .proof::before, .pal-home .proof::after { content: none; }

/* Motion: one speed for every reveal */
.js.pal-home .reveal, .pal-home.js .reveal, .js .pal-home .reveal { transform: translateY(8px); transition: opacity 0.9s ease, transform 0.9s ease; }
.pal-home .reveal-d1, .pal-home .reveal-d2, .pal-home .reveal-d3, .pal-home .reveal-d4, .pal-home .reveal-d5, .pal-home .reveal-d8 { transition-delay: 0.08s; }

/* ── 1. Hero: recto spread ── */
.pal-home .hero {
    background: none;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 46rem) 15rem minmax(0, 1fr);
    align-items: start;
    justify-items: start;
    text-align: left;
    padding: 8.5rem 0 4rem;
}
.pal-home .hero::after {
    content: 'The conversation is where your book begins.';
    position: relative;
    top: auto; right: auto; bottom: auto; left: auto;
    grid-column: 3;
    justify-self: start;
    font-family: var(--serif);
    font-style: italic;
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 1.4;
    color: var(--reveal-lit);
    opacity: 1;
    align-self: end;
    padding: 0 0 4.2rem 3.8rem;
    max-width: 15rem;
    pointer-events: none;
}
.pal-home .hero-content { grid-column: 2; max-width: none; width: 100%; margin-left: 0; margin-right: 0; }
.pal-home .hero h1 { text-align: left; font-weight: 400; }
/* The first line ("You will never find the time") holds together at every width so "never" always has
   words either side of it when it spins and grows. The size is set from the leaf's own width:
   the line measures 10.5em in EB Garamond, so 9.3% of the container width per 1em fits with a little air. */
@supports (font-size: 1cqi) {
    .pal-home .hero-content { container-type: inline-size; }
    .pal-home .hero h1 { white-space: nowrap; font-size: min(4rem, 9.3cqi); }
}
.pal-home .hero .hero-content > p, .pal-home .hero .hero-content > div {
    margin-left: 0 !important; margin-right: 0 !important; align-items: flex-start !important; text-align: left;
}
.pal-home .hero-follow { color: var(--oxide); }
.pal-home .scroll-indicator { left: auto; right: 3rem; bottom: 1rem; transform: none; }

/* ── Video introduction: verso spread ── */
.pal-home .vi-section { border: none; padding: 1rem 0 4rem; }
.pal-home .vi-inner { grid-template-columns: minmax(0, 17rem) minmax(0, 46rem); justify-content: end; gap: 2.4rem; align-items: start; }
.pal-home .vi-embed-wrap, .pal-home .vi-embed-wrap video { border-radius: 0; }
.pal-home .vi-content { margin-top: -2.4rem; gap: 1.4rem; }
.pal-home .vi-quote { color: var(--vellum); border-left-color: var(--oxide); }
.pal-home .vi-points p::before { background: var(--reveal-lit); }

/* ── 2. Recognition: verso spread, the pull quote breaks out ── */
.pal-home .recognition { padding: 0 0 4rem; overflow: visible; }
.pal-home .recognition .container { margin-top: 0; }
.pal-home .recognition .pull-quote {
    background: var(--ink-deep);
    border-left: 3px solid var(--oxide);
    padding: 2rem 2.4rem;
    margin: 2.4rem 0 2.4rem -7rem;
    max-width: 36rem;
}

/* ── 3. The shift: the deepest well on the page ── */
.pal-home .shift.section-deep {
    background: var(--ink-deep);
    border-left: 3px solid var(--oxide);
    text-align: left;
    padding: 6rem 0;
}
.pal-home .shift.section-deep .container { text-align: left; max-width: 46rem; margin-left: max(2rem, 9vw); padding-left: 3.2rem; }
.pal-home .shift p { margin-left: 0; margin-right: 0; color: var(--vellum-dim); }
.pal-home .shift .accent-text { color: var(--oxide); }

/* ── Stats: a row of apparatus (counter animation untouched) ── */
.pal-home .stats-strip { border-color: var(--reveal-deep); text-align: left; padding: 2rem 0; }
.pal-home .stats-grid { grid-template-columns: repeat(3, max-content); gap: 5rem; margin: 0 0 0 max(0px, calc(9vw - 2rem)); max-width: none; }
.pal-home .stat { text-align: left; }
.pal-home .stat-number { font-style: normal; color: var(--oxide); font-size: clamp(2.2rem, 4vw, 3rem); margin-bottom: 0.2rem; }
.pal-home .stat-label { color: var(--vellum-dim); font-size: var(--t-2); letter-spacing: 0.08em; }

/* ── 4. The Blueprint: recto spread ── */
.pal-home .blueprint { background: transparent; padding: 5rem 0; overflow: visible; }
.pal-home .blueprint-header { margin-bottom: 3rem; }
.pal-home .blueprint-header .accent-rule { margin: 1.6rem 0; }
/* The title holds one line on every phone, stretch included: the letter-spread is scaled to the width */
.pal-home #blueprintTitle { white-space: nowrap; }
@media (max-width: 760px) {
    .pal-home #blueprintTitle { font-size: clamp(1.25rem, 6.2vw, 1.8rem); }
    .pal-home #blueprintTitle.bp-stretch .bp-letter,
    .pal-home #blueprintTitle.bp-stretch .bp-space { margin-right: 0.1em; }
}
.pal-home .blueprint-body {
    display: block;
    margin-top: -2rem;
    background: var(--ink-raised);
    border-left: 2px solid var(--reveal-deep);
    padding: 3rem 3.2rem 3.2rem;
    position: relative;
}
.pal-home .blueprint-description { margin: 0 0 3.5rem 3rem; max-width: 43rem; }
.pal-home .anatomy { margin-top: 0; }
.pal-home .anatomy-intro { text-align: left; margin: 0 0 2rem; max-width: 46rem; }
.pal-home .anatomy-intro hr.accent-rule { margin: 1.2rem 0 1rem; background-position: left center; }
.pal-home .anatomy-doc { background: var(--ink-raised); border: 1px solid var(--reveal-deep); border-radius: 0; }
.pal-home .anatomy-detail { background: var(--ink-deep); border-radius: 0; border-left: 2px solid var(--reveal-deep); }
.pal-home .anatomy-toc-item { border-radius: 0; }
.pal-home .anatomy-toc-num { font-family: var(--mono); font-style: normal; font-size: var(--t-1); }
.pal-home .anatomy-doc-head { border-bottom-color: var(--reveal-deep); }
.pal-home .anatomy-detail-rule { border-color: var(--reveal-deep); }
.pal-home .partnership-collapsible { background: transparent !important; padding: 0 !important; border-radius: 0 !important; margin-top: 1.4rem !important; }
.pal-home .bp-preview { border: 1px solid var(--reveal-deep); }
.pal-home .bp-preview-header { padding: 2rem 2.5rem 1.6rem; }
.pal-home .partnership-collapsible > div > .bp-preview:nth-child(2) { margin-top: 3rem; }
.pal-home #example-blueprints { border-top-color: var(--reveal-deep) !important; font-size: 1.5rem !important; }
.pal-home .blueprint-standalone {
    background: var(--ink-raised);
    border: none;
    border-left: 2px solid var(--rubric);
    padding: 2.4rem 3rem;
    max-width: 46rem;
    margin-left: 4rem;
}

/* ── 5. Proof: three beats, each indented one step further ── */
.pal-home .proof { background: transparent; text-align: left; padding: 5rem 0; }
.pal-home .proof .container { text-align: left; }
.pal-home .proof .container > .reveal:first-child {
    position: relative;
    background: var(--ink-raised);
    border-left: 2px solid var(--rubric);
    padding: 3rem 3.2rem 0;
    max-width: 46rem;
}
.pal-home .proof .container > .reveal:first-child::before {
    content: 'i';
    display: block;
    font-family: var(--mono);
    font-size: var(--t-1);
    letter-spacing: 0.16em;
    color: var(--reveal-lit);
    margin-bottom: 1.2rem;
}
.pal-home .proof .label { border: none; padding: 0; margin-bottom: 1rem !important; }
.pal-home .proof .heading-md { margin-left: 0 !important; margin-right: 0 !important; color: var(--vellum); }
.pal-home .testimonial-quote {
    margin: 0;
    max-width: 40rem;
    color: var(--vellum);
    background: var(--ink-deep);
    padding: 2.4rem 2.6rem;
    border-left: 2px solid var(--reveal-deep);
}
.pal-home .testimonial-quote::before, .js .pal-home .testimonial-quote::before, .pal-home.js .testimonial-quote::before {
    content: 'ii';
    font-family: var(--mono);
    font-size: var(--t-1);
    letter-spacing: 0.16em;
    font-style: normal;
    color: var(--reveal-lit);
    opacity: 1;
    transform: none;
    margin-bottom: 1rem;
}
.pal-home .proof .container > .reveal:first-child .testimonial-quote { margin: 1.6rem -6rem 0 3rem; position: relative; }
/* The attribution is the foot of the same leaf as the quote: same ground, same rule, no gap,
   a short oxide signature line tying the words to the name. */
.pal-home .testimonial-attribution {
    margin: 0 0 0 calc(6.2rem + 2px);
    max-width: 40rem;
    background: var(--ink-deep);
    border-left: 2px solid var(--reveal-deep);
    padding: 0 2.6rem 2.2rem;
    text-align: left;
}
.pal-home .testimonial-attribution::before {
    content: '';
    display: block;
    width: 2.6rem;
    height: 1px;
    background: var(--oxide);
    margin-bottom: 1.1rem;
}
.pal-home .proof .container > div[style*="width: 48px"] { display: none; }
.pal-home .proof .container > .reveal.reveal-d1:not(.testimonial-attribution) { margin: 3rem 0 0 9rem; }
.pal-home .proof .container > .reveal.reveal-d1 .testimonial-quote::before { content: 'iii'; }
.pal-home .proof .container > .reveal.reveal-d1 + .testimonial-attribution { margin-left: 9rem; }
.pal-home .testimonial-name { color: var(--vellum); font-style: italic; margin-bottom: 0.3rem; }
.pal-home .testimonial-credentials { color: var(--vellum-dim); font-family: var(--mono); font-size: var(--t-1); letter-spacing: 0.06em; }

/* ── 6. About: verso spread, the statement pulled out ── */
.pal-home .about { border-top: none; overflow: visible; padding: 4rem 0; }
.pal-home .about .container { max-width: 52rem; }
.pal-home .about-intro { grid-template-columns: minmax(150px, 190px) 1fr; gap: 2.4rem; }
.pal-home .about-portrait { border-radius: 0; }
.pal-home .about .pull-quote {
    border: 1px solid var(--reveal);
    border-left: 3px solid var(--oxide);
    background: var(--ink-deep);
    padding: 2rem 2.4rem;
    margin: 2.4rem 0 2.4rem -6rem !important;
    max-width: 36rem;
}
.pal-home .about a[style*="background: var(--accent)"] { font-size: var(--t-1) !important; padding: 0.55rem 1rem !important; }

/* ── Transition line (deal-word animation untouched) ── */
.pal-home .shift:not(.section-deep) { background: transparent; text-align: left; }
.pal-home .shift:not(.section-deep) .container { text-align: left; }
.pal-home #shiftHeadline2, .pal-home #shiftPunchline2 { margin-left: 0 !important; }
.pal-home #shiftPunchline2 { color: var(--oxide); }

/* ── Trust: one hairline row of apparatus ── */
.pal-home .trust-strip { background: transparent; border-top: 1px solid var(--reveal-deep); border-bottom: 1px solid var(--reveal-deep); padding: 2.4rem 0; }
.pal-home .trust-strip .container { display: grid; grid-template-columns: 15rem 1fr; gap: 3rem; align-items: start; }
.pal-home .trust-strip .heading-md { font-size: 1.15rem; color: var(--vellum-dim); }
.pal-home .trust-grid { margin-top: 0; gap: 2rem; }
.pal-home .trust-marker { display: none; }
.pal-home .trust-item h4 { font-family: var(--mono); font-size: var(--t-1); letter-spacing: 0.14em; text-transform: uppercase; color: var(--reveal-lit); font-weight: 400; }
.pal-home .trust-item p { font-size: var(--t-3); color: var(--vellum-dim); }

/* ── FAQ: five leaves, each one step further in, the fifth carries the oxide rule ── */
.pal-home #faq { border-top: none !important; padding: 4rem 0 5rem !important; }
.pal-home #faq .prose-wide { max-width: 50rem; margin-left: max(0px, calc(9vw - 2rem)); }
.pal-home .barrier {
    position: relative;
    background: var(--ink-raised);
    border-bottom: none;
    border-left: 2px solid var(--reveal-deep);
    padding: 1.5rem 2.2rem;
    margin-bottom: -0.5rem;
}
.pal-home .barrier.faq-open { padding-bottom: 1.8rem; margin-bottom: -0.5rem; }
.pal-home .barrier:last-child { margin-bottom: 0; padding-bottom: 1.5rem; }
.pal-home .barrier:last-child.faq-open { padding-bottom: 1.8rem; }
.pal-home .prose-wide > div:nth-of-type(2) { margin-left: 1.6rem; }
.pal-home .prose-wide > div:nth-of-type(3) { margin-left: 3.2rem; }
.pal-home .prose-wide > div:nth-of-type(4) { margin-left: 4.8rem; }
.pal-home .prose-wide > div:nth-of-type(5) { margin-left: 6.4rem; border-left-color: var(--oxide); }
.pal-home .barrier h3::after { font-family: var(--mono); color: var(--reveal-lit); }
.pal-home .barrier h3 { font-weight: 400; }

/* ── 7. Invitation: recto spread with the closing title ── */
.pal-home .invitation { background: transparent; overflow: visible; padding: 5rem 0 7rem; }
.pal-home .invitation .container > .reveal:first-child { text-align: left; margin-left: max(0px, calc(9vw - 2rem)); }
.pal-home #closingTitle { margin-left: 0 !important; margin-right: 0 !important; font-weight: 400; }
.pal-home .invitation-layout {
    grid-template-columns: minmax(0, 26rem) minmax(0, 36rem);
    gap: 2.5rem;
    align-items: start;
    justify-content: start;
    margin-left: max(0px, calc(9vw - 2rem));
}
.pal-home .invitation-text { margin: 2rem 0 0 0; padding: 2.6rem 2.8rem; }
.pal-home .invitation-text::after { content: none; }
.pal-home .invitation-text p { color: var(--vellum-dim); }
.pal-home .form-card { background: var(--ink-deep); border: 1px solid var(--reveal-deep); border-radius: 0; }
.pal-home .form-group label { font-family: var(--mono); font-size: var(--t-1); letter-spacing: 0.12em; text-transform: uppercase; color: var(--vellum-dim); }
.pal-home .form-group input, .pal-home .form-group select, .pal-home .form-group textarea { background: var(--ink); }

/* ── Responsive ── */
@media (max-width: 1100px) {
    .pal-home .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 46rem) minmax(0, 1fr); }
    .pal-home .hero::after { content: none; }
}
@media (max-width: 900px) {
    .pal-home .vi-inner { grid-template-columns: 1fr; justify-content: stretch; }
    .pal-home .vi-embed-wrap { max-width: 17rem; }
    .pal-home .vi-content { margin-top: 0; }
    .pal-home .invitation-layout { grid-template-columns: 1fr; }
    .pal-home .invitation-text { margin: 0 0 -1rem 0; }
    .pal-home .trust-strip .container { grid-template-columns: 1fr; gap: 1.5rem; }
    .pal-home .about-intro { grid-template-columns: 1fr; gap: 1.6rem; }
    .pal-home .about-portrait { max-width: 190px; }
}
/* Tablets: the same rule as phones, for the same reason. Added 6 September 2026 after Tommy
   found the top of the homepage empty on a 13-inch iPad Pro in portrait (1024px). The slide-in
   masthead is a desktop idea: on a touch screen the visitor is at the top of the page with no
   menu at all. Nothing else from the phone block comes with it. */
/* 6 September 2026: the two width-band exceptions below are kept for the border colour only.
   The bar itself no longer hides at any width: see the .nav rule in index.html. */
@media (max-width: 1080px) and (min-width: 761px) {
    .pal-home .nav { transform: none; border-bottom-color: var(--reveal-deep); }
}

@media (max-width: 760px) {
    /* Phones: the navigation stays on screen from the first frame. On desktop it slides in once the
       opening leaf has scrolled past, but on a phone that left a bare band above the leaf. */
    .pal-home .nav { transform: none; border-bottom-color: var(--reveal-deep); }
    .pal-home .hero { grid-template-columns: 1fr; padding: 5.4rem 0 3rem; }
    .pal-home .hero-content { grid-column: 1; padding-left: 1.1rem; padding-right: 1.1rem; }
    .js .pal-home .hero-sL.hero-shift-out { transform: translateX(-20px) !important; }
    .js .pal-home .hero-sR.hero-shift-out { transform: translateX(20px) !important; }
    .pal-home .scroll-indicator { display: none; }
    .pal-home .recognition .pull-quote { margin-left: -1.4rem; margin-right: -1.4rem; padding: 1.6rem 1.4rem; }
    .pal-home .shift.section-deep .container { margin-left: 0; padding-left: 1.5rem; }
    .pal-home .stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; margin-left: 0; }
    .pal-home .stat-label { white-space: normal; }
    .pal-home .blueprint-description { margin-left: 0; }
    .pal-home .blueprint-body { padding: 1.8rem 1.2rem; margin-top: -1rem; }
    .pal-home .blueprint-standalone { margin-left: 1rem; padding: 1.8rem 1.4rem; }
    .pal-home .proof .container > .reveal:first-child { padding: 2rem 1.4rem 0; }
    .pal-home .proof .container > .reveal:first-child .testimonial-quote { margin: 1.2rem -1.4rem 0 1rem; }
    .pal-home .testimonial-quote { padding: 1.6rem 1.4rem; }
    .pal-home .testimonial-attribution { margin-left: calc(2.4rem + 2px); padding: 0 1.4rem 1.8rem; }
    .pal-home .proof .container > .reveal.reveal-d1:not(.testimonial-attribution) { margin-left: 2rem; }
    .pal-home .proof .container > .reveal.reveal-d1 + .testimonial-attribution { margin-left: 2rem; }
    .pal-home .about .pull-quote { margin-left: -1.4rem !important; margin-right: -1.4rem; padding: 1.6rem 1.4rem; }
    .pal-home #faq .prose-wide { margin-left: 0; }
    .pal-home .barrier { padding: 1.2rem 1.2rem; }
    .pal-home .prose-wide > div:nth-of-type(2) { margin-left: 0.6rem; }
    .pal-home .prose-wide > div:nth-of-type(3) { margin-left: 1.2rem; }
    .pal-home .prose-wide > div:nth-of-type(4) { margin-left: 1.8rem; }
    .pal-home .prose-wide > div:nth-of-type(5) { margin-left: 2.4rem; }
    .pal-home .invitation .container > .reveal:first-child, .pal-home .invitation-layout { margin-left: 0; }
}

/* ── 8. Read: the nine guides as a rank of small leaves (7 September 2026) ──
   Two motions, and no third. The rank writes itself in once, a ninth of a
   second apart, using the site's own reveal easing. Then, one leaf at a time
   and never two together, a leaf lifts and swells while a bright rubric light
   crosses it, its left edge strikes, its folio turns rubric and its title
   brightens. Cycle 12.6s, 1.4s apart, so the rank is never still for long.
   No shadow anywhere: the depth is the lift, the raised ground and the
   hairline. Strengthened 7 September 2026 at Tommy's direction. */
.pal-home .readroom { background: transparent; padding: 0 0 6rem; }
.pal-home .readroom .container { text-align: left; }
.pal-home .readroom-label {
    display: block;
    font-family: var(--mono);
    font-size: var(--t-1);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--reveal-lit);
    margin: 0 0 1.4rem max(0px, calc(9vw - 2rem));
}
.pal-home .read-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
    max-width: 62rem;
    margin-left: max(0px, calc(9vw - 2rem));
}
.js.pal-home .read-leaf.reveal, .pal-home.js .read-leaf.reveal, .js .pal-home .read-leaf.reveal {
    transition-delay: calc(var(--i) * 0.09s);
}
.pal-home .rl-inner {
    display: block;
    position: relative;
    z-index: 0;
    overflow: hidden;
    will-change: transform;
    height: 100%;
    background: var(--ink-raised);
    border: 1px solid var(--reveal-deep);
    border-left: 2px solid var(--reveal-deep);
    border-radius: 0;
    padding: 1.3rem 1.5rem 1.4rem;
    text-decoration: none;
    transform: scale(1);
    transition: background 0.3s ease, border-left-color 0.3s ease;
}
.pal-home .rl-folio {
    display: block;
    font-family: var(--mono);
    font-size: var(--t-1);
    letter-spacing: 0.16em;
    color: var(--reveal-lit);
    margin-bottom: 0.65rem;
}
.pal-home .rl-title {
    display: block;
    font-family: var(--serif);
    font-size: var(--t-5);
    line-height: 1.3;
    color: var(--vellum-dim);
    transition: color 0.3s ease;
}
.pal-home .rl-inner:hover { background: var(--ink-deep); border-left-color: var(--rubric); }
.pal-home .rl-inner:hover .rl-title { color: var(--vellum); }
.pal-home .rl-inner::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(105deg, transparent 26%, rgba(201, 129, 79, 0.10) 40%, rgba(230, 170, 116, 0.52) 50%, rgba(201, 129, 79, 0.10) 60%, transparent 74%);
    transform: translateX(-140%);
}
/* The rubric bar that runs up the left edge as the light crosses. */
.pal-home .rl-inner::before {
    content: "";
    position: absolute;
    left: -2px; top: 0; bottom: 0;
    width: 2px;
    pointer-events: none;
    background: var(--rubric);
    transform: scaleY(0);
    transform-origin: 50% 100%;
}
.pal-home .read-grid.rr-live .rl-inner {
    animation: rlSwell 12.6s cubic-bezier(0.22, 0.61, 0.36, 1) infinite;
    animation-delay: calc(var(--i) * 1.4s);
}
.pal-home .read-grid.rr-live .rl-inner::after {
    animation: rlSheen 12.6s linear infinite;
    animation-delay: calc(var(--i) * 1.4s);
}
.pal-home .read-grid.rr-live .rl-inner::before {
    animation: rlEdge 12.6s ease-in-out infinite;
    animation-delay: calc(var(--i) * 1.4s);
}
.pal-home .read-grid.rr-live .rl-title {
    animation: rlLit 12.6s ease-in-out infinite;
    animation-delay: calc(var(--i) * 1.4s);
}
.pal-home .read-grid.rr-live .rl-folio {
    animation: rlFolio 12.6s ease-in-out infinite;
    animation-delay: calc(var(--i) * 1.4s);
}
@keyframes rlSwell {
    0%   { transform: translateY(0) scale(1); }
    4%   { transform: translateY(-9px) scale(1.055); }
    8%   { transform: translateY(-9px) scale(1.055); }
    16%  { transform: translateY(0) scale(1); }
    100% { transform: translateY(0) scale(1); }
}
@keyframes rlSheen {
    0%   { transform: translateX(-140%); }
    14%  { transform: translateX(140%); }
    100% { transform: translateX(140%); }
}
@keyframes rlEdge {
    0%   { transform: scaleY(0); }
    4%   { transform: scaleY(1); }
    11%  { transform: scaleY(1); }
    16%  { transform: scaleY(0); }
    100% { transform: scaleY(0); }
}
@keyframes rlLit {
    0%   { color: var(--vellum-dim); }
    4%   { color: var(--vellum); }
    11%  { color: var(--vellum); }
    16%  { color: var(--vellum-dim); }
    100% { color: var(--vellum-dim); }
}
@keyframes rlFolio {
    0%   { color: var(--reveal-lit); }
    4%   { color: var(--rubric); }
    11%  { color: var(--rubric); }
    16%  { color: var(--reveal-lit); }
    100% { color: var(--reveal-lit); }
}
@media (max-width: 900px) {
    .pal-home .read-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    /* One column, and the folio sits on the same line as the title so nine
       leaves do not become a nine-screen scroll. */
    .pal-home .read-grid { grid-template-columns: 1fr; margin-left: 0; gap: 0.5rem; }
    .pal-home .readroom-label { margin-left: 0; }
    .pal-home .readroom { padding-bottom: 4rem; }
    .pal-home .rl-inner { padding: 0.95rem 1.1rem 1rem; }
    .pal-home .rl-folio { display: inline; margin: 0 0.7rem 0 0; vertical-align: 0.12em; }
    .pal-home .rl-title { display: inline; }
    /* Full-width leaves: lift, but do not swell past the screen edge. */
    .pal-home .read-grid.rr-live .rl-inner { animation-name: rlSwellSm; }
}
@keyframes rlSwellSm {
    0%   { transform: translateY(0) scale(1); }
    4%   { transform: translateY(-7px) scale(1.012); }
    8%   { transform: translateY(-7px) scale(1.012); }
    16%  { transform: translateY(0) scale(1); }
    100% { transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .pal-home .read-grid.rr-live .rl-inner,
    .pal-home .read-grid.rr-live .rl-inner::before,
    .pal-home .read-grid.rr-live .rl-inner::after,
    .pal-home .read-grid.rr-live .rl-title,
    .pal-home .read-grid.rr-live .rl-folio { animation: none; }
}