/* Called by Name 2026 · Magic UI–style layer (vanilla CSS), on SBVOC navy/copper tokens.
   Effects: shimmer button, border beam, word rotate, aurora text, marquee with edge fade,
   pulsating badge, number ticker, text-reveal on scroll, animated timeline beam.
   Everything rests under prefers-reduced-motion. */
@property --cbn-a{syntax:"<angle>";inherits:false;initial-value:0deg}

/* ---------- Aurora / animated gradient text ---------- */
.cbn-aurora{background:linear-gradient(90deg,#D29A52,#F3C98B,#E8B46F,#D29A52);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent!important;animation:cbn-aurora 8s ease-in-out infinite}
@keyframes cbn-aurora{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

/* ---------- Word rotate ---------- */
.cbn-rotate{display:inline-grid;vertical-align:bottom;overflow:hidden;height:1.12em;line-height:1.12}
.cbn-rotate span{grid-area:1/1;transform:translateY(110%);opacity:0;transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .6s;white-space:nowrap}
.cbn-rotate span.on{transform:none;opacity:1}
.cbn-rotate span.off{transform:translateY(-110%);opacity:0}

/* ---------- Shimmer button ---------- */
.cbn-shimmer{position:relative;overflow:hidden;isolation:isolate;box-shadow:0 10px 30px -12px rgba(210,154,82,.75)}
.cbn-shimmer::before{content:"";position:absolute;inset:-2px;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.65) 48%,transparent 66%);background-size:250% 100%;animation:cbn-shim 2.8s linear infinite}
@keyframes cbn-shim{from{background-position:150% 0}to{background-position:-100% 0}}

/* ---------- Pulsating badge ---------- */
.cbn-badge{display:inline-flex;align-items:center;gap:10px;font:700 .74rem/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--gold);padding:9px 14px 9px 12px;border-radius:99px}
.cbn-badge i{width:8px;height:8px;border-radius:50%;background:var(--ink);position:relative}
.cbn-badge i::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--ink);animation:cbn-pulse 1.8s ease-out infinite}
@keyframes cbn-pulse{from{transform:scale(1);opacity:.7}to{transform:scale(3);opacity:0}}

/* ---------- Border beam ---------- */
.cbn-beam{position:relative;isolation:isolate}
.cbn-beam::after{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:2px;pointer-events:none;z-index:3;
  background:conic-gradient(from var(--cbn-a),transparent 0 72%,#D29A52 84%,#F3C98B 91%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:cbn-spin 6s linear infinite}
@keyframes cbn-spin{to{--cbn-a:360deg}}

/* ---------- Marquee ---------- */
.cbn-marquee{overflow:hidden;background:var(--ink);color:#E9DCC6;padding-block:16px;-webkit-mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.cbn-marquee .trk{display:flex;gap:40px;width:max-content;animation:cbn-mq 38s linear infinite;font:500 1.15rem/1 var(--f-display);font-style:italic;white-space:nowrap}
.cbn-marquee .trk span::after{content:"✠";font-style:normal;color:var(--gold);margin-left:40px;font-size:.85rem}
.cbn-marquee:hover .trk{animation-play-state:paused}
@keyframes cbn-mq{to{transform:translateX(-50%)}}

/* ---------- Stats with number ticker ---------- */
.cbn-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14);border-radius:12px;overflow:hidden;margin-top:34px}
.cbn-stats div{background:rgba(19,30,41,.55);padding:18px 20px;display:grid;gap:4px}
.cbn-stats b{font:700 clamp(1.8rem,3.4vw,2.6rem)/1 var(--f-display);color:var(--gold);font-variant-numeric:tabular-nums}
.cbn-stats small{font:600 .7rem/1.3 var(--f-label);letter-spacing:.16em;text-transform:uppercase;color:#C9D5DD}

/* ---------- Timeline with drawing beam ---------- */
.cbn-tl{position:relative;list-style:none;margin:28px 0 0;padding:0 0 0 34px;display:grid;gap:22px}
.cbn-tl::before{content:"";position:absolute;left:9px;top:6px;bottom:6px;width:2px;background:var(--line)}
.cbn-tl .beam{position:absolute;left:9px;top:6px;width:2px;height:calc(100% - 12px);background:linear-gradient(var(--gold),#F3C98B);transform-origin:top;transform:scaleY(var(--p,1))}
.cbn-tl li{position:relative}
.cbn-tl li::before{content:"";position:absolute;left:-31px;top:4px;width:14px;height:14px;border-radius:50%;background:var(--white);border:3px solid var(--gold)}
.cbn-tl li.key::before{background:var(--gold);box-shadow:0 0 0 6px rgba(210,154,82,.2)}
.cbn-tl b{display:block;font:700 .78rem/1.2 var(--f-label);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink)}
.cbn-tl h3{font-size:1.25rem;color:var(--teal);margin-top:4px}
.cbn-tl p{color:var(--muted);font-size:.95rem;margin-top:4px}

/* ---------- Text reveal ---------- */
.cbn-reveal .w{opacity:.18;transition:opacity .2s}
.cbn-reveal .w.lit{opacity:1}

/* ---------- Called by Name page ---------- */
.cbn-hero h1 .cbn-aurora{font-style:italic;font-weight:400}
.cbn-hero .cbn-q{font:400 clamp(1.25rem,2.4vw,1.6rem)/1.3 var(--f-display);color:#fff;margin-top:6px}
.cbn-hero .cbn-q .cbn-rotate{color:var(--gold);font-style:italic}
.cbn-hero .crumbs{display:block;margin-bottom:16px}
.cbn-es{margin-top:12px;font-style:italic;font-size:1rem!important}
.cbn-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.cbn-hero figure{border-radius:16px!important}
.head h2 em,#parishes h2 em,#share h2 em{font-style:italic;font-weight:400;color:var(--gold-ink)}
.cbn-cite{font:600 .78rem/1 var(--f-label);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-ink);margin-top:12px}
.cbn-checks{list-style:none;margin:24px 0 18px;padding:0;display:grid;gap:12px}
.cbn-checks li{display:grid;grid-template-columns:24px 1fr;gap:10px}.cbn-checks li::before{content:"✠";color:var(--gold-ink)}
.cbn-form{background:var(--white);border:1px solid var(--line);border-radius:16px;padding:10px;min-width:0}
.cbn-form iframe{border-radius:10px}
.cbn-faq{display:grid;gap:10px;max-width:820px}
.cbn-faq details{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:18px 22px;transition:border-color .2s}
.cbn-faq details[open]{border-color:var(--gold)}
.cbn-faq summary{cursor:pointer;font:600 1.15rem/1.3 var(--f-display);color:var(--teal);list-style:none;display:flex;justify-content:space-between;gap:12px}
.cbn-faq summary::after{content:"+";color:var(--gold-ink);transition:transform .25s}
.cbn-faq details[open] summary::after{transform:rotate(45deg)}
.cbn-faq p{margin-top:10px;color:var(--muted)}
.linklist a span{color:var(--gold-ink);font-size:.85rem;white-space:nowrap}
.ctaband h2 em{font-style:italic;font-weight:400;color:var(--gold)}
.cbn-quote{background:var(--mist)}
.cbn-quote blockquote{margin:0 auto;max-width:28ch;text-align:center;font:400 clamp(1.7rem,3.6vw,2.7rem)/1.25 var(--f-display);font-style:italic;color:var(--teal);text-wrap:balance}
.cbn-quote cite{display:block;text-align:center;margin-top:18px;font:600 .78rem/1 var(--f-label);letter-spacing:.22em;color:var(--gold-ink);font-style:normal;text-transform:uppercase}

/* ---------- Homepage feature band ---------- */
.cbn-home{position:relative;background:var(--ink);color:var(--white);overflow:hidden;isolation:isolate}
.cbn-home::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(210,154,82,.38) 1.1px,transparent 1.4px),radial-gradient(700px circle at 85% 20%,rgba(210,154,82,.2),transparent 70%);background-size:22px 22px,100% 100%;-webkit-mask:radial-gradient(ellipse 80% 90% at 70% 40%,#000 25%,transparent 80%);mask:radial-gradient(ellipse 80% 90% at 70% 40%,#000 25%,transparent 80%)}
.cbn-home .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,5vw,64px);align-items:center;padding-block:clamp(48px,7vw,88px)}
.cbn-home h2{font-size:clamp(2.2rem,5vw,3.8rem);font-weight:700;line-height:1;margin-top:18px}
.cbn-home h2 em{font-style:italic;font-weight:400}
.cbn-home .q{font:400 clamp(1.2rem,2.2vw,1.5rem)/1.35 var(--f-display);margin-top:16px;color:#E6EDF2}
.cbn-home .q .cbn-rotate{color:var(--gold);font-style:italic}
.cbn-home p.l{color:#C9D5DD;margin-top:14px;max-width:56ch}
.cbn-home .ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px;align-items:center}
.cbn-home .ctas a.sec{color:var(--white);font-weight:700;text-decoration:none;border-bottom:1.5px solid var(--gold);padding-bottom:3px}
.cbn-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:26px;display:grid;gap:16px;backdrop-filter:blur(6px)}
.cbn-card .when{display:grid;gap:12px}
.cbn-card .when div{display:flex;justify-content:space-between;gap:12px;align-items:baseline;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:12px}
.cbn-card .when small{font:600 .7rem/1.2 var(--f-label);letter-spacing:.18em;text-transform:uppercase;color:#AFC0CC}
.cbn-card .when b{font:600 1.25rem/1 var(--f-display);color:var(--white)}
.cbn-card .count{display:flex;gap:10px;align-items:baseline}
.cbn-card .count b{font:700 3rem/1 var(--f-display);color:var(--gold);font-variant-numeric:tabular-nums}
.cbn-card .count span{color:#C9D5DD;font-size:.95rem}
.cbn-card .verse{font:400 1.05rem/1.4 var(--f-display);font-style:italic;color:#E6EDF2}
.cbn-card .verse small{display:block;font:600 .68rem/1 var(--f-label);font-style:normal;letter-spacing:.2em;color:var(--gold);margin-top:6px}
@media (max-width:860px){.cbn-home .wrap{grid-template-columns:1fr}.cbn-stats{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  .cbn-aurora,.cbn-shimmer::before,.cbn-badge i::after,.cbn-beam::after,.cbn-marquee .trk{animation:none!important}
  .cbn-reveal .w{opacity:1}
}

/* Linked photo cards (Signs you might notice) */
.cbn-photolink{display:block;text-decoration:none;color:inherit;border-radius:var(--r);transition:transform .35s ease}
.cbn-photolink:hover{transform:translateY(-4px)}
.cbn-photolink .photo img{transition:transform .8s ease}
.cbn-photolink:hover .photo img{transform:scale(1.05)}
.cbn-photolink .go{display:inline-block;margin-top:6px;font:700 .72rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.cbn-photolink:focus-visible{outline:3px solid var(--gold);outline-offset:3px}

/* Share section: form box sizes to the form; scripture side stays in view on desktop */
#share .grid2{align-items:start}
.cbn-form iframe{display:block;transition:height .35s ease}
@media (min-width:901px){#share .cbn-sharecopy{position:sticky;top:110px}}