:root{
    --bg:#d7c5b1;
    --text: #1f2b22;
    --muted: rgba(31,43,34,0.65);
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{

    min-height:100vh;
    background:var(--bg);
    color:var(--text);
    
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: 0.08;
    background-image:
        repeating-linear-gradient(
            0deg,
            rgba(255,255,255,0.03),
            rgba(255,255,255,0.03) 1px,
            transparent 1px,
            transparent 4px
        ),
        repeating-linear-gradient(
            90deg,
            rgba(255,255,255,0.02),
            rgba(255,255,255,0.02) 1px,
            transparent 1px,
            transparent 6px
        );
}

/* MAIN LAYOUT */

.domain{
    position:fixed;
    top:2rem;
    right:2rem;

    font-family:"Inter", sans-serif;
    font-size:0.75rem;
    letter-spacing:0.15em;
    opacity:0.5;
}

.container{
    min-height:100vh;

    width:min(1200px,90vw);
    margin:0 auto;

    display:grid;
    grid-template-columns:2fr 1fr;
    gap:6rem;

    align-items:center;
}

/* LEFT SIDE */
.left{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    text-align:center;
}

h1{
    font-family:"Bodoni Moda", serif;
    font-weight:400;

    font-size:clamp(5rem,12vw,10rem);
    line-height:0.9;
    letter-spacing:-0.04em;

    margin-bottom:1rem;

    transition: font-weight .4s ease;
    
    font-variant-ligatures: common-ligatures discretionary-ligatures historical-ligatures;
    font-feature-settings: "liga" on, "dlig" on;
}

h1:hover{
    font-weight:520;
}

.subtitle{
    font-family:"Inter", sans-serif;
    font-weight:300;

    font-size:1rem;
    text-transform:uppercase;
    letter-spacing:0.18em;
    margin:0 auto;
    line-height:1.6;
    opacity:0.85;
    color:var(--muted);
}

/* RIGHT SIDE */
.right{
    display:flex;
    flex-direction:column;
    justify-content:flex-end;

    gap:1.5rem;
}

.block{
    border-top:1px solid rgba(0,0,0,.15);
    padding-top:1rem;
}

.label{
    font-family:"Inter", sans-serif;
    font-size:.75rem;
    letter-spacing:.15em;
    text-transform:uppercase;

    opacity:.6;
    margin-bottom:.5rem;
}

a{
    font-family:"Inter", sans-serif;
    color:inherit;
    text-decoration:none;

    font-size:1rem;
    transition:opacity .2s ease;
}

a{
    color:var(--text);
    transition: opacity .25s ease, transform .25s ease;
}

a:hover{
    opacity:0.6;
    transform: translateX(2px);
}

/* RESPONSIVE */
@media(max-width:900px){

    .container{
        grid-template-columns:1fr;
        gap:4rem;
        padding:4rem 0;
    }

    .right{
        justify-content:flex-start;
    }
}