/* ============================================================
   SERVICES PAGES (Printing / Creative / Branding)
   ============================================================ */

/* ---- breadcrumb ---- */
.svc-breadcrumb{font-family:var(--mono); font-size:12px; letter-spacing:.04em; color:var(--muted); margin-bottom:20px;}
.svc-breadcrumb a{color:var(--muted); transition:color .2s ease;}
.svc-breadcrumb a:hover{color:var(--yellow);}
.svc-breadcrumb span{margin:0 6px; color:var(--muted-2);}

/* ---- banner (after navbar, title + quote) ---- */
.svc-banner{position:relative; padding:calc(var(--sp-6) + 40px) 0 var(--sp-5); overflow:hidden; border-bottom:1px solid var(--line);}
.svc-quote{font-family:var(--display); font-style:normal; font-size:clamp(16px,2vw,20px); color:var(--yellow-2); margin-top:18px; max-width:640px; letter-spacing:.01em; text-transform:none;}

/* ---- description card under banner ---- */
.svc-desc-card{font-size:15.5px; line-height:1.8; color:var(--paper-dim); max-width:900px;}

/* ---- index page package/category cards ---- */
.svc-item-card{display:flex; flex-direction:column; text-align:left;}
.svc-item-cta{margin-top:auto; padding-top:16px; font-weight:700;}

/* ---- detail page package-included cards ---- */
.svc-package-card{text-align:center;}
.svc-package-card .num{display:block; font-size:26px; color:var(--yellow); margin-bottom:10px; letter-spacing:0;}

/* ---- portfolio grid ---- */
.svc-portfolio-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:920px){.svc-portfolio-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:620px){.svc-portfolio-grid{grid-template-columns:1fr;}}

.svc-portfolio-item .ba-wrap{aspect-ratio:4/3;}
.svc-portfolio-caption{margin-top:12px; font-size:13.5px; color:var(--muted); line-height:1.6;}

/* ---- video placeholder card ---- */
.svc-video-card{position:relative; aspect-ratio:4/3; border-radius:16px; overflow:hidden; border:1px solid var(--line); background:var(--ink-2); cursor:pointer;}
.svc-video-poster{width:100%; height:100%; object-fit:cover; display:block; opacity:.85; transition:transform .4s ease, opacity .3s ease;}
.svc-video-card:hover .svc-video-poster{transform:scale(1.04); opacity:1;}
.svc-video-play{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:52px; height:52px; border-radius:50%; background:rgba(255,194,46,.92); color:var(--ink); display:flex; align-items:center; justify-content:center; font-size:16px; box-shadow:0 8px 24px rgba(0,0,0,.4);}
.svc-video-badge{position:absolute; top:12px; right:12px; font-family:var(--mono); font-size:10px; letter-spacing:.1em; padding:5px 10px; border-radius:6px; background:rgba(0,0,0,.55); color:var(--yellow); backdrop-filter:blur(6px);}

/* ---- enquiry CTA strip ---- */
.svc-enquiry-cta{display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; padding:34px 32px;}
@media (max-width:620px){.svc-enquiry-cta{flex-direction:column; align-items:flex-start;}}

/* ---- enquiry modal ---- */
.svc-modal-overlay{position:fixed; inset:0; background:rgba(12,11,9,.82); backdrop-filter:blur(6px); display:none; align-items:center; justify-content:center; z-index:200; padding:20px;}
.svc-modal-overlay.is-open{display:flex;}
.svc-modal{position:relative; width:100%; max-width:440px; background:var(--ink-2); border:1px solid var(--line); border-radius:var(--radius); padding:32px; max-height:90vh; overflow-y:auto;}
.svc-modal-close{position:absolute; top:16px; right:16px; width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,.06); border:1px solid var(--line); color:var(--paper); display:flex; align-items:center; justify-content:center; font-size:13px; transition:.2s ease;}
.svc-modal-close:hover{background:var(--yellow); color:var(--ink); border-color:var(--yellow);}

.svc-enquiry-form{display:flex; flex-direction:column; gap:16px;}
.svc-enquiry-form label{display:flex; flex-direction:column; gap:6px; font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}
.svc-enquiry-form input,
.svc-enquiry-form textarea{
  font-family:var(--body); font-size:14.5px; color:var(--paper); background:rgba(255,255,255,.04);
  border:1px solid var(--line); border-radius:8px; padding:12px 14px; resize:vertical; transition:border-color .2s ease, background .2s ease;
}
.svc-enquiry-form input:focus,
.svc-enquiry-form textarea:focus{outline:none; border-color:var(--yellow); background:rgba(255,194,46,.05);}
.svc-field-error{color:var(--magenta); font-size:11.5px; text-transform:none; letter-spacing:0; font-family:var(--body);}

.svc-modal-success{text-align:center; padding:20px 6px;}
.svc-modal-success-icon{width:56px; height:56px; border-radius:50%; background:var(--yellow); color:var(--ink); font-size:24px; display:flex; align-items:center; justify-content:center; margin:0 auto 18px;}
.svc-modal-success h3{font-size:19px;}
.svc-modal-success p{margin-top:10px; color:var(--muted); font-size:14px; line-height:1.7;}
