/* ============================================================
   🐋 OrcaX 공통 밝은 화면 (메인 v2 디자인과 통일)  [2026-11-09 고래]
   /home/orcax/main-server/public/orcax-light.css
   각 안내 페이지의 원래 <style> 뒤에 붙어서 색·글씨·위 막대·맨 아래를 덮어씀
   (내용·기능은 각 페이지 그대로)
   ============================================================ */
:root{
  --bg-deep:#f8fafc; --bg-surface:#ffffff; --bg-elevated:#f1f6f9; --bg-darker:#f1f5f8;
  --border-subtle:#e7edf3; --border-strong:#d3dee7;
  --text-primary:#172b45; --text-secondary:#4b5b6e; --text-muted:#76869a;
  --accent-cyan:#078f9b; --accent-cyan-bright:#0aa5b3; --accent-cyan-dim:#a8d9dd;
  --accent-gold:#9a6f22; --accent-gold-bright:#b4832b; --accent-gold-dim:#e2cfa6;
  --accent-emerald:#168263; --accent-emerald-dim:#a7dcc6;
  --accent-blue:#2563eb; --accent-violet:#6d4fc4; --accent-rose:#c63d72;
  --ox-navy:#123956;
}
html,body{background:var(--bg-deep)!important;color:var(--text-primary)}
body{font-family:'Noto Sans KR','Pretendard Variable',-apple-system,system-ui,sans-serif!important;letter-spacing:-.02em;line-height:1.7}
body::before,body::after{display:none!important}
body *{font-family:inherit!important;font-style:normal!important}

/* ── 위 막대 (메인과 같은 모양) ── */
.ox-bar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid #e7edf3;box-shadow:0 1px 12px rgba(20,45,75,.03)}
.ox-bar .ox-in{max-width:1160px;margin:0 auto;padding:0 20px;height:64px;display:flex;align-items:center;gap:10px}
.ox-logo{display:flex;align-items:center;gap:8px;font-weight:900;font-size:21px;color:var(--ox-navy)!important;text-decoration:none;letter-spacing:-.05em}
.ox-logo span{font-size:24px}
.ox-bar .sp{flex:1}
.ox-back{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #dce6ee;color:var(--ox-navy)!important;text-decoration:none;font-weight:700;font-size:14px;border-radius:10px;padding:8px 14px}
.ox-back:hover{border-color:#078f9b;color:#078f9b!important}
.top-nav{display:none!important}

/* ── 제목: 굵고 또렷하게 (얇은 영문 세리프 → 굵은 한글) ── */
.hero h1,.doc-header h1{font-weight:900!important;font-size:clamp(32px,5.2vw,54px)!important;line-height:1.25!important;letter-spacing:-.05em!important}
.section-heading,.apply-card h2{font-weight:900!important;font-size:clamp(25px,3.4vw,34px)!important;line-height:1.3!important;letter-spacing:-.04em!important}
h3,.article h2{font-weight:800!important;letter-spacing:-.03em!important}
.hero .ko-title,.hero .tagline{font-weight:800}
.big-number .number,.impact .big-number{font-size:clamp(110px,20vw,200px)!important;font-weight:900!important}
.impact .statement,.statement .quote,.closing .quote,.cta-block .quote,.big-number .desc{font-weight:700!important;font-size:clamp(22px,3.2vw,32px)!important;line-height:1.45!important}
.brand-spotlight .brand-mark{font-weight:900!important}
.brand-spotlight::before,.cashback-card .icon-bg,.charge-card::before,.cash-card::before,.about-side::before,.apply-card::before{opacity:.06!important}

/* ── 작은 영문 라벨: 조금 크게, 덜 벌리게 ── */
.eyebrow,.section-label,.label,.a-label,.c-label,.req-label,.who-label,.charge-head,.ex-label,.modal-label,.op-label,.cs-badge,.heritage-item .label,.policy-note .head,.article-num,.num-mark,.b-num,.step-num,.duration,.who,.en,.sig,.signature,.region{letter-spacing:.06em!important;font-size:13px!important}
.hero .eyebrow::before,.hero .eyebrow::after{background:var(--accent-gold-dim)!important}

/* ── 본문 글씨: 어르신도 읽기 쉽게 15~16px ── */
.lede,.section-intro,.biz-intro,.about-text p,.vision-text p,.doc-intro{font-size:16px!important;color:var(--text-secondary)!important}
.desc,.sub,.side-desc,.who-desc,.req-desc,.what-card p,.biz-card p,.step p,.cashback-card p,.duo-card ul li,.earn-step p,.op-card>p,.op-card ul li,.faq-item p,.cs-card p,.note-box .note-body p,.benefit-card p,.how-item .body p,.road-item .body p,.timeline-item .desc,.company-info-side p,.location-info .contacts p,.info-block ul li,.charge-card .features li,.cash-card .features li,.policy-card .info-table td,.service-link-box .info p,.signup-box .info p,.article p,.article ol li,.article ul li,.sub-clause,.modal p,.reward-hint{font-size:15px!important;line-height:1.75!important}
.cat-tag,.hero-pill,.policy-card .info-table th,.info-table th,.info-table td,.bank-row .label,.bank-app-label{font-size:14px!important}
.bank-app-btn .app-name{font-size:12px!important}

/* ── 카드·상자: 흰 카드 + 옅은 그림자 + 둥근 모서리 ── */
.about-side,.biz-card,.what-card,.cashback-card,.duo-card,.cat-tag,.vision-side,.policy-table-wrap,.earn-step,.op-card,.faq-item,.cs-card,.note-box,.req-card,.charge-box,.benefit-card,.how-item,.road-item,.apply-card,.contact-item,.service-link-box,.signup-box,.charge-card,.cash-card,.policy-card,.location-visual,.brand-spotlight,.example-box,.policy-note,.doc-intro,.responsible-box,.signoff,.hero-pill,.modal,.bank-box,.bank-app-btn,.sub-clause{border-radius:16px!important;box-shadow:0 4px 18px rgba(28,56,81,.04)}
.about-side,.biz-card,.what-card,.cashback-card,.duo-card,.vision-side,.earn-step,.op-card,.faq-item,.cs-card,.req-card,.benefit-card,.how-item,.road-item,.service-link-box,.signup-box,.charge-card,.cash-card,.policy-card,.contact-item{background:#fff!important;border:1px solid var(--border-subtle)!important}
.duo-card,.brand-spotlight,.apply-card,.location-visual,.example-box{background:linear-gradient(135deg,#ffffff 0%,#eef7f8 100%)!important}
.charge-card.recommended{background:linear-gradient(135deg,#fff 0%,#fbf6ec 100%)!important;border-color:#e2cfa6!important}
.policy-table th{background:#f3f8fa!important}
.policy-note,.charge-box,.note-box,.example-box{border-left-width:4px!important}
.info-ribbon.popular,.info-ribbon.best,.charge-card .ribbon{color:#fff!important}
.cs-badge{background:#f2edff!important;border-color:#ddd2fb!important}

/* 버튼: 남색·청록 계열, 글씨 흰색 */
.pay-btn,.modal .modal-close{border-radius:12px!important;font-size:15px!important}
.charge-card .pay-btn,.modal .modal-close,.info-block.tier-premium .pay-btn,.info-block.tier-vip .pay-btn,.cash-card .pay-btn{color:#fff!important}
.info-block .pay-btn{border-color:#c9d6df!important}
.info-block .pay-btn:hover{color:#fff!important}
.copy-btn{background:#e9f7f7!important}
.depositor-notice{background:#fdf0f5!important;border-color:#f3c3d6!important}
.modal-backdrop{background:rgba(23,43,69,.55)!important}

/* 이용권 카드(진한 멤버십 카드)는 그대로 진하게 — 글씨 흰색 유지 */
.visual-card,.visual-card *{color:rgba(255,255,255,.95)}
.visual-card{line-height:1.15!important}
.visual-card .vc-num{font-size:clamp(52px,8vw,80px)!important;line-height:.95!important}
.visual-card .vc-type,.visual-card .brand-x,.visual-card .star{color:var(--card-accent)!important}

/* 연혁 점 */
.timeline-item::before{background:#fff!important}
.step .circle{background:#fff!important}

/* ── 맨 아래: 밝은 회색 판 ── */
.site-footer{background:#f1f5f8!important;border-top:1px solid #e4ebf0!important;color:var(--text-muted)!important}
.footer-grid .col h4{font-weight:800!important;font-size:15px!important}
.footer-grid .col p{font-size:14px!important;color:var(--text-secondary)!important}
.footer-grid .col strong{font-size:12px!important;letter-spacing:.04em!important}
.footer-bottom,.footer-bottom .links a{font-size:13px!important}
.footer-bottom .links a{color:var(--text-secondary)!important}

/* ── 운영 방침(Foundation) 전용: 옛 남색 머리·반투명 상자 ── */
.header{background:linear-gradient(115deg,#f0f8fa 0%,#f7fafc 55%,#eef4f8 100%)!important;border-bottom:1px solid #eaf0f4!important;color:var(--text-primary)!important;padding:44px 20px 36px!important}
.header .logo-mark{background:linear-gradient(145deg,#d6eff1,#f7fcfc)!important;border-color:#d9ebee!important}
.header h1{color:var(--ox-navy)!important;font-weight:900!important;font-size:clamp(26px,4vw,38px)!important}
.header .sub{color:var(--text-secondary)!important;font-size:15px!important}
.section{background:#fff!important;border:1px solid var(--border-subtle)!important;border-radius:16px!important;box-shadow:0 4px 18px rgba(28,56,81,.04)}
.section h2{color:var(--ox-navy)!important;font-weight:900!important}
.section p,.section li{color:var(--text-secondary)!important;font-size:15.5px!important}
.section th{background:#f3f8fa!important;color:var(--accent-cyan)!important}
.section td{color:var(--text-secondary)!important;border-bottom-color:#eef2f6!important}
.section .highlight{color:var(--accent-emerald)!important}
.section .warn{color:#b45309!important}
.section .accent{color:var(--accent-cyan)!important}
.nav-link a{background:#fff!important;border:1px solid #dce6ee!important;color:var(--ox-navy)!important;border-radius:12px!important}
.footer-note{color:var(--text-muted)!important;border-top-color:#e4ebf0!important}

@media(max-width:900px){
  .hero{padding-top:48px!important;padding-bottom:40px!important}
  section.block{padding-top:56px!important;padding-bottom:56px!important}
  .ox-bar .ox-in{height:58px}
  .ox-logo{font-size:19px}
}
