/* ===== 지역+키워드 랜딩 20종 — 히어로 레이아웃 4종 x 팔레트 5종, 컴팩트 푸터 ===== */

/* ---- 팔레트 5종 (CSS 변수만 교체, 마크업은 레이아웃 4종 공용) ---- */
.pal-1{--lp:#2563eb;--lp2:#0891b2;--lpd:#123a8f}
.pal-2{--lp:#0d9488;--lp2:#22c55e;--lpd:#0a6b63}
.pal-3{--lp:#4f46e5;--lp2:#a855f7;--lpd:#3730a3}
.pal-4{--lp:#1e3a5f;--lp2:#f59e0b;--lpd:#0f2540}
.pal-5{--lp:#c2410c;--lp2:#f59e0b;--lpd:#7c2d12}

/* ---- 공통 ---- */
.local-hero{position:relative;padding-top:76px;overflow:hidden}
.local-hero .lh-badge{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:.85rem;padding:8px 16px;border-radius:99px;margin-bottom:16px}
.local-hero h1{font-size:clamp(1.8rem,4.3vw,2.7rem);font-weight:900;line-height:1.28;margin-bottom:16px}
.local-hero .lh-desc{font-size:1.05rem;max-width:600px;margin-bottom:28px}
.local-hero .lh-cta{display:inline-flex}

/* ---- 레이아웃 1: 풀블리드 이미지 + 중앙 정렬 ---- */
.lh-full{min-height:52vh;display:flex;align-items:center;background:var(--gray-900)}
.lh-full img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.lh-full::after{content:'';position:absolute;inset:0;background:linear-gradient(160deg,var(--lpd) 0%,rgba(15,23,42,.75) 55%,rgba(15,23,42,.4) 100%)}
.lh-full .lh-inner{position:relative;z-index:2;padding:64px 20px;text-align:center;margin:0 auto}
.lh-full .lh-badge{background:rgba(255,255,255,.16);color:#fff;backdrop-filter:blur(6px)}
.lh-full h1,.lh-full .lh-desc{color:#fff;margin-left:auto;margin-right:auto}
.lh-full .lh-desc{color:rgba(255,255,255,.88)}

/* ---- 레이아웃 2: 좌 텍스트 패널 / 우 이미지 패널 ---- */
.lh-split{display:flex;min-height:50vh;align-items:stretch}
.lh-split .lh-text{flex:0 0 54%;display:flex;flex-direction:column;justify-content:center;padding:80px 5vw 40px 20px;background:linear-gradient(135deg,var(--lp),var(--lpd));color:#fff}
.lh-split .lh-img{flex:1;position:relative;overflow:hidden}
.lh-split .lh-img img{width:100%;height:100%;object-fit:cover;border-radius:28px 0 0 28px}
.lh-split .lh-badge{background:rgba(255,255,255,.18);color:#fff}
.lh-split h1,.lh-split .lh-desc{color:#fff}
.lh-split .lh-desc{color:rgba(255,255,255,.86)}
@media(max-width:820px){.lh-split{flex-direction:column}.lh-split .lh-text{padding:96px 20px 30px}.lh-split .lh-img{min-height:220px}.lh-split .lh-img img{border-radius:0}}

/* ---- 레이아웃 3: 대각선 컬러 패널 + 배경 이미지 ---- */
.lh-diagonal{min-height:54vh;display:flex;align-items:center;background:var(--gray-900)}
.lh-diagonal img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lh-diagonal .lh-panel{position:absolute;inset:0;background:linear-gradient(115deg,var(--lpd) 0%,var(--lp) 45%,transparent 62%)}
.lh-diagonal .lh-inner{position:relative;z-index:2;padding:70px 20px;max-width:640px}
.lh-diagonal .lh-badge{background:rgba(255,255,255,.16);color:#fff}
.lh-diagonal h1,.lh-diagonal .lh-desc{color:#fff}
.lh-diagonal .lh-desc{color:rgba(255,255,255,.88)}
@media(max-width:640px){.lh-diagonal .lh-panel{background:linear-gradient(180deg,var(--lpd) 0%,var(--lp) 55%,rgba(15,23,42,.55) 100%)}}

/* ---- 레이아웃 4: 라이트 배경 + 우측 카드형 이미지 ---- */
.lh-card{min-height:50vh;display:flex;align-items:center;background:var(--gray-50)}
.lh-card .lh-row{display:flex;align-items:center;gap:48px;padding:90px 0 50px;width:100%}
.lh-card .lh-inner{flex:1 1 50%}
.lh-card .lh-badge{background:color-mix(in srgb, var(--lp) 12%, transparent);color:var(--lpd)}
.lh-card h1{color:var(--gray-900)}
.lh-card .lh-desc{color:var(--gray-600)}
.lh-card .lh-photo{flex:1 1 40%;position:relative}
.lh-card .lh-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:24px;box-shadow:var(--shadow-lg);border:6px solid #fff;outline:3px solid var(--lp)}
@media(max-width:820px){.lh-card .lh-row{flex-direction:column;padding:90px 0 40px;gap:28px}.lh-card .lh-inner{text-align:center}.lh-card .lh-desc{margin-left:auto;margin-right:auto}}

/* ---- 현장 사진 4장 한 줄 배치 ---- */
.photo-grid-4{display:grid;grid-template-columns:repeat(4, 1fr);gap:14px;max-width:1100px}
.photo-grid-4 .photo{width:auto}
@media(max-width:640px){.photo-grid-4{gap:7px}}

/* ---- 본문 리스트형 섹션(다양한 표현방식) ---- */
.lh-list{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.lh-list li{background:var(--gray-50);border-radius:12px;padding:14px 18px;color:var(--gray-700);font-size:.98rem;line-height:1.7;border-left:4px solid var(--primary)}
.lh-list li strong{color:var(--primary-dark)}

/* ---- 컴팩트 푸터 (사업자정보 가로 배치, 세로폭 최소) ---- */
.footer-compact{background:var(--gray-900);color:rgba(255,255,255,.65);padding:16px 0}
.footer-compact-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 22px}
.footer-compact-links{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:.82rem}
.footer-compact-links a{color:rgba(255,255,255,.75)}
.footer-compact-links a:hover{color:#fff}
.footer-compact-biz{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:.76rem;color:rgba(255,255,255,.5)}
.footer-compact-biz span:not(:last-child)::after{content:'·';margin-left:14px;color:rgba(255,255,255,.25)}
@media(max-width:700px){.footer-compact-inner{flex-direction:column;align-items:flex-start}.footer-compact-biz span:not(:last-child)::after{display:none}.footer-compact-biz span{display:block}}
.pal-h1{--lp:hsl(0,65%,42%);--lp2:hsl(28,70%,52%);--lpd:hsl(0,65%,25%)}
.pal-h2{--lp:hsl(20,65%,42%);--lp2:hsl(48,70%,52%);--lpd:hsl(20,65%,25%)}
.pal-h3{--lp:hsl(40,65%,42%);--lp2:hsl(68,70%,52%);--lpd:hsl(40,65%,25%)}
.pal-h4{--lp:hsl(60,65%,42%);--lp2:hsl(88,70%,52%);--lpd:hsl(60,65%,25%)}
.pal-h5{--lp:hsl(80,65%,42%);--lp2:hsl(108,70%,52%);--lpd:hsl(80,65%,25%)}
.pal-h6{--lp:hsl(100,65%,42%);--lp2:hsl(128,70%,52%);--lpd:hsl(100,65%,25%)}
.pal-h7{--lp:hsl(120,65%,42%);--lp2:hsl(148,70%,52%);--lpd:hsl(120,65%,25%)}
.pal-h8{--lp:hsl(140,65%,42%);--lp2:hsl(168,70%,52%);--lpd:hsl(140,65%,25%)}
.pal-h9{--lp:hsl(160,65%,42%);--lp2:hsl(188,70%,52%);--lpd:hsl(160,65%,25%)}
.pal-h10{--lp:hsl(180,65%,42%);--lp2:hsl(208,70%,52%);--lpd:hsl(180,65%,25%)}
.pal-h11{--lp:hsl(200,65%,42%);--lp2:hsl(228,70%,52%);--lpd:hsl(200,65%,25%)}
.pal-h12{--lp:hsl(220,65%,42%);--lp2:hsl(248,70%,52%);--lpd:hsl(220,65%,25%)}
.pal-h13{--lp:hsl(240,65%,42%);--lp2:hsl(268,70%,52%);--lpd:hsl(240,65%,25%)}
.pal-h14{--lp:hsl(260,65%,42%);--lp2:hsl(288,70%,52%);--lpd:hsl(260,65%,25%)}
.pal-h15{--lp:hsl(280,65%,42%);--lp2:hsl(308,70%,52%);--lpd:hsl(280,65%,25%)}
.pal-h16{--lp:hsl(300,65%,42%);--lp2:hsl(328,70%,52%);--lpd:hsl(300,65%,25%)}
.pal-h17{--lp:hsl(320,65%,42%);--lp2:hsl(348,70%,52%);--lpd:hsl(320,65%,25%)}
.pal-h18{--lp:hsl(340,65%,42%);--lp2:hsl(8,70%,52%);--lpd:hsl(340,65%,25%)}

/* ---- 제목 서체 12종 (레이아웃/팔레트와 별도 축, 페이지별 조합에 사용) ---- */
.font-1 h1,.font-1 .section-title{font-family:'Noto Sans KR',sans-serif;font-weight:900}
.font-2 h1,.font-2 .section-title{font-family:'Noto Serif KR',serif;font-weight:900}
.font-3 h1,.font-3 .section-title{font-family:'Black Han Sans',sans-serif;font-weight:400}
.font-4 h1,.font-4 .section-title{font-family:'Do Hyeon',sans-serif;font-weight:400}
.font-5 h1,.font-5 .section-title{font-family:'Gowun Batang',serif;font-weight:700}
.font-6 h1,.font-6 .section-title{font-family:'Gowun Dodum',sans-serif;font-weight:400}
.font-7 h1,.font-7 .section-title{font-family:'Song Myung',serif;font-weight:400}
.font-8 h1,.font-8 .section-title{font-family:'Nanum Myeongjo',serif;font-weight:800}
.font-9 h1,.font-9 .section-title{font-family:'Gasoek One',sans-serif;font-weight:400}
.font-10 h1,.font-10 .section-title{font-family:'Stylish',sans-serif;font-weight:400}
.font-11 h1,.font-11 .section-title{font-family:'Jua',sans-serif;font-weight:400}
.font-12 h1,.font-12 .section-title{font-family:'IBM Plex Sans KR',sans-serif;font-weight:700}