/* Content-led viewport ranges; also used by JS through --experience-layout. */
:root{--content-width:1440px;--layout-gutter:clamp(22px,4vw,56px);--section-space:clamp(60px,7vw,100px)}
.wrap{width:100%;max-width:var(--content-width);padding-inline:var(--layout-gutter);min-width:0}
.section{padding-block:var(--section-space)}
.section.wrap,.page-intro.wrap{padding-inline:var(--layout-gutter)}
.site-header{padding-inline:max(var(--layout-gutter),env(safe-area-inset-left)) max(var(--layout-gutter),env(safe-area-inset-right))}
.split>*,.section-heading>*,.brand-row>*,.footer-grid>*,.benefit-grid>*{min-width:0}
img,video{max-width:100%}
.eyebrow{font-family:Archivo,Arial,"Apple SD Gothic Neo",sans-serif;font-style:normal;font-size:1rem;font-weight:650;line-height:1.5;letter-spacing:0}
.section-heading .eyebrow,.dark .eyebrow,.manifesto .eyebrow{font-size:1.125rem;letter-spacing:0}
.brand-card>div{display:flex;flex-direction:column;gap:6px}.brand-card h3{order:0;margin:10px 0 0}.brand-card span{order:1;font:600 .9375rem/1.5 Archivo,Arial,sans-serif;letter-spacing:0;color:#555f58}
.creator-card strong{font-size:clamp(1rem,1.4vw,1.2rem)}
.news-row{grid-template-columns:130px minmax(0,1fr)}.news-row span{font-size:.9375rem}.news-row h3{font-size:clamp(1.125rem,1.7vw,1.5rem)}
.text-link,.text-button,.news-filters button,.contact-box button,.header-actions>a{min-height:44px;display:inline-flex;align-items:center}
input[type=search],select{font-size:1rem!important;min-height:48px}
.creator-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.creator-card{overflow:hidden}
.page-intro h1.display{font-size:clamp(2.25rem,7vw,6.625rem);overflow-wrap:anywhere}
.page-intro h2{font-size:clamp(1.375rem,2.4vw,1.875rem)}
.performance-section{background:#fff}.performance-section .section-heading{margin-bottom:38px}.performance-section h2.display{max-width:800px}
.metrics-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.metric-card{border-top:2px solid #161818;padding-top:24px}.metric-label{font-size:1rem;font-weight:600;margin:0 0 25px;color:#404942}.metric-value{font-family:Archivo,Arial,sans-serif;font-style:italic;font-weight:900;letter-spacing:-.06em;font-size:clamp(3rem,6.5vw,6.75rem);line-height:1.05;margin:0;white-space:nowrap}.metric-value small{font-family:-apple-system,"Apple SD Gothic Neo",sans-serif;font-style:normal;font-weight:600;letter-spacing:-.03em;font-size:clamp(1.125rem,2vw,1.625rem);margin-left:8px}.metrics-note{font-size:.8125rem;color:#68716a;margin:28px 0 0}
.experience{--experience-layout:continuous;height:280svh;min-height:0}.experience-stage{min-height:0;height:calc(100svh - var(--header-h))}
.experience-title .eyebrow{font-size:.875rem;letter-spacing:.04em;margin-bottom:28px}.experience-title h1.display{font-size:clamp(3.25rem,8vw,8.2rem);text-shadow:0 2px 28px #0004}
.experience-reveal{padding:clamp(24px,4vh,58px) clamp(24px,4vw,64px)}.experience-reveal h2.display{font-size:clamp(2rem,min(5vw,8.5vh),4.5rem);margin-bottom:22px}.experience-reveal>p:not(.eyebrow){font-size:1rem;margin-bottom:24px}.experience-reveal .text-link{font-size:.875rem;letter-spacing:0}
.experience-middle>span{font-size:clamp(1rem,1.5vw,1.2rem)}.experience-scroll{font-size:.6875rem}
.credits summary{font-size:.75rem}.footer-bottom{font-size:.75rem}
@media(min-width:1600px){:root{--content-width:1600px;--layout-gutter:64px}body[data-page=creators] .creator-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.site-header>nav{font-size:.875rem;gap:32px}}
@media(min-width:641px) and (max-width:1023px){:root{--layout-gutter:clamp(28px,4vw,42px)}.site-header>nav{display:none}.header-actions{font-size:.8125rem}.creator-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 19px}.brand-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.brand-card>img{height:clamp(210px,32vw,320px)}.brand-card h3{font-size:1.5rem}.brand-card span{font-size:.875rem}.benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.benefit-grid h2.display{font-size:2rem}.hiring-steps{grid-template-columns:repeat(3,minmax(0,1fr))}.hiring-steps li{display:block}.hiring-steps span{margin-bottom:12px}.footer-grid{display:grid;grid-template-columns:1.2fr 1fr}.footer-grid nav{grid-template-columns:1fr 1fr}.news-row{grid-template-columns:100px minmax(0,1fr);gap:20px}.page-intro h1.display{font-size:clamp(2.75rem,7vw,4.5rem)}}
@media(min-width:641px) and (max-width:800px){.site-header{height:76px}.experience-stage{top:var(--header-h);height:calc(100svh - var(--header-h))}.experience-title{top:12%;left:6%;right:5%}.experience-title h1.display{font-size:clamp(2.75rem,8vw,4.5rem)}.experience-note{font-size:.9375rem;bottom:10%}.experience-middle h2.display{font-size:clamp(2.5rem,7vw,3.875rem)}.experience-reveal h2.display{font-size:clamp(2rem,5vw,2.75rem)}}
@media(max-width:640px),(max-height:599px),(prefers-reduced-motion:reduce){.experience{--experience-layout:stacked;height:auto;min-height:0}.experience-stage{position:relative;top:0;height:auto;min-height:0;display:flex;flex-direction:column}.experience-title{position:relative;inset:auto;padding:40px var(--layout-gutter) 20px;opacity:1!important;transform:none!important;order:0}.experience-title h1.display{font-size:clamp(1.875rem,8.2vw,4.875rem);line-height:1.03;margin:0}.experience-title .eyebrow{font-size:.8125rem;margin-bottom:24px}.experience-note{position:relative;inset:auto;padding:0 var(--layout-gutter) 30px;margin:0;opacity:1!important;order:1;font-size:1rem}.experience-photo{position:relative;inset:auto!important;left:0!important;top:0!important;width:100%!important;height:clamp(270px,65vw,520px)!important;order:2;z-index:0}.experience-ink,.experience-middle,.experience-scroll,.experience-progress{display:none}.experience-reveal{position:relative;inset:auto;width:100%;padding:38px var(--layout-gutter);opacity:1!important;transform:none!important;order:3}.experience-reveal h2.display{font-size:clamp(2rem,6.7vw,3.5rem);line-height:1.08}.experience-reveal>p:not(.eyebrow){font-size:1rem}}
@media(max-width:640px){:root{--layout-gutter:22px;--section-space:60px}.site-header>nav{display:none}.header-actions{gap:13px;font-size:.75rem}.creator-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 15px}.brand-cards{grid-template-columns:1fr}.brand-card>img{height:clamp(260px,75vw,420px)}.benefit-grid{grid-template-columns:1fr}.hiring-steps{grid-template-columns:1fr}.footer-grid{display:flex;flex-direction:column}.metrics-grid{grid-template-columns:1fr;gap:32px}.metric-card{padding-top:20px}.metric-label{margin-bottom:14px}.metric-value{font-size:clamp(3.75rem,17vw,5.5rem)}.metric-value small{font-size:1.375rem}.news-row{grid-template-columns:1fr;gap:10px}.section-heading .eyebrow,.dark .eyebrow{font-size:1rem}.brand-card span{font-size:1rem}.experience-reveal{display:none}.metrics-note{font-size:.8125rem}.contact-box .buttons{align-items:stretch}.contact-box .button{white-space:normal}}
@media(max-width:359px){:root{--layout-gutter:18px;--section-space:48px}.creator-grid{grid-template-columns:1fr}.site-header{padding-inline:18px;gap:12px}.site-header .logo img{width:62px}.header-actions{gap:9px}.header-actions button{padding:10px 9px}.page-intro h1.display{font-size:1.875rem}.page-intro h2{font-size:1.25rem}.display{font-size:2rem;overflow-wrap:anywhere}.benefit-grid h2.display{font-size:2rem}.ip-pair{gap:8px}.ip-pair img{height:245px}#site-menu nav a{font-size:1.65rem}#site-menu{padding:24px 18px}.metric-value{font-size:3.75rem}.cta h2.display{font-size:2.5rem}}
@media(max-height:599px) and (min-width:641px){.experience-title h1.display{font-size:clamp(3rem,7vw,6rem)}.experience-photo{height:330px!important}.experience-reveal{display:none}#site-menu nav{margin:32px 0;gap:10px 40px}#site-menu nav a{font-size:clamp(1.5rem,3.6vw,3rem)}}

/* 매출 그래프와 누적 성과: data/performance.json에서 생성 */
.performance-section .section-heading{align-items:end;margin-bottom:24px}
.revenue-chart{margin:0 0 64px}
.chart-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:26px;border-top:1px solid #d7dbd8}
.chart-heading h3{font-size:clamp(1.125rem,2vw,1.5rem);margin:0;font-weight:650}
.chart-heading>span{font-size:.9375rem;color:#657068}
.chart-plot{position:relative;height:clamp(230px,27vw,360px);margin-top:16px}
.chart-plot svg{width:100%;height:100%;display:block;overflow:visible}
.chart-baseline{stroke:#dce1dd;stroke-width:1;vector-effect:non-scaling-stroke}
.chart-line{fill:none;stroke:#fa5b11;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.chart-dots{fill:#fa5b11;stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}
.chart-value{position:absolute;transform:translate(-50%,calc(-100% - 15px));font:900 italic clamp(1.25rem,2.3vw,2.25rem)/1 Archivo,Arial,sans-serif;letter-spacing:-.04em;color:#202522}
.chart-value:last-child{color:#e75008}
.chart-periods{position:relative;height:52px;list-style:none;padding:0;margin:0;font:600 .9375rem/1.4 Archivo,Arial,sans-serif;color:#657068}
.chart-periods li{position:absolute;transform:translateX(-50%);text-align:center;display:flex;flex-direction:column;gap:3px;white-space:nowrap}
.chart-periods li:last-child{color:#202522}
.metric-card{padding-top:25px;border-top:1px solid #bfc7c1}
.metric-value{font-size:clamp(2rem,4.8vw,5rem)}
.metric-value small{font-size:clamp(1rem,1.5vw,1.375rem);margin-left:5px}
.metric-label{margin:18px 0 0;font-size:clamp(.9375rem,1.4vw,1.125rem);font-weight:550;line-height:1.5}
.metrics-grid{row-gap:38px}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(min-width:641px) and (max-width:900px){.metric-value small{display:block;margin:9px 0 0}.metric-value{font-size:clamp(2.5rem,5.4vw,3rem)}}
@media(max-width:640px){.performance-section .section-heading{margin-bottom:25px}.revenue-chart{margin-bottom:44px}.chart-plot{height:240px}.chart-heading>span{font-size:.875rem}.chart-value{font-size:1.375rem}.chart-periods{font-size:.875rem;height:50px}.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:27px 18px}.metric-card{padding-top:20px}.metric-value{font-size:clamp(1.8rem,8vw,3rem);letter-spacing:-.055em}.metric-value small{display:block;margin:8px 0 0;font-size:1rem}.metric-label{font-size:.9375rem;margin-top:13px}}
@media(max-width:359px){.chart-value{font-size:1.125rem}.chart-periods{font-size:.875rem}.metrics-grid{grid-template-columns:1fr}.metric-value{font-size:3rem}.metric-value small{display:inline;margin-left:5px;font-size:1.125rem}}
.performance-section .section-heading{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:38px}
.performance-section .section-heading h2{font-size:clamp(2.25rem,5vw,4.5rem);margin:0}
.performance-section .section-heading>p{font-size:1.125rem;line-height:1.7;margin:0}
@media(min-width:1024px){.performance-section{padding-block:80px}.chart-plot{height:280px}.revenue-chart{margin-bottom:40px}}
@media(max-width:640px){.performance-section .section-heading{display:block}.performance-section .section-heading>p{font-size:1rem;margin-top:20px}}
