:root{--bg:#070b16;--bg-2:#0b1020;--text:#f4f7fb;--muted:#a9b4c5;--line:rgba(255,255,255,.13);--accent:#7c5cff;--accent-2:#23d5ab;--accent-3:#55c7ff;--shadow:0 24px 80px rgba(0,0,0,.35);--radius:28px;--max:1180px}html[data-theme=light]{--bg:#f6f8ff;--bg-2:#fff;--text:#101828;--muted:#516075;--line:rgba(16,24,40,.13);--accent:#6d55ff;--accent-2:#0cae8f;--accent-3:#0c85d8;--shadow:0 24px 80px rgba(31,42,68,.12)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--text);background:radial-gradient(circle at top left,color-mix(in srgb,var(--accent) 28%,transparent),transparent 32rem),radial-gradient(circle at 88% 18%,color-mix(in srgb,var(--accent-2) 16%,transparent),transparent 24rem),radial-gradient(circle at 50% 100%,color-mix(in srgb,var(--accent-3) 12%,transparent),transparent 32rem),var(--bg);line-height:1.6;transition:background .35s ease,color .35s ease}body.menu-open{overflow:hidden}a{color:inherit;text-decoration:none}.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:-1;background-image:linear-gradient(90deg,color-mix(in srgb,var(--text) 40%,transparent) 1px,transparent 1px),linear-gradient(color-mix(in srgb,var(--text) 40%,transparent) 1px,transparent 1px);background-size:48px 48px}.site-header{position:sticky;top:0;z-index:20;width:min(var(--max),calc(100% - 40px));margin:18px auto 0;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(18px);box-shadow:0 16px 60px rgba(0,0,0,.12)}.brand{display:inline-flex;align-items:center;gap:12px;min-width:230px;font-weight:800;letter-spacing:-.02em}.brand-mark{width:38px;height:38px;border-radius:14px;display:inline-grid;place-items:center;color:#fff;font-weight:900;background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 14px 35px color-mix(in srgb,var(--accent) 30%,transparent)}.nav{display:flex;align-items:center;gap:3px}.nav a{padding:10px 13px;border-radius:999px;color:var(--muted);font-size:14px;transition:.2s ease}.nav a:hover,.nav a.active{color:var(--text);background:color-mix(in srgb,var(--text) 8%,transparent)}.header-actions{display:flex;align-items:center;gap:8px}.chip-btn,.menu-btn{border:1px solid var(--line);background:color-mix(in srgb,var(--text) 7%,transparent);color:var(--text);cursor:pointer;transition:.2s ease}.chip-btn{min-width:46px;height:38px;border-radius:999px;font-weight:900}.chip-btn:hover{border-color:var(--accent-2);transform:translateY(-1px)}.menu-btn{display:none;width:44px;height:44px;border-radius:15px}.menu-btn span{display:block;width:18px;height:2px;margin:4px auto;background:var(--text);border-radius:2px}.section{width:min(var(--max),calc(100% - 40px));margin:0 auto;padding:92px 0}.hero{padding-top:98px}.hero-grid{display:grid;grid-template-columns:minmax(0,1.16fr) minmax(330px,.84fr);gap:34px;align-items:center}.eyebrow,.section-kicker,.project-type,.timeline-meta{color:var(--accent-2);font-weight:800;text-transform:uppercase;letter-spacing:.13em;font-size:12px}h1,h2,h3,p{margin-top:0}h1{margin:16px 0 18px;font-size:clamp(58px,9vw,118px);line-height:.88;letter-spacing:-.09em}h1 span{background:linear-gradient(135deg,var(--text),#94a5ff 48%,#43e9cb);-webkit-background-clip:text;background-clip:text;color:transparent}h2{font-size:clamp(34px,5vw,60px);line-height:1;letter-spacing:-.06em;margin-bottom:22px}h3{font-size:21px;line-height:1.2;letter-spacing:-.03em}.lead,.section-lead{color:var(--muted);font-size:clamp(18px,2vw,22px);max-width:760px}.role-pills,.tags,.mini-stack,.metrics{display:flex;flex-wrap:wrap;gap:9px}.role-pills span,.tags span,.mini-stack span,.metrics span{display:inline-flex;align-items:center;min-height:32px;padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:color-mix(in srgb,var(--text) 7%,transparent);color:color-mix(in srgb,var(--text) 84%,var(--muted));font-size:13px;font-weight:700;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease}.role-pills span:hover,.tags span:hover,.mini-stack span:hover,.metrics span:hover{transform:translateY(-2px);border-color:var(--accent-2);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-2) 18%,transparent);background:color-mix(in srgb,var(--accent-2) 8%,transparent)}.hero-actions,.contact-actions{margin-top:30px;display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 18px;border-radius:999px;border:1px solid var(--line);font-weight:800;transition:.2s ease}.btn.primary{background:linear-gradient(135deg,var(--accent),#9a82ff);border-color:transparent;color:#fff;box-shadow:0 14px 36px color-mix(in srgb,var(--accent) 34%,transparent)}.btn.secondary{background:color-mix(in srgb,var(--text) 8%,transparent)}.btn.ghost{color:var(--muted)}.btn:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--text) 28%,transparent)}.socials{margin-top:22px;display:flex;flex-wrap:wrap;gap:16px;color:var(--muted);font-size:14px}.socials a{border-bottom:1px solid color-mix(in srgb,var(--text) 24%,transparent)}.hero-card,.skill-card,.timeline-card,.project-card,.education-list article,.contact-card{background:linear-gradient(145deg,color-mix(in srgb,var(--text) 12%,transparent),color-mix(in srgb,var(--text) 5.5%,transparent));border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease,background .24s ease}.skill-card:hover,.project-card:hover{transform:translateY(-7px);border-color:color-mix(in srgb,var(--accent-2) 65%,var(--line));box-shadow:0 28px 90px color-mix(in srgb,var(--accent) 18%,transparent)}.timeline-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent-2) 62%,var(--line));background:linear-gradient(145deg,color-mix(in srgb,var(--text) 14%,transparent),color-mix(in srgb,var(--text) 7%,transparent))}.education-list article:hover{transform:translateX(10px);border-color:color-mix(in srgb,var(--accent-2) 62%,var(--line))}.hero-card{position:relative;overflow:hidden;min-height:560px;padding:30px}.hero-card:before{content:"";position:absolute;inset:-80px -60px auto auto;width:280px;height:280px;border-radius:999px;background:color-mix(in srgb,var(--accent) 34%,transparent);filter:blur(40px)}.portrait{position:relative;height:280px;display:grid;place-items:center;margin-bottom:24px;border-radius:24px;overflow:hidden;background:radial-gradient(circle at 36% 32%,color-mix(in srgb,var(--accent-2) 36%,transparent),transparent 12rem),radial-gradient(circle at 76% 72%,color-mix(in srgb,var(--accent) 40%,transparent),transparent 13rem),color-mix(in srgb,var(--text) 6%,transparent)}.portrait-initials{position:relative;z-index:2;width:148px;height:148px;border-radius:48px;display:grid;place-items:center;color:#fff;font-size:42px;font-weight:950;letter-spacing:-.08em;background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.18)}.profile-photo{position:relative;z-index:2;width:180px;height:180px;border-radius:48px;object-fit:cover;border:1px solid rgba(255,255,255,.22);box-shadow:0 24px 70px rgba(0,0,0,.35)}.orbit{position:absolute;border:1px solid color-mix(in srgb,var(--text) 16%,transparent);border-radius:999px}.orbit.one{width:220px;height:220px;animation:spin 18s linear infinite}.orbit.two{width:310px;height:120px;transform:rotate(-20deg);animation:float 5s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{0%,100%{translate:0 0}50%{translate:0 -12px}}.card-label{display:inline-flex;margin-bottom:12px;padding:8px 12px;border-radius:999px;background:color-mix(in srgb,var(--accent-2) 13%,transparent);color:var(--accent-2);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}.hero-card h2{font-size:34px;margin-bottom:12px}.hero-card p,.skill-card p,.project-card p,.timeline-card p,.education-list p,.contact-card p,.section-head p{color:var(--muted)}.stats-grid{margin-top:46px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat{padding:22px;border-radius:22px;border:1px solid var(--line);background:color-mix(in srgb,var(--text) 5.5%,transparent);transition:transform .2s ease,border-color .2s ease}.stat:hover{transform:translateY(-4px);border-color:var(--accent-2)}.stat strong{display:block;font-size:38px;line-height:1;letter-spacing:-.06em}.stat span{display:block;margin-top:9px;color:var(--muted);font-weight:700}.two-col{display:grid;grid-template-columns:240px minmax(0,1fr);gap:46px}.bullets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:34px}.bullets>div{display:grid;grid-template-columns:54px 1fr;gap:14px;padding:20px;border:1px solid var(--line);border-radius:22px;background:color-mix(in srgb,var(--text) 5.5%,transparent);transition:transform .22s ease,border-color .22s ease}.bullets>div:hover{transform:translateY(-4px);border-color:var(--accent-2)}.bullet-icon{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent-2);font-weight:950}.bullets p{color:var(--muted);margin:0}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:32px}.section-head p{max-width:460px;margin-bottom:10px}.skills-grid,.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.skill-card,.project-card{padding:26px}.skill-card h3,.project-card h3,.timeline-card h3{margin-bottom:12px}.timeline{position:relative;display:grid;gap:22px}.timeline:before{content:"";position:absolute;left:176px;top:0;bottom:0;width:1px;background:var(--line)}.timeline-item{position:relative;display:grid;grid-template-columns:150px minmax(0,1fr);gap:52px}.timeline-item:before{content:"";position:absolute;left:167px;top:32px;width:18px;height:18px;border-radius:999px;background:var(--accent-2);box-shadow:0 0 0 8px color-mix(in srgb,var(--accent-2) 14%,transparent)}.timeline-year{padding-top:26px;color:var(--text);font-weight:950}.timeline-card{padding:28px}.timeline-card ul{margin:18px 0 20px;color:var(--muted);padding-left:20px}.timeline-card li+li{margin-top:8px}.compact-experience .timeline-card{opacity:.92}.project-card{min-height:330px;display:flex;flex-direction:column}.project-card .metrics{margin-top:auto;padding-top:18px;margin-bottom:16px}.metrics span{background:color-mix(in srgb,var(--accent-2) 11%,transparent);color:color-mix(in srgb,var(--accent-2) 70%,var(--text))}.education-list{display:grid;gap:14px}.education-list article{padding:22px}.education-list span{display:inline-flex;color:var(--accent-2);font-weight:900;margin-bottom:8px}.contact-section{padding-bottom:62px}.contact-card{padding:clamp(34px,6vw,70px);text-align:center;background:radial-gradient(circle at 50% 0%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 24rem),linear-gradient(145deg,color-mix(in srgb,var(--text) 13%,transparent),color-mix(in srgb,var(--text) 5.5%,transparent))}.contact-card p{max-width:720px;margin-left:auto;margin-right:auto;font-size:18px}.contact-actions{justify-content:center}.footer{width:min(var(--max),calc(100% - 40px));margin:0 auto 36px;padding:28px 0 10px;border-top:1px solid var(--line);color:var(--muted);display:flex;justify-content:space-between;gap:18px;align-items:center}.footer>div{display:flex;align-items:center;gap:12px;color:var(--text)}.footer .brand-mark{width:34px;height:34px;border-radius:12px;font-size:13px}.to-top{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--bg) 78%,transparent);color:var(--text);cursor:pointer;opacity:0;transform:translateY(10px);transition:.2s ease;backdrop-filter:blur(12px)}.to-top.show{opacity:1;transform:translateY(0)}.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}@media (max-width:980px){.site-header{width:min(calc(100% - 24px),var(--max));border-radius:24px}.brand{min-width:auto}.menu-btn{display:block}.nav{position:fixed;left:12px;right:12px;top:86px;display:none;padding:14px;flex-direction:column;align-items:stretch;border:1px solid var(--line);border-radius:24px;background:color-mix(in srgb,var(--bg) 96%,transparent);backdrop-filter:blur(18px)}body.menu-open .nav{display:flex}.nav a{padding:13px 16px}.hero-grid,.two-col{grid-template-columns:1fr}.hero{padding-top:64px}.hero-card{min-height:auto}.stats-grid,.skills-grid,.projects-grid,.bullets{grid-template-columns:repeat(2,1fr)}.section-head{display:block}.timeline:before{left:10px}.timeline-item{grid-template-columns:1fr;gap:12px;padding-left:42px}.timeline-item:before{left:1px}.timeline-year{padding-top:0}}@media (max-width:640px){.section,.site-header,.footer{width:min(calc(100% - 24px),var(--max))}.brand-text{display:none}.section{padding:68px 0}h1{font-size:clamp(52px,17vw,78px)}.hero-actions,.contact-actions{flex-direction:column}.btn{width:100%}.stats-grid,.skills-grid,.projects-grid,.bullets{grid-template-columns:1fr}.bullets>div{grid-template-columns:1fr}.hero-card,.skill-card,.timeline-card,.project-card{border-radius:22px}.portrait{height:220px}.footer{display:block}}


/* v3 hero visual refinements */
.hero-grid {
  grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.72fr);
}

.hero-card {
  min-height: auto;
  padding: 24px;
}

.photo-frame {
  height: 360px;
  margin-bottom: 22px;
  overflow: visible;
  border: 5px solid color-mix(in srgb, var(--accent) 28%, transparent);
  border-radius: 36px;
  background:
    radial-gradient(circle at 32% 22%, color-mix(in srgb, var(--accent-2) 28%, transparent), transparent 12rem),
    radial-gradient(circle at 86% 70%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 13rem),
    color-mix(in srgb, var(--text) 6%, transparent);
}

.profile-photo {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  border-radius: 29px;
  object-fit: cover;
  border: none;
  box-shadow: none;
}

.fallback-initials {
  display: none;
  position: relative;
  z-index: 2;
  width: 150px;
  height: 150px;
  border-radius: 44px;
  place-items: center;
  color: #fff;
  font-size: 44px;
  font-weight: 950;
  letter-spacing: -0.08em;
  background: linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.05));
  border: 1px solid rgba(255,255,255,.18);
}

.floating-badge {
  position: absolute;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 13px;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--text) 10%, transparent);
  background: color-mix(in srgb, var(--bg) 86%, transparent);
  color: var(--text);
  box-shadow: 0 18px 40px rgba(0,0,0,.16);
  backdrop-filter: blur(12px);
  font-size: 13px;
  font-weight: 900;
}

.floating-badge:before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 99px;
  background: var(--accent-2);
}

.badge-top {
  top: -22px;
  left: -18px;
}

.badge-left {
  left: -28px;
  bottom: 42px;
  min-width: 88px;
  min-height: 68px;
  display: grid;
  place-items: center;
  gap: 0;
  background: linear-gradient(135deg, var(--accent), #8f77ff);
  color: #fff;
  font-size: 25px;
  line-height: 1;
}

.badge-left:before {
  content: none;
}

.badge-left small {
  display: block;
  font-size: 11px;
  font-weight: 800;
  opacity: .88;
}

.badge-bottom {
  right: -20px;
  bottom: -18px;
  color: var(--accent-2);
}

.icon-btn {
  width: 50px;
  min-width: 50px;
  padding: 0;
  border-radius: 17px;
}

.mail-btn {
  color: #fff;
  background: linear-gradient(135deg, var(--accent), #8e77ff);
  border-color: transparent;
  box-shadow: 0 14px 36px color-mix(in srgb, var(--accent) 32%, transparent);
}

.mail-icon {
  font-size: 21px;
  line-height: 1;
}

@media (max-width: 980px) {
  .hero-grid {
    grid-template-columns: 1fr;
  }

  .hero-card {
    max-width: 560px;
  }
}

@media (max-width: 640px) {
  .photo-frame {
    height: 300px;
    border-radius: 28px;
  }

  .profile-photo {
    border-radius: 22px;
  }

  .floating-badge {
    font-size: 12px;
  }

  .badge-left {
    left: 10px;
    bottom: 14px;
  }

  .badge-bottom {
    right: 10px;
    bottom: 14px;
  }

  .badge-top {
    left: 10px;
    top: 10px;
  }

  .icon-btn {
    width: 100%;
  }
}


/* v3.1 refinements: smaller hero title and cleaner photo card */
h1 {
  font-size: clamp(48px, 7.4vw, 92px);
  line-height: 0.9;
  letter-spacing: -0.08em;
}

.hero-grid {
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.64fr);
  gap: 30px;
}

.hero-card {
  max-width: 500px;
  justify-self: end;
  padding: 22px;
  border-radius: 30px;
}

.hero-card h2 {
  font-size: clamp(26px, 2.7vw, 34px);
  line-height: 1.05;
}

.hero-card p {
  font-size: 15px;
}

.photo-frame {
  height: 310px;
  margin-bottom: 22px;
  overflow: hidden;
  border: 0;
  border-radius: 26px;
  background:
    radial-gradient(circle at 32% 22%, color-mix(in srgb, var(--accent-2) 28%, transparent), transparent 12rem),
    radial-gradient(circle at 86% 70%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 13rem),
    color-mix(in srgb, var(--text) 6%, transparent);
}

.photo-frame .profile-photo {
  width: 100%;
  height: 100%;
  border-radius: 26px;
  object-fit: cover;
  object-position: center;
}

.photo-frame .fallback-initials {
  width: 100%;
  height: 100%;
  border-radius: 26px;
  font-size: 62px;
  background:
    radial-gradient(circle at 30% 25%, color-mix(in srgb, var(--accent-2) 30%, transparent), transparent 14rem),
    radial-gradient(circle at 80% 70%, color-mix(in srgb, var(--accent) 34%, transparent), transparent 14rem),
    color-mix(in srgb, var(--text) 8%, transparent);
}

.floating-badge {
  display: none !important;
}

.card-label {
  margin-bottom: 14px;
}

.mini-stack {
  gap: 8px;
}

.mini-stack span {
  min-height: 30px;
  padding: 6px 11px;
  font-size: 12.5px;
}

@media (max-width: 980px) {
  h1 {
    font-size: clamp(54px, 14vw, 92px);
  }

  .hero-card {
    justify-self: stretch;
    max-width: 560px;
  }

  .photo-frame {
    height: 340px;
  }
}

@media (max-width: 640px) {
  h1 {
    font-size: clamp(46px, 15vw, 72px);
  }

  .photo-frame {
    height: 300px;
    border-radius: 24px;
  }

  .photo-frame .profile-photo,
  .photo-frame .fallback-initials {
    border-radius: 24px;
  }
}


/* v3.2 smaller hero title so surname fits on screen */
h1 {
  font-size: clamp(42px, 6.2vw, 78px);
  line-height: 0.92;
  letter-spacing: -0.075em;
  max-width: 760px;
}

@media (max-width: 980px) {
  h1 {
    font-size: clamp(44px, 11vw, 76px);
    letter-spacing: -0.07em;
  }
}

@media (max-width: 640px) {
  h1 {
    font-size: clamp(38px, 12vw, 58px);
    letter-spacing: -0.065em;
  }
}


/* v3.3 final hero title fit */
h1 {
  font-size: clamp(38px, 5.25vw, 68px) !important;
  line-height: 0.95 !important;
  letter-spacing: -0.055em !important;
  max-width: 620px !important;
}

.hero-grid {
  grid-template-columns: minmax(0, 0.98fr) minmax(320px, 0.72fr) !important;
  gap: 34px !important;
}

@media (min-width: 1200px) {
  h1 {
    font-size: 68px !important;
  }
}

@media (max-width: 980px) {
  h1 {
    font-size: clamp(42px, 10vw, 64px) !important;
    max-width: 100% !important;
  }
}

@media (max-width: 640px) {
  h1 {
    font-size: clamp(34px, 11vw, 52px) !important;
    letter-spacing: -0.045em !important;
  }
}


/* v3.3 roles: main hero role pills with icons */
.role-pills-main {
  gap: 12px !important;
}

.role-pills-main span {
  min-height: 44px !important;
  padding: 10px 16px !important;
  gap: 9px !important;
  font-size: 15px !important;
  border-radius: 999px !important;
}

.role-pills-main svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  fill: currentColor;
  color: var(--accent);
  transition: color .2s ease, transform .2s ease;
}

.role-pills-main span:hover svg {
  color: var(--accent-2);
  transform: translateY(-1px) scale(1.06);
}

@media (max-width: 640px) {
  .role-pills-main span {
    min-height: 40px !important;
    padding: 9px 13px !important;
    font-size: 13px !important;
  }

  .role-pills-main svg {
    width: 16px;
    height: 16px;
  }
}


/* v3.3-clean: right card tag cleanup and contacts cleanup */
.hero-card .mini-stack span {
  font-size: 12.5px !important;
  padding-left: 11px !important;
  padding-right: 11px !important;
}

@media (max-width: 640px) {
  .hero-card .mini-stack span {
    font-size: 12px !important;
  }
}


/* final-1 right hero card content cleanup */
.hero-card .card-label {
  display: none !important;
}

.hero-card-subtitle {
  max-width: 620px;
  font-size: 15.5px !important;
  line-height: 1.55 !important;
  margin: 0 0 18px 0 !important;
  color: var(--muted) !important;
}

.tech-stack-final {
  gap: 9px !important;
}

.tech-stack-final span {
  min-height: 32px !important;
  padding: 7px 12px !important;
  font-size: 12.5px !important;
}

@media (max-width: 640px) {
  .hero-card-subtitle {
    font-size: 14px !important;
  }

  .tech-stack-final span {
    font-size: 12px !important;
    padding: 6px 10px !important;
  }
}


/* clean1-exp-years: Key projects accordion inside current experience */
.project-accordion {
  margin: 20px 0 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: color-mix(in srgb, var(--text) 4.5%, transparent);
  overflow: hidden;
}

.project-accordion summary {
  list-style: none;
  cursor: pointer;
  padding: 15px 18px;
  color: var(--text);
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.project-accordion summary::-webkit-details-marker {
  display: none;
}

.project-accordion summary:after {
  content: "+";
  width: 30px;
  height: 30px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, var(--accent), #8e77ff);
  font-weight: 950;
  transition: transform .2s ease;
}

.project-accordion[open] summary:after {
  transform: rotate(45deg);
}

.accordion-content {
  padding: 0 18px 18px;
}

.accordion-content ul {
  margin-top: 4px;
}


/* clean1-exp-geometry-ministry: role progression and earlier experience accordion */
.role-progression {
  display: grid;
  gap: 10px;
  margin: 18px 0 18px;
}

.role-progression div {
  display: grid;
  gap: 3px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--text) 4%, transparent);
}

.role-progression strong {
  color: var(--accent-2);
  font-size: 13px;
}

.role-progression span {
  color: var(--text);
  font-weight: 800;
}

.early-experience-accordion {
  margin: 0 !important;
}

.early-experience-accordion summary {
  min-height: 64px;
}

.early-experience-accordion .accordion-content {
  padding-top: 6px;
}


/* about-v2: redesigned About section like reference layout */
.about-v2 {
  padding-top: 110px;
}

.about-v2-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(360px, 0.74fr);
  gap: 54px;
  align-items: stretch;
}

.about-v2-copy h2 {
  margin: 14px 0 22px;
  max-width: 820px;
  font-size: clamp(42px, 5.7vw, 78px);
  line-height: 1.02;
  letter-spacing: -0.075em;
}

.about-v2-lead {
  max-width: 780px;
  color: var(--muted);
  font-size: clamp(18px, 2vw, 23px);
  line-height: 1.65;
  margin-bottom: 20px;
}

.about-v2-text {
  max-width: 780px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.75;
  margin-bottom: 26px;
}

.about-checks {
  display: grid;
  gap: 12px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.about-checks li {
  position: relative;
  padding-left: 34px;
  color: var(--text);
  font-weight: 700;
  line-height: 1.55;
}

.about-checks li:before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 1px;
  width: 21px;
  height: 21px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  color: var(--accent-2);
  background: color-mix(in srgb, var(--accent-2) 14%, transparent);
  font-size: 13px;
  font-weight: 950;
}

.about-v2-cards {
  display: grid;
  gap: 20px;
  align-content: space-between;
}

.about-focus-card {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 18px;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--text) 11%, transparent), color-mix(in srgb, var(--text) 5.5%, transparent));
  box-shadow: var(--shadow);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.about-focus-card:hover {
  transform: translateY(-6px);
  border-color: color-mix(in srgb, var(--accent) 70%, var(--line));
  box-shadow: 0 28px 90px color-mix(in srgb, var(--accent) 18%, transparent);
}

.focus-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: color-mix(in srgb, var(--accent) 16%, transparent);
  color: var(--accent);
}

.focus-icon svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
}

.about-focus-card h3 {
  margin-bottom: 12px;
}

.about-focus-card p {
  color: var(--muted);
  margin-bottom: 18px;
}

@media (max-width: 980px) {
  .about-v2-grid {
    grid-template-columns: 1fr;
  }

  .about-v2-copy h2 {
    font-size: clamp(38px, 10vw, 66px);
  }
}

@media (max-width: 640px) {
  .about-v2 {
    padding-top: 72px;
  }

  .about-focus-card {
    grid-template-columns: 1fr;
    padding: 22px;
  }

  .about-v2-copy h2 {
    font-size: clamp(34px, 11vw, 52px);
    letter-spacing: -0.055em;
  }
}


/* flat-no-assets: smaller About heading */
.about-v2-copy h2 {
  font-size: clamp(34px, 4.35vw, 58px) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.06em !important;
  max-width: 760px !important;
}

@media (max-width: 980px) {
  .about-v2-copy h2 {
    font-size: clamp(34px, 8vw, 54px) !important;
  }
}

@media (max-width: 640px) {
  .about-v2-copy h2 {
    font-size: clamp(30px, 10vw, 44px) !important;
    letter-spacing: -0.045em !important;
  }
}


/* flat-counters-1: smaller About title */
.about-v2-copy h2 {
  font-size: clamp(30px, 3.65vw, 50px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.045em !important;
  max-width: 760px !important;
}

@media (max-width: 980px) {
  .about-v2-copy h2 {
    font-size: clamp(30px, 7vw, 48px) !important;
  }
}

@media (max-width: 640px) {
  .about-v2-copy h2 {
    font-size: clamp(28px, 9vw, 40px) !important;
    letter-spacing: -0.035em !important;
  }
}

.counter {
  display: inline-block;
  min-width: 1.6ch;
}


/* flat-heading-1: split About heading into two lines with accent second line */
.about-v2-copy .about-title-split {
  font-size: clamp(28px, 3.2vw, 44px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.04em !important;
  max-width: 820px !important;
}

.about-title-split span {
  display: block;
}

.about-title-accent {
  background: linear-gradient(135deg, #8ea2ff 0%, #5eead4 72%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  padding-right: 8px;
}

@media (max-width: 980px) {
  .about-v2-copy .about-title-split {
    font-size: clamp(30px, 6.5vw, 44px) !important;
  }
}

@media (max-width: 640px) {
  .about-v2-copy .about-title-split {
    font-size: clamp(28px, 8.4vw, 38px) !important;
    line-height: 1.16 !important;
    letter-spacing: -0.03em !important;
  }
}


/* contact-icons-1: contact block icons */
.contact-actions .btn svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
  flex: 0 0 auto;
}

.contact-mail {
  gap: 10px;
}

.contact-icon-btn {
  width: 58px;
  min-width: 58px;
  padding-left: 0;
  padding-right: 0;
  border-radius: 20px;
}

.contact-cv {
  gap: 9px;
}

@media (max-width: 640px) {
  .contact-icon-btn {
    width: 100%;
  }
}


/* education-update-1 */
.education-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}

.education-label {
  color: var(--accent-2);
  font-weight: 950;
  letter-spacing: .01em;
}

.education-year {
  color: var(--muted);
  font-weight: 900;
  font-size: 14px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--text) 4%, transparent);
}

.cert-link {
  margin-top: 18px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 42px;
  padding: 10px 15px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent) 52%, var(--line));
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--text);
  font-weight: 900;
  text-decoration: none;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.cert-link:hover {
  transform: translateX(6px);
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 20%, transparent);
}

.cert-link svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
  color: var(--accent-2);
}


/* skills-rows-1: technology stack as horizontal row cards */
.skills-rows-section .section-head {
  align-items: end;
}

.skills-row-list {
  display: grid;
  gap: 18px;
}

.skill-row-card {
  display: grid;
  grid-template-columns: minmax(190px, 230px) 1fr;
  gap: 24px;
  align-items: center;
  padding: 24px 28px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--text) 9%, transparent), color-mix(in srgb, var(--text) 4%, transparent));
  box-shadow: var(--shadow);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease, background .24s ease;
}

.skill-row-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--accent) 62%, var(--line));
  box-shadow: 0 24px 74px color-mix(in srgb, var(--accent) 14%, transparent);
}

.skill-row-head {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 14px;
  align-items: center;
}

.skill-row-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 16%, transparent);
}

.skill-row-icon.teal {
  color: var(--accent-2);
  background: color-mix(in srgb, var(--accent-2) 14%, transparent);
}

.skill-row-icon.purple {
  color: #9d7bff;
  background: color-mix(in srgb, #9d7bff 16%, transparent);
}

.skill-row-icon.amber {
  color: #d5b35e;
  background: color-mix(in srgb, #d5b35e 14%, transparent);
}

.skill-row-icon.slate {
  color: var(--muted);
  background: color-mix(in srgb, var(--muted) 12%, transparent);
}

.skill-row-icon svg {
  width: 23px;
  height: 23px;
  fill: currentColor;
}

.skill-row-head h3 {
  font-size: 18px;
  line-height: 1.25;
}

.skill-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.skill-chip-list span {
  display: inline-flex;
  align-items: center;
  min-height: 31px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--text) 5%, transparent);
  color: var(--text);
  font-weight: 800;
  font-size: 12.5px;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}

.skill-chip-list span:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--accent) 70%, var(--line));
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}

@media (max-width: 900px) {
  .skill-row-card {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

@media (max-width: 640px) {
  .skill-row-card {
    padding: 20px;
    border-radius: 22px;
  }

  .skill-row-head {
    grid-template-columns: 42px 1fr;
  }

  .skill-row-icon {
    width: 42px;
    height: 42px;
  }

  .skill-chip-list span {
    font-size: 12px;
  }
}


/* mobile-adapted-1 */
@media (max-width: 900px) {
  body { overflow-x: hidden !important; }

  .container, .section, .hero, header, .nav {
    width: min(100% - 28px, 100%) !important;
  }

  .nav {
    top: 12px !important;
    padding: 10px 12px !important;
    border-radius: 24px !important;
    gap: 10px !important;
  }

  .brand span {
    font-size: 14px !important;
    max-width: 170px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .nav-links { display: none !important; }

  .lang-toggle, .theme-toggle {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
  }

  .hero {
    padding-top: 112px !important;
    min-height: auto !important;
  }

  .hero-grid, .about-v2-grid {
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }

  .hero-title, .name-title, .hero-copy h1 {
    font-size: clamp(52px, 17vw, 86px) !important;
    line-height: .92 !important;
    letter-spacing: -0.07em !important;
  }

  .eyebrow, .section-kicker {
    font-size: 12px !important;
    letter-spacing: .18em !important;
  }

  .role-pills, .role-pills-main {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 9px !important;
  }

  .role-pills span, .role-pills-main span {
    min-height: 38px !important;
    padding: 8px 12px !important;
    font-size: 13px !important;
  }

  .hero-description, .hero-copy p {
    font-size: 18px !important;
    line-height: 1.6 !important;
    max-width: 100% !important;
  }

  .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr 52px !important;
    gap: 10px !important;
    align-items: center !important;
  }

  .hero-actions .btn {
    width: 100% !important;
    min-height: 52px !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
    justify-content: center !important;
  }

  .hero-contacts {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    font-size: 14px !important;
  }

  .hero-contacts a {
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  .hero-card {
    width: 100% !important;
    max-width: 100% !important;
    padding: 18px !important;
    border-radius: 28px !important;
  }

  .photo-frame {
    height: 260px !important;
    border-radius: 24px !important;
  }

  .hero-card h2 {
    font-size: clamp(28px, 8vw, 40px) !important;
  }

  .mini-stack, .tech-stack-final {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  .stats-grid, .stats, .numbers-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }

  .stat, .stat-card {
    min-height: 132px !important;
    padding: 20px !important;
    border-radius: 22px !important;
  }

  .stat strong, .stat-card strong {
    font-size: 42px !important;
  }

  .about-v2 { padding-top: 72px !important; }

  .about-v2-copy .about-title-split, .about-v2-copy h2 {
    font-size: clamp(32px, 9.5vw, 52px) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.045em !important;
  }

  .about-v2-lead {
    font-size: 18px !important;
    line-height: 1.65 !important;
  }

  .about-v2-text { font-size: 16px !important; }

  .about-checks li {
    font-size: 15px !important;
    line-height: 1.55 !important;
  }

  .about-focus-card {
    grid-template-columns: 1fr !important;
    padding: 22px !important;
    border-radius: 22px !important;
  }

  .section {
    padding-top: 76px !important;
    padding-bottom: 76px !important;
  }

  .section-head {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    align-items: start !important;
  }

  .section-head h2 {
    font-size: clamp(40px, 12vw, 64px) !important;
    line-height: .98 !important;
    letter-spacing: -0.065em !important;
  }

  .section-head p {
    font-size: 17px !important;
    line-height: 1.55 !important;
    max-width: 100% !important;
  }

  .skills-row-list { gap: 14px !important; }

  .skill-row-card {
    grid-template-columns: 1fr !important;
    padding: 20px !important;
    border-radius: 22px !important;
    gap: 16px !important;
  }

  .skill-row-head {
    grid-template-columns: 44px 1fr !important;
    gap: 12px !important;
  }

  .skill-row-icon {
    width: 44px !important;
    height: 44px !important;
  }

  .skill-chip-list span, .tags span {
    font-size: 12px !important;
    padding: 7px 10px !important;
    min-height: 31px !important;
  }

  .timeline { padding-left: 0 !important; }
  .timeline:before { display: none !important; }

  .timeline-item {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    margin-bottom: 28px !important;
  }

  .timeline-item:before, .timeline-dot { display: none !important; }

  .timeline-year {
    position: static !important;
    width: fit-content !important;
    max-width: 100% !important;
    padding: 9px 13px !important;
    border-radius: 999px !important;
    border: 1px solid var(--line) !important;
    background: color-mix(in srgb, var(--text) 5%, transparent) !important;
    color: var(--accent-2) !important;
    font-size: 14px !important;
  }

  .timeline-card {
    padding: 22px !important;
    border-radius: 24px !important;
  }

  .timeline-card h3 {
    font-size: 22px !important;
    line-height: 1.18 !important;
  }

  .timeline-card p, .timeline-card li {
    font-size: 15px !important;
    line-height: 1.6 !important;
  }

  .timeline-card ul { padding-left: 18px !important; }

  .role-progression div { padding: 12px !important; }

  .project-accordion summary {
    padding: 13px 14px !important;
    font-size: 14px !important;
  }

  .project-accordion summary:after {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
  }

  .project-grid, .projects-grid {
    grid-template-columns: 1fr !important;
  }

  .project-card {
    border-radius: 22px !important;
    padding: 22px !important;
  }

  .education-list { gap: 14px !important; }

  .education-card {
    padding: 22px !important;
    border-radius: 22px !important;
  }

  .education-topline {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .cert-link {
    width: 100% !important;
    justify-content: center !important;
  }

  .contact-card, .contact-panel {
    padding: 28px 18px !important;
    border-radius: 26px !important;
  }

  .contact-card h2, .contact-panel h2 {
    font-size: clamp(38px, 12vw, 58px) !important;
    line-height: 1 !important;
  }

  .contact-actions {
    display: grid !important;
    grid-template-columns: 1fr repeat(4, 52px) !important;
    gap: 10px !important;
    align-items: center !important;
  }

  .contact-actions .contact-mail {
    min-width: 0 !important;
    width: 100% !important;
    overflow: hidden !important;
  }

  .contact-actions .contact-mail span {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .contact-actions .contact-icon-btn,
  .contact-actions .contact-cv {
    width: 52px !important;
    min-width: 52px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    justify-content: center !important;
  }

  .contact-actions .contact-cv span { display: none !important; }

  .footer {
    flex-direction: column !important;
    gap: 12px !important;
    text-align: center !important;
  }
}

@media (max-width: 520px) {
  .container, .section, .hero, header, .nav {
    width: min(100% - 20px, 100%) !important;
  }

  .brand span { max-width: 128px !important; }

  .hero { padding-top: 102px !important; }

  .hero-title, .name-title, .hero-copy h1 {
    font-size: clamp(46px, 16.8vw, 68px) !important;
  }

  .hero-actions { grid-template-columns: 1fr !important; }

  .photo-frame { height: 220px !important; }

  .stats-grid, .stats, .numbers-grid {
    grid-template-columns: 1fr !important;
  }

  .stat, .stat-card { min-height: 116px !important; }

  .section-head h2 { font-size: clamp(36px, 13vw, 52px) !important; }

  .about-v2-copy .about-title-split, .about-v2-copy h2 {
    font-size: clamp(30px, 10vw, 42px) !important;
  }

  .timeline-card { padding: 18px !important; }
  .timeline-card h3 { font-size: 20px !important; }

  .contact-actions {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  .contact-actions .contact-mail {
    grid-column: 1 / -1 !important;
  }

  .contact-actions .contact-icon-btn,
  .contact-actions .contact-cv {
    width: 100% !important;
    min-width: 0 !important;
  }
}

@media (max-width: 380px) {
  .hero-title, .name-title, .hero-copy h1 { font-size: 43px !important; }
  .section-head h2 { font-size: 34px !important; }
  .nav { width: calc(100% - 14px) !important; }
  .brand span { display: none !important; }
}


/* projects-ivan-style-1 */
.projects-ivan-head h2 {
  max-width: 760px;
}

.ivan-project-grid {
  display: grid;
  grid-template-columns: 1.35fr .65fr;
  gap: 18px;
}

.ivan-project-card {
  position: relative;
  min-height: 285px;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background:
    radial-gradient(circle at 96% 0%, color-mix(in srgb, var(--accent) 11%, transparent), transparent 15rem),
    linear-gradient(145deg, color-mix(in srgb, var(--text) 9%, transparent), color-mix(in srgb, var(--text) 4.5%, transparent));
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.ivan-project-card:hover {
  transform: translateY(-6px);
  border-color: color-mix(in srgb, var(--accent) 66%, var(--line));
  box-shadow: 0 28px 90px color-mix(in srgb, var(--accent) 16%, transparent);
}

.ivan-project-large {
  min-height: 420px;
  grid-row: span 2;
}

.case-badge {
  width: fit-content;
  margin-bottom: 18px;
  padding: 7px 11px;
  border-radius: 999px;
  color: var(--accent);
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.case-badge.green {
  color: var(--accent-2);
  border-color: color-mix(in srgb, var(--accent-2) 42%, var(--line));
  background: color-mix(in srgb, var(--accent-2) 12%, transparent);
}

.case-badge.yellow {
  color: #d8c15b;
  border-color: color-mix(in srgb, #d8c15b 42%, var(--line));
  background: color-mix(in srgb, #d8c15b 12%, transparent);
}

.ivan-project-card h3 {
  font-size: clamp(22px, 2vw, 32px);
  line-height: 1.08;
  letter-spacing: -0.045em;
  margin-bottom: 10px;
}

.case-meta {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 18px;
}

.ivan-project-card p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.68;
  margin-bottom: 22px;
}

.case-impact-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  padding-top: 20px;
  margin-top: auto;
  margin-bottom: 18px;
  border-top: 1px solid var(--line);
}

.case-impact-grid div,
.case-number {
  display: grid;
  gap: 4px;
}

.case-impact-grid strong,
.case-number strong {
  color: var(--accent);
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.04em;
}

.case-impact-grid span,
.case-number span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.case-number {
  padding-top: 18px;
  margin-top: auto;
  margin-bottom: 18px;
  border-top: 1px solid var(--line);
}

@media (max-width: 900px) {
  .ivan-project-grid {
    grid-template-columns: 1fr !important;
  }

  .ivan-project-large {
    grid-row: span 1;
    min-height: auto;
  }

  .ivan-project-card {
    min-height: auto;
    padding: 22px;
  }
}

@media (max-width: 520px) {
  .case-impact-grid {
    grid-template-columns: 1fr;
  }

  .ivan-project-card h3 {
    font-size: 23px;
  }

  .ivan-project-card p {
    font-size: 14.5px;
  }
}


/* projects-no-empty-1: remove excessive empty space in project cards */
.ivan-project-card {
  min-height: auto !important;
}

.ivan-project-large {
  min-height: auto !important;
}

.case-impact-grid,
.case-number {
  margin-top: 18px !important;
}

.ivan-project-large .tags {
  margin-top: 0 !important;
}

@media (min-width: 901px) {
  .ivan-project-large {
    grid-row: span 1 !important;
  }

  .ivan-project-card:nth-child(2),
  .ivan-project-card:nth-child(3),
  .ivan-project-card:nth-child(4),
  .ivan-project-card:nth-child(5),
  .ivan-project-card:nth-child(6) {
    min-height: 285px !important;
  }
}


/* projects-final-layout-1: 5 projects layout */
@media (min-width: 901px) {
  .ivan-project-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: stretch !important;
  }

  .ivan-project-large {
    grid-column: span 2 !important;
    grid-row: span 1 !important;
  }

  .ivan-project-card {
    min-height: 315px !important;
  }

  .ivan-project-large {
    min-height: 315px !important;
  }

  .ivan-project-card:nth-child(2),
  .ivan-project-card:nth-child(3),
  .ivan-project-card:nth-child(4),
  .ivan-project-card:nth-child(5) {
    min-height: 315px !important;
  }

  .case-impact-grid,
  .case-number {
    margin-top: auto !important;
  }
}

@media (max-width: 900px) {
  .ivan-project-grid {
    grid-template-columns: 1fr !important;
  }

  .ivan-project-large {
    grid-column: span 1 !important;
  }
}

/* project-cases-repack-1 */
@media (min-width:901px){
  .project-cases-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;align-items:stretch!important}
  .project-cases-grid .ivan-project-large{grid-column:span 2!important;grid-row:span 1!important}
  .project-cases-grid .ivan-project-card{min-height:330px!important}
}
.project-cases-grid .ivan-project-card p{font-size:14.5px}
.project-cases-grid .case-impact-grid,.project-cases-grid .case-number{margin-top:auto!important}
.project-cases-grid .case-impact-grid strong,.project-cases-grid .case-number strong{font-size:25px}
@media (max-width:900px){
  .project-cases-grid{grid-template-columns:1fr!important}
  .project-cases-grid .ivan-project-large{grid-column:span 1!important}
  .project-cases-grid .ivan-project-card{min-height:auto!important}
}


/* project-cases-fix-1 */
.project-cases-grid .case-impact-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}