@charset "UTF-8";
/**
 * City of God Theme - Main Stylesheet
 *
 * This file imports all SCSS partials in the correct order.
 * Compiled output goes to assets/dist/css/main.css
 *
 * @package COG_Theme
 * @since   1.0.0
 */
/**
 * Color Design Tokens
 *
 * COG Brand Colors - PLACEHOLDER VALUES
 * These hex values were proposed in the design audit and are pending final sign-off.
 * Update these values once brand colors are officially approved.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
/**
 * Typography Design Tokens
 *
 * Font pairings - PLACEHOLDER VALUES
 * Proposed: Fraunces (display/headings) + Public Sans (body)
 * Alternative: Source Serif 4 (headings) + Karla (body)
 * Pending final design sign-off.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
/**
 * Spacing Design Tokens
 *
 * Consistent spacing scale for margins, paddings, and gaps.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
/**
 * Breakpoint Design Tokens
 *
 * Responsive breakpoints following mobile-first approach.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
/**
 * Shadow Design Tokens
 *
 * Box shadow scale for elevation and depth.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
/**
 * Transition Design Tokens
 *
 * Animation and transition timing values.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fade-up {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes slide-in-left {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0);
  }
}
@keyframes slide-in-right {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}
@keyframes scale-up {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
/**
 * CSS Reset
 *
 * Modern CSS reset based on Josh Comeau's reset with modifications.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

body {
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

h1, h2, h3, h4, h5, h6,
button,
input,
label {
  line-height: 1.2;
}

p {
  text-wrap: pretty;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

ul,
ol {
  list-style: none;
  padding: 0;
}

a {
  color: inherit;
  text-decoration: inherit;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}

fieldset {
  border: none;
  padding: 0;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

#root,
#__next,
#page {
  isolation: isolate;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
:focus:not(:focus-visible) {
  outline: none;
}

:focus-visible {
  outline: 2px solid var(--color-focus, currentColor);
  outline-offset: 2px;
}

::selection {
  background-color: var(--color-gold, #A97423);
  color: var(--color-white, #FFFFFF);
}

/**
 * Root Custom Properties
 *
 * CSS custom properties (variables) defined on :root.
 * These are the runtime-accessible design tokens.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
:root {
  --color-gold: #A97423;
  --color-gold-light: rgb(215.625, 156, 64.875);
  --color-gold-dark: rgb(126.75, 87, 26.25);
  --color-brown: #6B4F35;
  --color-brown-light: rgb(158.159375, 116.771875, 78.340625);
  --color-brown-dark: rgb(72.89375, 53.81875, 36.10625);
  --color-silver: #767D87;
  --color-silver-light: rgb(158.685770751, 163.6798418972, 170.814229249);
  --color-silver-dark: rgb(94.2134387352, 99.8023715415, 107.7865612648);
  --color-ink: #211A14;
  --color-paper: #EDEDEC;
  --color-white: #FFFFFF;
  --color-primary: var(--color-gold);
  --color-secondary: var(--color-brown);
  --color-accent: var(--color-silver);
  --color-text: var(--color-ink);
  --color-text-secondary: var(--color-silver);
  --color-text-muted: rgba(33, 26, 20, 0.6);
  --color-text-inverse: var(--color-white);
  --color-bg: var(--color-white);
  --color-bg-secondary: var(--color-paper);
  --color-bg-dark: var(--color-ink);
  --color-border: rgba(33, 26, 20, 0.1);
  --color-border-dark: rgba(33, 26, 20, 0.2);
  --color-link: var(--color-gold);
  --color-link-hover: var(--color-gold-dark);
  --color-focus: var(--color-gold);
  --color-focus-ring: rgba(169, 116, 35, 0.4);
  --color-success: #2E7D32;
  --color-warning: #ED6C02;
  --color-error: #D32F2F;
  --color-info: #0288D1;
  --font-display: Fraunces, Georgia, Times New Roman, serif;
  --font-body: Public Sans, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, sans-serif;
  --font-mono: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-h6: 1rem;
  --font-size-h5: 1.25rem;
  --font-size-h4: 1.5rem;
  --font-size-h3: 1.75rem;
  --font-size-h2: 2.25rem;
  --font-size-h1: 3rem;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --line-height-tight: 1.2;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.625;
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-3: 0.75rem;
  --spacing-4: 1rem;
  --spacing-5: 1.25rem;
  --spacing-6: 1.5rem;
  --spacing-8: 2rem;
  --spacing-10: 2.5rem;
  --spacing-12: 3rem;
  --spacing-16: 4rem;
  --spacing-20: 5rem;
  --spacing-24: 6rem;
  --section-padding: 4rem;
  --container-padding: 1rem;
  --container-max-width: 1200px;
  --content-max-width: 75ch;
  --header-height: 80px;
  --footer-min-height: 300px;
  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  --duration-fast: 150ms;
  --duration-normal: 300ms;
  --duration-slow: 500ms;
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-full: 9999px;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal-backdrop: 400;
  --z-modal: 500;
  --z-popover: 600;
  --z-tooltip: 700;
}

@media (min-width: 768px) {
  :root {
    --container-padding: 1.5rem;
    --header-height: 100px;
  }
}
@media (min-width: 1024px) {
  :root {
    --container-padding: 2rem;
    --section-padding: 5rem;
  }
}
/**
 * Base Typography Styles
 *
 * Default typography styles for HTML elements.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
body {
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-normal);
  color: var(--color-text);
  background-color: var(--color-bg);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: var(--spacing-4);
}

h1 {
  font-size: var(--font-size-h1);
}
@media (max-width: 767px) {
  h1 {
    font-size: calc(var(--font-size-h1) * 0.75);
  }
}

h2 {
  font-size: var(--font-size-h2);
}
@media (max-width: 767px) {
  h2 {
    font-size: calc(var(--font-size-h2) * 0.8);
  }
}

h3 {
  font-size: var(--font-size-h3);
}

h4 {
  font-size: var(--font-size-h4);
}

h5 {
  font-size: var(--font-size-h5);
}

h6 {
  font-size: var(--font-size-h6);
}

p {
  margin-bottom: var(--spacing-4);
}
p:last-child {
  margin-bottom: 0;
}

.lead {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
}

strong,
b {
  font-weight: var(--font-weight-bold);
}

em,
i {
  font-style: italic;
}

small {
  font-size: var(--font-size-sm);
}

mark {
  background-color: var(--color-gold-light);
  padding: 0.125em 0.25em;
  border-radius: var(--radius-sm);
}

del {
  text-decoration: line-through;
}

ins {
  text-decoration: underline;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

code,
kbd,
samp,
pre {
  font-family: var(--font-mono);
  font-size: var(--font-size-sm);
}

code {
  background-color: var(--color-bg-secondary);
  padding: 0.125em 0.375em;
  border-radius: var(--radius-sm);
}

pre {
  background-color: var(--color-bg-secondary);
  padding: var(--spacing-4);
  border-radius: var(--radius-md);
  overflow-x: auto;
  margin-bottom: var(--spacing-4);
}
pre code {
  background-color: transparent;
  padding: 0;
  border-radius: 0;
}

kbd {
  background-color: var(--color-ink);
  color: var(--color-white);
  padding: 0.125em 0.375em;
  border-radius: var(--radius-sm);
}

blockquote {
  margin: var(--spacing-6) 0;
  padding: var(--spacing-4) var(--spacing-6);
  border-left: 4px solid var(--color-gold);
  background-color: var(--color-bg-secondary);
  font-style: italic;
}
blockquote p {
  margin-bottom: var(--spacing-2);
}
blockquote p:last-child {
  margin-bottom: 0;
}
blockquote cite {
  display: block;
  margin-top: var(--spacing-2);
  font-size: var(--font-size-sm);
  font-style: normal;
  color: var(--color-text-secondary);
}
blockquote cite::before {
  content: "— ";
}

hr {
  border: none;
  border-top: 1px solid var(--color-border);
  margin: var(--spacing-8) 0;
}

abbr[title] {
  text-decoration: underline dotted;
  cursor: help;
}

address {
  font-style: normal;
  line-height: var(--line-height-relaxed);
  margin-bottom: var(--spacing-4);
}

/**
 * Base Link Styles
 *
 * @package COG_Theme
 * @since   1.0.0
 */
a {
  color: var(--color-link);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
a:hover {
  color: var(--color-link-hover);
}
a:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/**
 * Base List Styles
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.entry-content ul,
.entry-content ol,
.page-content ul,
.page-content ol {
  margin-bottom: var(--spacing-4);
  padding-left: var(--spacing-6);
}
.entry-content ul,
.page-content ul {
  list-style-type: disc;
}
.entry-content ol,
.page-content ol {
  list-style-type: decimal;
}
.entry-content li,
.page-content li {
  margin-bottom: var(--spacing-2);
}
.entry-content li:last-child,
.page-content li:last-child {
  margin-bottom: 0;
}
.entry-content ul ul,
.entry-content ol ol,
.entry-content ul ol,
.entry-content ol ul,
.page-content ul ul,
.page-content ol ol,
.page-content ul ol,
.page-content ol ul {
  margin-top: var(--spacing-2);
  margin-bottom: 0;
}

dl {
  margin-bottom: var(--spacing-4);
}

dt {
  font-weight: var(--font-weight-bold);
  margin-bottom: var(--spacing-1);
}

dd {
  margin-left: var(--spacing-4);
  margin-bottom: var(--spacing-3);
}

/**
 * Base Media Styles
 *
 * Images, figures, iframes, embeds.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
img {
  height: auto;
  vertical-align: middle;
}

figure {
  margin: 0 0 var(--spacing-4);
}
figure img {
  margin-bottom: var(--spacing-2);
}

figcaption {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  text-align: center;
}

iframe {
  border: none;
  max-width: 100%;
}

.video-container,
.wp-block-embed__wrapper {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  margin-bottom: var(--spacing-4);
}
.video-container iframe,
.video-container object,
.video-container embed,
.video-container video,
.wp-block-embed__wrapper iframe,
.wp-block-embed__wrapper object,
.wp-block-embed__wrapper embed,
.wp-block-embed__wrapper video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.alignleft {
  float: left;
  margin-right: var(--spacing-4);
  margin-bottom: var(--spacing-4);
}

.alignright {
  float: right;
  margin-left: var(--spacing-4);
  margin-bottom: var(--spacing-4);
}

.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: var(--spacing-4);
}

.alignnone {
  margin-bottom: var(--spacing-4);
}

.alignwide {
  width: 100%;
  max-width: none;
}

.alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.gallery {
  display: grid;
  gap: var(--spacing-4);
  margin-bottom: var(--spacing-4);
}

.gallery-columns-2 {
  grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
  grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
  grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
  grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
  grid-template-columns: repeat(6, 1fr);
}

@media (max-width: 767px) {
  .gallery-columns-4,
  .gallery-columns-5,
  .gallery-columns-6 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.gallery-item {
  margin: 0;
}

.gallery-icon img {
  width: 100%;
  height: auto;
}

.gallery-caption {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  text-align: center;
  padding: var(--spacing-2);
}

/**
 * Base Form Styles
 *
 * Default form element styling.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
form {
  margin-bottom: var(--spacing-4);
}

fieldset {
  margin-bottom: var(--spacing-4);
}

legend {
  font-weight: var(--font-weight-bold);
  margin-bottom: var(--spacing-2);
}

label {
  display: block;
  font-weight: var(--font-weight-medium);
  margin-bottom: var(--spacing-1);
  color: var(--color-text);
}

input[type=text],
input[type=email],
input[type=password],
input[type=number],
input[type=tel],
input[type=url],
input[type=search],
input[type=date],
input[type=time],
input[type=datetime-local],
textarea,
select {
  display: block;
  width: 100%;
  padding: var(--spacing-3) var(--spacing-4);
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
  color: var(--color-text);
  background-color: var(--color-bg);
  border: 1px solid var(--color-border-dark);
  border-radius: var(--radius-md);
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
input[type=text]:hover,
input[type=email]:hover,
input[type=password]:hover,
input[type=number]:hover,
input[type=tel]:hover,
input[type=url]:hover,
input[type=search]:hover,
input[type=date]:hover,
input[type=time]:hover,
input[type=datetime-local]:hover,
textarea:hover,
select:hover {
  border-color: var(--color-silver);
}
input[type=text]:focus,
input[type=email]:focus,
input[type=password]:focus,
input[type=number]:focus,
input[type=tel]:focus,
input[type=url]:focus,
input[type=search]:focus,
input[type=date]:focus,
input[type=time]:focus,
input[type=datetime-local]:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--color-gold);
  box-shadow: 0 0 0 3px var(--color-focus-ring);
}
input[type=text]:disabled,
input[type=email]:disabled,
input[type=password]:disabled,
input[type=number]:disabled,
input[type=tel]:disabled,
input[type=url]:disabled,
input[type=search]:disabled,
input[type=date]:disabled,
input[type=time]:disabled,
input[type=datetime-local]:disabled,
textarea:disabled,
select:disabled {
  background-color: var(--color-bg-secondary);
  cursor: not-allowed;
  opacity: 0.6;
}
input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=password]::placeholder,
input[type=number]::placeholder,
input[type=tel]::placeholder,
input[type=url]::placeholder,
input[type=search]::placeholder,
input[type=date]::placeholder,
input[type=time]::placeholder,
input[type=datetime-local]::placeholder,
textarea::placeholder,
select::placeholder {
  color: var(--color-text-muted);
}

textarea {
  min-height: 150px;
  resize: vertical;
}

select {
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23211A14' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right var(--spacing-3) center;
  background-size: 16px 12px;
  padding-right: var(--spacing-10);
}

input[type=checkbox],
input[type=radio] {
  width: 1.25rem;
  height: 1.25rem;
  margin-right: var(--spacing-2);
  accent-color: var(--color-gold);
  cursor: pointer;
}

.form-check {
  display: flex;
  align-items: center;
  margin-bottom: var(--spacing-2);
}
.form-check label {
  font-weight: var(--font-weight-regular);
  margin-bottom: 0;
  cursor: pointer;
}

input[type=file] {
  padding: var(--spacing-2);
  font-size: var(--font-size-sm);
  border: 1px dashed var(--color-border-dark);
  border-radius: var(--radius-md);
  cursor: pointer;
}
input[type=file]::file-selector-button {
  padding: var(--spacing-2) var(--spacing-4);
  margin-right: var(--spacing-4);
  font-weight: var(--font-weight-medium);
  color: var(--color-white);
  background-color: var(--color-gold);
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
}

.search-form {
  display: flex;
  gap: var(--spacing-2);
}
.search-form .search-field {
  flex: 1;
}
.search-form .search-submit {
  flex-shrink: 0;
}

.form-error {
  color: var(--color-error);
  font-size: var(--font-size-sm);
  margin-top: var(--spacing-1);
}

.form-success {
  color: var(--color-success);
  font-size: var(--font-size-sm);
  margin-top: var(--spacing-1);
}

.form-help {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
  margin-top: var(--spacing-1);
}

/**
 * Base Table Styles
 *
 * @package COG_Theme
 * @since   1.0.0
 */
table {
  width: 100%;
  margin-bottom: var(--spacing-4);
  font-size: var(--font-size-sm);
}

caption {
  padding: var(--spacing-2);
  font-weight: var(--font-weight-bold);
  text-align: left;
}

thead {
  background-color: var(--color-bg-secondary);
}
thead th {
  font-weight: var(--font-weight-bold);
  text-align: left;
}

th,
td {
  padding: var(--spacing-3) var(--spacing-4);
  border-bottom: 1px solid var(--color-border);
  vertical-align: top;
}

tbody tr:hover {
  background-color: var(--color-bg-secondary);
}

.table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/**
 * Grid and Container Layout
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.container {
  width: 100%;
  max-width: var(--container-max-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--container-padding);
  padding-right: var(--container-padding);
}

.container--narrow {
  max-width: 768px;
}

.container--wide {
  max-width: 1400px;
}

.container--full {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

.section {
  padding-top: var(--section-padding);
  padding-bottom: var(--section-padding);
}

.section--sm {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.section--lg {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.section--dark {
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
}

.section--secondary {
  background-color: var(--color-bg-secondary);
}

.grid {
  display: grid;
  gap: 1.5rem;
}

.grid--auto-2 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
}

.grid--auto-3 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}

.grid--auto-4 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
}

@media (min-width: 640px) {
  .grid--2 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 640px) {
  .grid--3 {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .grid--3 {
    grid-template-columns: repeat(3, 1fr);
  }
}

.grid--4 {
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 768px) {
  .grid--4 {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1024px) {
  .grid--4 {
    grid-template-columns: repeat(4, 1fr);
  }
}

.archive-content {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .archive-content {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .archive-content {
    grid-template-columns: repeat(3, 1fr);
  }
}

.sermon-archive {
  display: block;
}
.sermon-archive .sermon-list {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .sermon-archive .sermon-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1280px) {
  .sermon-archive .sermon-list {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .has-sidebar {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 2rem;
  }
}
@media (min-width: 1280px) {
  .has-sidebar {
    grid-template-columns: 1fr 350px;
  }
}

.row {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}

.row--center {
  justify-content: center;
  align-items: center;
}

.row--between {
  justify-content: space-between;
}

.row--start {
  align-items: flex-start;
}

.row--end {
  align-items: flex-end;
}

.stack {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.stack--sm {
  gap: 1rem;
}

.stack--lg {
  gap: 2rem;
}

.stack--xl {
  gap: 3rem;
}

/**
 * Header Layout
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.site-header {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  background-color: var(--color-bg);
  border-bottom: 1px solid var(--color-border);
  transition: box-shadow 300ms cubic-bezier(0, 0, 0.2, 1);
}
.site-header.is-scrolled {
  box-shadow: var(--shadow-md);
}

.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0.75rem var(--container-padding);
  min-height: var(--header-height);
  gap: 1rem;
}
@media (min-width: 768px) {
  .site-header__inner {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

.site-branding {
  flex-shrink: 0;
}

.site-branding__link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
}
.site-branding__link:hover .site-title {
  color: var(--color-gold);
}
.site-branding__link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 4px;
  border-radius: var(--radius-sm);
}

.site-title {
  font-family: var(--font-display);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  color: var(--color-text);
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
@media (min-width: 768px) {
  .site-title {
    font-size: 1.5rem;
  }
}

.site-description {
  font-size: var(--font-size-xs);
  color: var(--color-text-secondary);
  margin-top: 2px;
}
@media (min-width: 768px) {
  .site-description {
    font-size: var(--font-size-sm);
  }
}

.custom-logo-link {
  display: block;
}
.custom-logo-link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 4px;
  border-radius: var(--radius-sm);
}

.custom-logo {
  max-height: 50px;
  width: auto;
}
@media (min-width: 768px) {
  .custom-logo {
    max-height: 70px;
  }
}

.page-header {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-border);
}

.page-title {
  font-family: var(--font-display);
  font-size: 2.25rem;
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) {
  .page-title {
    font-size: 3rem;
  }
}
.page-title span {
  color: var(--color-gold);
}

.archive-description {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: var(--content-max-width);
}
.archive-description p:last-child {
  margin-bottom: 0;
}

.entry-header {
  margin-bottom: 1.5rem;
}

.entry-title {
  font-family: var(--font-display);
  font-size: 2.25rem;
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: 0.75rem;
}
@media (min-width: 768px) {
  .entry-title {
    font-size: 3rem;
  }
}

.entry-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}
.entry-meta a {
  color: var(--color-gold);
  text-decoration: none;
}
.entry-meta a:hover {
  text-decoration: underline;
}

.posted-on,
.byline {
  display: inline;
}

.post-thumbnail {
  margin-bottom: 1.5rem;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.post-thumbnail img {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  object-fit: cover;
}

/**
 * Footer Layout
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.site-footer {
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
  padding: 4rem 0 2rem;
}
@media (min-width: 1024px) {
  .site-footer {
    padding-top: 5rem;
  }
}
.site-footer a {
  color: var(--color-text-inverse);
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.site-footer a:hover {
  color: var(--color-gold);
}

.site-footer__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.site-footer__cta {
  text-align: center;
  margin-bottom: 2.5rem;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.site-footer__cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 2rem;
  font-family: var(--font-body);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  text-decoration: none;
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-md);
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1), border-color 150ms cubic-bezier(0, 0, 0.2, 1), color 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), transform 150ms cubic-bezier(0, 0, 0.2, 1);
  min-height: 48px;
}
.site-footer__cta-button:hover {
  background-color: var(--color-gold-dark);
  color: var(--color-white);
  transform: translateY(-2px);
}
.site-footer__cta-button:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 4px;
}

.site-footer__text {
  text-align: center;
  margin-bottom: 2.5rem;
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  color: rgba(255, 255, 255, 0.85);
}

.site-footer__info {
  display: grid;
  gap: 2rem;
  margin-bottom: 2.5rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
@media (min-width: 768px) {
  .site-footer__info {
    grid-template-columns: 1fr 1fr;
  }
}

.site-footer__heading {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
  color: var(--color-gold);
}

.site-footer__subheading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  color: rgba(255, 255, 255, 0.7);
}

.site-footer__address,
.site-footer__phone,
.site-footer__email {
  margin-bottom: 0.5rem;
  line-height: var(--line-height-relaxed);
}

.site-footer__hours {
  margin-top: 1rem;
}
.site-footer__hours ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.site-footer__hours li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.25rem 0;
  font-size: var(--font-size-sm);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.site-footer__hours li:last-child {
  border-bottom: none;
}

.site-footer__hours-day {
  font-weight: var(--font-weight-medium);
}

.site-footer__hours-time {
  color: rgba(255, 255, 255, 0.7);
}

.site-footer__social-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.site-footer__social-item a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  font-size: var(--font-size-sm);
  text-decoration: none;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: var(--radius-md);
  min-height: 44px;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.site-footer__social-item a:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
}
.site-footer__social-item a:focus-visible {
  outline: 2px solid var(--color-white);
  outline-offset: 2px;
}

.site-footer__social-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.site-footer__social-icon::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: currentColor;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}
.site-footer__social-icon[data-icon=facebook]::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z'/%3E%3C/svg%3E");
}
.site-footer__social-icon[data-icon=instagram]::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z'/%3E%3C/svg%3E");
}
.site-footer__social-icon[data-icon=twitter]::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E");
}
.site-footer__social-icon[data-icon=youtube]::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z'/%3E%3C/svg%3E");
}
.site-footer__social-icon[data-icon=tv]::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Crect x='2' y='7' width='20' height='15' rx='2' ry='2'/%3E%3Cpolyline points='17 2 12 7 7 2'/%3E%3C/svg%3E");
}
.site-footer__social-icon[data-icon=radio]::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Cpath d='M16.24 7.76a6 6 0 0 1 0 8.49m-8.48-.01a6 6 0 0 1 0-8.49m11.31-2.82a10 10 0 0 1 0 14.14m-14.14 0a10 10 0 0 1 0-14.14'/%3E%3C/svg%3E");
}

.site-footer__copyright {
  text-align: center;
  font-size: var(--font-size-sm);
  color: rgba(255, 255, 255, 0.6);
}
.site-footer__copyright p {
  margin-bottom: 0.5rem;
}

.site-footer__disclaimer {
  display: block;
  margin-top: 0.25rem;
  font-size: var(--font-size-xs);
  color: rgba(255, 255, 255, 0.5);
}

.site-footer__credit {
  margin-top: 1rem;
}
.site-footer__credit a {
  color: var(--color-gold);
  text-decoration: none;
}
.site-footer__credit a:hover {
  text-decoration: underline;
}

/**
 * Sidebar Layout
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.widget-area {
  padding: 1.5rem 0;
}
@media (min-width: 1024px) {
  .widget-area {
    padding: 0;
    position: sticky;
    top: calc(var(--header-height) + 1.5rem);
  }
}

.widget {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-border);
}
.widget:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.widget-title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
  color: var(--color-text);
}

.widget_recent_entries ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.widget_recent_entries li {
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--color-border);
}
.widget_recent_entries li:first-child {
  padding-top: 0;
}
.widget_recent_entries li:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.widget_recent_entries a {
  display: block;
  color: var(--color-text);
  text-decoration: none;
  font-weight: var(--font-weight-medium);
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.widget_recent_entries a:hover {
  color: var(--color-gold);
}
.widget_recent_entries .post-date {
  display: block;
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-top: 0.25rem;
}

.widget_categories ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.widget_categories li {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--color-border);
}
.widget_categories li:last-child {
  border-bottom: none;
}
.widget_categories a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--color-text);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.widget_categories a:hover {
  color: var(--color-gold);
}
.widget_categories .count,
.widget_categories .cat-item a::after {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.widget_search .search-form {
  margin-bottom: 0;
}

.widget_tag_cloud .tagcloud {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.widget_tag_cloud a {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: var(--font-size-sm);
  color: var(--color-text);
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.widget_tag_cloud a:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
}

.widget_archive ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.widget_archive li {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--color-border);
}
.widget_archive li:last-child {
  border-bottom: none;
}
.widget_archive a {
  display: flex;
  justify-content: space-between;
  color: var(--color-text);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.widget_archive a:hover {
  color: var(--color-gold);
}

.widget_text .textwidget p:last-child,
.widget_custom_html .textwidget p:last-child {
  margin-bottom: 0;
}

.widget_nav_menu .menu {
  list-style: none;
  padding: 0;
  margin: 0;
}
.widget_nav_menu .menu-item {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--color-border);
}
.widget_nav_menu .menu-item:last-child {
  border-bottom: none;
}
.widget_nav_menu a {
  display: block;
  color: var(--color-text);
  text-decoration: none;
  font-weight: var(--font-weight-medium);
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.widget_nav_menu a:hover {
  color: var(--color-gold);
}
.widget_nav_menu .sub-menu {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0 0 1rem;
}
.widget_nav_menu .sub-menu .menu-item {
  padding: 0.25rem 0;
  border-bottom: none;
}
.widget_nav_menu .sub-menu a {
  font-weight: var(--font-weight-regular);
  font-size: var(--font-size-sm);
}

/**
 * Content Layout
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.site-content {
  min-height: calc(100vh - var(--header-height) - var(--footer-min-height));
}

.site-main {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: var(--section-padding) var(--container-padding);
}

.site-main--landing {
  max-width: none;
  padding: 0;
}

.site-main--contact {
  max-width: 1024px;
}

.entry-content {
  max-width: var(--content-max-width);
}
.entry-content > * + * {
  margin-top: 1rem;
}
.entry-content > h2 + *,
.entry-content > h3 + *,
.entry-content > h4 + * {
  margin-top: 0.75rem;
}
.entry-content > * + h2 {
  margin-top: 2rem;
}
.entry-content > * + h3,
.entry-content > * + h4 {
  margin-top: 1.5rem;
}

.page-content {
  max-width: var(--content-max-width);
}
.page-content > * + * {
  margin-top: 1rem;
}

.entry-footer {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border);
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}
.entry-footer .cat-links,
.entry-footer .tags-links,
.entry-footer .edit-link {
  display: block;
  margin-bottom: 0.5rem;
}
.entry-footer a {
  color: var(--color-gold);
  text-decoration: none;
}
.entry-footer a:hover {
  text-decoration: underline;
}

.page-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
}
.page-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0.25rem 0.5rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.page-links a:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
}
.page-links > span:not(.page-links-title) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0.25rem 0.5rem;
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-md);
}

.comments-area {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-border);
}

.comments-title {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1.5rem;
}

.comment-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.comment {
  padding: 1rem 0;
  border-bottom: 1px solid var(--color-border);
}
.comment:last-child {
  border-bottom: none;
}

.comment-body {
  display: grid;
  gap: 0.75rem;
}

.comment-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.comment-author {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.comment-author .avatar {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-full);
}
.comment-author .fn {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  text-decoration: none;
}

.comment-metadata {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}
.comment-metadata a {
  color: inherit;
  text-decoration: none;
}
.comment-metadata a:hover {
  color: var(--color-gold);
}

.comment-content p:last-child {
  margin-bottom: 0;
}

.reply a {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-gold);
  text-decoration: none;
}
.reply a:hover {
  text-decoration: underline;
}

.children {
  list-style: none;
  padding: 0;
  margin: 1rem 0 0 1.5rem;
  border-left: 2px solid var(--color-border);
  padding-left: 1rem;
}
@media (min-width: 768px) {
  .children {
    margin-left: 2.5rem;
  }
}

.comment-respond {
  margin-top: 2rem;
}

.comment-reply-title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}
.comment-reply-title small {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-regular);
  margin-left: 0.5rem;
}
.comment-reply-title small a {
  color: var(--color-gold);
}

.comment-form .comment-notes {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 1rem;
}
.comment-form label {
  display: block;
  margin-bottom: 0.25rem;
}
.comment-form .required {
  color: var(--color-error);
}

.comment-form-comment,
.comment-form-author,
.comment-form-email,
.comment-form-url {
  margin-bottom: 1rem;
}

.form-submit {
  margin-top: 1rem;
}
/**
 * Button Components
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.btn, .product-actions__buy, .sermon-audio__download, .event-actions__register, .event-actions__brochure, .load-more__button, .newsletter-form button, .sermon-filters__clear, .sermon-filters__submit, .search-submit, .form-submit .submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  font-family: var(--font-body);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  line-height: 1;
  text-align: center;
  text-decoration: none;
  border: 2px solid transparent;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1), border-color 150ms cubic-bezier(0, 0, 0.2, 1), color 150ms cubic-bezier(0, 0, 0.2, 1), box-shadow 150ms cubic-bezier(0, 0, 0.2, 1), transform 150ms cubic-bezier(0, 0, 0.2, 1);
  min-height: 48px;
}
.btn:focus-visible, .product-actions__buy:focus-visible, .sermon-audio__download:focus-visible, .event-actions__register:focus-visible, .event-actions__brochure:focus-visible, .load-more__button:focus-visible, .newsletter-form button:focus-visible, .sermon-filters__clear:focus-visible, .sermon-filters__submit:focus-visible, .search-submit:focus-visible, .form-submit .submit:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
.btn:disabled, .product-actions__buy:disabled, .sermon-audio__download:disabled, .event-actions__register:disabled, .event-actions__brochure:disabled, .load-more__button:disabled, .newsletter-form button:disabled, .sermon-filters__clear:disabled, .sermon-filters__submit:disabled, .search-submit:disabled, .form-submit .submit:disabled, .btn.is-disabled, .is-disabled.product-actions__buy, .is-disabled.sermon-audio__download, .is-disabled.event-actions__register, .is-disabled.event-actions__brochure, .is-disabled.load-more__button, .newsletter-form button.is-disabled, .is-disabled.sermon-filters__clear, .is-disabled.sermon-filters__submit, .is-disabled.search-submit, .form-submit .is-disabled.submit {
  opacity: 0.6;
  cursor: not-allowed;
  pointer-events: none;
}
.btn svg, .product-actions__buy svg, .sermon-audio__download svg, .event-actions__register svg, .event-actions__brochure svg, .load-more__button svg, .newsletter-form button svg, .sermon-filters__clear svg, .sermon-filters__submit svg, .search-submit svg, .form-submit .submit svg {
  width: 1.25em;
  height: 1.25em;
  flex-shrink: 0;
}

.btn--primary, .product-actions__buy, .event-actions__register, .newsletter-form button, .sermon-filters__submit, .search-submit, .form-submit .submit {
  background-color: var(--color-gold);
  border-color: var(--color-gold);
  color: var(--color-white);
}
.btn--primary:hover, .product-actions__buy:hover, .event-actions__register:hover, .newsletter-form button:hover, .sermon-filters__submit:hover, .search-submit:hover, .form-submit .submit:hover {
  background-color: var(--color-gold-dark);
  border-color: var(--color-gold-dark);
}
.btn--primary:active, .product-actions__buy:active, .event-actions__register:active, .newsletter-form button:active, .sermon-filters__submit:active, .search-submit:active, .form-submit .submit:active {
  transform: translateY(1px);
}

.btn--secondary {
  background-color: var(--color-brown);
  border-color: var(--color-brown);
  color: var(--color-white);
}
.btn--secondary:hover {
  background-color: var(--color-brown-dark);
  border-color: var(--color-brown-dark);
}
.btn--secondary:active {
  transform: translateY(1px);
}

.btn--outline, .sermon-audio__download, .event-actions__brochure, .load-more__button, .sermon-filters__clear {
  background-color: transparent;
  border-color: var(--color-gold);
  color: var(--color-gold);
}
.btn--outline:hover, .sermon-audio__download:hover, .event-actions__brochure:hover, .load-more__button:hover, .sermon-filters__clear:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
}

.btn--outline-dark {
  background-color: transparent;
  border-color: var(--color-ink);
  color: var(--color-ink);
}
.btn--outline-dark:hover {
  background-color: var(--color-ink);
  color: var(--color-white);
}

.btn--outline-light {
  background-color: transparent;
  border-color: var(--color-white);
  color: var(--color-white);
}
.btn--outline-light:hover {
  background-color: var(--color-white);
  color: var(--color-ink);
}

.btn--ghost {
  background-color: transparent;
  border-color: transparent;
  color: var(--color-gold);
}
.btn--ghost:hover {
  background-color: rgba(169, 116, 35, 0.1);
}

.btn--link {
  background-color: transparent;
  border-color: transparent;
  color: var(--color-gold);
  padding-left: 0;
  padding-right: 0;
  min-height: auto;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.btn--link:hover {
  color: var(--color-gold-dark);
}

.btn--sm, .sermon-audio__download {
  padding: 0.5rem 1rem;
  font-size: var(--font-size-sm);
  min-height: 36px;
}

.btn--lg, .product-actions__buy {
  padding: 1rem 2rem;
  font-size: var(--font-size-lg);
  min-height: 56px;
}

.btn--full {
  width: 100%;
}

.btn--icon-left {
  flex-direction: row;
}

.btn--icon-right {
  flex-direction: row-reverse;
}

.btn--icon-only {
  padding: 0.75rem;
  min-width: 48px;
  min-height: 48px;
}
.btn--icon-only.btn--sm, .btn--icon-only.sermon-audio__download {
  padding: 0.5rem;
  min-width: 36px;
  min-height: 36px;
}
.btn--icon-only.btn--lg, .btn--icon-only.product-actions__buy {
  padding: 1rem;
  min-width: 56px;
  min-height: 56px;
}

.btn-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.btn-group--center {
  justify-content: center;
}
.btn-group--stretch .btn, .btn-group--stretch .product-actions__buy, .btn-group--stretch .sermon-audio__download, .btn-group--stretch .event-actions__register, .btn-group--stretch .event-actions__brochure, .btn-group--stretch .load-more__button, .btn-group--stretch .newsletter-form button, .newsletter-form .btn-group--stretch button, .btn-group--stretch .sermon-filters__clear, .btn-group--stretch .sermon-filters__submit, .btn-group--stretch .search-submit, .btn-group--stretch .form-submit .submit, .form-submit .btn-group--stretch .submit {
  flex: 1;
}

.search-submit {
  padding: 0.75rem;
  min-width: 48px;
}

.edit-link {
  font-size: var(--font-size-sm);
}
.edit-link a {
  color: var(--color-gold);
  text-decoration: none;
}
.edit-link a:hover {
  text-decoration: underline;
}

.more-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
}
.more-link:hover {
  color: var(--color-gold-dark);
}
.more-link:hover::after {
  transform: translateX(4px);
}
.more-link::after {
  content: "→";
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}

/**
 * Card Components
 *
 * Reusable card pattern for ministry, event, sermon, leader, and product archives.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.card, .resource-card, .homegroup-card, .product-card, .leader-card, .sermon-card, .event-card, .ministry-card, .programme-card {
  display: flex;
  flex-direction: column;
  background-color: var(--color-bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: box-shadow 300ms cubic-bezier(0, 0, 0.2, 1), transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.card:hover, .resource-card:hover, .homegroup-card:hover, .product-card:hover, .leader-card:hover, .sermon-card:hover, .event-card:hover, .ministry-card:hover, .programme-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-4px);
}

.card__image, .resource-card__image, .product-card__image, .leader-card__photo, .sermon-card__image, .event-card__image, .ministry-card__image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16/10;
}
.card__image img, .resource-card__image img, .product-card__image img, .leader-card__photo img, .sermon-card__image img, .event-card__image img, .ministry-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms cubic-bezier(0, 0, 0.2, 1);
}
.card__image a:hover img, .resource-card__image a:hover img, .product-card__image a:hover img, .leader-card__photo a:hover img, .sermon-card__image a:hover img, .event-card__image a:hover img, .ministry-card__image a:hover img {
  transform: scale(1.05);
}

.card__content, .resource-card__content, .product-card__content, .leader-card__content, .sermon-card__content, .event-card__content, .ministry-card__content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding: 1.25rem;
}

.card__header, .resource-card__header, .product-card__header, .leader-card__header, .sermon-card__header, .event-card__header, .ministry-card__header {
  margin-bottom: 0.75rem;
}

.card__title, .resource-card__title, .product-card__title, .sermon-card__title, .event-card__title, .ministry-card__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: 0.25rem;
}
.card__title a, .resource-card__title a, .product-card__title a, .sermon-card__title a, .event-card__title a, .ministry-card__title a {
  color: var(--color-text);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.card__title a:hover, .resource-card__title a:hover, .product-card__title a:hover, .sermon-card__title a:hover, .event-card__title a:hover, .ministry-card__title a:hover {
  color: var(--color-gold);
}

.card__meta, .resource-card__meta, .sermon-card__meta {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.card__excerpt, .resource-card__excerpt, .product-card__excerpt, .event-card__excerpt, .ministry-card__excerpt {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
  margin-bottom: 1rem;
  flex-grow: 1;
}
.card__excerpt p, .resource-card__excerpt p, .product-card__excerpt p, .event-card__excerpt p, .ministry-card__excerpt p {
  margin: 0;
}

.card__footer, .resource-card__footer, .product-card__footer, .leader-card__footer, .sermon-card__footer, .event-card__footer, .ministry-card__footer {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

.card__link, .resource-card__link, .product-card__link, .leader-card__link, .sermon-card__link, .event-card__link, .ministry-card__link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.card__link:hover, .resource-card__link:hover, .product-card__link:hover, .leader-card__link:hover, .sermon-card__link:hover, .event-card__link:hover, .ministry-card__link:hover {
  color: var(--color-gold-dark);
}
.card__link:hover::after, .resource-card__link:hover::after, .product-card__link:hover::after, .leader-card__link:hover::after, .sermon-card__link:hover::after, .event-card__link:hover::after, .ministry-card__link:hover::after {
  transform: translateX(4px);
}
.card__link::after, .resource-card__link::after, .product-card__link::after, .leader-card__link::after, .sermon-card__link::after, .event-card__link::after, .ministry-card__link::after {
  content: "→";
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}

.ministry-card__leader {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
  padding: 0.5rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-md);
}

.ministry-card__leader-photo {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  border-radius: var(--radius-full);
  overflow: hidden;
}
.ministry-card__leader-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ministry-card__leader-name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.event-card {
  flex-direction: row;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .event-card {
    flex-wrap: nowrap;
  }
}

.event-card__date {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background-color: var(--color-gold);
  color: var(--color-white);
  text-align: center;
  min-width: 80px;
  flex-shrink: 0;
}
@media (min-width: 768px) {
  .event-card__date {
    min-width: 100px;
    padding: 1.25rem;
  }
}

.event-card__day {
  font-size: 2.25rem;
  font-weight: var(--font-weight-bold);
  line-height: 1;
}

.event-card__month {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  margin-top: 0.25rem;
}

.event-card__year {
  font-size: var(--font-size-xs);
  opacity: 0.8;
  margin-top: 0.25rem;
}

.event-card__content {
  flex: 1;
  min-width: 0;
}

.event-card__dates {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.event-card__footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

.event-card__brochure {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-brown);
  text-decoration: none;
}
.event-card__brochure:hover {
  text-decoration: underline;
}

.event-card__image {
  width: 100%;
  aspect-ratio: 16/9;
}
@media (min-width: 768px) {
  .event-card__image {
    width: 200px;
    aspect-ratio: auto;
  }
}

.sermon-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
}

.sermon-card__preacher {
  color: var(--color-gold);
  font-weight: var(--font-weight-medium);
}

.sermon-card__scripture {
  font-size: var(--font-size-sm);
  font-style: italic;
  color: var(--color-text-secondary);
  margin-bottom: 0.75rem;
}

.sermon-card__series {
  margin-bottom: 0.5rem;
}
.sermon-card__series a {
  display: inline-block;
  padding: 0.25rem 0.5rem;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-sm);
  text-decoration: none;
}
.sermon-card__series a:hover {
  background-color: var(--color-gold-dark);
}

.sermon-card__topics {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 0.75rem;
}
.sermon-card__topics a {
  display: inline-block;
  padding: 0.25rem 0.5rem;
  font-size: var(--font-size-xs);
  background-color: var(--color-bg-secondary);
  color: var(--color-text-secondary);
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.sermon-card__topics a:hover {
  background-color: var(--color-brown);
  color: var(--color-white);
}

.sermon-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sermon-card__media-icons {
  display: flex;
  gap: 0.5rem;
}

.sermon-card__has-audio,
.sermon-card__has-video {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-full);
}
.sermon-card__has-audio::before,
.sermon-card__has-video::before {
  content: "";
  width: 16px;
  height: 16px;
  background-color: var(--color-text-secondary);
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

.sermon-card__has-audio::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z'/%3E%3Cpath d='M19 10v2a7 7 0 0 1-14 0v-2'/%3E%3Cline x1='12' y1='19' x2='12' y2='23'/%3E%3Cline x1='8' y1='23' x2='16' y2='23'/%3E%3C/svg%3E");
}

.sermon-card__has-video::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpolygon points='23 7 16 12 23 17 23 7'/%3E%3Crect x='1' y='5' width='15' height='14' rx='2' ry='2'/%3E%3C/svg%3E");
}

.leader-card {
  text-align: center;
}

.leader-card__photo {
  aspect-ratio: 1;
}
.leader-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.leader-card__name {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: 0.25rem;
}
.leader-card__name a {
  color: var(--color-text);
  text-decoration: none;
}
.leader-card__name a:hover {
  color: var(--color-gold);
}

.leader-card__title {
  display: block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-regular);
  color: var(--color-gold);
  margin-bottom: 2px;
}

.leader-card__role {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 0;
}

.leader-card__link {
  justify-content: center;
}

.product-card__image {
  aspect-ratio: 1;
  background-color: var(--color-bg-secondary);
}
.product-card__image img {
  object-fit: contain;
  padding: 1rem;
}

.product-card__price {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-gold);
  margin-bottom: 0;
}

.homegroup-card {
  text-align: center;
}

.resource-card__category {
  display: inline-block;
  padding: 0.25rem 0.5rem;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  background-color: var(--color-brown);
  color: var(--color-white);
  border-radius: var(--radius-sm);
  margin-bottom: 0.5rem;
}

.resource-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.resource-card__media-icons {
  display: flex;
  gap: 0.5rem;
}

.resource-card__has-audio,
.resource-card__has-video,
.resource-card__has-download,
.resource-card__has-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-full);
}
.resource-card__has-audio::before,
.resource-card__has-video::before,
.resource-card__has-download::before,
.resource-card__has-link::before {
  content: "";
  width: 16px;
  height: 16px;
  background-color: var(--color-text-secondary);
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

.resource-card__has-audio::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z'/%3E%3Cpath d='M19 10v2a7 7 0 0 1-14 0v-2'/%3E%3Cline x1='12' y1='19' x2='12' y2='23'/%3E%3Cline x1='8' y1='23' x2='16' y2='23'/%3E%3C/svg%3E");
}

.resource-card__has-video::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpolygon points='23 7 16 12 23 17 23 7'/%3E%3Crect x='1' y='5' width='15' height='14' rx='2' ry='2'/%3E%3C/svg%3E");
}

.resource-card__has-download::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='7 10 12 15 17 10'/%3E%3Cline x1='12' y1='15' x2='12' y2='3'/%3E%3C/svg%3E");
}

.resource-card__has-link::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
}

/**
 * Navigation Components
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.main-navigation {
  display: flex;
  align-items: center;
}

.menu-toggle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 48px;
  height: 48px;
  padding: 0.5rem;
  background-color: transparent;
  border: none;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
@media (min-width: 1024px) {
  .menu-toggle {
    display: none;
  }
}
.menu-toggle:hover {
  background-color: var(--color-bg-secondary);
}
.menu-toggle:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
.menu-toggle[aria-expanded=true] .menu-toggle__bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.menu-toggle[aria-expanded=true] .menu-toggle__bar:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.menu-toggle[aria-expanded=true] .menu-toggle__bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

.menu-toggle__bar {
  display: block;
  width: 24px;
  height: 2px;
  background-color: var(--color-text);
  border-radius: 1px;
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1), opacity 150ms cubic-bezier(0, 0, 0.2, 1);
}

.nav-menu--primary {
  display: none;
  list-style: none;
  padding: 0;
  margin: 0;
}
@media (min-width: 1024px) {
  .nav-menu--primary {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }
}
.nav-menu--primary.is-open {
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background-color: var(--color-bg);
  border-top: 1px solid var(--color-border);
  box-shadow: var(--shadow-lg);
  max-height: calc(100vh - var(--header-height));
  overflow-y: auto;
  z-index: var(--z-dropdown);
  animation: fade-up 300ms cubic-bezier(0, 0, 0.2, 1) forwards;
}
@media (min-width: 1024px) {
  .nav-menu--primary.is-open {
    display: flex;
    position: static;
    border-top: none;
    box-shadow: none;
    max-height: none;
    overflow-y: visible;
    animation: none;
  }
}
.nav-menu--primary > .menu-item {
  position: relative;
}
@media (max-width: 1023px) {
  .nav-menu--primary > .menu-item {
    border-bottom: 1px solid var(--color-border);
  }
}
.nav-menu--primary > .menu-item > a {
  display: flex;
  align-items: center;
  padding: 1rem var(--container-padding);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1), background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
@media (min-width: 1024px) {
  .nav-menu--primary > .menu-item > a {
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-md);
  }
}
.nav-menu--primary > .menu-item > a:hover {
  color: var(--color-gold);
}
@media (min-width: 1024px) {
  .nav-menu--primary > .menu-item > a:hover {
    background-color: var(--color-bg-secondary);
  }
}
.nav-menu--primary > .menu-item > a:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: -2px;
}
.nav-menu--primary > .current-menu-item > a,
.nav-menu--primary > .current-menu-ancestor > a {
  color: var(--color-gold);
}

.nav-menu--primary .sub-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}
@media (max-width: 1023px) {
  .nav-menu--primary .sub-menu {
    padding-left: 1rem;
    background-color: var(--color-bg-secondary);
  }
}
@media (min-width: 1024px) {
  .nav-menu--primary .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    background-color: var(--color-bg);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity 150ms cubic-bezier(0, 0, 0.2, 1), transform 150ms cubic-bezier(0, 0, 0.2, 1), visibility 150ms;
    z-index: var(--z-dropdown);
  }
}
.nav-menu--primary .sub-menu .menu-item > a {
  display: block;
  padding: 0.75rem 1rem;
  font-size: var(--font-size-sm);
  color: var(--color-text);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1), background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.nav-menu--primary .sub-menu .menu-item > a:hover {
  color: var(--color-gold);
  background-color: var(--color-bg-secondary);
}
.nav-menu--primary .sub-menu .current-menu-item > a {
  color: var(--color-gold);
}
@media (min-width: 1024px) {
  .nav-menu--primary .sub-menu .sub-menu {
    top: 0;
    left: 100%;
  }
}

@media (min-width: 1024px) {
  .nav-menu--primary .menu-item-has-children:hover > .sub-menu,
  .nav-menu--primary .menu-item-has-children:focus-within > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
}
.nav-menu--primary .menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-left: 0.25rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}

@media (min-width: 1024px) {
  .nav-menu--primary .menu-item-has-children:hover > a::after {
    transform: rotate(-135deg);
  }
}

.dropdown-toggle {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 44px;
  padding: 0;
  background-color: transparent;
  border: none;
  cursor: pointer;
}
@media (min-width: 1024px) {
  .dropdown-toggle {
    display: none;
  }
}
.dropdown-toggle:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: -2px;
}

@media (max-width: 1023px) {
  .nav-menu--primary .menu-item-has-children > a {
    padding-right: 44px;
  }
}

.footer-navigation {
  margin-bottom: 1.5rem;
}

.nav-menu--footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.nav-menu--footer a {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  text-decoration: none;
}
.nav-menu--footer a:hover {
  text-decoration: underline;
}

.quick-links-navigation {
  margin-bottom: 1.5rem;
}

.nav-menu--quick-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.nav-menu--quick-links a {
  display: inline-block;
  padding: 0.5rem 1rem;
  font-size: var(--font-size-sm);
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.nav-menu--quick-links a:hover {
  background-color: var(--color-gold);
}

.post-navigation {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border);
}

.nav-links {
  display: grid;
  gap: 1rem;
}
@media (min-width: 768px) {
  .nav-links {
    grid-template-columns: 1fr 1fr;
  }
}

.nav-previous a,
.nav-next a {
  display: block;
  padding: 1rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: box-shadow 300ms cubic-bezier(0, 0, 0.2, 1), transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.nav-previous a:hover,
.nav-next a:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
  transform: translateY(-2px);
}
.nav-previous a:hover .nav-subtitle,
.nav-next a:hover .nav-subtitle {
  color: rgba(255, 255, 255, 0.8);
}

@media (min-width: 768px) {
  .nav-next {
    text-align: right;
  }
}

.nav-subtitle {
  display: block;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  margin-bottom: 0.25rem;
}

.nav-title {
  display: block;
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.posts-navigation {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border);
}

/**
 * Form Components
 *
 * Enhanced form styling beyond base form elements.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.form-group {
  margin-bottom: 1rem;
}
.form-group:last-child {
  margin-bottom: 0;
}

.form-label {
  display: block;
  font-weight: var(--font-weight-medium);
  margin-bottom: 0.25rem;
  color: var(--color-text);
}
.form-label .required {
  color: var(--color-error);
  margin-left: 2px;
}

.form-row {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}
.form-row > .form-group {
  flex: 1;
  min-width: 200px;
}

.form-fieldset {
  margin-bottom: 1.5rem;
  padding: 1.5rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
}

.form-legend {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

.input-group {
  display: flex;
}

.input-group__addon {
  display: flex;
  align-items: center;
  padding: 0.75rem 1rem;
  font-size: var(--font-size-base);
  color: var(--color-text-secondary);
  background-color: var(--color-bg-secondary);
  border: 1px solid var(--color-border-dark);
  border-right: none;
  border-radius: var(--radius-md) 0 0 var(--radius-md);
}

.input-group input {
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

.checkbox-group,
.radio-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.checkbox-group--inline,
.radio-group--inline {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1rem;
}

.form-message {
  padding: 1rem;
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  margin-bottom: 1rem;
}

.form-message--success {
  background-color: rgba(46, 125, 50, 0.1);
  border: 1px solid #2E7D32;
  color: #2E7D32;
}

.form-message--error {
  background-color: rgba(211, 47, 47, 0.1);
  border: 1px solid #D32F2F;
  color: #D32F2F;
}

.form-message--info {
  background-color: rgba(2, 136, 209, 0.1);
  border: 1px solid #0288D1;
  color: #0288D1;
}

.form-message--warning {
  background-color: rgba(237, 108, 2, 0.1);
  border: 1px solid #ED6C02;
  color: #ED6C02;
}

.sermon-filters {
  background-color: var(--color-bg-secondary);
  padding: 1.5rem;
  border-radius: var(--radius-lg);
  margin-bottom: 2rem;
}

.sermon-filters__form {
  display: grid;
  gap: 1rem;
  margin-bottom: 0;
}
@media (min-width: 640px) {
  .sermon-filters__form {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .sermon-filters__form {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1280px) {
  .sermon-filters__form {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (min-width: 1024px) {
  .sermon-filters__form[data-js-enhanced=true] {
    grid-template-columns: repeat(4, 1fr);
  }
}

.sermon-filters__field {
  display: flex;
  flex-direction: column;
}

@media (min-width: 640px) {
  .sermon-filters__field--search {
    grid-column: span 2;
  }
}
@media (min-width: 1024px) {
  .sermon-filters__field--search {
    grid-column: span 1;
  }
}

@media (min-width: 640px) {
  .sermon-filters__field--dates {
    grid-column: span 2;
  }
}
@media (min-width: 1024px) {
  .sermon-filters__field--dates {
    grid-column: span 1;
  }
}

.sermon-filters__field--submit {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  align-items: flex-end;
}
@media (min-width: 640px) {
  .sermon-filters__field--submit {
    grid-column: span 2;
  }
}
@media (min-width: 1024px) {
  .sermon-filters__field--submit {
    grid-column: span 1;
    align-self: flex-end;
  }
}

.sermon-filters__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  margin-bottom: 0.25rem;
}

.sermon-filters__date-range {
  display: flex;
  gap: 0.5rem;
}

.sermon-filters__date-field {
  flex: 1;
  min-width: 0;
}
.sermon-filters__date-field input[type=date] {
  width: 100%;
}

.sermon-filters__submit {
  flex: 1;
}
@media (min-width: 1024px) {
  .sermon-filters__submit {
    flex: none;
  }
}

.sermon-filters__clear {
  flex-shrink: 0;
}

.sermon-list {
  position: relative;
  min-height: 200px;
}
.sermon-list.is-loading {
  opacity: 0.6;
  pointer-events: none;
}

.sermon-list__loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 0.8);
}
.sermon-list__loading::after {
  content: "";
  width: 32px;
  height: 32px;
  border: 3px solid var(--color-border);
  border-top-color: var(--color-gold);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.sermon-list__no-results,
.sermon-list__error {
  text-align: center;
  padding: 2rem;
  color: var(--color-text-secondary);
  font-size: var(--font-size-lg);
}

.sermon-list__error {
  color: var(--color-error);
}

.contact-form {
  max-width: 600px;
}

.form-group--checkbox .checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-weight: var(--font-weight-regular);
  cursor: pointer;
}
.form-group--checkbox .checkbox-label input[type=checkbox] {
  flex-shrink: 0;
  margin-top: 2px;
}
.form-group--checkbox .checkbox-text {
  line-height: var(--line-height-relaxed);
}

.newsletter-form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media (min-width: 640px) {
  .newsletter-form {
    flex-direction: row;
  }
}
.newsletter-form input[type=email] {
  flex: 1;
}
.newsletter-form button {
  flex-shrink: 0;
}

.form--loading {
  position: relative;
  pointer-events: none;
}
.form--loading::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(255, 255, 255, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
}

.is-valid {
  border-color: #2E7D32;
}
.is-valid:focus {
  box-shadow: 0 0 0 3px rgba(46, 125, 50, 0.2);
}

.is-invalid {
  border-color: #D32F2F;
}
.is-invalid:focus {
  box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.2);
}

.invalid-feedback {
  display: none;
  font-size: var(--font-size-sm);
  color: #D32F2F;
  margin-top: 0.25rem;
}

.is-invalid ~ .invalid-feedback {
  display: block;
}

/**
 * Modal Components
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.modal {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity 300ms cubic-bezier(0, 0, 0.2, 1), visibility 300ms;
}
.modal.is-open {
  opacity: 1;
  visibility: visible;
}
.modal.is-open .modal__content {
  transform: scale(1) translateY(0);
}

.modal__backdrop {
  position: absolute;
  inset: 0;
  background-color: var(--color-overlay);
  cursor: pointer;
}

.modal__content {
  position: relative;
  background-color: var(--color-bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl);
  max-width: 600px;
  width: 100%;
  max-height: 90vh;
  overflow: auto;
  transform: scale(0.95) translateY(20px);
  transition: transform 300ms cubic-bezier(0, 0, 0.2, 1);
}

.modal--sm .modal__content {
  max-width: 400px;
}

.modal--lg .modal__content {
  max-width: 800px;
}

.modal--xl .modal__content {
  max-width: 1000px;
}

.modal--full .modal__content {
  max-width: calc(100vw - 2rem);
  max-height: calc(100vh - 2rem);
}

.modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--color-border);
}

.modal__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin: 0;
}

.modal__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  background-color: transparent;
  border: none;
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
  flex-shrink: 0;
}
.modal__close:hover {
  background-color: var(--color-bg-secondary);
}
.modal__close:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
.modal__close::before, .modal__close::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 2px;
  background-color: var(--color-text);
  border-radius: 1px;
}
.modal__close::before {
  transform: rotate(45deg);
}
.modal__close::after {
  transform: rotate(-45deg);
}

.modal__body {
  padding: 1.5rem;
}
.modal__body p:last-child {
  margin-bottom: 0;
}

.modal__footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1rem 1.5rem;
  border-top: 1px solid var(--color-border);
  background-color: var(--color-bg-secondary);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

.modal--media .modal__content, .lightbox .modal__content {
  max-width: 90vw;
  max-height: 90vh;
  background-color: transparent;
  box-shadow: none;
}
.modal--media .modal__body, .lightbox .modal__body {
  padding: 0;
}
.modal--media img, .lightbox img,
.modal--media video,
.lightbox video,
.modal--media iframe,
.lightbox iframe {
  display: block;
  max-width: 100%;
  max-height: 85vh;
  margin: 0 auto;
}
.modal--media .modal__close, .lightbox .modal__close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background-color: var(--color-bg);
  z-index: 1;
}
.modal--media .modal__close:hover, .lightbox .modal__close:hover {
  background-color: var(--color-bg-secondary);
}

.lightbox .lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background-color: var(--color-bg);
  border: none;
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
  z-index: 1;
}
.lightbox .lightbox__nav:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
}
.lightbox .lightbox__nav:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
.lightbox .lightbox__prev {
  left: 1rem;
}
.lightbox .lightbox__next {
  right: 1rem;
}

body.modal-open {
  overflow: hidden;
}

/**
 * Breadcrumb Components
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.breadcrumbs {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 1.5rem;
  padding: 0.75rem 0;
}

.breadcrumbs__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.breadcrumbs__item {
  display: flex;
  align-items: center;
}
.breadcrumbs__item::after {
  content: "/";
  margin-left: 0.5rem;
  color: var(--color-border-dark);
}
.breadcrumbs__item:last-child::after {
  display: none;
}
.breadcrumbs__item--current, .breadcrumbs__item:last-child {
  color: var(--color-text);
  font-weight: var(--font-weight-medium);
}

.breadcrumbs__link {
  color: var(--color-text-secondary);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.breadcrumbs__link:hover {
  color: var(--color-gold);
}
.breadcrumbs__link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

.breadcrumbs__home {
  display: flex;
  align-items: center;
}
.breadcrumbs__home svg {
  width: 16px;
  height: 16px;
}

.breadcrumbs--center .breadcrumbs__list {
  justify-content: center;
}

.breadcrumbs--arrows .breadcrumbs__item::after {
  content: "›";
  font-size: 1.2em;
}

.breadcrumbs--inverse {
  color: rgba(255, 255, 255, 0.7);
}
.breadcrumbs--inverse .breadcrumbs__item::after {
  color: rgba(255, 255, 255, 0.4);
}
.breadcrumbs--inverse .breadcrumbs__item--current,
.breadcrumbs--inverse .breadcrumbs__item:last-child {
  color: var(--color-white);
}
.breadcrumbs--inverse .breadcrumbs__link {
  color: rgba(255, 255, 255, 0.7);
}
.breadcrumbs--inverse .breadcrumbs__link:hover {
  color: var(--color-white);
}

.yoast-breadcrumbs,
.rank-math-breadcrumb {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 1.5rem;
  padding: 0.75rem 0;
}
.yoast-breadcrumbs a,
.rank-math-breadcrumb a {
  color: var(--color-text-secondary);
  text-decoration: none;
}
.yoast-breadcrumbs a:hover,
.rank-math-breadcrumb a:hover {
  color: var(--color-gold);
}
.yoast-breadcrumbs .breadcrumb_last,
.rank-math-breadcrumb .breadcrumb_last {
  color: var(--color-text);
  font-weight: var(--font-weight-medium);
}
.yoast-breadcrumbs span[aria-hidden=true],
.yoast-breadcrumbs .separator,
.rank-math-breadcrumb span[aria-hidden=true],
.rank-math-breadcrumb .separator {
  color: var(--color-border-dark);
  margin: 0 0.5rem;
}

/**
 * Pagination Components
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.pagination {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border);
}

.pagination__list,
.nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.pagination__link,
.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0.5rem 0.75rem;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.pagination__link:hover,
.page-numbers:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
}
.pagination__link:focus-visible,
.page-numbers:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

.pagination__link--current,
.page-numbers.current {
  background-color: var(--color-gold);
  color: var(--color-white);
  pointer-events: none;
}

.pagination__link--disabled,
.page-numbers.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.pagination__dots,
.page-numbers.dots {
  background-color: transparent;
  cursor: default;
}
.pagination__dots:hover,
.page-numbers.dots:hover {
  background-color: transparent;
  color: var(--color-text);
}

.pagination__prev,
.pagination__next,
.prev.page-numbers,
.next.page-numbers {
  font-weight: var(--font-weight-semibold);
}

.posts-navigation,
.post-navigation {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border);
}

.posts-navigation .nav-links {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.posts-navigation .nav-previous a,
.posts-navigation .nav-next a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.posts-navigation .nav-previous a:hover,
.posts-navigation .nav-next a:hover {
  color: var(--color-gold-dark);
}

.posts-navigation .nav-previous a::before {
  content: "←";
}

.posts-navigation .nav-next a::after {
  content: "→";
}

.load-more {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}

.load-more__button--loading {
  position: relative;
  color: transparent;
  pointer-events: none;
}
.load-more__button--loading::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  border: 2px solid var(--color-gold);
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 1000ms linear infinite;
}

.infinite-scroll-loading {
  display: flex;
  justify-content: center;
  padding: 2rem;
}
.infinite-scroll-loading::after {
  content: "";
  width: 40px;
  height: 40px;
  border: 3px solid var(--color-bg-secondary);
  border-top-color: var(--color-gold);
  border-radius: 50%;
  animation: spin 1000ms linear infinite;
}

.infinite-scroll-end {
  text-align: center;
  padding: 2rem;
  color: var(--color-text-secondary);
  font-style: italic;
}

/**
 * Social Links Components
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.social-links__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.social-links__list--center {
  justify-content: center;
}

.social-links__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  color: var(--color-text);
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.social-links__link:hover {
  color: var(--color-white);
  background-color: var(--color-gold);
  transform: translateY(-2px);
}
.social-links__link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
.social-links__link svg {
  width: 20px;
  height: 20px;
}

.social-links--sm .social-links__link {
  width: 36px;
  height: 36px;
}
.social-links--sm .social-links__link svg {
  width: 16px;
  height: 16px;
}

.social-links--lg .social-links__link {
  width: 56px;
  height: 56px;
}
.social-links--lg .social-links__link svg {
  width: 24px;
  height: 24px;
}

.social-links--outline .social-links__link {
  background-color: transparent;
  border: 2px solid var(--color-border-dark);
}
.social-links--outline .social-links__link:hover {
  border-color: var(--color-gold);
  background-color: var(--color-gold);
}

.social-links--inverse .social-links__link {
  color: var(--color-white);
  background-color: rgba(255, 255, 255, 0.1);
}
.social-links--inverse .social-links__link:hover {
  background-color: var(--color-gold);
}

.social-links--branded .social-links__link--facebook:hover {
  background-color: #1877f2;
}
.social-links--branded .social-links__link--instagram:hover {
  background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}
.social-links--branded .social-links__link--twitter:hover {
  background-color: #000000;
}
.social-links--branded .social-links__link--youtube:hover {
  background-color: #ff0000;
}
.social-links--branded .social-links__link--linkedin:hover {
  background-color: #0a66c2;
}
.social-links--branded .social-links__link--whatsapp:hover {
  background-color: #25d366;
}
.social-links--branded .social-links__link--email:hover {
  background-color: var(--color-gold);
}

.share-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.share-buttons__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
}

.share-buttons__list {
  display: flex;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.share-buttons__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--color-text);
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.share-buttons__link:hover {
  color: var(--color-white);
  transform: scale(1.1);
}
.share-buttons__link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
.share-buttons__link svg {
  width: 18px;
  height: 18px;
}
.share-buttons__link--facebook:hover {
  background-color: #1877f2;
}
.share-buttons__link--twitter:hover {
  background-color: #000000;
}
.share-buttons__link--linkedin:hover {
  background-color: #0a66c2;
}
.share-buttons__link--whatsapp:hover {
  background-color: #25d366;
}
.share-buttons__link--email:hover {
  background-color: var(--color-gold);
}
.share-buttons__link--copy:hover {
  background-color: var(--color-brown);
}

.sermon-share {
  margin-top: 1.5rem;
  padding: 1.25rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
}
.sermon-share h2 {
  font-size: var(--font-size-h6);
  margin-bottom: 1rem;
}

.sermon-share__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.sermon-share__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-white);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
  min-height: 44px;
}
.sermon-share__link:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.sermon-share__link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
.sermon-share__link--facebook {
  background-color: #1877f2;
}
.sermon-share__link--facebook:hover {
  background-color: rgb(11.4549180328, 95.1639344262, 203.5450819672);
}
.sermon-share__link--twitter {
  background-color: #000000;
}
.sermon-share__link--twitter:hover {
  background-color: #333333;
}
.sermon-share__link--email {
  background-color: var(--color-brown);
}
.sermon-share__link--email:hover {
  background-color: var(--color-brown-dark);
}

/**
 * Page Banner Section
 *
 * Inner page header with title, breadcrumbs, and optional background image.
 * Used on About Us, Ministries, and other interior pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.page-banner {
  position: relative;
  padding: 2.5rem 0;
  background-color: var(--color-bg-secondary);
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
@media (min-width: 768px) {
  .page-banner {
    padding: 3rem 0;
  }
}
@media (min-width: 1024px) {
  .page-banner {
    padding: 4rem 0;
  }
}

.site-main:not(.site-main--landing) > .page-banner:first-child {
  margin-top: calc(-1 * var(--section-padding));
}

.page-banner--has-image {
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
}
.page-banner--has-image .page-banner__title {
  color: var(--color-white);
}
.page-banner--has-image .page-banner__subtitle {
  color: rgba(255, 255, 255, 0.8);
}

.page-banner__bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.page-banner__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.4;
}
.page-banner__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(33, 26, 20, 0.85) 0%, rgba(107, 79, 53, 0.7) 100%);
}

.page-banner__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.page-banner__breadcrumb {
  margin-bottom: 1rem;
}
.page-banner__breadcrumb .breadcrumbs {
  margin-bottom: 0;
  padding: 0;
}

.page-banner__title {
  font-family: var(--font-display);
  font-weight: var(--font-weight-bold);
  font-size: 3rem;
  line-height: var(--line-height-tight);
  margin: 0;
}
@media (min-width: 768px) {
  .page-banner__title {
    font-size: 3rem;
  }
}
@media (min-width: 1024px) {
  .page-banner__title {
    font-size: 3.5rem;
  }
}

@media (min-width: 1024px) {
  .page-banner__title--oversized {
    font-size: 4rem;
  }
}

.page-banner__subtitle {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
  margin-top: 0.75rem;
  max-width: 60ch;
}
@media (min-width: 768px) {
  .page-banner__subtitle {
    font-size: var(--font-size-xl);
  }
}

.page-banner--center {
  text-align: center;
}
.page-banner--center .page-banner__subtitle {
  margin-left: auto;
  margin-right: auto;
}

/**
 * Hero Section
 *
 * Full-width hero areas for homepage and landing pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.hero {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 60vh;
  padding: 5rem 0;
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
  overflow: hidden;
}
@media (min-width: 768px) {
  .hero {
    min-height: 70vh;
  }
}
@media (min-width: 1024px) {
  .hero {
    min-height: 80vh;
  }
}

.hero__slides {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1), visibility 500ms cubic-bezier(0.4, 0, 0.2, 1);
}
.hero__slide.is-active {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}
@media (prefers-reduced-motion: reduce) {
  .hero__slide {
    transition: none;
  }
}

.hero__background {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.hero__background img,
.hero__background video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero__youtube {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hero__youtube-iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 56.25vw;
  min-height: 100%;
  min-width: 177.78vh;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to bottom, rgba(33, 26, 20, 0.6) 0%, rgba(33, 26, 20, 0.4) 50%, rgba(33, 26, 20, 0.7) 100%);
  pointer-events: none;
}

.hero__content {
  position: relative;
  z-index: 2;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
  text-align: center;
}
@media (min-width: 1024px) {
  .hero__content {
    text-align: left;
    max-width: 65%;
  }
}

.hero__slide .hero__content {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  padding-bottom: 4rem;
}
@media (min-width: 1024px) {
  .hero__slide .hero__content {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

.hero__kicker {
  display: inline-block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-gold);
  margin-bottom: 1rem;
}

.hero__title {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .hero__title {
    font-size: 3.5rem;
  }
}
@media (min-width: 1024px) {
  .hero__title {
    font-size: 4rem;
  }
}

.hero__subtitle {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  max-width: 600px;
  margin-bottom: 1.5rem;
  opacity: 0.9;
}
@media (min-width: 768px) {
  .hero__subtitle {
    font-size: var(--font-size-xl);
  }
}
@media (min-width: 1024px) {
  .hero__subtitle {
    margin-left: 0;
    margin-right: auto;
  }
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
}
@media (min-width: 1024px) {
  .hero__actions {
    justify-content: flex-start;
  }
}
.hero__actions .btn, .hero__actions .product-actions__buy, .hero__actions .sermon-audio__download, .hero__actions .event-actions__register, .hero__actions .event-actions__brochure, .hero__actions .form-submit .submit, .form-submit .hero__actions .submit, .hero__actions .search-submit, .hero__actions .sermon-filters__submit, .hero__actions .sermon-filters__clear, .hero__actions .newsletter-form button, .newsletter-form .hero__actions button, .hero__actions .load-more__button {
  min-width: 180px;
}

.hero__controls {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  z-index: 10;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  padding: 0 0.75rem;
  pointer-events: none;
}
@media (min-width: 768px) {
  .hero__controls {
    padding: 0 1.5rem;
  }
}

.hero__nav {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  padding: 0;
  background-color: rgba(33, 26, 20, 0.5);
  border: 2px solid transparent;
  border-radius: 50%;
  color: var(--color-white);
  cursor: pointer;
  pointer-events: auto;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1), border-color 150ms cubic-bezier(0, 0, 0.2, 1), transform 150ms cubic-bezier(0, 0, 0.2, 1);
}
.hero__nav:hover {
  background-color: var(--color-gold);
  transform: scale(1.05);
}
.hero__nav:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
  background-color: var(--color-gold);
}
.hero__nav:active {
  transform: scale(0.95);
}
.hero__nav svg {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}
@media (min-width: 768px) {
  .hero__nav {
    width: 56px;
    height: 56px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero__nav {
    transition: none;
  }
  .hero__nav:hover, .hero__nav:active {
    transform: none;
  }
}

.hero__dots {
  position: absolute;
  bottom: 1.5rem;
  left: 0;
  right: 0;
  z-index: 10;
  display: flex;
  justify-content: center;
  gap: 0.5rem;
}
@media (min-width: 768px) {
  .hero__dots {
    bottom: 2rem;
    gap: 0.75rem;
  }
}

.hero__dot {
  width: 12px;
  height: 12px;
  padding: 0;
  background-color: rgba(255, 255, 255, 0.4);
  border: 2px solid transparent;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1), transform 150ms cubic-bezier(0, 0, 0.2, 1);
  position: relative;
}
.hero__dot::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
}
.hero__dot:hover {
  background-color: rgba(255, 255, 255, 0.7);
  transform: scale(1.2);
}
.hero__dot:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 4px;
}
.hero__dot.is-active {
  background-color: var(--color-gold);
  transform: scale(1.2);
}
@media (min-width: 768px) {
  .hero__dot {
    width: 14px;
    height: 14px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero__dot {
    transition: none;
  }
  .hero__dot:hover {
    transform: none;
  }
  .hero__dot.is-active {
    transform: none;
  }
}

.hero--center .hero__content {
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}
@media (min-width: 1024px) {
  .hero--center .hero__content {
    max-width: 800px;
  }
}
.hero--center .hero__subtitle {
  margin-left: auto;
  margin-right: auto;
}
.hero--center .hero__actions {
  justify-content: center;
}

.hero--sm {
  min-height: 40vh;
  padding: 4rem 0;
}
@media (min-width: 768px) {
  .hero--sm {
    min-height: 50vh;
  }
}

.hero--full {
  min-height: 100vh;
}

.hero--light {
  background-color: var(--color-bg-secondary);
  color: var(--color-text);
}
.hero--light .hero__background::after {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0.6) 100%);
}

.hero__logo {
  margin-bottom: 1.5rem;
}
.hero__logo img {
  max-width: 200px;
  height: auto;
}
@media (min-width: 768px) {
  .hero__logo img {
    max-width: 250px;
  }
}

.page-hero {
  position: relative;
  padding: 4rem 0;
  background-color: var(--color-bg-secondary);
  margin-bottom: 2rem;
}
@media (min-width: 768px) {
  .page-hero {
    padding: 5rem 0;
  }
}

.page-hero--dark {
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
}

.page-hero--image {
  color: var(--color-text-inverse);
}
.page-hero--image .page-hero__background {
  position: absolute;
  inset: 0;
}
.page-hero--image .page-hero__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page-hero--image .page-hero__background::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(33, 26, 20, 0.6);
}

.page-hero__content {
  position: relative;
  z-index: 1;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.sermon-header,
.ministry-header,
.event-header,
.programme-header,
.leader-header,
.homegroup-header {
  margin-bottom: 2rem;
}

.sermon-header__image,
.ministry-header__image,
.event-header__image,
.programme-header__image {
  margin-bottom: 1.5rem;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.sermon-header__image img,
.ministry-header__image img,
.event-header__image img,
.programme-header__image img {
  width: 100%;
  height: auto;
  aspect-ratio: 16/7;
  object-fit: cover;
}

.sermon-header__content,
.ministry-header__content,
.event-header__content,
.programme-header__content,
.leader-header__content {
  max-width: var(--content-max-width);
}

.leader-header {
  display: grid;
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .leader-header {
    grid-template-columns: 250px 1fr;
    align-items: start;
  }
}

.leader-header__photo {
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.leader-header__photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: cover;
}

/**
 * Services Section
 *
 * Service times display for homepage and contact page.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.service-times {
  padding: 4rem 0;
  background-color: var(--color-bg-secondary);
}
@media (min-width: 1024px) {
  .service-times {
    padding: 5rem 0;
  }
}

.service-times__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.service-times__header {
  text-align: center;
  margin-bottom: 2rem;
}

.service-times__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.service-times__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
  margin: 0 auto;
}

.service-times__grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .service-times__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .service-times__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.service-card {
  padding: 1.5rem;
  background-color: var(--color-bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  text-align: center;
  transition: box-shadow 300ms cubic-bezier(0, 0, 0.2, 1), transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.service-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-4px);
}

.service-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  margin: 0 auto 1rem;
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-full);
}
.service-card__icon svg {
  width: 28px;
  height: 28px;
}

.service-card__name {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.service-card__day {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-transform: capitalize;
  margin-bottom: 0.25rem;
}

.service-card__time {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.service-card__description {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-top: 0.75rem;
}

.contact-page__services {
  margin-top: 2rem;
}

.contact-page__services-list {
  display: grid;
  gap: 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
@media (min-width: 640px) {
  .contact-page__services-list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .contact-page__services-list {
    grid-template-columns: repeat(3, 1fr);
  }
}

.contact-page__service {
  padding: 1.25rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
  border-left: 4px solid var(--color-gold);
}

.contact-page__service-name {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.contact-page__service-schedule {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: var(--font-size-base);
  margin-bottom: 0.5rem;
}

.contact-page__service-day {
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
}

.contact-page__service-time {
  color: var(--color-text-secondary);
}

.contact-page__service-description {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-top: 0.5rem;
  margin-bottom: 0;
}

.service-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.service-list__item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
  border-bottom: 1px solid var(--color-border);
}
.service-list__item:last-child {
  border-bottom: none;
}

.service-list__name {
  font-weight: var(--font-weight-semibold);
}

.service-list__time {
  color: var(--color-text-secondary);
  text-align: right;
}

.service-times--featured {
  position: relative;
  padding: 5rem 0;
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
}
.service-times--featured .service-times__title {
  color: var(--color-white);
}
.service-times--featured .service-times__subtitle {
  color: rgba(255, 255, 255, 0.8);
}
.service-times--featured .service-card {
  background-color: rgba(255, 255, 255, 0.1);
  color: var(--color-white);
}
.service-times--featured .service-card:hover {
  background-color: rgba(255, 255, 255, 0.15);
}
.service-times--featured .service-card__time {
  color: var(--color-white);
}
.service-times--featured .service-card__description {
  color: rgba(255, 255, 255, 0.7);
}

/**
 * Ministries Section
 *
 * Featured ministries for homepage and ministry-related pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.ministries {
  padding: 4rem 0;
}
@media (min-width: 1024px) {
  .ministries {
    padding: 5rem 0;
  }
}

.ministries__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.ministries__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  margin-bottom: 2rem;
}

.ministries__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.ministries__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
  margin-bottom: 0;
}

.ministries__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.ministries__link:hover {
  color: var(--color-gold-dark);
}
.ministries__link:hover::after {
  transform: translateX(4px);
}
.ministries__link::after {
  content: "→";
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}

.ministries__grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .ministries__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .ministries__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1280px) {
  .ministries__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.ministry-single {
  max-width: var(--content-max-width);
}

.ministry-description,
.ministry-leader,
.ministry-contact,
.ministry-schedule,
.ministry-gallery {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-border);
}
.ministry-description:last-child,
.ministry-leader:last-child,
.ministry-contact:last-child,
.ministry-schedule:last-child,
.ministry-gallery:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.ministry-description h2,
.ministry-leader h2,
.ministry-contact h2,
.ministry-schedule h2,
.ministry-gallery h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.ministry-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.ministry-category-link {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.ministry-category-link:hover {
  background-color: var(--color-gold-dark);
}

.ministry-leader__card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
}

.ministry-leader__photo {
  width: 80px;
  height: 80px;
  flex-shrink: 0;
  border-radius: var(--radius-full);
  overflow: hidden;
}
.ministry-leader__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ministry-leader__info {
  flex: 1;
  min-width: 0;
}

.ministry-leader__name {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.25rem;
}
.ministry-leader__name a {
  color: var(--color-text);
  text-decoration: none;
}
.ministry-leader__name a:hover {
  color: var(--color-gold);
}

.ministry-leader__title {
  display: block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-regular);
  color: var(--color-gold);
  margin-bottom: 2px;
}

.ministry-leader__role {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 0;
}

.ministry-schedule__table {
  width: 100%;
  margin-bottom: 0;
}

.ministry-gallery__grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 768px) {
  .ministry-gallery__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1024px) {
  .ministry-gallery__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.ministry-gallery__item {
  margin: 0;
  border-radius: var(--radius-md);
  overflow: hidden;
  cursor: pointer;
  transition: box-shadow 300ms cubic-bezier(0, 0, 0.2, 1), transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.ministry-gallery__item:hover {
  transform: scale(1.02);
  box-shadow: var(--shadow-md);
}
.ministry-gallery__item:hover img {
  transform: scale(1.05);
}

.ministry-gallery__image {
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: cover;
  transition: transform 300ms cubic-bezier(0, 0, 0.2, 1);
}

.ministries-carousel {
  overflow: hidden;
}

.ministries-carousel__track {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 1rem;
}
.ministries-carousel__track::-webkit-scrollbar {
  display: none;
}
.ministries-carousel__track {
  scrollbar-width: none;
}

.ministries-carousel__item {
  flex: 0 0 280px;
  scroll-snap-align: start;
}
@media (min-width: 768px) {
  .ministries-carousel__item {
    flex: 0 0 320px;
  }
}

.ministries-carousel__nav {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1rem;
}

.ministries-carousel__dot {
  width: 10px;
  height: 10px;
  padding: 0;
  background-color: var(--color-border-dark);
  border: none;
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.ministries-carousel__dot:hover, .ministries-carousel__dot.is-active {
  background-color: var(--color-gold);
}

/**
 * Events Section
 *
 * Upcoming events for homepage and event-related pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.events {
  padding: 4rem 0;
  background-color: var(--color-bg-secondary);
}
@media (min-width: 1024px) {
  .events {
    padding: 5rem 0;
  }
}

.events__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.events__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  margin-bottom: 2rem;
}

.events__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.events__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
  margin-bottom: 0;
}

.events__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.events__link:hover {
  color: var(--color-gold-dark);
}
.events__link:hover::after {
  transform: translateX(4px);
}
.events__link::after {
  content: "→";
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}

.events__grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 1024px) {
  .events__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.event-single {
  max-width: var(--content-max-width);
}

.event-description,
.event-actions {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-border);
}
.event-description:last-child,
.event-actions:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
.event-description h2,
.event-actions h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.event-dates {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  margin-top: 0.75rem;
}
.event-dates__separator {
  color: var(--color-text-secondary);
}

.event-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.events-calendar {
  background-color: var(--color-bg-primary);
  border-radius: var(--radius-lg);
  padding: 1.25rem;
  box-shadow: var(--shadow-sm);
}

.events-calendar__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.25rem;
  gap: 1rem;
}

.events-calendar__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin: 0;
  text-align: center;
  flex: 1;
}

.events-calendar__nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background-color: var(--color-bg-secondary);
  border: none;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
  flex-shrink: 0;
}
.events-calendar__nav-btn:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
}
.events-calendar__nav-btn:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

.events-calendar__grid {
  margin-bottom: 1.5rem;
}

.events-calendar__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  margin-bottom: 0.5rem;
}

.events-calendar__weekday {
  padding: 0.5rem;
  text-align: center;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.025em;
}

.events-calendar__days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  background-color: var(--color-border);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.events-calendar__day {
  aspect-ratio: 1;
  padding: 0.5rem;
  background-color: var(--color-bg-primary);
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 60px;
}
@media (min-width: 768px) {
  .events-calendar__day {
    min-height: 80px;
    padding: 0.75rem;
  }
}
.events-calendar__day--empty {
  background-color: var(--color-bg-secondary);
}
.events-calendar__day--today .events-calendar__day-number {
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: 50%;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.events-calendar__day--has-events {
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.events-calendar__day--has-events:hover {
  background-color: var(--color-bg-secondary);
}
.events-calendar__day--has-events:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: -2px;
}

.events-calendar__day-number {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  margin-bottom: 0.25rem;
}

.events-calendar__day-events {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  justify-content: center;
}

.events-calendar__event-dot {
  width: 6px;
  height: 6px;
  background-color: var(--color-gold);
  border-radius: 50%;
}
@media (min-width: 768px) {
  .events-calendar__event-dot {
    width: 8px;
    height: 8px;
  }
}

.events-calendar__event-more {
  font-size: 10px;
  color: var(--color-text-secondary);
  margin-left: 2px;
}

.events-calendar__events-list {
  border-top: 1px solid var(--color-border);
  padding-top: 1.25rem;
}

.events-calendar__no-events,
.events-calendar__loading {
  text-align: center;
  color: var(--color-text-secondary);
  padding: 1.5rem;
}

.events-calendar__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.events-calendar__list-item {
  display: flex;
  gap: 1rem;
  padding: 0.75rem;
  border-radius: var(--radius-md);
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.events-calendar__list-item:hover {
  background-color: var(--color-bg-secondary);
}
.events-calendar__list-item.is-highlighted {
  background-color: rgba(169, 116, 35, 0.1);
  border-left: 3px solid var(--color-gold);
}

.events-calendar__list-date {
  flex-shrink: 0;
  width: 50px;
  text-align: center;
  padding: 0.5rem;
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-sm);
}

.events-calendar__list-day {
  display: block;
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  line-height: 1;
}

.events-calendar__list-month {
  display: block;
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  margin-top: 2px;
}

.events-calendar__list-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.events-calendar__list-title {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  text-decoration: none;
}
.events-calendar__list-title:hover {
  color: var(--color-gold);
}

.events-calendar__list-range {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.event-archive__view-toggle {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
  padding: 0.5rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-md);
  width: fit-content;
}

.event-archive__view-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background-color: transparent;
  border: none;
  border-radius: var(--radius-sm);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  cursor: pointer;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.event-archive__view-btn svg {
  flex-shrink: 0;
}
.event-archive__view-btn:hover {
  color: var(--color-text);
  background-color: var(--color-bg-primary);
}
.event-archive__view-btn:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
.event-archive__view-btn.is-active {
  background-color: var(--color-bg-primary);
  color: var(--color-gold);
  box-shadow: var(--shadow-sm);
}

.event-archive__panel {
  display: none;
}
.event-archive__panel.is-active {
  display: block;
}

.events-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.events-list__item {
  display: flex;
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--color-border);
}
.events-list__item:first-child {
  padding-top: 0;
}
.events-list__item:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.events-list__date {
  flex-shrink: 0;
  width: 70px;
  text-align: center;
  padding: 0.75rem;
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-md);
}
.events-list__date .day {
  display: block;
  font-size: 1.75rem;
  font-weight: var(--font-weight-bold);
  line-height: 1;
}
.events-list__date .month {
  display: block;
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  margin-top: 0.25rem;
}

.events-list__content {
  flex: 1;
  min-width: 0;
}

.events-list__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.25rem;
}
.events-list__title a {
  color: var(--color-text);
  text-decoration: none;
}
.events-list__title a:hover {
  color: var(--color-gold);
}

.events-list__time {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.events-list__excerpt {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-top: 0.5rem;
}
.events-list__excerpt p {
  margin: 0;
}

.upcoming-events-widget .events-list__item {
  padding: 0.75rem 0;
}
.upcoming-events-widget .events-list__date {
  width: 50px;
  padding: 0.5rem;
}
.upcoming-events-widget .events-list__date .day {
  font-size: var(--font-size-xl);
}
.upcoming-events-widget .events-list__title {
  font-size: var(--font-size-base);
}

/**
 * Sermons Section
 *
 * Sermon archive and single sermon page styling.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.sermons {
  padding: 4rem 0;
}
@media (min-width: 1024px) {
  .sermons {
    padding: 5rem 0;
  }
}

.sermons__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.sermons__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 1rem;
  margin-bottom: 2rem;
}

.sermons__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.sermons__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
  margin-bottom: 0;
}

.sermons__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
}
.sermons__link:hover {
  color: var(--color-gold-dark);
}
.sermons__link:hover::after {
  transform: translateX(4px);
}
.sermons__link::after {
  content: "→";
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}

.sermon-featured {
  display: grid;
  gap: 2rem;
}
@media (min-width: 1024px) {
  .sermon-featured {
    grid-template-columns: 1.5fr 1fr;
    align-items: start;
  }
}

.sermon-featured__video {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.sermon-featured__video iframe {
  width: 100%;
  aspect-ratio: 16/9;
}

.sermon-featured__content {
  padding: 1rem 0;
}
@media (min-width: 1024px) {
  .sermon-featured__content {
    padding: 1.5rem;
    background-color: var(--color-bg-secondary);
    border-radius: var(--radius-lg);
  }
}

.sermon-featured__kicker {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  margin-bottom: 0.5rem;
}

.sermon-featured__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h3);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.75rem;
}
.sermon-featured__title a {
  color: var(--color-text);
  text-decoration: none;
}
.sermon-featured__title a:hover {
  color: var(--color-gold);
}

.sermon-featured__meta {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 1rem;
}

.sermon-featured__preacher {
  color: var(--color-gold);
  font-weight: var(--font-weight-medium);
}

.sermon-featured__scripture {
  font-style: italic;
  color: var(--color-text-secondary);
  margin-bottom: 1rem;
}

.sermon-featured__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.sermon-single {
  max-width: var(--container-lg);
}

.sermon-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-top: 0.75rem;
}

.sermon-meta__preacher {
  color: var(--color-gold);
  font-weight: var(--font-weight-medium);
}
.sermon-meta__preacher a {
  color: inherit;
  text-decoration: none;
}
.sermon-meta__preacher a:hover {
  text-decoration: underline;
}

.sermon-meta__scripture {
  font-style: italic;
}

.sermon-taxonomies {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  margin-top: 1rem;
  font-size: var(--font-size-sm);
}
.sermon-taxonomies strong {
  color: var(--color-text);
}
.sermon-taxonomies a {
  color: var(--color-gold);
  text-decoration: none;
}
.sermon-taxonomies a:hover {
  text-decoration: underline;
}

.sermon-video {
  margin-bottom: 2rem;
}
.sermon-video h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.sermon-video__embed {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
}
.sermon-video__embed iframe,
.sermon-video__embed object,
.sermon-video__embed embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.sermon-audio {
  margin-bottom: 2rem;
  padding: 1.25rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
}
.sermon-audio h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.sermon-audio__player {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 768px) {
  .sermon-audio__player {
    flex-direction: row;
    align-items: center;
  }
}
.sermon-audio__player audio {
  width: 100%;
  flex: 1;
}

.sermon-audio__download {
  flex-shrink: 0;
}

.sermon-transcript {
  margin-bottom: 2rem;
}

.sermon-transcript__toggle {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}
.sermon-transcript__toggle summary {
  padding: 1rem 1.25rem;
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.sermon-transcript__toggle summary:hover {
  background-color: var(--color-bg-secondary);
}
.sermon-transcript__toggle summary:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: -2px;
}
.sermon-transcript__toggle summary h2 {
  display: inline;
  font-size: var(--font-size-h5);
  margin: 0;
}
.sermon-transcript__toggle summary::marker {
  color: var(--color-gold);
}
.sermon-transcript__toggle[open] summary {
  border-bottom: 1px solid var(--color-border);
}

.sermon-transcript__content {
  padding: 1.25rem;
  max-height: 500px;
  overflow-y: auto;
}

.sermon-series-header {
  margin-bottom: 2rem;
  padding: 1.5rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
}
@media (min-width: 768px) {
  .sermon-series-header {
    display: flex;
    gap: 1.5rem;
    align-items: center;
  }
}

.sermon-series-header__image {
  width: 100%;
  max-width: 300px;
  margin-bottom: 1rem;
  border-radius: var(--radius-md);
  overflow: hidden;
}
@media (min-width: 768px) {
  .sermon-series-header__image {
    margin-bottom: 0;
  }
}
.sermon-series-header__image img {
  width: 100%;
  height: auto;
}

.sermon-series-header__content {
  flex: 1;
}

.sermon-series-header__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h3);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.sermon-series-header__count {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 0.75rem;
}

.sermon-series-header__description {
  color: var(--color-text-secondary);
}
.sermon-series-header__description p:last-child {
  margin-bottom: 0;
}

/**
 * Story Block Section
 *
 * Two-column content blocks with image and text, alternating layout.
 * Used on About Us and similar narrative pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.story-block {
  padding: 4rem 0;
}
@media (min-width: 1024px) {
  .story-block {
    padding: 5rem 0;
  }
}

.story-block__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
@media (min-width: 1024px) {
  .story-block__inner {
    display: grid;
    grid-template-columns: 5fr 7fr;
    align-items: center;
  }
}

@media (min-width: 1024px) {
  .story-block--no-media .story-block__inner {
    display: block;
  }
}
.story-block--no-media .story-block__content {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}
.story-block--no-media .story-block__link {
  justify-content: center;
}

@media (min-width: 1024px) {
  .story-block--reverse .story-block__media {
    order: 2;
  }
  .story-block--reverse .story-block__content {
    order: 1;
  }
}

.story-block__media {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.story-block__media img {
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  object-fit: cover;
  display: block;
}

.story-block__eyebrow {
  display: inline-block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-gold);
  margin-bottom: 0.5rem;
}

.story-block__heading {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin: 0.5rem 0 1rem;
}
@media (min-width: 768px) {
  .story-block__heading {
    font-size: 2.25rem;
  }
}

.story-block__body {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
}
.story-block__body p {
  margin-bottom: 1rem;
}
.story-block__body p:last-child {
  margin-bottom: 0;
}

.story-block__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.story-block__link:hover {
  color: rgb(126.75, 87, 26.25);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.story-block__link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}
.story-block__link::after {
  content: "→";
  font-size: 1.1em;
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}
.story-block__link:hover::after {
  transform: translateX(4px);
}

.story-blocks {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}
.story-blocks .story-block {
  padding-left: 0;
  padding-right: 0;
}

/**
 * Stats Band Section
 *
 * Full-bleed statistics section with large numbers and labels.
 * Used on About Us and landing pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.stats-band {
  padding: 4rem 0;
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
}
@media (min-width: 1024px) {
  .stats-band {
    padding: 5rem 0;
  }
}

.stats-band__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.stats-band__eyebrow {
  display: block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-gold);
  text-align: center;
  margin-bottom: 2rem;
}

.stats-band__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  text-align: center;
}
@media (min-width: 768px) {
  .stats-band__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.stats-band__item {
  text-align: center;
}

.stats-band__number {
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  color: var(--color-gold);
  margin-bottom: 0.5rem;
}

.stats-band__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  opacity: 0.8;
}

.stats-band--gold {
  background-color: var(--color-gold);
}
.stats-band--gold .stats-band__eyebrow {
  color: var(--color-white);
  opacity: 0.8;
}
.stats-band--gold .stats-band__number {
  color: var(--color-white);
}

.stats-band__header {
  text-align: center;
  margin-bottom: 2rem;
}

.stats-band__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.stats-band__subtitle {
  font-size: var(--font-size-lg);
  opacity: 0.8;
  max-width: 600px;
  margin: 0 auto;
}

/**
 * Values Grid Section
 *
 * Grid of value/principle cards with icon, title, and description.
 * Used on About Us and similar pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.values-grid {
  padding: 4rem 0;
}
@media (min-width: 1024px) {
  .values-grid {
    padding: 5rem 0;
  }
}

.values-grid__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.values-grid__header {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 2rem;
}

.values-grid__eyebrow {
  display: inline-block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-gold);
  margin-bottom: 0.5rem;
}

.values-grid__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.values-grid__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
  margin: 0 auto;
}

.values-grid__list {
  display: grid;
  gap: 1.5rem;
}
@media (min-width: 640px) {
  .values-grid__list {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .values-grid__list {
    grid-template-columns: repeat(4, 1fr);
  }
}

.value-card {
  padding: 1.5rem;
  background-color: var(--color-bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  border-top: 3px solid var(--color-gold);
  transition: box-shadow 300ms cubic-bezier(0, 0, 0.2, 1), transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.value-card:hover {
  box-shadow: var(--shadow-md);
}

.value-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  margin-bottom: 1rem;
  background-color: var(--color-gold);
  border-radius: var(--radius-full);
}
.value-card__icon svg,
.value-card__icon img {
  width: 24px;
  height: 24px;
  color: var(--color-white);
}
.value-card__icon img {
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.value-card__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.value-card__text {
  font-size: var(--font-size-sm);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
  margin: 0;
}

.values-grid--alt {
  background-color: var(--color-bg-secondary);
}
.values-grid--alt .value-card {
  background-color: var(--color-white);
}

@media (min-width: 1024px) {
  .values-grid--cols-3 .values-grid__list {
    grid-template-columns: repeat(3, 1fr);
  }
}

/**
 * Gallery Block Section
 *
 * Photo grid for church life, events, and ministry images.
 * Used on About Us and Gallery pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.gallery-block {
  padding: 4rem 0;
}
@media (min-width: 1024px) {
  .gallery-block {
    padding: 5rem 0;
  }
}

.gallery-block__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.gallery-block__header {
  text-align: center;
  max-width: 700px;
  margin: 0 auto 2rem;
}

.gallery-block__eyebrow {
  display: inline-block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-gold);
  margin-bottom: 0.5rem;
}

.gallery-block__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.gallery-block__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
  margin: 0 auto;
}

.gallery-block__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}
@media (min-width: 768px) {
  .gallery-block__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1024px) {
  .gallery-block__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
  }
}

.gallery-block__item {
  position: relative;
  aspect-ratio: 1/1;
  border-radius: var(--radius-md);
  overflow: hidden;
}
.gallery-block__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.gallery-block__item:hover img {
  transform: scale(1.05);
}

.gallery-block__item--captioned .gallery-block__caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1rem 0.75rem 0.75rem;
  background: linear-gradient(to top, rgba(33, 26, 20, 0.8) 0%, rgba(33, 26, 20, 0) 100%);
  color: var(--color-white);
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 300ms cubic-bezier(0, 0, 0.2, 1), transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.gallery-block__item--captioned:hover .gallery-block__caption {
  opacity: 1;
  transform: translateY(0);
}

.gallery-block__caption {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
}

.gallery-block__item--featured {
  grid-column: span 2;
  grid-row: span 2;
  aspect-ratio: auto;
}
@media (min-width: 768px) {
  .gallery-block__item--featured {
    aspect-ratio: 1/1;
  }
}

.gallery-block__item--interactive {
  cursor: pointer;
}
.gallery-block__item--interactive::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(33, 26, 20, 0);
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.gallery-block__item--interactive:hover::after {
  background-color: rgba(33, 26, 20, 0.2);
}

.gallery-block--alt {
  background-color: var(--color-bg-secondary);
}

.gallery-block--full .gallery-block__grid {
  gap: 0.5rem;
}
@media (min-width: 1024px) {
  .gallery-block--full .gallery-block__grid {
    gap: 0.5rem;
  }
}
.gallery-block--full .gallery-block__item {
  border-radius: 0;
}

/**
 * Call to Action Section
 *
 * CTA sections for homepage and landing pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.cta, .new-here {
  position: relative;
  padding: 5rem 0;
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
  overflow: hidden;
}

.cta__background {
  position: absolute;
  inset: 0;
}
.cta__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.3;
}
.cta__background::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(33, 26, 20, 0.9) 0%, rgba(107, 79, 53, 0.7) 100%);
}

.cta__inner {
  position: relative;
  z-index: 1;
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
  text-align: center;
}

.cta__kicker {
  display: inline-block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-gold);
  margin-bottom: 1rem;
}

.cta__title {
  font-family: var(--font-display);
  font-size: 2.25rem;
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .cta__title {
    font-size: 3rem;
  }
}

.cta__description {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  max-width: 600px;
  margin: 0 auto 1.5rem;
  opacity: 0.9;
}

.cta__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
}

.cta--light {
  background-color: var(--color-bg-secondary);
  color: var(--color-text);
}
.cta--light .cta__background::after {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(237, 237, 236, 0.8) 100%);
}
.cta--light .cta__description {
  color: var(--color-text-secondary);
}

.cta--gold {
  background-color: var(--color-gold);
}
.cta--gold .cta__kicker {
  color: var(--color-white);
  opacity: 0.8;
}
.cta--gold .cta__background::after {
  background: linear-gradient(135deg, rgba(169, 116, 35, 0.95) 0%, rgba(126.75, 87, 26.25, 0.95) 100%);
}

.cta--split .cta__inner {
  display: grid;
  gap: 2rem;
  text-align: left;
}
@media (min-width: 1024px) {
  .cta--split .cta__inner {
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }
}
@media (min-width: 1024px) {
  .cta--split .cta__content {
    padding-right: 2rem;
  }
}
.cta--split .cta__description {
  margin-left: 0;
  margin-right: 0;
}
.cta--split .cta__actions {
  justify-content: flex-start;
}
.cta--split .cta__image {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-xl);
}
.cta--split .cta__image img {
  width: 100%;
  height: auto;
}

.cta-inline {
  padding: 1.5rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
  margin: 2rem 0;
}
@media (min-width: 768px) {
  .cta-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
  }
}

.cta-inline__content {
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .cta-inline__content {
    margin-bottom: 0;
  }
}

.cta-inline__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.25rem;
}

.cta-inline__description {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 0;
}

.cta-inline__action {
  flex-shrink: 0;
}

.cta-banner {
  padding: 1rem 0;
  background-color: var(--color-gold);
  color: var(--color-white);
  text-align: center;
}

.cta-banner__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}
@media (min-width: 768px) {
  .cta-banner__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
  }
}

.cta-banner__text {
  font-weight: var(--font-weight-medium);
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) {
  .cta-banner__text {
    margin-bottom: 0;
  }
}

.cta-banner__link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.cta-banner__link:hover {
  text-decoration-thickness: 2px;
}

.new-here__features {
  display: grid;
  gap: 1.5rem;
  margin-top: 2rem;
  text-align: left;
}
@media (min-width: 640px) {
  .new-here__features {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .new-here__features {
    grid-template-columns: repeat(3, 1fr);
  }
}

.new-here__feature {
  padding: 1.25rem;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: var(--radius-lg);
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.new-here__feature:hover {
  background-color: rgba(255, 255, 255, 0.15);
}

.new-here__feature-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  margin-bottom: 1rem;
  background-color: var(--color-gold);
  border-radius: var(--radius-full);
}
.new-here__feature-icon svg {
  width: 24px;
  height: 24px;
  color: var(--color-white);
}

.new-here__feature-title {
  font-family: var(--font-display);
  font-size: var(--font-size-h6);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.new-here__feature-description {
  font-size: var(--font-size-sm);
  opacity: 0.8;
  margin-bottom: 0;
}

/**
 * Testimonials Section
 *
 * Member testimonials and welcome messages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.testimonials {
  padding: 4rem 0;
  background-color: var(--color-bg-secondary);
}
@media (min-width: 1024px) {
  .testimonials {
    padding: 5rem 0;
  }
}

.testimonials__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.testimonials__header {
  text-align: center;
  margin-bottom: 2rem;
}

.testimonials__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.testimonials__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
  margin: 0 auto;
}

.testimonials__grid {
  display: grid;
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .testimonials__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .testimonials__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.testimonial-card {
  padding: 1.5rem;
  background-color: var(--color-bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}

.testimonial-card__quote {
  position: relative;
  font-size: var(--font-size-base);
  line-height: var(--line-height-relaxed);
  color: var(--color-text);
  margin-bottom: 1rem;
}
.testimonial-card__quote::before {
  content: "“";
  position: absolute;
  top: -0.5rem;
  left: -0.25rem;
  font-family: var(--font-display);
  font-size: 4rem;
  line-height: 1;
  color: var(--color-gold);
  opacity: 0.3;
}
.testimonial-card__quote p {
  position: relative;
  z-index: 1;
  margin: 0;
}

.testimonial-card__author {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.testimonial-card__photo {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  border-radius: var(--radius-full);
  overflow: hidden;
}
.testimonial-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.testimonial-card__info {
  flex: 1;
  min-width: 0;
}

.testimonial-card__name {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin-bottom: 2px;
}

.testimonial-card__role {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.testimonial-featured {
  padding: 2rem;
  background-color: var(--color-bg);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  text-align: center;
}
@media (min-width: 1024px) {
  .testimonial-featured {
    padding: 2.5rem 3rem;
  }
}

.testimonial-featured__photo {
  width: 80px;
  height: 80px;
  margin: 0 auto 1rem;
  border-radius: var(--radius-full);
  overflow: hidden;
  border: 3px solid var(--color-gold);
}
.testimonial-featured__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.testimonial-featured__quote {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-medium);
  font-style: italic;
  line-height: var(--line-height-relaxed);
  color: var(--color-text);
  max-width: 800px;
  margin: 0 auto 1.5rem;
}
@media (min-width: 768px) {
  .testimonial-featured__quote {
    font-size: var(--font-size-h3);
  }
}

.testimonial-featured__name {
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
}

.testimonial-featured__role {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.welcome-message {
  display: grid;
  gap: 2rem;
}
@media (min-width: 768px) {
  .welcome-message {
    grid-template-columns: 300px 1fr;
    align-items: center;
  }
}
@media (min-width: 1024px) {
  .welcome-message {
    grid-template-columns: 350px 1fr;
  }
}

.welcome-message__image {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.welcome-message__image img {
  width: 100%;
  height: auto;
}

.welcome-message__kicker {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--color-gold);
  margin-bottom: 0.5rem;
}

.welcome-message__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h3);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.welcome-message__text {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
  margin-bottom: 1rem;
}
.welcome-message__text p:last-child {
  margin-bottom: 0;
}

.welcome-message__signature {
  margin-top: 1rem;
}

.welcome-message__author-name {
  font-family: var(--font-display);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
}

.welcome-message__author-title {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.testimonials-carousel {
  overflow: hidden;
}

.testimonials-carousel__track {
  display: flex;
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 1rem;
}
.testimonials-carousel__track::-webkit-scrollbar {
  display: none;
}
.testimonials-carousel__track {
  scrollbar-width: none;
}

.testimonials-carousel__item {
  flex: 0 0 300px;
  scroll-snap-align: start;
}
@media (min-width: 768px) {
  .testimonials-carousel__item {
    flex: 0 0 400px;
  }
}

.testimonials-carousel__nav {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1rem;
}

.testimonials-carousel__dot {
  width: 10px;
  height: 10px;
  padding: 0;
  background-color: var(--color-border-dark);
  border: none;
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: background-color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.testimonials-carousel__dot:hover, .testimonials-carousel__dot.is-active {
  background-color: var(--color-gold);
}

/**
 * Resource Hub Section
 *
 * Spiritual Resources vault page layout and per-category sections.
 * Used on the Resources archive and category pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.resource-hub__intro {
  max-width: 720px;
  margin: 0 auto 2rem;
  padding-top: 2rem;
  text-align: center;
}
@media (min-width: 1024px) {
  .resource-hub__intro {
    padding-top: 2.5rem;
  }
}

.resource-hub__section {
  padding: 2rem 0;
  border-bottom: 1px solid var(--color-border);
}
.resource-hub__section:last-child {
  border-bottom: none;
}

.resource-hub__section-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.resource-hub__section-title {
  font-family: var(--font-display);
  font-size: var(--font-size-h3);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
}

.resource-hub__section-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}
.resource-hub__section-link:hover {
  color: rgb(126.75, 87, 26.25);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.resource-hub__section-link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}
.resource-hub__section-link::after {
  content: "→";
  font-size: 1.1em;
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}
.resource-hub__section-link:hover::after {
  transform: translateX(4px);
}

/**
 * Homepage Template
 *
 * Styles specific to the front-page.php template.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.front-page {
  max-width: none;
  padding: 0;
}
.front-page article {
  max-width: none;
}

.home-welcome {
  padding: 4rem 0;
}
@media (min-width: 1024px) {
  .home-welcome {
    padding: 5rem 0;
  }
}

.home-welcome__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.social-feed {
  padding: 4rem 0;
  background-color: var(--color-bg-secondary);
}
@media (min-width: 1024px) {
  .social-feed {
    padding: 5rem 0;
  }
}

.social-feed__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.social-feed__header {
  text-align: center;
  margin-bottom: 2rem;
}

.social-feed__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}

.social-feed__subtitle {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  max-width: 600px;
  margin: 0 auto;
}

.social-feed__grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 640px) {
  .social-feed__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 768px) {
  .social-feed__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (min-width: 1024px) {
  .social-feed__grid {
    grid-template-columns: repeat(6, 1fr);
  }
}

.social-feed__item {
  aspect-ratio: 1;
  border-radius: var(--radius-md);
  overflow: hidden;
  position: relative;
}
.social-feed__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.social-feed__item:hover img {
  transform: scale(1.05);
}
.social-feed__item::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(33, 26, 20, 0.4);
  opacity: 0;
  transition: opacity 150ms cubic-bezier(0, 0, 0.2, 1);
}
.social-feed__item:hover::after {
  opacity: 1;
}

.social-feed__cta {
  text-align: center;
  margin-top: 2rem;
}

.quick-actions {
  padding: 4rem 0;
}
@media (min-width: 1024px) {
  .quick-actions {
    padding: 5rem 0;
  }
}

.quick-actions__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.quick-actions__grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .quick-actions__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .quick-actions__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.quick-action-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.5rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
  text-align: center;
  text-decoration: none;
  transition: box-shadow 300ms cubic-bezier(0, 0, 0.2, 1), transform 300ms cubic-bezier(0, 0, 0.2, 1);
}
.quick-action-card:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.quick-action-card:hover .quick-action-card__icon {
  background-color: var(--color-white);
  color: var(--color-gold);
}
.quick-action-card:hover .quick-action-card__description {
  color: rgba(255, 255, 255, 0.9);
}

.quick-action-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  margin-bottom: 1rem;
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-full);
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.quick-action-card__icon svg {
  width: 28px;
  height: 28px;
}

.quick-action-card__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
  color: var(--color-text);
}
.quick-action-card:hover .quick-action-card__title {
  color: var(--color-white);
}

.quick-action-card__description {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 0;
  transition: color 150ms cubic-bezier(0, 0, 0.2, 1);
}

.stats-section {
  padding: 4rem 0;
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
}
@media (min-width: 1024px) {
  .stats-section {
    padding: 5rem 0;
  }
}

.stats-section__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.stats-section__grid {
  display: grid;
  gap: 2rem;
  text-align: center;
}
@media (min-width: 640px) {
  .stats-section__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .stats-section__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.stat-item {
  padding: 1rem;
}

.stat-item__number {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: var(--font-weight-bold);
  color: var(--color-gold);
  line-height: 1;
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) {
  .stat-item__number {
    font-size: 3.5rem;
  }
}

.stat-item__label {
  font-size: var(--font-size-lg);
  color: rgba(255, 255, 255, 0.8);
}

.prayer-band {
  padding: 4rem 0;
  background: linear-gradient(135deg, rgba(169, 116, 35, 0.08) 0%, rgba(107, 79, 53, 0.05) 100%);
  border-top: 4px solid var(--color-gold);
  border-bottom: 1px solid var(--color-border);
}
@media (min-width: 1024px) {
  .prayer-band {
    padding: 5rem 0;
  }
}

.prayer-band__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
  display: grid;
  gap: 2rem;
}
@media (min-width: 768px) {
  .prayer-band__inner {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}
@media (min-width: 1024px) {
  .prayer-band__inner {
    grid-template-columns: 5fr 7fr;
    gap: 4rem;
  }
}

.prayer-band__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  margin-bottom: 1rem;
}
@media (min-width: 1024px) {
  .prayer-band__title {
    font-size: var(--font-size-h1);
  }
}

.prayer-band__intro {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
  margin-bottom: 1.5rem;
}

.prayer-band__scripture {
  margin: 0 0 1.5rem;
  padding: 1rem 1.25rem;
  background-color: var(--color-bg);
  border-left: 3px solid var(--color-gold);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
}
.prayer-band__scripture p {
  font-family: var(--font-display);
  font-size: var(--font-size-base);
  font-style: italic;
  line-height: var(--line-height-relaxed);
  color: var(--color-brown);
  margin: 0;
}

.prayer-band__full-form-link {
  font-size: var(--font-size-sm);
  margin-top: 1rem;
}
.prayer-band__full-form-link a {
  color: var(--color-link);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.prayer-band__full-form-link a:hover {
  color: var(--color-link-hover);
}

.prayer-band__form-wrap {
  background-color: var(--color-bg);
  padding: 1.5rem;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}
@media (min-width: 1024px) {
  .prayer-band__form-wrap {
    padding: 2rem;
  }
}

.prayer-band__form {
  max-width: none;
}
@media (max-width: 639px) {
  .prayer-band__form .form-row {
    flex-direction: column;
    gap: 0;
  }
}
.prayer-band__form .form-actions {
  border-top: none;
  padding-top: 0.5rem;
  margin-top: 1rem;
}
.prayer-band__form .btn--primary, .prayer-band__form .product-actions__buy, .prayer-band__form .form-submit .submit, .form-submit .prayer-band__form .submit, .prayer-band__form .search-submit, .prayer-band__form .sermon-filters__submit, .prayer-band__form .newsletter-form button, .newsletter-form .prayer-band__form button, .prayer-band__form .event-actions__register {
  width: 100%;
}
.prayer-band__form textarea {
  min-height: 100px;
}

.prayer-band__form .form-message:empty {
  display: none;
}

/**
 * Page Template
 *
 * Styles specific to standard WordPress pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.page .entry-content {
  max-width: var(--content-max-width);
}

.page-template-template-contact .entry-content,
.site-main--contact .entry-content {
  max-width: none;
}

.contact-page__header {
  margin-bottom: 1.5rem;
}

.contact-page__title {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.5rem;
}
@media (max-width: 767px) {
  .contact-page__title {
    font-size: 2.25rem;
  }
}

.contact-page__featured-image {
  margin-bottom: 2rem;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.contact-page__featured-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 21/9;
  object-fit: cover;
}

.contact-page__content {
  max-width: var(--content-max-width);
  margin-bottom: 2rem;
}

.contact-page__section-title {
  font-family: var(--font-display);
  font-size: var(--font-size-h3);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--color-gold);
}

.contact-page__details {
  margin-bottom: 2rem;
}

.contact-page__details-grid {
  display: grid;
  gap: 1.5rem;
}
@media (min-width: 640px) {
  .contact-page__details-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .contact-page__details-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.contact-page__detail {
  padding: 1.25rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
  border-left: 4px solid var(--color-gold);
}

.contact-page__detail-heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--color-gold);
  margin-bottom: 0.5rem;
}

.contact-page__detail p {
  margin-bottom: 0;
}
.contact-page__detail p a {
  color: var(--color-text);
  text-decoration: none;
}
.contact-page__detail p a:hover {
  color: var(--color-gold);
  text-decoration: underline;
}

.contact-page__hours-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.contact-page__hours-list li {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.25rem 0;
}
.contact-page__hours-list li:not(:last-child) {
  border-bottom: 1px solid var(--color-border);
}

.contact-page__hours-day {
  font-weight: var(--font-weight-medium);
}

.contact-page__hours-time {
  color: var(--color-text-secondary);
}

.contact-page__map {
  margin-bottom: 2rem;
}

.contact-page__map-embed {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.contact-page__map-embed iframe {
  width: 100%;
  min-height: 400px;
  display: block;
}

@media (min-width: 1024px) {
  .page-template-sidebar .site-main {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 2rem;
  }
}
@media (min-width: 1280px) {
  .page-template-sidebar .site-main {
    grid-template-columns: 1fr 350px;
  }
}

.page-template-full-width .site-main {
  max-width: none;
}
.page-template-full-width .entry-content {
  max-width: none;
}

.contact-page__footer {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

/**
 * Single Post Template
 *
 * Styles for single posts and CPT single pages.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
@media (min-width: 1024px) {
  .single .site-main {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 2rem;
  }
}
@media (min-width: 1280px) {
  .single .site-main {
    grid-template-columns: 1fr 350px;
  }
}
.single.no-sidebar .site-main {
  display: block;
}

.single .entry-content {
  max-width: var(--content-max-width);
}

.single-cog_sermon .site-main {
  max-width: 1024px;
}
@media (min-width: 1024px) {
  .single-cog_sermon .site-main {
    display: block;
  }
}

.sermon-content {
  max-width: var(--content-max-width);
}

.sermon-footer {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

.single-cog_ministry .site-main {
  max-width: 1024px;
}
@media (min-width: 1024px) {
  .single-cog_ministry .site-main {
    display: block;
  }
}

.ministry-content {
  max-width: var(--content-max-width);
}

.ministry-footer {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

.single-cog_event .site-main {
  max-width: 1024px;
}
@media (min-width: 1024px) {
  .single-cog_event .site-main {
    display: block;
  }
}

.event-content {
  max-width: var(--content-max-width);
}

.event-footer {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

.single-cog_programme .site-main {
  max-width: 1024px;
}
@media (min-width: 1024px) {
  .single-cog_programme .site-main {
    display: block;
  }
}

.programme-content {
  max-width: var(--content-max-width);
}

.programme-meta {
  margin-bottom: 1.5rem;
  padding: 1.25rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
}

.programme-meta__list {
  display: grid;
  gap: 1rem;
  margin: 0;
}
@media (min-width: 640px) {
  .programme-meta__list {
    grid-template-columns: repeat(2, 1fr);
  }
}

.programme-meta__item dt {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--color-gold);
  margin-bottom: 0.25rem;
}
.programme-meta__item dd {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
}

.programme-types {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.programme-type-link {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  background-color: var(--color-brown);
  color: var(--color-white);
  border-radius: var(--radius-full);
  text-decoration: none;
}
.programme-type-link:hover {
  background-color: var(--color-brown-dark);
}

.programme-description {
  margin-bottom: 2rem;
}
.programme-description h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.programme-footer {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

.single-cog_leader .site-main {
  max-width: 1024px;
}
@media (min-width: 1024px) {
  .single-cog_leader .site-main {
    display: block;
  }
}

.leader-content {
  max-width: var(--content-max-width);
}

.leader-title {
  display: block;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-regular);
  color: var(--color-gold);
  margin-bottom: 0.25rem;
}

.leader-role {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  margin-bottom: 0;
}

.leader-bio {
  margin-bottom: 2rem;
}
.leader-bio h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.leader-footer {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

.single-cog_product .site-main {
  max-width: 1024px;
}
@media (min-width: 1024px) {
  .single-cog_product .site-main {
    display: block;
  }
}

.product-single__layout {
  display: grid;
  gap: 2rem;
}
@media (min-width: 768px) {
  .product-single__layout {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}

.product-single__image {
  border-radius: var(--radius-lg);
  overflow: hidden;
  background-color: var(--color-bg-secondary);
}
.product-single__image img {
  width: 100%;
  height: auto;
}

.product-header {
  margin-bottom: 1rem;
}

.product-categories {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.product-category-link {
  font-size: var(--font-size-sm);
  color: var(--color-gold);
  text-decoration: none;
}
.product-category-link:hover {
  text-decoration: underline;
}

.product-price {
  font-size: 1.75rem;
  font-weight: var(--font-weight-bold);
  color: var(--color-gold);
  margin-bottom: 0;
}

.product-content {
  margin-bottom: 1.5rem;
}

.product-actions {
  margin-bottom: 1.5rem;
}

.product-actions__buy {
  width: 100%;
}

.product-footer {
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

.single-cog_homegroup .site-main {
  max-width: 768px;
}
@media (min-width: 1024px) {
  .single-cog_homegroup .site-main {
    display: block;
  }
}

.homegroup-content {
  max-width: var(--content-max-width);
}

.homegroup-zones {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

.homegroup-zone-link {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  background-color: var(--color-silver);
  color: var(--color-white);
  border-radius: var(--radius-full);
  text-decoration: none;
}
.homegroup-zone-link:hover {
  background-color: var(--color-silver-dark);
}

.homegroup-details {
  margin-bottom: 1.5rem;
  padding: 1.25rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
}
.homegroup-details h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.homegroup-details__list {
  display: grid;
  gap: 0.75rem;
  margin: 0;
}
@media (min-width: 640px) {
  .homegroup-details__list {
    grid-template-columns: repeat(3, 1fr);
  }
}

.homegroup-details__item dt {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--color-text-secondary);
  margin-bottom: 0.25rem;
}
.homegroup-details__item dd {
  margin: 0;
  font-weight: var(--font-weight-medium);
}
.homegroup-details__item dd a {
  color: var(--color-gold);
  text-decoration: none;
}
.homegroup-details__item dd a:hover {
  text-decoration: underline;
}

.homegroup-description {
  margin-bottom: 2rem;
}
.homegroup-description h2 {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.homegroup-footer {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--color-border);
}

/**
 * Archive Template
 *
 * Styles for archive pages including CPT archives.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
@media (min-width: 1024px) {
  .archive .site-main {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 2rem;
  }
}
@media (min-width: 1280px) {
  .archive .site-main {
    grid-template-columns: 1fr 350px;
  }
}
.archive.post-type-archive-cog_sermon .site-main, .archive.post-type-archive-cog_ministry .site-main, .archive.post-type-archive-cog_event .site-main, .archive.post-type-archive-cog_leader .site-main, .archive.post-type-archive-cog_product .site-main, .archive.post-type-archive-cog_programme .site-main, .archive.post-type-archive-cog_homegroup .site-main {
  display: block;
}

.archive .page-header {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-border);
}

.archive-content {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .archive-content {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .archive-content {
    grid-template-columns: repeat(3, 1fr);
  }
}

.post-type-archive-cog_sermon .archive-content {
  display: block;
}

@media (min-width: 1280px) {
  .post-type-archive-cog_ministry .archive-content {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1024px) {
  .post-type-archive-cog_event .archive-content {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 640px) {
  .post-type-archive-cog_leader .archive-content {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 768px) {
  .post-type-archive-cog_leader .archive-content {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1280px) {
  .post-type-archive-cog_leader .archive-content {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1280px) {
  .post-type-archive-cog_product .archive-content {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1280px) {
  .post-type-archive-cog_programme .archive-content {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1024px) {
  .post-type-archive-cog_homegroup .archive-content {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (min-width: 1280px) {
  .post-type-archive-cog_homegroup .archive-content {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1024px) {
  .tax-preacher .archive-content,
  .tax-sermon_topic .archive-content,
  .tax-sermon_series .archive-content,
  .tax-ministry_category .archive-content,
  .tax-programme_type .archive-content,
  .tax-product_category .archive-content,
  .tax-homegroup_zone .archive-content {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .category .archive-content,
  .tag .archive-content {
    grid-template-columns: repeat(2, 1fr);
  }
}

.author .page-header {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
.author .author-avatar {
  width: 100px;
  height: 100px;
  flex-shrink: 0;
  border-radius: var(--radius-full);
  overflow: hidden;
}
.author .author-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.author .author-info {
  flex: 1;
}
.author .author-bio {
  font-size: var(--font-size-base);
  color: var(--color-text-secondary);
  margin-top: 0.5rem;
}

.no-results,
.not-found {
  text-align: center;
  padding: 3rem 0;
}

.no-results .page-content,
.not-found .page-content {
  max-width: 600px;
  margin: 0 auto;
}
.no-results .page-content p,
.not-found .page-content p {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
}
.no-results .page-content .search-form,
.not-found .page-content .search-form {
  max-width: 400px;
  margin: 1.5rem auto 0;
}

/**
 * Search Results Template
 *
 * Styles for search.php template.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
@media (min-width: 1024px) {
  .search .site-main {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 2rem;
  }
}
@media (min-width: 1280px) {
  .search .site-main {
    grid-template-columns: 1fr 350px;
  }
}

.search .page-header {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-border);
}
.search .page-header .page-title span {
  color: var(--color-gold);
  font-style: italic;
}

.search-results {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.search-result {
  display: grid;
  gap: 1rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--color-border);
}
@media (min-width: 768px) {
  .search-result {
    grid-template-columns: 200px 1fr;
  }
}
.search-result:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.search-result__image {
  border-radius: var(--radius-md);
  overflow: hidden;
  aspect-ratio: 16/10;
}
.search-result__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.search-result__image a:hover img {
  opacity: 0.9;
}

.search-result__content {
  display: flex;
  flex-direction: column;
}

.search-result__type {
  display: inline-block;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: var(--color-gold);
  margin-bottom: 0.5rem;
}

.search-result__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: 0.5rem;
}
.search-result__title a {
  color: var(--color-text);
  text-decoration: none;
}
.search-result__title a:hover {
  color: var(--color-gold);
}

.search-result__meta {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  margin-bottom: 0.5rem;
}

.search-result__excerpt {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
  flex-grow: 1;
}
.search-result__excerpt p {
  margin: 0;
}
.search-result__excerpt mark {
  background-color: rgba(169, 116, 35, 0.2);
  color: inherit;
  padding: 0 2px;
  border-radius: 2px;
}

.search-result__link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-gold);
  text-decoration: none;
  margin-top: 0.75rem;
}
.search-result__link:hover {
  color: var(--color-gold-dark);
}
.search-result__link:hover::after {
  transform: translateX(4px);
}
.search-result__link::after {
  content: "→";
  transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);
}

.search .no-results,
.search .not-found {
  text-align: center;
  padding: 3rem 0;
}

.search .no-results .page-content,
.search .not-found .page-content {
  max-width: 600px;
  margin: 0 auto;
}
.search .no-results .page-content p,
.search .not-found .page-content p {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  margin-bottom: 1.5rem;
}
.search .no-results .page-content .search-form,
.search .not-found .page-content .search-form {
  max-width: 500px;
  margin: 0 auto;
}

.search-form--large .search-field {
  padding: 1rem 1.25rem;
  font-size: var(--font-size-lg);
}
.search-form--large .search-submit {
  padding: 1rem 1.5rem;
  font-size: var(--font-size-lg);
}

.search-suggestions {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--color-border);
}

.search-suggestions__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
  text-align: center;
}

.search-suggestions__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.search-suggestions__item a {
  display: inline-block;
  padding: 0.5rem 1rem;
  font-size: var(--font-size-sm);
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.search-suggestions__item a:hover {
  background-color: var(--color-gold);
  color: var(--color-white);
}

/**
 * Error Pages (404)
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.error404 .site-main {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: calc(100vh - var(--header-height) - var(--footer-min-height) - 10rem);
}

.error-404 {
  max-width: 700px;
  margin: 0 auto;
}

.error-404 .page-header {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 1rem;
}
.error-404 .page-header .page-title {
  font-size: 3rem;
  margin-bottom: 0.5rem;
}
@media (min-width: 768px) {
  .error-404 .page-header .page-title {
    font-size: 3rem;
  }
}

.error-404 .page-content {
  max-width: 500px;
  margin: 0 auto;
}
.error-404 .page-content > p {
  font-size: var(--font-size-lg);
  color: var(--color-text-secondary);
  margin-bottom: 1.5rem;
}

.error-404__custom-content {
  margin-bottom: 1.5rem;
  text-align: left;
}
@media (min-width: 768px) {
  .error-404__custom-content {
    text-align: center;
  }
}

.error-404__number {
  font-family: var(--font-display);
  font-size: 8rem;
  font-weight: var(--font-weight-bold);
  line-height: 1;
  color: var(--color-gold);
  opacity: 0.3;
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .error-404__number {
    font-size: 12rem;
  }
}

.error-404 .search-form {
  max-width: 450px;
  margin: 0 auto 2rem;
}

.error-404 .widget-area {
  display: grid;
  gap: 1.5rem;
  text-align: left;
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid var(--color-border);
}
@media (min-width: 640px) {
  .error-404 .widget-area {
    grid-template-columns: repeat(2, 1fr);
  }
}

.error-404 .widget {
  padding: 1.25rem;
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-lg);
  margin-bottom: 0;
  border-bottom: none;
}
.error-404 .widget .widget-title {
  font-size: var(--font-size-h6);
  margin-bottom: 0.75rem;
}
.error-404 .widget ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.error-404 .widget li {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--color-border);
}
.error-404 .widget li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.error-404 .widget a {
  color: var(--color-text);
  text-decoration: none;
}
.error-404 .widget a:hover {
  color: var(--color-gold);
}

.error-404__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

.error-404__illustration {
  max-width: 400px;
  margin: 0 auto 1.5rem;
}
.error-404__illustration img,
.error-404__illustration svg {
  width: 100%;
  height: auto;
}

.error-404--simple {
  padding: 5rem 0;
}
.error-404--simple .page-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}
.error-404--simple .search-form {
  width: 100%;
}
.error-404--simple .widget-area {
  display: none;
}

/**
 * Landing Page Template
 *
 * Full-width landing pages without standard page chrome.
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.page-template-template-landing .site-main {
  max-width: none;
  padding: 0;
}

.landing-section {
  padding: 4rem 0;
}
@media (min-width: 1024px) {
  .landing-section {
    padding: 5rem 0;
  }
}

.landing-section--dark {
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
}

.landing-section--secondary {
  background-color: var(--color-bg-secondary);
}

.landing-section--gold {
  background-color: var(--color-gold);
  color: var(--color-white);
}

.landing-section__inner {
  max-width: var(--container-max-width);
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.landing-hero {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 5rem 0;
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
  overflow: hidden;
}

.landing-hero__background {
  position: absolute;
  inset: 0;
}
.landing-hero__background img,
.landing-hero__background video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.landing-hero__background::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(33, 26, 20, 0.7) 0%, rgba(33, 26, 20, 0.5) 50%, rgba(33, 26, 20, 0.8) 100%);
}

.landing-hero__content {
  position: relative;
  z-index: 1;
  text-align: center;
  max-width: 900px;
  padding: 0 var(--container-padding);
}

.landing-hero__logo {
  margin-bottom: 1.5rem;
}
.landing-hero__logo img {
  max-width: 200px;
  height: auto;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .landing-hero__logo img {
    max-width: 280px;
  }
}

.landing-hero__title {
  font-family: var(--font-display);
  font-size: 3rem;
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .landing-hero__title {
    font-size: 3.5rem;
  }
}
@media (min-width: 1024px) {
  .landing-hero__title {
    font-size: 4rem;
  }
}

.landing-hero__subtitle {
  font-size: var(--font-size-xl);
  line-height: var(--line-height-relaxed);
  max-width: 700px;
  margin: 0 auto 2rem;
  opacity: 0.9;
}

.landing-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
}

.landing-hero__scroll {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--color-white);
  opacity: 0.7;
  animation: bounce 2s infinite;
}
.landing-hero__scroll span {
  font-size: var(--font-size-sm);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.5rem;
}
.landing-hero__scroll svg {
  width: 24px;
  height: 24px;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateX(-50%) translateY(0);
  }
  40% {
    transform: translateX(-50%) translateY(-10px);
  }
  60% {
    transform: translateX(-50%) translateY(-5px);
  }
}
.landing-features {
  display: grid;
  gap: 2rem;
}
@media (min-width: 768px) {
  .landing-features {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .landing-features {
    grid-template-columns: repeat(3, 1fr);
  }
}

.landing-feature {
  text-align: center;
  padding: 1.5rem;
}

.landing-feature__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  margin: 0 auto 1rem;
  background-color: var(--color-gold);
  color: var(--color-white);
  border-radius: var(--radius-full);
}
.landing-feature__icon svg {
  width: 36px;
  height: 36px;
}

.landing-feature__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  margin-bottom: 0.75rem;
}

.landing-feature__description {
  color: var(--color-text-secondary);
  line-height: var(--line-height-relaxed);
}

.landing-split {
  display: grid;
  gap: 2rem;
  align-items: center;
}
@media (min-width: 1024px) {
  .landing-split {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 1024px) {
  .landing-split--reverse .landing-split__image {
    order: 2;
  }
  .landing-split--reverse .landing-split__content {
    order: 1;
  }
}

.landing-split__image {
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.landing-split__image img {
  width: 100%;
  height: auto;
}

@media (min-width: 1024px) {
  .landing-split__content {
    padding: 2rem;
  }
}

.landing-split__kicker {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-gold);
  margin-bottom: 0.5rem;
}

.landing-split__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}

.landing-split__text {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-secondary);
  margin-bottom: 1.5rem;
}

.landing-cta {
  text-align: center;
  padding: 5rem 0;
  background-color: var(--color-bg-dark);
  color: var(--color-text-inverse);
}

.landing-cta__inner {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 var(--container-padding);
}

.landing-cta__title {
  font-family: var(--font-display);
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .landing-cta__title {
    font-size: var(--font-size-h1);
  }
}

.landing-cta__description {
  font-size: var(--font-size-lg);
  opacity: 0.9;
  margin-bottom: 1.5rem;
}

.landing-cta__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
}

.landing-countdown {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 2rem;
}
@media (min-width: 768px) {
  .landing-countdown {
    gap: 1.5rem;
  }
}

.landing-countdown__item {
  text-align: center;
}

.landing-countdown__number {
  font-family: var(--font-display);
  font-size: 2.25rem;
  font-weight: var(--font-weight-bold);
  line-height: 1;
  color: var(--color-gold);
}
@media (min-width: 768px) {
  .landing-countdown__number {
    font-size: 3rem;
  }
}

.landing-countdown__label {
  font-size: var(--font-size-sm);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  margin-top: 0.25rem;
  opacity: 0.8;
}

/**
 * Spacing Utilities
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.m-0 {
  margin: 0;
}

.mt-0 {
  margin-top: 0;
}

.mr-0 {
  margin-right: 0;
}

.mb-0 {
  margin-bottom: 0;
}

.ml-0 {
  margin-left: 0;
}

.mx-0 {
  margin-left: 0;
  margin-right: 0;
}

.my-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.m-1 {
  margin: 0.25rem;
}

.mt-1 {
  margin-top: 0.25rem;
}

.mr-1 {
  margin-right: 0.25rem;
}

.mb-1 {
  margin-bottom: 0.25rem;
}

.ml-1 {
  margin-left: 0.25rem;
}

.mx-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}

.my-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

.m-2 {
  margin: 0.5rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mr-2 {
  margin-right: 0.5rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.ml-2 {
  margin-left: 0.5rem;
}

.mx-2 {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.m-3 {
  margin: 0.75rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mr-3 {
  margin-right: 0.75rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.ml-3 {
  margin-left: 0.75rem;
}

.mx-3 {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}

.my-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.m-4 {
  margin: 1rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mr-4 {
  margin-right: 1rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.ml-4 {
  margin-left: 1rem;
}

.mx-4 {
  margin-left: 1rem;
  margin-right: 1rem;
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.m-5 {
  margin: 1.25rem;
}

.mt-5 {
  margin-top: 1.25rem;
}

.mr-5 {
  margin-right: 1.25rem;
}

.mb-5 {
  margin-bottom: 1.25rem;
}

.ml-5 {
  margin-left: 1.25rem;
}

.mx-5 {
  margin-left: 1.25rem;
  margin-right: 1.25rem;
}

.my-5 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.m-6 {
  margin: 1.5rem;
}

.mt-6 {
  margin-top: 1.5rem;
}

.mr-6 {
  margin-right: 1.5rem;
}

.mb-6 {
  margin-bottom: 1.5rem;
}

.ml-6 {
  margin-left: 1.5rem;
}

.mx-6 {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}

.my-6 {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.m-8 {
  margin: 2rem;
}

.mt-8 {
  margin-top: 2rem;
}

.mr-8 {
  margin-right: 2rem;
}

.mb-8 {
  margin-bottom: 2rem;
}

.ml-8 {
  margin-left: 2rem;
}

.mx-8 {
  margin-left: 2rem;
  margin-right: 2rem;
}

.my-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.m-10 {
  margin: 2.5rem;
}

.mt-10 {
  margin-top: 2.5rem;
}

.mr-10 {
  margin-right: 2.5rem;
}

.mb-10 {
  margin-bottom: 2.5rem;
}

.ml-10 {
  margin-left: 2.5rem;
}

.mx-10 {
  margin-left: 2.5rem;
  margin-right: 2.5rem;
}

.my-10 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

.m-12 {
  margin: 3rem;
}

.mt-12 {
  margin-top: 3rem;
}

.mr-12 {
  margin-right: 3rem;
}

.mb-12 {
  margin-bottom: 3rem;
}

.ml-12 {
  margin-left: 3rem;
}

.mx-12 {
  margin-left: 3rem;
  margin-right: 3rem;
}

.my-12 {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.m-16 {
  margin: 4rem;
}

.mt-16 {
  margin-top: 4rem;
}

.mr-16 {
  margin-right: 4rem;
}

.mb-16 {
  margin-bottom: 4rem;
}

.ml-16 {
  margin-left: 4rem;
}

.mx-16 {
  margin-left: 4rem;
  margin-right: 4rem;
}

.my-16 {
  margin-top: 4rem;
  margin-bottom: 4rem;
}

.m-20 {
  margin: 5rem;
}

.mt-20 {
  margin-top: 5rem;
}

.mr-20 {
  margin-right: 5rem;
}

.mb-20 {
  margin-bottom: 5rem;
}

.ml-20 {
  margin-left: 5rem;
}

.mx-20 {
  margin-left: 5rem;
  margin-right: 5rem;
}

.my-20 {
  margin-top: 5rem;
  margin-bottom: 5rem;
}

.m-24 {
  margin: 6rem;
}

.mt-24 {
  margin-top: 6rem;
}

.mr-24 {
  margin-right: 6rem;
}

.mb-24 {
  margin-bottom: 6rem;
}

.ml-24 {
  margin-left: 6rem;
}

.mx-24 {
  margin-left: 6rem;
  margin-right: 6rem;
}

.my-24 {
  margin-top: 6rem;
  margin-bottom: 6rem;
}

.m-32 {
  margin: 8rem;
}

.mt-32 {
  margin-top: 8rem;
}

.mr-32 {
  margin-right: 8rem;
}

.mb-32 {
  margin-bottom: 8rem;
}

.ml-32 {
  margin-left: 8rem;
}

.mx-32 {
  margin-left: 8rem;
  margin-right: 8rem;
}

.my-32 {
  margin-top: 8rem;
  margin-bottom: 8rem;
}

.p-0 {
  padding: 0;
}

.pt-0 {
  padding-top: 0;
}

.pr-0 {
  padding-right: 0;
}

.pb-0 {
  padding-bottom: 0;
}

.pl-0 {
  padding-left: 0;
}

.px-0 {
  padding-left: 0;
  padding-right: 0;
}

.py-0 {
  padding-top: 0;
  padding-bottom: 0;
}

.p-1 {
  padding: 0.25rem;
}

.pt-1 {
  padding-top: 0.25rem;
}

.pr-1 {
  padding-right: 0.25rem;
}

.pb-1 {
  padding-bottom: 0.25rem;
}

.pl-1 {
  padding-left: 0.25rem;
}

.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.p-2 {
  padding: 0.5rem;
}

.pt-2 {
  padding-top: 0.5rem;
}

.pr-2 {
  padding-right: 0.5rem;
}

.pb-2 {
  padding-bottom: 0.5rem;
}

.pl-2 {
  padding-left: 0.5rem;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.p-3 {
  padding: 0.75rem;
}

.pt-3 {
  padding-top: 0.75rem;
}

.pr-3 {
  padding-right: 0.75rem;
}

.pb-3 {
  padding-bottom: 0.75rem;
}

.pl-3 {
  padding-left: 0.75rem;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.p-4 {
  padding: 1rem;
}

.pt-4 {
  padding-top: 1rem;
}

.pr-4 {
  padding-right: 1rem;
}

.pb-4 {
  padding-bottom: 1rem;
}

.pl-4 {
  padding-left: 1rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.p-5 {
  padding: 1.25rem;
}

.pt-5 {
  padding-top: 1.25rem;
}

.pr-5 {
  padding-right: 1.25rem;
}

.pb-5 {
  padding-bottom: 1.25rem;
}

.pl-5 {
  padding-left: 1.25rem;
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.p-6 {
  padding: 1.5rem;
}

.pt-6 {
  padding-top: 1.5rem;
}

.pr-6 {
  padding-right: 1.5rem;
}

.pb-6 {
  padding-bottom: 1.5rem;
}

.pl-6 {
  padding-left: 1.5rem;
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.py-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.p-8 {
  padding: 2rem;
}

.pt-8 {
  padding-top: 2rem;
}

.pr-8 {
  padding-right: 2rem;
}

.pb-8 {
  padding-bottom: 2rem;
}

.pl-8 {
  padding-left: 2rem;
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.p-10 {
  padding: 2.5rem;
}

.pt-10 {
  padding-top: 2.5rem;
}

.pr-10 {
  padding-right: 2.5rem;
}

.pb-10 {
  padding-bottom: 2.5rem;
}

.pl-10 {
  padding-left: 2.5rem;
}

.px-10 {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.p-12 {
  padding: 3rem;
}

.pt-12 {
  padding-top: 3rem;
}

.pr-12 {
  padding-right: 3rem;
}

.pb-12 {
  padding-bottom: 3rem;
}

.pl-12 {
  padding-left: 3rem;
}

.px-12 {
  padding-left: 3rem;
  padding-right: 3rem;
}

.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.p-16 {
  padding: 4rem;
}

.pt-16 {
  padding-top: 4rem;
}

.pr-16 {
  padding-right: 4rem;
}

.pb-16 {
  padding-bottom: 4rem;
}

.pl-16 {
  padding-left: 4rem;
}

.px-16 {
  padding-left: 4rem;
  padding-right: 4rem;
}

.py-16 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.p-20 {
  padding: 5rem;
}

.pt-20 {
  padding-top: 5rem;
}

.pr-20 {
  padding-right: 5rem;
}

.pb-20 {
  padding-bottom: 5rem;
}

.pl-20 {
  padding-left: 5rem;
}

.px-20 {
  padding-left: 5rem;
  padding-right: 5rem;
}

.py-20 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.p-24 {
  padding: 6rem;
}

.pt-24 {
  padding-top: 6rem;
}

.pr-24 {
  padding-right: 6rem;
}

.pb-24 {
  padding-bottom: 6rem;
}

.pl-24 {
  padding-left: 6rem;
}

.px-24 {
  padding-left: 6rem;
  padding-right: 6rem;
}

.py-24 {
  padding-top: 6rem;
  padding-bottom: 6rem;
}

.p-32 {
  padding: 8rem;
}

.pt-32 {
  padding-top: 8rem;
}

.pr-32 {
  padding-right: 8rem;
}

.pb-32 {
  padding-bottom: 8rem;
}

.pl-32 {
  padding-left: 8rem;
}

.px-32 {
  padding-left: 8rem;
  padding-right: 8rem;
}

.py-32 {
  padding-top: 8rem;
  padding-bottom: 8rem;
}

.gap-0 {
  gap: 0;
}

.gap-1 {
  gap: 0.25rem;
}

.gap-2 {
  gap: 0.5rem;
}

.gap-3 {
  gap: 0.75rem;
}

.gap-4 {
  gap: 1rem;
}

.gap-5 {
  gap: 1.25rem;
}

.gap-6 {
  gap: 1.5rem;
}

.gap-8 {
  gap: 2rem;
}

.gap-10 {
  gap: 2.5rem;
}

.gap-12 {
  gap: 3rem;
}

.gap-16 {
  gap: 4rem;
}

.gap-20 {
  gap: 5rem;
}

.gap-24 {
  gap: 6rem;
}

.gap-32 {
  gap: 8rem;
}

/**
 * Visibility Utilities
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.hidden {
  display: none !important;
}

.invisible {
  visibility: hidden !important;
}

@media (max-width: 767px) {
  .hide-mobile {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .hide-tablet {
    display: none !important;
  }
}
@media (min-width: 1024px) {
  .hide-desktop {
    display: none !important;
  }
}
@media (min-width: 768px) {
  .show-mobile {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .show-tablet {
    display: none !important;
  }
}
@media (min-width: 1024px) {
  .show-tablet {
    display: none !important;
  }
}

@media (max-width: 1023px) {
  .show-desktop {
    display: none !important;
  }
}

/**
 * Text Utilities
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.font-regular {
  font-weight: var(--font-weight-regular);
}

.font-medium {
  font-weight: var(--font-weight-medium);
}

.font-semibold {
  font-weight: var(--font-weight-semibold);
}

.font-bold {
  font-weight: var(--font-weight-bold);
}

.uppercase {
  text-transform: uppercase;
}

.lowercase {
  text-transform: lowercase;
}

.capitalize {
  text-transform: capitalize;
}

.normal-case {
  text-transform: none;
}

.text-primary {
  color: var(--color-text);
}

.text-secondary {
  color: var(--color-text-secondary);
}

.text-muted {
  color: var(--color-text-muted);
}

.text-gold {
  color: var(--color-gold);
}

.text-white {
  color: var(--color-white);
}

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/**
 * Display Utilities
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.inline {
  display: inline;
}

.flex {
  display: flex;
}

.inline-flex {
  display: inline-flex;
}

.grid {
  display: grid;
}

.flex-row {
  flex-direction: row;
}

.flex-col {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-nowrap {
  flex-wrap: nowrap;
}

.justify-start {
  justify-content: flex-start;
}

.justify-center {
  justify-content: center;
}

.justify-end {
  justify-content: flex-end;
}

.justify-between {
  justify-content: space-between;
}

.justify-around {
  justify-content: space-around;
}

.items-start {
  align-items: flex-start;
}

.items-center {
  align-items: center;
}

.items-end {
  align-items: flex-end;
}

.items-stretch {
  align-items: stretch;
}

.flex-1 {
  flex: 1 1 0%;
}

.flex-auto {
  flex: 1 1 auto;
}

.flex-none {
  flex: none;
}

.w-full {
  width: 100%;
}

.w-auto {
  width: auto;
}

.max-w-full {
  max-width: 100%;
}

.h-full {
  height: 100%;
}

.h-auto {
  height: auto;
}

.min-h-screen {
  min-height: 100vh;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.fixed {
  position: fixed;
}

.sticky {
  position: sticky;
}

/**
 * Accessibility Utilities
 *
 * @package COG_Theme
 * @since   1.0.0
 */
.screen-reader-text, .visually-hidden,
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.screen-reader-text:focus, .visually-hidden:focus, .screen-reader-text:active, .visually-hidden:active,
.sr-only:focus,
.sr-only:active {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
}

.skip-link {
  position: absolute;
  top: -100px;
  left: 1rem;
  z-index: 999999;
  padding: 0.75rem 1.25rem;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-white);
  background-color: var(--color-gold);
  border-radius: var(--radius-md);
  text-decoration: none;
  box-shadow: var(--shadow-lg);
  transition: top 150ms cubic-bezier(0, 0, 0.2, 1);
}
.skip-link:focus {
  top: 1rem;
  outline: 2px solid var(--color-ink);
  outline-offset: 2px;
}

.focus-visible,
:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}

.focus-ring:focus {
  outline: none;
  box-shadow: 0 0 0 3px var(--color-focus-ring);
}

.js-focus-visible :focus:not(.focus-visible) {
  outline: none;
}

@media (forced-colors: active) {
  .btn, .form-submit .submit, .search-submit, .sermon-filters__submit, .sermon-filters__clear, .newsletter-form button, .load-more__button, .event-actions__brochure, .event-actions__register, .sermon-audio__download, .product-actions__buy {
    border: 2px solid currentColor;
  }
  :focus {
    outline: 3px solid Highlight;
    outline-offset: 2px;
  }
  a {
    text-decoration: underline;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  .reduce-motion,
  .reduce-motion * {
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
    transition-duration: 0.01ms;
  }
  .card:hover, .ministry-card:hover, .event-card:hover, .sermon-card:hover, .leader-card:hover, .product-card:hover, .programme-card:hover, .homegroup-card:hover, .resource-card:hover,
  .btn:hover,
  .form-submit .submit:hover,
  .search-submit:hover,
  .sermon-filters__submit:hover,
  .sermon-filters__clear:hover,
  .newsletter-form button:hover,
  .load-more__button:hover,
  .event-actions__brochure:hover,
  .event-actions__register:hover,
  .sermon-audio__download:hover,
  .product-actions__buy:hover {
    transform: none;
  }
}
.touch-target {
  position: relative;
  min-width: 44px;
  min-height: 44px;
}
.touch-target::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
}

.readable {
  line-height: 1.5;
  letter-spacing: 0.12em;
  word-spacing: 0.16em;
}
.readable p {
  margin-bottom: 2em;
}

.text-on-dark {
  color: var(--color-white);
}
.text-on-dark a {
  color: var(--color-gold-light);
}
.text-on-dark a:hover {
  color: var(--color-white);
}

.text-on-gold {
  color: var(--color-white);
}
.text-on-gold a {
  color: var(--color-white);
  text-decoration: underline;
}
.text-on-gold a:hover {
  color: var(--color-ink);
}

.hidden-all {
  display: none;
  visibility: hidden;
}

[data-shortcut]::after {
  content: " (" attr(data-shortcut) ")";
  font-size: 0.8em;
  opacity: 0.7;
}

@media (pointer: coarse) {
  [data-shortcut]::after {
    display: none;
  }
}
[aria-busy=true] {
  cursor: wait;
}

.loading-indicator {
  position: relative;
}
.loading-indicator::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
  border: 3px solid var(--color-bg-secondary);
  border-top-color: var(--color-gold);
  border-radius: 50%;
  animation: spin 1000ms linear infinite;
}

.alert {
  padding: 1rem;
  border-radius: var(--radius-md);
  margin-bottom: 1rem;
}
.alert--error {
  background-color: rgba(211, 47, 47, 0.1);
  border: 1px solid #D32F2F;
  color: #D32F2F;
}
.alert--success {
  background-color: rgba(46, 125, 50, 0.1);
  border: 1px solid #2E7D32;
  color: #2E7D32;
}
.alert--warning {
  background-color: rgba(237, 108, 2, 0.1);
  border: 1px solid #ED6C02;
  color: rgb(161.140167364, 73.4309623431, 1.359832636);
}
.alert--info {
  background-color: rgba(2, 136, 209, 0.1);
  border: 1px solid #0288D1;
  color: #0288D1;
}
