:root{
  --bg:#0D0D0D;
  --text:#F5F5F5;
  --muted:rgba(245,245,245,.68);
  --soft:rgba(245,245,245,.44);
  --line:rgba(245,245,245,.10);
  --line-2:rgba(245,245,245,.16);
  --accent:#A10000;
  --accent-bright:#FF3D3D;
  --dark:#0D0D0D;
  --light:#F5F5F5;
  --paper:#FFFFFF;
  --max:1440px;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-soft:cubic-bezier(.22,.61,.36,1);
  --shadow:0 24px 70px rgba(0,0,0,.28);
  --radius:24px;
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  font-family:Inter, Helvetica, Arial, sans-serif;
  background:
    radial-gradient(circle at 80% 10%, rgba(255,0,0,.12), transparent 24%),
    radial-gradient(circle at 15% 30%, rgba(255,255,255,.04), transparent 20%),
    linear-gradient(180deg, #0D0D0D 0%, #0D0D0D 100%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

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

button{
  font:inherit;
}

img{
  max-width:100%;
  display:block;
}

.grid-overlay{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.22;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.82), transparent 92%);
  transform:translate(var(--gx,0px), var(--gy,0px));
  transition:transform .18s linear;
}

.container{
  width:min(var(--max), calc(100% - 56px));
  margin:0 auto;
  position:relative;
  z-index:2;
}

/* =========================
   HEADER / NAV
   ========================= */

.header{
  position:sticky;
  top:0;
  z-index:50;
  backdrop-filter:blur(14px);
  background:rgba(13,13,13,.72);
  border-bottom:1px solid rgba(245,245,245,.06);
}

.header-inner{
  min-height:80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.logo-link{
  display:inline-flex;
  align-items:center;
  position:relative;
  z-index:2;
}

.logo-img{
  height:70px;
  width:auto;
  object-fit:contain;
  transition:
    opacity .25s var(--ease),
    transform .25s var(--ease);
}

.logo-link:hover .logo-img{
  opacity:.82;
  transform:translateY(-1px);
}

.logo-placeholder{
  width:128px;
  aspect-ratio:16/9;
  border:1px solid rgba(245,245,245,.12);
  border-radius:12px;
  display:grid;
  place-items:center;
  color:rgba(245,245,245,.42);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.62rem;
}

.menu-wrap{
  position:relative;
}

.menu-button{
  width:50px;
  height:50px;
  border-radius:999px;
  border:1px solid var(--line-2);
  background:rgba(255,255,255,.03);
  color:var(--text);
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:
    transform .22s var(--ease),
    border-color .22s var(--ease),
    background .22s var(--ease),
    box-shadow .22s var(--ease);
}

.menu-button:hover{
  transform:translateY(-1px);
  border-color:rgba(161,0,0,.56);
  box-shadow:0 0 0 4px rgba(161,0,0,.08);
}

.menu-button:active,
.menu-button.open{
  border-color:rgba(161,0,0,.72);
  background:rgba(161,0,0,.08);
  box-shadow:0 0 0 4px rgba(161,0,0,.12);
}

.menu-icon{
  display:inline-flex;
  flex-direction:column;
  gap:5px;
  align-items:center;
  justify-content:center;
}

.menu-icon span{
  width:17px;
  height:1.5px;
  background:var(--text);
  display:block;
  transition:
    background .22s var(--ease),
    transform .22s var(--ease);
}

.menu-button:hover .menu-icon span,
.menu-button.open .menu-icon span{
  background:var(--accent-bright);
}

.menu-button.open .menu-icon span:first-child{
  transform:translateY(3.25px) rotate(18deg);
}

.menu-button.open .menu-icon span:last-child{
  transform:translateY(-3.25px) rotate(-18deg);
}

.menu-panel{
  position:absolute;
  right:0;
  top:calc(100% + 14px);
  width:220px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(13,13,13,.95);
  backdrop-filter:blur(12px);
  box-shadow:var(--shadow);
  display:grid;
  gap:6px;
  opacity:0;
  pointer-events:none;
  transform:translateY(-8px);
  transition:
    opacity .22s var(--ease),
    transform .22s var(--ease);
}

.menu-panel.open{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}

.menu-panel a{
  padding:10px 12px;
  border-radius:12px;
  color:var(--muted);
  transition:
    background .2s var(--ease),
    color .2s var(--ease);
}

.menu-panel a:hover{
  background:rgba(255,255,255,.04);
  color:var(--text);
}

/* =========================
   HOME — HERO
   ========================= */

.watermark{
  position:fixed;
  right:4vw;
  top:13vh;
  width:min(40vw, 500px);
  aspect-ratio:1.7/1;
  pointer-events:none;
  z-index:0;
  opacity:.28;
}

.eye{
  position:relative;
  width:100%;
  height:100%;
}

.eye-outline{
  position:absolute;
  inset:0;
  border:1.5px solid rgba(245,245,245,.24);
  border-radius:100% / 50%;
  box-shadow:
    inset 0 0 110px rgba(255,255,255,.02),
    0 0 40px rgba(0,0,0,.18);
}

.eye-pupil{
  position:absolute;
  width:30%;
  aspect-ratio:1/1;
  left:50%;
  top:50%;
  border-radius:50%;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle at 30% 30%, #ff6b6b 0%, #ff2f2f 40%, #d40000 72%, #8b0000 100%);
  box-shadow:0 0 62px rgba(255,47,47,.46);
  transition:transform .06s linear;
}

.hero{
  min-height:calc(100vh - 80px);
  display:flex;
  align-items:center;
  padding:0;
}

.hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
  max-width:980px;
  width:100%;
}

.eyebrow{
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.72rem;
  color:var(--soft);
  display:inline-block;
}

.hero-title{
  margin:14px 0 0;
  font-family:"Glass Antiqua", serif;
  font-size:clamp(5.2rem, 15vw, 11rem);
  line-height:.88;
  letter-spacing:-.03em;
  font-weight:400;
}

.hero-title .ego{
  color:var(--accent);
}

.hero-title .sin{
  color:var(--text);
}

.hero-tagline{
  margin:16px 0 0;
  font-size:clamp(1.4rem, 2.4vw, 2rem);
  letter-spacing:-.05em;
  color:var(--text);
}

.hero-tagline span{
  color:var(--accent);
}

.hero-text{
  margin:22px 0 0;
  max-width:760px;
  color:var(--muted);
  font-size:1.08rem;
  line-height:1.6;
}

.hero-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:34px;
}

.btn{
  min-height:50px;
  padding:0 18px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line-2);
  transition:
    transform .24s var(--ease),
    border-color .24s var(--ease),
    background .24s var(--ease),
    color .24s var(--ease);
  cursor:pointer;
}

.btn:hover{
  transform:translateY(-2px);
  border-color:rgba(161,0,0,.5);
}

.btn-primary{
  background:var(--text);
  color:#111;
}

.btn-secondary{
  background:rgba(255,255,255,.02);
  color:var(--text);
}

/* =========================
   HOME — GENERAL SECTIONS
   ========================= */

.section{
  padding:110px 0;
}

.profile-label,
.projects-label,
.skills-label,
.contact-label{
  color:var(--accent-bright);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.72rem;
  display:inline-block;
  margin-bottom:12px;
}

.section-title{
  margin:0;
  font-size:clamp(2.8rem, 6vw, 5.8rem);
  line-height:.94;
  letter-spacing:-.07em;
  font-weight:640;
}

/* =========================
   HOME — PROFILE
   ========================= */

.profile-wrap{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:34px;
  align-items:start;
  margin-top:32px;
}

.portrait{
  width:100%;
  aspect-ratio:4/5;
  min-height:520px;
  border-radius:28px;
  overflow:hidden;
  border:1px solid rgba(245,245,245,.08);
  background:#000;
  position:relative;
  box-shadow:var(--shadow);
}

.portrait img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:grayscale(100%) contrast(1.05);
  transition:
    transform .4s var(--ease),
    filter .4s var(--ease);
}

.portrait:hover img{
  transform:scale(1.03);
  filter:grayscale(0%) contrast(1.1);
}

.profile-main{
  display:block;
}

.profile-copy{
  font-size:clamp(1.5rem, 2.3vw, 2.5rem);
  line-height:1.16;
  letter-spacing:-.05em;
  margin:0;
}

.profile-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:26px;
  margin-bottom:22px;
}

.cv-button{
  width:74px;
  height:74px;
  border-radius:50%;
  border:none;
  background:var(--accent-bright);
  color:#0D0D0D;
  font-weight:700;
  letter-spacing:-.03em;
  display:grid;
  place-items:center;
  flex-shrink:0;
  box-shadow:0 12px 30px rgba(255,61,61,.18);
  transition:
    transform .22s var(--ease),
    box-shadow .22s var(--ease);
}

.cv-button:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 36px rgba(255,61,61,.24);
}

.meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:0;
}

.pill,
.project-meta span{
  min-height:34px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--muted);
  font-size:.85rem;
  background:rgba(255,255,255,.02);
}

.identity-panels{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:18px;
  margin-top:0;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transition:
    max-height .38s var(--ease),
    opacity .28s var(--ease),
    margin-top .28s var(--ease);
}

.identity-panels.open{
  max-height:500px;
  opacity:1;
  margin-top:28px;
}

.identity-card{
  border-radius:24px;
  padding:24px;
  line-height:1.6;
  box-shadow:var(--shadow);
}

.identity-card h3{
  margin:0 0 14px;
  font-size:1.5rem;
  letter-spacing:-.04em;
}

.identity-card p{
  margin:0;
  font-size:1rem;
}

.identity-card.light{
  background:#F5F5F5;
  color:#111;
  border:1px solid rgba(16,16,16,.08);
}

.identity-card.dark{
  background:#111;
  color:#F5F5F5;
  border:1px solid rgba(245,245,245,.08);
}

/* =========================
   HOME — PROJECT CAROUSEL
   ========================= */

.projects-wrap{
  margin-top:40px;
}

.projects-header{
  margin-bottom:34px;
}

.carousel-stage{
  position:relative;
  width:100%;
  min-height:720px;
  padding-top:10px;
  overflow:hidden;
  touch-action:pan-y;
}

.carousel-track{
  position:relative;
  height:100%;
  min-height:720px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.project-card{
  position:absolute;
  width:min(680px, 54vw);
  min-height:620px;
  border-radius:28px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#131313;
  box-shadow:var(--shadow);
  transition:
    transform .6s var(--ease),
    opacity .6s var(--ease),
    filter .6s var(--ease),
    border-color .32s var(--ease);
  cursor:grab;
  user-select:none;
  will-change:transform, opacity;
}

.project-card.active{
  transform:translateX(0) scale(1);
  opacity:1;
  filter:blur(0);
  z-index:3;
  pointer-events:auto;
}

.project-card.prev{
  transform:translateX(-82%) scale(.82);
  opacity:.38;
  filter:blur(.4px);
  z-index:2;
  pointer-events:auto;
}

.project-card.next{
  transform:translateX(82%) scale(.82);
  opacity:.38;
  filter:blur(.4px);
  z-index:2;
  pointer-events:auto;
}

.project-card.hidden-left{
  transform:translateX(-140%) scale(.74);
  opacity:0;
  z-index:1;
  pointer-events:none;
}

.project-card.hidden-right{
  transform:translateX(140%) scale(.74);
  opacity:0;
  z-index:1;
  pointer-events:none;
}

.project-media{
  position:relative;
  min-height:340px;
  background:
    radial-gradient(circle at 72% 22%, rgba(161,0,0,.22), transparent 20%),
    linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

.project-media-image{
  background-size:cover;
  background-position:center top;
  background-repeat:no-repeat;
}

.project-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(13,13,13,.82), rgba(13,13,13,.10));
}

.project-small{
  position:absolute;
  left:20px;
  bottom:20px;
  z-index:1;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.72rem;
  color:rgba(245,245,245,.72);
}

.project-body{
  padding:22px;
  display:grid;
  gap:16px;
}

.project-body h3{
  margin:0;
  font-size:1.8rem;
  line-height:1.02;
  letter-spacing:-.05em;
}

.project-desc{
  margin:0;
  color:var(--muted);
  line-height:1.62;
  font-size:1rem;
}

.project-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.projects-actions{
  display:flex;
  justify-content:center;
  margin-top:34px;
}

/* =========================
   HOME — SKILLS
   ========================= */

.skills-section{
  background:linear-gradient(180deg, rgba(245,245,245,.98), rgba(236,236,236,.98));
  color:#111;
}

.skills-wrap{
  margin-top:36px;
}

.skills-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
}

.skill-card{
  border-radius:24px;
  overflow:hidden;
  border:1px solid rgba(16,16,16,.1);
  background:
    linear-gradient(135deg, rgba(16,16,16,.03), rgba(16,16,16,.01)),
    radial-gradient(circle at 78% 14%, rgba(161,0,0,.08), transparent 30%);
  box-shadow:0 18px 50px rgba(0,0,0,.06);
}

.skill-trigger{
  width:100%;
  text-align:left;
  border:none;
  background:transparent;
  padding:22px;
  cursor:pointer;
  color:#111;
}

.skill-top{
  display:flex;
  align-items:center;
  gap:14px;
}

.skill-icon{
  width:42px;
  height:42px;
  border-radius:12px;
  border:1px solid rgba(16,16,16,.12);
  display:grid;
  place-items:center;
  color:var(--accent);
  background:rgba(161,0,0,.03);
  flex-shrink:0;
}

.skill-icon svg{
  width:21px;
  height:21px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.skill-trigger h3{
  margin:0;
  font-size:1.18rem;
  letter-spacing:-.03em;
}

.skill-panel{
  max-height:0;
  overflow:hidden;
  padding:0 22px;
  border-top:1px solid transparent;
  transition:
    max-height .36s var(--ease),
    padding .36s var(--ease),
    border-color .36s var(--ease);
}

.skill-card.open .skill-panel{
  max-height:260px;
  padding:0 22px 22px;
  border-top-color:rgba(16,16,16,.1);
}

.skill-panel p{
  margin:16px 0 0;
  color:rgba(16,16,16,.72);
  line-height:1.62;
  max-width:980px;
}

.software-section{
  margin-top:42px;
}

.software-heading{
  margin:0 0 26px;
  font-size:clamp(2.8rem, 6vw, 5.8rem);
  line-height:.94;
  letter-spacing:-.07em;
  font-weight:640;
  text-align:center;
  color:#111;
}

.software-band{
  position:relative;
  left:50%;
  right:50%;
  margin-left:-50vw;
  margin-right:-50vw;
  width:100vw;
  overflow:hidden;
  background:var(--accent-bright);
  min-height:72px;
  display:flex;
  align-items:center;
  border-top:1px solid rgba(255,255,255,.14);
  border-bottom:1px solid rgba(255,255,255,.14);
}

.software-band-track{
  display:flex;
  align-items:center;
  gap:56px;
  white-space:nowrap;
  min-width:max-content;
  padding:0 28px;
  animation:softwareLoop 34s linear infinite;
  font-family:"Press Start 2P", monospace;
  font-size:.78rem;
  line-height:1.7;
  color:#F5F5F5;
  text-transform:uppercase;
}

.software-band-track span{
  display:inline-block;
}

.software-band-track strong{
  font-weight:400;
  color:#0D0D0D;
  background:rgba(245,245,245,.88);
  padding:8px 12px;
  border-radius:999px;
  margin-right:10px;
}

@keyframes softwareLoop{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}

/* =========================
   HOME — CONTACT
   ========================= */

.contact-section{
  position:relative;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,61,61,.08), transparent 28%),
    linear-gradient(180deg, #0D0D0D 0%, #090909 100%);
  overflow:hidden;
}

.contact-section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.75) 18%, rgba(0,0,0,.9) 100%);
  opacity:.18;
}

.contact-shell{
  position:relative;
  z-index:1;
  max-width:980px;
  margin:0 auto;
  text-align:center;
  padding:32px 0 10px;
}

.contact-logo-wrap{
  display:flex;
  justify-content:center;
  margin-bottom:28px;
}

.contact-footer-logo img,
.contact-logo-wrap img{
  width:min(50%, 260px);
  height:auto;
  margin:0 auto;
  object-fit:contain;
  opacity:.9;
  transition:
    opacity .25s var(--ease),
    transform .25s var(--ease);
}

.contact-footer-logo img:hover,
.contact-logo-wrap img:hover{
  opacity:1;
  transform:scale(1.04);
}

.contact-logo-placeholder{
  width:clamp(110px, 12vw, 150px);
  aspect-ratio:16/9;
  border:1px solid rgba(245,245,245,.12);
  border-radius:16px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.015)),
    radial-gradient(circle at 70% 20%, rgba(161,0,0,.2), transparent 34%);
  display:grid;
  place-items:center;
  color:rgba(245,245,245,.45);
  letter-spacing:.16em;
  text-transform:uppercase;
  font-size:.62rem;
  box-shadow:0 20px 60px rgba(0,0,0,.28);
}

.contact-title{
  margin:0 auto;
  max-width:900px;
}

.contact-text{
  max-width:760px;
  margin:24px auto 0;
  color:var(--muted);
  font-size:1.12rem;
  line-height:1.7;
}

.contact-links-stack{
  display:grid;
  gap:14px;
  max-width:820px;
  margin:42px auto 0;
}

.contact-link-card{
  min-height:86px;
  border-radius:22px;
  border:1px solid rgba(245,245,245,.1);
  background:
    linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 26px;
  color:var(--text);
  transition:
    transform .28s var(--ease),
    border-color .28s var(--ease),
    background .28s var(--ease),
    box-shadow .28s var(--ease);
  box-shadow:0 12px 34px rgba(0,0,0,.16);
}

.contact-link-card:hover{
  transform:translateY(-3px);
  border-color:rgba(255,61,61,.34);
  background:
    linear-gradient(135deg, rgba(255,61,61,.08), rgba(255,255,255,.02));
  box-shadow:0 20px 44px rgba(0,0,0,.24);
}

.contact-link-main{
  font-size:clamp(1.05rem, 2vw, 1.4rem);
  letter-spacing:-.04em;
  font-weight:600;
  transition:
    transform .28s var(--ease),
    color .28s var(--ease);
}

.contact-link-arrow{
  font-size:1.3rem;
  color:var(--accent-bright);
  transform:translateX(0);
  transition:
    transform .28s var(--ease),
    opacity .28s var(--ease);
  opacity:.85;
}

.contact-link-card:hover .contact-link-main{
  transform:translateX(6px);
}

.contact-link-card:hover .contact-link-arrow{
  transform:translateX(6px) translateY(-1px);
  opacity:1;
}

.contact-meta{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:34px;
}

.contact-meta span{
  min-height:34px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(245,245,245,.1);
  border-radius:999px;
  color:rgba(245,245,245,.72);
  font-size:.82rem;
  background:rgba(255,255,255,.02);
  transition:
    border-color .22s var(--ease),
    color .22s var(--ease),
    background .22s var(--ease);
}

.contact-meta span:hover{
  border-color:rgba(255,61,61,.28);
  color:var(--text);
  background:rgba(255,61,61,.06);
}

:root{
  --bg:#0D0D0D;
  --text:#F5F5F5;
  --muted:rgba(245,245,245,.68);
  --soft:rgba(245,245,245,.44);
  --line:rgba(245,245,245,.10);
  --line-2:rgba(245,245,245,.16);
  --accent:#A10000;
  --accent-bright:#FF3D3D;
  --dark:#0D0D0D;
  --light:#F5F5F5;
  --paper:#FFFFFF;
  --max:1440px;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-soft:cubic-bezier(.22,.61,.36,1);
  --shadow:0 24px 70px rgba(0,0,0,.28);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, Helvetica, Arial, sans-serif;
  background:
    radial-gradient(circle at 80% 10%, rgba(255,0,0,.12), transparent 24%),
    radial-gradient(circle at 15% 30%, rgba(255,255,255,.04), transparent 20%),
    linear-gradient(180deg, #0D0D0D 0%, #0D0D0D 100%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
a{text-decoration:none;color:inherit}
button{font:inherit}
img{max-width:100%;display:block}

.container{
  width:min(var(--max), calc(100% - 56px));
  margin:0 auto;
  position:relative;
  z-index:2;
}

.grid-overlay{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  opacity:.22;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.82), transparent 92%);
  transform:translate(var(--gx,0px), var(--gy,0px));
  transition:transform .18s linear;
}

/* HEADER */
.header{
  position:sticky;
  top:0;
  z-index:50;
  backdrop-filter:blur(14px);
  background:rgba(13,13,13,.72);
  border-bottom:1px solid rgba(245,245,245,.06);
}
.header-inner{
  min-height:80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.logo-link{display:inline-flex;align-items:center;position:relative;z-index:2}
.logo-img{height:70px;width:auto;object-fit:contain;transition:opacity .25s var(--ease),transform .25s var(--ease)}
.logo-link:hover .logo-img{opacity:.82;transform:translateY(-1px)}
.logo-placeholder{
  width:128px;aspect-ratio:16/9;border:1px solid rgba(245,245,245,.12);border-radius:12px;
  display:grid;place-items:center;color:rgba(245,245,245,.42);text-transform:uppercase;letter-spacing:.16em;font-size:.62rem;
}
.menu-wrap{position:relative}
.menu-button{
  width:50px;height:50px;border-radius:999px;border:1px solid var(--line-2);
  background:rgba(255,255,255,.03);color:var(--text);display:grid;place-items:center;cursor:pointer;
  transition:transform .22s var(--ease),border-color .22s var(--ease),background .22s var(--ease),box-shadow .22s var(--ease);
}
.menu-button:hover{transform:translateY(-1px);border-color:rgba(161,0,0,.56);box-shadow:0 0 0 4px rgba(161,0,0,.08)}
.menu-button:active,.menu-button.open{border-color:rgba(161,0,0,.72);background:rgba(161,0,0,.08);box-shadow:0 0 0 4px rgba(161,0,0,.12)}
.menu-icon{display:inline-flex;flex-direction:column;gap:5px;align-items:center;justify-content:center}
.menu-icon span{width:17px;height:1.5px;background:var(--text);display:block;transition:background .22s var(--ease),transform .22s var(--ease)}
.menu-button:hover .menu-icon span,.menu-button.open .menu-icon span{background:var(--accent-bright)}
.menu-button.open .menu-icon span:first-child{transform:translateY(3.25px) rotate(18deg)}
.menu-button.open .menu-icon span:last-child{transform:translateY(-3.25px) rotate(-18deg)}
.menu-panel{
  position:absolute;right:0;top:calc(100% + 14px);width:220px;padding:14px;border:1px solid var(--line);
  border-radius:18px;background:rgba(13,13,13,.95);backdrop-filter:blur(12px);box-shadow:var(--shadow);
  display:grid;gap:6px;opacity:0;pointer-events:none;transform:translateY(-8px);
  transition:opacity .22s var(--ease),transform .22s var(--ease);
}
.menu-panel.open{opacity:1;pointer-events:auto;transform:translateY(0)}
.menu-panel a{padding:10px 12px;border-radius:12px;color:var(--muted);transition:background .2s var(--ease),color .2s var(--ease)}
.menu-panel a:hover{background:rgba(255,255,255,.04);color:var(--text)}

/* HOME SUPPORT */
.watermark{position:fixed;right:4vw;top:13vh;width:min(40vw,500px);aspect-ratio:1.7/1;pointer-events:none;z-index:0;opacity:.28}
.eye{position:relative;width:100%;height:100%}
.eye-outline{position:absolute;inset:0;border:1.5px solid rgba(245,245,245,.24);border-radius:100% / 50%;box-shadow:inset 0 0 110px rgba(255,255,255,.02),0 0 40px rgba(0,0,0,.18)}
.eye-pupil{position:absolute;width:30%;aspect-ratio:1/1;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 30% 30%, #ff6b6b 0%, #ff2f2f 40%, #d40000 72%, #8b0000 100%);box-shadow:0 0 62px rgba(255,47,47,.46);transition:transform .06s linear}
.hero{min-height:calc(100vh - 80px);display:flex;align-items:center;padding:0}
.hero-grid{display:grid;grid-template-columns:1fr;gap:20px;max-width:980px;width:100%}
.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--soft);display:inline-block}
.hero-title{margin:14px 0 0;font-family:"Glass Antiqua",serif;font-size:clamp(5.2rem,15vw,11rem);line-height:.88;letter-spacing:-.03em;font-weight:400}
.hero-title .ego{color:var(--accent)}.hero-title .sin{color:var(--text)}
.hero-tagline{margin:16px 0 0;font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:-.05em;color:var(--text)}
.hero-tagline span{color:var(--accent)}
.hero-text{margin:22px 0 0;max-width:760px;color:var(--muted);font-size:1.08rem;line-height:1.6}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}
.btn{min-height:50px;padding:0 18px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-2);transition:transform .24s var(--ease),border-color .24s var(--ease),background .24s var(--ease),color .24s var(--ease);cursor:pointer}
.btn:hover{transform:translateY(-2px);border-color:rgba(161,0,0,.5)}
.btn-primary{background:var(--text);color:#111}.btn-secondary{background:rgba(255,255,255,.02);color:var(--text)}
.section{padding:110px 0}.profile-label,.projects-label,.skills-label,.contact-label{color:var(--accent-bright);text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;display:inline-block;margin-bottom:12px}.section-title{margin:0;font-size:clamp(2.8rem,6vw,5.8rem);line-height:.94;letter-spacing:-.07em;font-weight:640}
.profile-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:34px;align-items:start;margin-top:32px}.portrait{width:100%;aspect-ratio:4/5;min-height:520px;border-radius:28px;overflow:hidden;border:1px solid rgba(245,245,245,.08);background:#000;position:relative;box-shadow:var(--shadow)}.portrait img{width:100%;height:100%;object-fit:cover;filter:grayscale(100%) contrast(1.05);transition:transform .4s var(--ease),filter .4s var(--ease)}.portrait:hover img{transform:scale(1.03);filter:grayscale(0%) contrast(1.1)}.profile-copy{font-size:clamp(1.5rem,2.3vw,2.5rem);line-height:1.16;letter-spacing:-.05em;margin:0}.profile-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px;margin-bottom:22px}.cv-button{width:74px;height:74px;border-radius:50%;border:none;background:var(--accent-bright);color:#0D0D0D;font-weight:700;letter-spacing:-.03em;display:grid;place-items:center;flex-shrink:0;box-shadow:0 12px 30px rgba(255,61,61,.18);transition:transform .22s var(--ease),box-shadow .22s var(--ease)}.cv-button:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(255,61,61,.24)}.meta{display:flex;flex-wrap:wrap;gap:10px}.pill,.project-meta span{min-height:34px;padding:0 12px;display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:.85rem;background:rgba(255,255,255,.02)}
.identity-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-height:0;opacity:0;overflow:hidden;transition:max-height .38s var(--ease),opacity .28s var(--ease),margin-top .28s var(--ease)}.identity-panels.open{max-height:500px;opacity:1;margin-top:28px}.identity-card{border-radius:24px;padding:24px;line-height:1.6;box-shadow:var(--shadow)}.identity-card h3{margin:0 0 14px;font-size:1.5rem;letter-spacing:-.04em}.identity-card p{margin:0}.identity-card.light{background:#F5F5F5;color:#111;border:1px solid rgba(16,16,16,.08)}.identity-card.dark{background:#111;color:#F5F5F5;border:1px solid rgba(245,245,245,.08)}
.projects-wrap{margin-top:40px}.projects-header{margin-bottom:34px}.carousel-stage{position:relative;width:100%;min-height:720px;padding-top:10px;overflow:hidden;touch-action:pan-y}.carousel-track{position:relative;height:100%;min-height:720px;display:flex;align-items:center;justify-content:center}.project-card{position:absolute;width:min(680px,54vw);min-height:620px;border-radius:28px;overflow:hidden;border:1px solid var(--line);background:#131313;box-shadow:var(--shadow);transition:transform .6s var(--ease),opacity .6s var(--ease),filter .6s var(--ease),border-color .32s var(--ease);cursor:grab;user-select:none;will-change:transform,opacity}.project-card.active{transform:translateX(0) scale(1);opacity:1;filter:blur(0);z-index:3;pointer-events:auto}.project-card.prev{transform:translateX(-82%) scale(.82);opacity:.38;filter:blur(.4px);z-index:2;pointer-events:auto}.project-card.next{transform:translateX(82%) scale(.82);opacity:.38;filter:blur(.4px);z-index:2;pointer-events:auto}.project-card.hidden-left{transform:translateX(-140%) scale(.74);opacity:0;z-index:1;pointer-events:none}.project-card.hidden-right{transform:translateX(140%) scale(.74);opacity:0;z-index:1;pointer-events:none}.project-media{position:relative;min-height:340px;background:radial-gradient(circle at 72% 22%, rgba(161,0,0,.22), transparent 20%),linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02));background-size:cover;background-position:center;background-repeat:no-repeat}.project-media-image{background-size:cover;background-position:center top;background-repeat:no-repeat}.project-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top, rgba(13,13,13,.82), rgba(13,13,13,.10))}.project-small{position:absolute;left:20px;bottom:20px;z-index:1;text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;color:rgba(245,245,245,.72)}.project-body{padding:22px;display:grid;gap:16px}.project-body h3{margin:0;font-size:1.8rem;line-height:1.02;letter-spacing:-.05em}.project-desc{margin:0;color:var(--muted);line-height:1.62;font-size:1rem}.project-meta{display:flex;flex-wrap:wrap;gap:8px}.projects-actions{display:flex;justify-content:center;margin-top:34px}
.skills-section{background:linear-gradient(180deg, rgba(245,245,245,.98), rgba(236,236,236,.98));color:#111}.skills-wrap{margin-top:36px}.skills-grid{display:grid;grid-template-columns:1fr;gap:18px}.skill-card{border-radius:24px;overflow:hidden;border:1px solid rgba(16,16,16,.1);background:linear-gradient(135deg, rgba(16,16,16,.03), rgba(16,16,16,.01)),radial-gradient(circle at 78% 14%, rgba(161,0,0,.08), transparent 30%);box-shadow:0 18px 50px rgba(0,0,0,.06)}.skill-trigger{width:100%;text-align:left;border:none;background:transparent;padding:22px;cursor:pointer;color:#111}.skill-top{display:flex;align-items:center;gap:14px}.skill-icon{width:42px;height:42px;border-radius:12px;border:1px solid rgba(16,16,16,.12);display:grid;place-items:center;color:var(--accent);background:rgba(161,0,0,.03);flex-shrink:0}.skill-icon svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.skill-trigger h3{margin:0;font-size:1.18rem;letter-spacing:-.03em}.skill-panel{max-height:0;overflow:hidden;padding:0 22px;border-top:1px solid transparent;transition:max-height .36s var(--ease),padding .36s var(--ease),border-color .36s var(--ease)}.skill-card.open .skill-panel{max-height:260px;padding:0 22px 22px;border-top-color:rgba(16,16,16,.1)}.skill-panel p{margin:16px 0 0;color:rgba(16,16,16,.72);line-height:1.62;max-width:980px}.software-section{margin-top:42px}.software-heading{margin:0 0 26px;font-size:clamp(2.8rem,6vw,5.8rem);line-height:.94;letter-spacing:-.07em;font-weight:640;text-align:center;color:#111}.software-band{position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;width:100vw;overflow:hidden;background:var(--accent-bright);min-height:72px;display:flex;align-items:center;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}.software-band-track{display:flex;align-items:center;gap:56px;white-space:nowrap;min-width:max-content;padding:0 28px;animation:softwareLoop 34s linear infinite;font-family:"Press Start 2P",monospace;font-size:.78rem;line-height:1.7;color:#F5F5F5;text-transform:uppercase}.software-band-track strong{font-weight:400;color:#0D0D0D;background:rgba(245,245,245,.88);padding:8px 12px;border-radius:999px;margin-right:10px}@keyframes softwareLoop{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.contact-section{position:relative;background:radial-gradient(circle at 50% 0%, rgba(255,61,61,.08), transparent 28%),linear-gradient(180deg,#0D0D0D 0%,#090909 100%);overflow:hidden}.contact-shell{position:relative;z-index:1;max-width:980px;margin:0 auto;text-align:center;padding:32px 0 10px}.contact-footer-logo img,.contact-logo-wrap img{width:min(50%,260px);height:auto;margin:0 auto;object-fit:contain;opacity:.9;transition:opacity .25s var(--ease),transform .25s var(--ease)}.contact-title{margin:0 auto}.contact-text{max-width:760px;margin:24px auto 0;color:var(--muted);font-size:1.12rem;line-height:1.7}.contact-links-stack{display:grid;gap:14px;max-width:820px;margin:42px auto 0}.contact-link-card{min-height:86px;border-radius:22px;border:1px solid rgba(245,245,245,.1);background:linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.015));display:flex;align-items:center;justify-content:space-between;padding:0 26px;color:var(--text);transition:transform .28s var(--ease),border-color .28s var(--ease),background .28s var(--ease),box-shadow .28s var(--ease);box-shadow:0 12px 34px rgba(0,0,0,.16)}.contact-link-card:hover{transform:translateY(-3px);border-color:rgba(255,61,61,.34);background:linear-gradient(135deg,rgba(255,61,61,.08),rgba(255,255,255,.02));box-shadow:0 20px 44px rgba(0,0,0,.24)}.contact-link-main{font-size:clamp(1.05rem,2vw,1.4rem);letter-spacing:-.04em;font-weight:600}.contact-link-arrow{font-size:1.3rem;color:var(--accent-bright);opacity:.85}.contact-meta{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:34px}.contact-meta span{min-height:34px;padding:0 12px;display:inline-flex;align-items:center;border:1px solid rgba(245,245,245,.1);border-radius:999px;color:rgba(245,245,245,.72);font-size:.82rem;background:rgba(255,255,255,.02)}

/* PROJECTS PAGE */
.projects-page{min-height:100vh;background:radial-gradient(circle at 80% 10%, rgba(255,0,0,.10), transparent 24%),radial-gradient(circle at 15% 30%, rgba(255,255,255,.04), transparent 20%),linear-gradient(180deg,#0D0D0D 0%,#0D0D0D 100%)}
.projects-hero{padding:120px 0 70px;position:relative;overflow:hidden}
.projects-hero::after{content:"";position:absolute;right:-8vw;top:30px;width:min(34vw,420px);aspect-ratio:1.7/1;border:1px solid rgba(245,245,245,.14);border-radius:100% / 62%;opacity:.18;pointer-events:none}
.projects-hero-inner{max-width:1000px}.projects-page-label{color:var(--accent-bright);text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;display:inline-block;margin-bottom:16px}.projects-page-title{margin:0;font-size:clamp(3.4rem,8vw,7.8rem);line-height:.9;letter-spacing:-.08em;font-weight:650}.projects-page-title .accent{color:var(--accent-bright)}.projects-page-text{margin:22px 0 0;max-width:760px;color:var(--muted);font-size:1.08rem;line-height:1.7}.projects-page-meta,.project-filters{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.project-filter{min-height:38px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(245,245,245,.1);border-radius:999px;color:rgba(245,245,245,.72);font-size:.82rem;background:rgba(255,255,255,.02);cursor:pointer;transition:color .22s var(--ease),background .22s var(--ease),border-color .22s var(--ease),transform .22s var(--ease)}.project-filter:hover{color:var(--text);border-color:rgba(255,61,61,.35);background:rgba(255,61,61,.06);transform:translateY(-1px)}.project-filter.active{color:#fff;background:var(--accent-bright);border-color:var(--accent-bright)}
.projects-list-section{padding:36px 0 124px}.projects-list-container{width:min(1280px,calc(100% - 64px))}.projects-grid-page{display:grid;grid-template-columns:1fr;gap:46px}
.project-entry{border-radius:34px;overflow:hidden;border:1px solid rgba(245,245,245,.10);background:rgba(255,255,255,.025);box-shadow:0 24px 70px rgba(0,0,0,.24);transition:transform .32s var(--ease),border-color .32s var(--ease),box-shadow .32s var(--ease),opacity .32s var(--ease),max-height .32s var(--ease),margin .32s var(--ease)}
.project-entry:hover{transform:translateY(-3px);border-color:rgba(255,61,61,.28);box-shadow:0 34px 90px rgba(0,0,0,.32)}
.project-entry.open{border-color:rgba(255,61,61,.24);box-shadow:0 42px 110px rgba(0,0,0,.38)}
.project-entry.filtered-out{opacity:0;transform:translateY(10px);max-height:0;margin:0;border:0;overflow:hidden;pointer-events:none}
.project-entry-toggle{width:100%;display:block;border:0;padding:0;text-align:left;color:var(--text);background:transparent;cursor:pointer}
.project-entry-cover{position:relative;min-height:clamp(290px,42vw,560px);background:radial-gradient(circle at 72% 20%, rgba(255,61,61,.22), transparent 18%),linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.02));background-size:cover;background-position:center;background-repeat:no-repeat;isolation:isolate}
.project-entry-cover.has-image{background-size:cover;background-position:center;background-repeat:no-repeat}.project-entry-cover::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(to top, rgba(13,13,13,.92) 0%, rgba(13,13,13,.42) 45%, rgba(13,13,13,.08) 100%)}
.project-entry-kicker{position:absolute;left:clamp(22px,3vw,42px);bottom:clamp(20px,3vw,36px);z-index:2;text-transform:uppercase;letter-spacing:.16em;font-size:.74rem;color:rgba(245,245,245,.78)}
.project-entry-head{padding:clamp(26px,3.4vw,46px);display:grid;gap:18px}.project-entry-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.project-entry-title{margin:0;font-size:clamp(2.2rem,4.4vw,4.8rem);line-height:.9;letter-spacing:-.078em}.project-entry-desc{margin:0;max-width:980px;color:rgba(245,245,245,.70);font-size:1.03rem;line-height:1.7}.project-entry-meta{display:flex;flex-wrap:wrap;gap:8px}.project-entry-meta span{min-height:34px;padding:0 12px;display:inline-flex;align-items:center;border:1px solid rgba(245,245,245,.12);border-radius:999px;color:rgba(245,245,245,.74);background:rgba(255,255,255,.025);font-size:.82rem}
.project-entry-plus{width:68px;height:68px;border-radius:999px;border:1px solid rgba(245,245,245,.18);display:grid;place-items:center;flex-shrink:0;color:#0D0D0D;background:#FF3D3D;font-size:2.1rem;font-weight:520;box-shadow:0 16px 34px rgba(255,61,61,.22);transition:transform .35s var(--ease),background .35s var(--ease),box-shadow .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}.project-entry-plus span{display:block;line-height:1;transform:translateY(-2px)}.project-entry-toggle:hover .project-entry-plus{transform:scale(1.06);box-shadow:0 22px 48px rgba(255,61,61,.30)}.project-entry.open .project-entry-plus{transform:rotate(45deg);background:#F5F5F5;color:#0D0D0D;border-color:#F5F5F5}.project-entry.open .project-entry-toggle:hover .project-entry-plus{transform:rotate(45deg) scale(1.04)}
.project-entry-panel{max-height:0;overflow:hidden;opacity:0;transform:translateY(-8px);background:#F5F5F5;transition:max-height .8s var(--ease-soft),opacity .42s ease,transform .55s var(--ease-soft)}.project-entry.open .project-entry-panel{max-height:5200px;opacity:1;transform:translateY(0)}.project-entry-panel-inner{padding:clamp(26px,4vw,58px);border-top:1px solid rgba(13,13,13,.08)}
.project-archive{display:grid;gap:16px}.archive-item{border-radius:24px;overflow:hidden;border:1px solid rgba(13,13,13,.10);background:#fff;box-shadow:0 10px 26px rgba(0,0,0,.045);transition:box-shadow .28s var(--ease),transform .28s var(--ease),border-color .28s var(--ease)}.archive-item:hover{transform:translateY(-1px);border-color:rgba(255,61,61,.22);box-shadow:0 16px 40px rgba(0,0,0,.07)}.archive-trigger{width:100%;min-height:74px;padding:0 24px;border:0;background:#fff;color:#0D0D0D;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;cursor:pointer;text-align:left;transition:background .24s var(--ease),color .24s var(--ease),border-color .24s var(--ease)}.archive-trigger:hover{background:#111;color:#F5F5F5}.archive-item.open .archive-trigger{background:#0D0D0D;color:#F5F5F5}.archive-number{font-family:"Courier New",monospace;color:#FF3D3D;font-size:.9rem;letter-spacing:.1em}.archive-title{font-family:"Courier New",monospace;text-transform:uppercase;letter-spacing:.12em;font-size:.9rem}.archive-icon{width:34px;height:34px;border-radius:999px;border:1px solid currentColor;display:grid;place-items:center;transition:transform .28s var(--ease),background .28s var(--ease),color .28s var(--ease)}.archive-item.open .archive-icon{transform:rotate(45deg);background:#FF3D3D;color:#0D0D0D;border-color:#FF3D3D}.archive-content{max-height:0;overflow:hidden;opacity:0;background:#F5F5F5;transition:max-height .62s var(--ease-soft),opacity .35s ease}.archive-item.open .archive-content{max-height:2400px;opacity:1}
.project-entry-detail{margin:0;padding:28px;max-width:1080px;color:#171717;font-size:clamp(1rem,1.2vw,1.12rem);line-height:1.78}.project-entry-info{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:28px}.project-info-block{min-height:190px;border-radius:22px;border:1px solid rgba(13,13,13,.08);background:#fff;padding:24px 22px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center}.project-info-block h4{margin:0 0 14px;color:var(--accent-bright);font-size:.75rem;line-height:1.2;text-transform:uppercase;letter-spacing:.16em}.project-info-block p{margin:0;color:#252525;font-size:.94rem;line-height:1.62}
.inline-gallery{position:relative;margin:28px;border-radius:24px;overflow:hidden;background:#080808;border:1px solid rgba(13,13,13,.12);box-shadow:0 20px 60px rgba(0,0,0,.12);touch-action:pan-y}.inline-gallery-frame{position:relative;width:100%;height:clamp(360px,58vw,760px);overflow:hidden;background:#090909;cursor:pointer}.inline-gallery-track{height:100%;display:flex;transform:translate3d(0,0,0);transition:transform .58s var(--ease);will-change:transform}.inline-gallery-slide{height:100%;min-width:100%;display:flex;align-items:center;justify-content:center;background:#090909;padding:18px}.inline-gallery-slide img{width:100%;height:100%;object-fit:contain;object-position:center;user-select:none;-webkit-user-drag:none}.inline-gallery-nav{position:absolute;top:50%;z-index:5;width:56px;height:56px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(13,13,13,.34);color:#fff;backdrop-filter:blur(10px);display:grid;place-items:center;font-size:1.85rem;line-height:1;cursor:pointer;opacity:.76;transform:translateY(-50%);transition:opacity .24s var(--ease),background .24s var(--ease),border-color .24s var(--ease),transform .24s var(--ease)}.inline-gallery-nav:hover{opacity:1;background:rgba(255,61,61,.78);border-color:rgba(255,61,61,.95);transform:translateY(-50%) scale(1.04)}.inline-gallery-nav.prev{left:18px}.inline-gallery-nav.next{right:18px}.inline-gallery-dots{position:absolute;left:50%;bottom:18px;z-index:6;transform:translateX(-50%);display:flex;gap:8px;padding:8px 10px;border-radius:999px;background:rgba(13,13,13,.28);backdrop-filter:blur(8px)}.inline-gallery-dot{width:7px;height:7px;border-radius:999px;border:0;background:rgba(255,255,255,.42);padding:0;cursor:pointer;transition:width .25s var(--ease),background .25s var(--ease)}.inline-gallery-dot.active{width:22px;background:#FF3D3D}.inline-gallery-counter{position:absolute;left:18px;top:18px;z-index:6;font-family:"Courier New",monospace;color:rgba(245,245,245,.78);font-size:.86rem;letter-spacing:.12em;background:rgba(13,13,13,.28);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:8px 10px}
.projects-page-cta{display:flex;justify-content:center;margin-top:56px}.projects-talk-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:68px;padding:0 38px;border-radius:999px;background:#FF3D3D;color:#fff;font-size:1.08rem;font-weight:600;letter-spacing:-.02em;border:1px solid #FF3D3D;overflow:hidden;transition:transform .28s var(--ease),box-shadow .28s var(--ease),background .28s var(--ease);box-shadow:0 16px 34px rgba(255,61,61,.22)}.projects-talk-btn::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.22) 45%,transparent 70%);transform:translateX(-120%);transition:transform .65s var(--ease)}.projects-talk-btn:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 24px 46px rgba(255,61,61,.30)}.projects-talk-btn:hover::before{transform:translateX(120%)}

@media (max-width:980px){
  .watermark{top:14vh;right:1vw;width:min(54vw,360px)}.profile-wrap{grid-template-columns:1fr}.identity-panels{grid-template-columns:1fr}.carousel-stage,.carousel-track{min-height:660px}.project-card{width:min(620px,62vw)}.project-card.prev{transform:translateX(-76%) scale(.8)}.project-card.next{transform:translateX(76%) scale(.8)}.project-entry-info{grid-template-columns:1fr}.project-info-block{min-height:auto;align-items:flex-start;text-align:left}.project-info-block h4,.project-info-block p{text-align:left}
}
@media (max-width:760px){
  .container,.projects-list-container{width:min(var(--max),calc(100% - 32px))}.header-inner{min-height:74px}.logo-img{height:56px}.logo-placeholder{width:106px}.menu-panel{width:min(220px,78vw)}.hero{min-height:calc(100svh - 74px)}.hero-title{font-size:clamp(4.4rem,24vw,7rem)}.section{padding:78px 0}.section-title{font-size:clamp(2.6rem,13vw,4.4rem)}.portrait{min-height:auto}.cv-button{width:64px;height:64px}.identity-panels.open{max-height:800px}.carousel-stage,.carousel-track{min-height:620px}.project-card{width:min(92vw,520px);min-height:560px}.project-card.prev{transform:translateX(-68%) scale(.76);opacity:.20}.project-card.next{transform:translateX(68%) scale(.76);opacity:.20}.software-band{min-height:64px}.software-band-track{font-size:.62rem;gap:36px;padding:0 18px;animation-duration:26s}.software-band-track strong{padding:6px 10px}.contact-text{font-size:1rem}.contact-link-card{min-height:74px;padding:0 18px;border-radius:18px}.projects-hero{padding:96px 0 52px}.projects-list-section{padding:18px 0 88px}.projects-grid-page{gap:30px}.projects-page-title{font-size:clamp(2.8rem,13vw,4.6rem)}.projects-page-text{font-size:1rem}.project-filter{font-size:.78rem;min-height:36px}.project-entry{border-radius:24px}.project-entry-cover{min-height:260px}.project-entry-head{padding:22px 18px 22px}.project-entry-title-row{gap:14px}.project-entry-title{font-size:2.15rem;letter-spacing:-.055em}.project-entry-desc{font-size:.95rem;line-height:1.62}.project-entry-plus{width:52px;height:52px;font-size:1.62rem}.project-entry-panel-inner{padding:18px}.archive-trigger{min-height:64px;padding:0 16px;gap:12px}.archive-title{font-size:.76rem;letter-spacing:.08em}.archive-icon{width:30px;height:30px}.project-entry-detail{padding:20px;font-size:.96rem;line-height:1.68}.project-entry-info{padding:20px}.inline-gallery{margin:20px;border-radius:18px}.inline-gallery-frame{height:clamp(360px,92vw,560px)}.inline-gallery-slide{padding:12px}.inline-gallery-nav{width:42px;height:42px;font-size:1.35rem}.inline-gallery-nav.prev{left:10px}.inline-gallery-nav.next{right:10px}.inline-gallery-dots{bottom:12px}.inline-gallery-counter{top:12px;left:12px;font-size:.76rem}
}


/* =========================
   RESPONSIVE
   ========================= */

@media (max-width:980px){
  .watermark{
    top:14vh;
    right:1vw;
    width:min(54vw, 360px);
  }

  .profile-wrap{
    grid-template-columns:1fr;
  }

  .identity-panels{
    grid-template-columns:1fr;
  }

  .carousel-stage,
  .carousel-track{
    min-height:660px;
  }

  .project-card{
    width:min(620px, 62vw);
  }

  .project-card.prev{
    transform:translateX(-76%) scale(.8);
  }

  .project-card.next{
    transform:translateX(76%) scale(.8);
  }

  .project-entry-info{
    grid-template-columns:1fr;
  }

  .project-info-block{
    min-height:auto;
    align-items:flex-start;
    text-align:left;
  }

  .project-info-block h4,
  .project-info-block p{
    text-align:left;
  }
}

@media (max-width:760px){
  .container{
    width:min(var(--max), calc(100% - 32px));
  }

  .header-inner{
    min-height:74px;
  }

  .logo-img{
    height:56px;
  }

  .logo-placeholder{
    width:106px;
  }

  .menu-panel{
    width:min(220px, 78vw);
  }

  .hero{
    min-height:calc(100svh - 74px);
  }

  .hero-title{
    font-size:clamp(4.4rem, 24vw, 7rem);
  }

  .section{
    padding:78px 0;
  }

  .section-title{
    font-size:clamp(2.6rem, 13vw, 4.4rem);
  }

  .portrait{
    min-height:auto;
  }

  .cv-button{
    width:64px;
    height:64px;
  }

  .identity-panels.open{
    max-height:800px;
  }

  .carousel-stage,
  .carousel-track{
    min-height:620px;
  }

  .project-card{
    width:min(92vw, 520px);
    min-height:560px;
  }

  .project-card.prev{
    transform:translateX(-68%) scale(.76);
    opacity:.20;
  }

  .project-card.next{
    transform:translateX(68%) scale(.76);
    opacity:.20;
  }

  .project-card.hidden-left,
  .project-card.hidden-right{
    opacity:0;
  }

  .software-band{
    min-height:64px;
  }

  .software-band-track{
    font-size:.62rem;
    gap:36px;
    padding:0 18px;
    animation-duration:26s;
  }

  .software-band-track strong{
    padding:6px 10px;
  }

  .contact-shell{
    padding-top:12px;
  }

  .contact-text{
    font-size:1rem;
  }

  .contact-links-stack{
    margin-top:34px;
  }

  .contact-link-card{
    min-height:74px;
    padding:0 18px;
    border-radius:18px;
  }

  .contact-link-main{
    font-size:1.02rem;
  }

  .contact-link-arrow{
    font-size:1.1rem;
  }

  .contact-meta{
    gap:8px;
    margin-top:26px;
  }

  .contact-meta span{
    font-size:.76rem;
  }

  .projects-hero{
    padding:96px 0 52px;
  }

  .projects-list-section{
    padding:18px 0 88px;
  }

  .projects-grid-page{
    gap:24px;
  }

  .projects-page-title{
    font-size:clamp(2.8rem, 13vw, 4.6rem);
  }

  .projects-page-text{
    font-size:1rem;
  }

  .project-filter{
    font-size:.78rem;
    min-height:36px;
  }

  .project-entry{
    border-radius:24px;
  }

  .project-entry-cover{
    min-height:260px;
  }

  .project-entry-head{
    padding:22px 18px 20px;
  }

  .project-entry-title-row{
    gap:14px;
  }

  .project-entry-title{
    font-size:2rem;
    letter-spacing:-.055em;
  }

  .project-entry-plus{
    width:40px;
    height:40px;
    font-size:1.15rem;
  }

  .project-entry-desc{
    font-size:.95rem;
    line-height:1.62;
  }

  .project-entry-panel-inner{
    padding:22px 18px 24px;
  }

  .project-entry-detail{
    font-size:.96rem;
    line-height:1.68;
  }

  .feature-carousel-frame{
    aspect-ratio:4/3;
  }

  .feature-carousel-nav{
    width:42px;
    height:42px;
    font-size:1.35rem;
  }

  .feature-carousel-nav.prev{
    left:10px;
  }

  .feature-carousel-nav.next{
    right:10px;
  }

  .feature-carousel-dots{
    bottom:12px;
  }
}
/* =========================
   PROJECT CARDS — ARCHIVE SYSTEM
   ========================= */

.project-entry-plus{
  width:64px;
  height:64px;
  border-radius:999px;
  border:1px solid rgba(245,245,245,.22);
  display:grid;
  place-items:center;
  flex-shrink:0;
  color:#0D0D0D;
  background:#FF3D3D;
  font-size:2rem;
  font-weight:500;
  box-shadow:0 16px 34px rgba(255,61,61,.22);
  transition:
    transform .35s var(--ease),
    background .35s var(--ease),
    box-shadow .35s var(--ease);
}

.project-entry-plus span{
  display:block;
  line-height:1;
  transform:translateY(-1px);
}

.project-entry-toggle:hover .project-entry-plus{
  transform:scale(1.06);
  box-shadow:0 22px 48px rgba(255,61,61,.30);
}

.project-entry.open .project-entry-plus{
  transform:rotate(45deg);
  background:#F5F5F5;
  color:#0D0D0D;
}

.project-archive{
  display:grid;
  gap:12px;
}

.archive-item{
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(13,13,13,.10);
  background:#FFFFFF;
}

.archive-trigger{
  width:100%;
  min-height:72px;
  padding:0 22px;
  border:0;
  background:#FFFFFF;
  color:#0D0D0D;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:18px;
  cursor:pointer;
  text-align:left;
  transition:
    background .24s var(--ease),
    color .24s var(--ease);
}

.archive-trigger:hover{
  background:#0D0D0D;
  color:#F5F5F5;
}

.archive-number{
  font-family:"Courier New", monospace;
  color:#FF3D3D;
  font-size:.9rem;
  letter-spacing:.08em;
}

.archive-title{
  font-family:"Courier New", monospace;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.9rem;
}

.archive-icon{
  width:34px;
  height:34px;
  border-radius:999px;
  border:1px solid currentColor;
  display:grid;
  place-items:center;
  transition:transform .28s var(--ease);
}

.archive-item.open .archive-icon{
  transform:rotate(45deg);
}

.archive-content{
  max-height:0;
  overflow:hidden;
  opacity:0;
  background:#F5F5F5;
  transition:
    max-height .55s var(--ease-soft),
    opacity .35s ease;
}

.archive-item.open .archive-content{
  max-height:1600px;
  opacity:1;
}

.archive-content > *{
  margin:24px;
}

.archive-cover-image{
  width:calc(100% - 48px);
  aspect-ratio:16/9;
  border-radius:18px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-color:#111;
  overflow:hidden;
}

.archive-caption{
  margin-top:14px;
  color:rgba(13,13,13,.62);
  font-size:.9rem;
  line-height:1.55;
}

.gallery-open-card{
  width:calc(100% - 48px);
  min-height:180px;
  border-radius:20px;
  border:1px solid rgba(13,13,13,.10);
  background:
    radial-gradient(circle at 80% 20%, rgba(255,61,61,.16), transparent 30%),
    linear-gradient(135deg, #111, #1a1a1a);
  color:#F5F5F5;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  padding:24px;
  text-align:left;
  overflow:hidden;
  transition:
    transform .28s var(--ease),
    box-shadow .28s var(--ease),
    border-color .28s var(--ease);
}

.gallery-open-card span{
  font-size:clamp(1.5rem, 3vw, 2.8rem);
  line-height:1;
  letter-spacing:-.06em;
  font-weight:650;
}

.gallery-open-card small{
  margin-top:10px;
  color:rgba(245,245,245,.62);
  font-size:.88rem;
}

.gallery-open-card:hover{
  transform:translateY(-3px);
  border-color:rgba(255,61,61,.45);
  box-shadow:0 22px 60px rgba(0,0,0,.22);
}

/* =========================
   FULLSCREEN GALLERY MODAL
   ========================= */

.gallery-modal{
  position:fixed;
  inset:0;
  z-index:200;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(5,5,5,.94);
  backdrop-filter:blur(14px);
  padding:64px;
}

.gallery-modal.open{
  display:flex;
}

.gallery-modal-stage{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}

.gallery-modal-image{
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  box-shadow:0 30px 90px rgba(0,0,0,.45);
}

.gallery-close{
  position:absolute;
  top:26px;
  right:28px;
  width:52px;
  height:52px;
  border-radius:999px;
  border:1px solid rgba(245,245,245,.18);
  background:rgba(255,255,255,.04);
  color:#F5F5F5;
  font-size:2rem;
  line-height:1;
  cursor:pointer;
  z-index:3;
  transition:
    background .24s var(--ease),
    transform .24s var(--ease);
}

.gallery-close:hover{
  background:#FF3D3D;
  transform:scale(1.05);
}

.gallery-modal-nav{
  position:absolute;
  top:50%;
  width:58px;
  height:58px;
  border-radius:999px;
  border:1px solid rgba(245,245,245,.18);
  background:rgba(255,255,255,.05);
  color:#F5F5F5;
  font-size:2rem;
  cursor:pointer;
  z-index:3;
  transform:translateY(-50%);
  transition:
    background .24s var(--ease),
    transform .24s var(--ease),
    opacity .24s var(--ease);
  opacity:.78;
}

.gallery-modal-nav:hover{
  background:#FF3D3D;
  opacity:1;
}

.gallery-modal-nav.prev{
  left:28px;
}

.gallery-modal-nav.next{
  right:28px;
}

.gallery-counter{
  position:absolute;
  left:50%;
  bottom:28px;
  transform:translateX(-50%);
  font-family:"Courier New", monospace;
  color:rgba(245,245,245,.72);
  font-size:.88rem;
  letter-spacing:.12em;
}

@media (max-width:760px){
  .project-entry-plus{
    width:50px;
    height:50px;
    font-size:1.6rem;
  }

  .archive-trigger{
    min-height:62px;
    padding:0 16px;
    gap:12px;
  }

  .archive-title{
    font-size:.78rem;
    letter-spacing:.08em;
  }

  .archive-content > *{
    margin:16px;
  }

  .archive-cover-image,
  .gallery-open-card{
    width:calc(100% - 32px);
  }

  .archive-cover-image{
    aspect-ratio:4/3;
  }

  .gallery-modal{
    padding:72px 16px 70px;
  }

  .gallery-modal-nav{
    width:44px;
    height:44px;
    font-size:1.45rem;
  }

  .gallery-modal-nav.prev{
    left:12px;
  }

  .gallery-modal-nav.next{
    right:12px;
  }

  .gallery-close{
    top:16px;
    right:16px;
    width:44px;
    height:44px;
    font-size:1.6rem;
  }
}
.archive-gallery-button{
  cursor:pointer;
}

.archive-gallery-button .archive-trigger{
  pointer-events:none;
}

.archive-gallery-button:hover .archive-trigger{
  background:#0D0D0D;
  color:#F5F5F5;
}

.archive-gallery-button:hover .archive-icon{
  transform:translate(2px, -2px);
}

.archive-gallery-button .archive-icon{
  transition:transform .24s var(--ease);
}
/* =========================
   HOME PROJECT CAROUSEL ARROWS
   ========================= */

.home-carousel-arrow{
  position:absolute;
  top:50%;
  z-index:12;
  width:58px;
  height:58px;
  border-radius:999px;
  border:1px solid rgba(245,245,245,.18);
  background:rgba(13,13,13,.38);
  color:#F5F5F5;
  backdrop-filter:blur(12px);
  display:grid;
  place-items:center;
  font-size:2.2rem;
  line-height:1;
  cursor:pointer;
  opacity:.72;
  transform:translateY(-50%);
  transition:
    opacity .24s var(--ease),
    background .24s var(--ease),
    border-color .24s var(--ease),
    transform .24s var(--ease),
    color .24s var(--ease);
}

.home-carousel-arrow:hover{
  opacity:1;
  background:#FF3D3D;
  border-color:#FF3D3D;
  color:#0D0D0D;
  transform:translateY(-50%) scale(1.06);
}

.home-carousel-arrow-prev{
  left:clamp(10px, 3vw, 42px);
}

.home-carousel-arrow-next{
  right:clamp(10px, 3vw, 42px);
}

.home-carousel-arrow:active{
  transform:translateY(-50%) scale(.96);
}

@media (max-width:760px){
  .home-carousel-arrow{
    width:44px;
    height:44px;
    font-size:1.65rem;
    opacity:.82;
  }

  .home-carousel-arrow-prev{
    left:8px;
  }

  .home-carousel-arrow-next{
    right:8px;
  }
}
.home-carousel-arrow{
  pointer-events:auto;
}

.carousel-stage{
  position:relative;
}

.carousel-track{
  pointer-events:auto;
}

.home-carousel-arrow{
  z-index:50;
}
/* =========================
   HOME PROJECTS CTA
   ========================= */

.projects-actions{
  display:flex;
  justify-content:center;
  margin-top:48px;
}

.projects-cta-large{
  position:relative;
  min-height:76px;
  padding:0 34px 0 38px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:20px;
  overflow:hidden;
  background:#F5F5F5;
  color:#0D0D0D;
  border:1px solid rgba(245,245,245,.16);
  font-size:clamp(1.05rem, 1.6vw, 1.35rem);
  font-weight:650;
  letter-spacing:-.04em;
  box-shadow:
    0 18px 50px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,255,255,.04) inset;
  transition:
    transform .28s var(--ease),
    box-shadow .28s var(--ease),
    background .28s var(--ease),
    color .28s var(--ease);
}

.projects-cta-large::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 50%, rgba(255,61,61,.22), transparent 32%),
    linear-gradient(120deg, transparent 0%, rgba(255,255,255,.34) 45%, transparent 70%);
  transform:translateX(-120%);
  transition:transform .7s var(--ease);
  pointer-events:none;
}

.projects-cta-large:hover{
  transform:translateY(-4px) scale(1.015);
  background:#FF3D3D;
  color:#0D0D0D;
  box-shadow:
    0 26px 70px rgba(255,61,61,.22),
    0 0 0 1px rgba(255,61,61,.4) inset;
}

.projects-cta-large:hover::before{
  transform:translateX(120%);
}

.projects-cta-large span{
  position:relative;
  z-index:1;
}

.projects-cta-arrow{
  width:44px;
  height:44px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#0D0D0D;
  color:#F5F5F5;
  font-size:1.15rem;
  transition:
    transform .28s var(--ease),
    background .28s var(--ease),
    color .28s var(--ease);
}

.projects-cta-large:hover .projects-cta-arrow{
  transform:translate(4px, -4px);
  background:#F5F5F5;
  color:#0D0D0D;
}

@media (max-width:760px){
  .projects-cta-large{
    width:100%;
    min-height:68px;
    justify-content:space-between;
    padding:0 22px 0 26px;
  }

  .projects-cta-arrow{
    width:38px;
    height:38px;
  }
}


.gallery-modal-video{
  display:none;
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  box-shadow:0 30px 90px rgba(0,0,0,.45);
  background:#000;
  border-radius:14px;
}

.gallery-modal-image{
  display:block;
}

.gallery-modal.show-video .gallery-modal-image{
  display:none;
}

.gallery-modal.show-video .gallery-modal-video{
  display:block;
}