/* Three accents, using the existing forest / cream / champagne palette. */
.nhn-ed-progress {
  position: fixed;
  inset: 0 0 auto;
  height: 2px;
  z-index: 80;
  background: var(--accent, #c2a46f);
  transform: scaleX(var(--nhn-ed-progress, 0));
  transform-origin: left center;
  pointer-events: none;
}
.admin-bar .nhn-ed-progress { top: 32px; }

/* Independent rotate never replaces the gallery's existing transform or image parallax. */
@media (hover: hover) and (pointer: fine) and (min-width: 761px) {
  html.nhn-ed-ready .project-card:has(> .nhn-ed-tilt) { perspective: 1100px; }
  html.nhn-ed-ready .nhn-ed-tilt {
    rotate: var(--nhn-ed-axis-x, 1) var(--nhn-ed-axis-y, 0) 0 var(--nhn-ed-angle, 0deg);
    transform-origin: 50% 50%;
    backface-visibility: hidden;
  }
  .nhn-ed-tilt.nhn-ed-tilting { will-change: rotate; }
  html.nhn-ed-ready .contact-intro .contact-arrow {
    transition: translate .55s cubic-bezier(.22, 1, .36, 1), rotate .55s cubic-bezier(.22, 1, .36, 1);
  }
  html.nhn-ed-ready:not(.nhn-ed-paused):not(.motion-paused) .contact-section:is(:hover, :focus-within) .contact-intro .contact-arrow {
    translate: 4px -4px;
    rotate: -6deg;
  }
}

#apropos .nhn-ed-greeting {
  position: relative;
  display: grid;
  justify-items: start;
  gap: 15px;
  width: fit-content;
  max-width: 100%;
  margin: 1px 0 31px;
  padding-top: 8px;
  color: var(--accent, #c2a46f);
  isolation: isolate;
}
.nhn-ed-greeting-word {
  position: relative;
  display: block;
  padding: 0 15px 0 4px;
  z-index: 1;
  font: italic 400 clamp(30px, 3.2vw, 43px)/1.2 var(--serif, Georgia, serif);
  letter-spacing: -.045em;
  white-space: nowrap;
}
.nhn-ed-greeting-note {
  display: block;
  color: var(--paper, #f3f0e8);
  opacity: .8;
  font: 400 10px/1.65 var(--sans, Manrope, Arial, sans-serif);
  letter-spacing: .035em;
}
.nhn-ed-greeting-oval {
  position: absolute;
  width: clamp(151px, 15.4vw, 201px);
  height: auto;
  top: -7px;
  left: -13px;
  overflow: visible;
  pointer-events: none;
  z-index: 0;
  fill: none;
  stroke: currentColor;
  stroke-width: .65;
  opacity: .58;
}
.nhn-ed-greeting-oval ellipse {
  stroke-dasharray: 100;
  stroke-dashoffset: calc(100 - var(--nhn-ed-draw, 0) * 100);
}

/* Pause is shared with the existing studio controls; no separate motion preference. */
html.motion-paused .nhn-ed-progress,
html.nhn-ed-paused .nhn-ed-progress { visibility: hidden; }
html.motion-paused .nhn-ed-tilt,
html.nhn-ed-paused .nhn-ed-tilt { rotate: none !important; will-change: auto !important; }
html.motion-paused .contact-intro .contact-arrow,
html.nhn-ed-paused .contact-intro .contact-arrow { translate: none !important; rotate: none !important; transition: none !important; }
html.motion-paused .nhn-ed-greeting-oval ellipse,
html.nhn-ed-paused .nhn-ed-greeting-oval ellipse { stroke-dashoffset: 0; }
@media (max-width: 782px) { .admin-bar .nhn-ed-progress { top: 46px; } }
@media (max-width: 760px) {
  #apropos .nhn-ed-greeting { margin-bottom: 29px; gap: 14px; }
  .nhn-ed-greeting-word { font-size: 35px; }
  .nhn-ed-greeting-oval { width: 170px; top: -6px; }
  .nhn-ed-greeting-note { font-size: 11px; letter-spacing: .015em; }
}
@media (prefers-reduced-motion: reduce) {
  .nhn-ed-progress { display: none; }
  .nhn-ed-tilt { rotate: none !important; will-change: auto !important; }
  .contact-intro .contact-arrow { translate: none !important; rotate: none !important; transition: none !important; }
  .nhn-ed-greeting-oval ellipse { stroke-dashoffset: 0; }
}
@media print {
  .nhn-ed-progress { display: none; }
  .nhn-ed-tilt { rotate: none !important; }
  .nhn-ed-greeting-oval ellipse { stroke-dashoffset: 0; }
}