/* ==========================================================================
   LIHAZ.AI — premium "instrument-grade" design system
   Palette   : graphite obsidian canvas, brushed brass + deep emerald signal
   Type      : Fraunces (display, editorial serif) · Inter (body) · JetBrains Mono (data)
   Signature : left-edge brass "signal rail" scroll trace + engraved ID card
   ========================================================================== */

:root{
  /* -- surface --------------------------------------------------------- */
  --void:      #0a0b0d;
  --void-alt:  #0d0f12;
  --surface:   #15181d;
  --surface-2: #1c2027;
  --glass:     rgba(255,255,255,0.035);
  --glass-strong: rgba(255,255,255,0.065);
  --line:      rgba(212,169,98,0.16);
  --line-soft: rgba(255,255,255,0.055);

  /* -- ink --------------------------------------------------------------*/
  --ink:    #f6f3ec;
  --muted:  #9a9fa8;
  --muted-2:#5f6570;

  /* -- signal (brass + emerald) ---------------------------------------- */
  --violet:   #c9922f;   /* brass primary */
  --violet-2: #a97a24;   /* brass deep */
  --cyan:     #2bb695;   /* emerald secondary */
  --pink:     #c97b5a;   /* copper spark */
  --gold:     #f0c988;   /* bright brass highlight */

  --violet-rgb: 201,146,47;
  --cyan-rgb:   43,182,149;
  --pink-rgb:   201,123,90;
  --gold-rgb:   240,201,136;

  --grad-signal: linear-gradient(120deg, var(--violet) 0%, var(--cyan) 100%);
  --grad-signal-soft: linear-gradient(120deg, rgba(201,146,47,.16), rgba(43,182,149,.12));
  --grad-foil: linear-gradient(115deg, #a97a24 0%, #f0c988 28%, #c9922f 50%, #f0c988 72%, #a97a24 100%);

  --radius-xl: 28px;
  --radius-lg: 20px;
  --radius-md: 14px;
  --radius-sm: 10px;

  --shadow-lift: 0 30px 70px rgba(0,0,0,.5);
  --shadow-soft: 0 18px 40px rgba(0,0,0,.36);

  --maxw: 1220px;
  --ease: cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
::selection{background:var(--violet); color:#0a0b0d;}

body{
  background:
    radial-gradient(circle at 12% 8%, rgba(201,146,47,.13), transparent 30%),
    radial-gradient(circle at 88% 14%, rgba(43,182,149,.10), transparent 30%),
    radial-gradient(circle at 78% 82%, rgba(201,123,90,.08), transparent 32%),
    linear-gradient(180deg, var(--void) 0%, var(--void-alt) 45%, var(--void) 100%);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.mono{font-family:'JetBrains Mono',monospace;}
.display{font-family:'Fraunces',serif;}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px; position:relative; z-index:1;}
section{position:relative; padding:132px 0;}
section.alt{background:linear-gradient(180deg, transparent, rgba(201,146,47,.032) 40%, transparent);}
@media(max-width:720px){section{padding:88px 0;} .wrap{padding:0 22px;}}

/* ---------------------------------------------------------------------
   signature element: left-edge brass signal rail (scroll progress)
--------------------------------------------------------------------- */
.signal-rail{
  position:fixed; left:0; top:0; bottom:0; width:3px; z-index:150;
  display:flex; align-items:stretch;
}
.signal-track{
  position:relative; width:100%; height:100%;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.06));
}
.signal-fill{
  position:absolute; top:0; left:0; width:100%; height:0%;
  background:linear-gradient(180deg, var(--violet), var(--cyan));
  box-shadow:0 0 18px rgba(201,146,47,.7), 0 0 30px rgba(43,182,149,.35);
  transition:height .08s linear;
}
@media(max-width:720px){.signal-rail{display:none;}}

/* neural background canvas */
#netbg{position:fixed; inset:0; width:100%; height:100%; z-index:0; opacity:.45; pointer-events:none;}

/* ---------------------------------------------------------------------
   header
--------------------------------------------------------------------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  background:linear-gradient(180deg, rgba(10,11,13,.8), rgba(10,11,13,.42));
  border-bottom:1px solid var(--line-soft);
}
nav.wrap{display:flex; align-items:center; justify-content:space-between; height:84px;}
.brand{display:flex; align-items:center; gap:13px; min-width:0;}
.mark{
  width:44px; height:44px; border-radius:13px; overflow:hidden; flex-shrink:0;
  border:1px solid var(--line);
  background:linear-gradient(135deg, var(--surface), var(--surface-2));
  box-shadow:0 10px 24px rgba(0,0,0,.4);
}
.mark img{width:100%; height:100%; object-fit:cover;}
.brandtext{font-family:'Fraunces',serif; font-weight:600; font-size:1.1rem; letter-spacing:.01em;}
.brandsuffix{
  background:var(--grad-signal); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.navlinks{display:flex; gap:30px; font-size:.86rem; color:var(--muted);}
.navlinks a{position:relative; transition:color .2s; padding:4px 0;}
.navlinks a:hover{color:var(--ink);}
.navlinks a::after{content:''; position:absolute; left:0; bottom:-4px; width:0; height:1px; background:var(--grad-signal); transition:width .28s var(--ease);}
.navlinks a:hover::after{width:100%;}
.navright{display:flex; align-items:center; gap:16px;}
.btn-nav{padding:10px 20px; min-height:auto; font-size:.82rem;}
@media(max-width:960px){.btn-nav{display:none;}}

.burger{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:40px; height:40px; border-radius:10px; border:1px solid var(--line);
  background:var(--glass); cursor:pointer;
}
.burger span{display:block; width:18px; height:1.5px; margin:0 auto; background:var(--ink); transition:transform .25s, opacity .25s;}
.burger.on span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
.burger.on span:nth-child(2){opacity:0;}
.burger.on span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}
@media(max-width:960px){.navlinks{display:none;} .burger{display:flex;}}

.mobile-menu{
  position:fixed; inset:0; top:84px; z-index:99; background:var(--void);
  padding:34px; display:flex; flex-direction:column;
  transform:translateY(-12px); opacity:0; pointer-events:none; transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.mobile-menu.open{opacity:1; transform:translateY(0); pointer-events:auto;}
.mobile-menu-inner{display:flex; flex-direction:column; gap:24px; font-family:'Fraunces',serif; font-size:1.5rem;}
.mobile-menu-inner a{color:var(--muted); transition:color .2s;}
.mobile-menu-inner a:hover{color:var(--ink);}

/* ---------------------------------------------------------------------
   buttons — glossy metallic with a light-sweep on hover
--------------------------------------------------------------------- */
.btn{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; gap:8px;
  min-height:50px; padding:0 26px; border-radius:100px; font-size:.86rem; font-weight:700;
  cursor:pointer; border:1px solid transparent; transition:transform .28s var(--ease), box-shadow .28s var(--ease), border-color .25s;
  font-family:'Inter',sans-serif;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--grad-signal); color:#0a0b0d; box-shadow:0 10px 34px rgba(201,146,47,.32);}
.btn-primary:hover{box-shadow:0 16px 46px rgba(43,182,149,.4);}
.btn-primary .arrow{transition:transform .25s var(--ease);}
.btn-primary:hover .arrow{transform:translateX(4px);}
.btn-primary::before{
  content:''; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-20deg); transition:left .6s var(--ease);
}
.btn-primary:hover::before{left:130%;}
.btn-ghost{background:var(--glass); color:var(--ink); border-color:var(--line);}
.btn-ghost:hover{border-color:var(--cyan); color:var(--cyan);}

/* ---------------------------------------------------------------------
   hero
--------------------------------------------------------------------- */
.hero{min-height:100vh; display:flex; flex-direction:column; justify-content:center; padding-top:110px; position:relative; z-index:1;}
.eyebrow{
  display:inline-flex; align-items:center; gap:9px; padding:8px 16px; border-radius:100px;
  border:1px solid rgba(43,182,149,.26); background:var(--glass); font-size:.75rem; color:var(--cyan);
  letter-spacing:.06em; text-transform:uppercase; margin-bottom:30px; font-family:'JetBrains Mono';
}
.eyebrow .ping{width:6px;height:6px;border-radius:50%;background:var(--cyan); box-shadow:0 0 10px var(--cyan); animation:pulse 1.8s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.25;}}

.hero h1{
  font-family:'Fraunces',serif; font-weight:600; font-optical-sizing:auto;
  font-size:clamp(2.7rem, 7vw, 5.5rem); line-height:1.03; letter-spacing:-.02em;
  margin-bottom:24px;
}
.hero h1 .grad{font-style:italic; font-weight:500; background:linear-gradient(120deg,var(--violet) 10%, var(--cyan) 60%, var(--pink) 100%); -webkit-background-clip:text; background-clip:text; color:transparent;}

.sub{font-size:clamp(1.05rem,2vw,1.35rem); color:var(--ink); font-family:'Fraunces',serif; font-weight:500;}
.typing-line{display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-bottom:6px;}
.typing-prefix{color:var(--muted); font-weight:400; font-family:'Inter';}
.typing-text{background:linear-gradient(120deg,var(--violet),var(--cyan)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.typing-cursor{color:var(--cyan); animation:blink 1s step-end infinite; margin-left:-2px;}
@keyframes blink{50%{opacity:0;}}

.sub-body{font-size:1.05rem; color:var(--muted); max-width:600px; line-height:1.75; margin-bottom:14px;}
.uni{font-size:.92rem; color:var(--muted-2); margin-bottom:32px;}
.uni b{color:var(--ink); font-weight:600;}

.herobtns{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:30px;}

.heroMeta{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:8px; max-width:760px;}
.metaCard{
  padding:18px 20px; border-radius:18px;
  background:var(--glass); border:1px solid var(--line);
  transition:border-color .3s, transform .3s;
}
.metaCard:hover{border-color:rgba(201,146,47,.45); transform:translateY(-3px);}
.metaCard span{display:block; font-size:.68rem; color:var(--muted-2); text-transform:uppercase; letter-spacing:.09em; margin-bottom:7px; font-family:'JetBrains Mono';}
.metaCard strong{display:block; font-family:'Fraunces',serif; font-size:.95rem; font-weight:600; line-height:1.35;}

.heroGrid{display:grid; grid-template-columns:1.12fr .82fr; gap:60px; align-items:center;}
@media(max-width:960px){.heroGrid{grid-template-columns:1fr;}}

/* premium "engraved" ID card */
.heroVisual{position:relative; padding:16px;}
.idcard{
  background:linear-gradient(180deg, var(--surface), var(--surface-2));
  border:1px solid var(--line); border-radius:28px; padding:32px;
  position:relative; overflow:hidden; box-shadow:var(--shadow-lift);
}
.idcard::after{
  content:''; position:absolute; inset:0; border-radius:28px; padding:1px;
  background:var(--grad-foil); opacity:.35; pointer-events:none;
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.idcard-glow{
  position:absolute; top:-40%; left:-20%; width:150%; height:150%;
  background:radial-gradient(circle at 30% 20%, rgba(201,146,47,.20), transparent 55%),
             radial-gradient(circle at 80% 80%, rgba(43,182,149,.13), transparent 50%);
  pointer-events:none;
}
.idcard-shine{
  position:absolute; top:0; left:-140%; width:60%; height:100%;
  background:linear-gradient(115deg, transparent, rgba(255,255,255,.06), transparent);
  transform:skewX(-18deg); animation:idshine 7s ease-in-out infinite;
  pointer-events:none;
}
@keyframes idshine{0%,60%{left:-140%;} 100%{left:160%;}}
.photo{
  position:relative; width:100%; aspect-ratio:4/5; border-radius:22px; overflow:hidden; margin-bottom:22px;
  border:1px solid var(--line); background:var(--surface-2); box-shadow:0 24px 50px rgba(0,0,0,.45);
}
.photo img{width:100%; height:100%; object-fit:cover; object-position:center 20%;}
.idcard h3{font-family:'Fraunces',serif; font-weight:600; font-size:1.4rem; margin-bottom:4px; position:relative;}
.idcard .role{color:var(--cyan); font-size:.85rem; margin-bottom:24px; font-family:'JetBrains Mono'; position:relative;}
.idrow{display:flex; justify-content:space-between; gap:16px; padding:13px 0; border-top:1px solid var(--line-soft); font-size:.82rem; position:relative;}
.idrow span:first-child{color:var(--muted-2);}
.idrow span:last-child{color:var(--ink); text-align:right; font-family:'JetBrains Mono'; font-size:.76rem;}

.scroll-cue{
  position:absolute; bottom:36px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:10px;
  font-family:'JetBrains Mono'; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2);
}
.scroll-cue span{width:1px; height:34px; background:linear-gradient(180deg, var(--cyan), transparent); animation:scrolldrop 1.8s infinite;}
@keyframes scrolldrop{0%{transform:scaleY(0); transform-origin:top;} 50%{transform:scaleY(1); transform-origin:top;} 51%{transform-origin:bottom;} 100%{transform:scaleY(0); transform-origin:bottom;}}
@media(max-width:720px){.scroll-cue{display:none;}}

/* ---------------------------------------------------------------------
   section headers
--------------------------------------------------------------------- */
.kicker{font-family:'JetBrains Mono'; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--cyan); margin-bottom:16px; display:flex; align-items:center; gap:12px;}
.kicker::before{content:''; width:30px; height:1px; background:linear-gradient(90deg, var(--cyan), transparent);}
h2.sectitle{font-family:'Fraunces',serif; font-weight:600; font-size:clamp(2rem,4vw,2.9rem); letter-spacing:-.015em; margin-bottom:20px;}
.secintro{color:var(--muted); max-width:620px; font-size:1.02rem; line-height:1.75;}

/* ---------------------------------------------------------------------
   about
--------------------------------------------------------------------- */
.aboutGrid{display:grid; grid-template-columns:.9fr 1.1fr; gap:74px; align-items:start; margin-top:58px;}
@media(max-width:900px){.aboutGrid{grid-template-columns:1fr; gap:40px;}}
.aboutGrid p{color:var(--muted); line-height:1.85; margin-bottom:20px; font-size:1.02rem;}
.statgrid{display:grid; grid-template-columns:repeat(2,1fr); gap:18px;}
.statcard{
  background:var(--glass); border:1px solid var(--line); border-radius:20px; padding:26px;
  transition:transform .3s var(--ease), border-color .3s;
}
.statcard:hover{transform:translateY(-4px); border-color:rgba(43,182,149,.4);}
.statcard .num{font-family:'Fraunces',serif; font-size:2.35rem; font-weight:600; background:var(--grad-signal); -webkit-background-clip:text; background-clip:text; color:transparent;}
.statcard .lbl{font-size:.8rem; color:var(--muted-2); margin-top:8px;}
.dashgrid{grid-template-columns:repeat(4,1fr); margin-top:54px;}
@media(max-width:760px){.dashgrid{grid-template-columns:repeat(2,1fr);}}

/* ---------------------------------------------------------------------
   timeline
--------------------------------------------------------------------- */
.timeline{margin-top:58px; position:relative; padding-left:36px; border-left:1px solid var(--line);}
.titem{position:relative; padding-bottom:50px;}
.titem:last-child{padding-bottom:0;}
.titem::before{
  content:''; position:absolute; left:-42px; top:4px; width:13px; height:13px; border-radius:50%;
  background:var(--void); border:2px solid var(--violet); box-shadow:0 0 0 4px rgba(201,146,47,.18);
}
.titem.active::before{border-color:var(--cyan); box-shadow:0 0 0 4px rgba(43,182,149,.22), 0 0 16px var(--cyan);}
.titem .tdate{font-family:'JetBrains Mono'; font-size:.76rem; color:var(--cyan); margin-bottom:9px; letter-spacing:.04em;}
.titem h4{font-family:'Fraunces',serif; font-weight:600; font-size:1.28rem; margin-bottom:7px;}
.titem .tsub{color:var(--muted); font-size:.92rem; margin-bottom:12px;}
.tbadge{display:inline-block; padding:6px 14px; border-radius:100px; background:var(--glass); border:1px solid var(--line); font-size:.72rem; color:var(--muted); margin-right:8px; margin-top:6px; font-family:'JetBrains Mono';}
.tnote{margin-top:38px; color:var(--muted-2); font-size:.85rem;}
.tnote a{color:var(--cyan); border-bottom:1px solid rgba(43,182,149,.4);}

/* ---------------------------------------------------------------------
   skills
--------------------------------------------------------------------- */
.skillGrid{display:grid; grid-template-columns:repeat(2,1fr); gap:64px; margin-top:58px;}
@media(max-width:900px){.skillGrid{grid-template-columns:1fr; gap:38px;}}
.skillcol h4{font-family:'Fraunces',serif; font-weight:600; font-size:.95rem; text-transform:uppercase; letter-spacing:.07em; color:var(--muted-2); margin-bottom:28px;}
.skillcol .tagheading{margin-top:40px;}
.skillrow{margin-bottom:22px;}
.skillrow .top{display:flex; justify-content:space-between; font-size:.9rem; margin-bottom:9px;}
.skillrow .top span:last-child{color:var(--cyan); font-family:'JetBrains Mono'; font-size:.78rem;}
.track{height:7px; border-radius:999px; background:var(--surface-2); overflow:hidden;}
.fill{height:100%; border-radius:999px; background:var(--grad-signal); width:0; transition:width 1.3s var(--ease); box-shadow:0 0 16px rgba(43,182,149,.3);}
.tagcloud{display:flex; flex-wrap:wrap; gap:11px;}
.tag{padding:10px 17px; border-radius:100px; background:var(--glass); border:1px solid var(--line); font-size:.85rem; color:var(--muted); transition:all .25s var(--ease);}
.tag:hover{border-color:var(--cyan); color:var(--cyan); transform:translateY(-2px);}
.tag-accent{border-color:rgba(201,146,47,.35); color:var(--ink);}

/* ---------------------------------------------------------------------
   certificates
--------------------------------------------------------------------- */
.certToolbar{display:flex; justify-content:space-between; align-items:center; gap:20px; margin:52px 0 34px; flex-wrap:wrap;}
.searchbox{flex:1; min-width:220px; position:relative;}
.searchbox input{
  width:100%; padding:14px 18px 14px 44px; border-radius:100px; border:1px solid var(--line);
  background:var(--glass); color:var(--ink); font-family:'Inter'; font-size:.92rem; outline:none; transition:border-color .25s;
}
.searchbox input:focus{border-color:var(--cyan);}
.searchbox::before{content:'⌕'; position:absolute; left:18px; top:50%; transform:translateY(-50%); color:var(--muted-2); font-size:1.15rem;}
.filters{display:flex; gap:9px; flex-wrap:wrap;}
.chip{padding:9px 17px; border-radius:100px; border:1px solid var(--line); background:var(--glass); color:var(--muted); font-size:.78rem; cursor:pointer; transition:all .2s; white-space:nowrap;}
.chip:hover{color:var(--ink); border-color:var(--muted-2);}
.chip.on{background:var(--grad-signal); color:#0a0b0d; border-color:transparent; font-weight:700;}

.certGrid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media(max-width:960px){.certGrid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.certGrid{grid-template-columns:1fr;}}
.certcard{
  background:linear-gradient(180deg, var(--surface), var(--surface-2)); border:1px solid var(--line); border-radius:24px; overflow:hidden;
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;
  box-shadow:var(--shadow-soft);
}
.certcard:hover{transform:translateY(-9px); border-color:rgba(201,146,47,.45); box-shadow:0 26px 60px rgba(201,146,47,.16);}
.certthumb{aspect-ratio:16/11; background:var(--surface-2); position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center;}
.certthumb img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease);}
.certcard:hover .certthumb img{transform:scale(1.06);}
.certthumb .noimg{font-family:'Fraunces',serif; font-size:.9rem; color:var(--muted-2); text-align:center; padding:20px; background:var(--grad-signal-soft); width:100%; height:100%; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:12px;}
.certthumb .noimg .glyph{font-size:1.7rem;}
.certcat{position:absolute; top:13px; left:13px; padding:6px 13px; border-radius:100px; background:rgba(10,11,13,.75); backdrop-filter:blur(6px); font-size:.66rem; color:var(--cyan); border:1px solid rgba(255,255,255,.1); font-family:'JetBrains Mono';}
.certbody{padding:22px;}
.certbody h4{font-family:'Fraunces',serif; font-weight:600; font-size:1.06rem; margin-bottom:7px; line-height:1.35;}
.certbody .org{color:var(--muted); font-size:.85rem; margin-bottom:4px;}
.certbody .date{color:var(--muted-2); font-size:.75rem; font-family:'JetBrains Mono'; margin-bottom:18px;}
.certactions{display:flex; gap:10px;}
.certactions a{flex:1; text-align:center; padding:10px; border-radius:10px; font-size:.78rem; font-weight:600; border:1px solid var(--line); color:var(--muted); transition:all .22s;}
.certactions a.view:hover{border-color:var(--violet); color:var(--violet);}
.certactions a.dl:hover{border-color:var(--cyan); color:var(--cyan);}
.emptystate{grid-column:1/-1; text-align:center; padding:70px 20px; color:var(--muted-2);}

/* ---------------------------------------------------------------------
   projects
--------------------------------------------------------------------- */
.projGrid{display:grid; grid-template-columns:repeat(2,1fr); gap:26px; margin-top:52px;}
@media(max-width:800px){.projGrid{grid-template-columns:1fr;}}
.projcard{background:linear-gradient(180deg, var(--surface), var(--surface-2)); border:1px solid var(--line); border-radius:24px; padding:32px; transition:border-color .3s, transform .3s; box-shadow:var(--shadow-soft);}
.projcard:hover{transform:translateY(-6px); border-color:rgba(201,123,90,.4);}
.projcard .pnum{font-family:'JetBrains Mono'; font-size:.75rem; color:var(--cyan); margin-bottom:18px;}
.projcard h4{font-family:'Fraunces',serif; font-weight:600; font-size:1.32rem; margin-bottom:11px;}
.projcard p{color:var(--muted); font-size:.92rem; line-height:1.7; margin-bottom:20px;}
.projtech{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px;}
.projtech span{font-family:'JetBrains Mono'; font-size:.7rem; padding:5px 11px; border-radius:6px; background:var(--surface-2); color:var(--muted);}
.projlinks{display:flex; gap:18px; font-size:.82rem;}
.projlinks a{color:var(--muted); border-bottom:1px solid transparent; transition:.2s;}
.projlinks a:hover{color:var(--cyan); border-color:var(--cyan);}
.addcard{
  border:1.5px dashed var(--line); border-radius:24px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:44px; color:var(--muted-2); text-align:center; gap:12px; font-size:.88rem;
}
.addcard .plus{font-size:2rem; color:var(--muted-2); font-family:'Fraunces',serif;}

/* ---------------------------------------------------------------------
   achievements
--------------------------------------------------------------------- */
.achWrap{display:flex; gap:20px; overflow-x:auto; margin-top:54px; padding-bottom:14px; scrollbar-width:thin;}
.achcard{
  min-width:240px; background:linear-gradient(180deg, var(--surface), var(--surface-2)); border:1px solid var(--line); border-radius:20px; padding:28px; flex-shrink:0;
  box-shadow:var(--shadow-soft); transition:transform .3s, border-color .3s;
}
.achcard:hover{transform:translateY(-5px); border-color:rgba(240,201,136,.4);}
.achcard .aicon{width:44px; height:44px; border-radius:12px; background:var(--grad-signal); display:flex; align-items:center; justify-content:center; margin-bottom:18px; font-size:1.15rem;}
.achcard h5{font-family:'Fraunces',serif; font-weight:600; font-size:1.02rem; margin-bottom:7px;}
.achcard p{font-size:.8rem; color:var(--muted-2);}

/* ---------------------------------------------------------------------
   social — glass cards with brand-tinted glow on hover
--------------------------------------------------------------------- */
.socialGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:22px;
  margin-top:52px;
}
.social-card{
  position:relative;
  background:var(--glass);
  border:1px solid var(--line);
  border-radius:22px;
  padding:24px;
  display:flex;
  align-items:center;
  gap:18px;
  text-decoration:none;
  color:var(--ink);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  transition:all .45s var(--ease);
  overflow:hidden;
}
.social-card::before{
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(135deg, var(--card-tint, rgba(201,146,47,.12)), transparent 65%);
  opacity:0; transition:opacity .4s ease;
}
.social-card:hover{
  transform:translateY(-7px);
  border-color:var(--card-color, var(--cyan));
  box-shadow:0 22px 46px rgba(0,0,0,.35), 0 0 24px var(--card-tint, rgba(43,182,149,.2));
}
.social-card:hover::before{opacity:1;}
.social-card-icon{
  width:52px; height:52px; border-radius:16px;
  background:var(--surface); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; color:var(--card-color, var(--cyan));
  position:relative; z-index:2; flex-shrink:0;
  transition:all .4s var(--ease);
}
.social-card:hover .social-card-icon{
  background:var(--card-color, var(--cyan)); color:#0a0b0d;
  transform:scale(1.06) rotate(-6deg);
  box-shadow:0 0 18px var(--card-tint, rgba(43,182,149,.4));
}
.social-card-info{display:flex; flex-direction:column; gap:4px; position:relative; z-index:2;}
.social-card-name{font-family:'Fraunces',serif; font-size:1.06rem; font-weight:600; letter-spacing:-.01em;}
.social-card-handle{font-size:.82rem; color:var(--muted-2); font-family:'JetBrains Mono';}
.social-card-arrow{margin-left:auto; color:var(--muted-2); font-size:1rem; position:relative; z-index:2; transition:transform .3s var(--ease), color .3s;}
.social-card:hover .social-card-arrow{transform:translate(4px,-4px); color:var(--card-color, var(--cyan));}

/* ---------------------------------------------------------------------
   contact
--------------------------------------------------------------------- */
.contactGrid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:80px;
  margin-top:60px;
  align-items:start;
}
@media(max-width:980px){.contactGrid{grid-template-columns:1fr; gap:52px;}}

.contactInfoWrapper{display:flex; flex-direction:column; gap:8px;}
.cinfo-item{display:flex; gap:22px; padding:26px 0; border-top:1px solid var(--line-soft); align-items:center;}
.cinfo-item:first-child{border-top:none; padding-top:0;}
.cinfo-item .ci{
  width:50px; height:50px; border-radius:16px;
  background:var(--glass-strong); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; font-size:1.25rem; color:var(--violet);
  transition:all .4s var(--ease);
}
.cinfo-item:hover .ci{
  border-color:var(--cyan); color:#0a0b0d; background:var(--cyan);
  box-shadow:0 0 15px rgba(43,182,149,.4); transform:translateY(-2px);
}
.cinfo-item .ctext .clabel{font-size:.74rem; color:var(--muted-2); text-transform:uppercase; letter-spacing:.09em; margin-bottom:6px; font-family:'JetBrains Mono';}
.cinfo-item .ctext .cval{font-size:1.05rem; font-weight:500; color:var(--ink);}
.contact-link{text-decoration:none; transition:color .25s ease; display:inline-block;}
.contact-link:hover{color:var(--cyan);}

.contact-form{
  background:linear-gradient(180deg, rgba(255,255,255,.028), rgba(255,255,255,.008));
  border:1px solid var(--line);
  border-radius:32px; padding:48px;
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
  box-shadow:0 30px 60px rgba(0,0,0,.3);
}
@media(max-width:550px){.contact-form{padding:28px;}}

.formgrid{display:grid; grid-template-columns:1fr 1fr; gap:28px;}
@media(max-width:650px){.formgrid{grid-template-columns:1fr;} .formgrid .form-group:not(.full){grid-column:auto;}}
.formgrid .full{grid-column:1/-1;}
.form-group label{font-size:.76rem; color:var(--muted-2); display:block; margin-bottom:12px; font-family:'JetBrains Mono'; text-transform:uppercase; letter-spacing:.06em;}
.formgrid input, .formgrid textarea{
  width:100%; padding:18px 20px; border-radius:16px; border:1px solid var(--line);
  background:rgba(0,0,0,.22); color:var(--ink); font-family:'Inter',sans-serif; font-size:.95rem;
  outline:none; resize:vertical; transition:all .3s var(--ease);
}
.formgrid input:focus, .formgrid textarea:focus{
  border-color:var(--cyan); box-shadow:0 0 0 4px rgba(43,182,149,.15); background:rgba(0,0,0,.35);
}

.btn-premium{
  margin-top:32px; width:100%; padding:18px 28px; border-radius:16px;
  font-weight:600; font-size:1rem; display:inline-flex; align-items:center; justify-content:center; gap:12px;
  cursor:pointer; background:var(--grad-signal); color:#0a0b0d; border:1px solid transparent;
  transition:all .4s var(--ease);
}
.btn-premium i{font-size:.9rem; transition:transform .3s ease;}
.btn-premium:hover{
  background:transparent; color:var(--cyan); border-color:var(--cyan);
  box-shadow:0 12px 30px rgba(43,182,149,.2), 0 0 15px rgba(43,182,149,.15); transform:translateY(-3px);
}
.btn-premium:hover i{transform:translateX(4px) translateY(-2px);}

/* ---------------------------------------------------------------------
   footer
--------------------------------------------------------------------- */
footer{border-top:1px solid var(--line-soft); padding:56px 0 34px; position:relative; z-index:1;}
.footGrid{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:22px;}
.footlinks{display:flex; gap:26px; font-size:.85rem; color:var(--muted);}
.footlinks a:hover{color:var(--cyan);}
.backtop{width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:var(--glass); display:flex; align-items:center; justify-content:center; cursor:pointer; transition:border-color .25s, transform .25s;}
.backtop:hover{border-color:var(--cyan); color:var(--cyan); transform:translateY(-3px);}
.copyright{font-size:.78rem; color:var(--muted-2); margin-top:28px; text-align:center;}

/* ---------------------------------------------------------------------
   ask-about-lihaz widget
--------------------------------------------------------------------- */
.faqBtn{
  position:fixed; bottom:26px; right:26px; z-index:120;
  width:60px; height:60px; border-radius:50%; border:none; cursor:pointer;
  background:var(--grad-signal); color:#0a0b0d; font-size:1.3rem;
  box-shadow:0 14px 34px rgba(201,146,47,.42); display:flex; align-items:center; justify-content:center;
  transition:transform .28s var(--ease);
}
.faqBtn:hover{transform:scale(1.08) rotate(-6deg);}
.faqPanel{
  position:fixed; bottom:98px; right:26px; z-index:120; width:340px; max-width:calc(100vw - 40px);
  background:var(--surface); border:1px solid var(--line); border-radius:22px; box-shadow:0 34px 80px rgba(0,0,0,.55);
  display:flex; flex-direction:column; max-height:70vh; overflow:hidden;
  opacity:0; transform:translateY(16px) scale(.97); pointer-events:none; transition:opacity .28s var(--ease), transform .28s var(--ease);
}
.faqPanel.open{opacity:1; transform:translateY(0) scale(1); pointer-events:auto;}
.faqHead{padding:18px 20px; border-bottom:1px solid var(--line-soft); font-family:'Fraunces',serif; font-weight:600; display:flex; justify-content:space-between; align-items:center;}
.faqHead .sub{display:block; font-size:.72rem; color:var(--muted-2); font-weight:400; margin-top:3px; font-family:'Inter';}
.faqClose{background:none; border:none; color:var(--muted); font-size:1.1rem; cursor:pointer;}
.faqBody{padding:16px 20px; overflow-y:auto; flex:1;}
.faqQ{
  display:block; width:100%; text-align:left; padding:12px 14px; margin-bottom:9px; border-radius:12px;
  background:var(--glass); border:1px solid var(--line); color:var(--ink); font-size:.82rem; cursor:pointer; transition:border-color .2s;
}
.faqQ:hover{border-color:var(--cyan);}
.faqA{font-size:.85rem; color:var(--muted); line-height:1.65; padding:12px 4px 20px; border-bottom:1px solid var(--line-soft); margin-bottom:16px;}
.faqNote{font-size:.68rem; color:var(--muted-2); padding:0 20px 16px;}

/* ---------------------------------------------------------------------
   reveal-on-scroll
--------------------------------------------------------------------- */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .9s var(--ease), transform .9s var(--ease);}
.reveal.show{opacity:1; transform:none;}

@media(prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}