/*
Theme Name: Riley Portfolio
Author: Riley Spiller
Version: 1.0
*/

/* ===== Portfolio basics ===== */
.grid { display: grid; gap: 1.25rem; }
.projects-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }

.project-card { background:#fff; border:1px solid #eee; border-radius:12px; overflow:hidden; transition: transform .15s ease, box-shadow .15s ease; }
.project-card:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(0,0,0,.06); }
.project-card a { color: inherit; text-decoration: none; display:block; padding-bottom:12px; }
.project-thumb img { width: 100%; height: auto; display:block; }
.project-title { font-size: 1.125rem; margin: 12px 12px 4px; }
.project-excerpt { margin: 0 12px; color:#555; }

.project-single { max-width: 900px; margin: 0 auto; }
.project-hero h1 { margin-top: 0; }
.project-hero-img img { width:100%; height:auto; border-radius:12px; }
.project-content { margin-top: 16px; line-height: 1.7; }
.project-nav { display:flex; justify-content:space-between; margin: 24px 0; }

/* Typography helpers */
.project-sub { color:#555; margin: 6px 0 0; }

/* Meta list */
.project-meta { list-style:none; padding:0; margin:12px 0; display:flex; flex-wrap:wrap; gap:10px 16px; }
.project-meta li { color:#333; }

/* Buttons */
.btn { display:inline-block; padding:10px 14px; border-radius:10px; text-decoration:none; border:1px solid #ddd; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0,0,0,.06); }
.btn.secondary { background:#f6f6f6; }

/* Sections */
.project-section { margin-top: 28px; }
.project-section h2 { margin: 0 0 8px; }

/* ===== Home ===== */
.home-hero { text-align:center; padding: 48px 0 24px; }
.home-hero h1 { font-size: clamp(2rem, 4vw, 3rem); margin: 0 0 8px; }
.tagline { color:#555; margin:0 0 16px; }
.home-cta .btn { margin-right: 8px; }

.home-featured { margin-top: 24px; }
.home-featured h2 { margin: 0 0 12px; }

/* ===== Navigation ===== */
.site-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 24px; border-bottom:1px solid #eee;
}
.logo { font-weight:700; text-decoration:none; }

.nav-toggle {
  display:none; background:none; border:1px solid #ddd; border-radius:8px;
  padding:8px 10px; font-size:1rem; cursor:pointer;
}

.nav .menu { list-style:none; display:flex; gap:16px; margin:0; padding:0; }
.nav .menu li a { text-decoration:none; padding:8px 4px; display:block; }
.nav .menu li.current-menu-item > a,
.nav .menu li.current_page_item > a { border-bottom:2px solid #000; }

/* Screen reader only helper */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }

/* Mobile */
@media (max-width: 800px) {
  .nav-toggle { display:inline-block; }
  .nav { display:none; width:100%; }
  .nav.open { display:block; }
  .nav .menu { flex-direction:column; gap:8px; padding-top:12px; }
}

/* ===== About ===== */
.about-hero { display:grid; gap:24px; grid-template-columns: 160px 1fr; align-items:start; }
.about-headshot { width:160px; height:160px; object-fit:cover; border-radius:50%; border:1px solid #eee; }
.pill-list { list-style:none; padding:0; margin:12px 0 0; display:flex; flex-wrap:wrap; gap:10px; }
.pill-list li { padding:8px 12px; border:1px solid #ddd; border-radius:999px; }
@media (max-width:800px){ .about-hero{ grid-template-columns:1fr; } }

/* ===== Contact ===== */
.contact-list { list-style:none; padding:0; margin:0 0 16px; display:grid; gap:6px; }
.contact-form form input, .contact-form form textarea {
  width:100%; max-width:600px; padding:10px; border:1px solid #ddd; border-radius:10px;
}
.contact-form form button { margin-top:6px; }