/* iggi.dev -- zen-industrial F-pattern */
/* Palette: #C4704B (kiln fire), #9B6B5A (oxidized copper), #1A1714 (silicon dark), #252019 (charred board), #E8E0D8 (raku ash), #A8A29E (warm ash), #0F0D0B (carbon black), #E85D3A (ember flare) */

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

html{
    font-size:16px;
    scroll-behavior:smooth;
}

body{
    background:#1A1714;
    color:#A8A29E;
    font-family:'IBM Plex Mono',monospace;
    font-weight:400;
    font-size:clamp(0.875rem,1.1vw,1.05rem);
    line-height:1.75;
    letter-spacing:0.01em;
    overflow-x:hidden;
}

/* Dot-grid background */
body::before{
    content:'';
    position:fixed;
    inset:0;
    background:radial-gradient(circle 1px,#9B6B5A 100%,transparent 100%);
    background-size:24px 24px;
    opacity:0.08;
    pointer-events:none;
    z-index:0;
}

/* Scroll progress */
.scroll-progress{
    position:fixed;
    bottom:2rem;
    left:2rem;
    width:2px;
    height:60px;
    background:#9B6B5A;
    z-index:100;
    opacity:0.4;
}

.scroll-progress::after{
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    width:2px;
    height:0%;
    background:#C4704B;
    transition:height 0.15s linear;
}

/* Cursor lantern */
.cursor-lantern{
    position:fixed;
    width:300px;
    height:300px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(196,112,75,0.03) 0%,transparent 70%);
    pointer-events:none;
    z-index:1;
    transform:translate(-50%,-50%);
    display:none;
}

/* Hero bar */
.hero-bar{
    min-height:45vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:0 clamp(2rem,8vw,8rem);
    position:relative;
    z-index:2;
}

.hero-domain{
    font-family:'Space Mono',monospace;
    font-weight:700;
    font-size:clamp(3rem,8vw,7rem);
    color:#E8E0D8;
    letter-spacing:0.08em;
    line-height:1.1;
    text-transform:lowercase;
}

.hero-tag{
    font-family:'Inter',sans-serif;
    font-weight:500;
    font-size:0.7rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:#9B6B5A;
    opacity:0.6;
    margin-top:1rem;
}

/* Content sections */
.identity-bar,.content-section{
    padding:6rem clamp(2rem,8vw,8rem);
    position:relative;
    z-index:2;
    max-width:680px;
}

.content-col{
    opacity:0;
    transform:translateY(8px);
    transition:opacity 0.6s ease,transform 0.6s ease;
}

.content-col.revealed{
    opacity:1;
    transform:translateY(0);
}

/* Section rules */
.section-rule{
    width:38.2%;
    height:1px;
    background:#C4704B;
    margin-bottom:3rem;
    transform:scaleX(0);
    transform-origin:left;
    transition:transform 0.8s ease;
}

.content-col.revealed ~ .section-rule,
.section-rule.drawn{
    transform:scaleX(1);
}

/* Glyph icons */
.glyph-icon{
    font-family:'Space Mono',monospace;
    font-weight:700;
    font-size:clamp(1.5rem,3vw,2.5rem);
    color:#C4704B;
    display:block;
    margin-bottom:1.5rem;
    letter-spacing:0.02em;
    transition:letter-spacing 0.3s ease-out;
}

.glyph-icon:hover{
    letter-spacing:0.15em;
}

/* Section titles */
.section-title{
    font-family:'Space Mono',monospace;
    font-weight:700;
    font-size:clamp(1.25rem,2.5vw,2rem);
    color:#E8E0D8;
    letter-spacing:0.03em;
    text-transform:lowercase;
    margin-bottom:1.5rem;
    line-height:1.1;
}

/* Body text */
.body-text{
    color:#A8A29E;
    max-width:580px;
}

/* Code specimen */
.code-specimen{
    margin-top:2rem;
    padding:1.5rem;
    border:1px solid #9B6B5A;
    background:#252019;
    opacity:0;
    transform:translateY(8px);
    transition:opacity 0.6s ease 0.2s,transform 0.6s ease 0.2s;
}

.code-specimen.revealed{
    opacity:1;
    transform:translateY(0);
}

.code-specimen pre{
    font-family:'IBM Plex Mono',monospace;
    font-size:0.85rem;
    line-height:1.7;
    color:#A8A29E;
}

.code-comment{
    color:#9B6B5A;
    opacity:0.7;
}

.code-kw{
    color:#C4704B;
}

/* Terminus */
.terminus{
    padding:6rem clamp(2rem,8vw,8rem);
    text-align:left;
    position:relative;
    z-index:2;
}

.terminus-domain{
    font-family:'Space Mono',monospace;
    font-weight:700;
    font-size:clamp(1.5rem,3vw,2.5rem);
    color:#E8E0D8;
    letter-spacing:0.08em;
    text-transform:lowercase;
}

.terminus-label{
    font-family:'Inter',sans-serif;
    font-weight:500;
    font-size:0.7rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:#9B6B5A;
    opacity:0.5;
    margin-top:0.75rem;
}

/* Responsive */
@media(max-width:768px){
    .identity-bar,.content-section{
        padding:4rem clamp(1.5rem,4vw,3rem);
    }
    .section-rule{
        width:60%;
    }
}

@media(prefers-reduced-motion:reduce){
    .content-col,.code-specimen{
        opacity:1;transform:none;transition:none;
    }
    .section-rule{transform:scaleX(1);transition:none}
    .cursor-lantern{display:none !important}
}