/**
* @license
*
* Font Family: Switzer
* Designed by: Jérémie Hornus
* URL: https://www.fontshare.com/fonts/switzer
* © 2026 Indian Type Foundry
* /assets/fonts/License/FFL.txt -- 02.2026
* Switzer Variable (Variable font)
*
*/

/* ==================================================================================== 
 01. Font 
 ==================================================================================== */
@font-face {
font-family: 'Switzer-Variable';
src: url('/assets/fonts/Switzer-Variable.woff2') format('woff2');
font-weight: 100 900;
font-display: swap;
font-style: normal; } 

:root {
--bg-fallback: #FEFBF6;
--bg-gradient: linear-gradient(180deg, rgba(254, 251, 246, 1) 77%, rgba(227, 168, 240, 0.9) 99%);
--black: #000000;
--white: #f7f7f7;
--violet-light: #6600cc;
--violet-dark: #4a0099;
--orange: #cc3333;
--orange-light: #f8f1f1;
--card-bg: linear-gradient(160deg, #fcfdff 0%, #e1eaff 48%, #d8e4ff 100%);

--f-base: 'Switzer-Variable', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
--f-serif: Georgia, 'Times New Roman', Times, serif;

--fs-small: clamp(1rem, 0.95rem + 0.25vw, 1.125rem); 
--fs-base: clamp(1.125rem, 1rem + 0.5vw, 1.35rem); 
--fs-h1: clamp(2.1875rem, 1.54rem + 2.76vw, 3.75rem);
--fs-h1-underline: clamp(1.5625rem, 1.43rem + 0.55vw, 1.875rem); 
--fs-h2: clamp(1.5625rem, 1.04rem + 2.21vw, 2.8125rem); 
--fs-h3: clamp(1.35rem, 1.1rem + 1vw, 1.875rem); 

--space-s: clamp(1rem, 2vw, 1.5rem);
--space-m: clamp(1.5rem, 4vw, 3rem);
--space-l: clamp(3rem, 8vw, 6rem);
--space-xl: clamp(6rem, 16vw, 12rem); 

--gallery-gap: clamp(0.75rem, 1.5vw, 1rem);
--gallery-columns: 3; }

@media (prefers-color-scheme: dark) {
:root {
--bg-fallback: #1a1a2e;
--bg-gradient: linear-gradient(180deg, rgba(26, 26, 46, 1) 77%, rgba(100, 40, 120, 0.9) 99%);
--black: #ffffff;
--white: #222222;
--violet-dark: #e0d4fc;
--violet-light: #a882ff;
--orange: #ff6666;
--orange-light: #3c3c3c;
--card-bg: linear-gradient(160deg, #4a247c 0%, #381961 52%, #2f1454 100%); } } 
 

/* ==================================================================================== 
 02. Reset & Base 
 ==================================================================================== */
*, *::before, *::after {box-sizing: border-box; }
input, button, textarea, select {font: inherit; }
p, h1, h2, h3 {overflow-wrap: anywhere; hyphens: auto; }

body {
margin: 0 auto;
max-width: 1280px;
padding: var(--space-s);
font-family: var(--f-base);
font-size: var(--fs-base);
font-weight: 400;
-webkit-font-smoothing: antialiased;
line-height: 1.6;
color: var(--black);
background: var(--bg-fallback);
background: var(--bg-gradient); }


/* ==================================================================================== 
 03. Typography 
 ==================================================================================== */
h1, h2, h3, h4 {
line-height: 1.05;
text-wrap: balance; }

h1 {
font-size: var(--fs-h1);
font-weight: 800;
line-height: 1;
color: var(--violet-dark); 
margin-top: var(--space-l); }

h2 {
font-size: var(--fs-h2);
font-weight: 800;
line-height: 1.08;
color: var(--violet-dark);
margin-top: var(--space-l); } 


h3 {
font-size: var(--fs-h3);
font-weight: 800;
color: var(--violet-dark); } 


p, article ul {
margin: var(--space-m) 0;
max-width: 65ch;
line-height: 1.5;
color: var(--black); }

ul {margin-top: 0; } 

strong {font-weight: 700; }

span.serif {
display: block;
font-family: var(--f-serif);
font-size: var(--fs-h1-underline);
font-style: italic;
font-weight: 700;
line-height: 1.3;
color: var(--violet-light); }

.vh:not(:focus):not(:active) {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
white-space: nowrap;
border: 0;
clip-path: inset(50%); }


/* ==================================================================================== 
 04. Links 
 ==================================================================================== */
a {
color: var(--violet-dark);
text-decoration: underline;
text-decoration-color: var(--violet-dark);
text-decoration-thickness: 2px;
text-underline-offset: 4px;
cursor: pointer;
outline: none; }

a:hover {
color: var(--orange);
text-decoration-color: var(--orange); }

h1:focus-visible,
h2:focus-visible,
h3:focus-visible,
a:focus-visible {
color: var(--orange);
text-decoration-color: var(--orange);
text-decoration-thickness: 6px;
outline: none; }

h1:focus:not(:focus-visible),
h2:focus:not(:focus-visible),
h3:focus:not(:focus-visible),
a:focus:not(:focus-visible) {
outline: none; } 

::selection {background-color: var(--violet-dark); color: var(--white); }
::-moz-selection {background-color: var(--violet-dark); color: var(--white); } 

nav.search, nav.pagination {text-align: center; margin: 3rem auto 5rem auto; }
nav.search .nav-link, nav.pagination a {width: auto; display: inline; }


/* ==================================================================================== 
 05. Header & Navigation 
 ==================================================================================== */
header {
margin-bottom: var(--space-l); position: relative; z-index: 20; }

svg.logo {
display: block;
width: 100%;
height: auto;
max-width: 720px; }

svg.logo path.path1 {
fill: var(--violet-light);
stroke: var(--violet-light); }

svg.logo path.path2 {
fill: var(--violet-dark);
stroke: var(--violet-dark); }

a.logo-link:hover svg.logo path.path1,
a.logo-link:hover svg.logo path.path2,
a.logo-link:focus-visible svg.logo path.path1,
a.logo-link:focus-visible svg.logo path.path2 {
fill: var(--orange);
stroke: var(--orange); }

a.logo-link:focus-visible {
outline: none; }

nav.topnav {margin-top: var(--space-s); }

.nav-list {
display: flex;
flex-wrap: wrap;
gap: 0.6rem;
margin: 0;
padding: 0;
list-style: none; }

.nav-link {
display: flex;
align-items: center;
justify-content: center; }

.nav-link, nav.pagination a {
font-size: var(--fs-small);
font-weight: 500;
white-space: nowrap;
text-decoration: none;
padding: 0.25em 0.75em;
color: var(--violet-dark);
border: 1px solid var(--violet-dark);
border-radius: 99px;
transition: 
background-color 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
border-color 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
color 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.nav-link:hover, .nav-link:focus-visible, .nav-link[aria-current='page'], nav.pagination a:hover, nav.pagination a:focus-visible {
color: var(--white);
background-color: var(--orange);
border-color: transparent;
outline: none; } 

@media (max-width: 420px) {
.nav-list {gap: 0.5rem; }
.nav-link {font-size: 0.9rem; padding: 0.2em 0.5em; } 
.nav-list > li:nth-child(4) {display: none; } }

@media (max-width: 370px) {
.nav-list {flex-wrap: nowrap; }
.nav-link {font-size: 0.8rem; padding: 0.2em 0.5em; } }


/* ==================================================================================== 
 06. Hero 
 ==================================================================================== */
.hero {
position: relative;
z-index: 10;
inline-size: clamp(260px, 60vw, 900px);
margin-inline-start: auto;
margin-inline-end: clamp(1rem, 5vw, 5rem);
margin-block-start: calc(-1 * 240px); }

.hero img {
display: block;
inline-size: 100%;
max-inline-size: 800px;
block-size: auto; }

.hero.standard img {inline-size: 100%; }
.hero.mittel img {max-inline-size: 640px; }
.hero.klein img {max-inline-size: 480px; }
.hero.mini img {max-inline-size: 320px; }


@media (max-width: 840px) {.hero {inline-size: auto; max-inline-size: none; margin: 0 0 var(--space-xl); } }


/* ==================================================================================== 
 07. Cards - Container Styles (Desktop First) 
 ==================================================================================== */
.card-list {
display: flex;
flex-wrap: nowrap; gap: 1.5rem;
margin: 0;
padding: 2rem; 
list-style: none;
overflow-x: auto;
overscroll-behavior-x: contain;
scroll-snap-type: x mandatory;
scrollbar-width: none; -ms-overflow-style: none; }
 
.card-list::-webkit-scrollbar {
display: none; }
 
.card-gallery {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
margin: 0;
padding: 0; list-style: none; }
 
.card-item {display: block; scroll-snap-align: center; }
.card-list .card-item {flex: 0 0 400px; width: 400px; }
.card-gallery .card-item {width: auto; height: 100%; }

.card-item > a {
display: flex;
flex-direction: column;
height: 100%; 
padding: 1rem;
color: var(--black);
text-decoration: none;
background: var(--card-bg);
border-radius: 1.2rem;
opacity: 0.95;
transform: scale(0.98);
transition: background 0.4s ease, transform 0.4s ease, opacity 0.4s ease; }

.card-item > a:hover {
opacity: 1;
transform: scale(1);  
background: var(--white); }

.card-item > a:focus-visible {
outline: 4px solid var(--orange);
outline-offset: 4px;
opacity: 1; 
background: var(--orange-light) !important; }
 
.card-item > a:hover p, .card-item > a:hover h3, .card-item > a:hover time { 
color: var(--black); }
 
.card-visual {margin: 0 0 1rem 0; padding: 0; }

.card-visual img {
display: block;
width: 100%;
aspect-ratio: 1 / 1;
object-fit: cover;
border-radius: 0.5rem; }
 
.card-content {
display: flex;
flex-direction: column;
flex-grow: 1;
padding: 0; }

.card-content h3 {
display: block;
font-size: var(--fs-h3);
font-weight: 700;
margin-bottom: 0.5rem; }

.card-content p {
font-size: var(--fs-small);
color: var(--black);
margin: 0 0 2rem 0; }
 
.card-meta {
display: flex;
justify-content: space-between;
margin-top: auto; padding-top: 1.25rem;
font-size: var(--fs-small);
border-top: 1px solid rgba(61, 50, 45, 0.1); }

.card-badge {
padding: 0.35em 0.75em;
font-weight: 500;
line-height: 1;
color: var(--violet-dark);
border: 1px solid var(--violet-dark);
border-radius: 99px;
scale: .9; }

@media (max-width: 1024px) {.card-gallery {grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {.card-gallery {grid-template-columns: 1fr; gap: 16px; } }
@media (max-width: 420px) {
.card-list .card-item {flex: 0 0 95vw; width: 95vw; max-width: 350px; }
.card-list {padding: 1rem; }
.card-visual img {aspect-ratio: 4 / 3; } }


/* ==================================================================================== 
 08. Content & Media 
 ==================================================================================== */
#content:not(:focus-visible) {outline: none; }

section, article { display: block; margin-bottom: var(--space-l); }

section > figure, section > img, article > figure, article > img {
display: block;
width: 100%;  
max-width: 85ch;
margin-bottom: var(--space-l); }

figure video {
display: block;
inline-size: 100%;
max-inline-size: 100%;
block-size: auto; }

article > figure.standard {max-width: 85ch; }
article > figure.mittel {max-width: 75ch; }
article > figure.klein {max-width: 65ch; }
article > figure.mini {max-width: 55ch; }

section img, article img {
width: 100%;
height: auto;
display: block; }

figure {margin: 0; padding: 0; }

figcaption, .gallery-caption { 
padding: .875rem 0 1.5rem 0; 
font-size: var(--fs-small); 
font-style: italic; }

.gallery-caption { 
border-top: 1px dotted var(--violet-dark);
margin-top: 1.5rem; }

blockquote {margin: var(--space-l) 0; max-width: 85%; padding-left: 1.5rem; margin-left: 0.5rem; border-left: 6px solid var(--violet-dark); }
div.blockquote:before {content: "→ "; }
div.blockquote {opacity: .7; }

ol li::marker {
color: grey;
font-family: var(--f-serif);
font-size: 0.8em; }

@counter-style arrow {
system: cyclic;
symbols: "→";
suffix: " "; }

ul.arrow {
list-style: arrow;
color: var(--violet-dark); }


/* NEU ############## */

.home-focus-teasers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-m);
  margin-block: var(--space-m); }

.home-focus-teasers > article {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--space-m);
  border-radius: 1.2rem;
  border: 2px solid var(--violet-dark); 
  margin-bottom: 0; }
  
.home-focus-teasers > article:hover {
background: var(--orange-light) !important;
  border: 2px solid var(--orange);  }
  

.home-focus-teasers h2 {
  margin-block-start: 0;
  margin-block-end: var(--space-s);
  font-size: var(--fs-h3); }

.home-focus-teasers p {
  margin: 0;
  max-inline-size: 38ch; }

.home-focus-teasers a {
  text-decoration: none;
  color: inherit; }

.home-focus-teasers a:hover,
.home-focus-teasers a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.15em; }

@media (max-width: 840px) {
  .home-focus-teasers {
    grid-template-columns: 1fr; } }


/* ==================================================================================== 
 09. Gallery 
 ==================================================================================== */
.gallery.one   {--gallery-columns: 1; }
.gallery.two   {--gallery-columns: 2; }
.gallery.three {--gallery-columns: 3; }
.gallery.four  {--gallery-columns: 4; }

.gallery {
display: block;
column-count: var(--gallery-columns, 1);
column-gap: var(--gallery-gap);
margin: 0;
padding: 0;
list-style: none; }

.gallery figure {
break-inside: avoid;
margin: 0 0 var(--gallery-gap) 0; }

.gallery a {
display: block;
position: relative;
border-radius: 4px;
text-decoration: none;
transition: background-color 220ms ease, opacity 220ms ease; }

.gallery img {
display: block;
width: 100%;
height: auto;
border-radius: 4px;
will-change: transform;
transform-origin: center center;
transition: transform 220ms ease; }

.gallery a:focus-visible {
outline: 4px solid var(--orange);
outline-offset: 4px; }

.gallery a:hover, .gallery a:focus-visible {
opacity: 1;
background-color: var(--orange-light) !important; }

.gallery a:hover .parvus-zoom__indicator,
.gallery a:focus-visible .parvus-zoom__indicator {
color: var(--orange);
transform: scale(1.02); }

.gallery a:hover img {
transform: scale(1.01);
 border-radius: 6px; }

.gallery.asymmetric > li:nth-child(3n) figure {
margin-block-start: 2rem;
margin-block-end: 2rem;
inline-size: 75%;
block-size: auto;
margin-inline-start: auto; }

.gallery.asymmetric > li:nth-child(4n + 1) figure {
margin-block-start: 4rem;
margin-block-end: 2rem;
inline-size: 90%;
block-size: auto;
padding-inline-start: 2rem; }

@media (max-width: 640px) {
.gallery.asymmetric > li figure {
margin: 0 0 var(--gallery-gap) 0;
inline-size: 100%;
block-size: auto;
padding-inline-start: 0; } 
.gallery {--gallery-columns: 1 !important; } }


/* ==================================================================================== 
 10. Archive 
 ==================================================================================== */
.archive-list {
max-width: 1024px;
margin: 0 auto;
display: flex;
flex-direction: column;
padding: 0;
list-style: none; }

.archive-list li {
margin: 0;
padding: 0;
border-bottom: 1px dotted var(--violet-dark); }

.archive-list li:last-child {
border-bottom: none; }

.archive-item {
position: relative;
border-radius: 4px;
transition: background-color 0.2s ease; }

.archive-item:hover {
background-color: var(--white); }

.archive-item summary:focus, .archive-item summary:focus-visible {
outline: none; }

.archive-item:has(summary:focus-visible) {
z-index: 2;
background-color: var(--orange-light);
outline: 4px solid var(--orange);
outline-offset: 4px;
border-radius: 4px; }

.archive-item summary {
position: relative;
display: grid;
grid-template-columns: 120px 1fr auto 60px;
align-items: center;
gap: var(--space-s);
padding: 2.5rem 0 1rem 0;
cursor: pointer;
list-style: none; }

.archive-item summary::-webkit-details-marker {
display: none; }

.archive-item img {
object-fit: cover;
filter: grayscale(100%);
border-radius: 4px;
transition: filter 0.4s ease, transform 0.4s ease; }

.archive-item:hover img, .archive-item[open] img, .archive-item:has(summary:focus-visible) img {
filter: grayscale(0%);
transform: scale(1.35); }

.archive-item h3 {
display: flex;
flex-direction: column;
margin: 0 0 var(--space-l) 1rem;
font-family: var(--f-base);
font-size: var(--fs-h3);
font-weight: 800;
color: var(--violet-dark);
transition: color 0.2s ease; }

.archive-item h3 small {
font-family: var(--f-serif);
font-size: var(--fs-small);
font-style: italic;
font-weight: 400;
color: inherit; }

.archive-item summary:focus-visible h3, .archive-item summary:hover h3 {
color: var(--orange); }

.archive-item .archive-aside {
hyphens: auto;
display: flex;
flex-direction: column;
text-align: right;
z-index: 2;
margin-right: 1.25rem; }

.archive-item .archive-aside b {
display: block;
font-size: var(--fs-small);
text-transform: uppercase;
color: var(--violet-light); }

.archive-item .archive-aside time {
display: block;
font-weight: 600; }

.archive-item summary::after {
content: '+';
position: absolute;
right: 20px;
top: 50%;
width: 1ch;
font-family: monospace;
font-size: 8rem;
font-weight: 400;
line-height: 0;
text-align: center;
color: var(--violet-dark);
opacity: 0.1;
transform: translateY(-50%);
pointer-events: none;
transition: opacity 0.3s ease, color 0.3s ease; }

.archive-item:hover summary::after, .archive-item:has(summary:focus-visible) summary::after {
opacity: 0.2; }

.archive-item[open] summary::after {
content: '-';
color: var(--orange);
opacity: 0.2; }

.archive-item .content {
max-width: 80ch;
padding: 0 20px var(--space-m) calc(120px + var(--space-s));
animation: slideDown 0.3s ease-out forwards; }

.archive-item .content p {
margin-top: 0;
margin-bottom: 1rem;
margin-left: 1rem;
font-size: var(--fs-base); }

.archive-item .archive-tags {
display: flex;
flex-wrap: wrap;
gap: 0.5rem; }

.project-tags span,
.archive-item .archive-tags span {
padding: 0.2em 0.8em;
margin-right: .5rem;
font-size: var(--fs-small);
font-weight: 400;
line-height: 2.5;
color: var(--violet-dark);
background: transparent;
border: 1px solid var(--violet-dark);
border-radius: 99px;
cursor: default;
transition: color 0.3s ease, background-color 0.3s ease; }

.project-tags span:hover,
.archive-item .archive-tags span:hover {
color: var(--white);
background-color: var(--violet-dark); }

@keyframes slideDown {
from {opacity: 0; transform: translateY(-5px); } 
to {opacity: 1; transform: translateY(0); } }  

.archive-list.faq {gap: 3rem; }
.archive-list.faq li {border-bottom: none; }
.archive-list.faq .archive-item {background-color: rgba(255, 255, 255, 0.5); border-bottom: 5px solid var(--violet-dark); margin-bottom: 0; }
.archive-list.faq .archive-item[open] {background-color: var(--white); box-shadow: 0 4px 12px rgba(0,0,0,0.05); }
.archive-list.faq .archive-item summary::after {content: '?'; font-size: 6rem; font-weight: 800; opacity: 0.15; right: 30px; }
.archive-list.faq .archive-item[open] summary::after {content: '!'; color: var(--orange); opacity: 0.3; }
.archive-list.faq .archive-item h3 {margin-bottom: 0.5rem; }
.archive-list.faq .archive-item .archive-aside {transform: scale(0.9); transform-origin: right center; opacity: 0.7; } 

@media (max-width: 640px) {
.archive-list.faq .archive-item summary::after {font-size: 4rem; right: 10px; }
.archive-item summary {grid-template-columns: 80px 1fr 40px; align-items: start; padding-right: 0; }
.archive-item img {width: 80px; height: 80px; grid-row: span 2; margin-top: 4px; }
.archive-item:hover img, .archive-item[open] img, .archive-item:has(summary:focus-visible) img {transform: scale(1.15); }
.archive-item h3 {grid-column: 2; word-wrap: break-word; hyphens: auto; margin-right: 0.5rem; margin-bottom: 0.5rem; }
.archive-item .archive-aside {grid-column: 1 / -1; flex-direction: row; justify-content: flex-start; align-items: baseline; gap: 0.5rem; height: auto; text-align: left; padding-inline-start: 1rem; margin-top: 0; margin-right: 0; }
.archive-item .archive-tags {padding-inline-start: 1rem; }
.archive-item .content {padding-left: 0; }
.archive-item summary::after {font-size: 4rem; right: 0; width: 40px; text-align: center; padding-right: 0; } }


/* ==================================================================================== 
 11. Form 
 ==================================================================================== */
.form-row {
display: flex;
width: 80%;
gap: 20px; 
align-items: stretch;
padding-bottom: 3rem;
border-bottom: 1px dotted var(--violet-dark); }

input, .input-field, .submit, textarea, select {
box-sizing: border-box; padding: 10px 15px; border-radius: 4px;
border: 1px solid #ccc;
outline: none; }
 
input, .input-field {
flex: 3; 
background-color: #fff;
color: #000; }
 
.submit {
flex: 1;
background-color: var(--violet-dark); color: var(--white);
font-weight: 800;
cursor: pointer;
white-space: nowrap;  display: flex; justify-content: center;
align-items: center; }
 
input:focus-visible, .input-field:focus-visible, .submit:focus-visible,
textarea:focus-visible,
select:focus-visible {
border-color: var(--orange);
outline: 2px solid var(--orange);
z-index: 10; }

@media (max-width: 640px) {
.form-row {flex-direction: column; width: 100%; } 
input, .input-field, .submit {flex: auto; width: 100%; } }


/* ==================================================================================== 
 12. Footer 
 ==================================================================================== */
footer {
margin-top: var(--space-xl);
padding: var(--space-l) 0;
border-top: 1px dotted var(--violet-dark); }

address {
font-style: normal; }

.back-to-top {
display: inline-block;
font-size: var(--fs-h3);
text-decoration: none; }

.back-to-top:hover {
text-decoration: none; }

.back-to-top:focus-visible {
text-decoration: underline;
text-underline-offset: 14px;
text-decoration-thickness: 6px; }

.leaf {
margin: var(--space-l) 0;
text-align: center; }


/* ==================================================================================== 
 13. Parvus 
 ==================================================================================== */
:root{--parvus-transition-duration:0.3s;--parvus-transition-timing-function:cubic-bezier(0.62, 0.16, 0.13, 1.01);--parvus-background-color:hsl(23deg 44% 96%);--parvus-btn-background-color: transparent;--parvus-btn-hover-border-color: transparent;--parvus-btn-disabled-background-color: transparent;--parvus-btn-disabled-border-color: transparent;--parvus-btn-disabled-color: transparent;--parvus-caption-background-color:transparent;--parvus-caption-color:hsl(228deg 24% 23%);--parvus-loading-error-background-color:hsl(0deg 0% 100%);--parvus-loading-error-color:hsl(228deg 24% 23%);--parvus-loader-background-color:hsl(23deg 40% 96%);--parvus-loader-color:hsl(228deg 24% 23%)} body:has(.parvus[open]){touch-action:none}.parvus-trigger:has(img){display:block;position:relative}.parvus-trigger:has(img) .parvus-zoom__indicator{align-items:center;background-color:transparent;color:var(--violet-dark);display:flex;inset-block-start:.5rem;inset-inline-end:.5rem;justify-content:center;padding:.5rem;position:absolute}.parvus-trigger:has(img) img{display:block}.parvus{background-color:transparent;block-size:100%;border:0;box-sizing:border-box;color:var(--black);contain:strict;inline-size:100%;inset:0;margin:0;max-block-size:unset;max-inline-size:unset;overflow:hidden;overscroll-behavior:contain;padding:0;position:fixed}.parvus::backdrop{display:none}.parvus *,.parvus :after,.parvus :before{box-sizing:border-box}.parvus__overlay{background-color:var(--parvus-background-color);color:var(--black);inset:0;position:absolute}.parvus__slider{inset:0;position:absolute;transform:translateZ(0)}@media screen and (prefers-reduced-motion:no-preference){.parvus__slider--animate:not(.parvus__slider--is-dragging){transition:transform var(--parvus-transition-duration) var(--parvus-transition-timing-function);will-change:transform}}.parvus__slider--is-draggable{cursor:grab;touch-action:pan-y pinch-zoom}.parvus__slider--is-dragging{cursor:grabbing;touch-action:none}.parvus__slide{block-size:100%;contain:layout;display:grid;inline-size:100%;padding-block:1rem;padding-inline:1rem;place-items:center}.parvus__slide img{block-size:auto;display:block;inline-size:auto;margin-inline:auto;transform:translateZ(0)}.parvus__content--error{background-color:var(--parvus-loading-error-background-color);color:var(--parvus-loading-error-color);padding-block:.5rem;padding-inline:1rem}.parvus__caption{background-color:var(--parvus-caption-background-color);color:var(--parvus-caption-color);padding-block-start:.5rem;text-align:start}.parvus__loader{block-size:6.25rem;display:inline-block;inline-size:6.25rem;inset-block-start:50%;inset-inline-start:50%;position:absolute;transform:translate(-50%,-50%)}.parvus__loader:before{animation:spin 1s linear infinite;border:.25rem solid var(--parvus-loader-background-color);border-block-start-color:var(--parvus-loader-color);border-radius:100%;content:"";inset:0;position:absolute;z-index:1}.parvus__toolbar{align-items:center;display:flex;inset-block-start:1rem;inset-inline:1rem;justify-content:space-between;pointer-events:none;position:absolute;z-index:8}.parvus__toolbar>*{pointer-events:auto}.parvus__controls{display:flex;gap:.5rem}.parvus__btn{appearance:none;background-color:var(--parvus-btn-background-color);background-image:none;border:.1rem solid var(--violet-dark);border-radius: 25px;color:var(--violet-dark);cursor:pointer;display:flex;font:inherit;padding:.3125rem;position:relative;touch-action:manipulation;will-change:transform,opacity;z-index:7}.parvus__btn:focus-visible,.parvus__btn:hover{border-color:var(--parvus-btn-hover-border-color);background-color:var(--orange);color:var(--white)}.parvus__btn--previous{inset-inline-start:0}.parvus__btn--next,.parvus__btn--previous{inset-block-start:calc(50svh - 1rem);position:absolute;transform:translateY(-50%)}.parvus__btn--next{inset-inline-end:0}.parvus__btn svg{pointer-events:none}.parvus__btn[aria-hidden=true]{display:none} .parvus__btn[aria-disabled="true"] {pointer-events: none; color: var(--violet-dark); background-color: #ececf2; border-color: #b8b8c7; opacity: .65; cursor: not-allowed; } .parvus__counter{position:relative;z-index:7}.parvus__counter[aria-hidden=true]{display:none}@media screen and (prefers-reduced-motion:no-preference){.parvus__btn--close,.parvus__btn--next,.parvus__btn--previous,.parvus__caption,.parvus__counter,.parvus__overlay{transition:transform var(--parvus-transition-duration) var(--parvus-transition-timing-function),opacity var(--parvus-transition-duration) var(--parvus-transition-timing-function);will-change:transform,opacity}.parvus--is-closing .parvus__btn--close,.parvus--is-closing .parvus__btn--next,.parvus--is-closing .parvus__btn--previous,.parvus--is-closing .parvus__caption,.parvus--is-closing .parvus__counter,.parvus--is-closing .parvus__overlay,.parvus--is-opening .parvus__btn--close,.parvus--is-opening .parvus__btn--next,.parvus--is-opening .parvus__btn--previous,.parvus--is-opening .parvus__caption,.parvus--is-opening .parvus__counter,.parvus--is-opening .parvus__overlay{opacity:0}.parvus--is-vertical-closing .parvus__btn--close,.parvus--is-vertical-closing .parvus__counter,.parvus--is-zooming .parvus__btn--close,.parvus--is-zooming .parvus__counter{opacity:0;transform:translateY(-100%)}.parvus--is-vertical-closing .parvus__btn--previous,.parvus--is-zooming .parvus__btn--previous{opacity:0;transform:translate(-100%,-50%)}.parvus--is-vertical-closing .parvus__btn--next,.parvus--is-zooming .parvus__btn--next{opacity:0;transform:translate(100%,-50%)}.parvus--is-vertical-closing .parvus__caption,.parvus--is-zooming .parvus__caption{opacity:0;transform:translateY(100%)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}


/* ==================================================================================== 
 13. Accessibility 
 ==================================================================================== */
@media (prefers-reduced-motion: reduce) {
* {animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
.card-item > a, .gallery img {transform: none; } }
