:root{
  --bg:#1a0f2e; /* deep purple */
  --card:#2d1b4e;
  --muted:#8892a6;
  --accent:#a855f7; /* vibrant purple */
  --accent-2:#00ff41; /* electric lime */
  --success:#10b981;
  --text:#f0e6f6; /* light lavender */
  --glass: rgba(168,85,247,0.05);
  --radius:12px;
  --max-width:1100px;
  transition: --bg 0.4s ease, --card 0.4s ease, --accent 0.4s ease, --accent-2 0.4s ease, --text 0.4s ease;
}

/* Hide decorative SVG elements */
svg g, svg rect, svg circle {
  visibility: hidden;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: linear-gradient(135deg, #0a0e27 0%, #1a1f3a 100%);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Fun DevOps-themed background layers */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  /* show the actual landing background image (sharp) - only on landing */
  background-image: none;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity:1;
}

/* Landing page video background */
video.landing-bg{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
  pointer-events:none;
}

/* subtle pipeline/node grid overlay to evoke DevOps topologies */
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  /* colorful blurred overlays and subtle grid/pipeline overlay */
  background-image:
    radial-gradient(circle at 12% 18%, rgba(0,217,255,0.12) 0%, rgba(0,217,255,0.00) 28%),
    radial-gradient(circle at 88% 78%, rgba(255,0,255,0.12) 0%, rgba(255,0,255,0.00) 28%),
    conic-gradient(from 210deg at 50% 50%, rgba(10,14,39,0.85), rgba(26,31,58,0.85), rgba(10,14,39,0.85), rgba(26,31,58,0.85)),
    radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size: 420px 420px, 420px 420px, cover, 42px 42px, 320px 320px;
  background-position: 12% 18%, 88% 78%, center, 0 0, 0 0;
  background-repeat: no-repeat, no-repeat, no-repeat, repeat, repeat;
  mix-blend-mode: overlay;
  filter: blur(48px) saturate(120%);
  opacity:0.9;
  animation:gradientShift 15s ease infinite;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
}

.container{max-width:var(--max-width);margin:28px auto;padding:0 20px}

/* Top navigation/header */
.site-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  background:linear-gradient(135deg, rgba(26,31,58,0.98), rgba(10,14,39,0.98));
  padding:16px 20px;
  border-radius:0;
  box-shadow:0 4px 12px rgba(0,217,255,0.15);
  margin-bottom:0;
  position:sticky;
  top:0;
  z-index:100;
  backdrop-filter:blur(10px);
  flex-wrap:wrap;
  min-height:auto;
}
.brand{display:flex;align-items:center;gap:12px;min-width:0;flex:1}
.brand-column{display:flex;flex-direction:column;min-width:0}
.brand-row{display:flex;align-items:center;gap:10px;min-width:0}
.brand h1{font-weight:700;margin:0;font-size:1.5rem;background:linear-gradient(135deg, var(--accent), var(--accent-2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:block;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tagline{display:none;font-size:0.85rem;color:var(--muted);margin-top:4px}

/* Navigation */
.nav{display:flex;gap:14px;align-items:center}
.nav a{color:var(--text);text-decoration:none;padding:8px 12px;border-radius:10px;font-weight:600;transition:all 0.18s ease;position:relative}

/* Hamburger menu button */
.menu-toggle{display:none;background:none;border:none;color:var(--accent);font-size:1.5rem;cursor:pointer;padding:8px;align-items:center;justify-content:center;width:44px;height:44px}
.menu-toggle::after{content:"☰";font-size:1.5rem}
.menu-toggle.open::after{content:"✕"}

/* Mobile nav */
.nav.mobile-open{
  position:absolute;
  top:100%;
  left:0;
  right:0;
  flex-direction:column;
  background:linear-gradient(135deg, rgba(26,31,58,0.98), rgba(10,14,39,0.98));
  padding:20px;
  gap:8px;
  border-bottom:1px solid rgba(0,217,255,0.15);
  border-radius:0;
  animation:slideDown 300ms ease-out;
}

@keyframes slideDown{
  from{opacity:0;transform:translateY(-10px)}
  to{opacity:1;transform:translateY(0)}
}

.nav a::after{
  content:"";
  position:absolute;
  bottom:-4px;
  left:0;
  width:0;
  height:2px;
  background:var(--accent);
  animation:underlineGrow 300ms ease-out forwards;
  opacity:0;
  transition:opacity 200ms ease;
}
.nav a:hover{color:var(--accent);background:linear-gradient(90deg, rgba(0,217,255,0.06), rgba(255,0,255,0.04));transform:translateY(-2px)}
.nav a:hover::after{opacity:1}
.inline-form{display:inline;margin:0}
.btn-logout{padding:6px 10px;border-radius:8px;background:var(--accent);color:#fff;border:none;cursor:pointer;font-weight:600;transition:all 0.2s ease}
.btn-logout:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,217,255,0.3)}
.lang{display:flex;gap:6px}
.flag-btn{background:transparent;border:1px solid var(--accent);color:var(--accent);padding:6px 10px;border-radius:8px;font-weight:600;cursor:pointer;transition:background 150ms ease-out, color 150ms ease-out, border-color 150ms ease-out, box-shadow 150ms ease-out, transform 150ms ease-out}
.flag-btn:hover{background:var(--accent);color:#fff}
.flag-btn.active{background:var(--accent);color:#fff;box-shadow:0 6px 14px rgba(0,217,255,0.3);transform:translateY(-2px);border-color:var(--accent-2)}
.flag-img{width:28px;height:18px;object-fit:cover;vertical-align:middle}

/* Theme Switcher */
.theme-btn{background:transparent;border:1px solid var(--accent);color:var(--accent);padding:6px 10px;border-radius:8px;font-weight:600;cursor:pointer;font-size:1.1rem;transition:all 150ms ease-out;margin-right:8px}
.theme-btn:hover{background:var(--accent);color:#fff;box-shadow:0 4px 12px rgba(0,0,0,0.3)}
.theme-menu{position:absolute;top:100%;right:0;background:var(--card);border:1px solid var(--accent);border-radius:12px;padding:12px 0;margin-top:8px;min-width:220px;box-shadow:0 8px 32px rgba(0,0,0,0.4);z-index:1000}
.theme-option{display:block;width:100%;padding:12px 16px;background:transparent;border:none;color:var(--text);text-align:left;cursor:pointer;font-weight:500;transition:all 150ms ease;font-size:0.95rem}
.theme-option:hover{background:rgba(var(--accent),0.1);color:var(--accent)}
.theme-option.active{background:var(--accent);color:#fff;font-weight:700}
.lang{position:relative;display:flex;gap:8px;align-items:center}

/* Hero / illustration */
.hero-illustration{position:absolute;right:-10px;top:-22px;width:320px;height:120px;opacity:0.15;pointer-events:none}
.svg-float{animation:float 8s ease-in-out infinite}

@keyframes float{
  0%{transform:translateY(0) rotate(0deg)}
  50%{transform:translateY(-8px) rotate(3deg)}
  100%{transform:translateY(0) rotate(0deg)}
}

@keyframes pulseTag {
  0%{opacity:0.8;transform:translateY(0)}
  50%{opacity:1;transform:translateY(-2px)}
  100%{opacity:0.8;transform:translateY(0)}
}

/* 1. Landing portrait pulse glow */
@keyframes portraitPulse{
  0%{box-shadow:0 12px 40px rgba(14,30,60,0.3), 0 0 0 0 rgba(16,185,129,0.4)}
  50%{box-shadow:0 12px 40px rgba(14,30,60,0.3), 0 0 0 15px rgba(16,185,129,0)}
  100%{box-shadow:0 12px 40px rgba(14,30,60,0.3), 0 0 0 0 rgba(16,185,129,0)}
}

.landing-avatar{animation:portraitPulse 2s ease-in-out infinite}

/* 2. Card entrance animations */
@keyframes slideInUp{
  from{opacity:0;transform:translateY(30px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes slideInLeft{
  from{opacity:0;transform:translateX(-30px)}
  to{opacity:1;transform:translateX(0)}
}

@keyframes slideInRight{
  from{opacity:0;transform:translateX(30px)}
  to{opacity:1;transform:translateX(0)}
}

.card{animation:slideInUp 900ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards}
.card:nth-of-type(1){animation-delay:50ms}
.card:nth-of-type(2){animation-delay:150ms}
.card:nth-of-type(3){animation-delay:250ms}
.card{position:relative}
.card::before{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid rgba(0,217,255,0.15);pointer-events:none;animation:borderGlow 3s ease-in-out infinite}

/* 3. Navigation link underline animation */
@keyframes underlineGrow{
  from{width:0}
  to{width:100%}
}

/* 4. Language flag flip animation */
@keyframes flagFlip{
  from{transform:rotateY(0deg) scale(1)}
  to{transform:rotateY(360deg) scale(1.05)}
}

.lang button{transition:transform 150ms ease-out}
.lang button:active{transform:rotateY(180deg) scale(1.03)}

/* 5. Download card hover lift */
@keyframes liftCard{
  from{transform:translateY(0)}
  to{transform:translateY(-8px)}
}

.download-card{transition:transform 280ms cubic-bezier(0.34, 1.56, 0.64, 1), border-color 280ms ease, box-shadow 280ms ease}
.download-card:hover{transform:translateY(-6px)}

/* 6. Floating accent elements */
@keyframes float2{
  0%{transform:translateY(0) translateX(0)}
  25%{transform:translateY(-10px) translateX(5px)}
  50%{transform:translateY(0) translateX(0)}
  75%{transform:translateY(-8px) translateX(-5px)}
  100%{transform:translateY(0) translateX(0)}
}

.floating-accent{animation:float2 6s ease-in-out infinite;opacity:0.1;pointer-events:none}

/* 7. Text reveal on scroll (will be handled by JS) */
@keyframes revealText{
  from{opacity:0;clip-path:inset(0 100% 0 0)}
  to{opacity:1;clip-path:inset(0 0 0 0)}
}

.hero-text-reveal{animation:revealText 1400ms ease-out forwards}

/* Staggered animation delays for cascading effect */
.hero-card .hero-text-reveal:nth-child(1){animation-delay:0ms}
.hero-card .hero-text-reveal:nth-child(2){animation-delay:200ms}
.hero-card .hero-text-reveal:nth-child(3){animation-delay:400ms}

/* Section headers with stagger */
h2.hero-text-reveal{animation-delay:0ms}
.card:nth-of-type(1) h2.hero-text-reveal{animation-delay:200ms}
.card:nth-of-type(2) h2.hero-text-reveal{animation-delay:300ms}
.card:nth-of-type(3) h2.hero-text-reveal{animation-delay:400ms}
.card:nth-of-type(4) h2.hero-text-reveal{animation-delay:500ms}

/* Paragraph animations */
.card p.hero-text-reveal{animation-delay:100ms}

/* 8. Animated background gradient shift */
@keyframes gradientShift{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

/* 9. Button ripple effect */
@keyframes ripple{
  to{transform:scale(4);opacity:0}
}

button{position:relative;overflow:hidden}
button::before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:0;
  height:0;
  border-radius:50%;
  background:rgba(255,255,255,0.5);
  transform:translate(-50%, -50%);
  pointer-events:none;
}

button:active::before{animation:ripple 600ms ease-out}

/* 10. Section border glow */
@keyframes borderGlow{
  0%{border-color:rgba(0,217,255,0.12)}
  50%{border-color:rgba(0,217,255,0.4)}
  100%{border-color:rgba(0,217,255,0.12)}
}

.brand .tagline{font-size:0.95rem;color:var(--muted);margin:0;animation:pulseTag 6s ease-in-out infinite;font-weight:500}

/* Cards */
.card{background:linear-gradient(135deg, rgba(26,31,58,0.95) 0%, rgba(26,31,58,0.92) 50%, rgba(10,14,39,0.95) 100%);padding:24px;border-radius:var(--radius);box-shadow:0 10px 30px rgba(0,0,0,0.4);margin-top:12px;margin-bottom:12px;border:1px solid rgba(0,217,255,0.15);z-index:1;position:relative;overflow:hidden}
.card::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, rgba(0,217,255,0.08) 0%, transparent 50%, rgba(255,0,255,0.08) 100%);pointer-events:none;border-radius:inherit;opacity:0.6}
.card > *{position:relative;z-index:1}
.card h2 { line-height: 1.5; margin-bottom: 16px; }
.card p { line-height: 1.7; margin-bottom: 8px; }

.hero-card{margin-bottom:12px}
.two-column-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
.profile-panel{background:linear-gradient(135deg, rgba(0,217,255,0.08), rgba(255,0,255,0.08));border-radius:20px;padding:32px;text-align:center;min-height:320px;display:flex;align-items:center;justify-content:center;border:2px solid rgba(0,217,255,0.12)}
.center-text{text-align:center}
.avatar-wrapper{width:140px;height:140px;margin:0 auto 20px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(0,217,255,0.12)}
.avatar-img{width:100%;height:100%;object-fit:cover;display:block}
.profile-name{margin:0;color:var(--text);font-size:1.1rem;font-weight:700}
.profile-role{margin:6px 0 0;color:var(--accent);font-size:0.95rem;font-weight:600}
.hero-title{margin:0 0 16px 0;font-size:2.25rem;color:var(--accent)}
.hero-intro{font-size:1.1rem;line-height:1.6;color:var(--text)}
.hero-sub{font-size:1rem;color:var(--muted);line-height:1.6}
.hero-actions{margin-top:24px;display:flex;gap:12px}
.btn-cta{padding:12px 24px;font-size:1rem}
.section-heading{margin-top:0;color:var(--accent);font-size:1.5rem}
.section-text{font-size:1rem;line-height:1.7}
.two-column-list{columns:2;gap:24px;line-height:1.8}

label{display:block;margin-top:12px;font-weight:600;color:var(--text)}
input,textarea,select{width:100%;padding:10px;margin-top:8px;border:2px solid rgba(0,217,255,0.2);border-radius:10px;background:rgba(26,31,58,0.5);color:var(--text);font-family:inherit;transition:border-color 0.2s ease}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(0,217,255,0.15)}
button{background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#fff;border:none;padding:11px 18px;border-radius:10px;cursor:pointer;font-weight:600;font-family:inherit;transition:all 0.2s ease;box-shadow:0 4px 12px rgba(0,217,255,0.3)}
button:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,217,255,0.4)}

table{width:100%;border-collapse:collapse}
th,td{padding:12px;border-bottom:1px solid rgba(0,217,255,0.1);text-align:left}
th{background:linear-gradient(135deg, rgba(0,217,255,0.12) 0%, rgba(255,0,255,0.08) 100%);font-weight:600;color:var(--accent);border-bottom:2px solid rgba(0,217,255,0.25)}
a{color:var(--accent);text-decoration:none;font-weight:500;transition:color 0.2s ease}
a:hover{color:var(--accent-2)}

/* Responsive grids */
.download-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.download-card{background:linear-gradient(135deg, rgba(26,31,58,0.9) 0%, rgba(26,31,58,0.88) 50%, rgba(10,14,39,0.9) 100%);padding:22px;border-radius:12px;border:1px solid rgba(0,217,255,0.12);transition:transform 180ms cubic-bezier(0.34, 1.56, 0.64, 1), border-color 180ms ease-out, box-shadow 180ms ease-out;cursor:pointer;position:relative;overflow:hidden}
.download-card::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg, rgba(0,217,255,0.1) 0%, transparent 50%, rgba(255,0,255,0.1) 100%);opacity:0;transition:opacity 180ms ease;pointer-events:none;border-radius:inherit}
.download-card:hover::before{opacity:0.6}
.download-card > *{position:relative;z-index:1}
.download-card:hover{border-color:rgba(0,217,255,0.3);transform:translateY(-5px);box-shadow:0 12px 30px rgba(0,217,255,0.15)}
.download-card a{font-weight:700}

.cv{background:transparent;padding:0}

/* Forms and small helpers */
.small{font-size:0.9rem;color:var(--muted)}

/* Landing page styles */
.landing-section{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:10}
.landing-link{display:inline-block;border-radius:999px;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 40px rgba(0,217,255,0.3);transition:transform 220ms ease, box-shadow 220ms ease}
.landing-link:hover{transform:scale(1.03);box-shadow:0 18px 60px rgba(0,217,255,0.4)}
.landing-avatar{width:220px;height:220px;object-fit:cover;display:block;border-radius:50%;border:6px solid rgba(255,255,255,0.9)}

@media (max-width:720px){
  html { font-size: 14px; }
  
  .landing-avatar{width:160px;height:160px;border-width:4px}
  .site-header{flex-direction:row;align-items:center;gap:8px;padding:12px 16px}
  .brand h1{font-size:1.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .tagline{display:none}
  
  /* Prevent text overflow on mobile */
  body { font-size: 14px; }
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.4rem; }
  h3 { font-size: 1.1rem; }
  
  .container { padding: 0 16px; margin: 20px auto; }
  
  /* Two-column grid to single column on mobile */
  .two-column-grid { grid-template-columns: 1fr; gap: 24px; }
  .profile-panel { padding: 20px; min-height: auto; }
  .avatar-wrapper { width: 100px; height: 100px; margin: 0 auto 16px; }
  .profile-name { font-size: 1rem; }
  .profile-role { font-size: 0.9rem; }
  .profile-details { font-size: 0.85rem; }
  
  /* Show hamburger menu on mobile */
  .menu-toggle{display:flex;min-width:44px;flex-shrink:0}
  
  /* Hide nav on mobile by default, show on toggle */
  .nav{display:none !important;position:absolute;top:100%;left:0;right:0;flex-direction:column;width:100%}
  .nav.mobile-open{display:flex !important;width:100%;min-width:auto}
}

/* Extra small screens */
@media (max-width:480px){
  html { font-size: 13px; }
  body { font-size: 13px; }
  h1 { font-size: 1.5rem; }
  h2 { font-size: 1.2rem; }
  h3 { font-size: 1rem; }
  .container { padding: 0 12px; margin: 16px auto; }
  .brand h1 { font-size: 1rem; white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
  .site-header { padding: 10px 12px; gap: 6px; }
  .menu-toggle { width: 40px; height: 40px; padding: 6px; font-size: 1.25rem; }
  .lang { gap: 4px; }
  .flag-btn { padding: 4px 8px; font-size: 0.85rem; }
  .flag-img { width: 24px; height: 16px; }
  
  /* Two-column grid adjustments for tiny screens */
  .two-column-grid { gap: 16px; }
  .profile-panel { padding: 16px; }
  .avatar-wrapper { width: 80px; height: 80px; margin: 0 auto 12px; }
  .profile-name { font-size: 0.9rem; }
  .profile-role { font-size: 0.8rem; }
  .profile-details { font-size: 0.75rem; }
  .profile-contact { font-size: 0.75rem; }
}

/* CV Content Sections */
.skills-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.skill-tag {
  background: linear-gradient(135deg, rgba(0,217,255,0.12), rgba(255,0,255,0.08));
  border: 1px solid rgba(0,217,255,0.25);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 0.9rem;
  color: var(--accent);
  text-align: center;
  transition: all 150ms ease;
}

.skill-tag:hover {
  background: linear-gradient(135deg, rgba(0,217,255,0.2), rgba(255,0,255,0.12));
  border-color: rgba(0,217,255,0.4);
  box-shadow: 0 4px 12px rgba(0,217,255,0.15);
}

.experience-item {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(0,217,255,0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: pointer;
}

.experience-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0,217,255,0.15);
}

.experience-item:last-child {
  border-bottom: none;
}

.exp-header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 8px;
}

.exp-header h3 {
  margin: 0;
  color: var(--accent);
  font-size: 1.1rem;
}

.exp-company {
  font-weight: 600;
  color: var(--accent-2);
}

.exp-period {
  margin-left: auto;
  color: var(--muted);
  font-size: 0.9rem;
}

.exp-description {
  margin: 8px 0 0 0;
  color: var(--text);
  line-height: 1.8;
  padding-left: 20px;
}

.exp-description li {
  margin-bottom: 12px;
  text-align: justify;
}

.exp-description li:last-child {
  margin-bottom: 0;
}

.education-item {
  margin-bottom: 13px;
}
/* Language-specific education margins */
html[data-lang="hu"] .education-item {
  margin-bottom: 10px;
}

html[data-lang="en"] .education-item {
  margin-bottom: 16px;
}
.education-item h3 {
  margin: 0 0 4px 0;
  color: var(--accent);
  font-size: 1.05rem;
}

.footer-card {
  text-align: center;
  margin-top: 20px;
}

.footer-text {
  margin: 0;
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.6;
}

.edu-school {
  margin: 0;
  color: var(--muted);
  font-size: 0.95rem;
}

.profile-details {
  margin: 8px 0 0 0;
  color: var(--accent);
  font-size: 0.9rem;
  font-weight: 500;
}

.profile-location {
  margin: 4px 0 0 0;
  color: var(--muted);
  font-size: 0.85rem;
}

/* Footer */
.site-footer{
  margin-top:60px;
  padding:32px 20px;
  text-align:center;
  color:var(--muted);
  font-size:0.9rem;
  border-top:1px solid rgba(0,217,255,0.1);
}

/* Print styles for CV downloads */
@media print{
  body{background:#fff;color:#000}
  .card{box-shadow:none;border-radius:0;border:none}
  .nav,.lang,.site-header{display:none}
}

/* PDF generation styles - remove gaps between cards */
main.pdf-generation {
  display: block !important;
}

main.pdf-generation .hero-card {
  margin-bottom: 10px !important;
}

main.pdf-generation .card:not(.hero-card) {
  margin: 0 !important;
  margin-bottom: 10px !important;
  padding: 10px 14px !important;
  border: none !important;
  box-shadow: none !important;
  background: linear-gradient(135deg, rgba(26,31,58,0.95) 0%, rgba(26,31,58,0.92) 50%, rgba(10,14,39,0.95) 100%) !important;
  page-break-inside: avoid !important;
  overflow: hidden !important;
}

main.pdf-generation main {
  page-break-after: avoid !important;
}

main.pdf-generation .card:not(.hero-card) h2 {
  margin: 0 0 5px 0 !important;
  padding: 0 !important;
  line-height: 1.2 !important;
  font-size: 1.8em !important;
}

main.pdf-generation .card:not(.hero-card) h3 {
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
  line-height: 1.1 !important;
  font-size: 1.25em !important;
}

main.pdf-generation .card:not(.hero-card) p {
  margin: 0 0 2px 0 !important;
  line-height: 1.3 !important;
  font-size: 1.15em !important;
  padding: 0 !important;
}

main.pdf-generation .skills-grid {
  gap: 4px !important;
  margin: 0 !important;
  padding: 0 !important;
}

main.pdf-generation .card:has(.skills-grid) {
  padding-bottom: 6px !important;
}

main.pdf-generation .card:has(.experience-item) {
  margin-top: -6px !important;
}

main.pdf-generation .skill-tag {
  padding: 4px 8px !important;
  font-size: 1.05em !important;
  margin: 0 !important;
}

main.pdf-generation .skill-tag:last-child {
  margin-bottom: 0 !important;
}

main.pdf-generation .experience-item {
  margin-bottom: 4px !important;
  padding-bottom: 4px !important;
  border-bottom: none !important;
}

main.pdf-generation .exp-header {
  margin-bottom: 2px !important;
}

main.pdf-generation .exp-description {
  margin: 0 !important;
}

main.pdf-generation .experience-item:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

main.pdf-generation .exp-period {
  font-weight: 700 !important;
  font-size: 1.1em !important;
  color: var(--accent) !important;
}

main.pdf-generation .exp-header {
  margin-bottom: 3px !important;
}

main.pdf-generation .footer-card {
  page-break-inside: avoid !important;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  padding: 8px 12px !important;
  overflow: visible !important;
  max-height: none !important;
  height: auto !important;
}

main.pdf-generation .footer-card {
  display: none !important;
}

main.pdf-generation .card:has(.education-item) {
  margin-bottom: 0 !important;
  padding-bottom: 28px !important;
}