/* ============================================================
   해외선물 카테고리 공통 스타일
   (overseas-intro.html / overseas-market.html / overseas-products.html 공유)
   ============================================================ */

/* 브레드크럼 구분 아이콘 (3형제 페이지 공통, domestic.css와 동일 패턴) */
.page-hero .crumbs i{margin:0 8px;font-size:11px;opacity:.7;}
.page-hero .crumbs a:hover{color:#fff;}

/* ------------------------------------------------------------
   해외선물 3형제(이란?/상품구분/시장구성) 공통 상단 레이아웃
   page-hero 다음, sub-tabs 앞에 오는 리드 섹션 — 3페이지 모두 동일한
   높이를 갖도록(탭 위치 고정) 여기서 한 곳에만 정의한다.
   ------------------------------------------------------------ */
.ov-lead-section{padding-top:70px;}
@media (max-width:768px){
  .ov-lead-section{padding-top:44px;}
}

/* 상단 인트로: 텍스트 + 이미지 2컬럼 (dom-intro-hero와 동일 패턴) */
.ov-intro-hero{
  display:flex;align-items:center;justify-content:space-between;gap:40px;
  padding-bottom:60px;margin-bottom:60px;
  border-bottom:1px solid var(--border-light);
}
.ov-intro-copy{flex:1;min-width:0;}
.ov-lead-term{font-size:32px;font-weight:700;line-height:1.4;color:var(--text);margin-bottom:22px;}
.ov-lead-term .blue{color:var(--blue);}
.ov-lead-desc p{font-size:16px;line-height:1.75;color:var(--text-sub);}
.ov-intro-image{flex:0 0 auto;width:510px;max-width:44%;}
.ov-intro-image img{border-radius:12px;width:100%;}

/* 정의 설명 리드 문구 (해외선물시장이란? 섹션 상단) */
.ov-overview{font-size:15px;line-height:1.85;color:var(--text-sub);margin-bottom:40px;}
.ov-overview strong{color:var(--text);font-weight:700;}

/* 해외 주요 선물거래소: 2x2 카드 그리드 */
.exchange-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:24px;
}
.exchange-card{
  background:var(--bg-soft);
  border:1px solid var(--border-light);
  border-radius:10px;
  padding:28px 30px;
}
.exchange-card h3{
  font-size:19px;font-weight:700;color:var(--blue);
  padding-bottom:14px;margin-bottom:16px;
  border-bottom:1px solid var(--border);
}
.exchange-desc{font-size:15px;line-height:1.85;color:var(--text-sub);margin-bottom:16px;}
.exchange-meta{font-size:15px;line-height:1.85;font-weight:700;color:var(--text);margin-top:16px;}
.exchange-meta:first-of-type{margin-top:0;}
.exchange-meta span{color:var(--text);}
.exchange-products-label{font-size:15px;line-height:1.85;font-weight:700;color:var(--text);margin-top:18px;margin-bottom:4px;}
.exchange-products li{font-size:15px;line-height:1.85;color:var(--text-sub);}
.exchange-site a{color:var(--blue);text-decoration:underline;word-break:break-all;}

/* ===== Tablet ===== */
@media (max-width:1024px){
  .ov-intro-image{width:400px;}
}

/* ===== Mobile ===== */
@media (max-width:768px){
  .ov-intro-hero{flex-direction:column;align-items:stretch;gap:24px;padding-bottom:40px;margin-bottom:40px;}
  .ov-intro-image{width:100%;max-width:100%;order:-1;}
  .ov-lead-term{font-size:24px;}
  .ov-lead-desc p{font-size:14px;}

  .exchange-grid{grid-template-columns:1fr;gap:16px;}
  .exchange-card{padding:22px 20px;}
}