/* WordUp Today public site: an editorial publication.
   Warm Ivory #F8F7F3, Deep Charcoal #20252B, Muted Slate #747C84, Soft Grey #EAE9E5,
   WordUp Red #F33218, Pure White #FFFFFF. The logo keeps its original artwork. */
@font-face{font-family:"DM Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/dm-serif-display-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"DM Serif Display";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/dm-serif-display-latin-400-italic.woff2) format("woff2")}
:root{--ivory:#F8F7F3;--char:#20252B;--slate:#747C84;--grey:#EAE9E5;--red:#F33218;--white:#FFFFFF;--foot2:#B8BEC4;
 --ink:#20252B;--text:#20252B;--mute:#747C84;--line:#EAE9E5;--wash:#F8F7F3;
 --serif:"DM Serif Display",Georgia,serif;--ease:cubic-bezier(.2,.8,.2,1);--edge:max(var(--gut),calc((100vw - var(--max))/2 + var(--gut)))}
html{background:var(--ivory);overflow-x:clip}
body.site{background:var(--ivory);color:var(--char);overflow-x:clip;font-size:17px}
@view-transition{navigation:auto}
::view-transition-old(root){animation:vt-out .18s ease both}
::view-transition-new(root){animation:vt-in .34s var(--ease) both}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0;transform:translateY(10px)}}

.btn{background:var(--red);border-color:var(--red);color:var(--white);transition:transform .25s var(--ease)}
.btn:hover{transform:translateY(-3px)}
.site .btn-outline{background:transparent;color:var(--char);border-color:var(--char)}
.site a:focus-visible,.site button:focus-visible{outline-color:var(--char)}

/* Navigation */
.nav{position:sticky;top:0;z-index:40;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:10px var(--edge);background:var(--white);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.s{border-bottom-color:var(--grey)}
.logo{display:block}
.logo img{height:50px;width:auto}
.nav-links{display:none;gap:clamp(16px,2.2vw,30px)}
.nav-links a{color:var(--char);text-decoration:none;font-weight:500;padding:8px 0;border-bottom:2px solid transparent;transition:border-color .2s}
.nav-links a:hover,.nav-links a[aria-current]{border-bottom-color:var(--red)}
@media(min-width:960px){.nav-links{display:flex}}
.tabbar{background:var(--white);border-top:1px solid var(--grey)}
.tabbar a,.tabbar button{color:var(--char)}
.tabbar [aria-current]{color:var(--char);font-weight:800}
.tabbar [aria-current] svg{stroke:var(--red);stroke-width:2.4}
@media(min-width:960px){.tabbar{display:none}}
@media(min-width:900px) and (max-width:959px){.tabbar{display:grid}body.site{padding-bottom:calc(var(--tab) + env(safe-area-inset-bottom))}}
.progress{z-index:50}
.progress i{background:var(--red)}

/* Quiet motion */
.m .rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .9s var(--ease)}
.m .rv.in{opacity:1;transform:none}
.rw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.rw>span{display:inline-block;transform:translateY(112%);animation:rise .9s var(--ease) forwards;animation-delay:calc(var(--i) * 55ms + .1s)}
@keyframes rise{to{transform:none}}
.m [data-rise-words]:not(.is-split){visibility:hidden}

/* Shared editorial type */
.ed{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
.sub{font-size:clamp(1.1875rem,1.7vw,1.375rem);line-height:1.45;color:var(--slate)}
.lbl{font-weight:600;color:var(--slate)}
.h2{font:400 clamp(2.3rem,5vw,4rem)/1.06 var(--serif);color:var(--char);letter-spacing:-.005em}
.sec{padding-block:clamp(64px,9vw,120px)}
.bg-white{background:var(--white)}

/* Hero */
.hero3{padding-block:clamp(52px,8vw,112px) clamp(40px,6vw,76px)}
.hero-photo,.banner{margin-top:clamp(26px,3.6vw,44px);border-radius:10px;overflow:hidden;aspect-ratio:4/3}
.hero-photo img,.banner img{width:100%;height:100%;object-fit:cover}
.hero-photo img{object-position:50% 34%}
.banner img{object-position:50% 40%}
@media(min-width:760px){.hero-photo,.banner{aspect-ratio:21/9}}
.ph .banner{max-width:var(--max);margin-inline:0}
.hero3 h1{font:400 clamp(3.1rem,8.7vw,7.4rem)/1 var(--serif);color:var(--char);letter-spacing:-.012em;max-width:13.5em}
.hero3 h1 span.s{display:block;text-wrap:balance}
.hero3-foot{display:grid;gap:22px;margin-top:clamp(28px,4vw,48px);padding-top:clamp(22px,3vw,30px);border-top:1px solid var(--grey)}
.hero3-foot p{max-width:32em}
@media(min-width:860px){.hero3-foot{grid-template-columns:1fr auto;align-items:center;gap:56px}}

/* Daily Word */
.daily{display:grid;gap:20px}
.daily-date b{display:block;font:400 clamp(6rem,15vw,10.5rem)/.86 var(--serif);color:var(--red)}
.daily-date span{display:block;margin-top:10px;color:var(--slate);font-weight:500}
.daily h2{font-size:1.0625rem;font-weight:600;color:var(--slate);line-height:1.3}
.daily h3{font:400 clamp(2.4rem,5.2vw,4rem)/1.06 var(--serif);color:var(--char);margin:6px 0 16px}
.daily h3 a{text-decoration:none;background:linear-gradient(var(--red),var(--red)) 0 100%/0 2px no-repeat;transition:background-size .35s var(--ease)}
.daily h3 a:hover{background-size:100% 2px}
.daily-img{width:100%;max-height:340px;object-fit:cover;border-radius:10px;margin-bottom:18px}
.daily blockquote{font:400 1.1875rem/1.7 var(--read);max-width:36em}
.daily cite{font:600 1rem/1.3 var(--ui);color:var(--slate);margin:8px 0 24px}
@media(min-width:800px){.daily{grid-template-columns:minmax(220px,3fr) 8fr;gap:56px}}

/* Pull scripture */
.pull{max-width:980px}
.pull p{font:400 clamp(2rem,4.6vw,3.5rem)/1.2 var(--serif);color:var(--char)}
.pull cite{display:block;font:600 1.0625rem/1.3 var(--ui);color:var(--slate);margin-top:20px;padding-left:44px;position:relative}
.pull cite::before{content:"";position:absolute;left:0;top:.62em;width:32px;height:2px;background:var(--red)}

/* Two doors */
.doors{display:grid;gap:clamp(14px,2vw,24px);margin-top:clamp(30px,4vw,48px)}
.door{display:flex;flex-direction:column;overflow:hidden;background:var(--white);border:1px solid var(--grey);border-radius:10px;text-decoration:none;transition:transform .4s var(--ease),border-color .3s}
.door:hover{transform:translateY(-6px);border-color:var(--char)}
.door-img{display:block;aspect-ratio:3/2;overflow:hidden}
.door-img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.door:hover .door-img img{transform:scale(1.04)}
.door-txt{display:flex;flex-direction:column;align-items:flex-start;flex:1;padding:clamp(22px,3vw,34px)}
.door h3{font:400 clamp(2rem,3.6vw,2.9rem)/1.05 var(--serif);color:var(--char)}
.door p{color:var(--slate);font-size:1.125rem;max-width:30em;margin:10px 0 22px}
.door .btn{margin-top:auto}
@media(min-width:760px){.doors{grid-template-columns:1fr 1fr}}

/* Gospel statement */
.creed-in{display:grid;gap:clamp(24px,3vw,40px);padding-top:clamp(48px,6vw,72px);border-top:1px solid var(--grey)}
.creed-photo{border-radius:10px;overflow:hidden;aspect-ratio:4/3}
.creed-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.creed h2{font:400 clamp(2.4rem,5vw,4rem)/1.06 var(--serif);color:var(--char)}
.creed p{color:var(--slate);font-size:1.1875rem;max-width:30em;margin-top:12px}
.creed-list{display:grid;margin:20px 0 24px;border-bottom:1px solid var(--grey)}
.creed-list li{padding:12px 0;border-top:1px solid var(--grey);font:400 clamp(1.6rem,3vw,2.2rem)/1.15 var(--serif);color:var(--char)}
@media(min-width:860px){.creed-in{grid-template-columns:1fr 1fr;gap:64px;align-items:center}.creed-photo{aspect-ratio:1}}

/* Gospel wheel */
.wheel-sec{position:relative;overflow:clip}
.wheel-head{padding:clamp(56px,7vw,84px) var(--edge) 20px;text-align:center}
.wheel-head .sub{margin-top:8px}
.wheel{display:flex;gap:12px;overflow-x:auto;padding:18px var(--edge) 56px;scroll-snap-type:x mandatory}
.wcard{flex:0 0 240px;scroll-snap-align:center;display:flex;flex-direction:column;min-height:310px;padding:22px;border-radius:14px;background:var(--white);border:1px solid var(--grey);color:var(--char);text-decoration:none;box-shadow:0 18px 38px rgba(32,37,43,.13);transition:border-color .25s}
.wcard:hover{border-color:var(--red)}
.wcard b{font:400 3.2rem/1 var(--serif);color:var(--red)}
.wcard strong{font:400 1.75rem/1.08 var(--serif);margin-top:auto}
.wcard span{font-size:.96875rem;line-height:1.4;margin-top:8px;color:var(--slate)}
.wcard.core{background:var(--char);border-color:var(--char);color:var(--white)}
.wcard.core span{color:var(--foot2)}
.m .wheel-head{padding-top:92px}
.m .wheel-sec{height:320vh}
.m .wheel-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.m .wheel{position:absolute;left:50%;top:0;display:block;padding:0;overflow:visible;width:0;height:0;will-change:transform}
.m .wcard{position:absolute;left:-125px;top:0;width:250px;height:330px;min-height:0;transform-origin:50% 0}

/* Closing: the one red moment on the page */
.close-s{background:var(--red);color:var(--white);padding-block:clamp(36px,4.6vw,56px)}
.close-in{display:grid;gap:16px}
.close-s h2{font:400 clamp(2.6rem,5.4vw,4.2rem)/1.02 var(--serif)}
.close-s p{font-size:1.5rem;line-height:1.25;margin-top:6px}
.b-white{background:var(--white);border-color:var(--white);color:var(--char)}
@media(min-width:860px){.close-in{grid-template-columns:1fr auto;align-items:center;gap:48px}}

/* Footer */
.foot{background:var(--char);color:var(--white);padding:clamp(44px,6vw,72px) var(--edge) 28px}
.foot-in{display:grid;gap:24px}
.foot .logo{justify-self:start}
.foot .logo img{height:90px}
.foot p{max-width:24em}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 22px}
.foot nav a,.foot .link-btn{color:var(--foot2);font-weight:500;font-size:1rem;text-decoration:none}
.foot nav a:hover{color:var(--white)}
.foot .copy{color:var(--foot2);font-size:.9375rem}
@media(max-width:959px){.foot{padding-bottom:calc(var(--tab) + 28px)}}
@media(min-width:960px){.foot-in{grid-template-columns:auto 1fr;gap:28px 56px;align-items:center}.foot nav{grid-column:1/-1;padding-top:20px;border-top:1px solid rgba(255,255,255,.16)}.foot .copy{grid-column:1/-1}}

/* Inner page head */
.ph{padding:clamp(44px,7vw,92px) var(--edge) clamp(36px,5vw,60px)}
.ph h1{font:400 clamp(3rem,8vw,6.2rem)/1.02 var(--serif);color:var(--char);letter-spacing:-.01em;max-width:13em}
.ph>p:not(.crumb){margin-top:14px;font-size:clamp(1.1875rem,1.7vw,1.375rem);line-height:1.45;color:var(--slate);max-width:32em}
.crumb{font-size:1rem!important;font-weight:600;margin:0 0 10px!important}
.crumb a{color:var(--slate)}
.ph .actions{margin-top:22px}
.ph .search{margin-top:24px;display:flex;background:var(--white);border:1px solid var(--grey);border-radius:999px;padding:4px;max-width:620px}
.search input{color:var(--char)}
.ph .search button{background:var(--red);color:var(--white)}

/* Devotional */
.dv{display:grid;gap:40px;padding:clamp(36px,5vw,64px) var(--gut);max-width:var(--max);margin:0 auto}
@media(min-width:960px){.dv{grid-template-columns:7fr 5fr;gap:72px}}
.h-sm{font:400 1.75rem/1.1 var(--serif);color:var(--char);margin-bottom:14px}
.feat .meta{color:var(--slate);font-weight:500}
.feat img{border-radius:8px;margin-bottom:16px;width:100%;max-height:300px;object-fit:cover}
.feat h3{font:400 clamp(2.3rem,4.8vw,3.4rem)/1.05 var(--serif);color:var(--char);margin:6px 0 10px}
.feat h3 a{text-decoration:none}
.feat .ref{color:var(--char);font-weight:600}
.feat>p:not(.meta):not(.ref){color:var(--slate);font-size:1.125rem}
.feat .actions{margin-top:20px}
.cal caption{font:400 1.375rem/1.2 var(--serif);color:var(--char)}
.cal th{color:var(--slate)}
.cal span{background:transparent;color:var(--slate)}
.cal a{background:var(--ivory);color:var(--char);border:1px solid var(--grey);font-size:1.0625rem;font-weight:700;transition:border-color .2s,transform .2s var(--ease)}
.cal a:hover{background:var(--ivory);border-color:var(--char);transform:translateY(-2px)}
.cal .is-today a{background:var(--red);border-color:var(--red);color:var(--white);box-shadow:none;font-size:1.1875rem}
.cal .is-today span{box-shadow:inset 0 0 0 2px var(--red);color:var(--char)}
.cal-key{color:var(--slate)}
.arch{padding-bottom:clamp(40px,6vw,72px)}
.arch ul{border-bottom:1px solid var(--grey)}
.arch li{border-top:1px solid var(--grey)}
.arch a{display:grid;gap:2px 24px;padding:18px 0;text-decoration:none}
.arch b{font:400 1.875rem/1.1 var(--serif);color:var(--char)}
.arch i{font-style:normal;color:var(--char)}
.arch span{color:var(--slate)}
.arch a:hover b{text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:5px}
@media(min-width:760px){.arch a{grid-template-columns:280px 1fr auto;align-items:baseline}}
.d-list{border-bottom:1px solid var(--grey)}
.d-row{border-top-color:var(--grey)}
.d-date{color:var(--slate)}
.d-date b{font:400 2.75rem/.9 var(--serif);color:var(--char)}
.d-row h3{font:400 1.75rem/1.1 var(--serif);color:var(--char)}
.d-row .ref{color:var(--char)}
.d-row p:last-child{color:var(--slate)}
.btn-share{color:var(--char)}
.btn-share svg{stroke:var(--red)}
.empty{background:var(--white);border:1px solid var(--grey);border-radius:10px}
.empty h2{font:400 1.875rem/1.1 var(--serif);color:var(--char)}
.lead{color:var(--char)}
.pager a{color:var(--char)}
.pager span{color:var(--slate)}

/* Reader */
.is-reading .ph{padding-inline:max(var(--gut),calc((100vw - 720px)/2 + var(--gut)))}
.is-reading .ph h1{font-size:clamp(2.8rem,6vw,4.6rem)}
.site .reader-wrap{background:var(--white);border-top:1px solid var(--grey)}
.site .reader{padding:clamp(30px,5vw,56px) var(--gut) 56px}
.rd-date{color:var(--slate);font-weight:500;margin-bottom:8px}
.rd-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:22px}
.text-size button{background:var(--white);border:1px solid var(--grey);color:var(--char)}
.prose{color:var(--char)}
.prose h2{font:600 1.0625rem/1.3 var(--ui);color:var(--slate);margin-bottom:.6em}
.scripture{border-left:3px solid var(--red);padding-left:20px}
.scripture p{font:400 1.45em/1.35 var(--serif);color:var(--char)}
.scripture cite{color:var(--slate);font-weight:600}
.callout{background:var(--ivory);border:1px solid var(--grey);border-radius:10px;padding:22px}
.confession{background:var(--ivory);color:var(--char);border:1px solid var(--grey);border-left:3px solid var(--red);border-radius:0 10px 10px 0;padding:22px}
.confession h2{color:var(--slate)}
.confession p{font:400 1.5rem/1.3 var(--serif);color:var(--char)}
.prev-next a{border-top:1px solid var(--grey);color:var(--char)}
.prev-next span{color:var(--slate)}

/* Soul Winning */
.exec3{display:grid;gap:14px;padding:clamp(26px,4vw,40px);background:var(--white);border:1px solid var(--grey);border-radius:10px}
.exec3 h2{font:400 2.2rem/1.08 var(--serif);color:var(--char)}
.exec3 p{color:var(--slate);font-size:1.125rem}
@media(min-width:760px){.exec3{grid-template-columns:1fr auto;align-items:center;gap:40px}}

/* About */
.ab{display:grid;gap:18px;max-width:760px}
.ab .first{font:400 clamp(1.9rem,4vw,3rem)/1.18 var(--serif);color:var(--char);margin-bottom:12px}
.ab p:not(.first){font:400 1.1875rem/1.75 var(--read)}
.pas{display:grid;gap:30px}
.pas-photo{aspect-ratio:4/5;width:min(100%,380px);border-radius:10px;overflow:hidden;background:var(--grey);display:grid;place-items:center}
.pas-photo img{width:100%;height:100%;object-fit:cover}
.pas-photo .ph-note{color:var(--slate);font-weight:500}
.pas h2{font:400 clamp(2.6rem,6vw,4.4rem)/1.04 var(--serif);color:var(--char)}
.pas .role{color:var(--slate);font-weight:600;margin:6px 0 14px}
.pas .bio{font:400 1.25rem/1.65 var(--read);max-width:32em}
@media(min-width:860px){.pas{grid-template-columns:380px 1fr;align-items:center;gap:72px}}
.conv-list{counter-reset:c;margin-top:clamp(26px,3vw,40px);border-bottom:1px solid var(--grey)}
.conv-list li{counter-increment:c;position:relative;display:grid;padding:clamp(22px,3vw,34px) 0 clamp(22px,3vw,34px) clamp(52px,7vw,92px);border-top:1px solid var(--grey)}
.conv-list li::before{content:counter(c);position:absolute;left:0;top:clamp(16px,2.6vw,26px);font:400 clamp(2.4rem,4.4vw,3.4rem)/1 var(--serif);color:var(--red)}
.conv-list h3{font:400 clamp(1.75rem,3.6vw,2.75rem)/1.1 var(--serif);color:var(--char);max-width:22em}
.conv-list blockquote{font:400 1.125rem/1.7 var(--read);color:var(--char);max-width:40em;margin-top:10px}
.conv-list cite{font:600 1rem/1.3 var(--ui);color:var(--slate);margin-top:4px}
.m-end{font:400 clamp(1.75rem,3.6vw,2.6rem)/1.15 var(--serif);color:var(--char);max-width:24em;margin-top:clamp(30px,4vw,48px)}

/* Give */
.gv{display:grid;gap:40px;padding-block:clamp(10px,2vw,20px) clamp(56px,8vw,96px);align-items:start}
.acct2{background:var(--white);border:1px solid var(--grey);border-radius:10px;padding:clamp(24px,4vw,40px)}
.acct2 h2,.gv-intl h2{font:400 2rem/1.1 var(--serif);color:var(--char);margin-bottom:8px}
.acct2 dl>div{padding:14px 0;border-top:1px solid var(--grey)}
.acct2 dt{color:var(--slate);font-size:1rem}
.acct2 dd{font-size:1.25rem;font-weight:600;color:var(--char)}
.acct2 .no dd{font:400 clamp(2.9rem,10vw,4.4rem)/1.05 var(--serif);letter-spacing:.01em}
.acct2 .btn{margin-top:12px}
.gv-intl p{font-size:1.125rem;margin-bottom:.8em}
@media(min-width:880px){.gv{grid-template-columns:7fr 5fr;gap:72px}}

/* Contact */
.ct{display:grid;gap:0;padding-bottom:clamp(56px,8vw,96px)}
.ct>div{padding:24px 0;border-top:1px solid var(--grey)}
.ct h2{font-size:1.0625rem;font-weight:600;color:var(--slate);margin-bottom:8px}
.ct p,.ct address{font:400 clamp(1.625rem,2.8vw,2.1rem)/1.22 var(--serif);font-style:normal;color:var(--char);overflow-wrap:anywhere}
.ct a{color:var(--char);text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:5px}
@media(min-width:880px){.ct{grid-template-columns:repeat(3,1fr);gap:0 48px}}
@media(prefers-reduced-motion:reduce){.rw>span{animation:none;transform:none}}
