/* -------------------- 브랜드 스토리 -------------------- */
/* 톤: 올화이트 배경(격자·그라디언트 없음) + 오렌지 포인트 */
/* 2026-08-26 서체·색 정본 정렬: 잉크 #000/#3A3A3C/#7F7F8E, 선 #C9CFDA, kimm 은 hero 만, 제목 OnemobileT 초록, 본문 OnemobileG, 모서리 1rem/0.5rem/알약 */
:root{
  --bg:#FFFFFF;
  --surface:#FFFFFF;
  --surface-2:#F8F9FA;
  --line:#C9CFDA;
  --line-2:#D2DAE3;
  --ink:#000000;
  --ink-2:#3A3A3C;
  --ink-3:#7F7F8E;
  --accent:#FF5900;
  --accent-2:#FF5900; /* 파생 오렌지 없음. 어두운 바탕에서도 포인트색 그대로 */
  --accent-3:#F0F5F6; /* 아이콘·선택 칩 바탕 = 사이트 --bg-gray */
  --oc-green:#265E54;

  --hero:'kimm', -apple-system, BlinkMacSystemFont, sans-serif;
  --display:'OnemobileT', -apple-system, BlinkMacSystemFont, sans-serif;
  --sans:'Pretendard', -apple-system, system-ui, sans-serif;
  --body:'OnemobileG', -apple-system, system-ui, sans-serif; /* 사이트 본문 정본(차주모집 등과 동일) */
}

.bs-page{font-family:var(--body);color:var(--ink);background:#FFF;
  word-break:keep-all;line-height:1.7;font-size:1.6rem;}
.bs-page *{box-sizing:border-box;}
.bs-page img{max-width:100%;display:block;}
.bs-wrap{max-width:1240px;margin:0 auto;padding:0 clamp(20px,4vw,40px);}
.bs-page section{padding:110px 0;background:#FFF;}
@media(max-width:780px){.bs-page section{padding:68px 0;}}

/* 스크롤 리빌 */
.bs-rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1);}
.bs-rv.in{opacity:1;transform:none;}
.bs-rv[data-d="1"]{transition-delay:.12s}
.bs-rv[data-d="2"]{transition-delay:.24s}
.bs-rv[data-d="3"]{transition-delay:.36s}

/* ---------- HERO : 올화이트 ---------- */
.bs-hero{padding:96px 0 100px;}
.bs-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center;}
@media(max-width:940px){.bs-hero-grid{grid-template-columns:1fr;}}

.bs-hero h2{font-family:var(--hero);font-weight:700;font-size:clamp(3.4rem,4.4vw,6rem);
  line-height:1.14;letter-spacing:-0.02em;margin:0 0 26px;}
.bs-hero h2 .it{color:var(--accent);font-style:normal;}
@media(min-width:941px){.bs-hero h2 .nw{white-space:nowrap;}} /* "필요할 땐," 줄내림 방지 */
.bs-hero-sub{font-family:var(--body);font-size:1.6rem;color:var(--ink-2);line-height:1.9;max-width:52ch;}
.bs-hero-sub strong{color:var(--ink);font-weight:700;}

.bs-hero-visual{position:relative;}
.bs-hero-visual .ph{border-radius:1rem;overflow:hidden;box-shadow:0 30px 60px -25px rgba(0,0,0,.35);
  transform:rotate(1.2deg);transition:transform .4s cubic-bezier(.2,.8,.2,1);}
.bs-hero-visual:hover .ph{transform:rotate(0deg) translateY(-6px);}
.bs-hero-visual::before{content:'';position:absolute;inset:18px -14px -14px 18px;border-radius:1rem;
  background:var(--accent-3);z-index:-1;transform:rotate(-1.4deg);}
.bs-hero-visual .cap{margin-top:14px;font-size:1.4rem;color:var(--ink-3);text-align:right;}

/* ---------- 공통 섹션 헤드 (중앙 정렬) ---------- */
.bs-head{display:flex;flex-direction:column;gap:16px;align-items:center;margin-bottom:56px;text-align:center;}
.bs-head h3{font-family:var(--display);font-weight:700;font-size:clamp(2.6rem,3.4vw,3.6rem);
  letter-spacing:-0.02em;line-height:1.2;color:var(--oc-green);}
.bs-head .desc{font-family:var(--body);font-size:1.6rem;color:var(--ink-2);line-height:1.7;max-width:60ch;}

/* ---------- 스토리 : 사진좌+글우 / 글좌+사진우 교차 로우 ---------- */
.bs-story-head{max-width:860px;margin:0 auto 72px;text-align:center;}
.bs-story-head h3{font-family:var(--display);font-weight:700;font-size:clamp(2.6rem,3.4vw,3.6rem);
  letter-spacing:-0.02em;line-height:1.25;color:var(--oc-green);}
.bs-story-head h3 .it{color:var(--accent);font-style:normal;}

.bs-story-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);
  align-items:center;margin-bottom:96px;}
.bs-story-row:last-of-type{margin-bottom:0;}
@media(max-width:840px){
  .bs-story-row{grid-template-columns:1fr;gap:32px;margin-bottom:64px;}
  .bs-story-row .txt{order:2;}   /* 모바일은 사진 먼저, 글 다음 */
  .bs-story-row .ph{order:1;}
}
.bs-story-row .txt p{font-family:var(--body);font-size:1.8rem;color:var(--ink-2);
  line-height:2.05;margin-bottom:34px;}
.bs-story-row .txt p:last-of-type{margin-bottom:0;}
.bs-story-row .txt p strong{color:var(--ink);}
.bs-story-row .ph{border-radius:1rem;overflow:hidden;box-shadow:0 24px 50px -22px rgba(0,0,0,.28);}
.bs-story-row .ph img{transition:transform .6s cubic-bezier(.2,.8,.2,1);width:100%;}
.bs-story-row .ph:hover img{transform:scale(1.03);}

/* ---------- 3가지 약속 ---------- */
.bs-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:960px){.bs-cards{grid-template-columns:1fr;}}
.bs-card{background:#FFF;border:1px solid var(--line);border-radius:1rem;padding:38px 32px;
  transition:all .35s cubic-bezier(.2,.8,.2,1);}
.bs-card:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 30px 60px -25px rgba(255,89,0,.4);}
.bs-card .no{font-family:var(--display);font-weight:700;font-size:1.6rem;color:var(--accent);}
.bs-card h4{font-family:var(--display);font-weight:700;font-size:2.2rem;letter-spacing:-0.02em;margin:14px 0 12px;line-height:1.3;}
.bs-card p{font-family:var(--body);font-size:1.6rem;color:var(--ink-2);line-height:1.75;}

/* ---------- 타임라인 ---------- */
.bs-tl{list-style:none;margin:0 auto;padding:0;position:relative;max-width:760px;}
.bs-tl::before{content:'';position:absolute;left:11px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(180deg,var(--accent) 0%,var(--line-2) 100%);}
.bs-tl li{position:relative;padding:0 0 44px 48px;}
.bs-tl li:last-child{padding-bottom:0;}
.bs-tl li::before{content:'';position:absolute;left:3px;top:6px;width:18px;height:18px;border-radius:50%;
  background:#FFF;border:4px solid var(--accent);}
.bs-tl .when{font-family:var(--display);font-weight:700;font-size:1.6rem;color:var(--accent);}
.bs-tl h4{font-family:var(--display);font-weight:700;font-size:2rem;letter-spacing:-0.02em;margin:6px 0 8px;}
.bs-tl p{font-family:var(--body);font-size:1.6rem;color:var(--ink-2);line-height:1.7;}

/* ---------- 채널 ---------- */
.bs-ch-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:900px;margin:0 auto;}
@media(max-width:720px){.bs-ch-grid{grid-template-columns:1fr;}}
.bs-ch{display:flex;align-items:center;gap:18px;background:#FFF;border:1px solid var(--line);
  border-radius:1rem;padding:26px 28px;text-decoration:none;color:var(--ink);
  transition:all .35s cubic-bezier(.2,.8,.2,1);}
.bs-ch:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 20px 40px -20px rgba(255,89,0,.3);}
.bs-ch .ico{flex:0 0 48px;height:48px;border-radius:0.5rem;display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:700;font-size:2rem;color:#FFF;}
.bs-ch .ico.kakao{background:#FEE500;color:#191919;}
.bs-ch .ico.insta{background:linear-gradient(45deg,#F58529,#DD2A7B 60%,#8134AF);}
.bs-ch .ico.naver{background:#03C75A;}
.bs-ch .ico.google{background:#4285F4;}
.bs-ch .tit{font-weight:700;font-size:1.8rem;letter-spacing:-0.02em;}
.bs-ch .sub{font-size:1.4rem;color:var(--ink-3);margin-top:3px;}
.bs-ch .arr{margin-left:auto;color:var(--accent);font-weight:700;font-size:1.8rem;transition:transform .3s;}
.bs-ch:hover .arr{transform:translateX(4px);}

/* ---------- FAQ ---------- */
.bs-faq{max-width:820px;margin:0 auto;}
.bs-faq details{border-bottom:1px solid var(--line);}
.bs-faq summary{display:flex;align-items:baseline;gap:14px;padding:24px 8px;cursor:pointer;list-style:none;
  font-family:var(--display);font-weight:700;font-size:1.8rem;letter-spacing:-0.02em;line-height:1.5;}
.bs-faq summary::-webkit-details-marker{display:none;}
.bs-faq summary .q{color:var(--accent);font-size:1.6rem;flex:0 0 auto;}
.bs-faq summary::after{content:'+';margin-left:auto;color:var(--ink-3);font-family:var(--sans);font-weight:400;font-size:2.2rem;transition:transform .3s;}
.bs-faq details[open] summary::after{transform:rotate(45deg);color:var(--accent);}
.bs-faq .a{font-family:var(--body);padding:0 8px 26px 37px;font-size:1.6rem;color:var(--ink-2);line-height:1.8;}

/* ---------- 최종 CTA ---------- */
.bs-final .bs-wrap{text-align:center;}
.bs-final h3{font-family:var(--display);font-weight:700;font-size:clamp(2.8rem,4vw,3.6rem);
  letter-spacing:-0.02em;line-height:1.2;margin-bottom:18px;}
.bs-final h3 .it{color:var(--accent);font-style:normal;}
.bs-final p{font-family:var(--body);color:var(--ink-2);font-size:1.6rem;margin-bottom:36px;}
.bs-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.bs-btn{display:inline-flex;align-items:center;gap:8px;padding:18px 34px;border-radius:50rem;
  font-family:var(--body);font-weight:700;font-size:1.6rem;text-decoration:none;
  transition:all .3s cubic-bezier(.2,.8,.2,1);}
.bs-btn-primary{background:var(--accent);color:#FFF;}
.bs-btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(255,89,0,.3);color:#FFF;}
.bs-btn-ghost{background:#FFF;color:var(--ink);border:1.5px solid var(--line-2);}
.bs-btn-ghost:hover{transform:translateY(-2px);border-color:var(--accent);color:var(--accent);}