@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@500;600;700;800&family=Noto+Sans+KR:wght@400;500;700;800&display=swap');
/* ============ DRTView 소개 v4 — cinematic minimal ============ */
#dv26 {
    --bg: #0A0C10;
    --ink: #EDF1F6;
    --dim: #93A0B0;
    --dim-strong: #C4CDD8;
    --line: rgba(255,255,255,0.09);
    --accent: #2E9BFF;
    --danger: #FF5252;

    background: var(--bg) !important;
    color: var(--ink) !important;
    font-family: 'Outfit', 'Noto Sans KR', sans-serif !important;
    line-height: 1.8 !important;
    word-break: keep-all !important;
    overflow-x: hidden !important;
    font-size: 16px !important;
}
#dv26 *, #dv26 *::before, #dv26 *::after { box-sizing: border-box !important; margin: 0; padding: 0; }
#dv26 img { max-width: 100%; }
#dv26 a { text-decoration: none !important; }

.dv-container { max-width: 1320px !important; margin: 0 auto !important; padding: 0 56px !important; }

.br-pc { display: inline !important; }
@media (max-width: 900px) { .br-pc { display: none !important; } }

/* reveal — 위젯 저장 시 script가 제거되므로 CSS 스크롤 타임라인만 사용, 미지원 브라우저는 항상 표시 */
@supports (animation-timeline: view()) {
    #dv26 .rv { animation: dvReveal .9s cubic-bezier(.22,.61,.36,1) both; animation-timeline: view(); animation-range: entry 0% entry 40%; }
    #dv26 .rv-d1 { animation-range: entry 8% entry 48%; }
    #dv26 .rv-d2 { animation-range: entry 16% entry 56%; }
}
@keyframes dvReveal { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }

/* ============ HERO ============ */
.dv-hero { position: relative; overflow: hidden; background: radial-gradient(ellipse 90% 60% at 50% -10%, #141B26 0%, var(--bg) 60%) !important; padding-top: 78px !important; }
.dv-hero-head { text-align: center; }
.dv-hero-head .dv-logo { height: 44px; margin-bottom: 28px !important; }
.dv-eyebrow { display: block !important; font-family: 'Outfit', sans-serif; color: var(--accent) !important; font-weight: 700 !important; font-size: 15px !important; letter-spacing: .3em !important; margin-bottom: 26px !important; text-transform: uppercase; }
.dv-h1 { font-size: clamp(42px, 5.4vw, 80px) !important; font-weight: 800 !important; line-height: 1.14 !important; letter-spacing: -0.03em !important; color: var(--ink) !important; margin-bottom: 28px !important; }
.dv-hero-sub { color: var(--dim-strong) !important; font-size: 19px !important; line-height: 1.7 !important; max-width: 680px; margin: 0 auto 28px auto !important; }
.dv-actions { display: flex; gap: 16px; flex-wrap: wrap; }
.dv-hero-head .dv-actions { justify-content: center; }
/* 히어로 스크린샷 — 크롭 없이 전체 표시 */
.dv-hero-visual { margin-top: 32px !important; display: flex !important; justify-content: center !important; width: 100% !important; padding: 0 24px !important; box-sizing: border-box; }
.dv-hero-visual img { width: auto !important; max-width: 100% !important; max-height: 46vh !important; height: auto !important; display: block !important; margin: 0 auto !important; border-radius: 14px; }
.dv-btn { display: inline-block !important; padding: 17px 46px !important; border-radius: 10px !important; font-weight: 800 !important; font-size: 16px !important; letter-spacing: .12em !important; cursor: pointer; transition: .25s ease; }
.dv-btn-solid { background: var(--accent) !important; color: #fff !important; }
.dv-btn-solid:hover { background: #55AFFF !important; transform: translateY(-2px); }
.dv-btn-ghost { border: 1px solid rgba(255,255,255,.34) !important; color: var(--ink) !important; background: rgba(10,12,16,.38) !important; letter-spacing: .04em !important; }
.dv-btn-ghost:hover { border-color: rgba(255,255,255,.7) !important; }

/* ============ FACT STRIP ============ */
.dv-strip { border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line) !important; background: rgba(255,255,255,.015) !important; }
.dv-strip-grid { display: grid !important; grid-template-columns: repeat(4, 1fr); }
.dv-strip-grid > div { padding: 36px 30px !important; border-left: 1px solid var(--line); }
.dv-strip-grid > div:first-child { border-left: 0; }
.dv-strip-grid b { display: block !important; font-family: 'Outfit', 'Noto Sans KR', sans-serif; font-size: 28px !important; font-weight: 700 !important; color: var(--ink) !important; line-height: 1.3 !important; margin-bottom: 4px !important; }
.dv-strip-grid span { color: var(--dim) !important; font-size: 14px !important; letter-spacing: .12em !important; }

/* ============ SECTIONS ============ */
#dv26 .dv-sec { padding: 148px 0 !important; border-top: 1px solid var(--line) !important; background: transparent !important; }
#dv26 .dv-sec:first-of-type { border-top: 0 !important; }
.dv-index { font-family: 'Outfit', sans-serif; color: var(--accent) !important; font-weight: 700 !important; letter-spacing: .3em !important; font-size: 13px !important; margin-bottom: 30px !important; text-transform: uppercase; }
.dv-title { font-size: clamp(34px, 3.8vw, 54px) !important; font-weight: 800 !important; line-height: 1.22 !important; letter-spacing: -0.02em !important; color: var(--ink) !important; margin-bottom: 30px !important; }
.dv-desc { color: var(--dim) !important; font-size: 20px !important; line-height: 1.9 !important; max-width: 840px; margin-bottom: 60px !important; }
.dv-desc strong { color: var(--dim-strong) !important; font-weight: 700 !important; }

/* screenshots */
.dv-shot { border-radius: 14px !important; overflow: hidden !important; border: 1px solid var(--line) !important; background: #000 !important; box-shadow: 0 28px 70px rgba(0,0,0,.5); }
.dv-shot img { width: 100% !important; display: block !important; }
.dv-shot.rv-d1 { max-width: 920px; margin-left: auto !important; margin-right: auto !important; }
.dv-shot.crop-l { aspect-ratio: 1.545; }
.dv-shot.crop-l img { width: 100% !important; height: 100% !important; object-fit: cover; object-position: 100% 50%; }
.dv-shot.crop-g { aspect-ratio: 2 / 1; }
.dv-shot.crop-g img { width: 100% !important; height: 100% !important; object-fit: cover; object-position: top; }
.dv-cap { margin-top: 16px !important; color: var(--dim) !important; font-size: 15px !important; line-height: 1.6 !important; }
.dv-cap::before { content: "—  "; color: var(--accent); font-weight: 700; }

.dv-pair { display: grid !important; grid-template-columns: 1fr 1fr; gap: 36px; margin-top: 44px !important; }
.dv-cols { display: grid !important; grid-template-columns: 1fr 1.12fr; gap: 72px; align-items: start; }
.dv-stack > div + div { margin-top: 36px !important; }

/* feature rows — 카드 대신 헤어라인 행 */
.dv-rows { border-top: 1px solid var(--line) !important; }
.dv-row { display: grid !important; grid-template-columns: 215px 1fr; gap: 28px; padding: 27px 0 !important; border-bottom: 1px solid var(--line) !important; }
.dv-row b { color: var(--ink) !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.6 !important; }
.dv-row p { color: var(--dim) !important; font-size: 17px !important; line-height: 1.8 !important; }

/* full-width band */
.dv-band { position: relative; overflow: hidden; background: #000 !important; }
.dv-band > img { width: 100% !important; height: 54vh; min-height: 360px; object-fit: cover; display: block !important; }
.dv-band-scrim { position: absolute; inset: 0; background: rgba(6,8,11,.64); }
.dv-band-txt { position: absolute; inset: 0; display: flex !important; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 28px !important; }
.dv-band-txt h2 { font-size: clamp(27px, 3vw, 43px) !important; font-weight: 800 !important; line-height: 1.4 !important; letter-spacing: -0.015em !important; color: var(--ink) !important; max-width: 900px; }
.dv-band-txt .dv-eyebrow { margin-bottom: 20px !important; }
.dv-band-txt .dv-note { margin-top: 26px !important; color: rgba(237,241,246,.72) !important; font-size: 17px !important; }

/* ecosystem columns */
.dv-eco { display: grid !important; grid-template-columns: repeat(3, 1fr); margin-top: 64px !important; }
.dv-eco > div { padding: 10px 40px 10px 30px !important; border-left: 1px solid var(--line); }
.dv-eco > div:first-child { border-left: 0; padding-left: 0 !important; }
.dv-eco h5 { font-family: 'Outfit', sans-serif; color: var(--accent) !important; font-size: 15px !important; font-weight: 700 !important; letter-spacing: .22em !important; margin-bottom: 16px !important; text-transform: uppercase; }
.dv-eco p { color: var(--dim) !important; font-size: 17px !important; line-height: 1.8 !important; }
/* languages */
.dv-flags { display: grid !important; grid-template-columns: repeat(3, 1fr); margin-top: 8px !important; }
.dv-flags > div { padding: 10px 40px 10px 30px !important; border-left: 1px solid var(--line); }
.dv-flags > div:first-child { border-left: 0; padding-left: 0 !important; }
.dv-flags img { width: 66px !important; height: 44px !important; object-fit: cover; border-radius: 5px !important; box-shadow: 0 8px 22px rgba(0,0,0,.45); margin-bottom: 20px !important; display: block !important; }
.dv-flags h4 { font-size: 24px !important; font-weight: 800 !important; color: var(--ink) !important; margin-bottom: 8px !important; }
.dv-flags p { color: var(--dim) !important; font-size: 17px !important; line-height: 1.75 !important; }

/* footer */
.dv-footer { padding: 100px 0 !important; background: #06080B !important; text-align: center; border-top: 1px solid var(--line) !important; }
.dv-footer p { color: #5A6472 !important; font-size: 16px !important; max-width: 760px; margin: 0 auto !important; line-height: 1.9 !important; }

/* ============ RESPONSIVE ============ */
@media (max-width: 1000px) {
    .dv-container { padding: 0 24px !important; }
    #dv26 .dv-sec { padding: 92px 0 !important; }
    .dv-hero { padding-top: 56px !important; }
    .dv-hero-head .dv-logo { height: 38px; margin-bottom: 36px !important; }
    .dv-hero-visual { margin-top: 32px !important; }
    .dv-hero-sub { font-size: 17px !important; }
    .dv-flags { grid-template-columns: 1fr; }
    .dv-flags > div { border-left: 0; border-top: 1px solid var(--line); padding: 26px 0 !important; }
    .dv-flags > div:first-child { border-top: 0; padding-top: 0 !important; }
    .dv-strip-grid { grid-template-columns: 1fr 1fr; }
    .dv-strip-grid > div { padding: 26px 22px !important; }
    .dv-strip-grid > div:nth-child(3) { border-left: 0; }
    .dv-strip-grid > div:nth-child(n+3) { border-top: 1px solid var(--line); }
    .dv-cols, .dv-pair { grid-template-columns: 1fr; gap: 36px; }
    .dv-row { grid-template-columns: 1fr; gap: 8px; padding: 22px 0 !important; }
    .dv-desc { font-size: 18px !important; margin-bottom: 44px !important; }
    .dv-eco { grid-template-columns: 1fr; margin-top: 44px !important; }
    .dv-eco > div { border-left: 0; border-top: 1px solid var(--line); padding: 26px 0 !important; }
    .dv-eco > div:first-child { border-top: 0; padding-top: 0 !important; }
    .dv-band > img { height: 60vh; }
    .dv-eyebrow { font-size: 12px !important; letter-spacing: .2em !important; }
    #dv-05 .dv-stack { order: 2; }
}

/* 아직 준비 중인 링크(Windows 버전): 누를 수 없게 */
.dv-btn.dv-btn-soon { opacity: .5; cursor: default; pointer-events: none; }