/* ===== PAGE HERO ===== */

.ph{background:linear-gradient(135deg,var(--blue-d),var(--blue));padding:70px 5% 58px;position:relative;overflow:hidden}
.ph::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}
.ph-bc{display:flex;align-items:center;gap:8px;font-size:12px;color:rgba(255,255,255,.55);margin-bottom:14px;position:relative;z-index:1;flex-wrap:wrap}
.ph-bc-btn{color:rgba(255,255,255,.55);transition:color .2s;background:none;border:none;font-family:'Poppins',sans-serif;font-size:12px;padding:0}
.ph-bc-btn:hover{color:rgba(255,255,255,.9)}
.ph-sep{color:rgba(255,255,255,.3)}
.ph-title{font-family:'Poppins',sans-serif;font-size:clamp(2rem,4vw,3rem);font-weight:700;color:var(--white);position:relative;z-index:1}
.ph-sub{font-size:15px;color:rgba(255,255,255,.7);margin-top:10px;font-weight:300;position:relative;z-index:1}


/* ===== PROJECT DETAIL ===== */

.pd-wrap{display:grid;grid-template-columns:1.6fr 1fr;gap:40px;padding:60px 5%}
.pd-slider-main{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);margin-bottom:14px;height:400px}
.pd-slider-main img{height:100%;transition:opacity .4s}
.pd-thumbs{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.pd-thumb{width:80px;height:60px;flex-shrink:0;border-radius:8px;overflow:hidden;cursor:pointer;opacity:.6;border:2px solid transparent;transition:all .2s}
.pd-thumb.on,.pd-thumb:hover{opacity:1;border-color:var(--blue)}
.pd-thumb img{height:100%}
.pd-info{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:28px;box-shadow:var(--shadow);position:sticky;top:80px}
.pd-price-box{background:var(--blue);border-radius:var(--r);padding:20px;margin-bottom:22px;text-align:center}
.pd-price{font-family:'Poppins',sans-serif;font-size:1.9rem;font-weight:700;color:var(--white)}
.pd-price-sub{font-size:12px;color:rgba(255,255,255,.65);margin-top:3px}
.pd-meta{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--border);font-size:13px}
.pd-meta:last-of-type{border-bottom:none}
.pd-meta-lbl{color:var(--muted);font-weight:400}
.pd-meta-val{color:var(--text);font-weight:600}
.pd-sec{padding:36px 0;border-top:1px solid var(--border)}
.pd-sec:first-child{border-top:none;padding-top:0}
.pd-sec-title{font-family:'Poppins',sans-serif;font-size:1.1rem;font-weight:700;color:var(--text);margin-bottom:18px}
.am-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.am-it{display:flex;align-items:center;gap:7px;padding:9px 11px;background:var(--offwhite);border:1px solid var(--border);border-radius:8px;font-size:12.5px;color:var(--text)}
.am-it:hover{border-color:var(--blue);color:var(--blue)}


/* ===== SERVICE DETAIL ===== */

.sd-wrap{padding:60px 5%}
.sd-hd{display:flex;align-items:flex-start;gap:22px;margin-bottom:44px}
.sd-ico-big{width:78px;height:78px;flex-shrink:0;border-radius:20px;background:var(--blue-l);border:2px solid rgba(26,60,110,.12);display:flex;align-items:center;justify-content:center;font-size:34px}
.sd-process{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.sp-step{text-align:center;padding:24px 16px;background:var(--white);border:1px solid var(--border);border-radius:var(--r);transition:all .3s;cursor:pointer}
.sp-step:hover{border-color:var(--blue);transform:translateY(-4px);box-shadow:var(--shadow)}
.sp-num{width:44px;height:44px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;font-family:'Poppins',sans-serif;font-size:1.1rem;font-weight:700;color:var(--white);margin:0 auto 14px}
.sp-title{font-weight:600;font-size:14px;color:var(--text);margin-bottom:6px}
.sp-desc{font-size:12px;color:var(--muted);line-height:1.65;font-weight:300}


/* ===== BLOG DETAIL ===== */

.bd-wrap{display:grid;grid-template-columns:1fr 310px;gap:40px;padding:60px 5%}
.bd-main h1{font-family:'Poppins',sans-serif;font-size:2rem;font-weight:700;color:var(--text);margin-bottom:14px;line-height:1.25}
.bd-meta{display:flex;gap:18px;margin-bottom:28px;flex-wrap:wrap}
.bd-meta-item{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:5px}
.bd-feat{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);margin-bottom:34px;height:380px}
.bd-feat img{height:100%}
.bd-body p{font-size:15px;line-height:1.88;color:var(--text);font-weight:300;margin-bottom:18px}
.bd-body h2{font-family:'Poppins',sans-serif;font-size:1.3rem;font-weight:700;color:var(--text);margin:28px 0 12px}
.bd-body ul{padding-left:22px;margin-bottom:18px}
.bd-body li{font-size:15px;color:var(--text);font-weight:300;line-height:1.8;margin-bottom:7px}
.related-title-h{font-family:'Poppins',sans-serif;font-size:1rem;font-weight:700;color:var(--text);margin-bottom:18px;padding-bottom:9px;border-bottom:2.5px solid var(--blue)}
.rel-card{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--border);cursor:pointer;transition:all .2s}
.rel-card:hover .rel-title{color:var(--blue)}
.rel-img{width:68px;height:54px;border-radius:8px;overflow:hidden;flex-shrink:0}
.rel-img img{height:100%}
.rel-title{font-size:12.5px;font-weight:600;color:var(--text);line-height:1.4;margin-bottom:3px;transition:color .2s}
.rel-date{font-size:11px;color:var(--muted)}