/* ─────────────────────────────────────────────────────────────
   3사 홈페이지 공통 스타일
   브랜드 색은 <body data-brand="donga|his|dps"> 로 전환됩니다.
   ───────────────────────────────────────────────────────────── */

:root{
  --ink:#0f172a; --ink-2:#334155; --ink-3:#64748b; --ink-4:#94a3b8;
  --line:#e2e8f0; --line-2:#cbd5e1;
  --bg:#ffffff; --bg-2:#f8fafc; --bg-3:#f1f5f9;
  --radius:14px; --radius-lg:22px;
  --shadow:0 1px 2px rgba(15,23,42,.05), 0 8px 24px -12px rgba(15,23,42,.16);
  --shadow-lg:0 24px 60px -24px rgba(15,23,42,.34);
  --maxw:1200px;
  --head-h:72px;
  --font:'Pretendard','Pretendard Variable',-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic',system-ui,sans-serif;
}
/* ── 브랜드별 아이덴티티: 색 + 모서리 + 헤더/히어로 구성이 모두 다름(3사는 별개 회사로 보여야 함) ── */
body[data-brand="donga"]{ --c1:#0a2f56; --c2:#12558f; --c3:#2b86d4; --tint:#eaf3fb; --tint-2:#d6e8f7; --radius:14px; --radius-lg:22px; }
body[data-brand="his"]  { --c1:#0b4a52; --c2:#0d7482; --c3:#19b3bf; --tint:#e6f6f7; --tint-2:#cdeef0; --radius:20px; --radius-lg:28px; --bg-2:#f3fafb; --bg-3:#e9f4f5; }
body[data-brand="dps"]  { --c1:#161b22; --c2:#2b3644; --c3:#c96f2f; --tint:#f4efe9; --tint-2:#eadfd2; --radius:4px; --radius-lg:6px; --bg-2:#f6f4f1; --bg-3:#efebe6; }

*,*::before,*::after{ box-sizing:border-box }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--head-h) + 12px) }
body{
  margin:0; font-family:var(--font); color:var(--ink); background:var(--bg);
  font-size:16px; line-height:1.7; letter-spacing:-.011em;
  -webkit-font-smoothing:antialiased; word-break:keep-all; overflow-wrap:anywhere;
}
img{ max-width:100%; display:block }
a{ color:inherit; text-decoration:none }
h1,h2,h3,h4{ margin:0; line-height:1.28; letter-spacing:-.028em; font-weight:750 }
p{ margin:0 }
table{ border-collapse:collapse; width:100% }

.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap }

/* ── 헤더 ───────────────────────────────────────────────── */
.site-head{
  position:sticky; top:0; z-index:60; height:var(--head-h);
  background:rgba(255,255,255,.88); backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid var(--line); transition:.25s;
}
.site-head .wrap{ height:100%; display:flex; align-items:center; gap:28px }
.brand{ display:flex; align-items:center; gap:11px; flex:0 0 auto }
.brand .mk{
  width:38px; height:38px; border-radius:10px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--c1),var(--c3)); color:#fff;
  font-weight:800; font-size:15px; letter-spacing:-.03em; flex:0 0 auto;
}
.brand b{ display:block; font-size:17px; font-weight:800; letter-spacing:-.03em; line-height:1.2 }
.brand span{ display:block; font-size:10.5px; color:var(--ink-4); letter-spacing:.09em; font-weight:600; text-transform:uppercase }
.gnb{ display:flex; gap:2px; margin-left:auto }
.gnb a{
  position:relative; padding:10px 15px; border-radius:9px; font-size:15px; font-weight:650;
  color:var(--ink-2); transition:.16s;
}
.gnb a:hover{ color:var(--c2); background:var(--bg-3) }
.gnb a.on{ color:var(--c2) }
.gnb a.on::after{ content:''; position:absolute; left:15px; right:15px; bottom:3px; height:2px; background:var(--c3); border-radius:2px }
.head-cta{ display:flex; align-items:center; gap:8px; flex:0 0 auto }
.head-tel{ font-size:14.5px; font-weight:750; color:var(--ink-2); letter-spacing:-.01em; padding:8px 6px; font-variant-numeric:tabular-nums }
.head-tel:hover{ color:var(--c2) }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  padding:11px 20px; border-radius:10px; font-size:14.5px; font-weight:700; cursor:pointer;
  border:1px solid transparent; transition:.16s; font-family:inherit; white-space:nowrap;
}
.btn.pri{ background:var(--c2); color:#fff }
.btn.pri:hover{ background:var(--c1) }
.btn.ghost{ background:transparent; color:var(--ink); border-color:var(--line-2) }
.btn.ghost:hover{ border-color:var(--c3); color:var(--c2) }
.btn.on-dark{ background:rgba(255,255,255,.12); color:#fff; border-color:rgba(255,255,255,.3); backdrop-filter:blur(6px) }
.btn.on-dark:hover{ background:rgba(255,255,255,.22) }
.btn.lg{ padding:14px 26px; font-size:15.5px }
.burger{ display:none; width:42px; height:42px; border:1px solid var(--line); background:#fff; border-radius:10px; cursor:pointer; padding:0 }
.burger i{ display:block; width:17px; height:2px; background:var(--ink); margin:3.5px auto; border-radius:2px; transition:.2s }

/* ── 히어로 ─────────────────────────────────────────────── */
.hero{
  position:relative; color:#fff; overflow:hidden;
  background:linear-gradient(135deg,var(--c1) 0%,var(--c2) 62%,var(--c3) 130%);
}
.hero::before{
  content:''; position:absolute; inset:0; opacity:.5;
  background:
    radial-gradient(1000px 460px at 78% -10%,rgba(255,255,255,.22),transparent 60%),
    radial-gradient(700px 420px at 8% 108%,rgba(255,255,255,.12),transparent 62%);
}
.hero::after{
  content:''; position:absolute; inset:0; opacity:.11; mix-blend-mode:overlay;
  background-image:linear-gradient(rgba(255,255,255,.55) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.55) 1px,transparent 1px);
  background-size:64px 64px; mask-image:linear-gradient(to bottom,#000,transparent 82%);
}
.hero .wrap{ position:relative; z-index:2; padding:104px 24px 108px }
.hero .eyebrow{
  display:inline-flex; align-items:center; gap:9px; font-size:12.5px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.82);
  border:1px solid rgba(255,255,255,.3); border-radius:999px; padding:7px 16px; margin-bottom:26px;
}
.hero h1{ font-size:clamp(31px,4.6vw,54px); font-weight:800; letter-spacing:-.038em; max-width:19ch }
.hero .lead{ margin-top:22px; font-size:clamp(15.5px,1.5vw,18.5px); color:rgba(255,255,255,.88); max-width:60ch; line-height:1.72 }
.hero .acts{ margin-top:36px; display:flex; gap:11px; flex-wrap:wrap }

/* 히어로 하단 지표 */
.hero-stats{ position:relative; z-index:2; border-top:1px solid rgba(255,255,255,.18) }
.hero-stats .wrap{ padding:0 24px; display:grid; grid-template-columns:repeat(4,1fr) }
.hero-stats .it{ padding:26px 22px 30px; border-left:1px solid rgba(255,255,255,.14) }
.hero-stats .it:first-child{ border-left:0; padding-left:0 }
.hero-stats .v{ font-size:clamp(21px,2.5vw,29px); font-weight:800; letter-spacing:-.035em; color:#fff }
.hero-stats .l{ font-size:13.5px; font-weight:650; color:rgba(255,255,255,.9); margin-top:5px }
.hero-stats .s{ font-size:12px; color:rgba(255,255,255,.6); margin-top:2px }

/* ── 서브페이지 헤더 ────────────────────────────────────── */
.page-head{ position:relative; color:#fff; overflow:hidden;
  background:linear-gradient(120deg,var(--c1),var(--c2) 88%) }
.page-head::after{ content:''; position:absolute; inset:0; opacity:.1;
  background-image:linear-gradient(rgba(255,255,255,.6) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.6) 1px,transparent 1px);
  background-size:52px 52px }
.page-head .wrap{ position:relative; z-index:2; padding:60px 24px 56px }
.page-head h1{ font-size:clamp(26px,3.4vw,40px); font-weight:800 }
.page-head p{ margin-top:12px; color:rgba(255,255,255,.8); font-size:15.5px; max-width:64ch }
.crumb{ font-size:12.5px; color:rgba(255,255,255,.68); margin-bottom:14px; font-weight:600 }
.crumb span{ margin:0 7px; opacity:.55 }

/* 서브 탭 */
.subnav{ background:var(--bg-2); border-bottom:1px solid var(--line); position:sticky; top:var(--head-h); z-index:50 }
.subnav .wrap{ display:flex; gap:4px; overflow-x:auto; scrollbar-width:none }
.subnav .wrap::-webkit-scrollbar{ display:none }
.subnav a{ padding:15px 16px; font-size:14.5px; font-weight:650; color:var(--ink-3); white-space:nowrap; border-bottom:2px solid transparent }
.subnav a:hover{ color:var(--ink) }
.subnav a.on{ color:var(--c2); border-bottom-color:var(--c3) }

/* ── 섹션 ───────────────────────────────────────────────── */
section{ padding:84px 0 }
section.tight{ padding:60px 0 }
section.alt{ background:var(--bg-2) }
.sec-head{ margin-bottom:44px; max-width:70ch }
.sec-head.ctr{ margin-left:auto; margin-right:auto; text-align:center }
.sec-head .kicker{ font-size:12.5px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; color:var(--c3); margin-bottom:13px }
.sec-head h2{ font-size:clamp(24px,3vw,34px); font-weight:800 }
.sec-head p{ margin-top:14px; color:var(--ink-3); font-size:16px }

/* 카드 그리드 */
.grid{ display:grid; gap:20px }
.g2{ grid-template-columns:repeat(2,1fr) }
.g3{ grid-template-columns:repeat(3,1fr) }
.g4{ grid-template-columns:repeat(4,1fr) }
.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:30px 28px; transition:.2s; position:relative; overflow:hidden;
}
.card.link:hover{ border-color:var(--c3); transform:translateY(-3px); box-shadow:var(--shadow) }
.card .ic{
  width:50px; height:50px; border-radius:14px; display:grid; place-items:center;
  font-size:23px; background:var(--tint); margin-bottom:18px;
}
.card h3{ font-size:18.5px; font-weight:750 }
.card .en{ font-size:11.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--c3); margin-top:6px }
.card p{ margin-top:12px; color:var(--ink-3); font-size:14.5px; line-height:1.68 }
.card ul{ margin:18px 0 0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:6px }
.card ul li{
  font-size:12.5px; font-weight:600; color:var(--ink-2);
  background:var(--bg-3); border-radius:7px; padding:5px 10px;
}
.card .more{ margin-top:20px; font-size:13.5px; font-weight:700; color:var(--c2) }

/* 지표 카드 */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px }
.stat{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:26px 24px }
.stat .v{ font-size:30px; font-weight:820; letter-spacing:-.04em; color:var(--c2) }
.stat .l{ font-size:14.5px; font-weight:700; margin-top:6px }
.stat .s{ font-size:12.5px; color:var(--ink-4); margin-top:3px }

/* 텍스트 2단 */
.split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); gap:60px; align-items:start }
.split .body p+p{ margin-top:18px }
.split .body{ color:var(--ink-2); font-size:16px; line-height:1.85 }

/* 개요 표 */
.spec{ border-top:2px solid var(--ink); font-size:15px }
.spec tr{ border-bottom:1px solid var(--line) }
.spec th{ text-align:left; padding:15px 18px; width:150px; font-weight:700; background:var(--bg-2); color:var(--ink-2); vertical-align:top }
.spec td{ padding:15px 18px; color:var(--ink-2) }

/* 데이터 표 */
.data-wrap{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#fff }
.data-scroll{ overflow-x:auto; max-height:min(72vh,900px); overflow-y:auto }
table.data{ font-size:14.5px; min-width:760px }
table.data thead th{
  position:sticky; top:0; z-index:2; background:var(--bg-3); text-align:left;
  padding:14px 16px; font-size:13px; font-weight:750; color:var(--ink-2);
  border-bottom:1px solid var(--line-2); white-space:nowrap;
}
table.data td{ padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:top; color:var(--ink-2) }
table.data tbody tr:hover{ background:var(--tint) }
table.data td.yr{ font-weight:700; color:var(--ink); white-space:nowrap; font-variant-numeric:tabular-nums }
table.data td.org{ font-weight:650; color:var(--ink); min-width:170px }
.tag{
  display:inline-block; font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:6px;
  background:var(--tint); color:var(--c2); white-space:nowrap;
}
.filters{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:20px }
.filters button{
  font:inherit; font-size:13.5px; font-weight:650; padding:8px 15px; border-radius:999px; cursor:pointer;
  border:1px solid var(--line-2); background:#fff; color:var(--ink-2); transition:.15s;
}
.filters button:hover{ border-color:var(--c3); color:var(--c2) }
.filters button.on{ background:var(--c2); border-color:var(--c2); color:#fff }
.filters input{
  font:inherit; font-size:14px; padding:9px 15px; border-radius:999px; border:1px solid var(--line-2);
  min-width:220px; margin-left:auto; background:#fff;
}
.filters input:focus{ outline:2px solid var(--c3); outline-offset:1px; border-color:transparent }
.count{ font-size:13.5px; color:var(--ink-4); font-weight:600; padding:14px 16px; border-top:1px solid var(--line); background:var(--bg-2) }

/* 연혁 */
.timeline{ position:relative; padding-left:26px }
.timeline::before{ content:''; position:absolute; left:5px; top:8px; bottom:8px; width:2px; background:var(--line) }
.timeline .it{ position:relative; padding:0 0 30px }
.timeline .it::before{
  content:''; position:absolute; left:-26px; top:9px; width:12px; height:12px; border-radius:50%;
  background:#fff; border:3px solid var(--c3);
}
.timeline .yr{ font-size:19px; font-weight:800; color:var(--c2); letter-spacing:-.03em }
.timeline .tx{ margin-top:4px; color:var(--ink-2); font-size:15px }

/* 인증 칩 */
.chips{ display:flex; flex-wrap:wrap; gap:10px }
.chips .chip{
  display:flex; align-items:center; gap:9px; padding:12px 17px;
  border:1px solid var(--line); border-radius:11px; background:#fff;
  font-size:14px; font-weight:650; color:var(--ink-2);
}
.chips .chip::before{ content:'✓'; color:var(--c3); font-weight:800; font-size:13px }

/* 고객사 */
.logos{ display:flex; flex-wrap:wrap; gap:10px }
.logos span{
  padding:12px 20px; border:1px solid var(--line); border-radius:10px; background:#fff;
  font-size:14.5px; font-weight:650; color:var(--ink-2);
}

/* 설비 목록 */
.fac{ display:grid; gap:14px }
.fac .row{
  display:flex; gap:20px; align-items:baseline; padding:20px 24px;
  border:1px solid var(--line); border-radius:var(--radius); background:#fff;
}
.fac .row .n{ font-weight:750; font-size:16px; min-width:170px }
.fac .row .sp{ color:var(--ink-3); font-size:14.5px }
.fac .row .cr{ margin-left:auto; font-size:13px; font-weight:650; color:var(--c2); background:var(--tint); padding:5px 12px; border-radius:8px; white-space:nowrap }

/* CTA 밴드 */
.cta{ background:linear-gradient(120deg,var(--c1),var(--c2)); color:#fff }
.cta .wrap{ padding:64px 24px; display:flex; align-items:center; gap:36px; flex-wrap:wrap }
.cta h2{ font-size:clamp(22px,2.6vw,30px); font-weight:800 }
.cta p{ margin-top:11px; color:rgba(255,255,255,.82); font-size:15.5px }
.cta .acts{ margin-left:auto; display:flex; gap:11px; flex-wrap:wrap }

/* 문의 폼 */
.form{ display:grid; gap:18px }
.form .r2{ display:grid; grid-template-columns:1fr 1fr; gap:18px }
.field label{ display:block; font-size:13.5px; font-weight:700; margin-bottom:7px; color:var(--ink-2) }
.field label .req{ color:#dc2626; margin-left:3px }
.field input,.field select,.field textarea{
  width:100%; font:inherit; font-size:15px; padding:12px 15px; border-radius:10px;
  border:1px solid var(--line-2); background:#fff; color:var(--ink); transition:.15s;
}
.field textarea{ min-height:170px; resize:vertical; line-height:1.7 }
.field input:focus,.field select:focus,.field textarea:focus{ outline:2px solid var(--c3); outline-offset:1px; border-color:transparent }
.agree{ display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:var(--ink-3); line-height:1.6 }
.agree input{ margin-top:4px; width:16px; height:16px; flex:0 0 auto; accent-color:var(--c2) }
.form-note{ font-size:13.5px; color:var(--ink-4); line-height:1.7 }
.msg{ padding:14px 18px; border-radius:10px; font-size:14.5px; font-weight:650; display:none }
.msg.ok{ background:#ecfdf5; color:#065f46; border:1px solid #a7f3d0; display:block }
.msg.err{ background:#fef2f2; color:#991b1b; border:1px solid #fecaca; display:block }

/* 연락처 카드 */
.contact-card{ background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius-lg); padding:30px 28px }
.contact-card dl{ margin:0; display:grid; gap:16px }
.contact-card dt{ font-size:12px; font-weight:750; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-4) }
.contact-card dd{ margin:4px 0 0; font-size:15.5px; font-weight:650; color:var(--ink) }
.contact-card dd a:hover{ color:var(--c2) }
.map-embed{ border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; background:var(--bg-3); aspect-ratio:16/9 }
.map-embed iframe{ width:100%; height:100%; border:0; display:block }

/* 그룹 랜딩 */
.pick{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px }
.pick a{
  display:block; border-radius:var(--radius-lg); overflow:hidden; color:#fff;
  border:1px solid rgba(255,255,255,.14); transition:.22s; position:relative; min-height:280px;
  padding:34px 30px; display:flex; flex-direction:column; justify-content:flex-end;
}
.pick a:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg) }
.pick a.donga{ background:linear-gradient(150deg,#0a2f56,#2b86d4) }
.pick a.his{ background:linear-gradient(150deg,#083f47,#17a2b0) }
.pick a.dps{ background:linear-gradient(150deg,#1c2431,#c2703a) }
.pick .en{ font-size:11.5px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; opacity:.75 }
.pick h3{ font-size:25px; font-weight:800; margin-top:8px }
.pick p{ margin-top:12px; font-size:14.5px; color:rgba(255,255,255,.82); line-height:1.65 }
.pick .go{ margin-top:20px; font-size:13.5px; font-weight:700 }

/* ── 푸터 ───────────────────────────────────────────────── */
.site-foot{ background:#0d1420; color:#94a3b8; font-size:14px; padding:56px 0 30px; margin-top:0 }
.site-foot .top{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding-bottom:34px; border-bottom:1px solid rgba(255,255,255,.09) }
.site-foot .brand b{ color:#fff; font-size:17px }
.site-foot .brand span{ color:#64748b }
.site-foot .co-info{ margin-top:18px; line-height:1.9; font-size:13.5px }
.site-foot .co-info b{ color:#cbd5e1; font-weight:650 }
.site-foot h4{ color:#e2e8f0; font-size:13px; font-weight:750; letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px }
.site-foot ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px }
.site-foot ul a{ font-size:14px }
.site-foot ul a:hover{ color:#fff }
.site-foot .btm{ padding-top:22px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:12.5px; color:#64748b }
.site-foot .btm a:hover{ color:#cbd5e1 }

/* 스크롤 등장 */
.rv{ opacity:0; transform:translateY(18px); transition:opacity .6s ease,transform .6s ease }
.rv.in{ opacity:1; transform:none }
@media (prefers-reduced-motion:reduce){ .rv{ opacity:1; transform:none; transition:none } html{ scroll-behavior:auto } }

/* ── 반응형 ─────────────────────────────────────────────── */
@media (max-width:1080px){
  .g4{ grid-template-columns:repeat(2,1fr) }
  .stats{ grid-template-columns:repeat(2,1fr) }
  .split{ grid-template-columns:1fr; gap:34px }
  .pick{ grid-template-columns:1fr }
  .site-foot .top{ grid-template-columns:1fr 1fr }
}
@media (max-width:900px){
  .g3{ grid-template-columns:repeat(2,1fr) }
  .hero-stats .wrap{ grid-template-columns:repeat(2,1fr) }
  .hero-stats .it{ border-left:0; border-top:1px solid rgba(255,255,255,.14); padding-left:0 }
  .hero-stats .it:nth-child(-n+2){ border-top:0 }
  .burger{ display:block }
  .gnb{
    position:fixed; inset:var(--head-h) 0 auto; margin:0; flex-direction:column; gap:0;
    background:#fff; border-bottom:1px solid var(--line); padding:10px 16px 20px;
    box-shadow:var(--shadow-lg); display:none; max-height:calc(100vh - var(--head-h)); overflow-y:auto;
  }
  .gnb.open{ display:flex }
  .gnb a{ padding:14px 10px; font-size:16px; border-radius:10px }
  .gnb a.on::after{ display:none }
  .gnb a.on{ background:var(--tint) }
  .head-cta .btn.pri{ display:none }
  .site-head .wrap{ gap:12px }
}
@media (max-width:680px){
  .wrap{ padding:0 18px }
  section{ padding:58px 0 }
  .hero .wrap{ padding:70px 18px 74px }
  .page-head .wrap{ padding:44px 18px 40px }
  .g2,.g3,.g4{ grid-template-columns:1fr }
  .stats{ grid-template-columns:1fr 1fr }
  .form .r2{ grid-template-columns:1fr }
  .card{ padding:26px 22px }
  .fac .row{ flex-direction:column; gap:6px }
  .fac .row .cr{ margin-left:0 }
  .filters input{ margin-left:0; width:100%; min-width:0 }
  .site-foot .top{ grid-template-columns:1fr; gap:30px }
  .cta .acts{ margin-left:0 }
  .spec th{ width:104px; padding:13px 12px }
  .spec td{ padding:13px 12px }
}

/* 인쇄 */
@media print{
  .site-head,.subnav,.cta,.site-foot,.filters,.head-cta{ display:none }
  .hero,.page-head{ color:#000; background:none }
  .data-scroll{ max-height:none; overflow:visible }
  section{ padding:20px 0 }
}


/* ═══════════════════════════════════════════════════════════
   브랜드 변주 A — 히즈하이드로: 밝은 히어로 + 물결, 둥근 형태, 중앙 정렬 헤더
   ═══════════════════════════════════════════════════════════ */
body[data-brand="his"] .site-head{ background:rgba(255,255,255,.94); border-bottom:0; box-shadow:0 1px 0 var(--line) }
body[data-brand="his"] .brand .mk{ border-radius:50%; background:radial-gradient(circle at 30% 30%,var(--c3),var(--c1)) }
body[data-brand="his"] .gnb a{ border-radius:999px; padding:9px 16px }
body[data-brand="his"] .gnb a.on{ background:var(--tint); color:var(--c1) }
body[data-brand="his"] .gnb a.on::after{ display:none }
body[data-brand="his"] .btn{ border-radius:999px }
body[data-brand="his"] .hero{ background:linear-gradient(180deg,#f2fbfc 0%,#ffffff 70%); color:var(--ink) }
body[data-brand="his"] .hero::before{
  opacity:1;
  background:
    radial-gradient(900px 420px at 88% 0%,rgba(25,179,191,.16),transparent 62%),
    radial-gradient(600px 360px at 6% 100%,rgba(11,74,82,.10),transparent 60%);
}
body[data-brand="his"] .hero::after{
  opacity:1; mix-blend-mode:normal; mask-image:none;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'><path d='M0 70 C 240 120 480 20 720 60 S 1200 110 1440 50 L1440 120 L0 120 Z' fill='%23e6f6f7'/><path d='M0 90 C 300 130 560 40 820 80 S 1240 120 1440 80 L1440 120 L0 120 Z' fill='%23cdeef0' opacity='.9'/></svg>") bottom/100% 120px no-repeat;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'><path d='M0 70 C 240 120 480 20 720 60 S 1200 110 1440 50 L1440 120 L0 120 Z' fill='%23e6f6f7'/><path d='M0 90 C 300 130 560 40 820 80 S 1240 120 1440 80 L1440 120 L0 120 Z' fill='%23cdeef0' opacity='.9'/></svg>");
}
body[data-brand="his"] .hero .wrap{ text-align:center; padding:96px 24px 150px }
body[data-brand="his"] .hero h1{ margin:0 auto; color:var(--c1) }
body[data-brand="his"] .hero .lead{ margin-left:auto; margin-right:auto; color:var(--ink-2) }
body[data-brand="his"] .hero .eyebrow{ color:var(--c2); border-color:var(--tint-2); background:#fff }
body[data-brand="his"] .hero .acts{ justify-content:center }
body[data-brand="his"] .hero .btn.on-dark{ background:var(--c2); color:#fff; border-color:var(--c2) }
body[data-brand="his"] .hero .btn.on-dark:hover{ background:var(--c1) }
body[data-brand="his"] .hero .btn.on-dark+.btn.on-dark{ background:#fff; color:var(--c1); border-color:var(--tint-2) }
body[data-brand="his"] .hero-stats{ border-top:0; background:var(--tint-2) }
body[data-brand="his"] .hero-stats .it{ border-left-color:rgba(11,74,82,.14) }
body[data-brand="his"] .hero-stats .v{ color:var(--c1) }
body[data-brand="his"] .hero-stats .l{ color:var(--ink) }
body[data-brand="his"] .hero-stats .s{ color:var(--ink-3) }
body[data-brand="his"] .page-head{ background:linear-gradient(120deg,var(--c1),var(--c2)) }
body[data-brand="his"] .card .ic{ border-radius:50% }
body[data-brand="his"] .chips .chip,.filters button{ border-radius:999px }
body[data-brand="his"] .tag{ border-radius:999px }
body[data-brand="his"] .cta{ background:linear-gradient(120deg,var(--c2),var(--c3)) }
body[data-brand="his"] .site-foot{ background:#0a3a40 }
body[data-brand="his"] .timeline .it::before{ border-radius:50% }
@media (max-width:900px){ body[data-brand="his"] .hero-stats .it{ border-top-color:rgba(11,74,82,.14) } }

/* ═══════════════════════════════════════════════════════════
   브랜드 변주 B — 디피에스테크놀로지: 각진 산업 톤, 좌측 구리색 액센트 바, 대문자 트래킹
   ═══════════════════════════════════════════════════════════ */
body[data-brand="dps"]{ letter-spacing:-.005em }
body[data-brand="dps"] .site-head{ background:#161b22; border-bottom:1px solid #2b3644 }
body[data-brand="dps"] .brand b{ color:#fff }
body[data-brand="dps"] .brand span{ color:#8b95a5 }
body[data-brand="dps"] .brand .mk{ border-radius:3px; background:var(--c3); font-size:13px }
body[data-brand="dps"] .gnb a{ color:#c9d1dc; border-radius:3px; text-transform:uppercase; font-size:13.5px; letter-spacing:.06em }
body[data-brand="dps"] .gnb a:hover{ background:#232c38; color:#fff }
body[data-brand="dps"] .gnb a.on{ color:#fff }
body[data-brand="dps"] .gnb a.on::after{ background:var(--c3); bottom:6px }
body[data-brand="dps"] .head-tel{ color:#e6ebf1 }
body[data-brand="dps"] .btn{ border-radius:3px; text-transform:uppercase; letter-spacing:.05em; font-size:13.5px }
body[data-brand="dps"] .btn.pri{ background:var(--c3) }
body[data-brand="dps"] .btn.pri:hover{ background:#a95a22 }
body[data-brand="dps"] .burger{ background:#232c38; border-color:#2b3644 }
body[data-brand="dps"] .burger i{ background:#fff }
body[data-brand="dps"] .gnb.open{ background:#161b22 }
body[data-brand="dps"] .gnb.open a.on{ background:#232c38 }
body[data-brand="dps"] .hero{ background:#161b22 }
body[data-brand="dps"] .hero::before{ opacity:1; background:linear-gradient(90deg,rgba(201,111,47,.22),transparent 45%) }
body[data-brand="dps"] .hero::after{
  opacity:.14; mask-image:none; mix-blend-mode:normal;
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.55) 0 1px,transparent 1px 22px);
  background-size:auto;
}
body[data-brand="dps"] .hero .wrap{ padding:110px 24px 120px; border-left:6px solid var(--c3); margin-left:max(24px,calc((100% - var(--maxw)) / 2)); padding-left:34px }
body[data-brand="dps"] .hero .eyebrow{ border:0; padding:0; color:var(--c3); font-size:12px; letter-spacing:.24em; border-radius:0 }
body[data-brand="dps"] .hero h1{ font-weight:800; letter-spacing:-.02em; max-width:22ch }
body[data-brand="dps"] .hero .btn.on-dark{ border-radius:3px; border-color:rgba(255,255,255,.4) }
body[data-brand="dps"] .hero .btn.on-dark:first-child{ background:var(--c3); border-color:var(--c3) }
body[data-brand="dps"] .hero-stats{ background:#0f1318; border-top:1px solid #2b3644 }
body[data-brand="dps"] .hero-stats .v{ color:var(--c3) }
body[data-brand="dps"] .page-head{ background:#161b22 }
body[data-brand="dps"] .page-head::after{ opacity:.14; background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.55) 0 1px,transparent 1px 22px); background-size:auto }
body[data-brand="dps"] .page-head .wrap{ border-left:6px solid var(--c3); padding-left:34px; margin-left:max(24px,calc((100% - var(--maxw)) / 2)) }
body[data-brand="dps"] .subnav a{ text-transform:uppercase; letter-spacing:.06em; font-size:13px }
body[data-brand="dps"] .sec-head .kicker{ letter-spacing:.24em }
body[data-brand="dps"] .sec-head h2{ letter-spacing:-.015em }
body[data-brand="dps"] .card{ border-left:3px solid var(--c3) }
body[data-brand="dps"] .card .ic{ border-radius:3px }
body[data-brand="dps"] .stat{ border-left:3px solid var(--c3) }
body[data-brand="dps"] .chips .chip,body[data-brand="dps"] .filters button,body[data-brand="dps"] .tag,body[data-brand="dps"] .logos span{ border-radius:3px }
body[data-brand="dps"] .cta{ background:#161b22; border-top:4px solid var(--c3) }
body[data-brand="dps"] .site-foot{ background:#0f1318 }
body[data-brand="dps"] .timeline .it::before{ border-radius:2px; border-color:var(--c3) }
body[data-brand="dps"] .fac .row .cr{ border-radius:3px }
@media (max-width:680px){ body[data-brand="dps"] .hero .wrap, body[data-brand="dps"] .page-head .wrap{ margin-left:18px; padding-left:22px } }

/* ═══════════════════════════════════════════════════════════
   사진 (회사홍보 폴더 원본 → assets/img/)
   ═══════════════════════════════════════════════════════════ */

/* 히어로 배경사진 */
.hero.has-photo .hero-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
}
.hero.has-photo::before{
  z-index:1; opacity:1;
  background:linear-gradient(105deg,rgba(10,47,86,.93) 0%,rgba(10,47,86,.80) 45%,rgba(10,47,86,.45) 100%);
}
.hero.has-photo::after{ z-index:1; opacity:.07 }
.hero.has-photo .hero-stats{ background:rgba(6,26,48,.72); backdrop-filter:blur(6px) }

body[data-brand="his"] .hero.has-photo{ color:#fff }
body[data-brand="his"] .hero.has-photo::before{
  background:linear-gradient(180deg,rgba(8,63,71,.55) 0%,rgba(8,63,71,.82) 62%,rgba(8,63,71,.94) 100%);
}
body[data-brand="his"] .hero.has-photo::after{ display:none }
body[data-brand="his"] .hero.has-photo h1{ color:#fff }
body[data-brand="his"] .hero.has-photo .lead{ color:rgba(255,255,255,.9) }
body[data-brand="his"] .hero.has-photo .eyebrow{ background:rgba(255,255,255,.12); color:#fff; border-color:rgba(255,255,255,.34) }
body[data-brand="his"] .hero.has-photo .btn.on-dark{ background:var(--c3); border-color:var(--c3); color:#04343a }
body[data-brand="his"] .hero.has-photo .btn.on-dark:hover{ background:#fff; border-color:#fff }
body[data-brand="his"] .hero.has-photo .btn.on-dark+.btn.on-dark{ background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.4) }
body[data-brand="his"] .hero.has-photo .hero-stats{ background:rgba(4,45,51,.78) }
body[data-brand="his"] .hero.has-photo .hero-stats .v{ color:#fff }
body[data-brand="his"] .hero.has-photo .hero-stats .l{ color:rgba(255,255,255,.92) }
body[data-brand="his"] .hero.has-photo .hero-stats .s{ color:rgba(255,255,255,.62) }
body[data-brand="his"] .hero.has-photo .hero-stats .it{ border-left-color:rgba(255,255,255,.16); border-top-color:rgba(255,255,255,.16) }

body[data-brand="dps"] .hero.has-photo::before{
  background:linear-gradient(100deg,rgba(22,27,34,.95) 0%,rgba(22,27,34,.86) 42%,rgba(22,27,34,.55) 100%);
}
body[data-brand="dps"] .hero.has-photo .hero-stats{ background:rgba(10,13,17,.86) }

/* 사업분야 카드 사진 */
.card.has-photo{ padding:0; display:flex; flex-direction:column }
.card.has-photo .ph{ display:block; aspect-ratio:16/10; overflow:hidden; background:var(--bg-3) }
.card.has-photo .ph img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease }
.card.has-photo:hover .ph img{ transform:scale(1.045) }
.card.has-photo .bd{ display:block; padding:24px 26px 28px }

/* 사업분야 상세 사진 */
.figbox{
  border-radius:var(--radius-lg); overflow:hidden; margin-bottom:20px;
  border:1px solid var(--line); background:var(--bg-3); aspect-ratio:4/3;
}
.figbox img{ width:100%; height:100%; object-fit:cover }

/* 갤러리 */
.gal{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px }
.gal figure{ margin:0 }
.gal figure img{
  width:100%; aspect-ratio:4/3; object-fit:cover; display:block;
  border-radius:var(--radius); border:1px solid var(--line); background:var(--bg-3);
}
.gal figcaption{ margin-top:10px; font-size:13.5px; color:var(--ink-3); font-weight:600; line-height:1.55 }

@media (max-width:900px){ .gal{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:560px){ .gal{ grid-template-columns:1fr } }
@media print{ .hero.has-photo .hero-bg{ display:none } }

/* 히즈: 사진 히어로에서는 물결 장식용 하단 여백을 정상화 */
body[data-brand="his"] .hero.has-photo .wrap{ padding:96px 24px 92px }
@media (max-width:680px){ body[data-brand="his"] .hero.has-photo .wrap{ padding:66px 18px 62px } }

/* ═══════════════════════════════════════════════════════════════
   동아정밀 — 토스 디자인 레이어
   출처: ko-design-md 카탈로그 「토스」 design.md (getdesign.kr/services/toss)
   화이트 캔버스 + 단일 토스 블루 강조 · 평면 표면 + 헤어라인 보더 ·
   공격적 라운드(16~32px, chip/CTA는 999px) · 그림자는 떠 있는 표면에만
   ※ 히즈하이드로·디피에스는 이 레이어의 영향을 받지 않는다(3사 분리)
   ═══════════════════════════════════════════════════════════════ */
body[data-brand="donga"]{
  /* Brand */
  --c1:#2272EB; --c2:#3182F6; --c3:#3182F6; --tint:#EBF2FE; --tint-2:#DCE8FD;
  /* Greyscale (cool-blue tinted) */
  --ink:#191F28; --ink-2:#4E5968; --ink-3:#6B7684; --ink-4:#8B95A1;
  --line:#E5E8EB; --line-2:#D1D6DB;
  --bg:#fff; --bg-2:#F9FAFB; --bg-3:#F2F4F6;
  /* Rounded */
  --radius:16px; --radius-lg:24px;
  /* Elevation — 평면이 기본, 그림자는 floating 표면에만 */
  --shadow:0 4px 12px rgba(23,26,41,.06), 0 1px 2px rgba(23,26,41,.04);
  --shadow-lg:0 12px 32px rgba(23,26,41,.10);
  --head-h:68px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
body[data-brand="donga"]{ font-size:16px; line-height:1.6; letter-spacing:-.005em }
body[data-brand="donga"] h1,body[data-brand="donga"] h2,
body[data-brand="donga"] h3,body[data-brand="donga"] h4{ font-weight:700; letter-spacing:-.02em; line-height:1.3 }

/* ── 헤더: 흰 배경 + 헤어라인 ── */
body[data-brand="donga"] .site-head{ background:rgba(255,255,255,.92); border-bottom:1px solid var(--line) }
body[data-brand="donga"] .brand .mk{ background:var(--c2); border-radius:12px }
body[data-brand="donga"] .gnb a{ border-radius:999px; font-weight:600; color:var(--ink-2) }
body[data-brand="donga"] .gnb a:hover{ background:var(--bg-3); color:var(--ink) }
body[data-brand="donga"] .gnb a.on{ color:var(--c2) }
body[data-brand="donga"] .gnb a.on::after{ display:none }

/* ── 히어로: 화이트 캔버스 + 라운드 사진 카드 ── */
body[data-brand="donga"] .hero{
  display:flex; flex-direction:column; background:#fff; color:var(--ink);
}
body[data-brand="donga"] .hero::before,
body[data-brand="donga"] .hero::after{ display:none }
body[data-brand="donga"] .hero .wrap{ order:1; padding:88px 24px 36px }
body[data-brand="donga"] .hero.has-photo{ color:var(--ink) }
body[data-brand="donga"] .hero.has-photo::before,
body[data-brand="donga"] .hero.has-photo::after{ display:none; background:none }
body[data-brand="donga"] .hero.has-photo .hero-bg{
  order:2; position:relative; inset:auto; width:calc(100% - 48px); max-width:calc(var(--maxw) - 48px);
  margin:0 auto; height:clamp(220px,34vw,420px); object-fit:cover;
  border-radius:32px; opacity:1; filter:none; z-index:0;
}
body[data-brand="donga"] .hero.has-photo .hero-stats{ background:transparent; backdrop-filter:none }
body[data-brand="donga"] .hero.has-photo h1{ color:var(--ink) }
body[data-brand="donga"] .hero.has-photo .lead{ color:var(--ink-3) }
body[data-brand="donga"] .hero.has-photo .eyebrow{ background:var(--tint); color:var(--c2); border:0 }
body[data-brand="donga"] .hero .eyebrow{
  color:var(--c2); background:var(--tint); border:0; font-weight:700;
  letter-spacing:.02em; text-transform:none; font-size:13px; padding:8px 16px; margin-bottom:22px;
}
body[data-brand="donga"] .hero h1{
  font-size:clamp(32px,5vw,56px); font-weight:700; letter-spacing:-.025em; line-height:1.25; color:var(--ink); max-width:17ch;
}
body[data-brand="donga"] .hero .lead{
  margin-top:20px; color:var(--ink-3); font-size:clamp(16px,1.5vw,18px); line-height:1.6; max-width:52ch;
}
body[data-brand="donga"] .hero .acts{ margin-top:30px; gap:10px }

/* 히어로 지표: 흰 배경 + 헤어라인 구분 */
body[data-brand="donga"] .hero-stats{ order:3; border-top:0; margin-top:56px }
body[data-brand="donga"] .hero-stats .wrap{ gap:0; border-top:1px solid var(--line); padding-top:4px }
body[data-brand="donga"] .hero-stats .it{ border-left:1px solid var(--line); padding:28px 24px 8px }
body[data-brand="donga"] .hero-stats .v{ color:var(--ink); font-weight:700; letter-spacing:-.03em; font-variant-numeric:tabular-nums }
body[data-brand="donga"] .hero-stats .l{ color:var(--ink-2); font-weight:600; font-size:15px }
body[data-brand="donga"] .hero-stats .s{ color:var(--ink-4); font-size:13px }

/* ── 버튼: XL 56 / L 48, primary는 화면당 하나 ── */
body[data-brand="donga"] .btn{
  border-radius:16px; font-weight:700; font-size:17px; padding:0 22px; height:52px;
  display:inline-flex; align-items:center; transition:background .12s var(--ease), color .12s var(--ease);
  box-shadow:none;
}
body[data-brand="donga"] .btn.lg{ height:56px; font-size:17px; padding:0 26px }
body[data-brand="donga"] .hero .acts .btn.on-dark:first-child{ background:var(--c2); color:#fff; border:0 }
body[data-brand="donga"] .hero .acts .btn.on-dark:first-child:hover{ background:var(--c1) }
body[data-brand="donga"] .hero .acts .btn.on-dark{ background:var(--bg-3); color:var(--ink); border:0 }
body[data-brand="donga"] .hero .acts .btn.on-dark:hover{ background:var(--line) }
body[data-brand="donga"] .btn.solid,
body[data-brand="donga"] .btn.primary{ background:var(--c2); color:#fff; border:0 }
body[data-brand="donga"] .btn.solid:hover,
body[data-brand="donga"] .btn.primary:hover{ background:var(--c1) }
body[data-brand="donga"] .btn.ghost,
body[data-brand="donga"] .btn.line{ background:var(--bg-3); color:var(--ink); border:0 }

/* ── 서브페이지 헤더: 밝은 회색 표면 ── */
body[data-brand="donga"] .page-head{ background:var(--bg-2); color:var(--ink); border-bottom:1px solid var(--line) }
body[data-brand="donga"] .page-head::after{ display:none }
body[data-brand="donga"] .page-head .wrap{ padding:64px 24px 56px }
body[data-brand="donga"] .page-head h1{ font-size:clamp(28px,3.6vw,40px); font-weight:700; color:var(--ink) }
body[data-brand="donga"] .page-head p{ color:var(--ink-3); font-size:16px }
body[data-brand="donga"] .crumb{ color:var(--ink-4) }
body[data-brand="donga"] .subnav{ background:#fff; border-bottom:1px solid var(--line) }
body[data-brand="donga"] .subnav a{ font-weight:600; border-bottom-width:2px }
body[data-brand="donga"] .subnav a.on{ color:var(--c2); border-bottom-color:var(--c2) }

/* ── 섹션·카드: 평면 + 헤어라인 ── */
body[data-brand="donga"] section{ padding:96px 0 }
body[data-brand="donga"] .sec-head .kicker{
  color:var(--c2); background:var(--tint); display:inline-block;
  border-radius:999px; padding:6px 14px; font-size:12.5px; letter-spacing:.02em; text-transform:none; font-weight:700;
}
body[data-brand="donga"] .sec-head h2{ font-size:clamp(26px,3.2vw,40px); font-weight:700; letter-spacing:-.025em }
body[data-brand="donga"] .sec-head p{ color:var(--ink-3); font-size:17px; line-height:1.6 }
body[data-brand="donga"] .card{
  border-radius:20px; border:1px solid var(--line); box-shadow:none;
  transition:background .16s var(--ease), border-color .16s var(--ease);
}
body[data-brand="donga"] .card.link:hover{ transform:none; box-shadow:none; border-color:var(--line-2); background:var(--bg-2) }
body[data-brand="donga"] .card .ic{ border-radius:16px; background:var(--tint) }
body[data-brand="donga"] .card h3{ font-size:20px; font-weight:700 }
body[data-brand="donga"] .card .en{ color:var(--ink-4); letter-spacing:.06em; font-size:11px }
body[data-brand="donga"] .card p{ color:var(--ink-3); font-size:15px; line-height:1.6 }
body[data-brand="donga"] .card ul li{ background:var(--bg-3); border-radius:999px; padding:6px 12px; font-size:13px; color:var(--ink-2) }
body[data-brand="donga"] .card .more{ color:var(--c2); font-weight:700; font-size:15px }

/* 지표 카드 */
body[data-brand="donga"] .stat{ border-radius:20px; border:1px solid var(--line); background:#fff }
body[data-brand="donga"] .stat .v{ color:var(--ink); font-weight:700; letter-spacing:-.03em; font-variant-numeric:tabular-nums }
body[data-brand="donga"] .stat .l{ font-weight:600; color:var(--ink-2) }
body[data-brand="donga"] .stat .s{ color:var(--ink-4) }

/* 표 */
body[data-brand="donga"] .spec{ border-top:1px solid var(--ink) }
body[data-brand="donga"] .spec th{ background:var(--bg-2); font-weight:600; color:var(--ink-2) }
body[data-brand="donga"] .data-wrap{ border-radius:20px; border:1px solid var(--line) }
body[data-brand="donga"] table.data thead th{ background:var(--bg-2); font-weight:600; border-bottom:1px solid var(--line) }
body[data-brand="donga"] table.data tbody tr:hover{ background:var(--bg-2) }
body[data-brand="donga"] table.data td.yr{ font-variant-numeric:tabular-nums }
body[data-brand="donga"] .tag{ background:var(--tint); color:var(--c2); border-radius:999px; padding:4px 10px; font-weight:600 }

/* 필터: pill */
body[data-brand="donga"] .filters button{ border-radius:999px; border:1px solid var(--line-2); font-weight:600 }
body[data-brand="donga"] .filters button:hover{ background:var(--bg-3); border-color:var(--line-2); color:var(--ink) }
body[data-brand="donga"] .filters button.on{ background:var(--c2); border-color:var(--c2); color:#fff }
body[data-brand="donga"] .filters input{ border-radius:12px; border:1px solid var(--line-2) }
body[data-brand="donga"] .filters input:focus{ outline:0; border:1.5px solid var(--c2) }
body[data-brand="donga"] .count{ background:var(--bg-2); color:var(--ink-4) }

/* 연혁·칩·로고 */
body[data-brand="donga"] .timeline .it::before{ border-color:var(--c2) }
body[data-brand="donga"] .timeline .yr{ color:var(--ink); font-weight:700 }
body[data-brand="donga"] .chips .chip{ border-radius:999px; border:1px solid var(--line); font-weight:600; padding:11px 18px }
body[data-brand="donga"] .chips .chip::before{ color:var(--c2) }
body[data-brand="donga"] .logos span,
body[data-brand="donga"] .logos .lg{ border-radius:999px }

/* 푸터 */
body[data-brand="donga"] .site-foot{ background:var(--bg-2); color:var(--ink-2); border-top:1px solid var(--line) }
body[data-brand="donga"] .site-foot a{ color:var(--ink-2) }
body[data-brand="donga"] .site-foot b,
body[data-brand="donga"] .site-foot strong{ color:var(--ink) }

@media(max-width:820px){
  body[data-brand="donga"] .hero .wrap{ padding:60px 20px 28px }
  body[data-brand="donga"] .hero-bg{ width:calc(100% - 32px); border-radius:24px; height:clamp(180px,44vw,280px) }
  body[data-brand="donga"] .hero-stats{ margin-top:36px }
  body[data-brand="donga"] section{ padding:64px 0 }
}