/* One reading area for semantic additions and the editable service article. */
body #service-knowledge{--seo-ink:#3b4173;--seo-line:#dde0eb;padding:64px 0;background:#fff;color:var(--seo-ink);font-family:Roboto,Arial,sans-serif;overflow:visible;scroll-margin-top:110px}
body #service-knowledge>.service-knowledge__layout{display:grid;grid-template-columns:250px minmax(0,1fr);align-items:start;gap:64px;width:calc(100% - 64px);max-width:1276px;margin:0 auto;padding:0}
body #service-knowledge .service-knowledge__nav{position:sticky;top:110px;min-width:0;padding-right:22px;border-right:1px solid var(--seo-line)}
body #service-knowledge .service-knowledge__caption{display:block;margin:0 0 20px;color:#c1492e;font-size:13px;line-height:1.4;font-weight:600}
body #service-knowledge .service-knowledge__links{display:flex;flex-direction:column;gap:0;max-height:calc(100dvh - 170px);overflow:auto;scrollbar-width:thin}
body #service-knowledge .service-knowledge__link{display:block;padding:9px 0;color:#3b4173;text-decoration:none;font-size:14px;line-height:1.45;font-weight:400;overflow-wrap:anywhere}
body #service-knowledge .service-knowledge__link--h2{font-weight:600}
body #service-knowledge .service-knowledge__link:hover{color:#c1492e}
body #service-knowledge a:focus-visible{outline:2px solid #c1492e;outline-offset:4px}
body #service-knowledge .service-knowledge__content{min-width:0;max-width:900px}
body #service-knowledge :is(#recording-guide,#texts){margin:0;padding:0;border:0;background:#fff}
body #service-knowledge :is(#recording-guide,#texts)>.kg-wrap{display:block;width:100%;max-width:none;margin:0;padding:0}
body #service-knowledge :is(h2,h3,h4){scroll-margin-top:120px;text-align:left;text-transform:none;text-wrap:pretty;color:#3b4173}
body #service-knowledge #recording-guide #recording-guide-title{max-width:none;margin:0 0 32px;font:600 clamp(30px,3vw,42px)/1.15 Roboto,Arial,sans-serif;letter-spacing:-.035em}
body #service-knowledge #recording-guide .service-semantic-guide__topics{display:block}
body #service-knowledge #recording-guide .service-semantic-guide__topic{display:block;padding:24px 0;margin:0;border:0;border-top:1px solid var(--seo-line);border-radius:0;background:transparent}
body #service-knowledge #recording-guide .service-semantic-guide__topic h3{margin:0 0 16px;font:600 24px/1.3 Roboto,Arial,sans-serif;letter-spacing:-.025em}
body #service-knowledge #recording-guide .service-semantic-guide__topic h3::before{content:none}
body #service-knowledge #recording-guide .service-semantic-guide__topic p{max-width:80ch;margin:0;font:400 16px/1.8 Roboto,Arial,sans-serif}
body #service-knowledge .service-semantic-guide__lead{display:block;margin:0 0 12px;font-weight:500}
body #service-knowledge #texts{margin-top:0}
body #service-knowledge :is(.service-seo-article__chapter,.film-story-section){display:block;margin:0;padding:32px 0;border:0;border-top:1px solid var(--seo-line);border-radius:0;background:#fff}
body #service-knowledge #texts :is(h2,h3){max-width:none;margin:0 0 20px;padding:0;font:600 28px/1.25 Roboto,Arial,sans-serif!important;letter-spacing:-.03em!important}
body #service-knowledge #texts h2{font-size:32px!important}
body #service-knowledge #texts :is(p,li,blockquote){max-width:80ch;font:400 16px/1.8 Roboto,Arial,sans-serif;color:#3b4173;text-align:left}
body #service-knowledge #texts p{margin:0 0 18px}
body #service-knowledge #texts :is(ul,ol){padding-left:22px;margin:20px 0}
body #service-knowledge #texts li{margin-bottom:16px}
body #service-knowledge #texts li::marker{color:#c1492e}
body #service-knowledge #texts .service-seo-article__body--prose{margin:0;max-width:80ch}
body #service-knowledge .film-story-intro{grid-template-columns:1fr;gap:24px}
body #service-knowledge .film-story-compare{grid-template-columns:1fr}
body #service-knowledge .film-story-frames{max-width:560px;margin:24px auto 0}
body #service-knowledge .film-story-shot{margin:24px 0}
body #service-knowledge .cartoon-guide__formats{grid-template-columns:1fr;gap:24px}
body #service-knowledge .cartoon-guide__formats>div+div{padding-left:0;border-left:0}
body #service-knowledge .cartoon-guide__cost{display:block}
body #service-knowledge .game-story__header{display:block;margin-bottom:28px}
body #service-knowledge .game-story__process ol{grid-template-columns:repeat(2,minmax(0,1fr))}
body #service-knowledge .game-story__details{grid-template-columns:1fr}
/* Keep the entire article indexable, with a compact native disclosure per topic. */
body #service-knowledge .knowledge-chapter{margin:0;padding:0;border:0;border-top:1px solid #dde0eb;border-radius:0;background:#fff}
body #service-knowledge .knowledge-chapter>summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px;padding:20px 0;list-style:none;cursor:pointer;color:#3b4173;font:600 22px/1.3 Roboto,Arial,sans-serif}
body #service-knowledge .knowledge-chapter>summary::-webkit-details-marker{display:none}
body #service-knowledge .knowledge-chapter>summary::after{content:'+';transform:none;position:static;display:flex;align-items:center;justify-content:center;flex:0 0 32px;height:32px;border:1px solid #dde0eb;border-radius:50%;color:#c1492e;text-align:center;font:400 22px/1 Arial,sans-serif}
body #service-knowledge .knowledge-chapter[open]>summary::after{content:'−'}
body #service-knowledge .knowledge-chapter>summary:is(:hover,:focus-visible){color:#c1492e}
body #service-knowledge .knowledge-chapter>summary:focus-visible{outline:2px solid #c1492e;outline-offset:4px}
body #service-knowledge .knowledge-chapter>summary :is(h2,h3){margin:0!important;padding:0!important;color:inherit;font:600 22px/1.3 Roboto,Arial,sans-serif!important;letter-spacing:-.025em!important}
body #service-knowledge .knowledge-chapter__body{padding:0 0 24px;min-width:0}
body #service-knowledge #recording-guide .knowledge-chapter .service-semantic-guide__topic,
body #service-knowledge .knowledge-chapter :is(.service-seo-article__chapter,.film-story-section){margin:0;padding:0;border:0}
body #service-knowledge .knowledge-chapter #texts{margin-top:0}
/* A small service diagram makes the materials, work and result tangible. */
body #service-knowledge .knowledge-flow{display:grid;grid-template-columns:minmax(0,1fr) 20px minmax(0,1.3fr) 20px minmax(0,1fr);align-items:center;gap:12px;margin:0 0 24px;padding:18px 20px;border:1px solid #dde0eb;border-radius:18px;background:#fff}
body #service-knowledge .knowledge-flow__stage{min-width:0;text-align:center}
body #service-knowledge .knowledge-flow__stage>div{display:flex;align-items:center;justify-content:center;height:64px;margin:0 auto 10px}
body #service-knowledge .knowledge-flow svg{display:block;width:112px;height:80px;stroke:#3b4173;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
body #service-knowledge .knowledge-flow__source{transform:rotate(-5deg)}
body #service-knowledge .knowledge-flow__result svg{stroke:#c1492e}
body #service-knowledge .knowledge-flow__connector{color:#c1492e;font-size:24px;padding-bottom:28px}
body #service-knowledge .knowledge-flow__track{gap:3px}
body #service-knowledge .knowledge-flow__track i{display:block;flex:0 1 3px;height:var(--signal);background:#c1492e;border-radius:3px}
body #service-knowledge .knowledge-flow .knowledge-flow__caption{color:#3b4173;font:500 14px/1.45 Roboto,Arial,sans-serif}
body #service-knowledge #texts .service-seo-article__body>ul{display:grid;gap:12px;padding:0;list-style:none}
body #service-knowledge #texts .service-seo-article__body>ul>li{margin:0;padding:18px 20px;border-left:3px solid #c1492e;border-radius:0 10px 10px 0;background:#f8f9fc}
body #service-knowledge #texts .service-seo-article__body>ul>li>strong:first-child{display:block;margin-bottom:8px;font-size:18px}
@media(max-width:1000px){
 body #service-knowledge>.service-knowledge__layout{grid-template-columns:200px minmax(0,1fr);gap:32px}
}
@media(max-width:760px){
 body #service-knowledge{padding:36px 0}
 body #service-knowledge>.service-knowledge__layout{display:block;width:calc(100% - 32px)}
 body #service-knowledge .service-knowledge__nav{position:static;padding:0 0 20px;margin-bottom:28px;border-right:0;border-bottom:1px solid var(--seo-line)}
 body #service-knowledge .service-knowledge__caption{margin-bottom:10px}
 body #service-knowledge .service-knowledge__links{flex-direction:row;gap:10px;max-height:none;overflow:auto;padding:3px 3px 10px;scroll-snap-type:x proximity}
 body #service-knowledge .service-knowledge__link{flex:0 0 auto;max-width:240px;padding:10px 14px;border:1px solid var(--seo-line);border-radius:8px;font-size:13px;scroll-snap-align:start}
 body #service-knowledge #recording-guide #recording-guide-title{font-size:30px;margin-bottom:24px}
 body #service-knowledge #texts h2{font-size:28px!important}
 body #service-knowledge #texts h3{font-size:24px!important}
 body #service-knowledge .game-story__process ol{grid-template-columns:1fr}
 body #service-knowledge .knowledge-flow{grid-template-columns:minmax(0,1fr) 14px minmax(0,1.2fr) 14px minmax(0,1fr);gap:4px;padding:20px 10px;margin-bottom:24px}
 body #service-knowledge .knowledge-flow__stage>div{height:62px;margin-bottom:10px}
 body #service-knowledge .knowledge-flow svg{width:80px;height:58px;max-width:100%}
 body #service-knowledge .knowledge-flow__track{gap:2px;transform:scaleY(.75)}
 body #service-knowledge .knowledge-flow__track i{flex-basis:2px}
 body #service-knowledge .knowledge-flow .knowledge-flow__caption{font-size:12px;line-height:1.4}
 body #service-knowledge .knowledge-flow__connector{font-size:19px;padding-bottom:34px}
}

/* Summary titles share one visual rank, independent of retained SEO heading levels. */
body #service-knowledge .knowledge-chapter>summary :is(h2,h3),
body #service-knowledge :is(#texts,#recording-guide) .knowledge-chapter>summary :is(h2,h3){display:block;flex:1;max-width:none;margin:0!important;padding:0!important;font:600 clamp(19px,1.55vw,22px)/1.35 Roboto,Arial,sans-serif!important;letter-spacing:-.02em!important;color:inherit;text-align:left}
body #service-knowledge .knowledge-chapter:last-child{border-bottom:1px solid #dde0eb}
/* Override legacy #start typography without changing semantic H2/H3 levels. */
body:has(#start.service-page) #service-knowledge .knowledge-chapter>summary :is(h2,h3)[id]{font:600 clamp(19px,1.55vw,22px)/1.35 Roboto,Arial,sans-serif!important;letter-spacing:-.02em!important}
/* One left-aligned reading column with the same orange accent in every chapter. */
body #service-knowledge #texts .service-seo-article__chapter{display:block;grid-template-columns:none;gap:0}
body #service-knowledge #texts .service-seo-article__body{width:100%;max-width:none;margin:0;grid-column:auto}
body #service-knowledge .knowledge-chapter__body{padding:0 0 0 20px;margin:0 0 24px;border-left:3px solid #c1492e}
body #service-knowledge #texts .service-seo-article__body>ul>li{border-left:0;padding:16px 18px;border-radius:8px}
@media(max-width:760px){body #service-knowledge .knowledge-chapter__body{padding-left:14px}}
body:has(#start.service-page) #service-knowledge #texts summary :is(h2,h3)[id]{font:600 clamp(19px,1.55vw,22px)/1.35 Roboto,Arial,sans-serif!important;letter-spacing:-.02em!important}

body #service-knowledge .knowledge-chapter>summary{font-size:clamp(19px,1.55vw,22px)}
