/* 기본 색상 변수 */
:root{
  --orange:#ff6a00;
  --orange-dark:#e35700;
  --glass-bg:rgba(255,255,255,.15);
  --glass-border:rgba(255,255,255,.25);
}

/* 로고 크기 */
.logo-img{
  height:32px;
  width:auto;
}

/* HERO 영역 */
.hero-area{
  position:relative;
  min-height:60vh;
  background: linear-gradient(135deg, var(--orange) 0%, #ff9444 100%);
  display:flex;
  align-items:center;
}
.hero-overlay{
  position:absolute;
  inset:0;
  background-image: radial-gradient(rgba(255,255,255,.15) 1px, transparent 1px);
  background-size:24px 24px;
  pointer-events:none;
  mix-blend-mode:soft-light;
}
.hero-inner{
  position:relative;
  z-index:2;
  max-width:960px;
}
.hero-title{
  font-size: clamp(2rem, 5vw, 3.5rem);
  line-height:1.25;
  letter-spacing:-.02em;
  margin-top: 3rem;
}
.hero-sub{
  font-size: clamp(1rem, 2.2vw, 1.35rem);
  opacity:.9;
  margin-bottom:1.5rem!important;
}

/* 검색 박스 */
.hero-search{
  width:100%;
  max-width:820px;
  display:flex;
  align-items:center;
  gap:.75rem;
  background: var(--glass-bg);
  border:1px solid var(--glass-border);
  backdrop-filter: blur(18px);
  padding:.9rem 1.25rem;
  margin-top: 6rem;
  border-radius:48px;
  box-shadow:0 0 0 2px rgba(255,255,255,.08);
}
.hero-search i{
  font-size:1.25rem;
  opacity:.85;
}
.hero-search input{
  flex:1;
  background:transparent;
  border:none;
  color:#fff;
  font-size:1.05rem;
  outline:none;
}
.hero-search input::placeholder{
  color:rgba(255,255,255,.8);
}
.btn-orange{
  background:#fff;
  color:var(--orange-dark);
  font-weight:600;
  border:none;
  border-radius:32px;
  padding:.55rem 1.2rem;
}
.btn-orange:hover{
  filter:brightness(.95);
}

.hero-area{
  padding-bottom:3rem;  /* 히어로 하단 여백 */
}

/* 공통 효과 */
.shadow-sm{box-shadow:0 .25rem .5rem rgba(0,0,0,.12)!important;}
.hover-lift{transition:transform .15s, box-shadow .15s;}
.hover-lift:hover{transform:translateY(-2px);box-shadow:0 .75rem 1.5rem rgba(0,0,0,.18)!important;}

/* 카드 */
.prompt-card{
  transition:transform .15s, box-shadow .15s;
  cursor:pointer;
}
.prompt-card:hover{
  transform:translateY(-3px);
  box-shadow:0 .75rem 1.5rem rgba(0,0,0,.1);
}

.text-orange{ color: var(--orange) !important; }

.tag-badge{
  font-size:0.75rem;
  margin-right:.25rem;
}

/* 아이콘(하트/별/북마크) */
.like-icon,
.star{
  cursor:pointer;
}
.bookmark-icon{
  font-size:1.2rem;
  color:#ccc;
  cursor:pointer;
}
.bookmark-icon.active{
  color:var(--orange);
}

/* 프롬프트 내용 프리 태그 */
pre{
  white-space:pre-wrap;
  word-break:break-word;
  font-size:.8rem;
}

/* 리뷰/댓글 목록 */
.review-item, .comment-item{
  background:#f8f9fa;
  border-radius:.5rem;
  padding:.75rem 1rem;
  margin-bottom:.75rem;
}
.review-meta, .comment-meta{
  font-size:.75rem;
  color:#999;
}

/* 별점 입력 영역 */
.star-input i{
  font-size:1.2rem;
  color:#f2b01e;
  cursor:pointer;
}
.star-input i.filled{
  color:#f2b01e;
}

/* 필터 select 래퍼 (폭 제한) */
.filter-select-wrap{
  width:170px;
}

/* 모바일 대응 */
@media (max-width:576px){
  .hero-search{padding:.75rem 1rem;}
  .btn-orange{padding:.45rem 1rem;}
  .filter-select-wrap{width:100%;}
}

/* ===== PROMPOT HOTFIX ===== */
header#topbar{
  display:flex;
  align-items:center;
  gap:20px;
  padding:12px 24px;
  max-width:1280px;
  margin:0 auto;
}
header#topbar .logo-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
}
header#topbar .logo-wrap img{
  height:46px;            /* 로고 크기 고정 */
  width:auto !important;
  flex-shrink:0;
}
header#topbar .logo-wrap span{
  font-weight:700;
  font-size:1.25rem;
  color:var(--primary-dark);
  line-height:1;
  white-space:nowrap;
}

header#topbar nav{
  margin-left:auto;
  display:flex;
  gap:32px;
  align-items:center;
}
header#topbar nav a{
  font-size:15px;
  line-height:1;
  white-space:nowrap;
  color:#444;
}
header#topbar nav a:hover{color:var(--primary-dark);}

#loginOpenBtn{
  margin-left:18px;
  white-space:nowrap;
  padding:.45rem 1rem;
  line-height:1;
}

/* 카드 줄간격 넓게 */
.prompt-card h5{line-height:1.5;}
.prompt-card .card-text{line-height:1.75;}
.small{line-height:1.6;}