This commit is contained in:
2025-09-04 13:40:30 +02:00
parent b17f2f4766
commit 4e91810bb6
5 changed files with 1060 additions and 107 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

View File

@@ -24,6 +24,9 @@ $header-height: 77px;
@include respond-below(lg) {
font-size: 48px;
}
@include respond-below(sm) {
font-size: 40px;
}
}
@mixin box_title_line($color, $bgColor) {
@@ -98,6 +101,11 @@ $header-height: 77px;
font-family: $fHelveticaNeue;
}
body {
&.no-scroll {
overflow: hidden;
}
}
p {
&:last-child {
margin-bottom: 0;
@@ -316,6 +324,9 @@ header#masthead {
padding-top: 90px;
padding-bottom: 90px;
height: 100svh;
max-height: calc(100svh - $header-height);
}
&.active {
}
@@ -343,19 +354,24 @@ header#masthead {
align-items: center;
gap: 7px;
&::before {
content: '';
position: relative;
display: inline-block;
width: 5px;
height: 5px;
border-radius: 100%;
background: $cGold;
margin-bottom: 2px;
@include respond-above(lg) {
&::before {
content: '';
position: relative;
display: inline-block;
width: 5px;
height: 5px;
border-radius: 100%;
background: $cGold;
margin-bottom: 2px;
}
}
a {
color: $cGold;
@include respond-below(lg) {
width: 100%;
}
}
}
@@ -381,6 +397,29 @@ header#masthead {
display: none;
}
}
@include respond-below(lg) {
&#menu-item-344 {
text-align: center;
a {
color: $cBlack;
font-size: 16px;
font-weight: 500;
line-height: 1;
display: inline-block;
padding: 11px 24px 12px;
border-radius: 100px;
background: $cWhite;
text-wrap-mode: nowrap;
transition: all 250ms ease-in-out;
&:hover {
color: $cWhite !important;
background: $cGold;
}
}
}
}
}
}
@@ -463,8 +502,9 @@ header#masthead {
}
.text {
display: inline-block;
height: 11px;
height: 12px;
padding-left: 8px;
margin-top: -1px;
width: 45px;
opacity: 1;
overflow: hidden;
@@ -483,7 +523,7 @@ header#masthead {
position: absolute;
top: 0;
left: 0;
height: 1.5px;
height: 2px;
width: 11px;
background: $cWhite;
transition: all 250ms ease-in-out;
@@ -492,9 +532,9 @@ header#masthead {
&::after {
content: '';
position: absolute;
top: calc(100% - 1.5px);
top: calc(100% - 2px);
left: 0;
height: 1.5px;
height: 2px;
width: 11px;
background: $cWhite;
transition: all 250ms ease-in-out;
@@ -686,6 +726,10 @@ article.article-card {
width: 100%;
height: 286px;
object-fit: cover;
@include respond-below(md) {
height: 200px;
}
}
}
}
@@ -700,6 +744,13 @@ article.article-card {
line-height: 1.2;
letter-spacing: -0.45px;
@include respond-below(md) {
font-size: 20px;
}
@include respond-below(sm) {
font-size: 18px;
}
a {
color: inherit;
font-size: inherit;
@@ -1291,15 +1342,24 @@ body.page-id-38 {
column-gap: 120px;
margin-bottom: 80px;
@include respond-below(lg) {
column-gap: 60px;
}
@include respond-below(md) {
flex-direction: column;
row-gap: 40px;
}
.col {
&-1 {
.box-head {
@include respond-below(xl) {
position: sticky;
top: 30px;
}
h2 {
color: $cBlack;
font-weight: 500;
font-size: 64px;
line-height: 1.2;
letter-spacing: -0.96px;
@include h2($cBlack);
}
}
}
@@ -1316,6 +1376,13 @@ body.page-id-38 {
font-size: 28px;
line-height: 1.5;
letter-spacing: -0.53px;
@include respond-below(xl) {
font-size: 24px;
}
@include respond-below(md) {
font-size: 22px;
}
}
}
}
@@ -1347,31 +1414,67 @@ body.page-id-38 {
}
}
&-2 {
@include respond-below(md) {
margin-bottom: 80px;
}
.tiles {
display: flex;
flex-direction: row;
justify-content: space-between;
@include respond-below(md) {
flex-direction: column;
}
.tile {
flex-basis: calc(100% / 3);
padding-left: 40px;
border-right: 1px solid;
border-image-source: linear-gradient(
180deg,
$cGold 0%,
transparent 100%
);
border-image-slice: 1;
padding-bottom: 230px;
&:first-child {
border-left: 1px solid;
@include respond-below(lg) {
padding-left: 20px;
padding-bottom: 150px;
}
@include respond-above(md) {
border-right: 1px solid;
border-image-source: linear-gradient(
180deg,
$cGold 0%,
transparent 100%
);
border-image-slice: 1;
&:first-child {
border-left: 1px solid;
}
}
@include respond-below(md) {
padding-left: 0px;
padding-bottom: 0px;
&:not(:last-child) {
padding-bottom: 30px;
margin-bottom: 30px;
border-bottom: 1px solid;
border-image-source: linear-gradient(
90deg,
$cGold 0%,
transparent 100%
);
border-image-slice: 1;
}
}
.tile-data {
position: relative;
padding-left: 48px;
@include respond-below(lg) {
padding-left: 30px;
padding-right: 30px;
}
&::before {
content: '';
position: absolute;
@@ -1384,6 +1487,12 @@ body.page-id-38 {
background-position: center;
background-repeat: no-repeat;
background-size: contain;
@include respond-below(lg) {
width: 22px;
min-width: 22px;
height: 22px;
}
}
h3 {
@@ -1393,6 +1502,10 @@ body.page-id-38 {
line-height: 1;
letter-spacing: -0.68px;
margin-bottom: 24px;
@include respond-below(lg) {
font-size: 26px;
}
}
p {
color: $cBlack;
@@ -1400,6 +1513,15 @@ body.page-id-38 {
font-size: 20px;
line-height: 1.5;
letter-spacing: -0.38px;
@include respond-below(lg) {
font-size: 16px;
}
@include respond-below(md) {
br {
display: none;
}
}
}
}
}
@@ -1417,16 +1539,35 @@ body.page-id-38 {
display: flex;
flex-direction: row;
column-gap: 50px;
padding: 150px 0 130px;
@include respond-above(lg) {
padding: 150px 0 130px;
}
@include respond-below(lg) {
padding: 0 0 100px;
row-gap: 100px;
flex-direction: column-reverse;
}
.col {
&-1 {
@include box_title_line($cWhite, $cBlack);
padding-left: 90px;
padding-bottom: 30px;
width: 100%;
max-width: 660px;
@include respond-above(lg) {
padding-left: 90px;
}
@include respond-below(xxl) {
max-width: 590px;
}
@include respond-below(lg) {
padding-top: 64px;
max-width: unset;
}
.box-title {
margin-bottom: 32px;
@@ -1436,6 +1577,13 @@ body.page-id-38 {
font-size: 36px;
line-height: 1.5;
letter-spacing: -0.68px;
@include respond-below(xxl) {
font-size: 32px;
}
@include respond-below(sm) {
font-size: 24px;
}
}
}
@@ -1463,21 +1611,46 @@ body.page-id-38 {
}
&-2 {
position: absolute;
right: 0;
top: 0;
bottom: 0;
&::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(
90deg,
$cBlack 0%,
rgba(0, 0, 0, 0) 100%
);
z-index: 1;
@include respond-above(lg) {
inset: 0;
}
@include respond-below(lg) {
width: 100svw;
left: 50%;
top: 0;
bottom: 0;
background: linear-gradient(
0deg,
$cBlack 0%,
rgba(0, 0, 0, 0) 100%
);
transform: translateX(-50%);
}
}
@include respond-above(lg) {
position: absolute;
right: 0;
top: 0;
bottom: 0;
}
@include respond-below(lg) {
position: relative;
height: 300px;
}
@include respond-below(sm) {
height: 200px;
}
video {
@@ -1485,6 +1658,21 @@ body.page-id-38 {
width: 640px;
object-fit: cover;
filter: grayscale(1);
@include respond-below(xxl) {
max-width: 520px;
}
@include respond-below(xl) {
max-width: 360px;
}
@include respond-below(lg) {
width: 100svw;
max-width: unset;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
}
}
}
@@ -1496,24 +1684,60 @@ body.page-id-38 {
padding-bottom: 220px;
background: #fafafa;
@include respond-below(xl) {
padding-top: 140px;
padding-bottom: 170px;
}
@include respond-below(lg) {
padding-top: 100px;
padding-bottom: 130px;
}
.row {
display: flex;
flex-direction: row;
column-gap: 100px;
align-items: center;
@include respond-below(lg) {
flex-direction: column;
row-gap: 64px;
}
.col {
&-1 {
@include box_title_line(#d4d4d4, #fafafa);
padding-left: 115px;
@include respond-above(lg) {
padding-left: 115px;
}
@include respond-below(lg) {
width: 100%;
padding-bottom: 84px;
&::before {
bottom: 0;
top: auto;
}
&::after {
top: auto;
bottom: 6px;
}
}
img {
width: 100%;
max-width: fit-content;
@include respond-below(lg) {
margin: 0 auto;
}
}
}
&-2 {
max-width: 403px;
@include respond-above(lg) {
max-width: 403px;
}
.box-title {
margin-bottom: 32px;
@@ -1524,6 +1748,10 @@ body.page-id-38 {
font-size: 28px;
line-height: 1.5;
letter-spacing: -0.56px;
@include respond-below(sm) {
font-size: 24px;
}
}
}
@@ -1566,11 +1794,7 @@ body.page-id-47 {
max-width: 600px;
h2 {
color: $cBlack;
font-weight: 500;
font-size: 64px;
line-height: 1.2;
letter-spacing: -0.96px;
@include h2($cBlack);
}
}
}
@@ -1588,6 +1812,10 @@ body.page-id-47 {
column-gap: 32px;
row-gap: 40px;
@include respond-below(md) {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.tile {
.tile--btn {
width: 45px;
@@ -1610,6 +1838,12 @@ body.page-id-47 {
width: 100%;
max-width: fit-content;
}
@include respond-below(sm) {
width: 35px;
min-width: 35px;
height: 35px;
}
}
.tile--wrapper {
@@ -1617,6 +1851,10 @@ body.page-id-47 {
position: relative;
margin-bottom: 24px;
@include respond-below(sm) {
margin-bottom: 12px;
}
> img {
width: 100%;
}
@@ -1634,6 +1872,14 @@ body.page-id-47 {
line-height: 1.2;
letter-spacing: -0.56px;
margin-bottom: 16px;
@include respond-below(lg) {
font-size: 22px;
}
@include respond-below(sm) {
font-size: 18px;
padding-bottom: 12px;
}
}
p {
color: $cBlack;
@@ -1641,6 +1887,10 @@ body.page-id-47 {
font-size: 16px;
line-height: 1.2;
letter-spacing: -0.32px;
@include respond-below(sm) {
font-size: 14px;
}
}
}
}
@@ -1667,6 +1917,11 @@ body.page-id-47 {
background: $cBlack;
overflow: auto;
@include respond-below(sm) {
width: 100%;
max-width: 346px;
}
.tile--btn {
top: 24px;
right: 16px;
@@ -2221,6 +2476,14 @@ body.blog {
position: relative;
height: 568px;
padding: 64px;
@include respond-below(lg) {
height: 460px;
}
@include respond-below(sm) {
padding: 30px;
height: 400px;
}
}
.box-bg {
position: absolute;
@@ -2266,6 +2529,16 @@ body.blog {
font-size: 48px;
line-height: 1.2;
letter-spacing: -0.96px;
@include respond-below(lg) {
font-size: 40px;
}
@include respond-below(md) {
font-size: 30px;
}
@include respond-below(sm) {
font-size: 24px;
}
}
}
}
@@ -2276,11 +2549,25 @@ body.blog {
.box-2 {
padding-bottom: 150px;
@include respond-below(lg) {
padding-bottom: 100px;
}
.posts-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 64px;
margin-bottom: 100px;
@include respond-below(lg) {
grid-template-columns: repeat(2, 1fr);
margin-bottom: 30px;
gap: 40px;
}
@include respond-below(sm) {
gap: 50px 24px;
}
}
.posts-more {
text-align: center;
@@ -2361,16 +2648,22 @@ body.page-id-59 {
flex: 1;
.box-head {
max-width: 700px;
margin-top: 24px;
margin-bottom: 24px;
@include respond-above(lg) {
max-width: 700px;
}
h2 {
color: $cBlack;
font-weight: 500;
font-size: 64px;
line-height: 1.2;
letter-spacing: -0.96px;
@include h2($cBlack);
@include respond-below(xl) {
font-size: 48px;
}
@include respond-below(sm) {
font-size: 40px;
}
}
}
.box-text {
@@ -2393,6 +2686,10 @@ body.page-id-59 {
column-gap: 80px;
row-gap: 40px;
@include respond-below(sm) {
flex-direction: column;
}
.contact-card {
.card-title {
margin-bottom: 16px;
@@ -2446,6 +2743,13 @@ body.page-id-59 {
}
&-2 {
flex-basis: 500px;
@include respond-below(xl) {
flex-basis: 400px;
}
@include respond-below(lg) {
display: none;
}
}
}
}
@@ -2465,17 +2769,29 @@ body.single-post {
.box-1 {
margin-bottom: 120px;
@include respond-below(lg) {
margin-bottom: 100px;
}
.row {
display: flex;
flex-direction: row;
@include respond-below(lg) {
flex-direction: column-reverse;
row-gap: 50px;
}
.col {
&-1 {
// flex: 1;
padding-right: 70px;
border-right: 1px solid #d4d4d4;
width: 100%;
max-width: 800px;
@include respond-above(lg) {
padding-right: 70px;
border-right: 1px solid #d4d4d4;
max-width: 800px;
}
.btn-back-page {
&:hover {
@@ -2489,14 +2805,29 @@ body.single-post {
}
}
&-2 {
flex-basis: 480px;
@include respond-above(lg) {
flex-basis: 480px;
}
@include respond-below(lg) {
height: 300px;
}
.post-thumbnail {
position: sticky;
top: 0px;
@include respond-above(lg) {
position: sticky;
top: 0px;
}
@include respond-below(lg) {
height: 100%;
}
}
img {
width: 100%;
@include respond-below(lg) {
height: 100%;
object-fit: cover;
}
}
}
}
@@ -2508,9 +2839,19 @@ body.single-post {
padding-bottom: 160px;
background: #fafafa;
@include respond-below(lg) {
padding-top: 100px;
padding-bottom: 100px;
}
.row {
@include box_title_line(#d4d4d4, #fafafa);
padding-left: 64px;
@include respond-above(lg) {
padding-left: 64px;
}
@include respond-below(lg) {
padding-top: 64px;
}
.box-head {
h2 {
@@ -2520,6 +2861,10 @@ body.single-post {
font-size: 48px;
line-height: 1;
letter-spacing: -0.96px;
@include respond-below(lg) {
font-size: 32px;
}
}
}
@@ -2527,6 +2872,39 @@ body.single-post {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 32px;
@include respond-below(lg) {
article.article-card {
.article-card--wrapper {
.article-card--image {
a {
img {
height: 180px;
}
}
}
.article-card--content {
.article-card--title {
h3 {
font-size: 18px;
}
}
}
}
}
}
@include respond-between(sm, md) {
grid-template-columns: repeat(2, 1fr);
article.article-card {
&:last-child {
display: none;
}
}
}
@include respond-below(sm) {
grid-template-columns: 1fr;
}
}
}
}
@@ -2542,6 +2920,13 @@ body.single-post {
line-height: 1.2;
letter-spacing: -0.96px;
margin: 0;
@include respond-below(xl) {
font-size: 42px;
}
@include respond-below(md) {
font-size: 32px;
}
}
}
@@ -2569,6 +2954,10 @@ body.single-post {
height: 1px;
background: $cGold;
}
@include respond-below(md) {
font-size: 20px;
}
}
h2 {
@@ -2578,6 +2967,10 @@ body.single-post {
font-size: 24px;
line-height: 1.5;
letter-spacing: -0.48px;
@include respond-below(md) {
font-size: 20px;
}
}
p {
@@ -2590,6 +2983,10 @@ body.single-post {
strong {
color: $cGold;
}
@include respond-below(md) {
font-size: 16px;
}
}
a {
@@ -2625,6 +3022,10 @@ body.single-post {
background: $cGold;
transform: translateY(-50%);
}
@include respond-below(md) {
font-size: 16px;
}
}
}
@@ -2684,6 +3085,10 @@ body.single-post {
background-repeat: no-repeat;
}
@include respond-below(md) {
padding: 24px 70px 24px 24px;
}
p {
color: $cBlack;
font-weight: 500;
@@ -2691,6 +3096,10 @@ body.single-post {
line-height: 1.5;
letter-spacing: -0.38px;
margin-bottom: 0;
@include respond-below(md) {
font-size: 16px;
}
}
cite {
position: relative;
@@ -2713,6 +3122,9 @@ body.single-post {
background: $cGold;
transform: translateY(-50%);
}
@include respond-below(md) {
font-size: 16px;
}
}
}
}

View File

@@ -130,5 +130,7 @@ jQuery(function ($) {
$('#site-navigation').stop().delay(250).slideToggle()
$('#site-navigation').toggleClass('active')
$('body').toggleClass('no-scroll')
})
})

View File

@@ -71,7 +71,10 @@
</a>
</div>
<div class="col col-2">
<video src="/wp-content/uploads/2025/08/bg-video-v.mp4" muted autoplay loop></video>
<video autoplay muted loop playsinline>
<source src="/wp-content/uploads/2025/08/bg-video-v.mp4" media="(min-width: 992px)" type="video/mp4">
<source src="/wp-content/uploads/2025/09/bg-video-h.mp4" media="(max-width: 991px)" type="video/mp4">
</video>
</div>
</div>
</div>