gahusb
9433a3664c
- 사이드바: AI상품/무료도구/외주의뢰 3그룹 구조로 개편 (ARIA 시맨틱) - 홈페이지: AI 상품 중심 재작성 (히어로+상품카드+무료도구+외주축소) - SEO: 메타데이터·OG태그·JSON-LD를 AI 상품 포지셔닝으로 변경 - 프롬프트 페이지: 프리미엄 상품 5개에 PortOne PaymentButton 연결 - AI 키트 페이지: 월 구독 CTA 2곳에 PaymentButton 연결 - 사주: 유료 전환 복원(4,900원) + PaymentButton 연결 - 코드 품질: 인라인 스타일→globals.css, emoji→SVG, 미사용 데이터 제거 - DB 마이그레이션 005: 전체 18개 상품 등록 SQL 추가 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
128 lines
2.7 KiB
CSS
128 lines
2.7 KiB
CSS
@import "tailwindcss";
|
|
|
|
/* ─── CookieRun Font (상업적 이용 가능 라이선스) ─── */
|
|
@font-face {
|
|
font-family: 'CookieRun';
|
|
src: url('/fonts/CookieRun-Regular.otf') format('opentype');
|
|
font-weight: 400;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'CookieRun';
|
|
src: url('/fonts/CookieRun-Bold.otf') format('opentype');
|
|
font-weight: 700;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'CookieRun';
|
|
src: url('/fonts/CookieRun-Black.otf') format('opentype');
|
|
font-weight: 900;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
|
|
:root {
|
|
--background: #f0f5ff;
|
|
--foreground: #04102b;
|
|
--primary: #1a56db;
|
|
--primary-hover: #1e4fc2;
|
|
--secondary: #4338ca;
|
|
--secondary-hover: #3730a3;
|
|
--sidebar-bg: #04102b;
|
|
--card-bg: #ffffff;
|
|
--border: #dbe8ff;
|
|
}
|
|
|
|
@theme inline {
|
|
--color-background: var(--background);
|
|
--color-foreground: var(--foreground);
|
|
--color-primary: var(--primary);
|
|
--color-secondary: var(--secondary);
|
|
--font-sans: 'CookieRun', -apple-system, system-ui, sans-serif;
|
|
--font-mono: 'Geist Mono', ui-monospace, monospace;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html {
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
body {
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
font-family: 'CookieRun', -apple-system, system-ui, sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
|
|
/* Dashboard layout */
|
|
.dashboard-layout {
|
|
display: flex;
|
|
height: 100dvh;
|
|
overflow: hidden;
|
|
background: var(--background);
|
|
}
|
|
|
|
.main-content {
|
|
flex: 1;
|
|
overflow-y: auto;
|
|
min-width: 0;
|
|
}
|
|
|
|
/* Gradient text utility */
|
|
.gradient-text {
|
|
background: linear-gradient(135deg, #2563eb, #7c3aed);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-clip: text;
|
|
}
|
|
|
|
/* Service card hover */
|
|
.service-card {
|
|
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
|
}
|
|
|
|
.service-card:hover {
|
|
transform: translateY(-4px);
|
|
box-shadow: 0 20px 40px rgba(37, 99, 235, 0.12);
|
|
}
|
|
|
|
/* Scroll reveal animations */
|
|
.reveal {
|
|
opacity: 0;
|
|
transform: translateY(1.5rem);
|
|
transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
|
|
transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
|
|
}
|
|
.reveal.is-visible {
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
.reveal-d1 { transition-delay: 80ms; }
|
|
.reveal-d2 { transition-delay: 160ms; }
|
|
.reveal-d3 { transition-delay: 240ms; }
|
|
.reveal-d4 { transition-delay: 320ms; }
|
|
.reveal-d5 { transition-delay: 400ms; }
|
|
|
|
/* Scrollbar styling */
|
|
::-webkit-scrollbar {
|
|
width: 6px;
|
|
}
|
|
::-webkit-scrollbar-track {
|
|
background: transparent;
|
|
}
|
|
::-webkit-scrollbar-thumb {
|
|
background: #cbd5e1;
|
|
border-radius: 3px;
|
|
}
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #94a3b8;
|
|
}
|