/* ── Unified card & section typography (overrides inline small text) ── */

/* Section headers — always centered */
.section-head,
#process > .reveal:first-child,
#target .inner-pad > div.reveal:first-child,
.service-page .page-hero > div,
.about-page .about-hero > div,
.about-page .inner-pad > .reveal:first-child,
.about-page .company-row > .reveal{
  text-align:center !important;
}
.section-head{
  flex-direction:column !important;
  align-items:center !important;
  gap:16px !important;
}
.section-head p,
#target .inner-pad > div.reveal:first-child p,
.service-page .page-hero p{
  max-width:620px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  font-size:17px !important;
  line-height:1.75 !important;
}

/* Shared card shell */
.chCard,
#target .grid-4 > div,
#target .target-card,
#process .process-step__card,
.service-page .svc-card,
.service-page .deliverables .grid-3 > div,
.about-page .grid-3 > div{
  text-align:center !important;
  border-radius:20px !important;
}

/* ── AD CHANNELS (6 cards) ── */
#channels .grid-3{
  grid-template-columns:repeat(2,1fr) !important;
  gap:20px !important;
}
#channels .chCard{
  padding:40px 32px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
}
#channels .chCard > div:first-child{
  flex-direction:column !important;
  align-items:center !important;
  text-align:center !important;
  gap:14px !important;
  margin-bottom:20px !important;
  width:100%;
}
#channels .chCard > div:first-child > div > div:first-child{
  font-size:24px !important;
  font-weight:700 !important;
}
#channels .chCard > div:first-child > div > div:last-child{
  font-size:15px !important;
  color:#9a9aa0 !important;
}
#channels .chCard > p{
  font-size:17px !important;
  line-height:1.75 !important;
  color:#b8b8bd !important;
  margin:0 0 22px !important;
  text-align:center !important;
}
#channels .chCard > div:last-child{
  align-items:center !important;
  width:100%;
  gap:10px !important;
}
#channels .chCard > div:last-child > div{
  font-size:16px !important;
  justify-content:center !important;
  text-align:center !important;
}
#channels .brand-mark{
  width:64px !important;
  height:64px !important;
  padding:12px !important;
  margin:0 auto;
}

/* ── INDUSTRY TARGET ── */
.section-card-img{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
  background:#1a1a1d;
}
#target .grid-4{
  grid-template-columns:repeat(2,1fr) !important;
  gap:20px !important;
}
#target .grid-4 > div,
#target .target-card{
  padding:0 !important;
  overflow:hidden;
}
#target .section-card-img{
  width:100%;
  height:auto;
  max-height:none;
  object-fit:unset;
  object-position:center;
  display:block;
  vertical-align:top;
  background:#1a1a1d;
}
#target .target-card__body{
  padding:44px 36px !important;
}
#target .target-card__num{
  font-size:20px !important;
  margin-bottom:20px !important;
}
#target .target-card__title{
  font-size:clamp(22px,2.5vw,26px) !important;
  margin-bottom:16px !important;
}
#target .target-card__body p{
  font-size:18px !important;
  line-height:1.75 !important;
  color:#b8b8bd !important;
}

/* ── HOW IT WORKS — zigzag timeline (PC) ── */
#process > .reveal:first-child{text-align:center !important}

#process .process-timeline{
  position:relative;
  max-width:980px;
  margin:0 auto;
  padding:12px 0;
}
#process .process-timeline::before{
  content:'';
  position:absolute;
  left:50%;
  top:32px;
  bottom:32px;
  width:2px;
  background:linear-gradient(180deg,transparent,rgba(255,212,0,.32) 6%,rgba(255,212,0,.32) 94%,transparent);
  transform:translateX(-50%);
  pointer-events:none;
}
#process .process-step{
  display:grid;
  grid-template-columns:1fr 52px 1fr;
  gap:clamp(20px,3vw,32px);
  align-items:center;
  margin-bottom:40px;
  padding:0 !important;
  border:none !important;
  background:transparent !important;
  overflow:visible !important;
  text-align:left !important;
}
#process .process-step:last-child{margin-bottom:0}
#process .process-step__card{
  width:100%;
  max-width:420px;
  background:#131316;
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  overflow:hidden;
  display:grid;
  grid-template-columns:148px 1fr;
  align-items:stretch;
  text-align:left !important;
  transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease;
}
#process .process-step__card:hover{
  border-color:rgba(255,212,0,.28);
  transform:translateY(-3px);
  box-shadow:0 16px 40px rgba(0,0,0,.35);
}
#process .process-step--left .process-step__card{
  grid-column:1;
  justify-self:end;
}
#process .process-step--left .process-step__marker{
  grid-column:2;
  justify-self:center;
}
#process .process-step--right .process-step__marker{
  grid-column:2;
  justify-self:center;
}
#process .process-step--right .process-step__card{
  grid-column:3;
  justify-self:start;
}
#process .process-step__marker{
  width:52px;
  height:52px;
  border-radius:50%;
  background:#0a0a0b;
  border:2px solid rgba(255,212,0,.55);
  box-shadow:0 0 0 6px rgba(255,212,0,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  z-index:1;
}
#process .process-step__marker span{
  font-family:'Space Grotesk',sans-serif;
  font-size:15px;
  font-weight:700;
  color:var(--accent);
}
#process .process-step__img,
#process .process-step .section-card-img{
  width:100%;
  height:100% !important;
  min-height:148px;
  object-fit:cover;
}
#process .process-step__body{
  padding:28px 26px !important;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
#process .process-step__title{
  font-size:22px !important;
  font-weight:700 !important;
  color:#fff !important;
  margin-bottom:10px !important;
  line-height:1.35 !important;
}
#process .process-step__body p{
  font-size:16px !important;
  line-height:1.75 !important;
  color:#b8b8bd !important;
  margin:0 !important;
}

/* ── STATS ── */
.stats-flex{
  align-items:center !important;
  text-align:center !important;
}
.stats-flex > div:first-child{
  max-width:100% !important;
  text-align:center !important;
}
.stats-flex > div:first-child h2{
  font-size:clamp(38px,4.8vw,60px) !important;
}
.stats-flex > div:last-child{
  justify-content:center !important;
  width:100%;
}
.stats-flex > div:last-child > div > div:last-child{
  font-size:15px !important;
}

/* ── PORTFOLIO ── */
#portfolio .section-head{
  text-align:center !important;
  align-items:center !important;
}
#portfolio .section-head p{
  font-size:16px !important;
}
.pfCard > div:last-child span:first-child{
  font-size:16px !important;
}
.pfCard > div:last-child span:last-child{
  font-size:14px !important;
}

/* Portfolio carousel — horizontal auto-slide */
.pf-carousel{
  position:relative;
  max-width:1200px;
  margin:0 auto;
}
.pf-carousel__viewport{
  overflow:hidden;
  padding:4px 0;
}
.pf-carousel__track{
  display:flex;
  gap:20px;
  transition:transform .6s cubic-bezier(.22,1,.36,1);
  will-change:transform;
}
.pf-slide{
  flex:0 0 calc(33.333% - 14px);
  min-width:0;
}

/* 분양광고 배너 */
.pf-ad{
  position:relative;
  height:240px;
  overflow:hidden;
  background:#1a1a1d;
}
.pf-ad__bg{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.pf-ad__overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.15) 35%,rgba(0,0,0,.72) 100%);
  padding:16px 18px 18px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.pf-ad__badge{
  position:absolute;
  top:14px;
  left:14px;
  background:#e53935;
  color:#fff;
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  padding:5px 10px;
  border-radius:3px;
}
.pf-ad__badge--gold{
  background:linear-gradient(135deg,#c9a227,#ffd400);
  color:#1a1200;
}
.pf-ad__badge--navy{
  background:#1a237e;
  color:#fff;
}
.pf-ad__brand{
  font-size:10px;
  font-weight:600;
  letter-spacing:.12em;
  color:rgba(255,212,0,.92);
  text-transform:uppercase;
  margin-bottom:4px;
}
.pf-ad__title{
  font-size:22px;
  font-weight:800;
  color:#fff;
  letter-spacing:-.03em;
  line-height:1.15;
  margin:0 0 6px;
  text-shadow:0 2px 12px rgba(0,0,0,.45);
}
.pf-ad__title em{
  font-style:normal;
  color:#ffd400;
}
.pf-ad__copy{
  font-size:12px;
  color:rgba(255,255,255,.82);
  line-height:1.5;
  margin:0 0 8px;
  letter-spacing:-.01em;
}
.pf-ad__tags{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.pf-ad__tags span{
  font-size:10px;
  font-weight:600;
  color:#fff;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  padding:3px 8px;
  border-radius:3px;
  letter-spacing:-.01em;
}

.pf-carousel__dots{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-top:28px;
}
.pf-carousel__dot{
  width:8px;
  height:8px;
  border-radius:50%;
  border:none;
  padding:0;
  background:rgba(255,255,255,.22);
  cursor:pointer;
  transition:background .25s ease,transform .25s ease;
}
.pf-carousel__dot.is-active{
  background:var(--accent);
  transform:scale(1.25);
}
.pf-carousel__dot:hover{
  background:rgba(255,212,0,.55);
}

@media(max-width:1024px){
  .pf-slide{
    flex:0 0 calc(50% - 10px);
  }
}
@media(max-width:768px){
  .pf-slide{
    flex:0 0 100%;
  }
  .pf-carousel__track{
    gap:0;
  }
  .pf-ad{
    height:220px;
  }
  .pf-ad__title{
    font-size:20px;
  }
}

/* ── ABOUT PAGE ── */
.about-page .about-hero > div{
  text-align:center !important;
  margin:0 auto;
}
.about-page .inner-pad,
.about-page .inner-pad h2{
  text-align:center !important;
}
.about-page .inner-pad h2{
  margin-left:auto !important;
  margin-right:auto !important;
}
.about-page .about-hero p{
  font-size:18px !important;
  max-width:640px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.about-page .grid-3{
  grid-template-columns:1fr !important;
  gap:18px !important;
}
.about-page .grid-3 > div{
  padding:40px 32px !important;
  text-align:center !important;
  background:#131316;
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
}
.about-page .grid-3 > div > div:first-child{
  font-size:18px !important;
  margin-bottom:20px !important;
}
.about-page .grid-3 > div > div:nth-child(2){
  font-size:22px !important;
  margin-bottom:14px !important;
}
.about-page .grid-3 > div p{
  font-size:17px !important;
  line-height:1.75 !important;
  color:#b8b8bd !important;
}
.about-page .stats-grid > div{
  text-align:center !important;
  padding:36px 24px !important;
}
.about-page .stats-grid > div > div:last-child{
  font-size:15px !important;
}
.about-page .company-row{
  text-align:center !important;
}
.about-page .company-row > .reveal{
  margin:0 auto;
}
.about-page .info-row{
  flex-direction:column !important;
  align-items:center !important;
  gap:8px !important;
  text-align:center !important;
  padding:20px 0 !important;
}
.about-page .info-row span:first-child{
  font-size:15px !important;
}
.about-page .info-row span:last-child{
  font-size:17px !important;
}

/* ── FAQ & CONTACT ── */
.faq-block{
  text-align:center !important;
}
.faq-block summary{
  font-size:18px !important;
  text-align:left;
}
.faq-block p{
  font-size:17px !important;
  text-align:left;
}
.contact-grid > .reveal{
  text-align:center !important;
}
.contact-grid > .reveal p{
  font-size:17px !important;
  max-width:480px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ── Mobile ── */
@media(max-width:768px){
  #channels .grid-3,
  #target .grid-4{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .pf-carousel__viewport{
    overflow:hidden;
  }
  .pf-carousel__track{
    gap:16px !important;
  }
  #channels .chCard{padding:36px 28px !important}
  #channels .chCard > div:first-child > div > div:first-child{font-size:22px !important}
  #channels .chCard > p{font-size:18px !important}
  #channels .chCard > div:last-child > div{font-size:17px !important}
  #target .target-card__body{padding:36px 28px !important}
  #target .target-card__title{font-size:22px !important}
  #target .target-card__body p{font-size:18px !important}
  #process .process-timeline::before{
    left:22px;
    transform:none;
    top:24px;
    bottom:24px;
  }
  #process .process-step{
    grid-template-columns:44px 1fr !important;
    gap:14px !important;
    margin-bottom:24px !important;
  }
  #process .process-step__marker{
    grid-column:1 !important;
    grid-row:1;
    width:44px !important;
    height:44px !important;
    align-self:start;
    margin-top:18px;
  }
  #process .process-step__marker span{font-size:13px !important}
  #process .process-step__card{
    grid-column:2 !important;
    grid-row:1;
    max-width:none !important;
    display:block !important;
    grid-template-columns:unset !important;
  }
  #process .process-step__body{padding:24px 22px !important}
  #process .process-step__title{font-size:20px !important}
  #process .process-step__body p{font-size:17px !important}
  #process .process-step .section-card-img{
    height:160px !important;
    min-height:0 !important;
  }
  #target .section-card-img{
    height:auto !important;
    max-height:none !important;
  }
  .stats-flex{align-items:center !important;text-align:center !important}
  .stats-flex > div:last-child{
    display:grid !important;
    grid-template-columns:repeat(2,1fr) !important;
    gap:20px !important;
  }
  .section-head p{font-size:17px !important}
  .about-page .grid-3 > div > div:nth-child(2){font-size:20px !important}
  .about-page .grid-3 > div p{font-size:17px !important}
}

@media(min-width:1200px){
  #channels .grid-3{
    grid-template-columns:repeat(3,1fr) !important;
  }
}
