:root{
--red:#d52b1e;
--bg:#fbfbfb;
--text:#1b1b1b;
--muted:#777;
--line:#dddddd;
}
*{box-sizing:border-box}
body{
margin:0;
background:var(--bg);
font-family:Inter,sans-serif;
color:var(--text);
}
.wrapper{
max-width:1180px;
margin:auto;
padding:80px 48px;
min-height:92vh;
display:grid;
grid-template-columns:1fr 1fr;
gap:90px;
align-items:center;
}
h1{
margin:0;
font-size:clamp(54px,7vw,82px);
font-weight:400;
letter-spacing:-0.04em;
}
.name{color:#222;}
.tld{color:var(--red);}
.line{
width:72px;
height:2px;
background:var(--red);
margin:36px 0;
}
h2{
font-size:clamp(30px,3vw,42px);
font-weight:300;
line-height:1.15;
margin:0;
}
.subtitle{
margin-top:18px;
color:var(--muted);
font-size:18px;
}
h3{
font-size:15px;
font-weight:600;
letter-spacing:.18em;
color:var(--red);
margin-bottom:30px;
}
form{
display:flex;
flex-direction:column;
gap:22px;
}
input,textarea{
border:none;
border-bottom:1px solid var(--line);
background:transparent;
padding:14px 2px;
font:inherit;
outline:none;
}
textarea{min-height:140px;resize:vertical;}
button{
margin-top:12px;
align-self:flex-start;
border:none;
background:none;
color:var(--red);
font-weight:600;
letter-spacing:.14em;
cursor:pointer;
}
footer{
padding:28px;
text-align:center;
color:#888;
font-size:14px;
}
@media(max-width:850px){
.wrapper{
grid-template-columns:1fr;
gap:56px;
padding:48px 24px;
}
}