:root{
  --accent-1:#6f7cff;
  --accent-2:#8fe3ff;
  --card-bg: rgba(255,255,255,0.85);
  --muted:#6b7280;
}

body{
  font-family: 'Poppins', sans-serif;
  background-color: #e6dfd3;
  color:#1f2937;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* header */
.page-header{
  padding: 48px 16px;
  text-align:center;
  background: linear-gradient(135deg,var(--accent-1), #7be0b8);
  color: #fff;
  margin-bottom: 18px;
  box-shadow: 0 6px 30px rgba(15,23,42,0.08);
}
.page-header h1{
  font-family:'Playfair Display', serif;
  font-weight:700;
  font-size: clamp(1.6rem, 3.6vw, 2.6rem);
  margin-bottom: 6px;
  letter-spacing: .4px;
}
.page-header p{ margin:0; opacity:0.95; font-size:1rem; }

/* controls */
.controls {
  margin: 20px auto;
  max-width: 1100px;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  padding: 0 12px;
}
.search-input{
  width: min(600px,100%);
  border-radius: 999px;
  padding: 12px 18px;
  border: none;
  box-shadow: 0 8px 20px rgba(31,41,55,0.06);
}

/* author grid */
.author-card{
  
  background: linear-gradient(180deg, rgba(255,255,255,0.95), rgba(250,250,255,0.8));
  border-radius: 8px;
  padding: 15px;
  min-height: 220px;
  display:flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%; 
  gap:16px;
  align-items: center;
  transition: transform .22s ease, box-shadow .22s ease;
  border: 1px solid #8b5e3c;
}
.author-card:hover{
  transform: translateY(-8px);
  box-shadow: 0 20px 40px rgba(15,23,42,0.08);
}

.author-avatar{
  flex: 0 0 96px;
  width:96px;
  height:96px;
  border-radius:50%;
  overflow:hidden;
  border: 3px solid rgba(255,255,255,0.6);
  box-shadow: 0 6px 18px rgba(15,23,42,0.06);

}
.author-avatar img{
  width:100%; height:100%; object-fit:cover;border-radius: 50%;
  display:block;
}

.author-body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  align-items: center;
  text-align: center;
}
.author-name {
  font-weight: 600;
  font-size: 1rem;
  margin-bottom: 0.3rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  word-wrap: break-word;
}
.author-bio {
  font-size: 0.85rem;
  color: #555;
  margin-bottom: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  max-height: 3.6em; /* ~3 lines */
}

.author-meta {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;  /* allow wrapping on small screens */
  gap: 6px;
  margin-top: auto;
}

.meta-pill{
  background: rgba(111,124,255,0.08);
  color: var(--accent-1);
  padding:6px 10px;
  border-radius:999px;
  font-weight:600;
  font-size:0.85rem;
}

.btn-view {
  background: linear-gradient(135deg, #d4a373, #a35525); /* warm, vintage gradient */
  color: #ffffff;
  border: 1px solid #8b5e3c; /* subtle traditional border */
  padding: 5px 10px;
  border-radius: 6px; /* slightly less rounded for old-style feel */
  white-space: nowrap;
  font-size: 0.85rem;
  font-weight: 600;
  font-family: 'Playfair Display', serif; /* elegant, classic font */
  box-shadow: 0 4px 12px rgba(0,0,0,0.25); /* softer shadow */
  text-shadow: 0 1px 1px rgba(0,0,0,0.2); /* subtle text depth */
  transition: all 0.3s ease;
  margin-top: 4px;
  cursor: pointer;
}

.btn-view:hover {
  background: linear-gradient(135deg, #c77f52, #a3593f);
  box-shadow: 0 6px 16px rgba(0,0,0,0.35);
  transform: translateY(-2px);
}


/* responsive adjustments */
@media (max-width:767px){
  .author-card{
    flex-direction: column;
    align-items: center;
    padding:15px;
    min-height:auto;
    width: 100%;
  }
  .author-avatar{
    width:94px; 
    height:84px;
  }
  .author-body{
    text-align: center;
  }
  .author-meta {
    flex-direction: row;  /* stack all items vertically */
    align-items: center;
    gap: 6px; 
  }
  .btn-view{
    margin-top: 6px;
  }
}

/* modal author profile */
.modal-header { border:none; }
.profile-banner{
  height:160px;
  background: linear-gradient(120deg,#a1c4fd,#c2e9fb);
  border-radius: 12px;
  margin-bottom: -48px;
  box-shadow: 0 12px 30px rgba(15,23,42,0.06);
}
.profile-avatar{
  width:110px; height:110px; border-radius:50%;
  overflow:hidden; border:6px solid white; box-shadow:0 8px 22px rgba(0,0,0,0.12);
  position:relative; top:-55px; background:white;
}
.profile-name{
  font-family:'Playfair Display', serif; font-size:1.6rem; font-weight:700;
}
.profile-bio{ color:var(--muted); margin-top:8px; margin-bottom:14px; }

.quote-list .quote-item{
  background: linear-gradient(90deg, rgba(255,255,255,0.96), rgba(250,250,255,0.96));
  padding:14px; border-radius:12px; margin-bottom:12px;
  box-shadow: 0 6px 18px rgba(15,23,42,0.04);
  font-family: 'Georgia', serif;
  font-style: italic;
  margin-bottom: 15px;
}

.stat-pill{
  display:inline-block;
  padding:10px 14px; border-radius:12px; margin-right:10px;
  background: rgba(0,0,0,0.04); font-weight:700; color:#1f2937;
}
