/* Variables & Design System */
:root {
--bg-main: #0f1419;
--bg-card: #16202b;
--bg-card-hover: #1c2836;
--accent-cyan: #00e5ff;
--accent-cyan-dim: rgba(0, 229, 255, 0.15);
--accent-gold: #c19a6b;
--text-white: #ffffff;
--text-gray: #a0aab5;
--border-color: rgba(255, 255, 255, 0.1);
--border-glow: rgba(0, 229, 255, 0.3);
--font-main: 'Pretendard', sans-serif;
--transition: 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

/* Reset */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
}
body {
font-family: var(--font-main);
background-color: var(--bg-main);
color: var(--text-white);
line-height: 1.6;
overflow-x: hidden;
word-break: keep-all;
}
a {
text-decoration: none;
color: inherit;
transition: all var(--transition);
}
ul {
list-style: none;
}
img {
max-width: 100%;
height: auto;
display: block;
}
::selection{background:#00e5ff;color:#fff;}
::-moz-selection{background:#00e5ff;color:#fff;}

/* Animations */
.fade-in {
opacity: 0;
transform: translateY(30px);
transition:
  opacity 0.8s ease-out,
  transform 0.8s ease-out;
}
.fade-in.is-visible {
opacity: 1;
transform: translateY(0);
}

/* Layout */
.container {
max-width: 1280px;
margin: 0 auto;
padding: 0 3%;
}
.section-padding {
padding: 120px 0;
}
.text-center {
text-align: center;
}

/* Typography */
.sec-label {
color: var(--accent-cyan);
font-weight: 700;
font-size: 1rem;
letter-spacing: 2px;
margin-bottom: 12px;
display: block;
text-transform: uppercase;
}
.sec-title {
font-size: 2.8rem;
font-weight: 800;
margin-bottom: 1.5rem;
color: var(--text-white);
line-height: 1.3;
letter-spacing: -1px;
}
.sec-subtitle {
font-size: 1.2rem;
color: var(--text-gray);
margin-bottom: 4rem;
max-width: 800px;
margin-left: auto;
margin-right: auto;
}

/* Buttons */
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 16px 32px;
border-radius: 4px;
font-weight: 700;
font-size: 1.05rem;
cursor: pointer;
transition: all var(--transition);
border: 1px solid transparent;
}
.btn-cyan {
background: var(--accent-cyan);
color: var(--bg-main);
box-shadow: 0 0 20px rgba(0, 229, 255, 0.2);
}
.btn-cyan:hover {
background: #00cce6;
box-shadow: 0 0 30px rgba(0, 229, 255, 0.4);
}
.btn-outline-cyan {
border-color: var(--accent-cyan);
color: var(--accent-cyan);
background: transparent;
}
.btn-outline-cyan:hover {
background: var(--accent-cyan-dim);
}
.btn-outline-white {
border-color: var(--border-color);
color: var(--text-white);
background: transparent;
}
.btn-outline-white:hover {
background: rgba(255, 255, 255, 0.1);
border-color: var(--text-white);
}
.btn-gold {
background: var(--accent-gold);
color: #fff;
}
.btn-gold:hover {
background: #a68155;
}
.btn-full {
width: 100%;
}

/* Cards */
.glass-card {background: rgba(22, 32, 43, 0.6);backdrop-filter: blur(2px);-webkit-backdrop-filter: blur(10px);border: 1px solid var(--border-color);border-radius: 12px;padding: 40px 30px;transition: all var(--transition);}
.glass-card:hover {border-color: var(--border-glow);transform: translateY(-5px);box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);}


@media (max-width: 1024px) {
.glass-card-last {grid-column:1 / -1;}
}

/* Header */
.header {position: fixed;top: 0;left: 0;width: 100%;height: 85px;background: rgba(15, 20, 25, 0.85);backdrop-filter: blur(15px);-webkit-backdrop-filter: blur(15px);
					border-bottom: 1px solid var(--border-color);z-index: 1000;display: flex;align-items: center;transition: all 0.3s;}
.header-inner {width: 100%;max-width: 1600px;margin: 0 auto;padding: 0 4%;display: flex;justify-content: space-between;align-items: center;}
.logo {display: flex;align-items: center;}
.logo img {height: 40px;width: auto;filter: brightness(0) invert(1);}
.nav-links {display: flex;gap: 2rem;align-items: center;}
.nav-links a {font-weight: 600;font-size: 0.95rem;color: var(--text-white);}
.nav-links a:hover {color: var(--accent-cyan);}
.nav-links .accent-link {color: var(--accent-gold);}
.header-right {display: flex;gap: 1rem;align-items: center;}
.header-btn {padding: 10px 24px;border-radius: 4px;font-weight: 700;font-size: 0.95rem;transition: all 0.2s;border: 1px solid var(--border-color);}
.btn-nav-outline {color: var(--text-white);border-color: var(--border-color);}
.btn-nav-outline:hover {border-color: var(--text-white);background: rgba(255, 255, 255, 0.1);}
.btn-nav-solid {background: var(--accent-cyan);color: var(--bg-main);border-color: var(--accent-cyan);box-shadow: 0 0 10px rgba(0, 229, 255, 0.2);}
.btn-nav-solid:hover {background: #00cce6;box-shadow: 0 0 20px rgba(0, 229, 255, 0.4);}
.hamburger {display: none;font-size: 1.8rem;background: none;border: none;cursor: pointer;color: var(--text-white);}

/* Hero */
.hero {
position: relative;
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding-top: 85px;
overflow: hidden;
}
.hero-bg {position: absolute;top:85px;left: 0;width: 100%;height: 100%;background: url('/img/dh_bg_space.png') no-repeat center;background-size:cover;z-index: 1;}
.hero-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, rgba(15, 20, 25, 0.7) 0%, rgba(15, 20, 25, 0.4) 100%);
z-index: 2;
}
.hero-content {
position: relative;
z-index: 3;
text-align: center;
color: var(--text-white);
max-width: 900px;
padding: 0 5%;
}
.hero-label {
display: inline-block;
padding: 6px 16px;
background: rgba(0, 229, 255, 0.1);
border: 1px solid rgba(0, 229, 255, 0.3);
color: var(--accent-cyan);
border-radius: 30px;
font-size: 0.9rem;
font-weight: 700;
letter-spacing: 2px;
margin-bottom: 20px;
backdrop-filter: blur(5px);
}
.hero-title {
font-size: 3.5rem;
font-weight: 800;
margin-bottom: 20px;
line-height: 1.2;
letter-spacing: -1px;
}
.hero-desc {
font-size: 1.25rem;
color: rgba(255, 255, 255, 0.9);
margin-bottom: 15px;
}
.hero-subdesc {
font-size: 1rem;
color: var(--text-gray);
margin-bottom: 40px;
}
.hero-badges {
display: flex;
justify-content: center;
gap: 15px;
flex-wrap: wrap;
margin-bottom: 40px;
}
.hero-badge-item {
padding: 8px 20px;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 4px;
font-size: 0.9rem;
font-weight: 600;
background: rgba(255, 255, 255, 0.05);
}
.hero-actions {
display: flex;
justify-content: center;
gap: 15px;
flex-wrap: wrap;
}

/* Grids */
.grid-2 {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
}
.grid-3 {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}
.grid-4 {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 30px;
}
.grid-3_02 {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 15px;}

/* Models */
.model-card {background: var(--bg-card);border: 1px solid var(--border-color);border-radius: 12px;overflow: hidden;transition: all var(--transition);}
.model-card:hover {border-color: var(--border-glow);transform: translateY(-5px);box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);}

.model-img {aspect-ratio: 16 / 10;overflow: hidden;position: relative;}
.model-img img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.5s;}

.model-card:hover .model-img img {transform: scale(1.05);}
.model-content {padding: 20px;}

.model-series {color: var(--accent-cyan);font-size: 1rem;font-weight: 700;letter-spacing: 1px;margin-bottom: 5px;}
.model-title {font-size: 1.4rem;font-weight: 800;margin-bottom: 15px;color: var(--text-white);}

.model-desc {font-size: 15px;color: var(--text-gray);margin-bottom: 20px;min-height: 45px;}
.model-specs {margin-bottom: 25px;padding-top: 20px;border-top: 1px solid rgba(255, 255, 255, 0.05);}

.spec-item {display: flex;justify-content: space-between;margin-bottom: 8px;font-size: 1rem;}
.spec-label {color: var(--text-gray);}
.spec-value {font-weight: 600;color: var(--text-white);}

@media (max-width: 768px) {
.model-series {font-size:1rem;}
.model-title {font-size:1.4rem}
.model-desc {font-size:14px;}
.spec-item {font-size:1rem;}
}

/* Process */
.process-wrapper {
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 20px;
position: relative;
margin-top: 60px;
}
.process-line {
position: absolute;
top: 25px;
left: 5%;
right: 5%;
height: 2px;
background: rgba(255, 255, 255, 0.1);
z-index: 1;
}
.process-step {
position: relative;
z-index: 2;
text-align: center;
}
.process-number {
width: 50px;
height: 50px;
background: var(--bg-main);
border: 2px solid var(--accent-cyan);
color: var(--accent-cyan);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 800;
font-size: 1.1rem;
margin: 0 auto 20px;
box-shadow: 0 0 15px rgba(0, 229, 255, 0.2);
}
.process-step h4 {
font-size: 1.05rem;
color: var(--text-white);
word-break: keep-all;
}

/* Gallery */
.gallery-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
}
.gallery-item {
aspect-ratio: 4 / 3;
border-radius: 8px;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.05);
}
.gallery-item img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s;
}
.gallery-item:hover img {
transform: scale(1.05);
}
.video-wrap {
margin-top: 30px;
}
.video-wrap iframe {
width: 100%;
aspect-ratio: 16 / 9;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
}

/* CTA Banner */
.cta-banner {
background: linear-gradient(135deg, rgba(0, 229, 255, 0.1) 0%, rgba(15, 20, 25, 1) 100%);
border-top: 1px solid rgba(0, 229, 255, 0.2);
border-bottom: 1px solid rgba(0, 229, 255, 0.2);
padding: 100px 0;
text-align: center;
}

/* Contact */
.space_contact {
border-top: 1px solid rgba(0, 229, 255, 0.2);
border-bottom: 1px solid rgba(0, 229, 255, 0.2);}
.contact-box {
background: var(--bg-card);
padding: 50px;
border-radius: 12px;
border: 1px solid var(--border-color);
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
display: grid;
grid-template-columns: 1.5fr 1fr;
gap: 50px;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
font-weight: 600;
margin-bottom: 8px;
font-size: 0.95rem;
color: var(--text-gray);
}
.form-control {
width: 100%;
padding: 14px;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 4px;
font-family: inherit;
font-size: 1rem;
color: var(--text-white);
transition: all 0.3s;
}
.form-control:focus {
outline: none;
border-color: var(--accent-cyan);
background: rgba(255, 255, 255, 0.05);
}
textarea.form-control {
height: 120px;
resize: vertical;
}
.quick-contact {
display: flex;
flex-direction: column;
gap: 15px;
}
.qc-card {
padding: 25px;
border: 1px solid rgba(255, 255, 255, 0.05);
border-radius: 8px;
background: rgba(0, 0, 0, 0.2);
transition: all 0.3s;
}
.qc-card:hover {
border-color: var(--border-glow);
background: rgba(0, 229, 255, 0.05);
}
.qc-title {
font-size: 1rem;
font-weight: 700;
color: var(--text-gray);
margin-bottom: 5px;
}
.qc-val {
font-size: 1.3rem;
font-weight: 800;
color: var(--accent-cyan);
}

/* Responsive */
@media (max-width: 1024px) {
.header-right {display:none}
.grid-3, .grid-4 {grid-template-columns: repeat(2, 1fr);}
.process-wrapper {grid-template-columns: repeat(3, 1fr);}
.process-line {display: none;}
.process-step {margin-bottom: 30px;}
.contact-box {grid-template-columns: 1fr;}
.footer-grid {grid-template-columns: 1fr;}
}
@media (max-width: 768px) {
.nav-links, .header-right {display: none;}
.hamburger {display: block;}
.hero-title {font-size: 2.2rem;}
.hero-desc {font-size: 1.1rem;}
.grid-2, .grid-3, .grid-4 {grid-template-columns: 1fr;}
.process-wrapper {grid-template-columns: repeat(2, 1fr);}
.gallery-grid {grid-template-columns: 1fr;}
	
	.sec-title {font-size:2rem;}
	.sec-subtitle {font-size:1rem;word-break: keep-all;}
	.section-padding {padding:100px 10px;}
}

.sec_stats {width:100%;background:linear-gradient(135deg, rgba(15, 20, 25, 0.8) 0%, rgba(15, 20, 25, 0.4) 100%),url("/img/dh_bg04.jpg") center/cover;border:1px solid rgba(255,255,255,0.15);border-left:0;border-right:0;}

.space-op-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 26px;}
.space-op-card {position: relative;min-height: 360px;border-radius: 20px;overflow: hidden;background: #121a22;border: 1px solid rgba(255,255,255,.13);box-shadow: 0 24px 70px rgba(0,0,0,.36);transition: .45s ease;}
.space-op-card::before {content: "";position: absolute;left: 0;top: 0;bottom: 0;width: 3px;z-index: 3;opacity: .95;}
.space-op-card.gold::before {background: #c9a86b;}
.space-op-card.cyan::before {background: #00e5ff;}

.space-op-card:hover {transform: translateY(-10px);border-color: rgba(255,255,255,.28);box-shadow: 0 34px 90px rgba(0,0,0,.52);}
.space-op-bg {position: absolute;inset: 0;z-index: 0;}
.space-op-bg img {width: 100%;height: 100%;object-fit: cover;transition: .7s ease;*filter: saturate(.9) brightness(.62);}
.space-op-card:hover .space-op-bg img {transform: scale(1.08);filter: saturate(1.05) brightness(.76);}
.space-op-bg::after {content: "";position: absolute;inset: 0;background:linear-gradient(90deg, rgba(8,13,18,.9) 0%, rgba(8,13,18,.6) 42%, rgba(8,13,18,.2) 100%),linear-gradient(180deg, rgba(8,13,18,.1) 0%, rgba(8,13,18,.78) 100%);}
.space-op-content {position: relative;z-index: 2;height: 100%;padding: 36px 38px;display: flex;flex-direction: column;}

.space-op-top {display: flex;align-items: center;gap: 26px;margin-bottom: 28px;}
.space-op-top strong {font-size: 40px;line-height: 1;font-weight: 900;letter-spacing: -.04em;}

.space-op-card.gold .space-op-top strong, .space-op-card.gold .space-op-icon, .space-op-card.gold li::before {color: #c9a86b;}
.space-op-card.cyan .space-op-top strong, .space-op-card.cyan .space-op-icon, .space-op-card.cyan li::before {color: #00e5ff;}

.space-op-icon {width: 62px;height: 62px;border-radius: 50%;border: 1px solid currentColor;display: flex;align-items: center;justify-content: center;background: rgba(0,0,0,.18);}
.space-op-icon i {font-size: 25px;}
.space-op-card h3 {color: #fff;font-size: 28px;font-weight: 900;line-height: 1.32;letter-spacing: -.04em;margin-bottom: 18px;word-break: keep-all;}
.space-op-card p {color: rgba(255,255,255,.68);font-size: 17px;line-height: 1.75;margin-bottom: 24px;word-break: keep-all;}
.space-op-card ul {list-style: none;padding: 0;margin: auto 0 0;}
.space-op-card li {color: rgba(255,255,255,.82);font-size: 16px;line-height: 1.8;}
.space-op-card li::before {content: "✓";margin-right: 10px;font-weight: 900;}

.space-op-note {margin: 34px 0 0;text-align: center;color: rgba(255,255,255,.62);font-size: 17px;}
.space-op-note i {margin-right: 8px;color: rgba(255,255,255,.72);}

/* tablet */
@media (max-width: 1180px) {
  .space-op-grid {grid-template-columns: repeat(2, 1fr);}
  .space-op-card {min-height: 340px;}
}

/* mobile */
@media (max-width: 720px) {
  .space-op-section {padding: 86px 0;}
  .space-op-head {margin-bottom: 38px;}
  .space-op-head p {font-size: 17px;}
  .space-op-grid {grid-template-columns: 1fr;gap: 18px;}
  .space-op-card {min-height: 330px;border-radius: 18px;}
  .space-op-content {padding: 30px 26px;}
  .space-op-top {gap: 18px;margin-bottom: 22px;}
  .space-op-top strong {font-size: 34px;}
  .space-op-icon {width: 54px;height: 54px;}
  .space-op-icon i {font-size: 22px;}
  .space-op-card h3 {font-size: 24px;}
  .space-op-card p {font-size: 15px;}
  .space-op-card li {font-size: 14px;}
  .space-op-note {font-size: 14px;line-height: 1.6;}
}

/**/
.sm-process-grid {position: relative;display: grid;grid-template-columns: repeat(6, 1fr);gap: 22px;margin-bottom:20px;}
.sm-process-grid::before {content: "";position: absolute;left: 8%;right: 8%;top: 0;height: 2px;background: linear-gradient(90deg,transparent,rgba(0,229,255,.75),transparent);box-shadow: 0 0 18px rgba(0,229,255,.5);z-index: 0;}
.sm-process-card {position: relative;min-height: 310px;padding:60px 28px 25px;border-radius: 18px;border: 1px solid rgba(255,255,255,.13);background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));box-shadow: 0 22px 60px rgba(0,0,0,.32);text-align: center;transition: .35s ease;overflow: visible;}
.sm-process-card:hover {transform: translateY(-8px);border-color: rgba(0,229,255,.5);box-shadow:0 30px 80px rgba(0,0,0,.48),0 0 26px rgba(0,229,255,.12);}

.sm-process-num {position: absolute;left: 50%;top: -35px;transform: translateX(-50%);width: 78px;height: 78px;border-radius: 50%;border: 1px solid #00e5ff;background: #081018;color: #00e5ff;display: flex;align-items: center;justify-content: center;font-size: 26px;font-weight: 900;box-shadow:0 0 0 8px rgba(8,15,20,1),0 0 26px rgba(0,229,255,.32);z-index: 3;}
.sm-process-icon {width: 66px;height: 66px;margin: 0 auto 25px;color: #00e5ff;display: flex;align-items: center;justify-content: center;}
.sm-process-icon i {font-size: 30px;}

.sm-process-card h3 {color: #fff;font-size: 24px;font-weight: 900;letter-spacing: -.04em;margin-bottom: 18px;}
.sm-process-card p {color: rgba(255,255,255,.68);font-size: 16px;line-height: 1.75;word-break: keep-all;}

.sm-process-values {display: grid;grid-template-columns: repeat(4, 1fr);padding: 20px 0px;border-radius: 18px;border: 1px solid rgba(255,255,255,.13);background: rgba(255,255,255,.035);backdrop-filter: blur(14px);box-shadow: 0 24px 70px rgba(0,0,0,.32);}
.sm-process-value {display: flex;align-items: center;gap: 24px;padding:0px 20px;}
.sm-process-value:not(:last-child) {border-right: 1px solid rgba(255,255,255,.14);}
.sm-process-value i {color: #00e5ff;font-size: 40px;flex-shrink: 0;filter: drop-shadow(0 0 14px rgba(0,229,255,.25));}
.sm-process-value h4 {color: #fff;font-size: 20px;font-weight: 900;margin-bottom: 8px;}
.sm-process-value p {color: rgba(255,255,255,.62);font-size: 13px;line-height: 1.6;word-break: keep-all;}

/* tablet */
@media (max-width: 1280px) {
  .sm-process-grid {grid-template-columns: repeat(3, 1fr);row-gap: 66px;}
  .sm-process-grid::before {display: none;}
  .sm-process-values {grid-template-columns: repeat(2, 1fr);}
  .sm-process-value:nth-child(2) {border-right: 0;}
  .sm-process-value:nth-child(1), .sm-process-value:nth-child(2) {border-bottom: 1px solid rgba(255,255,255,.14);padding-bottom: 28px;}
  .sm-process-value:nth-child(3), .sm-process-value:nth-child(4) {padding-top: 28px;}
}

/* mobile */
@media (max-width: 760px) {
  .sm-process-section {padding: 92px 0;}
  .sm-process-head {margin-bottom: 64px;}
  .sm-process-head span {font-size: 13px;}
  .sm-process-head p {font-size: 16px;}
  .sm-process-grid {grid-template-columns: 1fr;gap: 56px;margin-bottom: 54px;}
  .sm-process-card {min-height: auto;padding: 64px 26px 30px;}
  .sm-process-num {width: 68px;height: 68px;top: -32px;font-size: 22px;}
  .sm-process-icon {width: 54px;height: 54px;margin-bottom: 20px;}
  .sm-process-icon i {font-size: 34px;}
  .sm-process-card h3 {font-size: 22px;}
  .sm-process-card p {font-size: 15px;}
  .sm-process-values {grid-template-columns: 1fr;padding: 24px;}
  .sm-process-value {padding: 22px 0;border-right: 0 !important;}
  .sm-process-value:not(:last-child) {border-bottom: 1px solid rgba(255,255,255,.14);}
  .sm-process-value i {font-size: 38px;}
  .sm-process-value h4 {font-size: 20px;}
  .sm-process-value p {font-size: 14px;}
}



/* =========================
   PC Floating
========================= */

.dt-floating-contact {background: linear-gradient(180deg,#18222edb,#101821de);border:1px solid rgba(0,229,255,.28);}
.dt-float-apply {background: linear-gradient(135deg,#00d9ff,#00b9ff);color: #fff;}
.dt-float-apply:hover {background: #26e5ff;}

/* =========================
   Mobile Bottom Bar
========================= */

@media (max-width: 768px) {
  body {padding-bottom: 72px;}
  .dt-floating-contact {border-top: 1px solid rgba(255,255,255,.14);background: linear-gradient(90deg, #18222e, #101821);}
  .dt-float-apply {background: linear-gradient(135deg,#00d9ff,#00b9ff);color: #fff;}
  .dt-float-apply:hover {background: #26e5ff;}
}