/* Author · 003. Scene plates share the approved 1672 × 941 registration.
   The user-supplied 1374 × 1145 portrait is contained without distortion.
   Only the CAMERA moves. Writer + real HTML copy are a single z=0 plane.
   Compensation scale = (1800 - z) / 1800 preserves the neutral composition. */
.ygs-author {
  --ink: #090807;
  --paper: #f4efe7;
  --gold: #e7a04c;
  position: relative;
  isolation: isolate;
  /* clip prevents focus/history restoration from scrolling the overscan
     inside this section; hidden would create a nested scroll container. */
  overflow: clip;
  color: var(--paper);
  background: var(--ink);
  scroll-margin-top: 96px;
}
.ygs-author *, .ygs-author *::before, .ygs-author *::after { box-sizing: border-box; }
.ygs-author__viewport { position: relative; perspective: 1800px; perspective-origin: 50% 50%; }
.ygs-author__camera {
  position: relative;
  min-height: 800px;
  transform-style: preserve-3d;
  transform: translate3d(var(--ygs-camera-x, 0px), var(--ygs-camera-y, 0px), 0)
    rotateX(var(--ygs-camera-rx, 0deg)) rotateY(var(--ygs-camera-ry, 0deg));
}
/* Paint current assets immediately at their registered static positions.
   Readiness changes depth/motion only, never the author's identity. */
.ygs-author__world-plane { position: absolute; inset: 0; pointer-events: none; transform: none; }
.ygs-author[data-depth-ready="true"] .ygs-author__distance-plane { transform: translateZ(-600px) scale(1.333333); }
.ygs-author[data-depth-ready="true"] .ygs-author__room-plane { transform: translateZ(-200px) scale(1.111111); }
/* Two light-only RGBA images occupy different Z depths; unlike the stone
   architecture they respond independently to the shared parallax camera. */
.ygs-author[data-depth-ready="true"] .ygs-author__rays-far-plane { transform: translateZ(-140px) scale(1.077778); }
.ygs-author[data-depth-ready="true"] .ygs-author__rays-near-plane { transform: translateZ(-65px) scale(1.036111); }
.ygs-author[data-depth-ready="true"] .ygs-author__foreground-plane { transform: translateZ(100px) scale(.944444); }
.ygs-author__content-plane { position: relative; min-height: max(800px, 56.28vw); transform: translateZ(0); }
.ygs-author__scene-window { position: absolute; inset: -16px -32px -52px; }
.ygs-author__art { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; display: block; object-fit: cover; object-position: center; }
.ygs-author__distance-plane .ygs-author__scene-window { inset: -40px -64px -76px; }
/* Beams cross the dark reading area, always BEHIND the writer and selectable
   HTML text. Keep actual shafts, never a CSS glow or an opaque fog overlay.
   Gently attenuate the overlapping rays through the composition's center;
   retain their full warm strength by the right-hand window. */
.ygs-author__ray {
  mask-image: linear-gradient(90deg, #000 0%, #000 22%, rgba(0, 0, 0, .9) 35%, rgba(0, 0, 0, .76) 52%, rgba(0, 0, 0, .83) 66%, #000 87%);
}
.ygs-author__ray--far { opacity: .64; }
.ygs-author__ray--near { opacity: .32; }
.ygs-author__figure { position: absolute; inset: 0; pointer-events: none; }
.ygs-author__portrait-stage { position: absolute; inset: 0; isolation: isolate; }
/* Increase the approved speaker by precisely 4% (75% -> 78%) and translate
   his box 125px left. The extra 3% width mitigates that shift by ~50px, so
   the visible figure moves left by at least 75px without overlapping copy.
   Extra bottom overlap keeps the cropped torso below the section edge even
   at the shared camera's upward limit; gold arcs and copy keep their size. */
.ygs-author__portrait {
  z-index: 2;
  filter: none;
  transform: none;
  inset: auto auto -24px calc(16.5% - 125px);
  width: 78%;
  height: 78%;
}
/* Keep the exact uploaded portrait's proportions on desktop AND compact
   layouts, where the environment art deliberately uses object-fit: fill. */
.ygs-author__art.ygs-author__portrait { object-fit: contain; object-position: right bottom; }
.ygs-author__reading-shade {
  position: absolute;
  inset: 0 auto 0 -40px;
  width: 60%;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(4, 4, 3, .57), rgba(4, 4, 3, .36) 68%, transparent);
}
.ygs-author__inner { position: relative; width: 100%; min-height: inherit; display: flex; align-items: center; pointer-events: none; }
.ygs-author__copy { position: relative; z-index: 3; width: 39%; margin-left: 5.5%; padding: clamp(64px, 5.2vw, 100px) 0; pointer-events: auto; }
.ygs-author__eyebrow { display: flex; align-items: center; gap: 16px; font: 500 11px/1.4 var(--f-mono, ui-monospace, monospace); letter-spacing: .26em; color: #dfc3a4; }
.ygs-author__eyebrow::before { content: ""; width: 40px; height: 1px; background: var(--gold); }
.ygs-author h2 { font: 400 clamp(58px, 5.5vw, 106px)/1.01 var(--f-display, Georgia, serif); letter-spacing: -.035em; margin: 28px 0 24px; }
.ygs-author h2 em { font-weight: 400; color: var(--gold); }
.ygs-author__quote { max-width: 630px; margin: 0 0 30px; padding-left: 22px; border-left: 2px solid var(--gold); font: italic clamp(19px, 1.52vw, 26px)/1.42 var(--f-display, Georgia, serif); color: #eee2d3; }
.ygs-author__name { margin: 0 0 8px; font: 400 clamp(36px, 3.1vw, 54px)/1.1 var(--f-display, Georgia, serif); letter-spacing: -.02em; }
.ygs-author__role { margin: 0; max-width: 610px; font: 500 10px/1.8 var(--f-mono, ui-monospace, monospace); letter-spacing: .18em; color: var(--gold); text-transform: uppercase; }
.ygs-author__bio { width: 90%; max-width: 560px; margin: 23px 0 28px; font: 400 clamp(15px, 1.11vw, 19px)/1.65 var(--f-body, system-ui, sans-serif); color: #dfd3c6; }
.ygs-author__cta { display: inline-flex; align-items: center; gap: 30px; min-height: 56px; padding: 17px 30px; border: 1px solid #edb269; border-radius: 100px; color: #fff2e0; background: linear-gradient(128deg, #af622a, #713514); box-shadow: inset 0 1px rgba(255, 232, 191, .25), 0 10px 32px #0004; font: 650 11px/1.4 var(--f-mono, ui-monospace, monospace); letter-spacing: .16em; text-transform: uppercase; text-decoration: none; transition: background .2s, box-shadow .2s; }
.ygs-author__cta:hover { background: linear-gradient(128deg, #c47737, #8a471f); box-shadow: inset 0 1px #ffe8bf55, 0 10px 32px #0005; }
.ygs-author__cta:focus-visible { outline: 2px solid #fff0d9; outline-offset: 5px; }

/* Retain the fine, offset circular accents behind the writer. No pulsating
   glow or independently drifting manuscript fragments; beams are own plates. */
.ygs-author__orbit { position: absolute; z-index: 1; border: 1.25px solid rgba(239, 171, 80, .85); border-radius: 50%; pointer-events: none; aspect-ratio: 1; filter: none; mask-image: linear-gradient(to bottom, #000 0%, #000 34%, rgba(0, 0, 0, .6) 57%, transparent 81%); }
.ygs-author__orbit--outer { width: 52%; left: 45%; top: -12%; }
.ygs-author__orbit--inner { width: 43%; left: 51%; top: 12%; border-color: rgba(255, 214, 157, .9); }
.ygs-author__foreground { transform: scale(.55); transform-origin: left bottom; filter: blur(3px) brightness(.62); opacity: .82; }
.ygs-author[data-animated="true"] [data-author-reveal] { opacity: 0; transition: opacity .6s ease; }
.ygs-author[data-animated="true"] [data-author-reveal].is-visible { opacity: 1; }

/* Compact screens use the same scene, cropped to the writer with all hands
   and the Bible retained. No pointer motion or clipped off-screen copy. */
@media (min-width: 1200px) and (max-width: 1279px) {
  .ygs-author__camera, .ygs-author__content-plane { min-height: 740px; }
  .ygs-author__copy { padding-top: 54px; padding-bottom: 54px; }
}
@media (max-width: 1199px) {
  .ygs-author { scroll-margin-top: 96px; }
  .ygs-author__viewport { perspective: none; }
  .ygs-author__camera { min-height: 0; transform: none; }
  .ygs-author__world-plane, .ygs-author__content-plane,
  .ygs-author[data-depth-ready="true"] .ygs-author__world-plane { transform: none; }
  .ygs-author__content-plane { min-height: 0; display: flex; flex-direction: column; }
  .ygs-author__inner { order: 0; min-height: 0; }
  .ygs-author__copy { width: auto; max-width: 690px; margin: 0 auto; padding: 72px 32px 24px; }
  .ygs-author h2 { font-size: clamp(50px, 8vw, 78px); margin: 28px 0 25px; }
  .ygs-author__quote { font-size: clamp(21px, 3vw, 27px); }
  .ygs-author__name { font-size: 44px; }
  .ygs-author__bio { width: 100%; font-size: 17px; max-width: 620px; }
  .ygs-author__figure { order: 1; position: relative; width: 100%; aspect-ratio: 1672 / 1882; overflow: clip; }
  .ygs-author__scene-window, .ygs-author__distance-plane .ygs-author__scene-window { top: auto; bottom: 0; left: -80%; right: auto; width: 200%; height: auto; aspect-ratio: 1672 / 941; }
  .ygs-author__art { object-fit: fill; }
  .ygs-author__room-plane .ygs-author__scene-window::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, #090807, transparent 20%); }
  .ygs-author__reading-shade { display: none; }
  .ygs-author__foreground-plane .ygs-author__scene-window { left: -5%; bottom: -3%; width: 110%; }
  .ygs-author__foreground { transform: scale(.7); opacity: .6; }
  .ygs-author__orbit--outer { top: -5%; }
  .ygs-author__orbit--inner { top: 14%; }
}
@media (min-width: 600px) and (max-width: 1199px) {
  .ygs-author__figure { aspect-ratio: 5 / 4; }
  .ygs-author__scene-window, .ygs-author__distance-plane .ygs-author__scene-window { left: -32%; width: 140%; }
  .ygs-author__foreground-plane .ygs-author__scene-window { left: -5%; width: 110%; }
}
@media (max-width: 480px) {
  .ygs-author__copy { padding: 60px 22px 18px; }
  .ygs-author h2 { font-size: clamp(44px, 11.3vw, 54px); }
  .ygs-author__quote { font-size: 21px; padding-left: 17px; }
  .ygs-author__name { font-size: 38px; }
  .ygs-author__role { font-size: 9px; letter-spacing: .14em; }
  .ygs-author__bio { font-size: 16px; }
  .ygs-author__cta { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .ygs-author__camera { transform: none !important; }
  .ygs-author [data-author-reveal] { opacity: 1 !important; transition: none !important; }
  .ygs-author__cta { transition: none; }
}