*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html,body{width:100%;height:100%;overflow:hidden;background:#fff;cursor:none;}
:root{--sans:'DM Sans',sans-serif;--serif:'Instrument Serif',serif;--mono:'DM Mono',monospace;--white:#fff;--dim:rgba(255,255,255,0.65);--muted:rgba(255,255,255,0.35);--faint:rgba(255,255,255,0.14);}

/* ══ LOADER ══ */
#loader{
  position:fixed;inset:0;z-index:1000;background:#fff;overflow:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  padding-top:3.5rem;
}
.loader-ball-wrap{
  position:relative;
  width:64px;height:64px;
  margin-bottom:2rem;
}
.loader-ball-outer{
  position:absolute;inset:0;
  border-radius:50%;
  border:1.5px solid rgba(0,0,0,0.18);
}
#loaderBallCanvas{
  position:absolute;inset:0;
  border-radius:50%;
  overflow:hidden;
  width:64px;height:64px;
  border-radius:50%;
}
.lc{
  display:flex;align-items:baseline;gap:0.2rem;
  margin-top:0;
}
.lc-num{font-family:var(--mono);font-size:0.6rem;font-weight:300;color:rgba(0,0,0,0.4);}
.lc-pct{font-family:var(--mono);font-size:0.5rem;color:rgba(0,0,0,0.2);}
#lb{
  position:fixed;
  width:64px;height:64px;
  background:#000;border-radius:50%;
  top:calc(3.5rem + 32px);left:50%;
  transform:translate(-50%,-50%);
  z-index:1002;
  display:none;
}

/* ══ TARGET CURSOR ══ */
.tc-wrap{position:fixed;top:0;left:0;width:0;height:0;pointer-events:none;z-index:99999;mix-blend-mode:difference;transform:translate(-50%,-50%);}
.tc-dot{position:absolute;left:50%;top:50%;width:4px;height:4px;background:#fff;border-radius:50%;transform:translate(-50%,-50%);}
.tc-c{position:absolute;left:50%;top:50%;width:12px;height:12px;border:2.5px solid #fff;}
.tc-tl{transform:translate(-150%,-150%);border-right:none;border-bottom:none;}
.tc-tr{transform:translate(50%,-150%);border-left:none;border-bottom:none;}
.tc-br{transform:translate(50%,50%);border-left:none;border-top:none;}
.tc-bl{transform:translate(-150%,50%);border-right:none;border-top:none;}

/* ══ SITE ══ */
#site{position:fixed;inset:0;opacity:0;pointer-events:none;overflow:hidden;background:#000;}
#site.visible{opacity:1;pointer-events:auto;}
#sc{width:100%;height:100%;overflow-y:scroll;scroll-snap-type:y mandatory;scrollbar-width:none;}
#sc::-webkit-scrollbar{display:none;}

.page-section{scroll-snap-align:start;width:100%;height:100vh;position:relative;overflow:hidden;}
.page-section .fade-in-layer{
  position:absolute;inset:0;z-index:20;
  background:#000;
  opacity:1;
  pointer-events:none;
  transition:opacity 0.9s cubic-bezier(.4,0,.2,1);
}
.page-section.revealed .fade-in-layer{opacity:0;pointer-events:none;}
#lanyardCanvas {
  background: transparent;
}
.page-title{
  position:absolute;
  top:1.4rem;
  left:50%;
  transform:translateX(-50%);
  z-index:15;
  font-family:var(--serif);
  font-size:clamp(0.85rem,1.4vw,1.1rem);
  font-weight:400;
  font-style:italic;
  letter-spacing:0.06em;
  color:rgba(255,255,255,0.65);
  white-space:nowrap;
  pointer-events:none;
  user-select:none;
}
.page-title::before{
  content:'';
  position:absolute;
  bottom:-6px;left:50%;transform:translateX(-50%);
  width:30%;height:1px;
  background:linear-gradient(to right,transparent,rgba(255,255,255,0.25),transparent);
}

.page-section:not(.revealed) .anim-el{
  opacity:0;
  transform:translateY(20px);
}
.anim-el{
  transition:opacity .65s ease, transform .65s ease;
}

.page-section::after{
  content:'';
  position:absolute;
  top:0;left:-100%;
  width:100%;height:1px;
  background:linear-gradient(to right,transparent,rgba(255,255,255,0.18),transparent);
  z-index:25;
  transition:left 1s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
.page-section.revealed::after{left:100%;}

.page-section .scan2{
  position:absolute;
  bottom:30%;left:-100%;
  width:100%;height:1px;
  background:linear-gradient(to right,transparent,rgba(255,255,255,0.08),transparent);
  z-index:24;
  transition:left 1.2s .15s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}
.page-section.revealed .scan2{left:100%;}

/* ══ DETAIL MODAL ══ */
#detailModal{
  position:fixed;inset:0;z-index:800;
  background:rgba(0,0,0,0.92);
  backdrop-filter:blur(32px);
  -webkit-backdrop-filter:blur(32px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity .35s ease;
}
#detailModal.open{opacity:1;pointer-events:auto;}

.modal-box{
  width:min(900px,94vw);
  height:min(520px,88vh);
  background:#0a0a0a;
  border:1px solid rgba(255,255,255,0.1);
  position:relative;
  transform:translateY(24px) scale(0.97);
  transition:transform .4s cubic-bezier(.16,1,.3,1);
  overflow:hidden;
  display:flex;
  flex-direction:row;
}
#detailModal.open .modal-box{transform:translateY(0) scale(1);}

.modal-img-panel{
  width:42%;
  flex-shrink:0;
  height:100%;
  position:relative;
  overflow:hidden;
  background:#000;
  border-right:1px solid rgba(255,255,255,0.07);
  display:flex;
  align-items:center;
  justify-content:center;
}
.modal-img-panel img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  transition:transform .6s cubic-bezier(.16,1,.3,1);
}
#detailModal.open .modal-img-panel img{
  animation:modalImgIn .5s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes modalImgIn{
  from{opacity:0;transform:scale(1.06);}
  to{opacity:1;transform:scale(1);}
}
.modal-img-panel::after{
  content:'';
  position:absolute;inset:0;
  background:
    linear-gradient(to right, transparent 55%, rgba(10,10,10,0.85) 100%),
    linear-gradient(to bottom, rgba(0,0,0,0.18) 0%, transparent 30%, transparent 70%, rgba(0,0,0,0.35) 100%);
  pointer-events:none;
  z-index:1;
}
.modal-img-cat{
  position:absolute;bottom:1.1rem;left:1.1rem;
  font-family:var(--mono);font-size:0.36rem;letter-spacing:0.22em;
  text-transform:uppercase;color:rgba(255,255,255,0.5);
  z-index:2;
}

.modal-content-panel{
  flex:1;
  min-width:0;
  padding:2.4rem 2.2rem 2rem 2.2rem;
  overflow-y:auto;
  scrollbar-width:none;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.modal-content-panel::-webkit-scrollbar{display:none;}

.modal-box.no-img-panel{
  width:min(680px,92vw);
  height:auto;
  max-height:82vh;
}
.modal-box.no-img-panel .modal-img-panel{display:none;}
.modal-box.no-img-panel .modal-content-panel{
  padding:2.8rem 3rem;
  justify-content:flex-start;
}

.modal-close{
  position:absolute;top:1rem;right:1.2rem;z-index:20;
  background:rgba(0,0,0,0.5);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:50%;
  width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  font-family:var(--mono);font-size:0.45rem;letter-spacing:0.1em;
  color:rgba(255,255,255,0.4);
  padding:0;
  transition:color .2s, background .2s, border-color .2s;
  backdrop-filter:blur(8px);
}
.modal-close:hover{
  color:#fff;
  background:rgba(255,255,255,0.1);
  border-color:rgba(255,255,255,0.3);
}
.modal-tag{
  font-family:var(--mono);font-size:0.38rem;letter-spacing:0.26em;
  text-transform:uppercase;color:rgba(255,255,255,0.28);
  margin-bottom:.5rem;
}
.modal-title{
  font-family:'Cormorant Garamond',var(--serif);
  font-size:clamp(1.5rem,2.6vw,2.2rem);
  font-style:italic;font-weight:400;
  color:var(--white);line-height:1.08;
  margin-bottom:.4rem;
  letter-spacing:-0.01em;
}
.modal-sub{
  font-family:var(--mono);font-size:0.42rem;letter-spacing:0.14em;
  text-transform:uppercase;color:rgba(255,255,255,0.25);
  margin-bottom:1.2rem;
}
.modal-divider{
  width:100%;height:1px;
  background:rgba(255,255,255,0.07);
  margin-bottom:1.2rem;
  flex-shrink:0;
}
.modal-body{
  font-family:var(--sans);font-size:clamp(.82rem,1.3vw,.96rem);
  font-weight:300;color:rgba(255,255,255,0.55);line-height:1.82;
}
.modal-tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:1.2rem;}
.modal-tag-pill{
  font-family:var(--mono);font-size:0.38rem;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(255,255,255,0.32);
  border:1px solid rgba(255,255,255,0.09);padding:.2rem .5rem;
  border-radius:2px;
}
.modal-link{
  display:inline-flex;align-items:center;gap:.45rem;
  margin-top:1.4rem;
  font-family:var(--mono);font-size:0.46rem;letter-spacing:0.15em;
  text-transform:uppercase;color:var(--white);text-decoration:none;
  transition:gap .2s;
  flex-shrink:0;
}
.modal-link:hover{gap:.85rem;}
.modal-link.disabled{color:rgba(255,255,255,0.18);pointer-events:none;}

/* ══ PAGE 1 — HERO ══ */
#p1{background:#000;display:flex;flex-direction:column;}
.aurora{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.ab{position:absolute;border-radius:50%;filter:blur(100px);}
.ab1{width:65vw;height:55vh;background:radial-gradient(ellipse,rgba(18,48,68,0.55) 0%,transparent 70%);top:-10%;left:-10%;animation:am1 20s ease-in-out infinite;}
.ab2{width:55vw;height:60vh;background:radial-gradient(ellipse,rgba(10,38,48,0.5) 0%,transparent 70%);top:25%;right:-8%;animation:am2 24s ease-in-out infinite;}
.ab3{width:50vw;height:50vh;background:radial-gradient(ellipse,rgba(18,26,52,0.45) 0%,transparent 70%);bottom:-8%;left:25%;animation:am3 28s ease-in-out infinite;}
@keyframes am1{0%,100%{transform:translate(0,0)}40%{transform:translate(3vw,4vh)}75%{transform:translate(-2vw,2vh)}}
@keyframes am2{0%,100%{transform:translate(0,0)}35%{transform:translate(-4vw,-3vh)}70%{transform:translate(2vw,3vh)}}
@keyframes am3{0%,100%{transform:translate(0,0)}50%{transform:translate(-3vw,-4vh)}}
.site-nav{position:absolute;top:0;left:0;right:0;padding:1.8rem 2.5rem;display:flex;justify-content:space-between;z-index:10;}
.nav-col{display:flex;flex-direction:column;gap:0.2rem;}
.nav-col a{font-family:var(--mono);font-size:0.5rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--faint);text-decoration:none;transition:color .2s;}
.nav-col a:hover{color:var(--dim);}
.hero-body{flex:1;display:flex;align-items:center;justify-content:center;position:relative;z-index:5;}
.tw-wrap{text-align:left;}
.tw-line{font-family:var(--serif);font-size:clamp(2.2rem,6vw,5.5rem);font-weight:400;font-style:italic;color:var(--white);line-height:1.15;display:block;min-height:1.2em;letter-spacing:-0.01em;}
.tw-cursor{display:inline-block;width:3px;height:0.85em;background:#fff;margin-left:4px;vertical-align:middle;opacity:0.7;animation:blink .8s step-end infinite;}
@keyframes blink{0%,100%{opacity:.7}50%{opacity:0}}
.scroll-hint{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:0.6rem;z-index:10;opacity:0;}
.scroll-hint.show{transition:opacity .8s ease;opacity:1;}
.scroll-label{font-family:var(--mono);font-size:0.45rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--faint);}
.mouse-icon{width:20px;height:32px;border:1px solid rgba(255,255,255,0.16);border-radius:10px;display:flex;align-items:flex-start;justify-content:center;padding-top:5px;}
.mouse-wheel{width:1.5px;height:5px;background:rgba(255,255,255,0.3);border-radius:1px;animation:mw 1.8s ease infinite;}
@keyframes mw{0%{transform:translateY(0);opacity:1}60%{transform:translateY(7px);opacity:0}61%{transform:translateY(0);opacity:0}100%{transform:translateY(0);opacity:1}}

/* ══ PAGE GUIDE BUTTON ══ */
.pg-btn{
  position:absolute;bottom:1.6rem;left:1.8rem;
  width:26px;height:26px;border-radius:50%;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.45);font-family:var(--mono);font-size:0.62rem;
  cursor:pointer;z-index:30;display:flex;align-items:center;justify-content:center;
  transition:background .2s,border-color .2s,color .2s;
  line-height:1;
}
.pg-btn:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff;}
.pg-btn.active{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff;}
.pg-panel{
  position:absolute;bottom:4.2rem;left:1.8rem;
  background:rgba(10,10,10,.88);border:1px solid rgba(255,255,255,.1);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-radius:8px;padding:1rem 1.2rem 0.9rem;
  width:clamp(200px,22vw,280px);z-index:29;
  opacity:0;pointer-events:none;
  transform:translateY(6px);
  transition:opacity .2s,transform .2s;
}
.pg-panel.open{opacity:1;pointer-events:auto;transform:translateY(0);}
.pg-title{font-family:var(--mono);font-size:0.38rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:.55rem;}
.pg-panel ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.45rem;}
.pg-panel li{font-size:0.72rem;color:rgba(255,255,255,.62);line-height:1.5;padding-left:.9rem;position:relative;}
.pg-panel li::before{content:'→';position:absolute;left:0;color:rgba(255,255,255,.25);font-size:0.6rem;top:.05em;}

/* ══ PAGE 2 — ABOUT ══ */
#p2{background:#000;display:flex;align-items:stretch;}
.about-left{flex:1;display:flex;flex-direction:column;justify-content:center;padding:4rem 3rem 4rem 3.5rem;position:relative;z-index:2;}
.about-tag{font-family:var(--mono);font-size:0.5rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--muted);margin-bottom:2rem;}
.about-text{font-family:var(--serif);font-size:clamp(1.5rem,3vw,2.6rem);font-weight:400;color:var(--white);line-height:1.45;font-style:italic;max-width:600px;}
.about-text em{font-style:normal;color:var(--muted);}
.about-divider{width:28px;height:1px;background:rgba(255,255,255,0.1);margin:1.8rem 0;}
.about-text2{font-family:var(--sans);font-size:clamp(.9rem,1.6vw,1.15rem);font-weight:300;color:var(--dim);line-height:1.7;max-width:520px;}
.about-right{width:40%;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.about-photo{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center center;
  filter:grayscale(1)contrast(1.05)brightness(.55);
  display:block;
}
.about-right::before{content:'';position:absolute;top:0;left:0;bottom:0;width:55%;background:linear-gradient(to right,#000,transparent);z-index:1;}

/* ══ PAGE 3 — FLOWING MENU ══ */

#p3{
  background:#000;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.skills-eyebrow{position:absolute;top:3.6rem;left:3.5rem;z-index:15;pointer-events:none;}
.skills-eyebrow span{font-family:var(--mono);font-size:0.42rem;letter-spacing:0.26em;text-transform:uppercase;color:var(--muted);}
.menu{
  display:flex;
  flex-direction:column;
  flex:1;
  padding-top:5rem;
  list-style:none;
}
.menu-item{flex:1;position:relative;overflow:hidden;}
.menu-label{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;height:100%;font-family:var(--sans);font-size:clamp(.7rem,2vh,1.4rem);font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--white);cursor:default;user-select:none;transition:color .25s;}
.marquee-overlay{position:absolute;inset:0;overflow:hidden;transform:translateY(100%);transition:transform .35s cubic-bezier(.16,1,.3,1);z-index:3;background:#fff;display:flex;align-items:center;}
.menu-item:hover .marquee-overlay{transform:translateY(0);}
.menu-item:hover .menu-label{color:#000;}
.marquee-track{display:flex;align-items:center;white-space:nowrap;will-change:transform;height:100%;}
.marquee-part{display:flex;align-items:center;flex-shrink:0;padding:0 1.4vw;gap:0.9vw;}
.marquee-part span{font-family:var(--sans);font-size:clamp(.7rem,1.9vh,1.2rem);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#000;white-space:nowrap;}
.marquee-logo{width:36px;height:36px;object-fit:cover;flex-shrink:0;border-radius:8px;background:#f4f4f4;padding:4px;}
/* ══ PAGE 4 — INTERNSHIPS ══ */
#p4{
  background:#000;
  display:flex;
  align-items:stretch;
  position:relative;
}
#p4::before{
  content:'';
  position:absolute;inset:0;
  background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(255,255,255,0.01) 3px,rgba(255,255,255,0.01) 4px);
  pointer-events:none;
  z-index:1;
}
.intern-left{
  width:45%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:4rem 3rem 4rem 3.5rem;
  position:relative;
  z-index:3;
  border-right:1px solid rgba(255,255,255,0.06);
  overflow:hidden;
}
.intern-eyebrow{
  font-family:var(--mono);font-size:0.48rem;letter-spacing:0.28em;
  text-transform:uppercase;color:var(--muted);
  margin-bottom:1.8rem;
  display:flex;align-items:center;gap:0.8rem;
}
.intern-eyebrow::before{
  content:'';display:inline-block;
  width:24px;height:1px;
  background:rgba(255,255,255,0.25);
}
.intern-big{
  font-family:var(--serif);
  font-size:clamp(2.8rem,7vw,7rem);
  font-weight:400;font-style:italic;
  color:var(--white);line-height:.9;
  letter-spacing:-0.02em;
  margin-bottom:2rem;
}
.intern-big span{display:block;color:var(--muted);font-size:0.6em;}
.intern-sub{
  font-family:var(--sans);font-size:clamp(.8rem,1.4vw,1rem);
  font-weight:300;color:var(--dim);line-height:1.7;
  max-width:320px;margin-bottom:0;
}
.intern-stat-row{display:flex;gap:2.5rem;margin-top:2rem;flex-wrap:wrap;}
.intern-stat{display:flex;flex-direction:column;gap:0.3rem;}
.intern-stat-num{font-family:var(--serif);font-size:2rem;font-style:italic;color:var(--white);line-height:1;}
.intern-stat-label{font-family:var(--mono);font-size:0.42rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--muted);}
.intern-right{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:4rem 3.5rem;
  position:relative;
  z-index:3;
  overflow:hidden;
  min-width:0;
}
.intern-card{
  position:relative;
  padding:1.5rem 1.5rem 1.5rem 0;
  border-bottom:1px solid rgba(255,255,255,0.07);
  overflow:hidden;
  cursor:pointer;
  transition:padding-left .4s cubic-bezier(.16,1,.3,1);
}
.intern-card:first-child{border-top:1px solid rgba(255,255,255,0.07);}
.intern-card-fill{
  position:absolute;inset:0;
  background:rgba(255,255,255,0.035);
  transform:scaleX(0);transform-origin:left;
  transition:transform .5s cubic-bezier(.16,1,.3,1);
  pointer-events:none;
}
.intern-card:hover .intern-card-fill{transform:scaleX(1);}
.intern-card:hover{padding-left:1rem;}
.intern-card-inner{
  display:flex;align-items:center;gap:1.5rem;
  position:relative;z-index:1;
  min-width:0;
}
.intern-card-num{
  font-family:var(--mono);font-size:0.45rem;
  color:var(--muted);letter-spacing:0.12em;
  width:2.5rem;flex-shrink:0;
}
.intern-card-body{flex:1;min-width:0;}
.intern-card-role{
  font-family:var(--serif);font-size:clamp(1rem,2vw,1.5rem);
  font-style:italic;font-weight:400;
  color:var(--white);line-height:1.1;
  margin-bottom:0.3rem;
  transition:letter-spacing .3s;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.intern-card:hover .intern-card-role{letter-spacing:0.01em;}
.intern-card-org{
  font-family:var(--mono);font-size:0.48rem;
  letter-spacing:0.16em;text-transform:uppercase;
  color:var(--dim);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.intern-card-tag{
  font-family:var(--mono);font-size:0.44rem;letter-spacing:0.12em;
  text-transform:uppercase;padding:0.28rem 0.7rem;
  border:1px solid rgba(255,255,255,0.18);
  color:var(--dim);white-space:nowrap;flex-shrink:0;
  transition:border-color .3s,color .3s;
}
.intern-card:hover .intern-card-tag{border-color:rgba(255,255,255,0.45);color:var(--white);}

/* ══ INTERNSHIP PREVIEW POPUP ══ */
.intern-preview{
  position:fixed;
  width:280px;
  height:200px;
  pointer-events:none;
  z-index:500;
  opacity:0;
  transform:scale(0.85) rotate(-2deg);
  transition:opacity .22s ease,transform .22s cubic-bezier(.16,1,.3,1);
  border:1px solid rgba(255,255,255,0.12);
  overflow:hidden;
  background:#0a0a0a;
  display:flex;
  align-items:center;
  justify-content:center;
}
.intern-preview.show{opacity:1;transform:scale(1) rotate(0deg);}
.intern-preview img{
  max-width:calc(100% - 0px);
  max-height:calc(100% - 0px);
  width:auto;
  height:auto;
  object-fit:contain;
  object-position:center center;
  display:block;
  flex-shrink:0;
}
.intern-preview-label{
  position:absolute;
  bottom:0;left:0;right:0;
  padding:0.5rem 0.8rem;
  background:linear-gradient(to top,rgba(0,0,0,0.9),transparent);
  font-family:var(--mono);font-size:0.42rem;letter-spacing:0.15em;
  text-transform:uppercase;color:var(--dim);
  z-index:2;
  pointer-events:none;
}

/* ══ PAGE 5 — EXPERIENCE ══ */
#pExp{
  background:#000;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
#pExp .page-title{ color:rgba(255,255,255,0.6); }

.exp-spline-wrap{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:auto;
}
spline-viewer{
  width:100%;
  height:100%;
  display:block;
}
spline-viewer::part(logo){ display:none!important; }

.exp-vign{
  position:absolute;inset:0;z-index:3;
  background:
    radial-gradient(ellipse 55% 55% at 50% 50%, transparent 40%, rgba(0,0,0,0.55) 100%);
  pointer-events:none;
}

.exp-ring{
  position:absolute;inset:0;z-index:10;
  pointer-events:none;
}

.xcard{
  position:absolute;
  width:222px;
  background:rgba(8,8,8,0.86);
  border:1px solid rgba(255,255,255,0.13);
  padding:1rem 1.2rem;
  cursor:pointer;
  pointer-events:auto;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  transition:border-color .28s, background .28s, box-shadow .28s, transform .22s;
  user-select:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.07);
}
.xcard[data-xp="0"],.xcard[data-xp="1"],.xcard[data-xp="2"],.xcard[data-xp="3"]{
  border-radius:20px 8px 8px 20px;
}
.xcard[data-xp="4"],.xcard[data-xp="5"],.xcard[data-xp="6"],.xcard[data-xp="7"]{
  border-radius:8px 20px 20px 8px;
}
.xcard::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,0.04),transparent 60%);
  border-radius:inherit;pointer-events:none;z-index:0;
  opacity:0;transition:opacity .3s;
}
.xcard:hover{
  border-color:rgba(255,255,255,0.32);
  background:rgba(14,14,14,0.97);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.12),
    0 0 20px rgba(255,255,255,0.04), 0 8px 30px rgba(0,0,0,0.7);
}
.xcard:hover::before{opacity:1;}
.xcard[data-xp="0"]:hover,.xcard[data-xp="1"]:hover,
.xcard[data-xp="2"]:hover,.xcard[data-xp="3"]:hover{transform:translateX(5px);}
.xcard[data-xp="4"]:hover,.xcard[data-xp="5"]:hover,
.xcard[data-xp="6"]:hover,.xcard[data-xp="7"]:hover{transform:translateX(-5px);}

.xcard-cat{
  font-family:var(--mono);font-size:0.36rem;letter-spacing:0.24em;
  text-transform:uppercase;color:rgba(255,255,255,0.28);margin-bottom:.28rem;
  position:relative;z-index:1;
}
.xcard-title{
  font-family:var(--serif);font-size:1rem;font-style:italic;font-weight:400;
  color:rgba(255,255,255,0.9);line-height:1.2;margin-bottom:.28rem;
  letter-spacing:-0.01em;position:relative;z-index:1;
}
.xcard-preview{
  font-family:var(--sans);font-size:0.67rem;font-weight:300;
  color:rgba(255,255,255,0.4);line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  position:relative;z-index:1;
}
.xcard-click-hint{
  display:flex;align-items:center;gap:.3rem;
  font-family:var(--mono);font-size:0.33rem;letter-spacing:.1em;
  text-transform:uppercase;color:rgba(255,255,255,0.2);
  margin-top:.55rem;transition:color .2s;position:relative;z-index:1;
}
.xcard:hover .xcard-click-hint{color:rgba(255,255,255,0.55);}
.xcard-click-hint::after{content:'→';transition:transform .2s;}
.xcard:hover .xcard-click-hint::after{transform:translateX(3px);}

.xcard[data-xp="0"]{ top:8%;   left:5%;   }
.xcard[data-xp="1"]{ top:28%;  left:2%;   }
.xcard[data-xp="2"]{ top:50%;  left:2%;   }
.xcard[data-xp="3"]{ top:71%;  left:5%;   }
.xcard[data-xp="4"]{ top:8%;   right:5%;  }
.xcard[data-xp="5"]{ top:28%;  right:2%;  }
.xcard[data-xp="6"]{ top:50%;  right:2%;  }
.xcard[data-xp="7"]{ top:71%;  right:5%;  }

.exp-lines{position:absolute;inset:0;z-index:4;pointer-events:none;}
.exp-lines svg{width:100%;height:100%;overflow:visible;}

/* ══ PAGE 6 — CERTIFICATIONS ══ */
#p5{background:#000;position:relative;overflow:hidden;}
#certCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;cursor:none;}
.cert-hud-tl{position:absolute;top:2.2rem;left:3.5rem;z-index:8;pointer-events:none;}
.cert-hud-num{
  font-family:var(--serif);font-style:italic;
  font-size:clamp(3rem,6vw,5.5rem);font-weight:400;
  color:var(--white);line-height:.9;letter-spacing:-.02em;
  transition:all .4s cubic-bezier(.16,1,.3,1);
}
.cert-hud-label{font-family:var(--mono);font-size:0.42rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);margin-top:.5rem;}
.cert-focus{
  position:absolute;right:3.5rem;top:50%;transform:translateY(-50%);
  z-index:8;width:240px;pointer-events:none;
  opacity:0;
  transition:opacity .2s ease,transform .25s cubic-bezier(.16,1,.3,1);
  transform:translateY(-50%) translateX(12px);
}
.cert-focus.show{opacity:1;transform:translateY(-50%) translateX(0);}
.cf-issuer{font-family:var(--mono);font-size:0.4rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:.5rem;}
.cf-name{font-family:var(--serif);font-style:italic;font-size:clamp(1.1rem,2vw,1.5rem);font-weight:400;color:var(--white);line-height:1.2;margin-bottom:.4rem;}
.cf-year{font-family:var(--mono);font-size:0.4rem;letter-spacing:.12em;color:rgba(255,255,255,.22);}
.cf-rule{width:28px;height:1px;background:rgba(255,255,255,.2);margin:.8rem 0;}
.cf-hint{font-family:var(--mono);font-size:0.36rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.18);}
.cert-filters-bar{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);
  z-index:8;display:flex;gap:6px;align-items:center;flex-wrap:nowrap;
}
.c-filt{
  font-family:var(--mono);font-size:0.38rem;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 13px;
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.3);
  background:rgba(0,0,0,.65);
  cursor:none;
  border-radius:2px;
  transition:border-color .2s,color .2s,background .2s;
  position:relative;overflow:hidden;
  white-space:nowrap;
}
.c-filt::after{
  content:'';position:absolute;inset:0;
  background:rgba(255,255,255,.04);
  transform:scaleX(0);transform-origin:left;
  transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.c-filt:hover{border-color:rgba(255,255,255,.3);color:rgba(255,255,255,.7);}
.c-filt:hover::after{transform:scaleX(1);}
.c-filt.on{border-color:rgba(255,255,255,.5);color:#fff;background:rgba(255,255,255,.07);}
.cert-total-badge{
  position:absolute;bottom:2.2rem;right:3.5rem;z-index:8;pointer-events:none;
  font-family:var(--mono);font-size:0.38rem;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.18);
}

/* ══ PAGE 7 — PROJECTS ══ */
#p6{background:#000;display:flex;}
.proj-left{
  width:44%;
  display:flex;flex-direction:column;justify-content:center;
  padding:4rem 2.8rem 4rem 3.5rem;
  position:relative;z-index:2;
  border-right:1px solid rgba(255,255,255,0.06);
  overflow:hidden;
}
.proj-hdr{font-family:var(--mono);font-size:0.48rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--muted);margin-bottom:2.5rem;}
.proj-list{display:flex;flex-direction:column;gap:0;}
.proj-item{
  padding:.9rem 0;
  border-bottom:1px solid rgba(255,255,255,0.07);
  cursor:pointer;
  display:flex;align-items:center;gap:1.5rem;
  transition:padding-left .3s;
  position:relative;overflow:hidden;
}
.proj-item:first-child{border-top:1px solid rgba(255,255,255,0.07);}
.proj-item::before{content:'';position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,0.03);transition:width .3s;}
.proj-item.active{padding-left:0.8rem;}
.proj-item.active::before{width:100%;}
.proj-num{font-family:var(--mono);font-size:0.46rem;color:var(--muted);letter-spacing:0.12em;width:2.2rem;flex-shrink:0;}
.proj-name{font-family:var(--serif);font-size:clamp(.95rem,1.8vw,1.35rem);font-style:italic;font-weight:400;color:var(--muted);transition:color .3s;line-height:1.1;}
.proj-item.active .proj-name{color:var(--white);}
.proj-arrow{margin-left:auto;font-size:0.75rem;color:var(--muted);transition:transform .3s,color .3s;flex-shrink:0;}
.proj-item.active .proj-arrow{color:var(--white);transform:translateX(4px);}

.proj-preview-popup{
  position:fixed;width:280px;height:190px;
  pointer-events:none;z-index:500;
  opacity:0;transform:scale(0.88) rotate(1.5deg);
  transition:opacity .22s,transform .22s cubic-bezier(.16,1,.3,1);
  border:1px solid rgba(255,255,255,0.1);
  overflow:hidden;background:#0a0a0a;
}
.proj-preview-popup.show{opacity:1;transform:scale(1) rotate(0deg);}
.proj-preview-popup canvas{width:100%;height:100%;display:block;}

.proj-right{
  flex:1;
  position:relative;
  overflow:hidden;
}

.proj-detail{
  position:absolute;
  inset:0;
  display:flex;
  align-items:flex-end;
  padding:3rem;
  opacity:0;
  transform:translateX(18px);
  transition:opacity .38s ease, transform .38s cubic-bezier(.16,1,.3,1);
  pointer-events:none;
}
.proj-detail.active{
  opacity:1;
  transform:translateX(0);
  pointer-events:auto;
}

.proj-detail-img-wrap{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
}
.proj-detail-img-wrap img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  transition:transform .7s cubic-bezier(.16,1,.3,1);
}
.proj-detail.active .proj-detail-img-wrap img{
  transform:scale(1.03);
}
.proj-detail-img-wrap::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(
    to top,
    rgba(0,0,0,0.9) 0%,
    rgba(0,0,0,0.6) 40%,
    rgba(0,0,0,0.2) 70%,
    transparent 100%
  );
  z-index:1;
}

.proj-detail-img-placeholder{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:0.44rem;letter-spacing:0.18em;
  text-transform:uppercase;color:rgba(255,255,255,0.12);
}

.proj-detail-meta{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  max-width:520px;
  padding:3rem;
  color:#fff;
}
.proj-detail:nth-child(2) .proj-detail-img-wrap img,
.proj-detail:nth-child(3) .proj-detail-img-wrap img,
.proj-detail:nth-child(4) .proj-detail-img-wrap img,
.proj-detail:nth-child(5) .proj-detail-img-wrap img{
  object-position: left center;
}
.proj-detail-num{
  font-family:var(--mono);font-size:0.44rem;letter-spacing:0.22em;
  text-transform:uppercase;color:rgba(255,255,255,0.25);
  margin-bottom:0.6rem;
}
.proj-detail-name{
  font-family:var(--serif);
  font-size:clamp(1.6rem,3.2vw,2.8rem);
  font-style:italic;font-weight:400;
  color:var(--white);line-height:1;
  margin-bottom:0.9rem;
  letter-spacing:-0.01em;
}
.proj-detail-status{
  font-family:var(--mono);font-size:0.42rem;letter-spacing:0.15em;
  text-transform:uppercase;color:rgba(255,255,255,0.45);
  border:1px solid rgba(255,255,255,0.16);
  display:inline-block;padding:0.22rem 0.6rem;
  margin-bottom:1.2rem;
  align-self:flex-start;
}
.proj-detail-desc{
  font-family:var(--sans);font-size:clamp(.82rem,1.3vw,0.96rem);
  font-weight:300;color:rgba(255,255,255,0.5);
  line-height:1.75;
  margin-bottom:1.4rem;
}
.proj-detail-tags{display:flex;flex-wrap:wrap;gap:0.4rem;margin-bottom:1.4rem;}
.proj-tag-pill{
  font-family:var(--mono);font-size:0.4rem;letter-spacing:0.1em;
  text-transform:uppercase;color:rgba(255,255,255,0.3);
  border:1px solid rgba(255,255,255,0.1);padding:0.2rem 0.55rem;
}
.proj-detail-link{
  font-family:var(--mono);font-size:0.5rem;letter-spacing:0.15em;
  text-transform:uppercase;color:var(--white);text-decoration:none;
  display:inline-flex;align-items:center;gap:0.45rem;
  transition:gap .2s;
  align-self:flex-start;
}
.proj-detail-link:hover{gap:.85rem;}
.proj-detail-link.disabled{color:rgba(255,255,255,0.2);pointer-events:none;}

/* ══ PAGE 8 — ABOUT (lanyard · bento) ══ */
#pAbout{background:#050508;position:relative;overflow:hidden;display:flex;}
#pAbout::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(255,255,255,0.005) 3px,rgba(255,255,255,0.005) 4px);pointer-events:none;z-index:0;}

.ab-lanyard-wrap{width:30%;height:100%;flex-shrink:0;align-self:stretch;position:relative;z-index:2;overflow:hidden;}
#lanyardCanvas{width:100%;height:100%;display:block;cursor:grab;}
#lanyardCanvas:active{cursor:grabbing;}
.ab-lanyard-wrap::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,#050508 0%,transparent 15%,transparent 85%,#050508 100%),linear-gradient(to bottom,#050508 0%,transparent 10%,transparent 90%,#050508 100%);}

.ab-spotlight{position:absolute;width:700px;height:700px;border-radius:50%;pointer-events:none;z-index:1;opacity:0;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,255,255,0.07) 0%,rgba(255,255,255,0.03) 20%,rgba(255,255,255,0.01) 45%,transparent 70%);transition:opacity .25s ease;will-change:left,top;}

.ab-card{position:relative;overflow:hidden;background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.07);border-radius:12px;padding:1.1rem 1.2rem;cursor:default;--gx:50%;--gy:50%;--gi:0;--gr:320px;opacity:0;transform:translateY(22px);transition:border-color .25s,background .2s,box-shadow .25s;}
.ab-card.ab-in{opacity:1;transform:translateY(0);transition:opacity .55s ease,transform .55s cubic-bezier(.16,1,.3,1),border-color .25s,background .2s,box-shadow .25s;}
.ab-card::before{content:'';position:absolute;left:var(--gx);top:var(--gy);width:var(--gr);height:var(--gr);transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,calc(var(--gi)*0.13)) 0%,transparent 70%);pointer-events:none;z-index:0;}
.ab-card::after{content:'';position:absolute;inset:0;border-radius:12px;box-shadow:inset 0 0 0 1px rgba(255,255,255,calc(var(--gi)*0.26));pointer-events:none;z-index:1;}
.ab-card:hover{background:rgba(255,255,255,0.04);}
.ab-card-inner{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;}

.ab-card--name  {grid-column:1/3;grid-row:1/3;}
.ab-card--name .ab-card-inner{justify-content:space-between;}
.ab-card--resume{grid-column:3/4;grid-row:1/2;cursor:pointer;}
.ab-card--langs {grid-column:3/4;grid-row:2/3;}
.ab-card--edu   {grid-column:1/3;grid-row:3/4;}
.ab-card--stats {grid-column:3/4;grid-row:3/4;}
.ab-card--avail {grid-column:3/4;grid-row:4/5;}
.ab-card--skills{grid-column:1/3;grid-row:4/5;}

.ab-bento{flex:1;position:relative;overflow:hidden;padding:4.5rem 1.5rem 1.5rem 1rem;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 0.9fr 0.8fr;gap:7px;z-index:2;}

.ab-tag{font-family:var(--mono);font-size:0.46rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.28);margin-bottom:.5rem;}
.ab-name-big{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,2.4vw,2.2rem);color:#fff;line-height:.95;letter-spacing:-.01em;margin-bottom:.55rem;}
.ab-name-sub{font-family:var(--sans);font-size:clamp(.82rem,1.2vw,1rem);font-weight:300;color:rgba(255,255,255,.45);line-height:1.65;}
.ab-contact-row{display:flex;flex-direction:column;gap:.32rem;margin-top:.7rem;}
.ab-contact-item{font-family:var(--mono);font-size:0.44rem;letter-spacing:.1em;color:rgba(255,255,255,.32);display:flex;align-items:center;gap:.4rem;}
.ab-contact-item::before{content:'·';color:rgba(255,255,255,.22);}
.ab-roles{margin-top:.7rem;padding-top:.7rem;border-top:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:.65rem;}
.ab-role-item{}
.ab-role-title{font-family:var(--serif);font-style:italic;font-size:clamp(.96rem,1.5vw,1.18rem);color:rgba(255,255,255,.82);margin-bottom:.18rem;line-height:1.2;}
.ab-role-sub{font-family:var(--mono);font-size:0.48rem;letter-spacing:.06em;color:rgba(255,255,255,.38);line-height:1.6;}

.ab-resume-big{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2vw,1.8rem);color:#fff;margin:auto 0 .3rem;line-height:1.05;}
.ab-resume-sub{font-family:var(--mono);font-size:0.42rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.28);}
.ab-resume-cta{margin-top:auto;font-family:var(--mono);font-size:0.44rem;letter-spacing:.12em;text-transform:uppercase;color:#000;background:#fff;padding:.35rem .8rem;display:inline-flex;align-items:center;gap:.4rem;border-radius:3px;transition:gap .2s,transform .15s;}
.ab-card--resume:hover .ab-resume-cta{gap:.7rem;transform:translateY(-1px);}

.ab-edu-cols{display:grid;grid-template-columns:1.5fr 1fr;gap:1.5rem;margin-top:.5rem;flex:1;}
.ab-edu-col{}
.ab-edu-col--main{display:flex;flex-direction:column;gap:.3rem;}
.ab-edu-tag-sm{font-family:var(--mono);font-size:0.38rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.25);margin-bottom:.28rem;}
.ab-edu-detail{font-family:var(--sans);font-size:0.56rem;font-weight:300;color:rgba(255,255,255,.32);line-height:1.6;margin-top:.35rem;}
.ab-edu-deg{font-family:var(--serif);font-style:italic;font-size:clamp(.82rem,1.3vw,1rem);color:rgba(255,255,255,.85);line-height:1.25;margin-bottom:.16rem;}
.ab-edu-sch{font-family:var(--mono);font-size:0.4rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.38);}

.ab-lang-item{margin-bottom:.62rem;}.ab-lang-item:last-child{margin-bottom:.5rem;}
.ab-lang-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.2rem;}
.ab-lang-nm{font-family:var(--serif);font-style:italic;font-size:.9rem;color:rgba(255,255,255,.82);}
.ab-lang-lv{font-family:var(--mono);font-size:0.36rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.28);}
.ab-lang-tr{height:1.5px;background:rgba(255,255,255,.08);border-radius:1px;overflow:hidden;}
.ab-lang-fi{height:100%;background:rgba(255,255,255,.6);border-radius:1px;transform:scaleX(0);transform-origin:left;transition:transform 1.2s cubic-bezier(.16,1,.3,1);}
#pAbout.revealed .ab-lang-fi{transform:scaleX(1);}
.ab-lang-contacts{margin-top:.7rem;padding-top:.55rem;border-top:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:.28rem;}
.ab-lang-contact{font-family:var(--mono);font-size:0.38rem;letter-spacing:.08em;color:rgba(255,255,255,.3);display:flex;align-items:center;gap:.35rem;}
.ab-lang-contact::before{content:'→';color:rgba(255,255,255,.18);font-size:.6rem;}

.ab-avail-status{display:flex;align-items:center;gap:.45rem;margin-bottom:.7rem;}
.ab-avail-dot{width:7px;height:7px;border-radius:50%;background:#5ad17a;flex-shrink:0;
  box-shadow:0 0 8px rgba(90,209,122,0.7);animation:availPulse 2s ease-in-out infinite;}
@keyframes availPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.5;transform:scale(.75);}}
.ab-avail-text{font-family:var(--mono);font-size:.5rem;letter-spacing:.18em;text-transform:uppercase;color:#5ad17a;}
.ab-avail-for{font-family:var(--serif);font-style:italic;font-size:clamp(.78rem,1.1vw,.92rem);color:rgba(255,255,255,.58);line-height:1.55;flex:1;display:flex;align-items:center;}
.ab-avail-cta{font-family:var(--mono);font-size:.4rem;letter-spacing:.1em;color:rgba(255,255,255,.28);margin-top:.6rem;padding-top:.55rem;border-top:1px solid rgba(255,255,255,.07);}

.ab-skills-wrap{display:flex;flex-wrap:wrap;gap:.24rem;margin-top:.3rem;flex:1;align-content:flex-start;}
.ab-pill{font-family:var(--mono);font-size:0.26rem;letter-spacing:.06em;text-transform:uppercase;padding:.15rem .35rem;border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.45);border-radius:3px;background:rgba(255,255,255,.02);transition:border-color .18s,color .18s,background .18s,transform .12s;cursor:default;}
.ab-pill:hover{border-color:rgba(255,255,255,.38);color:rgba(255,255,255,.9);background:rgba(255,255,255,.07);transform:translateY(-2px);}
.ab-pill--hot{border-color:rgba(255,255,255,.1);color:rgba(255,255,255,.45);background:rgba(255,255,255,.02);}
.ab-pill--hot:hover{border-color:rgba(255,255,255,.38);color:rgba(255,255,255,.9);background:rgba(255,255,255,.07);}

.ab-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem .9rem;margin-top:.4rem;flex:1;align-content:start;}
.ab-stat-item{}
.ab-stat-val{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2vw,1.65rem);color:#fff;line-height:1;}
.ab-stat-lbl{font-family:var(--mono);font-size:0.36rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.28);margin-top:.1rem;}

.ab-particle{position:absolute;width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.85);pointer-events:none;z-index:4;}
.ab-ripple{position:absolute;border-radius:50%;pointer-events:none;z-index:5;transform:scale(0);opacity:1;animation:abRip .85s cubic-bezier(.2,0,.1,1) forwards;}
@keyframes abRip{to{transform:scale(1);opacity:0;}}

/* ══ PAGE 9 — CONTACT ══ */
#p7{background:#000;display:flex;align-items:center;justify-content:center;}
.contact-tag{position:absolute;top:2rem;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:0.48rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--muted);z-index:10;white-space:nowrap;}
#globe-canvas{cursor:none;width:100%;height:100%;display:block;position:absolute;inset:0;outline:none;}
.face-title{user-select:none;position:absolute;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1rem,2vw,2rem);color:var(--white);left:2em;top:50%;pointer-events:none;z-index:10;}
.face-title.active{opacity:1;transform:translate(0,-50%);transition:0.5s ease;}
.face-title.inactive{opacity:0;transform:translate(-10%,-50%);transition:0.1s ease;}
.face-description{user-select:none;position:absolute;font-family:var(--mono);font-size:0.46rem;letter-spacing:0.1em;color:var(--muted);max-width:12ch;top:50%;right:1.5rem;z-index:10;pointer-events:none;text-transform:uppercase;}
.face-description.active{opacity:1;transform:translate(0,-50%);transition:0.5s ease;}
.face-description.inactive{opacity:0;transform:translate(15%,-50%);transition:0.1s ease;}
.action-button{position:absolute;left:50%;z-index:10;width:44px;height:44px;display:grid;place-items:center;background:#fff;border:none;border-radius:50%;cursor:pointer;text-decoration:none;}
.action-button-icon{font-size:18px;color:#000;position:relative;top:1px;line-height:1;}
.action-button.active{bottom:3em;transform:translateX(-50%) scale(1);opacity:1;pointer-events:auto;transition:0.5s ease;}
.action-button.inactive{bottom:-80px;transform:translateX(-50%) scale(0);opacity:0;pointer-events:none;transition:0.1s ease;}
@media(max-width:900px){.face-title,.face-description{display:none;}}

/* ══════════════════════════════════════════════
   APPEND THIS ENTIRE BLOCK to the bottom of style.css
   ══════════════════════════════════════════════ */

/* ══ PAGE 7 — THE BREACH REPORT (Newspaper Projects) ══ */

#p6 { background:#000; overflow-y:auto; scrollbar-width:none; display:block; }
#p6::-webkit-scrollbar { display:none; }

.br-page {
  padding:4.5rem 5rem 5rem;
  max-width:1600px;
  margin:0 auto;
  min-height:100%;
}

/* Masthead */
.br-masthead {
  text-align:center;
  border-top:2px solid rgba(255,255,255,0.75);
  border-bottom:2px solid rgba(255,255,255,0.75);
  padding:0.7rem 0 0.5rem;
  margin-bottom:0.4rem;
}
.br-mast-top {
  display:flex;
  justify-content:space-between;
  font-family:var(--mono);
  font-size:0.42rem;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.28);
  margin-bottom:0.5rem;
}
.br-mast-name {
  font-family:'Cormorant Garamond', var(--serif);
  font-size:clamp(1rem,2.2vw,1.6rem);
  font-weight:600;
  font-style:italic;
  color:#fff;
  letter-spacing:0.04em;
  line-height:1;
  position:relative;
  display:inline-block;
}
.br-mast-name::before,
.br-mast-name::after {
  content:attr(data-t);
  position:absolute;
  top:0;left:0;width:100%;
}
.br-mast-name::before {
  color:#f00;
  animation:brG1 5s infinite;
  clip-path:polygon(0 15%,100% 15%,100% 35%,0 35%);
}
.br-mast-name::after {
  color:#0ff;
  animation:brG2 5s infinite;
  clip-path:polygon(0 55%,100% 55%,100% 75%,0 75%);
}
@keyframes brG1{0%,85%,100%{transform:translate(0)}87%{transform:translate(-4px,1px)}90%{transform:translate(3px,-1px)}93%{transform:translate(-2px,0)}}
@keyframes brG2{0%,83%,100%{transform:translate(0)}85%{transform:translate(4px,1px)}88%{transform:translate(-3px,-1px)}91%{transform:translate(2px,0)}}
.br-mast-sub {
  font-family:var(--mono);
  font-size:0.38rem;
  letter-spacing:0.28em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.28);
  margin-top:0.4rem;
}

/* Edition bar */
.br-edition {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:0.4rem;
  font-family:var(--mono);
  font-size:0.38rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.22);
  padding:0.3rem 0;
  border-bottom:1px solid rgba(255,255,255,0.1);
  margin-bottom:1rem;
}
.br-live-dot {
  width:5px;height:5px;
  background:#fff;border-radius:50%;
  display:inline-block;margin-right:4px;
  animation:brBlink 1.4s ease-in-out infinite;
}
@keyframes brBlink{0%,100%{opacity:1}50%{opacity:0.15}}

/* Grid layouts */
.br-grid {
  display:grid;
  border-left:1px solid rgba(255,255,255,0.1);
  margin-bottom:0;
}
.br-grid-8-4 { grid-template-columns:2fr 1fr; }
.br-grid-4col { grid-template-columns:1fr 1fr 1fr 1fr; }

.br-col {
  border-right:1px solid rgba(255,255,255,0.1);
  border-bottom:1px solid rgba(255,255,255,0.1);
  padding:1.2rem 1.4rem;
}

/* Section label */
.br-sec-label {
  font-family:var(--mono);
  font-size:0.36rem;
  letter-spacing:0.25em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.22);
  border-bottom:1px solid rgba(255,255,255,0.1);
  padding-bottom:0.3rem;
  margin-bottom:0.5rem;
}

/* Breaking badge */
.br-breaking {
  background:#fff;
  color:#000;
  font-family:var(--mono);
  font-size:0.36rem;
  letter-spacing:0.2em;
  text-transform:uppercase;
  padding:1px 6px;
  display:inline-block;
  margin-bottom:0.4rem;
}

/* Headlines */
.br-headline {
  font-family:'Cormorant Garamond', var(--serif);
  font-style:italic;
  font-weight:600;
  color:#fff;
  line-height:1.08;
  cursor:pointer;
  transition:opacity 0.2s;
  margin-bottom:0.35rem;
}
.br-headline:hover { opacity:0.6; }
.br-xl { font-size:clamp(1.5rem,3.2vw,2.4rem); letter-spacing:-0.02em; }
.br-lg { font-size:clamp(1rem,2.2vw,1.6rem); letter-spacing:-0.01em; }
.br-md { font-size:clamp(0.85rem,1.8vw,1.15rem); }

/* Byline */
.br-byline {
  font-family:var(--mono);
  font-size:0.36rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.25);
  margin-bottom:0.4rem;
}

/* Pull quote */
.br-pull {
  font-family:'Cormorant Garamond', var(--serif);
  font-style:italic;
  font-size:clamp(0.85rem,1.8vw,1.15rem);
  color:rgba(255,255,255,0.55);
  border-left:2px solid rgba(255,255,255,0.45);
  padding-left:0.7rem;
  margin:0.5rem 0;
  line-height:1.35;
}

/* Deck / body text */
.br-deck {
  font-family:var(--mono);
  font-size:0.4rem;
  line-height:1.7;
  color:rgba(255,255,255,0.4);
  margin-bottom:0.5rem;
}
.br-deck em { font-style:italic; color:rgba(255,255,255,0.6); }

/* Redacted text */
.br-redact {
  background:rgba(255,255,255,0.82);
  color:rgba(255,255,255,0.82);
  cursor:pointer;
  transition:all 0.35s;
  display:inline;
}
.br-redact:hover {
  background:transparent;
  color:rgba(255,255,255,0.65);
}

/* Tags */
.br-tags-row { display:flex; flex-wrap:wrap; gap:4px; margin:0.4rem 0; }
.br-tag {
  font-family:var(--mono);
  font-size:0.33rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,0.15);
  color:rgba(255,255,255,0.3);
  padding:1px 5px;
}
.br-tag-hot { border-color:rgba(255,255,255,0.5); color:rgba(255,255,255,0.7); }

/* Read link */
.br-read {
  font-family:var(--mono);
  font-size:0.36rem;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.2);
  border-bottom:1px solid rgba(255,255,255,0.1);
  cursor:pointer;
  transition:color 0.2s, border-color 0.2s;
  display:inline-block;
  margin-top:0.3rem;
}
.br-read:hover { color:rgba(255,255,255,0.65); border-color:rgba(255,255,255,0.45); }

/* Divider */
.br-divh { border:none; border-top:1px solid rgba(255,255,255,0.1); margin:0.7rem 0; }

/* Footer line */
.br-footer-line {
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:0.4rem;
  font-family:var(--mono);
  font-size:0.33rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.15);
  margin-top:0.5rem;
}
.br-footer-link {
  color:rgba(255,255,255,0.2);
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,0.1);
  transition:color 0.2s, border-color 0.2s;
}
.br-footer-link:hover { color:rgba(255,255,255,0.55); border-color:rgba(255,255,255,0.4); }

/* ══ BREACH MODAL ══ */
#breachModal {
  position:fixed;
  inset:0;
  z-index:900;
  background:rgba(0,0,0,0.92);
  backdrop-filter:blur(32px);
  -webkit-backdrop-filter:blur(32px);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  pointer-events:none;
  transition:opacity 0.35s ease;
}
#breachModal.open { opacity:1; pointer-events:auto; }

.bm-box {
  width:min(860px,94vw);
  max-height:85vh;
  background:#080808;
  border:1px solid rgba(255,255,255,0.1);
  display:flex;
  flex-direction:row;
  overflow:hidden;
  position:relative;
  transform:translateY(20px) scale(0.97);
  transition:transform 0.4s cubic-bezier(.16,1,.3,1);
}
#breachModal.open .bm-box { transform:translateY(0) scale(1); }

.bm-close {
  position:absolute;
  top:1rem;right:1.2rem;
  z-index:20;
  background:rgba(0,0,0,0.5);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:50%;
  width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  font-family:var(--mono);
  font-size:0.45rem;
  color:rgba(255,255,255,0.4);
  padding:0;
  transition:color .2s, background .2s, border-color .2s;
}
.bm-close:hover { color:#fff; background:rgba(255,255,255,0.1); border-color:rgba(255,255,255,0.3); }

.bm-left {
  width:38%;
  flex-shrink:0;
  border-right:1px solid rgba(255,255,255,0.08);
  padding:2rem;
  background:#060606;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.bm-num {
  font-family:'Cormorant Garamond', var(--serif);
  font-size:5.5rem;
  font-style:italic;
  font-weight:600;
  color:rgba(255,255,255,0.05);
  line-height:1;
}
.bm-cat {
  font-family:var(--mono);
  font-size:0.38rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.22);
  margin-bottom:0.5rem;
}
.bm-name {
  font-family:'Cormorant Garamond', var(--serif);
  font-style:italic;
  font-weight:600;
  font-size:clamp(1.3rem,2.5vw,2rem);
  color:#fff;
  line-height:1.05;
  letter-spacing:-0.02em;
  margin-bottom:0.5rem;
}
.bm-status {
  font-family:var(--mono);
  font-size:0.38rem;
  letter-spacing:0.15em;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,0.2);
  color:rgba(255,255,255,0.45);
  display:inline-block;
  padding:2px 8px;
  margin-bottom:0.8rem;
}
.bm-status.live { border-color:rgba(255,255,255,0.6); color:rgba(255,255,255,0.85); }
.bm-tags { display:flex; flex-wrap:wrap; gap:4px; margin-top:auto; }
.bm-tags .br-tag { font-size:0.33rem; }

.bm-right {
  flex:1;
  padding:2rem;
  overflow-y:auto;
  scrollbar-width:none;
  display:flex;
  flex-direction:column;
}
.bm-right::-webkit-scrollbar { display:none; }
.bm-headline {
  font-family:'Cormorant Garamond', var(--serif);
  font-style:italic;
  font-weight:600;
  font-size:clamp(1rem,2vw,1.4rem);
  color:#fff;
  line-height:1.2;
  margin-bottom:0.7rem;
  letter-spacing:-0.01em;
}
.bm-body {
  font-family:var(--sans);
  font-size:clamp(0.78rem,1.2vw,0.9rem);
  font-weight:300;
  color:rgba(255,255,255,0.48);
  line-height:1.85;
  flex:1;
}
.bm-body p { margin-bottom:0.7rem; }
.bm-link {
  font-family:var(--mono);
  font-size:0.42rem;
  letter-spacing:0.15em;
  text-transform:uppercase;
  color:#fff;
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,0.3);
  display:inline-block;
  margin-top:1rem;
  transition:border-color 0.2s, letter-spacing 0.2s;
  align-self:flex-start;
}
.bm-link:hover { border-color:#fff; letter-spacing:0.22em; }
.bm-link.disabled { color:rgba(255,255,255,0.2); pointer-events:none; border-color:rgba(255,255,255,0.1); }

@media(max-width:700px) {
  .bm-box { flex-direction:column; }
  .bm-left { width:100%; border-right:none; border-bottom:1px solid rgba(255,255,255,0.08); }
  .br-grid-8-4, .br-grid-4col { grid-template-columns:1fr; }
  .br-page { padding:1.2rem; }
}
.menu-item, .menu-item:first-child, .menu-item:last-child {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}
/* hide scan2 in skills — timing glitch leaves it across a row */
#p3 .scan2 { display: none; }
/* prevent marquee-overlay sub-pixel bleed */
.menu-item { overflow: hidden; transform: translateZ(0); }
.marquee-overlay { border: none !important; outline: none !important; }
/* ══════════════════════════════════════════════
   PADMESH PORTFOLIO — READABILITY & PROJECTS FIX
   Append this entire block to the bottom of style.css
   ══════════════════════════════════════════════ */

/* ── GLOBAL: Fix absurdly small rem-based font sizes ──
   The original code uses values like 0.38rem–0.5rem.
   At 16px base that's 6–8px — unreadable.
   We override all mono/label/tag/meta text globally.
── */

/* Navigation & page labels */
.page-title {
  font-size: clamp(0.7rem, 1.2vw, 0.95rem);
}

/* Mono micro-labels everywhere */
.about-tag,
.intern-eyebrow,
.intern-card-num,
.intern-card-org,
.intern-card-tag,
.intern-stat-label,
.proj-hdr,
.proj-num,
.xcard-cat,
.xcard-preview,
.xcard-click-hint,
.cert-hud-label,
.cf-issuer,
.cf-year,
.cf-hint,
.c-filt,
.cert-total-badge,
.ab-tag,
.ab-contact-item,
.ab-freelance-sub,
.ab-resume-sub,
.ab-edu-tag-sm,
.ab-edu-sch,
.ab-lang-lv,
.ab-lang-contact,
.ab-stat-lbl,
.ab-pill,
.modal-tag,
.modal-sub,
.modal-tag-pill,
.modal-link,
.scroll-label,
.nav-col a {
  font-size: 0.72rem !important;
  letter-spacing: 0.12em !important;
}

/* Slightly bigger for readability-critical items */
.intern-card-org,
.xcard-preview,
.ab-freelance-sub,
.ab-edu-sch,
.ab-lang-contact {
  font-size: 0.75rem !important;
}

/* Body text in modals */
.modal-body,
.bm-body {
  font-size: clamp(0.88rem, 1.35vw, 1rem) !important;
  line-height: 1.85 !important;
  color: rgba(255,255,255,0.62) !important;
}

/* About section body */
.about-text2 {
  font-size: clamp(0.95rem, 1.6vw, 1.15rem) !important;
}

/* Experience card text */
.xcard-title {
  font-size: 1.05rem !important;
}

.xcard-preview {
  font-size: 0.78rem !important;
  color: rgba(255,255,255,0.5) !important;
}

/* Internship card roles */
.intern-card-role {
  font-size: clamp(1rem, 1.8vw, 1.4rem) !important;
}

/* Proj list names */
.proj-name {
  font-size: clamp(0.95rem, 1.6vw, 1.3rem) !important;
}

/* Proj detail description */
.proj-detail-desc {
  font-size: clamp(0.88rem, 1.3vw, 1rem) !important;
  color: rgba(255,255,255,0.6) !important;
}

.proj-detail-long {
  font-family: var(--sans);
  font-size: clamp(0.85rem, 1.2vw, 0.95rem);
  font-weight: 300;
  color: rgba(255,255,255,0.5);
  line-height: 1.75;
  margin-bottom: 1rem;
}

/* ── BREACH REPORT — Projects page overhaul ── */

/* Less aggressive padding */
.br-page {
  padding: 3rem 3.5rem 3.5rem !important;
}

/* Section labels — was 0.36rem (5.7px) */
.br-sec-label {
  font-size: 0.72rem !important;
  letter-spacing: 0.18em !important;
  margin-bottom: 0.6rem !important;
}

/* Breaking badge */
.br-breaking {
  font-size: 0.65rem !important;
  letter-spacing: 0.16em !important;
  margin-bottom: 0.5rem !important;
}

/* Headlines — keep the serif drama, just ensure min sizes */
.br-xl {
  font-size: clamp(1.4rem, 2.8vw, 2.2rem) !important;
}
.br-lg {
  font-size: clamp(1.1rem, 2vw, 1.5rem) !important;
}
.br-md {
  font-size: clamp(0.95rem, 1.6vw, 1.2rem) !important;
}

/* Byline — was 0.36rem */
.br-byline {
  font-size: 0.72rem !important;
  letter-spacing: 0.1em !important;
  margin-bottom: 0.5rem !important;
  color: rgba(255,255,255,0.35) !important;
}

/* Pull quote */
.br-pull {
  font-size: clamp(0.9rem, 1.6vw, 1.1rem) !important;
  color: rgba(255,255,255,0.6) !important;
}

/* Deck/body — this was 0.4rem = 6.4px. Criminal. */
.br-deck {
  font-size: 0.82rem !important;
  line-height: 1.7 !important;
  color: rgba(255,255,255,0.5) !important;
  margin-bottom: 0.6rem !important;
}

.br-deck em {
  color: rgba(255,255,255,0.75) !important;
}

/* Tags */
.br-tag {
  font-size: 0.65rem !important;
  letter-spacing: 0.08em !important;
  padding: 2px 7px !important;
}

/* Read link — was 0.36rem */
.br-read {
  font-size: 0.7rem !important;
  letter-spacing: 0.12em !important;
}

/* Masthead */
.br-mast-top {
  font-size: 0.68rem !important;
  letter-spacing: 0.14em !important;
  margin-bottom: 0.6rem !important;
}

.br-mast-name {
  font-size: clamp(1.2rem, 2.5vw, 1.8rem) !important;
}

.br-mast-sub {
  font-size: 0.68rem !important;
  letter-spacing: 0.22em !important;
  margin-top: 0.45rem !important;
}

/* Edition bar */
.br-edition {
  font-size: 0.68rem !important;
  letter-spacing: 0.1em !important;
  padding: 0.4rem 0 !important;
  margin-bottom: 1.1rem !important;
}

/* Column padding — give text room */
.br-col {
  padding: 1.4rem 1.6rem !important;
}

/* Footer */
.br-footer-line {
  font-size: 0.65rem !important;
  letter-spacing: 0.1em !important;
}

/* Breach modal */
.bm-cat {
  font-size: 0.7rem !important;
  letter-spacing: 0.18em !important;
}

.bm-status {
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
  padding: 3px 10px !important;
}

.bm-tags .br-tag {
  font-size: 0.65rem !important;
}

.bm-headline {
  font-size: clamp(1rem, 1.8vw, 1.35rem) !important;
  line-height: 1.25 !important;
  margin-bottom: 0.8rem !important;
}

.bm-link {
  font-size: 0.72rem !important;
  letter-spacing: 0.14em !important;
}

/* ── Projects section (old panel layout) ── */
.proj-detail-num {
  font-size: 0.7rem !important;
  letter-spacing: 0.18em !important;
}

.proj-detail-status {
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
}

.proj-tag-pill {
  font-size: 0.65rem !important;
  padding: 0.22rem 0.6rem !important;
}

.proj-detail-link {
  font-size: 0.72rem !important;
}

/* ── Cert section labels ── */
.cert-hud-num {
  font-size: clamp(2.8rem, 5.5vw, 5rem) !important;
}

.cf-name {
  font-size: clamp(1rem, 1.8vw, 1.4rem) !important;
}

/* ── About bento ── */
.ab-name-sub {
  font-size: clamp(0.85rem, 1.2vw, 1rem) !important;
  color: rgba(255,255,255,0.5) !important;
}

.ab-freelance-title {
  font-size: clamp(0.9rem, 1.3vw, 1.05rem) !important;
}

.ab-edu-deg {
  font-size: clamp(0.85rem, 1.3vw, 1rem) !important;
}

.ab-lang-nm {
  font-size: 0.9rem !important;
}

/* ── Modal generic ── */
.modal-body {
  font-size: clamp(0.88rem, 1.3vw, 0.98rem) !important;
}

/* ── Responsive: projects 4-col collapses to 2-col at mid viewport ── */
@media (max-width: 1100px) {
  .br-grid-4col {
    grid-template-columns: 1fr 1fr !important;
  }
  .br-page {
    padding: 2.5rem 2.5rem 3rem !important;
  }
}

@media (max-width: 700px) {
  .br-grid-8-4,
  .br-grid-4col {
    grid-template-columns: 1fr !important;
  }
  .br-page {
    padding: 1.5rem 1.2rem 2rem !important;
  }
  .br-deck {
    font-size: 0.85rem !important;
  }
}
/* ══════════════════════════════════════════════
   FONT SIZE FIXES — append to bottom of style.css
   Only touches font-size, letter-spacing, color.
   Zero layout properties. No flex/grid/width/height.
   ══════════════════════════════════════════════ */

/* ── Page section labels ── */
.page-title { font-size: 0.78rem; }

/* ── About ── */
.about-tag { font-size: 0.75rem; letter-spacing: 0.2em; }
.about-text2 { font-size: clamp(0.95rem, 1.5vw, 1.15rem); }

/* ── Internships ── */
.intern-eyebrow { font-size: 0.75rem; }
.intern-sub { font-size: clamp(0.88rem, 1.3vw, 1rem); }
.intern-stat-label { font-size: 0.72rem; letter-spacing: 0.16em; }
.intern-card-num { font-size: 0.72rem; }
.intern-card-org { font-size: 0.78rem; letter-spacing: 0.12em; }
.intern-card-tag { font-size: 0.7rem; }

/* ── Experience cards ── */
.xcard-cat { font-size: 0.7rem; letter-spacing: 0.18em; }
.xcard-title { font-size: 1.05rem; }
.xcard-preview { font-size: 0.8rem; line-height: 1.55; }
.xcard-click-hint { font-size: 0.68rem; }

/* ── Certifications ── */
.cert-hud-label { font-size: 0.72rem; letter-spacing: 0.2em; }
.cf-issuer { font-size: 0.72rem; }
.cf-year { font-size: 0.72rem; }
.cf-hint { font-size: 0.68rem; }
.c-filt { font-size: 0.7rem; }
.cert-total-badge { font-size: 0.68rem; }

/* ── About bento — font sizes only, no layout ── */
.ab-tag { font-size: 0.72rem; letter-spacing: 0.15em; }
.ab-name-sub { font-size: clamp(0.85rem, 1.1vw, 0.98rem); }
.ab-contact-item { font-size: 0.75rem; }
.ab-freelance-sub { font-size: 0.72rem; }
.ab-resume-sub { font-size: 0.72rem; }
.ab-edu-tag-sm { font-size: 0.7rem; }
.ab-edu-sch { font-size: 0.72rem; letter-spacing: 0.08em; }
.ab-lang-lv { font-size: 0.68rem; }
.ab-lang-contact { font-size: 0.72rem; }
.ab-pill { font-size: 0.7rem; }
.ab-stat-lbl { font-size: 0.68rem; letter-spacing: 0.12em; }

/* ── Modal ── */
.modal-tag { font-size: 0.7rem; letter-spacing: 0.2em; }
.modal-sub { font-size: 0.72rem; }
.modal-body { font-size: clamp(0.88rem, 1.2vw, 0.98rem); line-height: 1.85; }
.modal-tag-pill { font-size: 0.68rem; }
.modal-link { font-size: 0.75rem; }
.modal-img-cat { font-size: 0.65rem; }

/* ── Breach modal ── */
.bm-cat { font-size: 0.7rem; letter-spacing: 0.18em; }
.bm-status { font-size: 0.68rem; }
.bm-headline { font-size: clamp(1rem, 1.6vw, 1.3rem); }
.bm-body { font-size: clamp(0.88rem, 1.2vw, 0.96rem); line-height: 1.85; }
.bm-link { font-size: 0.72rem; }

/* ══ FINDER PROJECTS WINDOW ══ */
#p6 { background: #000; display: flex; align-items: center; justify-content: center; }

.finder-host {
  width: 100%; max-width: 900px;
  padding: 0 2rem;
  position: relative; z-index: 5;
}

.finder-window {
  background: #F5F5F5;
  border: 1px solid #D0D0D0;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.3);
  display: flex; flex-direction: column;
  opacity: 0; transform: scale(0.96) translateY(20px);
}
#p6.revealed .finder-window {
  animation: finderIn 0.5s cubic-bezier(0.16,1,0.3,1) 0.25s forwards;
}
@keyframes finderIn { to { opacity:1; transform: scale(1) translateY(0); } }

.titlebar {
  height: 38px; background: #EBEBEB;
  border-bottom: 1px solid #D0D0D0;
  display: flex; align-items: center; padding: 0 12px;
  flex-shrink: 0; position: relative; user-select: none;
}
.traffic-lights { display: flex; gap: 7px; align-items: center; }
.tl { width: 12px; height: 12px; border-radius: 50%; cursor: default; position: relative; }
.tl-close { background: #FF5F57; border: 0.5px solid rgba(0,0,0,0.1); }
.tl-min   { background: #FEBC2E; border: 0.5px solid rgba(0,0,0,0.1); }
.tl-max   { background: #28C840; border: 0.5px solid rgba(0,0,0,0.1); }
.finder-window:hover .tl-close::after { content:'✕'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:8px; color:rgba(0,0,0,0.6); font-weight:700; }
.finder-window:hover .tl-min::after  { content:'—'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:9px; color:rgba(0,0,0,0.55); font-weight:700; margin-top:1px; }
.finder-window:hover .tl-max::after  { content:'⤢'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:9px; color:rgba(0,0,0,0.55); }
.window-title { position:absolute; left:50%; transform:translateX(-50%); font-size:13px; color:#3A3A3A; font-weight:500; white-space:nowrap; font-family:-apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif; }

.toolbar {
  height: 40px; background: #F0F0F0;
  border-bottom: 1px solid #D8D8D8;
  display: flex; align-items: center; gap: 8px; padding: 0 12px; flex-shrink: 0;
}
.tb-nav { display: flex; gap: 2px; }
.tb-btn {
  width: 28px; height: 24px; background: none; border: none;
  border-radius: 5px; cursor: default;
  display: flex; align-items: center; justify-content: center;
  color: #999; transition: background 0.1s;
}
.tb-btn:hover { background: rgba(0,0,0,0.06); }
.tb-divider { width:1px; height:20px; background:#D0D0D0; margin:0 4px; }
.breadcrumb {
  flex: 1; display: flex; align-items: center; gap: 4px;
  font-size: 12px; color: #666;
  background: rgba(255,255,255,0.6); border: 0.5px solid #D0D0D0;
  border-radius: 5px; padding: 3px 8px; height: 24px;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.breadcrumb-sep { color: #BBB; font-size: 11px; }
.breadcrumb-active { color: #3A3A3A; font-weight: 500; }
.tb-view { display: flex; gap: 2px; margin-left: 4px; }

.finder-body { display: flex; height: 380px; }

.finder-sidebar {
  width: 180px; flex-shrink: 0;
  background: #F0EFF0; border-right: 1px solid #D8D8D8;
  overflow-y: auto; padding: 10px 0; scrollbar-width: none;
}
.finder-sidebar::-webkit-scrollbar { display: none; }
.sidebar-section { margin-bottom: 6px; }
.sidebar-header {
  font-size: 10px; font-weight: 600; color: #999;
  text-transform: uppercase; letter-spacing: 0.08em;
  padding: 2px 12px 4px;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.sidebar-item {
  display: flex; align-items: center; gap: 7px;
  padding: 0 10px; height: 28px; font-size: 13px; color: #3A3A3A;
  cursor: default; border-radius: 6px; margin: 0 4px;
  transition: background 0.08s;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.sidebar-item i { font-size: 14px; color: #888; }
.sidebar-item:hover { background: rgba(0,0,0,0.06); }
.sidebar-item.active { background: #3478F6; color: #fff; }
.sidebar-item.active i { color: #fff; }

.finder-file-area {
  flex: 1; background: #FFFFFF;
  overflow-y: auto; padding: 12px;
  scrollbar-width: thin; scrollbar-color: #D0D0D0 transparent;
}
.finder-file-area::-webkit-scrollbar { width: 6px; }
.finder-file-area::-webkit-scrollbar-thumb { background: #D0D0D0; border-radius: 3px; }

.file-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
  gap: 4px;
}
.file-item {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 8px 4px 6px; border-radius: 6px;
  cursor: default; border: 1.5px solid transparent;
  transition: background 0.1s, border-color 0.1s;
  text-align: center; opacity: 0; transform: scale(0.85);
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
#p6.revealed .file-item { animation: finderItemIn 0.3s cubic-bezier(0.16,1,0.3,1) forwards; }
@keyframes finderItemIn { to { opacity:1; transform:scale(1); } }
.file-item:hover { background: rgba(60,120,255,0.08); cursor: cell; }
.file-item.selected { background: rgba(60,120,255,0.18); border-color: rgba(60,120,255,0.5); cursor: crosshair; }
.file-icon-wrap { position: relative; display: inline-block; }
.file-icon { font-size: 36px; color: #5B9BD5; line-height: 1; transition: color 0.1s; }
.file-item.selected .file-icon { color: #3478F6; }
.file-label {
  font-size: 11px; color: #3A3A3A; line-height: 1.25;
  max-width: 76px; overflow: hidden;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  transition: color 0.1s; word-break: break-word;
}
.file-item.selected .file-label { color: #1A4FCC; }
.file-badge {
  position: absolute; top: -4px; right: -4px;
  width: 8px; height: 8px; border-radius: 50%;
  border: 1.5px solid #fff;
}
.badge-active { background: #28C840; }
.badge-new    { background: #3478F6; }
.badge-dev    { background: #FEBC2E; }

.finder-preview {
  width: 230px; flex-shrink: 0;
  border-left: 1px solid #D8D8D8;
  background: #F7F7F7;
  display: flex; flex-direction: column; overflow: hidden;
}
.preview-empty {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 8px; padding: 20px; color: #BBBBBB;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.preview-empty i { font-size: 32px; }
.preview-empty p { font-size: 11px; text-align: center; line-height: 1.4; }
.preview-header {
  padding: 12px 14px 8px; border-bottom: 1px solid #E5E5E5;
}
.preview-title {
  font-size: 14px; font-weight: 500; color: #2A2A2A; line-height: 1.2;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.preview-content {
  flex: 1; overflow-y: auto; scrollbar-width: none;
  padding: 14px; display: flex; flex-direction: column; gap: 10px;
}
.preview-content::-webkit-scrollbar { display: none; }
.preview-big-icon { font-size: 48px; color: #3478F6; text-align: center; display: block; }
.preview-desc {
  font-size: 12px; color: #555; line-height: 1.55;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.preview-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.preview-tag {
  font-size: 10px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
  background: #E8E8E8; color: #666; padding: 2px 6px; border-radius: 3px;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.preview-meta {
  border-top: 1px solid #E5E5E5; padding-top: 8px;
  display: flex; flex-direction: column; gap: 5px;
}
.meta-row { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; }
.meta-key { font-size: 11px; color: #888; font-family: 'SF Mono',Menlo,monospace; }
.meta-val { font-size: 11px; color: #3A3A3A; font-family: 'SF Mono',Menlo,monospace; text-align: right; }
.meta-val.active-badge { color: #1A7E2A; background: #E6F7E8; padding: 1px 5px; border-radius: 3px; font-size: 10px; }
.meta-val.new-badge    { color: #1A4FCC; background: #E6EEFF; padding: 1px 5px; border-radius: 3px; font-size: 10px; }
.meta-val.dev-badge    { color: #8A5A00; background: #FFF4D6; padding: 1px 5px; border-radius: 3px; font-size: 10px; }
.preview-open-wrap { padding: 14px 14px 16px; }
.finder-open-btn {
  display: block; width: 100%; padding: 7px 12px;
  background: #3478F6; color: #fff; border: none; border-radius: 6px;
  font-size: 12px; font-weight: 500; cursor: pointer;
  text-align: center; text-decoration: none;
  transition: background 0.15s, transform 0.1s;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.finder-open-btn:hover { background: #2060D8; transform: translateY(-1px); }
.finder-open-btn.disabled { background: #C8C8C8; cursor: default; pointer-events: none; }

.finder-statusbar {
  height: 22px; background: #EBEBEB; border-top: 1px solid #D8D8D8;
  display: flex; align-items: center; padding: 0 14px; flex-shrink: 0;
}
.finder-status-text {
  font-size: 11px; color: #666; font-family: 'SF Mono',Menlo,monospace;
  flex: 1; text-align: center;
}

@media (max-width: 680px) {
  .finder-sidebar { width: 130px; }
  .finder-preview { width: 180px; }
}
@media (max-width: 480px) {
  .finder-host { padding: 0 1rem; }
  .finder-sidebar { display: none; }
  .finder-body { flex-direction: column; height: auto; }
  .finder-file-area { min-height: 220px; }
  .finder-preview { width: 100%; border-left: none; border-top: 1px solid #D8D8D8; }
}

/* ══ FINDER PROJECTS — full replacement block ══
   Replace everything between the
   "FINDER PROJECTS WINDOW" comment and the end of style.css
   with this block.
══ */

#p6 {
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.finder-host {
  width: 100%;
  max-width: 960px;
  padding: 0 1.5rem;
  position: relative;
  z-index: 5;
}

/* ── Window shell ── */
.finder-window {
  background: #F5F5F5;
  border: 1px solid #C8C8C8;
  border-radius: 10px;
  overflow: hidden;
  box-shadow:
    0 24px 70px rgba(0,0,0,0.55),
    0 4px 12px rgba(0,0,0,0.35),
    inset 0 0 0 0.5px rgba(255,255,255,0.25);
  display: flex;
  flex-direction: column;
  opacity: 0;
  transform: scale(0.96) translateY(20px);
}
#p6.revealed .finder-window {
  animation: finderIn 0.5s cubic-bezier(0.16,1,0.3,1) 0.25s forwards;
}
@keyframes finderIn { to { opacity:1; transform: scale(1) translateY(0); } }

/* ── Title bar ── */
.titlebar {
  height: 38px;
  background: linear-gradient(to bottom, #EBEBEB, #E3E3E3);
  border-bottom: 1px solid #C8C8C8;
  display: flex;
  align-items: center;
  padding: 0 14px;
  flex-shrink: 0;
  position: relative;
  user-select: none;
}
.traffic-lights { display: flex; gap: 7px; align-items: center; }
.tl {
  width: 12px; height: 12px; border-radius: 50%;
  cursor: default; position: relative;
  display: flex; align-items: center; justify-content: center;
  font-size: 8px; font-weight: 800; color: transparent;
  transition: color 0.1s;
}
.finder-window:hover .tl { color: rgba(0,0,0,0.5); }
.tl-close { background: #FF5F57; box-shadow: inset 0 0 0 0.5px rgba(0,0,0,0.12); }
.tl-min   { background: #FEBC2E; box-shadow: inset 0 0 0 0.5px rgba(0,0,0,0.12); }
.tl-max   { background: #28C840; box-shadow: inset 0 0 0 0.5px rgba(0,0,0,0.12); }
.window-title {
  position: absolute; left: 50%; transform: translateX(-50%);
  font-size: 13px; color: #3A3A3A; font-weight: 500;
  white-space: nowrap;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
  letter-spacing: -0.01em;
}

/* ── Toolbar ── */
.toolbar {
  height: 38px;
  background: linear-gradient(to bottom, #EBEBEB, #E3E3E3);
  border-bottom: 1px solid #C8C8C8;
  display: flex; align-items: center; gap: 6px;
  padding: 0 10px; flex-shrink: 0;
}
.tb-nav { display: flex; gap: 1px; }
.tb-btn {
  width: 28px; height: 24px;
  background: none; border: none; border-radius: 5px;
  cursor: default;
  display: flex; align-items: center; justify-content: center;
  color: #888; transition: background 0.1s; font-size: 13px;
}
.tb-btn:hover { background: rgba(0,0,0,0.07); color: #444; }
.tb-btn--active { color: #3478F6; }
.tb-divider { width: 1px; height: 18px; background: #C8C8C8; margin: 0 3px; }
.breadcrumb {
  flex: 1; display: flex; align-items: center; gap: 5px;
  font-size: 12px; color: #555;
  background: rgba(255,255,255,0.65);
  border: 0.5px solid #C8C8C8;
  border-radius: 5px; padding: 3px 10px; height: 24px;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.breadcrumb-sep { color: #AAA; font-size: 11px; }
.breadcrumb-active { color: #222; font-weight: 500; }
.tb-view { display: flex; gap: 1px; margin-left: 2px; }

/* ── Body layout ── */
.finder-body { display: flex; height: 420px; }

/* ── Sidebar ── */
.finder-sidebar {
  width: 180px; flex-shrink: 0;
  background: #F0EFF0;
  border-right: 1px solid #D0D0D0;
  overflow-y: auto; padding: 8px 0;
  scrollbar-width: none;
}
.finder-sidebar::-webkit-scrollbar { display: none; }
.sidebar-section { margin-bottom: 4px; }
.sidebar-header {
  font-size: 10.5px; font-weight: 700; color: #888;
  text-transform: uppercase; letter-spacing: 0.06em;
  padding: 6px 14px 3px;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.sidebar-item {
  display: flex; align-items: center; gap: 7px;
  padding: 0 8px 0 10px; height: 26px;
  font-size: 13px; color: #444;
  cursor: default;
  border-radius: 6px; margin: 1px 5px;
  transition: background 0.08s, color 0.08s;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sidebar-item i { font-size: 14px; color: #888; flex-shrink: 0; transition: color 0.08s; }
.sidebar-item:hover { background: rgba(0,0,0,0.06); color: #222; }
.sidebar-item:hover i { color: #555; }
.sidebar-item.active { background: #3478F6; color: #fff; }
.sidebar-item.active i { color: rgba(255,255,255,0.9); }

/* ── File grid area ── */
.finder-file-area {
  flex: 1; background: #FFFFFF;
  overflow-y: auto; padding: 14px;
  scrollbar-width: thin;
  scrollbar-color: #D0D0D0 transparent;
}
.finder-file-area::-webkit-scrollbar { width: 5px; }
.finder-file-area::-webkit-scrollbar-thumb { background: #D0D0D0; border-radius: 3px; }

.file-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
  gap: 6px;
  align-content: start;
}

/* ── File items ── */
.file-item {
  display: flex; flex-direction: column;
  align-items: center; gap: 5px;
  padding: 10px 6px 8px; border-radius: 6px;
  cursor: default;
  border: 1.5px solid transparent;
  transition: background 0.1s, border-color 0.1s;
  text-align: center;
  opacity: 0; transform: scale(0.85);
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
  position: relative;
}
#p6.revealed .file-item {
  animation: finderItemIn 0.3s cubic-bezier(0.16,1,0.3,1) forwards;
}
@keyframes finderItemIn { to { opacity:1; transform:scale(1); } }

.file-item:hover {
  background: rgba(52,120,246,0.08);
  cursor: cell;
}
.file-item.selected {
  background: rgba(52,120,246,0.16);
  border-color: rgba(52,120,246,0.45);
  cursor: crosshair;
}

.file-icon-wrap { position: relative; display: inline-block; }
.file-icon {
  font-size: 38px; color: #5B9BD5;
  line-height: 1; display: block;
  transition: color 0.1s;
}
.file-item.selected .file-icon { color: #3478F6; }

.file-label {
  font-size: 11px; color: #3A3A3A;
  line-height: 1.25; max-width: 80px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  transition: color 0.1s; word-break: break-word;
}
.file-item.selected .file-label { color: #1A4FCC; font-weight: 500; }

.file-badge {
  position: absolute; top: -3px; right: -3px;
  width: 9px; height: 9px; border-radius: 50%;
  border: 1.5px solid #FFFFFF;
}
.badge-active { background: #28C840; }
.badge-new    { background: #3478F6; }
.badge-dev    { background: #FEBC2E; }

/* ── Preview panel ── */
.finder-preview {
  width: 240px; flex-shrink: 0;
  border-left: 1px solid #D0D0D0;
  background: #F7F7F7;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.preview-empty {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 10px; padding: 24px; color: #BBBBBB;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
#previewFilled {
  display: none;
  flex-direction: column;
  height: 100%;
}
.preview-header {
  padding: 12px 14px 9px;
  border-bottom: 1px solid #E2E2E2;
  background: #F0F0F0;
}
.preview-title {
  font-size: 13px; font-weight: 600; color: #2A2A2A;
  line-height: 1.3; word-break: break-all;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.preview-content {
  flex: 1; overflow-y: auto; scrollbar-width: none;
  padding: 14px 14px 0; display: flex;
  flex-direction: column; gap: 10px;
}
.preview-content::-webkit-scrollbar { display: none; }
.preview-big-icon {
  font-size: 52px; color: #3478F6;
  text-align: center; display: block;
  line-height: 1;
}
.preview-desc {
  font-size: 12px; color: #555; line-height: 1.6;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.preview-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.preview-tag {
  font-size: 10px; font-weight: 600;
  letter-spacing: 0.05em; text-transform: uppercase;
  background: #E3E3E3; color: #666;
  padding: 2px 7px; border-radius: 3px;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
}
.preview-meta {
  border-top: 1px solid #E2E2E2; padding-top: 9px;
  display: flex; flex-direction: column; gap: 6px;
  padding-bottom: 4px;
}
.meta-row {
  display: flex; justify-content: space-between;
  align-items: baseline; gap: 6px;
}
.meta-key {
  font-size: 11px; color: #999;
  font-family: 'SF Mono',Menlo,'Courier New',monospace;
  flex-shrink: 0;
}
.meta-val {
  font-size: 11px; color: #3A3A3A;
  font-family: 'SF Mono',Menlo,'Courier New',monospace;
  text-align: right;
}
.meta-val.active-badge {
  color: #1A7E2A; background: #E2F6E4;
  padding: 1px 6px; border-radius: 3px; font-size: 10px;
}
.meta-val.new-badge {
  color: #1A4FCC; background: #E3EEFF;
  padding: 1px 6px; border-radius: 3px; font-size: 10px;
}
.meta-val.dev-badge {
  color: #8A5A00; background: #FFF3D0;
  padding: 1px 6px; border-radius: 3px; font-size: 10px;
}

/* ── Open button ── */
.preview-open-wrap {
  padding: 12px 14px 14px;
  border-top: 1px solid #E2E2E2;
  margin-top: auto;
  background: #F0F0F0;
}
.finder-open-btn {
  display: block; width: 100%; padding: 7px 12px;
  background: #3478F6; color: #fff;
  border: none; border-radius: 7px;
  font-size: 12px; font-weight: 500;
  cursor: pointer; text-align: center;
  text-decoration: none;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
  transition: background 0.12s, transform 0.1s;
  box-shadow: 0 1px 3px rgba(52,120,246,0.35);
}
.finder-open-btn:hover {
  background: #2060D8;
  transform: translateY(-1px);
}
.finder-open-btn.disabled {
  background: #C8C8C8; cursor: default;
  pointer-events: none; box-shadow: none;
  color: #888;
}

/* ── Status bar ── */
.finder-statusbar {
  height: 22px;
  background: linear-gradient(to bottom, #EBEBEB, #E3E3E3);
  border-top: 1px solid #C8C8C8;
  display: flex; align-items: center;
  padding: 0 14px; flex-shrink: 0;
}
.finder-status-text {
  font-size: 11px; color: #777;
  font-family: -apple-system,'SF Pro Text','Helvetica Neue',Arial,sans-serif;
  flex: 1; text-align: center;
}

/* ── Responsive ── */
@media (max-width: 720px) {
  .finder-sidebar { width: 140px; }
  .finder-preview { width: 190px; }
}
@media (max-width: 520px) {
  .finder-host { padding: 0 0.5rem; }
  .finder-sidebar { display: none; }
  .finder-body { flex-direction: column; height: auto; }
  .finder-file-area { min-height: 200px; }
  .finder-preview {
    width: 100%; border-left: none;
    border-top: 1px solid #D0D0D0;
    max-height: 280px;
  }
}

/* ══ P8 DISCLOSURES — MAGAZINE COVER ══ */
#pFindings{
  background:#050507;
  --crit:#ff6b5b;--high:#ffa257;--med:#ffd575;--low:#7ab8ff;
}
#pFindings::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(900px 700px at 15% 18%,rgba(255,162,87,0.06),transparent 55%),
    radial-gradient(700px 500px at 85% 82%,rgba(122,184,255,0.04),transparent 60%),
    radial-gradient(500px 400px at 50% 50%,rgba(255,107,91,0.025),transparent 70%);
}
#pFindings::after{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(90deg,rgba(255,255,255,0.025) 1px,transparent 1px);
  background-size:140px 100%;opacity:0.5;
  mask-image:radial-gradient(ellipse 90% 80% at 50% 50%,black 30%,transparent 100%);
}

.ds-wrap{
  position:absolute;inset:0;z-index:2;
  display:grid;grid-template-columns:1.35fr 0.95fr;gap:3.5rem;
  align-items:center;
  padding:6rem 5rem 3rem;
  max-width:1500px;margin:0 auto;
}

/* ── FEATURE (left) ── */
.ds-feature{display:flex;flex-direction:column;gap:1.3rem;}
.ds-issue{
  display:flex;align-items:center;gap:0.8rem;
  font-family:var(--mono);font-size:0.62rem;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--muted);
}
.ds-issue .ds-dot{color:rgba(255,255,255,0.18);}
.ds-stamp-wrap{position:relative;display:inline-flex;align-items:center;}
.ds-stamp{
  font-family:var(--mono);font-size:0.58rem;letter-spacing:0.26em;text-transform:uppercase;
  color:rgba(255,107,91,0.85);
  border:1.5px solid rgba(255,107,91,0.75);
  padding:0.2rem 0.55rem;border-radius:2px;
  transform:rotate(-5deg) scale(0);
  transform-origin:center;
  opacity:0;
  position:relative;z-index:2;
  transition:none;
}
.ds-stamp.stamped{
  animation:stampImpact 0.45s cubic-bezier(.15,1.5,.5,1) forwards;
}
@keyframes stampImpact{
  0%{transform:rotate(-5deg) scale(3.2);opacity:0;}
  55%{transform:rotate(-5deg) scale(0.9);opacity:1;}
  75%{transform:rotate(-5deg) scale(1.05);opacity:1;}
  100%{transform:rotate(-5deg) scale(1);opacity:1;}
}
.ds-dust-canvas{
  position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);
  pointer-events:none;width:200px;height:200px;
  margin-left:0;z-index:1;
}
@keyframes dspulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.4;transform:scale(0.7);}}

.ds-headline{
  font-family:var(--serif);font-weight:400;
  font-size:clamp(2.6rem,5.6vw,5.4rem);
  line-height:0.97;letter-spacing:-0.025em;
  color:var(--white);
  display:flex;flex-direction:column;gap:0.15em;
  margin:0.4rem 0 0.2rem;
  min-height:2.4em;
}
.ds-headline em{font-style:italic;color:rgba(255,255,255,0.55);}
.ds-line{
  display:block;
  transition:opacity 0.4s cubic-bezier(.4,0,.2,1);
}

.ds-attr{
  display:flex;align-items:center;gap:0.7rem;flex-wrap:wrap;
  font-family:var(--mono);font-size:0.66rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--dim);
}
.ds-attr-id{color:var(--white);}
.ds-attr-tg{color:var(--dim);}
.ds-attr-sev{
  padding:0.2rem 0.55rem;border:1px solid currentColor;border-radius:3px;font-size:0.6rem;
  transition:color 0.35s;
}
.ds-attr-sev.crit{color:var(--crit);}
.ds-attr-sev.high{color:var(--high);}
.ds-attr-sev.med{color:var(--med);}

.ds-pager{
  display:flex;gap:0.5rem;margin-top:1rem;
}
.ds-pager-dot{
  width:22px;height:2px;background:rgba(255,255,255,0.12);
  cursor:pointer;border:none;padding:0;transition:background 0.3s;
}
.ds-pager-dot.on{background:var(--white);}
.ds-pager-dot:hover{background:rgba(255,255,255,0.5);}

.ds-cta-row{
  display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap;
  margin-top:1.4rem;padding-top:1.4rem;
  border-top:1px solid rgba(255,255,255,0.08);
}
.ds-cta{
  display:inline-flex;align-items:center;gap:0.7rem;
  font-family:var(--serif);font-style:italic;font-size:1.15rem;
  color:var(--white);text-decoration:none;
  padding:0.45rem 0;border-bottom:1px solid var(--white);
  transition:gap 0.3s,letter-spacing 0.3s;
}
.ds-cta:hover{gap:1rem;letter-spacing:0.005em;}
.ds-cta-arr{font-family:var(--sans);font-style:normal;font-size:1rem;}
.ds-cta-meta{
  font-family:var(--mono);font-size:0.6rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--muted);
}

/* ── SIDE (right) ── */
.ds-side{
  display:flex;flex-direction:column;gap:1.6rem;
  align-self:stretch;justify-content:center;
  padding-left:2.5rem;border-left:1px solid rgba(255,255,255,0.06);
}

.ds-stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
}
.ds-stat{display:flex;flex-direction:column;gap:0.3rem;}
.ds-stat-v{
  font-family:var(--serif);font-size:2.4rem;line-height:1;color:var(--white);
}
.ds-stat-l{
  font-family:var(--mono);font-size:0.55rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--muted);
}

.ds-hits-h{
  display:flex;align-items:center;gap:0.8rem;
  font-family:var(--mono);font-size:0.58rem;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--muted);
}
.ds-hits-line{flex:1;height:1px;background:rgba(255,255,255,0.08);}

.ds-hits{display:flex;flex-direction:column;gap:0;}
.ds-hit{
  display:grid;grid-template-columns:auto 1fr auto;gap:0.9rem;align-items:baseline;
  padding:0.78rem 0;border-bottom:1px solid rgba(255,255,255,0.05);
  cursor:pointer;text-decoration:none;color:inherit;
  transition:padding-left 0.25s,border-color 0.25s;
}
.ds-hit:last-child{border-bottom:none;}
.ds-hit:hover{padding-left:0.4rem;border-bottom-color:rgba(255,255,255,0.16);}
.ds-hit-id{
  font-family:var(--mono);font-size:0.6rem;letter-spacing:0.06em;color:var(--muted);
  min-width:54px;
}
.ds-hit:hover .ds-hit-id{color:var(--dim);}
.ds-hit-t{
  font-family:var(--serif);font-size:0.96rem;line-height:1.3;color:var(--dim);
  transition:color 0.25s;
}
.ds-hit:hover .ds-hit-t{color:var(--white);}
.ds-hit-sev{
  font-family:var(--mono);font-size:0.52rem;letter-spacing:0.14em;text-transform:uppercase;
  padding:0.16rem 0.42rem;border:1px solid currentColor;border-radius:3px;
}
.ds-hit-sev.crit{color:var(--crit);}
.ds-hit-sev.high{color:var(--high);}
.ds-hit-sev.med{color:var(--med);}

/* ── RESPONSIVE ── */
@media(max-width:1100px){
  .ds-wrap{padding:5.5rem 3rem 2.5rem;gap:2.5rem;}
  .ds-side{padding-left:2rem;}
}
@media(max-width:880px){
  .ds-wrap{
    grid-template-columns:1fr;gap:2rem;
    padding:5rem 1.6rem 2rem;
    align-content:start;align-items:start;
    overflow-y:auto;
  }
  .ds-side{padding-left:0;border-left:none;border-top:1px solid rgba(255,255,255,0.08);padding-top:1.6rem;}
  .ds-headline{font-size:clamp(2rem,8vw,3.4rem);min-height:auto;}
  .ds-stats{gap:1rem;}
  .ds-stat-v{font-size:1.9rem;}
}

/* ══ SIDE NAV DOTS ══ */
.side-nav{
  position:fixed;right:1.4rem;top:50%;transform:translateY(-50%);
  z-index:60;
  display:flex;flex-direction:column;gap:0.7rem;
  padding:0.8rem 0.5rem;
}
.sn-dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,0.18);border:none;cursor:pointer;
  padding:0;display:block;
  transition:background 0.25s,transform 0.25s,box-shadow 0.25s;
}
.sn-dot:hover{
  background:rgba(255,255,255,0.55);transform:scale(1.25);
}
.sn-dot.on{
  background:var(--white);transform:scale(1.35);
  box-shadow:0 0 10px rgba(255,255,255,0.4);
}
@media(max-width:680px){
  .side-nav{right:0.8rem;gap:0.55rem;padding:0.5rem 0.4rem;}
  .sn-dot{width:7px;height:7px;}
}

/* ══════════════════════════════════
   MOBILE PORTRAIT  ≤ 768 px
   ══════════════════════════════════ */
@media (max-width: 768px) {

  /* ── cursor off ── */
  .tc-wrap { display: none !important; }
  html,body,* { cursor: auto !important; }
  .side-nav  { display: none !important; }

  /* ── all sections: scroll-snap, no edge-to-edge bleed ── */
  .page-section { height: 100svh; overflow: hidden; }
  /* remove scan-line effects that bleed between sections on mobile */
  .page-section::after, .page-section .scan2 { display: none !important; }

  /* page-title centred */
  .page-title {
    font-size: 0.4rem; letter-spacing: 0.14em;
    left: 50%; transform: translateX(-50%);
    white-space: nowrap;
  }

  /* ━━━━━━━━━━━━━━━━━━━━━
     P1 — HERO
     ━━━━━━━━━━━━━━━━━━━━━ */
  #p1 { align-items: center; justify-content: center; }
  .hero-body { padding: 0 1.8rem; width: 100%; text-align: center; }
  .tw-line   { font-size: clamp(1.6rem,7.5vw,2.6rem); text-align: center; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     P2 — ABOUT
     image on top, text below; bottom gradient fade
     ━━━━━━━━━━━━━━━━━━━━━ */
  #p2 { flex-direction: column-reverse; }
  .about-right {
    width: 100%; height: 42svh; flex-shrink: 0; position: relative;
  }
  /* left-edge gradient removed; bottom fade instead */
  .about-right::before { display: none; }
  .about-right::after {
    content: ''; position: absolute;
    left: 0; right: 0; bottom: 0; height: 55%;
    background: linear-gradient(to top, #000 0%, transparent 100%);
    z-index: 2; pointer-events: none;
  }
  .about-left {
    width: 100%; flex: 1;
    padding: 1.5rem 1.8rem 2rem;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    text-align: center; overflow-y: auto;
  }
  .about-divider { margin: 1rem auto; }
  .about-text  { max-width: 100%; text-align: center; }
  .about-text2 { max-width: 100%; text-align: center; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     P3 — SKILLS MARQUEE
     keep the marquee, just tighten it
     ━━━━━━━━━━━━━━━━━━━━━ */
  #p3 { overflow: hidden; }
  #p3 .menu { padding-top: 4.2rem; }
  #p3 .menu-label { font-size: clamp(.6rem,1.8vh,1rem); }
  #p3 .marquee-overlay { transform: translateY(100%); transition: transform .3s cubic-bezier(.16,1,.3,1); }
  #p3 .menu-item.mob-active .marquee-overlay { transform: translateY(0); }
  #p3 .menu-item.mob-active .menu-label { color: #000; }
  .skills-eyebrow { left: 50%; transform: translateX(-50%); white-space: nowrap; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     P4 — INTERNSHIPS
     ━━━━━━━━━━━━━━━━━━━━━ */
  #p4 { flex-direction: column; overflow-y: auto; }
  .intern-left {
    width: 100%; padding: 4.2rem 1.8rem 1.2rem;
    border-right: none; border-bottom: 1px solid rgba(255,255,255,.06);
    align-items: center; text-align: center;
  }
  .intern-eyebrow { justify-content: center; }
  .intern-big     { font-size: clamp(2rem,9vw,3.2rem); text-align: center; }
  .intern-sub     { text-align: center; max-width: 100%; }
  .intern-stat-row{ justify-content: center; }
  .intern-right {
    width: 100%; flex: 1;
    padding: 1.2rem 1.8rem 2rem;
    display: flex; flex-direction: column; gap: .7rem;
    align-items: center; overflow-y: auto;
  }
  .intern-card { width: 100%; max-width: 440px; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     PEXP — EXPERIENCE
     innovative mobile: numbered editorial list
     ━━━━━━━━━━━━━━━━━━━━━ */
  #pExp spline-viewer { display: none !important; }
  .exp-ring {
    position: absolute !important;
    inset: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 4.8rem 1.8rem 2rem !important;
    gap: 0 !important;
    align-items: stretch !important;
  }
  .exp-ring::-webkit-scrollbar { display: none; }

  /* each xcard becomes a clean row */
  .xcard {
    position: static !important;
    transform: none !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    border-top: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 0 !important;
    padding: 1rem 0 !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 1rem !important;
  }
  .xcard:last-child { border-bottom: 1px solid rgba(255,255,255,.07) !important; }
  .xcard:hover { transform: none !important; background: rgba(255,255,255,.03) !important; border-radius: 6px !important; padding-left: .6rem !important; }
  /* number from data-xp */
  .xcard::before {
    content: "0" attr(data-xp) !important;
    font-family: 'Instrument Serif',serif !important;
    font-style: italic !important;
    font-size: 1.6rem !important;
    color: rgba(255,255,255,.12) !important;
    position: static !important;
    display: block !important;
    flex-shrink: 0 !important;
    width: 2.4rem !important;
    line-height: 1 !important;
    padding-top: .1rem !important;
    opacity: 1 !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    inset: auto !important;
    transition: none !important;
    box-shadow: none !important;
  }
  .xcard > * { position: static !important; }
  .xcard-body-wrap { display: flex; flex-direction: column; gap: .25rem; flex: 1; }
  .xcard-cat   {
    font-family: var(--mono) !important; font-size: .38rem !important;
    letter-spacing: .18em !important; text-transform: uppercase !important;
    color: rgba(255,255,255,.3) !important; margin-bottom: .1rem !important;
    position: static !important;
  }
  .xcard-title {
    font-family: 'Instrument Serif',serif !important;
    font-style: italic !important; font-size: 1rem !important;
    color: rgba(255,255,255,.88) !important; line-height: 1.2 !important;
    position: static !important; margin-bottom: 0 !important;
  }
  .xcard-preview {
    font-family: var(--sans) !important; font-size: .52rem !important;
    color: rgba(255,255,255,.4) !important; line-height: 1.5 !important;
    position: static !important; display: block !important;
    margin-top: .2rem !important;
  }
  .xcard-click-hint { display: none !important; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     P5 — CERTIFICATIONS
     ━━━━━━━━━━━━━━━━━━━━━ */
  .cert-hud-tl {
    left: 50%; transform: translateX(-50%);
    top: 1rem; flex-direction: row; gap: .6rem;
    align-items: baseline; display: flex;
  }
  .cert-filters-bar {
    left: 1.2rem; right: 1.2rem;
    flex-wrap: wrap; justify-content: center; gap: .4rem;
  }
  .cert-focus { right: 1rem; max-width: calc(100vw - 2rem); }

  /* ━━━━━━━━━━━━━━━━━━━━━
     P6 — PROJECTS
     ━━━━━━━━━━━━━━━━━━━━━ */
  .finder-host { padding: 0 .4rem; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     PFINDINGS — DISCLOSURES
     ━━━━━━━━━━━━━━━━━━━━━ */
  #pFindings { overflow-y: auto !important; }
  .ds-wrap {
    grid-template-columns: 1fr !important;
    padding: 4.5rem 1.8rem 2rem !important;
    gap: 1.5rem !important;
  }
  .ds-feature   { align-items: center; }
  .ds-issue     { justify-content: center; flex-wrap: wrap; }
  .ds-headline  {
    font-size: clamp(1.8rem,7.5vw,2.8rem) !important;
    text-align: center; align-items: center; min-height: auto !important;
  }
  .ds-attr      { justify-content: center; flex-wrap: wrap; }
  .ds-pager     { justify-content: center; }
  .ds-cta-row   { flex-direction: column; align-items: center; gap: 1rem; }
  .ds-side      { padding-left: 0 !important; border-left: none !important; border-top: 1px solid rgba(255,255,255,.06) !important; padding-top: 1.2rem !important; }
  .ds-stats     { justify-content: center !important; }
  .ds-hits-h    { justify-content: center !important; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     PABOUT — LANYARD + BENTO
     lanyard on top, bento scrolls below
     ━━━━━━━━━━━━━━━━━━━━━ */
  #pAbout { flex-direction: column !important; overflow: hidden !important; }

  .ab-lanyard-wrap {
    display: block !important;
    width: 100% !important;
    height: 44svh !important;
    flex-shrink: 0 !important;
  }

  /* bento: flat flex column, no broken grid */
  .ab-bento {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: unset !important;
    grid-template-rows: unset !important;
    gap: 0 !important;
    padding: 0 0 2rem !important;
    flex: 1;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: transparent !important;
  }
  .ab-bento::-webkit-scrollbar { display: none; }

  /* instant reveal — no stagger animation on mobile */
  #pAbout .ab-card { opacity: 1 !important; transform: none !important; }
  /* ab-card-inner uses height:100% which collapses in flex layout — reset to auto */
  #pAbout .ab-card-inner { height: auto !important; }

  /* card order */
  .ab-card--name   { order: 1 !important; }
  .ab-card--edu    { order: 2 !important; }
  .ab-card--stats  { order: 3 !important; }
  .ab-card--langs  { order: 4 !important; }
  .ab-card--resume { order: 5 !important; cursor: pointer; }
  .ab-card--avail  { display: none !important; }
  .ab-card--skills { display: none !important; }

  /* name card: centred, hide dense contact/roles */
  .ab-card--name .ab-card-inner { align-items: center; text-align: center; }
  .ab-name-big     { font-size: clamp(1.4rem,6vw,2rem) !important; text-align: center; }
  .ab-name-sub     { text-align: center; }
  .ab-contact-row  { display: none !important; }
  .ab-roles        { display: none !important; }

  /* edu: single column, hide essay */
  .ab-edu-cols { grid-template-columns: 1fr !important; }
  .ab-edu-col--main .ab-edu-detail { display: none; }

  /* stats: 3-column */
  .ab-stats-grid {
    grid-template-columns: repeat(3,1fr) !important;
    gap: .5rem .3rem !important;
  }
  .ab-stat-val { font-size: clamp(1rem,4vw,1.4rem); }

  /* resume card centred */
  .ab-card--resume .ab-card-inner { align-items: center; text-align: center; }
  .ab-resume-big { text-align: center; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     P7 — CONTACT
     ━━━━━━━━━━━━━━━━━━━━━ */
  .face-title, .face-description { display: none !important; }

  /* ━━━━━━━━━━━━━━━━━━━━━
     MODAL
     ━━━━━━━━━━━━━━━━━━━━━ */
  .modal-box {
    flex-direction: column !important;
    width: 96vw !important;
    height: 90svh !important;
    max-height: 90svh !important;
    border-radius: 10px !important;
  }
  .modal-img-panel  { width: 100% !important; height: 35% !important; flex-shrink: 0 !important; }
  .modal-content-panel { width: 100% !important; flex: 1 !important; }
  .modal-close { top: .7rem; right: .7rem; }
}

/* ── very small phones ── */
@media (max-width: 420px) {
  .tw-line { font-size: clamp(1.4rem,7vw,2rem); }
  .ab-bento { grid-template-columns: 1fr !important; }
  .ab-card--langs { grid-column: 1/2 !important; }
  .ab-stats-grid  { grid-template-columns: repeat(2,1fr) !important; }
  .ds-headline    { font-size: clamp(1.5rem,7vw,2.2rem) !important; }
}

/* ── touch: native snap, one section at a time ── */
@media (hover:none) and (pointer:coarse) {
  #sc {
    scroll-snap-type: y mandatory;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
  }
  .page-section { scroll-snap-align: start; }
}

/* ── mobile refinements ── */
@media (max-width: 768px) {

  /* BOXES: flat sections instead of cards */
  .ab-bento { background: transparent !important; gap: 0 !important; padding: 0 0 2rem !important; overflow-y: auto !important; overflow-x: hidden !important; }
  .ab-card {
    background: transparent !important;
    border: none !important;
    border-top: 1px solid rgba(255,255,255,0.06) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 1rem 1.4rem !important;
  }
  .ab-card::before, .ab-card::after { display: none !important; }
  .ab-card:first-child { border-top: none !important; }
  .ab-card--resume {
    border-top: 1px solid rgba(255,255,255,0.06) !important;
    border-bottom: none !important;
  }

  /* STATS: 2×3 even grid, bigger values */
  .ab-stats-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.9rem 0.5rem !important;
    margin-top: 0.6rem !important;
  }
  .ab-stat-val { font-size: clamp(1.1rem, 5vw, 1.6rem) !important; }
  .ab-stat-lbl { font-size: 0.34rem !important; letter-spacing: 0.1em !important; line-height: 1.35 !important; }

  /* NAME: show full name */
  .ab-name-big { margin-bottom: 0.4rem !important; }
  .ab-card--name { min-height: 0 !important; }

  /* EXPERIENCE: clean editorial list */
  #pExp { overflow: hidden !important; }
  .exp-ring {
    pointer-events: auto !important;
    background: #050508 !important;
    z-index: 10 !important;
  }
  .xcard {
    border-radius: 0 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .xcard:hover { transform: none !important; background: rgba(255,255,255,.03) !important; }
  .xcard::before {
    content: "0" attr(data-xp) !important;
    font-family: 'Instrument Serif',serif !important;
    font-style: italic !important;
    font-size: 1.5rem !important;
    color: rgba(255,255,255,.14) !important;
    background: none !important;
    position: static !important;
    display: block !important;
    flex-shrink: 0 !important;
    width: 2.2rem !important;
    line-height: 1 !important;
    opacity: 1 !important;
    border: none !important;
    border-radius: 0 !important;
    inset: auto !important;
    transition: none !important;
    box-shadow: none !important;
    padding: 0.1rem 0 0 0 !important;
  }
  .xcard-cat    { position: static !important; z-index: auto !important; }
  .xcard-title  { position: static !important; z-index: auto !important; font-size: 1rem !important; }
  .xcard-preview{ position: static !important; z-index: auto !important; }
  .xcard-click-hint { display: none !important; }
}

/* ── cert mobile list ── */
.cert-mobile-list{display:none;position:absolute;inset:0;overflow-y:auto;padding:4.2rem 1.6rem 5.5rem;z-index:3;}
.cert-mobile-list::-webkit-scrollbar{display:none;}
.cml-group{margin-bottom:1.6rem;}
.cml-issuer{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:0.44rem;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,255,255,.3);border-bottom:1px solid rgba(255,255,255,.07);padding-bottom:0.45rem;margin-bottom:0.55rem;}
.cml-count{font-family:var(--serif);font-style:italic;font-size:0.9rem;color:rgba(255,255,255,.18);}
.cml-item{display:grid;grid-template-columns:1.8rem 1fr auto;gap:0.5rem;align-items:baseline;padding:0.48rem 0;border-bottom:1px solid rgba(255,255,255,.04);}
.cml-item:last-child{border-bottom:none;}
.cml-n{font-family:var(--mono);font-size:0.42rem;color:rgba(255,255,255,.2);}
.cml-name{font-family:var(--serif);font-size:0.88rem;color:rgba(255,255,255,.8);line-height:1.3;}
.cml-yr{font-family:var(--mono);font-size:0.38rem;color:rgba(255,255,255,.22);}

@media(max-width:768px){
  /* cert page — show canvas, hide list and filters */
  .cert-mobile-list{display:none;}
  .cert-filters-bar{display:none !important;}
  .cert-total-badge{display:none !important;}
  .cert-hud-tl{z-index:4;}
  .cf-hint { font-size: 0 !important; }
  .cf-hint::after { content: 'tap to explore'; font-size: 0.68rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.18); font-family: var(--mono); }

  /* cards — truly flat, no overflow clipping */
  .ab-card{overflow:visible!important;}
  .ab-card--stats{height:auto!important;overflow:visible!important;}
  .ab-card--langs{height:auto!important;overflow:visible!important;}
}

/* ════════════════════════════════════════════════════════════
   ✦ FABULOUS MOBILE  —  cohesive editorial polish ≤768px
   Last in source order: supersedes earlier mobile patches.
   ════════════════════════════════════════════════════════════ */

/* helpers hidden on desktop */
.cert-tap-hint{display:none;}
.contact-mobile{display:none;}

@media (max-width: 768px) {

  html{ -webkit-tap-highlight-color:transparent; }
  .page-section{ scroll-snap-stop:always; }

  /* unified section eyebrow */
  .page-title{
    font-size:.6rem !important;
    letter-spacing:.24em !important;
    top:1.5rem !important;
    color:rgba(255,255,255,.5) !important;
  }

  .pg-btn{ bottom:1rem; left:1rem; width:24px; height:24px; font-size:0.58rem; }
  .pg-panel{ bottom:3.6rem; left:1rem; width:calc(100vw - 2rem); max-width:320px; }

  /* ── P1 · HERO ── */
  .hero-body{ padding:0 1.6rem !important; }
  .tw-line{
    font-size:clamp(2rem,8.5vw,3rem) !important;
    line-height:1.18 !important; letter-spacing:-.012em !important;
  }
  .scroll-hint{ bottom:1.7rem !important; }
  .scroll-label{ font-size:.58rem !important; letter-spacing:.28em !important; }

  /* ── P2 · ABOUT ── */
  .about-right{ height:40svh !important; }
  .about-left{ padding:1.9rem 1.7rem 2.2rem !important; }
  .about-tag{ margin-bottom:1.1rem !important; color:rgba(255,255,255,.4) !important; }
  .about-text{ font-size:clamp(1.35rem,5.6vw,1.95rem) !important; line-height:1.4 !important; }
  .about-text br, .about-text2 br{ display:none; }      /* natural wrap, no awkward forced breaks */
  .about-divider{ width:34px !important; margin:1.3rem auto !important; }
  .about-text2{ font-size:clamp(.92rem,3.6vw,1.05rem) !important; line-height:1.7 !important; color:rgba(255,255,255,.55) !important; }

  /* ── P3 · SKILLS (tap-to-reveal marquee) ── */
  #p3 .menu{ padding-top:4.8rem !important; }
  #p3 .menu-item{ border-top:1px solid rgba(255,255,255,.055) !important; border-bottom:none !important; }
  #p3 .menu-item:last-child{ border-bottom:1px solid rgba(255,255,255,.055) !important; }
  #p3 .menu-label{
    font-size:clamp(.92rem,2.4vh,1.18rem) !important;
    letter-spacing:.12em !important; font-weight:500 !important;
  }
  #p3 .menu-item::after{          /* +/− affordance so it reads as tappable */
    content:'+'; position:absolute; right:1.5rem; top:50%;
    transform:translateY(-50%); z-index:5;
    font-family:var(--mono); font-size:1.05rem; font-weight:300;
    color:rgba(255,255,255,.28);
    transition:color .3s, transform .3s; pointer-events:none;
  }
  #p3 .menu-item.mob-active::after{ content:'−'; color:#000; transform:translateY(-50%) scale(1.1); }

  /* ── P4 · INTERNSHIPS ── */
  .intern-left{ padding:4.8rem 1.7rem 1.4rem !important; }
  .intern-big{ font-size:clamp(2.4rem,11vw,3.4rem) !important; margin-bottom:1.2rem !important; }
  .intern-sub{ font-size:clamp(.9rem,3.6vw,1rem) !important; }
  .intern-stat-row{ gap:1.6rem !important; margin-top:1.6rem !important; }
  .intern-stat-num{ font-size:1.7rem !important; }
  .intern-right{ padding:1.2rem 1.7rem 2.4rem !important; gap:.1rem !important; }
  .intern-card{ max-width:none !important; padding:1.1rem 0 !important; }
  .intern-card-inner{ gap:.85rem !important; align-items:flex-start !important; }
  .intern-card-num{ width:1.5rem !important; padding-top:.22rem !important; flex-shrink:0 !important; }
  .intern-card-role{
    white-space:normal !important; overflow:visible !important; text-overflow:clip !important;
    font-size:1.08rem !important; line-height:1.22 !important; margin-bottom:.28rem !important;
  }
  .intern-card-org{ white-space:normal !important; overflow:visible !important; text-overflow:clip !important; }
  .intern-card-tag{ flex-shrink:0 !important; align-self:flex-start !important; margin-top:.22rem !important; }

  /* ── P5 · CERTIFICATIONS (canvas stars) ── */
  .cert-hud-tl{ top:4.2rem !important; flex-direction:column !important; align-items:center !important; gap:.15rem !important; }
  .cert-hud-num{ font-size:clamp(2.2rem,13vw,3.4rem) !important; }
  .cert-hud-label{ font-size:.6rem !important; letter-spacing:.22em !important; color:rgba(255,255,255,.4) !important; }
  .cf-hint, .cf-hint::after{ display:none !important; }   /* hint lives outside the panel now */
  .cert-focus{
    left:50% !important; right:auto !important; top:auto !important; bottom:2.3rem !important;
    width:min(86vw,340px) !important; max-width:none !important;
    transform:translate(-50%,14px) !important; text-align:center;
    background:rgba(8,8,11,.74); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
    border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:1.05rem 1.3rem;
  }
  .cert-focus.show{ transform:translate(-50%,0) !important; }
  .cert-focus .cf-rule{ margin:.7rem auto !important; }
  .cert-tap-hint{
    display:block; position:absolute; left:50%; bottom:2.5rem; transform:translateX(-50%);
    z-index:6; font-family:var(--mono); font-size:.62rem; letter-spacing:.2em;
    text-transform:uppercase; color:rgba(255,255,255,.3); pointer-events:none;
    animation:certHintPulse 2.4s ease-in-out infinite;
  }
  @keyframes certHintPulse{ 0%,100%{opacity:.28} 50%{opacity:.68} }

  /* ── P6 · PROJECTS (mac finder fits the viewport) ── */
  #p6{ overflow:hidden !important; }
  .finder-host{ padding:0 1.1rem !important; }
  .finder-window{ max-height:84svh !important; }
  .window-title{ font-size:11px !important; max-width:58vw; overflow:hidden; text-overflow:ellipsis; }

  /* ── P8 · DISCLOSURES (magazine cover) ── */
  #pFindings{ overflow-x:hidden !important; }
  .ds-wrap{ padding:4.9rem 1.7rem 2.6rem !important; gap:1.6rem !important; }
  .ds-issue{ justify-content:center !important; font-size:.62rem !important; }
  .ds-dust-canvas{ display:none !important; }            /* avoid horizontal bleed; stamp still impacts */
  .ds-headline{ font-size:clamp(2rem,9vw,3rem) !important; gap:.1em !important; }
  .ds-attr{ font-size:.62rem !important; }
  .ds-cta{ font-size:1.12rem !important; }
  .ds-cta-meta{ font-size:.6rem !important; }
  .ds-stat-v{ font-size:2rem !important; }
  .ds-stat-l{ font-size:.58rem !important; }
  .ds-hits-h{ font-size:.6rem !important; }
  .ds-hit-id{ font-size:.62rem !important; min-width:48px !important; }
  .ds-hit-t{ font-size:.95rem !important; }
  .ds-hit-sev{ font-size:.55rem !important; }

  /* ── P9 · ABOUT & RESUME (lanyard + bento) ── */
  .ab-lanyard-wrap{ height:46svh !important; }
  .ab-bento{ padding:.4rem 0 2.6rem !important; }
  .ab-card{ padding:1.15rem 1.7rem !important; }
  .ab-tag{ margin-bottom:.55rem !important; color:rgba(255,255,255,.34) !important; }
  .ab-card--name{ padding-top:1.5rem !important; }
  .ab-card--name .ab-tag{ margin-bottom:.7rem !important; }
  .ab-name-big{ font-size:clamp(1.7rem,8vw,2.4rem) !important; line-height:1 !important; margin-bottom:0 !important; }
  .ab-edu-deg{ font-size:1.02rem !important; }
  .ab-stats-grid{ grid-template-columns:repeat(3,1fr) !important; gap:1rem .6rem !important; }
  .ab-stat-val{ font-size:clamp(1.2rem,6vw,1.7rem) !important; }
  .ab-stat-lbl{ font-size:.56rem !important; line-height:1.35 !important; }
  .ab-lang-nm{ font-size:.98rem !important; }
  .ab-card--resume .ab-card-inner{ align-items:center !important; text-align:center; }
  .ab-resume-big{ font-size:clamp(1.4rem,7vw,1.9rem) !important; margin:.2rem 0 .5rem !important; }
  .ab-resume-cta{ margin-top:.7rem !important; padding:.5rem 1.15rem !important; font-size:.66rem !important; }

  /* ── P7 · CONTACT (globe is hover-only → give touch users real links) ── */
  .contact-mobile{
    display:flex; flex-direction:column;
    position:absolute; left:0; right:0; bottom:0; z-index:14;
    padding:3rem 1.7rem 2rem;
    background:linear-gradient(to top,#000 28%,rgba(0,0,0,.82) 64%,transparent);
    pointer-events:none;
  }
  .cm-head{
    font-family:var(--serif); font-style:italic; font-size:1.45rem;
    color:#fff; line-height:1.2; margin-bottom:.8rem;
  }
  .cm-link{
    pointer-events:auto; display:grid; grid-template-columns:auto minmax(0,1fr) auto;
    align-items:baseline; gap:.9rem; padding:.85rem .15rem;
    border-top:1px solid rgba(255,255,255,.1); text-decoration:none;
    transition:padding-left .25s;
  }
  .cm-link:last-child{ border-bottom:1px solid rgba(255,255,255,.1); }
  .cm-link:active{ padding-left:.5rem; }
  .cm-k{ font-family:var(--mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.4); }
  .cm-v{ font-family:var(--serif); font-style:italic; font-size:1.02rem; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .cm-arr{ font-family:var(--sans); font-size:.85rem; color:rgba(255,255,255,.5); }
}

/* very small phones — keep the finder fully on-screen */
@media (max-width: 520px) {
  .finder-body{ flex-direction:column !important; height:auto !important; }
  .finder-sidebar{ display:none !important; }
  .finder-file-area{ min-height:0 !important; max-height:34svh !important; }
  .finder-preview{
    width:100% !important; max-height:30svh !important;
    border-left:none !important; border-top:1px solid #D0D0D0 !important;
  }
  .ds-headline{ font-size:clamp(1.7rem,8.5vw,2.5rem) !important; }
  .ab-name-big{ font-size:clamp(1.5rem,8vw,2.1rem) !important; }
}