/* venkateshgardas.com · shared styles
   Design language: boxed grid, bold hairlines, flat saturated panels.
   Reference is C40's layout logic. All colours come from the tokens below. */

:root{
  --white:#FFFFFF;
  --paper:#F7F5F0;
  --ink:#121212;
  --blue:#0DAEE9;   /* primary sky blue: hero, contact, PitStop */
  --yellow:#FFC845; /* Saathi */
  --green:#2E9E63;  /* Roko */
  --pink:#F2CCC0;   /* illustration panel */
  --dim:#5A5A55;
  --line:2px solid var(--ink);
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Instrument Sans",system-ui,sans-serif;
  font-size:1rem;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:2px;}
img{max-width:100%;display:block;}

.mono{
  font-family:"Space Mono",ui-monospace,monospace;
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}

/* ---- frame ---- */
.frame{
  width:min(1180px,94vw);
  margin:2rem auto 3.5rem;
  border:var(--line);
  background:var(--white);
}
.row{display:grid;border-bottom:var(--line);}
.row:last-child{border-bottom:0;}
.cell{border-right:var(--line);padding:1.5rem 1.4rem;min-width:0;}
.cell:last-child{border-right:0;}

/* ---- masthead ---- */
.masthead{grid-template-columns:auto 1fr auto;align-items:stretch;}
.masthead .mark{
  display:flex;align-items:center;
  font-family:"Archivo",sans-serif;
  font-weight:800;font-size:1.3rem;letter-spacing:-.03em;
  padding:.9rem 1.3rem;text-decoration:none;
}
.masthead .nav{
  display:flex;align-items:center;justify-content:flex-end;
  gap:1.6rem;padding:.9rem 1.3rem;flex-wrap:wrap;
}
.masthead .nav a{
  text-decoration:none;color:var(--dim);
  padding-bottom:2px;border-bottom:2px solid transparent;
  transition:color .15s,border-color .15s;
}
.masthead .nav a:hover,.masthead .nav a[aria-current]{color:var(--ink);border-bottom-color:var(--ink);}
.masthead .cv{
  display:flex;align-items:center;
  background:var(--ink);color:var(--white);
  text-decoration:none;padding:.9rem 1.5rem;
  font-family:"Space Mono",monospace;font-size:.68rem;
  letter-spacing:.14em;text-transform:uppercase;
  transition:background .15s;
}
.masthead .cv:hover{background:var(--blue);color:var(--ink);}

/* ---- hero (home) ---- */
.hero{grid-template-columns:1.05fr 1fr;}
.hero .lead{background:var(--blue);padding:3rem 2rem 2.6rem;}
.hero .lead .mono{display:block;margin-bottom:1.8rem;}
.hero h1{
  font-family:"Archivo",sans-serif;
  font-weight:800;
  font-size:clamp(2.8rem,7.2vw,4.8rem);
  line-height:.92;letter-spacing:-.04em;
  margin:0 0 1.4rem;
}
.hero .say{font-size:clamp(1.05rem,1.9vw,1.25rem);line-height:1.45;max-width:34ch;margin:0 0 .9rem;}
.hero .say.sub{font-size:1rem;color:rgba(18,18,18,.78);margin:0;}
.hero .art{background:var(--pink);padding:0;display:flex;}
.hero .art svg{width:100%;height:100%;min-height:340px;}

/* ---- page hero (detail pages) ---- */
.phero{grid-template-columns:1.1fr 1fr;}
.phero .lead{padding:2.8rem 2rem 2.4rem;}
.phero .lead .mono{display:block;margin-bottom:1.4rem;}
.phero h1{
  font-family:"Archivo",sans-serif;font-weight:800;
  font-size:clamp(2.4rem,6vw,3.8rem);
  line-height:.95;letter-spacing:-.035em;margin:0 0 1rem;
}
.phero .say{font-size:clamp(1.05rem,1.8vw,1.2rem);line-height:1.45;max-width:36ch;margin:0;}
.on-blue{background:var(--blue);}
.on-yellow{background:var(--yellow);}
.on-green{background:var(--green);color:var(--paper);}
.on-green .mono{color:rgba(247,245,240,.75);}

/* spec plate */
.plate{padding:0;display:flex;flex-direction:column;background:var(--white);color:var(--ink);}
.plate .phead{border-bottom:var(--line);padding:.7rem 1.2rem;background:var(--paper);color:var(--dim);}
.plate dl{margin:0;flex:1;display:flex;flex-direction:column;}
.plate .prow{
  display:grid;grid-template-columns:7.6rem 1fr;
  gap:.9rem;align-items:baseline;
  padding:.85rem 1.2rem;
  border-bottom:1px solid rgba(18,18,18,.18);
}
.plate .prow:last-child{border-bottom:0;}
.plate dt{color:var(--dim);}
.plate dd{margin:0;font-size:.94rem;font-weight:500;}
.on{display:inline-flex;align-items:center;gap:.45rem;font-weight:500;}
.on::before{content:"";width:8px;height:8px;background:var(--green);animation:blink 2.6s ease-in-out infinite;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}

/* ---- action strip ---- */
.strip{grid-template-columns:1fr auto;align-items:center;background:var(--paper);}
.strip .lbl{color:var(--dim);padding:1rem 1.4rem;}
.strip .acts{display:flex;gap:.6rem;padding:.85rem 1.1rem;flex-wrap:wrap;}
.btn{
  font-family:"Space Mono",monospace;font-size:.68rem;
  letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;padding:.65rem 1.05rem;
  border:var(--line);background:transparent;
  transition:background .15s,color .15s;
}
.btn.fill{background:var(--ink);color:var(--white);}
.btn.fill:hover{background:var(--blue);color:var(--ink);border-color:var(--ink);}
.btn.line:hover{background:var(--ink);color:var(--white);}

/* ---- section headers ---- */
.shead{grid-template-columns:auto 1fr;align-items:center;background:var(--paper);}
.shead .n{padding:.75rem 1.2rem;color:var(--dim);}
.shead h2{
  font-family:"Archivo",sans-serif;font-weight:700;
  font-size:1.15rem;letter-spacing:-.015em;
  margin:0;padding:.75rem 1.2rem;
}

/* ---- ventures ---- */
.grid2{grid-template-columns:1fr 1fr;}
.grid3{grid-template-columns:repeat(3,1fr);}
a.vent{display:flex;text-decoration:none;}
.vent{flex-direction:column;gap:.55rem;padding:1.8rem 1.5rem;transition:transform .15s;}
.vent .top{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;}
.vent h3{
  font-family:"Archivo",sans-serif;font-weight:700;
  font-size:1.5rem;letter-spacing:-.025em;margin:0;
}
.vent p{margin:0;font-size:.95rem;line-height:1.5;}
.vent .go{
  font-family:"Space Mono",monospace;font-size:.68rem;
  letter-spacing:.12em;text-transform:uppercase;
  margin-top:auto;padding-top:1rem;font-weight:700;
}
a.vent:hover .go{text-decoration:underline;}
.tag{
  font-family:"Space Mono",monospace;font-size:.62rem;
  letter-spacing:.14em;text-transform:uppercase;
  border:2px solid currentColor;padding:.22rem .5rem;white-space:nowrap;
}

/* ---- work cells ---- */
a.job{display:block;text-decoration:none;}
.job{padding:1.8rem 1.5rem;}
.job .mono{color:var(--dim);display:block;margin-bottom:.9rem;}
.job h3{font-family:"Archivo",sans-serif;font-weight:700;font-size:1.35rem;letter-spacing:-.02em;margin:0 0 .2rem;}
.job .role{display:block;font-size:.9rem;font-weight:500;color:var(--dim);margin-bottom:.7rem;}
.job p{margin:0;font-size:.95rem;}
.job .go{
  font-family:"Space Mono",monospace;font-size:.68rem;
  letter-spacing:.12em;text-transform:uppercase;
  display:inline-block;margin-top:1rem;font-weight:700;
}
a.job:hover .go{text-decoration:underline;}

/* ---- notes ---- */
.note{padding:1.6rem 1.4rem;}
.note .mono{color:var(--dim);}
.note h3{font-family:"Archivo",sans-serif;font-weight:700;font-size:1.1rem;letter-spacing:-.015em;margin:.6rem 0 .45rem;}
.note p{margin:0;font-size:.92rem;color:var(--dim);}

/* ---- numbered feature list (detail pages) ---- */
.feat{grid-template-columns:auto 1fr;align-items:start;}
.feat .n{
  padding:1.3rem 1.2rem;color:var(--dim);
  font-family:"Space Mono",monospace;font-size:.68rem;letter-spacing:.14em;
}
.feat .body{padding:1.3rem 1.4rem;}
.feat h3{font-family:"Archivo",sans-serif;font-weight:700;font-size:1.05rem;letter-spacing:-.015em;margin:0 0 .3rem;}
.feat p{margin:0;font-size:.93rem;color:var(--dim);}

/* ---- prose block ---- */
.prose{padding:2rem 1.8rem;max-width:72ch;}
.prose p{margin:0 0 1rem;font-size:1.02rem;}
.prose p:last-child{margin-bottom:0;}
.prose .mono{color:var(--dim);display:block;margin-bottom:1rem;}

/* ---- screens ---- */
.screens{grid-template-columns:repeat(3,1fr);background:var(--paper);}
.screens.two{grid-template-columns:1fr 1fr;}
.shot{padding:1.6rem;display:flex;flex-direction:column;gap:.9rem;}
.shot .cap{color:var(--dim);}
.phone{
  border:var(--line);background:var(--white);
  width:min(100%,300px);margin:0 auto;
}
.phone img{width:100%;}

/* browser-style mock frame */
.mockwin{border:var(--line);background:var(--white);font-size:.8rem;line-height:1.45;width:100%;max-width:340px;margin:0 auto;}
.mockwin .bar{display:flex;gap:6px;padding:.55rem .7rem;border-bottom:var(--line);background:var(--paper);}
.mockwin .bar i{width:9px;height:9px;border:2px solid var(--ink);display:block;}
.mock-pad{padding:1rem;}
.mock-h{font-family:"Archivo",sans-serif;font-weight:700;font-size:.95rem;margin:0 0 .7rem;letter-spacing:-.01em;}
.shot{align-items:stretch;}
.shot .cap{margin-top:auto;}
.mstats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.45rem;margin-bottom:.7rem;}
.mstat{border:2px solid var(--ink);padding:.45rem .5rem;}
.mstat b{display:block;font-family:"Archivo",sans-serif;font-size:.95rem;letter-spacing:-.01em;}
.mstat span{font-size:.6rem;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;font-family:"Space Mono",monospace;}
.mbars{display:flex;align-items:flex-end;gap:4px;height:52px;border-bottom:2px solid var(--ink);margin-bottom:.35rem;}
.mbars i{flex:1;background:var(--blue);display:block;}
.mrow{display:flex;justify-content:space-between;gap:.6rem;padding:.4rem 0;border-bottom:1px solid rgba(18,18,18,.15);}
.mrow:last-child{border-bottom:0;}
.mrow .money{font-weight:700;white-space:nowrap;}
.chip{
  display:inline-block;border:2px solid var(--ink);
  font-family:"Space Mono",monospace;font-size:.5rem;
  letter-spacing:.1em;text-transform:uppercase;padding:.1rem .35rem;
}
.chip.y{background:var(--yellow);}
.chip.b{background:var(--blue);}
.mbtn{
  display:block;text-align:center;background:var(--ink);color:var(--white);
  font-family:"Space Mono",monospace;font-size:.6rem;letter-spacing:.12em;
  text-transform:uppercase;padding:.55rem;margin-top:.6rem;
}
.mqr{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;width:64px;margin:.6rem auto 0;}
.mqr i{background:var(--ink);aspect-ratio:1;display:block;}
.mqr i.o{background:transparent;}

/* ---- contact ---- */
.contact{background:var(--blue);padding:3.2rem 1.8rem;text-align:center;}
.contact .mono{color:rgba(18,18,18,.65);}
.contact h2{
  font-family:"Archivo",sans-serif;font-weight:800;
  font-size:clamp(1.9rem,5.5vw,3rem);letter-spacing:-.035em;
  margin:.7rem 0 .7rem;line-height:1;
}
.contact p{margin:0 auto 1.5rem;max-width:44ch;font-size:1rem;}
.contact .mail{
  font-family:"Space Mono",monospace;
  font-size:clamp(.9rem,3vw,1.35rem);
  text-decoration:none;border-bottom:3px solid var(--ink);
  padding-bottom:3px;word-break:break-word;font-weight:700;
}

/* ---- socials / footer ---- */
.socials{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-top:1.6rem;}
.socials a{
  font-family:"Space Mono",monospace;font-size:.68rem;
  letter-spacing:.14em;text-transform:uppercase;
  text-decoration:none;border:var(--line);padding:.55rem .9rem;
  transition:background .15s,color .15s;
}
.socials a:hover{background:var(--ink);color:var(--white);}
.foot{grid-template-columns:1fr auto;background:var(--paper);align-items:center;}
.foot .who{padding:.85rem 1.3rem;color:var(--dim);}
.foot .links{display:flex;gap:1.2rem;padding:.85rem 1.3rem;flex-wrap:wrap;}
.foot .links a{color:var(--dim);text-decoration:none;}
.foot .links a:hover{color:var(--ink);text-decoration:underline;}

/* ---- brand wordmarks ---- */
.wall{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center;padding:1.6rem 1.5rem;}
.wall .lbl{color:var(--dim);margin-right:.6rem;}
.wm{
  font-family:"Archivo",sans-serif;font-weight:800;
  font-size:1.05rem;letter-spacing:-.01em;
  padding:.55rem 1.05rem;border:var(--line);
  white-space:nowrap;
}
.wm.kpmg{background:#00338D;color:#FFFFFF;}
.wm.bajaj{background:#0066B3;color:#FFFFFF;}
.wm.akasa{background:#FF6300;color:#FFFFFF;}
.wm.plain{background:var(--white);}

/* ---- toolkit chips ---- */
.tools{background:var(--white);}
.tools .set{display:flex;gap:.55rem;flex-wrap:wrap;padding:1.4rem 1.5rem;}
.tchip{
  font-family:"Space Mono",monospace;font-size:.68rem;
  letter-spacing:.12em;text-transform:uppercase;
  border:var(--line);padding:.5rem .85rem;background:var(--paper);
}

/* ---- colophon ---- */
.colophon{background:var(--paper);padding:1.8rem 1.8rem;}
.colophon p{margin:0;max-width:64ch;font-size:.92rem;color:var(--dim);}
.colophon .mono{display:block;color:var(--dim);margin-bottom:.7rem;}

/* back link on detail pages */
.crumb{background:var(--paper);}
.crumb a{
  display:inline-block;text-decoration:none;color:var(--dim);
  font-family:"Space Mono",monospace;font-size:.68rem;
  letter-spacing:.14em;text-transform:uppercase;padding:.7rem 1.3rem;
}
.crumb a:hover{color:var(--ink);}
.crumb{padding:0;}

/* ---- reveal ---- */
.rv{opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease;}
.rv.in{opacity:1;transform:none;}

@media (max-width:860px){
  .hero,.phero,.grid2,.grid3,.strip,.foot,.screens,.screens.two{grid-template-columns:1fr;}
  .masthead{grid-template-columns:1fr auto;}
  .masthead .nav{grid-column:1 / -1;justify-content:flex-start;gap:1.2rem;border-top:var(--line);}
  .cell{border-right:0;border-bottom:var(--line);}
  .row > .cell:last-child{border-bottom:0;}
  .feat{grid-template-columns:auto 1fr;}
  .feat .n{border-bottom:0;}
  .strip .acts{padding:1rem 1.4rem;}
  .frame{width:100%;margin:0;border-left:0;border-right:0;}
  .hero .art svg{min-height:280px;}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;}
  .rv{opacity:1;transform:none;}
}