
:root{--sp-bar:52px}

html{scroll-padding-top:var(--hd)}
.co-page main.sheet{padding-top:var(--hd);min-height:100svh}
.co-page .wrap{max-width:1440px}
.co-page main p,.co-page main li{text-wrap:pretty}


.co-hero{padding:88px 0 96px;background:var(--bg-alt)}
.co-hero .kicker{color:var(--scene-accent);font-family:var(--head);font-size:13px;letter-spacing:.015em;margin-bottom:24px;line-height:1.5}
.co-hero h1{font-size:clamp(40px,4.6vw,68px);line-height:1.2;letter-spacing:-.042em;font-weight:500;color:var(--scene-ink)}
.co-hero h1 .hl{display:inline-block}
.co-hero .lead{color:var(--scene-muted);font-family:var(--head);font-weight:400;font-size:clamp(18px,1.5vw,21px);line-height:1.6;letter-spacing:-.005em;margin-top:28px;max-width:25em}
.co-hero .btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:40px}
.co-hero .btn{border-radius:4px;padding:16px 22px;font-size:15px}
.co-hero .in{opacity:.4;transform:translateY(8px);animation:in .5s var(--ease) forwards}
.co-hero .in:nth-child(1){animation-delay:.05s}.co-hero .in:nth-child(2){animation-delay:.12s}.co-hero .in:nth-child(3){animation-delay:.19s}.co-hero .in:nth-child(4){animation-delay:.26s}
.sp-hero__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:end}
.sp-hero__copy{grid-column:1 / span 6;min-width:0}
.sp-toc{grid-column:7 / span 6;min-width:0;animation-delay:.3s!important}
.sp-toc ol{list-style:none;border-bottom:1px solid var(--line)}
.sp-toc li{border-top:1px solid var(--line)}
.sp-toc li:first-child{border-top-color:var(--ink)}
.sp-toc a{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) 24px;align-items:center;min-height:54px;padding:12px 0;font-family:var(--head);font-size:17px;line-height:1.4;letter-spacing:-.015em;color:var(--ink)}
.sp-toc .n{font-family:var(--body);font-size:13px;font-weight:500;letter-spacing:.06em;color:var(--mute)}
.sp-toc .a{justify-self:end;font-family:var(--body);font-size:16px;color:var(--mute);transition:transform .3s var(--ease),color .3s var(--ease)}
.sp-toc a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.sp-toc a:hover::after,.sp-toc a:focus-visible::after{transform:scaleX(1)}
.sp-toc a:hover .a,.sp-toc a:focus-visible .a{transform:translateY(3px);color:var(--ink)}
.sp-toc a:focus-visible{outline:2px solid var(--ink);outline-offset:2px}


.sp-bar{position:sticky;top:var(--hd);z-index:15;background:var(--bg);background:color-mix(in srgb,var(--bg) 94%,transparent);-webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--line-soft)}
.sp-bar .wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:center;height:var(--sp-bar)}
.sp-bar nav{grid-column:1 / span 6;display:flex;height:100%;margin-left:-14px}
.sp-bar nav a{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:48px;padding:0 14px;height:100%;font-family:var(--body);font-size:15px;font-weight:500;letter-spacing:.05em;color:var(--mute);transition:color .2s var(--ease)}
.sp-bar nav a::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .32s var(--ease)}
.sp-bar nav a:hover{color:var(--ink)}
.sp-bar nav a[aria-current="true"]{color:var(--ink)}
.sp-bar nav a[aria-current="true"]::after{transform:scaleX(1)}
.sp-bar nav a:focus-visible{outline:2px solid var(--ink);outline-offset:-4px}
.sp-bar__now{grid-column:7 / span 6;min-width:0;font-family:var(--head);font-size:15px;letter-spacing:-.01em;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .22s var(--ease),transform .22s var(--ease)}
.sp-bar__now.swap{opacity:0;transform:translateY(4px)}


.sp-sec{padding:0 0 120px;scroll-margin-top:calc(var(--sp-bar) + 28px)} 
.sp-sec--first{padding-top:104px;scroll-margin-top:var(--sp-bar)}
.sp-rule{height:1px;background:var(--ink);margin-bottom:64px}
.rl{transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.rl.on{transform:none}
.sp-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:start}
.sp-head{grid-column:1 / span 5;min-width:0;position:sticky;top:calc(var(--hd) + var(--sp-bar) + 40px)}
.sp-no{display:inline-flex;align-items:center;gap:10px;font-family:var(--body);font-size:14px;font-weight:500;letter-spacing:.06em;line-height:1;color:var(--mute);margin-bottom:22px}
.sp-no::before{content:"";width:20px;height:1px;background:currentColor;opacity:.6}
.sp-head h2{font-size:clamp(27px,2.6vw,38px);line-height:1.32;letter-spacing:-.03em;font-weight:500;max-width:12.5em;text-wrap:balance}
.sp-body{grid-column:7 / span 6;min-width:0}
.sp-lead{font-family:var(--head);font-weight:400;font-size:clamp(18px,1.45vw,20px);line-height:1.65;letter-spacing:-.01em;color:var(--ink)}
.sp-p{margin-top:18px;font-size:17px;line-height:1.7;color:var(--mute)}
.sp-items{list-style:none;margin-top:40px;border-bottom:1px solid var(--line)}
.sp-items li{position:relative;padding:20px 0 20px 32px;border-top:1px solid var(--line);font-size:17px;line-height:1.65}
.sp-items li:first-child{border-top-color:var(--ink)}
.sp-items li::before{content:"";position:absolute;left:0;top:calc(20px + .82em);width:12px;height:1px;background:var(--ink)}
.sp-act{margin-top:36px;display:flex;gap:12px;flex-wrap:wrap}
.sp-act .btn{border-radius:4px;padding:16px 22px;font-size:15px}


.sp-three{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px;margin-top:72px}
.sp-three li{border-top:1px solid var(--ink);padding-top:22px;padding-right:24px;font-family:var(--head);font-size:18px;line-height:1.6;letter-spacing:-.012em}


.sp-docs{list-style:none;margin-top:64px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:32px;border-top:1px solid var(--ink)}
.sp-docs li{display:flex;flex-direction:column;gap:14px;min-height:124px;padding:20px 16px 24px 0;border-bottom:1px solid var(--line)}
.sp-docs .n{font-family:var(--body);font-size:13px;font-weight:500;letter-spacing:.06em;line-height:1;color:var(--mute)}
.sp-docs .t{font-family:var(--head);font-weight:500;font-size:18px;line-height:1.45;letter-spacing:-.015em}


.sp-dark{background:var(--black);color:var(--paper);padding:112px 0 128px;scroll-margin-top:var(--sp-bar)}
.sp-dark .sp-head{position:static}
.sp-dark .sp-no{color:var(--paper-56)}
.sp-dark h2{color:var(--paper);max-width:none}
.sp-duo{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;margin-top:72px}
.sp-duo p{grid-column:span 6;border-top:1px solid var(--paper-line);padding-top:26px;font-family:var(--head);font-weight:400;font-size:clamp(20px,1.9vw,27px);line-height:1.55;letter-spacing:-.022em;color:var(--paper)}
.sp-duo p{padding-right:clamp(0px,4vw,64px)}


.sp-close{background:var(--bg-alt);padding:112px 0 128px;scroll-margin-top:var(--sp-bar)}
.sp-close .sp-head h2{font-size:clamp(30px,3vw,44px);line-height:1.25}
.sp-gov{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}

@media (min-width:721px) and (max-width:1080px){
  .co-hero{padding:72px 0 72px}
  .sp-hero__grid{display:block}
  .sp-toc{margin-top:56px}
  .sp-toc ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,auto);grid-auto-flow:column;column-gap:32px;border-bottom:0}
  .sp-toc li{border-top:0;border-bottom:1px solid var(--line)}
  .sp-toc li:first-child,.sp-toc li:nth-child(5){border-top:1px solid var(--ink)}
  .sp-toc a{font-size:16px}
  .sp-bar nav{grid-column:1 / -1}
  .sp-bar__now{display:none}
  .sp-sec{padding-bottom:96px}
  .sp-sec--first{padding-top:80px}
  .sp-rule{margin-bottom:48px}
  .sp-grid{display:block}
  .sp-head{position:static}
  .sp-head h2{max-width:none}
  .sp-body{margin-top:32px}
  .sp-dark,.sp-close{padding:88px 0 96px}
  .sp-duo{margin-top:48px}
  .sp-three{margin-top:48px;column-gap:24px}
  .sp-three li{font-size:17px;padding-right:0}
  .sp-docs{margin-top:44px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .sp-docs li{min-height:0}
}
@media (max-width:720px){
  .co-hero{padding:48px 0 56px}
  .co-hero .kicker{margin-bottom:16px}
  .co-hero h1{font-size:36px;line-height:1.24;letter-spacing:-.04em}
  .co-hero .lead{font-size:17px;margin-top:18px}
  .co-hero .btns{margin-top:28px}
  .co-hero .btns .btn{flex:1 1 0;justify-content:center;padding:16px 12px}
  .sp-hero__grid{display:block}
  .sp-toc{margin-top:44px}
  .sp-toc a{grid-template-columns:36px minmax(0,1fr) 20px;min-height:52px;padding:12px 0;font-size:16px}
  .sp-bar .wrap{display:block;padding:0 8px}
  .sp-bar nav{margin-left:0}
  .sp-bar nav a{flex:1 1 0;min-width:0;padding:0}
  .sp-bar nav a::after{left:22%;right:22%}
  .sp-bar__now{display:none}
  .sp-sec{padding-bottom:72px}
  .sp-sec--first{padding-top:64px}
  .sp-rule{margin-bottom:36px}
  .sp-grid{display:block}
  .sp-head{position:static}
  .sp-no{margin-bottom:16px}
  .sp-head h2{font-size:26px;line-height:1.36;max-width:none}
  .sp-body{margin-top:22px}
  .sp-lead{font-size:17px;line-height:1.65}
  .sp-p{font-size:16px;margin-top:14px}
  .sp-items{margin-top:28px}
  .sp-items li{padding:17px 0 17px 26px;font-size:16px}
  .sp-items li::before{top:calc(17px + .82em);width:10px}
  .sp-three{display:block;margin-top:32px;border-bottom:1px solid var(--line)}
  .sp-three li{padding:17px 0;font-size:16px;line-height:1.6;border-top-color:var(--line)}
  .sp-three li:first-child{border-top-color:var(--ink)}
  .sp-docs{margin-top:28px;grid-template-columns:minmax(0,1fr)}
  .sp-docs li{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:baseline;gap:0;min-height:0;padding:16px 0}
  .sp-docs .t{font-size:17px}
  .sp-act{margin-top:28px}
  .sp-act .btn{flex:1 1 0;justify-content:center}
  .sp-dark{padding:64px 0 72px}
  .sp-duo{display:block;margin-top:36px}
  .sp-duo p{font-size:20px;line-height:1.55;padding:22px 0 0}
  .sp-duo p + p{margin-top:32px}
  .sp-close{padding:64px 0 80px}
  .sp-close .sp-head h2{font-size:28px}
  .sp-gov{margin-top:22px;padding-top:20px}
  
  .ft nav{display:grid;grid-template-columns:repeat(3,max-content);gap:14px 28px}
}
@media (max-width:360px){
  .co-hero h1{font-size:32px}
}
@media (prefers-reduced-motion:reduce){
  .co-hero .in{animation:none;opacity:1;transform:none}
  .rl{transform:none;transition:none}
  .sp-toc a::after,.sp-toc .a,.sp-bar nav a,.sp-bar nav a::after,.sp-bar__now{transition:none}
}
