/* Scoped to the editable Mangocraft about template. */
.mg-about-page {--about-radius:16px}
#body-wrap.mg-about-page > #page-header + #content-inner {width:min(1200px,calc(100% - 64px));max-width:none;margin:0 auto!important;padding:64px 0 0!important;display:block}
.mg-about-hero {display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center;padding-bottom:64px;border-bottom:1px solid var(--mg-line)}
.mg-about-eyebrow {font-size:10px;font-weight:600;letter-spacing:.16em;color:var(--mg-muted)}
.mg-about-hero h1 {font-size:clamp(36px,4.6vw,66px);line-height:1.15;margin:25px 0 20px;letter-spacing:-.05em;color:var(--mg-text)}
.mg-about-tagline {font-size:clamp(24px,2.6vw,36px);line-height:1.5;font-weight:650;margin:0 0 18px;letter-spacing:-.04em}
.mg-about-tagline span {color:var(--heo-theme)}
.mg-about-summary {color:var(--mg-muted);font-size:14px;line-height:1.9;margin:0 0 24px;max-width:470px}
.mg-about-art {height:390px;position:relative;overflow:hidden;border-radius:var(--about-radius);background:#ffcf63}
.mg-about-cover {width:100%;height:100%;object-fit:cover;display:block}
.mg-about-mark {height:100%;position:relative;padding:32px;background:linear-gradient(145deg,#ffeab4,#ffc552)}
.mg-about-mark>img {position:absolute;top:30px;right:30px;width:85px;height:85px;object-fit:contain;transform:rotate(-12deg)}
.mg-about-orbit {position:absolute;width:320px;height:320px;border:1px solid #a9662633;border-radius:50%;right:-90px;top:75px;box-shadow:0 0 0 36px #fff2cc35,0 0 0 74px #fff2cc25}
.mg-about-art-word {position:absolute;left:32px;bottom:32px;font-size:clamp(42px,5.6vw,76px);font-weight:850;line-height:.92;letter-spacing:-.07em;color:#75421d}
.mg-about-art-word>span {display:block;margin-top:23px;font-size:12px;font-weight:500;letter-spacing:.25em}
.mg-about-reading {display:grid;grid-template-columns:220px minmax(0,1fr);gap:64px;margin:56px 0 80px;align-items:start;scroll-margin-top:110px}
.mg-about-guide {position:sticky;top:110px;max-height:calc(100svh - 140px);overflow:auto;padding-right:15px}
.mg-about-guide[hidden] {display:none}
#mg-about-toc {display:flex;flex-direction:column;gap:4px;margin-top:22px}
#mg-about-toc a {display:flex;align-items:baseline;gap:12px;padding:10px 0;font-size:12px;line-height:1.7;color:var(--mg-muted);border-bottom:1px solid var(--mg-line)}
#mg-about-toc a span {font-size:9px;color:var(--heo-theme);font-variant-numeric:tabular-nums}
#mg-about-toc a:hover,.mg-about-back:hover {color:var(--heo-theme)}
.mg-about-back {display:block;font-size:11px;color:var(--mg-muted);margin-top:24px}
.mg-about-body {min-width:0}
.mg-about-page #article-container {font-size:16px!important;line-height:2;overflow-wrap:anywhere}
.mg-about-page #article-container h1 {font-size:22px;margin:0 0 20px}
.mg-about-page #article-container h2 {margin:0 0 20px!important;font-size:26px!important;line-height:1.5;letter-spacing:-.025em;color:var(--mg-text);scroll-margin-top:110px}
.mg-about-page #article-container h3 {font-size:20px;scroll-margin-top:110px}
.mg-about-page #article-container p {margin:0 0 18px}
.mg-about-page #article-container img {max-width:100%;height:auto;border-radius:var(--about-radius);display:block;margin:24px auto}
.mg-about-page #article-container>p:has(img:only-child) img {max-height:220px;object-fit:contain}
.mg-about-section {padding:30px 32px;margin:0 0 24px;border:1px solid var(--mg-line);background:var(--mg-surface);border-radius:var(--about-radius)}
.mg-about-section>:last-child {margin-bottom:0!important}
.mg-about-page .mg-about-section ul {padding-left:22px}
.mg-about-page .mg-about-section blockquote {border-left:3px solid var(--mg-accent);padding:16px 20px;background:var(--mg-soft);border-radius:0 10px 10px 0}
.mg-about-timeline>p {position:relative;padding:0 0 22px 24px;margin:0!important;border-left:1px solid var(--mg-line);font-size:14px}
.mg-about-timeline>p::before {content:'';position:absolute;left:-4px;top:10px;width:7px;height:7px;border-radius:50%;background:var(--mg-accent)}
.mg-about-no-toc {grid-template-columns:minmax(0,850px);justify-content:center}
#mg-about-title {scroll-margin-top:110px}
@media(max-width:900px){
 .mg-about-hero{gap:32px}.mg-about-art{height:330px}
 .mg-about-reading{grid-template-columns:170px minmax(0,1fr);gap:28px}
 .mg-about-section{padding:24px}
}
@media(max-width:768px){
 #body-wrap.mg-about-page > #page-header + #content-inner{width:calc(100% - 40px);padding:36px 0 0!important}
 .mg-about-hero{grid-template-columns:1fr;gap:28px;padding-bottom:32px}
 .mg-about-hero h1{margin-top:16px}.mg-about-art{height:270px}.mg-about-art-word{font-size:58px}
 .mg-about-reading{display:block;margin:30px 0 48px}
 .mg-about-guide{position:static;max-height:none;overflow:visible;padding:0 0 24px}
 #mg-about-toc{display:flex;flex-flow:row nowrap;overflow:auto;gap:8px;margin-top:14px;padding-bottom:8px}
 #mg-about-toc a{flex:none;max-width:240px;padding:8px 12px;background:var(--mg-soft);border:0;border-radius:10px;font-size:11px}
 .mg-about-back{display:none}.mg-about-section{padding:22px 20px}
 .mg-about-page #article-container{font-size:15px!important}.mg-about-page #article-container h2{font-size:23px!important}
}

.mg-about-reading:has(.mg-about-guide[hidden]){grid-template-columns:minmax(0,850px);justify-content:center}

/* Editorial edition: open chapter layouts and a warm sculptural cover. */
.mg-about-hero {grid-template-columns:1fr 1fr;gap:80px;padding-bottom:48px;border:0;align-items:center}
.mg-about-hero h1 {font-size:18px!important;letter-spacing:.02em;margin:28px 0 20px;font-weight:500;color:var(--mg-muted)}
.mg-about-tagline {font-size:clamp(46px,5.1vw,72px);font-weight:750;line-height:1.23;letter-spacing:-.055em;margin-bottom:26px}
.mg-about-tagline span {display:block;color:var(--mg-text)}
.mg-about-summary {font-size:14px;line-height:2;max-width:370px;margin-bottom:30px}
.mg-about-hero .mg-brand-button {border-radius:10px;box-shadow:none;gap:36px;font-size:12px}
.mg-about-art {height:490px;background:#35241d;box-shadow:0 18px 50px #63340f0c}
.mg-about-mark {padding:0;background:radial-gradient(ellipse at 50% 30%,#624227,#2a1e19 85%)}
.mg-about-sculpture {position:absolute;inset:0;width:100%;height:100%;display:block}
.mg-about-art-top {position:absolute;left:28px;right:28px;top:27px;display:flex;justify-content:space-between;align-items:center;color:#f6d5a2;font-size:9px;letter-spacing:.18em}
.mg-about-art-top>span {font-size:22px}
.mg-about-art-word {left:28px;bottom:28px;font-size:24px;font-weight:500;letter-spacing:.12em;color:#ffdfaa;line-height:1.2}
.mg-about-art-word>span {margin-top:9px;font-size:10px;font-weight:400;letter-spacing:.15em;color:#c9aa84}
.mg-about-values {display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--mg-line);border-bottom:1px solid var(--mg-line);padding:24px 0;margin-bottom:64px}
.mg-about-values>span {display:flex;align-items:center;gap:28px;font-size:13px;letter-spacing:.06em}
.mg-about-values>span+span {padding-left:32px;border-left:1px solid var(--mg-line)}
.mg-about-values small {font-size:10px;letter-spacing:0;color:var(--mg-muted)}
.mg-about-reading {grid-template-columns:210px minmax(0,1fr);gap:80px;margin-top:0}
.mg-about-section {position:relative;border:0;border-top:1px solid var(--mg-line);border-radius:0;background:transparent;padding:42px 0 22px 56px;margin-bottom:24px}
.mg-about-section::before {content:attr(data-chapter);position:absolute;top:48px;left:0;color:var(--heo-theme);font-size:11px;letter-spacing:.06em;font-variant-numeric:tabular-nums}
.mg-about-page #article-container h2 {font-size:28px!important;color:var(--mg-text)!important;font-weight:650;letter-spacing:-.03em;margin-bottom:24px!important}
.mg-about-page #article-container {line-height:2.05!important;font-size:16px!important}
.mg-about-page #article-container>h1 {color:var(--mg-muted)!important;font-size:15px!important;font-weight:500;margin-bottom:22px}
.mg-about-page #article-container>p:has(img:only-child) img {max-height:130px;max-width:65%;margin:0 0 40px}
#mg-about-toc a {padding:11px 0;border:0;line-height:1.6;transition:color .2s}
#mg-about-toc a[aria-current=location] {color:var(--mg-text);font-weight:650}
#mg-about-toc a[aria-current=location]>span {color:var(--heo-theme)}
.mg-about-timeline>p {padding-bottom:28px}
@media(prefers-reduced-motion:no-preference){.mg-about-gem{animation:mg-about-float 8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.mg-about-art:hover .mg-about-gem{animation-play-state:paused}}
@keyframes mg-about-float{50%{transform:translateY(-7px)}}
@media(max-width:900px){.mg-about-hero{gap:36px}.mg-about-art{height:410px}.mg-about-reading{gap:36px;grid-template-columns:175px minmax(0,1fr)}}
@media(max-width:768px){
 .mg-about-hero{grid-template-columns:1fr;gap:36px;padding-bottom:32px}.mg-about-hero h1{margin:20px 0 16px;font-size:15px!important}.mg-about-tagline{font-size:48px}.mg-about-art{height:350px}.mg-about-summary{font-size:13px}
 .mg-about-values{padding:18px 0;margin-bottom:32px}.mg-about-values>span{gap:8px;font-size:11px;letter-spacing:0}.mg-about-values>span+span{padding-left:12px}
 .mg-about-reading{display:block}.mg-about-section{padding:30px 0 12px 0;margin-bottom:22px}.mg-about-section::before{position:static;display:block;margin-bottom:14px}
 .mg-about-page #article-container h2{font-size:24px!important}.mg-about-page #article-container{font-size:15px!important}
 #mg-about-toc a{padding:9px 12px}.mg-about-guide{padding-bottom:32px}.mg-about-art-word{font-size:21px}
}

.mg-about-page #article-container img[src$="about-character.webp"]{aspect-ratio:1056/1800;width:min(100%,640px);object-fit:contain}
.mg-about-page #article-container img[src$="about-wordmark.webp"]{aspect-ratio:1400/788;object-fit:contain}

/* Hide only the duplicate editor heading; retain the original brand artwork. */
.mg-about-body #article-container > h1:first-child[id="%E5%85%B3%E4%BA%8E%E6%88%91%E4%BB%AC%EF%BC%88about-us%EF%BC%89"] {display:none}
.mg-about-language {margin-top:20px;font-size:12px;letter-spacing:.04em}
.mg-about-language a {color:var(--mg-muted);text-decoration:none;border-bottom:1px solid var(--mg-line);padding-bottom:3px}
.mg-about-language a:hover {color:var(--mg-accent)}

.mg-about-body #article-container > p:has(> img:only-child[src$="/about-wordmark.webp"]) {
    margin:0 0 32px!important;padding:0 0 0 56px;text-align:left!important;
}
.mg-about-page #article-container img[src$="about-wordmark.webp"] {
    display:block!important;width:min(100%,420px)!important;height:auto!important;max-width:100%!important;max-height:none!important;
    margin:0!important;border-radius:16px;box-shadow:none;
}
@media(max-width:1024px) {
    .mg-about-body #article-container > p:has(> img:only-child[src$="/about-wordmark.webp"]) {padding-left:0;margin-bottom:24px!important}
}

/* Editor-owned brand image and character content, arranged without duplication. */
.mg-about-brand-grid {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:32px;align-items:center}
.mg-about-page #article-container .mg-about-brand-picture {margin:0!important;padding:0!important}
.mg-about-page #article-container .mg-about-brand-picture img {width:100%!important;border-radius:16px}
.mg-about-brand-grid p {margin-top:0!important}
.mg-about-page #article-container .mg-about-character-grid {display:grid!important;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:32px!important;align-items:start}
.mg-about-character-grid>.column {padding:0!important}
.mg-about-character-grid>.column:first-child {background:var(--mg-soft);border-radius:16px;padding:20px!important}
.mg-about-page #article-container .mg-about-character-grid img {margin:0 auto;max-width:100%;max-height:560px;object-fit:contain}
.mg-about-page #article-container .mg-about-character-grid img[hidden] {display:none!important}
.mg-about-page #article-container .mg-about-character-grid h2 {font-size:19px!important;margin:0 0 20px!important}
.mg-about-character-grid>.column:last-child>p {margin:0!important;padding:12px 0;border-bottom:1px solid var(--mg-line);line-height:1.8!important;font-size:14px}
.mg-about-character-grid>.column:last-child>p:has(img[hidden]:only-child) {display:none}
.mg-about-year {border-top:1px solid var(--mg-line);padding:0 0 12px}
.mg-about-year summary {cursor:pointer;padding:18px 0;color:var(--mg-text);font-size:24px;font-weight:600;list-style:none;display:flex;justify-content:space-between}
.mg-about-year summary::-webkit-details-marker {display:none}
.mg-about-year summary::after {content:'+';color:var(--mg-accent);font-weight:400}
.mg-about-year[open] summary::after {content:'−'}
.mg-about-year>p,.mg-about-year>div {margin:0 0 18px!important;padding-left:18px;border-left:2px solid var(--mg-line);overflow-wrap:anywhere}
.mg-about-expand-years {appearance:none;border:1px solid var(--mg-line);background:var(--mg-soft);color:var(--mg-text);border-radius:10px;padding:10px 16px;margin:0 0 24px;cursor:pointer;font:inherit;font-size:13px}
.mg-about-expand-years:hover {border-color:var(--mg-accent)}
.mg-about-expand-years:focus-visible,.mg-about-year summary:focus-visible {outline:2px solid var(--mg-accent);outline-offset:4px}
@media(max-width:1100px) {.mg-about-brand-grid,.mg-about-page #article-container .mg-about-character-grid {grid-template-columns:1fr;gap:24px!important}.mg-about-page #article-container .mg-about-brand-picture img {max-width:440px!important}.mg-about-page #article-container .mg-about-character-grid img {max-height:460px}}
.mg-about-page #article-container details.mg-about-year {border:0;border-top:1px solid var(--mg-line);border-radius:0;background:transparent;box-shadow:none;margin:0;padding:0 0 12px;color:var(--mg-text)}
.mg-about-page #article-container details.mg-about-year>summary {display:flex;justify-content:space-between;align-items:center;text-align:left;background:transparent;border:0;border-radius:0;margin:0;padding:18px 0;line-height:1.5;color:var(--mg-text)}
.mg-about-page #article-container details.mg-about-year>summary::before {display:none}
.mg-about-page #article-container details.mg-about-year>summary {position:static!important;box-shadow:none!important;width:100%;white-space:normal}
.mg-about-page #article-container details.mg-about-year>:nth-child(2) {margin-top:0!important}
