html{
line-height: 1.15;
-webkit-text-size-adjust: 100%;
}
body{
margin: 0;
}
main{
display: block;
}
h1{
font-size: 2em;
margin: 0.67em 0;
}
hr{
box-sizing: content-box;
height: 0;
overflow: visible;
}
pre{
font-family: monospace, monospace;
font-size: 1em;
}
a{
background-color: transparent;
}
abbr[title]{
border-bottom: none;
text-decoration: underline;
text-decoration: underline dotted;
}
b,
strong{
font-weight: bolder;
}
code,
kbd,
samp{
font-family: monospace, monospace;
font-size: 1em;
}
small{
font-size: 80%;
}
sub,
sup{
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub{
bottom: -0.25em;
}
sup{
top: -0.5em;
}
img{
border-style: none;
}
button,
input,
optgroup,
select,
textarea{
font-family: inherit;
font-size: 100%;
line-height: 1.15;
margin: 0;
}
button,
input{
overflow: visible;
}
button,
select{
text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"]{
-webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner{
border-style: none;
padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring{
outline: 1px dotted ButtonText;
}
fieldset{
padding: 0.35em 0.75em 0.625em;
}
legend{
box-sizing: border-box;
color: inherit;
display: table;
max-width: 100%;
padding: 0;
white-space: normal;
}
progress{
vertical-align: baseline;
}
textarea{
overflow: auto;
}
[type="checkbox"],
[type="radio"]{
box-sizing: border-box;
padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button{
height: auto;
}
[type="search"]{
-webkit-appearance: textfield;
outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration{
-webkit-appearance: none;
}
::-webkit-file-upload-button{
-webkit-appearance: button;
font: inherit;
}
details{
display: block;
}
summary{
display: list-item;
}
template{
display: none;
}
[hidden]{
display: none;
}
*,
*::before,
*::after{
box-sizing: inherit;
}
html{
box-sizing: border-box;
}
body,
button,
input,
select,
optgroup,
textarea{
color: #404040;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-size: 1rem;
line-height: 1.5;
}
h1,
h2,
h3,
h4,
h5,
h6{
clear: both;
}
p{
margin-bottom: 1.5em;
}
dfn,
cite,
em,
i{
font-style: italic;
}
blockquote{
margin: 0 1.5em;
}
address{
margin: 0 0 1.5em;
}
pre{
background: #eee;
font-family: "Courier 10 Pitch", courier, monospace;
line-height: 1.6;
margin-bottom: 1.6em;
max-width: 100%;
overflow: auto;
padding: 1.6em;
}
code,
kbd,
tt,
var{
font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}
abbr,
acronym{
border-bottom: 1px dotted #666;
cursor: help;
}
mark,
ins{
background: #fff9c0;
text-decoration: none;
}
big{
font-size: 125%;
}
body{
background: #fff;
}
hr{
background-color: #ccc;
border: 0;
height: 1px;
margin-bottom: 1.5em;
}
ul,
ol{
margin: 0 0 1.5em 3em;
}
ul{
list-style: disc;
}
ol{
list-style: decimal;
}
li > ul,
li > ol{
margin-bottom: 0;
margin-left: 1.5em;
}
dt{
font-weight: 700;
}
dd{
margin: 0 1.5em 1.5em;
}
embed,
iframe,
object{
max-width: 100%;
}
img{
height: auto;
max-width: 100%;
}
figure{
margin: 1em 0;
}
table{
margin: 0 0 1.5em;
width: 100%;
}
a{
color: #4169e1;
}
a:visited{
color: #800080;
}
a:hover,
a:focus,
a:active{
color: #191970;
}
a:focus{
outline: thin dotted;
}
a:hover,
a:active{
outline: 0;
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"]{
border: 1px solid;
border-color: #ccc #ccc #bbb;
border-radius: 3px;
background: #e6e6e6;
color: rgba(0, 0, 0, 0.8);
line-height: 1;
padding: 0.6em 1em 0.4em;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover{
border-color: #ccc #bbb #aaa;
}
button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus{
border-color: #aaa #bbb #bbb;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea{
color: #666;
border: 1px solid #ccc;
border-radius: 3px;
padding: 3px;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus{
color: #111;
}
select{
border: 1px solid #ccc;
}
textarea{
width: 100%;
}
.main-navigation{
display: block;
width: 100%;
}
.main-navigation ul{
display: none;
list-style: none;
margin: 0;
padding-left: 0;
}
.main-navigation ul ul{
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
float: left;
position: absolute;
top: 100%;
left: -999em;
z-index: 99999;
}
.main-navigation ul ul ul{
left: -999em;
top: 0;
}
.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul{
display: block;
left: auto;
}
.main-navigation ul ul a{
width: 200px;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul{
left: auto;
}
.main-navigation li{
position: relative;
}
.main-navigation a{
display: block;
text-decoration: none;
}
.menu-toggle,
.main-navigation.toggled ul{
display: block;
}
@media screen and (min-width: 37.5em){.menu-toggle{
display: none;
}
.main-navigation ul{
display: flex;
}}
.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation{
margin: 0 0 1.5em;
}
.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links{
display: flex;
}
.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous{
flex: 1 0 50%;
}
.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next{
text-align: end;
flex: 1 0 50%;
}
.sticky{
display: block;
}
.post,
.page{
margin: 0 0 1.5em;
}
.updated:not(.published){
display: none;
}
.page-content,
.entry-content,
.entry-summary{
margin: 1.5em 0 0;
}
.page-links{
clear: both;
margin: 0 0 1.5em;
}
.comment-content a{
word-wrap: break-word;
}
.bypostauthor{
display: block;
}
.widget{
margin: 0 0 1.5em;
}
.widget select{
max-width: 100%;
}
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley{
border: none;
margin-bottom: 0;
margin-top: 0;
padding: 0;
}
.custom-logo-link{
display: inline-block;
}
.wp-caption{
margin-bottom: 1.5em;
max-width: 100%;
}
.wp-caption img[class*="wp-image-"]{
display: block;
margin-left: auto;
margin-right: auto;
}
.wp-caption .wp-caption-text{
margin: 0.8075em 0;
}
.wp-caption-text{
text-align: center;
}
.gallery{
margin-bottom: 1.5em;
display: grid;
grid-gap: 1.5em;
}
.gallery-item{
display: inline-block;
text-align: center;
width: 100%;
}
.gallery-columns-2{
grid-template-columns: repeat(2, 1fr);
}
.gallery-columns-3{
grid-template-columns: repeat(3, 1fr);
}
.gallery-columns-4{
grid-template-columns: repeat(4, 1fr);
}
.gallery-columns-5{
grid-template-columns: repeat(5, 1fr);
}
.gallery-columns-6{
grid-template-columns: repeat(6, 1fr);
}
.gallery-columns-7{
grid-template-columns: repeat(7, 1fr);
}
.gallery-columns-8{
grid-template-columns: repeat(8, 1fr);
}
.gallery-columns-9{
grid-template-columns: repeat(9, 1fr);
}
.gallery-caption{
display: block;
}
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer{
display: none;
}
.infinity-end.neverending .site-footer{
display: block;
}
.screen-reader-text{
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important;
}
.screen-reader-text:focus{
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
clip-path: none;
color: #21759b;
display: block;
font-size: 0.875rem;
font-weight: 700;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000;
}
#primary[tabindex="-1"]:focus{
outline: 0;
}
.alignleft{
/*rtl:ignore*/
float: left;
/*rtl:ignore*/
margin-right: 1.5em;
margin-bottom: 1.5em;
}
.alignright{
/*rtl:ignore*/
float: right;
/*rtl:ignore*/
margin-left: 1.5em;
margin-bottom: 1.5em;
}
.aligncenter{
clear: both;
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom: 1.5em;
}
:root{
--karpinski-graphite: #24262c;
--karpinski-graphite-dark: #17191e;
--karpinski-red: #c22026;
--karpinski-red-dark: #9e1419;
--karpinski-green: #8ab84a;
--karpinski-green-dark: #5f8e27;
--karpinski-white: #ffffff;
--karpinski-ink: #101215;
--karpinski-muted: #4e525b;
--karpinski-border: #d9dce2;
--karpinski-bg: #f5f6f8;
--karpinski-shadow: 0 12px 28px rgba(0, 0, 0, 0.14);
}
body{
background:
radial-gradient(circle at 8% 16%, rgba(138, 184, 74, 0.14), transparent 28%),
radial-gradient(circle at 92% 34%, rgba(194, 32, 38, 0.12), transparent 33%),
var(--karpinski-bg);
color: var(--karpinski-ink);
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
}
a{
color: var(--karpinski-red);
text-decoration: none;
}
a:hover,
a:focus{
color: var(--karpinski-red-dark);
}
a:focus-visible,
button:focus-visible,
summary:focus-visible,
.menu-toggle:focus-visible{
outline: 3px solid #ffcc00;
outline-offset: 2px;
}
.site{
max-width: 100%;
}
.site-header{
background: linear-gradient(115deg, var(--karpinski-graphite-dark), var(--karpinski-graphite));
color: var(--karpinski-white);
box-shadow: var(--karpinski-shadow);
position: sticky;
top: 0;
z-index: 50;
overflow: hidden;
}
.site-header::before{
content: "";
position: absolute;
left: 0;
right: 0;
top: 0;
height: 14px;
background:
radial-gradient(18px 10px at 8% 100%, rgba(194, 32, 38, 0.72), transparent 72%),
radial-gradient(24px 12px at 26% 100%, rgba(194, 32, 38, 0.45), transparent 74%),
radial-gradient(20px 10px at 44% 100%, rgba(194, 32, 38, 0.65), transparent 72%),
radial-gradient(24px 12px at 63% 100%, rgba(194, 32, 38, 0.5), transparent 74%),
radial-gradient(20px 10px at 82% 100%, rgba(194, 32, 38, 0.7), transparent 72%),
linear-gradient(90deg, rgba(194, 32, 38, 0.55), rgba(194, 32, 38, 0.35));
pointer-events: none;
z-index: 2;
}
.header-top,
.header-main,
.eu-strip{
max-width: 1220px;
margin: 0 auto;
padding-left: 1rem;
padding-right: 1rem;
}
.header-top{
display: grid;
grid-template-columns: 1fr auto auto;
gap: 1rem;
align-items: center;
padding-top: 0.7rem;
padding-bottom: 0.7rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.header-top-copy{
margin: 0;
font-size: 0.92rem;
font-weight: 600;
letter-spacing: 0.01em;
}
.social-links{
list-style: none;
display: flex;
gap: 0.65rem;
margin: 0;
padding: 0;
}
.social-links a{
color: var(--karpinski-white);
font-size: 0.9rem;
padding: 0.2rem 0.4rem;
border-radius: 0.2rem;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2rem;
min-height: 2rem;
}
.app-download-link{
color: var(--karpinski-white);
text-decoration: none;
background: var(--karpinski-red);
padding: 0.45rem 0.75rem;
border-radius: 0.3rem;
font-weight: 700;
white-space: nowrap;
}
.app-download-soon{
opacity: 0.9;
cursor: default;
}
.header-main{
display: flex;
gap: 1rem;
align-items: center;
justify-content: space-between;
padding-top: 0.8rem;
padding-bottom: 0.8rem;
}
.site-branding{
display: flex;
flex-direction: column;
gap: 0.2rem;
}
.site-title{
font-size: 1.45rem;
line-height: 1.1;
margin: 0;
font-weight: 800;
}
.site-title a{
color: var(--karpinski-white);
text-decoration: none;
}
.site-description{
margin: 0;
color: #e4e7ee;
font-size: 0.92rem;
}
.main-navigation ul{
list-style: none;
margin: 0;
padding: 0;
display: flex;
gap: 0.4rem;
align-items: center;
}
.main-navigation a{
color: var(--karpinski-white);
text-decoration: none;
font-weight: 600;
padding: 0.55rem 0.65rem;
border-radius: 0.3rem;
display: inline-block;
}
.main-navigation a:hover,
.main-navigation a:focus{
background: rgba(255, 255, 255, 0.14);
}
.menu-toggle{
background: var(--karpinski-red);
color: var(--karpinski-white);
border: 0;
padding: 0.5rem 0.75rem;
font-weight: 700;
border-radius: 0.3rem;
}
.eu-strip{
background: #ffffff;
color: var(--karpinski-ink);
padding-top: 0.4rem;
padding-bottom: 0.4rem;
border-top: 1px solid var(--karpinski-border);
border-bottom: 1px solid var(--karpinski-border);
}
.eu-strip summary{
cursor: pointer;
font-weight: 700;
color: var(--karpinski-red-dark);
}
.eu-strip p{
margin: 0.5rem 0 0;
}
.site-main{
max-width: 1220px;
margin: 0 auto;
padding: 1.5rem 1rem 3rem;
position: relative;
}
.premium-surface{
position: relative;
overflow: hidden;
border-radius: 1.25rem;
}
.premium-surface::after{
content: "";
position: absolute;
left: -15%;
right: -15%;
bottom: -70px;
height: 120px;
background:
radial-gradient(45% 90px at 22% 0, rgba(194, 32, 38, 0.2), transparent 70%),
radial-gradient(38% 80px at 78% 0, rgba(138, 184, 74, 0.22), transparent 68%);
pointer-events: none;
z-index: 0;
}
.premium-surface > *{
position: relative;
z-index: 1;
}
.hero{
display: grid;
grid-template-columns: 1.05fr 1fr;
gap: 1.2rem;
align-items: stretch;
margin-bottom: 2rem;
}
.hero-content{
background:
linear-gradient(160deg, #ffffff 0%, #f6f8fc 65%, #f0f7e8 100%);
border: 1px solid #d7dce6;
border-left: 10px solid var(--karpinski-red);
border-radius: 1.15rem;
padding: 2rem;
box-shadow: 0 20px 35px rgba(14, 19, 28, 0.1);
}
.hero-kicker{
font-size: 0.86rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--karpinski-red-dark);
margin: 0 0 0.5rem;
}
.hero h1{
margin: 0;
font-size: clamp(1.8rem, 4vw, 2.9rem);
line-height: 1.1;
color: var(--karpinski-graphite-dark);
}
.hero p{
color: var(--karpinski-muted);
max-width: 52ch;
}
.hero-image-wrap img{
width: 100%;
height: 100%;
min-height: 320px;
object-fit: cover;
border-radius: 1.15rem;
border: 1px solid #d5dbe8;
box-shadow: 0 20px 35px rgba(14, 19, 28, 0.1);
}
.hero-actions{
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
margin-top: 1.2rem;
}
.button{
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
font-weight: 700;
text-decoration: none;
padding: 0.68rem 1rem;
border-radius: 0.35rem;
}
.button-primary{
background: var(--karpinski-red);
color: var(--karpinski-white);
}
.button-primary:hover,
.button-primary:focus{
background: var(--karpinski-red-dark);
color: var(--karpinski-white);
}
.button-secondary{
background: var(--karpinski-white);
color: var(--karpinski-graphite-dark);
border: 1px solid var(--karpinski-border);
}
.tile-section h2,
.cta-section h2,
.info-item h2{
color: var(--karpinski-graphite-dark);
}
#supermarket,
#podstrefy,
#paczki-dla-firm,
#wspieramy-lokalnie{
scroll-margin-top: 140px;
}
.tile-grid{
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 1rem;
}
.tile-section,
.content-panel{
background: linear-gradient(160deg, #ffffff, #f8f9fc);
border: 1px solid #dce1ea;
border-radius: 1.4rem;
padding: 1.25rem;
box-shadow: 0 18px 32px rgba(15, 20, 28, 0.08);
}
.tile-card{
background: #fff;
border: 1px solid #d6dde8;
border-radius: 1.1rem;
overflow: hidden;
box-shadow: 0 12px 28px rgba(10, 16, 25, 0.11);
transition: transform 260ms ease, box-shadow 260ms ease, border-color 260ms ease;
}
.tile-card-link{
display: block;
color: inherit;
}
.tile-card-media{
aspect-ratio: 16 / 9;
overflow: hidden;
}
.tile-card-media img{
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transform: scale(1);
transition: transform 320ms ease;
}
.tile-card:hover,
.tile-card:focus-within{
transform: translateY(-6px);
border-color: #b7c2d3;
box-shadow: 0 24px 42px rgba(10, 16, 25, 0.2);
}
.tile-card:hover .tile-card-media img,
.tile-card:focus-within .tile-card-media img{
transform: scale(1.08);
}
.tile-card-content{
padding: 1rem;
background: linear-gradient(180deg, #fff, #fbfcfe);
}
.tile-grid .tile-card:nth-child(1) .tile-card-content{ background: linear-gradient(180deg, #ffffff, #eef5ff); }
.tile-grid .tile-card:nth-child(2) .tile-card-content{ background: linear-gradient(180deg, #ffffff, #fff3e9); }
.tile-grid .tile-card:nth-child(3) .tile-card-content{ background: linear-gradient(180deg, #ffffff, #edf7ea); }
.tile-grid .tile-card:nth-child(4) .tile-card-content{ background: linear-gradient(180deg, #ffffff, #f2efff); }
.tile-grid .tile-card:nth-child(5) .tile-card-content{ background: linear-gradient(180deg, #ffffff, #eef9f8); }
.tile-grid .tile-card:nth-child(6) .tile-card-content{ background: linear-gradient(180deg, #ffffff, #fff0f2); }
.tile-card-content h3{
margin: 0 0 0.3rem;
font-size: 1.2rem;
}
.tile-card-content h3 i{
color: var(--karpinski-red-dark);
margin-right: 0.35rem;
}
.tile-card-content p{
margin: 0;
color: var(--karpinski-muted);
}
.info-strip{
margin-top: 2rem;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 1rem;
padding: 1.1rem;
background: linear-gradient(175deg, #ffffff, #f8fafb);
border: 1px solid #dce1ea;
box-shadow: 0 14px 28px rgba(13, 20, 30, 0.08);
}
.info-item{
background: #fff;
border-radius: 1.1rem;
border: 1px solid #d7dfe8;
padding: 1rem 1.2rem;
transition: transform 220ms ease, box-shadow 220ms ease;
}
.info-item:hover,
.info-item:focus-within{
transform: translateY(-3px);
box-shadow: 0 14px 26px rgba(16, 24, 36, 0.12);
}
.info-item h2{
font-size: 1.2rem;
margin: 0 0 0.4rem;
}
.info-item h2 i{
color: var(--karpinski-red-dark);
margin-right: 0.3rem;
}
.info-item p{
margin: 0;
color: var(--karpinski-muted);
}
.content-panel{
margin-top: 2rem;
}
.content-panel h2{
margin-top: 0;
}
.list-grid{
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.9rem;
}
.list-card{
border: 1px solid #d8dee8;
border-radius: 0.9rem 0.9rem 1.25rem 0.9rem;
padding: 1rem;
background: linear-gradient(165deg, #ffffff, #f5f8ff);
box-shadow: 0 10px 20px rgba(12, 18, 28, 0.06);
position: relative;
}
.list-card::before{
content: "";
position: absolute;
left: 0;
top: 0;
width: 58px;
height: 5px;
border-radius: 0 0 6px 0;
background: linear-gradient(90deg, var(--karpinski-red), var(--karpinski-green));
}
.list-grid .list-card:nth-child(1){ background: linear-gradient(165deg, #fff, #edf7ea); }
.list-grid .list-card:nth-child(2){ background: linear-gradient(165deg, #fff, #fff4e8); }
.list-grid .list-card:nth-child(3){ background: linear-gradient(165deg, #fff, #eef4ff); }
.list-grid .list-card:nth-child(4){ background: linear-gradient(165deg, #fff, #eef9f8); }
.list-grid .list-card:nth-child(5){ background: linear-gradient(165deg, #fff, #f7f0ff); }
.list-grid .list-card:nth-child(6){ background: linear-gradient(165deg, #fff, #fff0f3); }
.list-card h3{
margin: 0 0 0.35rem;
font-size: 1.05rem;
}
.list-card h3 i{
color: var(--karpinski-red-dark);
margin-right: 0.3rem;
}
.list-card p{
margin: 0;
color: var(--karpinski-muted);
}
.inline-links,
.check-list{
padding-left: 1.1rem;
}
.check-list li i{
color: var(--karpinski-red-dark);
margin-right: 0.3rem;
}
.simple-form{
margin-top: 1rem;
}
.simple-form p{
margin: 0 0 0.8rem;
}
.simple-form label{
display: block;
margin-bottom: 0.35rem;
font-weight: 700;
}
.simple-form input,
.simple-form textarea,
.simple-form button{
width: 100%;
border: 1px solid #aeb5c2;
border-radius: 0.35rem;
padding: 0.65rem;
font: inherit;
}
.simple-form button{
background: var(--karpinski-red);
color: var(--karpinski-white);
font-weight: 700;
border-color: var(--karpinski-red);
cursor: pointer;
}
.simple-form button:hover,
.simple-form button:focus{
background: var(--karpinski-red-dark);
}
.cta-section{
margin-top: 2rem;
background: var(--karpinski-graphite);
color: var(--karpinski-white);
border-radius: 1.2rem;
padding: 2rem;
background-image:
radial-gradient(circle at 88% 18%, rgba(138, 184, 74, 0.48), transparent 35%),
radial-gradient(circle at 12% 88%, rgba(194, 32, 38, 0.55), transparent 37%),
linear-gradient(140deg, rgba(23, 25, 30, 1), rgba(36, 38, 44, 0.98));
box-shadow: 0 24px 40px rgba(11, 13, 18, 0.28);
}
.cta-section h2,
.cta-section p{
color: var(--karpinski-white);
}
.site-footer{
background: var(--karpinski-graphite-dark);
color: #eef1f8;
padding: 2rem 1rem;
}
.footer-grid{
max-width: 1220px;
margin: 0 auto;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 1.4rem;
}
.footer-grid h2{
font-size: 1.1rem;
margin: 0 0 0.45rem;
color: #fff;
}
.footer-grid p,
.footer-grid ul{
margin: 0;
padding: 0;
list-style: none;
}
.footer-grid li + li{
margin-top: 0.3rem;
}
.footer-grid a{
color: #f3f4f8;
text-decoration: none;
}
.footer-grid section:nth-child(3) ul{
display: flex;
flex-wrap: wrap;
gap: 0.55rem;
}
.footer-grid section:nth-child(3) li + li{
margin-top: 0;
}
.footer-grid section:nth-child(3) a{
width: 2rem;
height: 2rem;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.footer-grid section:nth-child(3) a:hover,
.footer-grid section:nth-child(3) a:focus{
background: rgba(194, 32, 38, 0.25);
border-color: rgba(194, 32, 38, 0.5);
}
.social-links i,
.footer-grid i,
.inline-links i,
.content-panel h2 i{
font-size: 1.25rem;
vertical-align: middle;
}
.inline-links li + li{
margin-top: 0.4rem;
}
.site-info{
max-width: 1220px;
margin: 1rem auto 0;
padding-top: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.2);
font-size: 0.9rem;
}
.widget-area{
display: none;
}
.static-page{
max-width: 980px;
}
.static-page-section{
background: #fff;
border: 1px solid var(--karpinski-border);
border-radius: 0.65rem;
padding: 1.4rem;
}
.static-page-section + .static-page-section{
margin-top: 1rem;
}
.static-page-section h1,
.static-page-section h2{
margin-top: 0;
}
@media (max-width: 1024px){.tile-grid{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.info-strip{
grid-template-columns: 1fr;
}
.hero{
grid-template-columns: 1fr;
}
.list-grid{
grid-template-columns: repeat(2, minmax(0, 1fr));
}}
@media (max-width: 860px){.header-top{
grid-template-columns: 1fr;
gap: 0.6rem;
}
.main-navigation ul{
flex-direction: column;
align-items: flex-start;
gap: 0;
padding: 0.6rem;
background: rgba(0, 0, 0, 0.25);
border-radius: 0.4rem;
}
.main-navigation.menu-js:not(.toggled) ul{
display: none;
}
.main-navigation.toggled ul{
display: flex;
}}
@media (min-width: 861px){.menu-toggle{
display: none;
}}
@media (max-width: 620px){.tile-grid,
.list-grid,
.footer-grid{
grid-template-columns: 1fr;
}
.static-page-section{
padding: 1.1rem;
}
.hero-content,
.cta-section{
padding: 1.3rem;
}}
@media (prefers-reduced-motion: reduce){html:focus-within{
scroll-behavior: auto;
}
*,
*::before,
*::after{
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
}}
.uxp-home{
max-width: 100%;
padding: 0 0 3rem;
background: #121419;
color: #f6f8fc;
}
.uxp-container{
max-width: 1220px;
margin: 0 auto;
padding: 0 1rem;
}
.uxp-home .button{
border-radius: 999px;
font-weight: 700;
letter-spacing: 0.02em;
}
.uxp-home .button-primary{
background: #d61f26;
color: #fff;
}
.uxp-home .button-primary:hover,
.uxp-home .button-primary:focus{
background: #b9191f;
}
.uxp-home .button-secondary{
background: rgba(255, 255, 255, 0.08);
border-color: rgba(255, 255, 255, 0.3);
color: #fff;
}
.uxp-hero{
position: relative;
min-height: 86vh;
display: flex;
align-items: center;
overflow: hidden;
}
.uxp-hero-media,
.uxp-hero-media img,
.uxp-hero-overlay{
position: absolute;
inset: 0;
}
.uxp-hero-media img{
width: 100%;
height: 100%;
object-fit: cover;
}
.uxp-hero-overlay{
background:
linear-gradient(95deg, rgba(16, 18, 24, 0.95) 20%, rgba(16, 18, 24, 0.75) 56%, rgba(16, 18, 24, 0.3) 100%),
radial-gradient(circle at 18% 22%, rgba(214, 31, 38, 0.28), transparent 36%),
radial-gradient(circle at 82% 80%, rgba(122, 191, 67, 0.22), transparent 34%);
}
.uxp-hero-content{
position: relative;
z-index: 1;
padding-top: 8.5rem;
padding-bottom: 6rem;
}
.uxp-chip{
display: inline-flex;
align-items: center;
gap: 0.35rem;
padding: 0.35rem 0.9rem;
border-radius: 999px;
background: rgba(122, 191, 67, 0.16);
color: #c4eca0;
border: 1px solid rgba(122, 191, 67, 0.42);
font-size: 0.8rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.1em;
}
.uxp-hero h1{
margin: 0.9rem 0 0.9rem;
font-size: clamp(2rem, 6vw, 4.6rem);
line-height: 1.03;
color: #fff;
max-width: 12ch;
}
.uxp-hero p{
max-width: 58ch;
margin: 0;
color: #d9dde6;
}
.uxp-actions{
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
margin-top: 1.5rem;
}
.uxp-credibility{
margin-top: -2.2rem;
position: relative;
z-index: 2;
}
.uxp-stats-grid{
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.9rem;
}
.uxp-stat{
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.08);
backdrop-filter: blur(8px);
border-radius: 1rem;
padding: 1.2rem;
text-align: center;
}
.uxp-stat i{
font-size: 1.5rem;
color: #d61f26;
}
.uxp-stat h2{
margin: 0.4rem 0 0;
font-size: 2rem;
color: #fff;
}
.uxp-stat p{
margin: 0.2rem 0 0;
color: #b8bfcc;
font-size: 0.9rem;
}
.uxp-zones,
.uxp-categories,
.uxp-b2b,
.uxp-gifts,
.uxp-links{
padding: 3rem 0 0;
}
.uxp-section-head{
margin-bottom: 1.2rem;
}
.uxp-section-head h2,
.uxp-b2b h2,
.uxp-gifts h2{
margin: 0;
font-size: clamp(1.55rem, 3.2vw, 2.7rem);
color: #fff;
}
.uxp-section-head p,
.uxp-b2b p,
.uxp-gifts p{
margin: 0.55rem 0 0;
color: #b6becd;
max-width: 74ch;
}
.uxp-zone-grid{
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 1rem;
}
.uxp-zone-card{
position: relative;
display: block;
min-height: 330px;
border-radius: 1rem;
overflow: hidden;
border: 1px solid rgba(255, 255, 255, 0.12);
box-shadow: 0 22px 36px rgba(0, 0, 0, 0.33);
color: #fff;
}
.uxp-zone-card::after{
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.75));
}
.uxp-zone-card img{
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 420ms ease;
}
.uxp-zone-card-content{
position: absolute;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
padding: 1rem;
}
.uxp-zone-card h3{
margin: 0;
font-size: 1.35rem;
color: #fff;
}
.uxp-zone-card p{
margin: 0.35rem 0 0;
color: #e8ebf3;
font-size: 0.92rem;
}
.uxp-zone-card:hover img,
.uxp-zone-card:focus-visible img{
transform: scale(1.07);
}
.uxp-cat-grid{
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 0.85rem;
}
.uxp-cat-card{
background: #1a1e27;
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 0.9rem;
overflow: hidden;
}
.uxp-cat-card img{
display: block;
width: 100%;
aspect-ratio: 4/3;
object-fit: cover;
}
.uxp-cat-card h3{
margin: 0;
padding: 0.7rem 0.8rem 0.9rem;
font-size: 1rem;
color: #f4f7fe;
}
.uxp-b2b{
position: relative;
}
.uxp-b2b::before{
content: "";
position: absolute;
inset: 0;
background: radial-gradient(circle at 80% 35%, rgba(214, 31, 38, 0.14), transparent 36%), radial-gradient(circle at 20% 70%, rgba(122, 191, 67, 0.14), transparent 34%);
pointer-events: none;
}
.uxp-b2b-grid{
position: relative;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1.2rem;
align-items: center;
}
.uxp-b2b-collage{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.65rem;
}
.uxp-b2b-collage img{
width: 100%;
height: 180px;
object-fit: cover;
border-radius: 0.85rem;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.uxp-gifts .uxp-container{
background: linear-gradient(140deg, #1a1e27, #202632);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 1rem;
padding: 1.35rem;
}
.uxp-links-grid{
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.8rem;
}
.uxp-links-grid a{
display: flex;
align-items: center;
gap: 0.45rem;
background: #1a1e27;
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 0.75rem;
padding: 0.85rem 0.95rem;
color: #f3f6fd;
}
.uxp-links-grid a i{
color: #d61f26;
}
.uxp-home a:focus-visible,
.uxp-home button:focus-visible{
outline: 3px solid #ffd75b;
outline-offset: 2px;
}
@media (max-width: 1120px){.uxp-zone-grid{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.uxp-cat-grid{
grid-template-columns: repeat(3, minmax(0, 1fr));
}}
@media (max-width: 860px){.uxp-hero{
min-height: 72vh;
}
.uxp-hero-content{
padding-top: 7rem;
padding-bottom: 4.5rem;
}
.uxp-stats-grid,
.uxp-b2b-grid,
.uxp-links-grid{
grid-template-columns: 1fr;
}
.uxp-zone-grid,
.uxp-cat-grid{
grid-template-columns: 1fr;
}
.uxp-b2b-collage img{
height: 150px;
}}
.home .site-header{
background: rgba(16, 18, 24, 0.92);
backdrop-filter: blur(10px);
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.home .site-header::before{
display: none;
}
.home .eu-strip{
display: none;
}
.home .header-top{
display: grid;
padding-top: 0.35rem;
padding-bottom: 0.35rem;
}
.home .header-main{
padding-top: 0.55rem;
padding-bottom: 0.55rem;
}
.home .site-title{
font-size: 1.1rem;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.home .site-description{
display: none;
}
.header-app-cta{
display: inline-flex;
align-items: center;
gap: 0.35rem;
background: #d61f26;
color: #fff;
font-size: 0.84rem;
font-weight: 700;
padding: 0.58rem 0.82rem;
border-radius: 999px;
white-space: nowrap;
}
.header-app-cta:hover,
.header-app-cta:focus{
background: #b9191f;
color: #fff;
}
.header-main{
gap: 0.8rem;
}
.main-navigation{
margin-left: auto;
}
.main-navigation ul{
flex-wrap: wrap;
justify-content: flex-end;
}
.uxp-hero h1 span{
color: #d61f26;
font-style: italic;
}
.uxp-online{
background: #20242d;
}
.uxp-producers{
padding: 3.2rem 0;
position: relative;
background:
linear-gradient(135deg, rgba(11, 13, 18, 0.93), rgba(11, 13, 18, 0.88)),
url("assets/images/pattern-cubes.webp");
background-size: auto;
border-top: 1px solid rgba(255, 255, 255, 0.06);
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.uxp-producers h2{
margin: 0;
font-size: clamp(1.6rem, 4vw, 2.8rem);
max-width: 17ch;
color: #fff;
}
.uxp-producers p{
margin: 0.8rem 0 0;
max-width: 70ch;
color: #ced5e2;
}
.uxp-app{
margin-top: 2.8rem;
padding: 2.6rem 0;
background: linear-gradient(120deg, #d61f26, #b71720);
}
.uxp-app-grid{
display: grid;
grid-template-columns: 1fr auto auto;
gap: 1rem;
align-items: center;
}
.uxp-app h2{
margin: 0;
font-size: clamp(1.5rem, 3.2vw, 2.6rem);
color: #fff;
}
.uxp-app p{
margin: 0.55rem 0 0;
color: rgba(255, 255, 255, 0.9);
}
.uxp-app-actions{
display: flex;
gap: 0.6rem;
flex-wrap: wrap;
justify-content: flex-end;
}
.uxp-app-actions .button{
background: rgba(0, 0, 0, 0.24);
border: 1px solid rgba(255, 255, 255, 0.35);
color: #fff;
}
.uxp-phone-mock{
width: 120px;
height: 230px;
border-radius: 1.6rem;
background: #101216;
border: 2px solid rgba(255, 255, 255, 0.45);
padding: 0.55rem;
box-shadow: 0 16px 30px rgba(0, 0, 0, 0.35);
}
.uxp-phone-notch{
width: 48px;
height: 10px;
background: rgba(255, 255, 255, 0.2);
border-radius: 999px;
margin: 0 auto 0.45rem;
}
.uxp-phone-screen{
height: calc(100% - 18px);
border-radius: 1.1rem;
background: linear-gradient(180deg, #1f2430, #151923);
padding: 0.65rem;
}
.uxp-phone-line{
height: 6px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.5);
margin-bottom: 0.4rem;
}
.uxp-phone-line.short{
width: 65%;
}
.uxp-phone-card{
height: 54px;
border-radius: 0.6rem;
background: rgba(255, 255, 255, 0.14);
margin-top: 0.55rem;
}
.uxp-phone-card.dark{
background: rgba(0, 0, 0, 0.28);
}
.uxp-home .site-footer{
margin-top: 2.4rem;
}
@media (max-width: 860px){.home .header-top-copy{
display: none;
}
.header-app-cta{
order: 3;
width: 100%;
justify-content: center;
}
.header-main{
flex-wrap: wrap;
}
.uxp-app-grid{
grid-template-columns: 1fr;
}
.uxp-app-actions{
justify-content: flex-start;
}
.uxp-phone-mock{
width: 98px;
height: 188px;
}}
body:not(.home){
background: #121419;
color: #ecf0f8;
}
body:not(.home) .site-main{
max-width: 1220px;
margin: 0 auto;
padding: 8rem 1rem 3rem;
}
body:not(.home) .entry-title,
body:not(.home) .page-title,
body:not(.home) h1,
body:not(.home) h2,
body:not(.home) h3{
color: #fff;
}
body:not(.home) .entry-content,
body:not(.home) .page-content,
body:not(.home) p,
body:not(.home) li{
color: #cfd6e4;
}
body:not(.home) article,
body:not(.home) .page-header,
body:not(.home) .uxp-generic-card,
body:not(.home) .comments-area{
background: #1a1e27;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 1rem;
padding: 1.2rem;
box-shadow: 0 16px 26px rgba(0, 0, 0, 0.24);
}
body:not(.home) a{
color: #f5f7fd;
}
body:not(.home) .edit-link a,
body:not(.home) .post-edit-link{
color: #fff;
}
a{
text-decoration: none;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.menu-toggle:focus-visible{
outline: 3px solid #ffd75b;
outline-offset: 2px;
}
.site-header{
position: sticky;
top: 0;
z-index: 1000;
background: rgba(16, 18, 24, 0.95);
backdrop-filter: blur(10px);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.site-header::before{
content: "";
position: absolute;
inset: 0 0 auto 0;
height: 34px;
background:
radial-gradient(120px 30px at 15% 0%, rgba(214, 31, 38, 0.35), transparent 70%),
radial-gradient(180px 34px at 55% 0%, rgba(214, 31, 38, 0.28), transparent 72%),
radial-gradient(140px 34px at 88% 0%, rgba(214, 31, 38, 0.32), transparent 72%);
pointer-events: none;
}
.eu-header-link{
position: fixed;
left: 0.75rem;
top: 1.2rem;
z-index: 1290;
display: inline-flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
border-radius: 999px;
background: white;
border: 1px solid rgba(255, 255, 255, 0.25);
box-shadow: 0 10px 24px rgba(4, 8, 16, 0.34);
}
.eu-header-link:hover,
.eu-header-link:focus-visible{
border-color: #d61f26;
background: rgba(214, 31, 38, 0.16);
}
.eu-header-link img{
width: 28px;
height: 28px;
object-fit: contain;
display: block;
}
body.admin-bar .eu-header-link{
top: 6.2rem;
}
.site-header .header-top,
.site-header .header-main{
max-width: 1220px;
margin: 0 auto;
padding-left: 1rem;
padding-right: 1rem;
position: relative;
z-index: 1;
}
.header-top{
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
padding-top: 0.35rem;
padding-bottom: 0.35rem;
}
.header-top-copy{
margin: 0;
font-size: 0.85rem;
color: #d9e0ec;
}
.social-links{
display: flex;
align-items: center;
gap: 0.35rem;
list-style: none;
margin: 0;
padding: 0;
}
.header-main{
display: flex;
align-items: center;
gap: 1rem;
padding-top: 0.7rem;
padding-bottom: 0.7rem;
}
.site-branding{
display: flex;
align-items: center;
gap: 0.55rem;
min-width: 180px;
}
.custom-logo-link img{
max-height: 44px;
width: auto;
}
.site-title{
margin: 0;
font-size: 1rem;
font-weight: 800;
text-transform: uppercase;
letter-spacing: 0.05em;
}
.site-title a{
color: #fff;
}
.main-navigation{
margin-left: auto;
}
.main-navigation > div > ul,
.main-navigation > ul{
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.25rem;
list-style: none;
margin: 0;
padding: 0;
}
.main-navigation a{
color: #f8fbff;
font-weight: 600;
font-size: 0.95rem;
padding: 0.55rem 0.7rem;
border-radius: 999px;
transition: background-color 0.2s ease, color 0.2s ease;
}
.main-navigation a:hover,
.main-navigation a:focus-visible{
background: rgba(255, 255, 255, 0.14);
color: #fff;
}
.menu-toggle{
border: 0;
background: #d61f26;
color: #fff;
font-weight: 700;
padding: 0.5rem 0.75rem;
border-radius: 0.55rem;
}
.header-app-cta{
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
padding: 0.58rem 0.88rem;
border-radius: 999px;
background: #d61f26;
color: #fff;
font-size: 0.85rem;
font-weight: 700;
white-space: nowrap;
}
.header-app-cta:hover,
.header-app-cta:focus-visible{
background: #b9191f;
color: #fff;
}
.uxp-app-actions .button[disabled]{
opacity: 0.72;
cursor: not-allowed;
}
.footer-grid{
max-width: 1220px;
margin: 0 auto;
padding-left: 1rem;
padding-right: 1rem;
}
.footer-social-links{
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
list-style: none;
margin: 0;
padding: 0;
}
.footer-social-links li + li{
margin-top: 0;
}
.footer-social-links a{
width: 2.2rem;
height: 2.2rem;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.22);
}
.footer-social-links a:hover,
.footer-social-links a:focus-visible{
background: rgba(214, 31, 38, 0.28);
border-color: rgba(214, 31, 38, 0.62);
}
@media (min-width: 861px){.menu-toggle{
display: none;
}}
@media (max-width: 860px){.header-main{
flex-wrap: wrap;
}
.header-top-copy{
display: none;
}
.main-navigation{
order: 2;
width: 100%;
}
.main-navigation > div > ul,
.main-navigation > ul{
flex-direction: column;
align-items: stretch;
background: rgba(8, 10, 14, 0.94);
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 0.65rem;
padding: 0.45rem;
}
.main-navigation.menu-js:not(.toggled) > div > ul,
.main-navigation.menu-js:not(.toggled) > ul{
display: none;
}
.main-navigation.toggled > div > ul,
.main-navigation.toggled > ul{
display: flex;
}
.header-app-cta{
order: 3;
width: 100%;
}}
body,
button,
input,
select,
textarea{
font-family: "Inter", sans-serif;
background: #1a1a1a;
color: #fff;
}
h1,
h2,
h3,
.site-title,
.uxp-home .uxp-stat h2,
.uxp-home .uxp-section-head h2,
.uxp-home .uxp-zones h3,
.uxp-home .uxp-categories h3{
font-family: "Playfair Display", serif;
}
.header-top{
display: none;
}
.header-main{
min-height: 80px;
padding-top: 0.8rem;
padding-bottom: 0.8rem;
}
.site-branding{
flex-shrink: 0;
}
.site-title{
font-size: 1.45rem;
font-weight: 700;
letter-spacing: 0.07em;
}
.site-title a{
color: #fff;
}
.main-navigation a{
font-family: "Inter", sans-serif;
text-transform: uppercase;
letter-spacing: 0.15em;
font-size: 0.75rem;
font-weight: 500;
color: #d1d5db;
padding: 0.45rem 0.3rem;
background: transparent;
}
.main-navigation a:hover,
.main-navigation a:focus-visible{
color: #fff;
background: transparent;
}
.header-app-cta{
text-transform: uppercase;
letter-spacing: 0.15em;
font-size: 0.68rem;
padding: 0.66rem 1.08rem;
box-shadow: 0 10px 24px rgba(140, 20, 25, 0.28);
}
.uxp-home .uxp-hero{
min-height: 90vh;
}
.uxp-home .uxp-hero-content{
padding-top: 8.5rem;
padding-bottom: 6rem;
}
.uxp-home .uxp-chip{
letter-spacing: 0.2em;
text-transform: uppercase;
font-family: "Inter", sans-serif;
font-weight: 700;
font-size: 0.73rem;
}
.uxp-home .uxp-hero h1{
font-size: clamp(2.9rem, 8vw, 5.25rem);
font-weight: 700;
line-height: 0.98;
}
.uxp-home .uxp-hero p{
font-size: clamp(1.05rem, 2vw, 1.3rem);
color: #d1d5db;
font-weight: 300;
max-width: 38rem;
}
.uxp-home .button{
text-transform: uppercase;
letter-spacing: 0.14em;
font-size: 0.72rem;
font-weight: 700;
border-radius: 2px;
padding: 0.95rem 1.55rem;
}
.uxp-home .button-primary{
background: #fff;
color: #1a1a1a;
}
.uxp-home .button-primary:hover,
.uxp-home .button-primary:focus-visible{
background: #e5e7eb;
color: #111;
}
.uxp-home .button-secondary{
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.3);
color: #fff;
}
.uxp-home .uxp-zone-card{
border-radius: 10px;
min-height: 400px;
}
.uxp-home .uxp-zone-card-content h3{
font-size: 2rem;
}
.uxp-home .uxp-zone-card-content p{
font-size: 0.9rem;
}
@media (max-width: 860px){.header-top{
display: none;
}
.header-main{
min-height: auto;
}
.main-navigation a{
font-size: 0.78rem;
padding: 0.65rem 0.55rem;
}
.uxp-home .uxp-hero h1{
font-size: clamp(2.2rem, 11vw, 3.2rem);
}}
.header-actions{
display: flex;
align-items: center;
gap: 0.65rem;
margin-left: 0.55rem;
position: relative;
}
.header-search-toggle{
width: 2.2rem;
height: 2.2rem;
border: 0;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
color: #d1d5db;
font-size: 1.05rem;
}
.header-search-toggle:hover,
.header-search-toggle:focus-visible{
color: #fff;
background: rgba(255, 255, 255, 0.08);
}
.header-search-form{
position: absolute;
right: calc(100% + 0.5rem);
top: 50%;
transform: translateY(-50%);
display: none;
align-items: center;
gap: 0.25rem;
padding: 0.3rem;
border-radius: 999px;
background: rgba(18, 18, 18, 0.96);
border: 1px solid rgba(255, 255, 255, 0.16);
}
.header-search-form.is-open{
display: inline-flex;
}
.header-search-form input{
width: 180px;
height: 2rem;
border-radius: 999px;
border: 0;
padding: 0 0.7rem;
font-size: 0.86rem;
background: #111;
color: #fff;
}
.header-search-form button{
width: 2rem;
height: 2rem;
border: 0;
border-radius: 999px;
background: #d61f26;
color: #fff;
display: inline-flex;
align-items: center;
justify-content: center;
}
.header-shop-cta{
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
border-radius: 999px;
background: #d61f26;
color: #fff;
text-transform: uppercase;
letter-spacing: 0.15em;
font-size: 0.68rem;
font-weight: 700;
padding: 0.66rem 1.08rem;
box-shadow: 0 10px 24px rgba(140, 20, 25, 0.28);
}
.header-shop-cta:hover,
.header-shop-cta:focus-visible{
background: #b9191f;
color: #fff;
}
@media (max-width: 860px){.header-actions{
order: 3;
width: 100%;
justify-content: flex-end;
margin-left: 0;
}
.header-search-form{
left: 0;
right: auto;
top: calc(100% + 0.35rem);
transform: none;
}
.header-search-form input{
width: min(58vw, 210px);
}
.header-shop-cta{
font-size: 0.66rem;
}}
.site-header .ux-header-inner{
max-width: 1280px;
margin: 0 auto;
padding: 0 1rem;
min-height: 80px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
}
.site-header .custom-logo-link + .site-title{
display: none;
}
.ux-logo-wordmark{
display: inline-flex;
flex-direction: column;
font-family: "Playfair Display", serif;
font-size: 1.42rem;
font-weight: 700;
letter-spacing: 0.08em;
color: #fff;
}
.ux-logo-wordmark span{
font-family: "Inter", sans-serif;
font-size: 0.58rem;
font-weight: 300;
letter-spacing: 0.3em;
text-transform: uppercase;
color: #7abf43;
margin-top: 0.22rem;
}
.site-header .site-branding{
display: flex;
align-items: center;
gap: 0.65rem;
min-width: auto;
}
.site-header .custom-logo-link img{
max-height: 42px;
}
.site-header .main-navigation{
margin-left: auto;
}
.site-header .main-navigation > div > ul,
.site-header .main-navigation > ul{
gap: 1.35rem;
}
.site-header .main-navigation a{
padding: 0;
font-size: 0.67rem;
letter-spacing: 0.2em;
text-transform: uppercase;
color: #9ca3af;
}
.site-header .main-navigation a:hover,
.site-header .main-navigation a:focus-visible{
color: #fff;
}
.site-header .header-actions{
gap: 0.75rem;
margin-left: 1rem;
}
.site-header .header-search-toggle{
width: 2rem;
height: 2rem;
font-size: 1rem;
}
.site-header .header-shop-cta{
padding: 0.56rem 1rem;
font-size: 0.63rem;
letter-spacing: 0.22em;
}
.uxp-zone-card{
min-height: 400px;
border-radius: 0.6rem;
}
.uxp-zone-card::after{
background: linear-gradient(180deg, rgba(0, 0, 0, 0.4) 25%, rgba(0, 0, 0, 0.85) 100%);
transition: background 0.35s ease;
}
.uxp-zone-card:hover::after,
.uxp-zone-card:focus-visible::after{
background: linear-gradient(180deg, rgba(0, 0, 0, 0.22) 15%, rgba(0, 0, 0, 0.82) 100%);
}
.uxp-zone-card-content{
padding: 1.6rem;
}
.uxp-zone-card h3{
font-size: 2rem;
}
.uxp-zone-card p{
opacity: 0;
transform: translateY(12px);
transition: opacity 0.35s ease, transform 0.35s ease;
}
.uxp-zone-card:hover p,
.uxp-zone-card:focus-visible p{
opacity: 1;
transform: translateY(0);
}
.uxp-cat-grid{
grid-template-columns: 1.45fr repeat(2, 1fr);
grid-auto-rows: 185px;
}
.uxp-cat-card:first-child{
grid-row: span 2;
}
.uxp-cat-card{
position: relative;
border-radius: 0.85rem;
overflow: hidden;
}
.uxp-cat-card img{
height: 100%;
transition: transform 0.65s ease;
}
.uxp-cat-card h3{
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding: 1rem;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.85));
font-size: 1.35rem;
}
.uxp-cat-card:hover img,
.uxp-cat-card:focus-within img{
transform: scale(1.08);
}
.site-footer{
background: #1a1a1a;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.footer-grid-ux{
grid-template-columns: 1.25fr 1fr 1fr 1.15fr;
gap: 2rem;
padding-top: 3.5rem;
padding-bottom: 2.4rem;
}
.footer-grid-ux h2{
margin: 0 0 1rem;
font-size: 0.76rem;
text-transform: uppercase;
letter-spacing: 0.2em;
font-family: "Inter", sans-serif;
}
.footer-brand h2{
font-family: "Playfair Display", serif;
font-size: 1.9rem;
text-transform: none;
letter-spacing: 0.06em;
}
.footer-grid-ux p,
.footer-grid-ux li,
.footer-grid-ux a{
color: #9ca3af;
font-size: 0.9rem;
}
.footer-grid-ux a:hover,
.footer-grid-ux a:focus-visible{
color: #d61f26;
}
.footer-contact-list li{
display: flex;
align-items: flex-start;
gap: 0.5rem;
}
.footer-contact-list i{
color: #d61f26;
margin-top: 0.12rem;
}
.site-info-row{
max-width: 1220px;
margin: 0 auto;
padding: 1rem;
border-top: 1px solid rgba(255, 255, 255, 0.08);
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 0.7rem;
}
.site-info{
margin: 0;
padding: 0;
border: 0;
font-size: 0.76rem;
color: #6b7280;
}
@media (max-width: 980px){.site-header .main-navigation > div > ul,
.site-header .main-navigation > ul{
gap: 0.8rem;
}
.footer-grid-ux{
grid-template-columns: repeat(2, 1fr);
}}
@media (max-width: 860px){.site-header .ux-header-inner{
flex-wrap: wrap;
padding-top: 0.8rem;
padding-bottom: 0.8rem;
}
.site-header .main-navigation{
order: 2;
width: 100%;
}
.site-header .main-navigation > div > ul,
.site-header .main-navigation > ul{
gap: 0;
}
.site-header .main-navigation a{
padding: 0.7rem 0.5rem;
font-size: 0.75rem;
}
.site-header .header-actions{
order: 3;
width: 100%;
justify-content: flex-end;
margin-left: 0;
}
.footer-grid-ux{
grid-template-columns: 1fr;
}}
.uxp-zone-card-special{
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(145deg, #20242d, #171b23);
border: 1px solid rgba(255, 255, 255, 0.08);
min-height: 400px;
}
.uxp-zone-card-special::after{
background: linear-gradient(180deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.55));
}
.uxp-zone-card-special .uxp-zone-card-content{
position: relative;
inset: auto;
padding: 1.75rem;
text-align: center;
}
.uxp-zone-icon{
width: 78px;
height: 78px;
margin: 0 auto 1rem;
border-radius: 999px;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.25);
display: inline-flex;
align-items: center;
justify-content: center;
transition: transform 0.35s ease, background-color 0.35s ease;
}
.uxp-zone-icon i{
font-size: 2rem;
color: #fff;
}
.uxp-zone-card-special h3{
font-size: 1.9rem;
margin-bottom: 0.5rem;
}
.uxp-zone-card-special p{
opacity: 1;
transform: none;
color: #c9cfda;
max-width: 26ch;
margin: 0.3rem auto 0;
}
.uxp-zone-cta{
display: inline-block;
margin-top: 1rem;
font-size: 0.72rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.16em;
color: #ff585e;
border-bottom: 1px solid #ff585e;
padding-bottom: 0.2rem;
}
.uxp-zone-card-special:hover .uxp-zone-icon,
.uxp-zone-card-special:focus-visible .uxp-zone-icon{
transform: scale(1.1);
background: #d61f26;
}
.uxp-b2b-tile .uxp-zone-icon{
background: rgba(122, 191, 67, 0.18);
border-color: rgba(122, 191, 67, 0.4);
}
.uxp-b2b-tile .uxp-zone-cta{
color: #9fd766;
border-color: #9fd766;
}
a:visited{
color: inherit;
}
.main-navigation a:visited,
.site-footer a:visited,
.uxp-home a:visited,
.header-shop-cta:visited,
.button:visited{
color: inherit;
}
.uxp-app{
background: linear-gradient(90deg, rgba(214, 31, 38, 0.93), rgba(140, 15, 22, 0.95));
position: relative;
overflow: hidden;
}
.uxp-app::before{
content: "";
position: absolute;
inset: 0;
background-image: url("assets/images/pattern-cubes.webp");
opacity: 0.08;
pointer-events: none;
}
.uxp-app .uxp-app-grid{
position: relative;
z-index: 1;
display: grid;
grid-template-columns: 1.1fr auto;
align-items: center;
gap: 2rem;
}
.uxp-app-copy{
max-width: 640px;
}
.uxp-app h2{
font-size: clamp(2rem, 4.2vw, 3.4rem);
margin-bottom: 0.55rem;
}
.uxp-app p{
color: rgba(255, 255, 255, 0.85);
font-size: 1.08rem;
margin-bottom: 1.15rem;
}
.uxp-app-actions{
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
}
.uxp-store-btn{
background: #0f1115;
border: 1px solid rgba(255, 255, 255, 0.2);
color: #fff;
border-radius: 0.55rem;
padding: 0.65rem 1rem;
display: inline-flex;
align-items: center;
gap: 0.6rem;
min-width: 180px;
}
.uxp-store-btn i{
font-size: 1.7rem;
}
.uxp-store-btn span{
display: flex;
flex-direction: column;
align-items: flex-start;
font-size: 1rem;
font-weight: 700;
line-height: 1.05;
}
.uxp-store-btn small{
font-size: 0.66rem;
font-weight: 500;
text-transform: uppercase;
color: #9ca3af;
letter-spacing: 0.08em;
}
.uxp-app-phone-wrap{
display: flex;
justify-content: center;
}
.uxp-app-phone{
width: 180px;
height: 360px;
border: 8px solid #080a0d;
border-radius: 2.1rem;
overflow: hidden;
background: #151922;
box-shadow: 0 24px 40px rgba(0, 0, 0, 0.4);
transform: rotate(3deg);
transition: transform 0.5s ease;
}
.uxp-app-phone-wrap:hover .uxp-app-phone{
transform: rotate(0deg);
}
.uxp-app-phone-top{
height: 56px;
background: #d61f26;
color: #fff;
font-size: 0.9rem;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
letter-spacing: 0.06em;
}
.uxp-app-phone-body{
padding: 0.85rem;
}
.uxp-app-phone-banner{
height: 90px;
border-radius: 0.6rem;
background: rgba(255, 255, 255, 0.08);
padding: 0.65rem;
}
.uxp-app-dot{
width: 34px;
height: 34px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.25);
margin-bottom: 0.45rem;
}
.uxp-app-line{
height: 6px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.28);
margin-bottom: 0.35rem;
}
.uxp-app-line.short{
width: 58%;
}
.uxp-app-grid-mini{
margin-top: 0.65rem;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0.5rem;
}
.uxp-app-grid-mini div{
height: 72px;
border-radius: 0.5rem;
background: rgba(255, 255, 255, 0.06);
}
@media (max-width: 860px){.uxp-app .uxp-app-grid{
grid-template-columns: 1fr;
}
.uxp-app-phone{
width: 150px;
height: 305px;
}}
.uxp-heading-line{
width: 92px;
height: 4px;
background: #d61f26;
border-radius: 999px;
margin: 0.65rem 0 0.95rem;
}
.uxp-section-head{
text-align: center;
}
.uxp-section-head p{
margin-left: auto;
margin-right: auto;
}
.uxp-producers{
position: relative;
background: url("assets/images/wspolpraca.jpg") center/cover no-repeat;
padding: 6rem 0;
}
.uxp-producers-overlay{
position: absolute;
inset: 0;
background: rgba(12, 15, 19, 0.78);
}
.uxp-producers-content{
position: relative;
z-index: 1;
max-width: 860px;
}
.uxp-mission-kicker{
display: inline-block;
color: #95d35b;
font-size: 0.78rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.22em;
margin-bottom: 0.45rem;
}
.uxp-heading-line-white{
background: #fff;
}
.uxp-mission-points{
display: flex;
flex-wrap: wrap;
gap: 1.1rem 2rem;
margin-top: 1.35rem;
}
.uxp-mission-point{
display: flex;
align-items: center;
gap: 0.7rem;
}
.uxp-mission-icon{
width: 42px;
height: 42px;
border-radius: 999px;
background: rgba(149, 211, 91, 0.2);
border: 1px solid rgba(149, 211, 91, 0.45);
display: inline-flex;
align-items: center;
justify-content: center;
color: #95d35b;
}
.uxp-mission-point h3{
margin: 0;
font-size: 1rem;
color: #fff;
}
.uxp-mission-point p{
margin: 0.1rem 0 0;
font-size: 0.86rem;
color: #aeb6c4;
}
.uxp-categories .uxp-section-head{
text-align: left;
}
.uxp-categories .uxp-heading-line{
margin-left: 0;
}
.uxp-cat-grid{
grid-template-columns: 1.2fr 1fr 1fr;
grid-template-rows: repeat(2, 220px);
}
.uxp-cat-card:first-child{
grid-row: 1 / span 2;
}
.uxp-b2b{
padding-top: 3.2rem;
}
.uxp-b2b-grid{
grid-template-columns: 1fr 1fr;
gap: 1.5rem;
}
.uxp-b2b-kicker{
display: inline-block;
color: #d61f26;
font-size: 0.75rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.22em;
margin-bottom: 0.35rem;
}
.uxp-b2b-copy .uxp-heading-line{
margin-left: 0;
}
.uxp-b2b-copy .button-primary{
background: #fff;
color: #1a1a1a;
}
.uxp-b2b-copy .button-primary:hover,
.uxp-b2b-copy .button-primary:focus-visible{
background: #e5e7eb;
color: #111;
}
@media (max-width: 860px){.uxp-cat-grid{
grid-template-columns: 1fr;
grid-template-rows: auto;
}
.uxp-cat-card:first-child{
grid-row: auto;
}
.uxp-b2b-grid{
grid-template-columns: 1fr;
}
.uxp-section-head{
text-align: left;
}}
.footer-logo .custom-logo-link img{
max-height: 64px;
width: auto;
}
.footer-menu-list,
.footer-menu-list ul{
margin: 0;
padding: 0;
list-style: none;
}
.footer-menu-list li + li{
margin-top: 0.35rem;
}
.footer-brand .footer-social-links{
margin-top: 10px;
}
.footer-quick-links{
margin: 12px 0 0;
font-size: 0.92rem;
display: inline-flex;
gap: 0.5rem;
align-items: center;
}
.footer-quick-links a{
text-decoration: underline;
}
.karpinski-age-gate{
background: #ffffff;
border: 1px solid #d9dce2;
border-radius: 14px;
padding: 1.2rem 1.25rem;
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
color: #101215;
}
.karpinski-age-gate h2{
margin: 0 0 0.5rem;
font-size: clamp(1.25rem, 2vw, 1.6rem);
}
.karpinski-age-gate p{
margin: 0 0 0.7rem;
}
.karpinski-age-gate-actions{
display: flex;
flex-wrap: wrap;
gap: 0.65rem;
margin-top: 0.9rem;
}
.footer-social-links a{
width: auto;
height: auto;
background: transparent;
border: 0;
border-radius: 0;
padding: 0;
line-height: 1;
display: inline-flex;
align-items: center;
justify-content: center;
}
.footer-social-links a i{
font-size: 1.2rem;
}
.footer-contact-list li{
display: flex;
align-items: center;
gap: 0.55rem;
}
.footer-contact-list i{
color: #d61f26;
margin-top: 0;
font-size: 1.1rem;
line-height: 1;
flex: 0 0 auto;
}
.button-primary:visited,
.uxp-b2b-copy .button-primary:visited{
color: #1a1a1a !important;
}
.uxp-heading-line{
margin-left: auto !important;
margin-right: auto !important;
}
.uxp-categories .uxp-section-head,
.uxp-b2b-copy,
.uxp-producers-content{
text-align: center !important;
}
.uxp-categories .uxp-heading-line,
.uxp-b2b-copy .uxp-heading-line{
margin-left: auto !important;
margin-right: auto !important;
}
.uxp-b2b{
background: #1a1a1a !important;
}
.uxp-b2b::before{
display: none !important;
}
.uxp-producers{
background: #121419 !important;
}
.uxp-producers-overlay{
display: none !important;
}
.uxp-mission-points{
justify-content: center;
}
.footer-grid-ux ul{
list-style: none !important;
padding-left: 0 !important;
}
.footer-grid-ux section:nth-child(3) ul{
display: block !important;
}
.footer-grid-ux section:nth-child(3) a,
.footer-grid-ux section:nth-child(3) a:hover,
.footer-grid-ux section:nth-child(3) a:focus-visible{
width: auto !important;
height: auto !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
padding: 0 !important;
display: inline !important;
}
@media (max-width: 860px){.uxp-section-head,
.uxp-categories .uxp-section-head,
.uxp-b2b-copy,
.uxp-producers-content{
text-align: center !important;
}}
.uxp-b2b-copy{
align-items: flex-start !important;
text-align: left !important;
}
.uxp-b2b-copy .uxp-heading-line{
display: none !important;
}
.uxp-b2b-collage{
grid-template-columns: 1fr 1fr !important;
grid-template-areas:
"a b"
"c d" !important;
}
.uxp-b2b-collage img:nth-child(1){ grid-area: a; }
.uxp-b2b-collage img:nth-child(2){ grid-area: c; }
.uxp-b2b-collage img:nth-child(3){ grid-area: b; }
.uxp-b2b-collage img:nth-child(4){ grid-area: d; }
.check-list{
list-style: none !important;
padding: 0 !important;
margin: 1rem 0 1.4rem !important;
}
.check-list li{
display: flex !important;
align-items: flex-start !important;
gap: 0.55rem !important;
margin: 0 0 0.5rem !important;
padding: 0 !important;
list-style: none !important;
}
.check-list li::before,
.check-list li::marker{
content: none !important;
}
.check-list li i{
color: #d61f26 !important;
margin-top: 0.15rem !important;
flex: 0 0 auto;
}
@media (max-width: 860px){.uxp-b2b-copy{
align-items: center !important;
text-align: center !important;
}}
.uxp-producers{
background:
radial-gradient(1200px 520px at -10% 50%, rgba(18, 26, 44, 0.65), transparent 70%),
radial-gradient(900px 420px at 110% 40%, rgba(15, 20, 33, 0.6), transparent 72%),
#0f131b !important;
padding: 6.5rem 0 5.2rem !important;
border-top: 0 !important;
border-bottom: 0 !important;
}
.uxp-producers-content{
max-width: 1220px !important;
margin: 0 auto !important;
text-align: left !important;
padding-left: 1rem;
padding-right: 1rem;
display: grid;
grid-template-columns: minmax(0, 860px);
}
.uxp-mission-kicker,
.uxp-producers h2,
.uxp-heading-line-white,
.uxp-producers p,
.uxp-mission-points{
grid-column: 1;
}
.uxp-mission-kicker{
float: none;
display: block;
text-align: left;
margin-bottom: 0.9rem !important;
}
.uxp-producers h2{
clear: none;
font-size: clamp(2.4rem, 5.8vw, 5rem) !important;
line-height: 1.12 !important;
text-align: left !important;
max-width: 14ch;
margin: 0 !important;
}
.uxp-heading-line-white{
width: 92px !important;
height: 5px !important;
margin: 1.15rem 0 1.25rem !important;
justify-self: center;
}
.uxp-producers p{
text-align: left !important;
max-width: 64ch !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.uxp-mission-points{
margin-top: 1.8rem !important;
justify-content: flex-start !important;
}
.uxp-b2b{
background:
linear-gradient(105deg, #1c1d22 0%, #1c1d22 54%, #191a1f 54%, #191a1f 100%) !important;
padding-bottom: 0 !important;
margin-bottom: 0 !important;
}
.uxp-b2b-grid{
align-items: start !important;
padding-bottom: 0 !important;
}
.uxp-b2b-copy{
padding-top: 1.2rem;
}
.uxp-b2b-collage{
gap: 0.85rem !important;
}
.uxp-b2b-collage img{
height: 250px !important;
border-radius: 0.8rem !important;
}
.uxp-app{
margin-top: 0 !important;
}
.check-list{
list-style: none !important;
padding-left: 0 !important;
}
.check-list li{
list-style: none !important;
}
.check-list li::marker,
.check-list li::before{
content: "" !important;
display: none !important;
}
@media (max-width: 860px){.uxp-mission-kicker{
float: none;
display: block;
text-align: left;
}
.uxp-producers h2,
.uxp-producers p{
text-align: left !important;
}
.uxp-b2b-collage img{
height: 170px !important;
}}
.uxp-producers h2{
max-width: 17ch !important;
}
.uxp-producers p{
max-width: 78ch !important;
}
.uxp-b2b{
padding-bottom: 2.8rem !important;
}
.uxp-app{
margin-top: 0 !important;
}
@media (max-width: 860px){.uxp-producers h2{
max-width: 20ch !important;
}
.uxp-producers p{
max-width: 100% !important;
}
.uxp-b2b{
padding-bottom: 1.8rem !important;
}}
.eu-program-wrap{
background: #11161f;
padding: 0.85rem 1rem;
scroll-margin-top: 84px;
}
.eu-program-inner{
max-width: 1220px;
margin: 0 auto;
}
.eu-program-details{
background: transparent;
border: 0;
border-radius: 0;
overflow: hidden;
}
.eu-program-details summary{
list-style: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 0.75rem;
padding: 0.75rem 1rem;
}
.eu-program-details summary::-webkit-details-marker{
display: none;
}
.eu-icon-plain{
width: auto;
height: auto;
display: inline-flex;
align-items: center;
justify-content: center;
color: #e9eef8;
}
.eu-icon-plain img{
width: auto;
height: auto;
max-width: min(100%, 650px);
max-height: 56px;
display: block;
opacity: 0.9;
}
.eu-program-label{
color: #e9eef8;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
font-size: 0.76rem;
}
.eu-arrow{
color: #d61f26;
font-size: 1.35rem;
display: inline-flex;
animation: euArrowBob 1.25s ease-in-out infinite;
}
.eu-program-details[open] .eu-arrow{
animation: none;
transform: rotate(180deg);
}
.eu-program-content{
padding: 0 1rem 0.95rem;
color: #e9eef8;
}
.eu-program-content p{
margin: 0;
text-align: center;
}
@keyframes euArrowBob{0%, 100%{ transform: translateY(-2px); }
50%{ transform: translateY(3px); }}
body.modal-open{
overflow: hidden;
}
.b2b-modal{
position: fixed;
inset: 0;
display: grid;
place-items: center;
padding: 1rem;
opacity: 0;
visibility: hidden;
pointer-events: none;
z-index: 1300;
transition: opacity 0.28s ease, visibility 0.28s ease;
}
.b2b-modal.is-open{
opacity: 1;
visibility: visible;
pointer-events: auto;
}
.b2b-modal-overlay{
position: absolute;
inset: 0;
background: rgba(14, 18, 28, 0.72);
backdrop-filter: blur(1.5px);
}
.b2b-modal-dialog{
position: relative;
width: min(100%, 720px);
max-height: min(88vh, 820px);
background: linear-gradient(180deg, #ffffff 0%, #f6f8fb 100%);
color: #131824;
border-radius: 1.15rem;
box-shadow: 0 32px 84px rgba(6, 10, 18, 0.38);
overflow: auto;
padding: 1.7rem 1.3rem 1.35rem;
z-index: 1;
}
.b2b-modal-close{
position: absolute;
top: 0.65rem;
right: 0.65rem;
width: 2.2rem;
height: 2.2rem;
border: 0;
border-radius: 999px;
background: #edf1f7;
color: #0e1522;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 1.3rem;
cursor: pointer;
transition: background-color 0.22s ease, color 0.22s ease;
}
.b2b-modal-close:hover,
.b2b-modal-close:focus-visible{
background: #d61f26;
color: #ffffff;
}
.b2b-modal-head{
padding-right: 2.8rem;
}
.b2b-modal-kicker{
margin: 0 0 0.6rem;
font-size: 0.72rem;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #d61f26;
}
.b2b-modal h2{
margin: 0;
color: #0c1220;
font-size: clamp(1.4rem, 3.4vw, 2.05rem);
line-height: 1.15;
}
.b2b-modal-head > p:last-child{
margin: 0.72rem 0 0;
color: #485264;
font-size: 0.98rem;
line-height: 1.55;
}
.b2b-modal-body{
margin-top: 1.35rem;
}
.b2b-modal-body .wpcf7-form,
.b2b-fallback-form{
display: grid;
gap: 0.85rem;
}
.b2b-modal-body .wpcf7-form p,
.b2b-fallback-form p{
margin: 0;
}
.b2b-modal-body label{
display: block;
margin-bottom: 0.38rem;
font-weight: 600;
font-size: 0.92rem;
color: #1f2838;
}
.b2b-modal-body input[type="text"],
.b2b-modal-body input[type="email"],
.b2b-modal-body input[type="tel"],
.b2b-modal-body textarea,
.b2b-modal-body select{
width: 100%;
border: 1px solid #d2d9e5;
border-radius: 0.72rem;
background: #ffffff;
color: #101723;
padding: 0.72rem 0.88rem;
font-size: 0.95rem;
line-height: 1.45;
transition: border-color 0.22s ease, box-shadow 0.22s ease;
}
.b2b-modal-body textarea{
min-height: 130px;
resize: vertical;
}
.b2b-modal-body input:focus,
.b2b-modal-body textarea:focus,
.b2b-modal-body select:focus{
border-color: #d61f26;
box-shadow: 0 0 0 3px rgba(214, 31, 38, 0.18);
outline: none;
}
.b2b-modal-body input[type="submit"],
.b2b-fallback-form button[type="submit"],
.b2b-modal-body .wpcf7-submit{
display: inline-flex;
align-items: center;
justify-content: center;
border: 0;
border-radius: 999px;
background: #d61f26;
color: #ffffff !important;
padding: 0.76rem 1.25rem;
font-weight: 700;
font-size: 0.92rem;
cursor: pointer;
text-decoration: none;
transition: transform 0.2s ease, background-color 0.2s ease;
}
.b2b-modal-body input[type="submit"]:hover,
.b2b-fallback-form button[type="submit"]:hover,
.b2b-modal-body .wpcf7-submit:hover{
background: #b7191f;
transform: translateY(-1px);
}
.b2b-modal-body .wpcf7-spinner{
vertical-align: middle;
}
.b2b-modal-body .wpcf7-response-output{
margin: 0.45rem 0 0 !important;
border-radius: 0.6rem;
font-size: 0.9rem;
}
@media (max-width: 720px){.b2b-modal-dialog{
padding: 1.35rem 1rem 1rem;
max-height: 90vh;
}
.b2b-modal-head{
padding-right: 2.2rem;
}}
.contact-form-wrap .wpcf7-form{
display: grid;
gap: 0.85rem;
}
.contact-form-wrap .wpcf7-form p{
margin: 0;
}
.contact-form-wrap .wpcf7-form label{
display: block;
margin-bottom: 0.35rem;
font-weight: 700;
}
.contact-form-wrap .wpcf7-form input[type="text"],
.contact-form-wrap .wpcf7-form input[type="email"],
.contact-form-wrap .wpcf7-form input[type="tel"],
.contact-form-wrap .wpcf7-form textarea,
.contact-form-wrap .wpcf7-form select{
width: 100%;
border: 1px solid #aeb5c2;
border-radius: 0.35rem;
padding: 0.65rem;
font: inherit;
color: #ffffff;
background: rgba(17, 22, 31, 0.75);
}
.contact-form-wrap .wpcf7-form textarea{
min-height: 160px;
resize: vertical;
}
.contact-form-wrap .wpcf7-submit{
width: auto;
min-width: 220px;
border: 1px solid #d61f26;
border-radius: 0.35rem;
padding: 0.7rem 1rem;
background: #d61f26;
color: #ffffff;
font-weight: 700;
cursor: pointer;
}
.contact-form-wrap .wpcf7-submit:hover{
background: #b7191f;
}
.contact-form-wrap .wpcf7-response-output{
margin: 0.45rem 0 0 !important;
}
.career-offers-on-page{
margin: 0 0 1.6rem !important;
}
.page-hero{
position: relative;
width: 100%;
min-height: 52vh;
overflow: hidden;
isolation: isolate;
}
.page-hero-media,
.page-hero-overlay{
position: absolute;
inset: 0;
}
.page-hero-media img{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transform: scale(1.03);
}
.page-hero-overlay{
background: linear-gradient(180deg, rgba(6, 10, 18, 0.35), rgba(9, 14, 24, 0.78));
}
body:not(.home) .site-main.static-page.page-subpage-main{
position: relative;
max-width: 100%;
margin-top: -130px;
padding: 0 1rem 1.5rem;
z-index: 2;
}
.page-parallax-content{
max-width: 1120px;
margin: 0 auto;
will-change: transform;
transition: transform 0.18s linear;
}
.page-parallax-content .static-page-section:first-child,
.page-parallax-content article:first-child{
padding-top: 2.1rem;
}
.page-social-links{
display: flex;
flex-wrap: wrap;
gap: 0.8rem;
padding: 0;
margin: 0.25rem 0 0;
list-style: none;
}
.page-social-links a{
width: 2.5rem;
height: 2.5rem;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.15);
color: #ffffff !important;
}
.page-social-links a:hover,
.page-social-links a:focus-visible{
background: #d61f26;
border-color: #d61f26;
}
.eu-map-band{
width: 100%;
height: clamp(280px, 36vw, 430px);
border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.eu-map-band iframe{
display: block;
width: 100%;
height: 100%;
border: 0;
filter: saturate(0.95) contrast(1.02);
}
.contact-page-map{
margin-top: 0.75rem;
}
@media (max-width: 860px){.page-hero{
min-height: 42vh;
}
body:not(.home) .site-main.static-page.page-subpage-main{
margin-top: -72px;
padding-left: 0.75rem;
padding-right: 0.75rem;
}
.page-parallax-content .static-page-section:first-child,
.page-parallax-content article:first-child{
padding-top: 1.2rem;
}}
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible{
outline: 3px solid #ffd84d;
outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce){*,
*::before,
*::after{
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
.page-parallax-content,
.page-hero-media img{
transform: none !important;
}}
.site-header .main-navigation{
position: relative;
margin-left: auto;
z-index: 1200;
}
.site-header .menu-toggle{
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.48rem;
height: 2.28rem;
padding: 0.56rem 1.02rem;
border-radius: 999px;
border: 0;
background: #d61f26;
color: #fff;
font-size: 0.66rem;
font-weight: 700;
letter-spacing: 0.22em;
text-transform: uppercase;
box-shadow: 0 10px 24px rgba(140, 20, 25, 0.28);
transition: background-color 0.26s ease, transform 0.26s ease;
}
.site-header .menu-toggle:hover,
.site-header .menu-toggle:focus-visible{
background: #b9191f;
color: #fff;
}
.site-header .menu-toggle-label{
display: inline-block;
min-width: 3.1em;
text-align: center;
}
.site-header .menu-toggle-icon{
position: relative;
width: 1rem;
height: 1rem;
flex: 0 0 1rem;
}
.site-header .menu-toggle-icon::before,
.site-header .menu-toggle-icon::after{
content: "";
position: absolute;
left: 0.05rem;
right: 0.05rem;
height: 2px;
background: currentColor;
border-radius: 10px;
transition: transform 0.26s ease, top 0.26s ease, opacity 0.2s ease;
}
.site-header .menu-toggle-icon::before{
top: 0.32rem;
}
.site-header .menu-toggle-icon::after{
top: 0.68rem;
}
.site-header .main-navigation.toggled .menu-toggle-icon::before{
top: 0.5rem;
transform: rotate(45deg);
}
.site-header .main-navigation.toggled .menu-toggle-icon::after{
top: 0.5rem;
transform: rotate(-45deg);
}
.site-header .menu-toggle-label{
max-width: 4.2rem;
overflow: hidden;
white-space: nowrap;
transition: opacity 0.22s ease, max-width 0.24s ease, margin 0.24s ease;
}
.site-header .main-navigation.toggled .menu-toggle-label{
opacity: 0;
max-width: 0;
margin: 0;
}
.site-header .main-navigation > div > ul,
.site-header .main-navigation > ul{
position: absolute;
top: calc(100% + 0.5rem);
right: 0;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
align-items: stretch;
align-content: flex-start;
gap: 0;
width: min(90vw, 360px);
max-height: 0;
margin: 0;
padding: 0.85rem;
overflow: hidden;
overflow-y: hidden;
overflow-x: hidden;
opacity: 0;
visibility: hidden;
pointer-events: none;
background: rgba(3, 8, 19, 0.98);
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 0.8rem;
box-shadow: 0 18px 45px rgba(0, 0, 0, 0.45);
transform: translateY(-8px);
transition: max-height 0.32s ease, opacity 0.25s ease, transform 0.25s ease, visibility 0s linear 0.25s;
z-index: 120;
}
.site-header .main-navigation.toggled > div > ul,
.site-header .main-navigation.toggled > ul{
max-height: min(78vh, calc(100dvh - 210px));
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0);
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
scrollbar-gutter: stable;
transition: max-height 0.34s ease, opacity 0.25s ease, transform 0.25s ease, visibility 0s linear 0s;
}
.site-header .main-navigation > div > ul > li,
.site-header .main-navigation > ul > li{
width: 100%;
}
.site-header .main-navigation a{
display: block;
padding: 0.72rem 0.62rem;
font-size: 0.8rem;
letter-spacing: 0.18em;
color: #9ca3af;
border-radius: 0.52rem;
}
.site-header .main-navigation a:hover,
.site-header .main-navigation a:focus-visible{
background: rgba(255, 255, 255, 0.05);
color: #fff;
}
.site-header .header-actions{
gap: 0.62rem;
}
.site-header .header-shop-cta,
.site-header .menu-toggle{
white-space: nowrap;
}
.site-header .header-search-toggle.is-hidden{
opacity: 0;
pointer-events: none;
transform: scale(0.82);
}
@media (min-width: 861px){.site-header .ux-header-inner{
flex-wrap: nowrap;
}
.site-header .main-navigation{
order: 2;
margin-left: auto;
}
.site-header .menu-toggle{
display: none;
}
.site-header .main-navigation > div > ul,
.site-header .main-navigation > ul{
position: static;
top: auto;
right: auto;
width: auto;
max-height: none;
padding: 0;
margin: 0;
overflow: visible;
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: none;
background: transparent;
border: 0;
border-radius: 0;
box-shadow: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
gap: 1.35rem;
}
.site-header .main-navigation > div > ul > li,
.site-header .main-navigation > ul > li{
width: auto;
}
.site-header .main-navigation a{
display: inline-block;
padding: 0;
font-size: 0.67rem;
letter-spacing: 0.2em;
}
.site-header .header-actions{
order: 3;
width: auto;
margin-left: 0.7rem;
justify-content: flex-end;
}
.site-header .header-shop-cta{
display: inline-flex;
align-items: center;
justify-content: center;
text-align: center;
line-height: 1;
min-height: 2.28rem;
}}
@media (max-width: 860px){.site-header .ux-header-inner{
flex-wrap: wrap;
}
.site-header .main-navigation{
width: 100%;
order: 2;
}
.site-header .menu-toggle{
margin-left: auto;
}
.site-header .main-navigation > div > ul,
.site-header .main-navigation > ul{
position: relative;
top: 0.45rem;
right: 0;
left: 0;
width: 100%;
max-height: 0;
}
.site-header .main-navigation.toggled > div > ul,
.site-header .main-navigation.toggled > ul{
max-height: calc(100dvh - 240px);
}
.site-header .header-actions{
order: 3;
width: 100%;
margin-left: auto;
justify-content: flex-end;
}
.site-header .header-search-form{
top: calc(100% + 0.4rem);
left: auto;
right: 0;
}
.site-header .header-shop-cta{
padding: 0.56rem 1rem;
}
.page-hero{
min-height: 34vh;
height: clamp(250px, 42vh, 380px);
}
.page-hero-media img{
object-position: 50% 26%;
transform: scale(1.01);
}
body:not(.home) .site-main.static-page.page-subpage-main{
margin-top: -52px;
}}
.site-header,
.site-header .ux-header-inner,
.site-header .main-navigation{
overflow: visible;
}
.header-quick-contact{
display: none;
align-items: center;
gap: 0.5rem;
margin-left: auto;
}
.header-quick-contact a{
width: 1.8rem;
height: 1.8rem;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 0;
border: 0;
background: transparent;
color: #d61f26 !important;
font-size: 1.1rem;
}
.header-quick-contact a:hover,
.header-quick-contact a:focus-visible{
background: transparent;
color: #ff4d52 !important;
}
@media (max-width: 860px){.site-header .ux-header-inner{
display: flex;
align-items: center;
gap: 0.5rem;
}
.site-header .site-branding{
width: auto;
flex: 1 1 auto;
display: flex;
align-items: center;
}
.header-quick-contact{
display: inline-flex;
margin-left: auto;
}
.site-header .main-navigation.toggled > div > ul,
.site-header .main-navigation.toggled > ul{
position: relative;
left: auto;
right: auto;
top: 0.45rem;
bottom: auto;
height: auto;
max-height: 58vh;
overflow-y: auto;
overflow-x: hidden;
touch-action: pan-y;
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
scrollbar-gutter: stable;
z-index: 120;
background: rgba(3, 8, 19, 0.985);
border: 1px solid rgba(255, 255, 255, 0.14);
}}
.karpinski-job-list{
display: grid;
gap: 1rem;
}
.karpinski-job-card{
padding: 1.1rem;
border-radius: 0.7rem;
background: rgba(9, 14, 24, 0.66);
border: 1px solid rgba(255, 255, 255, 0.12);
}
.karpinski-job-card h3{
margin: 0 0 0.4rem;
}
.karpinski-job-card p{
margin: 0 0 0.7rem;
}
@media (max-width: 860px){.site-header .main-navigation.toggled .menu-toggle-label{
opacity: 1 !important;
max-width: 4.2rem !important;
margin: 0 !important;
}
.site-header .ux-header-inner{
position: relative;
padding-top: 0.8rem;
min-height: 122px;
}
.site-header .site-branding{
width: 100% !important;
justify-content: center;
margin-bottom: 35px;
}
.site-header .main-navigation{
position: absolute;
left: 0.75rem;
top: 0 !important;
width: auto !important;
order: 1;
margin: 0 !important;
margin-top: 68px !important;
}
.site-header .menu-toggle{
margin: 0 !important;
}
.site-header .header-quick-contact{
position: absolute;
right: 0.75rem;
top: 0 !important;
margin: 0 !important;
margin-top: 68px !important;
}
.site-header .header-actions{
margin-top: 22px !important;
}
.site-header .main-navigation.toggled > div > ul,
.site-header .main-navigation.toggled > ul{
display: block !important;
height: 52vh !important;
max-height: 52vh !important;
overflow-y: auto !important;
overflow-x: hidden !important;
-webkit-overflow-scrolling: touch !important;
overscroll-behavior: contain;
touch-action: pan-y;
}}
@font-face{font-family: "Lato";
src: url("./assets/fonts/lato/Lato-Light.ttf") format("truetype");
font-weight: 300;
font-style: normal;
font-display: swap;}
@font-face{font-family: "Lato";
src: url("./assets/fonts/lato/Lato-Regular.ttf") format("truetype");
font-weight: 400;
font-style: normal;
font-display: swap;}
@font-face{font-family: "Lato";
src: url("./assets/fonts/lato/Lato-Bold.ttf") format("truetype");
font-weight: 700;
font-style: normal;
font-display: swap;}
body,
button,
input,
select,
textarea,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
li,
label,
span,
small,
strong,
em,
blockquote,
figcaption,
summary,
.site-title,
.menu-toggle,
.header-shop-cta,
.main-navigation a{
font-family: "Lato", sans-serif !important;
}
.site-header .mobile-menu-extras{
display: none;
}
.site-header .mobile-menu-extras h3{
margin: 0 0 0.45rem;
font-size: 0.64rem;
letter-spacing: 0.2em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.6);
}
.site-header .mobile-menu-extras ul{
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 0.2rem;
}
.site-header .mobile-menu-extras a{
display: block;
padding: 0.52rem 0.58rem;
border-radius: 0.46rem;
color: #b6bcc9;
font-size: 0.77rem;
letter-spacing: 0.14em;
text-transform: uppercase;
}
.site-header .mobile-menu-extras a:hover,
.site-header .mobile-menu-extras a:focus-visible{
color: #ffffff;
background: rgba(255, 255, 255, 0.06);
}
.site-header .header-quick-contact .header-search-toggle{
width: 1.8rem;
height: 1.8rem;
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
border: 0;
padding: 0;
color: #d61f26 !important;
font-size: 1.1rem;
}
.site-header .header-quick-contact .header-search-toggle:hover,
.site-header .header-quick-contact .header-search-toggle:focus-visible{
color: #ff4d52 !important;
background: transparent;
}
@media (min-width: 861px){.site-header .header-quick-contact{
display: none !important;
}
.site-header .header-search-toggle-actions{
display: inline-flex !important;
}}
@media (max-width: 860px){.site-header .ux-header-inner{
position: relative;
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 0.5rem;
}
.site-header .site-branding{
order: 1;
width: 100% !important;
display: flex;
align-items: center;
justify-content: center;
padding: 0 5.2rem 0 5.2rem;
margin: 0 !important;
}
.site-header .main-navigation{
order: 2;
width: auto !important;
flex: 0 0 auto;
margin: 22px 0 0 0.75rem !important;
position: relative !important;
left: auto !important;
top: auto !important;
}
.site-header .header-quick-contact{
order: 1;
display: inline-flex !important;
position: absolute;
right: 0.75rem;
top: 22px;
margin: 0 !important;
z-index: 125;
}
.site-header .header-actions{
order: 3;
width: auto !important;
flex: 1 1 auto;
display: flex;
align-items: center;
justify-content: flex-end;
margin: 22px 0.75rem 0 auto !important;
}
.site-header .header-search-toggle-actions{
display: none !important;
}
.site-header .header-search-form{
top: calc(22px + 2.15rem) !important;
right: 0.75rem !important;
left: auto !important;
}
.site-header .main-navigation > div > ul,
.site-header .main-navigation > ul{
top: 0.52rem !important;
left: 0 !important;
right: auto !important;
width: min(92vw, 360px) !important;
}
.site-header .main-navigation.toggled > div > ul,
.site-header .main-navigation.toggled > ul{
display: block !important;
height: auto !important;
max-height: 42dvh !important;
overflow-y: auto !important;
padding-bottom: 0.55rem !important;
}
.site-header .main-navigation.toggled .mobile-menu-extras{
display: block;
width: min(92vw, 360px);
margin-top: 0.5rem;
padding: 0.7rem 0.75rem 0.78rem;
background: rgba(3, 8, 19, 0.985);
border: 1px solid rgba(255, 255, 255, 0.14);
border-radius: 0.8rem;
max-height: 28dvh;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}}
.career-offers-on-page{
margin: 0 0 1.6rem !important;
}
.karpinski-job-list{
display: grid;
gap: 1rem;
}
.karpinski-job-card{
background: #ffffff !important;
border: 1px solid #e4e7ee !important;
border-radius: 0.9rem !important;
overflow: hidden;
box-shadow: 0 14px 30px rgba(5, 10, 20, 0.18) !important;
padding: 0 !important;
}
.karpinski-job-card h3{
margin: 0 !important;
padding: 0.78rem 1rem 0.72rem !important;
background: #d61f26 !important;
line-height: 1.25;
min-height: 52px;
}
.karpinski-job-card h3 a{
color: #ffffff !important;
text-decoration: none;
font-size: 1.02rem;
font-weight: 700;
}
.karpinski-job-card > p{
margin: 0;
padding: 0.82rem 1rem;
color: #111827 !important;
}
.karpinski-job-card > p:last-child{
padding-top: 0;
padding-bottom: 1rem;
}
.karpinski-job-card .karpinski-job-apply-button{
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 136px;
height: 42px;
border: 0;
border-radius: 0.6rem;
background: #0a0c10 !important;
color: #ffffff !important;
font-weight: 700;
letter-spacing: 0.04em;
cursor: pointer;
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.35);
text-decoration: none;
}
.karpinski-job-card .karpinski-job-apply-button:hover,
.karpinski-job-card .karpinski-job-apply-button:focus-visible{
background: #1c2029 !important;
transform: translateY(-1px);
}
.job-application-modal .b2b-modal-dialog{
width: min(100%, 680px);
}
.job-application-modal .job-apply-form{
display: grid;
gap: 0.84rem;
}
.job-application-modal .job-apply-form p{
margin: 0;
}
.job-application-modal .job-apply-consent label{
display: flex;
align-items: flex-start;
gap: 0.55rem;
font-size: 0.9rem;
line-height: 1.45;
}
.job-application-modal .job-apply-form button[type="submit"]{
display: inline-flex;
align-items: center;
justify-content: center;
border: 0;
border-radius: 999px;
background: #d61f26;
color: #ffffff;
padding: 0.76rem 1.25rem;
font-weight: 700;
cursor: pointer;
}
.job-application-modal .job-apply-form button[type="submit"]:hover{
background: #b7191f;
}
.job-application-modal .job-apply-feedback{
margin: 0 0 0.8rem;
padding: 0.72rem 0.85rem;
border-radius: 0.6rem;
font-size: 0.92rem;
}
.job-application-modal .job-apply-feedback-success{
background: #e8f7ee;
color: #0e6a36;
border: 1px solid #9ed9b5;
}
.job-application-modal .job-apply-feedback-error{
background: #fdecec;
color: #b91c1c;
border: 1px solid #f7b4b4;
}
@media (max-width: 860px){.karpinski-job-card h3{
padding: 0.72rem 0.82rem 0.68rem !important;
min-height: 48px;
}
.karpinski-job-card > p{
padding: 0.7rem 0.82rem;
}
.karpinski-job-card .karpinski-job-apply-button{
width: 100%;
}}
.karpinski-job-card{
background: #ffffff !important;
}
.karpinski-job-card > p{
background: #ffffff !important;
color: #111827 !important;
}
.karpinski-job-card h3 a{
display: inline-flex;
align-items: center;
gap: 0.5rem;
}
.karpinski-job-card h3 a i{
font-size: 1rem;
line-height: 1;
}
.karpinski-job-card .karpinski-job-apply-button{
position: relative;
z-index: 2;
}
h2#newsletter-title {text-align: center !important;}
.uxp-container > p {text-align: center !important;}
/* Desktop dropdown readability: full dark panel */
@media (min-width: 861px) {
.site-header .main-navigation ul ul {
background: rgba(3, 8, 19, 0.98) !important;
border: 1px solid rgba(255, 255, 255, 0.14) !important;
border-radius: 0.6rem !important;
box-shadow: 0 18px 38px rgba(0, 0, 0, 0.45) !important;
padding: 0.5rem !important;
min-width: 260px;
z-index: 9999 !important;
}
.site-header .main-navigation ul ul li {
width: 100%;
}
.site-header .main-navigation ul ul a {
display: block !important;
padding: 0.6rem 0.7rem !important;
border-radius: 0.42rem;
background: transparent;
color: #d1d5db !important;
}
.site-header .main-navigation ul ul a:hover,
.site-header .main-navigation ul ul a:focus-visible {
background: rgba(255, 255, 255, 0.08) !important;
color: #ffffff !important;
}
}
/* Subpages: light fixed background with subtle pattern + large gray logo watermark. */
body:not(.home){
position: relative;
background: #f3f5f7 !important;
display: flex;
flex-direction: column;
min-height: 100vh;
}
html,
body{
min-height: 100%;
}
body:not(.home)::before{
content: none;
}
body:not(.home)::after{
content: "";
position: fixed;
inset: 0;
background-image: url("assets/logo/logo-karpinski-transparent-v2.png");
background-repeat: no-repeat;
background-position: center 58%;
background-size: min(78vw, 980px) auto;
filter: grayscale(1);
opacity: 0.18;
pointer-events: none;
z-index: 0;
}
body:not(.home) #page{
position: relative;
z-index: 1;
background: transparent;
display: flex;
flex-direction: column;
min-height: 100dvh;
}
body:not(.home) .site-main{
flex: 1 0 auto;
}
body:not(.home) .site-main.static-page.page-subpage-main{
padding-left: 1rem;
padding-right: 1rem;
padding-bottom: 0.25rem;
flex: 1 0 auto;
}
body:not(.home) .site-main.static-page.page-subpage-main .page-parallax-content{
max-width: 980px;
margin: 0 auto;
}
body:not(.home) .site-main.static-page.page-subpage-main article,
body:not(.home) .site-main.static-page.page-subpage-main .static-page-section{
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
padding: 0 !important;
}
body:not(.home) .site-main.static-page.page-subpage-main .entry-header,
body:not(.home) .site-main.static-page.page-subpage-main .static-page-section > h1:first-child,
body:not(.home) .site-main.static-page.page-subpage-main .static-page-section > h2:first-child{
background: transparent !important;
padding: 0 !important;
margin: 0 0 1rem !important;
border-radius: 0 !important;
}
body:not(.home) .site-main.static-page.page-subpage-main .entry-title,
body:not(.home) .site-main.static-page.page-subpage-main .entry-content,
body:not(.home) .site-main.static-page.page-subpage-main .entry-content p,
body:not(.home) .site-main.static-page.page-subpage-main .entry-content li,
body:not(.home) .site-main.static-page.page-subpage-main .entry-content span,
body:not(.home) .site-main.static-page.page-subpage-main .entry-content strong,
body:not(.home) .site-main.static-page.page-subpage-main .entry-content em{
color: #243241 !important;
font-size: 1.0625rem !important;
line-height: 1.62;
}
body:not(.home) .site-main.static-page.page-subpage-main .entry-content{
max-width: 900px;
margin: 0 auto !important;
padding: 0 !important;
}
body.page:not(.home) .site-main.static-page.page-subpage-main .entry-content h2{
color: #243241 !important;
font-size: clamp(1.55rem, 2.6vw, 2rem);
line-height: 1.25;
font-weight: 700;
}
body.page:not(.home) .site-main.static-page.page-subpage-main .entry-content h3{
color: #273748 !important;
}
body:not(.home) .site-main.static-page.page-subpage-main .entry-content > *:last-child{
margin-bottom: 0 !important;
}
body:not(.home) .eu-program-wrap{
margin-top: 0 !important;
}
body:not(.home) #eu-program-section{
margin-top: 0;
margin-bottom: 0;
flex-shrink: 0;
}
body:not(.home) .site-main.static-page.page-subpage-main .entry-content > *:first-child{
margin-top: 0 !important;
}
@media (max-width: 860px){
body:not(.home)::after{
background-size: min(108vw, 720px) auto;
background-position: center 50%;
opacity: 0.12;
}
body:not(.home) .site-main.static-page.page-subpage-main .entry-content{
max-width: 100%;
}
}
/* Subpage hero: higher and fully responsive + subtle full-width bottom wave mask. */
body.page:not(.home) .page-hero{
min-height: 0 !important;
height: clamp(188px, 28vw, 360px) !important;
max-height: 360px !important;
}
body.page:not(.home) .page-hero-media img{
width: 100%;
height: 100%;
object-fit: cover;
transform: scale(1.02);
object-position: center 42%;
}
body.page:not(.home) .page-hero::after{
content: "";
position: absolute;
left: 0;
right: 0;
bottom: -1px;
height: clamp(16px, 3vw, 34px);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath fill='%23f3f5f7' d='M0 68C150 44 250 88 390 86C560 84 650 46 800 42C960 38 1060 78 1200 62V120H0Z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-size: 100% 100%;
z-index: 3;
pointer-events: none;
}
body.page:not(.home) .site-main.static-page.page-subpage-main .post-thumbnail{
display: none !important;
}
body.page:not(.home) .site-main.static-page.page-subpage-main{
margin-top: 0 !important;
padding-top: 1rem !important;
}
.site-footer .footer-grid-ux{
padding-top: 1.55rem;
padding-bottom: 1.2rem;
gap: 1.35rem;
}
.site-footer .footer-menu-list li{
line-height: 1.28;
}
.site-footer .footer-menu-list li + li{
margin-top: 0.2rem;
}
.site-footer .footer-grid-ux > section:nth-child(2) .footer-menu-list li:nth-child(n+7){
display: none;
}
.site-footer .footer-grid-ux > section:nth-child(3) .footer-menu-list li:nth-child(n+9){
display: none;
}
.site-footer .site-info-row{
padding-top: 0.65rem;
padding-bottom: 0.7rem;
}
body:not(.home) .site-footer{
margin-bottom: 0 !important;
flex-shrink: 0;
}
.site-footer .footer-grid-ux p,
.site-footer .footer-grid-ux li,
.site-footer .footer-grid-ux a{
font-size: 0.84rem;
}
@media (max-width: 860px){
body.page:not(.home) .page-hero{
height: clamp(170px, 38vw, 250px) !important;
max-height: 250px !important;
}
body.page:not(.home) .site-main.static-page.page-subpage-main{
padding-top: 0.8rem !important;
}
body:not(.home) #eu-program-section{
margin-top: 0;
margin-bottom: 0;
}
.site-footer .footer-grid-ux > section:nth-child(2) .footer-menu-list li:nth-child(n+6),
.site-footer .footer-grid-ux > section:nth-child(3) .footer-menu-list li:nth-child(n+7){
display: none;
}
.eu-program-details summary{
margin-top: 15px;
}
}