/* C01-only stylesheet: the v5 brand page and shared styles.css are unchanged. */
html { scroll-behavior: smooth; }
.c01-page { margin:0; font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
.c01-page *, .c01-page *::before, .c01-page *::after { box-sizing:border-box; }
:where(.c01-page a) { color:inherit; text-decoration:none; }
.c01-page button { font:inherit; cursor:pointer; }
.c01-page [hidden] { display:none !important; }
.c01-page img { max-width:100%; }
.c01-page :focus-visible { outline:3px solid #142bc3; outline-offset:4px; }
.c01-skip-link { position:fixed; top:-100px; left:16px; z-index:200; padding:14px 20px; background:#203df1; color:#fff !important; border-radius:6px; }
.c01-skip-link:focus { top:12px; }
.c01-page { --creator-blue: #203df1; --creator-ink: #111111; color: var(--creator-ink); background: #fff; }
.c01-hero { width: min(calc(100% - 96px), 1320px); margin: 0 auto; display: grid; grid-template-columns: 1fr 1.06fr; align-items: center; gap: 24px; padding: 35px 0 45px; min-height: 680px; }
.c01-hero-copy { position: relative; z-index: 1; padding: 10px 0; }
.c01-eyebrow { margin: 0 0 22px; font-size: 13px; font-weight: 750; line-height: 1.5; letter-spacing: .045em; color: var(--creator-blue); }
.c01-hero h1 { margin: 0; font-size: clamp(44px, 4.35vw, 64px); line-height: 1.08; letter-spacing: -.045em; font-weight: 750; }
.c01-hero h1 span { display: block; }
.c01-blue { color: var(--creator-blue); }
.c01-lead { max-width: 490px; margin: 24px 0 0; font-size: 18px; line-height: 1.65; color: #494949; }
.c01-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 28px; }
.c01-button { min-height: 52px; padding: 14px 19px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-size: 15px; line-height: 1.4; font-weight: 650; border: 1px solid var(--creator-blue); border-radius: 6px; transition: background-color .15s, color .15s; }
.c01-primary { background: var(--creator-blue); color: #fff; }
.c01-primary:hover { background: #172ec4; }
.c01-secondary { background: #fff; color: var(--creator-blue); }
.c01-secondary:hover { background: #f1f4ff; }
.c01-button:focus-visible { outline: 3px solid #142bc3; outline-offset: 4px; }
.c01-benefits { max-width: 520px; margin: 22px 0 0; font-size: 13px; line-height: 1.85; color: #626262; }
.c01-visual { align-self: stretch; display: flex; align-items: center; min-width: 0; }
.c01-portrait { display: block; width: 100%; height: auto; max-height: 580px; object-fit: contain; }
.c01-process { padding: 64px 0 80px; background: #f4f7ff; scroll-margin-top: 110px; }
.c01-process:focus { outline: none; }
.c01-process-inner { width: min(calc(100% - 96px), 1320px); margin-inline: auto; }
.c01-process .c01-eyebrow { margin-bottom: 12px; }
.c01-process h2 { margin: 0 0 30px; font-size: 36px; font-weight: 750; line-height: 1.2; letter-spacing: -.035em; }
.c01-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.c01-step { display: flex; align-items: flex-start; gap: 18px; padding: 26px; border: 1px solid #e2e8f6; border-radius: 10px; background: #fff; }
.c01-step-number { display: flex; align-items: center; justify-content: center; flex: 0 0 44px; height: 44px; border-radius: 50%; background: #e7edff; color: var(--creator-blue); font-size: 19px; font-weight: 750; }
.c01-step h3 { margin: 2px 0 9px; font-size: 19px; font-weight: 700; line-height: 1.4; letter-spacing: -.02em; }
.c01-step p { margin: 0; max-width: 460px; font-size: 15px; line-height: 1.65; color: #555; }
@media (max-width: 1050px) { .c01-hero { width: min(calc(100% - 64px), 1320px); min-height: 630px; gap: 16px; } .c01-hero h1 { font-size: 48px; } .c01-lead { font-size: 16px; } .c01-process-inner { width: calc(100% - 64px); } }
@media (max-width: 720px) { .c01-hero { width: calc(100% - 40px); display: flex; flex-direction: column; gap: 24px; padding: 36px 0 30px; min-height: 0; } .c01-hero-copy { width: 100%; padding: 0; } .c01-eyebrow { font-size: 11px; margin-bottom: 18px; } .c01-hero h1 { font-size: clamp(36px, 9.7vw, 48px); line-height: 1.12; letter-spacing: -.04em; } .c01-lead { margin-top: 20px; font-size: 16px; line-height: 1.65; } .c01-actions { margin-top: 24px; width: 100%; } .c01-button { width: 100%; min-height: 52px; } .c01-benefits { font-size: 12px; margin-top: 18px; } .c01-visual { width: 100%; align-self: center; max-width: 460px; } .c01-portrait { max-height: 410px; } .c01-process { padding: 38px 0 44px; scroll-margin-top: 88px; } .c01-process-inner { width: calc(100% - 40px); } .c01-process h2 { font-size: 30px; margin-bottom: 24px; } .c01-steps { grid-template-columns: 1fr; gap: 14px; } .c01-step { padding: 20px; gap: 14px; } .c01-step h3 { font-size: 17px; } .c01-step p { font-size: 14px; } }
@media (prefers-reduced-motion: reduce) { .c01-button { transition: none; } }
.c01-header { position: sticky; top: 0; z-index: 100; background: #fff; color: #111; border-bottom: 1px solid #f0f0f0; }
.c01-header-inner { width: min(calc(100% - 96px), 1320px); margin-inline: auto; min-height: 94px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.c01-brand { display: inline-flex; align-items: center; gap: 8px; font-size: 24px; font-weight: 750; letter-spacing: -.035em; flex-shrink: 0; }
.c01-brand img { object-fit: cover; border-radius: 50%; display: block; }
.c01-desktop-nav { display: flex; align-items: center; gap: 30px; }
.c01-desktop-nav a, .c01-login { display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; font-weight: 550; }
.c01-desktop-nav a:hover, .c01-login:hover { color: #203df1; }
.c01-header-actions { display: flex; gap: 20px; align-items: center; }
.c01-languages { display: flex; align-items: center; gap: 0; }
.c01-languages a { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #656565; }
.c01-languages a[aria-current], .c01-mobile-languages a[aria-current] { color: #203df1; font-weight: 750; }
.c01-register { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 11px 16px; border-radius: 6px; background: #203df1; color: #fff; font-size: 13px; font-weight: 600; text-align: center; }
.c01-register:hover { background: #172ec4; }
.c01-toggle { display: none; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; border: 1px solid #e4e7ef; border-radius: 6px; background: #fff; color: #111; }
.c01-mobile-nav { display: none; }
.c01-header a:focus-visible, .c01-toggle:focus-visible { outline: 3px solid #142bc3; outline-offset: 4px; }
@media (max-width: 1099px) { .c01-header-inner { width: calc(100% - 64px); min-height: 82px; } .c01-desktop-nav, .c01-header-actions .c01-register, .c01-languages { display: none; } .c01-header-actions { margin-left: auto; } .c01-toggle { display: inline-flex; } .c01-mobile-nav { display: flex; flex-direction: column; border-top: 1px solid #eef0f6; padding: 16px 32px 24px; gap: 6px; max-height: calc(100dvh - 82px); overflow-y: auto; } .c01-mobile-nav > a:not(.c01-register) { min-height: 44px; display: flex; align-items: center; font-size: 15px; } .c01-mobile-nav > a[aria-current] { color: #203df1; } .c01-mobile-languages { display: flex; gap: 20px; padding: 6px 0; } .c01-mobile-languages a { display: flex; align-items: center; min-height: 44px; } .c01-mobile-nav .c01-register { margin-top: 8px; min-height: 48px; } }
@media (max-width: 720px) { .c01-header-inner { width: calc(100% - 40px); min-height: 76px; gap: 14px; } .c01-brand { font-size: 22px; } .c01-brand img { width: 36px; height: 36px; } .c01-login { font-size: 13px; } .c01-mobile-nav { padding-inline: 20px; max-height: calc(100dvh - 76px); } }

.c01-brand, .c01-login { min-height:44px; min-width:44px; }
.c01-login { justify-content:center; }
.c01-footer { border-top:1px solid #e8ecf3; background:#fff; color:#626262; font-size:13px; }
.c01-footer>div { width:min(calc(100% - 96px),1320px); margin:auto; display:flex; flex-wrap:wrap; gap:24px; align-items:center; padding:30px 0; }
.c01-footer a { min-height:44px; display:inline-flex; align-items:center; }
@media(max-width:720px) { .c01-footer>div { width:calc(100% - 40px); gap:12px 24px; padding:20px 0; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }