/* ===== Hero (텍스트 소폭 축소, CTA 없음) ===== */
.pf-hero{
  position:relative;
  min-height: 85vh;
  display:flex; align-items:center; justify-content:center;
  background:
    linear-gradient(to bottom, rgba(0,0,0,.35), rgba(0,0,0,.55)),
    url("images/portfolio.jpg") center/cover no-repeat;
  color:#fff;
  overflow:hidden;
}
.pf-hero-inner{ text-align:center; padding:48px 16px; max-width:900px; will-change: transform; }
.pf-hero .eyebrow{ letter-spacing:.12em; opacity:.9; margin-bottom:6px }
.pf-hero h1{
  font-size: clamp(24px, 3.6vw, 44px);
  font-weight: 800; letter-spacing:.2px;
  text-shadow:0 2px 14px rgba(0,0,0,.35);
  margin-bottom:8px;
}
.pf-hero-desc{
  font-size: clamp(13px, 1.2vw, 16px);
  opacity:.95; text-shadow:0 1px 10px rgba(0,0,0,.35);
}

/* ===== Sticky tabs ===== */
.pf-tabs{
  position:sticky; top:64px; z-index:900;
  backdrop-filter:saturate(180%) blur(6px);
  background:rgba(255,255,255,.78);
  border-bottom:1px solid #eee;
  display:flex; gap:14px; padding:10px 16px; justify-content:center; flex-wrap:wrap;
}
.pf-tabs a{
  color:#111; font-weight:700; padding:8px 12px; border-radius:999px;
  text-decoration:none; border:1px solid #e5e7eb; background:#fff;
  transition: transform .15s ease;
}
.pf-tabs a:hover{ transform:translateY(-1px) }

/* ===== Sections ===== */
.section{
  max-width:1200px;
  margin:110px auto;
  padding:0 16px;
}
.section--spacious{ margin:140px auto; }
.section-head{ text-align:center; margin-bottom:22px }
.section-head h2{ font-size: clamp(22px, 2.6vw, 34px); font-weight:800; margin:0 0 6px }
.section-head p{ color:#4b5563 }

/* ===== Awards: timeline ===== */
.award-timeline{ list-style:none; margin:26px auto 8px; padding-left:0; max-width:960px; position:relative }
.award-timeline::before{
  content:""; position:absolute; left:18px; top:0; bottom:0; width:2px; background:#e5e7eb;
}
.award-item{ position:relative; padding-left:56px; margin:18px 0 }
.award-item .dot{
  position:absolute; left:10px; top:14px; width:16px; height:16px; border-radius:50%;
  background:var(--brand, #0D9488); box-shadow:0 0 0 4px rgba(13,148,136,.12);
}
.award-item .card{
  background:#fff; border:1px solid #eee; border-radius:14px; padding:12px 14px;
  box-shadow:0 6px 16px rgba(0,0,0,.04);
  transition: transform .15s ease, box-shadow .15s ease;
}
.award-item .badge{
  display:inline-block; font-weight:900; font-size:12px; color:#0f766e;
  background:rgba(13,148,136,.1); border:1px solid rgba(13,148,136,.25);
  padding:4px 8px; border-radius:999px; margin-bottom:6px;
}
.award-item h3{ font-size:18px; margin:2px 0 6px }
.award-item .meta{ color:#6b7280; font-size:14px }
.hl{ color:var(--brand, #0D9488) }

/* ===== Cards ===== */
.grid{ display:grid; grid-template-columns: repeat(12, 1fr); gap:18px; margin-top:16px }
.m-card{
  grid-column: span 12; background:#fff; border:1px solid #eee; border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column; box-shadow:0 8px 24px rgba(0,0,0,.04);
  transition: transform .15s ease, box-shadow .15s ease;
}
.m-thumb img{ width:100%; height:260px; object-fit:cover; display:block }
.m-body{ padding:14px 16px 18px }
.m-body h3{ font-size:20px; font-weight:800; margin:4px 0 6px }
.meta{ color:#6b7280; font-size:14px; margin:0 0 10px }
.ticks{ list-style:none; margin:0; padding:0; display:grid; gap:6px }
.ticks li{ padding-left:20px; position:relative }
.ticks li::before{
  content:""; position:absolute; left:0; top:.6em; width:10px; height:10px; border-radius:50%;
  background:var(--brand, #0D9488);
}

/* desktop */
@media (min-width: 960px){
  .m-card{ grid-column: span 12; flex-direction:row }
  .m-thumb{ flex:0 0 42% }
  .m-body{ flex:1 }
}

/* ===== Reveal ===== */
[data-reveal]{ opacity:0; transform: translateY(14px); transition: opacity .5s ease, transform .5s ease }
[data-reveal].is-revealed{ opacity:1; transform:none }
[data-reveal][data-reveal-delay="80"].is-revealed{ transition-delay:.08s }
[data-reveal][data-reveal-delay="120"].is-revealed{ transition-delay:.12s }

/* Hover */
.m-card:hover, .award-item .card:hover{ transform:translateY(-2px); box-shadow:0 10px 28px rgba(0,0,0,.06) }

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  [data-reveal]{ transition:none }
  .m-card, .award-item .card{ transition:none }
  .m-card:hover, .award-item .card:hover{ transform:none; box-shadow:none }
}

/* ===== Footer ===== */
.site-footer{
  background:#111;
  color:#ccc;
  padding:48px 20px 28px;
  font-size:15px;
  line-height:1.8;
}
.footer-inner{ max-width:1200px; margin:0 auto; }
.footer-top{ display:flex; align-items:center; gap:12px; margin-bottom:22px; }
.footer-logo{ height:32px; width:auto; display:block; }
.footer-info{ color:#aaa; margin-bottom:22px; }
.footer-info a{ color:#aaa; text-decoration:none; }
.footer-info a:hover{ text-decoration:underline; }
.site-footer hr{ border:none; border-top:1px solid #333; margin:22px 0; }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; color:#777; }
.footer-links a{ color:#aaa; text-decoration:none; margin:0 4px; }
.footer-links a:hover{ text-decoration:underline; }
.footer-copy{ font-size:14px; }

/* Footer motion off */
.site-footer, .site-footer * { transition: none !important; }
