/* Trang khảo sát: phân cấp nội dung, biểu mẫu gọn và responsive độc lập với Admin/Pilot. */
.survey-page{color-scheme:light;--bg:#f7f8f6;--card:#fff;--ink:#202e2b;--line:#e0e7e3;--accent:#146354;background:var(--bg);font:15px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.survey-page a{text-decoration:none}.survey-page header,.survey-page main,.survey-page footer{max-width:1200px;padding:0 32px}.survey-header{height:88px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.survey-brand{display:flex;align-items:center;gap:10px;color:var(--ink)!important;font-size:22px;font-weight:750;letter-spacing:-.7px}.survey-brand small{font-size:12px;font-weight:500;letter-spacing:0;color:#68776f}.survey-header nav{display:flex;gap:28px;font-size:13px}.survey-header nav a{color:#52615b}.survey-header nav a:hover{color:var(--accent)}
.survey-hero{padding:48px 0 38px;max-width:840px}.eyebrow{font-size:11px;font-weight:750;letter-spacing:1.6px;color:var(--accent);margin:0 0 14px}.survey-hero h1{font-size:clamp(28px,3.1vw,42px);font-weight:720;letter-spacing:-1.4px;line-height:1.22;margin:0 0 20px;text-wrap:balance}.survey-hero h1 span{color:var(--accent)}.survey-hero>p:not(.eyebrow){color:#607068;font-size:15px;line-height:1.8;margin:0}.survey-meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:24px;font-size:12px;color:#607068}.survey-meta span+span{border-left:1px solid #ced8d2;padding-left:22px}.survey-meta b{font-weight:700;color:var(--ink)}
.survey-layout{display:grid;grid-template-columns:244px minmax(0,1fr);gap:42px;align-items:start}.aside-inner{position:sticky;top:26px}.survey-aside{align-self:stretch}.survey-outline{display:grid;gap:6px}.survey-outline>a{display:flex;gap:13px;align-items:center;padding:14px 12px;color:var(--ink);border-radius:10px}.survey-outline>a:hover,.survey-outline>a:focus-visible{background:#eaf0eb}.survey-outline>a>span{display:grid;place-items:center;width:31px;height:31px;flex:none;background:#e7eee8;border:1px solid #d8e2da;border-radius:50%;font-size:11px;font-weight:750;color:var(--accent)}.survey-outline b{display:block;font-size:13px;font-weight:650}.survey-outline small{display:block;color:#768078;font-size:12px;margin-top:2px}.aside-note{margin-top:24px;padding:20px 0;border-top:1px solid var(--line);color:#647269;font-size:12px}.aside-note b{color:var(--ink);font-size:13px}.aside-note p{margin:10px 0 0}.qr-shortcut{display:block;font-size:12px;color:var(--accent)}
.survey-page fieldset{min-width:0;margin:0 0 24px;padding:28px 30px;border-radius:16px;border:1px solid var(--line);box-shadow:0 4px 24px #243c2b04;scroll-margin-top:22px}.survey-page legend{float:left;width:100%;padding:0;margin:0 0 22px;font-weight:700;font-size:20px;letter-spacing:-.4px}.survey-page legend+.section-intro{clear:both;color:#708078;font-size:13px;margin:0 0 22px}.section-number{font-size:12px;vertical-align:middle;margin-right:11px;background:#eaf2ed;color:var(--accent);padding:6px 8px;border-radius:6px;letter-spacing:0}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;clear:both}.survey-page label{margin:0 0 20px;font-size:13px;font-weight:600;color:#34483e}.survey-page .full-width{grid-column:1/-1}.question-code{color:#8a968e;font-size:10px;font-weight:500;margin-right:7px}.required{color:#aa4b39}.survey-page input:not([type=checkbox]),.survey-page select,.survey-page textarea{display:block;min-height:46px;margin-top:8px;border-radius:8px;border-color:#dce4de;background:#fcfdfb;color:var(--ink);font-size:13px;font-weight:400;padding:11px 13px;transition:border-color .15s,box-shadow .15s}.survey-page textarea{min-height:82px;resize:vertical;line-height:1.6}.survey-page input::placeholder,.survey-page textarea::placeholder{color:#88948c;opacity:1}.survey-page input:focus,.survey-page select:focus,.survey-page textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #14635416;background:#fff}.survey-page a:focus-visible,.survey-page button:focus-visible,.survey-page summary:focus-visible{outline:3px solid #a4c7b9;outline-offset:4px}.question-title{font-size:13px;font-weight:600;margin:0 0 8px}.field-hint{font-size:12px;color:#748279;margin:0 0 16px}.survey-page #pains{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:24px}.survey-page #pains label{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:9px;padding:12px;font-size:12px;font-weight:500;margin:0;cursor:pointer;background:#fcfdfb;min-height:48px}.survey-page #pains label:has(input:checked){border-color:#4e937a;background:#edf5ef;color:#145b47}.survey-page input[type=checkbox]{accent-color:var(--accent);height:17px;width:17px;flex:none;margin:0;cursor:pointer}.survey-page #pains label:has(input:disabled){color:#929b94;cursor:default}.survey-page .consent-label{display:flex;gap:10px;align-items:flex-start;font-weight:400;line-height:1.6;margin-bottom:14px}.consent-label input{margin-top:3px!important}.privacy-note{padding:16px 18px;background:#f4f7f3;border-radius:10px;margin:6px 0 22px;color:#657369;font-size:12px}.privacy-note p{margin:0 0 9px}.privacy-note p:last-child{margin:0}.survey-submit{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}.survey-submit small{font-size:12px;color:#738076;max-width:260px}.survey-page button{color:#fff;font-size:13px;font-weight:600;border:0;padding:13px 22px;border-radius:8px}.survey-page button.secondary{background:#edf2ee;color:var(--accent)}.survey-page .message{margin-bottom:0;font-size:13px;color:#b82727}.survey-page .message:empty{display:none}.survey-page .trap{display:none}
.survey-qr{background:transparent;border:1px solid var(--line);border-radius:12px;padding:0;margin:8px 0 40px}.survey-qr summary{list-style:none;display:flex;justify-content:space-between;padding:18px 22px;font-size:13px;font-weight:600;color:#5c6f62}.survey-qr summary::-webkit-details-marker{display:none}.survey-qr[open] summary>span{transform:rotate(45deg)}.qr-content{padding:0 22px 22px;font-size:13px}.qr-content>p{color:#6a796e}.qr-actions{display:flex;gap:10px}.survey-page #qr-image{display:block;width:220px;margin:20px auto 10px}.survey-page #qr-link{display:block;text-align:center;overflow-wrap:anywhere}.survey-page footer{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--line);padding-top:24px;padding-bottom:28px;font-size:11px;color:#7b877f;margin-top:12px}.survey-page article{margin-top:0;padding:32px}.skip-link{position:absolute;top:-100px;left:20px;padding:8px 16px;background:white;z-index:5}.skip-link:focus{top:10px}
@media(max-width:900px){.survey-layout{grid-template-columns:190px minmax(0,1fr);gap:22px}.survey-page fieldset{padding:24px}.field-grid{gap:0 16px}.survey-page #pains{grid-template-columns:1fr}.survey-outline>a{padding-left:0}}
@media(max-width:640px){.survey-page header,.survey-page main,.survey-page footer{padding-left:20px;padding-right:20px}.survey-header{height:72px}.survey-brand{font-size:19px}.survey-brand small{display:none}.survey-header nav{gap:14px;font-size:11px}.survey-header nav a:last-child{display:none}.survey-hero{padding:32px 0 26px}.survey-hero h1{letter-spacing:-.8px;font-size:29px}.survey-hero>p:not(.eyebrow){font-size:13px}.desktop-break{display:none}.survey-meta{font-size:11px;gap:8px 12px}.survey-meta span+span{padding-left:12px}.survey-layout{display:block}.survey-aside{display:none}.survey-page fieldset{padding:22px 18px;border-radius:12px;margin-bottom:18px}.survey-page legend{font-size:18px}.field-grid{grid-template-columns:1fr}.survey-page #pains{grid-template-columns:1fr}.survey-submit{flex-direction:column;align-items:stretch}.survey-submit button{width:100%}.survey-submit small{max-width:none;text-align:center}.survey-page footer{flex-direction:column;gap:6px}.survey-page article{padding:24px}}
@media print{.survey-header,.survey-hero,.survey-aside,.survey-page footer,#survey{display:none!important}.survey-layout{display:block}.survey-page main{padding:0}.survey-page #qr{display:block!important;border:0;background:white}.survey-page #qr .qr-content{display:block!important;content-visibility:visible}.survey-page #qr .field-grid,.survey-page #qr .qr-actions,#qr-message{display:none}.survey-page #qr summary{display:block;color:black}.survey-page #qr-image{width:294px}.survey-page{background:white}}

/* Minh họa thương hiệu có sẵn: ảnh đầu trang và linh vật theo từng nhóm câu hỏi. */
.survey-hero{max-width:none;display:grid;grid-template-columns:1.35fr 1fr;align-items:center;gap:42px;padding:40px 0}.survey-hero-copy>p:not(.eyebrow){font-size:14px;line-height:1.8;color:#607068;margin:0}.survey-hero h1{font-size:clamp(28px,3vw,39px)}.survey-hero-art{margin:0;border-radius:18px;background:#edf1e8;overflow:hidden;border:1px solid #e3e8df;transform:rotate(1deg);box-shadow:0 12px 30px #3649360a}.survey-hero-art>img{display:block;width:100%;height:auto;aspect-ratio:1.5;object-fit:cover}.survey-hero-art figcaption{display:flex;align-items:center;gap:8px;padding:12px 16px;font-size:11px;color:#526850;background:#edf1e8}.survey-hero-art figcaption>span{color:#8b995b;font-size:17px}.survey-page legend{display:flex;align-items:center;min-height:48px;margin-bottom:12px}.survey-page .section-number{margin-right:11px;flex:none}.section-art{display:block;flex:none;width:56px;height:56px;object-fit:contain;margin-left:auto;margin-top:-10px;margin-bottom:-10px}.survey-page legend+.section-intro{margin-bottom:24px}
@media(max-width:900px){.survey-hero{gap:24px;grid-template-columns:1.2fr 1fr}.survey-hero h1{font-size:30px}.survey-hero-art figcaption{font-size:10px;padding:10px}.survey-hero-copy .desktop-break{display:none}}
@media(max-width:640px){.survey-hero{grid-template-columns:1fr;gap:24px;padding:30px 0}.survey-hero h1{font-size:29px}.survey-hero-art{transform:none;border-radius:14px}.survey-hero-art>img{max-height:195px;object-fit:cover;object-position:center 48%}.survey-hero-art figcaption{font-size:11px;padding:10px 14px}.section-art{width:48px;height:48px}.survey-page legend{min-height:42px}}
@media print{.survey-page .survey-hero{display:none!important}}