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

html{scroll-behavior:smooth}

body{
    font-family:'Barlow',sans-serif;
    background:#0f0508;
    color:#eee;
    cursor:none;
    overflow-x:hidden;
    min-height:100vh
}

a{
    text-decoration:none;
    color:inherit
}

/* CURSOR */


#cur{
    position:fixed;
    z-index:9999;
    pointer-events:none;
    top:0;
    left:0
}

#cd{width:8px;height:8px;background:#c06070;border-radius:50%;position:absolute;transform:translate(-50%,-50%);transition:width .2s,height .2s}
#cr{width:34px;height:34px;border:1.5px solid rgba(192,96,112,.6);border-radius:50%;position:absolute;transform:translate(-50%,-50%);transition:width .3s,height .3s,opacity .3s;opacity:.55}
body.hov #cd{width:12px;height:12px}body.hov #cr{width:54px;height:54px;opacity:1}

/* BG LAYERS */
.bg-base{position:fixed;inset:0;z-index:-2;background:linear-gradient(155deg,#140609 0%,#1e0b14 40%,#100408 100%)}
.bg-glow{position:fixed;z-index:-1;pointer-events:none}
.bg-glow.a{top:-20%;right:-15%;width:65%;height:100%;background:radial-gradient(ellipse,rgba(180,40,60,.08) 0%,transparent 65%)}
.bg-glow.b{bottom:-20%;left:-10%;width:55%;height:80%;background:radial-gradient(ellipse,rgba(120,20,40,.06) 0%,transparent 60%)}
.bg-txt{position:fixed;bottom:5%;right:-2%;font-family:'Syne',sans-serif;font-weight:800;font-size:clamp(8rem,18vw,18rem);color:rgba(180,40,60,.04);line-height:1;pointer-events:none;user-select:none;z-index:-1;white-space:nowrap}

/* NAV */
nav{position:fixed;top:0;width:100%;z-index:100;padding:22px 6%;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(to bottom,rgba(15,5,8,.9),transparent);backdrop-filter:blur(12px);border-bottom:1px solid rgba(192,96,112,.08)}
.logo{font-family:'Syne',sans-serif;font-weight:800;font-size:1.3rem;letter-spacing:3px;color:#c06070}
.nl{display:flex;gap:36px;list-style:none}
.nl a{font-family:'DM Mono',monospace;font-size:.67rem;letter-spacing:2.5px;text-transform:uppercase;color:rgba(255,255,255,.3);transition:color .3s;position:relative}
.nl a::after{content:'';position:absolute;left:0;bottom:-4px;width:0;height:1px;background:#c06070;transition:width .3s}
.nl a:hover,.nl a.active{color:#e88a9a}.nl a:hover::after,.nl a.active::after{width:100%}
.nt{display:none;flex-direction:column;gap:5px;cursor:pointer}
.nt span{width:22px;height:1.5px;background:#c06070;display:block}

/* PAGE */
.page{padding:110px 6% 80px;max-width:1100px;margin:0 auto}
.page-sup{font-family:'DM Mono',monospace;font-size:.63rem;letter-spacing:4px;color:#c06070;text-transform:uppercase;margin-bottom:14px}
.page-h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2.5rem,6vw,4.5rem);font-weight:600;line-height:1.1;color:#fff;margin-bottom:70px}
.page-h1 em{font-style:italic;color:#e88a9a}

/* ABOUT HERO GRID */
.ah{display:grid;grid-template-columns:auto 1fr;gap:clamp(28px,5vw,72px);align-items:start;margin-bottom:80px}

/* PHOTO */
.photo-col{width:clamp(190px,24vw,280px);flex-shrink:0}
.photo-wrap{position:relative;padding:14px 14px 30px 0}
.photo-frame{width:100%;aspect-ratio:3/4;border-radius:2px;overflow:hidden;position:relative}
.photo-img{width:100%;height:100%;object-fit:cover;filter:sepia(.12) contrast(1.05);transition:filter .5s,transform .6s}
.photo-frame::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(20,6,9,.7) 0%,transparent 40%);pointer-events:none}
.photo-frame:hover .photo-img{filter:sepia(0) contrast(1.08);transform:scale(1.04)}
.deco-a{position:absolute;top:0;left:0;right:14px;bottom:14px;border:1px solid rgba(192,96,112,.35);border-radius:2px;pointer-events:none;z-index:1}
.deco-b{position:absolute;top:14px;left:14px;right:0;bottom:0;border:1px solid rgba(201,168,76,.18);border-radius:2px;pointer-events:none;z-index:0}
.nameplate{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#c9a84c,#8a6820);color:#06040a;font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:3px;text-transform:uppercase;padding:7px 18px;white-space:nowrap;z-index:4}
.photo-yr{position:absolute;top:14px;right:-18px;font-family:'DM Mono',monospace;font-size:.52rem;color:rgba(201,168,76,.4);letter-spacing:2px;writing-mode:vertical-lr;z-index:4}
.ph-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:linear-gradient(140deg,#230d12 0%,#30121c 50%,#1c080e 100%);width:100%;height:100%}
.ph-ph svg{width:52px;height:52px;opacity:.18}
.ph-ph span{font-family:'DM Mono',monospace;font-size:.55rem;color:rgba(255,255,255,.15);letter-spacing:3px;text-transform:uppercase}

/* BIO */
.bio h3{font-family:'Cormorant Garamond',serif;font-size:clamp(1.3rem,2.8vw,2rem);font-weight:600;color:#f0d0d8;margin-bottom:18px;line-height:1.3}
.bio p{color:rgba(255,255,255,.4);font-size:clamp(.86rem,1.4vw,.96rem);line-height:1.95;font-weight:300;margin-bottom:14px}
.bio p strong{color:rgba(255,255,255,.78);font-weight:500}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:22px}
.chip{font-family:'DM Mono',monospace;font-size:.58rem;letter-spacing:1.5px;padding:5px 12px;border:1px solid rgba(180,40,60,.28);color:#c06070;border-radius:2px;background:rgba(180,40,60,.04)}

/* SECTION TITLE */
.sec-t{font-family:'Syne',sans-serif;font-weight:700;font-size:.82rem;letter-spacing:3px;text-transform:uppercase;color:#f0d0d8;margin-bottom:26px;display:flex;align-items:center;gap:14px}
.sec-t::after{content:'';flex:1;height:1px;background:rgba(192,96,112,.18)}

/* SKILLS GRID */
.sk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:14px;margin-bottom:70px}
.sk-card{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.055);border-radius:4px;padding:18px;transition:border-color .3s,background .3s}
.sk-card:hover{border-color:rgba(192,96,112,.2);background:rgba(192,96,112,.03)}
.sk-row{display:flex;justify-content:space-between;margin-bottom:10px}
.sk-name{font-family:'Syne',sans-serif;font-weight:600;font-size:.8rem;color:#fff}
.sk-pct{font-family:'DM Mono',monospace;font-size:.6rem;color:#c06070}
.sk-bar{height:2px;background:rgba(255,255,255,.07);border-radius:2px;overflow:hidden}
.sk-fill{height:100%;width:0;background:linear-gradient(90deg,#c06070,#e88a9a);transition:width 1.3s cubic-bezier(.25,.46,.45,.94)}

/* TIMELINE */
.tl{display:flex;flex-direction:column;margin-bottom:60px}
.tl-item{display:grid;grid-template-columns:70px 1px 1fr;gap:0 20px;padding-bottom:28px}
.tl-yr{font-family:'DM Mono',monospace;font-size:.6rem;color:rgba(192,96,112,.6);letter-spacing:1px;text-align:right;padding-top:4px}
.tl-spine{background:rgba(180,40,60,.18);position:relative}
.tl-spine::before{content:'';position:absolute;top:4px;left:50%;transform:translateX(-50%);width:7px;height:7px;border-radius:50%;background:#c06070;box-shadow:0 0 8px rgba(192,96,112,.5)}
.tl-body{padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.04)}
.tl-item:last-child .tl-body{border-bottom:none}
.tl-role{font-family:'Syne',sans-serif;font-weight:700;font-size:.88rem;color:#fff;margin-bottom:3px}
.tl-co{font-size:.76rem;color:rgba(255,255,255,.28);font-family:'DM Mono',monospace}

/* PERSONALITY */
.personality{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:14px;margin-bottom:30px}
.pers-card{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:4px;padding:20px;transition:all .3s}
.pers-card:hover{border-color:rgba(192,96,112,.25);transform:translateY(-3px)}
.pers-icon{font-size:1.6rem;margin-bottom:10px}
.pers-label{font-family:'Syne',sans-serif;font-weight:700;font-size:.78rem;color:#f0d0d8;margin-bottom:6px}
.pers-desc{font-size:.75rem;color:rgba(255,255,255,.3);line-height:1.7;font-weight:300}

/* REVEAL */
.rv{opacity:0;transform:translateY(32px);transition:opacity .75s cubic-bezier(.25,.46,.45,.94),transform .75s cubic-bezier(.25,.46,.45,.94)}
.rv.in{opacity:1;transform:none}
.rvl{opacity:0;transform:translateX(-32px);transition:opacity .75s cubic-bezier(.25,.46,.45,.94),transform .75s cubic-bezier(.25,.46,.45,.94)}
.rvl.in{opacity:1;transform:none}
.rvr{opacity:0;transform:translateX(32px);transition:opacity .75s cubic-bezier(.25,.46,.45,.94),transform .75s cubic-bezier(.25,.46,.45,.94)}
.rvr.in{opacity:1;transform:none}

/* MOBILE */
@media(max-width:768px){
  body{cursor:auto}#cur{display:none}
  .nt{display:flex}.nl{position:fixed;top:0;right:-100%;height:100vh;width:min(270px,80vw);background:rgba(14,5,8,.97);backdrop-filter:blur(20px);flex-direction:column;align-items:flex-start;padding:90px 28px 28px;gap:26px;border-left:1px solid rgba(192,96,112,.12);transition:right .4s;z-index:999}
  .nl.open{right:0}.nl a{font-size:.9rem;color:rgba(255,255,255,.6)}
  .ah{grid-template-columns:1fr}.photo-col{width:min(200px,55vw);margin:0 auto 20px}
}
::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(192,96,112,.4);border-radius:2px}


