:root{
  --paper:#F4F1EA; --paper2:#EBE6DA; --paper3:#e2dccb;
  --ink:#1B1A17; --ink-soft:#4a463d; --ink-faint:#7a7568;
  --green:#143A2A; --green-2:#1d5440; --gold:#B8924A; --gold-2:#d4ad5e;
  --spray:#E6357A; --lime:#7Bd14b;
  --serif:'Fraunces',serif; --body:'EB Garamond',serif; --tag:'Permanent Marker',cursive;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--paper); color:var(--ink); font-family:var(--body);
  font-size:18px; line-height:1.6; overflow-x:hidden;
}
@media(hover:hover) and (pointer:fine){ *{cursor:none !important;} }

.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");}

.cursor{position:fixed;top:0;left:0;width:16px;height:16px;border-radius:50%;background:var(--spray);
  pointer-events:none;z-index:100000;transform:translate(-50%,-50%);box-shadow:0 0 0 2px rgba(255,255,255,.7),0 1px 5px rgba(0,0,0,.45);
  transition:width .2s,height .2s,background .2s;will-change:transform;}
.cursor.big{width:44px;height:44px;background:rgba(230,53,122,.28);box-shadow:0 0 0 2px rgba(255,255,255,.6);}
@media(hover:none),(pointer:coarse){ .cursor{display:none;} }

a{color:inherit;text-decoration:none;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;position:relative;z-index:2;}

/* ===== Top bar ===== */
.topbar{position:sticky;top:0;z-index:50;background:rgba(244,241,234,.82);backdrop-filter:blur(8px);border-bottom:1px solid rgba(27,26,23,.1);}
.topbar-in{display:flex;justify-content:space-between;align-items:center;padding:16px 32px;}
.crest{display:flex;align-items:center;gap:12px;}
.monogram{width:44px;height:44px;border:1.5px solid var(--gold);border-radius:50%;display:grid;place-items:center;
  font-family:var(--serif);font-weight:600;color:var(--green);letter-spacing:1px;position:relative;}
.monogram::after{content:"";position:absolute;inset:4px;border:1px solid rgba(184,146,74,.4);border-radius:50%;}
.estab{font-family:var(--serif);font-size:.78rem;letter-spacing:3px;text-transform:uppercase;color:var(--ink-soft);}
.nav{display:flex;gap:26px;font-family:var(--serif);font-size:.82rem;letter-spacing:1.5px;text-transform:uppercase;align-items:center;}
.nav a{position:relative;padding:4px 0;}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--gold);transition:width .3s;}
.nav a:hover::after{width:100%;}
.nav .nav-cta{border:1.5px solid var(--ink);padding:8px 16px;border-radius:2px;}
.nav .nav-cta::after{display:none;}
.nav .nav-cta:hover{background:var(--ink);color:var(--paper);}
@media(max-width:760px){ .estab{display:none;} .nav{gap:14px;font-size:.7rem;} .nav a:not(.nav-cta){display:none;} }

/* ===== Hero ===== */
.hero{position:relative;padding:24px 0 50px;}
.hero-in{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:center;min-height:84vh;}
.eyebrow{font-family:var(--serif);text-transform:uppercase;letter-spacing:6px;font-size:.8rem;color:var(--gold);margin-bottom:18px;}
.name{font-family:var(--serif);font-weight:300;line-height:.9;letter-spacing:-2px;}
.name .l1{display:block;font-size:clamp(3rem,9vw,7rem);font-style:italic;}
.name .l2{display:block;font-size:clamp(3rem,9vw,7rem);font-weight:600;}
.spray-wrap{position:relative;display:inline-block;}
.spray-svg{position:absolute;left:-4%;bottom:6%;width:108%;height:60%;pointer-events:none;overflow:visible;}
.spray-svg path{fill:none;stroke:var(--spray);stroke-width:14;stroke-linecap:round;
  stroke-dasharray:1200;stroke-dashoffset:1200;filter:url(#rough);opacity:.85;}
.drip{position:absolute;width:7px;background:var(--spray);border-radius:0 0 6px 6px;opacity:.8;transform:scaleY(0);transform-origin:top;bottom:2%;}
.tagline{font-family:var(--body);font-style:italic;font-size:1.35rem;color:var(--ink-soft);margin:28px 0 18px;max-width:32ch;}
.role-tag{font-family:var(--tag);font-size:1.5rem;color:var(--green);transform:rotate(-3deg);display:inline-block;}
.role-tag .hl{background:linear-gradient(transparent 55%,var(--lime) 55%);padding:0 4px;}
.cta-row{display:flex;gap:18px;margin-top:32px;align-items:center;flex-wrap:wrap;}
.btn{font-family:var(--serif);text-transform:uppercase;letter-spacing:2px;font-size:.8rem;padding:14px 28px;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);transition:.25s;cursor:pointer;}
.btn:hover{background:transparent;color:var(--ink);}
.btn.ghost{background:transparent;color:var(--ink);}
.btn.ghost:hover{background:var(--gold);border-color:var(--gold);color:var(--paper);}

.hero-stats{display:flex;gap:40px;margin-top:44px;}
.hs{display:flex;flex-direction:column;}
.hs-num{font-family:var(--serif);font-size:2.6rem;font-weight:600;color:var(--green);line-height:1;}
.hs-num .plus{color:var(--spray);}
.hs-cap{font-family:var(--serif);text-transform:uppercase;letter-spacing:2px;font-size:.68rem;color:var(--ink-soft);margin-top:4px;}

.hero-frame{display:flex;justify-content:center;}
.frame{position:relative;width:100%;max-width:360px;aspect-ratio:3/4;border:10px solid transparent;
  background:linear-gradient(var(--paper2),var(--paper2)) padding-box,
    linear-gradient(135deg,var(--gold-2),var(--gold) 40%,#8a6d35 70%,var(--gold-2)) border-box;
  box-shadow:0 30px 70px rgba(27,26,23,.28);display:grid;place-items:center;overflow:hidden;}
.frame-initials{font-family:var(--serif);font-size:7rem;color:var(--green);font-weight:500;opacity:.9;}
.vandal{position:absolute;font-family:var(--tag);color:var(--spray);font-size:2.4rem;transform:rotate(-8deg);bottom:14%;left:-2%;text-shadow:1px 1px 0 rgba(0,0,0,.12);}
.vandal2{position:absolute;font-family:var(--tag);color:var(--green);font-size:1.3rem;top:8%;right:8%;transform:rotate(6deg);}
.plaque{position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);background:var(--green);color:var(--paper);
  font-family:var(--serif);font-size:.7rem;letter-spacing:3px;text-transform:uppercase;padding:6px 18px;white-space:nowrap;}
.scroll-hint{font-family:var(--serif);letter-spacing:3px;text-transform:uppercase;font-size:.7rem;color:var(--ink-faint);text-align:center;padding-bottom:10px;animation:bob 2s ease-in-out infinite;}
@keyframes bob{50%{transform:translateY(6px);}}

/* ===== Marquee ===== */
.marquee{border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);padding:14px 0;overflow:hidden;white-space:nowrap;background:var(--green);}
.marquee .track{display:inline-block;animation:scroll 24s linear infinite;}
.marquee span{font-family:var(--serif);font-style:italic;font-size:1.4rem;color:var(--paper);margin:0 28px;letter-spacing:1px;}
.marquee span b{font-family:var(--tag);font-style:normal;color:var(--lime);}
@keyframes scroll{to{transform:translateX(-50%);}}

/* ===== Sections ===== */
.section{padding:96px 0;}
.sec-head{display:flex;align-items:baseline;gap:18px;margin-bottom:48px;}
.sec-num{font-family:var(--tag);color:var(--spray);font-size:1.4rem;}
.sec-title{font-family:var(--serif);font-size:clamp(2rem,4vw,3rem);font-weight:400;font-style:italic;white-space:nowrap;}
.sec-line{flex:1;height:1.5px;background:var(--ink);opacity:.22;}
.sec-meta{font-family:var(--serif);font-size:.75rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold);white-space:nowrap;}

/* Despre */
.despre-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start;}
.lead{font-family:var(--serif);font-size:1.8rem;font-weight:300;line-height:1.35;}
.lead strong{font-weight:600;font-style:italic;color:var(--green);}
.despre-body p{margin-bottom:1rem;color:var(--ink-soft);}
.despre-body strong{color:var(--ink);}
.signed{font-size:1rem;}
.sig-tag{font-family:var(--tag);color:var(--spray);font-size:1.3rem;}
@media(max-width:760px){ .despre-grid{grid-template-columns:1fr;gap:24px;} .lead{font-size:1.5rem;} }

/* Proiecte */
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.card{background:var(--paper2);border:1.5px solid rgba(27,26,23,.14);overflow:hidden;display:flex;flex-direction:column;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s;position:relative;}
.card:hover{transform:translateY(-8px) rotate(-.5deg);box-shadow:0 24px 50px rgba(27,26,23,.2);border-color:var(--gold);}
.thumb{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--paper3);border-bottom:1.5px solid rgba(27,26,23,.14);}
.thumb img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .5s ease;}
.card:hover .thumb img{transform:scale(1.05);}
.thumb.noimg{display:flex;align-items:center;justify-content:center;font-family:var(--serif);color:var(--green);font-size:2.6rem;
  background:repeating-linear-gradient(45deg,var(--paper2) 0 12px,var(--paper3) 12px 24px);}
.cat-tag{position:absolute;top:10px;left:10px;background:rgba(20,58,42,.92);color:var(--paper);font-family:var(--serif);
  font-size:.65rem;letter-spacing:2px;text-transform:uppercase;padding:4px 9px;}
.card-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:.5rem;flex:1;}
.card-title{font-family:var(--serif);font-size:1.5rem;font-weight:500;}
.card-desc{font-size:.92rem;color:var(--ink-soft);flex:1;}
.tags{display:flex;flex-wrap:wrap;gap:.35rem;}
.tag{font-size:.68rem;color:var(--green);border:1px solid rgba(20,58,42,.3);background:rgba(20,58,42,.05);padding:.12rem .45rem;letter-spacing:.5px;}
.status{display:flex;align-items:center;gap:.5rem;font-size:.78rem;padding-top:.6rem;border-top:1px dashed rgba(27,26,23,.2);}
.led{width:9px;height:9px;border-radius:50%;background:var(--ink-faint);flex:none;}
.status.online .led{background:var(--lime);box-shadow:0 0 8px var(--lime);animation:pulse 1.6s ease-in-out infinite;}
.status.offline .led{background:var(--spray);box-shadow:0 0 8px rgba(230,53,122,.5);}
.status.private .led{background:var(--gold);box-shadow:0 0 8px rgba(184,146,74,.5);}
@keyframes pulse{50%{opacity:.4;}}
.status-label{font-family:var(--serif);font-weight:600;letter-spacing:1px;text-transform:uppercase;font-size:.7rem;}
.status.online .status-label{color:var(--green-2);}
.status.offline .status-label{color:var(--spray);}
.status.private .status-label{color:var(--gold);}
.uptime{color:var(--ink-faint);margin-left:auto;font-size:.72rem;}
.links{display:flex;gap:.9rem;margin-top:.3rem;font-family:var(--serif);font-size:.8rem;letter-spacing:1px;text-transform:uppercase;}
.links a{color:var(--green-2);border-bottom:1px solid transparent;}
.links a:hover{border-color:var(--gold);}
.links .disabled{color:var(--ink-faint);pointer-events:none;}
@media(max-width:860px){ .work-grid{grid-template-columns:1fr;} }

/* Competențe */
.skills-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:center;}
.radar-card{background:var(--paper2);border:1.5px solid rgba(27,26,23,.14);padding:18px;display:grid;place-items:center;}
.radar{width:100%;max-width:340px;}
.radar .ring{fill:none;stroke:rgba(27,26,23,.16);}
.radar .axis{stroke:rgba(27,26,23,.18);}
.radar .area{fill:rgba(230,53,122,.18);stroke:var(--spray);stroke-width:2.5;
  opacity:0;transform:scale(.2);transform-origin:center;transition:opacity .9s ease,transform 1s cubic-bezier(.2,.8,.2,1);}
.radar .area.in{opacity:1;transform:scale(1);}
.radar .pt{fill:var(--green);}
.radar .lab{font-family:var(--serif);font-size:11px;fill:var(--ink-soft);}
.bars{display:flex;flex-direction:column;gap:18px;}
.bar-row .lbl{display:flex;justify-content:space-between;font-family:var(--serif);font-size:.95rem;margin-bottom:6px;letter-spacing:.5px;}
.bar-track{height:10px;background:var(--paper2);border:1px solid rgba(27,26,23,.15);overflow:hidden;}
.bar-fill{height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--gold));transition:width 1.4s cubic-bezier(.2,.8,.2,1);}
.stack{margin-top:44px;font-size:.95rem;color:var(--ink-soft);line-height:2.1;border-top:1.5px solid rgba(27,26,23,.15);padding-top:24px;}
.stack-k{display:inline-block;font-family:var(--serif);font-size:.7rem;letter-spacing:2px;text-transform:uppercase;color:var(--gold);
  border:1px solid rgba(184,146,74,.4);padding:2px 8px;margin:0 8px 0 22px;}
.stack-k:first-child{margin-left:0;}
@media(max-width:860px){ .skills-grid{grid-template-columns:1fr;gap:34px;} }

/* Parcurs / timeline */
.timeline{position:relative;padding-left:30px;}
.timeline::before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:linear-gradient(var(--gold),rgba(184,146,74,.2));}
.tl-item{position:relative;display:grid;grid-template-columns:130px 1fr;gap:20px;padding:14px 0 26px;}
.tl-dot{position:absolute;left:-30px;top:18px;width:14px;height:14px;border-radius:50%;background:var(--paper);border:2.5px solid var(--green);}
.tl-when{font-family:var(--serif);font-style:italic;color:var(--gold);font-size:1rem;padding-top:2px;}
.tl-body h3{font-family:var(--serif);font-size:1.3rem;font-weight:500;margin-bottom:4px;}
.tl-body p{color:var(--ink-soft);font-size:.95rem;}
@media(max-width:620px){ .tl-item{grid-template-columns:1fr;gap:2px;} .tl-when{font-size:.85rem;} }

/* Premii */
.awards-wrap{display:flex;flex-direction:column;gap:40px;}
.aw-cat{font-family:var(--serif);font-style:italic;font-size:1.4rem;color:var(--green);margin-bottom:18px;display:flex;align-items:center;gap:14px;}
.aw-cat::after{content:"";flex:1;height:1px;background:rgba(27,26,23,.16);}
.awards{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:.7rem 40px;}
.awards li{position:relative;padding-left:2rem;font-size:.96rem;line-height:1.45;}
.awards li strong{color:var(--green);font-weight:600;}
.awards.wins li::before{content:"🏆";position:absolute;left:0;top:1px;font-size:.85rem;}
.awards.list li::before{content:"›";position:absolute;left:.5rem;top:-1px;color:var(--gold);font-family:var(--serif);font-weight:700;font-size:1.1rem;}
.awards li .aw-when{font-family:var(--serif);font-style:italic;color:var(--gold);margin-right:8px;white-space:nowrap;}
@media(max-width:760px){ .awards{grid-template-columns:1fr;} }

/* Footer */
.footer{border-top:1.5px solid var(--ink);padding:80px 0 90px;margin-top:40px;text-align:center;}
.foot-quote{font-family:var(--serif);font-style:italic;font-size:clamp(1.6rem,3.5vw,2.6rem);margin-bottom:30px;}
.foot-links{font-family:var(--serif);font-size:1rem;letter-spacing:1px;margin-bottom:18px;}
.foot-links a{border-bottom:1px solid transparent;}
.foot-links a:hover{border-color:var(--gold);}
.foot-links .sep{color:var(--ink-faint);margin:0 10px;}
.foot-note{font-family:var(--serif);font-size:.72rem;letter-spacing:2px;text-transform:uppercase;color:var(--ink-faint);}

/* photo in frame */
.frame-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 16%;filter:contrast(1.03) saturate(.97);}
.frame .vandal,.frame .vandal2,.frame .plaque{z-index:2;}
.frame .vandal{text-shadow:1px 1px 5px rgba(0,0,0,.5);}
.frame .vandal2{color:var(--lime);text-shadow:0 1px 5px rgba(0,0,0,.45);}

/* graffiti over "Mold" */
.mold-wrap{position:relative;display:inline-block;}
.mold-graf{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-7deg);
  font-family:var(--tag);color:var(--spray);font-size:.92em;letter-spacing:-3px;white-space:nowrap;line-height:1;
  filter:url(#rough);pointer-events:none;clip-path:inset(0 106% 0 -10%);}
.mold-graf.spraying{animation:sprayMold 1s cubic-bezier(.45,.05,.25,1) forwards;}
@keyframes sprayMold{
  0%{clip-path:inset(0 106% 0 -10%);text-shadow:0 0 18px var(--spray);}
  65%{text-shadow:5px 6px 0 rgba(0,0,0,.06),0 0 9px rgba(230,53,122,.55);}
  100%{clip-path:inset(0 -10% 0 -10%);text-shadow:2px 3px 0 rgba(0,0,0,.16);}
}
@media(prefers-reduced-motion:reduce){.mold-graf{clip-path:none;}.mold-graf.spraying{animation:none;}}

/* view more */
.more-wrap{display:flex;justify-content:center;margin-top:46px;}
.more-btn{font-family:var(--serif);text-transform:uppercase;letter-spacing:3px;font-size:.82rem;
  padding:16px 42px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;
  display:inline-flex;gap:.5rem;align-items:center;transition:.25s;}
.more-btn em{font-family:var(--tag);font-style:normal;color:var(--spray);font-size:1.1rem;}
.more-btn:hover{background:var(--ink);color:var(--paper);}
.more-btn:hover em{color:var(--lime);}
.work-grid:not(.expanded) .card.extra{display:none;}

/* ===== Harta proiectelor — METROU (stil oficial, alb) ===== */
.gview{position:fixed;inset:0;z-index:8000;visibility:hidden;opacity:0;transition:opacity .35s ease;background:#f4f2ea;
  font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;}
.gview.open{visibility:visible;opacity:1;}
.cityvp{position:absolute;inset:0;overflow:auto;cursor:grab;}
.cityvp.grab{cursor:grabbing;}
.citymap{position:relative;width:2000px;height:1560px;background:#f4f2ea;
  background-image:repeating-linear-gradient(0deg, rgba(0,0,0,.028) 0 1px, transparent 1px 64px),repeating-linear-gradient(90deg, rgba(0,0,0,.028) 0 1px, transparent 1px 64px);
  transform:scale(1.04);transition:transform .55s cubic-bezier(.2,.8,.2,1);transform-origin:50% 40%;}
.gview.open .citymap{transform:scale(1);}
.citymap svg.layer{position:absolute;inset:0;width:2000px;height:1560px;pointer-events:none;}
.pin{position:absolute;transform:translate(-50%,-50%);z-index:5;}
.dot{width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid var(--c);box-shadow:0 1px 3px rgba(0,0,0,.28);cursor:pointer;transition:transform .15s;}
.pin:hover{z-index:40;}
.pin:hover .dot{transform:scale(1.35);}
.pin.intc .dot{width:26px;height:26px;border-color:#1b1b1b;border-width:5px;}
.plabel{position:absolute;white-space:nowrap;font-weight:700;font-size:.96rem;color:#1b1b1b;letter-spacing:.2px;text-shadow:0 1px 0 #f4f2ea,1px 1px 3px #f4f2ea,-1px 0 3px #f4f2ea;}
.pin.lab-r .plabel{left:17px;top:50%;transform:translateY(-50%);}
.pin.lab-l .plabel{right:17px;top:50%;transform:translateY(-50%);}
.pin.lab-t .plabel{left:50%;bottom:16px;transform:translateX(-50%);}
.pin.lab-b .plabel{left:50%;top:16px;transform:translateX(-50%);}
.pin.intc .plabel{font-weight:800;}
.pcard{position:absolute;left:50%;bottom:26px;transform:translateX(-50%) translateY(8px);width:236px;background:#fff;border:1px solid #d9d4c6;border-radius:12px;padding:13px 15px;opacity:0;pointer-events:none;transition:.18s;z-index:50;box-shadow:0 16px 38px rgba(0,0,0,.22);}
.pin:hover .pcard{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto;}
.pcard h3{font-weight:800;font-size:1.1rem;margin-bottom:3px;color:var(--c);}
.pcard .pc-cat{font-size:.62rem;letter-spacing:2px;text-transform:uppercase;color:#8a8576;margin-bottom:7px;}
.pcard .pc-tags{font-size:.8rem;color:#555;margin-bottom:10px;}
.pcard .pc-links{display:flex;gap:16px;font-weight:700;font-size:.74rem;text-transform:uppercase;letter-spacing:.5px;}
.pcard .pc-links a{color:#1b1b1b;text-decoration:none;border-bottom:2px solid var(--c);}
.pcard .pc-links span{color:#aaa;}
.hud{position:fixed;top:18px;left:18px;z-index:8200;background:#fff;border:1px solid #d9d4c6;border-radius:14px;padding:16px 18px;box-shadow:0 12px 30px rgba(0,0,0,.12);max-width:300px;
  font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;}
.hud-t{font-weight:800;font-size:1.4rem;line-height:1;color:#1b1b1b;letter-spacing:.5px;}
.hud-sub{font-size:.72rem;color:#999;margin:5px 0 13px;font-style:italic;}
.leg{display:flex;flex-direction:column;gap:9px;font-size:.86rem;color:#333;}
.leg span{display:flex;align-items:center;gap:10px;}
.leg .mpill{display:inline-grid;place-items:center;min-width:34px;height:21px;padding:0 6px;border-radius:4px;color:#fff;font-weight:800;font-size:.72rem;flex:none;box-shadow:0 1px 2px rgba(0,0,0,.2);}
.gview .gback{position:fixed;top:18px;right:18px;left:auto;z-index:8200;font-family:system-ui,sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:.78rem;font-weight:700;
  background:#1b1b1b;color:#fff;border:none;padding:11px 22px;border-radius:8px;cursor:pointer;transition:.18s;}
.gview .gback:hover{background:#e2231a;}
.map-hint{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:8200;font-size:.82rem;color:#666;background:rgba(255,255,255,.9);padding:6px 16px;border:1px solid #d9d4c6;border-radius:20px;font-family:system-ui,sans-serif;}
body.noscroll{overflow:hidden;}
@media(prefers-reduced-motion:reduce){.gview,.citymap{transition:none;}}

.tl-dot.edu{border-color:var(--gold);background:var(--gold);}

/* reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease;}
.reveal.in{opacity:1;transform:none;}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
  .marquee .track,.scroll-hint,.status.online .led{animation:none;}
}

/* ===== Stație de metrou (scena) ===== */
.station{position:fixed;inset:0;z-index:7000;visibility:hidden;opacity:0;transition:opacity .3s ease;overflow:hidden;
  font-family:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:#1a1a1a;}
.station.open{visibility:visible;opacity:1;}
.st-wall{position:absolute;inset:0;background-color:#cfc9bc;
  background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='92'><defs><linearGradient id='t' x1='0' y1='0' x2='0' y2='1'><stop offset='0' stop-color='%23fbf9f3'/><stop offset='0.5' stop-color='%23efece3'/><stop offset='1' stop-color='%23d8d3c6'/></linearGradient></defs><rect width='200' height='92' fill='%23a59f90'/><rect x='3' y='3' width='92' height='40' rx='3' fill='url(%23t)'/><rect x='105' y='3' width='92' height='40' rx='3' fill='url(%23t)'/><rect x='-43' y='49' width='92' height='40' rx='3' fill='url(%23t)'/><rect x='59' y='49' width='92' height='40' rx='3' fill='url(%23t)'/><rect x='151' y='49' width='92' height='40' rx='3' fill='url(%23t)'/></svg>");background-size:200px 92px;}
.st-wall::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 60% 40% at 50% 8%, rgba(255,236,200,.26), transparent 60%),radial-gradient(ellipse 50% 60% at 50% 120%, rgba(0,0,0,.4), transparent 70%),linear-gradient(180deg, rgba(255,250,240,.05), rgba(0,0,0,.16));}
.st-ceiling{position:absolute;top:0;left:0;right:0;height:60px;background:linear-gradient(#15151a,#26262e);border-bottom:3px solid #0c0c10;}
.st-light{position:absolute;top:20px;left:6%;right:6%;height:14px;border-radius:8px;background:#fffbe9;box-shadow:0 0 30px 8px rgba(255,245,210,.55),0 14px 50px 12px rgba(255,240,200,.2);}
.st-nameband{position:absolute;top:78px;left:0;right:0;height:80px;background:#0f7a63;display:flex;align-items:center;justify-content:center;gap:24px;box-shadow:inset 0 6px 0 rgba(255,255,255,.18),inset 0 -8px 0 rgba(0,0,0,.25);}
.st-roundel{width:54px;height:54px;border-radius:50%;border:8px solid #d4322a;background:#fff;display:grid;place-items:center;font-weight:800;color:#111;}
.st-name{font-weight:800;letter-spacing:6px;text-transform:uppercase;font-size:clamp(1.4rem,4.5vw,2.6rem);color:#fff;}
.st-x{font-weight:600;color:#bfeee1;letter-spacing:2px;font-size:.85rem;}
.st-sign{position:absolute;top:182px;right:5%;background:#111;color:#fff;border:3px solid #2a2a2a;border-radius:6px;padding:10px 16px;font-weight:600;letter-spacing:1px;font-size:.9rem;box-shadow:0 14px 26px rgba(0,0,0,.5);}
.st-sign::before,.st-sign::after{content:"";position:absolute;top:-22px;width:4px;height:22px;background:#333;}
.st-sign::before{left:24px}.st-sign::after{right:24px}.st-sign .ar{font-size:1.2rem;}
.st-map{position:absolute;left:3%;top:212px;width:min(460px,40vw);border:9px solid #1c1c22;border-radius:8px;background:#13131a;padding:10px;cursor:pointer;text-align:left;box-shadow:0 30px 60px rgba(0,0,0,.55),inset 0 0 0 2px #3a3a44;transition:transform .2s,box-shadow .2s;}
.st-map:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 40px 72px rgba(0,0,0,.6),0 0 0 3px #2ad4ff;}
.st-map-head{display:block;background:#0e1422;color:#fff;font-weight:700;letter-spacing:1px;font-size:.78rem;padding:8px 12px;}
.st-map-head em{color:#2ad4ff;font-style:normal;float:right;}
.st-map-area{background:#f4f2ea;padding:14px;}
.st-map-svg{display:block;width:100%;height:auto;background:repeating-linear-gradient(0deg, rgba(0,0,0,.03) 0 1px, transparent 1px 22px),repeating-linear-gradient(90deg, rgba(0,0,0,.03) 0 1px, transparent 1px 22px),#f4f2ea;}
.st-map-glass{position:absolute;inset:10px;pointer-events:none;border-radius:4px;background:linear-gradient(122deg, rgba(255,255,255,.15) 0 16%, transparent 30% 62%, rgba(255,255,255,.08) 82% 100%);}
.st-ads{position:absolute;top:240px;right:8%;bottom:212px;display:flex;gap:14px;align-items:stretch;pointer-events:none;z-index:2;}
.st-ad{position:relative;pointer-events:auto;display:block;border:7px solid #0c0c0e;border-radius:5px;overflow:hidden;background:#0c0c0e;box-shadow:0 22px 44px rgba(0,0,0,.6),0 0 30px 4px rgba(120,180,255,.12);transition:transform .2s,box-shadow .2s;}
.st-ad-tall{height:100%;aspect-ratio:3/4;flex:none;}        /* TrainBot portret — fără tăiere */
.st-ad-col{display:flex;flex-direction:column;gap:16px;height:100%;align-items:flex-start;flex:none;}
.st-ad-small{flex:none;height:calc((100% - 16px) / 2);aspect-ratio:1/1;}   /* Arbori / Timișoara pătrat */
.st-ad-img{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;object-fit:cover;filter:contrast(1.04) saturate(1.04);}
.st-ad-ph{position:absolute;inset:0;z-index:1;display:grid;place-items:center;font-family:system-ui,-apple-system,sans-serif;font-weight:800;font-size:2.6rem;letter-spacing:2px;color:rgba(255,255,255,.94);
  background:radial-gradient(circle at 30% 22%, var(--phc,#2a3550), #0e1422 88%);text-shadow:0 3px 10px rgba(0,0,0,.5);}
.st-ad:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 40px 70px rgba(0,0,0,.65),0 0 50px 8px rgba(120,180,255,.2);}
.st-ad-tag{position:absolute;left:0;right:0;bottom:0;z-index:3;background:rgba(0,0,0,.72);color:#fff;font-weight:600;font-size:.72rem;letter-spacing:.5px;padding:7px 9px;}
.st-ad-tag em{color:#7Bd14b;font-style:normal;}
.st-floor{position:absolute;left:0;right:0;bottom:0;height:150px;background:linear-gradient(#3a3a40,#2a2a30);box-shadow:inset 0 8px 16px rgba(0,0,0,.4);}
.st-floor::before{content:"";position:absolute;inset:0;opacity:.5;background:repeating-linear-gradient(90deg, rgba(0,0,0,.12) 0 2px, transparent 2px 70px),repeating-linear-gradient(0deg, rgba(0,0,0,.12) 0 2px, transparent 2px 70px);}
.st-safety{position:absolute;left:0;right:0;bottom:118px;height:24px;background:repeating-linear-gradient(45deg,#f4c518 0 18px,#1a1a1a 18px 36px);box-shadow:0 -2px 6px rgba(0,0,0,.4);}
.st-gap{position:absolute;left:0;right:0;bottom:0;height:118px;background:linear-gradient(#15151a,#050507);border-top:5px solid #0a0a0c;}
.st-rail{position:absolute;bottom:24px;left:0;right:0;height:6px;background:repeating-linear-gradient(90deg,#444 0 60px,#222 60px 70px);}
.st-mindgap{position:absolute;left:24px;bottom:62px;color:#f4c518;font-weight:700;letter-spacing:1px;font-size:.8rem;opacity:.85;}
.st-bench{position:absolute;left:6%;bottom:150px;width:160px;height:18px;background:#5a4632;border-radius:4px;box-shadow:0 14px 0 -4px #3a2e22,0 26px 18px rgba(0,0,0,.4);}
.st-bench::before,.st-bench::after{content:"";position:absolute;bottom:-26px;width:8px;height:26px;background:#2c2c30;}
.st-bench::before{left:14px}.st-bench::after{right:14px}
.st-bin{position:absolute;left:19%;bottom:150px;width:40px;height:56px;background:linear-gradient(#3a3a40,#23232a);border-radius:6px 6px 4px 4px;border-top:6px solid #4a4a52;}
.st-exit{position:fixed;top:18px;left:18px;z-index:7200;font-family:system-ui,sans-serif;font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:.8rem;background:#fff;color:#111;border:none;padding:11px 20px;border-radius:8px;cursor:pointer;transition:.18s;}
.st-exit:hover{background:#d4322a;color:#fff;}
.st-hint{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:7200;color:#eee;background:rgba(0,0,0,.6);padding:6px 16px;border-radius:18px;font-size:.82rem;font-family:system-ui,sans-serif;}
.st-vig{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 220px 70px rgba(0,0,0,.5);}
@media(max-width:760px){.st-map{width:88vw;left:6vw;top:178px;} .st-ad{display:none;} .st-sign{display:none;}}

/* ===== Tren (tranziție) ===== */
.train-fx{position:fixed;inset:0;z-index:9000;pointer-events:none;overflow:hidden;opacity:0;}
.train-fx.go{opacity:1;}
.train{position:absolute;top:0;left:0;height:100%;display:flex;align-items:stretch;transform:translateX(115vw);will-change:transform;}
.train-fx.go .train{animation:trainPass 1.7s cubic-bezier(.5,0,.5,1) forwards;}
@keyframes trainPass{0%{transform:translateX(115vw);}100%{transform:translateX(-210vw);}}
.cab{width:13vw;flex:none;height:100%;background:linear-gradient(180deg,#e6eaee,#bcc2ca 55%,#9298a0);position:relative;border-radius:46px 6px 6px 46px/64px 6px 6px 64px;box-shadow:inset -8px 0 18px rgba(0,0,0,.18);}
.cab.end{border-radius:6px 46px 46px 6px/6px 64px 64px 6px;box-shadow:inset 8px 0 18px rgba(0,0,0,.18);}
.cab::before{content:"";position:absolute;left:16%;top:25%;width:62%;height:26%;background:#16202e;border-radius:16px;box-shadow:inset 0 0 0 4px #6b7280;}
.car{width:30vw;flex:none;height:100%;background:linear-gradient(180deg,#e6eaee,#c6cbd1 50%,#9ea4ac);border-left:4px solid #6f757d;position:relative;box-shadow:inset 0 -34px 50px rgba(0,0,0,.12),inset 0 22px 34px rgba(255,255,255,.32);}
.car .win{position:absolute;left:0;right:0;top:29%;height:23%;background:repeating-linear-gradient(90deg,#14202e 0 72px,#b4bac2 72px 90px);box-shadow:inset 0 0 0 3px rgba(0,0,0,.15);}
.car .stripe{position:absolute;left:0;right:0;top:60%;height:11px;background:#ff3b5c;box-shadow:0 1px 0 rgba(0,0,0,.2);}
.car .door{position:absolute;left:50%;top:24%;transform:translateX(-50%);width:8vw;height:62%;background:linear-gradient(180deg,#d2d7dd,#aeb4bc);border-left:2px solid #7a8088;border-right:2px solid #7a8088;}
.car .door::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:#7a8088;}
@media(prefers-reduced-motion:reduce){.station{transition:none;}.train-fx.go .train{animation-duration:.6s;}}

/* ===== Card clickable ===== */
.card.clickable{cursor:pointer;}

/* ===== Popup proiect (modal) ===== */
.pmodal{position:fixed;inset:0;z-index:9500;display:flex;align-items:center;justify-content:center;padding:24px;
  visibility:hidden;opacity:0;transition:opacity .25s ease,visibility .25s ease;}
.pmodal.open{visibility:visible;opacity:1;}
.pm-backdrop{position:absolute;inset:0;background:rgba(20,18,14,.62);backdrop-filter:blur(3px);}
.pm-dialog{position:relative;z-index:1;width:min(880px,100%);max-height:88vh;overflow:auto;display:grid;
  grid-template-columns:minmax(0,46%) 1fr;background:var(--paper);border:1.5px solid var(--gold);
  border-radius:6px;box-shadow:0 40px 90px rgba(20,18,14,.5);transform:translateY(18px) scale(.98);
  transition:transform .3s cubic-bezier(.2,.8,.2,1);}
.pmodal.open .pm-dialog{transform:none;}
.pm-x{position:absolute;top:12px;right:12px;z-index:3;width:38px;height:38px;border-radius:50%;border:1.5px solid rgba(244,241,234,.5);
  background:rgba(20,18,14,.55);color:#fff;font-size:1rem;cursor:pointer;display:grid;place-items:center;transition:.18s;}
.pm-x:hover{background:var(--spray);border-color:var(--spray);transform:rotate(90deg);}
.pm-media{position:relative;background:var(--green);overflow:hidden;min-height:240px;display:grid;place-items:stretch;}
.pm-media img{width:100%;height:100%;object-fit:cover;display:block;}
.pm-fallback{display:none;position:absolute;inset:0;place-items:center;font-family:var(--serif);font-size:2.4rem;color:var(--gold-2);
  letter-spacing:1px;text-align:center;padding:20px;}
.pm-media.noimg img{display:none;}
.pm-media.noimg{display:grid;place-items:center;}
.pm-media.noimg .pm-fallback{display:grid;}
.pm-body{padding:30px 32px 32px;display:flex;flex-direction:column;gap:.7rem;min-width:0;}
.pm-cat{font-family:var(--serif);text-transform:uppercase;letter-spacing:4px;font-size:.7rem;color:var(--gold);}
.pm-title{font-family:var(--serif);font-weight:400;font-size:2rem;line-height:1.05;letter-spacing:-.5px;color:var(--ink);}
.pm-desc{font-family:var(--body);font-size:1.04rem;line-height:1.6;color:var(--ink-soft);}
.pm-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:.2rem;}
.pm-tag{font-family:var(--serif);font-size:.7rem;letter-spacing:1px;text-transform:uppercase;color:var(--green-2);
  border:1px solid rgba(20,58,42,.28);border-radius:2px;padding:4px 10px;}
.pm-links{display:flex;flex-wrap:wrap;gap:18px;margin-top:.6rem;align-items:center;}
.pm-links a{font-family:var(--serif);font-size:.82rem;letter-spacing:1px;text-transform:uppercase;font-weight:500;
  color:var(--ink);text-decoration:none;border-bottom:2px solid var(--spray);padding-bottom:2px;transition:.18s;}
.pm-links a:hover{color:var(--spray);}
.pm-priv{font-family:var(--body);font-style:italic;font-size:.86rem;color:var(--ink-faint);}
@media(max-width:680px){
  .pm-dialog{grid-template-columns:1fr;max-height:90vh;}
  .pm-media{min-height:180px;max-height:34vh;}
  .pm-body{padding:22px 22px 26px;}
  .pm-title{font-size:1.6rem;}
}
