/* qua.giangcondao.vn · kiểu chung cho trang quà. Màu theo Brand Guideline Chung: xanh cobalt #214099, đỏ #BE1E2D (một nút đỏ mỗi màn hình), kem #F2D9A6, nền #FBF4E4. */
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:500;font-display:swap;src:url(/qua-chung/font/BeVietnamPro-500-normal-vietnamese.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:500;font-display:swap;src:url(/qua-chung/font/BeVietnamPro-500-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:500;font-display:swap;src:url(/qua-chung/font/BeVietnamPro-500-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:800;font-display:swap;src:url(/qua-chung/font/BeVietnamPro-800-normal-vietnamese.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:800;font-display:swap;src:url(/qua-chung/font/BeVietnamPro-800-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Be Vietnam Pro";font-style:normal;font-weight:800;font-display:swap;src:url(/qua-chung/font/BeVietnamPro-800-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{--xanh:#214099;--xanh-dam:#1a3380;--xanh-nhat:#E8EDF8;--do:#BE1E2D;--do-dam:#a01825;--kem:#F2D9A6;--nen:#FBF4E4;--giay:#fff;--chu:#1E2433;--mo:#5B6275;--vien:#E4DCCB}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--nen);color:var(--chu);font-family:"Be Vietnam Pro",-apple-system,"Segoe UI",Roboto,sans-serif;font-weight:500;font-size:17px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--xanh)}
b,strong,h1,h2,h3{font-weight:800}
.khung{max-width:1040px;margin:0 auto;padding:0 16px}
.dau{background:var(--xanh);color:#fff;padding:28px 0 36px}
.dau .khung{display:grid;grid-template-columns:1.05fr .95fr;gap:28px;align-items:start}
.nhan{display:inline-block;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--kem);margin-bottom:8px}
h1{font-size:40px;line-height:1.15;margin:0 0 12px}
.dau .phu{font-size:18px;color:#E8EDF8;margin:0 0 16px}
.dau .bia{border-radius:14px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.25);margin:4px 0 0}
.the{background:var(--giay);color:var(--chu);border-radius:16px;padding:20px 18px;box-shadow:0 8px 28px rgba(20,30,60,.18)}
.the h2{font-size:21px;margin:0 0 4px;color:var(--xanh)}
.the .goi-y{font-size:14px;color:var(--mo);margin:0 0 12px}
label.o{display:block;margin:10px 0 4px;font-size:15px}
label.o span{color:var(--mo);font-size:13px}
input[type=text],input[type=email],input[type=tel]{width:100%;font:inherit;font-size:17px;padding:12px 14px;border:1.5px solid var(--vien);border-radius:10px;background:#fff;color:var(--chu)}
input:focus{outline:3px solid var(--kem);border-color:var(--xanh)}
.dong-y{display:flex;gap:10px;align-items:flex-start;margin:12px 0 0;font-size:14.5px;line-height:1.5}
.dong-y input{width:20px;height:20px;flex:0 0 20px;margin-top:2px;accent-color:var(--xanh)}
.du-lieu{font-size:12.5px;color:var(--mo);margin:10px 0 0}
.nut{display:block;width:100%;text-align:center;font:inherit;font-weight:800;font-size:18px;border:0;border-radius:12px;padding:15px 18px;cursor:pointer;text-decoration:none}
.nut-do{background:var(--do);color:#fff;margin-top:14px}
.nut-do:hover{background:var(--do-dam)}
.nut-do[disabled]{opacity:.6;cursor:wait}
.nut-xanh{background:var(--xanh);color:#fff}
.nut-vien{background:#fff;color:var(--xanh);border:2px solid var(--xanh)}
.duoi-nut{font-size:13.5px;color:var(--mo);text-align:center;margin:8px 0 0}
.loi{color:var(--do);font-size:14px;margin:8px 0 0;min-height:1em}
.bay{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
section{padding:36px 0}
section h2{font-size:28px;line-height:1.25;margin:0 0 14px;color:var(--xanh)}
.trang{background:var(--giay)}
.danh-sach{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.danh-sach li{background:var(--giay);border:1px solid var(--vien);border-radius:12px;padding:14px 16px}
.trang .danh-sach li{background:var(--nen)}
.danh-sach b{color:var(--xanh);display:block}
.so{display:inline-block;font-weight:800;color:var(--do);margin-right:6px}
.hai-cot{display:grid;grid-template-columns:200px 1fr;gap:22px;align-items:start}
.anh-tron{border-radius:50%;overflow:hidden;border:4px solid var(--kem)}
.bao{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bao figure{margin:0;background:var(--giay);border:1px solid var(--vien);border-radius:12px;overflow:hidden}
.bao figcaption{padding:10px 14px;font-size:14.5px}
.hoi{border-bottom:1px solid var(--vien);padding:12px 0}
.hoi b{display:block}
.nho{font-size:14.5px;color:var(--mo)}
.cuoi{background:var(--xanh);color:#fff;text-align:center}
.cuoi h2{color:#fff}
.cuoi .nut{max-width:420px;margin:14px auto 0}
footer{padding:20px 0 30px;font-size:14px;color:var(--mo);text-align:center}
.hop{background:var(--giay);border-radius:16px;padding:20px 18px;margin:0 0 16px;border:1px solid var(--vien)}
.hop h2{font-size:22px;margin:0 0 6px}
.link-rieng{width:100%;font:inherit;font-size:14px;padding:10px 12px;border:1.5px dashed var(--xanh);border-radius:10px;background:var(--xanh-nhat);color:var(--chu)}
.hang-nut{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.hang-nut .nut{font-size:15.5px;padding:12px}
@media (max-width:800px){
 .dau .khung{grid-template-columns:1fr}
 h1{font-size:31px}
 .dau .bia{max-width:150px;margin:6px auto 0}
 .dau .phu{font-size:16.5px}
 section h2{font-size:24px}
 .hai-cot{grid-template-columns:1fr}
 .hai-cot .anh-tron{max-width:180px}
 .bao{grid-template-columns:1fr}
}

[hidden]{display:none!important}
