:root {
--white: #fff;
--ink: #151515;
--ink-2: #252525;
--muted: #646464;
--line: #dedede;
--soft: #f7f7f5;
--dark: #090d0b;
--dark-2: #111612;
--accent: #b95524;
--accent-hover: #943f17;
--ui-dark:#0b100d;
--ui-accent:#c65a24;
--ui-border:#deded9;
--ui-muted:#666b66;
--container: 1320px;
--header: 76px;
--admin-bar: 32px;
}
*, ::after, ::before {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
html{
scroll-behavior:smooth
}
body {
margin: 0;
padding: 0;
font-size: 16px;
font-weight: 400;
font-family: Arial,Helvetica,sans-serif;
line-height: 1.55;
color: var(--ink);
background: var(--white);
-webkit-font-smoothing:antialiased
}
a {
color: inherit;
text-decoration: none;
transition: .2s;
}
img {
margin: 0;
vertical-align: middle;
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
transition: .5s;
}
button {
font: inherit;
color:inherit
}
.bg-cover {
position: relative;
}
.bg-cover img,
.bg-cover video {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.bg-cover-span {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 1;
}
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
letter-spacing: -.035em;
font-family: inherit;
line-height: 1.04;
font-weight: 700;
margin-bottom: 0;
}
h2 {
font-size: clamp(36px, 3.45vw, 50px);
line-height: 1.04;
}
.form-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
form label {
display: grid;
gap: 8px;
font-size: 14px;
align-content: flex-start;
}
form label > span:not(.wpcf7-form-control-wrap) {
font-size: 14px;
text-transform: uppercase;
letter-spacing: .1em;
font-weight: 800;
color: #5d5d5d;
}
::-webkit-input-placeholder {
color: #909090;
}
::-moz-placeholder {
color: #909090;
}
:-ms-input-placeholder {
color: #909090;
}
:-moz-placeholder {
color: #909090;
}
input,
textarea {
font:inherit;
font-size: 14px;
width: 100%;
border: 0;
border-bottom: 1px solid #bdbdbd;
background: transparent;
border-radius: 0;
padding: 11px 0 12px;
color: #171717;
outline: none;
resize: none;
transition: border-color .2s ease;
}
input:not([type="button"]):focus,
textarea:focus{
border-color:var(--accent)
}
input[type="submit"] {
width: auto;
}
textarea {
height: 88px;
min-height: 88px;
max-height: 88px;
}
.file-upload-wrap {
display: grid;
gap: 8px;
padding-top: 1px;
}
.file-upload-label {
font-size: 14px;
text-transform: uppercase;
letter-spacing: .1em;
font-weight: 800;
color: #5d5d5d;
}
.file-upload {
display: flex;
align-items: baseline;
flex-wrap: wrap;
gap: 8px 14px;
min-width: 0;
}
.zl-form-control-wrap {
display: none;
}
form label span.file-upload-note {
color: #858585;
font-size: 14px;
font-weight: 400;
text-transform: none;
letter-spacing: 0;
order: 2;
}
.file-upload > p {
order: 1;
margin: 0;
}
.file-upload > p .button {
color: var(--ink);
font-size: 14px;
font-weight: 800;
text-transform: none;
letter-spacing: 0;
padding: 0;
border-bottom: 1px solid #8d8d8d;
padding-bottom: 2px;
cursor: pointer;
min-height: auto;
transition: color .2s, border-color .2s;
}
div#mfcf7_zl_multifilecontainer {
order: 3;
margin: 0;
}
div#mfcf7_zl_multifilecontainer p {
margin: 0;
}
div#mfcf7_zl_multifilecontainer span.mfcf7-zl-multifile-name {
display: inline-block;
min-height: 0;
color: #666;
font-size: 14px;
line-height: 1.45;
}
.form-submit-row {
position: relative;
display: flex;
align-items: center;
gap: 24px;
margin-top: 4px;
}
.form-submit-row>p {
margin: 0;
color: #777;
font-size: 14px;
line-height: 1.45;
max-width: 310px;
}
.form-submit-row>p a {
text-decoration: underline;
text-underline-offset: 2px;
}
.form-response-time {
margin: 10px 0 0;
color: #777a74;
font-size: 14px;
line-height: 1.45;
}
.wpcf7-spinner {
position: absolute;
right: 0;
top: 0;
}
.wpcf7-not-valid-tip {
margin-top: 4px;
font-size: 14px;
}
.wpcf7 form .wpcf7-response-output {
margin: 0;
padding: 12px 16px;
font-size: 14px;
}
.screen-reader-text {
display: none;
}
.container {
width: 100%;
max-width: min(calc(100% - 64px), var(--container));
margin-left: auto;
margin-right: auto;
}
.section {
position: relative;
padding-top: 104px;
padding-bottom: 104px;
z-index: 1;
}
.section-label{
margin:0 0 14px;
text-transform:uppercase;
letter-spacing:.16em;
font-size:14px;
line-height:1.2;
font-weight:800;
color:var(--accent)
}
.section-label-light{
color:#e28a58
}
.section-head h2 {
font-size: clamp(36px, 3.45vw, 50px);
line-height: 1.04;
}
.pt-0 {
padding-top: 0 !important;
}
.pb-0 {
padding-bottom: 0 !important;
}
.mt-0 {
margin-top: 0 !important;
}
.mb-0 {
margin-bottom: 0 !important;
}
@media (min-width: 992px) {
.hide-lg {
display: none !important;
}
}
.bg-light {
background: var(--light);
}
.w-100 {
width: 100%;
}
.section-head{
margin-bottom:36px
}
.section-head-split{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:54px
}
.section-head-split .section-intro{
margin:0 0 4px;
max-width:470px;
color:#535353
}
.section-head-action{
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:30px
}
.button{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:48px;
padding:0 24px;
border:1px solid transparent;
font-weight:700;
font-size:14px;
letter-spacing:.01em;
transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
cursor:pointer
}
.button:hover{
transform:translateY(-1px)
}
.button-accent{
background:var(--accent);
color:#fff
}
.button-accent:hover{
background:var(--accent-hover)
}
.button-dark{
background:var(--ink);
color:#fff
}
.button-dark:hover{
background:#000
}
.button-outline{
background:#fff;
border-color:#bdbdbd;
color:var(--ink)
}
.button-outline:hover{
border-color:var(--ink);
background:var(--ink);
color:#fff
}
.mobile-contact-bar {
position: fixed;
right: 22px;
bottom: 22px;
left: auto;
z-index: 1950;
display: block;
width: 56px;
height: 56px;
background: transparent;
box-shadow: none;
}
.mobile-contact-bar>.mobile-contact-write {
position: absolute;
right: 0;
bottom: 0;
width: 56px;
height: 56px;
padding: 0;
border: 0;
border-radius: 50%;
background: var(--ui-dark);
color: #fff;
display: grid;
place-items: center;
box-shadow: 0 12px 30px rgba(0, 0, 0, .22);
cursor: pointer;
transition: transform .18s ease, background .18s ease;
}
.mobile-contact-bar>.mobile-contact-write:hover {
background: #151c17;
transform: translateY(-2px);
}
.mobile-contact-bar>.mobile-contact-write svg {
width: 23px;
height: 23px;
fill: none;
stroke: #e1783f;
stroke-width: 1.8;
stroke-linecap: round;
stroke-linejoin: round;
}
.mobile-contact-bar>.mobile-contact-write span {
display: none;
}
.mobile-contact-messengers {
position: absolute;
right: 0;
bottom: 68px;
width: min(388px,calc(100vw - 28px));
text-align: center;
display: block;
padding: 20px;
background: #FFF;
border: 1px solid #dddcd7;
box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
opacity: 0;
visibility: hidden;
transform: translateY(8px) scale(.985);
transform-origin: bottom right;
transition: opacity .18s ease,visibility .18s ease,transform .18s ease;
}
.mobile-contact-bar.is-open .mobile-contact-messengers {
opacity: 1;
visibility: visible;
transform: none;
}
.mobile-contact-panel-title {
margin: 0 0 6px;
color: #1d1e1c;
font-size: 17px;
font-weight: 800;
line-height: 1.25;
}
.mobile-contact-panel-copy {
margin: 0 0 16px;
color: #727570;
font-size: 14px;
line-height: 1.5;
}
.mobile-contact-primary {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 46px;
margin: 0 0 14px;
padding: 0 14px;
background: var(--ui-dark);
color: #FFF;
font-size: 14px;
font-weight: 800;
}
.mobile-contact-primary img {
width: 17px;
height: 17px;
filter: brightness(0) invert(1);
}
.mobile-contact-links {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: nowrap;
gap: 14px;
width: 100%;
}
.mobile-contact-links a {
background: transparent;
border: 0;
box-shadow: none;
color: #242522;
}
.mobile-contact-links a, .mobile-contact-links a:last-child {
flex: 0 1 auto;
min-width: 0;
min-height: 34px;
padding: 4px 0;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
font-size: 12.5px;
line-height: 1.15;
font-weight: 700;
white-space: nowrap;
text-align: center;
}
.mobile-contact-links a.social-mobile {
display: none;
}
.mobile-contact-links a:hover {
color: var(--accent);
}
.mobile-contact-links img {
flex: 0 0 18px;
width: 18px;
height: 18px;
margin: 0;
} .content-zoom-source{
cursor:zoom-in
}
.content-zoom-source:focus-visible{
outline:2px solid var(--accent);
outline-offset:3px
}
.content-zoom-modal{
position:fixed;
inset:0;
z-index:2100;
display:flex;
align-items:center;
justify-content:center;
padding:54px 70px;
opacity:0;
visibility:hidden;
transition:opacity .18s ease,visibility .18s ease
}
.content-zoom-modal.is-open{
opacity:1;
visibility:visible
}
.content-zoom-backdrop{
position:absolute;
inset:0;
border:0;
background:rgba(7,10,8,.91);
cursor:zoom-out
}
.content-zoom-stage{
position:relative;
z-index:2;
display:flex;
align-items:center;
justify-content:center;
max-width:min(1120px,calc(100vw - 140px));
max-height:calc(100dvh - 108px)
}
.content-zoom-image{
display:block;
max-width:100%;
max-height:calc(100dvh - 108px);
width:auto;
height:auto;
object-fit:contain;
box-shadow:0 16px 55px rgba(0,0,0,.25)
}
.content-zoom-close{
position:absolute;
top:0;
right:-48px;
width:38px;
height:38px;
border:0;
background:transparent;
color:#fff;
cursor:pointer
}
.content-zoom-close span{
position:absolute;
left:8px;
top:18px;
width:23px;
height:1.5px;
background:currentColor
}
.content-zoom-close span:first-child{
transform:rotate(45deg)
}
.content-zoom-close span:last-child{
transform:rotate(-45deg)
} .header {
height:var(--header);
background:#fff;
border-bottom:1px solid #e5e5e5;
position:sticky;
top:0;
z-index:1000
}
.admin-bar .header {
top: var(--admin-bar);
}
.header-wrap {
height:100%;
display:grid;
grid-template-columns:150px 1fr auto;
align-items:center;
gap:30px
}
.custom-logo-link {
display:flex;
align-items:center;
width:106px;
height:68px
}
.custom-logo-link img{
width:100%;
height: 100%;
object-fit:contain
}
.desktop-nav {
display:flex;
align-items:center;
justify-content:center;
gap:clamp(14px,1.2vw,24px);
height:100%;
margin: 0;
padding: 0;
list-style: none
}
.desktop-nav a {
position:relative;
font-size:15px;
font-weight:700;
color:#222;
white-space:nowrap;
padding:29px 0 25px
}
.desktop-nav a:after {
content:"";
position:absolute;
left:0;
right:100%;
bottom:18px;
height:2px;
background:var(--accent);
transition:right .2s ease
}
.desktop-nav a:hover:after,
.desktop-nav li.current-menu-item > a:after {
right:0
}
.header-actions{
display:flex;
align-items:center;
gap:12px;
height:100%
}
.header-phone {
margin-right: -8px;
flex: 0 0 auto;
display: inline-flex;
align-items: center;
gap: 8px;
font-size: 15px;
font-weight: 700;
color: #222;
}
.header-phone:hover {
color: var(--accent);
}
.header-phone img {
width: 16px;
height: 16px;
}
.header-phone span {
margin-bottom: -2px;
}
.wpml-ls-legacy-dropdown-click {
width: auto;
}
.wpml-ls-legacy-dropdown-click a {
border: none;
background: none;
padding: 0;
font-size: 14px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: .06em;
}
.wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle:after {
width: 6px;
height: 6px;
border: 0;
border-right: 1.5px solid #222;
border-bottom: 1.5px solid #222;
transform: rotate(45deg) translateY(-2px);
transition: transform .2s;
right: 3px;
top: calc(50% - 3px);
transition: 0s;
}
.wpml-ls-legacy-dropdown-click a.wpml-ls-item-toggle {
padding-right: 14px;
}
.wpml-ls-legacy-dropdown-click .wpml-ls-sub-menu {
border-top: 0;
background:#fff;
box-shadow:0 14px 36px rgba(0,0,0,.14);
padding:8px 0;
top: calc(100% + 15px);
left: auto;
right: -5px;
}
.wpml-ls-legacy-dropdown-click .wpml-ls-current-language:hover>a, .wpml-ls-legacy-dropdown-click a:focus, .wpml-ls-legacy-dropdown-click a:hover {
background: none;
color: inherit;
}
.wpml-ls-legacy-dropdown-click a {
display:block;
padding:10px 15px;
font-size:14px;
color:#333;
transition: 0s;
}
.wpml-ls-legacy-dropdown-click a:hover {
color: var(--accent);
}
.menu-button{
display:none;
width:27px;
height:26px;
position:relative;
appearance: none;
border: 0;
background: none;
padding: 0;
cursor: pointer;
}
.menu-button span{
position:absolute;
left:2px;
width:23px;
height:2px;
background:#171717;
transition:.25s ease
}
.menu-button span:first-child{
top:8px
}
.menu-button span:last-child{
top:16px
}
.menu-button.active span:first-child{
top:12px;
transform:rotate(45deg)
}
.menu-button.active span:last-child{
top:12px;
transform:rotate(-45deg)
}
.mobile-menu{
display:none;
position:fixed;
left:0;
right:0;
top:var(--header);
height:calc(100vh - var(--header));
background:#fff;
z-index:999;
overflow:auto;
opacity:0;
visibility:hidden;
transition:opacity .2s ease
}
.admin-bar .mobile-menu {
top: calc(var(--header) + var(--admin-bar));
height: calc(100vh - var(--header) - var(--admin-bar));
}
.mobile-menu.open{
opacity:1;
visibility:visible
}
.mobile-menu-inner{
padding-top:36px;
padding-bottom:40px
}
.mobile-nav{
display:grid;
margin: 0;
padding: 0;
list-style: none;
}
.mobile-nav a{
display: block;
font-size:30px;
font-weight:700;
letter-spacing:-.03em;
padding:11px 0;
color:#171717
}
.mobile-nav li.current-menu-item > a {
color:var(--accent)
} .header-cart {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 40px;
padding: 0;
border: 0;
color: var(--accent);
margin-left: -3px;
background: transparent;
cursor: position;
text-decoration: none;
transition: color .2s ease,transform .18s ease;
}
.header-cart:hover {
background: transparent;
color: var(--accent-hover);
}
.header-cart svg {
width: 25px;
height: 25px;
stroke-width: 1.75;
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
}
.header-cart-count {
position: absolute;
place-items: center;
background: var(--accent);
color: #FFFFFF;
transition: transform .18s ease;
top: -4px;
right: -6px;
display: flex;
align-items: center;
justify-content: center;
min-width: 18px;
height: 18px;
padding: 0 4px;
border: 2px solid #FFF;
border-radius: 50%;
font-size: 10px;
line-height: 1;
font-weight: 800;
box-sizing: border-box;
} .hero{
position:relative;
height:min(650px,calc(100vh - var(--header)));
min-height:520px;
color:#fff;
overflow:hidden;
background:#151515
}
.hero-image{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center 46%
}
.hero-shade{
position:absolute;
inset:0;
background:linear-gradient(90deg,rgba(5,7,6,.77) 0%,rgba(5,7,6,.48) 47%,rgba(5,7,6,.12) 80%,rgba(5,7,6,.04) 100%)
}
.hero-inner{
position:relative;
z-index:2;
height:100%;
display:flex;
align-items:center
}
.hero-main{
max-width:720px;
padding-bottom:10px
}
.hero h1{
font-size:clamp(48px,5.15vw,68px);
line-height:.98;
margin:0 0 24px;
font-weight:700;
letter-spacing:-.055em
}
.hero-main>p{
font-size:clamp(17px,1.55vw,22px);
line-height:1.42;
max-width:590px;
margin:0;
color:#fff
}
.hero-actions{
display:flex;
align-items:center;
gap:28px;
margin-top:37px
}
.hero-link{
font-size:14px;
font-weight:700;
padding:12px 0;
border-bottom:1px solid rgba(255,255,255,.75)
}
.hero-link:hover{
border-color:var(--accent);
color:#fff
} .calculation-section{
padding:56px 0 52px;
border-bottom:1px solid #e3e3e3;
scroll-margin-top: var(--header);
}
.calculation-wrap{
display:grid;
grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
gap:clamp(50px,6.5vw,92px);
align-items:start
}
.calculation-heading h2{
font-size: clamp(32px, 2.9vw, 44px);
line-height: 1.1;
max-width:590px;
margin:0 0 22px
}
.calculation-heading>p:last-child{
margin:0;
max-width:540px;
color:#555;
font-size:16px
}
.calculation-form {
display:grid;
gap:18px
}
.calculation-form + .wpcf7-response-output {
margin-top: 18px !important;
} .section.production-section {
padding-top: 64px;
padding-bottom: 24px;
}
.production-section h2 {
font-size: clamp(35px, 3.3vw, 48px);
}
.production-gallery {
display: grid;
grid-template-columns: 1.5fr .78fr .78fr;
gap: 16px;
height: 420px;
}
.production-photo {
position: relative;
margin: 0;
overflow: hidden;
background: #eaeaea;
}
.production-photo img {
width: 100%;
height: 100%;
cursor: zoom-in;
object-fit: cover;
transition: transform .5s ease;
}
.production-photo:hover img {
transform: scale(1.025);
}
.production-photo-main img {
object-position: center;
}
.production-photo figcaption {
position: absolute;
left: 20px;
bottom: 17px;
z-index: 2;
margin: 0;
color: #fff;
font-size: 14px;
font-weight: 700;
pointer-events: none;
}
.production-photo:after {
content: "";
position: absolute;
inset: auto 0 0;
height: 42%;
background: linear-gradient(transparent, rgba(0, 0, 0, .58));
pointer-events: none;
} .granite-section{
padding-top: 24px;
padding-bottom: 34px;
}
.granite-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 22px;
}
.granite-card {
position: relative;
height: 560px;
overflow: hidden;
background: #222;
color: #fff;
}
.granite-card>img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
transform: scale(1.01);
cursor: zoom-in;
transition: transform .55s ease;
}
.granite-card:hover>img {
transform: scale(1.045);
}
.granite-overlay {
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, .04) 30%, rgba(0, 0, 0, .72) 100%);
}
.granite-content {
position: absolute;
left: 34px;
right: 34px;
bottom: 30px;
z-index: 2;
}
.granite-content>span:first-child {
display: block;
font-size: 14px;
text-transform: uppercase;
letter-spacing: .13em;
font-weight: 800;
color: rgba(255, 255, 255, .72);
margin-bottom: 8px;
}
.granite-content h3 {
font-size: 34px;
line-height: 1.08;
margin: 0 0 15px;
font-weight: 700;
}
.granite-more {
display: inline-block;
font-size: 14px;
font-weight: 800;
padding-bottom: 4px;
border-bottom: 1px solid rgba(255, 255, 255, .75);
} .granite-modal{
position:fixed;
inset:0;
z-index:2500;
display:grid;
place-items:center;
padding:28px;
opacity:0;
visibility:hidden;
pointer-events:none;
transition:opacity .22s ease,visibility .22s ease;
}
.granite-modal.is-open{
opacity:1;
visibility:visible;
pointer-events:auto;
}
.granite-modal-backdrop{
position:absolute;
inset:0;
background:rgba(5,7,6,.72);
backdrop-filter:none;
}
.granite-modal-dialog{
position:relative;
z-index:1;
width:min(760px,100%);
max-height:min(820px,calc(100vh - 56px));
background:#fff;
box-shadow:0 28px 90px rgba(0,0,0,.28);
overflow:hidden;
transform:translateY(12px) scale(.99);
transition:transform .22s ease;
}
.granite-modal.is-open .granite-modal-dialog{transform:none}
.granite-modal-scroll{
max-height:min(820px,calc(100vh - 56px));
overflow-y:auto;
overscroll-behavior:contain;
scrollbar-width:thin;
}
.granite-modal-media{
width:100%;
height:clamp(280px,43vh,430px);
overflow:hidden;
background:#ececea;
}
.granite-modal-media img{
width:100%;
height:100%;
object-fit:cover;
}
.granite-modal-content{padding:32px 36px 36px}
.granite-modal-content .section-label{margin-bottom:10px}
.granite-modal-content h2{
margin:0 0 14px;
font-size:clamp(30px,3vw,42px);
line-height:1.05;
}
.granite-modal-lead{
margin:0 0 17px;
color:#404040;
font-size:15px;
line-height:1.6;
}
.granite-modal-text{
margin:0;
color:#666;
font-size:14px;
line-height:1.68;
}
.granite-modal-cta{margin-top:27px}
.granite-modal-close{
position:absolute;
z-index:3;
top:14px;
right:14px;
width:42px;
height:42px;
border:0;
background:rgba(9,13,11,.9);
cursor:pointer;
transition:background .2s ease,transform .2s ease;
}
.granite-modal-close:hover{background:#000;transform:translateY(-1px)}
.granite-modal-close span{
position:absolute;
left:12px;
top:20px;
width:18px;
height:1.5px;
background:#fff;
}
.granite-modal-close span:first-child{transform:rotate(45deg)}
.granite-modal-close span:last-child{transform:rotate(-45deg)}
.home-granite-card {
appearance: none;
border: 0;
padding: 0;
text-align: left;
font: inherit;
cursor: pointer;
} .section.products-section {
padding-top: 34px;
padding-bottom: 36px;
}
.products-catalog-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 48px 22px;
}
.catalog-product-card {
display: flex;
flex-direction: column;
height: 100%;
}
.catalog-product-card.is-filter-hidden {
display: none;
}
.catalog-product-media {
position: relative;
aspect-ratio: 1.18 / 1;
overflow: hidden;
}
.product-stock-badge--overlay {
position: absolute;
left: 14px;
top: 14px;
z-index: 3;
display: inline-flex;
align-items: center;
line-height: 1;
text-transform: uppercase;
padding: 6px 9px 5px;
border: 1px solid rgba(255, 255, 255, .18);
border-radius: 2px;
background: rgba(8, 12, 9, .68);
box-shadow: none;
color: #fff;
font-size: 14px;
font-weight: 800;
letter-spacing: .075em;
text-shadow: 0 1px 2px rgba(0, 0, 0, .18);
}
.catalog-product-media-link {
display: block;
width: 100%;
height: 100%;
cursor: pointer;
}
.catalog-product-media-link img {
width: 100%;
height: 100%;
object-fit: cover;
transition: .45s ease;
}
.catalog-product-card:hover .catalog-product-media-link img {
transform: scale(1.025);
}
.product-quick-cart {
position: absolute;
top: 14px;
right: 14px;
display: grid;
place-items: center;
width: 46px;
height: 46px;
padding: 0;
border: 0;
border-radius: 50%;
background: rgba(255, 255, 255, .84);
color: #353535;
box-shadow: 0 6px 24px rgba(0, 0, 0, .08);
opacity: 0;
transform: translateY(-5px);
cursor: pointer;
transition: opacity .2s ease, transform .2s ease, background .2s ease, color .2s ease;
}
.product-quick-cart:hover {
background: #fff;
color: var(--accent);
}
.catalog-product-card:hover .product-quick-cart {
opacity: 1;
transform: none;
}
.product-quick-cart svg {
width: 21px;
height: 21px;
fill: none;
stroke: currentColor;
stroke-width: 1.8;
stroke-linecap: round;
stroke-linejoin: round;
}
.product-cart-tooltip {
position: absolute;
top: 50%;
right: calc(100% + 9px);
transform: translateY(-50%) translateX(4px);
width: max-content;
max-width: 160px;
padding: 7px 9px;
background: #171717;
color: #fff;
font-size: 14px;
font-weight: 700;
line-height: 1.2;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: .18s ease;
}
.product-quick-cart:hover .product-cart-tooltip {
opacity: 1;
visibility: visible;
transform: translateY(-50%);
}
.catalog-product-copy {
display: flex;
flex: 1;
flex-direction: column;
padding: 18px 1px 0;
height: 100%;
}
.product-type {
font-size: 14px;
text-transform: uppercase;
letter-spacing: .14em;
font-weight: 800;
color: var(--accent);
margin: 0 0 8px;
}
.catalog-product-sku {
margin: 2px 0 7px;
color: #8a8d87;
font-size: 14px;
font-weight: 700;
line-height: 1.3;
letter-spacing: .02em;
}
.catalog-product-copy h3 {
letter-spacing: -.025em;
margin: 0 0 10px;
font-size: 18px;
line-height: 1.3;
}
.catalog-product-copy>p:not(.product-type):not(.catalog-product-sku) {
color: #656565;
font-size: 14px;
line-height: 1.55;
margin: 0 0 12px;
}
.catalog-product-prices {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px;
border-top: 1px solid #e3e0da;
margin: auto 0 15px;
padding-top: 14px;
}
.catalog-product-prices span {
display: block;
margin-bottom: 4px;
color: #898b86;
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .08em;
}
.catalog-product-prices strong {
display: block;
color: #20211f;
font-size: 14px;
line-height: 1.25;
}
.catalog-product-prices div:last-child strong {
color: #a94b20;
} .about-mini-section {
padding: 64px 0 70px;
}
.about-home-card {
display: grid;
background: #090d0b;
color: #ffffff;
grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr);
}
.about-home-media {
min-height: 400px;
overflow: hidden;
}
.about-home-media img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.about-home-copy {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
text-align: left;
padding: clamp(34px,4vw,58px);
}
.about-home-copy .section-label {
margin: 0 0 15px;
}
.about-home-copy h2 {
max-width: 520px;
color: #fff;
font-size: clamp(32px,3.15vw,48px);
line-height: 1.06;
margin: 0 0 18px;
letter-spacing: -.04em;
}
.about-home-copy>p:not(.section-label) {
max-width: 590px;
margin: 0 0 13px;
color: #c4cac5;
font-size: 15px;
line-height: 1.65;
}
.about-mini-link {
margin-top: 15px;
} .home-reviews-section {
background: #090d0b;
color: #FFF;
padding: 64px 0 74px;
}
.home-reviews-head {
display: block;
text-align: center;
max-width: 760px;
margin: 0 auto 26px;
}
.home-reviews-head .section-label {
margin-bottom: 9px;
}
.home-reviews-head h2 {
letter-spacing: -.035em;
font-size: clamp(34px,4vw,52px);
margin: 0 auto;
line-height: 1.02;
}
.home-reviews-intro {
max-width: 650px;
margin: 14px auto 0;
color: #bfc5c0;
font-size: 14px;
line-height: 1.6;
}
.home-reviews-summary {
display: grid;
grid-template-columns: minmax(220px, .65fr) minmax(0, 1.35fr);
gap: 0;
margin: 0 0 18px;
background: #fff;
border: 1px solid #e2e2de;
}
.home-reviews-grid {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 10px;
align-items: stretch;
}
.home-review-card {
display: flex;
flex-direction: column;
border: 1px solid #2a302c;
box-shadow: none;
padding: 20px 20px 22px;
background: #111612;
color: #fff;
}
.home-review-top {
display: flex;
align-items: center;
justify-content: flex-start;
margin-bottom: 12px;
}
.home-review-top>div {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
}
.home-review-top strong {
font-size: 14px;
color: #FFFFFF;
}
.home-review-top span {
white-space: nowrap;
font-size: 14px;
letter-spacing: 1px;
color: var(--accent);
}
.home-review-card>p {
margin: 0;
font-size: 14px;
line-height: 1.6;
color: #c3c9c4;
}
.home-reviews-actions {
display: flex;
justify-content: center;
margin-top: 24px;
} .consultation-section {
padding: 64px 0 68px;
}
.consultation-wrap {
display: grid;
grid-template-columns: 1fr 1fr;
min-height: 570px;
align-items: stretch;
}
.consultation-media {
overflow: hidden;
background: #eee;
}
.consultation-media img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
cursor: zoom-in;
}
.consultation-content {
padding: 54px 0 40px clamp(58px, 6vw, 90px);
display: flex;
flex-direction: column;
justify-content: center;
}
.consultation-content h2 {
font-size: clamp(34px, 3.1vw, 44px);
line-height: 1.08;
max-width: 620px;
margin: 0 0 20px;
}
.consultation-lead {
font-size: 16px;
color: #5b5b5b;
max-width: 520px;
margin: 0 0 28px;
}
.consultation-form {
display:grid;
gap:18px;
margin-bottom: 24px;
}
.consultation-form:last-child {
margin-bottom: 0;
}
.consultation-form textarea {
height: 92px;
min-height: 92px;
max-height: 92px;
}
.consultation-submit {
position: relative;
display: flex;
align-items: center;
gap: 22px;
margin-top: 3px;
}
.consultation-submit p {
margin: 0;
font-size: 14px;
color: #666;
}
.consultation-submit a {
font-weight: 800;
color: #171717;
}
.consultation-submit a:hover {
color: var(--accent);
}
.form-response-time {
margin: 10px 0 0;
color: #777a74;
font-size: 14px;
line-height: 1.45;
} .footer{
background:#080c09;
color:#fff
}
.footer-wrap{
display:grid;
grid-template-columns:1.35fr .7fr .9fr 1.05fr 1.5fr;
gap:clamp(34px,4vw,70px);
padding-top:68px;
padding-bottom:66px;
align-items:start
}
.footer-brand > img{
width:176px;
height: auto;
max-height:118px;
object-fit:contain;
object-position:left center;
}
.footer-brand p{
font-size:14px;
line-height:1.6;
color:#b3bab5;
max-width:260px;
margin:17px 0 0
}
.footer-payment-inline {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
gap: 10px !important;
margin-top: 16px;
}
.footer-payment-text {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}
.footer-payment-text strong {
color: #f4f4f1;
font-size: 14px;
line-height: 1.25;
font-weight: 700;
}
.footer-payment-text small {
color: #96a099;
font-size: 14px;
line-height: 1.35;
}
.footer-payment-brands {
display: flex;
align-items: center;
gap: 8px;
margin: 0;
width: auto;
color: #c8ceca;
font-size: 14px;
}
.footer-payment-brands img[alt="Visa"] {
max-height: 12px;
}
.footer-payment-brands img[alt="Mastercard"] {
max-height: 16px;
}
.footer-title{
display:block;
width:100%;
text-align:left;
border:0;
background:none;
color:#8d9690;
text-transform:uppercase;
letter-spacing:.13em;
font-size:14px;
font-weight:800;
padding:0;
margin:0 0 18px;
pointer-events:none
}
.footer-title span{
display:none
}
.footer-links{
margin: 0;
padding: 0;
list-style: none;
display:grid;
gap:9px
}
.footer-links a,
.footer-links p{
font-size:14px;
color:#fff;
margin:0;
line-height:1.45
}
.footer-links a:hover{
color:#e18a58
}
.footer-links small{
font-size:14px;
text-transform:uppercase;
letter-spacing:.12em;
color:#7e8982;
margin-top:6px
}
.footer-links .strong-link{
font-weight:800
}
.footer-socials{
display:flex;
gap:15px;
margin-top:8px
}
.footer-socials a{
line-height:0
}
.footer-socials a.social-mobile {
display: none;
}
.footer-socials img{
width:20px;
height:20px
}
.footer-map{
height:215px;
overflow:hidden;
}
.footer-map iframe{
display:block;
width:100%;
height:100%;
border:0;
}
.footer-bottom{
border-top:1px solid #242a26
}
.footer-bottom-wrap{
min-height:58px;
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
color:#788079;
font-size:14px
}
.footer-bottom-wrap>ul{
margin: 0;
padding: 0;
list-style: none;
display:flex;
align-items:center;
gap:30px
}
.footer-bottom-wrap a:hover{
color:#fff
}
.cookie-consent {
position: fixed;
left: 24px;
right: 24px;
bottom: 24px;
z-index: 3200;
display: grid;
grid-template-columns: 1fr;
align-items: center;
gap: 10px;
width: min(650px, calc(100% - 48px));
margin: 0 auto;
padding: 16px 18px;
border: 1px solid #d9d8d2;
background: #fff;
box-shadow: 0 20px 54px rgba(0,0,0,.19);
opacity: 0;
visibility: hidden;
transform: translateY(14px);
transition: opacity .2s ease,visibility .2s ease,transform .2s ease;
}
.cookie-consent.is-visible {
opacity: 1;
visibility: visible;
transform: none;
}
.cookie-consent-copy strong {
display: block;
color: #171916;
margin-bottom: 3px;
font-size: 15px;
}
.cookie-consent-copy p {
margin: 0 0 5px;
font-size: 14px;
line-height: 1.45;
color: #5f645f;
}
.cookie-consent-copy a {
color: #171916;
font-size: 14px;
margin-top: 1px;
display: inline-block;
font-weight: 800;
text-decoration: underline;
text-underline-offset: 3px;
}
.cookie-consent-actions {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 8px;
width: 100%;
margin-top: 2px;
} .exit-intent-modal{position:fixed;inset:0;z-index:2200;display:flex;align-items:center;justify-content:center;padding:28px;opacity:0;visibility:hidden;transition:.18s ease}
.exit-intent-modal.is-open{opacity:1;visibility:visible}
.exit-intent-backdrop{position:absolute;inset:0;border:0;background:rgba(5,8,6,.72);backdrop-filter:none;}
.exit-intent-card{position:relative;z-index:2;width:min(520px,100%);background:#fff;padding:38px 40px 34px;box-shadow:0 25px 70px rgba(0,0,0,.28)}
.exit-intent-card h2{margin:0 42px 14px 0;font-size:34px;line-height:1.05;letter-spacing:-.035em}
.exit-intent-lead{margin:0 0 25px;color:#5b5b5b;font-size:14px;line-height:1.6}
.exit-intent-close{position:absolute;top:16px;right:16px;width:34px;height:34px;border:0;background:none;cursor:pointer;color:#222}
.exit-intent-close span{position:absolute;left:8px;top:16px;width:19px;height:1.5px;background:currentColor}
.exit-intent-close span:first-child{transform:rotate(45deg)}.exit-intent-close span:last-child{transform:rotate(-45deg)}
.exit-intent-form{display:grid;gap:16px}
.exit-intent-form .button{width:100%}
.exit-intent-form + .wpcf7-response-output {
margin-top: 18px !important;
}
.exit-intent-status{min-height:0;margin:0;color:var(--accent);font-size:14px;line-height:1.45}
.exit-intent-catalog {
text-align: center;
margin-top:17px;
}
.exit-intent-catalog a {display:inline-block;font-size:14px;font-weight:800;border-bottom:1px solid #999;padding-bottom:3px}
.exit-intent-catalog a:hover{color:var(--accent);border-color:var(--accent)} .cart-toast{position:fixed;right:24px;bottom:24px;z-index:8600;display:flex;align-items:center;gap:18px;max-width:390px;padding:15px 17px;background:var(--dark);color:#fff;box-shadow:0 16px 40px rgba(0,0,0,.22);opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s ease}
.cart-toast.is-visible{opacity:1;visibility:visible;transform:none}
.cart-toast span{font-size:14px;font-weight:700}
.cart-toast a{color:#e28a58;font-size:14px;font-weight:800;white-space:nowrap}
@media (max-width: 1399px) {
:root {
--container: 1110px;
--header: 76px;
--admin-bar: 32px;
}
.header-wrap {
grid-template-columns: 106px 1fr auto;
gap: 16px;
}
.desktop-nav {
gap: 14px;
}
.desktop-nav a,
.header-phone {
font-size: 14px;
}
.granite-content h3 {
font-size: 28px;
}
}
@media (max-width: 1199px) {
:root {
--container: 910px;
--header: 70px;
--admin-bar: 32px;
}
.header-wrap {
position: relative;
grid-template-columns: 1fr auto;
gap: 18px;
z-index: 9999;
}
.custom-logo-link {
height: 60px;
}
.desktop-nav {
display: none;
}
.header-actions {
gap: 14px;
}
.menu-button,
.mobile-menu {
display: block;
}
.calculation-section {
padding: 50px 0 46px;
}
.section.production-section {
padding: 56px 0 20px;
}
.section.granite-section {
padding: 30px 0 30px;
}
.section.products-section {
padding: 30px 0 34px;
}
.home-reviews-grid {
grid-template-columns: repeat(3,minmax(0,1fr));
align-items: stretch;
gap: 10px;	
}
.consultation-section {
padding: 58px 0 60px;
}
.consultation-wrap {
display: flex;
flex-direction: column;
}
.consultation-media {
width: 100%;
height: clamp(360px,44vw,470px);
}
.consultation-content {
width: 100%;
padding: 40px 0 0;
}
.footer-wrap {
gap: clamp(24px,2vw,40px);
}
.footer-brand > img {
width: 160px;
}
.hero-main {
max-width: 100%;
}
}
@media (max-width: 991px) {
:root {
--container: 690px;
--header: 70px;
--admin-bar: 32px;
}
.hero {
height: 550px;
min-height: 0;
}
.hero-shade {
background: rgba(5, 7, 6, .52);
}
.hero-main {
width: 100%;
}
.hero-main>p {
max-width: 100%;
}
.hero-inner {
justify-content: center;
text-align: center;
}
.hero h1 {
font-size: 48px;
}
.hero-actions {
justify-content: center;
}
.calculation-section {
padding: 46px 0 42px;
}
.calculation-wrap {
grid-template-columns: 1fr;
gap: 34px;
}
.calculation-heading {
text-align: center;
}
.calculation-heading h2,
.calculation-heading>p:last-child {
max-width: 100%;
}
.section.production-section {
padding: 50px 0 18px;
}
.section-head {
margin-bottom: 30px;
}
.section-head-split {
display: block;
}
.production-section h2 {
font-size: 40px;
}
.section-head-split .section-intro {
margin: 16px 0 0;
max-width: 100%;
}
.production-gallery {
height: auto;
grid-template-columns: 1.25fr 1fr;
}
.production-photo {
height: 260px;
}
.production-photo-main {
min-height: 536px;
grid-row: span 2;
}
.section.granite-section {
padding: 18px 0 27px;
}
.granite-card {
height: 460px;
}
.granite-content {
left: 24px;
right: 24px;
bottom: 24px;
}
.section.products-section {
padding: 28px 0 30px;
}
.products-catalog-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 40px 18px;
}
.product-quick-cart {
opacity: 1;
transform: none;
}
.about-home-media {
min-height: 300px;
}
.consultation-section {
padding: 52px 0 54px;
}
.footer-wrap {
grid-template-columns: 1.15fr .7fr .9fr 1.25fr;
gap: 24px;
}
.footer-map {
grid-column: 1 / -1;
height: 270px;
margin-top: 12px;
}
}
@media (max-width: 767px) {
:root {
--container: 510px;
--header: 66px;
--admin-bar: 46px;
}
.mobile-nav a {
font-size: 22px;
line-height: 1.22;
padding: 10px 0;
letter-spacing: -.02em;
}
.hero {
height: 500px;
}
.hero h1 {
font-size: clamp(40px, 10vw, 48px);
margin-bottom: 18px;
}
.hero-copy>p {
font-size: 17px;
max-width: 420px;
}
.hero-actions {
margin-top: 30px;
gap: 20px;
flex-direction: column;
}
.calculation-section {
padding: 40px 0 34px;
}
.calculation-wrap {
gap: 28px;
}
.calculation-heading h2 {
font-size: 31px;
line-height: 1.09;
margin-bottom: 15px;
max-width: 430px;
margin-left: auto;
margin-right: auto;
}
.calculation-heading>p:last-child {
font-size: 14px;
line-height: 1.55;
max-width: 410px;
margin-left: auto;
margin-right: auto;
}
.calculation-form {
gap: 17px;
}
.form-row {
grid-template-columns: 1fr;
gap: 18px;
}
.form-submit-row {
align-items: stretch;
flex-direction: column;
gap: 15px;
}
.form-submit-row>p {
width: 100%;
max-width: 360px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
.form-response-time {
text-align: center;
}
.section.production-section {
padding: 44px 0 14px;
}
.section-head {
margin-bottom: 26px;
}
.production-section h2 {
font-size: 34px;
}
.section-head-split .section-intro {
margin-top: 14px;
font-size: 15px;
}
.production-gallery {
grid-template-columns: 1fr 1fr;
}
.production-photo {
height: 210px;
}
.production-photo-main {
grid-column: 1 / -1;
grid-row: auto;
min-height: auto;
}
.section.granite-section {
padding: 16px 0 24px;
}
.section-head-action {
align-items: flex-start;
}
.section-head-action h2 {
font-size: 38px;
}
.granite-grid {
grid-template-columns: 1fr;
gap: 14px;
}
.granite-card {
height: 420px;
}
.granite-content {
left: 22px;
right: 22px;
bottom: 22px;
}
.section.products-section {
padding: 24px 0 27px;
}
.section-head-action h2 {
font-size: 38px;
}
.section-head-action .button {
padding: 0 16px;
}
.products-catalog-grid {
gap: 35px 14px;
}
.catalog-product-copy {
text-align: center;
}
.catalog-product-prices {
grid-template-columns: 1fr;
gap: 9px;
}
.home-reviews-section {
padding: 48px 0 54px;
}
.about-home-copy h2 {
font-size: 30px;
}
.home-reviews-grid {
grid-template-columns: 1fr !important;
}
.consultation-section {
padding: 46px 0 48px;
}
.consultation-media {
height: 330px;
}
.consultation-content {
padding: 32px 0 0;
}
.consultation-content h2 {
font-size: 31px;
max-width: 560px;
}
.consultation-lead {
margin-bottom: 25px;
}
.consultation-submit {
align-items: center;
flex-direction: column;
}
.consultation-submit .button {
width: 100%;
}
.product-stock-badge--overlay {
font-size: 12px;
}
.footer-wrap {
display: block;
padding-top: 50px;
padding-bottom: 20px;
}
.footer-brand {
padding-bottom: 28px;
}
.footer-brand img {
width: 154px;
max-height: 102px;
}
.footer-group {
border-top: 1px solid #262c27;
}
.footer-title {
pointer-events: auto;
cursor: pointer;
margin: 0;
display: flex;
align-items: center;
justify-content: space-between;
padding: 19px 2px;
color: #fff;
font-size: 14px;
}
.footer-title span {
display: block;
color: #a4aaa6;
font-size: 18px;
font-weight: 400;
transition: transform .2s;
}
.footer-accordion.open .footer-title span {
transform: rotate(45deg);
}
.footer-links {
display: none;
padding: 1px 2px 20px;
gap: 11px;
}
.footer-accordion.open .footer-links {
display: grid;
}
.footer-map {
height: 270px;
margin: 24px 0 0;
}
.footer-bottom {
margin-top: 0;
}
.footer-bottom-wrap {
min-height: 94px;
flex-direction: column-reverse;
justify-content: center;
gap: 10px;
text-align: center;
}
.mobile-contact-bar {
right: 14px;
bottom: 14px;
width: 54px;
height: 54px;
}
.mobile-contact-bar>.mobile-contact-write {
width: 54px;
height: 54px;
}
.mobile-contact-messengers {
width: min(360px,calc(100vw - 28px));
right: 0;
bottom: 66px;
padding: 18px;
}
.mobile-contact-links {
gap: 12px;
}
}
@media (max-width: 575px) {
:root {
--container: calc(100vw - 32px);
--header: 66px;
--admin-bar: 0px;
}
.container {
max-width: min(calc(100% - 26px), var(--container));
}
.header-phone img {
width: 18px;
height: 18px;
margin-top: 0;
}
.header-phone span {
display: none;
}
.hero {
height: 470px;
}
.hero h1 {
font-size: 36px;
}
.calculation-heading h2 {
font-size: 28px;
max-width: 390px;
}
.calculation-heading>p:last-child {
max-width: 370px;
}
.section-head {
margin-bottom: 24px;
}
.section-label {
margin-bottom: 11px;
}
.production-section h2 {
font-size: 32px;
}
.production-gallery {
grid-template-columns: 1fr;
}
.production-photo-main, .production-photo {
height: 235px;
}
.section-head-action {
display: block;
}
.section-head-action .button {
margin-top: 22px;
}
.products-catalog-grid {
grid-template-columns: 1fr;
gap: 36px;
}
.about-home-card {
grid-template-columns: 1fr;
}
.about-home-copy {
padding: 24px;
}
.consultation-media {
height: 285px;
}
.consultation-content {
padding: 28px 0 0;
}
.consultation-content h2 {
font-size: 29px;
}
}
@media (max-width: 390px) {
.mobile-contact-messengers {
width: min(328px,calc(100vw - 24px));
}
}.page-section{
padding:76px 0 88px;
}
.page-container{
width:min(calc(100% - 64px),1180px)
}
.page-head{
padding-bottom:26px;
border-bottom:1px solid #dededb;
text-align: center;
max-width: 760px;
margin: 0 auto 30px;
}
.page-head h1{
margin:0 0 15px;
font-size:clamp(32px,3vw,48px);
line-height:1.03;
letter-spacing:-.04em;
}
.page-head h1:last-child {
margin-bottom: 0;
}
.page-content{
width:min(100%,920px);
color:#3f3f3f;
font-size:15.5px;
line-height:1.72;
margin: 0 auto;
}
.page-content p{
margin:0 0 20px
}
.page-content h2{
margin:38px 0 16px;
color:var(--ink);
font-size:24px;
line-height:1.18;
letter-spacing:-.025em;
}
.page-content h3 {
margin: 20px 0 8px;
color: var(--ink);
font-size: 18px;
line-height: 1.35;
}
.page-content strong {
color: #171916;
}
.page-head>p:last-child {
max-width: 720px;
margin: 0 auto;
color: #5a605a;
font-size: 15.5px;
line-height: 1.68;
} .simple-state-section {
background: #fff;
min-height: calc(100vh - var(--header) - 120px);
display: flex;
align-items: center;
padding: 86px 0 96px;
}
.simple-state-wrap {
width: min(calc(100% - 64px), 880px);
text-align: center;
}
.error-code {
margin: 0 0 13px;
color: var(--accent);
font-size: 14px;
font-weight: 900;
letter-spacing: .18em;
}
.simple-state-wrap h1 {
margin: 0 auto 19px;
max-width: 760px;
font-size: clamp(42px, 5vw, 68px);
line-height: 1;
letter-spacing: -.05em;
}
.simple-state-wrap>p:not(.section-label):not(.error-code) {
max-width: 650px;
margin: 0 auto 30px;
color: #555;
font-size: 16px;
line-height: 1.65;
}
.simple-state-actions {
display: flex;
justify-content: center;
gap: 12px;
flex-wrap: wrap;
} .products-catalog-section {
padding: 68px 0 72px;
scroll-margin-top: var(--header);
}
.products-catalog-head {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 64px;
margin-bottom: 38px;
}
.products-catalog-head h2 {
max-width: 680px;
}
.products-catalog-head>p {
max-width: 500px;
margin: 0 0 4px;
color: #5a5a5a;
font-size: 15px;
line-height: 1.58;
}
.product-color-filter {
display: flex;
align-items: center;
gap: 8px;
margin: 0 0 32px;
flex-wrap: wrap;
}
.product-color-filter button {
appearance: none;
border: 1px solid #d8d8d3;
background: #fff;
color: #171815;
padding: 10px 15px;
font: 700 14px/1 inherit;
cursor: pointer;
transition: .2s ease;
}
.product-color-filter button.is-active,
.product-color-filter button:hover {
background: #111612;
border-color: #111612;
color: #FFF;
}
.product-color-filter button span {
margin-left: 6px;
color: #96978f;
font-size: 14px;
font-variant-numeric: tabular-nums;
} .stone-sample-section {
padding: 58px 0;
}
.stone-sample-card {
display: grid;
grid-template-columns: minmax(230px, .30fr) minmax(0, .70fr);
background: #090d0b;
color: #fff;
}
.stone-sample-media {
min-height: 300px;
overflow: hidden;
}
.stone-sample-media>img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.stone-sample-copy {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding: 48px clamp(34px,4.2vw,64px);
}
.stone-sample-copy h2 {
line-height: 1.03;
letter-spacing: -.04em;
font-size: clamp(30px,3vw,45px);
max-width: 680px;
margin: 7px 0 14px;
}
.stone-sample-copy>p:not(.section-label) {
color: #c4cac6;
margin: 0 0 20px;
max-width: 660px;
line-height: 1.55;
} .why-granite-section {
background: var(--dark);
color: #fff;
padding: 68px 0 72px;
}
.why-granite-head {
width: min(100%, 760px);
margin: 0 auto 38px;
text-align: center;
}
.why-granite-head h2 {
margin: 0 auto 13px;
max-width: 700px;
font-size: clamp(34px, 3vw, 45px);
line-height: 1.06;
}
.why-granite-head>p:last-child {
max-width: 620px;
margin: 0 auto;
color: #b7beb9;
font-size: 15px;
line-height: 1.55;
}
.why-granite-grid {
display: grid;
grid-template-columns: repeat(5,minmax(0,1fr));
gap: 0 clamp(26px,3vw,44px);
border: 0;
}
.why-granite-item {
position: repeat;
border-top: 1px solid #29202b;
padding: 25px 0 8px;
}
.why-granite-item:before {
content: "";
display: block;
width: 24px;
height: 2px;
margin-bottom: 21px;
background: #e28a58;
margin-bottom: 18px;
}
.why-granite-item h3 {
margin: 0 0 10px;
font-size: 17px;
line-height: 1.25;
letter-spacing: -.02em;
}
.why-granite-item p {
margin: 0;
color: #abb3ad;
font-size: 14px;
line-height: 1.55;
}
.wc-block-components-notice-banner,.woocommerce-message,.woocommerce-NoticeGroup,.woocommerce-info,.woocommerce-error{
padding:20px;
border: 1px solid var(--line);
background: #f9f9f9;
display:flex;
align-items:center;
margin-bottom: 24px !important;
outline:none!important;
list-style:none;
overflow:hidden
}
.woocommerce-message,.woocommerce-NoticeGroup,.woocommerce-info,.woocommerce-error{
display:block
}
.woocommerce-NoticeGroup ul,.woocommerce-NoticeGroup .woocommerce-error{
padding:0;
margin:0!important;
border:none;
}
.woocommerce-NoticeGroup ul li a{
text-decoration:none
}
.wc-block-components-notice-banner svg{flex:0 0 36px;max-width:36px;margin-right:24px}
.wc-block-components-notice-banner__content{position:relative;overflow:hidden;flex:auto;max-width:100%}
.wc-block-components-notice-banner__content .button,.woocommerce-message .button,.woocommerce-info .button,.woocommerce-error .button{
float:right;
margin-left:24px;
margin-bottom:0;
min-height: inherit;
padding: 0;
font-weight: 600;
}
.sample-modal {
position: fixed;
inset: 0;
z-index: 2500;
display: flex;
align-items: center;
justify-content: center;
padding: 22px;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity .22s ease, visibility .22s ease;
}
.sample-modal.is-open {
opacity: 1;
visibility: visible;
pointer-events: auto;
}
.sample-modal-backdrop {
position: absolute;
inset: 0;
background: rgba(10, 12, 10, .72);
backdrop-filter: none;
}
.sample-modal-dialog {
position: relative;
z-index: 1;
width: min(560px, 100%);
max-height: min(760px, calc(100vh - 36px));
overflow-y: auto;
overflow-x: hidden;
padding: 34px;
background: #fff;
box-shadow: 0 24px 80px rgba(0, 0, 0, .25);
}
.sample-modal-dialog h2 {
margin: 7px 38px 11px 0;
font-size: clamp(28px, 4vw, 39px);
line-height: 1.03;
letter-spacing: -.04em;
}
.sample-modal-lead {
margin: 0 0 23px;
color: #62645f;
font-size: 14px;
line-height: 1.6;
}
.sample-modal-close {
position: absolute;
top: 17px;
right: 17px;
width: 36px;
height: 36px;
border: 0;
background: #f3f2ef;
color: #171916;
font-size: 25px;
line-height: 1;
cursor: pointer;
}
.sample-modal-form {
display: grid;
gap: 13px;
}
.sample-modal-form label {
display: grid;
gap: 7px;
color: #242622;
font-size: 14px;
font-weight: 700;
align-content: flex-start;
}
.sample-modal-form input:not([type="submit"]),
.sample-modal-form select {
width: 100%;
min-width: 0;
height: 44px;
padding: 0 13px;
border: 1px solid #dcd9d3;
background: #fff;
color: #1d1f1b;
font: inherit;
outline: 0;
}
.sample-modal-form input:not([type="submit"]):focus,
.sample-modal-form select:focus {
border-color: #b95729;
}
.sample-modal-form select{
appearance:none;
-webkit-appearance:none;
padding-right:42px;
background-color:#fff;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23212420' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:right 16px center;
background-size:11px 7px;
}
.sample-modal-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 11px;
}
.sample-modal-form .button {
margin-top: 4px;
}
.sample-modal-note {
margin: 1px 0 0;
color: #7b7d78;
font-size: 14px;
line-height: 1.5;
}
.sample-modal-note a {
color: inherit;
text-decoration: underline;
}
body.sample-modal-open {
overflow: hidden;
}
.sample-format-static{
min-width:0;
display:grid;
gap:7px;
color:#242622;
font-size:14px;
font-weight:700;
}
.sample-format-static>span{display:block}
.sample-format-static>strong{
min-height:44px;
display:flex;
align-items:center;
padding:0 13px;
border:1px solid #dcd9d3;
background:#f7f7f4;
color:#1d1f1b;
font-size:14px;
}
.sample-modal-form + .wpcf7-response-output {
margin-top: 18px !important;
}
.gallery-page-section{
padding:68px 0 76px;
}
.gallery-page-head{
max-width:780px;
margin:0 auto 38px;
text-align:center;
}
.gallery-page-head .section-label{margin-left:auto;margin-right:auto}
.gallery-page-head h1{
margin:0;
font-size:clamp(38px,4vw,54px);
line-height:1.03;
letter-spacing:-.04em;
}
.gallery-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:14px;
}
.gallery-item{
position:relative;
display:block;
width:100%;
aspect-ratio:4/3;
padding:0;
border:0;
overflow:hidden;
background:#ececea;
cursor:zoom-in;
}
.gallery-item img{
width:100%;
height:100%;
object-fit:cover;
transition:transform .45s ease,filter .25s ease;
}
.gallery-item:after{
content:"";
position:absolute;
inset:0;
background:rgba(9,13,11,.06);
opacity:0;
transition:opacity .2s ease;
}
.gallery-item:hover img{transform:scale(1.025)}
.gallery-item:hover:after{opacity:1}
.gallery-item:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.gallery-lightbox{
position:fixed;
inset:0;
z-index:2900;
display:grid;
place-items:center;
padding:28px 72px;
opacity:0;
visibility:hidden;
pointer-events:none;
transition:opacity .2s ease,visibility .2s ease;
}
.gallery-lightbox.is-open{opacity:1;visibility:visible;pointer-events:auto}
.gallery-lightbox-backdrop{
position:absolute;
inset:0;
background:rgba(7,9,8,.91);
backdrop-filter:none;
}
.gallery-lightbox-stage{
position:relative;
z-index:1;
display:grid;
place-items:center;
width:min(1180px,calc(100vw - 144px));
height:min(780px,calc(100vh - 96px));
}
.gallery-lightbox-image{
display:block;
max-width:100%;
max-height:100%;
width:auto;
height:auto;
object-fit:contain;
box-shadow:0 18px 68px rgba(0,0,0,.34);
}
.gallery-lightbox-counter{
position:fixed;
z-index:3;
top:25px;
left:30px;
color:rgba(255,255,255,.82);
font-size:14px;
font-weight:800;
letter-spacing:.08em;
}
.gallery-lightbox-arrow,
.product-gallery-nav{
position:fixed;
z-index:4;
display:grid;
place-items:center;
padding:0;
border:0;
background:transparent;
color:#fff;
cursor:pointer;
opacity:.82;
transition:opacity .2s ease,transform .2s ease;
}
.product-gallery-nav, .gallery-lightbox-arrow{
top:50%;
width:52px;
height:72px;
transform:translateY(-50%);
}
.product-gallery-nav:active, .gallery-lightbox-arrow:active{transform:translateY(-50%) scale(.94)}
.product-gallery-prev, .gallery-lightbox-prev{left:12px}
.product-gallery-next, .gallery-lightbox-next{right:12px}
.product-gallery-nav:before, .gallery-lightbox-arrow:before{
content:"";
width:14px;
height:14px;
border-top:2.2px solid currentColor;
border-left:2.2px solid currentColor;
}
.product-gallery-prev:before, .gallery-lightbox-prev:before{transform:rotate(-45deg)}
.product-gallery-next:before, .gallery-lightbox-next:before{transform:rotate(135deg)}
.product-gallery-modal, .gallery-lightbox{position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:28px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease}
.product-gallery-modal.is-open, .gallery-lightbox.is-open{opacity:1;visibility:visible;pointer-events:auto}
.product-gallery-modal-backdrop, .gallery-lightbox-backdrop{position:absolute;inset:0;border:0;background:rgba(7,10,8,.92);cursor:zoom-out}
.product-gallery-modal-stage, .gallery-lightbox-stage{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;width:min(1120px,88vw);height:min(780px,84vh); margin: 0}
.product-gallery-modal-stage>img, .gallery-lightbox-stage>img{display:block;max-width:calc(100% - 120px);max-height:100%;width:auto;height:auto;object-fit:contain;box-shadow:0 20px 70px rgba(0,0,0,.35)}
.product-gallery-modal-close, .gallery-lightbox-close{position:absolute;top:16px;right:16px;width:40px;height:40px;border:0;background:transparent;color:rgba(255,255,255,.88);cursor:pointer;transition: color .22s ease, opacity .22s ease, transform .22s ease}
.product-gallery-modal-close:hover, .gallery-lightbox-close:hover {
color: #FFF;
transform: rotate(90deg);
}
.product-gallery-modal-close span, .gallery-lightbox-close span{position:absolute;left:9px;top:19px;width:22px;height:1.6px;background:currentColor}
.product-gallery-modal-close span:first-child, .gallery-lightbox-close span:first-child{transform:rotate(45deg)}
.product-gallery-modal-close span:last-child, .gallery-lightbox-close span:last-child {transform:rotate(-45deg)}
.product-gallery-nav, .gallery-lightbox-arrow{position:absolute;top:50%;z-index:3;width:52px;height:52px;margin:0px;border:0;background:transparent;color:rgba(255,255,255,.82);font-size:0;font-weight:300;line-height:1;cursor:pointer}
.product-gallery-prev, .gallery-lightbox-prev{left:18px}
.product-gallery-prev:hover, .gallery-lightbox-prev:hover{transform: translateY(-50%) translateX(-2px);}
.product-gallery-next, .gallery-lightbox-next{right:18px}
.product-gallery-next:hover, .gallery-lightbox-next:hover{transform: translateY(-50%) translateX(2px);}
.product-gallery-modal-counter, .gallery-lightbox-counter{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);color:#aab0ab;font-size:14px;letter-spacing:.12em;display: none;}
.about-page-section {
padding: 74px 0 78px;
background: #FFFFFF;
}
.about-page-layout {
display: grid;
grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
gap: clamp(54px, 7vw, 108px);
align-items: center;
}
.about-page-copy h2 {
max-width: 640px;
margin: 0 0 22px;
font-size: clamp(36px, 3.4vw, 50px);
line-height: 1.05;
}
.about-page-copy>p:not(.section-label) {
max-width: 650px;
margin: 0 0 14px;
color: #505050;
font-size: 15.5px;
line-height: 1.65;
}
.about-page-facts {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0;
margin-top: 30px;
border-top: 1px solid #dededb;
border-bottom: 1px solid #dededb;
}
.about-page-facts>div {
min-width: 0;
padding: 18px 18px 18px 0;
}
.about-page-facts>div+div {
padding-left: 18px;
border-left: 1px solid #dededb;
}
.about-page-facts span {
display: block;
margin-bottom: 6px;
color: #8b8b88;
font-size: 14px;
font-weight: 800;
letter-spacing: .12em;
text-transform: uppercase;
}
.about-page-facts strong {
display: block;
color: #202020;
font-size: 14px;
line-height: 1.45;
}
.about-page-media {
position: relative;
min-height: 470px;
overflow: hidden;
background: #e8e8e5;
}
.about-page-media>img {
width: 100%;
height: 100%;
min-height: 470px;
object-fit: cover;
cursor: zoom-in;
}
.about-page-logo {
position: absolute;
left: 24px;
bottom: 24px;
display: grid;
place-items: center;
width: 164px;
height: 98px;
padding: 12px 16px;
background: rgba(255, 255, 255, .94);
box-shadow: 0 12px 34px rgba(0, 0, 0, .12);
}
.about-page-logo img {
width: 136px;
height: auto;
max-height: 80px;
object-fit: contain;
object-position: center;
cursor: zoom-in;
}
.cooperation-section {
background: var(--dark);
color: #fff;
padding: 62px 0 66px;
}
.cooperation-heading {
width: min(100%, 760px);
margin: 0 auto 40px;
text-align: center;
}
.cooperation-heading h2 {
max-width: 720px;
margin: 0 auto 13px;
font-size: clamp(34px, 3vw, 45px);
line-height: 1.06;
letter-spacing: -.035em;
}
.cooperation-heading>p:last-child {
max-width: 620px;
margin: 0 auto;
color: #b9bfbb;
font-size: 15px;
line-height: 1.55;
}
.benefits-grid {
width: 100%;
max-width: 1180px;
margin: 0 auto;
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: clamp(30px, 4vw, 56px);
padding-top: 0;
}
.benefit-item {
display: grid;
grid-template-columns: 31px minmax(0, 1fr);
gap: 14px;
align-items: start;
min-width: 0;
}
.benefit-item>img {
width: 26px;
height: 26px;
margin: 2px 0 0;
object-fit: contain;
}
.benefit-item h3 {
margin: 0 0 7px;
font-size: 17px;
line-height: 1.25;
letter-spacing: -.02em;
}
.benefit-item p {
margin: 0;
color: #adb4af;
font-size: 14px;
line-height: 1.52;
}
.about-team-section {
background: var(--soft);
padding: 78px 0;
}
.about-team-layout {
display: grid;
grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
gap: clamp(52px, 7vw, 104px);
align-items: center;
}
.about-team-media {
height: 520px;
overflow: hidden;
background: #dededb;
}
.about-team-media img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
cursor: zoom-in;
}
.about-team-copy h2 {
margin: 0 0 20px;
font-size: clamp(36px, 3.2vw, 48px);
line-height: 1.05;
}
.about-team-copy>p:not(.section-label) {
max-width: 590px;
margin: 0;
color: #4f4f4f;
font-size: 15.5px;
line-height: 1.68;
}
.about-team-points {
display: flex;
flex-wrap: wrap;
gap: 9px 22px;
margin-top: 27px;
}
.about-team-points span {
position: relative;
padding-left: 13px;
color: #232323;
font-size: 14px;
font-weight: 700;
}
.about-team-points span:before {
content: "";
position: absolute;
left: 0;
top: .68em;
width: 4px;
height: 4px;
border-radius: 50%;
background: var(--accent);
transform: translateY(-50%);
}
.delivery-copy-section {
margin-bottom: 34px;
}
.delivery-packaging-copy {
position: relative;
padding: 4px 0 8px;
margin: 0 0 34px;
color: #474b47;
font-size: 15.5px;
line-height: 1.62;
}
.delivery-packaging-copy p {
margin: 0 0 18px;
}
.delivery-packaging-copy > p.section-label,
.delivery-split-head> p.section-label {
margin-bottom: 9px;
}
.delivery-copy-section h2, .delivery-split-head h2 {
margin: 0 0 12px;
font-size: clamp(24px,2.6vw,32px);
line-height: 1.12;
letter-spacing: -.03em;
}
.delivery-copy-section>p:not(.section-label), .delivery-split-head>p:not(.section-label) {
color: #555b56;
}
.delivery-packaging-copy p:last-child,
.delivery-split-head>p:last-child {
margin-bottom: 0;
}
.delivery-split-block {
margin: 0 0 22px;
padding: 28px 30px 26px;
background: #fff;
border: 1px solid #e3ded6;
border-top: 3px solid var(--accent);
}
.delivery-split-head {
max-width: 700px;
margin-bottom: 22px;
}
.delivery-methods-minimal, .delivery-payment-minimal {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0 28px;
}
.delivery-payment-minimal {
grid-template-columns: 1fr;
}
.delivery-methods-minimal article, .delivery-payment-minimal article {
min-width: 0;
padding: 18px 0 19px;
border-top: 1px solid #dedad3;
}
.delivery-payment-minimal article {
max-width: 680px;
}
.delivery-methods-minimal h3, .delivery-payment-minimal h3 {
margin: 0 0 7px;
font-size: 17px;
line-height: 1.3;
color: var(--ink);
}
.delivery-methods-minimal p, .delivery-payment-minimal p {
margin: 0;
color: #5c615c;
font-size: 14px;
line-height: 1.58;
}
.delivery-methods-minimal .button, .delivery-payment-minimal .button {
margin-top: 13px;
}
.delivery-split-note {
margin: 16px 0 0;
color: #747974;
font-size: 14px;
line-height: 1.55;
}
.delivery-split-note p {
margin: 16px 0 0;
}
.delivery-split-note p:first-child {
margin-top: 0;
}
.delivery-split-block--payment {
background: #f7f7f4;
border: 1px solid #e3e0da;
border-top: 3px solid #171917;
}
.delivery-bank-details {
display: grid;
grid-template-columns: 1.25fr 1fr .65fr;
margin: 8px 0 0;
padding: 0;
border-top: 1px solid #d8d5cf;
border-bottom: 1px solid #d8d5cf;
}
.delivery-bank-details div {
min-width: 0;
padding: 15px 16px 15px 0;
}
.delivery-bank-details div+div {
padding-left: 16px;
border-left: 1px solid #d8d5cf;
}
.delivery-bank-details dt {
margin: 0 0 4px;
color: #858983;
font-size: 14px;
font-weight: 800;
letter-spacing: .1em;
text-transform: uppercase;
}
.delivery-bank-details dd {
margin: 0;
color: #171917;
font-size: 14px;
font-weight: 800;
line-height: 1.45;
overflow-wrap: anywhere;
}
.delivery-after-send {
margin-top: 34px;
padding-top: 28px;
border-top: 1px solid #dedbd5;
}
.delivery-after-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 22px 30px;
margin: 19px 0 8px;
}
.delivery-after-grid h3 {
margin: 0 0 7px;
font-size: 16px;
}
.delivery-after-grid p {
margin: 0;
color: #5b605b;
font-size: 14px;
line-height: 1.58;
}
.delivery-after-send>p:last-child {
margin: 17px 0 0;
color: #5b605b;
font-size: 14px;
}
.content-legal-help {
margin-top: 28px;
padding: 24px 28px;
background: #0c100d;
color: #fff;
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
}
.content-legal-help strong {
display: block;
margin-bottom: 8px;
color: #fff;
font-size: 22px;
line-height: 1.15;
}
.content-legal-help p {
color: #c9cec9;
max-width: 720px;
margin: 0 auto 8px;
}
.content-legal-help .button {
margin-top: 2px;
}
.contact-page-section {
padding: 68px 0 76px;
background: #FFF;
}
.contact-page-head {
max-width: 760px;
margin: 0 auto 38px;
text-align: center;
}
.contact-page-head h1 {
margin: 0 0 15px;
font-size: clamp(38px,4vw,54px);
line-height: 1.03;
letter-spacing: -.04em;
}
.contact-page-head>p:last-child {
max-width: 760px;
margin: 0 auto;
color: #5a5a5a;
font-size: 15.5px;
line-height: 1.6;
}
.contact-page-layout {
display: grid;
grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr);
align-items: stretch;
box-shadow: 0 16px 50px rgba(0,0,0,.055);
}
.contact-info-card {
padding: 42px 40px;
background: var(--dark);
color: #FFF;
}
.contact-info-card h2 {
max-width: 360px;
margin: 0;
font-size: clamp(30px,2.65vw,40px);
line-height: 1.08;
}
.contact-info-list {
display: grid;
align-items: start;
margin-top: 38px;
gap: 24px;
}
.contact-info-group {
display: grid;
gap: 7px;
align-items: start;
grid-auto-rows: max-content;
}
.contact-info-group>span, .contact-address-block>span {
color: #9da49f;
font-size: 14px;
font-weight: 800;
letter-spacing: .13em;
text-transform: uppercase;
}
.contact-info-group>a {
color: #fff;
font-size: 14px;
font-weight: 700;
line-height: 1.35;
white-space: normal;
width: auto;
overflow-wrap: anywhere;
max-width: 100%;
transition: color .2s ease;
}
.contact-info-group>a:hover {
color: var(--accent);
}
.contact-socials {
display: flex;
gap: 10px;
margin-top: 2px;
gap: 12px;
}
.contact-socials a {
display: grid;
place-items: center;
opacity: .9;
transition: transform .2s ease, opacity .2s ease;
}
.contact-socials a:hover {
opacity: 1;
transform: translateY(-1px);
}
.contact-socials a.social-mobile {
display: none;
}
.contact-socials img {
width: 22px;
height: 22px;
}
.contact-address-inline strong {
font-size: 14px;
line-height: 1.55;
}
.contact-hours-group strong {
font-size: 15px;
}
.contact-form-panel {
padding: 42px 46px;
background: var(--soft);
border: 1px solid #e6e6e2;
border-left: 0;
display: flex;
flex-direction: column;
justify-content: center;
}
.contact-page-form {
margin: 0;
width: 100%;
display: grid;
gap: 19px;
}
.contact-page-form textarea {
height: 112px;
min-height: 112px;
max-height: 112px;
}
.contact-form-submit{
display:flex;
align-items:center;
gap:22px;
margin-top:4px;
}
.contact-form-submit>p{
max-width:330px;
margin:0;
color:#777;
font-size:14px;
line-height:1.5;
}
.contact-form-submit a{text-decoration:underline;text-underline-offset:2px}
.contact-page-form + .wpcf7-response-output {
margin-top: 18px !important;
}
.reviews-page-section {
background: #fff;
padding: 72px 0 88px;
}
.reviews-page-head {
max-width: 760px;
margin-bottom: 34px;
}
.reviews-page-head h1 {
margin: 0 0 15px;
font-size: clamp(42px, 4.5vw, 64px);
line-height: 1;
letter-spacing: -.045em;
}
.reviews-page-head>p:last-child {
max-width: 680px;
margin: 0;
color: #5e635e;
font-size: 15px;
line-height: 1.65;
}
.reviews-page-layout {
display: grid;
grid-template-columns: minmax(0,1.45fr) minmax(320px,.55fr);
gap: 34px;
align-items: start;
}
.reviews-page-summary {
display: flex;
align-items: center ;
justify-content: space-between;
gap: 24px;
margin-bottom: 14px;
padding: 20px 22px;
border: 1px solid #090d0b;
background: #090d0b;
color: #FFF;
}
.reviews-summary-count, .reviews-summary-score {
display: flex;
align-items: baseline;
gap: 9px;
}
.reviews-summary-count strong, .reviews-summary-score strong {
font-size: 30px;
line-height: 1;
color: #fff;
}
.reviews-summary-count span {
color: #c5cbc6;
font-size: 14px;
}
.reviews-summary-score span {
font-size: 18px;
letter-spacing: 2px;
color: var(--accent);
}
.reviews-page-card {
padding: 22px 24px 24px;
border: 1px solid #e1ded8;
background: #fff;
border-top: 0;
}
.reviews-page-summary + .reviews-page-card {
border-top: 1px solid #e1ded8;
}
.reviews-page-card-top {
display: flex;
align-items: center;
justify-content: space-between;
gap: 18px;
margin-bottom: 12px;
}
.reviews-page-card-top strong {
font-size: 16px;
}
.reviews-page-card-top span {
color: var(--accent);
font-size: 15px;
letter-spacing: 1;
white-space: nowrap;
}
.reviews-page-card p {
max-width: 720px;
margin: 0;
color: #555b55;
font-size: 14px;
line-height: 1.68;
}
.reviews-page-form-panel {
position: sticky;
top: calc(var(--header) + 24px);
padding: 27px 28px 29px;
border: 1px solid #171917;
background: #fff;
}
.reviews-page-form-panel h2 {
font-size: 30px;
line-height: 1.08;
margin: 0 0 10px;
color: #171917;
}
.reviews-page-form-panel>p:not(.section-label) {
font-size: 14px;
line-height: 1.55;
margin: 0 0 22px;
color: #5a5f5a;
}
.reviews-page-form {
display: grid;
gap: 16px;
}
.reviews-page-form label{
display:grid;
gap:7px;
}
.reviews-page-form > label>span:first-child,
.reviews-rating-field legend{
font-size: 14px;
text-transform: uppercase;
letter-spacing: .1em;
font-weight: 800;
color: #5d5d5d;
}
.reviews-page-form input:not([type="submit"]),
.reviews-page-form textarea{
width:100%;
border:1px solid #d7d4ce;
background:#fff;
padding:12px 13px;
color:#171917;
font:inherit;
font-weight: 400;
outline:none;
}
.reviews-page-form input:not([type="submit"]):focus,
.reviews-page-form textarea:focus{
border-color:var(--accent);
}
.reviews-rating-field{
margin:0;
padding:0;
border:0;
}
.reviews-rating-field legend{
margin-bottom:8px;
padding: 0;
}
.reviews-rating-picker{
display:flex;
flex-direction:row-reverse;
justify-content:flex-end;
width:max-content;
}
.reviews-rating-picker .wpcf7-list-item{
margin:0;
}
.reviews-rating-picker input{
position:absolute;
opacity:0;
pointer-events:none;
}
.reviews-rating-picker label{
display:block;
padding-right:4px;
color:var(--accent);
font-size:30px;
line-height:1;
cursor:pointer;
}
.reviews-rating-picker .wpcf7-list-item-label{
display:none;
}
.reviews-rating-picker label::before{
content:"☆";
} .reviews-rating-picker .wpcf7-list-item:hover,
.reviews-rating-picker .wpcf7-list-item:hover ~ .wpcf7-list-item{
color:var(--accent);
}
.reviews-rating-picker .wpcf7-list-item:hover label::before,
.reviews-rating-picker .wpcf7-list-item:hover ~ .wpcf7-list-item label::before{
content:"★";
} .reviews-rating-picker .wpcf7-list-item:has(input:checked),
.reviews-rating-picker .wpcf7-list-item:has(input:checked) ~ .wpcf7-list-item{
color:var(--accent);
}
.reviews-rating-picker .wpcf7-list-item:has(input:checked) label::before,
.reviews-rating-picker .wpcf7-list-item:has(input:checked) ~ .wpcf7-list-item label::before{
content:"★";
}
.reviews-form-note {
margin: -4px 0 0;
color: #7a7e79;
font-size: 14px;
line-height: 1.4;
}
.reviews-page-form + .wpcf7-response-output {
margin-top: 18px !important;
}
.simple-state-section {
background: #fff;
min-height: calc(100vh - var(--header) - 120px);
display: flex;
align-items: center;
padding: 86px 0 96px;
}
.simple-state-shell {
width: min(calc(100% - 64px), 880px);
text-align: center;
}
.simple-state-shell h1 {
margin: 0 auto 19px;
max-width: 760px;
font-size: clamp(42px, 5vw, 68px);
line-height: 1;
letter-spacing: -.05em;
}
.simple-state-shell>p:not(.section-label):not(.error-code) {
max-width: 650px;
margin: 0 auto 30px;
color: #555;
font-size: 16px;
line-height: 1.65;
}
@media (max-width: 1399px) {
.about-page-layout {
grid-template-columns: minmax(0, .9fr) minmax(0, 1fr);
gap: clamp(36px, 3vw, 60px);
}
}
@media (max-width: 1199px) {
.products-catalog-section,
.why-granite-section {
padding: 60px 0 64px;
}
.why-granite-grid {
row-gap: 24px;
grid-template-columns: repeat(3,minmax(0,1fr));
}
.about-page-section {
padding: 66px 0 70px;
}
.about-page-media {
min-height: 430px;
}
.cooperation-section {
padding: 56px 0 60px;
}
.about-team-section {
padding: 68px 0;
}
.about-team-layout {
gap: 46px;
}
.about-team-media {
width: 470px;
}
.page-section {
padding: 48px 0 68px;
}
.contact-page-layout {
grid-template-columns: minmax(280px,.82fr) minmax(0,1.18fr);
}
.contact-info-card,
.contact-form-panel {
padding: 38px 34px;
}
}
@media (max-width: 991px) {
.products-catalog-section {
padding: 52px 0 56px;
}
.products-catalog-head {
display: block;
margin-bottom: 30px;
}
.products-catalog-head>p {
max-width: 100%;
margin-top: 16px;
}
.stone-sample-card {
grid-template-columns: 230px auto;
}
.stone-sample-copy {
padding: 34px clamp(34px,4.2vw,64px);
}
.why-granite-section {
padding: 52px 0 56px;
}
.why-granite-grid {
gap: 23px 34px;
grid-template-columns: repeat(2,minmax(0,1fr));
}
.gallery-page-section {
padding: 56px 0 62px;
}
.gallery-page-head {
margin-bottom: 30px;
}
.gallery-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.about-page-section {
padding: 58px 0 62px;
}
.about-page-layout {
grid-template-columns: 1fr;
gap: 32px;
}
.cooperation-section {
padding: 50px 0 54px;
}
.cooperation-heading {
margin-bottom: 30px;
}
.benefits-grid {
grid-template-columns: 1fr;
gap: 0;
}
.benefit-item {
grid-template-columns:  31px minmax(0, 1fr);
gap: 15px;
padding: 18px 0;
border-top: 1px solid rgba(255, 255, 255, .12);
}
.benefit-item:first-child {
border-top: 0;
padding-top: 0;
}
.about-team-section {
padding: 58px 0;
}
.about-team-layout {
grid-template-columns: 1fr;
gap: 32px;
}
.about-team-media {
height: 430px;
width: 100%;
}
.contact-page-section-only {
padding: 56px 0 62px;
}
.contact-page-head {
margin-bottom: 30px;
}
.contact-page-layout {
grid-template-columns: 1fr;
box-shadow: 0 16px 50px rgba(0,0,0,.055);
}
.contact-info-list {
margin-top: 30px;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: flex-start;
}
.contact-info-group {
align-self: start;
}
.contact-info-group:last-child {
grid-column: 1 / -1;
}
.contact-form-panel {
border-left: 1px solid #e6e6e2;
border-top: 0;
}
.reviews-page-layout {
grid-template-columns: 1fr;
}
.reviews-page-form-panel {
position: relative;
top: 0;
}
}
@media (max-width: 767px) {
.stone-sample-section {
padding: 46px 0;
}
.stone-sample-card {
height: auto;
display: block;
}
.stone-sample-media {
height: 210px;
min-height: auto;
}
.stone-sample-copy {
padding: 24px;
}
.wc-block-components-notice-banner__content .button, .woocommerce-message .button, .woocommerce-info .button, .woocommerce-error .button {
float: none;
margin-left: 0;
margin-top: 12px;
display: block;
width: max-content;
max-width: 100%;
}
.gallery-page-section {
padding: 46px 0 52px;
}
.gallery-page-head {
margin-bottom: 26px;
}
.gallery-page-head h1 {
font-size: 36px;
}
.gallery-grid {
gap: 9px;
}
.products-catalog-head {
text-align: center;
margin-bottom: 27px;
}
.products-catalog-head>p {
margin: 13px auto 0;
font-size: 14px;
}
.product-color-filter {
justify-content: center;
margin-bottom: 26px;
}
.products-catalog-head h2 {
font-size: 32px;
}
.about-page-section {
padding: 48px 0 52px;
}
.about-page-copy h2 {
font-size: 34px;
margin-bottom: 17px;
}
.about-page-copy>p:not(.section-label) {
font-size: 14.5px;
line-height: 1.6;
}
.about-page-facts {
grid-template-columns: 1fr;
margin-top: 24px;
}
.about-page-facts>div {
padding: 14px 0;
}
.about-page-facts>div+div {
padding-left: 0;
border-left: 0;
border-top: 1px solid #dededb;
}
.about-page-media {
height: 350px;
min-height: auto;
}
.about-page-media>img {
min-height: auto;
}
.cooperation-section {
padding: 44px 0 47px;
}
.cooperation-heading {
max-width: 560px;
margin-bottom: 25px;
}
.cooperation-heading h2 {
font-size: 32px;
line-height: 1.08;
margin-bottom: 11px;
}
.cooperation-heading>p:last-child {
max-width: 500px;
font-size: 14px;
line-height: 1.5;
}
.benefits-grid {
max-width: 560px;
}
.benefit-item {
padding: 16px 0;
grid-template-columns: 29px minmax(0, 1fr);
gap: 13px;
}
.benefit-item>img {
width: 24px;
height: 24px;
}
.benefit-item h3 {
font-size: 16.5px;
margin-bottom: 5px;
}
.about-team-section {
padding: 50px 0;
}
.about-team-media {
height: 350px;
}
.about-team-copy h2 {
font-size: 33px;
margin-bottom: 16px;
}
.about-team-copy>p:not(.section-label) {
font-size: 14.5px;
line-height: 1.6;
}
.about-team-points {
display: grid;
gap: 8px;
margin-top: 21px;
}
.why-granite-grid {
display: grid;
grid-template-columns: 1fr;
gap: 0;
}
.delivery-split-block {
padding: 24px;
}
.delivery-methods-minimal, .delivery-payment-minimal, .delivery-bank-details, .delivery-after-grid {
grid-template-columns: 1fr;
}
.delivery-methods-minimal .button, .delivery-payment-minimal .button {
width: 100%;
}
.delivery-bank-details div+div {
border-left: none;
padding-left: 0;
border-top: 1px solid #d8d5cf;
}
.contact-page-head {
margin-bottom: 26px;
}
.contact-info-card {
padding: 31px 26px;
}
.contact-info-card h2, .contact-form-panel h2, .contact-address-card h2 {
font-size: 30px;
}
.contact-info-list {
grid-template-columns: 1fr;
gap: 24px;
margin-top: 28px;
}
.contact-form-panel {
padding: 31px 26px;
}
.contact-form-submit {
align-items: center;
flex-direction: column;
gap: 13px;
}
.contact-form-submit .button {
width: 100%;
}
.contact-form-submit>p {
text-align: center;
}
.simple-state-section {
padding: 70px 0 78px;
}
.simple-state-shell h1 {
font-size: 40px;
}
.reviews-page-section {
padding: 52px 0 60px;
}
.reviews-page-head {
margin-bottom: 25px;
}
.reviews-page-head h1 {
font-size: 38px;
}
.reviews-page-summary {
padding: 17px 18px;
}
.reviews-page-card {
padding: 19px 18px 21px;
}
.reviews-page-form-panel {
padding: 23px 20px 24px;
}
.about-page-logo {
width: 144px;
height: 88px;
}
.about-page-logo img {
width: 118px;
max-height: 72px;
}
.content-legal-help {
padding: 22px 20px;
}
.content-legal-help strong {
font-size: 20px;
}
.sample-modal-row {
grid-template-columns: 1fr;
}
}
@media (max-width: 575px) {
.page-container {
width: min(calc(100% - 26px), var(--container));
}
.products-catalog-head h2 {
font-size: 28px;
}
.gallery-grid {
grid-template-columns: 1fr;
gap: 9px;
}
.about-page-copy h2 {
font-size: 30px;
}
.about-page-media {
height: 300px;
}
.cooperation-heading h2,
.why-granite-head h2,
.about-team-copy h2 {
font-size: 29px;
}
.simple-state-actions {
flex-direction: column;
}
.simple-state-actions {
max-width: 220px;
margin-left: auto;
margin-right: auto;
}
.simple-state-shell h1,
.simple-state-wrap h1 {
font-size: 34px;
}
.simple-state-shell>p:not(.section-label):not(.error-code),
.simple-state-wrap>p:not(.section-label):not(.error-code) {
font-size: 14.5px;
}
}