/* THE WAY - BLOM PRODUCTION STYLESHEET V2.1.3 */
:root {
    --pure-white: #FFFFFF; --warm-white: #F9F8F6; --forest-green: #0A2F1D;
    --restrained-gold: #C5A059; --black: #111111; --light-grey: #E5E5E5; --dark-grey: #666666;
}
body.the-way-body { margin: 0; padding: 0; font-family: 'Inter', sans-serif; color: var(--black); background-color: var(--pure-white); line-height: 1.65; -webkit-font-smoothing: antialiased; }
.the-way-wrap h1, .the-way-wrap h2, .the-way-wrap h3, .the-way-wrap .serif { font-family: 'Playfair Display', serif; font-weight: 600; margin-top: 0; }
.tw-header { position: sticky; top: 0; background-color: var(--pure-white); border-bottom: 1px solid var(--light-grey); z-index: 1000; display: flex; justify-content: space-between; align-items: center; padding: 20px 32px; flex-wrap: wrap; }
.tw-brand { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 18px; color: var(--forest-green); letter-spacing: 2px; text-decoration: none; cursor: pointer; }
.tw-menu-toggle { display: none; background: none; border: none; font-size: 24px; cursor: pointer; color: var(--forest-green); }
.tw-nav { display: flex; gap: 28px; align-items: center; }
.tw-nav a { text-decoration: none; font-size: 13px; font-weight: 600; color: var(--black); text-transform: uppercase; letter-spacing: 1px; cursor: pointer; transition: color 0.2s ease; }
.tw-nav a:hover { color: var(--forest-green); }
.tw-nav-cta { background-color: var(--forest-green); color: var(--pure-white) !important; padding: 10px 18px; }

@media (max-width: 768px) {
    .tw-menu-toggle { display: block; }
    .tw-nav { display: none; width: 100%; flex-direction: column; gap: 16px; padding-top: 20px; text-align: center; border-top: 1px solid var(--light-grey); margin-top: 15px; }
    .tw-nav.mobile-open { display: flex; }
}

.tw-view { display: none; }
.tw-view.active-view { display: block; }
.tw-container { max-width: 800px; margin: 0 auto; padding: 80px 24px; box-sizing: border-box; }
.tw-text-center { text-align: center; }

.tw-btn { display: inline-block; width: 100%; max-width: 320px; padding: 18px 24px; text-align: center; text-decoration: none; font-family: 'Inter', sans-serif; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: 1.5px; border: none; cursor: pointer; box-sizing: border-box; transition: all 0.3s ease; margin: 10px 0; }
.tw-btn-forest { background-color: var(--forest-green); color: var(--pure-white); }
.tw-btn-outline { background-color: transparent; border: 1px solid var(--forest-green); color: var(--forest-green); }

.tw-hero { padding: 120px 24px; text-align: center; background-color: var(--pure-white); }
.tw-hero-tagline { font-size: 11px; text-transform: uppercase; letter-spacing: 4px; color: var(--restrained-gold); margin-bottom: 20px; font-weight: 700; }
.tw-hero-title { font-size: 48px; color: var(--forest-green); margin-bottom: 15px; letter-spacing: 2px; }
.tw-hero-verse { font-size: 20px; font-style: italic; color: var(--black); margin-bottom: 30px; }
.tw-hero-desc { font-size: 16px; color: var(--dark-grey); max-width: 540px; margin: 0 auto 40px auto; line-height: 1.7; }

.tw-phases-grid { display: grid; grid-template-columns: 1fr; gap: 24px; margin-top: 40px; }
@media(min-width: 600px) { .tw-phases-grid { grid-template-columns: 1fr 1fr; } }
.tw-phase-card { background-color: var(--warm-white); border: 1px solid var(--light-grey); padding: 36px 28px; text-align: left; cursor: pointer; transition: border-color 0.3s ease; }
button.tw-phase-card { width: 100%; color: inherit; font: inherit; }
.tw-phase-card:hover { border-color: var(--forest-green); }
.tw-phase-num { font-size: 12px; color: var(--restrained-gold); font-weight: 700; letter-spacing: 2px; margin-bottom: 12px; text-transform: uppercase; }
.tw-phase-title { font-size: 22px; color: var(--forest-green); margin-bottom: 12px; }
.tw-phase-desc { font-size: 14px; color: var(--dark-grey); line-height: 1.6; }

.tw-lesson-list { list-style: none; padding: 0; margin-top: 40px; }
.tw-lesson-item { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--light-grey); background-color: var(--pure-white); }
.tw-lesson-item.clickable { cursor: pointer; }
.tw-lesson-item.clickable:hover { background-color: var(--warm-white); }
.tw-lesson-info h4 { margin: 0 0 4px 0; font-size: 16px; color: var(--forest-green); }
.tw-lesson-info span { font-size: 12px; color: var(--dark-grey); text-transform: uppercase; letter-spacing: 1px; }
.tw-badge-active { font-size: 11px; font-weight: 700; color: var(--pure-white); background-color: var(--forest-green); padding: 6px 12px; text-transform: uppercase; letter-spacing: 1px; }
.tw-badge-soon { font-size: 11px; font-weight: 600; color: var(--dark-grey); background-color: var(--light-grey); padding: 6px 12px; text-transform: uppercase; letter-spacing: 1px; }
.tw-badge-complete { font-size: 11px; font-weight: 700; color: var(--forest-green); background-color: var(--warm-white); border: 1px solid var(--forest-green); padding: 6px 12px; text-transform: uppercase; letter-spacing: 1px; }
.tw-badge-next { font-size: 11px; font-weight: 800; color: var(--forest-green); background-color: #f4ecd9; border: 1px solid var(--restrained-gold); padding: 6px 12px; text-transform: uppercase; letter-spacing: 1px; }

.tw-lesson-wrap { max-width: 600px; margin: 0 auto; }
.tw-lesson-section { padding: 90px 24px; box-sizing: border-box; }
.bg-white { background-color: var(--pure-white); }
.bg-warm { background-color: var(--warm-white); }
.bg-forest { background-color: var(--forest-green); color: var(--pure-white); }

.arrive-meta { font-size: 11px; text-transform: uppercase; letter-spacing: 3px; color: var(--dark-grey); margin-bottom: 24px; font-weight: 600; }
.arrive-title { font-size: 36px; color: var(--black); line-height: 1.2; margin-bottom: 30px; }
.arrive-scripture { font-size: 18px; color: var(--black); font-style: italic; margin-bottom: 15px; }
.arrive-ref { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 12px; color: var(--black); font-style: normal; }
.arrive-gold-line { width: 40px; height: 2px; background-color: var(--restrained-gold); margin: 20px auto 30px auto; }
.read-slowly { font-size: 10px; text-transform: uppercase; letter-spacing: 3px; color: var(--restrained-gold); margin-bottom: 40px; font-weight: 600; }
.encounter-scripture { font-size: 26px; line-height: 1.6; color: var(--black); }

.teaching-block { margin-bottom: 70px; }
.teaching-block:last-child { margin-bottom: 0; }
.teaching-title { font-size: 18px; letter-spacing: 1.5px; color: var(--forest-green); margin-bottom: 16px; }
.teaching-text { font-size: 16px; line-height: 1.75; margin-bottom: 20px; color: #222222; }
.teaching-scripture { font-size: 16px; font-style: italic; color: var(--black); padding-left: 20px; border-left: 1.5px solid var(--restrained-gold); margin-top: 20px; }
.teaching-scripture span { font-family: 'Inter', sans-serif; font-weight: 600; font-size: 11px; font-style: normal; color: var(--restrained-gold); display: block; margin-top: 8px; letter-spacing: 1px; }

.see-section-title { font-size: 11px; text-transform: uppercase; letter-spacing: 3px; color: var(--restrained-gold); font-weight: 700; margin-bottom: 8px; }
.see-section-subtitle { font-size: 13px; color: var(--dark-grey); margin-bottom: 24px; text-transform: uppercase; letter-spacing: 1px; }
.artwork-container { width: 100%; text-align: center; margin-bottom: 30px; }
.artwork-container img { max-width: 100%; height: auto; display: block; border-radius: 4px; }
.comic-panel-viewer { background-color: var(--warm-white); border: 1px solid var(--light-grey); padding: 24px; text-align: center; margin-top: 20px; }
.comic-panel-viewer img { max-width: 100%; height: auto; display: block; margin: 0 auto 16px auto; }

.media-section-wrap { border-top: 1px solid var(--light-grey); padding-top: 40px; margin-top: 40px; }
.audio-player-container { background-color: var(--warm-white); border: 1px solid var(--light-grey); padding: 20px; margin-bottom: 25px; text-align: left; }
.audio-player-container audio { width: 100%; margin-top: 10px; }
.video-responsive-wrap { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; background-color: #111; margin-bottom: 25px; }
.video-responsive-wrap iframe, .video-responsive-wrap video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

.reflection-subtitle { font-size: 13px; font-style: italic; margin-bottom: 30px; color: var(--dark-grey); }
.reflection-list { padding-left: 0; list-style: none; margin-bottom: 30px; text-align: left; }
.reflection-list li { font-size: 18px; font-family: 'Playfair Display', serif; margin-bottom: 24px; line-height: 1.5; position: relative; padding-left: 24px; }
.reflection-list li::before { content: "•"; color: var(--restrained-gold); position: absolute; left: 0; }
textarea.journal-input { width: 100%; height: 120px; border: 1px solid var(--light-grey); background-color: var(--pure-white); padding: 15px; font-family: 'Inter', sans-serif; font-size: 14px; color: var(--black); box-sizing: border-box; resize: vertical; margin-bottom: 12px; }

.response-threshold { margin-top: 60px; }
.response-content { display: none; margin-top: 30px; text-align: left; }
.response-content.active { display: block; }
.response-step { margin-bottom: 24px; font-size: 15px; line-height: 1.65; }
.response-step strong { color: var(--forest-green); display: block; margin-bottom: 4px; font-size: 12px; letter-spacing: 1.5px; }
.response-sincere { font-size: 14px; font-style: italic; color: var(--restrained-gold); text-align: center; margin: 40px 0; }

.confirmation-box { display: none; margin-top: 60px; padding-top: 50px; border-top: 1px solid var(--restrained-gold); text-align: center; }
.confirmation-box.active { display: block; }
.confirmation-heading { font-family: 'Playfair Display', serif; font-size: 24px; color: var(--forest-green); margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px; }
.confirmation-text { font-size: 16px; line-height: 1.7; margin-bottom: 35px; font-style: italic; color: #333333; }

.pray-instruction { font-size: 16px; margin-bottom: 25px; text-align: left; }
.pray-list { padding-left: 20px; margin-bottom: 80px; text-align: left; }
.pray-list li { font-size: 15px; margin-bottom: 18px; line-height: 1.65; }

.take-label { font-size: 10px; text-transform: uppercase; letter-spacing: 2px; color: var(--restrained-gold); margin-bottom: 15px; font-weight: 700; }
.take-scripture { font-size: 20px; line-height: 1.5; margin-bottom: 40px; }
.take-truth { font-size: 16px; line-height: 1.65; }

.progress-dots { font-size: 18px; letter-spacing: 6px; margin-bottom: 12px; color: var(--forest-green); }
.dot-incomplete { color: var(--light-grey); }
.progress-text { font-size: 11px; color: var(--dark-grey); margin-bottom: 30px; letter-spacing: 1px; text-transform: uppercase; }

.tw-form-group { margin-bottom: 20px; text-align: left; }
.tw-form-group label { display: block; font-weight: 600; font-size: 13px; margin-bottom: 6px; color: var(--forest-green); text-transform: uppercase; letter-spacing: 1px; }
.tw-form-control { width: 100%; padding: 14px; border: 1px solid var(--light-grey); font-family: 'Inter', sans-serif; font-size: 14px; box-sizing: border-box; background-color: var(--pure-white); color: var(--black); }
.tw-form-control:focus { outline: none; border-color: var(--restrained-gold); }

.tw-footer { background-color: var(--warm-white); border-top: 1px solid var(--light-grey); padding: 60px 24px; text-align: center; color: var(--dark-grey); font-size: 13px; }
.tw-footer p { margin: 8px 0; }


/* v2.1.3: standalone lesson template + artwork safeguards */
body.the-way-standalone {
    margin: 0;
    background: var(--pure-white);
}
body.the-way-standalone .the-way-wrap {
    min-height: 100vh;
}
.artwork-container img {
    width: 100%;
    max-width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
    margin: 0 auto;
}
@media (max-width: 768px) {
    .artwork-container img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }
}

/* v2.1.6: visual refinement — wider, more readable lesson experience */
.tw-lesson-wrap { max-width: 820px; }
.tw-lesson-section { padding: 88px 54px; }
.arrive-title { font-size: 44px; line-height: 1.14; margin-bottom: 28px; }
.arrive-scripture { font-size: 21px; line-height: 1.65; max-width: 680px; margin-left: auto; margin-right: auto; }
.arrive-ref { font-size: 12px; letter-spacing: .35px; }
.tw-lesson-section > p { font-size: 17px; line-height: 1.8; }
.encounter-scripture { font-size: 29px; line-height: 1.55; max-width: 680px; margin-left: auto; margin-right: auto; }
.teaching-block { margin-bottom: 64px; }
.teaching-title { font-size: 20px; line-height: 1.35; }
.teaching-text { font-size: 17px; line-height: 1.85; }
.teaching-scripture { font-size: 17px; line-height: 1.75; padding-left: 24px; }
.see-section-title { font-size: 11px; }
.see-section-subtitle { font-size: 13px; }
.artwork-container { max-width: 760px; margin: 0 auto 34px; }
.artwork-container img { width: 100%; max-width: 760px; box-shadow: 0 18px 48px rgba(10,47,29,.08); }
.reflection-subtitle { font-size: 14px; }
.reflection-list li { font-size: 19px; line-height: 1.6; }
textarea.journal-input { min-height: 150px; font-size: 15px; line-height: 1.6; }
.pray-instruction { font-size: 17px; line-height: 1.75; }
.pray-list li { font-size: 16px; line-height: 1.75; }
.take-scripture { font-size: 23px; line-height: 1.6; max-width: 650px; margin-left: auto; margin-right: auto; }
.take-truth { font-size: 17px; line-height: 1.75; max-width: 650px; margin-left: auto; margin-right: auto; }
.tw-btn { min-height: 52px; }

@media (max-width: 768px) {
    .tw-lesson-wrap { max-width: 100%; }
    .tw-lesson-section { padding: 62px 24px; }
    .arrive-title { font-size: 34px; }
    .arrive-scripture { font-size: 18px; }
    .encounter-scripture { font-size: 23px; line-height: 1.55; }
    .teaching-title { font-size: 18px; }
    .teaching-text, .teaching-scripture { font-size: 16px; }
    .reflection-list li { font-size: 17px; }
    .artwork-container { max-width: 100%; }
    .artwork-container img { max-width: 100%; box-shadow: 0 12px 30px rgba(10,47,29,.07); }
    .take-scripture { font-size: 20px; }
}

@media (max-width: 420px) {
    .tw-lesson-section { padding: 52px 20px; }
    .arrive-title { font-size: 31px; }
    .arrive-meta { letter-spacing: 2px; }
    .tw-btn { max-width: 100%; }
}


/* v2.1.7: final reading polish — stronger readability without disturbing the engine */
/* Teaching: slightly larger body type, stronger section rhythm, clearer supporting Scripture. */
.teaching-block { margin-bottom: 76px; }
.teaching-title {
    font-size: 22px;
    line-height: 1.3;
    letter-spacing: 1.25px;
    margin-bottom: 18px;
}
.teaching-text {
    font-size: 18px;
    line-height: 1.88;
    color: #1b1b1b;
    max-width: 720px;
}
.teaching-scripture {
    font-size: 18px;
    line-height: 1.78;
    padding-left: 26px;
    margin-top: 24px;
    border-left-width: 2px;
    color: #222222;
}
.teaching-scripture span {
    font-size: 12px;
    margin-top: 10px;
}

/* SEE: make the label feel intentionally connected to the artwork. */
.see-section-title {
    font-size: 12px;
    letter-spacing: 3.5px;
    margin-bottom: 10px;
}
.see-section-subtitle {
    font-size: 13px;
    margin-bottom: 30px;
    letter-spacing: 1.2px;
}
.artwork-container { margin-top: 4px; margin-bottom: 38px; }

/* Reflection: premium but quiet panel, with more comfortable reading and writing. */
.reflection-subtitle {
    font-size: 15px;
    line-height: 1.7;
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
}
.reflection-list {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}
.reflection-list li {
    font-size: 20px;
    line-height: 1.68;
    margin-bottom: 26px;
}
textarea.journal-input {
    min-height: 175px;
    font-size: 16px;
    line-height: 1.7;
    padding: 18px;
    border-color: #dcdcdc;
    box-shadow: inset 0 1px 0 rgba(0,0,0,.015);
}

/* Response and prayer: improve legibility while keeping the calm hierarchy. */
.response-step { font-size: 17px; line-height: 1.78; margin-bottom: 28px; }
.response-step strong { font-size: 12px; margin-bottom: 6px; }
.response-sincere { font-size: 15px; line-height: 1.75; }
.pray-instruction {
    font-size: 18px;
    line-height: 1.8;
    margin-bottom: 28px;
}
.pray-list { padding-left: 24px; margin-bottom: 72px; }
.pray-list li {
    font-size: 17px;
    line-height: 1.82;
    margin-bottom: 18px;
}

/* Remember: richer reading scale without making the card overpower the lesson. */
.take-label { font-size: 11px; letter-spacing: 2.4px; }
.take-scripture { font-size: 24px; line-height: 1.65; }
.take-truth { font-size: 18px; line-height: 1.8; }

/* Continue: clearer completion state and progress anchor. */
.progress-dots { font-size: 20px; letter-spacing: 7px; margin-bottom: 14px; }
.progress-text { font-size: 12px; margin-bottom: 28px; letter-spacing: 1.2px; }
.btn-complete {
    max-width: 360px;
    background: #57585d;
    color: #fff;
    border: 1px solid #57585d;
}
.btn-complete:hover,
.btn-complete:focus-visible {
    background: var(--forest-green);
    border-color: var(--forest-green);
    color: #fff;
}

/* Keyboard accessibility for the final polish. */
.tw-btn:focus-visible,
.tw-nav a:focus-visible,
.tw-menu-toggle:focus-visible,
textarea.journal-input:focus-visible {
    outline: 3px solid rgba(197,160,89,.45);
    outline-offset: 3px;
}

@media (max-width: 768px) {
    .teaching-block { margin-bottom: 58px; }
    .teaching-title { font-size: 19px; line-height: 1.35; }
    .teaching-text { font-size: 17px; line-height: 1.82; }
    .teaching-scripture { font-size: 16.5px; line-height: 1.72; padding-left: 20px; }
    .reflection-subtitle { font-size: 14px; }
    .reflection-list li { font-size: 18px; line-height: 1.62; margin-bottom: 22px; }
    textarea.journal-input { min-height: 155px; font-size: 15px; }
    .pray-instruction { font-size: 17px; }
    .pray-list li { font-size: 16px; line-height: 1.72; }
    .take-scripture { font-size: 21px; }
    .take-truth { font-size: 16.5px; }
    .progress-dots { font-size: 18px; letter-spacing: 5px; }
}

@media (max-width: 420px) {
    .teaching-text { font-size: 16.5px; }
    .teaching-scripture { font-size: 16px; }
    .reflection-list li { font-size: 17px; }
    .pray-list { padding-left: 20px; }
    .pray-list li { font-size: 15.5px; }
    .btn-complete { max-width: 100%; }
}

/* v2.2.4 — premium official BLOM crest placement + rich lesson resources */
.tw-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.tw-brand-logo {
    width: 48px;
    height: 48px;
    object-fit: contain;
    flex: 0 0 48px;
    filter: none;
}
.tw-home-hero {
    padding-top: 86px;
    padding-bottom: 110px;
}
.tw-home-identity {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 18px;
}
.tw-home-logo {
    display: block;
    width: 238px;
    max-width: 44vw;
    height: auto;
    object-fit: contain;
    margin: 0 auto 15px;
    filter: none;
}
.tw-footer-logo {
    display: block;
    width: 92px;
    height: auto;
    margin: 0 auto 14px;
    object-fit: contain;
    opacity: 1;
    filter: none;
}

.tw-media-eyebrow {
    font-size: 11px;
    line-height: 1.2;
    letter-spacing: 3.4px;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--restrained-gold);
    text-align: center;
    margin-bottom: 12px;
}
.tw-media-title {
    font-size: 30px;
    line-height: 1.25;
    color: var(--forest-green);
    text-align: center;
    margin-bottom: 16px;
}
.tw-media-intro {
    max-width: 620px;
    margin: 0 auto 38px;
    text-align: center;
    color: var(--dark-grey);
    font-size: 15px;
    line-height: 1.75;
}
.tw-comic-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
    max-width: 760px;
    margin: 0 auto 34px;
}
.tw-comic-page {
    display: block;
    position: relative;
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--light-grey);
    box-shadow: 0 14px 36px rgba(10,47,29,.06);
    overflow: hidden;
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.tw-comic-page:hover,
.tw-comic-page:focus-visible {
    transform: translateY(-3px);
    border-color: var(--restrained-gold);
    box-shadow: 0 18px 42px rgba(10,47,29,.10);
}
.tw-comic-page img {
    width: 100%;
    height: auto;
    display: block;
}
.tw-comic-page span {
    display: block;
    padding: 10px 12px;
    text-align: center;
    font-size: 10px;
    letter-spacing: 2px;
    font-weight: 700;
    color: var(--forest-green);
    background: #fff;
}
.tw-resource-card {
    max-width: 760px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 72px 1fr auto;
    align-items: center;
    gap: 24px;
    padding: 28px;
    border: 1px solid #d8d3c8;
    background: #fff;
    text-align: left;
    box-shadow: 0 14px 36px rgba(10,47,29,.055);
}
.tw-comic-pdf-card { margin-top: 30px; }

/* v2.2.17 - premium comic library and virtual book reader */
.tw-comic-library-card {
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(230px, 38%) 1fr;
    gap: 42px;
    align-items: center;
    padding: 30px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(197,160,89,.48);
    box-shadow: 0 24px 70px rgba(10,47,29,.10);
    text-align: left;
    position: relative;
    overflow: hidden;
}
.tw-comic-library-card::after {
    content: '';
    position: absolute;
    inset: auto -80px -90px auto;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(197,160,89,.17), rgba(197,160,89,0) 70%);
    pointer-events: none;
}
.tw-comic-cover-button {
    border: 0;
    padding: 0;
    margin: 0;
    width: 100%;
    aspect-ratio: 16 / 9;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    background: #071f30;
    box-shadow: 0 18px 38px rgba(5,25,20,.22);
    transform: perspective(900px) rotateY(2deg);
    transition: transform .3s ease, box-shadow .3s ease;
}
.tw-comic-cover-button::before {
    content: '';
    position: absolute;
    inset: 0;
    border: 2px solid rgba(197,160,89,.82);
    z-index: 3;
    pointer-events: none;
}
.tw-comic-cover-button:hover,
.tw-comic-cover-button:focus-visible {
    transform: perspective(900px) rotateY(0) translateY(-5px);
    box-shadow: 0 26px 52px rgba(5,25,20,.28), 0 0 0 4px rgba(197,160,89,.15);
    outline: none;
}
.tw-comic-cover-button img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .45s ease;
}
.tw-comic-cover-button:hover img { transform: scale(1.025); }
.tw-comic-cover-glow {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(145deg, transparent 45%, rgba(255,221,145,.24));
    pointer-events: none;
}
.tw-comic-open-badge {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    padding: 10px 18px;
    border-radius: 999px;
    color: #fff;
    background: rgba(10,47,29,.92);
    border: 1px solid rgba(255,218,137,.8);
    box-shadow: 0 8px 24px rgba(0,0,0,.25);
    font-size: 10px;
    line-height: 1;
    letter-spacing: 2px;
    font-weight: 800;
    white-space: nowrap;
}
.tw-comic-cover-placeholder {
    color: var(--restrained-gold);
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    font-size: 30px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.tw-comic-card-copy { position: relative; z-index: 1; }
.tw-comic-card-title {
    margin: 0 0 7px;
    color: var(--forest-green);
    font-family: 'Playfair Display', serif;
    font-size: clamp(28px, 4vw, 40px);
    line-height: 1.08;
}
.tw-comic-card-scripture {
    margin: 0 0 18px;
    color: var(--restrained-gold);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.8px;
}
.tw-comic-card-note {
    margin: 0 0 18px;
    color: var(--dark-grey);
    font-size: 14px;
    line-height: 1.72;
}
.tw-comic-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 22px;
}
.tw-comic-card-meta span {
    padding: 7px 10px;
    border: 1px solid #ddd4bf;
    color: var(--forest-green);
    background: var(--warm-white);
    font-size: 9px;
    letter-spacing: 1.4px;
    font-weight: 800;
}
.tw-comic-card-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.tw-comic-card-actions .tw-btn { width: auto; margin: 0; min-width: 170px; }

body.tw-reader-open { overflow: hidden; }
.tw-reader {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
    color: #fff;
}
.tw-reader.is-open { display: block; animation: twReaderIn .24s ease both; }
@keyframes twReaderIn { from { opacity: 0; } to { opacity: 1; } }
.tw-reader-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2,13,21,.93);
    backdrop-filter: blur(16px);
}
.tw-reader-shell {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 100dvh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    background:
        radial-gradient(circle at 50% 15%, rgba(197,160,89,.14), transparent 34%),
        linear-gradient(145deg, #061925, #020b11 65%);
    overflow: hidden;
}
.tw-reader-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 18px 26px 12px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.tw-reader-kicker {
    display: block;
    margin-bottom: 3px;
    color: var(--restrained-gold);
    font-size: 8px;
    letter-spacing: 2.6px;
    font-weight: 800;
}
.tw-reader-header h2 {
    margin: 0;
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: clamp(18px, 3vw, 28px);
    line-height: 1.1;
}
.tw-reader-close {
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 50%;
    color: #fff;
    background: rgba(255,255,255,.07);
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
}
.tw-reader-close:hover,
.tw-reader-close:focus-visible { border-color: var(--restrained-gold); color: var(--restrained-gold); outline: none; }
.tw-reader-viewport {
    min-height: 0;
    padding: 20px 64px 94px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.tw-book-stage {
    position: relative;
    width: min(1340px, calc(100vw - 150px));
    max-height: calc(100dvh - 190px);
    aspect-ratio: 32 / 9;
    display: grid;
    grid-template-columns: 1fr 1fr;
    perspective: 1800px;
    transform-style: preserve-3d;
    filter: drop-shadow(0 30px 32px rgba(0,0,0,.38));
}
.tw-book-page {
    margin: 0;
    min-width: 0;
    min-height: 0;
    position: relative;
    overflow: hidden;
    background: #f7f0df;
    transition: transform .22s ease, opacity .22s ease;
    backface-visibility: hidden;
}
.tw-book-page-left { transform-origin: right center; border-radius: 8px 0 0 8px; }
.tw-book-page-right { transform-origin: left center; border-radius: 0 8px 8px 0; }
.tw-book-page img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    background: #111;
    user-select: none;
}
.tw-book-page figcaption {
    position: absolute;
    right: 9px;
    bottom: 7px;
    min-width: 28px;
    padding: 4px 7px;
    border-radius: 999px;
    color: #fff;
    background: rgba(4,24,35,.72);
    font-size: 9px;
    text-align: center;
}
.tw-book-page-left figcaption { left: 9px; right: auto; }
.tw-book-blank {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(10,47,29,.36);
    background: linear-gradient(135deg, #f9f3e4, #e9dec5);
    font-size: 9px;
    letter-spacing: 2px;
    font-weight: 800;
}
.tw-book-spine {
    position: absolute;
    z-index: 8;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 18px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, rgba(0,0,0,.22), rgba(255,255,255,.08) 48%, rgba(0,0,0,.25));
    pointer-events: none;
}
.tw-book-shadow {
    position: absolute;
    z-index: -1;
    inset: 5% 2% -7%;
    background: rgba(0,0,0,.5);
    filter: blur(25px);
}
.tw-book-stage.turning-next .tw-book-page-right { transform: rotateY(-10deg) scale(.985); opacity: .55; }
.tw-book-stage.turning-prev .tw-book-page-left { transform: rotateY(10deg) scale(.985); opacity: .55; }
.tw-reader-edge {
    position: absolute;
    z-index: 12;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 72px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    color: #fff;
    background: rgba(255,255,255,.07);
    font-size: 42px;
    line-height: 1;
    cursor: pointer;
}
.tw-reader-edge:hover,
.tw-reader-edge:focus-visible { color: var(--restrained-gold); border-color: var(--restrained-gold); outline: none; }
.tw-reader-edge-prev { left: 16px; }
.tw-reader-edge-next { right: 16px; }
.tw-reader-toolbar {
    position: absolute;
    z-index: 30;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px;
    border: 1px solid rgba(197,160,89,.62);
    border-radius: 999px;
    background: rgba(249,248,246,.94);
    box-shadow: 0 18px 50px rgba(0,0,0,.34);
    backdrop-filter: blur(18px);
    white-space: nowrap;
}
.tw-reader-toolbar button,
.tw-reader-toolbar a {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 13px;
    border: 0;
    border-radius: 999px;
    color: var(--forest-green);
    background: transparent;
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    cursor: pointer;
}
.tw-reader-toolbar button:hover,
.tw-reader-toolbar button:focus-visible,
.tw-reader-toolbar a:hover,
.tw-reader-toolbar a:focus-visible { color: #fff; background: var(--forest-green); outline: none; }
.tw-reader-toolbar b { font-size: 8px; letter-spacing: 1px; }
.tw-reader-counter {
    min-width: 126px;
    padding: 0 8px;
    color: #26352d;
    font-size: 9px;
    letter-spacing: 1.2px;
    font-weight: 800;
    text-align: center;
}
.tw-reader-divider { width: 1px; height: 24px; margin: 0 3px; background: #d8d0c1; }
.tw-reader-thumbs {
    position: absolute;
    z-index: 24;
    left: 50%;
    bottom: 80px;
    width: min(920px, calc(100vw - 32px));
    max-height: 0;
    transform: translateX(-50%);
    overflow: hidden auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(105px, 1fr));
    gap: 10px;
    padding: 0 14px;
    border-radius: 18px;
    background: rgba(3,18,27,.96);
    box-shadow: 0 20px 50px rgba(0,0,0,.4);
    transition: max-height .3s ease, padding .3s ease;
}
.tw-reader-thumbs.is-open { max-height: min(45vh, 390px); padding: 14px; border: 1px solid rgba(197,160,89,.45); }
.tw-reader-thumb {
    padding: 5px;
    border: 1px solid rgba(255,255,255,.12);
    color: #fff;
    background: rgba(255,255,255,.04);
    cursor: pointer;
    position: relative;
}
.tw-reader-thumb.active { border-color: var(--restrained-gold); box-shadow: 0 0 0 2px rgba(197,160,89,.18); }
.tw-reader-thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.tw-reader-thumb span { display: block; padding: 5px 0 1px; font-size: 9px; }
.tw-reader-pdf-fallback { width: min(1100px, 92vw); height: calc(100dvh - 185px); }
.tw-reader-pdf-fallback iframe { width: 100%; height: 100%; border: 0; background: #fff; }
.tw-book-stage[hidden],
.tw-reader-pdf-fallback[hidden] { display: none !important; }
.tw-reader.is-pdf-mode .tw-reader-edge,
.tw-reader.is-pdf-mode .tw-reader-toolbar button:nth-of-type(1),
.tw-reader.is-pdf-mode .tw-reader-toolbar button:nth-of-type(2),
.tw-reader.is-pdf-mode .tw-reader-toolbar button:nth-of-type(3),
.tw-reader.is-pdf-mode .tw-reader-divider { display: none; }
.tw-reader.is-pdf-mode .tw-reader-toolbar { gap: 8px; }

@media (max-width: 820px) {
    .tw-comic-library-card { grid-template-columns: 1fr; gap: 26px; padding: 20px; }
    .tw-comic-cover-button { transform: none; }
    .tw-comic-card-copy { text-align: center; }
    .tw-comic-card-meta, .tw-comic-card-actions { justify-content: center; }
    .tw-reader-header { padding: 12px 14px 9px; }
    .tw-reader-header h2 { max-width: 75vw; }
    .tw-reader-close { width: 40px; height: 40px; }
    .tw-reader-viewport { padding: 12px 8px 82px; }
    .tw-book-stage {
        width: min(100%, calc((100dvh - 175px) * 1.7778));
        max-height: calc(100dvh - 175px);
        aspect-ratio: 16 / 9;
        grid-template-columns: 1fr;
    }
    .tw-book-page-left, .tw-book-spine { display: none; }
    .tw-book-page-right { border-radius: 7px; }
    .tw-reader-edge { width: 38px; height: 56px; font-size: 34px; background: rgba(2,16,24,.62); }
    .tw-reader-edge-prev { left: 5px; }
    .tw-reader-edge-next { right: 5px; }
    .tw-reader-toolbar { bottom: 10px; max-width: calc(100vw - 16px); padding: 6px; }
    .tw-reader-toolbar button, .tw-reader-toolbar a { min-width: 39px; min-height: 39px; padding: 0 9px; }
    .tw-reader-toolbar b, .tw-reader-divider { display: none; }
    .tw-reader-counter { min-width: 104px; font-size: 8px; }
    .tw-reader-thumbs { bottom: 66px; grid-template-columns: repeat(3, 1fr); }
    .tw-reader-pdf-fallback { width: 100%; height: calc(100dvh - 150px); }
}

@media (max-width: 460px) {
    .tw-comic-card-actions .tw-btn { width: 100%; }
    .tw-reader-kicker { display: none; }
    .tw-reader-toolbar button, .tw-reader-toolbar a { padding: 0 7px; }
    .tw-reader-counter { min-width: 92px; }
}
.tw-resource-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--restrained-gold);
    background: var(--forest-green);
    font-family: 'Playfair Display', serif;
    font-size: 29px;
    line-height: 1;
}
.tw-pdf-icon {
    border-radius: 2px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    letter-spacing: 1px;
    font-weight: 800;
}
.tw-resource-copy { min-width: 0; }
.tw-resource-label {
    color: var(--restrained-gold);
    font-size: 10px;
    line-height: 1.2;
    letter-spacing: 2.2px;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 8px;
}
.tw-resource-heading {
    font-family: 'Playfair Display', serif;
    color: var(--forest-green);
    font-size: 21px;
    line-height: 1.25;
    margin-bottom: 5px;
}
.tw-resource-note {
    color: var(--dark-grey);
    font-size: 13px;
    line-height: 1.65;
}
.tw-resource-action {
    width: auto;
    min-width: 180px;
    margin: 0;
    white-space: nowrap;
}
.tw-media-player-card {
    max-width: 760px;
    margin: 22px auto 0;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--light-grey);
    box-shadow: 0 12px 32px rgba(10,47,29,.045);
}
.tw-study-section,
.tw-comic-section,
.tw-media-story-section {
    border-top: 1px solid rgba(229,229,229,.75);
}

@media (max-width: 768px) {
    .tw-header { padding: 14px 18px; }
    .tw-brand-logo { width: 42px; height: 42px; flex-basis: 42px; }
    .tw-brand span { font-size: 15px; letter-spacing: 1.4px; }
    .tw-home-hero { padding-top: 62px; padding-bottom: 82px; }
    .tw-home-logo { width: 160px; max-width: 48vw; }
    .tw-media-title { font-size: 25px; }
    .tw-comic-grid { grid-template-columns: 1fr; gap: 18px; }
    .tw-resource-card {
        grid-template-columns: 58px 1fr;
        gap: 18px;
        padding: 22px;
    }
    .tw-resource-icon { width: 54px; height: 54px; font-size: 24px; }
    .tw-resource-action {
        grid-column: 1 / -1;
        width: 100%;
        max-width: none;
        margin-top: 4px;
    }
}

@media (max-width: 420px) {
    .tw-brand span { font-size: 14px; }
    .tw-home-logo { width: 150px; }
    .tw-resource-card { grid-template-columns: 1fr; text-align: center; }
    .tw-resource-icon { margin: 0 auto; }
    .tw-resource-heading { font-size: 20px; }
}


/* v2.2.6 — final homepage brand lock */
.tw-home-hero .tw-eyebrow,
.tw-hero .tw-eyebrow {
    margin-top: 0;
    margin-bottom: 34px;
}
.tw-home-hero h1,
.tw-hero h1 {
    margin-top: 0;
}

/* Mobile: preserve presence without crowding */
@media (max-width: 768px) {
    .tw-home-logo {
        width: 190px;
        max-width: 54vw;
        margin-bottom: 14px;
    }
    .tw-footer-logo {
        width: 86px;
    }
}
@media (max-width: 480px) {
    .tw-home-logo {
        width: 174px;
        max-width: 58vw;
    }
}


/* v2.2.7 — official BLOM partnership + WhatsApp */
.tw-partner-details { padding: 84px 24px 96px; background:#F9F8F6; }
.tw-partner-details-inner { max-width: 820px; margin:0 auto; text-align:center; }
.tw-section-kicker { color:#C5A059; font-size:11px; letter-spacing:.24em; font-weight:700; margin-bottom:12px; }
.tw-partner-details h2 { color:#0A2F1D; font-family:var(--tw-serif, Georgia, serif); font-size:clamp(32px,5vw,48px); margin:0 0 16px; }
.tw-partner-intro { max-width:620px; margin:0 auto 36px; color:#666; line-height:1.75; }
.tw-bank-card, .tw-contact-card { background:#fff; border:1px solid #E5E5E5; padding:34px; margin:22px auto; text-align:left; box-shadow:0 12px 34px rgba(10,47,29,.045); }
.tw-bank-row { display:grid; grid-template-columns:150px 1fr; gap:20px; padding:14px 0; border-bottom:1px solid #eee; }
.tw-bank-row span { color:#777; font-size:12px; letter-spacing:.08em; text-transform:uppercase; }
.tw-bank-row strong { color:#111; }
.tw-account-row strong { color:#0A2F1D; font-size:24px; letter-spacing:.08em; }
.tw-copy-account { margin-top:24px; background:#0A2F1D; color:#fff; border:0; padding:14px 20px; letter-spacing:.12em; font-size:11px; cursor:pointer; }
.tw-contact-card { text-align:center; }
.tw-contact-card h3 { margin:0 0 10px; color:#0A2F1D; font-family:var(--tw-serif, Georgia, serif); font-size:28px; }
.tw-contact-link, .tw-prayer-links a { color:#0A2F1D; text-decoration:none; font-weight:700; }
.tw-prayer-label { margin:30px 0 12px; color:#C5A059; font-size:10px; letter-spacing:.2em; font-weight:700; }
.tw-prayer-links { display:flex; justify-content:center; flex-wrap:wrap; gap:10px 24px; }
.tw-whatsapp-float { position:fixed; right:22px; bottom:22px; z-index:9999; display:flex; align-items:center; gap:8px; background:#0A2F1D; color:#fff !important; text-decoration:none; padding:13px 18px; border-radius:999px; box-shadow:0 10px 30px rgba(0,0,0,.16); font-size:12px; font-weight:700; letter-spacing:.06em; }
.tw-wa-dot { color:#C5A059; font-size:13px; }
@media (max-width:600px) {
  .tw-partner-details { padding:60px 18px 74px; }
  .tw-bank-card,.tw-contact-card { padding:24px 20px; }
  .tw-bank-row { grid-template-columns:1fr; gap:6px; }
  .tw-whatsapp-float { right:14px; bottom:14px; padding:12px 15px; }
}


/* v2.2.8 — premium Partner With BLOM / bank transfer */
.tw-partner-hero {
    padding: 84px 24px 54px;
    background: #fff;
}
.tw-partner-title { font-size: clamp(38px, 5vw, 52px) !important; }
.tw-partner-lead { max-width: 690px; margin-left:auto; margin-right:auto; }

.tw-give-section {
    padding: 66px 24px 72px;
    background: #F9F8F6;
    border-top: 1px solid #eeeae3;
    border-bottom: 1px solid #eeeae3;
}
.tw-give-inner {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
}
.tw-give-inner h3,
.tw-contact-panel h3 {
    margin: 0 0 12px;
    color: #0A2F1D;
    font-family: var(--tw-serif, Georgia, serif);
    font-size: clamp(28px,4vw,38px);
    font-weight: 600;
}
.tw-give-note {
    margin: 0 auto 30px;
    color: #666;
    line-height: 1.7;
}
.tw-premium-bank-card {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid #E6E1D8;
    border-radius: 4px;
    padding: 38px 42px 34px;
    box-shadow: 0 18px 50px rgba(10,47,29,.07);
    text-align: left;
}
.tw-premium-bank-card::before {
    content:"";
    position:absolute;
    top:0; left:0; right:0;
    height:4px;
    background:#dd4f05;
}
.tw-bank-brand {
    display:flex;
    align-items:center;
    gap:16px;
    padding-bottom:28px;
    margin-bottom:26px;
    border-bottom:1px solid #eee;
}
.tw-gtco-logo {
    display:block;
    width:126px;
    height:auto;
    object-fit:contain;
}
.tw-gtco-fallback {
    display:none;
    align-items:center;
    gap:10px;
    color:#222;
    font-size:22px;
}
.tw-gtco-square {
    width:38px; height:38px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:#dd4f05;
    color:#fff;
    font-weight:800;
    font-size:13px;
}
.tw-bank-name-label {
    margin-left:auto;
    color:#555;
    font-size:11px;
    font-weight:800;
    letter-spacing:.18em;
}
.tw-bank-details {
    display:grid;
    gap:0;
}
.tw-bank-detail {
    display:grid;
    grid-template-columns:155px 1fr;
    gap:24px;
    align-items:baseline;
    padding:15px 0;
    border-bottom:1px solid #f0f0f0;
}
.tw-bank-detail span {
    color:#8A847B;
    font-size:10px;
    font-weight:700;
    letter-spacing:.16em;
}
.tw-bank-detail strong {
    color:#111;
    font-size:15px;
    line-height:1.45;
}
.tw-bank-number strong {
    color:#0A2F1D;
    font-family: var(--tw-serif, Georgia, serif);
    font-size:34px;
    letter-spacing:.08em;
}
.tw-copy-account {
    display:inline-flex;
    justify-content:center;
    margin-top:28px;
    min-width:240px;
    background:#0A2F1D;
    color:#fff;
    border:0;
    padding:15px 20px;
    font-size:10px;
    font-weight:800;
    letter-spacing:.14em;
    cursor:pointer;
}
.tw-copy-account:hover { background:#123d2a; }
.tw-give-assurance {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    margin-top:17px;
    color:#777;
    font-size:11px;
}
.tw-give-assurance p { margin:0; }
.tw-give-dot {
    width:6px; height:6px;
    border-radius:50%;
    background:#C5A059;
    flex:0 0 6px;
}

.tw-blom-contact-section {
    padding:70px 24px 88px;
    background:#fff;
}
.tw-contact-grid {
    max-width:900px;
    margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}
.tw-contact-panel {
    padding:34px;
    border:1px solid #E5E5E5;
    background:#fff;
    text-align:center;
}
.tw-contact-panel p {
    max-width:360px;
    margin:0 auto 24px;
    color:#666;
    line-height:1.7;
}
.tw-contact-button,
.tw-prayer-buttons a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none !important;
    color:#0A2F1D !important;
    border:1px solid #0A2F1D;
    padding:12px 17px;
    font-size:12px;
    font-weight:700;
}
.tw-prayer-buttons {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:9px;
}
.tw-prayer-buttons a { min-width:210px; }
.tw-contact-button:hover,
.tw-prayer-buttons a:hover {
    background:#0A2F1D;
    color:#fff !important;
}
@media (max-width:700px) {
    .tw-partner-hero { padding:62px 18px 40px; }
    .tw-give-section { padding:52px 16px 58px; }
    .tw-premium-bank-card { padding:32px 22px 28px; }
    .tw-bank-brand { align-items:flex-start; flex-wrap:wrap; }
    .tw-bank-name-label { width:100%; margin-left:0; }
    .tw-bank-detail { grid-template-columns:1fr; gap:6px; }
    .tw-bank-number strong { font-size:30px; }
    .tw-contact-grid { grid-template-columns:1fr; }
    .tw-blom-contact-section { padding:54px 16px 72px; }
}


/* v2.2.9 — Partner page final visual polish */
.tw-partner-hero {
    padding: 54px 24px 38px !important;
    min-height: 0 !important;
}
.tw-partner-title {
    margin-bottom: 12px !important;
}
.tw-partner-lead {
    margin-bottom: 0 !important;
}
.tw-give-section {
    padding-top: 52px !important;
}
.tw-give-kicker {
    display: block !important;
    margin-bottom: 10px !important;
    color: #C5A059 !important;
    letter-spacing: .22em !important;
}
.tw-give-inner {
    max-width: 720px !important;
}
.tw-premium-bank-card {
    max-width: 670px;
    margin-left: auto;
    margin-right: auto;
}
.tw-whatsapp-float {
    right: 28px !important;
    bottom: 24px !important;
}
.tw-footer-logo {
    width: 102px !important;
}
@media (max-width: 700px) {
    .tw-partner-hero {
        padding: 44px 18px 30px !important;
    }
    .tw-give-section {
        padding-top: 44px !important;
    }
    .tw-premium-bank-card {
        max-width: 100%;
    }
    .tw-whatsapp-float {
        right: 16px !important;
        bottom: 16px !important;
    }
    .tw-footer-logo {
        width: 92px !important;
    }
}

/* v2.2.19 — BLOM Daily Prayer 2026 / Zoom invitation */
.tw-daily-prayer {
    padding: 76px 24px 92px;
    background:
        radial-gradient(circle at 88% 18%, rgba(197,160,89,.16), transparent 30%),
        #082719;
    color: #fff;
    border-top: 1px solid rgba(197,160,89,.45);
}
.tw-daily-prayer-inner {
    width: min(1040px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
    gap: 54px;
    align-items: center;
}
.tw-daily-prayer .tw-section-kicker {
    color: #D8B66A;
    letter-spacing: .22em;
}
.tw-daily-prayer-copy h2 {
    margin: 8px 0 10px;
    color: #fff;
    font-size: clamp(38px, 6vw, 62px);
    line-height: 1.08;
}
.tw-daily-prayer-lead {
    margin: 0 0 30px;
    color: rgba(255,255,255,.78);
    font-size: 17px;
}
.tw-daily-prayer-details {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 0 34px;
    border-top: 1px solid rgba(255,255,255,.15);
    border-bottom: 1px solid rgba(255,255,255,.15);
}
.tw-daily-prayer-details div {
    padding: 18px 16px 18px 0;
}
.tw-daily-prayer-details span,
.tw-daily-prayer-details strong {
    display: block;
}
.tw-daily-prayer-details span {
    margin-bottom: 5px;
    color: #D8B66A;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .18em;
}
.tw-daily-prayer-details strong {
    color: #fff;
    font-size: 13px;
    line-height: 1.45;
}
.tw-daily-prayer blockquote {
    margin: 0;
    padding: 0 0 0 22px;
    border-left: 2px solid #C5A059;
    color: rgba(255,255,255,.88);
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 18px;
    line-height: 1.65;
}
.tw-daily-prayer blockquote cite {
    display: block;
    margin-top: 10px;
    color: #D8B66A;
    font-family: 'Inter', sans-serif;
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
}
.tw-zoom-card {
    padding: 34px;
    background: #fff;
    color: #111;
    box-shadow: 0 24px 70px rgba(0,0,0,.27);
}
.tw-zoom-live {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #0A2F1D;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.tw-zoom-live span,
.tw-prayer-float-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #C5A059;
    box-shadow: 0 0 0 5px rgba(197,160,89,.15);
}
.tw-zoom-card h3 {
    margin: 18px 0 22px;
    color: #0A2F1D;
    font-size: 29px;
    line-height: 1.2;
}
.tw-zoom-card dl { margin: 0 0 22px; }
.tw-zoom-card dl div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 11px 0;
    border-bottom: 1px solid #E5E5E5;
}
.tw-zoom-card dt {
    color: #777;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
}
.tw-zoom-card dd {
    margin: 0;
    color: #111;
    font-weight: 800;
    letter-spacing: .05em;
}
.tw-btn-gold { background: #C5A059; color: #071f14; }
.tw-zoom-join { max-width: none; margin: 4px 0 8px; }
.tw-zoom-card > p {
    margin: 5px 0 0;
    color: #777;
    text-align: center;
    font-size: 10px;
}
.tw-prayer-float-wrap {
    position: fixed;
    left: 28px;
    bottom: 24px;
    z-index: 9999;
    transition: opacity .25s ease, transform .25s ease;
}
.tw-prayer-float-wrap.is-dismissed {
    opacity: 0;
    transform: translateY(14px);
    pointer-events: none;
}
.tw-prayer-float {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 190px;
    padding: 12px 16px;
    box-sizing: border-box;
    border: 1px solid rgba(197,160,89,.72);
    border-radius: 999px;
    background: rgba(8,39,25,.97);
    box-shadow: 0 12px 34px rgba(0,0,0,.2);
    color: #fff !important;
    text-decoration: none;
    backdrop-filter: blur(10px);
}
.tw-prayer-float-close {
    position: absolute;
    top: -7px;
    right: -5px;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #333;
    color: #fff;
    font-size: 17px;
    line-height: 19px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,.2);
}
.tw-prayer-float-wrap.is-live .tw-prayer-float {
    border-color: #E2C377;
    box-shadow: 0 12px 38px rgba(0,0,0,.25), 0 0 0 4px rgba(197,160,89,.15);
}
.tw-prayer-float-wrap.is-live .tw-prayer-float-dot {
    animation: twPrayerPulse 1.5s ease-out infinite;
}
@keyframes twPrayerPulse {
    0% { box-shadow: 0 0 0 0 rgba(197,160,89,.5); }
    70% { box-shadow: 0 0 0 10px rgba(197,160,89,0); }
    100% { box-shadow: 0 0 0 0 rgba(197,160,89,0); }
}
.tw-prayer-float > span:nth-child(2) { display: flex; flex-direction: column; }
.tw-prayer-float strong {
    font-size: 12px;
    line-height: 1.2;
    letter-spacing: .04em;
}
.tw-prayer-float small {
    margin-top: 2px;
    color: rgba(255,255,255,.7);
    font-size: 9px;
    letter-spacing: .04em;
}
.tw-prayer-float-arrow {
    margin-left: auto;
    color: #D8B66A;
    font-size: 18px;
}
@media (max-width: 760px) {
    .tw-daily-prayer { padding: 56px 20px 76px; }
    .tw-daily-prayer-inner { grid-template-columns: 1fr; gap: 34px; }
    .tw-daily-prayer-details { grid-template-columns: 1fr; }
    .tw-daily-prayer-details div {
        display: grid;
        grid-template-columns: 74px 1fr;
        padding: 12px 0;
        border-bottom: 1px solid rgba(255,255,255,.1);
    }
    .tw-daily-prayer-details div:last-child { border-bottom: 0; }
    .tw-daily-prayer-details span { margin: 2px 0 0; }
    .tw-zoom-card { padding: 27px 22px; }
    .tw-prayer-float-wrap {
        left: 14px;
        bottom: 72px;
    }
    .tw-prayer-float {
        min-width: 178px;
        padding: 11px 14px;
    }
}

/* v2.2.23 — premium journey, progress dashboard, and accessibility */
.tw-skip-link {
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 20000;
    padding: 12px 18px;
    background: #0A2F1D;
    color: #fff !important;
    text-decoration: none;
    transform: translateY(-150%);
    transition: transform .2s ease;
}
.tw-skip-link:focus { transform: translateY(0); }
.the-way-wrap :focus-visible,
.tw-skip-link:focus-visible {
    outline: 3px solid #D8B66A;
    outline-offset: 4px;
}
.tw-nav a[aria-current="page"] { color: #0A2F1D; }
.tw-nav a[aria-current="page"]::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    margin-top: 4px;
    background: #C5A059;
}
.tw-home-journey {
    padding: 82px 24px 90px;
    background: #F9F8F6;
    border-top: 1px solid #EEEAE3;
    border-bottom: 1px solid #EEEAE3;
}
.tw-home-journey-inner {
    width: min(1040px, 100%);
    margin: 0 auto;
}
.tw-home-journey h2 {
    margin: 8px 0 14px;
    color: #0A2F1D;
    font-size: clamp(34px, 5vw, 50px);
    line-height: 1.15;
}
.tw-home-journey .tw-text-center > p {
    max-width: 690px;
    margin: 0 auto;
    color: #666;
    font-size: 16px;
    line-height: 1.75;
}
.tw-home-stage-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 44px;
}
.tw-home-stage {
    min-height: 172px;
    padding: 24px 20px;
    box-sizing: border-box;
    border: 1px solid #E5E5E5;
    background: #fff;
    color: #111;
    text-align: left;
}
button.tw-home-stage {
    width: 100%;
    font: inherit;
    cursor: pointer;
}
.tw-home-stage span,
.tw-home-stage strong,
.tw-home-stage small { display: block; }
.tw-home-stage span {
    margin-bottom: 28px;
    color: #C5A059;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .16em;
}
.tw-home-stage strong {
    color: #0A2F1D;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 19px;
    line-height: 1.25;
}
.tw-home-stage small {
    margin-top: 8px;
    color: #777;
    font-size: 11px;
}
.tw-home-stage.is-active {
    border-color: #C5A059;
    background: #0A2F1D;
}
.tw-home-stage.is-active strong { color: #fff; }
.tw-home-stage.is-active small { color: rgba(255,255,255,.68); }
.tw-home-progress-card {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(180px, 1fr) auto;
    gap: 28px;
    align-items: center;
    margin-top: 26px;
    padding: 26px 28px;
    border: 1px solid #E1D7C3;
    background: #fff;
    box-shadow: 0 14px 36px rgba(10,47,29,.06);
}
.tw-home-progress-card .tw-section-kicker { margin-bottom: 6px; }
.tw-home-progress-card > div > strong {
    display: block;
    color: #0A2F1D;
    font-size: 14px;
}
.tw-home-progress-track,
.tw-dashboard-track {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #ECE8E0;
}
.tw-home-progress-track span,
.tw-dashboard-track span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #0A2F1D, #C5A059);
    transition: width .45s ease;
}
.tw-home-progress-card .tw-btn { width: auto; min-width: 190px; margin: 0; }
.tw-dashboard {
    min-height: 70vh;
    padding: 78px 24px 96px;
    background: #F9F8F6;
}
.tw-dashboard-inner { width: min(880px, 100%); margin: 0 auto; }
.tw-dashboard-summary {
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 36px;
    align-items: center;
    margin: 30px 0 26px;
    padding: 34px;
    border: 1px solid #E1D7C3;
    background: #fff;
    box-shadow: 0 16px 42px rgba(10,47,29,.07);
}
.tw-dashboard-score {
    display: flex;
    width: 140px;
    height: 140px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border: 9px solid #EDE7DB;
    border-top-color: #C5A059;
    border-radius: 50%;
}
.tw-dashboard-score strong {
    color: #0A2F1D;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 46px;
    line-height: 1;
}
.tw-dashboard-score span { margin-top: 7px; color: #777; font-size: 10px; }
.tw-dashboard-copy h3 { margin: 0 0 18px; color: #0A2F1D; font-size: 26px; }
.tw-dashboard-copy .tw-btn { margin: 22px 0 0; }
.tw-dashboard-lessons { display: grid; gap: 10px; }
.tw-dashboard-lessons button {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    gap: 15px;
    align-items: center;
    width: 100%;
    padding: 17px 20px;
    border: 1px solid #E5E5E5;
    background: #fff;
    color: #111;
    text-align: left;
    cursor: pointer;
}
.tw-dashboard-lessons button > span {
    color: #C5A059;
    font-size: 11px;
    font-weight: 800;
}
.tw-dashboard-lessons button > strong { color: #0A2F1D; font-size: 14px; }
.tw-dashboard-lessons button > small { color: #777; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.tw-dashboard-lessons button.is-complete { border-color: rgba(10,47,29,.35); background: #F5F8F6; }
.tw-dashboard-lessons button.is-complete > small { color: #0A2F1D; font-weight: 800; }
.tw-dashboard-lessons button.is-next { border-color: #C5A059; box-shadow: inset 4px 0 0 #C5A059; }
@media (max-width: 900px) {
    .tw-home-stage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tw-home-progress-card { grid-template-columns: 1fr; gap: 18px; }
    .tw-home-progress-card .tw-btn { width: 100%; max-width: none; }
}
@media (min-width: 769px) and (max-width: 1120px) {
    .tw-header { padding-left: 20px; padding-right: 20px; }
    .tw-nav { gap: 13px; }
    .tw-nav a { font-size: 10px; letter-spacing: .07em; }
    .tw-nav-cta { padding: 9px 13px; }
}
@media (max-width: 600px) {
    .tw-home-journey { padding: 58px 18px 68px; }
    .tw-home-stage-grid { grid-template-columns: 1fr; gap: 10px; margin-top: 34px; }
    .tw-home-stage { min-height: auto; padding: 20px; }
    .tw-home-stage span { margin-bottom: 14px; }
    .tw-home-progress-card { padding: 22px 19px; }
    .tw-dashboard { padding: 54px 16px 82px; }
    .tw-dashboard-summary { grid-template-columns: 1fr; padding: 26px 21px; }
    .tw-dashboard-score { margin: 0 auto; }
    .tw-dashboard-copy { text-align: center; }
    .tw-dashboard-lessons button { grid-template-columns: 34px 1fr; }
    .tw-dashboard-lessons button > small { grid-column: 2; }
}
@media (prefers-reduced-motion: reduce) {
    .the-way-wrap *,
    .tw-skip-link,
    .tw-prayer-float-wrap,
    .tw-whatsapp-float-wrap {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* v2.2.21 — premium, dismissible WhatsApp invitation */
.tw-whatsapp-float-wrap {
    position: fixed;
    right: 28px;
    bottom: 24px;
    z-index: 9999;
    transition: opacity .25s ease, transform .25s ease;
}
.tw-whatsapp-float-wrap.is-dismissed {
    opacity: 0;
    transform: translateY(14px);
    pointer-events: none;
}
.tw-whatsapp-float-wrap .tw-whatsapp-float {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 224px;
    padding: 12px 16px;
    box-sizing: border-box;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    background: rgba(8,39,25,.97);
    box-shadow: 0 12px 34px rgba(0,0,0,.2);
    color: #fff !important;
    text-decoration: none;
    backdrop-filter: blur(10px);
}
.tw-whatsapp-float-wrap .tw-wa-dot {
    flex: 0 0 auto;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #25D366;
    box-shadow: 0 0 0 5px rgba(37,211,102,.13);
}
.tw-wa-float-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}
.tw-wa-float-copy strong {
    color: #fff;
    font-size: 12px;
    line-height: 1.2;
    letter-spacing: .04em;
}
.tw-wa-float-copy small {
    margin-top: 2px;
    color: rgba(255,255,255,.68);
    font-size: 9px;
    line-height: 1.25;
    letter-spacing: .02em;
}
.tw-wa-float-arrow {
    margin-left: auto;
    color: #C5A059;
    font-size: 18px;
}
.tw-whatsapp-float-close {
    position: absolute;
    top: -7px;
    right: -5px;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #333;
    color: #fff;
    font-size: 17px;
    line-height: 19px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0,0,0,.2);
}
.tw-whatsapp-float-wrap .tw-whatsapp-float:hover {
    border-color: rgba(37,211,102,.75);
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(0,0,0,.25);
}
@media (max-width: 760px) {
    .tw-whatsapp-float-wrap {
        right: 14px;
        bottom: 14px;
    }
    .tw-whatsapp-float-wrap .tw-whatsapp-float {
        min-width: 204px;
        max-width: calc(100vw - 28px);
        padding: 11px 14px;
    }
}


/* v2.2.10 — giving principle + partner hero stabilization */
.tw-partner-hero {
    padding: 72px 24px 48px !important;
    margin-top: 0 !important;
}
.admin-bar .tw-partner-hero {
    padding-top: 88px !important;
}
.tw-giving-scripture {
    max-width: 620px;
    margin: 0 auto 26px;
    text-align: center;
}
.tw-giving-quote {
    color: #0A2F1D;
    font-family: var(--tw-serif, Georgia, serif);
    font-size: clamp(24px, 4vw, 34px);
    line-height: 1.35;
}
.tw-giving-ref {
    margin-top: 9px;
    color: #C5A059;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .18em;
}
.tw-giving-caveat {
    max-width: 670px;
    margin: 26px auto 0;
    padding: 26px 28px;
    background: #fffdf9;
    border: 1px solid #e7dcc8;
    text-align: left;
}
.tw-giving-caveat p {
    margin: 0 0 14px;
    color: #555;
    line-height: 1.75;
}
.tw-giving-caveat blockquote {
    margin: 18px 0 0;
    padding-left: 16px;
    border-left: 3px solid #C5A059;
    color: #0A2F1D;
    font-family: var(--tw-serif, Georgia, serif);
    font-size: 18px;
    line-height: 1.5;
}
.tw-caveat-note {
    margin-top: 18px !important;
    padding-top: 16px;
    border-top: 1px solid #eee3d3;
    color: #0A2F1D !important;
    font-weight: 700;
}
@media (max-width: 700px) {
    .tw-partner-hero {
        padding: 54px 18px 38px !important;
    }
    .admin-bar .tw-partner-hero {
        padding-top: 68px !important;
    }
    .tw-giving-caveat {
        padding: 22px 20px;
    }
}
