.container,
.cookie-notice-container {
width: 100%;
padding-right: 1.5rem;
padding-left: 1.5rem;
margin-right: auto;
margin-left: auto;
}
@media (min-width: 576px) {
.container,
.cookie-notice-container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container,
.cookie-notice-container {
max-width: 720px;
}
}
@media (min-width: 992px) {
.container,
.cookie-notice-container {
max-width: 940px;
}
}
@media (min-width: 1130px) {
.container,
.cookie-notice-container {
max-width: 1070px;
}
}
@media (min-width: 1260px) {
.container,
.cookie-notice-container {
max-width: 1200px;
}
}
@media (min-width: 1700px) {
.container,
.cookie-notice-container {
max-width: 1405px;
}
}
.container-fluid {
width: 100%;
padding-right: 1.5rem;
padding-left: 1.5rem;
margin-right: auto;
margin-left: auto;
}
@media (min-width: 350px) {
[class*=col-],
.container,
.cookie-notice-container {
padding-left: 1.5rem;
padding-right: 3.5rem;
}
}
@font-face {
font-family: "Gilroy";
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Regular.woff2);
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Regular.woff2) format("woff2"), url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Regular.ttf) format("truetype");
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: "Gilroy";
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Medium.woff2);
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Medium.woff2) format("woff2"), url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Medium.ttf) format("truetype");
font-weight: 500;
font-display: swap;
}
@font-face {
font-family: "Gilroy";
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Semibold.woff2);
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Semibold.woff2) format("woff2"), url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Semibold.ttf) format("truetype");
font-weight: 600;
font-display: swap;
}
@font-face {
font-family: "Gilroy";
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Bold.woff2);
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Bold.woff2) format("woff2"), url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Gilroy-Bold.ttf) format("truetype");
font-weight: 700;
font-display: swap;
}
@font-face {
font-family: "Benzin";
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Benzin-Medium.woff2);
src: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Benzin-Medium.woff2) format("woff2"), url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/dist/fonts/Benzin-Medium.ttf) format("truetype");
font-weight: 500;
font-display: swap;
}
html,
body,
textarea {
font-family: "Gilroy", sans-serif;
font-weight: 400;
}
:root {
--primary: #ffaa00;
--white: #ffffff;
--bg: #1b1c1e;
--black: #1b1c1e;
--color-1: #7b7b7b;
--color-2: #676767;
--color-3: #a3a3a3;
--color-4: #be8809;
--color-5: #a1a1a1;
--color-6: #9d9d9d;
--color-7: #262627;
--color-8: #a2a2a2;
--color-9: #707070;
--color-10: #282829;
--white-to-dark: #ffffff;
--white-to-black: #fff;
--dark-to-white: #1b1c1e;
--primary-to-text: #ffffff;
}
.light-mode {
--white-to-dark: #1b1c1e;
--white-to-black: #000;
--dark-to-white: #ffffff;
--color-7: #f6f6f6;
--color-10: #a3a3a3;
--primary-to-text: #1b1c1e;
}
body .mb-0 {
margin-bottom: 0;
}
body .d-flex {
display: flex;
}
body .d-none {
display: none;
}
@media (min-width: 992px) {
body .d-lg-block {
display: block;
}
}
@media (min-width: 576px) {
body .d-sm-block {
display: block;
}
}
@media (min-width: 992px) {
body .d-lg-flex {
display: flex;
}
}
@media (min-width: 992px) {
body .d-lg-none {
display: none;
}
}
@media (min-width: 576px) {
body .d-sm-none {
display: none;
}
}
body .mx-0 {
margin-left: 0;
margin-right: 0;
}
*,
:after,
:before {
box-sizing: border-box;
}
* {
margin-block-start: 0;
margin-block-end: 0;
margin-inline-start: 0;
margin-inline-end: 0;
padding-block-start: 0;
padding-block-end: 0;
padding-inline-start: 0;
padding-inline-end: 0;
}
html {
font-size: 62.5%;
line-height: 1.15;
-webkit-text-size-adjust: 100%;
transition-property: font-size;
scroll-behavior: smooth;
scroll-padding-top: var(--header-height);
}
body {
font-size: 1.6rem;
background-color: var(--dark-to-white);
overflow-x: hidden;
}
body.lock {
overflow: hidden;
}
@media (min-width: 992px) {
body {
padding-left: max(10rem, 7%);
position: relative;
}
}
@media (min-width: 1700px) {
body {
padding-left: max(10rem, 14.5%);
position: relative;
}
body:before {
content: "";
position: absolute;
left: calc(14.5% - 0.1rem);
top: 0;
width: 0.1rem;
height: 100%;
background-color: var(--color-1);
opacity: 0.9;
}
}
html,
body {
color: var(--primary);
font-weight: 400;
}
::-webkit-scrollbar {
width: 1.2rem;
background-color: #fff;
}
::-webkit-scrollbar-thumb {
background-color: var(--primary);
}
button,
input,
select {
outline: none;
border: none;
background-color: transparent;
padding: 0;
}
button:focus,
input:focus,
select:focus {
outline: none;
}
ul {
padding-left: 0;
list-style: none;
}
img,
svg,
video,
iframe {
max-width: 100%;
height: auto;
}
a {
text-decoration: none;
transition: all 0.3s ease-in-out;
will-change: color;
color: var(--primary);
}
a:hover {
text-decoration: none;
}
a:not([href]):not([tabindex]):hover,
a:not([href]):not([tabindex]):focus {
color: var(--primary);
}
.screen-reader-text,
.screen-reader-response {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
word-wrap: normal !important;
}
.screen-reader-text:focus,
.screen-reader-response:focus {
background-color: #eee;
clip: auto !important;
clip-path: none;
color: #444;
display: block;
font-size: 1em;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000;
}
.wp-container-1 {
justify-content: center;
}
.justify {
text-align: justify;
}
.justify-left {
text-align: left;
}
.justify-right {
text-align: right;
}
.justify-center {
text-align: center;
}
.wp-block-embed__wrapper {
height: 0;
padding-top: 56.25%;
position: relative;
}
.wp-block-embed__wrapper iframe {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
@media (min-width: 768px) {
.mobile-only {
display: none;
}
}
h1 u,
h2 u,
h3 u {
text-decoration: none;
}
h1 u,
h2 u,
h3 u {
position: relative;
z-index: 1;
overflow: hidden;
display: inline-grid;
}
h1 u:before,
h2 u:before,
h3 u:before {
height: 1.1rem;
bottom: 0.4rem;
content: "";
position: absolute;
left: 0;
width: 100%;
pointer-events: none;
z-index: -1;
background-color: var(--primary);
will-change: transform;
transition-property: transform;
transition: transform 0.65s ease-in-out;
transform: scaleX(0);
transform-origin: left center;
}
@media (min-width: 992px) {
h1 u:before,
h2 u:before,
h3 u:before {
height: 1.8rem;
bottom: 1rem;
}
}
h1 u.active:before,
h2 u.active:before,
h3 u.active:before {
transform: scaleX(1);
}  .alignnone {
margin-left: 0;
margin-right: 0;
max-width: 100%;
height: auto;
}
.aligncenter {
display: block;
margin: 1.5rem auto;
height: auto;
}
.alignleft,
.alignright {
margin-bottom: 1.5rem;
height: auto;
}
@media (min-width: 576px) {
.alignleft {
float: left;
margin-right: 1.5rem;
}
.alignright {
float: right;
margin-left: 1.5rem;
}
}
.mega-menu {
background-color: var(--primary);
opacity: 0;
pointer-events: none;
will-change: opacity;
transition: opacity 0.3s ease-in-out;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: fixed;
padding: 8rem 0 0 0;
z-index: 98;
}
.mega-menu__container {
height: 100%;
display: flex;
flex-direction: column;
padding-top: 1rem;
}
.mega-menu__column {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.mega-menu .color-toggler {
margin: 0 0 1.5rem auto;
}
.mega-menu__nav {
margin-bottom: 2.5rem;
}
.mega-menu__menu {
flex-direction: column;
gap: 1rem 0;
}
.mega-menu__menu a {
font-size: 2rem;
line-height: 1.3;
color: var(--black);
font-family: "Benzin", serif;
font-weight: 500;
}
.mega-menu__menu a:hover {
color: var(--white);
}
.mega-menu.open {
opacity: 1;
pointer-events: all;
}
.mega-menu__address * {
color: var(--black);
}
@media (min-width: 375px) {
.mega-menu__menu a {
font-size: 3rem;
line-height: 1.2;
}
}
@media (max-width: 991.98px) {
.mega-menu .color-toggler {
order: 1;
}
.mega-menu__column {
order: 2;
}
.mega-menu__column--data {
order: 3;
height: auto;
padding-bottom: 2rem;
}
}
@media (min-width: 992px) {
.mega-menu {
padding: 22rem 0 6rem;
height: 100%;
}
.mega-menu .color-toggler {
display: none;
}
.mega-menu__container {
flex-direction: row;
max-width: 138rem;
overflow: unset;
justify-content: space-between;
padding-top: 0;
}
.mega-menu__list-title {
font-size: 2.5rem;
line-height: 1.4;
letter-spacing: 0.015rem;
font-weight: 500;
margin-bottom: 1.5rem;
text-transform: uppercase;
color: var(--black);
}
.mega-menu__list {
display: flex;
flex-direction: column;
gap: 1.5rem 0;
margin-bottom: 2.5rem;
}
.mega-menu__link {
font-size: 2.5rem;
line-height: 1.48;
font-weight: 500;
color: var(--black);
}
.mega-menu__link:hover {
color: var(--white);
}
.mega-menu__address {
color: var(--black);
font-size: 2.5rem;
line-height: 1.4;
letter-spacing: 0.015rem;
font-weight: 500;
margin-top: auto;
}
.mega-menu__address p {
margin-bottom: 2.5rem;
}
.mega-menu__address p:last-child {
margin-bottom: 0;
}
.mega-menu__nav {
margin-bottom: 2rem;
}
.mega-menu__menu {
gap: 1.1rem 0;
}
}
@media (min-width: 1700px) {
.mega-menu {
padding: 28rem 0 6rem;
}
.mega-menu__list-title {
margin-bottom: 4.5rem;
}
.mega-menu__list {
gap: 3.5rem 0;
margin-bottom: 5rem;
}
.mega-menu__menu a {
font-size: 4.5rem;
line-height: 1.4;
}
}
.mega-menu-links {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 1rem;
padding-bottom: 2rem;
}
.mega-menu-links .mega-menu-links__link {
color: var(--black);
font-size: 1.4rem;
line-height: 1.5;
letter-spacing: 0.015rem;
}
.mega-menu-links .mega-menu-links__link:hover {
color: var(--white);
}
@media (min-width: 992px) {
.mega-menu-links {
padding-bottom: 0;
margin-top: auto;
gap: 1.8rem 2rem;
}
.mega-menu-links .mega-menu-links__link {
font-size: 2.5rem;
line-height: 1.4;
}
}
.wp-block-button:not(.is-style-arrow) .wp-block-button__link {
font-size: 2rem;
line-height: 1.1;
font-family: "Benzin", serif;
font-weight: 500;
color: var(--primary);
border: 0.2rem solid var(--primary);
background-color: var(--primary);
transition-property: background-color, color;
will-change: background-color, color;
transition: all 0.3s ease-in-out;
padding: 1.8rem 2.9rem 1.6rem;
border-radius: 0;
color: var(--black);
display: table;
}
.wp-block-button:not(.is-style-arrow) .wp-block-button__link:visited {
color: var(--black);
}
.wp-block-button:not(.is-style-arrow) .wp-block-button__link:hover {
background-color: transparent;
color: var(--primary);
}
.wp-block-button:not(.is-style-arrow).is-style-reverse .wp-block-button__link {
background-color: var(--black);
color: var(--white);
border: 0.2rem solid var(--black);
}
.wp-block-button:not(.is-style-arrow).is-style-reverse .wp-block-button__link:hover {
background-color: transparent;
color: var(--white);
}
.wp-block-button.is-style-arrow .wp-block-button__link, .wp-block-button.is-style-arrow-bottom .wp-block-button__link {
padding: 0;
display: block;
width: 6.5rem;
height: 5.8rem;
color: transparent;
background-color: var(--white-to-dark);
-webkit-mask: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/src/img/arrow.svg);
-webkit-mask-position: center;
-webkit-mask-size: cover;
-webkit-mask-repeat: no-repeat;
mask: url(//przestrzenie.pl/wp-content/themes/przestrzenie-theme/assets/src/img/arrow.svg);
mask-position: center;
mask-size: cover;
mask-repeat: no-repeat;
will-change: transform, background-color;
transition-property: transform, background-color;
transition: all 0.3s ease-in-out;
}
.wp-block-button.is-style-arrow .wp-block-button__link:hover, .wp-block-button.is-style-arrow-bottom .wp-block-button__link:hover {
transform: translateX(0.5rem);
background-color: var(--primary);
}
.wp-block-button.is-style-arrow-bottom .wp-block-button__link {
transform: rotate(90deg);
}
.wp-block-button.is-style-arrow-bottom .wp-block-button__link:hover {
transform: rotate(90deg) translateX(0.5rem);
}
#cookie-notice:not(.cookie-notice-hidden) {
background-color: var(--dark-to-white) !important;
border-top: 0.1rem solid var(--color-1);
}
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container {
margin: 0 auto;
padding-top: 1.25rem;
padding-bottom: 1.25rem;
display: flex !important;
flex-direction: column;
}
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container .cn-text-container {
margin-bottom: 1rem;
color: var(--white-to-dark);
font-size: 1.5rem;
line-height: 2rem;
}
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container a {
text-decoration: underline;
color: var(--primary);
}
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container a:hover {
color: var(--primary-to-text);
}
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container .cn-button {
font-size: 1.5rem;
line-height: 2rem;
font-weight: 700;
color: var(--primary);
border: 0.2rem solid var(--primary);
background-color: var(--primary) !important;
transition-property: background-color, color;
will-change: background-color, color;
transition: all 0.3s ease-in-out;
padding: 0.5rem 1.5rem;
border-radius: 0;
color: var(--black);
display: table;
text-decoration: none;
margin: 0 auto;
}
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container .cn-button:visited {
color: var(--black);
}
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container .cn-button:hover {
background-color: transparent !important;
color: var(--primary);
}
#cookie-notice:not(.cookie-notice-hidden) .cn-close-icon {
will-change: opacity;
transition: opacity 0.35s ease-in-out;
}
#cookie-notice:not(.cookie-notice-hidden) .cn-close-icon:before, #cookie-notice:not(.cookie-notice-hidden) .cn-close-icon:after {
background-color: var(--color-3);
}
@media (max-width: 991.98px) {
#cookie-notice:not(.cookie-notice-hidden) .cn-close-icon {
top: 1.5rem;
right: 0.75rem;
}
}
@media (min-width: 992px) {
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container {
justify-content: space-between;
flex-direction: row;
align-items: center;
padding: 1rem 1.5rem;
}
#cookie-notice:not(.cookie-notice-hidden) .cookie-notice-container .cn-text-container {
margin: 0 1rem 0 0;
text-align: left;
}
}
.social-links__link {
text-decoration: underline;
font-size: 2.5rem;
line-height: 1.32;
font-weight: 500;
}
.social-links__link:hover {
text-decoration: underline;
}
@media (min-width: 992px) {
.social-links__link {
font-size: 2rem;
line-height: 1.35;
}
}
@media (min-width: 1700px) {
.social-links__link {
font-size: 2.5rem;
line-height: 1.32;
}
}
.scroll-btn {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
margin: 0 auto;
cursor: pointer;
}
.scroll-btn--bottom .scroll-btn__icon {
transform: scale(-1);
}
.scroll-btn__icon {
width: 8rem;
height: 8rem;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 2.4rem;
background-color: var(--primary);
}
.scroll-btn__icon path {
stroke: var(--color-1);
}
.scroll-btn__text {
font-size: 2rem;
line-height: 1.35;
color: var(--color-1);
}
@media (min-width: 992px) {
.scroll-btn__icon {
background-color: transparent;
border: 0.2rem solid var(--color-1);
position: relative;
z-index: 1;
margin-bottom: 1.6rem;
width: 6rem;
height: 6rem;
}
.scroll-btn__icon:before {
border-radius: 50%;
background-color: var(--primary);
border-radius: 50%;
width: 100%;
height: 100%;
content: "";
position: absolute;
left: 0;
top: 0;
outline: 0.2rem solid var(--primary);
z-index: -1;
pointer-events: none;
will-change: opacity;
opacity: 0;
transition: opacity 0.3s ease-in-out;
}
.scroll-btn:hover .scroll-btn__icon:before {
opacity: 1;
}
.scroll-btn__text {
font-size: 1.5rem;
line-height: 1.3333333333;
}
}
@media (min-width: 1700px) {
.scroll-btn__icon {
width: 8rem;
height: 8rem;
margin-bottom: 2.4rem;
}
.scroll-btn__text {
font-size: 2rem;
line-height: 1.35;
}
}
@media (min-width: 992px) {
.page-scrollers {
background-color: var(--dark-to-white);
position: absolute;
flex-direction: column;
left: 0;
height: 100%;
width: calc(max(10rem, 7%) - 0.1rem);
justify-content: space-between;
align-items: center;
padding: 20rem 0 10.5rem;
z-index: 1;
}
}
@media (min-width: 1700px) {
.page-scrollers {
width: calc(max(10rem, 14.5%) - 0.1rem);
padding: 65vh 0 10.5rem;
}
}
@media (min-width: 992px) {
.custom-cursor {
width: 9.7rem;
height: 9.7rem;
background-color: var(--primary);
border-radius: 50%;
align-items: center;
justify-content: center;
opacity: 0;
will-change: opacity;
position: absolute;
transition: opacity 0.3s ease-in-out;
transform: translate(-50%, -50%);
pointer-events: none;
user-select: none;
visibility: hidden;
}
.custom-cursor.active {
opacity: 1;
visibility: visible;
}
.custom-cursor__text {
font-size: 1.9rem;
line-height: 1;
font-weight: 600;
color: var(--black);
}
}
@media (min-width: 992px) {
.hide-cursor {
cursor: none;
}
}
.phone {
position: fixed;
background-color: var(--primary);
border-radius: 50%;
bottom: 1rem;
right: 1rem;
width: 4.8rem;
height: 4.8rem;
display: flex;
align-items: center;
justify-content: center;
z-index: 97;
border: 0.2rem solid var(--primary);
transition: background-color 0.3s ease-in-out;
}
.phone g {
fill: var(--white-to-dark);
will-change: fill;
transition: fill 0.3s ease-in-out;
}
.phone:hover g {
fill: var(--dark-to-white);
}
@media (min-width: 992px) {
.phone {
width: 6.5rem;
height: 6.5rem;
bottom: 3.5rem;
right: 3.5rem;
}
.phone svg {
width: 2.5rem;
}
}
.header {
padding: 1.5rem 0;
position: fixed;
top: 0;
left: 0;
right: 0;
width: 100%;
z-index: 99;
background-color: var(--dark-to-white);
transition: all 0.3s ease-in-out;
}
.header.sticky {
background-color: var(--dark-to-white);
}
.header.active {
background-color: var(--primary);
}
.header__wrapper {
display: flex;
justify-content: space-between;
align-items: center;
}
.header__brand {
width: 16rem;
display: block;
position: relative;
z-index: 1;
will-change: transform;
transition: transform 0.3s ease-in-out;
}
.header__logo {
will-change: filter, opacity;
transition-property: filter, opacity;
transition: all 0.3s ease-in-out;
}
.header.active .header__brand {
filter: invert(1);
}
.header.active .header-icon__line {
background-color: var(--black);
}
@media (max-width: 991.98px) {
.header .color-toggler,
.header .header-links {
display: none;
}
.header.active {
padding-bottom: 0;
}
.header.active.sticky {
padding-bottom: 0;
}
.header #text {
display: none;
}
}
@media (min-width: 992px) {
.header {
padding: 2.5rem 0;
}
.header__brand {
width: 9.5rem;
}
.header__brand #text {
will-change: opacity, transform;
transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}
.header__brand #logo {
will-change: transform;
transition: transform 0.5s ease-in-out;
}
.header.sticky {
padding: 1.5rem 0;
}
.header.sticky .header__controls {
transform: translateX(50vw);
}
.header.sticky .header__brand #text {
opacity: 0;
transform: translateX(-52%);
}
.header.sticky .header__brand #logo {
transform: translateX(32%);
}
.header__menu {
will-change: opacity;
transition: opacity 0.3s ease-in-out;
}
.header__controls {
will-change: opacity, transform;
transition-property: opacity, transform;
transition: all 0.3s ease-in-out;
}
.header.active .header__menu,
.header.active .header__controls {
opacity: 0;
pointer-events: none;
}
.header__wrapper {
max-width: 133rem;
margin: 0 auto;
justify-content: flex-start;
}
.header__menu {
display: flex;
flex-direction: row;
gap: 0 1.5rem;
padding-left: 7.5%;
}
.header__menu a {
font-size: 2rem;
line-height: 1.35;
letter-spacing: 0.02rem;
color: var(--white-to-dark);
font-weight: 500;
padding-bottom: 0.75rem;
position: relative;
white-space: nowrap;
z-index: 1;
display: inline-block;
}
.header__menu a:before {
content: "";
position: absolute;
left: 0;
bottom: 1.15rem;
width: 100%;
height: 0.9rem;
background-color: var(--primary);
opacity: 0;
will-change: opacity;
z-index: -1;
transition: opacity 0.3s ease-in-out;
}
.header__menu a:hover:before {
opacity: 1;
}
.header__menu .current_page_item > a:before {
opacity: 1;
}
.header__wrapper {
position: relative;
}
.header .header-icon {
margin-left: auto;
}
.header__controls {
position: absolute;
top: 15.5rem;
right: 3.5rem;
display: flex;
flex-direction: column;
}
.header__controls .color-toggler {
margin-bottom: 6.5rem;
}
}
@media (min-width: 1300px) {
.header__brand {
width: 18rem;
}
}
@media (min-width: 1260px) {
.header__menu {
gap: 0 3.5rem;
}
}
@media (min-width: 1700px) {
.header__menu {
padding-left: 10%;
gap: 0 7rem;
}
.header__menu a {
font-size: 2.5rem;
line-height: 1.32;
}
}
@media (min-width: 1820px) {
.header .header__wrapper {
max-width: 176rem;
}
}
.header-icon {
width: 4.5rem;
height: 3.5rem;
display: flex;
flex-direction: column;
position: relative;
cursor: pointer;
z-index: 1;
}
.header-icon__line {
position: absolute;
width: 100%;
height: 0.2rem;
background-color: var(--white-to-dark);
left: 0;
will-change: transform;
transition: transform 0.3s ease-in-out;
}
.header-icon__line:first-of-type {
top: 0.7rem;
}
.header-icon__line:nth-child(2) {
bottom: 0.7rem;
}
.header-icon.active .header-icon__line:first-of-type {
transform: rotate(45deg) translate(0.8rem, 0.6rem);
}
.header-icon.active .header-icon__line:nth-child(2) {
transform: rotate(-45deg) translate(0.8rem, -0.6rem);
}
@media (min-width: 992px) {
.header-icon {
height: 4.5rem;
}
.header-icon.active .header-icon__line:first-of-type {
transform: rotate(45deg) translate(1.3rem, 0.9rem);
}
.header-icon.active .header-icon__line:nth-child(2) {
transform: rotate(-45deg) translate(1.3rem, -0.9rem);
}
}
@media (min-width: 992px) and (max-width: 1200px) {
.header-icon {
width: 5.7rem;
}
}
@media (min-width: 1200px) {
.header-icon {
width: 9.7rem;
}
}
.light-mode .color-toggler__slider {
transform: translateX(1rem) translateY(-50%);
}
.light-mode .color-toggler__text:first-child {
opacity: 0;
}
.light-mode .color-toggler__text:last-child {
opacity: 1;
}
.light-mode .header__brand {
filter: invert(1);
}
@media (min-width: 992px) {
.light-mode .color-toggler__slider {
transform: translateX(0.8rem) translateY(-50%);
}
}
.color-toggler {
text-align: center;
width: 6rem;
}
.color-toggler__texts {
position: relative;
}
.color-toggler__text {
font-size: 1.4rem;
line-height: 1.5;
color: var(--black);
will-change: opacity;
transition: opacity 0.3s ease-in-out;
display: block;
width: 100%;
}
.color-toggler__text:first-child {
opacity: 1;
}
.color-toggler__text:last-child {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
opacity: 0;
}
.color-toggler__switch {
border-radius: 1.9rem;
background-color: var(--black);
width: 100%;
height: 2.5rem;
display: block;
position: relative;
cursor: pointer;
padding: 0 1rem;
margin-bottom: 0.5rem;
}
.color-toggler__input {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
visibility: hidden;
}
.color-toggler__slider {
position: absolute;
width: 1.5rem;
height: 1.5rem;
display: block;
border-radius: 50%;
background-color: var(--primary);
left: 0;
top: 50%;
transform: translateY(-50%) translateX(3.75rem);
will-change: transform;
transition: transform 0.3s ease-in-out;
}
@media (min-width: 992px) {
.color-toggler {
width: 9.6rem;
}
.color-toggler__text {
color: var(--white-to-dark);
text-align: center;
font-size: 2rem;
line-height: 1.35;
}
.color-toggler__switch {
background-color: transparent;
border: 0.2rem solid var(--white-to-dark);
height: 3.7rem;
margin-bottom: 1.6rem;
}
.color-toggler__slider {
transform: translateY(-50%) translateX(6.2rem);
width: 2.3rem;
height: 2.3rem;
}
}
@media (min-width: 992px) {
.header-links {
display: flex;
flex-direction: column;
gap: 7.5rem 0;
}
.header-links__link {
text-decoration: underline;
writing-mode: vertical-rl;
text-orientation: mixed;
display: block;
margin: 0 auto;
}
.header-links__link:hover {
text-decoration: underline;
color: var(--primary-to-text);
}
}
.footer {
padding: 0 0 5rem;
}
.footer .header__brand {
width: 100%;
padding-bottom: 6.8rem;
margin: 0 auto 7.8rem;
border-bottom: 0.1rem solid var(--color-1);
display: flex;
align-items: center;
justify-content: center;
z-index: 0;
position: unset;
}
.footer .header__brand svg {
min-width: 13.5rem;
}
.footer .header__logo {
opacity: 1;
}
.footer .header__logo--second {
display: none;
}
.footer__title {
color: var(--white-to-dark);
margin-bottom: 5rem;
font-size: 3.5rem;
line-height: 1;
font-weight: 500;
}
.footer__address {
font-size: 2rem;
line-height: 1.25;
font-weight: 500;
margin-bottom: 6.5rem;
}
.footer__address * {
color: var(--white-to-dark);
}
.footer__address p {
margin-bottom: 3.2rem;
}
.footer__address p:last-child {
margin-bottom: 0;
}
.footer__address a:hover {
color: var(--primary);
}
.footer__newsletter {
margin-bottom: 3rem;
}
.footer__newsletter-title {
color: var(--primary);
display: block;
margin-bottom: 4rem;
font-size: 2rem;
line-height: 1.35;
letter-spacing: 0.015rem;
text-transform: uppercase;
font-weight: 400;
}
.footer__newsletter-subtitle {
font-size: 1.3rem;
line-height: 1.3076923077;
letter-spacing: 0.015rem;
color: var(--color-2);
font-weight: 400;
margin-bottom: 2rem;
}
.footer form br {
display: none;
}
.footer form p {
margin-bottom: 0;
}
.footer form .wp-block-button button.wp-block-button__link {
font-size: 1.2rem;
line-height: 1.0833333333;
font-weight: 700;
height: 4rem;
width: 11rem;
padding: 0;
}
.footer form .wpcf7-not-valid-tip {
display: block;
margin: 1rem 0;
}
.footer form .wpcf7-not-valid-tip,
.footer form .wpcf7-response-output {
color: var(--white-to-dark);
font-size: 1.3rem;
line-height: 1.5384615385;
letter-spacing: 0.015rem;
}
.footer input {
background-color: transparent;
border-radius: 0;
color: var(--white-to-dark);
height: 4rem;
border: 0.1rem solid var(--white-to-dark);
padding: 0 1.5rem;
width: 100%;
color: var(--white-to-dark);
font-size: 1.3rem;
line-height: 1.5384615385;
letter-spacing: 0.015rem;
}
.footer .form-row {
display: grid;
grid-template-columns: 1fr 11rem;
gap: 0 0.4rem;
}
.footer__copy {
font-size: 1.5rem;
line-height: 1.3333333333;
letter-spacing: 0.0225rem;
color: var(--color-1);
margin-bottom: 3.8rem;
display: block;
}
.footer__copy a {
color: var(--color-1);
}
.footer__copy a:hover {
color: var(--primary);
}
@media (min-width: 992px) {
.footer {
padding: 0 0 10.5rem;
position: relative;
}
.footer__row {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 7rem 0;
}
.footer .header__brand {
border-bottom: 0;
padding: 0;
margin-bottom: 8.5rem;
display: flex;
gap: 0 15%;
align-items: center;
justify-content: space-between;
}
.footer .header__brand:before, .footer .header__brand:after {
content: "";
display: flex;
background-color: var(--color-2);
width: 100%;
height: 0.1rem;
}
.footer__title {
font-size: 5.5rem;
line-height: 1.1818181818;
margin-bottom: 0;
}
.footer__address {
margin: 0 auto 0;
}
.footer__inner-row {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
gap: 0 3.5rem;
align-items: flex-end;
}
.footer__newsletter {
max-width: 50%;
width: 100%;
margin-bottom: 0;
}
.footer__newsletter-form {
max-width: 70%;
}
.footer__copy {
margin: 0;
}
.footer form .wp-block-button button.wp-block-button__link {
width: 15.5rem;
font-size: 1.5rem;
line-height: 0.8666666667;
}
}
@media (min-width: 1700px) {
.footer {
padding: 0 0 20rem;
}
.footer__row {
gap: 10.5rem 0;
}
.footer__title {
font-size: 7.5rem;
line-height: 1.1333333333;
}
.footer__address {
font-size: 2.5rem;
line-height: 1.4;
}
.footer form input {
height: 4.8rem;
}
.footer form .wp-block-button button.wp-block-button__link {
height: 4.8rem;
}
.footer__scroll-top {
bottom: 8rem;
}
}
.footer-socials {
display: flex;
flex-direction: column;
gap: 4rem;
margin-bottom: 7rem;
}
.footer-socials__link {
font-size: 2rem;
line-height: 1.75;
letter-spacing: 0.015rem;
font-weight: 500;
}
.footer-socials__link:hover {
color: var(--primary-to-text);
}
@media (min-width: 992px) {
.footer-socials {
gap: 2rem 0;
margin-bottom: 0;
}
}
@media (min-width: 992px) {
.footer-socials {
gap: 3.4rem 0;
}
.footer-socials__link {
font-size: 2.5rem;
}
}
.ml-form-successBody {
position: relative;
margin: 1.5rem 0;
width: 100%;
height: 100%;
}
.section-404 {
padding: 22.5rem 0 3.8rem;
}
.section-404__content {
display: flex;
flex-direction: column;
gap: 4rem 0;
}
.section-404__title {
color: var(--white-to-dark);
font-size: 2.8rem;
line-height: 1.25;
font-family: "Benzin", serif;
font-weight: 500;
}
@media (min-width: 992px) {
.section-404 {
padding: 31rem 0 8rem;
}
.section-404__content {
gap: 6rem 0;
}
.section-404__title {
font-size: 3rem;
line-height: 1.2333333333;
max-width: 70%;
}
}
@media (min-width: 1700px) {
.section-404 {
padding: 31rem 0 12.25rem;
}
.section-404__title {
font-size: 4.5rem;
line-height: 1.2222222222;
}
}:root {
--primary: #ffaa00;
--white: #ffffff;
--bg: #1b1c1e;
--black: #1b1c1e;
--color-1: #7b7b7b;
--color-2: #676767;
--color-3: #a3a3a3;
--color-4: #be8809;
--color-5: #a1a1a1;
--color-6: #9d9d9d;
--color-7: #262627;
--color-8: #a2a2a2;
--color-9: #707070;
--color-10: #282829;
--white-to-dark: #ffffff;
--white-to-black: #fff;
--dark-to-white: #1b1c1e;
--primary-to-text: #ffffff;
}
.light-mode {
--white-to-dark: #1b1c1e;
--white-to-black: #000;
--dark-to-white: #ffffff;
--color-7: #f6f6f6;
--color-10: #a3a3a3;
--primary-to-text: #1b1c1e;
}
.hero {
padding: 9.5rem 0 3.8rem;
}
.hero__content {
color: var(--white-to-dark);
}
.hero__content h1,
.hero__content h2 {
font-family: "Benzin", serif;
font-weight: 500;
font-size: 3rem;
line-height: 1.1666666667;
}
.hero__content p {
margin-top: 6rem;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.015rem;
}
@media (min-width: 575px) {
.hero__content h1,
.hero__content h2 {
font-size: 4.5rem;
line-height: 1.1111111111;
}
.hero__content p {
margin-top: 11rem;
}
}
@media (max-width: 575.98px) {
.hero__content h1 br,
.hero__content h2 br {
display: none;
}
}
@media (min-width: 992px) {
.hero {
padding: 16rem 0 6rem;
}
.hero__content h1,
.hero__content h2 {
font-size: 7rem;
line-height: 1;
}
.hero__content h1 br,
.hero__content h2 br {
display: block;
}
.hero__content p {
margin-top: 6.5rem;
max-width: 80rem;
}
}
@media (min-width: 1700px) {
.hero {
padding: 20rem 0 12.25rem;
}
.hero__content h1,
.hero__content h2 {
font-size: 9rem;
line-height: 1.3;
}
.hero__content p {
font-size: 2.5rem;
line-height: 1.4;
margin-top: 8rem;
max-width: 114rem;
}
}:root {
--primary: #ffaa00;
--white: #ffffff;
--bg: #1b1c1e;
--black: #1b1c1e;
--color-1: #7b7b7b;
--color-2: #676767;
--color-3: #a3a3a3;
--color-4: #be8809;
--color-5: #a1a1a1;
--color-6: #9d9d9d;
--color-7: #262627;
--color-8: #a2a2a2;
--color-9: #707070;
--color-10: #282829;
--white-to-dark: #ffffff;
--white-to-black: #fff;
--dark-to-white: #1b1c1e;
--primary-to-text: #ffffff;
}
.light-mode {
--white-to-dark: #1b1c1e;
--white-to-black: #000;
--dark-to-white: #ffffff;
--color-7: #f6f6f6;
--color-10: #a3a3a3;
--primary-to-text: #1b1c1e;
}
.realization-item {
display: flex;
flex-direction: column;
}
.realization-item__title {
color: var(--white-to-black);
font-size: 3rem;
line-height: 1.1666666667;
font-weight: 500;
margin-bottom: 1.8rem;
display: block;
}
.realization-item__title a {
color: var(--white-to-black);
}
.realization-item__list {
display: grid;
grid-template-columns: repeat(1, 1fr);
gap: 0.3rem 0;
color: var(--white-to-black);
margin-bottom: 1.5rem;
}
@media (min-width: 992px) {
.realization-item__list {
margin-bottom: 5.8rem;
}
}
.realization-item__list-item {
font-size: 1.5rem;
line-height: 1.6666666667;
font-weight: 500;
}
.realization-item__slider {
margin-bottom: 1.5rem;
}
.realization-item__slider .splide__slide {
display: flex;
align-items: center;
justify-content: center;
}
.realization-item__action {
display: grid;
grid-template-columns: 6.5rem 1fr;
gap: 0 3.5rem;
align-items: center;
}
.realization-item__icon path {
stroke: var(--primary);
}
.realization-item__link {
color: var(--white-to-black);
text-decoration: underline;
font-size: 2.5rem;
line-height: 1.4;
letter-spacing: 0.02rem;
transition: all 0.3s ease-in-out;
text-transform: uppercase;
}
.realization-item__link:hover {
text-decoration: underline;
color: var(--primary);
}
.realization-item__video-wrapper {
position: relative;
}
.realization-item__video-wrapper video {
width: 100%;
object-fit: cover;
}
.realization-item__play {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
cursor: pointer;
will-change: opacity;
transition: opacity 0.3s ease-in-out;
}
.realization-item__play.hidden {
opacity: 0;
}
.realization-item__play.hidden:hover {
opacity: 1;
}
.realization-item__slider .splide__slide {
flex-direction: column;
}
.realization-item__slider .splide__slide div,
.realization-item__slider .splide__slide img,
.realization-item__slider .splide__slide video {
height: 100%;
width: auto;
max-width: 100%;
object-fit: contain;
}
.realization-item__slider .splide__slide div {
flex-grow: 1;
}
.realization-item__slider .splide__pagination {
width: 3.5rem;
display: flex;
flex-direction: column;
right: -3.5rem;
top: 0;
position: absolute;
height: 100%;
align-items: center;
justify-content: center;
}
.realization-item__slider .splide__pagination__page {
width: 1rem;
height: 1rem;
background: #fff;
margin: 1rem 0;
border-radius: 100%;
opacity: 0.3;
}
.realization-item__slider .splide__pagination__page.is-active {
opacity: 1;
}
@media (max-width: 350px) {
.realization-item__slider {
width: 100%;
}
}
@media (min-width: 351px) and (max-width: 575px) {
.realization-item__slider {
width: 100%;
}
}
@media (max-width: 991.98px) {
.realization-item__image {
width: 100%;
object-fit: cover;
}
.realization-item__column-item {
width: 100%;
}
}
@media (min-width: 992px) {
.realization-item {
flex-direction: row;
align-items: flex-start;
}
.realization-item__data {
width: 33%;
margin-top: 12%;
}
.realization-item__title {
font-size: 3rem;
line-height: 1.1666666667;
}
.realization-item__action {
transform: translateY(calc(var(--item-height) * -1));
will-change: transform;
transition: transform 0.3s ease-in-out;
}
.realization-item__list {
margin-bottom: 2.3rem;
display: flex;
flex-direction: row;
align-items: baseline;
flex-wrap: wrap;
gap: 0 3.4rem;
opacity: 0;
will-change: opacity, transform;
transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}
.realization-item__list-item {
font-size: 1.8rem;
line-height: 1.2777777778;
letter-spacing: 0.015rem;
}
.realization-item__list-item:not(:last-child) {
position: relative;
}
.realization-item__list-item:not(:last-child):after {
content: "";
position: absolute;
right: -1.7rem;
height: 1.5rem;
bottom: 0.5rem;
width: 0.4rem;
background-color: var(--primary);
}
.realization-item__action {
display: flex;
flex-direction: column;
gap: 1.7rem 0;
align-items: flex-start;
}
.realization-item__link {
opacity: 0;
will-change: opacity, color;
}
.realization-item__icon {
width: 5rem;
will-change: transform;
transition: transform 0.3s ease-in-out;
}
.realization-item__small {
min-width: 21%;
width: 21%;
height: auto;
display: flex;
align-items: center;
justify-content: flex-end;
max-width: 22rem;
margin-top: auto;
margin-bottom: 12.5rem;
will-change: transform, opacity;
transition: transform 0.4s ease-in-out, opacity 0.5s ease-in-out;
opacity: 0;
transform: translateX(calc(121% + 1.2rem + 30%));
}
.realization-item__small:after {
content: "";
display: block;
padding-bottom: 100%;
}
.realization-item__small img {
width: 100%;
height: 100%;
object-fit: cover;
}
.realization-item__image--thumbnail {
width: 43%;
margin-top: auto;
margin-bottom: 5rem;
}
.realization-item__image--column {
height: 100%;
object-fit: cover;
}
.realization-item__video-wrapper,
.realization-item video {
width: 100%;
height: 100%;
}
.realization-item__column {
height: 100%;
width: 32%;
display: flex;
flex-direction: column;
gap: 1.2rem 0;
}
.realization-item__column-item {
width: 100%;
will-change: transform, opacity;
transition: transform 0.4s ease-in-out, opacity 0.5s ease-in-out;
opacity: 0;
}
.realization-item__column-item:nth-child(2n+1) {
height: calc(45% - 0.6rem);
transform: translateX(calc((132% + 1.9rem - 16.5%) * -1)) translateY(90%);
}
.realization-item__column-item:nth-child(2n) {
height: calc(55% - 0.6rem);
transform: translateX(calc((132% + 1.9rem - 16.5%) * -1)) translateY(-20%);
}
.realization-item__gallery {
height: 68rem;
gap: 0 1.2rem;
align-items: flex-start;
width: calc(66% + 200px);
margin-left: -200px;
}
.realization-item:nth-child(even) {
flex-direction: row-reverse;
}
.realization-item:nth-child(even) .realization-item__small {
order: 3;
transform: translateX(calc((121% + 1.2rem + 30%) * -1));
}
.realization-item:nth-child(even) .realization-item__image--thumbnail {
order: 2;
}
.realization-item:nth-child(even) .realization-item__column {
order: 1;
}
.realization-item:nth-child(even) .realization-item__column-item:nth-child(1) {
transform: translateX(calc(132% + 1.9rem - 16.5%)) translateY(90%);
}
.realization-item:nth-child(even) .realization-item__column-item:nth-child(2) {
transform: translateX(calc(132% + 1.9rem - 16.5%)) translateY(-20%);
}
.realization-item:nth-child(even) .realization-item__data {
margin-left: 3rem;
margin-right: 0;
margin-top: 8%;
}
.realization-item:nth-child(even) .realization-item__gallery {
margin-left: 0;
margin-right: -200px;
}
.realization-item:hover .realization-item__icon {
transform: rotate(45deg);
}
.realization-item:hover .realization-item__link {
opacity: 1;
}
.realization-item:hover .realization-item__small {
transform: translateX(0px);
opacity: 1;
}
.realization-item:hover .realization-item__column-item {
transform: translate(0px, 0px) !important;
opacity: 1;
}
.realization-item:hover .realization-item__list,
.realization-item:hover .realization-item__action {
transform: translateY(0px);
}
.realization-item:hover .realization-item__list {
opacity: 1;
}
}
@media (min-width: 1700px) {
.realization-item__gallery {
height: 84rem;
}
.realization-item__title {
font-size: 5rem;
line-height: 1.1;
}
.realization-item__list-item {
font-size: 2rem;
line-height: 1.25;
}
.realization-item__list-item:not(:last-child):after {
height: 2rem;
}
.realization-item__link {
font-size: 3rem;
line-height: 1.1666666667;
}
.realization-item__icon {
width: 7rem;
}
}
.portfolios {
padding: 2.25rem 0 5.5rem;
}
.portfolios__slider-container {
margin-bottom: 6.3rem;
}
.portfolios__category-btn {
font-size: 2rem;
line-height: 1.75;
letter-spacing: 0.015rem;
color: var(--color-3);
cursor: pointer;
will-change: color;
transition: color 0.3s ease-in-out;
}
.portfolios__category-btn.active {
color: var(--white-to-dark);
}
.portfolios__list {
display: flex;
flex-direction: column;
gap: 6.5rem 0;
}
@media (max-width: 991px) {
.portfolios__list {
gap: 12rem 0;
margin-bottom: 12rem;
}
}
.portfolios .portfolio-item {
opacity: 1;
}
@media (max-width: 575.98px) {
.portfolios__slider-container {
padding-right: 0;
}
}
@media (min-width: 992px) {
.portfolios {
padding: 2.25rem 0 12.5rem;
}
.portfolios__slider-container {
margin-bottom: 0rem;
}
.portfolios .splide {
visibility: visible;
}
.portfolios .splide__list {
flex-direction: row;
justify-content: flex-start;
align-items: center;
gap: 1.5rem 4.5rem;
}
.portfolios .splide__slide {
margin-right: 0 !important;
}
.portfolios .splide.is-initialized .splide__track .splide__list {
display: flex;
}
.portfolios__list {
gap: 2.5rem 0;
}
}
@media (min-width: 1700px) {
.portfolios .splide__list {
gap: 1.5rem 9.5rem;
}
}
.portfolios-more__content {
text-align: center;
color: var(--white-to-dark);
}
.portfolios-more__content .is-style-subheading {
margin-bottom: 5rem;
font-size: 2rem;
line-height: 1.35;
letter-spacing: 0.02rem;
font-weight: 600;
color: var(--primary);
}
.portfolios-more__content h1,
.portfolios-more__content h2 {
font-family: "Benzin", serif;
font-weight: 500;
font-size: 2.8rem;
line-height: 1.3571428571;
margin-bottom: 5rem;
}
.portfolios-more__titlebtn {
display: block;
cursor: pointer;
will-change: color;
transition: color 0.3s ease-in-out;
}
.portfolios-more__titlebtn:hover {
color: var(--primary);
}
.portfolios-more__btn {
transform: rotate(90deg);
will-change: transform;
transition: transform 0.3s ease-in-out;
cursor: pointer;
}
.portfolios-more__btn path {
will-change: stroke;
transition: stroke 0.3s ease-in-out;
stroke: var(--white-to-dark);
}
.portfolios-more__btn:hover {
transform: rotate(90deg) translateX(0.5rem);
}
.portfolios-more__btn:hover path {
stroke: var(--primary);
}
@media (min-width: 992px) {
.portfolios-more__container {
margin-top: 12.5rem;
}
.portfolios-more__content {
padding: 8.5rem 0 0 0;
border-top: 0.1rem solid var(--color-1);
}
.portfolios-more__content .is-style-subheading,
.portfolios-more__content h1,
.portfolios-more__content h2 {
margin-bottom: 3.8rem;
}
.portfolios-more__content h1,
.portfolios-more__content h2 {
font-size: 5.5rem;
line-height: 1;
}
}
@media (min-width: 1700px) {
.portfolios-more__content {
position: relative;
}
.portfolios-more__content:before {
content: "";
position: absolute;
top: -0.1rem;
width: 100%;
left: -50%;
height: 0.1rem;
background-color: var(--color-1);
}
.portfolios-more__content h1,
.portfolios-more__content h2 {
font-size: 8rem;
line-height: 1;
}
.portfolios-more__content .is-style-subheading {
font-size: 2.5rem;
line-height: 1.4;
}
}