@charset "utf-8";

/* =========================================================
   건물119 레이아웃 커스텀 CSS  (scoped: .fx-*)
   - 레이아웃 개발 단계용. 테마 패키징 시 theme/<name>/css/custom.css 로 이동.
   ========================================================= */

/* 앵커(#) 이동 시 sticky 헤더에 가려지지 않도록 + 부드러운 스크롤 */
html { scroll-padding-top: 5rem; scroll-behavior: smooth; }

/* 버튼 입체감(depth) 제거 → 단독 버튼·join 그룹 모두 평면(이음선 없음) */
:root { --depth: 0; }

/* error 색 보정: daisyUI light 기본은 연한 빨강+어두운 글자라 가독성 낮음 → 진한 빨강+흰 글자 */
:root {
	--color-error: oklch(58% .22 25);
	--color-error-content: oklch(100% 0 0);
}

/* 떠다니는 3D 추상 도형 */
@keyframes fx-float {
    0%, 100% { transform: translateY(0) rotate(0deg) scale(1); }
    50%      { transform: translateY(-28px) rotate(10deg) scale(1.06); }
}
.fx-blob {
    position: absolute;
    border-radius: 9999px;
    filter: blur(38px);
    opacity: 0.6;
    pointer-events: none;
    z-index: 0;
    animation: fx-float 11s ease-in-out infinite;
}
.fx-blob-slow { animation-duration: 16s; }
.fx-blob-rev  { animation-direction: reverse; }

/* 스크롤 패럴랙스 (지원 브라우저 한정, 미지원 시 자연 무시) */
@supports (animation-timeline: scroll()) {
    @keyframes fx-rise      { to { transform: translateY(-180px); } }
    @keyframes fx-rise-soft { to { transform: translateY(-90px); } }
    .fx-parallax      { animation: fx-rise linear both;      animation-timeline: scroll(root); }
    .fx-parallax-soft { animation: fx-rise-soft linear both; animation-timeline: scroll(root); }
}

/* 글로시 글래스 표면 */
.fx-glass {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(16px) saturate(140%);
    -webkit-backdrop-filter: blur(16px) saturate(140%);
}
.fx-gloss { position: relative; overflow: hidden; }
.fx-gloss::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.55), rgba(255,255,255,0) 42%);
    pointer-events: none;
}

/* 그라데이션 헤드라인 */
.fx-headline {
    background: linear-gradient(92deg, #7c3aed 0%, #ec4899 45%, #f59e0b 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* 인터랙티브: hover lift */
.fx-lift { transition: transform .25s ease, box-shadow .25s ease; }
.fx-lift:hover { transform: translateY(-6px); box-shadow: 0 24px 50px -16px rgba(124,58,237,.45); }

/* 선택형 입력(btn) 활성 글로우 */
.fx-pick { transition: transform .2s ease, box-shadow .2s ease; }
.fx-pick:checked { transform: translateY(-2px); box-shadow: 0 12px 26px -8px rgba(236,72,153,.6); }

/* =========================================================
   모바일 풀스크린 오버레이 내비게이션
   (체크박스 상태 → 본문 Scale+Blur + 오버레이 + 항목 Stagger)
   ========================================================= */

/* 상태 보관용 체크박스 — 화면에서 숨김 */
.fx-nav-toggle { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

/* 본문: 메뉴가 열리면 뒤로 물러나는 Scale + Blur */
.fx-shell {
    transform-origin: center top;
    transition: transform .4s cubic-bezier(.4, 0, .2, 1), filter .4s ease, border-radius .4s ease;
}
.fx-nav-toggle:checked ~ .fx-shell {
    transform: scale(.95);
    filter: blur(2px);
    border-radius: 24px;
    overflow: hidden;
}

/* 풀스크린 오버레이 패널 */
.fx-navpanel {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: flex;
    flex-direction: column;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    background: linear-gradient(160deg, rgba(76,29,149,.55), rgba(190,24,93,.45));
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    transition: opacity .35s ease, visibility .35s ease;
}
.fx-nav-toggle:checked ~ .fx-navpanel { opacity: 1; visibility: visible; }

/* 바깥 클릭으로 닫히는 영역 */
.fx-navpanel-scrim { position: absolute; inset: 0; }

/* 메뉴 항목 Stagger 등장 */
.fx-navpanel li {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .4s ease, transform .4s ease;
}
.fx-nav-toggle:checked ~ .fx-navpanel li { opacity: 1; transform: translateY(0); }
.fx-nav-toggle:checked ~ .fx-navpanel li:nth-child(1) { transition-delay: .10s; }
.fx-nav-toggle:checked ~ .fx-navpanel li:nth-child(2) { transition-delay: .18s; }
.fx-nav-toggle:checked ~ .fx-navpanel li:nth-child(3) { transition-delay: .26s; }
.fx-nav-toggle:checked ~ .fx-navpanel li:nth-child(4) { transition-delay: .34s; }
.fx-nav-toggle:checked ~ .fx-navpanel li:nth-child(5) { transition-delay: .42s; }
.fx-nav-toggle:checked ~ .fx-navpanel li:nth-child(6) { transition-delay: .50s; }

/* 메뉴 열렸을 때 본문 스크롤 잠금 */
html:has(.fx-nav-toggle:checked) { overflow: hidden; }
