@charset "utf-8";
/*
  LNP 홈 전용 CSS
  히어로는 Swiper(이미 bc_css.php/bc_js.php에 로드됨) 재사용.
  이미지 없어서 색상 placeholder(.lnp-hero-ph) 처리 — 실제 사진 오면 <img>로 교체.
*/

/* ===== 히어로 ===== */
.lnp-hero{
	position:relative;
	width:100%;
	height:520px;
	margin-top:0;
	overflow:hidden;
	background:var(--lnp-navy-dark);
}
.lnp-hero .swiper-container,
.lnp-hero .swiper-wrapper,
.lnp-hero .swiper-slide{ width:100%; height:100%; }

.lnp-hero-slide{ position:relative; width:100%; height:100%; }
.lnp-hero-ph{
	position:absolute; inset:0;
	background:linear-gradient(135deg, var(--lnp-navy) 0%, var(--lnp-navy-dark) 100%);
}
.lnp-hero-ph--2{ background:linear-gradient(135deg,#1b3f73,#0d2242); }
.lnp-hero-ph--3{ background:linear-gradient(135deg,#0f2b52,#14315c); }
.lnp-hero-slide img{
	position:absolute; inset:0;
	width:100%; height:100%;
	object-fit:cover;
}
.lnp-hero-dim{
	position:absolute; inset:0;
	background:linear-gradient(90deg, rgba(8,18,40,.78) 0%, rgba(8,18,40,.5) 45%, rgba(8,18,40,.15) 100%);
}

.lnp-hero-copy{
	position:absolute;
	inset:0;
	z-index:5;
	display:flex; align-items:center;
	padding:0 20px;
	pointer-events:none;
}
.lnp-hero-copy-in{
	max-width:var(--lnp-container-max);
	width:100%;
	margin:0 auto;
	pointer-events:auto;
}
.lnp-hero-label{
	display:inline-block;
	font-size:14px;
	font-weight:600;
	letter-spacing:0.02em;
	color:#cfe0ff;
	background:rgba(255,255,255,0.12);
	border:1px solid rgba(255,255,255,0.3);
	border-radius:20px;
	padding:7px 16px;
	margin-bottom:20px;
}
.lnp-hero-title{
	color:#fff;
	font-size:clamp(24px, 6.6vw, 34px);
	font-weight:800;
	line-height:1.3;
	margin:0 0 12px;
	letter-spacing:-0.5px;
	word-break:keep-all;
	text-shadow:0 2px 16px rgba(0,0,0,.35);
}
.lnp-hero-copy{ --lnp-hero-accent:#8fb0e8; --lnp-hero-sub:rgba(255,255,255,.85); --lnp-hero-key:#2f6db0; }
.lnp-hero-em{ color:var(--lnp-hero-accent); }
.lnp-hero-slogan{
	margin:0 0 24px;
	font-size:clamp(16px, 4.4vw, 24px);
	font-weight:500;
	line-height:1.3;
	letter-spacing:.02em;
	color:var(--lnp-hero-sub);
}
.lnp-hero-slogan::before{
	content:"";
	display:inline-block;
	vertical-align:middle;
	width:36px; height:2px;
	margin-right:14px;
	background:#fff;
	opacity:.7;
}
.lnp-hero-key{ font-weight:800; color:var(--lnp-hero-key); }
.lnp-hero-btns{ display:flex; gap:8px; flex-wrap:nowrap; }
.lnp-hero .lnp-btn{ flex:1; height:44px; font-size:14px; padding:0 12px; }

/* 히어로 페이지네이션/화살표는 swiper 기본 클래스 그대로 사용, 색만 보정 */
.lnp-hero .swiper-pagination-bullet{ background:#fff; opacity:0.5; }
.lnp-hero .swiper-pagination-bullet-active{ opacity:1; }
.lnp-hero .swiper-button-next,
.lnp-hero .swiper-button-prev{ color:#fff; }

/* ===== 섹션 공통 ===== */
.lnp-section{ padding:80px 0; }
.lnp-section--soft{ background:var(--lnp-bg-soft); }
.lnp-section-head{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	margin-bottom:36px;
	flex-wrap:wrap;
	gap:12px;
}
.lnp-section-eyebrow{
	display:block;
	font-size:13px;
	font-weight:700;
	color:var(--lnp-navy);
	letter-spacing:0.08em;
	margin-bottom:8px;
}
.lnp-section-title{
	font-size:26px;
	font-weight:800;
	color:var(--lnp-text);
	margin:0;
}
.lnp-section-more{
	font-size:14px;
	font-weight:600;
	color:var(--lnp-text-sub);
	text-decoration:none;
}
.lnp-section-more:hover{ color:var(--lnp-navy); }

/* ===== 주요 프로젝트 카드 ===== */
.lnp-project-grid{
	display:grid;
	grid-template-columns:repeat(1, 1fr);
	gap:24px;
}
.lnp-project-card{
	display:block;
	text-decoration:none;
	color:inherit;
	background:#fff;
	border:1px solid var(--lnp-border);
	border-radius:8px;
	overflow:hidden;
	transition:box-shadow .2s ease, transform .2s ease;
}
.lnp-project-card:hover{
	box-shadow:0 12px 24px rgba(20,49,92,0.1);
	transform:translateY(-2px);
}
.lnp-project-thumb{
	position:relative;
	width:100%;
	padding-top:66.6%; /* 3:2 */
	background:#dde3ec;
	overflow:hidden;
}
.lnp-project-thumb img{
	position:absolute; inset:0;
	width:100%; height:100%;
	object-fit:cover;
}
.lnp-project-cat{
	position:absolute;
	left:12px; top:12px;
	background:rgba(20,49,92,0.85);
	color:#fff;
	font-size:12px;
	font-weight:700;
	padding:4px 10px;
	border-radius:4px;
}
.lnp-project-body{ padding:18px 18px 20px; }
.lnp-project-title-kr{
	display:block;
	font-size:16px;
	font-weight:700;
	color:var(--lnp-text);
	margin-bottom:4px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	min-width:0;
}
.lnp-project-title-en{
	display:block;
	font-size:13px;
	color:var(--lnp-text-sub);
	margin-bottom:10px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	min-width:0;
}
.lnp-project-date{
	font-size:13px;
	color:var(--lnp-text-sub);
}

/* ===== ABOUT 띠 ===== */
.lnp-about-strip{
	background:
		radial-gradient(circle at 88% 15%, rgba(91,110,240,.28), transparent 45%),
		linear-gradient(100deg, var(--lnp-navy) 0%, var(--lnp-navy-dark) 100%);
	padding:72px 0;
	text-align:left;
}
.lnp-about-in{
	display:grid;
	grid-template-columns:1fr;
	gap:40px;
	align-items:center;
}
.lnp-about-strip .lnp-section-eyebrow{ color:#8fb0e8; }
.lnp-about-strip p{
	color:#fff;
	font-size:22px;
	font-weight:800;
	line-height:1.5;
	margin:0 0 28px;
	letter-spacing:-0.3px;
}
.lnp-about-strip .lnp-btn--outline{
	color:#fff;
	border-color:rgba(255,255,255,0.6);
}
.lnp-about-strip .lnp-btn--outline:hover{
	background:#fff;
	color:var(--lnp-navy);
}
.lnp-about-fields{
	list-style:none;
	margin:0; padding:0;
	border-top:1px solid rgba(255,255,255,.18);
}
.lnp-about-fields li{
	display:flex;
	align-items:center;
	gap:20px;
	padding:18px 0;
	border-bottom:1px solid rgba(255,255,255,.18);
	color:#fff;
	font-size:17px;
	font-weight:600;
}
.lnp-about-num{
	min-width:28px;
	font-size:14px;
	font-weight:700;
	color:#8fb0e8;
	letter-spacing:.04em;
}

@media screen and (min-width:640px){
	.lnp-project-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media screen and (max-width:1023px){
	.lnp-hero .swiper-button-prev,
	.lnp-hero .swiper-button-next{ display:none; }
	.lnp-hero-dim{
		background:linear-gradient(180deg, rgba(8,18,40,.45) 0%, rgba(8,18,40,.65) 50%, rgba(8,18,40,.45) 100%);
	}
}
@media screen and (min-width:1024px){
	.lnp-hero{ height:760px; }
	.lnp-hero-copy{ align-items:center; padding:0 20px; }
	.lnp-hero-title{ font-size:56px; margin-bottom:20px; }
	.lnp-hero-slogan{ font-size:36px; margin-bottom:40px; }
	.lnp-hero-slogan::before{ width:48px; margin-right:18px; }
	.lnp-hero-label{ font-size:15px; }
	.lnp-hero-btns{ gap:12px; }
	.lnp-hero .lnp-btn{ flex:none; height:56px; font-size:17px; padding:0 40px; }
	.lnp-project-grid{ grid-template-columns:repeat(3, 1fr); gap:28px; }
	.lnp-section{ padding:110px 0; }
	.lnp-section-title{ font-size:32px; }

	.lnp-about-strip{ padding:104px 0; }
	.lnp-about-in{ grid-template-columns:1.1fr 1fr; gap:80px; }
	.lnp-about-strip p{ font-size:34px; }
	.lnp-about-fields li{ font-size:20px; padding:22px 0; }
}