/* Premium interaction layer: restrained motion, depth and light. */
.scroll-progress {
  position: fixed;
  z-index: 120;
  inset: 0 auto auto 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, #2f9e96 0%, #7ac8bf 48%, #efc06b 100%);
  box-shadow: 0 1px 9px rgba(47, 158, 150, .34);
  transform: scaleX(0);
  transform-origin: left center;
  pointer-events: none;
}

.site-header,
.header-inner,
.brand-logo {
  transition: min-height 360ms cubic-bezier(.2, .75, .25, 1), padding 360ms ease, width 360ms ease, background 360ms ease, box-shadow 360ms ease, border-color 360ms ease, transform 280ms ease;
}

.site-header.is-scrolled {
  border-bottom-color: rgba(170, 198, 203, .72);
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 12px 35px rgba(12, 36, 54, .09);
}

.site-header.is-scrolled .header-inner { min-height: 66px; }
.site-header.is-scrolled .brand-logo { width: clamp(196px, 17vw, 224px); }
.brand:hover .brand-logo { transform: translateY(-2px); }

.hero,
.page-hero {
  --ambient-x: 0px;
  --ambient-y: 0px;
}

.hero > .wrap,
.page-hero > .wrap {
  position: relative;
  z-index: 2;
}

.premium-ambient {
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.premium-ambient i {
  position: absolute;
  display: block;
  border-radius: 50%;
  opacity: .5;
  filter: blur(1px);
  will-change: transform;
}

.premium-ambient i:nth-child(1) {
  width: 360px;
  height: 360px;
  right: 4%;
  top: -190px;
  border: 1px solid rgba(47, 158, 150, .24);
  background: radial-gradient(circle at 35% 40%, rgba(152, 221, 212, .35), rgba(255, 255, 255, 0) 68%);
  transform: translate3d(var(--ambient-x), calc(var(--ambient-y) + var(--premium-scroll-shift, 0px)), 0);
  animation: premium-orbit-a 13s ease-in-out infinite alternate;
}

.premium-ambient i:nth-child(2) {
  width: 210px;
  height: 210px;
  left: 7%;
  bottom: -140px;
  border: 1px solid rgba(201, 148, 79, .28);
  background: radial-gradient(circle, rgba(239, 192, 107, .2), rgba(255, 255, 255, 0) 68%);
  transform: translate3d(calc(var(--ambient-x) * -.5), calc(var(--ambient-y) * -.5), 0);
  animation: premium-orbit-b 11s ease-in-out infinite alternate;
}

.premium-ambient i:nth-child(3) {
  width: 8px;
  height: 8px;
  left: 46%;
  top: 20%;
  background: #efc06b;
  box-shadow: 0 0 0 8px rgba(239, 192, 107, .1), 0 0 28px rgba(239, 192, 107, .5);
  animation: premium-spark 5.5s ease-in-out infinite;
}

.page-hero .breadcrumb,
.page-hero .hero-kicker,
.page-hero h1,
.page-hero .hero-lede,
.page-hero .hero-actions {
  animation: premium-copy-in 780ms cubic-bezier(.2, .8, .2, 1) both;
}

.page-hero .hero-kicker { animation-delay: 70ms; }
.page-hero h1 { animation-delay: 140ms; }
.page-hero .hero-lede { animation-delay: 220ms; }
.page-hero .hero-actions { animation-delay: 300ms; }
.page-hero .hero-art { overflow: visible; clip-path: none; animation: premium-art-in 960ms cubic-bezier(.16, .8, .24, 1) 120ms both; }

.hero-photo,
.hero-symbol,
.hero-visual {
  transition: transform 650ms cubic-bezier(.2, .8, .2, 1), filter 450ms ease;
  will-change: transform;
}

.hero-photo-card,
.hero-note,
.hero-badge {
  animation: premium-soft-float 6.5s ease-in-out 1s infinite;
}

.hero-badge { animation-delay: 1.65s; }
.hero-note { animation-direction: reverse; }

.button,
.header-cta,
.branch-actions a,
.source-link,
.menu-rail-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: translate 260ms cubic-bezier(.2, .8, .2, 1), transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease;
}

.button::after,
.header-cta::after,
.branch-actions a::after,
.source-link::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -50% auto -50% -38%;
  width: 28%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .46), transparent);
  transform: skewX(-18deg) translateX(-180%);
  transition: transform 680ms cubic-bezier(.2, .8, .2, 1);
  pointer-events: none;
}

.button:hover::after,
.header-cta:hover::after,
.branch-actions a:hover::after,
.source-link:hover::after { transform: skewX(-18deg) translateX(600%); }

.button:active,
.header-cta:active,
.branch-actions a:active { transform: scale(.98); }

.premium-surface {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transform-style: preserve-3d;
}

.premium-surface > :not(.premium-glow) {
  position: relative;
  z-index: 1;
}

.premium-glow {
  position: absolute;
  z-index: 0;
  inset: 0;
  opacity: 0;
  background: radial-gradient(360px circle at var(--glow-x, 50%) var(--glow-y, 50%), rgba(118, 205, 194, .22), rgba(255, 255, 255, 0) 56%);
  transition: opacity 320ms ease;
  pointer-events: none;
}

.premium-surface:hover .premium-glow,
.premium-surface:focus-within .premium-glow { opacity: 1; }

.premium-tilt.is-tilting {
  transform: perspective(980px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)) translateY(-5px);
  box-shadow: 0 24px 52px rgba(12, 36, 54, .13);
}

.premium-ready .premium-reveal {
  opacity: 0;
  filter: blur(6px);
  transform: translateY(30px) scale(.985);
  transition: opacity 760ms ease var(--premium-delay, 0ms), transform 820ms cubic-bezier(.16, .8, .24, 1) var(--premium-delay, 0ms), filter 760ms ease var(--premium-delay, 0ms);
}

.premium-ready .premium-reveal.premium-visible {
  opacity: 1;
  filter: none;
  transform: none;
}

.premium-heading {
  position: relative;
  display: inline-block;
}

.premium-heading::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -12px;
  width: 52px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #2f9e96, #efc06b);
  box-shadow: 0 0 14px rgba(47, 158, 150, .25);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 780ms cubic-bezier(.2, .8, .2, 1) 180ms;
}

.premium-heading.premium-visible::after { transform: scaleX(1); }
.section-heading .premium-heading::after { left: 50%; transform-origin: center; translate: -50% 0; }
.section-heading .premium-heading.premium-visible::after { transform: scaleX(1); }

.premium-wipe {
  clip-path: inset(0 100% 0 0 round 22px);
  transition: clip-path 1s cubic-bezier(.16, .8, .24, 1) var(--premium-delay, 0ms);
}

.premium-wipe.premium-visible { clip-path: inset(0 0 0 0 round 0); }

.rail-track[data-auto-flow] {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 3%, #000 97%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 3%, #000 97%, transparent 100%);
}

.rail-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.rail-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(115deg, transparent 25%, rgba(47, 158, 150, .12) 48%, transparent 72%);
  transform: translateX(-110%);
  transition: transform 650ms cubic-bezier(.2, .8, .2, 1);
}

.rail-card:hover::before,
.rail-card:focus-visible::before { transform: translateX(110%); }

.process-number,
.feature-icon,
.source-seal,
.program-icon,
.quick-icon,
.voucher-icon {
  transition: transform 430ms cubic-bezier(.18, .85, .24, 1), box-shadow 430ms ease, color 260ms ease, background 260ms ease;
}

.process-card:hover .process-number,
.feature-card:hover .feature-icon,
.guideline-source:hover .source-seal,
.program-card:hover .program-icon,
.quick-link:hover .quick-icon,
.voucher-item:hover .voucher-icon {
  transform: translateY(-3px) rotate(-4deg) scale(1.08);
  box-shadow: 0 10px 22px rgba(47, 158, 150, .18);
}

.voucher-item[open] > :not(summary),
details[open] > p {
  animation: premium-details-open 420ms cubic-bezier(.2, .8, .2, 1) both;
}

.nav-popover-grid a {
  transition: transform 220ms ease, color 220ms ease, background 220ms ease;
}

.nav-popover-grid a:hover { transform: translateX(4px); }
.nav-popover-grid a:nth-child(2n) { transition-delay: 25ms; }

.final-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-size: 180% 180%;
  animation: premium-gradient-flow 12s ease-in-out infinite alternate;
}

.final-cta::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 430px;
  height: 430px;
  right: -170px;
  top: -260px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 50%;
  box-shadow: 0 0 0 55px rgba(255, 255, 255, .025), 0 0 0 110px rgba(255, 255, 255, .018);
  animation: premium-ring-drift 10s ease-in-out infinite alternate;
}

.mobile-bar { animation: premium-mobile-bar-in 620ms cubic-bezier(.16, .8, .24, 1) both; }

.page-curtain {
  position: fixed;
  z-index: 999;
  inset: 0;
  background: linear-gradient(145deg, #0c2436, #174762 62%, #2f9e96);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 280ms cubic-bezier(.7, 0, .3, 1);
  pointer-events: none;
}

.page-curtain::after {
  content: "DAOL";
  position: absolute;
  left: 50%;
  top: 50%;
  color: rgba(255, 255, 255, .72);
  font-family: "Noto Serif KR", serif;
  font-size: clamp(22px, 4vw, 38px);
  letter-spacing: .2em;
  opacity: 0;
  translate: -50% -50%;
  transition: opacity 180ms ease;
}

body.is-navigating .page-curtain { transform: scaleY(1); pointer-events: auto; }
body.is-navigating .page-curtain::after { opacity: 1; transition-delay: 100ms; }

@keyframes premium-copy-in {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: none; }
}

@keyframes premium-art-in {
  from { opacity: 0; transform: translateX(28px) scale(.97); }
  to { opacity: 1; transform: none; }
}

@keyframes premium-orbit-a {
  from { margin: 0; rotate: -4deg; scale: .96; }
  to { margin: 22px -15px 0 0; rotate: 7deg; scale: 1.05; }
}

@keyframes premium-orbit-b {
  from { margin: 0; scale: 1; }
  to { margin: -18px 0 0 24px; scale: 1.09; }
}

@keyframes premium-spark {
  0%, 100% { opacity: .25; transform: scale(.75); }
  50% { opacity: .9; transform: scale(1.15); }
}

@keyframes premium-soft-float {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -7px; }
}

@keyframes premium-details-open {
  from { opacity: 0; transform: translateY(-7px); }
  to { opacity: 1; transform: none; }
}

@keyframes premium-gradient-flow {
  from { background-position: 0 50%; }
  to { background-position: 100% 50%; }
}

@keyframes premium-ring-drift {
  from { transform: translate3d(0, 0, 0) rotate(0); }
  to { transform: translate3d(-30px, 34px, 0) rotate(12deg); }
}

@keyframes premium-mobile-bar-in {
  from { opacity: 0; transform: translateY(100%); }
  to { opacity: 1; transform: none; }
}

@media (hover: none), (pointer: coarse) {
  .premium-tilt.is-tilting { transform: none; }
  .premium-glow { display: none; }
}

@media (max-width: 680px) {
  .scroll-progress { height: 2px; }
  .site-header.is-scrolled .header-inner { min-height: 62px; }
  .site-header.is-scrolled .brand-logo { width: min(178px, 55vw); }
  .premium-ambient i:nth-child(1) { width: 250px; height: 250px; right: -80px; top: -130px; }
  .premium-ambient i:nth-child(2) { width: 150px; height: 150px; left: -60px; }
  .hero-photo-card, .hero-note, .hero-badge { animation: none; }
  .premium-ready .premium-reveal { filter: none; transform: translateY(20px); }
  .section-heading .premium-heading::after { left: 0; translate: 0; transform-origin: left; }
  .rail-track[data-auto-flow] { -webkit-mask-image: linear-gradient(90deg, #000 0, #000 92%, transparent 100%); mask-image: linear-gradient(90deg, #000 0, #000 92%, transparent 100%); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .premium-ready .premium-reveal { opacity: 1; filter: none; transform: none; }
  .premium-wipe { clip-path: none; }
  .premium-heading::after { transform: scaleX(1); }
  .premium-ambient { display: none; }
  .page-curtain { display: none; }
}

/* Keep absolute program thumbnails outside the generic surface content rule. */
.premium-surface > .listing-photo {
  position: absolute;
  z-index: 0;
}

/* Cards scatter outward, then assemble into their final grid positions. */
.card-burst-group {
  position: relative;
  isolation: isolate;
}

.card-burst-group::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 48%;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(47, 158, 150, .34);
  border-radius: 50%;
  opacity: 0;
  translate: -50% -50%;
  pointer-events: none;
}

.card-burst-group.burst-active::before {
  animation: premium-burst-ripple 1.15s cubic-bezier(.16, .8, .24, 1) 90ms both;
}

.premium-ready .card-burst-item {
  opacity: 0 !important;
  filter: blur(5px);
  transform: translate3d(var(--burst-x, 0), var(--burst-y, 45px), 0) rotate(var(--burst-r, 0deg)) scale(.76) !important;
  transition: opacity 520ms ease var(--burst-delay, 0ms), filter 700ms ease var(--burst-delay, 0ms), transform 880ms cubic-bezier(.16, .82, .2, 1) var(--burst-delay, 0ms), box-shadow 320ms ease !important;
  will-change: transform, opacity, filter;
}

.premium-ready .card-burst-item.burst-settled {
  opacity: 1 !important;
  filter: none;
  transform: translate3d(0, 0, 0) rotate(0) scale(1) !important;
}

.premium-ready .card-burst-item.burst-settled.premium-tilt.is-tilting {
  transform: perspective(980px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)) translateY(-5px) !important;
}

.premium-ready .program-card.card-burst-item.burst-settled:hover {
  transform: translateY(-5px) !important;
}

@keyframes premium-burst-ripple {
  0% { opacity: 0; transform: scale(.4); }
  24% { opacity: .72; }
  100% { opacity: 0; transform: scale(15); }
}

@media (max-width: 680px) {
  .premium-ready .card-burst-item {
    filter: blur(2px);
    transform: translate3d(var(--burst-mobile-x, 0), var(--burst-mobile-y, 18px), 0) rotate(var(--burst-mobile-r, 0deg)) scale(.86) !important;
    transition-duration: 460ms, 560ms, 720ms, 260ms !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .premium-ready .card-burst-item,
  .premium-ready .card-burst-item.burst-settled {
    opacity: 1 !important;
    filter: none;
    transform: none !important;
  }
  .card-burst-group::before { display: none; }
}


/* Listing photos reveal with the card itself so lazy loading cannot stall a clipped image. */
.listing-photo.premium-wipe {
  clip-path: none;
}

.card-burst-item .listing-photo img {
  opacity: .35;
  transform: scale(1.12);
  transition: opacity 720ms ease var(--burst-delay, 0ms), transform 1s cubic-bezier(.16, .82, .2, 1) var(--burst-delay, 0ms), filter 300ms ease;
}

.card-burst-item.burst-settled .listing-photo img {
  opacity: 1;
  transform: scale(1);
}

.card-burst-item.burst-settled:hover .listing-photo img,
.card-burst-item.burst-settled:focus-visible .listing-photo img {
  transform: scale(1.055);
}


/* Overlay labels intentionally extend beyond their photos. Keep those edges visible. */
.story-image-wrap { overflow: visible; clip-path: none; }
.story-image,
.story-image.premium-wipe {
  opacity: 1 !important;
  clip-path: none !important;
}


/* Keep burst and overlay motion inside the viewport; horizontal rails retain their own scrolling. */
html, body { max-width: 100%; overflow-x: clip; }
