@media (prefers-reduced-motion: no-preference) {
@view-transition {
navigation: auto;
}
html {
interpolate-size: allow-keywords;
&:focus-within {
scroll-behavior: smooth;
}
}
}
input,
textarea,
button,
select,
a,
h3,
li {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
} *:focus,
*:active {
outline: 0;
}
*:focus-visible {
outline: 1px solid var(--global-palette1);
} img {
user-select: none;
} .visually-hidden {
clip: rect(0 0 0 0);
clip-path: inset(50%);
height: 1px;
overflow: hidden;
position: absolute;
white-space: nowrap;
width: 1px;
}
.background-s {
position: relative;
&::before {
content: url(//sertzoptika.hu/wp-content/uploads/2026/02/S-bg.svg);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: -1;
}
}  #main-header .site-branding a.brand {
margin-bottom: -3.625rem;
padding: 1.625rem 2.656rem;
background: #000;
}
.site-main-header-inner-wrap.site-header-row {
grid-template-columns: repeat(2, auto);
gap: 1.5rem;
@media (width > 40rem){
grid-template-columns: 17.75rem auto;
}
}
#primary-menu li {
flex: 1 1 auto;
display: flex;
align-items: center;
justify-items: flex-start;
&:first-of-type a {
padding-left: 0;
}
&:last-of-type a {
padding-right: 0;
}
}
#primary-menu li.menu-item > a {
display: inline;
font-size: clamp(0.675rem, calc(0.675rem + ((1vw - 0.64rem) * 1.6406)), 0.9375rem);
width: fit-content;
}
#primary-menu li:not(:last-of-type)::after {
--_dot-size: clamp(0.5rem, calc(0.5rem + ((1vw - 0.64rem) * 1.5625)), 0.75rem);
background: var(--global-palette1);
border-radius: 1rem;
content: '';
display: inline-block;
width: var(--_dot-size);
height: var(--_dot-size);
margin-inline: auto;
}
#main-header .header-button-wrap {
position: relative;
}
#main-header a.header-button {
display: grid;
grid-template-columns: repeat(2, auto);
place-items: center;
gap: 1rem;
padding: 0.625rem 1.1rem 0.625rem 0.625rem;
position: absolute;
right: 0;
bottom: -7.5rem;
&::before {
background: url(//sertzoptika.hu/wp-content/themes/sertz/data: image/svg+xml,<svg width=10 height=17 viewBox=0 0 10 17 fill=none xmlns=http://www.w3.org/2000/svg><path d=M1.5 15.5L8.5 8.5L1.5 1.5 stroke=%23F2F2F2 stroke-width=3 stroke-linecap=round stroke-linejoin=round/></svg>)
center / auto no-repeat var(--global-palette2);
border-radius: 9rem;
content: '';
display: grid;
place-items: center;
width: 1.875rem;
height: 1.875rem;
}
&:hover::before {
background-color: var(--global-palette1);
}
} #mobile-drawer .drawer-content {
padding-inline: 0;
}
#mobile-drawer .drawer-overlay {
background: transparent;
}
.mobile-header-button-wrap{
margin-inline: auto .5rem;
}
#mobile-site-navigation ul li > a {
display: block;
margin-inline: auto 0;
padding-inline: 1.5rem;
width: fit-content;
}
#mobile-site-navigation ul li.current-menu-item:not(.no-active) > a {
background: var(--global-palette1);
}
#mobile-site-navigation ul li.current-menu-item.no-active > a {
color: var(--global-palette8);
}
#mobile-menu li:not(.current-menu-item):not(:last-of-type)::after { background: var(--global-palette1);
content: '';
display: block;
width: 3rem;
height: 0.085rem;
margin: 0 0 -0.085rem auto;
} .szo-aakcio-carousel {
position: relative;
}
.szo-aakcio-carousel__viewport {
overflow: hidden;
width: 100%;
}
.szo-aakcio-carousel__track {
display: flex;
gap: 2.5rem;
scroll-behavior: smooth;
overflow: auto;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.szo-aakcio-carousel__track::-webkit-scrollbar {
display: none;
}
.szo-aakcio-carousel__slide {
flex: 0 0 auto;
scroll-snap-align: start;
width: calc(100dvw - var(--global-content-edge-padding) - var(--global-content-edge-padding));
@media (width >= 48rem) {
width: calc(50dvw - var(--global-content-edge-padding) - 1.25rem);
}
@media (width > 64rem) {
width: min(26.8125rem, (33.33dvw - 3.66667rem));
}
}
.szo-aakcio-carousel__img {
display: block;
width: 100%;
height: auto;
}
.szo-aakcio-carousel__btn {
--_btn-size: clamp(2.5rem, calc(2.5rem + ((1vw - 0.48rem) * 9.375)), 4rem);
border: 0;
background: var(--global-palette2);
display: grid;
place-items: center;
width: var(--_btn-size);
height: var(--_btn-size);
border-radius: 4rem;
cursor: pointer;
padding: 0;
position: absolute;
top: 50%;
transform: translateY(-50%);
&:hover {
background: var(--global-palette1);
}
}
.szo-aakcio-carousel:not(:has(.szo-aakcio-carousel__slide:nth-child(2))) .szo-aakcio-carousel__btn {
display: none;
}
@media (width >= 48rem) {
.szo-aakcio-carousel:not(:has(.szo-aakcio-carousel__slide:nth-child(3))) .szo-aakcio-carousel__btn {
display: none;
}
}
@media (width > 64rem) {
.szo-aakcio-carousel:not(:has(.szo-aakcio-carousel__slide:nth-child(4))) .szo-aakcio-carousel__btn {
display: none;
}
}
.szo-aakcio-carousel__btn:focus {
outline: 2px solid currentColor;
outline-offset: 2px;
}
.szo-aakcio-carousel__btn--prev {
left: calc(-1 * (var(--_btn-size) / 2));
@media (width > 95rem) {
left: calc(-1 * clamp(4rem, calc(4rem + ((1vw - 0.95rem) * 50)), 6rem));
}
}
.szo-aakcio-carousel__btn--next {
right: calc(-1 * (var(--_btn-size) / 2));
@media (width > 95rem) {
right: calc(-1 * clamp(4rem, calc(4rem + ((1vw - 0.95rem) * 50)), 6rem));
}
} .logo-grid {
gap: 3.25rem;
}
body .single-content .brand-image-grid {
grid-template-columns: 1fr;
gap: 1.5rem 2.5rem;
margin: 3rem -1.5rem;
max-width: 85.375rem;
@media (width >= 48rem) {
grid-template-columns: repeat(3, 1fr);
margin: 4.5rem auto 5rem;
}
}
body .single-content .store-grid {
align-items: flex-start;
gap: 1.5rem 2.5rem;
@media (width >= 48rem) {
margin: 4.5rem auto 5rem;
}
}
.store-grid .wp-block-kadence-infobox {
flex: 0 0 100%;
@media (width >= 48rem) {
flex-basis: calc(50% - 1.25rem);
}
@media (width > 64rem) {
flex-basis: calc(33.33% - 1.666rem);
}
} .aakcio-list-item {
aspect-ratio: 1;
margin-block: 2rem;
overflow: clip;
img {
width: 100%;
height: auto;
object-fit: cover;
}
} .site-footer a.social-button {
width: 2.5rem;
height: 2.5rem;
}
.site-footer-row.site-footer-row-columns-1 .site-footer-section {
gap: 0.2rem 1rem;
}
.footer-widget-area.site-info p {
text-wrap: balance;
}
#footer-navigation {
justify-content: center;
}
#footer-menu li a {
position: relative;
}
#footer-menu li:not(:last-child) a::after {
background: var(--global-palette2);
content: '';
width: 1px;
height: 0.8em;
position: absolute;
top: 0.6em;
right: 0;
}
@media (width > 64rem) {
.site-footer-row.site-footer-row-columns-1 .site-footer-section {
display: grid;
grid-template-columns: repeat(3, auto);
max-width: 64rem;
.footer-navigation-wrap {
grid-area: 1 / 2 / 2 / 3;
align-items: center;
}
#footer-menu li: last-child a::after {
background: var(--global-palette2);
content: '';
width: 1px;
height: 0.8em;
position: absolute;
top: 0.6em;
right: 0;
}
.footer-social {
grid-area: 1 / 3 / 2 / 4;
}
.site-info {
grid-area: 1 / 1 / 2 / 2;
}
.footer-social-wrap .footer-social-inner-wrap {
gap: 0.6rem;
}
}
}