/* CCD Mẫu ngành – giao diện khách xem. Màu chủ đạo: --ccdk-a */
:root{--ccdk-a:#be185d;--ccdk-ink:#17151a;--ccdk-mut:#6b6570;--ccdk-line:#ece7ea;--ccdk-bg:#faf7f5;--ccdk-r:18px}
.ccdk-tpcn{--ccdk-bg:#f4f8f5;--ccdk-line:#e3ebe6}
.ccdk-my-pham{--ccdk-bg:#f8f6fc;--ccdk-line:#e9e4f2}

.ccdk-wrap{max-width:1180px;margin:0 auto;padding:0 20px;box-sizing:border-box}
.ccdk-sec{padding:56px 0;color:var(--ccdk-ink)}
.ccdk-sec *{box-sizing:border-box}
.ccdk-soft{background:var(--ccdk-bg)}
/* Tràn hết bề ngang dù theme đặt nội dung trong khung hẹp */
.ccdk-hero,.ccdk-sec{width:100vw!important;max-width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;box-sizing:border-box}
.ccdk-hero + .ccdk-sec,.ccdk-sec + .ccdk-sec{margin-top:0!important}
html:has(.ccdk-hero),body:has(.ccdk-hero){overflow-x:clip}
.ccdk-h2{font-size:clamp(24px,3vw,32px);font-weight:800;line-height:1.2;margin:0 0 10px;letter-spacing:-.3px;color:var(--ccdk-ink)}
.ccdk-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:0 0 22px;flex-wrap:wrap}
.ccdk-head .ccdk-h2{margin:0}
.ccdk-more{font-weight:700;color:var(--ccdk-a)!important;text-decoration:none!important;white-space:nowrap}
.ccdk-mut{color:var(--ccdk-mut);margin:0 0 20px}
.ccdk-empty{color:var(--ccdk-mut)}

/* Nút */
.ccdk-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 26px;border-radius:999px;background:var(--ccdk-a);color:#fff!important;font-weight:700;font-size:16px;text-decoration:none!important;border:2px solid var(--ccdk-a);cursor:pointer;transition:filter .15s,transform .15s;line-height:1.2;box-shadow:0 8px 22px color-mix(in srgb,var(--ccdk-a) 28%,transparent)}
.ccdk-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
button.ccdk-btn,.ccdk-form button.ccdk-btn{background:var(--ccdk-a)!important;color:#fff!important;border:2px solid var(--ccdk-a)!important;border-radius:999px!important;font-family:inherit;text-transform:none;letter-spacing:0}
.ccdk-ghost{background:transparent!important;color:var(--ccdk-a)!important;box-shadow:none}
.ccdk-sm{min-height:40px;padding:0 18px;font-size:14.5px;box-shadow:none}
.ccdk-block{width:100%}
.ccdk-btns{display:flex;gap:12px;flex-wrap:wrap}

/* Hero */
.ccdk-hero{background:var(--ccdk-bg);padding:56px 0 64px;overflow:hidden;color:var(--ccdk-ink)}
.ccdk-hero-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center}
.ccdk-badge{display:inline-block;background:#fff;color:var(--ccdk-a);font-weight:700;font-size:14px;padding:7px 14px;border-radius:999px;border:1px solid color-mix(in srgb,var(--ccdk-a) 25%,transparent);margin:0 0 18px}
.ccdk-hero h1{font-size:clamp(34px,5vw,56px);line-height:1.08;font-weight:800;letter-spacing:-1px;margin:0 0 18px;color:var(--ccdk-ink)}
.ccdk-hero p{font-size:18px;line-height:1.6;color:var(--ccdk-mut);margin:0 0 28px;max-width:540px}
.ccdk-hero-meta{list-style:none;margin:26px 0 0;padding:0;display:flex;gap:24px;flex-wrap:wrap;font-weight:600;color:var(--ccdk-ink)}
.ccdk-hero-meta li{display:flex;align-items:center;gap:8px}
.ccdk-hero-meta svg{color:var(--ccdk-a);width:20px;height:20px}
.ccdk-hero-meta a{color:inherit!important;text-decoration:none!important}
.ccdk-hero-img{border-radius:28px;overflow:hidden;aspect-ratio:5/4;box-shadow:0 30px 60px rgba(40,20,30,.12)}
.ccdk-hero-img img{width:100%;height:100%;object-fit:cover;object-position:center 70%;display:block}

/* Lý do */
.ccdk-why{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.ccdk-why-i{background:#fff;border:1px solid var(--ccdk-line);border-radius:var(--ccdk-r);padding:24px}
.ccdk-ic{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:14px;background:color-mix(in srgb,var(--ccdk-a) 10%,#fff);color:var(--ccdk-a);margin:0 0 14px}
.ccdk-why-i h3{font-size:17px;font-weight:700;margin:0 0 6px;color:var(--ccdk-ink)}
.ccdk-why-i p{font-size:14.5px;line-height:1.55;color:var(--ccdk-mut);margin:0}

/* Danh mục */
.ccdk-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 22px}
.ccdk-tabs a{padding:9px 16px;border-radius:999px;border:1px solid var(--ccdk-line);background:#fff;color:var(--ccdk-ink)!important;text-decoration:none!important;font-weight:600;font-size:14.5px}
.ccdk-tabs a.on,.ccdk-tabs a:hover{background:var(--ccdk-a);border-color:var(--ccdk-a);color:#fff!important}

/* Thẻ dịch vụ / sản phẩm */
.ccdk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.ccdk-card{background:#fff;border:1px solid var(--ccdk-line);border-radius:var(--ccdk-r);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.ccdk-card:hover{box-shadow:0 18px 40px rgba(30,20,30,.08);transform:translateY(-2px)}
.ccdk-card-img{display:block;aspect-ratio:1/1;background:var(--ccdk-bg);overflow:hidden}
.ccdk-card-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.ccdk-card:hover .ccdk-card-img img{transform:scale(1.04)}
.ccdk-noimg{display:block;width:100%;height:100%;background:linear-gradient(135deg,var(--ccdk-bg),color-mix(in srgb,var(--ccdk-a) 12%,#fff))}
.ccdk-card-b{padding:18px 18px 20px;display:flex;flex-direction:column;flex:1}
.ccdk-chip{display:inline-block;align-self:flex-start;font-size:12.5px;font-weight:700;color:var(--ccdk-a);background:color-mix(in srgb,var(--ccdk-a) 9%,#fff);padding:4px 10px;border-radius:999px;margin:0 0 10px}
.ccdk-card h3{font-size:18px;font-weight:700;line-height:1.35;margin:0 0 6px}
.ccdk-card h3 a{color:var(--ccdk-ink)!important;text-decoration:none!important}
.ccdk-ex{font-size:14.5px;line-height:1.55;color:var(--ccdk-mut);margin:0 0 14px}
.ccdk-card-f{margin-top:auto;display:flex;align-items:end;justify-content:space-between;gap:10px}
.ccdk-card-f > div{min-width:0}
.ccdk-card-f .ccdk-btn{flex:none;white-space:nowrap}
.ccdk-card .ccdk-off{font-size:11px;padding:1px 6px}
.ccdk-card-f small{display:block;color:var(--ccdk-mut);font-size:13px;margin-top:2px}
.ccdk-price{font-size:19px;font-weight:800;color:var(--ccdk-a)}
.ccdk-card del,.ccdk-single del{color:#9a939c;font-size:14px;margin-left:4px}
.ccdk-off{display:inline-block;font-size:12px;font-weight:700;color:#fff;background:var(--ccdk-a);padding:2px 7px;border-radius:6px;margin-left:4px;vertical-align:2px}

/* Các bước */
.ccdk-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;counter-reset:none}
.ccdk-steps li{background:#fff;border-radius:var(--ccdk-r);padding:26px;border:1px solid var(--ccdk-line);margin:0}
.ccdk-steps b{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--ccdk-a);color:#fff;font-size:18px;margin:0 0 14px}
.ccdk-steps h3{font-size:18px;font-weight:700;margin:0 0 6px;color:var(--ccdk-ink)}
.ccdk-steps p{margin:0;color:var(--ccdk-mut);font-size:15px;line-height:1.55}

/* Form */
.ccdk-form-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:26px;align-items:start}
.ccdk-form-card{background:#fff;border:1px solid var(--ccdk-line);border-radius:22px;padding:32px;box-shadow:0 14px 40px rgba(30,20,30,.05)}
.ccdk-form label{display:block;font-weight:600;font-size:14.5px;margin:0 0 14px;color:var(--ccdk-ink)}
.ccdk-form input,.ccdk-form select,.ccdk-form textarea{display:block;width:100%!important;max-width:100%;margin-top:6px;min-height:48px;padding:10px 14px!important;border:1px solid #ddd6db!important;border-radius:12px!important;font-size:16px!important;font-family:inherit;background:#fff!important;color:var(--ccdk-ink)!important;box-shadow:none;outline:0}
.ccdk-form textarea{min-height:90px}
.ccdk-form input:focus,.ccdk-form select:focus,.ccdk-form textarea:focus{outline:0;border-color:var(--ccdk-a);box-shadow:0 0 0 3px color-mix(in srgb,var(--ccdk-a) 15%,transparent)}
.ccdk-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ccdk-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.ccdk-ok,.ccdk-err{padding:14px 16px;border-radius:12px;margin:0 0 18px;font-weight:600}
.ccdk-ok{background:#e8f6ee;color:#0b5d3b}
.ccdk-err{background:#fdecec;color:#a11d1d}
.ccdk-info{background:var(--ccdk-bg);border-radius:22px;padding:28px}
.ccdk-info h3{font-size:20px;font-weight:800;margin:0 0 16px;color:var(--ccdk-ink)}
.ccdk-info ul{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:14px}
.ccdk-info li{display:flex;gap:12px;align-items:flex-start;line-height:1.5;margin:0}
.ccdk-info svg{color:var(--ccdk-a);flex:none;width:22px;height:22px}
.ccdk-info a{color:var(--ccdk-ink)!important;text-decoration:none!important;font-weight:600;overflow-wrap:anywhere}

/* Trang chi tiết */
.ccdk-single{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start;margin:0 0 36px}
.ccdk-single-img{border-radius:22px;overflow:hidden;background:var(--ccdk-bg);aspect-ratio:1/1}
.ccdk-single-img img{width:100%;height:100%;object-fit:cover;display:block}
.ccdk-single-price{margin:4px 0 16px}
.ccdk-single-price .ccdk-price{font-size:30px}
.ccdk-dl{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;margin:0 0 16px;padding:14px 0;border-top:1px solid var(--ccdk-line);border-bottom:1px solid var(--ccdk-line)}
.ccdk-dl:empty{display:none}
.ccdk-dl dt{color:var(--ccdk-mut);margin:0}
.ccdk-dl dd{margin:0;font-weight:600}
.ccdk-lead{font-size:17px;line-height:1.6;color:var(--ccdk-ink);margin:0 0 22px}
.ccdk-warn{margin:20px 0 0;padding:12px 14px;border-radius:12px;background:#fff7e6;border:1px solid #f5d79a;color:#6b4a00;font-weight:600;font-size:14.5px}
.ccdk-desc{max-width:780px;margin:0 0 10px}
.single-ccd_item .ccdk-sec#dat{width:auto!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;padding:24px 0 0}
.single-ccd_item .ccdk-sec#dat .ccdk-wrap{padding:0}

/* Lưu ý TPCN + nút nổi */
.ccdk-disc{background:#fff7e6;color:#6b4a00;text-align:center;font-size:14px;font-weight:600;padding:10px 16px;border-top:1px solid #f5d79a}
.ccdk-float{position:fixed;right:16px;bottom:18px;z-index:9990;display:flex;flex-direction:column;gap:10px}
.ccdk-float a{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;color:#fff!important;text-decoration:none!important;font-weight:800;font-size:13px;box-shadow:0 8px 20px rgba(0,0,0,.18)}
.ccdk-f-zalo{background:#0068ff}
.ccdk-f-tel{background:var(--ccdk-a);animation:ccdk-ring 2.4s infinite}
.ccdk-f-tel svg{width:24px;height:24px}
@keyframes ccdk-ring{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ccdk-a) 45%,transparent)}50%{box-shadow:0 0 0 12px transparent}}
@media (prefers-reduced-motion:reduce){.ccdk-f-tel{animation:none}.ccdk-card,.ccdk-card-img img,.ccdk-btn{transition:none}}

@media (max-width:980px){
	.ccdk-hero-in{grid-template-columns:1fr;gap:30px}
	.ccdk-hero-img{aspect-ratio:16/10}
	.ccdk-why{grid-template-columns:repeat(2,minmax(0,1fr))}
	.ccdk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.ccdk-form-grid,.ccdk-single{grid-template-columns:1fr}
}
@media (max-width:600px){
	.ccdk-sec{padding:40px 0}
	.ccdk-hero{padding:36px 0 44px}
	.ccdk-hero p{font-size:16.5px}
	.ccdk-why{grid-template-columns:1fr 1fr;gap:12px}
	.ccdk-why-i{padding:16px}
	.ccdk-grid{grid-template-columns:1fr 1fr;gap:12px}
	.ccdk-card-b{padding:12px}
	.ccdk-card h3{font-size:15.5px}
	.ccdk-ex{display:none}
	.ccdk-card-f{flex-direction:column;align-items:stretch}
	.ccdk-price{font-size:16.5px}
	.ccdk-steps{grid-template-columns:1fr}
	.ccdk-row{grid-template-columns:1fr;gap:0}
	.ccdk-form-card{padding:22px 18px}
	.ccdk-btns .ccdk-btn{flex:1 1 auto}
}
.ccdk-info a.ccdk-btn{color:var(--ccdk-a)!important}