/* photocenter.vn — BẢN GỐC (Material 3, Roboto): nền #FFFBFE, khối #F3EDF7 bo 32px, nút viên thuốc #6750A4 / #E8DEF8 / #7D5260,
   mảng màu loang mờ sau khối, khoảng trắng rộng giữa các khối, tiêu đề "Tuyển dụng/Liên hệ" nằm ngoài khối, hàng vị trí 2 cột trên máy tính. */
:root{--nen:#FFFBFE;--khoi:#F3EDF7;--tim:#6750A4;--tim2:#E8DEF8;--chu-tim2:#1D192B;--chu:#1C1B1F;--phu:#49454F;--vien:#E7E0EC;--tram:#7D5260;--ke:#79747E}
*{box-sizing:border-box;font-family:Roboto,sans-serif}html{scroll-behavior:smooth;scroll-padding-top:56px}
body{margin:0;background:var(--nen);color:var(--chu);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--tim)}a:hover{color:var(--tram)}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:1024px;margin:0 auto;padding:0 16px}
@media (min-width:640px){.wrap{padding:0 24px}}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:60}
/* thanh menu */
.top{position:sticky;top:0;z-index:50;background:var(--nen);border-bottom:1px solid rgba(121,116,126,.2)}
.top-in{display:flex;align-items:center;justify-content:space-between;height:48px}
.logo{font-weight:700;font-size:14px;color:var(--tim);text-decoration:none}
@media (min-width:640px){.logo{font-size:16px}}
.top nav ul{display:flex;gap:24px;list-style:none;margin:0;padding:0;font-size:14px;font-weight:500}
.top nav a{text-decoration:none;color:var(--chu);transition:color .2s}.top nav a:hover,.top nav a[aria-current]{color:var(--tim)}
.mn{display:none;font-size:20px;cursor:pointer;padding:6px;color:var(--chu)}
@media (max-width:767px){.mn{display:block}.top nav ul{display:none;position:absolute;right:0;left:0;top:48px;flex-direction:column;gap:0;background:var(--nen);border-bottom:1px solid var(--vien);padding:4px 16px 8px}
 .top nav ul li a{display:block;padding:10px 0}#mn:checked~ul{display:flex}}
/* chữ */
h1{font-size:20px;line-height:1.3;margin:0 0 12px;font-weight:700;letter-spacing:-.015em}
h2{font-size:18px;line-height:1.35;margin:0 0 4px;font-weight:700}
@media (min-width:640px){h1{font-size:30px}h2{font-size:24px}}
h3{font-size:17px;line-height:1.4;margin:4px 0 6px;font-weight:500}h3 a{text-decoration:none;color:var(--chu)}h3 a:hover{color:var(--tim)}
.nhan{font-size:12px;font-weight:500;letter-spacing:.025em;text-transform:uppercase;color:var(--tim);margin:0 0 8px}
@media (min-width:640px){.nhan{font-size:14px}}
.nhan a{color:inherit;text-decoration:none}
.phu-de{font-size:12px;color:var(--phu);margin:0 0 4px;line-height:1.6}.phu-de.tim{color:var(--tim);font-weight:500;margin-bottom:12px}
@media (min-width:640px){.phu-de{font-size:16px}}
.lead{font-size:16px;color:var(--phu);margin:0}
.nho{font-size:13.5px;color:var(--phu)}
.giua{text-align:center}
/* khối: mỗi phần một khoảng trắng rộng, mảng màu loang mờ phía sau */
.sec{position:relative;padding:24px 16px}
@media (min-width:640px){.sec{padding:32px 24px}}
.mo-1,.mo-2,.mo-3{overflow:hidden}
.mo-1::before,.mo-1::after,.mo-2::before,.mo-3::before{content:"";position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.mo-1::before{width:288px;height:288px;background:rgba(103,80,164,.2);top:20px;left:-80px}
.mo-1::after{width:384px;height:384px;background:rgba(125,82,96,.15);bottom:0;right:0}
.mo-2::before{width:320px;height:320px;background:rgba(232,222,248,.3);top:-40px;right:40px}
.mo-3::before{width:384px;height:384px;background:rgba(103,80,164,.15);bottom:0;left:0}
.o{position:relative;max-width:672px;margin:0 auto;background:var(--khoi);border-radius:32px;padding:24px;text-align:center;box-shadow:0 1px 2px rgba(0,0,0,.05)}
@media (min-width:640px){.o{padding:40px}}
.o.hero{max-width:576px;box-shadow:0 10px 25px -5px rgba(0,0,0,.08),0 4px 10px -6px rgba(0,0,0,.06)}
.o.trai{text-align:left}
.rong{max-width:672px;margin:0 auto}
.tieu{text-align:center;margin-bottom:24px}
.o>.nut{margin-top:24px}
.cta{display:flex;justify-content:center;align-items:center;gap:12px;margin:24px 0 0}
@media (min-width:640px){.cta{gap:16px}}
.nut{display:inline-block;background:var(--tim);color:#fff;text-decoration:none;border-radius:999px;padding:10px 24px;font-weight:500;font-size:12px;transition:box-shadow .3s,transform .1s;white-space:nowrap}
@media (min-width:640px){.nut{padding:12px 32px;font-size:16px}}
.nut:hover{color:#fff;box-shadow:0 4px 6px -1px rgba(0,0,0,.1)}.nut:active{transform:scale(.95)}
.nut.phu{background:var(--tim2);color:var(--chu-tim2)}.nut.phu:hover{color:var(--chu-tim2)}
.nut.tram{background:var(--tram)}
.nut.nho-nut{padding:8px 20px;font-size:12px}
@media (min-width:640px){.nut.nho-nut{font-size:14px}}
.chip{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:20px 0 0;padding:0;list-style:none}
@media (min-width:640px){.chip{gap:12px}}
.chip li{background:var(--tim2);color:var(--chu-tim2);border-radius:999px;padding:8px 16px;font-size:12px;font-weight:500;white-space:nowrap}
@media (min-width:640px){.chip li{font-size:14px}}
/* hàng (tin tức / tuyển dụng): ô nền nhạt, tên trên – nút dưới, 2 cột trên máy tính */
.hang{display:grid;gap:12px}
@media (min-width:640px){.hang{grid-template-columns:1fr 1fr;gap:16px}}
.h{display:flex;flex-direction:column;align-items:flex-start;gap:12px;background:var(--khoi);border-radius:16px;padding:16px 20px;text-decoration:none;color:var(--chu)}
.h>span{font-size:14px;font-weight:500;line-height:1.45}
@media (min-width:640px){.h>span{font-size:16px}}
.h small{font-size:12px;color:var(--phu);margin-top:-6px}
a.h:hover>span{color:var(--tim)}
.xem{margin:16px 0 0;text-align:center;font-size:14px;font-weight:500}
/* portfolio */
.pf-anh{margin:24px 0 0;border-radius:20px;overflow:hidden;background:#fff}
.doi-tac{margin:20px auto 0;max-width:560px;font-size:12.5px;line-height:1.8;color:var(--phu)}
@media (min-width:640px){.doi-tac{font-size:14px}}
.doi-tac span{display:block;font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--tim);margin-bottom:2px}
/* bản đồ */
.bando{border-radius:16px;overflow:hidden;margin-top:20px;background:var(--vien)}
.bando iframe{display:block;width:100%;height:300px;border:0}
@media (max-width:480px){.bando iframe{height:240px}}
/* trang con & bài viết: nội dung trong 1 khối bo tròn */
.vt{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:12px;text-align:left}
.vt li{display:flex;align-items:center;justify-content:space-between;gap:12px;background:rgba(255,255,255,.8);border-radius:16px;padding:16px}
.vt b{font-weight:500;font-size:15px;color:var(--chu)}.vt small{display:block;font-size:12.5px;color:var(--phu);margin-top:2px}
.vt li.mo{flex-direction:column;align-items:stretch}.vt li.mo p{margin:8px 0 0;font-size:14.5px;color:var(--phu)}
.vt li.mo .dong{display:flex;justify-content:space-between;align-items:center;gap:12px}
.the{background:rgba(255,255,255,.8);border-radius:16px;padding:16px 20px}
.the p{margin:4px 0;font-size:14.5px;color:var(--phu)}
.luoi{display:grid;gap:12px;margin-top:16px}
@media (min-width:640px){.luoi{grid-template-columns:1fr 1fr}}
main>.doc{background:var(--khoi);border-radius:32px;padding:24px 20px;margin:32px auto;max-width:672px;line-height:1.65;box-shadow:0 1px 2px rgba(0,0,0,.05)}
@media (max-width:719px){main>.doc{margin:24px 16px}}
@media (min-width:640px){main>.doc{padding:40px}}
.doc h2{margin-top:32px;font-size:20px}.doc h3{margin-top:20px}
.doc ul,.doc ol{padding-left:22px}.doc li{margin:6px 0}
.doc .the.rong{margin:16px 0}.doc .the.rong h2{margin:4px 0 8px}
blockquote{margin:16px 0;padding:4px 16px;border-left:3px solid var(--tim);color:var(--phu)}
.cuoi{margin:32px 0 0;padding:16px 20px;background:rgba(255,255,255,.8);border-radius:16px;font-size:14.5px}
.lh{list-style:none;padding:0;margin:16px 0 0;font-size:15px}.lh li{margin:4px 0}
/* chân trang: 1 dòng chữ nhỏ căn giữa */
.foot{padding:16px 0 40px;text-align:center;font-size:12px;color:var(--phu)}
@media (min-width:640px){.foot{font-size:14px}}
.foot p{margin:0 auto;max-width:672px}.foot a{color:var(--phu);text-decoration:none}.foot a:hover{color:var(--tim)}