:root{--logo-paper:#f7f9fd;--logo-blue:#0068ff;--logo-rule:#001a4026}.logo-design-page{color:var(--ink);background:var(--logo-paper)}.logo-design-page .site-header{background:#eff4fdf0;position:absolute}.logo-shell{width:min(100%,90rem);padding-inline:max(clamp(1.25rem, 5vw, 5.5rem), env(safe-area-inset-left));margin-inline:auto}.logo-hero{min-height:clamp(43rem,92dvh,57rem);padding-top:var(--header-height);background:radial-gradient(circle at 8% 18%, #0068ff1f, transparent 26rem), var(--ground);grid-template-columns:minmax(0,1fr) minmax(31rem,1.03fr);display:grid;position:relative;overflow:hidden}.logo-hero__copy{flex-direction:column;justify-content:space-between;width:100%;min-width:0;margin-right:0;padding-top:clamp(2rem,4vw,3.75rem);padding-bottom:clamp(3.5rem,7vw,6rem);padding-right:clamp(2rem,5vw,5rem);display:flex}.logo-breadcrumbs ol{color:var(--ink-content);flex-wrap:wrap;align-items:center;gap:.6rem;margin:0;padding:0;font-size:.75rem;list-style:none;display:flex}.logo-breadcrumbs li+li:before{content:"";background:#0068ff85;width:1.5rem;height:1px;margin:0 .6rem .22rem 0;display:inline-block}.logo-breadcrumbs a{color:var(--ink);text-underline-offset:.35em;text-decoration-color:#0068ff73}.logo-breadcrumbs a:hover{color:var(--ink)}.logo-breadcrumbs [aria-current=page]{color:var(--ink-content);font-weight:620}.logo-hero__message{max-width:43rem}.logo-hero h1{font-variation-settings:"wght" 690;letter-spacing:-.04em;max-width:10.7ch;margin:0;font-size:clamp(3.6rem,5.7vw,5.85rem);font-weight:690;line-height:.98}.logo-hero__message>p{max-width:57ch;color:var(--ink-content);margin:1.75rem 0 0;font-size:clamp(1rem,1.2vw,1.12rem);line-height:1.72}.logo-action{min-height:3.25rem;color:var(--ink);justify-content:center;align-items:center;gap:.85rem;font-size:.83rem;font-weight:620;text-decoration:none;display:inline-flex}.logo-action svg,.logo-related__links svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5px;width:1.1rem;transition:transform .18s}.logo-action:hover svg,.logo-related__links a:hover svg{transform:translate(.25rem)}.logo-action--primary{color:#fff;background:var(--logo-blue);border-radius:100px;margin-top:2rem;padding:0 1.5rem;transition:background-color .18s}.logo-action--primary:hover{background:var(--wordmark-blue)}.logo-action--text{text-underline-offset:.45em;justify-content:flex-start;margin-top:1.35rem;-webkit-text-decoration:underline #0068ff73;text-decoration:underline #0068ff73}.logo-breadcrumbs a:focus-visible,.logo-action:focus-visible,.logo-related__links a:focus-visible,.logo-faq summary:focus-visible{outline:2px solid var(--focus);outline-offset:.3rem;border-radius:.2rem}.logo-hero__media{border-radius:var(--radius-editorial-standard);background:var(--about-media-gray);min-width:0;margin:0;position:relative;overflow:hidden}.logo-hero__media picture,.logo-hero__media img{width:100%;height:100%;display:block}.logo-hero__media img{object-fit:cover;object-position:52% center}.logo-friction,.logo-work,.logo-faq,.logo-related,.logo-close{padding-block:clamp(4rem,7vw,6.5rem)}.logo-friction{background:#f6f9ff}.logo-friction__intro{grid-template-columns:minmax(0,1.2fr) minmax(19rem,.58fr);align-items:end;gap:clamp(3rem,9vw,9rem);display:grid}.logo-friction h2,.logo-work h2,.logo-faq h2,.logo-related h2,.logo-close h2{letter-spacing:-.04em;margin:0;font-size:clamp(2.75rem,5vw,4.8rem);font-weight:660;line-height:1.03}.logo-friction__intro>p,.logo-work__intro>p,.logo-close p{color:var(--ink-content);margin:0;font-size:.96rem;line-height:1.75}.logo-friction__register{border-top:1px solid var(--logo-rule);grid-template-columns:repeat(3,minmax(0,1fr));margin-top:clamp(3.5rem,6vw,5.5rem);display:grid}.logo-friction__register article{border-right:1px solid var(--logo-rule);min-height:14rem;padding:2rem clamp(1.2rem,2vw,2rem) 2.25rem;position:relative}.logo-friction__register article:first-child{border-left:1px solid var(--logo-rule)}.logo-friction__register h3{max-width:16ch;margin:0;font-size:1.15rem;font-weight:640;line-height:1.35}.logo-friction__register p{color:var(--ink-content);margin:1rem 0 0;font-size:.84rem;line-height:1.7}.logo-work{color:#fff;background:var(--ink)}.logo-work__grid,.logo-faq__grid{grid-template-columns:minmax(17rem,.65fr) minmax(0,1.35fr);gap:clamp(3rem,9vw,9rem);display:grid}.logo-work__intro{top:calc(var(--header-height) + 2rem);align-self:start;position:sticky}.logo-work__intro>p{color:#ffffffb8;margin-top:1.5rem}.logo-work .logo-action--text{color:#fff}.logo-work__list{border-top:1px solid #ffffff3b}.logo-work__list article{border-bottom:1px solid #ffffff2e;grid-template-columns:minmax(11rem,.65fr) minmax(0,1fr);align-items:start;gap:2rem;min-height:10rem;padding-block:2rem;display:grid}.logo-work__list h3,.logo-work__list p{margin:0}.logo-work__list h3{font-size:1.1rem;font-weight:620}.logo-work__list p{color:#ffffffb8;max-width:52ch;font-size:.88rem;line-height:1.72}.logo-faq{background:var(--ground)}.logo-faq__list{border-top:1px solid var(--logo-rule)}.logo-faq details{border-bottom:1px solid var(--logo-rule)}.logo-faq summary{cursor:pointer;justify-content:space-between;align-items:center;gap:2rem;min-height:5.25rem;font-size:1rem;font-weight:620;list-style:none;display:flex}.logo-faq summary::-webkit-details-marker{display:none}.logo-faq summary:after{color:var(--blue-text);content:"+";font-size:1.45rem;font-weight:400}.logo-faq details[open] summary:after{content:"−"}.logo-faq details p{max-width:67ch;color:var(--ink-content);margin:0;padding:0 3rem 1.8rem 0;font-size:.87rem;line-height:1.75}.logo-related{color:#fff;background:var(--ink)}.logo-related h2{max-width:14ch}.logo-related__links{border-top:1px solid #ffffff38;margin-top:clamp(3rem,6vw,5rem);display:grid}.logo-related__links a{color:#fff;border-bottom:1px solid #ffffff2e;grid-template-columns:minmax(0,.8fr) minmax(0,1fr) 1.25rem;align-items:center;gap:2rem;min-height:6.5rem;padding-block:1.25rem;text-decoration:none;display:grid}.logo-related__links span{font-size:clamp(1rem,1.6vw,1.3rem);font-weight:620}.logo-related__links small{color:#ffffffb3;font-size:.82rem}.logo-close{background:radial-gradient(circle at 80% 40%,#00b4c324,#0000 24rem),#e9f0fb}.logo-close__grid{justify-content:space-between;align-items:flex-end;gap:clamp(3rem,8vw,8rem);display:flex}.logo-close h2{max-width:16ch}.logo-close p{max-width:48ch;margin-top:1.35rem}.logo-close .logo-action{flex:none;margin-top:0}@media (width<=64rem){.logo-hero{grid-template-columns:minmax(0,1fr) minmax(24rem,.82fr)}.logo-hero h1{font-size:clamp(3.45rem,6.5vw,4.8rem)}.logo-friction__register{grid-template-columns:repeat(2,minmax(0,1fr))}.logo-friction__register article:nth-child(3){border-left:1px solid var(--logo-rule)}.logo-friction__register article{border-bottom:1px solid var(--logo-rule)}}@media (width<=48rem){.logo-design-page .site-header{background:var(--ground)}.logo-hero{flex-direction:column;min-height:auto;display:flex}.logo-hero__copy{min-height:44rem;padding-top:1.4rem;padding-right:max(1.25rem, env(safe-area-inset-right));padding-bottom:3rem}.logo-breadcrumbs ol{gap:.45rem;font-size:.68rem}.logo-breadcrumbs li+li:before{width:.75rem;margin-right:.45rem}.logo-hero h1{font-size:clamp(3.05rem,13.8vw,4.25rem)}.logo-hero__media{aspect-ratio:4/3;border-radius:0 2.5rem}.logo-friction__intro,.logo-work__grid,.logo-faq__grid{display:block}.logo-friction__intro>p,.logo-work__intro>p{margin-top:1.5rem}.logo-work__intro{margin-bottom:3rem;position:static}.logo-work__list article{min-height:auto}.logo-faq__list{margin-top:3rem}.logo-close__grid{flex-direction:column;align-items:flex-start}}@media (width<=34rem){.logo-hero__copy{min-height:42rem}.logo-friction__register{display:block}.logo-friction__register article,.logo-friction__register article:nth-child(3){border-right:0;border-bottom:1px solid var(--logo-rule);border-left:0;min-height:auto;padding:1.6rem 0 1.9rem}.logo-work__list article,.logo-related__links a{display:block}.logo-work__list p,.logo-related__links small{margin-top:.75rem;display:block}.logo-related__links svg{margin-top:1rem}}@media (prefers-reduced-motion:no-preference){.logo-hero__media img{animation:1.1s cubic-bezier(.16,1,.3,1) .12s both logo-image-arrival}.logo-hero__message{animation:.85s cubic-bezier(.16,1,.3,1) 80ms both logo-copy-arrival}}@keyframes logo-image-arrival{0%{filter:saturate(.72);transform:scale(1.035)}to{filter:saturate();transform:scale(1)}}@keyframes logo-copy-arrival{0%{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.logo-action,.logo-action svg,.logo-related__links svg{transition-duration:.01ms}}
