@layer skin{[data-template=creative-portfolio]{--bg:var(--brand-paper);--fg:var(--brand-ink);--muted:color-mix(in oklab, var(--brand-ink) 60%, var(--brand-paper));--line:color-mix(in oklab, var(--brand-ink) 18%, transparent);--surface:color-mix(in oklab, var(--brand-paper) 90%, var(--brand-ink));--primary:var(--brand-ink);--on-primary:var(--brand-paper);--dark-bg:var(--brand-dark);--focus:var(--brand-accent);--display-weight:800;--display-tracking:-.04em;--display-leading:.92;--h1:clamp(2.5rem, 1.6197rem + 3.7559vw, 5rem);--h2:clamp(2rem, 1.5599rem + 1.8779vw, 3.25rem);--radius-s:0;--radius:0;--radius-l:0;--btn-pad:.9em 1.5em;--btn-weight:500;--container:1680px;--gutter:clamp(1rem, .5rem + 1.6vw, 2rem);--gap:clamp(.75rem, .5rem + 1vw, 1.25rem);--nav-h:72px;--menu-bg:var(--brand-dark);--menu-fg:var(--brand-paper);--menu-btn-bg:var(--brand-accent);--menu-btn-fg:var(--brand-ink);--menu-current:var(--brand-accent);--nav-over-fg:#fff;--name-ratio:.95;--giant-ratio:.95}[data-template=creative-portfolio] .logo-word{letter-spacing:-.02em;font-size:1.15rem;font-weight:700}[data-template=creative-portfolio] .nav-toggle{font-weight:500}[data-template=creative-portfolio] .nav-toggle-label{clip-path:none;width:auto;height:auto;position:static}[data-template=creative-portfolio]{--menu-size:clamp(1.625rem, 1.25rem + 1.6vw, 2.375rem)}[data-template=creative-portfolio] .rl-name{mix-blend-mode:difference;color:#fff;font-weight:800}[data-template=creative-portfolio] [data-variant=HScroll]{--bg:var(--brand-dark);--fg:var(--brand-paper);--muted:color-mix(in oklab, var(--brand-paper) 65%, transparent)}[data-template=creative-portfolio] .hs-item{width:clamp(16rem,34vw,34rem)}[data-template=creative-portfolio] .hs-item:nth-child(2n){margin-top:0}[data-template=creative-portfolio] .hs-item figcaption{grid-template-columns:1fr auto;align-items:baseline;font-size:.9rem}[data-template=creative-portfolio] .hs-item figcaption strong{font-weight:500}[data-template=creative-portfolio] .gm-grid{column-gap:var(--gap)}[data-template=creative-portfolio] .gm-item{margin-bottom:var(--gap)}[data-template=creative-portfolio] .gm-item figcaption{font-size:.85rem}[data-template=creative-portfolio] .gm-item .media img{transition:transform 1s cubic-bezier(.2,.7,.2,1)}[data-template=creative-portfolio] .gm-item:hover .media img{transform:scale(1.04)}[data-template=creative-portfolio] .st-body{font-family:var(--font-body);letter-spacing:-.02em;font-weight:400}[data-template=creative-portfolio] .ls-item{font-family:var(--font-body);font-weight:500}[data-template=creative-portfolio] .ib-name{font-size:var(--h2);letter-spacing:-.04em}[data-template=creative-portfolio] .lw{padding-block:0 var(--section-y);gap:1.25rem}[data-template=creative-portfolio] .lw-title{font-family:var(--font-display);letter-spacing:-.02em;color:var(--fg);text-align:start;font-size:clamp(1.15rem,1rem + .6vw,1.5rem);font-weight:700}[data-template=creative-portfolio] .lw-cell{min-height:clamp(5.5rem,8vw,7.5rem);color:var(--fg);letter-spacing:-.03em;font-size:clamp(1.05rem,.9rem + .7vw,1.5rem);font-weight:700}[data-template=creative-portfolio] .lw-cell:hover{background:var(--brand-accent);color:var(--brand-ink)}[data-template=creative-portfolio] .cbt{text-align:start;justify-items:start}[data-template=creative-portfolio] .cbt-title{transform-origin:0 100%}[data-template=creative-portfolio] .cs-form{border:1px solid var(--line);background:0 0}[data-template=creative-portfolio] .footer{--footer-bg:var(--brand-dark)}.menu-open .pf-cursor,.lightbox-open .pf-cursor{visibility:hidden}.pf-cursor{z-index:60;pointer-events:none;background:var(--brand-accent);width:84px;height:84px;color:var(--brand-ink);font:600 .8rem/1 var(--font-body);border-radius:50%;place-items:center;margin:-42px 0 0 -42px;display:grid;position:fixed;top:0;left:0;scale:0}[data-template=creative-portfolio] .ac-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr))}[data-template=creative-portfolio] :is(.pc-head,.ix-head,.pl-head,.ps-head){max-width:none}[data-template=creative-portfolio] :is(.pc-head,.ix-head,.pl-head,.ps-head) .lead{max-width:40rem}[data-template=creative-portfolio] :is(.fq-head,.cs-info) .h2{font-size:clamp(1.75rem,1.4859rem + 1.1268vw,2.5rem)}@media (width<=399px){[data-template=creative-portfolio]{--h1:clamp(2.25rem, 11vw, 2.5rem)}[data-template=creative-portfolio] .cct-title{font-size:9.6vw}}[data-template=creative-portfolio] .pc-plan[data-featured] :is(.pc-unit,.pc-text){color:color-mix(in oklab, var(--brand-ink) 78%, var(--brand-paper))}}@keyframes cp-in{0%{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}html[data-template=creative-portfolio]::view-transition-old(root){animation:none}html[data-template=creative-portfolio]::view-transition-new(root){animation:.8s cubic-bezier(.7,0,.2,1) both cp-in}
