.gy-solar-story {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(72px, 8vw, 120px) max(20px, calc((100vw - 1200px) / 2));
  color: #fff;
  background:
    radial-gradient(circle at 82% 18%, rgba(215, 240, 32, .13), transparent 26%),
    linear-gradient(135deg, var(--gy-navy, #07192b), var(--gy-navy-2, #102e48));
}

.gy-solar-story::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  opacity: .16;
  background-image:
    linear-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .08) 1px, transparent 1px);
  background-size: 38px 38px;
  mask-image: linear-gradient(to right, transparent, #000 45%, #000);
}

.gy-solar-story__inner {
  display: grid;
  grid-template-columns: minmax(290px, .8fr) minmax(520px, 1.2fr);
  gap: clamp(38px, 6vw, 88px);
  align-items: center;
  width: min(100%, 1200px);
  margin-inline: auto;
  min-width: 0;
}

.gy-solar-story__inner > *,
.gy-solar-story__visual { box-sizing: border-box; min-width: 0; }

.gy-solar-story__eyebrow {
  margin: 0 0 18px;
  color: var(--gy-lime, #d7f020);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .18em;
}

.gy-solar-story h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(34px, 3.9vw, 58px);
  font-weight: 800;
  line-height: 1.16;
  letter-spacing: -.045em;
}

.gy-solar-story__description {
  max-width: 560px;
  margin: 26px 0 0;
  color: rgba(255, 255, 255, .7);
  font-size: 16px;
  line-height: 1.85;
}

.gy-solar-story__visual {
  min-width: 0;
  scroll-margin-top: 152px;
  padding: clamp(14px, 2.6vw, 28px);
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 18px;
  background: rgba(2, 14, 26, .52);
  box-shadow: 0 28px 80px rgba(0, 0, 0, .28);
  backdrop-filter: blur(9px);
}

.gy-solar-story__canvas {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 10px;
  background:
    radial-gradient(circle at 76% 22%, rgba(215, 240, 32, .06), transparent 25%),
    linear-gradient(180deg, rgba(18, 48, 71, .84), rgba(4, 21, 35, .86));
}

.gy-solar-story__svg {
  display: block;
  width: 100%;
  height: 100%;
}

.gy-solar-story__svg .gy-solar-draw,
.gy-solar-story__svg .gy-solar-ground,
.gy-solar-story__svg .gy-solar-wire,
.gy-solar-story__svg .gy-solar-grid,
.gy-solar-story__svg .gy-solar-rays,
.gy-solar-story__svg .gy-solar-energy-flow,
.gy-solar-story__svg .gy-solar-check {
  fill: none;
  stroke: rgba(255, 255, 255, .92);
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gy-solar-building__wall--front { fill: #b9c5cb; }
.gy-solar-building__wall--side { fill: #899aa4; }
.gy-solar-building__roof--far { fill: #526775; }
.gy-solar-building__roof { fill: #738692; }

.gy-solar-building__door {
  fill: rgba(6, 24, 38, .62);
  stroke: rgba(255, 255, 255, .38);
  stroke-width: 2;
}

.gy-solar-layout {
  fill: rgba(215, 240, 32, .05);
  stroke: rgba(215, 240, 32, .7);
  stroke-width: 2;
  stroke-dasharray: 9 7;
}

.gy-solar-layout__mark {
  fill: none;
  stroke: rgba(215, 240, 32, .82);
  stroke-width: 2;
}

.gy-solar-layout__label {
  fill: var(--gy-lime, #d7f020);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .11em;
}

.gy-solar-story__svg .gy-solar-draw--fine,
.gy-solar-story__svg .gy-solar-ground {
  stroke: rgba(255, 255, 255, .48);
  stroke-width: 3;
}

.gy-solar-story__svg .gy-solar-draw--accent {
  stroke: #f0a928;
  stroke-width: 6;
}

.gy-solar-panel > path:first-child {
  fill: url(#gy-solar-panel-fill);
  stroke: #62b9d7;
  stroke-width: 4;
}

.gy-solar-panel__grid {
  fill: none;
  stroke: rgba(174, 230, 255, .55);
  stroke-width: 1.6;
}

.gy-solar-wire {
  stroke: #f0a928 !important;
  stroke-width: 5 !important;
}

.gy-solar-device {
  fill: #f4f7f8;
  stroke: #9ed0dd;
  stroke-width: 4;
}

.gy-solar-device__detail {
  fill: none;
  stroke: #26485e;
  stroke-width: 4;
  stroke-linecap: round;
}

.gy-solar-device__light {
  fill: var(--gy-lime, #d7f020);
  filter: url(#gy-solar-glow);
}

.gy-solar-grid {
  stroke: rgba(255, 255, 255, .72) !important;
  stroke-width: 4 !important;
}

.gy-solar-sun {
  fill: url(#gy-solar-sun-fill);
  filter: url(#gy-solar-glow);
}

.gy-solar-rays,
.gy-solar-energy-flow {
  stroke: var(--gy-lime, #d7f020) !important;
  stroke-width: 6 !important;
}

.gy-solar-complete {
  fill: rgba(215, 240, 32, .08);
  stroke: var(--gy-lime, #d7f020);
  stroke-width: 5;
}

.gy-solar-check {
  stroke: var(--gy-lime, #d7f020) !important;
  stroke-width: 8 !important;
}

.gy-solar-complete__label {
  fill: var(--gy-lime, #d7f020);
  font-size: 17px;
  font-weight: 900;
  letter-spacing: .12em;
}

.gy-solar-building__light {
  fill: rgba(215, 240, 32, .2);
  stroke: var(--gy-lime, #d7f020);
  stroke-width: 3;
  filter: url(#gy-solar-glow);
}

.gy-solar-pencil {
  transform: translate(92px, 250px) rotate(-18deg);
  transform-origin: 0 0;
}

.gy-solar-pencil path:first-child {
  fill: #f5c84b;
  stroke: #fff;
  stroke-width: 3;
}

.gy-solar-pencil path:last-child {
  fill: #ff7565;
}

.gy-solar-story__status {
  padding: 18px 4px 2px;
}

.gy-solar-story__status-row {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  color: rgba(255, 255, 255, .68);
  font-size: 13px;
}

.gy-solar-story__status-row strong {
  color: #fff;
  font-size: 14px;
}

.gy-solar-story__progress {
  height: 3px;
  margin-top: 12px;
  overflow: hidden;
  background: rgba(255, 255, 255, .12);
}

.gy-solar-story__progress span {
  display: block;
  width: 0;
  height: 100%;
  background: var(--gy-lime, #d7f020);
  transition: width .55s cubic-bezier(.22, 1, .36, 1);
}

.gy-solar-story__detail {
  min-height: 3.5em;
  margin: 15px 0 0;
  color: rgba(255, 255, 255, .7);
  font-size: 13px;
  line-height: 1.7;
}

.gy-solar-story--js .gy-solar-stage,
.gy-solar-story--js .gy-solar-pencil {
  opacity: 0;
}

.gy-solar-story--js .gy-solar-draw,
.gy-solar-story--js .gy-solar-wire,
.gy-solar-story--js .gy-solar-energy-flow,
.gy-solar-story--js .gy-solar-check {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}

.gy-solar-story--js .gy-solar-panel {
  opacity: 0;
  transform: translateY(-20px) scale(.88);
  transform-box: fill-box;
  transform-origin: center;
}

.gy-solar-story--js .gy-solar-device,
.gy-solar-story--js .gy-solar-device__detail,
.gy-solar-story--js .gy-solar-device__light,
.gy-solar-story--js .gy-solar-grid,
.gy-solar-story--js .gy-solar-sun,
.gy-solar-story--js .gy-solar-rays,
.gy-solar-story--js .gy-solar-complete,
.gy-solar-story--js .gy-solar-complete__label {
  opacity: 0;
}

.gy-solar-story.is-stage-1 .gy-solar-stage--building,
.gy-solar-story.is-stage-2 .gy-solar-stage--building,
.gy-solar-story.is-stage-2 .gy-solar-stage--mounts,
.gy-solar-story.is-stage-3 .gy-solar-stage--building,
.gy-solar-story.is-stage-3 .gy-solar-stage--mounts,
.gy-solar-story.is-stage-3 .gy-solar-stage--panels,
.gy-solar-story.is-stage-4 .gy-solar-stage:not(.gy-solar-stage--energy),
.gy-solar-story.is-stage-5 .gy-solar-stage {
  opacity: 1;
}

.gy-solar-story.is-stage-1 .gy-solar-stage--building .gy-solar-draw,
.gy-solar-story.is-stage-2 .gy-solar-stage--building .gy-solar-draw,
.gy-solar-story.is-stage-3 .gy-solar-stage--building .gy-solar-draw,
.gy-solar-story.is-stage-4 .gy-solar-stage--building .gy-solar-draw,
.gy-solar-story.is-stage-5 .gy-solar-stage--building .gy-solar-draw {
  animation: gySolarDraw 1.25s ease forwards;
}

.gy-solar-story.is-stage-2 .gy-solar-stage--mounts .gy-solar-draw,
.gy-solar-story.is-stage-3 .gy-solar-stage--mounts .gy-solar-draw,
.gy-solar-story.is-stage-4 .gy-solar-stage--mounts .gy-solar-draw,
.gy-solar-story.is-stage-5 .gy-solar-stage--mounts .gy-solar-draw {
  animation: gySolarDraw .8s ease forwards;
}

.gy-solar-story.is-stage-3 .gy-solar-panel,
.gy-solar-story.is-stage-4 .gy-solar-panel,
.gy-solar-story.is-stage-5 .gy-solar-panel {
  animation: gySolarPanel .55s cubic-bezier(.2, .9, .2, 1.25) forwards;
}

.gy-solar-story .gy-solar-panel--2 { animation-delay: .12s !important; }
.gy-solar-story .gy-solar-panel--3 { animation-delay: .24s !important; }
.gy-solar-story .gy-solar-panel--4 { animation-delay: .36s !important; }
.gy-solar-story .gy-solar-panel--5 { animation-delay: .48s !important; }
.gy-solar-story .gy-solar-panel--6 { animation-delay: .6s !important; }
.gy-solar-story .gy-solar-panel--7 { animation-delay: .72s !important; }
.gy-solar-story .gy-solar-panel--8 { animation-delay: .84s !important; }

.gy-solar-story.is-stage-4 .gy-solar-wire,
.gy-solar-story.is-stage-5 .gy-solar-wire {
  animation: gySolarDraw .85s ease forwards;
}

.gy-solar-story.is-stage-4 .gy-solar-device,
.gy-solar-story.is-stage-4 .gy-solar-device__detail,
.gy-solar-story.is-stage-4 .gy-solar-device__light,
.gy-solar-story.is-stage-4 .gy-solar-grid,
.gy-solar-story.is-stage-5 .gy-solar-device,
.gy-solar-story.is-stage-5 .gy-solar-device__detail,
.gy-solar-story.is-stage-5 .gy-solar-device__light,
.gy-solar-story.is-stage-5 .gy-solar-grid {
  animation: gySolarFade .5s .28s ease forwards;
}

.gy-solar-story.is-stage-5 .gy-solar-sun,
.gy-solar-story.is-stage-5 .gy-solar-rays,
.gy-solar-story.is-stage-5 .gy-solar-complete,
.gy-solar-story.is-stage-5 .gy-solar-complete__label {
  animation: gySolarFade .6s ease forwards;
}

.gy-solar-story.is-stage-5 .gy-solar-rays {
  animation: gySolarFade .6s ease forwards, gySolarSpin 12s linear infinite;
  transform-box: fill-box;
  transform-origin: center;
}

.gy-solar-story.is-stage-5 .gy-solar-energy-flow,
.gy-solar-story.is-stage-5 .gy-solar-check {
  animation: gySolarDraw .85s .25s ease forwards;
}

.gy-solar-story.is-stage-1 .gy-solar-pencil,
.gy-solar-story.is-stage-2 .gy-solar-pencil,
.gy-solar-story.is-stage-3 .gy-solar-pencil,
.gy-solar-story.is-stage-4 .gy-solar-pencil {
  opacity: 1;
  animation: gySolarPencil 6.5s cubic-bezier(.4, 0, .2, 1) forwards;
}

.gy-solar-story.is-complete .gy-solar-pencil {
  opacity: 0;
}

@keyframes gySolarDraw {
  to { stroke-dashoffset: 0; }
}

@keyframes gySolarPanel {
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes gySolarFade {
  to { opacity: 1; }
}

@keyframes gySolarSpin {
  to { transform: rotate(360deg); }
}

@keyframes gySolarPencil {
  0% { transform: translate(105px, 300px) rotate(-18deg); }
  20% { transform: translate(255px, 218px) rotate(-12deg); }
  43% { transform: translate(660px, 247px) rotate(8deg); }
  68% { transform: translate(704px, 338px) rotate(28deg); }
  100% { transform: translate(846px, 430px) rotate(5deg); }
}

.gy-solar-story.is-reduced .gy-solar-stage,
.gy-solar-story.is-reduced .gy-solar-panel,
.gy-solar-story.is-reduced .gy-solar-device,
.gy-solar-story.is-reduced .gy-solar-device__detail,
.gy-solar-story.is-reduced .gy-solar-device__light,
.gy-solar-story.is-reduced .gy-solar-grid,
.gy-solar-story.is-reduced .gy-solar-sun,
.gy-solar-story.is-reduced .gy-solar-rays,
.gy-solar-story.is-reduced .gy-solar-complete,
.gy-solar-story.is-reduced .gy-solar-complete__label {
  opacity: 1 !important;
  animation: none !important;
  transform: none !important;
}

.gy-solar-story.is-reduced .gy-solar-draw,
.gy-solar-story.is-reduced .gy-solar-wire,
.gy-solar-story.is-reduced .gy-solar-energy-flow,
.gy-solar-story.is-reduced .gy-solar-check {
  stroke-dashoffset: 0 !important;
  animation: none !important;
}

.gy-solar-story.is-reduced .gy-solar-pencil {
  display: none;
}

@media (max-width: 920px) {
  .gy-solar-story__inner {
    grid-template-columns: 1fr;
  }

  .gy-solar-story__intro {
    max-width: 720px;
  }

  .gy-solar-story__visual {
    width: min(100%, 760px);
    margin-inline: auto;
    scroll-margin-top: 118px;
  }
}

@media (max-width: 560px) {
  .gy-solar-story {
    padding-block: 64px;
  }

  .gy-solar-story::before {
    background-size: 28px 28px;
  }

  .gy-solar-story h2 {
    font-size: 34px;
  }

  .gy-solar-story h2 br {
    display: none;
  }

  .gy-solar-story__description {
    font-size: 15px;
    line-height: 1.75;
  }

  .gy-solar-story__visual {
    max-width: 100%;
    scroll-margin-top: 126px;
    padding: 9px;
    border-radius: 12px;
  }

  .gy-solar-story__canvas {
    border-radius: 7px;
  }

  .gy-solar-story__status {
    padding: 14px 3px 3px;
  }

  .gy-solar-story__status-row strong,
  .gy-solar-story__status-row {
    font-size: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gy-solar-story *,
  .gy-solar-story *::before,
  .gy-solar-story *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* 실사 기반 농업시설 태양광 공정 애니메이션 */
.gy-solar-story { padding: 24px 24px clamp(92px,9vw,150px); background:#06111d; }
.gy-solar-story::before { opacity:.1; background-size:72px 72px; }
.gy-solar-story__inner { display:block; width:min(100%,1240px); max-width:1240px; margin-inline:auto; }
.gy-solar-story__sr { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.gy-solar-story__canvas { display:none; }
.gy-solar-story__visual { position:relative; min-height:680px; padding:0; overflow:hidden; scroll-margin-top:152px; border:1px solid rgba(255,255,255,.15); border-radius:0; background:#0b1927; box-shadow:0 28px 80px rgba(0,0,0,.26); isolation:isolate; }
.gy-solar-story__photo,.gy-solar-story__photo img,.gy-solar-story__shade,.gy-solar-story__motion { position:absolute; inset:0; width:100%; height:100%; }
.gy-solar-story__photo { z-index:0; display:block; }
.gy-solar-story__photo,.gy-solar-story__motion { transform-origin:center; transform:translate3d(var(--gy-camera-x,0),var(--gy-camera-y,0),0) scale(var(--gy-camera-scale,1.03)); transition:transform 1.45s cubic-bezier(.22,1,.36,1); will-change:transform; }
.gy-solar-story__photo img { object-fit:cover; object-position:center; filter:brightness(.54) saturate(.78) contrast(1.12); transition:filter .55s ease; }
.gy-solar-story__visual.is-changing .gy-solar-story__photo img { filter:brightness(.49) saturate(.7) contrast(1.15); }
.gy-solar-story__shade { z-index:1; pointer-events:none; background:radial-gradient(circle at var(--gy-solar-spot-x,50%) var(--gy-solar-spot-y,42%),rgba(185,222,95,.16),transparent 27%),linear-gradient(90deg,rgba(4,12,21,.52),rgba(4,12,21,.08) 58%,rgba(4,12,21,.16)),linear-gradient(0deg,rgba(4,12,21,.88),transparent 58%); transition:background .45s ease; }
.gy-solar-story__motion { z-index:2; overflow:visible; pointer-events:none; }
.gy-solar-motion { opacity:0; transition:opacity .35s ease; }
.gy-solar-story__visual[data-solar-stage="0"] [data-solar-motion="0"],.gy-solar-story__visual[data-solar-stage="1"] [data-solar-motion="1"],.gy-solar-story__visual[data-solar-stage="2"] [data-solar-motion="2"],.gy-solar-story__visual[data-solar-stage="3"] [data-solar-motion="3"],.gy-solar-story__visual[data-solar-stage="4"] [data-solar-motion="4"],.gy-solar-story__visual[data-solar-stage="5"] [data-solar-motion="5"] { opacity:1; }

.gy-solar-roof-outline,.gy-solar-sun-arc,.gy-solar-survey-scan,.gy-solar-water-path,.gy-solar-rail,.gy-solar-electric-path,.gy-solar-ac-path,.gy-solar-monitor-rays,.gy-solar-energy-path,.gy-solar-monitor-waves path,.gy-solar-check { fill:none; stroke:#d9f36f; stroke-width:3.5; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.gy-solar-roof-outline,.gy-solar-sun-arc,.gy-solar-survey-nodes { display:none; }
.gy-solar-survey-scan { stroke:rgba(142,215,255,.72); stroke-width:2; filter:url(#gy-solar-photo-glow); animation:gySolarSurvey 2.3s cubic-bezier(.45,0,.55,1) infinite; }
.gy-solar-survey-nodes circle { fill:#d9f36f; stroke:#fff; stroke-width:2; transform-box:fill-box; transform-origin:center; animation:gySolarPulse 1.5s ease-in-out infinite; }
.gy-solar-survey-nodes circle:nth-child(2){animation-delay:.25s}.gy-solar-survey-nodes circle:nth-child(3){animation-delay:.5s}
.gy-solar-water-path { stroke:#8ed7ff; stroke-width:4; stroke-dasharray:12 9; animation:gySolarFlow 1.35s linear infinite; }
.gy-solar-water-path:nth-of-type(3) { display:none; }
.gy-solar-water-drops path { fill:#8ed7ff; filter:url(#gy-solar-photo-glow); transform-box:fill-box; transform-origin:center; animation:gySolarDrop 1.6s ease-in infinite; }
.gy-solar-water-drops path:nth-child(n+2) { display:none; }
.gy-solar-water-drops path:nth-child(2){animation-delay:.35s}.gy-solar-water-drops path:nth-child(3){animation-delay:.7s}
.gy-solar-rail { stroke:#f2c66a; stroke-width:5; stroke-dasharray:1; stroke-dashoffset:1; animation:gySolarDrawRail 1.25s ease forwards; }
.gy-solar-fasteners circle { fill:#d9f36f; stroke:#fff; stroke-width:2; transform-box:fill-box; transform-origin:center; animation:gySolarFastener .65s ease-in-out infinite alternate; }
.gy-solar-fasteners circle:nth-child(n+4) { display:none; }
.gy-solar-module path:first-child { fill:rgba(26,76,112,.12); stroke:rgba(156,221,255,.52); stroke-width:1.8; vector-effect:non-scaling-stroke; }
.gy-solar-module path:last-child { display:none; }
.gy-solar-story__visual[data-solar-stage="3"] .gy-solar-module { opacity:0; transform-box:fill-box; transform-origin:center; animation:gySolarPanelPlace .78s cubic-bezier(.2,.9,.25,1.22) forwards; }
.gy-solar-story__visual[data-solar-stage="3"] .gy-solar-module--2{animation-delay:.24s}.gy-solar-story__visual[data-solar-stage="3"] .gy-solar-module--3{animation-delay:.48s}.gy-solar-story__visual[data-solar-stage="3"] .gy-solar-module--4{animation-delay:.72s}
.gy-solar-electric-path { stroke:#ffd36e; stroke-width:5; stroke-dasharray:16 10; animation:gySolarFlow 1.1s linear infinite; filter:url(#gy-solar-photo-glow); }
.gy-solar-ac-path { stroke:#d9f36f; stroke-width:5; stroke-dasharray:13 9; animation:gySolarFlow .95s linear infinite; }
.gy-solar-inverter { fill:rgba(240,245,247,.9); stroke:#9ed8ee; stroke-width:3; vector-effect:non-scaling-stroke; }
.gy-solar-inverter-detail { fill:none; stroke:#183b52; stroke-width:4; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.gy-solar-inverter-light { fill:#d9f36f; filter:url(#gy-solar-photo-glow); animation:gySolarPulse 1s ease-in-out infinite; }
.gy-solar-monitor-sun,.gy-solar-monitor-rays,.gy-solar-energy-path { display:none; }
.gy-solar-monitor-waves path { stroke:#8ed7ff; stroke-width:4; animation:gySolarWave 1.5s ease-out infinite; }.gy-solar-monitor-waves path:nth-child(2){animation-delay:.28s}.gy-solar-monitor-waves circle{fill:#d9f36f}
.gy-solar-check { stroke:#d9f36f; stroke-width:7; stroke-dasharray:1; stroke-dashoffset:1; animation:gySolarDrawRail .7s .35s ease forwards; }

.gy-solar-story__status { position:absolute; z-index:3; right:28px; bottom:28px; width:min(500px,calc(100% - 56px)); min-height:205px; padding:26px 28px 24px; color:#fff; background:linear-gradient(135deg,rgba(5,18,29,.16),rgba(5,18,29,.04)); border:1px solid rgba(255,255,255,.26); -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:0 12px 32px rgba(0,0,0,.10); text-shadow:0 2px 12px rgba(0,0,0,.72); }
.gy-solar-story__status>span { color:#d9f36f; font-size:10px; font-weight:900; letter-spacing:.14em; }
.gy-solar-story__status h3 { margin:8px 0 9px; color:#fff; font-size:clamp(22px,2.3vw,30px); }
.gy-solar-story__status p { min-height:4.9em; margin:0; color:rgba(255,255,255,.72); font-size:13px; line-height:1.72; word-break:keep-all; }
.gy-solar-story__progress { height:2px; margin-top:18px; overflow:hidden; background:rgba(255,255,255,.18); }
.gy-solar-story__progress i { display:block; width:0; height:100%; background:#d9f36f; }
.gy-solar-story__progress i.is-running { animation:gySolarProgress 4.6s linear forwards; }
@keyframes gySolarOutline{to{stroke-dashoffset:-48}}
@keyframes gySolarFlow{to{stroke-dashoffset:-52}}
@keyframes gySolarSurvey{0%{transform:translate(-12%,-10%);opacity:0}20%,80%{opacity:1}100%{transform:translate(14%,12%);opacity:0}}
@keyframes gySolarPulse{50%{transform:scale(1.45);opacity:.55}}
@keyframes gySolarDrop{0%{transform:translateY(-9px);opacity:0}35%{opacity:1}100%{transform:translateY(24px);opacity:0}}
@keyframes gySolarDrawRail{to{stroke-dashoffset:0}}
@keyframes gySolarFastener{to{transform:scale(1.38);filter:drop-shadow(0 0 6px #d9f36f)}}
@keyframes gySolarPanelPlace{0%{opacity:0;transform:translateY(-38px) scale(.985)}100%{opacity:.62;transform:translateY(0) scale(1)}}
@keyframes gySolarSpin{to{transform:rotate(360deg)}}
@keyframes gySolarWave{0%{opacity:0;transform:scale(.72)}40%{opacity:1}100%{opacity:0;transform:scale(1.12)}}
@keyframes gySolarProgress{to{width:100%}}

@media(max-width:920px){.gy-solar-story{padding-right:20px;padding-left:20px}.gy-solar-story__visual{min-height:720px;scroll-margin-top:118px}}
@media(max-width:640px){.gy-solar-story{padding:16px 16px 82px}.gy-solar-story__visual{min-height:760px;scroll-margin-top:126px}.gy-solar-story__photo img{object-position:center}.gy-solar-story__shade{background:linear-gradient(0deg,rgba(4,12,21,.97),rgba(4,12,21,.38) 70%,rgba(4,12,21,.16))}.gy-solar-story__status{right:18px;bottom:18px;left:18px;width:auto;min-height:224px;padding:24px}.gy-solar-story__status p{min-height:6.4em}}
@media(prefers-reduced-motion:reduce){.gy-solar-motion{opacity:0!important}.gy-solar-story__visual[data-solar-stage="5"] [data-solar-motion="5"]{opacity:1!important}.gy-solar-story__progress i{width:100%;animation:none!important}}

/* 같은 카메라 구도의 실사 공정 장면을 천천히 이동하며 설명한다. */
.gy-solar-story__photos {
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  transform-origin: center;
  transform: translate3d(var(--gy-camera-x, 0), var(--gy-camera-y, 0), 0) scale(var(--gy-camera-scale, 1.03));
  transition: transform 3.2s cubic-bezier(.16,.74,.2,1);
  will-change: transform;
}

.gy-solar-story__photos img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--gy-photo-position-x, 50%) var(--gy-photo-position-y, 48%);
  opacity: 0;
  filter: brightness(.88) saturate(.94) contrast(1.1);
  transition: opacity 1.35s ease, object-position 3.2s cubic-bezier(.16,.74,.2,1), filter 1.35s ease;
  will-change: opacity, object-position;
}

.gy-solar-story__visual[data-solar-stage="0"] [data-solar-photo="0"],
.gy-solar-story__visual[data-solar-stage="1"] [data-solar-photo="1"],
.gy-solar-story__visual[data-solar-stage="2"] [data-solar-photo="2"],
.gy-solar-story__visual[data-solar-stage="3"] [data-solar-photo="3"],
.gy-solar-story__visual[data-solar-stage="4"] [data-solar-photo="4"],
.gy-solar-story__visual[data-solar-stage="5"] [data-solar-photo="5"] {
  opacity: 1;
}

.gy-solar-story__visual[data-solar-stage="3"] [data-solar-photo="3"] {
  animation: gySolarPhotoBuild 2.2s cubic-bezier(.22,.78,.24,1) both;
}

.gy-solar-story__visual[data-solar-stage="0"] [data-solar-photo="0"] {
  animation: gySolarSunView 7.2s cubic-bezier(.16,.64,.18,1) both;
  transform-origin: 72% 28%;
}

.gy-solar-story__detail-photo {
  z-index: 1;
  object-position: center !important;
  filter: brightness(.98) saturate(.96) contrast(1.12) !important;
  transform-origin: center;
  will-change: transform, opacity;
}

.gy-solar-story__visual [data-solar-detail-photo="1"] { --gy-detail-end-x: -8%; --gy-detail-end-y: -3%; --gy-detail-end-scale: 1.35; transform-origin: 72% 58%; }
.gy-solar-story__visual [data-solar-detail-photo="2"] { --gy-detail-end-x: -7%; --gy-detail-end-y: -5%; --gy-detail-end-scale: 1.4; transform-origin: 55% 58%; }
.gy-solar-story__visual [data-solar-detail-photo="3"] { --gy-detail-end-x: -5%; --gy-detail-end-y: -8%; --gy-detail-end-scale: 1.38; transform-origin: 50% 62%; }
.gy-solar-story__visual [data-solar-detail-photo="4"] { --gy-detail-end-x: -11%; --gy-detail-end-y: -2%; --gy-detail-end-scale: 1.4; transform-origin: 68% 52%; }
.gy-solar-story__visual [data-solar-detail-photo="5"] { --gy-detail-end-x: -13%; --gy-detail-end-y: 0%; --gy-detail-end-scale: 1.42; transform-origin: 72% 50%; }

.gy-solar-story__visual[data-solar-stage="1"] [data-solar-detail-photo="1"],
.gy-solar-story__visual[data-solar-stage="2"] [data-solar-detail-photo="2"],
.gy-solar-story__visual[data-solar-stage="3"] [data-solar-detail-photo="3"],
.gy-solar-story__visual[data-solar-stage="4"] [data-solar-detail-photo="4"],
.gy-solar-story__visual[data-solar-stage="5"] [data-solar-detail-photo="5"] {
  animation: gySolarDetailFocus 5.5s 1s cubic-bezier(.16,.64,.18,1) both;
}

/* 실사 부품을 가리지 않도록 기존 도식 선은 사용하지 않는다. */
.gy-solar-story__motion { display: none !important; }

.gy-solar-story__shade {
  background:
    radial-gradient(circle at var(--gy-solar-spot-x,50%) var(--gy-solar-spot-y,42%), rgba(220,239,158,.08), transparent 26%),
    linear-gradient(90deg, rgba(4,12,21,.16), rgba(4,12,21,0) 62%, rgba(4,12,21,.04)),
    linear-gradient(0deg, rgba(4,12,21,.48), transparent 54%);
  transition: background 1.4s ease;
}

.gy-solar-story__status {
  right: auto;
  left: 28px;
}

.gy-solar-story__status > em {
  display: block;
  margin-top: 7px;
  color: rgba(218,240,143,.9);
  font-size: 11px;
  font-style: normal;
  font-weight: 750;
  letter-spacing: .015em;
  word-break: keep-all;
}

.gy-solar-story__visual.is-changing .gy-solar-story__status > *:not(.gy-solar-story__progress) {
  animation: gySolarCaptionIn .72s cubic-bezier(.22,.78,.24,1) both;
}

.gy-solar-story__progress i.is-running { animation-duration: 4.6s; }

@keyframes gySolarPhotoBuild {
  from { clip-path: inset(0 42% 0 0); filter: brightness(.49) saturate(.68) contrast(1.12); }
  to { clip-path: inset(0 0 0 0); filter: brightness(.57) saturate(.76) contrast(1.1); }
}

@keyframes gySolarCaptionIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes gySolarDetailFocus {
  0% { opacity: 0; transform: translate3d(3%, 2%, 0) scale(.98); }
  13% { opacity: 1; }
  100% { opacity: 1; transform: translate3d(var(--gy-detail-end-x, -5%), var(--gy-detail-end-y, -2%), 0) scale(var(--gy-detail-end-scale, 1.23)); }
}

@keyframes gySolarSunView {
  from { transform: translate3d(1.5%, 1%, 0) scale(1); }
  to { transform: translate3d(-2.5%, 1.5%, 0) scale(1.09); }
}

@media (max-width: 640px) {
  .gy-solar-story__photos img { object-position: var(--gy-photo-position-x, 50%) var(--gy-photo-position-y, 48%); }
  .gy-solar-story__status { right: 18px; left: 18px; }
  .gy-solar-story__visual [data-solar-detail-photo="1"] { --gy-detail-end-x: -3%; --gy-detail-end-y: -2%; --gy-detail-end-scale: 1.2; }
  .gy-solar-story__visual [data-solar-detail-photo="2"] { --gy-detail-end-x: -3%; --gy-detail-end-y: -3%; --gy-detail-end-scale: 1.25; }
  .gy-solar-story__visual [data-solar-detail-photo="3"] { --gy-detail-end-x: -2%; --gy-detail-end-y: -4%; --gy-detail-end-scale: 1.23; }
  .gy-solar-story__visual [data-solar-detail-photo="4"] { --gy-detail-end-x: -4%; --gy-detail-end-y: -2%; --gy-detail-end-scale: 1.25; }
  .gy-solar-story__visual [data-solar-detail-photo="5"] { --gy-detail-end-x: -5%; --gy-detail-end-y: 0%; --gy-detail-end-scale: 1.26; }
}

@media (prefers-reduced-motion: reduce) {
  .gy-solar-story__photos,
  .gy-solar-story__photos img { transition: none !important; animation: none !important; }
  .gy-solar-story__visual[data-solar-stage="2"] [data-solar-detail-photo="2"],
  .gy-solar-story__visual[data-solar-stage="1"] [data-solar-detail-photo="1"],
  .gy-solar-story__visual[data-solar-stage="3"] [data-solar-detail-photo="3"],
  .gy-solar-story__visual[data-solar-stage="4"] [data-solar-detail-photo="4"],
  .gy-solar-story__visual[data-solar-stage="5"] [data-solar-detail-photo="5"] { opacity: 1 !important; }
}