/* satchurch /gallery/ archive - editorial worship-night direction.
   Follows the site colour switch: light by default, dark under
   body.color-switch-dark. Tokens are scoped to the archive body (NOT :root, so
   generic names never leak site-wide) and are WCAG-AA in both modes.
   The head stays a violet banner in both modes because these pages use the
   transparent (white) overlay header, which is unreadable on a light band.
   Served as an excluded file so LiteSpeed never strips/defers it. */

body.post-type-archive-kt_gallery{
  /* LIGHT (default) */
  --ink:#f7f4fa; --surface:#ffffff; --panel:#ffffff;
  --accent:#7a3f95;            /* 6.0:1 on white */
  --accent-hover:#5e2f74;
  --text:#241a2e;              /* 14:1 on white  */
  --excerpt:#4a4155;           /* 8.6:1 on white */
  --muted:#635a70;             /* 6.2:1 on white */
  --line:rgba(84,46,104,.18); --line-soft:rgba(84,46,104,.10);
  --img-bg:#ece5f2;
  --badge-bg:rgba(255,255,255,.92); --badge-line:rgba(84,46,104,.3);
  --shadow:0 20px 44px -22px rgba(45,20,60,.4);
  --hero-a:#2a1640; --hero-b:#3d1f52;
  --hero-ink:#ffffff; --hero-muted:#e6dcf0; --hero-eyebrow:#e0b6f2;
  background:var(--ink)
}
body.post-type-archive-kt_gallery.color-switch-dark{
  /* DARK */
  --ink:#0b0710; --surface:#17111f; --panel:#1f1730;
  --accent:#c48ae0;            /* 8.4:1 on #0b0710 */
  --accent-hover:#e0b6f2;
  --text:#f5f1f8; --excerpt:#c6bad6; --muted:#b3a7c4;
  --line:rgba(196,138,224,.22); --line-soft:rgba(196,138,224,.12);
  --img-bg:#1a1023;
  --badge-bg:rgba(11,7,16,.74); --badge-line:rgba(196,138,224,.45);
  --shadow:0 20px 44px -22px rgba(0,0,0,.85);
  --hero-a:#1d1030; --hero-b:#0b0710;
  --hero-ink:#f5f1f8; --hero-muted:#c6bad6; --hero-eyebrow:#d5a5ee;
}
.post-type-archive-kt_gallery #wrapper,
.post-type-archive-kt_gallery #inner-wrap,
.post-type-archive-kt_gallery .content-container,
.post-type-archive-kt_gallery main{background:transparent}

.satarch{overflow-x:hidden}
.satarch-inner{max-width:1280px;margin:0 auto;padding:0 1.3rem}

/* ---- head banner (top pad clears the transparent overlay header) ---- */
.satarch-head{padding:clamp(6.5rem,13vh,9.5rem) 0 2.25rem;
  background:linear-gradient(180deg,var(--hero-a) 0%,var(--hero-b) 100%)}
.satarch-eyebrow{color:var(--hero-eyebrow);font-size:.72rem;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;margin:0 0 1rem}
.satarch-title{color:var(--hero-ink);font-size:clamp(2.4rem,8vw,4.6rem);font-weight:800;
  line-height:.98;letter-spacing:-.025em;margin:0}
.satarch-sub{color:var(--hero-muted);font-size:1.06rem;line-height:1.6;margin:1rem 0 0;max-width:46ch}

/* ---- featured (latest) ---- */
.satarch-grid-sec{padding:2.5rem 0 4.5rem}
.satarch-feat{display:grid;grid-template-columns:1fr;background:var(--panel);
  border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;
  margin:0 0 2.4rem;transition:border-color .3s ease,transform .3s ease,box-shadow .3s ease}
.satarch-feat:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:var(--shadow)}
.satarch-feat-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--img-bg)}
.satarch-feat-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.satarch-feat:hover .satarch-feat-media img{transform:scale(1.04)}
.satarch-feat-body{padding:1.9rem 1.6rem 2rem;display:flex;flex-direction:column}
.satarch-feat-year{font-size:clamp(3rem,9vw,4.6rem);font-weight:800;line-height:.85;
  color:var(--accent);letter-spacing:-.03em;margin:0 0 .7rem;font-feature-settings:"tnum"}
.satarch-feat-title{color:var(--text);font-size:clamp(1.5rem,3.4vw,2.25rem);font-weight:700;
  line-height:1.12;letter-spacing:-.015em;margin:0 0 .8rem}
.satarch-feat-excerpt{color:var(--excerpt);font-size:1.02rem;line-height:1.6;margin:0 0 1.3rem;max-width:52ch}
.satarch-feat-foot{display:flex;align-items:center;gap:1rem;margin-top:auto}
.satarch-cta{color:var(--accent);font-weight:700;font-size:.95rem;letter-spacing:.01em}
.satarch-cta::after{content:" \2192";transition:margin-left .2s ease}
.satarch-feat:hover .satarch-cta{color:var(--accent-hover)}
.satarch-feat:hover .satarch-cta::after{margin-left:.35rem}
.satarch-meta{color:var(--muted);font-size:.85rem;font-weight:600}
@media(min-width:820px){
  .satarch-feat{grid-template-columns:1.35fr 1fr;align-items:stretch}
  .satarch-feat-media{aspect-ratio:auto;min-height:100%}
  .satarch-feat-body{padding:2.6rem 2.4rem}
}

/* ---- masonry (staggered, pure CSS columns) ---- */
.satarch-masonry{column-count:1;column-gap:1.4rem}
@media(min-width:560px){.satarch-masonry{column-count:2}}
@media(min-width:1000px){.satarch-masonry{column-count:3}}

.satarch-card{display:block;break-inside:avoid;margin:0 0 1.4rem;background:var(--surface);
  border:1px solid var(--line-soft);border-radius:14px;overflow:hidden;text-decoration:none;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.satarch-card:hover{transform:translateY(-4px);border-color:var(--line);box-shadow:var(--shadow)}
.satarch-card-media{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--img-bg)}
/* staggered heights break the flow */
.satarch-card:nth-child(3n) .satarch-card-media{aspect-ratio:4/5}
.satarch-card:nth-child(5n) .satarch-card-media{aspect-ratio:1/1}
.satarch-card:nth-child(7n) .satarch-card-media{aspect-ratio:16/10}
.satarch-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}
.satarch-card:hover .satarch-card-media img{transform:scale(1.05)}
.satarch-badge{position:absolute;top:.7rem;right:.7rem;z-index:2;
  background:var(--badge-bg);color:var(--accent);font-size:.66rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;padding:.3rem .62rem;border-radius:999px;
  border:1px solid var(--badge-line);backdrop-filter:blur(4px)}

.satarch-card-body{padding:1.05rem 1.2rem 1.25rem}
.satarch-card-year{color:var(--accent);font-size:1.5rem;font-weight:800;line-height:1;
  letter-spacing:-.02em;margin:0 0 .45rem;font-feature-settings:"tnum"}
.satarch-card-title{color:var(--text);font-size:1.18rem;font-weight:700;line-height:1.22;
  letter-spacing:-.01em;margin:0 0 .5rem;transition:color .2s ease}
.satarch-card:hover .satarch-card-title{color:var(--accent)}
.satarch-card-excerpt{color:var(--excerpt);font-size:.9rem;line-height:1.5;margin:0 0 .85rem}
.satarch-card-meta{color:var(--muted);font-size:.8rem;font-weight:600;margin:0;
  padding-top:.7rem;border-top:1px solid var(--line-soft)}

.satarch-empty{color:var(--muted);font-size:1.05rem;padding:2rem 0}

/* ---- accessibility ---- */
/* visible keyboard focus (theme sets a global hide-focus-outline) */
.satarch-feat:focus-visible,
.satarch-card:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
/* Dark mode only: the shared footer's palette text is unreadable on the dark bg.
   In light mode the theme's own footer colours are already correct. */
body.color-switch-dark.post-type-archive-kt_gallery .footer-navigation-wrap a{color:#c9b4de !important}
body.color-switch-dark.post-type-archive-kt_gallery .footer-navigation-wrap a:hover{color:#fff !important}
body.color-switch-dark.post-type-archive-kt_gallery .footer-html-inner,
body.color-switch-dark.post-type-archive-kt_gallery .footer-html-inner p,
body.color-switch-dark.post-type-archive-kt_gallery .footer-html-inner a{color:#b3a7c4 !important}
/* skip-link target (theme's #main mismatch): don't ring the whole content box */
.satarch:focus{outline:none}

@media(prefers-reduced-motion:reduce){
  .satarch-card,.satarch-feat,.satarch-card-media img,.satarch-feat-media img,.satarch-cta::after{transition:none}
}
