/* Dịch bằng dich-lop-khoac.py từ bo-khoac-elementor.css.
 * Bám lớp thiết kế của dự án, không bám lớp của trình dựng nào.
 * Sửa thì sửa bảng ánh xạ trong công cụ rồi dịch lại. */
/* ===================================================================
 * CSS thành phần bộ chuẩn SiteUp.
 *
 * RÚT TỰ ĐỘNG từ khối `const CSS = ` trong siteup-ds/components/**/*.jsx. * KHÔNG sửa tay. Bộ chuẩn có bản mới thì rút lại, xem README cùng thư mục. * * Vì sao cần: bộ chuẩn KHÔNG có tệp CSS cho thành phần. React tiêm CSS lúc * chạy qua useStyle(). Trên WordPress không có React nên 82 lớp .su-* sẽ * không tồn tại, và mọi thành phần hiện ra trơ. * =================================================================== */ /* ---------- tokens/base.css ---------- */
*, *::before, *::after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-ui);font-size:var(--text-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased}a{color:var(--link);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;transition:color var(--dur) var(--ease)}a:hover{color:var(--link-hover)}h1, h2, h3, h4, h5, h6{margin:0;font-weight:var(--fw-bold);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);text-wrap:pretty}h1{font-size:var(--text-h1)}h2{font-size:var(--text-h2)}h3{font-size:var(--text-h3)}h4{font-size:var(--text-h4);font-weight:var(--fw-semibold)}h5{font-size:var(--text-h5);font-weight:var(--fw-semibold)}h6{font-size:var(--text-h6);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:var(--ls-caps)}p{margin:0;text-wrap:pretty}code, kbd, .mono{font-family:var(--font-mono)}button, input, select, textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}img, svg{display:block;max-width:100%}::selection{background:var(--amber-200);color:var(--gray-800)}
@media (prefers-reduced-motion:reduce){*, *::before, *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media (pointer:coarse){:root{--control-h-sm:44px}}/* ---------- components/cards/Commitment.jsx ---------- */
.su-cm{display:flex;gap:14px;padding:20px;background:var(--surface);border:var(--border-w-thin) solid var(--border);border-radius:var(--radius-lg);color:var(--text)}.su-cm--plain{background:none;border:0;padding:0}.su-cm--col{flex-direction:column;gap:16px}.su-cm__ic{width:44px;height:44px;flex:none;display:grid;place-items:center;background:var(--accent-subtle);color:var(--accent-text);border-radius:var(--radius-sm)}.su-cm__t{font:var(--fw-semibold) 16px/1.3 var(--font-ui)}.su-cm__d{font:400 15px/1.5 var(--font-ui);color:var(--text-2);margin-top:4px}.su-cm-grid{display:grid;gap:16px;grid-template-columns:1fr}@media(min-width:600px){.su-cm-grid{grid-template-columns:1fr 1fr}}@media(min-width:1024px){.su-cm-grid{grid-template-columns:repeat(var(--n,4),1fr)}}/* ---------- components/cards/IndustryCard.jsx ---------- */
.su-ind{display:flex;align-items:center;gap:14px;padding:16px;background:var(--surface);border:var(--border-w-thin) solid var(--border);border-radius:var(--radius-lg);color:var(--text);text-decoration:none;transition:border-color var(--dur) var(--ease)}.su-ind:hover{border-color:var(--text);color:var(--text)}.su-ind__ic{width:44px;height:44px;display:grid;place-items:center;background:var(--accent-subtle);color:var(--accent-text);flex:none;border-radius:var(--radius-sm);transition:background var(--dur) var(--ease),color var(--dur) var(--ease)}.su-ind:hover .su-ind__ic{background:var(--accent);color:var(--text-on-accent)}.su-ind__t{flex:1;min-width:0}.su-ind__name{font:var(--fw-semibold) 15px/1.3 var(--font-ui)}.su-ind__n{font:400 12px/1.3 var(--font-mono);color:var(--text-3);margin-top:2px}/* Chevron "SiteUp": phóng từ góc dưới-trái lên theo hướng 19° (dốc 9/26), nhỏ → to, không xoay (chốt 19/09) */
.su-ind__chev{color:var(--accent-text);flex:none;opacity:0;transform:translate(-14px,5px) scale(.5);transform-origin:left bottom;transition:opacity var(--dur) var(--ease),transform var(--dur-slow) var(--ease)}.su-ind:hover .su-ind__chev, .su-ind:focus-visible .su-ind__chev{opacity:1;transform:translate(0,0) scale(1)}@media(hover:none){.su-ind__chev{opacity:1;transform:none;color:var(--text-3)}}.su-ind[data-hue=sage] .su-ind__ic{background:var(--tint-sage);color:var(--tint-sage-text)}.su-ind[data-hue=sage]:hover .su-ind__ic{background:var(--tint-sage-strong);color:var(--sage-800)}.su-ind[data-hue=peri] .su-ind__ic{background:var(--tint-peri);color:var(--tint-peri-text)}.su-ind[data-hue=peri]:hover .su-ind__ic{background:var(--tint-peri-strong);color:var(--peri-800)}.su-ind[data-hue=peach] .su-ind__ic{background:var(--tint-peach);color:var(--tint-peach-text)}.su-ind[data-hue=peach]:hover .su-ind__ic{background:var(--tint-peach-strong);color:var(--peach-800)}.su-ind--tile{flex-direction:column;align-items:flex-start;gap:16px;padding:20px}.su-ind--tile .su-ind__chev{display:none}/* ---------- components/cards/PricingCard.jsx ---------- */
.su-price{position:relative;display:flex;flex-direction:column;gap:20px;padding:24px;background:var(--surface);border:var(--border-w-thin) solid var(--border);border-radius:var(--radius-lg);color:var(--text)}.su-price--featured{border-color:var(--accent);border-width:var(--border-w);box-shadow:var(--accent-glow)}.su-price__for{font:var(--fw-medium) 13px/1.4 var(--font-ui);color:var(--accent-text)}.su-price__head{display:flex;flex-direction:column;gap:8px}.su-price__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px}.su-price__name{font:var(--fw-bold) 20px/1.25 var(--font-ui)}.su-price__desc{font:400 15px/1.5 var(--font-ui);color:var(--text-2)}.su-price__amt{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;font:var(--fw-semibold) var(--fs-4) / 1.1 var(--font-mono);letter-spacing:var(--ls-price)}.su-price__amt small{font:400 14px/var(--lh-label) var(--font-ui);color:var(--text-3);white-space:nowrap;flex:none}.su-price__amt .from{font:400 14px/var(--lh-label) var(--font-ui);color:var(--text-2)}.su-price__old{font:400 14px/var(--lh-label) var(--font-mono);color:var(--text-3);text-decoration:line-through}.su-price__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font:400 15px/1.45 var(--font-ui)}.su-price__list li{display:flex;gap:10px;align-items:flex-start}.su-price__list li .ok{color:var(--accent-text);margin-top:2px}.su-price__list li.off{color:var(--text-3)}.su-price__list li.off .ok{color:var(--border-strong)}.su-price__note{font:400 13px/1.45 var(--font-ui);color:var(--text-3);padding-top:12px;border-top:var(--border-w-thin) solid var(--border)}.su-price--band{position:relative;overflow:hidden;background:radial-gradient(70% 120% at 80% 30%,#2B3036 0%,var(--gray-900) 70%);color:var(--gray-0);border-color:var(--gray-700);display:grid;gap:20px 32px;grid-template-columns:1fr}.su-price--band::before{content:"";position:absolute;inset:-20%;background:radial-gradient(30% 60% at 78% 40%,rgba(233,162,26,.35) 0%,transparent 60%);filter:blur(28px);pointer-events:none}.su-price--band > *{position:relative;z-index:1}.su-price--band .su-price__amt{overflow:visible;white-space:nowrap;padding-left:2px}.su-price--band .su-stage__chev{position:absolute;z-index:0;right:-4%;top:50%;width:min(34%,360px);transform:translateY(-50%);color:var(--accent);opacity:.16;pointer-events:none}.su-price--band .su-stage__chev path{vector-effect:non-scaling-stroke}@media(min-width:768px){.su-price--band{grid-template-columns:1.1fr 1.4fr;align-items:start}}@media(min-width:1024px){.su-price--band{grid-template-columns:1fr 1.6fr .9fr;align-items:center;padding:28px 32px}}.su-price--band .su-price__for{color:var(--amber-300)}.su-price--band .su-price__desc{color:var(--gray-300)}.su-price--band .su-price__amt{color:var(--gray-0)}.su-price--band .su-price__amt small, .su-price--band .su-price__amt .from{color:var(--gray-400)}.su-price--band .su-price__list{display:grid;grid-template-columns:1fr;gap:10px 24px}@media(min-width:600px){.su-price--band .su-price__list{grid-template-columns:1fr 1fr}}.su-price--band .su-price__list li .ok{color:var(--accent)}.su-price--band .su-price__side{display:flex;flex-direction:column;gap:12px}.su-price--band .su-price__note{color:var(--gray-400);border-color:var(--gray-700)}/* ---------- components/cards/Stat.jsx ---------- */
.su-stat{display:flex;flex-direction:column;gap:6px;color:var(--text)}.su-stat__n{font:var(--fw-semibold) var(--text-price)/var(--lh-label) var(--font-mono);letter-spacing:var(--ls-price)}.su-stat__n small{font:400 .45em/var(--lh-label) var(--font-ui);color:var(--text-2);margin-left:4px}.su-stat__l{font:400 15px/1.4 var(--font-ui);color:var(--text-2)}.su-stat--accent .su-stat__n{color:var(--accent-text)}.su-stat--inverse{color:var(--gray-50)}.su-stat--inverse .su-stat__n{color:var(--accent)}.su-stat--inverse .su-stat__l, .su-stat--inverse .su-stat__n small{color:var(--gray-300)}.su-stat-row{display:grid;gap:24px;grid-template-columns:1fr 1fr}@media(min-width:768px){.su-stat-row{grid-template-columns:repeat(var(--n,4),1fr)}}.su-stat-row--divided > *{padding-left:20px;border-left:var(--bar-w) solid var(--accent)}/* ---------- components/cards/TemplateCard.jsx ---------- */
.su-tpl{display:flex;flex-direction:column;background:var(--surface);border:var(--border-w-thin) solid transparent;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-1);transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease),border-color var(--dur) var(--ease)}.su-tpl:hover{box-shadow:var(--shadow-2);transform:translateY(-2px)}.su-tpl:focus-within{border-color:var(--text)}[data-theme=dark] .su-tpl{border-color:var(--border)}.su-tpl__media{position:relative;aspect-ratio:16/11;background:var(--bg-subtle);overflow:hidden;border-bottom:1px solid var(--border)}.su-tpl__media img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform var(--dur-slow) var(--ease)}.su-tpl:hover .su-tpl__media img{transform:translateY(-6px)}.su-tpl__ph{position:absolute;inset:0;display:grid;grid-template-rows:14% 1fr;gap:6px;padding:8%}.su-tpl__ph i{display:block;background:var(--border);border-radius:4px}.su-tpl__ph b{display:grid;grid-template-columns:2fr 1fr;gap:6px}.su-tpl__ph b i:first-child{background:var(--border-strong)}.su-tpl[data-hue=sage] .su-tpl__media{background:var(--tint-sage)}.su-tpl[data-hue=sage] .su-tpl__ph i{background:var(--sage-200)}.su-tpl[data-hue=sage] .su-tpl__ph b i:first-child{background:var(--tint-sage-strong)}.su-tpl[data-hue=peri] .su-tpl__media{background:var(--tint-peri)}.su-tpl[data-hue=peri] .su-tpl__ph i{background:var(--peri-200)}.su-tpl[data-hue=peri] .su-tpl__ph b i:first-child{background:var(--tint-peri-strong)}.su-tpl[data-hue=peach] .su-tpl__media{background:var(--tint-peach)}.su-tpl[data-hue=peach] .su-tpl__ph i{background:var(--peach-200)}.su-tpl[data-hue=peach] .su-tpl__ph b i:first-child{background:var(--tint-peach-strong)}.su-tpl[data-hue=amber] .su-tpl__media{background:var(--amber-100)}.su-tpl[data-hue=amber] .su-tpl__ph i{background:var(--amber-200)}.su-tpl[data-hue=amber] .su-tpl__ph b i:first-child{background:var(--amber-300)}.su-tpl__badges{position:absolute;top:10px;left:10px;display:flex;gap:6px}.su-tpl__body{display:flex;flex-direction:column;gap:10px;padding:12px 12px 12px}.su-tpl__meta{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.su-tpl__code{font:var(--fw-medium) 12px/var(--lh-label) var(--font-mono);color:var(--text-3);letter-spacing:.04em}.su-tpl__name{font:var(--fw-semibold) 16px/1.3 var(--font-ui);color:var(--text);margin-top:2px}.su-tpl__ind{font:400 14px/1.3 var(--font-ui);color:var(--text-3)}.su-tpl__price{font:var(--fw-semibold) 15px/var(--lh-label) var(--font-mono);color:var(--text);white-space:nowrap}.su-tpl__price small{font-weight:400;color:var(--text-3);font-size:12px}.su-tpl__acts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.su-tpl--loading .su-tpl__ph i{animation:su-pulse 1.2s ease-in-out infinite}@keyframes su-pulse{50%{opacity:.5}}/* ---------- components/cards/TestimonialCard.jsx ---------- */
.su-tm{display:flex;flex-direction:column;gap:16px;padding:20px;background:var(--surface);border:var(--border-w-thin) solid var(--border);border-radius:var(--radius-lg);color:var(--text)}.su-tm__stars{display:flex;gap:2px;color:var(--accent)}.su-tm__q{font:400 16px/1.55 var(--font-ui);color:var(--text)}.su-tm__q::before{content:"“"}.su-tm__q::after{content:"”"}.su-tm__who{display:flex;align-items:center;gap:12px;padding-top:14px;border-top:var(--border-w-thin) solid var(--border)}.su-tm__av{width:44px;height:44px;border-radius:var(--radius-pill);display:grid;place-items:center;background:var(--surface-inverse);color:var(--text-inverse);font:var(--fw-semibold) 15px/var(--lh-label) var(--font-ui);flex:none;overflow:hidden}.su-tm__av img{width:100%;height:100%;object-fit:cover}.su-tm__name{font:var(--fw-semibold) 14px/1.3 var(--font-ui)}.su-tm__role{font:400 13px/1.3 var(--font-ui);color:var(--text-3)}.su-tm__code{margin-left:auto;font:var(--fw-medium) 11px/var(--lh-label) var(--font-mono);color:var(--text-3);letter-spacing:.04em;white-space:nowrap}/* ---------- components/content/FAQ.jsx ---------- */
.su-faq{display:flex;flex-direction:column;border-top:var(--border-w-thin) solid var(--border)}.su-faq__item{border-bottom:var(--border-w-thin) solid var(--border)}.su-faq__q{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:56px;padding:16px 0;background:none;border:0;text-align:left;cursor:pointer;font:var(--fw-semibold) 16px/1.4 var(--font-ui);color:var(--text);-webkit-tap-highlight-color:transparent}.su-faq__q:hover{color:var(--accent-text)}.su-faq__q .ic{color:var(--text-3);transition:transform var(--dur) var(--ease)}.su-faq__q[aria-expanded=true] .ic{transform:rotate(180deg);color:var(--text)}.su-faq__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--dur-slow) var(--ease)}.su-faq__a[data-open=true]{grid-template-rows:1fr}.su-faq__a > div{overflow:hidden}.su-faq__a p{margin:0 0 16px;padding-right:36px;font:400 16px/1.6 var(--font-ui);color:var(--text-2)}/* ---------- components/content/ProcessSteps.jsx ---------- */
.su-steps{display:grid;gap:24px;counter-reset:st}.su-steps--h{grid-template-columns:repeat(var(--n),minmax(0,1fr))}.su-steps--v{grid-template-columns:1fr}.su-step{position:relative;display:flex;flex-direction:column;gap:12px;padding-top:20px}.su-step::before{content:"";position:absolute;top:0;left:0;right:0;height:var(--step-bar,2px);background:var(--border-strong)}.su-step[data-state=done]::before{background:var(--accent)}.su-step[data-state=current]::before{background:var(--text)}.su-steps--v .su-step{padding:0 0 0 24px}.su-steps--v .su-step::before{top:0;bottom:-24px;left:0;right:auto;width:var(--step-bar,2px);height:auto}.su-steps--v .su-step:last-child::before{bottom:0}.su-step__n{font:var(--fw-medium) 13px/var(--lh-label) var(--font-mono);color:var(--text-3);letter-spacing:.06em;display:flex;align-items:center;gap:8px}.su-step[data-state=done] .su-step__n{color:var(--accent-text)}.su-step[data-state=current] .su-step__n{color:var(--text)}.su-step__t{font:var(--fw-bold) 18px/1.3 var(--font-ui);color:var(--text)}.su-step__d{font:400 15px/1.5 var(--font-ui);color:var(--text-2)}.su-step__dur{font:var(--fw-medium) 12px/var(--lh-label) var(--font-mono);color:var(--text-3);margin-top:auto}/* animate: thanh vàng quét lần lượt, mỗi bước "hoàn tất" nối tiếp nhau khi khối vào màn hình */
.su-steps--anim .su-step::before{background:var(--border-strong)}.su-steps--anim .su-step::after{content:"";position:absolute;top:0;left:0;height:var(--step-bar,2px);width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform var(--step-dur,700ms) var(--ease-out,cubic-bezier(.2,.7,.2,1)) var(--delay,0ms)}.su-steps--anim.su-steps--v .su-step::after{width:var(--step-bar,2px);height:auto;bottom:-24px;transform:scaleY(0);transform-origin:top}.su-steps--anim.su-steps--v .su-step:last-child::after{bottom:0}.su-steps--anim .su-step__n .ic{opacity:0;transform:scale(.6);transition:opacity var(--dur) var(--ease) calc(var(--delay,0ms) + var(--step-dur,700ms)),transform var(--dur) var(--ease) calc(var(--delay,0ms) + var(--step-dur,700ms))}.su-steps--anim .su-step__n{transition:color var(--dur) var(--ease) calc(var(--delay,0ms) + var(--step-dur,700ms))}.su-steps--anim.is-on .su-step::after{transform:none}.su-steps--anim.is-on .su-step__n{color:var(--accent-text)}.su-steps--anim.is-on .su-step__n .ic{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.su-steps--anim .su-step::after, .su-steps--anim .su-step__n, .su-steps--anim .su-step__n .ic{transition:none}}/* ---------- components/core/Badge.jsx ---------- */
.su-badge{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:var(--radius-pill);font:var(--fw-medium) var(--text-label)/var(--lh-label) var(--font-mono);text-transform:uppercase;letter-spacing:var(--ls-caps);white-space:nowrap;border:var(--border-w-thin) solid transparent}.su-badge--neutral{background:var(--bg-subtle);color:var(--text-2);border-color:var(--border)}.su-badge--accent{background:var(--accent);color:var(--text-on-accent)}.su-badge--new{background:var(--info-subtle);color:var(--info);border-color:var(--info-border)}.su-badge--accent-soft{background:var(--accent-subtle);color:var(--accent-text);border-color:var(--accent-ring)}.su-badge--success{background:var(--success-subtle);color:var(--success)}.su-badge--info{background:var(--info-subtle);color:var(--info)}.su-badge--danger{background:var(--danger-subtle);color:var(--danger)}.su-badge--inverse{background:var(--surface-inverse);color:var(--text-inverse)}.su-badge--outline{background:transparent;color:var(--text);border-color:var(--border-strong)}.su-badge--lg{height:26px;padding:0 10px;font-size:12px}.su-badge--warning{background:var(--warning-subtle);color:var(--warning)}.su-badge__dot{width:6px;height:6px;background:currentColor}/* ---------- components/core/Button.jsx ---------- */
.su-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:0;max-width:100%;border:var(--border-w) solid transparent;border-radius:var(--radius-pill);font:var(--fw-semibold) var(--text-button)/var(--lh-label) var(--font-ui);letter-spacing:0;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur-fast) var(--ease);user-select:none;-webkit-tap-highlight-color:transparent}.su-btn:active{transform:translateY(1px)}.su-btn[disabled], .su-btn[aria-disabled=true]{opacity:.45;cursor:not-allowed;pointer-events:none}.su-btn--sm{height:var(--control-h-sm);padding:0 14px;font-size:var(--text-button-sm)}.su-btn--md{height:var(--control-h);padding:0 20px}.su-btn--lg{height:var(--control-h-lg);padding:0 28px;font-size:var(--text-button-lg)}.su-btn--text{background:none;border-color:transparent;color:var(--accent-text);padding:0 4px;height:auto;min-height:var(--touch-min);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}.su-btn--text:hover{color:var(--text);text-decoration-thickness:2px}.su-btn--pill{border-radius:var(--radius-pill)}.su-btn__ir{transition:transform var(--dur) var(--ease)}.su-btn:hover .su-btn__ir{transform:translateX(3px)}.su-btn--on-dark.su-btn--secondary{color:var(--gray-0);border-color:var(--gray-500)}.su-btn--on-dark.su-btn--secondary:hover{background:var(--gray-0);border-color:var(--gray-0);color:var(--gray-800)}.su-btn--on-dark.su-btn--secondary:active{background:var(--gray-200);border-color:var(--gray-200);color:var(--gray-800)}.su-btn--on-dark.su-btn--ghost{color:var(--gray-0)}.su-btn--on-dark.su-btn--ghost:hover{background:rgba(255,255,255,.1);color:var(--accent)}.su-btn--on-dark.su-btn--ghost:active{background:rgba(255,255,255,.18);color:var(--accent)}.su-btn--on-dark.su-btn--text{color:var(--amber-300)}.su-btn--on-dark.su-btn--text:hover{color:var(--gray-0)}.su-btn--on-dark:focus-visible{outline-color:var(--gray-0)}.su-btn--full{width:100%}.su-btn--primary{background:var(--primary);color:var(--primary-text);border-color:var(--primary)}.su-btn--primary:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.su-btn--primary:active{background:var(--primary-active)}.su-btn--accent{background:var(--accent);color:var(--text-on-accent);border-color:var(--accent);box-shadow:var(--accent-glow)}.su-btn--accent:hover{background:var(--accent-hover);border-color:var(--accent-hover);box-shadow:0 10px 28px rgba(233,162,26,.45);transform:translateY(-1px)}.su-btn--accent:active{background:var(--accent-active);box-shadow:0 4px 12px rgba(233,162,26,.3);transform:translateY(0)}.su-btn--accent .su-btn__ir{background:var(--text-on-accent);color:var(--accent);border-radius:50%;padding:3px;box-sizing:content-box}.su-btn--secondary{background:transparent;color:var(--text);border-color:var(--border-strong)}.su-btn--secondary:hover{border-color:var(--primary);background:var(--primary);color:var(--primary-text)}.su-btn--secondary:active{background:var(--primary-active);border-color:var(--primary-active);color:var(--primary-text)}.su-btn--ghost{background:transparent;color:var(--text);border-color:transparent}.su-btn--ghost:hover{background:var(--accent-subtle);color:var(--accent-text)}.su-btn--ghost:active{background:var(--amber-100);color:var(--accent-text)}.su-btn--zalo{background:var(--zalo);color:#fff;border-color:var(--zalo)}.su-btn--zalo:hover{background:var(--zalo-hover);border-color:var(--zalo-hover)}.su-btn--call{background:var(--green-600);color:#fff;border-color:var(--green-600)}.su-btn--call:hover{background:var(--green-700);border-color:var(--green-700)}.su-btn--icon{padding:0;aspect-ratio:1}.su-btn--square{border-radius:var(--radius-sm)}.su-btn:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}.su-btn--accent:focus-visible, .su-btn--primary:focus-visible{outline-color:var(--text);box-shadow:0 0 0 4px var(--surface)}.su-btn__lbl{min-width:0;text-overflow:ellipsis;line-height:var(--lh-label);padding:1px 0}.su-btn__spin{width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:su-spin .7s linear infinite}@keyframes su-spin{to{transform:rotate(1turn)}}/* ---------- components/core/Checkbox.jsx ---------- */
.su-ck{display:flex;align-items:flex-start;gap:12px;min-height:var(--touch-min);padding:6px 0;cursor:pointer;color:var(--text);font:400 16px/1.45 var(--font-ui);-webkit-tap-highlight-color:transparent}.su-ck input{position:absolute;opacity:0;width:0;height:0}.su-ck__box{width:22px;height:22px;flex:none;margin-top:1px;display:grid;place-items:center;border:var(--border-w) solid var(--border-control);border-radius:6px;background:var(--surface);color:var(--primary-text);transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease)}.su-ck--radio .su-ck__box{border-radius:50%}.su-ck--radio .su-ck__box::after{content:"";width:10px;height:10px;border-radius:50%;background:currentColor;transform:scale(0);transition:transform var(--dur-fast) var(--ease)}.su-ck:hover .su-ck__box{border-color:var(--text)}.su-ck input:focus-visible+.su-ck__box{outline:2px solid var(--border-focus);outline-offset:2px}.su-ck input:checked+.su-ck__box{background:var(--primary);border-color:var(--primary);color:var(--primary-text)}.su-ck--radio input:checked+.su-ck__box{background:var(--surface);color:var(--primary)}.su-ck--radio input:checked+.su-ck__box::after{transform:scale(1)}.su-ck:active .su-ck__box{transform:scale(.94)}.su-ck--disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.su-ck--error .su-ck__box{border-color:var(--danger)}.su-ck__t{display:flex;flex-direction:column;gap:2px}.su-ck__hint{font-size:13px;color:var(--text-3)}.su-ck__err{font-size:13px;color:var(--danger)}.su-ck-group{display:flex;flex-direction:column;gap:0}.su-ck-group__label{font:var(--fw-medium) 14px/1.3 var(--font-ui);color:var(--text);margin-bottom:4px}.su-ck-group--row{flex-direction:row;flex-wrap:wrap;gap:0 24px}/* ---------- components/core/Chip.jsx ---------- */
.su-chip{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 16px;border:var(--border-w) solid var(--border-strong);border-radius:var(--radius-pill);background:var(--surface);color:var(--text);font:var(--fw-medium) 14px/var(--lh-label) var(--font-ui);cursor:pointer;white-space:nowrap;transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease);-webkit-tap-highlight-color:transparent}.su-chip:hover{border-color:var(--text)}@media(pointer:coarse){.su-chip{height:var(--touch-min)}}.su-chip[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--text-on-accent)}.su-chip[aria-pressed=true]:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.su-chip__n{font:var(--fw-medium) 12px/var(--lh-label) var(--font-mono);color:var(--text-3)}.su-chip[aria-pressed=true] .su-chip__n{color:inherit;opacity:.8}.su-chip[disabled]{opacity:.45;cursor:not-allowed;pointer-events:none}.su-chip:active{background:var(--bg-subtle)}.su-chip[aria-pressed=true]:active{background:var(--accent-active);color:var(--gray-0)}.su-chips{display:flex;flex-wrap:wrap;gap:8px}.su-chips--scroll{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.su-chips--scroll::-webkit-scrollbar{display:none}/* ---------- components/core/Input.jsx ---------- */
.su-field{display:flex;flex-direction:column;gap:6px;min-width:0}.su-field__label{font:var(--fw-medium) 14px/1.3 var(--font-ui);color:var(--text)}.su-field__label i{color:var(--accent-text);font-style:normal;margin-left:2px}.su-field__box{position:relative;display:flex;align-items:center}.su-field__box .su-ic{position:absolute;left:12px;color:var(--text-3);pointer-events:none}.su-input{width:100%;height:var(--control-h);padding:0 14px;border:var(--border-w) solid var(--border-control);border-radius:var(--radius);background:var(--surface);color:var(--text);font:400 16px/1.3 var(--font-ui);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);appearance:none;-webkit-appearance:none}.su-input::placeholder{color:var(--text-3)}.su-input:hover{border-color:var(--text-2)}.su-input:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-ring)}.su-input--icon{padding-left:40px}.su-input--mono{font-family:var(--font-mono)}textarea.su-input{height:auto;min-height:112px;padding:12px 14px;resize:vertical;line-height:1.5}select.su-input{padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235F666E' stroke-width='2'%3E%3Cpath d='M5 9l7 5 7-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}[data-theme=dark] select.su-input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23C9CED6' stroke-width='2'%3E%3Cpath d='M5 9l7 5 7-5'/%3E%3C/svg%3E")}.su-field--error .su-input{border-color:var(--danger)}.su-field--error .su-input:focus{box-shadow:0 0 0 3px var(--danger-subtle)}.su-field__msg{font:400 13px/1.4 var(--font-ui);color:var(--text-3)}.su-field--error .su-field__msg{color:var(--danger)}.su-input[disabled]{background:var(--surface-sunken);color:var(--text-3);cursor:not-allowed;border-color:var(--border)}.su-input[readonly]{background:var(--surface-sunken)}.su-field--sm .su-input{height:var(--control-h-sm);font-size:14px}/* ---------- components/layout/ConsultForm.jsx ---------- */
.su-cf{display:flex;flex-direction:column;gap:16px;padding:20px;background:var(--surface);border:var(--border-w-thin) solid var(--border);border-radius:var(--radius-lg);color:var(--text)}.su-cf__h{display:flex;flex-direction:column;gap:6px}.su-cf__h h3{font:var(--fw-bold) 22px/1.2 var(--font-ui);margin:0}.su-cf__h p{font:400 15px/1.5 var(--font-ui);color:var(--text-2);margin:0}.su-cf__row{display:grid;gap:16px;grid-template-columns:1fr}@media(min-width:480px){.su-cf__row{grid-template-columns:1fr 1fr}}.su-cf__fine{font:400 13px/1.5 var(--font-ui);color:var(--text-3)}.su-cf__ok{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:8px 0}.su-cf__ok .ic{width:48px;height:48px;display:grid;place-items:center;background:var(--success-subtle);color:var(--success);border-radius:var(--radius-pill)}/* ---------- components/layout/DemoToolbar.jsx ---------- */
.su-dt{position:sticky;top:0;z-index:var(--z-header);display:flex;align-items:center;gap:12px;height:56px;padding:0 12px;background:var(--gray-800);color:var(--gray-50);border-bottom:var(--border-w-thin) solid var(--gray-700)}@media(min-width:768px){.su-dt{padding:0 20px;gap:20px}}.su-dt__back{display:inline-flex;align-items:center;gap:6px;color:var(--gray-300);text-decoration:none;font:var(--fw-medium) 14px/var(--lh-label) var(--font-ui)}.su-dt__back:hover{color:var(--gray-0)}.su-dt__back span{display:none}@media(min-width:768px){.su-dt__back span{display:inline}}.su-dt__name{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.su-dt__name b{font:var(--fw-semibold) 15px/1.2 var(--font-ui);color:var(--gray-0);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.su-dt__name small{display:none;color:var(--gray-400);font:400 13px/var(--lh-label) var(--font-ui)}@media(min-width:768px){.su-dt__name small{display:inline}}.su-dt__dev{display:none;gap:2px;padding:2px;border:var(--border-w-thin) solid var(--gray-700);border-radius:var(--radius-sm)}@media(min-width:768px){.su-dt__dev{display:flex}}.su-dt__dev button{width:40px;height:36px;display:grid;place-items:center;border:0;border-radius:6px;background:none;color:var(--gray-400);cursor:pointer}.su-dt__dev button:hover{color:var(--gray-0)}.su-dt__dev button[aria-pressed=true]{background:var(--gray-700);color:var(--accent)}.su-dt__acts{display:flex;gap:8px;align-items:center}/* ---------- components/layout/Footer.jsx ---------- */
.su-ft{background:var(--gray-800);color:var(--gray-300);position:relative;overflow:hidden}.su-ft .su-stage__chev{position:absolute;z-index:0;right:-6%;bottom:-8%;width:min(46%,560px);color:var(--accent);opacity:.1;pointer-events:none}.su-ft .su-stage__chev path{vector-effect:non-scaling-stroke}.su-ft a:not(.su-btn){color:var(--gray-300);text-decoration:none;transition:color var(--dur) var(--ease)}.su-ft a:not(.su-btn):hover{color:var(--gray-0)}.su-ft .su-btn--accent{box-shadow:none;color:var(--amber-900)}.su-ft .su-btn--accent:hover{box-shadow:none}.su-ft .su-btn--zalo{color:#fff}.su-ft__in{max-width:var(--container);margin:0 auto;padding:0 var(--margin);position:relative;z-index:1}.su-ft__top{display:grid;grid-template-columns:1fr;align-items:center;gap:var(--space-6) var(--space-8);padding:var(--space-16) 0 var(--space-10);border-bottom:var(--border-w-thin) solid var(--gray-700)}@media(min-width:900px){.su-ft__top{grid-template-columns:minmax(0,1fr) auto}}.su-ft__tag{font:var(--fw-bold) var(--text-h2)/var(--lh-heading) var(--font-ui);letter-spacing:var(--ls-heading);color:var(--gray-0);max-width:22ch;text-wrap:pretty;margin:0}.su-ft__tag em{font-style:normal;color:var(--accent)}.su-ft__sub{margin:var(--space-3) 0 0;font:var(--fw-regular) var(--text-body)/var(--lh-body) var(--font-ui);color:var(--gray-300);max-width:56ch;text-wrap:pretty}.su-ft__cta{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-self:start}@media(min-width:900px){.su-ft__cta{justify-self:end;flex-wrap:nowrap}}.su-ft__grid{display:grid;gap:var(--space-8) var(--space-6);grid-template-columns:1fr 1fr;padding:var(--space-10) 0 var(--space-12)}@media(min-width:768px){.su-ft__grid{grid-template-columns:repeat(4,1fr)}}@media(min-width:1024px){.su-ft__grid{grid-template-columns:1.5fr 1fr 1fr 1fr 1.3fr;gap:var(--space-8) var(--space-10)}}.su-ft__brand{display:flex;flex-direction:column;gap:var(--space-5);grid-column:1/-1}@media(min-width:1024px){.su-ft__brand{grid-column:auto}}.su-ft__brand img{height:28px;width:auto;align-self:flex-start}.su-ft__brand p{font:var(--fw-regular) var(--text-body)/var(--lh-body) var(--font-ui);margin:0;max-width:34ch;color:var(--gray-300)}.su-ft h4{font:var(--fw-medium) var(--text-small)/var(--lh-label) var(--font-mono);text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--gray-400);margin:0 0 var(--space-4)}.su-ft ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-3);font:var(--fw-regular) var(--text-body)/var(--lh-body) var(--font-ui)}.su-ft__contact li{display:flex;gap:var(--space-3);align-items:flex-start}.su-ft__contact .ic{color:var(--accent);margin-top:3px;flex:none}.su-ft__contact b{color:var(--gray-0);font-weight:600;font-family:var(--font-mono);font-size:var(--text-body)}.su-ft__contact small{display:block;font-size:var(--text-small);line-height:var(--lh-body);color:var(--gray-400)}.su-ft__bar{border-top:var(--border-w-thin) solid var(--gray-700);position:relative;z-index:1;background:var(--gray-800)}.su-ft__bar .su-ft__in{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-6);justify-content:space-between;align-items:center;padding:var(--space-5) var(--margin);font:var(--fw-regular) var(--text-small)/var(--lh-body) var(--font-ui);color:var(--gray-400)}.su-ft__legal{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-5)}.su-ft__legal a{color:var(--gray-400)}.su-ft__badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:var(--radius-pill);border:var(--border-w-thin) solid var(--gray-700);color:var(--gray-300);font:var(--fw-medium) var(--text-small)/var(--lh-label) var(--font-ui)}.su-ft__badge .ic{color:var(--accent)}.su-ft__mark{display:block;margin:0 0 -.06em;text-align:left;font:800 clamp(64px,16.5vw,236px)/.9 var(--font-ui);letter-spacing:-.05em;color:var(--gray-600);pointer-events:none;user-select:none;white-space:nowrap;overflow:hidden}.su-ft__mark em{font-style:normal;color:var(--accent)}.su-ft--mark .su-ft__grid{padding-bottom:var(--space-8)}/* ---------- components/layout/Header.jsx ---------- */
.su-hd{position:sticky;top:0;z-index:var(--z-header);background:var(--surface);border-bottom:var(--border-w-thin) solid var(--border);color:var(--text);transition:box-shadow var(--dur) var(--ease)}.su-hd--compact{box-shadow:var(--shadow-1)}.su-hd__in{max-width:var(--container);margin:0 auto;padding:0 var(--margin);height:var(--header-h);display:flex;align-items:center;gap:24px;transition:height var(--dur) var(--ease)}.su-hd--compact .su-hd__in{height:var(--header-h-compact)}.su-hd__logo img{height:28px;transition:height var(--dur) var(--ease)}@media(min-width:768px){.su-hd__logo img{height:32px}}.su-hd--compact .su-hd__logo img{height:26px}.su-hd__nav{display:none;gap:0;flex:1;min-width:0;height:100%}@media(min-width:1024px){.su-hd__nav{display:flex}}.su-hd__nav > a, .su-hd__nav > button, .su-hd__dd > button{display:flex;align-items:center;gap:6px;height:100%;padding:0 10px;white-space:nowrap;flex:none;font:var(--fw-medium) 15px/var(--lh-label) var(--font-ui);color:var(--text-2);text-decoration:none;background:none;border:0;border-bottom:var(--bar-w) solid transparent;cursor:pointer;transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease)}.su-hd__nav > a:hover, .su-hd__nav > button:hover, .su-hd__dd > button:hover{color:var(--text)}.su-hd__nav > a[aria-current=page], .su-hd__dd > button[aria-expanded=true]{color:var(--text);border-bottom-color:var(--accent)}.su-hd__dd > button:focus-visible, .su-hd__nav > a:focus-visible{outline:2px solid var(--border-focus);outline-offset:-2px;border-radius:var(--radius-sm)}.su-hd__dd .su-hd__caret{color:var(--text-3);transition:transform var(--dur) var(--ease),color var(--dur) var(--ease)}.su-hd__dd > button:hover .su-hd__caret, .su-hd__dd > button[aria-expanded=true] .su-hd__caret{color:var(--text)}.su-hd__dd > button[aria-expanded=true] .su-hd__caret{transform:rotate(180deg)}.su-hd__dd{position:relative;height:100%}.su-hd__panel{position:absolute;top:100%;left:0;margin-top:1px;width:720px;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:0 0 var(--radius-lg) var(--radius-lg);box-shadow:var(--shadow-2);display:grid;grid-template-columns:repeat(3,1fr);gap:4px;animation:su-hd-in var(--dur) var(--ease)}@keyframes su-hd-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}.su-hd__panel a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--radius-sm);color:var(--text);text-decoration:none;font:var(--fw-medium) 14px/1.3 var(--font-ui)}.su-hd__panel a:hover{background:var(--accent-subtle);color:var(--text)}.su-hd__panel a span.ic{width:36px;height:36px;display:grid;place-items:center;background:var(--accent-subtle);color:var(--accent-text);border-radius:var(--radius-sm);flex:none}.su-hd__panel a:hover span.ic{background:var(--accent);color:var(--text-on-accent)}.su-hd__panel a small{display:block;font:400 12px/var(--lh-label) var(--font-mono);color:var(--text-3);margin-top:3px}.su-hd__panel .all{grid-column:1/-1;justify-content:center;margin-top:8px;padding-top:14px;border-top:1px solid var(--border);border-radius:0;color:var(--accent-text)}.su-hd__acts{display:flex;align-items:center;gap:8px;margin-left:auto;flex:none;white-space:nowrap}.su-hd .su-btn.su-hd__phone{display:none}@media(min-width:1200px){.su-hd .su-btn.su-hd__phone{display:inline-flex}}.su-hd .su-btn.su-hd__cta{display:none}@media(min-width:768px){.su-hd .su-btn.su-hd__cta{display:inline-flex}}.su-hd .su-btn.su-hd__burger{display:inline-flex}@media(min-width:1024px){.su-hd .su-btn.su-hd__burger{display:none}}.su-hd__sheet{position:fixed;inset:0;z-index:var(--z-overlay);background:var(--surface);display:flex;flex-direction:column;animation:su-sheet var(--dur-slow) var(--ease)}@keyframes su-sheet{from{opacity:0;transform:translateY(var(--enter-y))}to{opacity:1;transform:none}}@media(min-width:1024px){.su-hd__sheet{display:none}}.su-hd__sheet-top{display:flex;align-items:center;justify-content:space-between;height:var(--header-h);padding:0 var(--margin);border-bottom:1px solid var(--border)}.su-hd__sheet-top img{height:28px}.su-hd__sheet-body{flex:1;overflow:auto;padding:8px var(--margin) 24px;display:flex;flex-direction:column}.su-hd__sheet-body > a, .su-hd__sheet-body > button{display:flex;justify-content:space-between;align-items:center;min-height:52px;padding:0 4px;font:var(--fw-medium) 17px/1.3 var(--font-ui);color:var(--text);text-decoration:none;background:none;border:0;border-bottom:1px solid var(--border);text-align:left;cursor:pointer}.su-hd__sheet-body > a[aria-current=page]{color:var(--accent-text)}.su-hd__sub{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:8px 0 12px;border-bottom:1px solid var(--border)}.su-hd__sub a{display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 8px;border-radius:var(--radius-sm);font:400 14px/1.3 var(--font-ui);color:var(--text);text-decoration:none}.su-hd__sub a:active{background:var(--accent-subtle)}.su-hd__sheet-foot{padding:16px var(--margin) calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--border);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.su-hd--dark{background:var(--gray-800);color:var(--gray-50);border-bottom-color:var(--gray-700)}.su-hd--dark .su-hd__nav > a, .su-hd--dark .su-hd__nav > button, .su-hd--dark .su-hd__dd > button{color:var(--gray-300)}.su-hd--dark .su-hd__nav > a:hover, .su-hd--dark .su-hd__nav > a[aria-current=page], .su-hd--dark .su-hd__nav > button:hover{color:var(--gray-0)}/* ---------- components/layout/MobileContactBar.jsx ---------- */
.su-cb{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-bar);height:calc(var(--contact-bar-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.3fr);background:var(--surface);box-shadow:var(--shadow-bar)}@media(min-width:1024px){.su-cb{display:none}}.su-cb--static{position:static;box-shadow:none;border-top:var(--border-w-thin) solid var(--border)}.su-cb a, .su-cb button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:0;background:none;text-decoration:none;font:var(--fw-semibold) 12px/var(--lh-label) var(--font-ui);color:var(--text);cursor:pointer;-webkit-tap-highlight-color:transparent}.su-cb__call{color:var(--success)!important}.su-cb__zalo{color:var(--zalo-text)!important}.su-cb a:active, .su-cb button:active{background:var(--bg-subtle)}.su-cb__cta{background:var(--accent)!important;color:var(--text-on-accent)!important;font-size:14px!important;flex-direction:row!important;gap:8px!important}.su-cb__cta:active{background:var(--accent-hover)!important}/* ---------- components/overlay/Breadcrumb.jsx ---------- */
.su-bc{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font:400 13px/1.4 var(--font-ui);color:var(--text-3)}.su-bc a{color:var(--text-2);text-decoration:none;padding:6px 2px;min-height:32px;display:inline-flex;align-items:center}.su-bc a:hover{color:var(--accent-text)}.su-bc [aria-current]{color:var(--text);font-weight:500}.su-bc .sep{color:var(--border-strong)}.su-bc .code{font-family:var(--font-mono)}.su-bc a{min-height:36px}@media(max-width:599px){.su-bc--collapse li:not(:nth-last-child(-n+2)):not(:first-child){display:none}.su-bc--collapse li:nth-last-child(2):not(:nth-child(2))::before{content:"…";color:var(--text-3);margin-right:2px}}/* ---------- components/overlay/EmptyState.jsx ---------- */
.su-es{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:40px 24px;border:var(--border-w) dashed var(--border-strong);border-radius:var(--radius);color:var(--text)}.su-es__ic{width:56px;height:56px;display:grid;place-items:center;background:var(--accent-subtle);color:var(--accent-text);border-radius:var(--radius-pill)}.su-es__t{font:var(--fw-semibold) 18px/1.3 var(--font-ui)}.su-es__d{font:400 16px/1.5 var(--font-ui);color:var(--text-2);max-width:420px}.su-es__a{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:4px}/* ---------- components/overlay/FilterDrawer.jsx ---------- */
.su-fd{position:fixed;inset:0;z-index:var(--z-drawer);background:var(--overlay);display:flex;align-items:flex-end;animation:su-fade var(--dur) var(--ease)}@keyframes su-fade{from{opacity:0}to{opacity:1}}.su-fd__box{width:100%;max-height:88vh;display:flex;flex-direction:column;background:var(--surface);color:var(--text);border-radius:var(--radius-lg) var(--radius-lg) 0 0;animation:su-up var(--dur-slow) var(--ease)}@keyframes su-up{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}.su-fd__grip{width:40px;height:4px;border-radius:2px;background:var(--border-strong);margin:10px auto 0}.su-fd__hd{display:flex;align-items:center;justify-content:space-between;padding:8px 16px 12px;border-bottom:1px solid var(--border)}.su-fd__t{font:var(--fw-bold) 18px/1.25 var(--font-ui)}.su-fd__body{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:20px}.su-fd__sec > b{display:block;font:var(--fw-medium) 12px/var(--lh-label) var(--font-mono);text-transform:uppercase;letter-spacing:var(--ls-caps);color:var(--text-3);margin-bottom:10px}.su-fd__ft{display:grid;grid-template-columns:1fr 1.6fr;gap:8px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--border);box-shadow:var(--shadow-bar)}.su-fd--static{position:static;background:none;animation:none}.su-fd--static .su-fd__box{animation:none;border:1px solid var(--border);border-radius:var(--radius-lg);max-height:none}.su-btn.su-fd__trigger{display:inline-flex}@media(min-width:1024px){.su-btn.su-fd__trigger{display:none}}/* ---------- components/overlay/Modal.jsx ---------- */
.su-md{position:fixed;inset:0;z-index:var(--z-overlay);background:var(--overlay);display:flex;align-items:flex-end;justify-content:center;animation:su-fade var(--dur) var(--ease)}@media(min-width:600px){.su-md{align-items:center;padding:24px}}@keyframes su-fade{from{opacity:0}to{opacity:1}}.su-md__box{width:100%;max-width:var(--w,560px);max-height:100%;display:flex;flex-direction:column;background:var(--surface);color:var(--text);border-radius:var(--radius-lg) var(--radius-lg) 0 0;box-shadow:var(--shadow-2);animation:su-up var(--dur-slow) var(--ease)}@media(min-width:600px){.su-md__box{border-radius:var(--radius-lg)}}@keyframes su-up{from{transform:translateY(var(--enter-y));opacity:0}to{transform:none;opacity:1}}.su-md__hd{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 20px 0}.su-md__t{font:var(--fw-bold) 20px/1.25 var(--font-ui)}.su-md__s{font:400 15px/1.5 var(--font-ui);color:var(--text-2);margin-top:4px}.su-md__body{padding:16px 20px 20px;overflow:auto}.su-md__ft{display:flex;gap:8px;justify-content:flex-end;padding:0 20px 20px;flex-wrap:wrap}.su-md__ft > *{flex:1 1 auto}@media(min-width:600px){.su-md__ft > *{flex:0 0 auto}}.su-md--static{position:static;background:none;animation:none;padding:0}.su-md--static .su-md__box{animation:none;border:1px solid var(--border);box-shadow:none;border-radius:var(--radius-lg)}/* ---------- components/overlay/Pagination.jsx ---------- */
.su-pg{display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap}.su-pg button{min-width:var(--touch-min);height:var(--touch-min);padding:0 10px;display:inline-flex;align-items:center;justify-content:center;gap:4px;border:var(--border-w) solid transparent;border-radius:var(--radius-sm);background:none;color:var(--text-2);font:var(--fw-medium) 14px/var(--lh-label) var(--font-mono);cursor:pointer;transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease)}.su-pg button:hover{border-color:var(--border-strong);color:var(--text)}.su-pg button[aria-current=page]{background:var(--primary);border-color:var(--primary);color:var(--primary-text)}.su-pg button:active{transform:translateY(1px)}.su-pg button[disabled]{opacity:.4;cursor:not-allowed;pointer-events:none}.su-pg .gap{color:var(--text-3);padding:0 4px}.su-pg__info{font:400 13px/var(--lh-label) var(--font-ui);color:var(--text-3);margin:0 8px}@media(max-width:599px){.su-pg__info{display:none}}.su-pg--simple button{font-family:var(--font-ui)}/* ---------- components/overlay/Toast.jsx ---------- */
.su-ts-host{position:fixed;left:16px;right:16px;bottom:calc(var(--contact-bar-h) + 12px);z-index:var(--z-toast);display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}@media(min-width:1024px){.su-ts-host{left:auto;right:24px;bottom:24px;align-items:flex-end}}.su-ts{pointer-events:auto;display:flex;align-items:flex-start;gap:12px;width:100%;max-width:420px;padding:12px 14px;background:var(--gray-800);color:var(--gray-50);border-radius:var(--radius);box-shadow:var(--shadow-2);font:400 15px/1.45 var(--font-ui);animation:su-ts-in var(--dur-slow) var(--ease)}@keyframes su-ts-in{from{opacity:0;transform:translateY(var(--enter-y))}to{opacity:1;transform:none}}.su-ts__ic{flex:none;margin-top:1px}.su-ts--success .su-ts__ic{color:var(--green-300)}.su-ts--warning .su-ts__ic{color:var(--orange-300)}.su-ts--danger .su-ts__ic{color:var(--red-300)}.su-ts--info .su-ts__ic{color:var(--accent)}.su-ts__t{flex:1}.su-ts__t b{display:block;font-weight:600}.su-ts__a{background:none;border:0;color:var(--accent);font:600 14px/var(--lh-label) var(--font-ui);cursor:pointer;padding:4px 0;white-space:nowrap}.su-ts__x{background:none;border:0;color:var(--gray-400);cursor:pointer;padding:0;width:36px;height:36px;display:grid;place-items:center;margin:-8px -10px -8px 0;border-radius:6px}[data-theme=dark] .su-ts{background:var(--gray-700)}.su-ts__x:hover{color:var(--gray-0)}.su-ts--static{animation:none}/* ---------- components/trust/CaseStudyCard.jsx ---------- */
.su-case{display:grid;gap:0;background:var(--surface);border:var(--border-w-thin) solid var(--border);border-radius:var(--radius-lg);overflow:hidden;color:var(--text)}@media(min-width:900px){.su-case{grid-template-columns:1.1fr 1fr}}.su-case__media{position:relative;aspect-ratio:4/3;background:var(--bg-subtle);overflow:hidden}@media(min-width:900px){.su-case__media{aspect-ratio:auto;min-height:100%}}.su-case__media img{width:100%;height:100%;object-fit:cover;object-position:left top}.su-case__media[data-hue=sage]{background:var(--tint-sage)}.su-case__media[data-hue=peri]{background:var(--tint-peri)}.su-case__media[data-hue=peach]{background:var(--tint-peach)}.su-case__media[data-hue=amber]{background:var(--amber-100)}.su-case__ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--text-3);font:400 13px/1.4 var(--font-ui);text-align:center;padding:24px}.su-case__ph .ic{display:block;margin:0 auto 8px;opacity:.6}.su-case__tag{position:absolute;top:12px;left:12px;font:var(--fw-medium) 11px/var(--lh-label) var(--font-mono);letter-spacing:var(--ls-caps);text-transform:uppercase;padding:6px 10px;border-radius:var(--radius-pill);background:var(--surface);color:var(--text-2);border:var(--border-w-thin) solid var(--border)}.su-case__body{display:flex;flex-direction:column;gap:20px;padding:24px}@media(min-width:900px){.su-case__body{padding:32px}}.su-case__k{font:500 12px/var(--lh-label) var(--font-mono);color:var(--accent-text);text-transform:uppercase;letter-spacing:var(--ls-caps)}.su-case__t{font:var(--fw-bold) var(--text-h4)/var(--lh-heading) var(--font-ui);letter-spacing:var(--ls-heading);margin:8px 0 0}.su-case__res{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:16px}@media(max-width:1199px){.su-case__res{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}}.su-case__res > div{padding-left:14px;border-left:var(--bar-w) solid var(--accent)}.su-case__res b{display:block;font:var(--fw-semibold) var(--fs-3)/var(--lh-label) var(--font-mono);letter-spacing:var(--ls-price);white-space:nowrap}@media(max-width:1199px){.su-case__res b{font-size:var(--fs-2)}}.su-case__res span{display:block;font:400 13px/1.35 var(--font-ui);color:var(--text-2);margin-top:4px}.su-case__q{margin:0;font:400 16px/1.55 var(--font-ui);color:var(--text)}.su-case__q::before{content:"“"}.su-case__q::after{content:"”"}.su-case__who{display:flex;align-items:center;gap:12px;font:400 14px/1.3 var(--font-ui);color:var(--text-2)}.su-case__av{width:40px;height:40px;border-radius:var(--radius-pill);overflow:hidden;display:grid;place-items:center;background:var(--surface-inverse);color:var(--text-inverse);font:var(--fw-semibold) 14px/var(--lh-label) var(--font-ui);flex:none}.su-case__av img{width:100%;height:100%;object-fit:cover}.su-case__who b{display:block;color:var(--text);font-weight:600}.su-case__acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto}/* ---------- components/trust/ClientStrip.jsx ---------- */
.su-cs{display:grid;gap:12px;grid-template-columns:repeat(2,1fr)}@media(min-width:600px){.su-cs{grid-template-columns:repeat(4,1fr)}}@media(min-width:1024px){.su-cs{grid-template-columns:repeat(var(--n,8),1fr)}}.su-cs__it{display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:var(--radius);background:var(--surface);border:var(--border-w-thin) solid var(--border);color:var(--text);text-decoration:none;transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}.su-cs__it:hover{border-color:var(--text);transform:translateY(-2px)}.su-cs__img{aspect-ratio:4/3;border-radius:var(--radius-sm);overflow:hidden;background:var(--bg-subtle);display:grid;place-items:center;font:var(--fw-semibold) 18px/var(--lh-label) var(--font-ui);color:var(--text-3)}.su-cs__img img{width:100%;height:100%;object-fit:cover;object-position:top}.su-cs__img[data-hue=sage]{background:var(--tint-sage);color:var(--tint-sage-text)}.su-cs__img[data-hue=peri]{background:var(--tint-peri);color:var(--tint-peri-text)}.su-cs__img[data-hue=peach]{background:var(--tint-peach);color:var(--tint-peach-text)}.su-cs__img[data-hue=amber]{background:var(--amber-100);color:var(--amber-800)}.su-cs__n{font:var(--fw-semibold) 13px/1.3 var(--font-ui);display:flex;align-items:center;gap:4px;justify-content:space-between}.su-cs__n .ic{color:var(--text-3);flex:none}.su-cs__it:hover .su-cs__n .ic{color:var(--text)}.su-cs__m{font:400 12px/1.3 var(--font-ui);color:var(--text-3);margin-top:-6px}/* ---------- components/trust/DocumentRow.jsx ---------- */
.su-doc{display:grid;gap:12px;grid-template-columns:1fr}@media(min-width:600px){.su-doc{grid-template-columns:1fr 1fr}}@media(min-width:1024px){.su-doc{grid-template-columns:repeat(var(--n,4),1fr)}}.su-doc__it{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:var(--radius-lg);background:var(--surface);border:var(--border-w-thin) solid var(--border);color:var(--text);text-decoration:none;transition:border-color var(--dur) var(--ease)}.su-doc__it:hover{border-color:var(--text)}.su-doc__ic{width:44px;height:44px;flex:none;display:grid;place-items:center;border-radius:var(--radius-sm);background:var(--accent-subtle);color:var(--accent-text)}.su-doc__t{font:var(--fw-semibold) 15px/1.3 var(--font-ui)}.su-doc__d{font:400 13px/1.45 var(--font-ui);color:var(--text-2);margin-top:4px}.su-doc__a{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font:var(--fw-medium) 13px/var(--lh-label) var(--font-ui);color:var(--accent-text)}.su-doc__it:hover .su-doc__a{text-decoration:underline;text-underline-offset:3px}/* ---------- components/trust/TrustRow.jsx ---------- */
.su-tr{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;color:var(--text-2);font:400 15px/1.4 var(--font-ui)}.su-tr__avs{display:flex;align-items:center}.su-tr__avs span{width:32px;height:32px;border-radius:var(--radius-pill);border:2px solid var(--nen);margin-left:-8px;display:grid;place-items:center;overflow:hidden;background:var(--surface-inverse);color:var(--text-inverse);font:var(--fw-semibold) 12px/var(--lh-label) var(--font-ui)}.su-tr__avs span:first-child{margin-left:0}.su-tr__avs img{width:100%;height:100%;object-fit:cover}.su-tr__avs span[data-hue=sage]{background:var(--tint-sage);color:var(--tint-sage-text)}.su-tr__avs span[data-hue=peri]{background:var(--tint-peri);color:var(--tint-peri-text)}.su-tr__avs span[data-hue=peach]{background:var(--tint-peach);color:var(--tint-peach-text)}.su-tr__avs span[data-hue=amber]{background:var(--amber-100);color:var(--amber-800)}.su-tr__stars{display:flex;gap:1px;color:var(--accent)}.su-tr b{color:var(--text);font-weight:600}.su-tr__i{display:flex;align-items:center;gap:8px}.su-tr__i .ic{color:var(--accent-text)}.su-tr--inverse{color:var(--gray-300)}.su-tr--inverse b{color:var(--gray-0)}.su-tr--inverse .su-tr__avs span{border-color:var(--gray-800)}.su-tr--inverse .su-tr__i .ic{color:var(--accent)}