/* ㈜루봄 홈페이지 — #2A6793 같은 자리는 빌드가 site.conf 값으로 채운다 */
:root{--brand:#2A6793;--brand-d:#1B4666;--accent:#3F8F3A;--ink:#1d2430;--muted:#5d6878;--line:#dfe4ea;--bg:#fff;--soft:#f3f6f9}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"NanumBarunGothic","NanumGothic","나눔고딕","Malgun Gothic","Apple SD Gothic Neo",sans-serif;color:var(--ink);background:var(--bg);line-height:1.7;word-break:keep-all;overflow-wrap:anywhere}
a{color:var(--brand)}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.muted{color:var(--muted)}.small{font-size:.9em}
code{background:var(--soft);padding:.05em .35em;border-radius:4px;font-size:.92em}
/* 머리 */
.top{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(6px)}
.top-in{display:flex;align-items:center;gap:16px;min-height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:700;white-space:nowrap}
.brand img{height:40px;width:auto}
.nav{margin-left:auto;display:flex;flex-wrap:wrap;gap:2px}
.nav a{padding:8px 10px;border-radius:6px;text-decoration:none;color:var(--ink);font-size:.95em}
.nav a:hover{background:var(--soft)}
.nav a[aria-current]{color:var(--brand);font-weight:700;box-shadow:inset 0 -2px 0 var(--brand)}
.navt,.navb{display:none}
@media (max-width:900px){
  .navb{display:block;margin-left:auto;font-size:1.5em;cursor:pointer;padding:4px 10px}
  .nav{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;flex-direction:column;border-bottom:1px solid var(--line);padding:8px 20px}
  .navt:checked~.nav{display:flex}
}
/* 첫 화면 */
.hero{background:linear-gradient(135deg,var(--brand-d),var(--brand));color:#fff}
.hero-in{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;padding:64px 20px}
.hero h1{font-size:2.5em;line-height:1.3;margin:.2em 0}
.kicker{opacity:.85;margin:0}
.lead{font-size:1.1em}
.hero .lead{opacity:.95}
.hero-img img{border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.3)}
.hero-img figcaption{font-size:.85em;opacity:.8;margin-top:6px}
@media (max-width:800px){.hero-in{grid-template-columns:1fr;padding:40px 20px}.hero h1{font-size:1.9em}}
.btn{display:inline-block;background:var(--accent);color:#fff;padding:12px 20px;border-radius:8px;text-decoration:none;font-weight:700;margin:4px 6px 4px 0}
.btn.ghost{background:transparent;border:2px solid rgba(255,255,255,.8)}
/* 공통 틀 */
section{margin:56px auto}
.hero,.band{margin:0}
.band{background:var(--soft);padding:56px 0}
h1{font-size:2em;margin:.3em 0 .5em}
h2{font-size:1.45em;margin:1.8em 0 .6em;color:var(--brand-d)}
.page h2{border-left:5px solid var(--accent);padding-left:12px}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px 22px}
.card h3{margin:.2em 0 .4em;color:var(--brand)}
.layers{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;counter-reset:l}
.layer{background:#fff;border-radius:12px;padding:18px;border-top:4px solid var(--brand)}
.layer h3{margin:0 0 .4em}
.layer ul,.card ul{padding-left:1.1em;margin:.3em 0}
.note{background:#fff;border-left:4px solid var(--brand);padding:12px 16px;border-radius:0 8px 8px 0}
.band .note{margin-top:20px}
.tbl{width:100%;border-collapse:collapse;margin:.6em 0 1em;font-size:.96em}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.tbl thead th{background:var(--brand);color:#fff;border:0}
.tbl.kv th{width:28%;background:var(--soft);color:var(--brand-d)}
@media (max-width:700px){.tbl{display:block;overflow-x:auto;white-space:normal}.tbl.kv th{width:auto}}
.tag{display:inline-block;background:#e8f1e7;color:#2d6a2a;border-radius:999px;padding:0 10px;font-size:.85em;white-space:nowrap}
.flow{font-weight:700;background:var(--soft);padding:12px 16px;border-radius:8px}
.dots li{margin:.3em 0}
.timeline{list-style:none;padding:0;border-left:3px solid var(--line);margin-left:6px}
.timeline li{position:relative;padding:4px 0 12px 22px;display:flex;gap:14px;flex-wrap:wrap}
.timeline li::before{content:"";position:absolute;left:-9px;top:12px;width:14px;height:14px;border-radius:50%;background:var(--accent);border:3px solid #fff}
.timeline b{min-width:84px;color:var(--brand)}
.timeline span{flex:1;min-width:220px}
.prod{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;border-bottom:1px solid var(--line);padding:24px 0}
.prod h2,.prod h3{margin-top:0}
.prod-i{display:grid;gap:10px}
.prod-i img,.gallery2 img,.gallery3 img,.case img{border-radius:10px;border:1px solid var(--line)}
@media (max-width:800px){.prod{grid-template-columns:1fr}}
.gallery2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.gallery3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;align-items:start}
@media (max-width:700px){.gallery2,.gallery3{grid-template-columns:1fr}}
.flowsteps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;counter-reset:s}
.flowsteps li{background:var(--soft);border-radius:10px;padding:14px;counter-increment:s}
.flowsteps b{display:block;color:var(--brand)}
.flowsteps b::before{content:counter(s) ". "}
.cases{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.case{margin:0;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}
.case img{aspect-ratio:4/3;object-fit:cover;object-position:top;width:100%}
.case figcaption{padding-top:8px;font-size:.93em}
.farm-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.farm-cta h2{margin-top:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:2px solid var(--c);color:var(--c);border-radius:999px;padding:2px 12px;font-weight:700;background:#fff}
.dl li{margin:.5em 0}
.foot{background:#16212e;color:#c9d2dc;margin-top:64px;padding:32px 0;font-size:.92em}
.foot a{color:#fff}
.foot-in{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.foot-r{text-align:right}
.foot .muted{color:#8b97a5}
@media (max-width:700px){.foot-r{text-align:left}}
@media print{.top,.foot,.btn{display:none}}
/* 대시보드 */
.dash{margin:14px 0 28px}
.dash img{border:1px solid var(--line);border-radius:10px;box-shadow:0 6px 24px rgba(0,0,0,.08)}
.dash figcaption{margin-top:8px;font-size:.95em}
.dashgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.dash.small{margin:0}
.dashcard{display:block;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-top:4px solid var(--c);border-radius:10px;overflow:hidden;background:#fff}
.dashcard img{aspect-ratio:16/9;object-fit:cover;width:100%}
.dashcard span{display:block;padding:10px 12px;font-size:.93em}
.dashcard b{color:var(--c)}
/* 데이터 수집 = AX 의 전제 */
.datafirst h2{font-size:1.7em;color:var(--brand-d)}
.datafirst .lead strong{color:var(--brand)}
.dfsteps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:18px 0}
.dfsteps li{border:1px solid var(--line);border-radius:12px;padding:16px 18px;background:#fff;display:flex;flex-direction:column;gap:6px}
.dfsteps li.first{border:2px solid var(--brand);background:#f1f6fb}
.dfsteps b{font-size:1.15em;color:var(--brand)}
.dfsteps em{font-style:normal;color:#9a3b2e;font-size:.9em}
.dfpoint{background:var(--brand);color:#fff;border-radius:10px;padding:14px 18px;font-size:1.08em}
.dfpoint strong{color:#ffe082}