*{box-sizing:border-box}body{margin:0;font-family:Quicksand,sans-serif;color:#3c4858}a{color:inherit}header{background:#fff;box-shadow:0 2px 9px #0002;position:sticky;top:0;z-index:20}.nav{max-width:1170px;margin:auto;min-height:80px;display:flex;align-items:center;justify-content:space-between;padding:10px 20px;gap:20px}.logo img{display:block;max-width:170px;max-height:60px;object-fit:contain}.links{display:flex;align-items:center;gap:29px}.links a{text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase}.links a.active,.links a:hover{color:#2579ff}.hero{min-height:calc(100vh - 80px);display:flex;align-items:center;position:relative;background:#263c70 url('assets/hero.jpg') center/cover no-repeat}.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#15156d,#2579ff);opacity:.65;mix-blend-mode:multiply}.container{max-width:1170px;width:100%;margin:auto;padding:50px 20px;position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px}.intro{padding:20px;color:white}.intro h1{font-size:45px;line-height:1.5;margin:0;font-weight:700}.intro h2{font-size:38px;line-height:1.5;margin:0 0 20px;font-weight:700}.intro p{font-size:18px;line-height:1.6;text-align:justify;margin:0;font-weight:500}.card{background:#fff;border-radius:7px;padding:30px 25px;box-shadow:0 10px 32px #0002}.card h3{font-size:25px;margin:0 0 12px;font-weight:700}.hint,.help{font-style:oblique;font-size:14px}.help a{color:#2579ff}.lookup{display:flex;gap:2%;padding:10px 0 20px}.lookup input{width:58%;min-width:0;height:55px;border:1px solid #d4dce3;border-radius:3px;padding:0 14px;font:inherit;font-size:15px}.lookup button{width:40%;min-height:55px;border:0;border-radius:3px;background:#2579ff;color:white;font:700 14px Quicksand,sans-serif;cursor:pointer}.lookup button:disabled{opacity:.65}.lookup input:focus-visible,.lookup button:focus-visible,a:focus-visible{outline:3px solid #4e96ff;outline-offset:2px}.message{font-size:14px;margin:10px 0;color:#a42727}.result{margin-top:18px;border-top:1px solid #e2e8f0;padding-top:14px;font-size:14px;line-height:1.6}.result h4{margin:0 0 8px;color:#1d4ed8;font-size:18px}.result dl{display:grid;grid-template-columns:minmax(100px,auto) 1fr;gap:5px 12px;margin:0}.result dt{font-weight:700}.result dd{margin:0;overflow-wrap:anywhere}.restoration{margin-top:12px;padding-top:10px;border-top:1px solid #e2e8f0}.partners{background:linear-gradient(90deg,#2579ff,#141381);padding:50px 20px;color:#fff;text-align:center}.partners h2{font-weight:400;font-size:29px;margin:0 0 25px}.carousel{max-width:1200px;margin:auto;display:flex;align-items:center;gap:12px}.carousel button{background:none;border:0;color:#fff;font-size:36px;cursor:pointer}.logos{scroll-behavior:smooth;max-width:1100px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:30px;overflow-x:auto;scrollbar-width:none}.logos::-webkit-scrollbar{display:none}.logos img{width:120px;max-height:65px;object-fit:contain}.menu-toggle{display:none}footer{color:#fff;background:linear-gradient(90deg,#141381,#4062c2);position:relative}footer:before{content:"";position:absolute;inset:0;background:url(assets/footer.jpg) center top/cover;opacity:.15;pointer-events:none}.footer-inner{max-width:1170px;position:relative;margin:auto;padding:50px 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:50px;font-size:15px;font-weight:600;line-height:1.7}.footer-inner img{width:146px;height:auto}.footer-inner h4{font-size:26px;margin:0 0 15px}.footer-inner p{margin:12px 0;text-align:justify}.footer-inner ul{list-style:none;padding:0;margin:0}.footer-inner li{margin-bottom:12px}.copyright{position:relative;background:linear-gradient(90deg,#141381,#2579ff);padding:12px 20px;text-align:center;font-size:14px;font-weight:600}@media(max-width:767px){.nav{min-height:65px}.logo img{max-width:135px;max-height:45px}.menu-toggle{display:block;background:none;border:1px solid #d6dbe3;border-radius:4px;padding:8px 11px;font-size:20px}.links{display:none;position:absolute;top:100%;left:0;right:0;background:white;padding:20px;flex-direction:column;align-items:flex-start;gap:16px}.links.open{display:flex}.hero{min-height:0}.container{grid-template-columns:1fr;padding:70px 10px 60px;gap:10px}.intro h1,.intro h2{font-size:22px}.intro p{font-size:13px}.card{margin:10px;padding:25px 20px}.logos{justify-content:flex-start}.logos img{width:28%;flex-shrink:0}.lookup{padding-top:10px}.footer-inner{grid-template-columns:1fr;gap:25px}}
.result{max-width:1100px;margin:40px auto;padding:0 20px;border:0;scroll-margin-top:100px}.result[hidden]{display:none}.certificate{background:#fff;border:1px solid #f5d78a;border-radius:16px;padding:36px;color:#0f1a31;box-shadow:0 12px 35px #0f172a12}.certificate-head{position:static;background:transparent;box-shadow:none;text-align:center;border-bottom:1px solid #f5d78a;padding:0 0 28px;margin-bottom:28px}.certificate-eyebrow{color:#bb5800;font-weight:700;letter-spacing:.12em;font-size:13px}.certificate-title{font-size:clamp(24px,3.5vw,38px);line-height:1.18;margin:10px 0 4px;color:#0c162d}.certificate-subtitle{color:#647895;font-size:14px;margin:0}.certificate-badge{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:20px;padding:12px 22px;border:1px solid #a7d0ff;border-radius:40px;background:linear-gradient(100deg,#eff6ff,#ecfdf5);color:#1e40af;font-weight:700}.certificate-badge strong{color:#0f172a;font-family:monospace;font-size:17px}.certificate-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.certificate-panel,.teeth-panel{background:#f7f8fa;border:1px solid #e6ebf2;border-radius:16px;padding:22px}.certificate-panel h3{margin:0 0 18px;padding-bottom:10px;border-bottom:1px solid #dce5f0;color:#1e40af;font-size:16px;line-height:1.4}.certificate-field{display:flex;flex-direction:column;gap:2px;margin:0 0 16px}.certificate-field:last-child{margin-bottom:0}.field-label{font-size:14px;color:#627795}.field-value{font-size:16px;color:#17243a;overflow-wrap:anywhere}.customer-name .field-value,.material .field-value{font-size:20px}.material .field-value{color:#1e40af}.warranty-term .field-value{color:#b45309}.expiry .field-value{color:#047857}.certificate-details{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.restoration-block+.restoration-block{border-top:1px solid #dce5f0;margin-top:18px;padding-top:15px}.restoration-title{margin:0 0 12px;color:#47607c;font-size:14px}.teeth-panel{margin-top:24px}.teeth-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}.teeth-heading h3{margin:0;font-size:16px;color:#475b76}.teeth-heading strong{color:#1e40af}.teeth-diagram{margin:18px auto 0;max-width:600px;display:grid;gap:6px}.teeth-row{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:3px}.tooth-cell{display:grid;place-items:center;height:34px;border:1px solid #dce5f0;border-radius:3px;color:#b6c5d8;background:#fff;font-size:12px;font-weight:700}.tooth-cell.active{color:#fff;background:#2563eb;border-color:#2563eb}.teeth-unknown{margin:12px 0 0;color:#647895;font-size:13px;text-align:center}@media(max-width:767px){.result{padding:0 12px;margin:24px auto}.certificate{padding:20px 15px}.certificate-grid{grid-template-columns:1fr;gap:14px}.certificate-panel,.teeth-panel{padding:16px}.certificate-eyebrow{font-size:11px}.certificate-subtitle{font-size:12px}.tooth-cell{height:27px;font-size:10px}.teeth-row{gap:2px}.certificate-details{gap:0 10px}}
.fdi-diagram{max-width:600px;margin:18px auto 0;display:grid;gap:6px}.fdi-row{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:3px}.fdi-tooth{display:grid;place-items:center;height:34px;border:1px solid #dce5f0;border-radius:3px;color:#b6c5d8;background:#fff;font-size:12px;font-weight:700}.fdi-tooth.is-selected{color:#fff;background:#2563eb;border-color:#2563eb}.fdi-midline{margin-left:5px}.fdi-note{margin:8px 0 0;color:#647895;font-size:13px;text-align:center}@media(max-width:767px){.fdi-tooth{height:27px;font-size:10px}.fdi-row{gap:2px}}

/* Nhẹ nhàng khi mở trang và khi tìm thấy thẻ bảo hành. */
.lookup input{transition:border-color .2s ease,box-shadow .2s ease}.lookup input:focus{border-color:#4b91ff;box-shadow:0 0 0 4px #3b82f61c;outline:none}.lookup button{transition:background .2s ease,box-shadow .2s ease,transform .2s ease}.lookup button:not(:disabled):hover{background:#1c64e8;box-shadow:0 7px 18px #2563eb42;transform:translateY(-2px)}.lookup button:not(:disabled):active{transform:translateY(0)}.certificate{overflow:hidden}.certificate-panel,.teeth-panel{transition:box-shadow .25s ease,border-color .25s ease}.certificate-panel:hover,.teeth-panel:hover{border-color:#cbdcf4;box-shadow:0 8px 24px #244c8410}.fdi-tooth{transition:transform .2s ease,box-shadow .2s ease}.fdi-tooth.is-selected:hover{transform:translateY(-2px);box-shadow:0 5px 12px #2563eb40}
@media(prefers-reduced-motion:no-preference){
  .intro{animation:at-fade-up .7s cubic-bezier(.2,.7,.2,1) both}.card{animation:at-fade-up .7s .12s cubic-bezier(.2,.7,.2,1) both}
  .certificate{animation:at-cert-enter .6s cubic-bezier(.2,.7,.2,1) both}.certificate-head{animation:at-fade-up .55s .08s both}.certificate-panel:first-child{animation:at-fade-up .55s .16s both}.certificate-panel:last-child{animation:at-fade-up .55s .23s both}.teeth-panel{animation:at-fade-up .55s .3s both}.certificate-badge{animation:at-badge .6s .25s both}
  .fdi-tooth.is-selected{animation:at-tooth .45s both;animation-delay:calc(.4s + var(--tooth-index, 0)*.018s)}
  .lookup button:disabled{position:relative}.lookup button:disabled:after{content:'';display:inline-block;width:12px;height:12px;margin-left:8px;vertical-align:-2px;border:2px solid #ffffff80;border-top-color:#fff;border-radius:50%;animation:at-spin .7s linear infinite}
}
@keyframes at-fade-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes at-cert-enter{from{opacity:0;transform:translateY(20px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes at-badge{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes at-tooth{from{opacity:.25;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes at-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.logos{scroll-behavior:auto}.lookup button,.certificate-panel,.teeth-panel,.fdi-tooth{transition:none}}