:root{
  --bg:#06111f;
  --bg-deep:#030912;
  --surface:#0d1a2e;
  --surface-2:#101f37;
  --card:#0c1830cc;
  --card-strong:#10203b;
  --line:rgba(255,255,255,.08);
  --text:#f2f6ff;
  --muted:#a8b7d3;
  --muted-2:#8a9bbc;
  --cyan:#56d7ff;
  --blue:#7a89ff;
  --pink:#ff78c8;
  --amber:#ffb46d;
  --radius:28px;
  --shadow:0 20px 70px rgba(0,0,0,.35);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 18% 16%, rgba(86,215,255,.10), transparent 22%),
    radial-gradient(circle at 80% 8%, rgba(122,137,255,.12), transparent 24%),
    radial-gradient(circle at 52% 74%, rgba(255,120,200,.08), transparent 28%),
    linear-gradient(180deg, #06111f 0%, #04101d 40%, #030912 100%);
  line-height:1.72;
  position:relative;
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;
  background:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(circle at center, black 46%, transparent 92%);
}
body::after{
  content:"";position:fixed;inset:-10%;pointer-events:none;opacity:.35;filter:blur(70px);
  background:
    radial-gradient(circle at 18% 18%, rgba(86,215,255,.14), transparent 20%),
    radial-gradient(circle at 78% 14%, rgba(122,137,255,.18), transparent 22%),
    radial-gradient(circle at 50% 82%, rgba(255,120,200,.10), transparent 20%);
  animation:aurora 16s ease-in-out infinite alternate;
}
@keyframes aurora{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(0,-1.5%,0) scale(1.06)}
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
p{margin:0 0 1rem;color:var(--muted);font-size:1.03rem}
small{display:inline-block;color:var(--cyan);letter-spacing:.18em;text-transform:uppercase;font-weight:800;font-size:.78rem;margin-bottom:.8rem}
h1,h2,h3,h4{margin:0 0 .8rem;line-height:1.06;letter-spacing:-.04em}
h1{font-size:clamp(2.6rem,5.2vw,4.4rem);font-weight:800}
h2{font-size:clamp(1.9rem,3vw,3rem);font-weight:780}
h3{font-size:clamp(1.25rem,1.7vw,1.6rem);font-weight:760}
ul{margin:0}
.container{width:min(calc(100% - 2.2rem),var(--max));margin:0 auto;position:relative;z-index:1}
.section{padding:6.25rem 0;position:relative}
.section.alt-cyan::before,.section.alt-purple::before,.section.alt-amber::before,.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at center, rgba(255,255,255,.02), transparent 58%);
}
.section.alt-cyan{background:linear-gradient(180deg, rgba(86,215,255,.03), transparent 60%)}
.section.alt-purple{background:linear-gradient(180deg, rgba(122,137,255,.05), transparent 62%)}
.section.alt-amber{background:linear-gradient(180deg, rgba(255,180,109,.04), transparent 62%)}
.card,.glass{
  background:linear-gradient(180deg, rgba(18,32,58,.88), rgba(8,17,32,.86));
  border:1px solid rgba(255,255,255,.075);
  box-shadow:var(--shadow);
  backdrop-filter:blur(16px);
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:52px;padding:0 1.2rem;border-radius:999px;
  font-weight:700;letter-spacing:-.02em;border:1px solid transparent;transition:.22s ease;cursor:pointer;font-size:.98rem
}
.btn:hover{transform:translateY(-1px)}
.btn.primary{
  color:#08111f;
  background:linear-gradient(135deg, #60dfff, #8d9cff 52%, #ff8ed4);
  box-shadow:0 14px 36px rgba(125,136,255,.22);
}
.btn.secondary,.btn.ghost{
  color:var(--text);
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.09);
}
.site-header{
  position:sticky;top:0;z-index:25;
  background:rgba(4,10,18,.62);backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.06)
}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg, transparent, rgba(120,150,255,.38), transparent)}
.site-header .inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0}
.logo{display:flex;align-items:center;gap:.95rem}
.logo img{height:42px;width:auto;filter:drop-shadow(0 6px 18px rgba(86,215,255,.15))}
.logo-label{display:flex;flex-direction:column;line-height:1.15}
.logo-label strong{font-size:1rem;letter-spacing:-.02em}
.logo-label span:last-child{color:var(--muted-2);font-size:.84rem;letter-spacing:.01em}
.nav-links{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.nav-links a{padding:.7rem 1rem;border-radius:999px;color:var(--muted);font-weight:650;font-size:.96rem}
.nav-links a.active,.nav-links a:hover{background:rgba(255,255,255,.06);color:var(--text)}
.menu-toggle{display:none}
.hero{padding:5.2rem 0 5.4rem;position:relative}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:1.6rem;align-items:center}
.hero-copy{max-width:700px}
.hero-kicker{display:flex;align-items:center;gap:.75rem;margin-bottom:.85rem}
.hero-kicker span{
  display:inline-flex;align-items:center;padding:.58rem .86rem;border-radius:999px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);
  font-size:.87rem;color:#dce8ff;font-weight:650
}
.hero-name{margin-bottom:1rem;max-width:10ch;font-size:clamp(3.2rem,8vw,5.9rem)}
.hero-name .accent{
  background:linear-gradient(135deg,var(--cyan),#9ba8ff 56%,#ff93d6);
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.lead{
  font-size:1.13rem;max-width:60ch;color:#cedaf0;line-height:1.75
}
.hero-actions,.hero-highlights,.trust-row{display:flex;gap:.9rem;flex-wrap:wrap}
.hero-actions{margin-top:1.6rem}
.hero-highlights{margin-top:1.4rem}
.hero-highlights span,.trust-row span,.chip,.badge{
  padding:.62rem .9rem;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);
  color:#d9e5fb;font-size:.88rem
}
.trust-row{margin:1.1rem 0 0}
.statement-card{
  padding:1.35rem 1.4rem;border-radius:24px;margin-top:1.1rem;
  background:linear-gradient(135deg, rgba(86,215,255,.10), rgba(122,137,255,.08) 52%, rgba(255,120,200,.08));
  border:1px solid rgba(255,255,255,.09)
}
.statement-card strong{display:block;font-size:1.02rem;letter-spacing:-.015em}
.metrics-grid,.services-grid,.timeline-grid,.portfolio-grid,.proof-grid,.result-grid,.project-grid{display:grid;gap:1.2rem}
.metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:1.9rem}
.metric-card{padding:1.35rem;border-radius:24px;position:relative;overflow:hidden;min-height:154px}
.metric-card::after{
  content:"";position:absolute;inset:auto -30px -45px auto;width:150px;height:150px;border-radius:50%;
  background:radial-gradient(circle, rgba(89,214,255,.16), transparent 64%);
}
.metric-card strong{display:block;font-size:1.8rem;margin-bottom:.45rem;letter-spacing:-.03em}
.metric-card span{color:#d0dbef;font-size:.96rem}
.hero-visual{padding:1.2rem;border-radius:34px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-visual::before{
  content:"";position:absolute;inset:6% 14% auto 14%;height:34%;border-radius:999px;filter:blur(30px);opacity:.55;
  background:linear-gradient(90deg, rgba(86,215,255,.22), rgba(122,137,255,.18), rgba(255,120,200,.16));
}
.profile-frame{
  width:100%;padding:1rem;border-radius:28px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:var(--shadow)
}
.profile-frame img{width:100%;min-height:620px;object-fit:cover;object-position:center 20%;border-radius:22px;background:#0d1728}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:1.2rem;margin-bottom:1.8rem}
.section-head > div{min-width:0}
.section-head p{max-width:56ch;margin:0;color:#c0cde5}
.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;align-items:start}
.about-copy,.skills-panel,.contact-wrap,.project-page,.proof-card,.cta-panel{padding:1.7rem}
.kpi-strip{display:flex;gap:.65rem;flex-wrap:wrap;align-items:flex-start;margin:.4rem 0 0}
.kpi-strip span,.chip{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:.46rem .8rem;border-radius:999px;border:1px solid rgba(255,255,255,.10);font-size:.82rem;color:#e8eeff;line-height:1.15;text-align:center;backdrop-filter:blur(4px)}
.kpi-strip span{background:rgba(255,255,255,.04);font-weight:600}
.chip{background:rgba(255,255,255,.08);font-weight:700}
.skills-list{display:grid;gap:1rem;margin-top:1.05rem}
.skill{display:grid;grid-template-columns:1fr auto;gap:.75rem;align-items:center}
.skill label{font-weight:700;color:var(--text)}
.skill .bar{grid-column:1/-1;height:12px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden}
.skill .bar > span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--cyan),var(--blue),var(--pink))}
.services-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-card{padding:1.55rem;position:relative;overflow:hidden;border-radius:26px}
.service-card::after{
  content:"";position:absolute;inset:auto -55px -65px auto;width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle, rgba(124,140,255,.18), transparent 64%);
}
.service-number{
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-weight:900;margin-bottom:1rem;
  background:linear-gradient(135deg, rgba(89,214,255,.16), rgba(255,121,198,.14));color:var(--text)
}
.proof-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.proof-card h3{margin-bottom:.55rem}
.proof-card{border-radius:24px}
.timeline-shell{position:relative;padding:2rem 0 2.4rem}
.timeline-shell::before{
  content:"";position:absolute;left:50%;transform:translateX(-50%);top:0;bottom:0;width:2px;
  background:linear-gradient(180deg, rgba(86,215,255,.10), rgba(122,137,255,.58), rgba(255,120,200,.14));
  box-shadow:0 0 30px rgba(122,137,255,.16)
}
.timeline-stack{display:grid;gap:3.25rem;position:relative}
.timeline-item{
  width:calc(50% - 3.5rem);padding:1.75rem 1.55rem 1.55rem;border-radius:26px;position:relative;margin:0;min-height:auto;display:block;transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease
}
.timeline-item.left{justify-self:start}
.timeline-item.right{justify-self:end}
.timeline-node{
  position:absolute;top:2.05rem;width:16px;height:16px;border-radius:50%;
  background:linear-gradient(135deg,var(--cyan),var(--pink));
  box-shadow:0 0 0 6px rgba(89,214,255,.10), 0 0 0 1px rgba(255,255,255,.16), 0 0 24px rgba(122,137,255,.18)
}
.timeline-item.left .timeline-node{right:-4rem}
.timeline-item.right .timeline-node{left:-4rem}
.timeline-item:nth-child(2){margin-top:3.2rem}
.timeline-item:nth-child(3){margin-top:.2rem}
.timeline-item:nth-child(4){margin-top:3.2rem}
.timeline-item .period{color:var(--cyan);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;margin-bottom:.72rem}
.timeline-item ul,.block ul{padding-left:1.15rem;color:var(--muted);margin:0}
.timeline-item li + li,.block li + li{margin-top:.55rem}
.hidden-field{position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden}
.contact-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:1rem}
.contact-points{display:grid;gap:1rem}
.contact-point{padding:1.2rem;border-radius:22px}
.contact-point h3{font-size:1.12rem}
.contact-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.contact-form .full{grid-column:1/-1}
.field label{display:block;margin-bottom:.45rem;color:#d9e6ff;font-size:.9rem;font-weight:600}
.field input,.field textarea{
  width:100%;padding:1rem;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.04);color:var(--text);font:inherit
}
.field textarea{min-height:150px;resize:vertical}
.site-footer{
  padding:4rem 0 2rem;
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(6,12,24,.6);
}

.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:3rem;
}

.footer-brand img{
  height:150px;
  margin-bottom:1rem;
}

.footer-tagline{
  color:var(--muted);
  margin-bottom:.6rem;
}

.footer-desc{
  font-size:.95rem;
  max-width:420px;
}

.footer-col h4{
  margin-bottom:.8rem;
  font-size:.95rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}

.footer-col a{
  display:block;
  margin-bottom:.45rem;
  color:var(--text);
  opacity:.8;
}

.footer-col a:hover{
  opacity:1;
}
.contact-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:.55rem .9rem;
  margin-bottom:.55rem;

  border-radius:999px;

  font-size:.9rem;
  font-weight:600;

  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.05);

  color:var(--text);

  width:auto;
  max-width:160px;

  transition:.2s ease;
}

.contact-btn:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.08);
}
.contact-btn.email{
  border-color:rgba(255,255,255,.15);
}

.contact-btn.linkedin{
  border-color:#0A66C2;
  color:#8fc7ff;
}

.contact-btn.linkedin:hover{
  background:#0A66C2;
  color:white;
}

.contact-btn.whatsapp{
  border-color:#25D366;
  color:#7df7a6;
}

.contact-btn.whatsapp:hover{
  background:#25D366;
  color:white;
}

.footer-bottom{
  margin-top:2.5rem;
  padding-top:1rem;
  border-top:1px solid rgba(255,255,255,.06);
  text-align:center;
  color:var(--muted);
  font-size:.9rem;
}
.portfolio-toolbar{display:flex;gap:.7rem;flex-wrap:wrap;margin-bottom:1.3rem}
.filter-btn{
  border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:var(--muted);border-radius:999px;padding:.76rem 1rem;cursor:pointer;font:inherit;font-weight:700
}
.filter-btn.active,.filter-btn:hover{color:var(--text);background:rgba(255,255,255,.09)}
.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.project-card{
  position:relative;min-height:390px;padding:1.7rem;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;isolation:isolate;border-radius:30px;gap:.75rem
}
.project-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(6,13,24,.12), rgba(6,13,24,.88));z-index:-1}
.project-card::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg, rgba(89,214,255,.1), rgba(124,140,255,.12) 45%, rgba(255,121,198,.12));mix-blend-mode:screen;z-index:-1}
.project-card .meta{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:auto;padding-top:1rem;width:100%;color:#c8d5eb;font-size:.9rem}
.project-card p{max-width:44ch;margin:0;font-size:1rem;color:#d5def0}
.project-card h3{margin-bottom:0;font-size:2rem}
.project-card > *{max-width:100%}
.chip-row{display:flex;gap:.65rem;flex-wrap:wrap;align-items:flex-start;margin:0 0 .15rem}
.empty-state{text-align:center;padding:2rem;color:var(--muted);display:none}
.project-page .hero-block{padding:1.95rem;border-radius:30px;margin-bottom:1.2rem;overflow:hidden;position:relative}
.project-page .hero-block::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(5,11,20,.16), rgba(5,11,20,.78))}
.project-page .hero-block > *{position:relative;z-index:1}
.project-meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.2rem}
.project-meta{
  padding:1rem;
  border-radius:20px;

  background:linear-gradient(
    160deg,
    rgba(16,28,55,.94),
    rgba(8,15,30,.96)
  );

  border:1px solid rgba(86,215,255,.35);

  box-shadow:
    0 14px 36px rgba(0,0,0,.35),
    0 0 22px rgba(86,215,255,.12);

  backdrop-filter:blur(12px);
}
.project-meta h3{font-size:1.06rem;line-height:1.35;letter-spacing:-.02em}
.project-page .content-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:1.2rem;align-items:start}
.project-page .content-grid .block{padding:1.45rem;border-radius:24px;margin:0 0 1.2rem}
.project-page .content-grid > div:last-child .block:last-child,.project-page .content-grid > aside .block:last-child{margin-bottom:0}
.project-nav{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:1.4rem}
.form-note{font-size:.93rem;color:var(--muted);max-width:56ch}
.content-grid > div,.content-grid > aside{display:grid;align-content:start}
.block h3{margin-bottom:1rem}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease, transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
@media (max-width: 980px){
  .hero-grid,.about-layout,.contact-grid,.project-page .content-grid,.services-grid,.metrics-grid,.proof-grid,.project-meta-grid,.portfolio-grid{grid-template-columns:1fr}
  .timeline-shell::before{left:14px;transform:none;top:0;bottom:0}
  .timeline-stack{gap:1rem;padding-left:2.5rem}
  .timeline-item{width:100%}
  .timeline-item.left,.timeline-item.right,.timeline-item:nth-child(2),.timeline-item:nth-child(3),.timeline-item:nth-child(4){margin:0;justify-self:stretch}
  .timeline-item.left .timeline-node,.timeline-item.right .timeline-node{left:-2.2rem;right:auto;top:1.55rem}
  .site-header .inner{align-items:flex-start}
  .hero{padding-top:4rem}
}
@media (max-width: 760px){
  body::before{background-size:46px 46px;opacity:.12}
  .menu-toggle{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:var(--text)}
  .nav-links{display:none;width:100%;flex-direction:column;align-items:stretch;margin-top:.75rem;padding-bottom:.5rem}
  .nav-links.open{display:flex}
  .site-header .inner{display:grid;grid-template-columns:minmax(0,1fr);gap:.85rem;align-items:start}
  .logo{align-items:center;min-width:0}
  .logo img{height:34px;flex:0 0 auto}
  .logo-label{min-width:0}
  .logo-label strong{display:none}
  .logo-label span:last-child{font-size:.78rem;line-height:1.25}
  .header-controls{width:100%;justify-content:space-between}
  .nav-links{order:3}
  .section-head{flex-direction:column;align-items:flex-start}
  .section-head p{max-width:none}
  .contact-form{grid-template-columns:1fr}
  h1{font-size:clamp(2.7rem,13vw,4.4rem)}
  h2{font-size:clamp(2rem,9vw,3rem)}
  p{font-size:.99rem}
  .lead{font-size:1.03rem}
  .profile-frame img{min-height:420px}
  .chip,.kpi-strip span{min-height:36px;font-size:.78rem;padding:.42rem .72rem}
  .project-card{min-height:340px;padding:1.25rem}
  .project-card h3{font-size:1.7rem}
  .project-card .meta{font-size:.86rem}
  .section{padding:4.6rem 0}
}


.header-controls{display:flex;align-items:center;gap:.8rem}
.language-switch{display:flex;align-items:center;gap:.4rem;padding:.3rem;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(9,16,35,.68);backdrop-filter:blur(10px)}
.lang-btn{appearance:none;border:0;background:transparent;color:var(--muted);font:inherit;font-size:.84rem;font-weight:700;letter-spacing:.08em;padding:.55rem .85rem;border-radius:999px;cursor:pointer;transition:.25s ease}
.lang-btn:hover{color:var(--text);background:rgba(255,255,255,.05)}
.lang-btn.active{color:var(--text);background:linear-gradient(135deg,rgba(81,185,255,.24),rgba(197,120,255,.22));box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.timeline-item{margin-bottom:2.25rem}
.project-card .meta span:last-child{font-weight:700}
@media (max-width: 900px){
  .header-controls{margin-left:auto}
  .language-switch{order:1}
}
@media (max-width: 720px){
  .language-switch{padding:.25rem}
  .lang-btn{padding:.48rem .72rem;font-size:.78rem}
  .header-controls{width:100%;gap:.6rem;justify-content:space-between}
}

@media (max-width: 420px){
  .header-controls{flex-wrap:wrap}
  .language-switch{margin-left:auto}
  .menu-toggle{order:2}
}


/* v10 homepage art direction */
.hero-home{
  position:relative;
  padding:5.4rem 0 3.2rem;
  min-height:860px;
  overflow:hidden;
  background:linear-gradient(180deg, #040915 0%, #060c19 100%);
}
.hero-home::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(4,8,16,.18), rgba(4,8,16,.34)),
    radial-gradient(circle at 78% 32%, rgba(255,146,212,.15), transparent 22%),
    radial-gradient(circle at 18% 22%, rgba(94,215,255,.08), transparent 18%);
  pointer-events:none;
  z-index:1;
}
.hero-home::after{
  content:"";
  position:absolute;
  inset:0;
  background:url('hero-cosmic-bg-v2.png') left bottom / cover no-repeat;
  opacity:.98;
  z-index:0;
  transform:translate3d(0, var(--hero-shift, 0px), 0) scale(1.02);
}
.hero-home .container{position:relative;z-index:2}
.hero-coffee{display:none}
.hero-home .hero-grid{
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr);
  gap:2.8rem;
  align-items:center;
}
.hero-home .hero-copy{max-width:660px;padding-top:1.2rem}
.hero-home .hero-kicker{margin-bottom:1rem}
.hero-home .hero-kicker span{
  background:rgba(17,26,50,.54);
  border-color:rgba(255,255,255,.12);
  color:#d8e6ff;
}
.hero-brand{
  font-size:clamp(2.7rem,5vw,4rem);
  max-width:12ch;
  margin-bottom:.85rem;
  letter-spacing:-.05em;
}
.hero-subtitle{
  font-size:clamp(1.22rem,2vw,2rem);
  color:#d9deef;
  margin:0 0 1.25rem;
  line-height:1.24;
  letter-spacing:-.03em;
  max-width:22ch;
}
.hero-home .lead{
  max-width:36ch;
  font-size:1.08rem;
  color:#dbe4f5;
  text-shadow:0 1px 0 rgba(0,0,0,.08);
}
.hero-home .hero-actions{margin-top:1.55rem}
.hero-home .btn.primary{
  color:#fff;
  background:linear-gradient(135deg, rgba(255,156,218,.78), rgba(128,121,255,.76));
  border-color:rgba(255,255,255,.12);
  box-shadow:0 18px 40px rgba(128,121,255,.22);
}
.hero-home .btn.secondary{
  background:rgba(15,23,43,.48);
  border-color:rgba(154,173,255,.22);
}
.hero-visual-home{
  padding:1.1rem;
  background:linear-gradient(180deg, rgba(18,30,55,.44), rgba(12,18,34,.36));
  border:1px solid rgba(172,191,255,.16);
  box-shadow:0 30px 70px rgba(0,0,0,.30), inset 0 0 0 1px rgba(255,255,255,.04);
}
.hero-visual-home::after{content:"";position:absolute;inset:12% 14%;background:radial-gradient(circle, rgba(140,120,255,.22), transparent 62%);filter:blur(38px);z-index:0;pointer-events:none}
.hero-visual-home > *{position:relative;z-index:1}
.profile-frame-home{
  padding:.9rem;
  background:linear-gradient(180deg, rgba(114,135,255,.16), rgba(255,255,255,.03));
  border-color:rgba(173,194,255,.18);
}
.profile-frame-home img{
  min-height:560px;
  aspect-ratio:4/5;
  object-position:center 20%;
  filter:saturate(.92) contrast(1.02);
}
.feature-bar{
  margin-top:2rem;
  padding:1.15rem 1.35rem;
  border-radius:28px;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1rem;
  background:linear-gradient(180deg, rgba(12,20,40,.62), rgba(9,15,30,.44));
  border:1px solid rgba(255,255,255,.08);
}
.feature-item{
  display:flex;
  align-items:flex-start;
  gap:.95rem;
  min-width:0;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
  border-radius:22px;
  padding:.18rem;
}
.feature-icon{
  flex:0 0 auto;
  width:46px;
  height:46px;
  border-radius:16px;
  display:grid;
  place-items:center;
  color:#f8fbff;
  background:linear-gradient(135deg, rgba(96,223,255,.28), rgba(141,156,255,.24) 55%, rgba(255,142,212,.24));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.feature-icon svg{width:22px;height:22px}
.feature-item:hover{transform:translateY(-5px);box-shadow:0 16px 34px rgba(0,0,0,.22);background:rgba(255,255,255,.025)}
.timeline-link{cursor:pointer}
.timeline-link:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.12);box-shadow:0 28px 60px rgba(0,0,0,.34), 0 0 0 1px rgba(255,255,255,.03)}
.timeline-link:hover h3{color:#fff}
.feature-item h4{
  margin:0 0 .2rem;
  font-size:1rem;
  line-height:1.2;
  letter-spacing:-.02em;
}
.feature-item p{
  margin:0;
  font-size:.96rem;
  color:#bfcde6;
  line-height:1.5;
  max-width:24ch;
}
@media (max-width: 980px){
  .hero-home{padding:4.4rem 0 2.5rem;min-height:780px}
  .hero-home .hero-grid{gap:1.4rem}
  .feature-bar{grid-template-columns:1fr;gap:.9rem}
  .profile-frame-home img{min-height:420px}
}
@media (max-width: 760px){
  .hero-home{
    padding:3.5rem 0 2rem;
    min-height:auto;
  }
  .hero-home::after{background-position:left bottom;transform:translate3d(0, var(--hero-shift, 0px), 0)}
  .hero-home .hero-grid{grid-template-columns:1fr}
  .hero-home .hero-copy{
    order:1;
  }
  .hero-visual-home{order:2;max-width:430px;justify-self:center;width:min(100%,430px)}
  .hero-home .hero-copy{max-width:none;padding-top:0}
  .hero-brand{max-width:none}
  .hero-subtitle{max-width:none;font-size:clamp(1.2rem,6vw,1.75rem)}
  .hero-home .lead{max-width:none}
  .hero-coffee{display:none}
  .feature-bar{padding:1rem 1rem 1.1rem}
}

@media (min-width: 1400px){
  .hero-home{min-height:920px}
  .hero-home::after{background-position:left bottom}
}
@media (max-width: 1100px){
  .hero-home::after{background-position:left bottom}
}
@media (max-width: 900px){
  .hero-home .hero-grid{grid-template-columns:1fr}
  .hero-visual-home{
    order:2;
    max-width:430px;
    justify-self:center;
    width:min(100%,430px)
  }
}
@media (max-width: 560px){
  .hero-home::after{background-position:left bottom}
  .hero-brand{font-size:clamp(2.5rem,14vw,3.6rem)}
  .feature-item p{max-width:none}
}

:root{
  --bg:#06111f;
  --bg-deep:#030912;
  --surface:#0d1a2e;
  --surface-2:#101f37;
  --card:#0c1830cc;
  --card-strong:#10203b;
  --line:rgba(255,255,255,.08);
  --text:#f2f6ff;
  --muted:#a8b7d3;
  --muted-2:#8a9bbc;
  --cyan:#56d7ff;
  --blue:#7a89ff;
  --pink:#ff78c8;
  --amber:#ffb46d;
  --radius:28px;
  --shadow:0 20px 70px rgba(0,0,0,.35);
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 18% 16%, rgba(86,215,255,.10), transparent 22%),
    radial-gradient(circle at 80% 8%, rgba(122,137,255,.12), transparent 24%),
    radial-gradient(circle at 52% 74%, rgba(255,120,200,.08), transparent 28%),
    linear-gradient(180deg, #06111f 0%, #04101d 40%, #030912 100%);
  line-height:1.72;
  position:relative;
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;
  background:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(circle at center, black 46%, transparent 92%);
}
body::after{
  content:"";position:fixed;inset:-10%;pointer-events:none;opacity:.35;filter:blur(70px);
  background:
    radial-gradient(circle at 18% 18%, rgba(86,215,255,.14), transparent 20%),
    radial-gradient(circle at 78% 14%, rgba(122,137,255,.18), transparent 22%),
    radial-gradient(circle at 50% 82%, rgba(255,120,200,.10), transparent 20%);
  animation:aurora 16s ease-in-out infinite alternate;
}
@keyframes aurora{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(0,-1.5%,0) scale(1.06)}
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
p{margin:0 0 1rem;color:var(--muted);font-size:1.03rem}
small{display:inline-block;color:var(--cyan);letter-spacing:.18em;text-transform:uppercase;font-weight:800;font-size:.78rem;margin-bottom:.8rem}
h1,h2,h3,h4{margin:0 0 .8rem;line-height:1.06;letter-spacing:-.04em}
h1{font-size:clamp(2.6rem,5.2vw,4.4rem);font-weight:800}
h2{font-size:clamp(1.9rem,3vw,3rem);font-weight:780}
h3{font-size:clamp(1.25rem,1.7vw,1.6rem);font-weight:760}
ul{margin:0}
.container{width:min(calc(100% - 2.2rem),var(--max));margin:0 auto;position:relative;z-index:1}
.section{padding:6.25rem 0;position:relative}
.section.alt-cyan::before,.section.alt-purple::before,.section.alt-amber::before,.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at center, rgba(255,255,255,.02), transparent 58%);
}
.section.alt-cyan{background:linear-gradient(180deg, rgba(86,215,255,.03), transparent 60%)}
.section.alt-purple{background:linear-gradient(180deg, rgba(122,137,255,.05), transparent 62%)}
.section.alt-amber{background:linear-gradient(180deg, rgba(255,180,109,.04), transparent 62%)}
.card,.glass{
  background:linear-gradient(180deg, rgba(18,32,58,.88), rgba(8,17,32,.86));
  border:1px solid rgba(255,255,255,.075);
  box-shadow:var(--shadow);
  backdrop-filter:blur(16px);
}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:52px;padding:0 1.2rem;border-radius:999px;
  font-weight:700;letter-spacing:-.02em;border:1px solid transparent;transition:.22s ease;cursor:pointer;font-size:.98rem
}
.btn:hover{transform:translateY(-1px)}
.btn.primary{
  color:#08111f;
  background:linear-gradient(135deg, #60dfff, #8d9cff 52%, #ff8ed4);
  box-shadow:0 14px 36px rgba(125,136,255,.22);
}
.btn.secondary,.btn.ghost{
  color:var(--text);
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.09);
}
.site-header{
  position:sticky;top:0;z-index:25;
  background:rgba(4,10,18,.62);backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.06)
}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg, transparent, rgba(120,150,255,.38), transparent)}
.site-header .inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0}
.logo{display:flex;align-items:center;gap:.95rem}
.logo img{height:42px;width:auto;filter:drop-shadow(0 6px 18px rgba(86,215,255,.15))}
.logo-label{display:flex;flex-direction:column;line-height:1.15}
.logo-label strong{font-size:1rem;letter-spacing:-.02em}
.logo-label span:last-child{color:var(--muted-2);font-size:.84rem;letter-spacing:.01em}
.nav-links{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.nav-links a{padding:.7rem 1rem;border-radius:999px;color:var(--muted);font-weight:650;font-size:.96rem}
.nav-links a.active,.nav-links a:hover{background:rgba(255,255,255,.06);color:var(--text)}
.menu-toggle{display:none}
.hero{padding:5.2rem 0 5.4rem;position:relative}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:1.6rem;align-items:center}
.hero-copy{max-width:700px}
.hero-kicker{display:flex;align-items:center;gap:.75rem;margin-bottom:.85rem}
.hero-kicker span{
  display:inline-flex;align-items:center;padding:.58rem .86rem;border-radius:999px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);
  font-size:.87rem;color:#dce8ff;font-weight:650
}
.hero-name{margin-bottom:1rem;max-width:10ch;font-size:clamp(3.2rem,8vw,5.9rem)}
.hero-name .accent{
  background:linear-gradient(135deg,var(--cyan),#9ba8ff 56%,#ff93d6);
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.lead{
  font-size:1.13rem;max-width:60ch;color:#cedaf0;line-height:1.75
}
.hero-actions,.hero-highlights,.trust-row{display:flex;gap:.9rem;flex-wrap:wrap}
.hero-actions{margin-top:1.6rem}
.hero-highlights{margin-top:1.4rem}
.hero-highlights span,.trust-row span,.chip,.badge{
  padding:.62rem .9rem;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);
  color:#d9e5fb;font-size:.88rem
}
.trust-row{margin:1.1rem 0 0}
.statement-card{
  padding:1.35rem 1.4rem;border-radius:24px;margin-top:1.1rem;
  background:linear-gradient(135deg, rgba(86,215,255,.10), rgba(122,137,255,.08) 52%, rgba(255,120,200,.08));
  border:1px solid rgba(255,255,255,.09)
}
.statement-card strong{display:block;font-size:1.02rem;letter-spacing:-.015em}
.metrics-grid,.services-grid,.timeline-grid,.portfolio-grid,.proof-grid,.result-grid,.project-grid{display:grid;gap:1.2rem}
.metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:1.9rem}
.metric-card{padding:1.35rem;border-radius:24px;position:relative;overflow:hidden;min-height:154px}
.metric-card::after{
  content:"";position:absolute;inset:auto -30px -45px auto;width:150px;height:150px;border-radius:50%;
  background:radial-gradient(circle, rgba(89,214,255,.16), transparent 64%);
}
.metric-card strong{display:block;font-size:1.8rem;margin-bottom:.45rem;letter-spacing:-.03em}
.metric-card span{color:#d0dbef;font-size:.96rem}
.hero-visual{padding:1.2rem;border-radius:34px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-visual::before{
  content:"";position:absolute;inset:6% 14% auto 14%;height:34%;border-radius:999px;filter:blur(30px);opacity:.55;
  background:linear-gradient(90deg, rgba(86,215,255,.22), rgba(122,137,255,.18), rgba(255,120,200,.16));
}
.profile-frame{
  width:100%;padding:1rem;border-radius:28px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:var(--shadow)
}
.profile-frame img{width:100%;min-height:620px;object-fit:cover;object-position:center 20%;border-radius:22px;background:#0d1728}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:1.2rem;margin-bottom:1.8rem}
.section-head > div{min-width:0}
.section-head p{max-width:56ch;margin:0;color:#c0cde5}
.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;align-items:start}
.about-copy,.skills-panel,.contact-wrap,.project-page,.proof-card,.cta-panel{padding:1.7rem}
.kpi-strip{display:flex;gap:.65rem;flex-wrap:wrap;align-items:flex-start;margin:.4rem 0 0}
.kpi-strip span,.chip{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:.46rem .8rem;border-radius:999px;border:1px solid rgba(255,255,255,.10);font-size:.82rem;color:#e8eeff;line-height:1.15;text-align:center;backdrop-filter:blur(4px)}
.kpi-strip span{background:rgba(255,255,255,.04);font-weight:600}
.chip{background:rgba(255,255,255,.08);font-weight:700}
.skills-list{display:grid;gap:1rem;margin-top:1.05rem}
.skill{display:grid;grid-template-columns:1fr auto;gap:.75rem;align-items:center}
.skill label{font-weight:700;color:var(--text)}
.skill .bar{grid-column:1/-1;height:12px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden}
.skill .bar > span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--cyan),var(--blue),var(--pink))}
.services-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-card{padding:1.55rem;position:relative;overflow:hidden;border-radius:26px}
.service-card::after{
  content:"";position:absolute;inset:auto -55px -65px auto;width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle, rgba(124,140,255,.18), transparent 64%);
}
.service-number{
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-weight:900;margin-bottom:1rem;
  background:linear-gradient(135deg, rgba(89,214,255,.16), rgba(255,121,198,.14));color:var(--text)
}
.proof-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.proof-card h3{margin-bottom:.55rem}
.proof-card{border-radius:24px}
.timeline-shell{position:relative;padding:2rem 0 2.4rem}
.timeline-shell::before{
  content:"";position:absolute;left:50%;transform:translateX(-50%);top:0;bottom:0;width:2px;
  background:linear-gradient(180deg, rgba(86,215,255,.10), rgba(122,137,255,.58), rgba(255,120,200,.14));
  box-shadow:0 0 30px rgba(122,137,255,.16)
}
.timeline-stack{display:grid;gap:1.4rem;position:relative}
.timeline-item{
  width:calc(50% - 3.5rem);padding:1.75rem 1.55rem 1.55rem;border-radius:26px;position:relative;margin:0;min-height:auto;display:block;transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease
}
.timeline-item.left{justify-self:start}
.timeline-item.right{justify-self:end}
.timeline-node{
  position:absolute;top:2.05rem;width:16px;height:16px;border-radius:50%;
  background:linear-gradient(135deg,var(--cyan),var(--pink));
  box-shadow:0 0 0 6px rgba(89,214,255,.10), 0 0 0 1px rgba(255,255,255,.16), 0 0 24px rgba(122,137,255,.18)
}
.timeline-item.left .timeline-node{right:-4rem}
.timeline-item.right .timeline-node{left:-4rem}
.timeline-item:nth-child(2){margin-top:3.2rem}
.timeline-item:nth-child(3){margin-top:.2rem}
.timeline-item:nth-child(4){margin-top:3.2rem}
.timeline-item .period{color:var(--cyan);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;margin-bottom:.72rem}
.timeline-item ul,.block ul{padding-left:1.15rem;color:var(--muted);margin:0}
.timeline-item li + li,.block li + li{margin-top:.55rem}
.hidden-field{position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden}
.contact-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:1rem}
.contact-points{display:grid;gap:1rem}
.contact-point{padding:1.2rem;border-radius:22px}
.contact-point h3{font-size:1.12rem}
.contact-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.contact-form .full{grid-column:1/-1}
.field label{display:block;margin-bottom:.45rem;color:#d9e6ff;font-size:.9rem;font-weight:600}
.field input,.field textarea{
  width:100%;padding:1rem;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.04);color:var(--text);font:inherit
}
.field textarea{min-height:150px;resize:vertical}
.site-footer{padding:2rem 0 3rem;border-top:1px solid rgba(255,255,255,.06);color:var(--muted)}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer-links{display:flex;gap:1rem;flex-wrap:wrap}
.portfolio-toolbar{display:flex;gap:.7rem;flex-wrap:wrap;margin-bottom:1.3rem}
.filter-btn{
  border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:var(--muted);border-radius:999px;padding:.76rem 1rem;cursor:pointer;font:inherit;font-weight:700
}
.filter-btn.active,.filter-btn:hover{color:var(--text);background:rgba(255,255,255,.09)}
.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.project-card{
  position:relative;min-height:390px;padding:1.7rem;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;isolation:isolate;border-radius:30px;gap:.75rem
}
.project-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(6,13,24,.12), rgba(6,13,24,.88));z-index:-1}
.project-card::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg, rgba(89,214,255,.1), rgba(124,140,255,.12) 45%, rgba(255,121,198,.12));mix-blend-mode:screen;z-index:-1}
.project-card .meta{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:auto;padding-top:1rem;width:100%;color:#c8d5eb;font-size:.9rem}
.project-card p{max-width:44ch;margin:0;font-size:1rem;color:#d5def0}
.project-card h3{margin-bottom:0;font-size:2rem}
.project-card > *{max-width:100%}
.chip-row{display:flex;gap:.65rem;flex-wrap:wrap;align-items:flex-start;margin:0 0 .15rem}
.empty-state{text-align:center;padding:2rem;color:var(--muted);display:none}
.project-page .hero-block{padding:1.95rem;border-radius:30px;margin-bottom:1.2rem;overflow:hidden;position:relative}
.project-page .hero-block::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(5,11,20,.16), rgba(5,11,20,.78))}
.project-page .hero-block > *{position:relative;z-index:1}
.project-meta-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.2rem}
.project-meta{padding:1rem;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.project-meta h3{font-size:1.06rem;line-height:1.35;letter-spacing:-.02em}
.project-page .content-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:1.2rem;align-items:start}
.project-page .content-grid .block{padding:1.45rem;border-radius:24px;margin:0 0 1.2rem}
.project-page .content-grid > div:last-child .block:last-child,.project-page .content-grid > aside .block:last-child{margin-bottom:0}
.project-nav{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:1.4rem}
.form-note{font-size:.93rem;color:var(--muted);max-width:56ch}
.content-grid > div,.content-grid > aside{display:grid;align-content:start}
.block h3{margin-bottom:1rem}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease, transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
@media (max-width: 980px){
  .hero-grid,.about-layout,.contact-grid,.project-page .content-grid,.services-grid,.metrics-grid,.proof-grid,.project-meta-grid,.portfolio-grid{grid-template-columns:1fr}
  .timeline-shell::before{left:14px;transform:none;top:0;bottom:0}
  .timeline-stack{gap:1rem;padding-left:2.5rem}
  .timeline-item{width:100%}
  .timeline-item.left,.timeline-item.right,.timeline-item:nth-child(2),.timeline-item:nth-child(3),.timeline-item:nth-child(4){margin:0;justify-self:stretch}
  .timeline-item.left .timeline-node,.timeline-item.right .timeline-node{left:-2.2rem;right:auto;top:1.55rem}
  .site-header .inner{align-items:flex-start}
  .hero{padding-top:4rem}
}
@media (max-width: 760px){
  body::before{background-size:46px 46px;opacity:.12}
  .menu-toggle{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:var(--text)}
  .nav-links{display:none;width:100%;flex-direction:column;align-items:stretch;margin-top:.75rem;padding-bottom:.5rem}
  .nav-links.open{display:flex}
  .site-header .inner{display:grid;grid-template-columns:minmax(0,1fr);gap:.85rem;align-items:start}
  .logo{align-items:center;min-width:0}
  .logo img{height:34px;flex:0 0 auto}
  .logo-label{min-width:0}
  .logo-label strong{display:none}
  .logo-label span:last-child{font-size:.78rem;line-height:1.25}
  .header-controls{width:100%;justify-content:space-between}
  .nav-links{order:3}
  .section-head{flex-direction:column;align-items:flex-start}
  .section-head p{max-width:none}
  .contact-form{grid-template-columns:1fr}
  h1{font-size:clamp(2.7rem,13vw,4.4rem)}
  h2{font-size:clamp(2rem,9vw,3rem)}
  p{font-size:.99rem}
  .lead{font-size:1.03rem}
  .profile-frame img{min-height:420px}
  .chip,.kpi-strip span{min-height:36px;font-size:.78rem;padding:.42rem .72rem}
  .project-card{min-height:340px;padding:1.25rem}
  .project-card h3{font-size:1.7rem}
  .project-card .meta{font-size:.86rem}
  .section{padding:4.6rem 0}
}


.header-controls{display:flex;align-items:center;gap:.8rem}
.language-switch{display:flex;align-items:center;gap:.4rem;padding:.3rem;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(9,16,35,.68);backdrop-filter:blur(10px)}
.lang-btn{appearance:none;border:0;background:transparent;color:var(--muted);font:inherit;font-size:.84rem;font-weight:700;letter-spacing:.08em;padding:.55rem .85rem;border-radius:999px;cursor:pointer;transition:.25s ease}
.lang-btn:hover{color:var(--text);background:rgba(255,255,255,.05)}
.lang-btn.active{color:var(--text);background:linear-gradient(135deg,rgba(81,185,255,.24),rgba(197,120,255,.22));box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.timeline-item{margin-bottom:2.25rem}
.project-card .meta span:last-child{font-weight:700}
@media (max-width: 900px){
  .header-controls{margin-left:auto}
  .language-switch{order:1}
}
@media (max-width: 720px){
  .language-switch{padding:.25rem}
  .lang-btn{padding:.48rem .72rem;font-size:.78rem}
  .header-controls{width:100%;gap:.6rem;justify-content:space-between}
}

@media (max-width: 420px){
  .header-controls{flex-wrap:wrap}
  .language-switch{margin-left:auto}
  .menu-toggle{order:2}
}


/* v10 homepage art direction */
.hero-home{
  position:relative;
  padding:5.4rem 0 3.2rem;
  min-height:860px;
  overflow:hidden;
  background:linear-gradient(180deg, #040915 0%, #060c19 100%);
}
.hero-home::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(4,8,16,.18), rgba(4,8,16,.34)),
    radial-gradient(circle at 78% 32%, rgba(255,146,212,.15), transparent 22%),
    radial-gradient(circle at 18% 22%, rgba(94,215,255,.08), transparent 18%);
  pointer-events:none;
  z-index:1;
}
.hero-home::after{
  content:"";
  position:absolute;
  inset:0;
  background:url('hero-cosmic-bg-v2.png') left bottom / cover no-repeat;
  opacity:.98;
  z-index:0;
  transform:translate3d(0, var(--hero-shift, 0px), 0) scale(1.02);
}
.hero-home .container{position:relative;z-index:2}
.hero-coffee{display:none}
.hero-home .hero-grid{
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.98fr);
  gap:2.8rem;
  align-items:center;
}
.hero-home .hero-copy{max-width:660px;padding-top:1.2rem}
.hero-home .hero-kicker{margin-bottom:1rem}
.hero-home .hero-kicker span{
  background:rgba(17,26,50,.54);
  border-color:rgba(255,255,255,.12);
  color:#d8e6ff;
}
.hero-brand{
  font-size:clamp(2.7rem,5vw,4rem);
  max-width:12ch;
  margin-bottom:.85rem;
  letter-spacing:-.05em;
}
.hero-subtitle{
  font-size:clamp(1.22rem,2vw,2rem);
  color:#d9deef;
  margin:0 0 1.25rem;
  line-height:1.24;
  letter-spacing:-.03em;
  max-width:22ch;
}
.hero-home .lead{
  max-width:36ch;
  font-size:1.08rem;
  color:#dbe4f5;
  text-shadow:0 1px 0 rgba(0,0,0,.08);
}
.hero-home .hero-actions{margin-top:1.55rem}
.hero-home .btn.primary{
  color:#fff;
  background:linear-gradient(135deg, rgba(255,156,218,.78), rgba(128,121,255,.76));
  border-color:rgba(255,255,255,.12);
  box-shadow:0 18px 40px rgba(128,121,255,.22);
}
.hero-home .btn.secondary{
  background:rgba(15,23,43,.48);
  border-color:rgba(154,173,255,.22);
}
.hero-visual-home{
  padding:1.1rem;
  background:linear-gradient(180deg, rgba(18,30,55,.44), rgba(12,18,34,.36));
  border:1px solid rgba(172,191,255,.16);
  box-shadow:0 30px 70px rgba(0,0,0,.30), inset 0 0 0 1px rgba(255,255,255,.04);
}
.hero-visual-home::after{content:"";position:absolute;inset:12% 14%;background:radial-gradient(circle, rgba(140,120,255,.22), transparent 62%);filter:blur(38px);z-index:0;pointer-events:none}
.hero-visual-home > *{position:relative;z-index:1}
.profile-frame-home{
  padding:.9rem;
  background:linear-gradient(180deg, rgba(114,135,255,.16), rgba(255,255,255,.03));
  border-color:rgba(173,194,255,.18);
}
.profile-frame-home img{
  min-height:560px;
  aspect-ratio:4/5;
  object-position:center 20%;
  filter:saturate(.92) contrast(1.02);
}
.feature-bar{
  margin-top:2rem;
  padding:1.15rem 1.35rem;
  border-radius:28px;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:1rem;
  background:linear-gradient(180deg, rgba(12,20,40,.62), rgba(9,15,30,.44));
  border:1px solid rgba(255,255,255,.08);
}
.feature-item{
  display:flex;
  align-items:flex-start;
  gap:.95rem;
  min-width:0;
  transition:transform .25s ease, box-shadow .25s ease, background .25s ease;
  border-radius:22px;
  padding:.18rem;
}
.feature-icon{
  flex:0 0 auto;
  width:46px;
  height:46px;
  border-radius:16px;
  display:grid;
  place-items:center;
  color:#f8fbff;
  background:linear-gradient(135deg, rgba(96,223,255,.28), rgba(141,156,255,.24) 55%, rgba(255,142,212,.24));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.feature-icon svg{width:22px;height:22px}
.feature-item:hover{transform:translateY(-5px);box-shadow:0 16px 34px rgba(0,0,0,.22);background:rgba(255,255,255,.025)}
.timeline-link{cursor:pointer}
.timeline-link:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.12);box-shadow:0 28px 60px rgba(0,0,0,.34), 0 0 0 1px rgba(255,255,255,.03)}
.timeline-link:hover h3{color:#fff}
.feature-item h4{
  margin:0 0 .2rem;
  font-size:1rem;
  line-height:1.2;
  letter-spacing:-.02em;
}
.feature-item p{
  margin:0;
  font-size:.96rem;
  color:#bfcde6;
  line-height:1.5;
  max-width:24ch;
}
@media (max-width: 980px){
  .hero-home{padding:4.4rem 0 2.5rem;min-height:780px}
  .hero-home .hero-grid{gap:1.4rem}
  .feature-bar{grid-template-columns:1fr;gap:.9rem}
  .profile-frame-home img{min-height:420px}
}
@media (max-width: 760px){
  .hero-home{
    padding:3.5rem 0 2rem;
    min-height:auto;
  }
  .hero-home::after{background-position:left bottom;transform:translate3d(0, var(--hero-shift, 0px), 0)}
  .hero-home .hero-grid{grid-template-columns:1fr}
  .hero-home .hero-copy{
    order:1;
  }
  .hero-visual-home{
    order:2;
    max-width:430px;
    justify-self:center;
    width:min(100%,430px);
    margin-top:1.2rem;
  }
  .hero-home .hero-copy{max-width:none;padding-top:0}
  .hero-brand{max-width:none}
  .hero-subtitle{max-width:none;font-size:clamp(1.2rem,6vw,1.75rem)}
  .hero-home .lead{max-width:none}
  .hero-coffee{display:none}
  .feature-bar{padding:1rem 1rem 1.1rem}
}

@media (min-width: 1400px){
  .hero-home{min-height:920px}
  .hero-home::after{background-position:left bottom}
}
@media (max-width: 1100px){
  .hero-home::after{background-position:left bottom}
}
@media (max-width: 900px){
  .hero-home .hero-grid{grid-template-columns:1fr}
  .hero-visual-home{max-width:430px;justify-self:center;width:min(100%,430px)}
  .hero-home .hero-copy{max-width:none}
}
@media (max-width: 560px){
  .hero-home::after{background-position:left bottom}
  .hero-brand{font-size:clamp(2.5rem,14vw,3.6rem)}
  .feature-item p{max-width:none}
}
.project-meta small{
  display:inline-flex;
  align-items:center;
  padding:.32rem .7rem;
  margin-bottom:.55rem;

  color:#8fe7ff;
  background:rgba(86,215,255,.14);
  border:1px solid rgba(86,215,255,.34);
  border-radius:999px;

  font-size:.72rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1;

  box-shadow:0 0 10px rgba(86,215,255,.18);
}
/* v12 case study readability polish */
.project-page{
  padding:0;
}
.project-page .hero-block{
  padding:2.2rem 2rem 1.8rem;
  margin-bottom:1rem;
  border-radius:32px;
  overflow:hidden;
  box-shadow:0 22px 60px rgba(0,0,0,.26);
}
.project-page .hero-block::before{
  background:linear-gradient(180deg, rgba(5,11,20,.22), rgba(5,11,20,.80));
}
.project-page .hero-block h1{
  max-width:11ch;
  margin-bottom:.7rem;
  line-height:.94;
  letter-spacing:-.05em;
}
.project-page .hero-block > p{
  max-width:42ch;
  margin-bottom:0;
  color:#d4dff3;
  font-size:1.03rem;
}
.project-meta-grid{
  gap:.9rem;
  margin-top:1.35rem;
}
.project-meta{
  min-height:132px;
  padding:1rem 1rem 1.05rem;
  border-radius:22px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  background:linear-gradient(180deg, rgba(14,26,50,.84), rgba(8,16,30,.90));
  border:1px solid rgba(86,215,255,.22);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
  backdrop-filter:blur(10px);
}
.project-meta small{
  display:inline-flex;
  align-items:center;
  align-self:flex-start;
  padding:.28rem .62rem;
  margin-bottom:.8rem;
  border-radius:999px;
  color:#8fe7ff;
  background:rgba(86,215,255,.10);
  border:1px solid rgba(86,215,255,.28);
  font-size:.72rem;
  letter-spacing:.14em;
  line-height:1;
  box-shadow:none;
}
.project-meta h3{
  margin:0;
  max-width:20ch;
  color:#f4f7ff;
  font-size:1.12rem;
  line-height:1.28;
  letter-spacing:-.03em;
}
.project-page .content-grid{
  grid-template-columns:minmax(0,1.04fr) minmax(300px,.96fr);
  gap:1rem;
}
.project-page .content-grid > div,
.project-page .content-grid > aside{
  gap:1rem;
}
.project-page .content-grid .block{
  padding:1.45rem 1.4rem 1.5rem;
  margin:0;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(13,25,48,.94), rgba(6,14,26,.92));
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 14px 36px rgba(0,0,0,.22);
}
.project-page .content-grid .block small{
  margin-bottom:.7rem;
  color:#70ddff;
  font-size:.76rem;
  letter-spacing:.16em;
}
.project-page .content-grid .block h3{
  margin-bottom:.85rem;
  font-size:clamp(1.4rem,1.8vw,1.9rem);
  line-height:1.04;
  letter-spacing:-.045em;
}
.project-page .content-grid .block p,
.project-page .content-grid .block li{
  color:#c7d4ea;
  font-size:1rem;
  line-height:1.72;
}
.project-page .content-grid .block p + p{
  margin-top:.95rem;
}
.project-page .content-grid .block ul{
  padding-left:1.08rem;
}
.project-page .content-grid .block li + li{
  margin-top:.7rem;
}
.project-page .content-grid > div > .block:first-child h3,
.project-page .content-grid > aside > .block:first-child h3{
  font-size:clamp(1.75rem,2.3vw,2.35rem);
  max-width:14ch;
}
.project-nav{
  margin-top:1.1rem;
  padding-top:.2rem;
}
@media (max-width: 980px){
  .project-page .hero-block{
    padding:1.7rem 1.35rem 1.35rem;
  }
  .project-page .hero-block h1{
    max-width:none;
  }
  .project-meta{
    min-height:auto;
  }
  .project-page .content-grid{
    grid-template-columns:1fr;
    gap:.95rem;
  }
}
@media (max-width: 760px){
  .project-page .hero-block h1{
    font-size:clamp(2.15rem,11vw,3rem) !important;
  }
  .project-page .hero-block > p{
    font-size:.98rem;
  }
  .project-page .content-grid .block{
    padding:1.2rem 1.08rem 1.25rem;
  }
  .project-page .content-grid .block h3{
    font-size:clamp(1.28rem,7vw,1.7rem);
  }
  .project-page .content-grid > div > .block:first-child h3,
  .project-page .content-grid > aside > .block:first-child h3{
    font-size:clamp(1.45rem,8vw,1.9rem);
    max-width:none;
  }
}

/* .project-page .hero-block h1, */
.project-page .hero-block h2,
.project-page .content-grid .block h1,
.project-page .content-grid .block h2,
.project-page .content-grid .block h3{
  font-size:clamp(1.2rem, 2.15rem, 2rem) !important;
  line-height:1.12 !important;
  letter-spacing:-.02em !important;
  max-width:30ch !important;
}

.impact-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:.35rem;
}

.impact-list li{
  font-size:.95rem;
  line-height:1.35;
  color:#e3ebff;
  position:relative;
  padding-left:.9rem;
  font-weight:600;
}

.impact-list li::before{
  content:"•";
  position:absolute;
  left:0;
  color:var(--cyan);
  font-weight:900;
  font-size:.85rem;
}

.impact-list strong{
  font-weight:700;
  color:#ffffff;
}

/* v13 polish overrides */
.contact-point.card{display:block;text-decoration:none}
.impact-list{list-style:none;padding:0;margin:0;display:grid;gap:.3rem}
.impact-list li{position:relative;padding-left:.9rem;font-size:.95rem;line-height:1.35;color:#e3ebff}
.impact-list li::before{content:"•";position:absolute;left:0;color:var(--cyan);font-weight:900}
.impact-list strong{color:#fff;font-weight:700}
.timeline-item:nth-child(5){margin-top:.2rem}
@media (max-width: 760px){
  .hero-home .hero-grid{display:grid;grid-template-columns:1fr;grid-template-areas:"copy" "visual";gap:1.2rem}
  .hero-home .hero-copy{grid-area:copy;order:unset;max-width:none;padding-top:0}
  .hero-visual-home{grid-area:visual;order:unset;max-width:430px;justify-self:center;width:min(100%,430px);margin-top:.75rem}
  .footer-grid{grid-template-columns:1fr;gap:1.5rem}
  .footer-brand img{height:96px}
}
@media (max-width: 900px){
  .hero-home .hero-grid{display:grid;grid-template-columns:1fr;grid-template-areas:"copy" "visual"}
  .hero-home .hero-copy{grid-area:copy;max-width:none}
  .hero-visual-home{grid-area:visual;max-width:430px;justify-self:center;width:min(100%,430px)}
  .footer-grid{grid-template-columns:1fr}
}