:root{
  --orange:#F07C00;
  --orange-dark:#d96e00;
  --green:#1e7a3c;
  --green-dark:#155c2c;
  --navy:#1d2b36;
  --gray-bg:#f5f6f7;
  --text:#2b2f33;
  --text-light:#6b7278;
  --line:#e4e7ea;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:'Pretendard','Noto Sans KR','Malgun Gothic',sans-serif;color:var(--text);line-height:1.65;}
img{max-width:100%;display:block;}
a{text-decoration:none;color:inherit;}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px;}

/* ---------- Header ---------- */
.topbar{background:var(--navy);color:#cfd6db;font-size:13px;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:34px;}
.topbar a{color:#cfd6db;}
.topbar a:hover{color:#fff;}
header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:100;}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;}
.logo{display:flex;align-items:center;gap:12px;}
.logo img{height:34px;}
.logo .divider{width:1px;height:26px;background:var(--line);}
.logo .brand{font-weight:800;font-size:17px;color:var(--orange);letter-spacing:-.2px;}
nav.gnb{display:flex;gap:24px;font-size:15px;font-weight:600;}
nav.gnb a{color:var(--text);padding:8px 2px;border-bottom:2px solid transparent;}
nav.gnb a:hover{color:var(--orange);}
nav.gnb a.active{color:var(--orange);border-bottom-color:var(--orange);}
.btn{display:inline-block;background:var(--orange);color:#fff;font-weight:700;padding:12px 28px;border-radius:4px;transition:.2s;}
.btn:hover{background:var(--orange-dark);}
.btn.ghost{background:transparent;border:1.5px solid #fff;}
.btn.ghost:hover{background:rgba(255,255,255,.15);}
.btn.sm{padding:9px 20px;font-size:14px;}

/* ---------- Hero (main) ---------- */
.hero{position:relative;color:#fff;overflow:hidden;background:var(--navy);}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;}
.hero .inner{position:relative;padding:110px 20px 120px;max-width:1180px;margin:0 auto;}
.hero .tag{display:inline-block;background:var(--orange);padding:6px 14px;border-radius:3px;font-size:13px;font-weight:700;letter-spacing:.5px;margin-bottom:18px;}
.hero h1{font-size:44px;line-height:1.25;font-weight:800;letter-spacing:-.5px;margin-bottom:16px;text-shadow:0 2px 12px rgba(0,0,0,.4);}
.hero p{font-size:18px;max-width:640px;color:#e8ecef;margin-bottom:32px;text-shadow:0 1px 8px rgba(0,0,0,.5);}
.hero .btns{display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- Sub hero ---------- */
.subhero{position:relative;color:#fff;background:var(--navy);overflow:hidden;}
.subhero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.4;}
.subhero .inner{position:relative;padding:70px 20px 66px;max-width:1180px;margin:0 auto;}
.subhero .crumb{font-size:13.5px;color:#c3ccd3;margin-bottom:12px;}
.subhero .crumb a{color:#c3ccd3;}
.subhero .crumb a:hover{color:#fff;}
.subhero h1{font-size:38px;font-weight:800;letter-spacing:-.5px;text-shadow:0 2px 10px rgba(0,0,0,.4);}
.subhero p{font-size:16.5px;color:#dfe5e9;margin-top:10px;max-width:720px;text-shadow:0 1px 6px rgba(0,0,0,.5);}

/* ---------- Sections ---------- */
section{padding:80px 0;}
section.alt{background:var(--gray-bg);}
.sec-label{color:var(--orange);font-weight:800;font-size:14px;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px;}
h2.sec-title{font-size:32px;font-weight:800;letter-spacing:-.5px;line-height:1.3;margin-bottom:18px;}
h3.sub-title{font-size:22px;font-weight:800;margin:46px 0 14px;letter-spacing:-.3px;}
h3.sub-title:first-of-type{margin-top:0;}
.sec-desc{font-size:16.5px;color:var(--text-light);max-width:820px;margin-bottom:44px;}
.lead{font-size:16px;color:var(--text-light);max-width:860px;}

/* intro / two-col */
.intro-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}
.intro-grid img{border-radius:8px;box-shadow:0 12px 32px rgba(0,0,0,.12);}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.two-col img{border-radius:8px;box-shadow:0 10px 28px rgba(0,0,0,.12);}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px;}
.stat{background:#fff;border:1px solid var(--line);border-radius:8px;padding:20px 18px;text-align:center;}
.stat b{display:block;font-size:26px;color:var(--orange);font-weight:800;}
.stat span{font-size:13.5px;color:var(--text-light);}

/* feature cards */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:10px;}
.feat{background:#fff;border:1px solid var(--line);border-radius:8px;padding:28px 24px;}
.feat .num{font-size:13px;font-weight:800;color:var(--orange);letter-spacing:1px;margin-bottom:10px;}
.feat h4{font-size:18px;margin-bottom:8px;font-weight:700;}
.feat p{font-size:14.5px;color:var(--text-light);}

/* spec table */
.table-scroll{overflow-x:auto;}
.spec-table{width:100%;border-collapse:collapse;background:#fff;font-size:14.5px;margin-top:14px;box-shadow:0 4px 18px rgba(0,0,0,.06);border-radius:8px;overflow:hidden;}
.spec-table th,.spec-table td{padding:12px 16px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap;}
.spec-table thead th{background:var(--navy);color:#fff;font-weight:700;}
.spec-table tbody th{background:#fafbfc;font-weight:600;}
.spec-table tr:hover td{background:#fff8f1;}
.spec-table td.hl{color:var(--orange);font-weight:700;}
.spec-note{font-size:13px;color:var(--text-light);margin-top:10px;}

/* product cards */
.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.prod-grid.two{grid-template-columns:repeat(2,1fr);}
.prod{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;transition:.25s;}
.prod:hover{transform:translateY(-6px);box-shadow:0 16px 32px rgba(0,0,0,.12);}
.prod .thumb{height:210px;overflow:hidden;background:#eef1f3;display:flex;align-items:center;justify-content:center;}
.prod .thumb img{width:100%;height:100%;object-fit:cover;}
.prod .body{padding:24px;flex:1;display:flex;flex-direction:column;}
.prod .cat{font-size:12px;font-weight:800;color:var(--green);letter-spacing:1px;margin-bottom:6px;}
.prod h4{font-size:19px;font-weight:800;margin-bottom:10px;letter-spacing:-.3px;}
.prod p{font-size:14.5px;color:var(--text-light);flex:1;}
.prod ul{margin:14px 0 0;padding:0;list-style:none;font-size:13.5px;color:var(--text);}
.prod ul li{padding:4px 0 4px 18px;position:relative;}
.prod ul li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:8px;background:var(--orange);border-radius:2px;}
.prod .more{margin-top:16px;font-weight:700;color:var(--orange);font-size:14px;}
.prod .more:hover{color:var(--orange-dark);}

/* check list */
ul.checks{list-style:none;margin:18px 0 0;font-size:15px;}
ul.checks li{padding:6px 0 6px 30px;position:relative;}
ul.checks li::before{content:"✓";position:absolute;left:2px;top:6px;color:var(--orange);font-weight:800;}
ul.checks li b{font-weight:700;}

/* video */
.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;}
.video-box{position:relative;width:100%;aspect-ratio:16/9;border-radius:10px;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.15);background:#000;}
.video-box iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.video-cap{font-size:14px;color:var(--text-light);margin-top:10px;}

/* gallery */
.gal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.gal{position:relative;border-radius:8px;overflow:hidden;height:230px;}
.gal img{width:100%;height:100%;object-fit:cover;transition:.35s;}
.gal:hover img{transform:scale(1.06);}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(0,0,0,.75));color:#fff;font-size:13.5px;padding:26px 14px 12px;}

/* page nav (prev/next) */
.page-nav{display:flex;justify-content:space-between;gap:16px;margin-top:60px;flex-wrap:wrap;}
.page-nav a{flex:1;min-width:240px;border:1px solid var(--line);border-radius:8px;padding:18px 22px;background:#fff;transition:.2s;}
.page-nav a:hover{border-color:var(--orange);box-shadow:0 6px 18px rgba(0,0,0,.08);}
.page-nav a span{display:block;font-size:12.5px;color:var(--text-light);margin-bottom:4px;}
.page-nav a b{font-size:16px;font-weight:700;}
.page-nav a.next{text-align:right;}

/* CTA */
.cta{background:linear-gradient(120deg,var(--green-dark),var(--green));color:#fff;text-align:center;padding:70px 20px;}
.cta h2{font-size:30px;font-weight:800;margin-bottom:14px;letter-spacing:-.5px;}
.cta p{font-size:16.5px;color:#dff0e4;margin-bottom:28px;}

/* footer */
footer{background:var(--navy);color:#aeb7bd;font-size:13.5px;padding:46px 0 40px;}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;margin-bottom:28px;}
footer h5{color:#fff;font-size:15px;margin-bottom:12px;}
footer li{list-style:none;padding:3px 0;}
footer a:hover{color:#fff;}
footer .copy{border-top:1px solid #2e3d49;padding-top:20px;font-size:12.5px;color:#7d8790;}

@media(max-width:900px){
  nav.gnb{display:none;}
  .hero h1{font-size:32px;}
  .subhero h1{font-size:28px;}
  .intro-grid,.feat-grid,.prod-grid,.prod-grid.two,.gal-grid,.two-col,.video-grid,footer .cols{grid-template-columns:1fr;}
  .stat-row{grid-template-columns:repeat(3,1fr);}
  section{padding:56px 0;}
}
