/* Cosmic Playful Tech — paint-only art direction on the existing section roots.
   Keep source dimensions, type metrics, clipping, transforms and timelines.
   Remove this one stylesheet to return to the Mathflat palette adapters. */

/* Arin / hero: cinematic intro, existing photographic slides and white state. */

/* 해결책 가로 슬라이드: 에셋과 진행 단계는 유지하고 우주·블루 컨셉트만 입힌다. */
#wf-main-5[data-ax-ds="mathflat"] .aimhigh-solution-reference .sticky_content {
  background-color:var(--ax-mf-concept-night);
  background-image:radial-gradient(ellipse at 65% 40%,var(--ax-mf-concept-halo),transparent 65%),var(--ax-mf-concept-stars);
}
#wf-main-5[data-ax-ds="mathflat"] .aimhigh-solution-reference .img_wrap {
  box-shadow:var(--ax-mf-concept-shadow-dark);
}
#wf-main-5[data-ax-ds="mathflat"] .aimhigh-solution-reference .content_box > ul > li:last-child::after {
  background:var(--ax-mf-concept-night-raised);
}
#wf-main-5[data-ax-ds="mathflat"] .aimhigh-solution-reference .content_box > ul > li:last-child::before {
  background:linear-gradient(90deg,transparent,var(--ax-mf-accent-strong) 50%,var(--ax-mf-accent) 70%,transparent);
}
#wf-main-1[data-ax-ds="mathflat"] .arin-reference .main-intro {
  color: #000;
  background-color: #fff;
  background-image: none;
}
#wf-main-1[data-ax-ds="mathflat"] .main-intro .line {
  background-image: linear-gradient(90deg, transparent, #000, transparent);
}
#wf-main-1[data-ax-ds="mathflat"] .main-visual .slide-title {
  text-shadow: 0 3px 28px rgba(0, 0, 0, .35);
}
.arin-site-header[data-ax-ds="mathflat"]:not(.white):not(.is-menu-open) .arin-gnb > ul {
  box-shadow: var(--ax-mf-concept-shadow-card);
}
.arin-site-header[data-ax-ds="mathflat"].is-menu-open .arin-gnb {
  background-color: var(--ax-mf-concept-night);
  background-image: var(--ax-mf-concept-stars);
}

/* Persona: the original soft 3D figures sit on illuminated, porcelain cards. */
#wf-main-2[data-ax-ds="mathflat"] .main__persona__section.main__contents__wr {
  background-image: radial-gradient(ellipse at 75% 45%, var(--ax-mf-concept-halo), transparent 65%);
}
#wf-main-2[data-ax-ds="mathflat"] .main__persona__card {
  background-image: linear-gradient(155deg, var(--ax-mf-surface-page) 65%, color-mix(in srgb, var(--ax-mf-accent) 3%, white));
  box-shadow: var(--ax-mf-concept-shadow-card);
}

/* Portfolio: preserve card art and 3D flips; add a restrained shared material. */
#wf-main-3[data-ax-ds="mathflat"] .mathflat-home-reference {
  background-image: radial-gradient(ellipse at 50% 0, var(--ax-mf-concept-halo-soft), transparent 48%);
}
#wf-main-3[data-ax-ds="mathflat"] :is(.main-solution__front, .main-solution__back) {
  box-shadow: var(--ax-mf-concept-shadow-card);
}
#wf-main-3[data-ax-ds="mathflat"] .main-solution__back {
  background-image: radial-gradient(ellipse at 0 0, color-mix(in srgb, var(--ax-mf-accent) 75%, white), var(--ax-mf-accent-strong));
}

/* Case study: a dark brand scene around the existing image carousel. */
#wf-main-4[data-ax-ds="mathflat"] .mathflat-home-reference {
  background-color: var(--ax-mf-concept-night);
  background-image: radial-gradient(ellipse at 50% 0, var(--ax-mf-concept-halo), transparent 65%), var(--ax-mf-concept-stars);
  color: var(--ax-mf-concept-night-text);
}
#wf-main-4[data-ax-ds="mathflat"] .main-section__title,
#wf-main-4[data-ax-ds="mathflat"] .main-section__title .jt-typo--02 {
  color: var(--ax-mf-concept-night-text);
}
#wf-main-4[data-ax-ds="mathflat"] .main-section__desc {
  color: var(--ax-mf-concept-night-muted);
}
#wf-main-4[data-ax-ds="mathflat"] .main-bank__link {
  box-shadow: var(--ax-mf-concept-shadow-dark);
}
#wf-main-4[data-ax-ds="mathflat"] .swiper-navigation .swiper-button {
  background-color: var(--ax-mf-surface-page);
}

/* Mito: retain the complete scene and its masks; harmonize the light stage and
   the existing blue story card, without recoloring the illustrated scenes. */
#wf-main-5[data-ax-ds="mathflat"] .mito-reference {
  --color-light-sky: var(--ax-mf-surface-subtle);
  --color-sky: color-mix(in srgb, var(--ax-mf-accent) 5%, var(--ax-mf-surface-page));
}
#wf-main-5[data-ax-ds="mathflat"] .mito-reference .bg-blue {
  background-image: linear-gradient(135deg, var(--ax-mf-accent-strong), var(--ax-mf-concept-night-raised));
}
#wf-main-5[data-ax-ds="mathflat"] .mito-reference .heading-bg-color__text::before {
  box-shadow: var(--ax-mf-concept-shadow-control);
}

/* SNS: keep the source orbit/merge motion and astronaut; refine the light. */
#wf-main-6[data-ax-ds="mathflat"] .main__sns__section.main__contents__wr {
  background-image: radial-gradient(ellipse at 80% 45%, var(--ax-mf-concept-halo-soft), transparent 65%);
}
#wf-main-6[data-ax-ds="mathflat"] .main__sns__card {
  box-shadow: var(--ax-mf-concept-shadow-card);
}
#wf-main-6[data-ax-ds="mathflat"] .main__sns__web {
  background-image: radial-gradient(ellipse at 0 0, var(--ax-mf-accent), var(--ax-mf-accent-strong) 65%, var(--ax-mf-concept-night-raised));
  box-shadow: var(--ax-mf-concept-shadow-control);
}

/* Review carousel and accordion: a clean reading stage with soft depth. */
#wf-main-6-2[data-ax-ds="mathflat"] .mathflat-home-reference {
  background-image: radial-gradient(ellipse at 50% 10%, var(--ax-mf-concept-halo-soft), transparent 55%);
}
#wf-main-6-2[data-ax-ds="mathflat"] .main-review__inner {
  background-color: var(--ax-mf-surface-page);
  box-shadow: var(--ax-mf-concept-shadow-card), inset 0 0 0 1px var(--ax-mf-concept-outline);
}
#wf-main-6-2[data-ax-ds="mathflat"] .main-review__category {
  background-image: linear-gradient(95deg, var(--ax-mf-accent-strong), var(--ax-mf-accent));
}
#wf-main-6-3[data-ax-ds="mathflat"] .mathflat-custom-reference {
  background-image: radial-gradient(ellipse at 75% 35%, var(--ax-mf-concept-halo-soft), transparent 65%);
}
#wf-main-6-3[data-ax-ds="mathflat"] .service-accordion__item {
  box-shadow: var(--ax-mf-concept-shadow-card);
}
#wf-main-6-3[data-ax-ds="mathflat"] .service-accordion--active .service-accordion__title {
  color: var(--ax-mf-accent-strong);
}

/* Posco: a second dark chapter; photography, autoplay and cqw stay untouched. */
#wf-main-6-4[data-ax-ds="mathflat"] .posco-bridge-reference,
#wf-main-6-4[data-ax-ds="mathflat"] .vision_bridge {
  background-color: var(--ax-mf-concept-night);
  background-image: radial-gradient(ellipse at 60% 100%, var(--ax-mf-concept-halo), transparent 65%), var(--ax-mf-concept-stars);
}
#wf-main-6-4[data-ax-ds="mathflat"] .vision_section_title {
  color: var(--ax-mf-concept-night-text);
}
#wf-main-6-4[data-ax-ds="mathflat"] .vision_section_card {
  box-shadow: var(--ax-mf-concept-shadow-dark);
}

/* Long-form review: matte reading surface, unchanged quote and portrait. */
#wf-main-reviews[data-ax-ds="mathflat"] .service-review {
  background-image: radial-gradient(ellipse at 0 30%, var(--ax-mf-concept-halo-soft), transparent 55%);
}

/* Process: sculpted light cards and a blue active state, original step engine. */
#wf-main-7[data-ax-ds="mathflat"] .process-section {
  background-image: radial-gradient(ellipse at 50% 100%, var(--ax-mf-concept-halo), transparent 65%);
}
#wf-main-7[data-ax-ds="mathflat"] .process-step {
  box-shadow: var(--ax-mf-concept-shadow-card);
}
#wf-main-7[data-ax-ds="mathflat"] .process-step.is-active {
  background-image: linear-gradient(150deg, var(--ax-mf-surface-page), color-mix(in srgb, var(--ax-mf-accent) 7%, white));
  box-shadow: var(--ax-mf-concept-shadow-control);
}

/* FAQ: preserve border widths and answer-grid animations. */
#wf-main-8[data-ax-ds="mathflat"] #main-faq {
  --surface: var(--ax-mf-surface-subtle);
  background-image: radial-gradient(ellipse at 50% 0, var(--ax-mf-concept-halo-soft), transparent 65%);
}
#wf-main-8[data-ax-ds="mathflat"] .WobloQuestions_card__yqxvm {
  box-shadow: 0 4px 18px rgba(16, 37, 85, .025);
}
#wf-main-8[data-ax-ds="mathflat"] .WobloQuestions_card__yqxvm[data-open="true"] {
  box-shadow: var(--ax-mf-concept-shadow-card);
}

/* CTA and footer: cosmic bookend. Keep the CTA photo, clip-path and physics. */
#wf-main-9[data-ax-ds="mathflat"] .RequestAccess_section__x0k9x {
  --gradient: linear-gradient(300deg, var(--ax-mf-concept-night), var(--ax-mf-accent-strong), var(--ax-mf-accent));
  background-color: var(--ax-mf-concept-night);
  background-image: radial-gradient(ellipse at 50% 0, var(--ax-mf-concept-halo), transparent 65%), var(--ax-mf-concept-stars);
}
#wf-main-9[data-ax-ds="mathflat"] .RequestAccess_buttonBase__9s8TJ {
  box-shadow: var(--ax-mf-concept-shadow-control);
}
#wf-main-10[data-ax-ds="mathflat"] .tesoro-footer-host .u-theme-dark {
  --_theme---background: var(--ax-mf-concept-night);
  --_theme---text: var(--ax-mf-concept-night-text);
  background-image: var(--ax-mf-concept-stars);
}

/* Forms: light porcelain against a blue halo; semantic feedback is inherited. */
#wf-contact-1[data-ax-ds="mathflat"] .contact-section {
  background-image: radial-gradient(ellipse at 5% 30%, var(--ax-mf-concept-halo), transparent 55%), radial-gradient(ellipse at 100% 100%, var(--ax-mf-concept-halo-soft), transparent 60%);
}
#wf-contact-1[data-ax-ds="mathflat"] #contact-form {
  box-shadow: var(--ax-mf-concept-shadow-card);
}
.lua-floating[data-ax-ds="mathflat"].quick-contact {
  box-shadow: var(--ax-mf-concept-shadow-card);
}
.lua-floating[data-ax-ds="mathflat"] .quick-contact-toggle {
  background-image: linear-gradient(120deg, var(--ax-mf-concept-night-raised), var(--ax-mf-accent-strong));
}
.lua-floating[data-ax-ds="mathflat"] .quick-contact-body {
  background-image: radial-gradient(ellipse at 100% 0, var(--ax-mf-concept-halo-soft), transparent 60%);
}
.mathflat-popup-host[data-ax-ds="mathflat"] .main-bank__popup-container-inner,
.reference-faq-modal[data-ax-ds="mathflat"] {
  box-shadow: var(--ax-mf-concept-shadow-dark);
}
.mathflat-popup-host[data-ax-ds="mathflat"] .main-bank__popup-close {
  box-shadow: var(--ax-mf-concept-shadow-control);
}

/* Match the existing hover guard. No new transitions or motion are added. */
@media (hover: hover) and (pointer: fine) {
  #wf-main-6-2[data-ax-ds="mathflat"] .main-review__slide:hover .main-review__inner {
    background-color: color-mix(in srgb, var(--ax-mf-accent) 7%, var(--ax-mf-surface-page));
  }
  #wf-main-6-3[data-ax-ds="mathflat"] .service-accordion__control > a:hover .service-accordion__title {
    color: var(--ax-mf-accent-strong);
  }
}