/* Shared Kadence row classes of the redesigned pages. Loads only where the content uses a sathome- or
   satpage- class (satchurch-pages.php). Mobile first. Flipping surfaces use palette vars only, so the
   site colour switch needs no per-mode block; the violet heroes and closing panels are static (same in
   both modes). Extra .single-content beats Kadence's per-row id rules and .alignfull.
   Homepage rows (snapshots/2026-10-05-home-feed): sathome-hero, sathome-facts, sathome-panel, sathome-prayer.
   Inner pages (snapshots/2026-10-05-inner-pages): satpage-hero, satpage-portrait, satpage-reading, satpage-map,
   satpage-bank, satpage-steps, satpage-toc, satpage-toc-column, satpage-value; the about page adds satpage-about,
   satpage-section, satpage-card, satpage-doctrine, satpage-story, satpage-quote, satpage-callout, satpage-up. */

/* Curved hero. The scrim or band ends in deep violet and gets an accent rim, so the curve still reads in
   dark mode where the page below is near black. */
.single-content .kb-row-layout-wrap.sathome-hero{border-radius:0 0 50% 50% / 0 0 64px 64px;overflow:hidden;
  box-shadow:0 1px 0 color-mix(in srgb, var(--global-palette1) 35%, transparent)}
/* Kadence buttons in the hero and violet panels match the feed buttons (Kadence's default is 1.125rem regular) */
.single-content .sathome-hero .kb-buttons-wrap .kb-button,.single-content .sathome-prayer .kb-buttons-wrap .kb-button{
  min-height:44px;padding:.55rem 1.15rem;font-size:.95rem;font-weight:700;line-height:1.2}
.sathome-prayer h2,.satpage-hero h1{text-wrap:balance}
.single-content .kb-row-layout-wrap.sathome-facts{position:relative;z-index:2;margin-top:-3.25rem;background:transparent}
.single-content .kb-row-layout-wrap.sathome-facts > .kt-row-column-wrap{margin:0 1rem;padding:.25rem 1.25rem;row-gap:0;
  border:1px solid color-mix(in srgb, var(--global-palette3) 10%, transparent);border-radius:20px;
  background:var(--global-palette8);box-shadow:0 22px 44px -26px rgba(13,9,18,.55)}
.sathome-facts .wp-block-kadence-column + .wp-block-kadence-column{border-top:1px solid color-mix(in srgb, var(--global-palette3) 12%, transparent)}
.sathome-facts .kt-inside-inner-col{padding:1rem 0}
.sathome-facts a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
/* overflow:clip, not hidden: hidden makes the panel a scroll container and a card's view()
   scroll animation would then follow the panel instead of the page */
.single-content .kb-row-layout-wrap.sathome-panel{width:auto;margin:1rem .75rem;border-radius:28px;overflow:hidden;overflow:clip}
.single-content .kb-row-layout-wrap.sathome-prayer{background-image:
  radial-gradient(90% 120% at 100% 0%, rgba(196,138,224,.32), transparent 60%),
  radial-gradient(70% 90% at 0% 100%, rgba(144,79,172,.38), transparent 60%)}

/* Inner page hero: the deep violet band under the transparent header, with the closing panel's glow */
.single-content .kb-row-layout-wrap.satpage-hero{background-image:
  radial-gradient(80% 90% at 100% 0%, rgba(196,138,224,.28), transparent 62%),
  radial-gradient(70% 80% at 0% 100%, rgba(144,79,172,.36), transparent 62%)}
.satpage-portrait img{box-shadow:0 0 0 1px rgba(224,182,242,.35),0 32px 60px -28px rgba(0,0,0,.7)}

/* Reading text of the inner pages: a size up from the theme body, Kadence headings keep their own sizes */
.single-content .satpage-reading :is(p:not(.wp-block-kadence-advancedheading),li){font-size:1.0625rem;line-height:1.7}

/* Contacts: map and bank details */
.satpage-map{border-radius:24px;overflow:hidden;box-shadow:0 0 0 1px color-mix(in srgb, var(--global-palette3) 14%, transparent)}
.satpage-map iframe{display:block}
.single-content .satpage-bank p{margin:0 0 .85rem}
.satpage-bank strong{color:var(--global-palette3);overflow-wrap:anywhere;-webkit-user-select:all;user-select:all}

/* Values: numbered example list in the introduction */
.single-content ol.satpage-steps{display:grid;gap:.75rem;margin:0 0 1.5rem;padding:1.25rem;list-style:none;counter-reset:satpage-step;
  border-radius:20px;background:var(--global-palette7);color:var(--global-palette3)}
.satpage-steps li{position:relative;padding-left:2.5rem;counter-increment:satpage-step;line-height:1.55}
.satpage-steps li::before{content:counter(satpage-step);position:absolute;left:0;top:-.1rem;display:grid;place-items:center;
  width:1.75rem;height:1.75rem;border-radius:50%;background:var(--global-palette1);color:var(--global-palette9);
  font-size:.85rem;font-style:normal;font-weight:700}

/* Values: contents list, numbered like the cards */
.single-content ol.satpage-toc{margin:0;padding:0;list-style:none;counter-reset:satpage-toc}
.satpage-toc li{margin:0;border-bottom:1px solid color-mix(in srgb, var(--global-palette3) 12%, transparent);counter-increment:satpage-toc}
.single-content .satpage-toc a{display:grid;grid-template-columns:2.25rem minmax(0,1fr);align-items:baseline;min-height:44px;
  padding:.65rem .5rem;border-radius:12px;color:var(--global-palette3);font-size:.98rem;font-weight:600;line-height:1.35;
  text-decoration:none;transition:background .2s ease}
.satpage-toc a::before{content:counter(satpage-toc, decimal-leading-zero);color:var(--global-palette2);
  font-family:var(--global-heading-font-family, inherit);font-size:.85rem;font-weight:700}
.satpage-toc a:hover{background:color-mix(in srgb, var(--global-palette1) 9%, transparent)}
/* satpages.js marks the link of the part being read */
.satpage-toc a[aria-current]{background:color-mix(in srgb, var(--global-palette1) 12%, transparent);
  box-shadow:inset 3px 0 0 var(--global-palette1)}
.satpage-toc a:focus-visible{outline:3px solid var(--global-palette1);outline-offset:2px}

/* Numbered cards: values, and the about page's goals, reasons and duties (surface, radius, hairline and padding are
   Kadence column settings) */
.single-content .kb-row-layout-wrap:is(.satpage-value,.satpage-card){scroll-margin-top:1.5rem}
:is(.satpage-value,.satpage-card) .wp-block-kadence-column > .kt-inside-inner-col{box-shadow:0 18px 40px -34px rgba(13,9,18,.5)}
.single-content :is(.satpage-value,.satpage-card) p:not(.wp-block-kadence-advancedheading){margin:0 0 .9rem}
.single-content :is(.satpage-value,.satpage-card) ul{margin:0 0 .9rem;padding-left:1.1rem}
.single-content :is(.satpage-value,.satpage-card) ul ul{margin:.45rem 0 0;padding-left:1rem}
.single-content :is(.satpage-value,.satpage-card) li{margin-bottom:.45rem}
:is(.satpage-value,.satpage-card,.satpage-about) li::marker{color:var(--global-palette1)}
.single-content :is(.satpage-value,.satpage-card,.satpage-story) .kt-inside-inner-col > :last-child{margin-bottom:0}

/* About page: the contents list as a card, sections split by a hairline, scripture quotes, callouts, testimony,
   doctrine rows, and the link back to the contents on phones and tablets */
.single-content .satpage-about ol.satpage-toc{padding:.5rem;border-radius:20px;background:var(--global-palette8)}
.satpage-about .satpage-toc li:last-child{border-bottom:0}
.single-content .kb-row-layout-wrap.satpage-section{scroll-margin-top:1.5rem}
.single-content .kb-row-layout-wrap.satpage-section{margin-top:2.5rem;padding-top:2.5rem;
  border-top:1px solid color-mix(in srgb, var(--global-palette3) 14%, transparent)}
.single-content .satpage-about blockquote.satpage-quote{margin:1.25rem 0 1.5rem;padding:1.1rem 1.25rem;border:0;border-radius:18px;
  background:var(--global-palette8);color:var(--global-palette3);font-style:italic}
.single-content .satpage-about .satpage-quote p{margin:0 0 .6rem}
.satpage-quote cite{display:block;margin-top:.6rem;color:var(--global-palette2);font-size:.9rem;font-style:normal;font-weight:700;
  letter-spacing:0;text-transform:none}
.single-content .satpage-about p.satpage-callout{margin:1.75rem 0;padding:.2rem 0 .2rem 1.1rem;border-left:4px solid var(--global-palette1);
  color:var(--global-palette3);font-family:var(--global-heading-font-family, inherit);font-size:1.2rem;font-weight:600;line-height:1.5}
.single-content .satpage-about .satpage-story p{margin:0 0 .9rem}
.single-content .kb-row-layout-wrap.satpage-doctrine{border-top:1px solid color-mix(in srgb, var(--global-palette3) 12%, transparent)}
.single-content .satpage-about .satpage-doctrine p:not(.wp-block-kadence-advancedheading){margin:0 0 .8rem}
.single-content .satpage-doctrine .kt-inside-inner-col > :last-child{margin-bottom:0}
.single-content .satpage-about p.satpage-up{margin:1.5rem 0 0;font-size:.95rem}
.satpage-up a{display:inline-flex;align-items:center;min-height:44px;color:var(--global-palette1);font-weight:700;text-decoration:none}
.satpage-up a:hover{text-decoration:underline}

@media (min-width:768px){
  .single-content .kb-row-layout-wrap.sathome-hero{border-bottom-left-radius:50% 72px;border-bottom-right-radius:50% 72px}
  .single-content .kb-row-layout-wrap.sathome-facts{margin-top:-3rem}
  .single-content .kb-row-layout-wrap.sathome-facts > .kt-row-column-wrap{margin:0 auto;max-width:min(1226px, calc(100% - 4rem));padding:.5rem 0}
  .sathome-facts .wp-block-kadence-column + .wp-block-kadence-column{border-top:0;border-left:1px solid color-mix(in srgb, var(--global-palette3) 12%, transparent)}
  .sathome-facts .kt-inside-inner-col{padding:1.25rem 2rem}
  .single-content .kb-row-layout-wrap.sathome-panel{margin:1.5rem;border-radius:40px}
  .single-content ol.satpage-steps{padding:1.5rem 1.75rem}
  .single-content .satpage-reading :is(p:not(.wp-block-kadence-advancedheading),li){font-size:1.125rem}
  .single-content :is(.satpage-value,.satpage-card) ul{padding-left:1.35rem}
  .single-content .satpage-about blockquote.satpage-quote{padding:1.35rem 1.6rem}
  .single-content .satpage-about p.satpage-callout{font-size:1.35rem}
}
/* The contents list follows the reader beside the cards once they sit side by side. The column is
   full height (Kadence "inner column height 100%"), so the list has room to stick inside it. */
@media (min-width:1025px){
  .satpage-toc-column .satpage-toc{position:sticky;top:1.5rem}
  .single-content .satpage-about p.satpage-up{display:none}
}
/* Cards rise into place as they scroll in (browsers with scroll-driven animations; others show them as is) */
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    :is(.satpage-value,.satpage-card) .wp-block-kadence-column{animation:satpage-rise linear both;animation-timeline:view();animation-range:entry 0% cover 12%}
  }
}
@keyframes satpage-rise{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
@media (prefers-reduced-motion:reduce){
  .satpage-toc a{transition:none}
}
