/* SunlandSG foundation: reset, tokens, typography, containers and form/image primitives. */
html { font-family: sans-serif; text-size-adjust: 100%; }

body { margin: 0px; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

[hidden], template { display: none; }

a { background-color: transparent; }

a:active, a:hover { outline: 0px; }

b, strong { font-weight: 700; }

h1 { font-size: 2em; margin: 0.67em 0px; }

img { border: 0px; }

svg:not(:root) { overflow: hidden; }

button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0px; }

button { overflow: visible; }

button, select { text-transform: none; }

button, html input[type="button"], input[type="reset"], input[type="submit"] { appearance: button; cursor: pointer; }

input { line-height: normal; }

input[type="search"] { appearance: textfield; box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { appearance: none; }

textarea { overflow: auto; }

@media print{
*, ::after, ::before { color: rgb(0, 0, 0) !important; text-shadow: none !important; background: 0px 0px !important; box-shadow: none !important; }
a, a:visited { text-decoration: underline; }
a[href]::after { content: " (" attr(href) ")"; }
a[href^="#"]::after, a[href^="javascript:"]::after { content: ""; }
img, tr { break-inside: avoid; }
img { max-width: 100% !important; }
h2, h3, p { orphans: 3; widows: 3; }
h2, h3 { break-after: avoid; }
}

@font-face { font-family: "Glyphicons Halflings"; src: url("../fonts/72d61a640d-glyphicons-halflings-regular.woff2") format("woff2"), url("../fonts/b6f57c6107-glyphicons-halflings-regular.woff") format("woff"), url("../fonts/61697beacf-glyphicons-halflings-regular.ttf") format("truetype"); }

* { box-sizing: border-box; }

html { font-size: 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; line-height: 1.42857; color: rgb(51, 51, 51); background-color: rgb(255, 255, 255); }

button, input, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; }

a { color: rgb(51, 122, 183); text-decoration: none; }

a:focus, a:hover { color: rgb(35, 82, 124); text-decoration: underline; }

a:focus { outline: -webkit-focus-ring-color auto 5px; outline-offset: -2px; }

img { vertical-align: middle; }

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { font-family: inherit; font-weight: 500; line-height: 1.28; color: inherit; }

.h1, .h2, .h3, h1, h2, h3 { margin-top: 20px; margin-bottom: 10px; }

.h1, h1 { font-size: 36px; }

.h2, h2 { font-size: 30px; }

.h3, h3 { font-size: 24px; }

p { margin: 0px 0px 10px; }

ol, ul { margin-top: 0px; margin-bottom: 10px; }

ol ol, ol ul, ul ol, ul ul { margin-bottom: 0px; }

label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: 700; }

input[type="search"] { box-sizing: border-box; appearance: none; }

@-webkit-keyframes progress-bar-stripes {
  0% { background-position: 40px 0px; }
  100% { background-position: 0px 0px; }
}

@keyframes progress-bar-stripes {
  0% { background-position: 40px 0px; }
  100% { background-position: 0px 0px; }
}

/* GO4AI-owned interface icons. SVG masks avoid opaque third-party icon fonts. */
.go4ai-icon {
	display: inline-block;
	width: 1em;
	height: 1em;
	background-color: currentColor;
	-webkit-mask-image: var(--go4ai-icon);
	mask-image: var(--go4ai-icon);
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	vertical-align: -.125em;
}

.go4ai-icon--chevron-left { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.4' d='m15 18-6-6 6-6'/%3E%3C/svg%3E"); }
.go4ai-icon--chevron-right { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.4' d='m9 18 6-6-6-6'/%3E%3C/svg%3E"); }
.go4ai-icon--chevron-down { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.4' d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
.go4ai-icon--facebook { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14 8h3V4h-3c-3.3 0-5 2-5 5v2H6v4h3v7h4v-7h3.2l.8-4h-4V9c0-.7.3-1 1-1Z'/%3E%3C/svg%3E"); }
.go4ai-icon--instagram { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3C/g%3E%3Ccircle fill='black' cx='17.5' cy='6.5' r='1.2'/%3E%3C/svg%3E"); }
.go4ai-icon--linkedin { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 3.5A2.5 2.5 0 1 1 5 8a2.5 2.5 0 0 1 0-4.5ZM3 9h4v12H3V9Zm6.5 0h3.8v1.7h.1c.8-1.3 2.2-2.1 3.8-2.1 4 0 4.8 2.7 4.8 6.1V21h-4v-5.6c0-1.3 0-3.1-1.9-3.1s-2.2 1.5-2.2 3V21h-4.4V9Z'/%3E%3C/svg%3E"); }
.go4ai-icon--tiktok { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14 3h3c.2 2 1.4 3.4 4 4v3a9 9 0 0 1-4-1.3v6.8a6 6 0 1 1-6-6c.4 0 .7 0 1 .1v3.2a3 3 0 1 0 2 2.7V3Z'/%3E%3C/svg%3E"); }
.go4ai-icon--globe { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c3 3 3 15 0 18M12 3c-3 3-3 15 0 18'/%3E%3C/g%3E%3C/svg%3E"); }
.go4ai-icon--mail { --go4ai-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-linejoin='round' stroke-width='2'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/g%3E%3C/svg%3E"); }

@keyframes splide-loading {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(1turn); }
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, tt, var, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0px; padding: 0px; border: 0px; font: inherit; vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

area, img, map { outline: none; }

html { box-sizing: border-box; }

*, ::before, ::after { box-sizing: inherit; }

html, body { text-size-adjust: none; }

input, textarea, button, select { border-radius: 0px; font-family: inherit; }

textarea { resize: vertical; }

a { outline: none; }

.slick-slider, .slick-slider *, .slick-slider a, input:focus, select:focus, textarea:focus { color: inherit; text-decoration: none; }

a:focus { color: inherit; }

#content, aside { line-height: 1.7; }

#content h4, aside h4, #content p, aside p, #content blockquote, aside blockquote, #content ul, aside ul, #content fieldset, aside fieldset, #content form, aside form, #content ol, aside ol, #content dl, aside dl, #content dir, aside dir, #content menu, aside menu { margin: 1.12em 0px; line-height: 1.7; }

#content ol, aside ol, #content ul, aside ul, #content dir, aside dir, #content menu, aside menu, #content dd, aside dd { margin-left: 40px; }

#content ol ul, aside ol ul, #content ul ol, aside ul ol, #content ul ul, aside ul ul, #content ol ol, aside ol ol { margin-top: 0px; margin-bottom: 0px; }

#content ul, aside ul { list-style-type: disc; }

aside { float: right; width: 20.83%; }

body { font-family: Arial, Helvetica, Georgia, sans-serif; font-size: 12px; background: rgb(255, 255, 255); color: rgb(0, 0, 0); margin: 0px; }

a { outline: none; color: inherit; }

a:link, a:visited { text-decoration: none; }

a:hover { }

#content h4, aside h4, #content p, aside p, #content blockquote, aside blockquote, #content ul, aside ul, #content fieldset, aside fieldset, #content form, aside form, #content ol, aside ol, #content dl, aside dl, #content dir, aside dir, #content menu, aside menu { line-height: 1.7; }

@font-face { font-family: sunlandsg-font; src: url("../fonts/f587776f34-sunlandsg-font10ca.ttf") format("truetype"), url("../fonts/eae36cb9b5-sunlandsg-font10ca.woff") format("woff"); font-weight: normal; font-style: normal; }

body { font-family: var(--sl-font-body); font-size: 16px; background: right center / contain no-repeat fixed rgb(255, 255, 255); color: rgb(51, 51, 51); margin: 0px; -webkit-font-smoothing: antialiased; }

a:hover, a:focus, a:visited { color: rgb(3, 34, 65); }

figure { margin: 1em 40px; }

figure { margin: 0px; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0px; }

fieldset { border: 1px solid silver; margin: 0px 2px; padding: 0.35em 0.625em 0.75em; }

legend { border: 0px; padding: 0px; }

fieldset { min-width: 0px; padding: 0px; margin: 0px; border: 0px; }

legend { display: block; width: 100%; padding: 0px; margin-bottom: 20px; font-size: 21px; line-height: inherit; color: rgb(51, 51, 51); border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(229, 229, 229); border-image: none; }

input[type="checkbox"], input[type="radio"] { margin: 4px 0px 0px; line-height: normal; }

input[type="range"] { display: block; width: 100%; }

input[type="checkbox"]:focus, input[type="file"]:focus, input[type="radio"]:focus { outline: -webkit-focus-ring-color auto 5px; outline-offset: -2px; }

dl { margin-top: 0px; margin-bottom: 20px; }

dd, dt { line-height: 1.42857; }

dt { font-weight: 700; }

dd { margin-left: 0px; }

.sunland-visually-hidden-title { display: none !important; font-size: 18px !important; }

.sunland-heading-font { font-family: var(--sl-font-heading) !important; }

:root {
    --sl-header-height: 88px;
    --sl-content-width: 1320px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.sunland-site { margin: 0; min-width: 320px; }
body.sunland-menu-open { overflow: hidden; }
img { max-width: 100%; }

:root { --sl-teal: #00bfb3; --sl-teal-dark: #004d4a; --sl-teal-mid: #007d7a; --sl-teal-rgb: 0, 191, 179; --sl-teal-dark-rgb: 0, 77, 74; --sl-teal-mid-rgb: 0, 125, 122; --sl-teal-soft: #e6fffc; --sl-gold: #e2af81; --sl-gold-light: #e2af81; --sl-gold-dark: #9f6723; --sl-black: #111111; --sl-white: #ffffff; --sl-cream: #fff7e6; --sl-gray-bg: #f4f6f5; --sl-gray-border: #d9e7e5; --sl-gray-text: #5f6666; --color-bg: var(--sl-gray-bg); --color-surface: var(--sl-white); --color-text: var(--sl-black); --color-heading: var(--sl-teal-dark); --color-border: var(--sl-gray-border); --color-primary: var(--sl-teal-dark); --color-primary-hover: var(--sl-teal-mid); --color-accent: var(--sl-gold); }

body { background-color: var(--sl-gray-bg) !important; color: var(--sl-black); }

h1, h2, h3, h4, h5, h6, .title-default, .entry-title, .ip-global-heading { color: var(--sl-teal-dark); }

a { color: var(--sl-teal-mid); }

a:hover, a:focus { color: var(--sl-gold-dark); }

/* Hero CTA (#sunland-hero .slideshow-link a) cố tình KHÔNG nằm trong nhóm này:
   quy chuẩn dùng nút viền trắng nền tối mờ, xem "HERO — QUY CHUẨN GO4AI/SUNLANDSG" trong home.css. */
.global-link a, .global-link input, .btn-primary, .button-primary, .wp-block-button__link, input[type="submit"], button[type="submit"] { background: var(--sl-gold) !important; border-color: var(--sl-gold) !important; color: var(--sl-black) !important; }

.global-link a:hover, .global-link input:hover, .btn-primary:hover, .button-primary:hover, .wp-block-button__link:hover, input[type="submit"]:hover, button[type="submit"]:hover { background: var(--sl-gold-light) !important; border-color: var(--sl-gold-light) !important; color: var(--sl-black) !important; }

input[type="text"], input[type="email"], input[type="tel"], input[type="search"], input[type="url"], select, textarea { background: var(--sl-white) !important; color: var(--sl-black) !important; border-color: var(--sl-gray-border) !important; }

input:focus, select:focus, textarea:focus { outline: none; box-shadow: 0 0 0 3px rgba(var(--sl-teal-mid-rgb), .16); border-color: var(--sl-teal-mid) !important; }

/*
 * SunlandSG Design System
 * Loaded after legacy theme styles so the visual migration remains reversible.
 */
:root {
    --sl-teal: #00bfb3;
    --sl-teal-dark: #004d4a;
    --sl-teal-mid: #007d7a;
    --sl-teal-rgb: 0, 191, 179;
    --sl-teal-dark-rgb: 0, 77, 74;
    --sl-teal-mid-rgb: 0, 125, 122;
    --sl-teal-soft: #e6fffc;
    --sl-gold: #e2af81;
    --sl-gold-light: #e2af81;
    --sl-gold-dark: #9f6723;
    --sl-black: #111111;
    --sl-white: #ffffff;
    --sl-cream: #fff7e6;
    --sl-gray-bg: #f4f6f5;
    --sl-gray-border: #d9e7e5;
    --sl-gray-text: #5f6666;

    --color-bg: var(--sl-gray-bg);
    --color-surface: var(--sl-white);
    --color-text: var(--sl-black);
    --color-heading: var(--sl-teal-dark);
    --color-border: var(--sl-gray-border);
    --color-primary: var(--sl-teal-dark);
    --color-primary-hover: var(--sl-teal-mid);
    --color-accent: var(--sl-gold);
}

body {
    background-color: var(--sl-gray-bg) !important;
    color: var(--sl-black);
}

/* Keep the off-canvas menu outside the viewport without widening the page. */
.sunlandsg-sidenav-wrapper {
    right: 0 !important;
    max-width: 100vw;
    transform: translateX(100%);
}

.sunlandsg-sidenav-wrapper.show-sidenav-wrapper {
    transform: translateX(0);
}

::selection {
    background: var(--sl-gold-light);
    color: var(--sl-black);
}

h1, h2, h3, h4, h5, h6,
.title-default,
.entry-title,
.ip-global-heading {
    color: var(--sl-teal-dark);
}

a { color: var(--sl-teal-mid); }
a:hover, a:focus { color: var(--sl-gold-dark); }

/* CTA: gold is reserved for prominent actions and large accents. */
.global-link a,
.global-link input,
.btn-primary,
.button-primary,
.wp-block-button__link,
input[type="submit"],
button[type="submit"] {
    background: var(--sl-gold) !important;
    border-color: var(--sl-gold) !important;
    color: var(--sl-black) !important;
}

.global-link a:hover,
.global-link input:hover,
.btn-primary:hover,
.button-primary:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
    background: var(--sl-gold-light) !important;
    border-color: var(--sl-gold-light) !important;
    color: var(--sl-black) !important;
}

.secondary-button,
.btn-secondary,
.button-secondary {
    background: var(--sl-teal-dark) !important;
    border-color: var(--sl-teal-dark) !important;
    color: var(--sl-white) !important;
}

.secondary-button:hover,
.btn-secondary:hover,
.button-secondary:hover {
    background: var(--sl-teal-mid) !important;
    border-color: var(--sl-teal-mid) !important;
    color: var(--sl-white) !important;
}

/* Forms. */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="url"],
select,
textarea {
    background: var(--sl-white) !important;
    color: var(--sl-black) !important;
    border-color: var(--sl-gray-border) !important;
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: var(--sl-teal-mid) !important;
    box-shadow: 0 0 0 3px rgba(var(--sl-teal-mid-rgb), .16);
}

::placeholder { color: var(--sl-gray-text); opacity: .86; }

.wpcf7-not-valid-tip,
.form-error,
.error-message { color: #b42318 !important; }

.form-success,
.success-message,
.wpcf7 form.sent .wpcf7-response-output { color: #067647 !important; }

:root {
	--sl-font-heading: "Be Vietnam Pro", sans-serif;
	--sl-font-body: "Inter", sans-serif;
}

body,
p,
li,
td,
th,
form,
input,
select,
textarea,
button,
nav,
nav a,
.navigation,
.menu,
.menu a,
.meta,
.entry-meta {
	font-family: var(--sl-font-body) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.title-default,
.ip-global-heading {
	font-family: var(--sl-font-heading) !important;
}


.sunland-template { position: relative; min-height: 50vh; }
.sunland-template main { display: block; }
.sunland-template [style*="background-image"] { background-size: cover; background-position: center; }
.sunland-template canvas { max-width: 100%; }