/* =========================================================
   Jonathan Alphonso theme — front end + editor styles
   Tokens mirror theme.json. Class prefix: ja-
   ========================================================= */

:root {
  --ja-ink: #0E0E0E;
  --ja-ink-soft: #2A2A2A;
  --ja-ink-card: #1C1C1B;
  --ja-paper: #FFFFFF;
  --ja-offwhite: #F3F2EE;
  --ja-line: #E3E1DB;
  --ja-stone: #D9D6CE;
  --ja-stone-2: #CFCBC1;
  --ja-stone-3: #C6C2B8;
  --ja-muted: #5A5955;
  --ja-muted-light: #B5B3AC;
  --ja-brass: #C9A227;
  --ja-brass-text: #8A6520;
  --ja-ease: .18s ease;
  --ja-display: Archivo, "DM Sans", system-ui, sans-serif;
  --ja-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
  --ja-arrow-ext: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");
  --ja-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  --ja-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  --ja-icon-home: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11 12 3l9 8M5 10v10h14V10'/%3E%3C/svg%3E");
  --ja-icon-home-key: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11 12 3l9 8M5 10v10h14V10M12 13v4'/%3E%3C/svg%3E");
  --ja-icon-card: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 10h18M7 15h4'/%3E%3C/svg%3E");
  --ja-icon-cap: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 2 8l10 5 10-5-10-5zM6 10v6c0 1.5 3 3 6 3s6-1.5 6-3v-6'/%3E%3C/svg%3E");
  --ja-icon-screen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16v12H4zM8 20h8M12 16v4'/%3E%3C/svg%3E");
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
:focus-visible { outline: 2px solid var(--ja-brass-text); outline-offset: 3px; }

/* ---------- helpers ---------- */
.ja-display { font-family: var(--ja-display); letter-spacing: -0.02em; }
.ja-wrap .ja-eyebrow,
.ja-foot .ja-eyebrow,
.ja-eyebrow { font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; margin: 0 0 16px; }
.ja-wrap .ja-eyebrow-lg { margin-bottom: 24px; }
.ja-wrap .ja-lead { font-size: clamp(18px, 1.6vw, 20px); line-height: 1.55; margin: 0 0 40px; }
.ja-wrap .ja-lead-tight { margin-bottom: 0; }
.ja-wrap .ja-h-72 { font-size: clamp(46px, 5.4vw, 72px); line-height: 1; margin: 0 0 28px; }
.ja-wrap .ja-h-84 { font-size: clamp(48px, 6vw, 84px); line-height: .98; margin: 0 0 28px; }
.ja-wrap .ja-h-48 { font-size: clamp(34px, 3.6vw, 48px); line-height: 1.05; margin: 0; }
.ja-wrap .ja-h-44 { font-size: clamp(32px, 3.3vw, 44px); line-height: 1.05; margin: 0 0 20px; }
.ja-wrap .ja-h-40 { font-size: clamp(30px, 3vw, 40px); line-height: 1.05; margin: 0 0 12px; }
.ja-wrap .ja-mb-0 { margin-bottom: 0; }
.ja-wrap .ja-mb-16 { margin-bottom: 16px; }
.ja-wrap .ja-mb-24 { margin-bottom: 24px; }
.ja-wrap .ja-mb-32 { margin-bottom: 32px; }
.ja-wrap .ja-mb-48 { margin-bottom: 48px; }
.ja-wrap .ja-mt-0 { margin-top: 0; }
.ja-mw-11 { max-width: 11ch; }
.ja-mw-14 { max-width: 14ch; }
.ja-mw-16 { max-width: 16ch; }
.ja-mw-18 { max-width: 18ch; }
.ja-mw-20 { max-width: 20ch; }
.ja-mw-40 { max-width: 40ch; }
.ja-mw-46 { max-width: 46ch; }
.ja-mw-50 { max-width: 50ch; }
.ja-mw-52 { max-width: 52ch; }
.ja-mw-56 { max-width: 56ch; }
.ja-mw-64 { max-width: 64ch; }
.ja-mw-480 { max-width: 480px; }
.ja-mw-560 { max-width: 560px; }
.ja-mw-760 { max-width: 760px; }
.ja-wrap .ja-copy { font-size: 18px; line-height: 1.6; margin: 0 0 18px; }
.ja-wrap .ja-copy-17 { font-size: 17px; line-height: 1.65; margin: 0 0 28px; }
.ja-wrap .ja-copy-16 { font-size: 16px; line-height: 1.6; margin: 0; }
.ja-wrap .ja-story p { font-size: 19px; line-height: 1.65; margin: 0; }
.ja-wrap .ja-story { display: grid; gap: 28px; }
.ja-wrap .ja-muted-p { font-size: 16px; line-height: 1.6; margin: 0; }

/* ---------- sections ---------- */
.ja-section { padding-top: 96px; padding-bottom: 96px; }
.ja-section-72 { padding-top: 72px; padding-bottom: 72px; }
.ja-section-104 { padding-top: 104px; padding-bottom: 104px; }
.ja-section-112 { padding-top: 112px; padding-bottom: 112px; }
.ja-section-hero { padding-top: 96px; padding-bottom: 0; }
.ja-section-hero-88 { padding-top: 88px; padding-bottom: 0; }
.ja-section-hero-flat { padding-top: 96px; padding-bottom: 88px; }
.ja-section-cta { padding-top: 0; padding-bottom: 96px; }
.ja-section-blog-head { padding-top: 88px; padding-bottom: 48px; }
.ja-section-blog-grid { padding-top: 16px; padding-bottom: 80px; }
@media (max-width: 720px) {
  .ja-section, .ja-section-104, .ja-section-112 { padding-top: 64px; padding-bottom: 64px; }
  .ja-section-72 { padding-top: 48px; padding-bottom: 48px; }
  .ja-section-hero, .ja-section-hero-88 { padding-top: 56px; }
  .ja-section-hero-flat { padding-top: 56px; padding-bottom: 56px; }
  .ja-section-cta { padding-bottom: 64px; }
  .ja-section-blog-head { padding-top: 56px; padding-bottom: 32px; }
}

/* section header row (heading left, button right) */
.ja-wrap .ja-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; margin: 0 0 48px; }
.ja-wrap .ja-row > * { margin: 0; }
.ja-wrap .ja-row .wp-block-buttons { margin: 0; }

/* ---------- header ---------- */
.wp-site-blocks > header.wp-block-template-part,
.wp-site-blocks > .wp-block-template-part.ja-header-part { position: sticky; top: 0; z-index: 50; }
.ja-header {
  background: rgba(255, 255, 255, .86);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--ja-line);
}
.ja-header-inner { min-height: 76px; }
.ja-header .wp-block-site-title { margin: 0; }
.ja-header .wp-block-site-title a { color: var(--ja-ink); }
.ja-nav .wp-block-navigation-item__content { text-decoration: none; font-size: 15px; font-weight: 500; padding: 6px 0; position: relative; }
.ja-nav .wp-block-navigation-item__content::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1.5px; background: var(--ja-ink);
  transform: scaleX(0); transform-origin: left; transition: transform var(--ja-ease);
}
.ja-nav .wp-block-navigation-item:hover > .wp-block-navigation-item__content::after,
.ja-nav .current-menu-item > .wp-block-navigation-item__content::after { transform: scaleX(1); }
.ja-nav .current-menu-item > .wp-block-navigation-item__content { font-weight: 600; }
.ja-nav .wp-block-navigation__responsive-container-open {
  width: 44px; height: 44px; border: 1.5px solid var(--ja-ink); border-radius: 999px; color: var(--ja-ink);
  align-items: center; justify-content: center; padding: 0; background: transparent;
}
@media (max-width: 599px) { .ja-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: inline-flex; } }
.ja-nav .wp-block-navigation__responsive-container-close { width: 44px; height: 44px; border: 1.5px solid var(--ja-ink); border-radius: 999px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.ja-nav .wp-block-navigation__responsive-container.is-menu-open { background: var(--ja-paper); padding: 24px var(--wp--custom--gutter); }
.ja-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: var(--ja-display); font-size: 30px; font-weight: 700; letter-spacing: -0.02em; }
.ja-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content::after { display: none; }
.ja-header-cta .wp-block-button__link { min-height: 44px; padding: 10px 20px; font-size: 15px; }
@media (max-width: 599px) { .ja-header .ja-header-cta.wp-block-buttons { display: none; } }

/* ---------- buttons ---------- */
.wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px;
  transition: transform var(--ja-ease), background-color var(--ja-ease), color var(--ja-ease), border-color var(--ja-ease);
}
.wp-block-button:hover .wp-block-button__link { transform: translateY(-2px); }
.wp-block-button.ja-btn-ghost .wp-block-button__link { background: transparent; color: var(--ja-ink); border-color: var(--ja-ink); }
.wp-block-button.ja-btn-ghost:hover .wp-block-button__link { background: var(--ja-ink); color: var(--ja-paper); }
.wp-block-button.ja-btn-paper .wp-block-button__link { background: var(--ja-paper); color: var(--ja-ink); }
.wp-block-button.ja-btn-paper:hover .wp-block-button__link { background: var(--ja-offwhite); color: var(--ja-ink); }
.wp-block-button.ja-btn-ghost-light .wp-block-button__link { background: transparent; color: var(--ja-paper); border-color: rgba(255, 255, 255, .4); }
.wp-block-button.ja-btn-ghost-light:hover .wp-block-button__link { border-color: var(--ja-paper); color: var(--ja-paper); background: transparent; }
.wp-block-button.ja-btn-sm .wp-block-button__link { min-height: 44px; padding: 10px 18px; font-size: 14px; }
.wp-block-button.ja-btn-48 .wp-block-button__link { min-height: 48px; padding: 12px 24px; }
.wp-block-button.ja-arrow .wp-block-button__link::after,
.wp-block-button.ja-arrow-ext .wp-block-button__link::after {
  content: ""; flex: none; width: 18px; height: 18px; background: currentColor;
  -webkit-mask: var(--ja-arrow) center / contain no-repeat; mask: var(--ja-arrow) center / contain no-repeat;
  transition: transform var(--ja-ease);
}
.wp-block-button.ja-arrow-ext .wp-block-button__link::after { width: 16px; height: 16px; -webkit-mask-image: var(--ja-arrow-ext); mask-image: var(--ja-arrow-ext); }
.wp-block-button.ja-arrow:hover .wp-block-button__link::after { transform: translateX(4px); }
.wp-block-button.ja-arrow-ext:hover .wp-block-button__link::after { transform: translate(2px, -2px); }
.ja-wrap .wp-block-buttons { margin: 0; }
.ja-wrap .ja-btn-row { margin-top: 0; }

/* ---------- hero (home) ---------- */
.ja-hero .wp-block-columns { align-items: flex-end; }
.ja-wrap .ja-hero-copy { padding-bottom: 88px; }
.ja-hero-photo { margin: 0; }
.ja-hero-photo img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center top; border-radius: 24px 24px 0 0; }
.ja-press-strip { border-top: 1px solid rgba(255, 255, 255, .12); }
.ja-press-strip .ja-press-inner { display: flex; align-items: center; gap: 24px 40px; padding: 26px 0; flex-wrap: wrap; }
.ja-press-strip .ja-eyebrow { margin: 0; flex-shrink: 0; }
.ja-press { display: flex; gap: 20px 48px; align-items: center; flex-wrap: wrap; margin: 0; }
.ja-press .ja-press-name { font-family: var(--ja-display); font-weight: 800; font-size: 20px; letter-spacing: -0.02em; margin: 0; }
.ja-press-22 .ja-press-name { font-size: 22px; }
@media (max-width: 781px) {
  .ja-wrap .ja-hero-copy { padding-bottom: 48px; }
  .ja-hero-photo img { aspect-ratio: 4 / 4.2; }
}
@media (max-width: 720px) { .ja-press { gap: 12px 28px; } }

/* page heroes (about, services) */
.ja-hero-about .wp-block-columns { align-items: flex-end; }
.ja-wrap .ja-hero-about-copy { padding-bottom: 80px; }
@media (max-width: 781px) { .ja-wrap .ja-hero-about-copy { padding-bottom: 40px; } }
.ja-wrap .ja-hero-flat { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; flex-wrap: wrap; }
.ja-wrap .ja-hero-flat > * { margin: 0; }
.ja-wrap .ja-jump { display: flex; gap: 10px; flex-wrap: wrap; }
.ja-wrap .ja-jump .wp-block-buttons { gap: 10px; }

/* ---------- stats ---------- */
.ja-wrap .ja-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; }
.ja-wrap .ja-stat { padding: 40px 32px; border-left: 1px solid var(--ja-line); margin: 0; }
.ja-wrap .ja-stat:first-child { border-left: 0; padding-left: 0; }
.ja-wrap .ja-stat-num { font-family: var(--ja-display); font-weight: 800; font-size: clamp(40px, 4.2vw, 56px); line-height: 1; letter-spacing: -0.02em; margin: 0; }
.ja-wrap .ja-stat-label { margin: 10px 0 0; font-size: 15px; line-height: 1.5; color: var(--ja-muted); }
@media (max-width: 960px) {
  .ja-wrap .ja-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 8px; }
  .ja-wrap .ja-stat { padding: 24px 0 24px 24px; }
  .ja-wrap .ja-stat:nth-child(odd) { border-left: 0; padding-left: 0; }
}
@media (max-width: 600px) {
  .ja-wrap .ja-stats { grid-template-columns: minmax(0, 1fr); row-gap: 0; }
  .ja-wrap .ja-stat, .ja-wrap .ja-stat:nth-child(odd) { border-left: 0; border-top: 1px solid var(--ja-line); padding: 20px 0; }
  .ja-wrap .ja-stat:first-child { border-top: 0; padding-top: 0; }
}

/* ---------- cards (services on home) ---------- */
.ja-wrap .ja-cards { margin: 0; }
.ja-card {
  position: relative; background: var(--ja-paper); border-radius: 20px; overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease;
}
.ja-card:hover { transform: translateY(-6px); box-shadow: 0 24px 48px rgba(14, 14, 14, .10); }
.ja-card .wp-block-image, .ja-card .ja-ph { margin: 0; overflow: hidden; border-radius: 0; }
.ja-card .wp-block-image img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .5s ease; }
.ja-card:hover .wp-block-image img { transform: scale(1.04); }
.ja-card .ja-ph { aspect-ratio: 4 / 3; transition: transform .5s ease; }
.ja-card:hover .ja-ph { transform: scale(1.04); }
.ja-wrap .ja-card-body { padding: 28px 28px 32px; margin: 0; }
.ja-wrap .ja-card-body h3 { font-size: 24px; margin: 0 0 10px; }
.ja-wrap .ja-card-body p { font-size: 16px; line-height: 1.55; color: var(--ja-muted); margin: 0 0 20px; }
.ja-wrap .ja-card-body .ja-card-link { margin: 0; }
.ja-card-link a {
  font-weight: 600; font-size: 15px; color: var(--ja-ink); text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
}
.ja-card-link a::before { content: ""; position: absolute; inset: 0; }
.ja-card-link a::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--ja-arrow) center / contain no-repeat; mask: var(--ja-arrow) center / contain no-repeat; transition: transform var(--ja-ease); }
.ja-card-link.ja-ext a::after { -webkit-mask-image: var(--ja-arrow-ext); mask-image: var(--ja-arrow-ext); }
.ja-card:hover .ja-card-link a::after { transform: translateX(4px); }
.ja-card:hover .ja-card-link.ja-ext a::after { transform: translate(2px, -2px); }

/* grey labelled placeholders (swap for photos) */
.ja-ph { position: relative; background: var(--ja-stone); aspect-ratio: 4 / 3; border-radius: 16px; overflow: hidden; }
.ja-ph-2 { background: var(--ja-stone-2); }
.ja-ph-3 { background: var(--ja-stone-3); }
.ja-ph-16x10 { aspect-ratio: 16 / 10; }
.ja-ph-4x5 { aspect-ratio: 4 / 5; border-radius: 24px; }
.ja-ph-r24 { border-radius: 24px; }
.ja-wrap .ja-ph-label, .ja-ph-label {
  position: absolute; left: 14px; bottom: 12px; margin: 0;
  font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--ja-muted);
}

/* ---------- about teaser / photo with badge ---------- */
.ja-wrap .ja-two { align-items: center; }
.ja-photo-badge { position: relative; margin: 0; }
.ja-photo-badge .wp-block-image { margin: 0; }
.ja-photo-badge .wp-block-image img { display: block; width: 100%; aspect-ratio: 5 / 6; object-fit: cover; object-position: center top; border-radius: 24px; }
.ja-wrap .ja-badge { position: absolute; right: 24px; bottom: 24px; background: var(--ja-ink); color: var(--ja-paper); border-radius: 16px; padding: 18px 22px; margin: 0; }
.ja-wrap .ja-badge-big { font-family: var(--ja-display); font-size: 28px; font-weight: 800; line-height: 1; letter-spacing: -0.02em; margin: 0; }
.ja-wrap .ja-badge-small { font-size: 13px; color: var(--ja-muted-light); margin: 4px 0 0; }

/* check lists */
.ja-wrap .ja-check { list-style: none; padding: 0; margin: 0 0 36px; display: grid; gap: 14px; }
.ja-wrap .ja-check-tight { gap: 12px; margin-bottom: 32px; }
.ja-wrap .ja-check li { position: relative; padding-left: 34px; font-size: 16px; line-height: 1.5; margin: 0; }
.ja-wrap .ja-check li::before {
  content: ""; position: absolute; left: 0; top: 1px; width: 22px; height: 22px; background: var(--ja-brass-text);
  -webkit-mask: var(--ja-check) center / contain no-repeat; mask: var(--ja-check) center / contain no-repeat;
}

/* ---------- posts (home teaser + blog index) ---------- */
.ja-wrap .ja-posts { margin: 0; }
.ja-posts .wp-block-post { position: relative; }
.ja-posts .wp-block-post-featured-image { margin: 0 0 20px; overflow: hidden; border-radius: 16px; }
.ja-posts .wp-block-post-featured-image a { display: block; }
.ja-posts .wp-block-post-featured-image img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .5s ease; }
.ja-posts .wp-block-post:hover .wp-block-post-featured-image img { transform: scale(1.04); }
.ja-posts .ja-post-meta { font-size: 13px; color: var(--ja-muted); margin: 0 0 10px; gap: 6px; }
.ja-posts .ja-post-meta > * { margin: 0; font-size: 13px; }
.ja-posts .ja-post-meta a { color: var(--ja-muted); text-decoration: none; }
.ja-posts .wp-block-post-title { font-size: 22px; line-height: 1.25; font-weight: 700; margin: 0 0 10px; }
.ja-posts .wp-block-post-title a { text-decoration: none; transition: color var(--ja-ease); }
.ja-posts .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.ja-posts .wp-block-post:hover .wp-block-post-title a { color: var(--ja-brass-text); }
.ja-posts .wp-block-post-excerpt { margin: 0; }
.ja-posts .wp-block-post-excerpt__excerpt { font-size: 15px; line-height: 1.55; color: var(--ja-muted); margin: 0; }
.ja-posts .wp-block-post-excerpt__more-text { display: none; }
.ja-posts .wp-block-post-template { margin: 0; padding: 0; }
.ja-posts .wp-block-post-template.is-layout-grid { gap: 32px 24px; }

/* featured first post on the blog index */
.ja-posts-featured .wp-block-post-template > li:first-child {
  grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0 48px; align-items: center; margin-bottom: 24px;
}
.ja-posts-featured .wp-block-post-template > li:first-child > .wp-block-post-featured-image { grid-column: 1; grid-row: 1 / 5; margin: 0; border-radius: 24px; }
.ja-posts-featured .wp-block-post-template > li:first-child > :not(.wp-block-post-featured-image) { grid-column: 2; }
.ja-posts-featured .wp-block-post-template > li:first-child > .ja-post-meta { margin-bottom: 16px; }
.ja-posts-featured .wp-block-post-template > li:first-child .wp-block-post-title { font-size: clamp(28px, 3.2vw, 40px); line-height: 1.08; font-weight: 800; margin-bottom: 16px; }
.ja-posts-featured .wp-block-post-template > li:first-child .wp-block-post-excerpt__excerpt { font-size: 17px; line-height: 1.6; }
@media (max-width: 781px) {
  .ja-posts-featured .wp-block-post-template > li:first-child { display: block; margin-bottom: 0; }
  .ja-posts-featured .wp-block-post-template > li:first-child > .wp-block-post-featured-image { margin: 0 0 20px; border-radius: 16px; }
}

/* chips (categories, pagination) */
.ja-wrap .ja-chips { display: flex; gap: 10px; flex-wrap: wrap; margin: 0; }
.ja-chips .wp-block-categories { display: contents; }
.ja-chips .wp-block-categories li { list-style: none; margin: 0; padding: 0; }
.ja-chips .wp-block-categories li a,
.ja-chips .ja-chip a,
.ja-chip a,
.ja-pagination .page-numbers,
.ja-pagination a {
  display: inline-flex; align-items: center; min-height: 40px; padding: 0 18px; border-radius: 999px;
  border: 1px solid var(--ja-line); font-size: 14px; font-weight: 500; text-decoration: none; color: var(--ja-ink); background: var(--ja-paper);
  transition: border-color var(--ja-ease), background-color var(--ja-ease), color var(--ja-ease);
}
.ja-chips .wp-block-categories li a:hover, .ja-chip a:hover, .ja-pagination a:hover { border-color: var(--ja-ink); color: var(--ja-ink); }
.ja-chips .wp-block-categories li.current-cat a, .ja-chip-on a, .ja-pagination .page-numbers.current { background: var(--ja-ink); color: var(--ja-paper); border-color: var(--ja-ink); }
.ja-wrap .ja-chips .ja-chip { margin: 0; }
.ja-wrap .ja-pagination { margin: 56px 0 0; gap: 8px; }
.ja-pagination .wp-block-query-pagination-numbers { display: flex; gap: 8px; }
.ja-pagination .page-numbers { min-width: 44px; justify-content: center; }
.ja-pagination .page-numbers.dots { border: 0; }

/* ---------- panels and CTAs ---------- */
.ja-wrap .ja-cta { border-radius: 28px; padding: 72px 64px; display: flex; justify-content: space-between; align-items: center; gap: 40px; flex-wrap: wrap; margin: 0; }
.ja-wrap .ja-cta > * { margin: 0; }
.ja-wrap .ja-cta-copy h2 { margin: 0 0 16px; }
.ja-wrap .ja-cta-copy p { font-size: 18px; line-height: 1.55; margin: 0; }
.ja-wrap .ja-cta-actions { display: flex; flex-direction: column; gap: 14px; min-width: 260px; margin: 0; }
.ja-wrap .ja-cta-actions .wp-block-buttons { display: grid; gap: 14px; margin: 0; }
.ja-cta-actions .wp-block-button { width: 100%; }
.ja-cta-actions .wp-block-button__link { width: 100%; justify-content: center; }
@media (max-width: 720px) {
  .ja-wrap .ja-cta { padding: 40px 28px; }
  .ja-wrap .ja-cta-actions { min-width: 0; width: 100%; }
}

/* newsletter panel (blog) */
.ja-wrap .ja-panel { border-radius: 28px; padding: 64px; display: flex; justify-content: space-between; align-items: center; gap: 40px; flex-wrap: wrap; margin: 0; }
.ja-wrap .ja-panel > * { margin: 0; }
.ja-wrap .ja-panel-copy h2 { margin: 0 0 12px; }
.ja-wrap .ja-panel-copy p { font-size: 16px; line-height: 1.55; margin: 0; }
.ja-nl-form { display: flex; gap: 12px; flex-wrap: wrap; flex: 1 1 360px; max-width: 520px; }
.ja-nl-form .ja-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.ja-nl-form .ja-input {
  height: 52px; border: 1.5px solid rgba(255, 255, 255, .25); background: transparent; color: var(--ja-paper); border-radius: 999px; padding: 0 20px;
  font: 500 16px "DM Sans", system-ui, sans-serif; min-width: 0; flex: 1 1 220px;
}
.ja-nl-form .ja-input::placeholder { color: var(--ja-muted-light); }
.ja-nl-form button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 26px; border-radius: 999px; border: 1.5px solid transparent;
  background: var(--ja-paper); color: var(--ja-ink); font: 600 16px "DM Sans", system-ui, sans-serif; cursor: pointer; transition: transform var(--ja-ease), background-color var(--ja-ease);
}
.ja-nl-form button:hover { transform: translateY(-2px); background: var(--ja-offwhite); }
@media (max-width: 720px) { .ja-wrap .ja-panel { padding: 40px 28px; } }

/* ---------- services page ---------- */
.ja-svc .wp-block-columns { align-items: center; }
.ja-svc .wp-block-image { margin: 0; }
.ja-svc .wp-block-image img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center top; border-radius: 24px; }
@media (min-width: 782px) { .ja-svc-flip > .wp-block-column:first-child { order: 2; } }
.ja-wrap .ja-companies { margin: 0; }
.ja-wrap .ja-company { border: 1px solid var(--ja-line); border-radius: 24px; padding: 40px; display: flex; flex-direction: column; gap: 18px; height: 100%; margin: 0; }
.ja-wrap .ja-company > * { margin: 0; }
.ja-wrap .ja-company h3 { font-size: 26px; }
.ja-wrap .ja-company p { font-size: 16px; line-height: 1.6; color: var(--ja-muted); flex-grow: 1; }
.ja-icon { width: 52px; height: 52px; border-radius: 14px; background: var(--ja-ink); position: relative; flex: none; }
.ja-icon::before { content: ""; position: absolute; inset: 14px; background: var(--ja-paper); -webkit-mask: var(--ja-icon-card) center / contain no-repeat; mask: var(--ja-icon-card) center / contain no-repeat; }
.ja-icon-house::before { -webkit-mask-image: var(--ja-icon-home-key); mask-image: var(--ja-icon-home-key); }
.ja-wrap .ja-steps { margin: 0; }
.ja-wrap .ja-step { border-top: 2px solid var(--ja-brass); padding-top: 24px; margin: 0; }
.ja-wrap .ja-step-label { font-family: var(--ja-display); font-size: 15px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ja-muted-light); margin: 0 0 14px; }
.ja-wrap .ja-step h3 { font-size: 22px; margin: 0 0 10px; }
.ja-wrap .ja-step p { font-size: 16px; line-height: 1.6; color: var(--ja-muted-light); margin: 0; }

/* FAQ (core/details) */
.ja-wrap .ja-faq-list { border-top: 1px solid var(--ja-line); margin: 0; }
.ja-wrap .ja-faq { border-bottom: 1px solid var(--ja-line); margin: 0; }
.ja-faq summary {
  cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 22px 0; font-weight: 600; font-size: 18px; line-height: 1.4;
}
.ja-faq summary::-webkit-details-marker { display: none; }
.ja-faq summary::after { content: ""; flex: none; width: 22px; height: 22px; background: currentColor; -webkit-mask: var(--ja-plus) center / contain no-repeat; mask: var(--ja-plus) center / contain no-repeat; transition: transform .2s ease; }
.ja-faq[open] summary::after { transform: rotate(45deg); }
.ja-wrap .ja-faq > :not(summary) { margin: 0 0 22px; font-size: 16px; line-height: 1.6; color: var(--ja-muted); }

/* ---------- about page ---------- */
.ja-wrap .ja-creds { margin: 0; }
.ja-wrap .ja-cred { background: var(--ja-ink-card); border-radius: 20px; padding: 28px; display: flex; flex-direction: column; gap: 12px; height: 100%; margin: 0; }
.ja-wrap .ja-cred > * { margin: 0; }
.ja-cred-icon { width: 28px; height: 28px; background: var(--ja-brass); -webkit-mask: var(--ja-icon-home) center / contain no-repeat; mask: var(--ja-icon-home) center / contain no-repeat; flex: none; }
.ja-cred-icon-card { -webkit-mask-image: var(--ja-icon-card); mask-image: var(--ja-icon-card); }
.ja-cred-icon-cap { -webkit-mask-image: var(--ja-icon-cap); mask-image: var(--ja-icon-cap); }
.ja-cred-icon-screen { -webkit-mask-image: var(--ja-icon-screen); mask-image: var(--ja-icon-screen); }
.ja-wrap .ja-cred h3 { font-size: 20px; }
.ja-wrap .ja-cred p { font-size: 15px; line-height: 1.55; color: var(--ja-muted-light); }
.ja-wrap .ja-press-cards { display: grid; gap: 16px; margin: 0; }
.ja-wrap .ja-press-card {
  position: relative; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 24px;
  border: 1px solid var(--ja-line); border-radius: 16px; background: var(--ja-paper); margin: 0;
  transition: transform .22s ease, box-shadow .22s ease;
}
.ja-wrap .ja-press-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(14, 14, 14, .08); }
.ja-wrap .ja-press-card > * { margin: 0; }
.ja-wrap .ja-press-card-meta { font-size: 13px; color: var(--ja-muted); margin: 0 0 6px; }
.ja-wrap .ja-press-card-title { font-weight: 600; font-size: 17px; line-height: 1.35; }
.ja-press-card-title a { text-decoration: none; color: var(--ja-ink); }
.ja-press-card-title a::before { content: ""; position: absolute; inset: 0; }
.ja-press-card::after { content: ""; flex: none; width: 20px; height: 20px; background: currentColor; -webkit-mask: var(--ja-arrow-ext) center / contain no-repeat; mask: var(--ja-arrow-ext) center / contain no-repeat; }
.ja-wrap .ja-hows { margin: 0; }
.ja-wrap .ja-how { background: var(--ja-paper); border-radius: 20px; padding: 32px; height: 100%; margin: 0; }
.ja-wrap .ja-how-num { font-family: var(--ja-display); font-size: 40px; font-weight: 800; color: var(--ja-brass-text); line-height: 1; letter-spacing: -0.02em; margin: 0 0 18px; }
.ja-wrap .ja-how h3 { font-size: 22px; margin: 0 0 10px; }
.ja-wrap .ja-how p { font-size: 16px; line-height: 1.6; color: var(--ja-muted); margin: 0; }
.ja-wrap .ja-timeline { align-items: start; }

/* ---------- single post / generic page ---------- */
.ja-article .ja-post-meta { font-size: 14px; color: var(--ja-muted); gap: 6px; margin: 0 0 20px; }
.ja-article .ja-post-meta > * { margin: 0; }
.ja-article .ja-post-meta a { color: var(--ja-muted); text-decoration: none; }
.ja-article .wp-block-post-title { font-size: clamp(36px, 4.6vw, 60px); line-height: 1.02; margin: 0 0 24px; }
.ja-article .wp-block-post-featured-image { margin: 40px 0 0; }
.ja-article .wp-block-post-featured-image img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 24px; }
.ja-prose { font-size: 18px; line-height: 1.7; }
.ja-prose > * + * { margin-block-start: 1.25em; }
.ja-prose h2 { font-size: clamp(26px, 2.6vw, 32px); margin-block-start: 2em; }
.ja-prose h3 { font-size: 22px; margin-block-start: 1.6em; }
.ja-prose a { text-decoration: underline; text-underline-offset: 3px; }
.ja-prose img { border-radius: 16px; }
.ja-prose blockquote { border-left: 2px solid var(--ja-brass); padding-left: 24px; color: var(--ja-muted); font-size: 20px; }
.ja-wrap .ja-byline { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--ja-muted); margin: 40px 0 0; padding-top: 24px; border-top: 1px solid var(--ja-line); }
.ja-wrap .ja-byline > * { margin: 0; }
.ja-wrap .ja-byline a { color: var(--ja-ink); text-decoration: none; font-weight: 600; }
.ja-page-title { margin: 0 0 32px; }

/* ---------- footer ---------- */
.ja-footer { padding-top: 72px; padding-bottom: 32px; }
.ja-foot .ja-foot-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 40px; margin: 0; }
.ja-foot .ja-foot-grid > * { margin: 0; }
.ja-foot-brand { grid-column: span 5; }
.ja-foot-col { grid-column: span 2; }
.ja-foot-col-wide { grid-column: span 3; }
.ja-foot .ja-foot-title { font-family: var(--ja-display); font-weight: 800; font-size: 20px; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 18px; }
.ja-foot .ja-foot-text { font-size: 15px; line-height: 1.6; color: var(--ja-muted-light); max-width: 40ch; margin: 0 0 24px; }
.ja-foot .ja-foot-heading { color: var(--ja-muted-light); margin: 0 0 18px; }
.ja-foot .ja-foot-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; font-size: 15px; }
.ja-foot .ja-foot-list li { margin: 0; }
.ja-foot .ja-foot-list a { color: var(--ja-paper); text-decoration: none; transition: color var(--ja-ease); }
.ja-foot .ja-foot-list a:hover { color: var(--ja-brass); }
.ja-foot .ja-foot-list .ja-dim { color: var(--ja-muted-light); }
.ja-foot .ja-social { margin: 0; gap: 12px; }
.ja-foot .ja-social .wp-social-link { width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 50%; background: transparent; display: inline-flex; align-items: center; justify-content: center; transition: border-color var(--ja-ease), transform var(--ja-ease); }
.ja-foot .ja-social .wp-social-link:hover { border-color: var(--ja-paper); transform: translateY(-2px); }
.ja-foot .ja-social .wp-social-link a { color: var(--ja-paper); padding: 0; display: inline-flex; }
.ja-foot .ja-social .wp-social-link svg { width: 18px; height: 18px; }
.ja-foot .ja-foot-bottom {
  border-top: 1px solid rgba(255, 255, 255, .12); margin: 56px 0 0; padding-top: 24px;
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13px; color: var(--ja-muted-light);
}
.ja-foot .ja-foot-bottom > * { margin: 0; font-size: 13px; }
.ja-foot .ja-foot-bottom a { color: var(--ja-muted-light); text-decoration: none; }
.ja-foot .ja-foot-bottom a:hover { color: var(--ja-paper); }
.ja-foot .ja-foot-links { display: flex; gap: 20px; }
@media (max-width: 960px) {
  .ja-foot .ja-foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 32px; }
  .ja-foot-brand, .ja-foot-col, .ja-foot-col-wide { grid-column: span 1; }
}
@media (max-width: 720px) {
  .ja-foot .ja-foot-grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .ja-foot-brand, .ja-foot-col, .ja-foot-col-wide { grid-column: span 1; }
  .ja-footer { padding-top: 56px; }
}

/* ---------- 404 ---------- */
.ja-wrap .ja-404 { padding: 40px 0; }

/* ---------- editor niceties ---------- */
.editor-styles-wrapper .ja-header { position: static; }
.editor-styles-wrapper .ja-ph { min-height: 120px; }

/* =========================================================
   Depth: gradients + grain (added 2026-10-21 after review)
   Dark blocks get a warm ink gradient with a brass glow and a
   fine film-grain overlay; light blocks get a soft warm wash.
   All done with layered background-images so the block colour
   classes from theme.json still apply underneath.
   ========================================================= */
:root {
  --ja-grain-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.10 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --ja-grain-dark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --ja-glow: radial-gradient(1100px 700px at 88% 8%, rgba(201, 162, 39, .20), rgba(201, 162, 39, 0) 62%);
  --ja-glow-soft: radial-gradient(900px 520px at 12% 100%, rgba(201, 162, 39, .10), rgba(201, 162, 39, 0) 60%);
  --ja-ink-gradient: linear-gradient(135deg, #161614 0%, #0E0E0E 48%, #1C1813 100%);
  --ja-offwhite-gradient: linear-gradient(180deg, #F6F5F1 0%, #F3F2EE 40%, #ECEAE3 100%);
}

/* dark full-width sections: hero, credentials, process */
.ja-hero,
.ja-section.has-ink-background-color,
.ja-section-hero-flat.has-ink-background-color {
  background-image: var(--ja-grain-light), var(--ja-glow), var(--ja-glow-soft), var(--ja-ink-gradient);
  background-repeat: repeat, no-repeat, no-repeat, no-repeat;
  background-size: 200px 200px, auto, auto, auto;
}
.ja-press-strip { background-image: linear-gradient(90deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, 0)); }

/* dark panels: CTA, newsletter, credential cards */
.ja-cta.has-ink-background-color,
.ja-panel.has-ink-background-color {
  background-image: var(--ja-grain-light), radial-gradient(700px 420px at 92% 0%, rgba(201, 162, 39, .26), rgba(201, 162, 39, 0) 60%), var(--ja-ink-gradient);
  background-repeat: repeat, no-repeat, no-repeat;
  background-size: 200px 200px, auto, auto;
  box-shadow: 0 30px 60px rgba(14, 14, 14, .18);
}
.ja-wrap .ja-cred {
  background-image: linear-gradient(160deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, 0) 55%);
  border: 1px solid rgba(255, 255, 255, .06);
}
.ja-wrap .ja-step { border-image: linear-gradient(90deg, var(--ja-brass), rgba(201, 162, 39, .25)) 1; }

/* warm light sections and the light CTA panel */
.ja-section.has-offwhite-background-color,
.ja-section-104.has-offwhite-background-color,
.ja-section-hero-88.has-offwhite-background-color {
  /* flat warm grey with grain only: no gradient, so the colour blocking stays crisp */
  background-image: var(--ja-grain-dark);
  background-repeat: repeat;
  background-size: 200px 200px;
}
.ja-cta.has-offwhite-background-color {
  background-image: var(--ja-grain-dark), radial-gradient(720px 420px at 0% 100%, rgba(201, 162, 39, .16), rgba(201, 162, 39, 0) 60%), linear-gradient(135deg, #F6F5F1, #EDEBE4);
  background-repeat: repeat, no-repeat, no-repeat;
  background-size: 200px 200px, auto, auto;
  border: 1px solid rgba(14, 14, 14, .05);
}

/* white cards: hairline + soft lift so they sit on the warm wash */
.ja-card, .ja-wrap .ja-how, .ja-wrap .ja-company { border: 1px solid rgba(14, 14, 14, .06); box-shadow: 0 1px 2px rgba(14, 14, 14, .04); }
.ja-wrap .ja-how, .ja-card { background-image: linear-gradient(180deg, #FFFFFF, #FBFAF8); }

/* photos: a soft bottom fade so the portrait sinks into the dark hero / press strip */
.ja-hero-photo { position: relative; }
.ja-hero-photo::after { content: ""; position: absolute; inset: 0; border-radius: 24px 24px 0 0; pointer-events: none; background: linear-gradient(180deg, rgba(14, 14, 14, 0) 62%, rgba(14, 14, 14, .55) 100%); }
.ja-hero-about .ja-hero-photo::after { background: linear-gradient(180deg, rgba(14, 14, 14, 0) 70%, rgba(14, 14, 14, .22) 100%); }
.ja-photo-badge .wp-block-image::after, .ja-svc .wp-block-image { position: relative; }
.ja-photo-badge .wp-block-image::after, .ja-svc .wp-block-image::after { content: ""; position: absolute; inset: 0; border-radius: 24px; pointer-events: none; background: linear-gradient(180deg, rgba(14, 14, 14, 0) 72%, rgba(14, 14, 14, .28) 100%); }
.ja-photo-badge .wp-block-image { position: relative; }

/* grey placeholders: a light sheen so they read as "image here" rather than flat blocks */
.ja-ph { background-image: var(--ja-grain-dark), linear-gradient(145deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, 0) 45%, rgba(14, 14, 14, .06) 100%); background-size: 200px 200px, auto; }

/* stat numbers and section eyebrows: brass gradient ink */
.ja-wrap .ja-stat-num { background: linear-gradient(135deg, #0E0E0E 30%, #4A3A12 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* footer */
.ja-footer {
  background-image: var(--ja-grain-light), radial-gradient(900px 500px at 0% 0%, rgba(201, 162, 39, .12), rgba(201, 162, 39, 0) 60%), linear-gradient(180deg, #121211 0%, #0E0E0E 100%);
  background-repeat: repeat, no-repeat, no-repeat;
  background-size: 200px 200px, auto, auto;
}

/* =========================================================
   Round 2 (2026-10-21): texture on the white blocks, brass
   hairlines on the dark ones, two overlaps, and motion.
   ========================================================= */

/* white sections stay flat white (a per-block wash showed as seams between
   adjacent white blocks and behind the overlapping CTA card; removed 2026-10-22) */
.wp-site-blocks main > .alignfull:not(.has-background) { background-image: none; }

/* two white blocks in a row: don't stack both paddings (was ~208px on the home page) */
.wp-site-blocks main > .alignfull:not(.has-background) + .alignfull:not(.has-background):not(.ja-section-blog-grid):not(.ja-section-cta) { padding-top: 40px; }
.wp-site-blocks main > .ja-section-112:not(.has-background) { padding-bottom: 56px; }
@media (max-width: 720px) {
  .wp-site-blocks main > .alignfull:not(.has-background) + .alignfull:not(.has-background):not(.ja-section-blog-grid):not(.ja-section-cta) { padding-top: 24px; }
  .wp-site-blocks main > .ja-section-112:not(.has-background) { padding-bottom: 40px; }
}

/* brass hairline along the top of every dark block */
.ja-hero,
.ja-section.has-ink-background-color,
.ja-section-hero-flat.has-ink-background-color,
.ja-footer { box-shadow: inset 0 1px 0 rgba(201, 162, 39, .38); }
.ja-hero,
.ja-section.has-ink-background-color,
.ja-section-hero-flat.has-ink-background-color { --ja-glow: radial-gradient(1100px 700px at 88% 8%, rgba(201, 162, 39, .26), rgba(201, 162, 39, 0) 62%); }

/* overlap 1: the stats row is a white card that straddles the bottom of the hero */
.ja-press-strip { padding-bottom: 72px; }
.ja-section-stats { padding-top: 0; padding-bottom: 72px; }
.ja-section-stats .ja-wrap .ja-stats {
  position: relative; z-index: 2; margin-top: -72px;
  background: #FFFFFF; background-image: linear-gradient(180deg, #FFFFFF, #FBFAF8);
  border: 1px solid rgba(14, 14, 14, .06); border-radius: 24px; padding: 8px 40px;
  box-shadow: 0 30px 60px rgba(14, 14, 14, .14);
}
@media (max-width: 960px) { .ja-section-stats .ja-wrap .ja-stats { padding: 8px 28px; } }
@media (max-width: 600px) { .ja-press-strip { padding-bottom: 48px; } .ja-section-stats .ja-wrap .ja-stats { margin-top: -48px; padding: 8px 24px; } }

/* overlap 2: the light CTA panel straddles the white block and the footer */
.ja-section-cta-overlap { padding-bottom: 0; position: relative; z-index: 2; }
.ja-section-cta-overlap .ja-wrap .ja-cta { margin-bottom: -88px; box-shadow: 0 30px 60px rgba(14, 14, 14, .16); }
.wp-site-blocks main:has(.ja-section-cta-overlap) + footer .ja-footer { padding-top: 168px; }
@media (max-width: 720px) {
  .ja-section-cta-overlap .ja-wrap .ja-cta { margin-bottom: -64px; }
  .wp-site-blocks main:has(.ja-section-cta-overlap) + footer .ja-footer { padding-top: 128px; }
}

/* header responds to scrolling: taller and quiet at the top, tighter glass bar once you scroll */
.ja-header { border-bottom-color: transparent; transition: background-color .3s ease, border-color .3s ease, box-shadow .3s ease; }
.ja-header-inner { transition: min-height .3s ease; }
html.ja-at-top .ja-header-inner { min-height: 88px; }
html.ja-scrolled .ja-header { border-bottom-color: var(--ja-line); box-shadow: 0 10px 30px rgba(14, 14, 14, .06); }
html.ja-scrolled .ja-header-inner { min-height: 64px; }

/* hero load sequence (classes are added by motion.js, so no-JS visitors see everything) */
.ja-load { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .9s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--ja-delay, 0ms); }
.ja-load.is-in { opacity: 1; transform: none; }
.ja-load-photo { opacity: 0; transform: translateY(28px) scale(.985); transition: opacity 1s ease, transform 1.1s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--ja-delay, 0ms); }
.ja-load-photo.is-in { opacity: 1; transform: none; }

/* scroll reveal */
.ja-reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .8s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--ja-delay, 0ms); will-change: opacity, transform; }
.ja-reveal.is-in { opacity: 1; transform: none; }

/* press marquee (motion.js duplicates the names so the loop is seamless) */
.ja-press-strip .ja-press-inner { flex-wrap: nowrap; }
.ja-press-strip .ja-marquee { flex: 1 1 auto; min-width: 0; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.ja-press-strip .ja-marquee .ja-press { flex-wrap: nowrap; gap: 56px; width: max-content; padding-right: 56px; animation: ja-marquee 26s linear infinite; }
.ja-press-strip .ja-marquee:hover .ja-press { animation-play-state: paused; }
@keyframes ja-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (max-width: 720px) { .ja-press-strip .ja-press-inner { flex-wrap: wrap; } .ja-press-strip .ja-marquee { flex-basis: 100%; } }

/* hero parallax: the portrait drifts a little slower than the page */
.ja-hero-photo { overflow: hidden; border-radius: 24px 24px 0 0; }
html.ja-parallax .ja-hero-photo img { transform: scale(1.1) translateY(var(--ja-par, 0px)); transform-origin: center top; will-change: transform; }

/* video CTA panel (home): skyline behind the copy, poster frame on phones / reduced motion */
.ja-wrap .ja-cta-video { position: relative; overflow: hidden; isolation: isolate; background-image: none; }
.ja-cta-video .ja-cta-media { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; }
.ja-cta-video .ja-cta-media::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(100deg, rgba(14, 14, 14, .82) 0%, rgba(14, 14, 14, .62) 55%, rgba(14, 14, 14, .42) 100%), var(--ja-grain-light);
  background-size: auto, 200px 200px;
}
.ja-cta-video .ja-cta-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.2s ease; }
.ja-cta-video .ja-cta-bg.is-playing { opacity: 1; }
.ja-wrap .ja-cta-video > .ja-cta-copy, .ja-wrap .ja-cta-video > .ja-cta-actions { position: relative; z-index: 1; }
.ja-cta-video .ja-cta-copy h2 { text-shadow: 0 2px 24px rgba(14, 14, 14, .35); }
.ja-cta-video .ja-cta-copy p { color: #E6E4DD; }
@media (max-width: 781px) { .ja-cta-video .ja-cta-bg { display: none; } }

/* ---------- motion preference ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .wp-block-button:hover .wp-block-button__link, .ja-card:hover, .ja-press-card:hover { transform: none; }
  .ja-load, .ja-load-photo, .ja-reveal { opacity: 1 !important; transform: none !important; }
  .ja-press-strip .ja-marquee { overflow: visible; -webkit-mask-image: none; mask-image: none; }
  .ja-press-strip .ja-marquee .ja-press { width: auto; flex-wrap: wrap; animation: none; }
  .ja-press-strip .ja-marquee .ja-press-clone { display: none; }
  html.ja-parallax .ja-hero-photo img { transform: none; }
  .ja-cta-video .ja-cta-bg { display: none; }
}
