/* Homepage-only refinement layer. Keeps the underlying content and collage assets intact. */
.hero-section{padding-top:18px;padding-bottom:28px}
.hero-grid{grid-template-columns:40% 60%;gap:1.5%}
.hero-content{max-width:560px}
.hero-professional-meta{font:9px/1.5 var(--font-mono);letter-spacing:.055em;text-transform:uppercase;color:var(--ink-soft);margin:-3px 0 9px}
.hero-collage-wrapper{height:450px;min-height:450px}
.hero-collage-stage{transform:scale(.96);transform-origin:center}
.layer-portrait{filter:none}
.layer-highlight{overflow:visible;z-index:var(--z-paint);pointer-events:none}
.layer-crown{--x:98px;--y:16px;--rotation:-30deg;width:76px}
.layer-disciplines-badge{--x:425px;--y:66px;opacity:.78}
.featured-section{padding-top:22px}

/* One visual contract for all four featured projects. */
.featured-grid{gap:16px}
.project-card{height:270px;padding:18px;border-color:rgba(17,17,17,.12);box-shadow:0 7px 22px rgba(22,18,12,.08);background:#101218;color:#fff}
.project-card::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(90deg,rgba(8,10,15,.94) 0%,rgba(8,10,15,.8) 30%,rgba(8,10,15,.24) 66%,rgba(8,10,15,.08) 100%)}
.project-card-header,.project-card-info,.project-card-footer,.quickhire-slashes{z-index:5}
.project-card-info,.card-quickhire .project-card-info,.card-sift .project-card-info,.card-nudgeq .project-card-info,.card-xr .project-card-info{max-width:52%}
.card-quickhire .project-card-info{max-width:68%}
.project-card-title,.card-quickhire .project-card-title,.card-nudgeq .project-card-title{color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.24)}
.project-card-desc,.project-card-tag,.project-card-num,.card-quickhire .project-card-desc,.card-quickhire .project-card-tag,.card-quickhire .project-card-num,.card-sift .project-card-desc,.card-sift .project-card-tag,.card-sift .project-card-num,.card-nudgeq .project-card-desc,.card-nudgeq .project-card-tag,.card-nudgeq .project-card-num,.card-xr .project-card-desc,.card-xr .project-card-tag,.card-xr .project-card-num{color:rgba(255,255,255,.78)}
.project-card-desc{font-size:12.5px;line-height:1.45}
.project-card-tag{font-size:8.5px;line-height:1.45}
.card-quickhire .btn-card-arrow,.card-sift .btn-card-arrow,.card-nudgeq .btn-card-arrow,.card-xr .btn-card-arrow,.card-checkin .btn-card-arrow{background:#fff;color:#111}
.project-card-visual,.card-quickhire .project-card-visual,.card-sift .project-card-visual,.card-nudgeq .project-card-visual,.card-xr .project-card-visual{inset:0;width:100%;height:100%;mask-image:none;-webkit-mask-image:none}
.project-card-visual img,.card-quickhire .project-card-visual img,.card-sift .project-card-visual img,.card-nudgeq .project-card-visual img,.card-xr .project-card-visual img{width:100%;height:100%;object-fit:cover;transform:none;filter:none}
.card-quickhire .project-card-visual img{object-position:72% center}
.card-sift .project-card-visual{background:radial-gradient(circle at 72% 50%,#193e79 0%,#080b12 56%,#05070b 100%)}
.card-sift .project-card-visual img{object-fit:contain;object-position:78% 58%;transform:scale(.86);filter:drop-shadow(0 12px 20px rgba(0,0,0,.45))}
.card-nudgeq .project-card-visual img{object-position:center center}
.card-xr .project-card-visual img{object-position:65% center}
.card-checkin .project-card-visual img{object-position:center center}
.quickhire-slashes{filter:brightness(0) invert(1)}

/* Give the three exploration routes enough weight to read as real destinations. */
.secondary-section{padding-top:18px}
.secondary-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.secondary-card{height:150px;min-width:0;min-height:150px;padding:18px 20px;background:rgba(255,255,255,.72);border:1px solid rgba(17,17,17,.09);box-shadow:0 6px 18px rgba(22,18,12,.05)}
.secondary-card:hover{background:#fff;box-shadow:0 10px 26px rgba(22,18,12,.1)}
.secondary-content{max-width:62%}
.secondary-visual{display:flex;max-width:38%;height:100%;align-items:center;justify-content:center}
.secondary-visual img{max-width:100%;max-height:112px;object-fit:contain}
.motion-cube-preview{position:relative;width:38%;max-width:38%;height:116px;overflow:hidden;border-radius:8px;background:#090b10;box-shadow:0 5px 14px rgba(0,0,0,.2);pointer-events:none}
.motion-cube-preview iframe{position:absolute;left:50%;top:50%;width:960px;height:700px;border:0;pointer-events:none;transform:translate(-50%,-50%) scale(.26);transform-origin:center}
.secondary-subheading{font-size:17px;margin-bottom:6px}
.secondary-desc{font-size:12px;line-height:1.5}

.site-footer{background:linear-gradient(180deg,#f4f1ea 0%,#ece8df 100%);border-top:1px solid rgba(17,17,17,.14)}
.footer-brand{font-size:27px}.footer-nav-title{color:var(--blue)}

@media(max-width:1000px){
  .hero-grid{grid-template-columns:1fr}
  .hero-content{max-width:680px;margin-inline:auto}
  .hero-collage-wrapper{height:400px;min-height:400px}
}

@media(max-width:620px){
  .hero-section{padding-top:14px;padding-bottom:30px}
  .hero-grid{gap:6px}
  .hero-content{margin:0}
  .hero-professional-meta{font-size:9px;line-height:1.45;margin:-3px 0 8px}
  .hero-actions{display:grid;grid-template-columns:1.08fr .92fr;gap:10px;align-items:center}
  .btn-primary{width:auto;min-height:48px;padding:11px 14px;font-size:13px}
  .btn-secondary-link{width:auto;padding:10px 4px;font-size:13px;white-space:nowrap}
  .btn-secondary-link .hand-underline{width:100%;max-width:128px;left:50%;transform:translateX(-50%)}
  .hero-collage-wrapper{height:278px;min-height:278px;margin-top:0;overflow:visible}
  .hero-collage-stage{height:278px;max-width:300px;transform:none;overflow:visible}
  .layer-portrait{--x:46px;--y:47px;width:215px}
  .layer-crown{--x:62px;--y:26px;--rotation:-30deg;width:54px}
  .layer-polaroid-vr{--x:202px;--y:91px;width:88px}
  .layer-polaroid-vr .polaroid-frame img{height:62px}
  .layer-sticky-note{--x:198px;--y:155px;width:86px}
  .sticky-note-text{font-size:9.5px}
  .featured-section{padding-top:28px}
  .section-header{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;margin-bottom:18px}
  .section-title-wrap{min-width:0}.section-title{white-space:nowrap}
  .view-all-link{font-size:9px;text-align:right}
  .title-blue-brush{display:none}
  .project-card{height:300px;min-height:300px;padding:18px}
  .project-card-info,.card-quickhire .project-card-info,.card-sift .project-card-info,.card-nudgeq .project-card-info,.card-xr .project-card-info{max-width:64%}
  .card-quickhire .project-card-info{max-width:72%}
  .project-card::after{background:linear-gradient(90deg,rgba(8,10,15,.94) 0%,rgba(8,10,15,.8) 42%,rgba(8,10,15,.12) 100%)}
  .secondary-grid{grid-template-columns:1fr}
  .secondary-card{height:142px;min-height:142px;flex-direction:row;padding:16px 18px}
  .secondary-content{max-width:62%;margin-bottom:0}
  .secondary-visual{display:flex;max-width:36%;justify-content:flex-end}
  .secondary-subheading{font-size:16px}
  .secondary-desc{font-size:11.5px}
  .site-footer{padding-top:38px}
}

/* Hero dual-button action layout: View Work (Blue) & Download Resume (Dark Ink) */
.hero-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.btn-hero-work {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 50px;
  padding: 12px 24px;
  background: var(--blue);
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  border-radius: 9999px;
  box-shadow: 0 4px 14px rgba(32, 83, 255, 0.25);
  transition: all var(--transition-fast);
  text-decoration: none;
}

.btn-hero-work:hover {
  background: #123dbd;
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(32, 83, 255, 0.32);
}

.btn-hero-resume {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 50px;
  padding: 12px 24px;
  background: var(--ink);
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  border-radius: 9999px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  transition: all var(--transition-fast);
  text-decoration: none;
}

.btn-hero-resume:hover {
  background: #222222;
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}

@media (max-width: 700px) {
  .hero-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .btn-hero-work,
  .btn-hero-resume {
    width: 100%;
    min-height: 48px;
  }
}

/* Give QuickHire the lead position in the wide-screen featured-work row. */
@media(min-width:1500px){
  .featured-grid{grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr))}
  .card-quickhire .project-card-info{max-width:70%}
  .featured-grid .project-card:not(.card-quickhire) .project-card-info{max-width:68%}
}
