/*
Theme Name: SajidWasim-Reeni (Custom)
Theme URI: https://sajidwasim.info
Author: SW-V1 Agent
Author URI: https://sajidwasim.info
Description: Custom WordPress theme based on 'Reeni' template design logic. Built for performance and strict reference parity.
Version: 1.3.0
Text Domain: sajidwasim-reeni
*/

/* Reset & Normalize included if necessary, or rely on browser defaults + theme CSS */

/* Project Card Styles */
.project-isotope .item p { margin-bottom: 20px; font-size: 14px; }
.project-isotope .item .thumb { overflow: hidden; height: 260px; }
.project-isotope .item .thumb img { width: 100%; height: 100%; object-fit: cover; }
/* Project Details Specifics */
.project-details-inner h2 { margin-top: 30px; margin-bottom: 20px; font-weight: 700; color: #17172b; }
.project-details-inner h3 { margin-top: 25px; margin-bottom: 15px; font-weight: 600; color: #d01c27; }
.project-details-inner ul { padding-left: 20px; margin-bottom: 30px; }
.project-details-inner ul li { position: relative; list-style-type: none; margin-bottom: 10px; color: #5a5a6e; }
.project-details-inner ul li::before { content: '\f00c'; font-family: 'Font Awesome 5 Free'; font-weight: 900; position: absolute; left: -25px; top: 2px; color: #d01c27; }

/* =============================================
   Scoped Style Alignment — index-13 Patterns
   All rules use existing Reeni CSS variables.
   Prefix: sw- to avoid collision.
   ============================================= */

/* --- Resume: Timeline Cards --- */
.sw-resume-card {
  background: var(--color-card, #1b1b1c);
  padding: 30px 35px;
  border-radius: 6px;
  margin-bottom: 30px;
  position: relative;
  transition: var(--transition);
}
.sw-resume-card:hover {
  border-left: 3px solid var(--color-primary);
}
.sw-timeline {
  position: relative;
  padding-left: 30px;
}
.sw-timeline::before {
  content: '';
  position: absolute;
  left: 6px;
  top: 0;
  bottom: 0;
  width: 1px;
  border-left: 2px dotted rgba(255,255,255,0.12);
}
.sw-timeline .sw-resume-card::before {
  content: '';
  position: absolute;
  left: -30px;
  top: 35px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid var(--color-primary);
  background: var(--color-secondary, #060606);
  z-index: 1;
}
.sw-resume-title {
  padding-left: 12px;
  border-left: 3px solid var(--color-primary);
  margin-bottom: 30px;
}

/* --- Services: Hover Polish --- */
.sw-service-lift {
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
  border-top: 2px solid transparent;
}
.sw-service-lift:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
  border-top-color: var(--color-primary);
}

/* --- Skills: Progress Bars --- */
.sw-skills-section {
  padding: 80px 0;
}
.sw-skill-row {
  margin-bottom: 28px;
}
.sw-skill-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 10px;
}
.sw-skill-name {
  font-family: var(--font-primary);
  font-size: 18px;
  font-weight: var(--p-semi-bold);
  color: var(--color-heading);
}
.sw-skill-level {
  font-family: var(--font-primary);
  font-size: 14px;
  font-weight: var(--p-medium);
  color: var(--color-primary);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.sw-skill-track {
  width: 100%;
  height: 10px;
  background: rgba(255,255,255,0.06);
  border-radius: 5px;
  overflow: hidden;
}
.sw-skill-fill {
  height: 100%;
  background: var(--color-primary);
  border-radius: 5px;
  width: 0;
  transition: width 1.2s ease-in-out;
}


/* --- Portfolio: Hover Polish --- */
.sw-portfolio-card {
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.sw-portfolio-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.4);
}
.sw-portfolio-category {
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--color-primary) !important;
  font-size: 14px;
  font-weight: var(--p-semi-bold);
}