/* ============================================================
   PURECLEAN · theme/35 보조 스타일 (utility 우선, 예외 보조만)
   ============================================================ */

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }

/* 스크롤 시 헤더 그림자 */
#header.is-scrolled {
    box-shadow: 0 6px 24px -12px rgba(11, 20, 28, 0.18);
}

/* ------------------------------------------------------------
   아이콘 크기·정렬 고정 (Lucide → svg.lc 로 치환 / 밀림 방지)
   Lucide createIcons()는 <i class="lc">를 <svg class="lc">로 교체하며
   클래스를 보존하므로, 크기는 CSS에서 고정한다.
   ------------------------------------------------------------ */
.lc {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    vertical-align: middle;
    flex: none;
    stroke-width: 2;
}
.lc-sm  { width: 1rem;    height: 1rem; }
.lc-lg  { width: 1.5rem;  height: 1.5rem; }
.lc-xl  { width: 1.75rem; height: 1.75rem; }
.lc-2xl { width: 2rem;    height: 2rem; }

/* FontAwesome 정렬 보조 */
.fa-solid, .fa-brands, .fa-regular {
    line-height: 1;
    vertical-align: middle;
}

/* ------------------------------------------------------------
   AOS 보조 — CDN 미발동 대비 IntersectionObserver 폴백 클래스
   ------------------------------------------------------------ */
[data-aos] {
    opacity: 0;
    transition: opacity .6s ease, transform .6s ease;
    will-change: opacity, transform;
}
[data-aos="fade-up"]    { transform: translateY(28px); }
[data-aos="fade-right"] { transform: translateX(-28px); }
[data-aos="fade-left"]  { transform: translateX(28px); }
[data-aos="zoom-in"]    { transform: scale(.9); }
[data-aos].aos-animate {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    [data-aos] { opacity: 1 !important; transform: none !important; transition: none; }
}

/* ------------------------------------------------------------
   갤러리 탭 버튼
   ------------------------------------------------------------ */
.gtab {
    background: #fff;
    color: #475569;
    box-shadow: inset 0 0 0 1px #e2e8f0;
}
.gtab:hover { color: #0891b2; }
.gtab.is-active {
    background: #06b6d4;
    color: #fff;
    box-shadow: inset 0 0 0 1px #06b6d4;
}
.gitem.is-hidden { display: none; }

/* ------------------------------------------------------------
   FAQ 아코디언 (max-height 트랜지션)
   ------------------------------------------------------------ */
.faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s ease;
}
.faq-item.is-open .faq-a { max-height: 16rem; }
.faq-item.is-open .faq-ico { transform: rotate(180deg); }
.faq-item.is-open { box-shadow: 0 10px 30px -16px rgba(8, 145, 178, .35); }

/* ------------------------------------------------------------
   후기 슬라이더 도트
   ------------------------------------------------------------ */
.rev-dot {
    width: 8px; height: 8px;
    border-radius: 9999px;
    background: #cbd5e1;
    transition: all .3s ease;
    cursor: pointer;
}
.rev-dot.is-active {
    width: 24px;
    background: #06b6d4;
}

/* 작은 화면 글자 줄바꿈 안전 */
@media (max-width: 360px) {
    h1, h2, h3 { word-break: keep-all; }
}