GLOBAL PATCH
This commit is contained in:
Joe_Peach committed
1 parent
78b8ff61a7
commit
df3165dac0
31 files changed
+1678
-1323
No files matched your search
@@ -0,0 +1,233 @@
|
||||
.page {
|
||||
width: 100%;
|
||||
min-height: 70vh;
|
||||
padding: 126px 20px 96px;
|
||||
background: #ffffff;
|
||||
box-sizing: border-box;
|
||||
color: #151515;
|
||||
}
|
||||
|
||||
.hero,
|
||||
.mapBlock {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.hero {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) minmax(360px, 0.82fr);
|
||||
gap: 56px;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.heroText {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.kicker {
|
||||
display: inline-block;
|
||||
margin-bottom: 16px;
|
||||
color: var(--lightblue);
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.hero h1 {
|
||||
max-width: 760px;
|
||||
margin: 0;
|
||||
color: #111111;
|
||||
font-size: clamp(38px, 5vw, 64px);
|
||||
line-height: 1.06;
|
||||
}
|
||||
|
||||
.hero p {
|
||||
max-width: 640px;
|
||||
margin: 26px 0 0;
|
||||
color: #3f4652;
|
||||
font-size: 19px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.contactPanel {
|
||||
display: grid;
|
||||
gap: 18px;
|
||||
padding: 28px;
|
||||
border: 1px solid #e7ebf0;
|
||||
border-radius: 8px;
|
||||
background: linear-gradient(135deg, #f7fbff 0%, #ffffff 62%, #fff7cf 100%);
|
||||
box-shadow: 0 18px 50px rgba(17, 31, 51, 0.07);
|
||||
}
|
||||
|
||||
.contactItem {
|
||||
display: grid;
|
||||
grid-template-columns: 52px minmax(0, 1fr);
|
||||
gap: 16px;
|
||||
padding: 20px;
|
||||
border: 1px solid #e7ebf0;
|
||||
border-radius: 8px;
|
||||
background: rgba(255, 255, 255, 0.84);
|
||||
}
|
||||
|
||||
.icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 52px;
|
||||
height: 52px;
|
||||
border-radius: 8px;
|
||||
background: #fff2a6;
|
||||
color: #111111;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
color: #77808c;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.06em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.contactItem p {
|
||||
margin: 0;
|
||||
color: #202733;
|
||||
font-size: 18px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.contactItem a {
|
||||
color: #151515;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
transition: color 0.2s ease;
|
||||
}
|
||||
|
||||
.contactItem a:hover {
|
||||
color: var(--darkblue);
|
||||
}
|
||||
|
||||
.links {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.mapBlock {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 24px;
|
||||
margin-top: 42px;
|
||||
padding: 30px;
|
||||
border: 1px solid #e7ebf0;
|
||||
border-radius: 8px;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.mapPlaceholder {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 18px;
|
||||
min-width: 0;
|
||||
color: #202733;
|
||||
}
|
||||
|
||||
.mapPlaceholder svg {
|
||||
flex: 0 0 auto;
|
||||
color: var(--lightblue);
|
||||
font-size: 34px;
|
||||
}
|
||||
|
||||
.mapPlaceholder strong,
|
||||
.mapPlaceholder span {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.mapPlaceholder strong {
|
||||
font-size: 20px;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.mapPlaceholder span {
|
||||
margin-top: 4px;
|
||||
color: #596474;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.mapLink {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 0 0 auto;
|
||||
min-height: 50px;
|
||||
padding: 0 24px;
|
||||
border-radius: 50px;
|
||||
background: #ffd400;
|
||||
color: #111111;
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
transition: background 0.2s ease, transform 0.2s ease;
|
||||
}
|
||||
|
||||
.mapLink:hover {
|
||||
background: #ffe667;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
@media (max-width: 980px) {
|
||||
.page {
|
||||
padding-top: 104px;
|
||||
}
|
||||
|
||||
.hero {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 34px;
|
||||
}
|
||||
|
||||
.mapBlock {
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 560px) {
|
||||
.page {
|
||||
padding: 92px 16px 72px;
|
||||
}
|
||||
|
||||
.hero h1 {
|
||||
font-size: 34px;
|
||||
}
|
||||
|
||||
.hero p {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.contactPanel {
|
||||
padding: 18px;
|
||||
}
|
||||
|
||||
.contactItem {
|
||||
grid-template-columns: 1fr;
|
||||
padding: 18px;
|
||||
}
|
||||
|
||||
.mapBlock {
|
||||
padding: 22px;
|
||||
}
|
||||
|
||||
.mapPlaceholder {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.mapLink {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user