/* Frontpage overrides to ensure theme styles win over WP block / global styles */
/* Scoped to home/front page where possible to minimize global side-effects */

/* Layout container sizing */
body.home .container,
body.blog .container {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 0 20px !important;
}

/* Header */
body .site-header .brand a { font-weight:700 !important; font-size:1.05rem !important; color: var(--primary) !important; }
body .site-header { background: transparent !important; border-bottom: 1px solid var(--border) !important; }

/* Hero */
body.home .hero { padding: 64px 0 !important; background: var(--surface) !important; }
body.home .hero .hero-inner { display:flex !important; align-items:center !important; gap:32px !important; }
body.home .hero .hero-copy h1 { font-size: clamp(28px, 4.5vw, 44px) !important; line-height:1.08 !important; color: var(--primary) !important; margin:0 0 12px 0 !important; }
body.home .hero .lead { color: var(--muted) !important; font-size:1.05rem !important; }

/* Profile card */
.profile-card { background: linear-gradient(180deg, rgba(255,255,255,0.9), rgba(250,250,250,0.9)) !important; border:1px solid var(--border) !important; padding:18px !important; border-radius:12px !important; width:220px !important; box-shadow:var(--shadow) !important; }
.profile-card .avatar { width:96px !important; height:96px !important; border-radius:12px !important; object-fit:cover !important; display:block !important; margin-bottom:12px !important; }

/* Buttons */
.btn, .wp-block-button__link { border-radius:10px !important; padding:10px 16px !important; font-weight:600 !important; }
.btn-primary, .btn.btn-primary, .wp-block-button__link.is-style-primary { background: var(--primary) !important; color:#fff !important; }
.btn-outline, .btn.btn-outline { background:transparent !important; border:1px solid var(--primary) !important; color:var(--primary) !important; }

/* Sections spacing */
body.home .section { padding:56px 0 !important; }

/* Skill bars */
.skill-bar { background: rgba(0,0,0,0.06) !important; border-radius:8px !important; height:14px !important; overflow:hidden !important; }
.skill-fill { height:100% !important; width:0% !important; transition:width 900ms cubic-bezier(.2,.9,.3,1) !important; background: linear-gradient(90deg,var(--primary), var(--accent)) !important; border-radius:8px !important; }

/* Services grid */
.services-grid { display:grid !important; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)) !important; gap:18px !important; }
.service-card { padding:18px !important; border-radius:10px !important; border:1px solid var(--border) !important; background:var(--surface) !important; }

/* Portfolio */
.portfolio-grid { display:grid !important; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)) !important; gap:16px !important; }
.portfolio-item { padding:20px !important; border-radius:8px !important; background:#fff !important; border:1px solid var(--border) !important; }

/* Contact form */
.contact-form label { display:block !important; margin-bottom:10px !important; }
.contact-form input, .contact-form textarea { width:100% !important; padding:10px !important; border:1px solid var(--border) !important; border-radius:8px !important; }

/* Reveal helper (ensure off-by default and animated when JS adds class) */
.reveal { opacity:0; transform: translateY(12px); transition: opacity 560ms ease, transform 560ms ease; }
.reveal.visible { opacity:1 !important; transform:none !important; }

/* Minor responsive adjustments */
@media (max-width:800px) {
  body.home .hero .hero-inner { flex-direction:column-reverse !important; text-align:center !important; }
  .profile-card { width:100% !important; max-width:320px !important; margin:0 auto 18px auto !important; }
}

/* Make sure WP block list/grid display doesn't collapse our spacing */
.wp-block-columns, .wp-block-column { gap:0 !important; }
