:root {
  --bg: #ffffff;
  --bg-alt: #f7f7f5;
  --surface: #ffffff;
  --surface-2: #f0f0ed;
  --line: #dfdfda;
  --text: #202020;
  --fg: #202020;
  --sub: #60605b;
  --brand: #ffd54a;
  --brand-deep: #edbd29;
  --on-brand: #201a05;
  --radius: 16px;
  --wrap: 1200px;
  --header-h: 80px;
  --space-section: clamp(56px, 7vw, 104px);
  --space-card-y: 30px;
  --space-card-x: 26px;
  color-scheme: light;
}
header { background: rgba(255,255,255,.96); border-bottom-color: #ecece8; }
nav a { font-size: 13px; padding-inline: 10px; color: #42423f; }
nav a.nav-cta { border-radius: 999px; padding-inline: 20px; }
#hero { background: #fff; padding-top: 40px; }
.player { box-shadow: 0 18px 46px rgba(25,25,20,.12); border-color: #252525; border-radius: 18px; }
.player-screen { --text: #f5f5f5; color: #f5f5f5; }
.player-copy h1 { font-size: clamp(28px, 4.4vw, 54px); letter-spacing: -.035em; }
.player-actions .btn-ghost { color: #fff; background: rgba(15,15,15,.4); border-color: #777; }
.watch-meta { margin-top: 28px; }
.watch-title { font-size: clamp(16px, 1.7vw, 21px); }
.channel-row { margin-top: 22px; gap: 16px; }
.chip { border: 1px solid #e8e8e3; background: #f5f5f2; }
#stats { background: #f8f8f5; }
.stat-en, .stat-num small { color: #646044; }
.stat-num { letter-spacing: -.045em; }
.stat-label { color: #53534e; }
.section-head { border-top-color: #d8d8d1; padding-top: 24px; }
.eyebrow { color: #62521a; font-size: 12px; letter-spacing: .16em; }
.eyebrow::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #ffd54a; }
h2 { letter-spacing: -.035em; font-weight: 800; }
.lead { color: #555550; }
.pillar, .sub-card, .voice-card, .flow-step, .contact-cta { box-shadow: 0 4px 14px rgba(30,30,20,.025); }
.pillar::before { height: 3px; background: #ffd54a; }
.pillar-ico { background: #fff6d1; }
.pillar-ico svg { fill: #75601b; }
.pipe-step { border-radius: 10px; padding-inline: 24px; }
.pipe-arrow { color: #75601b; }
.pipe-tip { border-color: #d9d9d2; box-shadow: 0 8px 26px rgba(20,20,10,.1); }
.ch-grid { gap: 32px 24px; }
.ch-thumb { border-radius: 14px; border-color: #ddd; }
.ch-role, .ch-avatar, .voice-name, .sub-card .sub-link, .profile-name small, .achv-item b, .company-table a, .value-head, .faq-q, .faq-mark { color: #715a12; }
.ch-thumb .badge b, .ch-thumb .badge-live { color: #ffd54a; }
.sub-card .sub-ico { color: #715a12; }
.profile-bio { color: #555550; }
.voice-quote::before { color: #94740a; }
.contact-cta { background: #fff9e5; }
.field input, .field textarea { background: #fff; border-color: #d1d1c9; }
.btn-ghost { color: #282823; background: #fff; border-color: #c8c8c0; }
.btn-ghost:hover, .sns-btn:hover, .works-toggle:hover, .media-links a:hover { color: #715a12; border-color: #a68b2d; }
.ai-fab-btn { box-shadow: 0 5px 18px rgba(25,25,10,.13); }
.ai-fab-wrap { pointer-events: none; }
.ai-fab-btn, .ai-fab-wrap.open .ai-fab-menu { pointer-events: auto; }
@media(min-width:1024px) and (max-width:1180px) { nav a { padding-inline: 6px; font-size: 12px; } }
@media(max-width:720px) {
  :root { --header-h: 68px; --space-card-y: 24px; --space-card-x: 22px; }
  #hero { padding-top: 22px; }
  .player-copy { background: #fff; color: #202020; padding: 26px 20px; }
  .player-copy h1 { text-shadow: none; font-size: 29px; letter-spacing: -.04em; }
  .player-copy h1 em { color: #202020; text-decoration: underline; text-decoration-color: #ffd54a; text-decoration-thickness: 5px; text-underline-offset: 5px; }
  .player-sub { color: #555550; }
  .player-actions .btn-ghost { background: #fff; color: #202020; border-color: #bdbdb4; }
  .player { border-color: #deded6; box-shadow: 0 10px 26px rgba(25,25,15,.08); }
  .channel-row { gap: 10px; }
  .watch-meta { margin-top: 22px; }
  .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat-num { font-size: 38px; }
  .stat-en { font-size: 10px; letter-spacing: .1em; }
}

:root { --wrap:1360px; --header-h:88px; --space-section:clamp(72px,8vw,128px); --radius:8px; --text:#171a18; --sub:#5d625b; --bg-alt:#f5f5f1; }
.wrap { padding-inline:48px; }
.logo { font-size:21px; letter-spacing:-.04em; }
.logo-mark { width:38px; height:38px; border-radius:11px; }
nav a { font-size:12px; padding-inline:9px; }
nav a.nav-cta { border-radius:6px; padding-inline:21px; }
#hero { background:#fff; padding:76px 0 0; overflow:hidden; }
.player { border:0; background:none; box-shadow:none; overflow:visible; border-radius:0; }
.player-screen { display:grid; grid-template-columns:.94fr 1.06fr; gap:60px; align-items:center; aspect-ratio:auto; background:none; color:#171a18; --text:#171a18; }
.player-copy { grid-column:1; grid-row:1; max-width:none; padding:0 0 20px; color:#171a18; }
.hero-kicker { display:flex; align-items:center; gap:10px; font-size:12px; font-weight:800; letter-spacing:.1em; margin-bottom:27px; }
.hero-kicker::before { content:''; width:28px; height:3px; background:#171a18; }
.player-copy h1 { font-size:clamp(38px,4.5vw,65px); line-height:1.4; letter-spacing:-.065em; text-shadow:none; }
.player-copy h1 em { color:#171a18; background:linear-gradient(transparent 68%,#ffd54a 68%,#ffd54a 92%,transparent 92%); text-decoration:none; }
.player-sub { font-size:15px; color:#535950; margin-top:27px; line-height:2; max-width:31em; }
.player-actions { gap:12px; margin-top:31px; }
.btn { border-radius:6px; min-height:52px; font-size:14px; padding-inline:25px; }
.btn-primary { background:#171a18; color:#fff; }
.btn-primary:hover { background:#343a34; color:#fff; }
.player-actions .btn-primary { background:#ffd54a; color:#171a18; }
.btn-ghost,.player-actions .btn-ghost { color:#171a18; border-color:#a5aaa1; background:transparent; }
.player-media { grid-column:2; grid-row:1; position:relative; inset:auto; width:100%; aspect-ratio:4/3; background:#101210; border-radius:12px; box-shadow:20px 20px 0 #ffd54a; isolation:isolate; }
.player-video { border-radius:12px; object-fit:cover; opacity:1; }
.player-media::after { display:none; }
.player-chrome { border-radius:0 0 12px 12px; padding:62px 20px 15px; }
.watch-meta { margin-top:66px; padding:24px 0 31px; border-top:1px solid #dcdcd4; }
.watch-title { font-size:13px; font-weight:600; color:#535950; }
.channel-row { margin-top:16px; gap:20px; }
.channel-name { font-size:17px; }
.channel-sub { font-size:12px; margin-top:3px; }
.avatar { width:48px; height:48px; }
.channel-row .btn { min-height:42px; margin-left:auto; }
.watch-chips { margin-left:0; }
.chip { background:#f3f3ee; border-radius:6px; min-height:34px; font-size:12px; }
#stats { background:#171d19; border:0; padding:48px 0; }
.stats-grid { gap:32px; }
.stat { padding-right:24px; border-right:1px solid #424a42; }
.stat:last-child { border-right:0; }
.stat-en { color:#bcc3b8; font-size:10px; letter-spacing:.16em; margin-bottom:18px; }
.stat-num { color:#fff; font-size:clamp(42px,4.6vw,68px); letter-spacing:-.05em; }
.stat-num small { color:#ffd54a; }
.stat-label { color:#c4cac0; border:0; padding-top:0; margin-top:16px; font-size:12px; }
.section-head { display:grid; grid-template-columns:180px 1fr; align-items:start; gap:12px 48px; border:0; padding-top:0; margin-bottom:48px; }
.section-head .eyebrow { padding-top:13px; font-size:11px; color:#454d42; }
h2 { font-size:clamp(30px,3.3vw,46px); line-height:1.45; letter-spacing:-.045em; margin:0; }
.section-head .lead { grid-column:2; margin:0; font-size:14px; line-height:2; max-width:52em; }
.pipeline { border-bottom:1px solid #dcdcd4; padding-bottom:30px; margin-bottom:36px; gap:14px; }
.pipe-step { border-radius:5px; border:0; background:#edf0e9; padding-inline:26px; min-height:48px; font-size:14px; }
.pillar-grid { gap:0; }
.pillar { border:0; border-right:1px solid #dcdcd4; border-radius:0; padding:6px 36px 0; background:none; box-shadow:none; }
.pillar:first-child { padding-left:0; }
.pillar:last-child { border:0; padding-right:0; }
.pillar::before { display:none; }
.pillar-ico { width:54px; height:54px; background:#ffd54a; border-radius:50%; margin-bottom:26px; }
.pillar-ico svg { fill:#171a18; }
.pillar h3 { font-size:23px; margin-bottom:14px; letter-spacing:-.03em; }
.pillar p { line-height:2; }
#works { background:#f3f4ef; }
.ch-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px 28px; }
.ch-thumb { border-radius:8px; border:0; }
.ch-card-link .ch-thumb { transition:transform .3s; }
.ch-card-link:hover .ch-thumb { transform:translateY(-5px); }
.ch-body { margin-top:18px; }
.ch-name { font-size:16px; min-height:0; }
.ch-role { color:#65705d; font-weight:500; margin-top:7px; }
.works-toggle { min-height:48px; padding-inline:36px; border-radius:6px; background:#fff; }
.marquee { padding:32px 0; margin-block:60px; }
.voice-grid { gap:0; }
.voice-card { border:0; border-left:2px solid #d0d5c9; border-radius:0; background:transparent; padding:4px 26px; box-shadow:none; }
.voice-quote { font-size:14px; }
.voice-name { color:#505c47; }
.sub-grid { gap:0 40px; }
.sub-card { border:0; border-top:1px solid #cccfc5; border-radius:0; padding:30px 0; background:none; box-shadow:none; }
.sub-card:hover { transform:none; border-color:#171a18; }
.sub-card h3 { font-size:20px; }
.flow-grid { gap:24px; }
.flow-step { border:0; border-radius:0; border-top:2px solid #b9c2b0; background:none; padding:24px 0 0; box-shadow:none; }
.flow-num { width:auto; height:auto; background:none; font-size:40px; color:#737f65; margin-bottom:18px; }
.faq-list { gap:0; }
.faq-item { border:0; border-bottom:1px solid #dcdcd4; border-radius:0; }
.faq-item summary { padding:26px 0; font-size:17px; }
.faq-a { padding-left:30px; }
.profile-photo { width:100%; height:320px; border:0; border-radius:8px; }
.profile-bio { line-height:2; }
.achv-item { background:#f1f3ec; border:0; border-radius:4px; }
.company-table th,.company-table td { padding-block:22px; }
#contact { background:#edf0e6; }
.contact-cta { border:0; background:#fff; padding:38px; border-radius:8px; }
.field input,.field textarea { border:1px solid #c3cbb9; background:#fff; border-radius:5px; }
@media(max-width:1180px) {
  .wrap { padding-inline:32px; }
  nav a { font-size:11px; padding-inline:6px; }
  nav a.nav-cta { margin-left:4px; padding-inline:12px; }
  .player-screen { gap:36px; }
  .player-copy h1 { font-size:44px; }
  .player-sub { font-size:14px; }
  .section-head { grid-template-columns:140px 1fr; gap:16px 32px; }
}
@media(max-width:880px) {
  :root { --header-h:74px; }
  .wrap { padding-inline:28px; }
  #hero { padding-top:42px; }
  .player-screen { grid-template-columns:1fr; gap:34px; }
  .player-copy { grid-column:1; grid-row:1; padding:0; }
  .player-copy h1 { font-size:clamp(36px,6.2vw,55px); }
  .player-media { grid-column:1; grid-row:2; aspect-ratio:16/9; max-width:none; box-shadow:12px 12px 0 #ffd54a; }
  .player-sub { max-width:42em; }
  .watch-meta { margin-top:45px; }
  .channel-id { flex-basis:100%; }
  .channel-row .btn { margin-left:0; }
  .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px 24px; }
  .stat:nth-child(2) { border:0; }
  .section-head { grid-template-columns:1fr; gap:15px; }
  .section-head .lead { grid-column:1; }
  .section-head .eyebrow { padding:0; }
  .pillar-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .pillar { padding-inline:18px; }
  .pillar h3 { font-size:19px; }
  .ch-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .profile-photo { width:280px; }
}
@media(max-width:560px) {
  .wrap { padding-inline:24px; }
  .hero-kicker { font-size:11px; margin-bottom:20px; }
  .player-copy h1 { font-size:38px; line-height:1.4; }
  .player-copy h1 .nb { white-space:normal; }
  .player-copy { background:#fff; }
  .player-sub { font-size:13px; margin-top:23px; }
  .player-actions { margin-top:26px; gap:10px; }
  .player-actions .btn { padding-inline:18px; }
  .player-chrome { padding:40px 12px 10px; }
  .watch-title { font-size:12px; }
  .watch-meta { padding-bottom:26px; }
  .channel-sub { font-size:11px; }
  .channel-name { font-size:15px; }
  #stats { padding-block:36px; }
  .stat { padding-right:12px; }
  .stat-num { font-size:39px; }
  .stat-en { font-size:9px; letter-spacing:.1em; }
  .stat-label { font-size:11px; }
  .pillar-grid,.ch-grid { grid-template-columns:1fr; }
  .pillar,.pillar:first-child,.pillar:last-child { padding:25px 0; border:0; border-bottom:1px solid #dcdcd4; }
  .pillar-ico { margin-bottom:18px; }
  .pillar h3 { font-size:23px; }
  .pipeline { gap:8px; }
  .pipe-step { padding-inline:15px; }
  .voice-grid { gap:26px; }
  .contact-cta { padding:26px; }
}

.fullscreen-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 6px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #fff;
  cursor: pointer;
  pointer-events: auto;
}
.fullscreen-toggle[hidden] { display: none; }
.fullscreen-toggle:hover { background: rgba(255,255,255,.18); }
.fullscreen-status { position: absolute; z-index: 5; bottom: 76px; left: 16px; right: 16px; padding: 12px; background: #171a18; color: #fff; font-size: 13px; }
.player-media:fullscreen { position: fixed; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; border-radius: 0; box-shadow: none; background: #000; }
.player-media:fullscreen .player-video { object-fit: contain; border-radius: 0; }
.player-media:-webkit-full-screen { position: fixed; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; border-radius: 0; box-shadow: none; background: #000; }
.player-media:-webkit-full-screen .player-video { object-fit: contain; border-radius: 0; }
@media (pointer: coarse) { .fullscreen-toggle { width: 44px; height: 44px; padding: 12px; } }