@layer base,components,utilities;@layer base{:root{--wrapper-size: 90rem;--color-black: #000;--color-white: #fff;--color-purple: #b99fcc;--color-green: #3db86f;--color-yellow: #f7e857;--color-orange: #f09a1f;--color-beige: #eee7d5;--color-card: var(--color-white);--color-accent: var(--color-black);--color-accent-text: var(--color-white);--color-link: var(--color-text);--color-text: var(--color-black);--color-background: var(--color-beige);--border-radius-0: 0;--border-radius-sm: .5rem;--border-radius-md: 1rem;--border-radius-lg: 1.5rem;--border-radius-full: 9999rem;--border-weight-sm: .0625rem;--border-weight-md: .1rem;--border-weight-lg: .25rem;--font-sans: "MaxiRoundBold", system-ui, sans-serif;--font-serif: "LiterataTT", serif;--font-code: ui-monospace, monospace;--size-2xs: clamp(.7813rem, .753rem + .1411vw, .88rem);--size-xs: clamp(.9375rem, .8911rem + .2321vw, 1.1rem);--size-sm: clamp(1.125rem, 1.0536rem + .3571vw, 1.375rem);--size-md: clamp(1.35rem, 1.2446rem + .5268vw, 1.7188rem);--size-lg: clamp(1.62rem, 1.469rem + .7549vw, 2.1484rem);--size-xl: clamp(1.944rem, 1.7321rem + 1.0594vw, 2.6855rem);--size-2xl: clamp(2.3328rem, 2.0402rem + 1.463vw, 3.3569rem);--size-3xl: clamp(2.7994rem, 2.4003rem + 1.9954vw, 4.1962rem);--regular: 400;--bold: 700;--black: 900;--leading-base: 1.5;--leading-scale: 1.25;--leading-sm: calc(var(--leading-base) / var(--leading-scale));--leading-md: var(--leading-base);--leading-lg: calc(var(--leading-md) * var(--leading-scale));--tracking-sm: -.025em;--tracking-md: 0;--tracking-lg: .1em;--tracking-xl: .3em;--space-3xs: clamp(.3125rem, .2946rem + .0893vw, .375rem);--space-2xs: clamp(.5625rem, .5268rem + .1786vw, .6875rem);--space-xs: clamp(.875rem, .8214rem + .2679vw, 1.0625rem);--space-sm: clamp(1.125rem, 1.0536rem + .3571vw, 1.375rem);--space-md: clamp(1.6875rem, 1.5804rem + .5357vw, 2.0625rem);--space-lg: clamp(2.25rem, 2.1071rem + .7143vw, 2.75rem);--space-xl: clamp(3.375rem, 3.1607rem + 1.0714vw, 4.125rem);--space-2xl: clamp(4.5rem, 4.2143rem + 1.4286vw, 5.5rem);--space-3xl: clamp(6.75rem, 6.3214rem + 2.1429vw, 8.25rem);--space-3xs-2xs: clamp(.3125rem, .2054rem + .5357vw, .6875rem);--space-2xs-xs: clamp(.5625rem, .4196rem + .7143vw, 1.0625rem);--space-xs-sm: clamp(.875rem, .7321rem + .7143vw, 1.375rem);--space-sm-md: clamp(1.125rem, .8571rem + 1.3393vw, 2.0625rem);--space-md-lg: clamp(1.6875rem, 1.3839rem + 1.5179vw, 2.75rem);--space-lg-xl: clamp(2.25rem, 1.7143rem + 2.6786vw, 4.125rem);--space-xl-2xl: clamp(3.375rem, 2.7679rem + 3.0357vw, 5.5rem);--space-2xl-3xl: clamp(4.5rem, 3.4286rem + 5.3571vw, 8.25rem);--space-sm-xl: clamp(1.125rem, .2679rem + 4.2857vw, 4.125rem);--space-sm-lg: clamp(1.125rem, .6607rem + 2.3214vw, 2.75rem);--space-md-xl: clamp(1.6875rem, .9911rem + 3.4821vw, 4.125rem);--space-lg-3xl: clamp(2.25rem, .5357rem + 8.5714vw, 8.25rem);--grid-12-col: repeat(12, 1fr);--grid-compound: 2fr 1fr 1fr 2fr 2fr 1fr 1fr 2fr;--grid-column-gap: var(--space-sm-md);--grid-row-gap: var(--space-sm-md);--grid-max: var(--wrapper-size)}}@layer base{@font-face{font-family:MaxiRoundBold;src:url(../fonts/ABCMaxiRound-Bold.woff2) format("woff2")}@font-face{font-family:LiterataTT;src:url(../fonts/LiterataTT-TextRegular.woff2) format("woff2");font-weight:400}@font-face{font-family:LiterataTT;src:url(../fonts/LiterataTT-TextBold.woff2) format("woff2");font-weight:700}@font-face{font-family:LiterataTT;src:url(../fonts/LiterataTT-TextItalic.woff2) format("woff2");font-weight:400;font-style:italic}@font-face{font-family:LiterataTT;src:url(../fonts/LiterataTT-TextBoldItalic.woff2) format("woff2");font-weight:700;font-style:italic}}@layer base{@keyframes bubble-shake{0%,to{transform:scale(1.06) rotate(1.6deg)}26%{transform:scale(1.06) rotate(0)}60%{transform:scale(1.06) rotate(-1.6deg)}76%{transform:scale(1.06) rotate(0)}}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(calc(-100% - var(--marquee-gap)))}}}@layer base{body{background-color:var(--color-background);font-family:var(--font-serif);color:var(--color-text);font-size:var(--size-sm);line-height:var(--leading-md);min-height:calc(100vh - var(--space-md));padding:var(--space-sm-xl);max-width:var(--wrapper-size);margin-inline:auto}:where(*,*:before,*:after){box-sizing:border-box;margin:0;padding:0;color:var(--color-text)}:where(*,*:before,*:after)::selection{color:var(--color-background);background-color:var(--color-text)}:where(*,*:before,*:after):focus-visible{outline:var(--border-weight-md) var(--color-text) dashed;outline-offset:var(--border-weight-md)}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{margin:0;font-size:inherit;font-family:var(--font-sans);font-weight:inherit}html{scrollbar-gutter:stable}a{color:var(--color-link)}figure{margin:0}video,img{max-width:100%;height:auto}code,pre{font-family:var(--font-code)}:where(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6){text-wrap:balance;line-height:var(--leading-sm)}:where(h1,h2,h3,h4,h5,h6,p,ul,ol,dl,pre,blockquote){width:100%;margin-inline:auto;overflow-wrap:break-word}h1,.h1{font-size:var(--size-3xl);font-weight:var(--bold);margin-block-end:var(--space-2xl) var(--space-md)}h2{font-size:var(--size-2xl);font-weight:var(--bold);margin-block:var(--space-xl) var(--space-md)}h3{font-size:var(--size-xl);font-weight:var(--bold);margin-block:var(--space-md) var(--space-sm)}h2+h3{margin-block:var(--space-md)}h4{font-size:var(--size-lg)}h5{font-size:var(--size-md)}h6{font-size:var(--size-sm)}h4,h5,h6{margin-block:var(--space-sm) 0;font-size:var(--size-2);font-weight:600}p,ul,ol,dl,pre,blockquote{width:100%;margin-inline:auto;overflow-wrap:break-word}p,ul,ol,dl,details{margin-block:var(--space-sm);margin-inline:0}:where(a,li,dd,strong,em,i,mark){color:inherit}:where(ul:not([class]),ol:not([class])){padding-inline-start:1.75ch}li>ul,li>ol{margin-block:var(--space-xs) 0}ul{list-style-type:disc}ol{list-style-type:decimal}li{position:relative;color:inherit}li:where(li+li){margin-block-start:0}li :where(ul,ol){margin-block-start:0}li::marker{color:var(--color-green-dark)}b,strong{font-weight:700}i,em{font-style:italic}small{font-size:var(--size-xs)}mark{color:inherit}a{color:var(--color-text);text-decoration-thickness:var(--border-weight-md);text-underline-offset:.15rem;text-decoration-color:var(--color-link);transition:text-decoration-thickness .1s ease,color .1s ease}a:hover{text-decoration-thickness:var(--border-weight-lg);text-decoration-skip-ink:none}a.active{background:var(--color-link-active)}summary::marker{content:""}nav ol,nav ul{list-style-type:none;margin:0;padding:0}section{margin-block:var(--space-lg-3xl)}footer nav ul{display:flex;gap:var(--space-sm)}section :where(h1,h2,h3,h4,h5,h6,p,ul,ol,dl,pre,blockquote):first-child{margin-block-start:0}}@layer base;@layer components{[role=banner]{container-type:inline-size;margin-block-end:var(--space-md-xl)}[role=banner]>div:first-child{display:grid;gap:var(--space-md-lg)}@container (width > 48rem){[role=banner]>div:first-child{grid-template-columns:3fr 2fr;align-items:center}[role=banner]>div:first-child>div{text-align:right}}}@layer components{.logo{width:fit-content;font-weight:var(--bold);text-decoration:none;text-transform:uppercase;display:grid;font-family:var(--font-sans);grid-template-columns:repeat(5,var(--size-2xl))}@media(min-width:32rem){.logo{grid-template-columns:repeat(9,var(--size-2xl))}}.logo square{background-color:var(--color-white);display:inline-flex;align-items:center;justify-content:center;font-size:var(--size-xl);width:var(--size-2xl);height:var(--size-2xl);transition:all .1s ease-in-out}.logo square span{color:var(--color-black)}.logo square:nth-child(odd){background-color:var(--color-black)}.logo square:nth-child(odd) span{color:var(--color-white)}.logo square:nth-child(6){font-feature-settings:"ss01"}.logo:hover square span,.logo:focus square span{transform:scale(1.05)}@media(prefers-reduced-motion:no-preference){.logo:hover square span,.logo:focus square span{transform:none;animation:bubble-shake .2s cubic-bezier(.1,.6,.4,1) infinite}}}@layer components{.btn{display:inline-flex;background-color:var(--color-accent);text-decoration:none;font-weight:var(--bold);color:var(--color-accent-text);padding:var(--space-xs) var(--space-sm);border-radius:var(--border-radius-full)}.btn:hover{transform:scale(1.05)}@media(prefers-reduced-motion:no-preference){.btn:hover{transform:none;animation:bubble-shake .2s cubic-bezier(.1,.6,.4,1) infinite}}}@layer components{hr{border:0;height:.5rem;background-color:var(--color-white);background-image:linear-gradient(to right,var(--color-black) .5rem,transparent 0rem);background-size:1rem .5rem;background-repeat:repeat-x;border-radius:var(--border-radius-full)}[data-color] hr,[class*=color-] hr{background-color:var(--color-accent);background-image:linear-gradient(to right,var(--color-accent-text) .5rem,transparent 0rem)}}@layer components{.speech{background-color:var(--color-accent);border-radius:var(--border-radius-md);padding:var(--space-md);display:flex;position:relative;max-width:28rem;max-width:fit-content;flex:1;gap:var(--space-md);align-items:center}@media screen and (min-width:54rem){.speech{transform:translateY(3rem)}}.speech :after{content:"";display:block;width:2rem;height:2rem;position:absolute;right:2rem;bottom:-1rem;background-image:url(../images/haifisch.svg);background-size:cover}.speech img{width:48px}.speech p{line-height:1;margin:0}.speech .headline{font-size:var(--size-md);font-family:var(--font-sans);color:var(--color-accent-text)}.speech .subline{font-size:var(--size-sm);color:var(--color-accent-text)}.speech>.content{flex:auto;display:flex;flex-direction:column;gap:var(--space-2xs)}}@layer components{.layout{max-inline-size:var(--grid-max);display:grid;gap:var(--grid-row-gap) var(--grid-column-gap)}@media screen and (min-width:54rem){.layout{grid-template-columns:var(--grid-12-col)}}[data-layout=intro]>*:nth-child(3){transform:rotate(1.6deg)}@media screen and (min-width:54rem){[data-layout=intro]{grid-template-columns:var(--grid-12-col)}[data-layout=intro]>*:nth-child(1){grid-column:1/12}[data-layout=intro]>*:nth-child(2){grid-column:1/6}[data-layout=intro]>*:nth-child(3){grid-column:7/-1;display:flex;justify-content:flex-end;align-items:flex-start}}@media screen and (min-width:54rem){[data-layout=butler]{grid-template-columns:var(--grid-compound)}[data-layout=butler]>*:nth-child(1){grid-column:1/1;align-items:flex-start;justify-content:flex-end;display:flex}[data-layout=butler]>*:nth-child(2){grid-column:2/7}[data-layout=butler]>*:nth-child(3){grid-column:7/9;padding-block-start:12rem}[data-layout=butler]>*:nth-child(3) p{font-size:var(--size-xs)}}@media screen and (min-width:54rem){[data-layout=questionnaire]{grid-template-columns:var(--grid-compound)}[data-layout=questionnaire]>*:nth-child(1){grid-column:1/1;align-items:flex-start;justify-content:flex-end;display:flex}[data-layout=questionnaire]>*:nth-child(2){grid-column:5/9}}@media screen and (min-width:54rem){[data-layout=gonzales]{grid-template-columns:var(--grid-compound)}[data-layout=gonzales]>*:nth-child(1){grid-column:1/1;align-items:flex-start;justify-content:flex-end;display:flex}[data-layout=gonzales]>*:nth-child(2){grid-column:2/9}}[data-layout=grizzly]>*:nth-child(n){transform:rotate(-.6deg)}[data-layout=grizzly]>*:nth-child(2n){transform:rotate(1deg)}[data-layout=grizzly]>*:nth-child(3n){transform:rotate(-.3deg)}[data-layout=grizzly]>*:nth-child(4n){transform:rotate(.7deg)}@media screen and (min-width:44rem){[data-layout=grizzly]{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width:80rem){[data-layout=grizzly]{grid-template-columns:repeat(3,1fr)}}[data-layout=playground]>*:nth-child(3){overflow:hidden}@media screen and (min-width:54rem){[data-layout=playground]{grid-template-columns:var(--grid-compound);position:relative}[data-layout=playground]>*:nth-child(1){grid-column:1/1;align-items:flex-start;justify-content:flex-end;display:flex}[data-layout=playground]>*:nth-child(2){grid-column:2/6;transform:rotate(-.4deg)}[data-layout=playground]>*:nth-child(3){grid-column:6/9;transform:rotate(1deg)}}@media screen and (min-width:54rem){[data-layout=footer]{grid-template-columns:var(--grid-12-col)}[data-layout=footer]>*:nth-child(1){grid-column:1/7}[data-layout=footer]>*:nth-child(2){grid-column:7/13;transform:rotate(1.2deg)}[data-layout=footer]>*:nth-child(3){grid-column:1/13}}}@layer components{.accordion__panel{display:flex;gap:var(--space-xs);align-items:center;cursor:pointer}.accordion__panel:before{content:"";display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.5rem;height:1.5rem;border-radius:var(--border-radius-full);background-color:var(--color-accent);background-image:url(../images/icon-dropdown-white.svg);color:var(--color-accent-text);transition:transform .2s ease-in-out}.accordion[open] .accordion__panel:before{transform:rotate(180deg)}.accordion__title{margin:0;text-decoration-thickness:0;text-underline-offset:.15rem;text-decoration-color:var(--color-link);transition:text-decoration-thickness .1s ease,color .1s ease}.accordion__panel:hover .accordion__title,.accordion__panel:focus-visible .accordion__title{text-decoration:underline;text-decoration-thickness:var(--border-weight-lg);text-decoration-skip-ink:none}.accordion__text{margin-top:var(--space-xs);padding-left:calc(1.5rem + var(--space-xs));position:relative}.accordion__text:before{content:"";width:.4rem;background-color:var(--color-accent);position:absolute;top:0;bottom:0;left:.55rem}}@layer components{.recommendation{background-color:var(--color-white);border-radius:var(--border-radius-md);overflow:hidden;display:flex;flex-direction:column;gap:0}.recommendation blockquote{flex:1 0 auto}.recommendation blockquote:before{content:"\201c"}.recommendation blockquote:after{content:"\201d"}.recommendation blockquote>:first-child{margin-block-start:0}.recommendation blockquote>:last-child{margin-block-end:0}.recommendation__header{background:var(--color-accent);color:var(--color-accent-text);white-space:nowrap;display:flex;align-items:center;justify-content:center;font-family:var(--font-sans);font-weight:var(--bold);font-size:var(--size-xs);padding-block:var(--space-3xs);position:relative}.recommendation__header:before,.recommendation__header:after{content:"";width:2rem;position:absolute;top:0;bottom:0}.recommendation__header:before{left:0;background-image:linear-gradient(to right,var(--color-accent) 10%,transparent)}.recommendation__header:after{right:0;background-image:linear-gradient(to left,var(--color-accent) 10%,transparent)}.recommendation__content{padding:var(--space-sm);display:flex;flex-direction:column;flex:1 0 auto;gap:var(--space-sm)}.recommendation__content>:first-child{margin-block-start:0}.recommendation__content>:last-child{margin-block-end:0}.recommendation .author{flex-shrink:0}}@layer components{.author{display:flex;font-size:var(--size-xs);gap:var(--space-xs);align-items:center}.author__avatar{border-radius:var(--border-radius-sm);width:3rem;height:3rem;flex-shrink:0;transform:rotate(-3deg)}.author__description{display:flex;flex-direction:column;gap:.1lh}.author__job{font-size:var(--size-2xs)}}@layer components{.dropcap p:first-of-type:first-letter{font-size:3.15em;margin-block-start:.15em;margin-inline-end:.15em;color:var(--color-accent);font-weight:700;float:left;text-indent:0;line-height:1}}@layer components{.tags{--marquee-gap: var(--space-2xs);margin-block-start:1rem;display:flex;gap:var(--space-2xs);align-items:center;white-space:nowrap;overflow:hidden;position:relative}.tags:hover ul{animation-play-state:paused}.tags:before,.tags:after{content:"";width:2rem;position:absolute;top:0;bottom:0;z-index:10}.tags:before{left:0;background-image:linear-gradient(to right,var(--color-background) 10%,transparent)}.tags:after{right:0;background-image:linear-gradient(to left,var(--color-background) 10%,transparent)}.tags ul{margin:0;padding:0;list-style-type:none;width:fit-content;display:flex;gap:var(--space-2xs);flex:1 0 auto;animation:marquee 60s linear infinite}@media(prefers-reduced-motion:no-preference){.tags ul{animation:marquee 25s linear infinite}}.tags ul li{display:inline-flex;flex:0 0 auto;background-color:var(--color-accent);font-family:var(--font-sans);font-weight:var(--bold);color:var(--color-text);padding:var(--space-2xs) var(--space-xs);border-radius:var(--border-radius-sm)}.tags ul li:nth-child(n){--color-accent: var(--color-orange)}.tags ul li:nth-child(2n){--color-accent: var(--color-purple)}.tags ul li:nth-child(3n){--color-accent: var(--color-green)}.tags ul li:nth-child(4n){--color-accent: var(--color-yellow)}}@layer components{.polaroid{border:8px solid var(--color-accent);border-radius:var(--border-radius-md)}.polaroid[data-size=small]{border-width:4px;border-radius:var(--border-radius-sm)}}@layer components{.gear-talk-plug{display:flex;flex-direction:row-reverse;gap:var(--grid-column-gap);align-items:center}.gear-talk-plug p{margin:0}.gear-talk-plug svg{width:8rem;flex-shrink:0}}@layer components{.card{background-color:var(--color-card);border-radius:var(--border-radius-md);padding:var(--space-sm-lg)}.card>:first-child{margin-block-start:0}.card>:last-child{margin-block-end:0}}@layer components{.list{list-style-type:none;margin:0}.list>li{margin-block-start:var(--space-md)}.list>li>*{margin:0}.list>li:first-child{margin-block-start:0}.list[data-variant=divider]{border-top:1px solid rgb(0,0,0,.2)}.list[data-variant=divider]>li{margin:0;border-bottom:1px solid rgb(0,0,0,.2);padding-block:var(--space-md)}}@layer components{.vertical{text-decoration:underline;text-decoration-color:var(--color-accent);text-decoration-thickness:var(--space-sm);text-decoration-skip-ink:none}@media screen and (min-width:54rem){.vertical{display:inline-flex;font-size:var(--size-3xl);margin:0;text-align:right;text-box-trim:trim-both;text-orientation:sideways;writing-mode:sideways-lr;align-items:flex-start;gap:var(--space-sm);position:sticky;top:var(--space-sm-md);text-decoration-thickness:var(--space-md)}}}@layer components{footer{display:grid;gap:var(--space-md)}}@layer components;@layer utilities{.clamp{max-inline-size:55ch;margin-inline:auto}.columns{column-width:30ch;gap:var(--grid-column-gap)}[data-size="3xl"],.size-3xl{font-size:var(--size-3xl)}[data-size="2xl"],.size-2xl{font-size:var(--size-2xl)}[data-size=xl],.size-xl{font-size:var(--size-xl)}[data-size=lg],.size-lg{font-size:var(--size-lg)}[data-size=md],.size-md{font-size:var(--size-md)}[data-size=sm],.size-sm{font-size:var(--size-sm)}[data-size=xs],.size-xs{font-size:var(--size-xs)}[data-size="2xs"],.size-2xs{font-size:var(--size-2xs)}[data-font=serif],.serif{font-family:var(--font-serif)}[data-font=sans],.sans{font-family:var(--font-sans)}[data-weight=regular],.regular{font-weight:var(--regular)}[data-weight=bold],.bold{font-weight:var(--bold)}[data-weight=black],.black{font-weight:var(--black)}[data-align=left]{text-align:start}[data-align=right]{text-align:end}[data-align=center]{text-align:center;text-wrap:balance;margin-inline:auto}[data-leading=sm],.leading-sm{line-height:var(--leading-sm)}[data-leading=md],.leading-md{line-height:var(--leading-md)}[data-leading=lg],.leading-lg{line-height:var(--leading-lg)}.tracking-sm{letter-spacing:var(--tracking-sm)}.tracking-md{letter-spacing:var(--tracking-md)}.tracking-lg{letter-spacing:var(--tracking-lg)}.tracking-xl{letter-spacing:var(--tracking-xl)}}@layer utilities{.sticky{position:sticky;top:var(--space-sm-md)}}@layer utilities{[data-color=green]{--color-accent: var(--color-green);--color-accent-text: var(--color-black)}[data-color=orange]{--color-accent: var(--color-orange);--color-accent-text: var(--color-black)}[data-color=purple]{--color-accent: var(--color-purple);--color-accent-text: var(--color-black)}[data-color=yellow]{--color-accent: var(--color-yellow);--color-accent-text: var(--color-black)}[data-color] .accordion__panel:before{background-image:url(../images/icon-dropdown.svg)}}@layer utilities{.visually-hidden:not(:focus):not(:active){clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}}@layer utilities;
/*# sourceMappingURL=main.css.map */