/*
Theme Name: Aayush Goud Portfolio
Theme URI: http://aayushgoud.net
Author: Aayush Goud
Description: Dark bento-grid portfolio theme — faithful WordPress port of the original Next.js design.
Version: 2.0
*/

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@300;400;500;600&family=EB+Garamond:ital,wght@0,400;0,500;1,400;1,500&display=swap');

/* ── Reset ───────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}

/* ── Base ────────────────────────────────────────────────────────────── */
body{
  background-color:#111111;
  color:#e5e7eb;
  font-family:'Inter',system-ui,sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  min-height:100vh;
}

/* ── Site Nav ────────────────────────────────────────────────────────── */
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:100;
  padding:0 2rem;
  height:3.5rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(17,17,17,0.85);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(44,44,44,0.6);
}

.site-name{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-weight:600;
  font-size:1rem;
  color:#ffffff;
  letter-spacing:-0.01em;
}

.site-name a{color:inherit;text-decoration:none}

.main-nav ul{
  list-style:none;
  display:flex;
  align-items:center;
  gap:0.25rem;
}

.main-nav a{
  font-size:0.875rem;
  font-weight:500;
  color:#9ca3af;
  padding:0.375rem 0.75rem;
  border-radius:0.5rem;
  transition:color 0.2s,background 0.2s;
}

.main-nav a:hover,
.main-nav .current-menu-item a{
  color:#ffffff;
  background:rgba(255,255,255,0.06);
}

/* Mobile nav toggle */
.nav-toggle{
  display:none;
  background:transparent;
  border:1px solid #333;
  color:#9ca3af;
  border-radius:0.5rem;
  padding:0.375rem 0.625rem;
  cursor:pointer;
  font-size:1.25rem;
  line-height:1;
  transition:all 0.2s;
}
.nav-toggle:hover{border-color:#fff;color:#fff}

@media(max-width:767px){
  .nav-toggle{display:block}
  .main-nav{
    position:fixed;
    top:3.5rem;left:0;right:0;
    background:rgba(17,17,17,0.98);
    border-bottom:1px solid #2c2c2c;
    padding:1rem 1.5rem 1.5rem;
    transform:translateY(-120%);
    opacity:0;
    transition:transform 0.3s ease,opacity 0.3s ease;
    z-index:99;
  }
  .main-nav.is-open{transform:translateY(0);opacity:1}
  .main-nav ul{flex-direction:column;align-items:flex-start;gap:0.125rem}
  .main-nav a{display:block;padding:0.625rem 0.75rem;width:100%}
}

/* ── Page Wrapper ────────────────────────────────────────────────────── */
.page-wrapper{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:5rem 1rem 2rem;
}

@media(min-width:768px){.page-wrapper{padding:5.5rem 2rem 3rem}}

/* ── Bento Grid ──────────────────────────────────────────────────────── */
.bento-grid{
  max-width:1400px;
  width:100%;
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  grid-auto-rows:minmax(180px,auto);
}

@media(min-width:768px){
  .bento-grid{grid-template-columns:repeat(3,1fr)}
}
@media(min-width:1024px){
  .bento-grid{grid-template-columns:repeat(4,1fr)}
}

/* ── Card Base ───────────────────────────────────────────────────────── */
.card{
  background:#171717;
  border:1px solid #2c2c2c;
  border-radius:1.5rem;
  padding:2rem;
  position:relative;
  overflow:hidden;
  transition:border-color 0.3s ease;
}
.card:hover{border-color:#3c3c3c}

/* ── Hero Card ───────────────────────────────────────────────────────── */
.hero-card{
  display:flex;
  flex-direction:column;
  gap:2rem;
  align-items:center;
}

@media(min-width:768px){
  .hero-card{
    grid-column:span 3;
    flex-direction:row;
    align-items:flex-start;
    justify-content:space-between;
  }
}

.hero-text{flex:1;z-index:10;padding:1rem 0}

.hero-label{
  color:#6b7280;
  font-weight:500;
  font-size:0.875rem;
  margin-bottom:0.5rem;
  letter-spacing:0.01em;
}

.hero-title{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:clamp(1.75rem,4vw,3rem);
  font-weight:500;
  line-height:1.15;
  color:#e5e7eb;
  margin-bottom:2rem;
}
.hero-title strong{color:#ffffff;font-weight:600}

.hero-buttons{display:flex;gap:0.75rem;align-items:center;flex-wrap:wrap}

.btn-pill{
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  padding:0.625rem 1.5rem;
  border-radius:9999px;
  border:1px solid #333;
  background:transparent;
  color:#e5e7eb;
  font-size:0.9375rem;
  font-weight:500;
  text-decoration:none;
  transition:all 0.3s ease;
}
.btn-pill:hover{border-color:#fff;background:#fff;color:#000}

.btn-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.5rem;height:2.5rem;
  border-radius:9999px;
  border:1px solid #333;
  background:transparent;
  color:#9ca3af;
  text-decoration:none;
  transition:all 0.3s ease;
}
.btn-icon:hover{border-color:#fff;background:#fff;color:#000}
.btn-icon svg{width:1.25rem;height:1.25rem}

.hero-photo-wrap{
  width:100%;max-width:320px;
  aspect-ratio:4/5;
  position:relative;
  border-radius:1rem;
  overflow:hidden;
  border:1px solid rgba(44,44,44,0.5);
  box-shadow:0 25px 50px -12px rgba(0,0,0,0.5);
  flex-shrink:0;
}
.hero-photo-wrap img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform 0.7s ease;
}
.hero-card:hover .hero-photo-wrap img{transform:scale(1.05)}

.hero-glow{
  position:absolute;
  top:0;right:0;
  width:600px;height:600px;
  background:rgba(59,130,246,0.05);
  border-radius:50%;
  filter:blur(120px);
  transform:translate(50%,-50%);
  pointer-events:none;
}

/* ── About Card ──────────────────────────────────────────────────────── */
@media(min-width:1024px){.about-card{grid-row:span 2}}

.about-card{display:flex;flex-direction:column}

.card-title{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:1.25rem;
  font-weight:500;
  color:#fff;
  margin-bottom:1.5rem;
}

.about-body{
  display:flex;flex-direction:column;
  gap:1.5rem;
  color:#9ca3af;
  font-weight:300;
  line-height:1.7;
  flex:1;
}

.about-quote{
  font-family:'EB Garamond',Georgia,serif;
  font-style:italic;
  font-size:1.5rem;
  color:rgba(255,255,255,0.8);
  line-height:1.3;
  margin:0.5rem 0;
}

.about-location{margin-top:auto;padding-top:1rem}
.about-location-label{
  font-size:0.75rem;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:#4b5563;
  font-weight:500;
}
.about-location-value{color:#fff;margin-top:0.25rem}

/* ── Contact Card ────────────────────────────────────────────────────── */
.contact-card{display:flex;flex-direction:column;justify-content:space-between}

.contact-title{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:1.125rem;font-weight:500;
  color:#fff;margin-bottom:0.25rem;
}

.contact-email{
  font-size:0.875rem;color:#9ca3af;
  text-decoration:none;transition:color 0.2s;
}
.contact-email:hover{color:#fff}

.connect-section{margin-top:2rem}
.connect-label{
  font-size:0.75rem;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:#4b5563;font-weight:500;
  margin-bottom:0.75rem;
}

.connect-links{display:flex;flex-direction:column;gap:0.5rem}

.connect-link{
  display:flex;align-items:center;justify-content:space-between;
  color:#9ca3af;font-size:0.875rem;
  padding:0.125rem 0;transition:color 0.2s;
}
.connect-link:hover{color:#fff}
.connect-link svg{
  width:0.875rem;height:0.875rem;
  opacity:0.5;transition:all 0.2s;flex-shrink:0;
}
.connect-link:hover svg{opacity:1;transform:translate(2px,-2px)}

/* ── Clock Card ──────────────────────────────────────────────────────── */
.clock-card{
  display:flex;flex-direction:column;
  justify-content:center;align-items:center;
  position:relative;
}
.clock-running{
  font-size:0.75rem;font-weight:500;
  color:#6b7280;text-transform:uppercase;
  letter-spacing:0.1em;
  position:absolute;top:1.5rem;left:1.5rem;
}
.clock-time{
  font-family:'EB Garamond',Georgia,serif;
  font-size:2.25rem;color:#fff;
  letter-spacing:0.1em;
  font-variant-numeric:tabular-nums;
  transition:transform 0.5s ease;
}
.clock-card:hover .clock-time{transform:scale(1.05)}
.clock-local{
  font-size:0.75rem;font-weight:500;
  color:#4b5563;text-transform:uppercase;
  letter-spacing:0.1em;
  position:absolute;bottom:1.5rem;right:1.5rem;
}

/* ── Currently Card ──────────────────────────────────────────────────── */
.currently-card{display:flex;flex-direction:column;justify-content:space-between}

.currently-header{display:flex;justify-content:space-between;align-items:flex-start}

.currently-status-dot{
  width:0.75rem;height:0.75rem;
  border-radius:50%;
  background:#10b981;
  box-shadow:0 0 15px rgba(16,185,129,0.4);
  flex-shrink:0;
}
.currently-card:hover .currently-status-dot{
  animation:pulse 2s cubic-bezier(0.4,0,0.6,1) infinite;
}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.4}}

.currently-title{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:1.125rem;font-weight:500;color:#fff;
}
.currently-subtitle{font-size:0.75rem;color:#6b7280;margin-top:0.25rem}
.currently-body{margin-top:1.5rem}
.currently-text{font-size:0.875rem;color:#d1d5db;line-height:1.6}
.currently-open{
  font-size:0.75rem;
  color:rgba(16,185,129,0.8);
  margin-top:0.75rem;font-weight:500;
}

/* ── Inner Page Layout ───────────────────────────────────────────────── */
.inner-page{
  max-width:900px;
  margin:0 auto;
  padding:6rem 1.5rem 3rem;
}
@media(min-width:768px){.inner-page{padding:7rem 2rem 4rem}}

.inner-page-header{margin-bottom:3rem}
.inner-page-title{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:clamp(2rem,5vw,3.5rem);
  font-weight:600;color:#fff;
  line-height:1.1;margin-bottom:0.75rem;
}
.inner-page-subtitle{
  font-size:1.125rem;color:#6b7280;line-height:1.6;
}
.inner-page-divider{
  height:1px;
  background:linear-gradient(to right,#2c2c2c,transparent);
  margin:2rem 0 3rem;
}

/* Content blocks */
.wp-content h1,.wp-content h2,.wp-content h3,.wp-content h4{
  font-family:'Space Grotesk',system-ui,sans-serif;
  color:#fff;line-height:1.2;
  margin-bottom:0.75rem;margin-top:2rem;
}
.wp-content h1{font-size:2rem;font-weight:600}
.wp-content h2{font-size:1.5rem;font-weight:600}
.wp-content h3{font-size:1.25rem;font-weight:500}
.wp-content p{color:#9ca3af;line-height:1.8;margin-bottom:1.25rem}
.wp-content ul,.wp-content ol{
  color:#9ca3af;padding-left:1.5rem;margin-bottom:1.25rem;line-height:1.8;
}
.wp-content li{margin-bottom:0.5rem}
.wp-content a{color:#a5b4fc;text-decoration:underline;text-underline-offset:3px}
.wp-content a:hover{color:#c7d2fe}
.wp-content strong{color:#e5e7eb;font-weight:600}
.wp-content em{font-style:italic;color:#d1d5db}
.wp-content blockquote{
  border-left:3px solid #2c2c2c;
  padding-left:1.5rem;
  margin:1.5rem 0;
  font-family:'EB Garamond',serif;
  font-size:1.25rem;
  font-style:italic;
  color:rgba(255,255,255,0.7);
}
.wp-content code{
  font-family:'SF Mono','Fira Code',monospace;
  font-size:0.875em;
  background:#1e1e1e;color:#a5b4fc;
  padding:0.125rem 0.375rem;border-radius:0.25rem;
}
.wp-content pre{
  background:#1e1e1e;border:1px solid #2c2c2c;
  border-radius:0.75rem;padding:1.5rem;overflow-x:auto;
  margin-bottom:1.5rem;
}
.wp-content pre code{background:transparent;padding:0}
.wp-content img{
  border-radius:0.75rem;margin:1.5rem 0;
  border:1px solid #2c2c2c;
}
.wp-content hr{border:none;height:1px;background:#2c2c2c;margin:2.5rem 0}

/* Project card grid (for Projects page) */
.project-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.25rem;
  margin-top:2rem;
}
@media(min-width:640px){.project-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.project-grid{grid-template-columns:repeat(3,1fr)}}

.project-card{
  background:#171717;
  border:1px solid #2c2c2c;
  border-radius:1.25rem;
  padding:1.5rem;
  display:flex;flex-direction:column;
  transition:border-color 0.3s,transform 0.3s;
}
.project-card:hover{border-color:#3c3c3c;transform:translateY(-2px)}

.project-card-tag{
  font-size:0.6875rem;
  text-transform:uppercase;letter-spacing:0.1em;
  font-weight:600;color:#6b7280;margin-bottom:0.75rem;
}
.project-card-title{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:1rem;font-weight:600;color:#fff;
  margin-bottom:0.5rem;line-height:1.3;
}
.project-card-desc{
  font-size:0.875rem;color:#6b7280;line-height:1.6;flex:1;
}
.project-card-link{
  margin-top:1.25rem;
  font-size:0.8125rem;font-weight:500;
  color:#9ca3af;display:inline-flex;
  align-items:center;gap:0.375rem;
  transition:color 0.2s;
}
.project-card-link:hover{color:#fff}
.project-card-link svg{width:0.875rem;height:0.875rem;transition:transform 0.2s}
.project-card-link:hover svg{transform:translate(2px,-2px)}

/* Blog posts list */
.posts-list{display:flex;flex-direction:column;gap:1.5rem;margin-top:2rem}

.post-item{
  background:#171717;
  border:1px solid #2c2c2c;
  border-radius:1.25rem;
  padding:1.5rem 2rem;
  transition:border-color 0.3s;
}
.post-item:hover{border-color:#3c3c3c}

.post-meta{
  font-size:0.75rem;text-transform:uppercase;
  letter-spacing:0.1em;color:#4b5563;font-weight:500;
  margin-bottom:0.5rem;
}
.post-title{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:1.125rem;font-weight:600;color:#fff;
  margin-bottom:0.5rem;line-height:1.3;
}
.post-excerpt{font-size:0.9rem;color:#6b7280;line-height:1.6}
.post-read-more{
  margin-top:1rem;font-size:0.8125rem;
  font-weight:500;color:#9ca3af;
  display:inline-flex;align-items:center;gap:0.375rem;
  transition:color 0.2s;
}
.post-read-more:hover{color:#fff}
.post-read-more svg{width:0.875rem;height:0.875rem;transition:transform 0.2s}
.post-read-more:hover svg{transform:translate(2px,-2px)}

/* Single post */
.single-post{max-width:680px;margin:0 auto;padding:6rem 1.5rem 4rem}
.single-post-header{margin-bottom:3rem}
.single-post-tag{
  font-size:0.6875rem;text-transform:uppercase;
  letter-spacing:0.1em;font-weight:600;color:#6b7280;
  margin-bottom:1rem;
}
.single-post-title{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:clamp(1.75rem,4vw,2.75rem);
  font-weight:600;color:#fff;line-height:1.15;
  margin-bottom:1.5rem;
}
.single-post-meta{
  display:flex;align-items:center;gap:1.5rem;
  font-size:0.875rem;color:#6b7280;
  padding-bottom:2rem;
  border-bottom:1px solid #2c2c2c;
}

/* 404 */
.error-404{
  min-height:100vh;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;padding:2rem;
}
.error-404-code{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:8rem;font-weight:700;
  color:#1a1a1a;line-height:1;margin-bottom:1rem;
}
.error-404-msg{
  font-family:'Space Grotesk',system-ui,sans-serif;
  font-size:1.5rem;font-weight:500;
  color:#fff;margin-bottom:0.75rem;
}
.error-404-sub{font-size:1rem;color:#6b7280;margin-bottom:2.5rem}

/* Mobile tweaks */
@media(max-width:767px){
  .hero-photo-wrap{max-width:260px}
  .card{padding:1.5rem}
}
