726 lines
No EOL
19 KiB
CSS
726 lines
No EOL
19 KiB
CSS
:root{
|
|
--bg:#FAFAFA;
|
|
--accent:#C4622A;
|
|
--heading:#1F1F1D;
|
|
--logo:#000000;
|
|
--text:#5A5A56;
|
|
--border: rgba(31,31,29,0.14);
|
|
--card-bg:#F0F0EE;
|
|
--transition: 0.35s ease;
|
|
|
|
/* Hero animation tuning — see comments in .hero block below */
|
|
--hero-logo-size: clamp(64px, 12vw, 140px);
|
|
--hero-tagline-ratio: calc(15 / 140);
|
|
--hero-tagline-fit: 1;
|
|
--hero-max-scale: 2.2;
|
|
--hero-max-scale-mobile: 1.6;
|
|
--hero-active-scale: var(--hero-max-scale);
|
|
--hero-scroll-runway-multiplier: 12;
|
|
--hero-brand-gap: 48px;
|
|
--hero-stage-offset: 28px;
|
|
--hero-bottom-gap: 80px;
|
|
--site-header-height: 57px;
|
|
}
|
|
|
|
[data-theme="dark"]{
|
|
--bg:#141412;
|
|
--accent:#C4622A;
|
|
--heading:#F2F1EE;
|
|
--logo:#FFFFFF;
|
|
--text:#B4B2AC;
|
|
--border: rgba(255,255,255,0.14);
|
|
--card-bg: rgba(255,255,255,0.04);
|
|
}
|
|
|
|
*{box-sizing:border-box;}
|
|
html,body{margin:0;padding:0;}
|
|
|
|
body{
|
|
font-family:'Inter', -apple-system, sans-serif;
|
|
font-size:16px;
|
|
font-weight:300;
|
|
line-height:1.6;
|
|
background:var(--bg);
|
|
color:var(--text);
|
|
-webkit-font-smoothing:antialiased;
|
|
-moz-osx-font-smoothing:grayscale;
|
|
transition: background var(--transition), color var(--transition);
|
|
overflow-x:hidden;
|
|
}
|
|
|
|
.container {
|
|
max-width: 1120px;
|
|
margin: 0 auto;
|
|
padding: 0 24px;
|
|
width: 100%;
|
|
}
|
|
|
|
h1,h3,h5{
|
|
color:var(--heading);
|
|
font-weight:600;
|
|
margin:0 0 16px;
|
|
}
|
|
|
|
h2{
|
|
color:var(--heading);
|
|
font-size:clamp(36px, 5vw, 56px);
|
|
font-weight:200;
|
|
line-height:1.18;
|
|
letter-spacing:-0.005em;
|
|
margin:0 0 28px;
|
|
}
|
|
|
|
h4{
|
|
color:var(--text);
|
|
font-weight:400;
|
|
margin:0 0 16px;
|
|
}
|
|
|
|
a{color:var(--accent); text-decoration:none; transition:opacity var(--transition);}
|
|
a:hover{opacity:0.7;}
|
|
|
|
.fw-400{font-weight:400;}
|
|
|
|
/* Header */
|
|
.site-header{
|
|
position:sticky; top:0; z-index:50;
|
|
background:var(--bg);
|
|
border-bottom:1px solid var(--border);
|
|
transition: background var(--transition);
|
|
}
|
|
.header-inner{
|
|
display:flex; justify-content:space-between; align-items:center;
|
|
padding-top:16px;
|
|
padding-bottom:16px;
|
|
}
|
|
.lang-switch{font-size:13px; letter-spacing:0.05em; display:flex; align-items:center; gap:6px; line-height:1; transform:translateY(1px);}
|
|
.lang-switch a{
|
|
background:none; border:none; cursor:pointer; padding:0; margin:0;
|
|
color:var(--text); font-family:inherit; font-size:13px; font-weight:inherit;
|
|
line-height:1; display:inline-flex; align-items:center;
|
|
text-decoration:none;
|
|
transition: color var(--transition);
|
|
}
|
|
.lang-switch a.active{color:var(--accent); font-weight:500;}
|
|
|
|
.header-actions{
|
|
display:flex; align-items:center; gap:28px; line-height:1;
|
|
}
|
|
.home-link{
|
|
font-size:13px; letter-spacing:0.05em; line-height:1;
|
|
color:var(--text); text-decoration:none;
|
|
font-family:inherit; font-weight:400;
|
|
display:inline-flex; align-items:center;
|
|
transform:translateY(1px);
|
|
transition: color var(--transition);
|
|
}
|
|
.home-link:hover{color:var(--accent);}
|
|
|
|
.theme-toggle{
|
|
background:none; border:none; cursor:pointer; padding:0; margin:0;
|
|
color:var(--heading); display:inline-flex; align-items:center;
|
|
line-height:1;
|
|
}
|
|
.theme-toggle svg{fill:none; stroke:currentColor; stroke-width:1.5; display:block;}
|
|
[data-theme="light"] .icon-moon,
|
|
[data-theme="dark"] .icon-sun{display:none;}
|
|
|
|
/* Hero
|
|
Size: --hero-logo-size, --hero-active-scale (max render → scale down on scroll)
|
|
Motion: --hero-scroll-runway-multiplier — во сколько раз дольше скроллить (1 = как было)
|
|
Spacing: --hero-brand-gap — отступ под логотипом
|
|
--hero-stage-offset — отступ hero-stage от site-header
|
|
--hero-bottom-gap — отступ hero до следующей секции
|
|
Sticky: --site-header-height — высота шапки (JS) */
|
|
.hero{
|
|
--hero-max-scale:1.95;
|
|
--hero-active-scale:var(--hero-max-scale);
|
|
--hero-logo-size:clamp(60px, 11vw, 128px);
|
|
position:relative;
|
|
padding-top:var(--hero-stage-offset);
|
|
padding-bottom:var(--hero-bottom-gap);
|
|
text-align:left;
|
|
}
|
|
.hero-stage{
|
|
position:sticky;
|
|
top:calc(var(--site-header-height) + var(--hero-stage-offset));
|
|
z-index:1;
|
|
contain:layout style;
|
|
height:var(--hero-stage-height, auto);
|
|
}
|
|
.hero-brand{
|
|
position:relative;
|
|
left:0;
|
|
padding-bottom:var(--hero-brand-gap);
|
|
overflow:hidden;
|
|
contain:layout style;
|
|
height:var(--hero-brand-height, auto);
|
|
}
|
|
.hero-brand-inner{
|
|
position:absolute;
|
|
left:0;
|
|
top:0;
|
|
transform-origin:left top;
|
|
transform:translate3d(0, 0, 0) scale(var(--hero-scale, 1));
|
|
will-change:transform;
|
|
backface-visibility:hidden;
|
|
-webkit-backface-visibility:hidden;
|
|
}
|
|
.hero-brand-lockup{
|
|
display:inline-grid;
|
|
grid-template-columns:max-content;
|
|
}
|
|
.logo{
|
|
font-size:var(--hero-logo-size);
|
|
font-weight:600;
|
|
color:var(--logo);
|
|
letter-spacing:-0.03em;
|
|
line-height:0.9;
|
|
margin-bottom:8px;
|
|
}
|
|
.tagline{
|
|
font-size:calc(var(--hero-logo-size) * var(--hero-tagline-ratio) * var(--hero-tagline-fit, 1));
|
|
letter-spacing:0.08em;
|
|
text-transform:uppercase;
|
|
color:var(--text);
|
|
margin:0;
|
|
white-space:nowrap;
|
|
width:0;
|
|
min-width:100%;
|
|
}
|
|
@media (prefers-reduced-motion: no-preference){
|
|
.hero-brand-inner .logo{
|
|
font-size:calc(var(--hero-logo-size) * var(--hero-active-scale));
|
|
margin-bottom:calc(8px * var(--hero-active-scale));
|
|
}
|
|
.hero-brand-inner .tagline{
|
|
font-size:calc(var(--hero-logo-size) * var(--hero-tagline-ratio) * var(--hero-active-scale) * var(--hero-tagline-fit, 1));
|
|
}
|
|
}
|
|
@media (prefers-reduced-motion: no-preference) and (max-width:600px){
|
|
.hero-brand-inner .logo{
|
|
font-size:var(--hero-logo-size);
|
|
margin-bottom:8px;
|
|
}
|
|
.hero-brand-inner .tagline{
|
|
font-size:calc(var(--hero-logo-size) * var(--hero-tagline-ratio) * var(--hero-tagline-fit, 1));
|
|
}
|
|
}
|
|
.main-nav{
|
|
--nav-divider-inset:0;
|
|
display:grid;
|
|
grid-template-columns:repeat(4, 1fr);
|
|
gap:0;
|
|
width:100%;
|
|
border:1px solid var(--border);
|
|
padding:0;
|
|
}
|
|
.main-nav a{
|
|
position:relative;
|
|
display:flex;
|
|
align-items:center;
|
|
justify-content:center;
|
|
min-height:48px;
|
|
padding:1px 12px 0;
|
|
font-size:15px;
|
|
line-height:1;
|
|
color:var(--text);
|
|
letter-spacing:0.03em;
|
|
text-align:center;
|
|
}
|
|
.main-nav a:not(:nth-child(4n))::after{
|
|
content:'';
|
|
position:absolute;
|
|
right:0;
|
|
width:1px;
|
|
background:var(--border);
|
|
}
|
|
.main-nav a:nth-child(-n+4):not(:nth-child(4n))::after{
|
|
top:var(--nav-divider-inset);
|
|
bottom:0;
|
|
}
|
|
.main-nav a:nth-child(n+5):not(:nth-child(4n))::after{
|
|
top:0;
|
|
bottom:var(--nav-divider-inset);
|
|
}
|
|
.main-nav a:nth-child(-n+4)::before{
|
|
content:'';
|
|
position:absolute;
|
|
bottom:0;
|
|
left:0;
|
|
right:0;
|
|
height:1px;
|
|
background:var(--border);
|
|
}
|
|
.main-nav .nav-cta{color:var(--accent);}
|
|
|
|
/* Sections */
|
|
.section{
|
|
--section-padding-y:80px;
|
|
padding:var(--section-padding-y) 0;
|
|
border-top:1px solid var(--border);
|
|
scroll-margin-top:calc(var(--site-header-height) + 24px + var(--section-padding-y));
|
|
}
|
|
.eyebrow{
|
|
display:inline-block; font-size:17px; font-weight:400;
|
|
letter-spacing:0.1em;
|
|
color:var(--accent); text-transform:uppercase;
|
|
vertical-align:middle; margin-bottom:16px;
|
|
}
|
|
.section-labels{
|
|
display:flex; align-items:center; flex-wrap:wrap;
|
|
gap:12px; margin-bottom:16px;
|
|
}
|
|
.section-labels .eyebrow{margin-bottom:0;}
|
|
.section-labels .badge{margin-left:0;}
|
|
.badge{
|
|
display:inline-block; vertical-align:middle;
|
|
margin-left:12px; padding:4px 10px;
|
|
font-size:12px; border:1px solid var(--border); border-radius:4px;
|
|
color:var(--text);
|
|
}
|
|
.lead{
|
|
width:100%;
|
|
max-width:none;
|
|
margin-bottom:40px;
|
|
}
|
|
|
|
.numbered-list{list-style:none; margin:0 0 32px; padding:0;}
|
|
.numbered-list li{
|
|
display:grid;
|
|
grid-template-columns:28px 20px 1px 20px minmax(0, 1fr);
|
|
align-items:center;
|
|
padding:20px 0;
|
|
border-top:1px solid var(--border);
|
|
}
|
|
.numbered-list li::before{
|
|
content:'';
|
|
grid-column:3;
|
|
grid-row:1;
|
|
width:1px;
|
|
background:var(--border);
|
|
align-self:stretch;
|
|
}
|
|
.numbered-list li:first-child{border-top:none;}
|
|
.num{
|
|
grid-column:1;
|
|
display:flex;
|
|
align-items:center;
|
|
justify-content:center;
|
|
color:var(--accent);
|
|
font-weight:500;
|
|
}
|
|
.numbered-list p{grid-column:5; margin:0; line-height:1.7;}
|
|
|
|
.dash-list{list-style:none; padding:0; margin:0;}
|
|
.dash-list--block{margin-bottom:32px;}
|
|
.dash-list li{
|
|
position:relative; padding-left:28px; margin-bottom:14px;
|
|
}
|
|
.dash-list li::before{
|
|
content:"—"; position:absolute; left:0; color:var(--accent);
|
|
}
|
|
|
|
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-bottom:32px;}
|
|
.two-col h4{
|
|
font-size:15px; font-weight:600; color:var(--text);
|
|
line-height:1.3; margin-bottom:16px;
|
|
text-transform:uppercase; letter-spacing:0.05em;
|
|
}
|
|
|
|
.note-box{
|
|
background:var(--card-bg);
|
|
border-left:2px solid var(--accent);
|
|
padding:24px 28px;
|
|
}
|
|
.note-box:not(:last-child){margin-bottom:32px;}
|
|
.note-box p{margin:0 0 8px; line-height:1.6;}
|
|
.note-box p:last-child{margin:0;}
|
|
|
|
.numbered-list + .lead{margin-top:40px;}
|
|
|
|
.team-grid{
|
|
display:grid;
|
|
grid-template-columns:minmax(0, 1fr) minmax(0, 1.5fr) minmax(0, 0.72fr);
|
|
gap:0;
|
|
width:100%;
|
|
margin-top:32px;
|
|
}
|
|
.team-card{
|
|
text-align:left;
|
|
padding:0 32px;
|
|
border-right:1px solid var(--border);
|
|
}
|
|
.team-card:first-child{padding-left:0;}
|
|
.team-card--ivan{padding-left:40px; padding-right:40px;}
|
|
.team-card--andrey{
|
|
padding-left:24px;
|
|
padding-right:0;
|
|
border-right:none;
|
|
}
|
|
.team-card:last-child{
|
|
border-right:none;
|
|
padding-right:0;
|
|
}
|
|
.team-card h3{font-size:16px; line-height:1.2; margin-bottom:16px;}
|
|
.team-card ul{list-style:none; padding:0; margin:0;}
|
|
.team-card li{margin-bottom:6px; color:var(--text);}
|
|
|
|
.entry-options{margin-top:8px;}
|
|
.sublabel{
|
|
font-size:13px; text-transform:uppercase;
|
|
letter-spacing:0.05em; color:var(--text);
|
|
font-weight:600; display:block; margin-bottom:16px;
|
|
}
|
|
.sublabel-note{color:#9A9A94; font-weight:600;}
|
|
|
|
.more-link{font-size:inherit;}
|
|
|
|
.contact-section{text-align:center;}
|
|
.contact-section .eyebrow{margin-bottom:36px;}
|
|
.center{
|
|
display:flex; flex-direction:column; align-items:center;
|
|
gap:0;
|
|
}
|
|
.contact-section .center > p:first-of-type{margin:0 0 16px;}
|
|
.contact-section .center > p:nth-of-type(2){margin:0 0 36px;}
|
|
.btn-outline{
|
|
border:1px solid var(--accent); color:var(--accent);
|
|
padding:12px 28px; border-radius:4px; font-size:14px; font-weight:400;
|
|
margin-bottom:28px;
|
|
transition: background var(--transition), color var(--transition);
|
|
}
|
|
.btn-outline:hover{background:var(--accent); color:#fff; opacity:1;}
|
|
.link-underline{
|
|
background:none; border:none; cursor:pointer;
|
|
color:var(--text); text-decoration:underline; font-family:inherit; font-size:13px;
|
|
}
|
|
|
|
/* Footer */
|
|
.site-footer{
|
|
border-top:1px solid var(--border);
|
|
padding:48px 0 24px;
|
|
font-size:13px;
|
|
}
|
|
.site-footer h5{
|
|
font-size:12px; text-transform:uppercase;
|
|
letter-spacing:0.05em; color:var(--text);
|
|
}
|
|
.site-footer .dash-list{margin-top:8px;}
|
|
.footer-bottom{
|
|
display:flex; justify-content:space-between; align-items:center;
|
|
margin-top:40px; padding-top:24px;
|
|
border-top:1px solid var(--border);
|
|
font-size:12px; color:var(--text);
|
|
}
|
|
.footer-wolf{
|
|
font-size:1.5em;
|
|
line-height:1;
|
|
opacity:1;
|
|
}
|
|
.footer-copy{opacity:0.7;}
|
|
|
|
/* Modal */
|
|
.modal-overlay{
|
|
position:fixed; inset:0; background:rgba(0,0,0,0.5);
|
|
display:flex; align-items:center; justify-content:center;
|
|
opacity:0; visibility:hidden; transition: opacity var(--transition);
|
|
z-index:100;
|
|
}
|
|
.modal-overlay.open{opacity:1; visibility:visible;}
|
|
.modal-box{
|
|
background:var(--bg); border-radius:8px; padding:32px;
|
|
max-width:420px; width:90%; position:relative;
|
|
transform:translateY(20px); transition:transform var(--transition);
|
|
}
|
|
.modal-overlay.open .modal-box{transform:translateY(0);}
|
|
.modal-close{
|
|
position:absolute; top:12px; right:16px; background:none; border:none;
|
|
font-size:22px; cursor:pointer; color:var(--text);
|
|
}
|
|
#contactForm label{display:block; margin-bottom:20px; font-size:13px; color:var(--text);}
|
|
#contactForm input, #contactForm textarea{
|
|
width:100%; margin-top:6px; padding:10px; border:1px solid var(--border);
|
|
border-radius:4px; background:transparent; color:var(--heading); font-family:inherit;
|
|
font-size:14px; font-weight:400;
|
|
}
|
|
.btn-solid{
|
|
background:var(--accent); color:#fff; border:none;
|
|
padding:12px 24px; border-radius:6px; cursor:pointer; width:100%;
|
|
}
|
|
.form-status{font-size:13px; margin-top:12px; min-height:16px;}
|
|
|
|
/* Reveal animation */
|
|
.reveal{opacity:0; transform:translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease;}
|
|
.reveal.visible{opacity:1; transform:translateY(0);}
|
|
|
|
@media (prefers-reduced-motion: reduce){
|
|
.hero-stage,
|
|
.terminal-stage{position:static; height:auto !important;}
|
|
.hero-brand,
|
|
.terminal-brand{height:auto !important;}
|
|
.hero-brand-inner,
|
|
.terminal-brand-inner{position:static; transform:none !important; will-change:auto; animation:none !important;}
|
|
.hero--mobile-anim .main-nav,
|
|
.terminal--mobile-anim .main-nav{transform:none !important; animation:none !important;}
|
|
}
|
|
|
|
/* Mobile: compositor-only hero animation (no height changes while scrolling) */
|
|
@media (max-width:600px){
|
|
.hero--mobile-anim .hero-stage,
|
|
.hero--mobile-anim .hero-brand{
|
|
contain:none;
|
|
}
|
|
.hero--mobile-anim .main-nav{
|
|
transform:translate3d(0, var(--hero-nav-shift, 0), 0);
|
|
will-change:transform;
|
|
backface-visibility:hidden;
|
|
-webkit-backface-visibility:hidden;
|
|
}
|
|
.post-hero-lift{
|
|
will-change:transform;
|
|
backface-visibility:hidden;
|
|
-webkit-backface-visibility:hidden;
|
|
}
|
|
}
|
|
|
|
@media (max-width:600px){
|
|
.terminal--mobile-anim .terminal-stage,
|
|
.terminal--mobile-anim .terminal-brand{
|
|
contain:none;
|
|
}
|
|
.terminal--mobile-anim .main-nav{
|
|
transform:translate3d(0, var(--hero-nav-shift, 0), 0);
|
|
will-change:transform;
|
|
backface-visibility:hidden;
|
|
-webkit-backface-visibility:hidden;
|
|
}
|
|
}
|
|
|
|
@supports (animation-timeline: scroll(root)){
|
|
@media (prefers-reduced-motion: no-preference) and (max-width:600px){
|
|
.hero--scroll-driven .hero-brand-inner{
|
|
will-change:transform;
|
|
}
|
|
.hero--scroll-driven .main-nav{
|
|
will-change:transform;
|
|
}
|
|
.hero--scroll-driven + .post-hero-lift{
|
|
will-change:transform;
|
|
}
|
|
.terminal--scroll-driven .terminal-brand-inner,
|
|
.terminal--scroll-driven .main-nav{
|
|
will-change:transform;
|
|
}
|
|
.terminal--scroll-driven + .post-hero-lift{
|
|
will-change:transform;
|
|
}
|
|
}
|
|
}
|
|
|
|
@keyframes hero-brand-scale{
|
|
from{transform:translate3d(0, 0, 0) scale(var(--hero-max-scale-mobile));}
|
|
to{transform:translate3d(0, 0, 0) scale(1);}
|
|
}
|
|
@keyframes terminal-brand-scale{
|
|
from{transform:translate3d(-50%, 0, 0) scale(var(--hero-max-scale-mobile));}
|
|
to{transform:translate3d(-50%, 0, 0) scale(1);}
|
|
}
|
|
@keyframes hero-nav-lift{
|
|
from{transform:translate3d(0, 0, 0);}
|
|
to{transform:translate3d(0, var(--hero-nav-shift-max), 0);}
|
|
}
|
|
@keyframes hero-content-lift{
|
|
from{transform:translate3d(0, 0, 0);}
|
|
to{transform:translate3d(0, var(--hero-nav-shift-max), 0);}
|
|
}
|
|
|
|
/* Terminal landing page — hero + 3-col nav */
|
|
.terminal-hero{
|
|
--hero-max-scale:2.55;
|
|
--hero-active-scale:var(--hero-max-scale);
|
|
--hero-logo-size:clamp(72px, 13.5vw, 158px);
|
|
--hero-terminal-overflow:1.14;
|
|
--hero-brand-gap:var(--hero-bottom-gap);
|
|
position:relative;
|
|
padding-top:var(--hero-stage-offset);
|
|
padding-bottom:var(--hero-bottom-gap);
|
|
text-align:center;
|
|
overflow:visible;
|
|
}
|
|
.terminal-stage{
|
|
position:sticky;
|
|
top:calc(var(--site-header-height) + var(--hero-stage-offset));
|
|
z-index:1;
|
|
contain:layout style;
|
|
height:var(--hero-stage-height, auto);
|
|
}
|
|
.terminal-brand{
|
|
position:relative;
|
|
padding-bottom:var(--hero-brand-gap);
|
|
overflow:visible;
|
|
contain:layout style;
|
|
height:var(--hero-brand-height, auto);
|
|
}
|
|
.terminal-brand-inner{
|
|
position:absolute;
|
|
left:50%;
|
|
top:0;
|
|
transform-origin:center top;
|
|
transform:translate3d(-50%, 0, 0) scale(var(--hero-scale, 1));
|
|
will-change:transform;
|
|
backface-visibility:hidden;
|
|
-webkit-backface-visibility:hidden;
|
|
}
|
|
.terminal-logo{
|
|
display:inline-flex;
|
|
align-items:baseline;
|
|
gap:0.06em;
|
|
font-size:var(--hero-logo-size);
|
|
font-weight:600;
|
|
letter-spacing:-0.03em;
|
|
line-height:0.9;
|
|
color:var(--logo);
|
|
margin:0;
|
|
}
|
|
.terminal-logo .accent{
|
|
color:var(--accent);
|
|
font-size:0.62em;
|
|
}
|
|
@media (prefers-reduced-motion: no-preference){
|
|
.terminal-brand-inner .terminal-logo{
|
|
font-size:calc(var(--hero-logo-size) * var(--hero-active-scale) * var(--hero-terminal-fit, 1));
|
|
}
|
|
}
|
|
@media (prefers-reduced-motion: no-preference) and (max-width:600px){
|
|
.terminal-brand-inner .terminal-logo{
|
|
font-size:calc(var(--hero-logo-size) * var(--hero-terminal-fit, 1));
|
|
}
|
|
}
|
|
.terminal-nav{
|
|
grid-template-columns:repeat(3, 1fr);
|
|
padding:0;
|
|
}
|
|
.main-nav.terminal-nav a::before{content:none;}
|
|
.terminal-nav a:last-child::after{content:none;}
|
|
.terminal-nav a:not(:last-child)::after{
|
|
content:'';
|
|
position:absolute;
|
|
right:0;
|
|
top:var(--nav-divider-inset);
|
|
bottom:var(--nav-divider-inset);
|
|
width:1px;
|
|
background:var(--border);
|
|
}
|
|
@media (max-width:600px){
|
|
.terminal-nav{
|
|
grid-template-columns:1fr;
|
|
}
|
|
.terminal-nav a:not(:last-child)::after{content:none;}
|
|
.terminal-nav a:not(:last-child)::before{
|
|
content:'';
|
|
position:absolute;
|
|
bottom:0;
|
|
left:0;
|
|
right:0;
|
|
height:1px;
|
|
background:var(--border);
|
|
}
|
|
.terminal-nav a{border-bottom:none;}
|
|
.terminal-nav a:last-child{border-bottom:none;}
|
|
}
|
|
|
|
/* Responsive */
|
|
@media (max-width:900px){
|
|
.section{--section-padding-y:64px;}
|
|
.main-nav{grid-template-columns:repeat(2, 1fr);}
|
|
.terminal-nav{grid-template-columns:repeat(3, 1fr);}
|
|
.main-nav:not(.terminal-nav) a:not(:nth-child(4n))::after,
|
|
.main-nav:not(.terminal-nav) a:nth-child(-n+4)::before{content:none;}
|
|
.main-nav:not(.terminal-nav) a:not(:nth-child(2n))::after{
|
|
content:'';
|
|
position:absolute;
|
|
right:0;
|
|
width:1px;
|
|
background:var(--border);
|
|
}
|
|
.main-nav:not(.terminal-nav) a:nth-child(-n+2):not(:nth-child(2n))::after{
|
|
top:var(--nav-divider-inset);
|
|
bottom:0;
|
|
}
|
|
.main-nav:not(.terminal-nav) a:nth-child(n+3):nth-child(-n+6):not(:nth-child(2n))::after{
|
|
top:0;
|
|
bottom:0;
|
|
}
|
|
.main-nav:not(.terminal-nav) a:nth-child(n+7):not(:nth-child(2n))::after{
|
|
top:0;
|
|
bottom:var(--nav-divider-inset);
|
|
}
|
|
.main-nav:not(.terminal-nav) a:nth-child(-n+6)::before{
|
|
content:'';
|
|
position:absolute;
|
|
bottom:0;
|
|
left:0;
|
|
right:0;
|
|
height:1px;
|
|
background:var(--border);
|
|
}
|
|
.team-grid{
|
|
grid-template-columns:1fr;
|
|
gap:24px;
|
|
}
|
|
.team-card,
|
|
.team-card--ivan,
|
|
.team-card--andrey{
|
|
padding:0 0 24px;
|
|
text-align:left;
|
|
border-right:none;
|
|
border-bottom:1px solid var(--border);
|
|
}
|
|
.team-card:last-child,
|
|
.team-card--andrey{
|
|
padding-bottom:0;
|
|
border-bottom:none;
|
|
}
|
|
.two-col{grid-template-columns:1fr;}
|
|
}
|
|
@media (max-width:600px){
|
|
.header-inner{
|
|
padding-top:12px;
|
|
padding-bottom:12px;
|
|
}
|
|
.hero{
|
|
padding-top:var(--hero-stage-offset);
|
|
padding-bottom:var(--hero-bottom-gap);
|
|
}
|
|
.terminal-hero{
|
|
--hero-terminal-overflow:1;
|
|
}
|
|
:root{
|
|
--site-header-height: 49px;
|
|
--hero-logo-size: clamp(72px, 18vw, 120px);
|
|
--hero-brand-gap: 24px;
|
|
--hero-bottom-gap: 24px;
|
|
--hero-max-scale-mobile: 2;
|
|
--hero-active-scale: 1;
|
|
}
|
|
.section{--section-padding-y:48px;}
|
|
.main-nav:not(.terminal-nav){
|
|
grid-template-columns:repeat(2, 1fr);
|
|
}
|
|
.main-nav:not(.terminal-nav) a{
|
|
min-height:44px;
|
|
padding:1px 8px 0;
|
|
font-size:14px;
|
|
}
|
|
.terminal-nav{
|
|
grid-template-columns:1fr;
|
|
padding:0;
|
|
}
|
|
.terminal-nav a{
|
|
min-height:44px;
|
|
padding:1px 8px 0;
|
|
font-size:14px;
|
|
}
|
|
h2{font-size:clamp(28px, 8vw, 40px);}
|
|
} |