/*
Theme Name: SEO Stack
Theme URI: https://seostack.com.vn
Description: SEO Stack Child Theme for Flatsome - Dark Gold luxury layout.
Author: SEO Stack
Template: flatsome
Version: 1.0.0
Text Domain: huydev
*/

@media screen{

/*
* ROOT VARIABLES.
*/
:root{
    --th-gold-100: #FFF8E1;
    --th-gold-300: #FCE082;
    --th-gold-400: #FACC15;
    --th-gold-500: #D4AF37;
    --th-gold-600: #B8860B;
    --th-gold-700: #996515;
    --th-base: #0B0C10;
    --th-card: #12141C;
    --th-border: #232734;
    --th-lighter: #1A1D27;
    --th-text: #E5E7EB;
    --th-text-2: #D1D5DB;
    --th-muted: #9CA3AF;
    --th-green: #22C55E;
    --th-blue: #3B82F6;
    --th-purple: #A855F7;
    --th-orange: #F59E0B;
    --th-red: #EF4444;
    --th-yellow: #FACC15;
    --th-gold-bg-10: rgba(212, 175, 55, 0.1);
    --th-gold-bd-30: rgba(212, 175, 55, 0.3);
    --th-shadow-glow: 0px 0px 25px rgba(212, 175, 55, 0.25);
    --th-shadow-sm: 0px 0px 10px rgba(212, 175, 55, 0.2);
    --th-shadow-lg: 0px 0px 40px rgba(212, 175, 55, 0.35);
    --th-font: 'Plus Jakarta Sans', sans-serif;
    --th-font-tf: 'Playfair Display', serif;
}

/*
* BASE.
*/
*,
*:before,
*:after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
html::-webkit-scrollbar{ width: 6px; }
html::-webkit-scrollbar-track{ background: var(--th-base); }
html::-webkit-scrollbar-thumb{ background: var(--th-gold-500); border-radius: 4px; }
body{ margin: 0px; background: var(--th-base); color: var(--th-text); font-family: var(--th-font); font-size: 18px; line-height: 1.5; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
::selection{ background: var(--th-gold-500); color: #000; }
a{ color: inherit; text-decoration: none; transition: all 0.3s; }
img{ max-width: 100%; height: auto; border: 0px; }
ul,
ol{ margin: 0px; padding: 0px; list-style: none; }
h1,
h2,
h3,
h4,
h5,
p{ margin: 0px; }
body.seostack{ font-family: var(--th-font) !important; }
body.seostack h1,
body.seostack h2,
body.seostack h3,
body.seostack h4,
body.seostack h5,
body.seostack h6,
body.seostack .tf{ font-family: var(--th-font-tf) !important; }
button,
input,
select,
textarea{ font-family: inherit; }
button{ cursor: pointer; }
strong{ font-weight: 700; }

/*
* UTILITY.
*/
.fleft{ float: left; }
.fright{ float: right; }
.cboth{ clear: both; }
.bsize{ box-sizing: border-box; }
.center{ text-align: center; }
.container{ width: 1400px; margin: 0px auto; position: relative; }
.tf{ font-family: var(--th-font-tf); }
.thumb-cover{ display: block; background-size: cover; background-position: center; background-repeat: no-repeat; }
.thumb-zoom{ overflow: hidden; }
.empty-content{ text-align: center; color: var(--th-muted); padding: 40px 0px; }
.screen-reader-text{ position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
.gold-text{ background: linear-gradient(135deg, #FFF1B0 0%, #D4AF37 50%, #996515 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.gold-bg{ background: linear-gradient(135deg, #FCE082 0%, #D4AF37 50%, #B8860B 100%); }

/* Column grid: parent has negative margin, item uses calc width. */
.col-grid{ margin-right: -30px; margin-bottom: -30px; }
.col-grid .col-item{ float: left; margin-right: 30px; margin-bottom: 30px; }
.col-2 > .col-item{ width: calc(50% - 30px); }
.col-3 > .col-item{ width: calc(33.3333% - 30px); }
.col-4 > .col-item{ width: calc(25% - 30px); }
.col-5 > .col-item{ width: calc(20% - 30px); }

/* Buttons. */
.btn-gold,
.btn-outline{ display: inline-block; padding: 0px 20px; line-height: 40px; border-radius: 12px; font-size: 15px; font-weight: 700; text-align: center; border: 0px; cursor: pointer; transition: all 0.3s; }
.btn-gold{ background: linear-gradient(135deg, #FCE082 0%, #D4AF37 50%, #B8860B 100%); color: #000; font-weight: 800; }
.btn-gold:hover{ box-shadow: var(--th-shadow-glow); transform: translateY(-2px); }
.btn-outline{ background: rgba(18, 20, 28, 0.6); border: 1px solid var(--th-border); color: #fff; font-weight: 600; }
.btn-outline:hover{ border-color: rgba(212, 175, 55, 0.5); color: var(--th-gold-400); }
.btn-lg{ padding: 0px 32px; line-height: 56px; font-size: 18px; }
.btn-lg i{ margin-right: 12px; }
.btn-sm{ padding: 0px 24px; line-height: 44px; font-size: 13px; border-radius: 12px; }
.header-cta .btn-gold{ border-radius: 999px; padding: 0px 22px; }

/* Icon box. */
.icon-box{ width: 56px; height: 56px; border-radius: 16px; background: var(--th-gold-bg-10); border: 1px solid var(--th-gold-bd-30); color: var(--th-gold-400); font-size: 26px; line-height: 54px; text-align: center; transition: all 0.3s; }
.icon-box-md{ width: 48px; height: 48px; border-radius: 12px; font-size: 20px; line-height: 46px; }
.icon-box-sm{ width: 40px; height: 40px; border-radius: 8px; font-size: 18px; line-height: 38px; border: 0px; }

/*
* HEADER.
*/
.admin-bar .header{ top: 32px; }
.header{ position: fixed; top: 0px; left: 0px; width: 100%; z-index: 50; padding: 16px 0px; background: rgba(18, 20, 28, 0.75); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid var(--th-border); }
.header-logo{ display: block; }
.header-logo img{ display: block; width: auto; height: 44px; }
.header .container{ position: relative; }
.header-nav{ position: absolute; top: 0px; left: 50%; width: -webkit-max-content; width: max-content; white-space: nowrap; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.header-nav li{ float: left; margin: 0px 16px; }
.header-nav a{ display: block; line-height: 40px; font-size: 15px; font-weight: 500; color: var(--th-text-2); }
.header-nav a:hover,
.header-nav li.current > a{ color: var(--th-gold-400); }
.header-nav li{ position: relative; }
.header-nav li.current > a{ box-shadow: 0px 2px 0px var(--th-gold-400); }
.header-nav li > a i{ margin-left: 4px; font-size: 10px; }
.header-sub{ display: none; position: absolute; top: 100%; left: -16px; min-width: 240px; padding: 8px; border-radius: 12px; background: var(--th-card); border: 1px solid var(--th-border); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.5); }
.header-nav li.has-sub:hover .header-sub{ display: block; }
.header-nav .header-sub li{ float: none; margin: 0px; }
.header-nav .header-sub a{ padding: 0px 14px; line-height: 38px; border-radius: 8px; box-shadow: none; }
.header-nav .header-sub a:hover{ background: var(--th-gold-bg-10); }
.header-toggle{ display: none; background: none; border: 0px; padding: 0px 8px; line-height: 40px; font-size: 26px; color: var(--th-text-2); }
.header-toggle:hover{ color: var(--th-gold-400); }
.header-mobile{ display: none; margin-top: 16px; padding: 24px 0px; background: var(--th-card); border-top: 1px solid var(--th-border); }
.header-mobile li a{ display: block; padding: 10px 0px; font-size: 18px; font-weight: 500; color: var(--th-text-2); }
.header-mobile li a:hover{ color: var(--th-gold-400); }
.header-mobile-cta{ display: block; margin-top: 16px; }

/*
* BLOCK HERO.
*/
.block-hero{ position: relative; width: 100%; padding: 150px 0px 70px; overflow: hidden; background-color: var(--th-base); background-size: cover; background-position: center; }
.hero-bg{ position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: linear-gradient(90deg, rgba(11, 12, 16, 0.9) 0%, rgba(11, 12, 16, 0.5) 100%); }
.hero-bg svg{ position: absolute; right: 0px; bottom: 0px; width: 52%; height: 85%; opacity: 0.5; }
.block-hero .container{ z-index: 10; }
.hero-left{ width: calc(50% - 20px); padding-top: 40px; }
.hero-right{ width: calc(50% - 20px); }
.hero-badge{ display: inline-block; margin-bottom: 22px; color: var(--th-gold-400); font-size: 15px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.hero-badge-dot{ display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--th-gold-400); animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; }
.hero-title{ margin-bottom: 16px; font-size: 58px; font-weight: 800; line-height: 1.1; letter-spacing: -0.03em; color: #fff; }
.hero-title span{ display: block; }
.hero-desc{ max-width: 520px; margin-bottom: 32px; font-size: 20px; line-height: 1.6; color: var(--th-text-2); }
.hero-form{ position: relative; max-width: 640px; padding: 6px; border-radius: 16px; background: rgba(18, 20, 28, 0.85); border: 1px solid var(--th-border); transition: border-color 0.3s; }
.hero-form:focus-within{ border-color: var(--th-gold-500); }
.hero-form-icon{ position: absolute; top: 50%; left: 20px; margin-top: -8px; font-size: 15px; color: var(--th-muted); }
.hero-form input{ float: left; width: calc(100% - 170px); height: 48px; padding: 0px 16px 0px 44px; background: transparent; border: 0px; color: #fff; font-size: 14px; outline: none; }
.hero-form .btn-gold{ float: right; padding: 0px 22px; line-height: 48px; font-size: 15px; }
.hero-form .btn-gold i{ margin-right: 8px; }
.hero-checks{ margin-top: 16px; }
.hero-checks li{ display: inline-block; margin-right: 24px; font-size: 13px; color: var(--th-text-2); }
.hero-checks i{ margin-right: 6px; color: #22C55E; }
.hero-stats{ position: relative; margin-top: 56px; padding: 8px 0px; border-radius: 22px; background: linear-gradient(135deg, rgba(60, 48, 14, 0.55) 0%, rgba(18, 20, 28, 0.9) 45%, rgba(18, 20, 28, 0.9) 100%); border: 1px solid rgba(212, 175, 55, 0.45); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.hero-stat-item{ position: relative; float: left; width: 25%; padding: 22px 28px; transition: background 0.3s; }
.hero-stat-item + .hero-stat-item:before{ content: ""; position: absolute; top: 22px; bottom: 22px; left: 0px; width: 1px; background: linear-gradient(180deg, transparent, rgba(212, 175, 55, 0.4), transparent); }
.hero-stat-item:hover{ background: rgba(250, 204, 21, 0.05); }
.hero-stat-icon{ width: 56px; height: 56px; border-radius: 16px; font-size: 24px; line-height: 54px; background: linear-gradient(135deg, rgba(250, 204, 21, 0.2), rgba(212, 175, 55, 0.05)); transition: all 0.3s; }
.hero-stat-item:hover .hero-stat-icon{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; transform: rotate(-6deg) scale(1.05); }
.hero-stat-info{ margin-left: 72px; }
.hero-stat-number{ display: inline-block; font-size: 41px; font-weight: 900; line-height: 1.15; letter-spacing: -0.02em; }
.hero-stat-text{ margin-top: 2px; font-size: 14px; color: var(--th-text-2); }

/* Hero visual. */
.hero-visual{ position: relative; max-width: 560px; margin-left: auto; padding: 30px 30px 40px 0px; }
.hero-vcard{ position: relative; padding: 28px; border-radius: 24px; background: linear-gradient(160deg, rgba(30, 27, 16, 0.95), rgba(18, 20, 28, 0.95)); border: 1px solid rgba(250, 204, 21, 0.45); transition: box-shadow 0.4s; }
.hero-vcard:hover{ box-shadow: var(--th-shadow-lg); }
.hero-vcard-head{ font-size: 14px; font-weight: 600; color: var(--th-text-2); }
.hero-vcard-head em{ font-style: normal; font-size: 12px; color: var(--th-muted); }
.hero-vcard-number{ margin: 6px 0px 0px; font-size: 67px; font-weight: 900; line-height: 1.1; letter-spacing: -0.03em; }
.hero-vcard-chart{ display: block; width: 100%; height: 140px; margin-bottom: 18px; overflow: visible; }
.hero-vcard-line{ fill: none; stroke: var(--th-gold-400); stroke-width: 3; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.hero-vrank li{ padding: 10px 14px; margin-top: 8px; border-radius: 10px; background: rgba(11, 12, 16, 0.6); border: 1px solid var(--th-border); font-size: 14px; color: var(--th-text-2); }
.hero-vrank li i{ margin-right: 10px; font-size: 12px; color: var(--th-muted); }
.hero-vrank-pos{ padding: 0px 10px; border-radius: 6px; background: var(--th-gold-400); color: #000; font-size: 13px; font-weight: 800; }
.hero-chip{ position: absolute; padding: 10px 16px; border-radius: 999px; background: rgba(18, 20, 28, 0.95); border: 1px solid var(--th-gold-bd-30); box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.5); font-size: 13px; font-weight: 700; color: #fff; white-space: nowrap; animation: float-y 4s ease-in-out infinite; }
.hero-chip i{ margin-right: 8px; color: var(--th-gold-400); }
.hero-chip .dash-live-dot{ margin-right: 8px; }
.chip-top{ top: 0px; right: 0px; background: linear-gradient(135deg, #FCE082, #D4AF37); border: 0px; color: #000; }
.chip-top i{ color: #000; }
.chip-ai{ bottom: 70px; left: -30px; animation-delay: 1s; }
.chip-lead{ bottom: 0px; right: 20px; animation-delay: 2s; }
.chip-lead i{ color: var(--th-green); }

/*
* BLOCK DASHBOARD.
*/
:root{
    --th-green: #22C55E;
    --th-purple: #A855F7;
    --th-orange: #F59E0B;
    --th-blue: #38BDF8;
    --th-yellow: #FACC15;
}
.block-dashboard{ position: relative; padding: 0px 0px 80px; }
.dash-wrap{ padding: 24px; border-radius: 20px; background: linear-gradient(180deg, rgba(18, 20, 28, 0.95), rgba(11, 12, 16, 0.95)); border: 1px solid var(--th-gold-bd-30); }
.dash-head{ margin-bottom: 20px; }
.dash-title{ margin-right: 28px; font-size: 22px; font-weight: 800; line-height: 40px; color: #fff; }
.dash-title i{ margin-right: 10px; color: var(--th-green); }
.dash-live{ line-height: 40px; font-size: 13px; color: var(--th-muted); }
.dash-live strong{ margin: 0px 10px 0px 4px; color: var(--th-green); font-size: 14px; }
.dash-live em{ font-style: normal; font-size: 11px; }
.dash-live-dot{ display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--th-green); animation: ping 1.4s cubic-bezier(0, 0, 0.2, 1) infinite; }
.dash-report{ margin-left: 12px; padding: 0px 14px; border-radius: 8px; border: 1px solid var(--th-gold-bd-30); color: var(--th-gold-400); font-size: 12px; font-weight: 600; line-height: 38px; }
.dash-report:hover{ background: var(--th-gold-500); color: #000; }
.dash-report i{ margin-left: 6px; }
.dash-range{ padding: 0px 14px; border-radius: 8px; border: 1px solid var(--th-border); background: var(--th-card); font-size: 12px; line-height: 38px; color: var(--th-text-2); }
.dash-range i{ margin: 0px 8px 0px 0px; color: var(--th-muted); }
.dash-range i:last-child{ margin: 0px 0px 0px 10px; font-size: 10px; }
.dash-tabs{ margin-bottom: 16px; }
.dash-tabs li{ float: left; margin: 0px 8px 8px 0px; }
.dash-tabs li.cboth{ float: none; margin: 0px; height: 0px; }
.dash-tab{ display: block; padding: 0px 18px; border-radius: 10px; border: 1px solid var(--th-border); background: var(--th-card); color: var(--th-text-2); font-size: 13px; line-height: 38px; }
.dash-tab i{ margin-right: 8px; color: var(--th-muted); }
.dash-tab:hover,
.dash-tab.active{ border-color: rgba(34, 197, 94, 0.5); background: rgba(34, 197, 94, 0.12); color: var(--th-green); }
.dash-tab:hover i,
.dash-tab.active i{ color: var(--th-green); }
.dash-kpi{ margin-bottom: 20px; }
.dash-kpi-item{ position: relative; float: left; width: calc((100% - 60px) / 4); margin-right: 20px; padding: 18px 18px 0px; border-radius: 14px; background: var(--th-card); border: 1px solid var(--th-border); overflow: hidden; }
.dash-kpi-item:nth-child(4n+4){ margin-right: 0px; }
.dash-kpi-icon{ border: 1px solid var(--th-border); }
.dash-kpi-label{ font-size: 14px; color: var(--th-text-2); }
.dash-kpi-number{ margin: 6px 0px 2px; font-size: 34px; font-weight: 800; line-height: 1.2; }
.dash-kpi-delta{ font-size: 13px; font-weight: 700; }
.dash-kpi-delta i{ margin-right: 4px; }
.dash-kpi-chart{ display: block; width: 100%; height: 56px; margin-top: 6px; }
.dash-kpi-chart .kpi-line{ fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.kpi-green{ background: linear-gradient(180deg, rgba(34, 197, 94, 0.12), var(--th-card)); border-color: rgba(34, 197, 94, 0.3); }
.kpi-purple{ background: linear-gradient(180deg, rgba(168, 85, 247, 0.12), var(--th-card)); border-color: rgba(168, 85, 247, 0.3); }
.kpi-orange{ background: linear-gradient(180deg, rgba(245, 158, 11, 0.12), var(--th-card)); border-color: rgba(245, 158, 11, 0.3); }
.kpi-blue{ background: linear-gradient(180deg, rgba(56, 189, 248, 0.12), var(--th-card)); border-color: rgba(56, 189, 248, 0.3); }
.kpi-green .dash-kpi-number,
.kpi-green .dash-kpi-delta,
.kpi-green .dash-kpi-icon{ color: var(--th-green); }
.kpi-purple .dash-kpi-number,
.kpi-purple .dash-kpi-delta,
.kpi-purple .dash-kpi-icon{ color: var(--th-purple); }
.kpi-orange .dash-kpi-number,
.kpi-orange .dash-kpi-delta,
.kpi-orange .dash-kpi-icon{ color: var(--th-orange); }
.kpi-blue .dash-kpi-number,
.kpi-blue .dash-kpi-delta,
.kpi-blue .dash-kpi-icon{ color: var(--th-blue); }
.kpi-green .kpi-line{ stroke: var(--th-green); }
.kpi-purple .kpi-line{ stroke: var(--th-purple); }
.kpi-orange .kpi-line{ stroke: var(--th-orange); }
.kpi-blue .kpi-line{ stroke: var(--th-blue); }
.kpi-green .kpi-area{ fill: rgba(34, 197, 94, 0.12); }
.kpi-purple .kpi-area{ fill: rgba(168, 85, 247, 0.12); }
.kpi-orange .kpi-area{ fill: rgba(245, 158, 11, 0.12); }
.kpi-blue .kpi-area{ fill: rgba(56, 189, 248, 0.12); }
.dash-mid{ margin-bottom: 20px; }
.dash-chart,
.dash-health,
.dash-opp,
.dash-steps{ padding: 20px; border-radius: 14px; background: var(--th-card); border: 1px solid var(--th-border); }
.dash-chart{ width: calc(66% - 10px); }
.dash-health{ width: calc(34% - 10px); }
.dash-card-title{ margin-bottom: 14px; font-size: 17px; font-weight: 600; color: #fff; }
.dash-card-title .dash-live-dot{ width: 6px; height: 6px; margin-right: 10px; vertical-align: middle; }
.dash-legend{ margin-bottom: 14px; }
.dash-legend li{ display: inline-block; margin-right: 18px; font-size: 12px; color: var(--th-text-2); }
.dash-legend li:before{ content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: var(--th-green); }
.dash-legend .lg-purple:before{ background: var(--th-purple); }
.dash-legend .lg-orange:before{ background: var(--th-orange); }
.dash-legend .lg-blue:before{ background: var(--th-blue); }
.dash-chart-y{ width: 36px; height: 220px; display: flex; flex-direction: column; justify-content: space-between; font-size: 12px; color: var(--th-muted); }
.dash-chart-axes{ width: 190px; padding-left: 16px; }
.dash-chart-axes ul{ float: left; width: 33.3333%; height: 220px; display: flex; flex-direction: column; justify-content: space-between; font-size: 11px; color: var(--th-muted); border-left: 1px solid var(--th-border); padding-left: 8px; }
.dash-chart-axes ul:nth-child(1){ color: var(--th-blue); }
.dash-chart-axes ul:nth-child(2){ color: var(--th-orange); }
.dash-chart-axes ul:nth-child(3){ color: var(--th-blue); }
.dash-chart-svg{ margin: 0px 190px 0px 36px; }
.dash-chart-svg svg{ display: block; width: 100%; height: 220px; }
.dash-chart-svg polyline{ fill: none; stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.dash-chart-svg .grid line{ stroke: var(--th-border); stroke-width: 1; vector-effect: non-scaling-stroke; }
.ln-green{ stroke: var(--th-green); }
.ln-purple{ stroke: var(--th-purple); }
.ln-orange{ stroke: var(--th-orange); }
.ln-blue{ stroke: var(--th-blue); }
.dash-chart-x{ margin-top: 8px; display: flex; justify-content: space-between; font-size: 12px; color: var(--th-muted); }
.dash-health-gauge{ width: 42%; }
.dash-gauge{ position: relative; width: 150px; height: 150px; margin-top: 10px; }
.dash-gauge svg{ display: block; width: 100%; height: 100%; }
.gauge-bg{ fill: none; stroke: var(--th-border); stroke-width: 10; }
.gauge-fill{ fill: none; stroke: url(#gaugeGrad); stroke-width: 10; stroke-linecap: round; }
.dash-gauge-text{ position: absolute; top: 50%; left: 0px; width: 100%; margin-top: -40px; text-align: center; }
.dash-gauge-text strong{ display: block; font-size: 43px; font-weight: 800; line-height: 1.1; color: #fff; }
.dash-gauge-text span{ display: block; font-size: 13px; color: var(--th-muted); }
.dash-gauge-text em{ display: inline-block; margin-top: 8px; padding: 2px 14px; border-radius: 6px; background: var(--th-green); color: #000; font-size: 12px; font-weight: 700; font-style: normal; }
.dash-health-list{ width: 54%; padding-top: 8px; }
.dash-health-list li{ margin-bottom: 14px; }
.dash-health-label{ margin-bottom: 6px; font-size: 12px; font-weight: 600; color: #fff; }
.dash-health-label:before{ content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 8px; border-radius: 50%; background: var(--th-green); }
.dash-health-bar{ height: 4px; border-radius: 999px; background: var(--th-border); overflow: hidden; }
.dash-health-bar span{ display: block; height: 100%; border-radius: 999px; background: var(--th-green); }
.hl-blue .dash-health-label:before,
.hl-blue .dash-health-bar span{ background: var(--th-blue); }
.hl-yellow .dash-health-label:before,
.hl-yellow .dash-health-bar span{ background: var(--th-yellow); }
.hl-orange .dash-health-label:before,
.hl-orange .dash-health-bar span{ background: var(--th-orange); }
.hl-purple .dash-health-label:before,
.hl-purple .dash-health-bar span{ background: var(--th-purple); }
.dash-opp{ width: calc(40% - 10px); }
.dash-opp .icon-box{ border: 1px solid var(--th-gold-bd-30); }
.dash-opp-info{ margin: 0px 140px 0px 64px; }
.dash-opp-info h3{ margin-bottom: 4px; font-size: 17px; font-weight: 700; color: var(--th-gold-400); }
.dash-opp-info p{ font-size: 12px; line-height: 1.5; color: var(--th-muted); }
.dash-opp-btn{ float: right; margin: -48px 0px 0px; padding: 0px 14px; border-radius: 8px; border: 1px solid var(--th-gold-bd-30); color: var(--th-gold-400); font-size: 12px; font-weight: 600; line-height: 34px; }
.dash-opp-btn:hover{ background: var(--th-gold-500); color: #000; }
.dash-opp-btn i{ margin-left: 6px; }
.dash-steps{ width: calc(60% - 10px); }
.dash-steps li{ position: relative; float: left; width: 20%; text-align: center; }
.dash-steps li:before{ content: ""; position: absolute; top: 11px; left: 50%; width: 100%; height: 2px; background: var(--th-green); }
.dash-steps li:nth-child(5):before,
.dash-steps li.cboth:before{ display: none; }
.dash-steps li.cboth{ float: none; width: auto; }
.dash-step-dot{ position: relative; display: block; width: 24px; height: 24px; margin: 0px auto 8px; border-radius: 50%; border: 2px solid var(--th-green); background: #0B1F14; color: var(--th-green); font-size: 12px; line-height: 20px; z-index: 2; }
.dash-steps li.pending .dash-step-dot{ background: var(--th-card); }
.dash-steps li strong{ display: block; font-size: 12px; font-weight: 600; color: #fff; }
.dash-steps li em{ display: block; font-size: 11px; font-style: normal; color: var(--th-muted); }

/*
* BLOCK PARTNER.
*/
.block-partner{ padding: 56px 0px; background: linear-gradient(180deg, rgba(26, 29, 39, 0.6), rgba(18, 20, 28, 0.9)); border-top: 1px solid var(--th-border); border-bottom: 1px solid var(--th-border); overflow: hidden; text-align: center; }
.block-partner .block-item-head{ margin-bottom: 32px; }
.partner-list{ overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.partner-track{ display: -webkit-box; display: flex; width: -webkit-max-content; width: max-content; padding: 4px 0px; animation: partner-marquee 30s linear infinite; }
.partner-list:hover .partner-track{ animation-play-state: paused; }
@keyframes partner-marquee{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }
.partner-item{ display: inline-block; margin: 0px 12px; padding: 14px 28px; font-size: 18px; font-weight: 700; letter-spacing: 0.04em; color: var(--th-muted); background: rgba(255, 255, 255, 0.03); border: 1px solid var(--th-border); border-radius: 10px; white-space: nowrap; transition: all 0.3s; }
.partner-item:hover{ color: var(--th-gold-400); border-color: var(--th-gold-500); background: rgba(212, 175, 55, 0.08); transform: translateY(-3px); }
.partner-item i{ margin-right: 10px; font-size: 20px; color: var(--th-gold-500); vertical-align: -1px; }

/*
* BLOCK ITEM (common section).
*/
.block-item{ position: relative; padding: 96px 0px; }
.block-item-alt{ background: rgba(26, 29, 39, 0.6); border-top: 1px solid var(--th-border); }
.block-item-head{ max-width: 768px; margin: 0px auto 64px; text-align: center; }
.block-sp-pricing .block-item-head,
.block-wd-pricing .block-item-head{ max-width: 960px; }
.block-item-badge{ display: inline-block; margin-bottom: 16px; color: var(--th-gold-400); font-size: 14px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.block-item-badge:before,
.block-item-badge:after{ content: ""; display: inline-block; width: 28px; height: 2px; margin: 0px 12px; vertical-align: middle; background: linear-gradient(90deg, transparent, var(--th-gold-400)); }
.block-item-badge:after{ background: linear-gradient(270deg, transparent, var(--th-gold-400)); }
.block-item-head-row .block-item-badge:before,
.faq-left .block-item-badge:before,
.about-left .block-item-badge:before{ display: none; }
.block-item-head-row .block-item-badge:after,
.faq-left .block-item-badge:after,
.about-left .block-item-badge:after{ display: none; }
.block-item-title{ margin-bottom: 16px; font-size: 39px; font-weight: 800; line-height: 1.2; color: #fff; }
.block-item-desc{ font-size: 18px; color: var(--th-muted); }

/*
* BLOCK ABOUT.
*/
.block-about{ padding: 70px 0px; }
.about-left{ width: calc(48% - 20px); }
.about-right{ width: calc(52% - 20px); padding-top: 20px; }
.about-left .block-item-title{ margin-bottom: 14px; font-size: 30px; }
.about-desc{ margin-bottom: 24px; font-size: 15px; line-height: 1.7; color: var(--th-text-2); }
.about-left .btn-sm i{ margin-left: 8px; }
.about-step{ position: relative; float: left; width: calc((100% - 80px) / 3); margin-right: 40px; }
.about-step:nth-child(3){ margin-right: 0px; }
.about-step:nth-child(-n+2):after{ content: "\f061"; position: absolute; top: 34px; right: -32px; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 15px; color: var(--th-muted); }
.about-step-icon{ width: 76px; height: 76px; margin: 0px auto 14px; border-radius: 50%; border: 2px solid currentColor; font-size: 28px; line-height: 72px; text-align: center; transition: all 0.3s; }
.about-step:hover .about-step-icon{ transform: translateY(-4px); box-shadow: 0px 0px 20px currentColor; }
.about-step-title{ margin-bottom: 6px; font-size: 18px; font-weight: 800; color: inherit; }
.about-step-desc{ font-size: 14px; line-height: 1.5; color: var(--th-text-2); }
.step-green{ color: var(--th-green); }
.step-gold{ color: var(--th-gold-400); }
.step-purple{ color: var(--th-purple); }
.step-green .about-step-icon{ background: rgba(34, 197, 94, 0.1); }
.step-gold .about-step-icon{ background: rgba(250, 204, 21, 0.1); }
.step-purple .about-step-icon{ background: rgba(168, 85, 247, 0.1); }

/*
* BLOCK CASE STUDY.
*/
.block-casestudy{ padding: 60px 0px 80px; }
.block-item-head-row{ max-width: none; margin-bottom: 28px; text-align: left; }
.block-item-head-row .block-item-title{ margin-bottom: 0px; font-size: 30px; }
.block-item-more{ margin-top: 40px; font-size: 13px; font-weight: 600; color: var(--th-gold-400); }
.block-item-more i{ margin-left: 6px; transition: margin 0.3s; }
.block-item-more:hover i{ margin-left: 10px; }
.cs-item{ float: left; width: calc((100% - 56px) / 3); margin-right: 28px; border-radius: 22px; background: var(--th-card); border: 1px solid var(--th-border); overflow: hidden; transition: all 0.4s; }
.cs-item:nth-child(3n+3){ margin-right: 0px; }
.cs-item:hover{ border-color: rgba(212, 175, 55, 0.6); transform: translateY(-8px); box-shadow: 0px 25px 50px rgba(0, 0, 0, 0.5), 0px 0px 30px rgba(212, 175, 55, 0.18); }
.cs-item-thumb{ position: relative; height: 240px; }
.cs-item-img{ width: 100%; height: 100%; transition: transform 0.7s; }
.cs-item:hover .cs-item-img{ transform: scale(1.1); }
.cs-item-thumb:after{ content: ""; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: linear-gradient(180deg, rgba(11, 12, 16, 0.1) 0%, rgba(11, 12, 16, 0.55) 55%, rgba(11, 12, 16, 0.95) 100%); }
.cs-item-tag{ position: absolute; top: 16px; left: 16px; z-index: 2; padding: 5px 14px; border-radius: 999px; background: rgba(11, 12, 16, 0.7); border: 1px solid var(--th-gold-bd-30); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: var(--th-gold-400); font-size: 12px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; }
.cs-item-metric{ position: absolute; left: 24px; bottom: 18px; z-index: 2; }
.cs-item-number{ display: block; font-size: 54px; font-weight: 900; line-height: 1.1; letter-spacing: -0.02em; }
.cs-item-label{ display: block; margin-top: 2px; font-size: 14px; font-weight: 600; color: var(--th-text-2); }
.cs-item-info{ padding: 24px; }
.cs-item-title{ margin-bottom: 8px; font-size: 22px; font-weight: 800; color: #fff; transition: color 0.3s; }
.cs-item:hover .cs-item-title{ color: var(--th-gold-400); }
.cs-item-desc{ min-height: 66px; margin-bottom: 18px; font-size: 15px; line-height: 1.7; color: var(--th-muted); }
.cs-item-foot{ padding-top: 16px; border-top: 1px dashed var(--th-border); }
.cs-item-link{ font-size: 14px; font-weight: 700; line-height: 36px; color: var(--th-gold-400); }
.cs-item-link i{ margin-left: 8px; transition: margin 0.3s; }
.cs-item:hover .cs-item-link i{ margin-left: 14px; }
.cs-item-chart{ width: 110px; height: 36px; }
.cs-item-chart polyline{ fill: none; stroke: var(--th-green); stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; }

/*
* BLOCK SERVICES.
*/
.service-list{ margin-top: 10px; }
.service-item{ position: relative; padding: 48px; border-radius: 24px; background: linear-gradient(180deg, rgba(26, 29, 39, 0.9) 0%, var(--th-card) 60%); border: 1px solid var(--th-border); overflow: hidden; transition: all 0.4s; }
.service-item + .service-item{ margin-top: 40px; }
.service-item:hover{ border-color: rgba(212, 175, 55, 0.55); box-shadow: 0px 20px 50px rgba(0, 0, 0, 0.5), 0px 0px 30px rgba(212, 175, 55, 0.15); }
.service-item-featured{ border-color: rgba(212, 175, 55, 0.6); background: linear-gradient(180deg, rgba(60, 48, 14, 0.55) 0%, var(--th-card) 65%); }
.service-item-text{ position: relative; width: 50%; padding-right: 40px; }
.service-item-visual{ width: 50%; }
.service-item:nth-child(even) .service-item-text{ float: right; padding-right: 0px; padding-left: 40px; }
.service-item:nth-child(even) .service-item-visual{ float: left; }
.service-item-ribbon{ display: inline-block; margin-bottom: 14px; padding: 4px 12px; border-radius: 8px; background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.service-item-head{ margin-bottom: 24px; }
.service-item-num{ margin-left: 18px; font-size: 58px; font-weight: 900; line-height: 64px; letter-spacing: -0.02em; color: transparent; -webkit-text-stroke: 1.5px var(--th-gold-400); opacity: 0.85; transition: all 0.4s; }
.service-item:hover .service-item-num,
.service-item-featured .service-item-num{ color: var(--th-gold-400); -webkit-text-stroke: 0px; opacity: 1; }
.service-item .icon-box{ width: 64px; height: 64px; border-radius: 18px; font-size: 28px; line-height: 62px; background: linear-gradient(135deg, rgba(250, 204, 21, 0.18), rgba(212, 175, 55, 0.05)); box-shadow: inset 0px 0px 0px 1px rgba(250, 204, 21, 0.1); }
.service-item:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; transform: rotate(-6deg) scale(1.05); box-shadow: var(--th-shadow-glow); }
.service-item-title{ margin-bottom: 14px; font-size: 32px; font-weight: 800; line-height: 1.25; color: #fff; transition: color 0.3s; }
.service-item:hover .service-item-title{ color: var(--th-gold-400); }
.service-item-desc{ margin-bottom: 24px; font-size: 17px; line-height: 1.85; text-align: justify; color: var(--th-muted); }
.service-item-list{ margin: 0px 0px 32px; padding-top: 20px; border-top: 1px dashed var(--th-border); }
.service-item-list li{ margin-bottom: 12px; font-size: 15px; color: var(--th-text-2); }
.service-item-list li:last-child{ margin-bottom: 0px; }
.service-item-list i{ margin-right: 10px; color: var(--th-gold-400); }

/* Service visual. */
.service-visual-box{ position: relative; border-radius: 16px; background: #0D0F15; border: 1px solid var(--th-gold-bd-30); box-shadow: 0px 24px 60px rgba(0, 0, 0, 0.55), var(--th-shadow-sm); overflow: visible; }
.service-visual-bar{ height: 38px; padding: 0px 16px; border-bottom: 1px solid var(--th-border); border-radius: 16px 16px 0px 0px; background: #12141C; white-space: nowrap; }
.service-visual-bar span{ display: inline-block; width: 10px; height: 10px; margin: 14px 6px 0px 0px; border-radius: 50%; background: #3A3F4F; }
.service-visual-bar span:nth-child(1){ background: #EF4444; }
.service-visual-bar span:nth-child(2){ background: #F59E0B; }
.service-visual-bar span:nth-child(3){ background: #22C55E; }
.service-visual-bar em{ display: inline-block; vertical-align: top; width: calc(100% - 90px); margin: 8px 0px 0px 10px; padding: 0px 12px; height: 22px; border-radius: 6px; background: var(--th-base); font-size: 11px; font-style: normal; line-height: 22px; color: var(--th-muted); overflow: hidden; text-overflow: ellipsis; }
.service-visual-bar em i{ margin-right: 6px; font-size: 9px; color: var(--th-green); }
.sv-body{ padding: 16px; font-size: 12px; color: var(--th-text); }
.sv-green{ --sv-c: var(--th-green); --sv-bg: rgba(34, 197, 94, 0.12); --sv-bd: rgba(34, 197, 94, 0.3); }
.sv-purple{ --sv-c: var(--th-purple); --sv-bg: rgba(168, 85, 247, 0.12); --sv-bd: rgba(168, 85, 247, 0.3); }
.sv-orange{ --sv-c: var(--th-orange); --sv-bg: rgba(245, 158, 11, 0.12); --sv-bd: rgba(245, 158, 11, 0.3); }
.sv-blue{ --sv-c: var(--th-blue); --sv-bg: rgba(56, 189, 248, 0.12); --sv-bd: rgba(56, 189, 248, 0.3); }
.sv-kpis{ margin-bottom: 12px; }
.sv-kpi{ position: relative; float: left; width: calc((100% - 20px) / 3); margin-right: 10px; padding: 10px 12px 0px; border-radius: 12px; background: linear-gradient(180deg, var(--sv-bg), var(--th-card)); border: 1px solid var(--sv-bd); overflow: hidden; color: var(--sv-c); }
.sv-kpi:nth-child(3n+3){ margin-right: 0px; }
.sv-kpi small{ display: block; font-size: 10px; color: var(--th-text-2); }
.sv-kpi b{ display: block; margin: 2px 0px 0px; font-size: 22px; font-weight: 800; line-height: 1.2; }
.sv-kpi span{ font-size: 10px; font-weight: 700; }
.sv-kpi span i{ margin-right: 3px; }
.sv-kpi svg{ display: block; width: 100%; height: 34px; margin-top: 4px; }
.sv-area{ fill: var(--sv-c); opacity: 0.14; }
.sv-line{ fill: none; stroke: var(--sv-c); stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.sv-card{ margin-bottom: 12px; padding: 12px 14px; border-radius: 12px; background: var(--th-card); border: 1px solid var(--th-border); }
.sv-card-title{ margin-bottom: 8px; font-size: 12px; font-weight: 600; color: #fff; }
.sv-card-title-row{ margin-bottom: 12px; }
.sv-legend{ margin-bottom: 8px; }
.sv-legend li{ display: inline-block; margin-right: 12px; font-size: 10px; color: var(--th-text-2); }
.sv-legend li:before{ content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: var(--sv-c); }
.sv-chart{ display: block; width: 100%; height: 110px; }
.sv-grid line{ stroke: var(--th-border); stroke-width: 1; vector-effect: non-scaling-stroke; }
.sv-ln{ fill: none; stroke: var(--sv-c); stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.sv-row{ padding: 7px 12px; border-radius: 8px; background: var(--th-card); border: 1px solid var(--th-border); line-height: 22px; overflow: hidden; }
.sv-row + .sv-row{ margin-top: 6px; }
.sv-rank{ float: left; width: 28px; margin-right: 10px; border-radius: 6px; background: rgba(250, 204, 21, 0.18); text-align: center; font-weight: 800; color: var(--th-gold-400); }
.sv-row-name{ float: left; color: var(--th-text); }
.sv-row-val{ float: right; margin-left: 10px; font-weight: 700; color: #fff; }
.sv-row-val.sv-green{ color: var(--sv-c); }
.sv-avatar{ float: left; width: 22px; height: 22px; margin-right: 10px; border-radius: 50%; background: rgba(250, 204, 21, 0.2); text-align: center; font-size: 9px; font-weight: 800; line-height: 22px; color: var(--th-gold-400); }
.sv-pill{ float: right; margin: 3px 0px 0px 10px; padding: 0px 8px; border-radius: 999px; background: rgba(34, 197, 94, 0.15); font-size: 9px; font-weight: 700; line-height: 16px; color: var(--th-green); }
.sv-card-title-row .sv-pill{ margin-top: 0px; }
.sv-pill-wait{ background: rgba(245, 158, 11, 0.15); color: var(--th-orange); }
.sv-gauges{ margin: 0px -5px 12px; }
.sv-gauge{ position: relative; float: left; width: calc(25% - 10px); margin: 0px 5px; padding: 12px 0px 10px; border-radius: 12px; background: linear-gradient(180deg, var(--sv-bg), var(--th-card)); border: 1px solid var(--sv-bd); text-align: center; }
.sv-gauge svg{ display: block; width: 64px; height: 64px; margin: 0px auto; }
.sv-g-bg{ fill: none; stroke: var(--th-border); stroke-width: 7; }
.sv-g-fill{ fill: none; stroke: var(--sv-c); stroke-width: 7; stroke-linecap: round; }
.sv-gauge strong{ position: absolute; top: 31px; left: 0px; right: 0px; font-size: 18px; font-weight: 800; line-height: 1; color: var(--sv-c); }
.sv-gauge em{ display: block; margin-top: 8px; font-size: 10px; font-style: normal; color: var(--th-text-2); }
.sv-split-left{ float: left; width: calc(60% - 6px); margin-bottom: 0px; }
.sv-split-right{ float: right; width: calc(40% - 6px); margin-right: 0px; }
.sv-split-right svg{ height: 60px; }
.sv-bar-list li + li{ margin-top: 9px; }
.sv-bar-list div{ margin-bottom: 4px; font-size: 11px; color: var(--th-text-2); }
.sv-bar-list div span{ font-weight: 700; color: #fff; }
.sv-bar-list p{ height: 5px; border-radius: 3px; background: var(--th-border); overflow: hidden; }
.sv-bar-list p i{ display: block; height: 100%; border-radius: 3px; background: var(--sv-c); }
.sv-tabs{ margin-bottom: 12px; font-size: 0px; }
.sv-tabs li{ display: inline-block; margin-right: 6px; padding: 0px 12px; border-radius: 8px; border: 1px solid var(--th-border); background: var(--th-card); font-size: 11px; line-height: 28px; color: var(--th-text-2); }
.sv-tabs li i{ margin-right: 6px; color: var(--th-muted); }
.sv-tabs li.sv-on{ border-color: rgba(34, 197, 94, 0.5); background: rgba(34, 197, 94, 0.12); color: var(--th-green); }
.sv-tabs li.sv-on i{ color: var(--th-green); }
.sv-bars{ height: 70px; font-size: 0px; }
.sv-bars i{ display: inline-block; vertical-align: bottom; width: calc(11.11% - 6px); margin: 0px 3px; border-radius: 4px 4px 0px 0px; background: rgba(168, 85, 247, 0.35); }
.sv-bars i.sv-on{ background: var(--th-gold-400); }
.sv-chat{ margin-bottom: 12px; }
.sv-chat-head{ margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--th-border); overflow: hidden; }
.sv-chat-head .sv-avatar{ width: 32px; height: 32px; line-height: 32px; font-size: 13px; }
.sv-avatar-ai{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; }
.sv-chat-head b{ display: block; font-size: 12px; color: #fff; }
.sv-chat-head small{ font-size: 10px; color: var(--th-green); }
.sv-chat-head small i{ display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--th-green); }
.sv-msg{ max-width: 80%; margin-bottom: 8px; padding: 7px 12px; border-radius: 14px; font-size: 11px; line-height: 1.5; clear: both; }
.sv-msg-user{ float: right; border-bottom-right-radius: 4px; background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; font-weight: 600; }
.sv-msg-bot{ float: left; border-bottom-left-radius: 4px; background: var(--th-lighter); border: 1px solid var(--th-border); color: var(--th-text); }
.sv-msg-bot i{ color: var(--th-green); }
.sv-steps li{ float: left; width: 25%; text-align: center; font-size: 10px; color: var(--th-text-2); position: relative; }
.sv-steps li.cboth{ float: none; width: auto; }
.sv-steps li:before{ content: ""; position: absolute; top: 10px; left: -50%; width: 100%; height: 2px; background: var(--th-green); }
.sv-steps li:first-child:before,
.sv-steps li.cboth:before{ display: none; }
.sv-steps{ padding-bottom: 22px; }
.sv-steps span{ position: relative; display: block; width: 22px; height: 22px; margin: 0px auto 6px; border-radius: 50%; background: var(--th-base); border: 2px solid var(--th-green); line-height: 18px; font-size: 9px; color: var(--th-green); }
.sv-steps strong{ font-weight: 700; color: #fff; }
.service-visual-chip{ position: absolute; padding: 8px 14px; border-radius: 999px; background: var(--th-card); border: 1px solid var(--th-gold-bd-30); box-shadow: var(--th-shadow-sm); font-size: 12px; font-weight: 700; color: #fff; }
.service-visual-chip i{ margin-right: 8px; color: var(--th-gold-400); }
.service-visual-chip-1{ top: -16px; right: 28px; }
.service-visual-chip-2{ bottom: -16px; left: 28px; }
/* Service visual web. */
.sv-web{ position: relative; padding-bottom: 28px; }
.sw-site{ border-radius: 10px; background: #FAF7F0; overflow: hidden; color: #1F2430; }
.sw-nav{ padding: 10px 14px; border-bottom: 1px solid #ECE6D6; overflow: hidden; }
.sw-logo{ float: left; font-size: 12px; font-weight: 800; line-height: 22px; color: #1F2430; }
.sw-logo i{ margin-right: 6px; color: #B8860B; }
.sw-nav ul{ float: left; margin-left: 20px; }
.sw-nav li{ float: left; margin-right: 14px; font-size: 10px; line-height: 22px; color: #6B7280; }
.sw-nav .sw-btn{ float: right; }
.sw-btn{ display: inline-block; padding: 0px 12px; border-radius: 6px; background: linear-gradient(135deg, #FCE082, #D4AF37); font-size: 10px; font-weight: 700; line-height: 22px; color: #000; }
.sw-btn-line{ margin-left: 6px; background: none; border: 1px solid #D4AF37; line-height: 20px; color: #7A5A0A; }
.sw-hero{ padding: 18px 14px; }
.sw-hero-text{ width: 52%; padding-right: 14px; }
.sw-hero-text small{ display: block; margin-bottom: 6px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: #B8860B; }
.sw-hero-text h4{ margin-bottom: 8px; font-family: var(--th-font-tf); font-size: 20px; font-weight: 800; line-height: 1.25; color: #1F2430; }
.sw-hero-text p{ margin-bottom: 12px; font-size: 10px; line-height: 1.5; color: #6B7280; }
.sw-hero-img{ position: relative; width: 48%; height: 138px; border-radius: 12px; background: linear-gradient(135deg, #F6E7B4, #D9B45A); text-align: center; font-size: 56px; line-height: 138px; color: rgba(255, 255, 255, 0.85); }
.sw-tag{ position: absolute; left: 10px; bottom: 10px; padding: 0px 10px; border-radius: 999px; background: #fff; box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15); font-size: 9px; font-weight: 700; line-height: 22px; color: #1F2430; }
.sw-tag i{ margin-right: 5px; font-size: 9px; color: #F59E0B; }
.sw-cards{ padding: 0px 14px 14px; }
.sw-cards div{ float: left; width: calc((100% - 16px) / 3); margin-right: 8px; padding: 10px; border-radius: 8px; background: #fff; border: 1px solid #ECE6D6; }
.sw-cards div:nth-child(3){ margin-right: 0px; }
.sw-cards div.cboth{ float: none; width: auto; padding: 0px; border: 0px; }
.sw-cards i{ display: block; margin-bottom: 6px; font-size: 14px; color: #B8860B; }
.sw-cards b{ display: block; font-size: 10px; font-weight: 700; color: #1F2430; }
.sw-cards span{ display: block; margin-top: 2px; font-size: 9px; line-height: 1.4; color: #6B7280; }
.sw-phone{ position: absolute; right: 22px; bottom: -34px; width: 112px; padding: 6px; border-radius: 20px; background: #0B0C10; border: 2px solid #3A3F4F; box-shadow: 0px 18px 40px rgba(0, 0, 0, 0.7); }
.sw-phone-screen{ padding: 12px 8px 10px; border-radius: 14px; background: #FAF7F0; color: #1F2430; }
.sw-phone-screen .sw-logo{ float: none; display: block; margin-bottom: 8px; font-size: 9px; }
.sw-phone-screen h5{ margin-bottom: 8px; font-family: var(--th-font-tf); font-size: 12px; font-weight: 800; line-height: 1.25; }
.sw-phone-img{ height: 54px; margin-bottom: 8px; border-radius: 8px; background: linear-gradient(135deg, #F6E7B4, #D9B45A); text-align: center; font-size: 24px; line-height: 54px; color: rgba(255, 255, 255, 0.85); }
.sw-phone-screen .sw-btn{ display: block; text-align: center; font-size: 9px; }
.service-visual-chip-3{ top: 52px; right: -16px; }
.service-visual-chip-4{ bottom: 34px; left: -16px; }

/* Service visual screenshot. */
.sv-shot{ min-height: 0px; padding: 0px; }
.sv-shot-view{ height: 400px; border-radius: 0px 0px 15px 15px; background: #fff; overflow: hidden; }
.sv-shot-img{ display: block; width: 100%; height: auto; -webkit-transform: translateY(0px); transform: translateY(0px); transition: transform 2s ease-out; }
.service-item:hover .sv-shot-img{ -webkit-transform: translateY(calc(-100% + 400px)); transform: translateY(calc(-100% + 400px)); transition-duration: 40s; transition-timing-function: linear; }
.sv-shot-fit{ background: #fff; border-radius: 0px 0px 15px 15px; overflow: hidden; }
.sv-shot-fit-img{ display: block; width: 100%; height: auto; }
.sv-shot-crop{ background: #F0F0F1; border-radius: 0px 0px 15px 15px; overflow: hidden; }
.sv-crop{ position: relative; height: 0px; overflow: hidden; }
.sv-crop-top{ padding-top: 7%; }
.sv-crop-bottom{ padding-top: 50.4%; }
.sv-crop-in{ position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; overflow: hidden; }
.sv-crop-img{ display: block; width: 175%; max-width: none; height: auto; }
.sv-crop-img-top{ margin-top: -1.5%; }
.sv-crop-img-bottom{ margin-top: -37.125%; }
.sw-phone-shot{ height: 190px; padding: 0px; background: #fff; overflow: hidden; }
.service-item:hover .sv-shot-img-phone{ -webkit-transform: translateY(calc(-100% + 190px)); transform: translateY(calc(-100% + 190px)); }

/* Service visual crm. */
.sv-crm{ padding: 0px; }
.sc-side{ float: left; width: 48px; min-height: 340px; padding: 14px 0px; border-right: 1px solid var(--th-border); text-align: center; }
.sc-logo{ display: block; width: 26px; height: 26px; margin: 0px auto 18px; border-radius: 8px; background: linear-gradient(135deg, #FCE082, #D4AF37); font-size: 12px; line-height: 26px; color: #000; }
.sc-side > i{ display: block; margin-bottom: 18px; font-size: 14px; color: #4B5163; }
.sc-side > i.sc-on{ color: var(--th-gold-400); }
.sc-main{ margin-left: 48px; padding: 14px; overflow: hidden; }
.sc-top{ margin-bottom: 12px; }
.sc-search{ width: 62%; padding: 0px 12px; border-radius: 8px; background: var(--th-card); border: 1px solid var(--th-border); font-size: 10px; line-height: 28px; color: var(--th-muted); }
.sc-search i{ margin-right: 8px; }
.sc-avatars span{ display: inline-block; width: 28px; height: 28px; margin-left: -6px; border-radius: 50%; background: #2A2E3B; border: 2px solid #0D0F15; font-size: 9px; font-weight: 800; line-height: 24px; text-align: center; color: var(--th-gold-400); }
.sc-board{ margin: 0px -4px 12px; }
.sc-col{ float: left; width: calc(33.3333% - 8px); margin: 0px 4px; padding: 8px; border-radius: 10px; background: var(--sv-bg); border: 1px solid var(--sv-bd); }
.sc-col-head{ margin-bottom: 8px; font-size: 11px; font-weight: 700; color: var(--sv-c); }
.sc-col-head span{ float: right; padding: 0px 7px; border-radius: 999px; background: var(--sv-bg); font-size: 10px; line-height: 16px; }
.sc-card{ margin-bottom: 6px; padding: 8px 9px; border-radius: 8px; background: var(--th-card); border: 1px solid var(--th-border); }
.sc-card-won{ border-color: rgba(34, 197, 94, 0.35); }
.sc-card b{ display: block; font-size: 10px; font-weight: 700; color: #fff; }
.sc-card small{ display: block; margin: 1px 0px 5px; font-size: 9px; color: var(--th-muted); }
.sc-val{ font-size: 11px; font-weight: 800; color: var(--sv-c); }
.sc-tag{ float: right; padding: 0px 6px; border-radius: 4px; background: var(--th-lighter); font-size: 8px; font-weight: 700; line-height: 15px; color: var(--th-text-2); }
.sc-tag i{ margin-right: 3px; color: var(--th-green); }
.sc-api{ padding: 0px 12px; border-radius: 8px; background: var(--th-base); border: 1px dashed var(--th-gold-bd-30); font-family: monospace; font-size: 10px; line-height: 28px; color: var(--th-text-2); white-space: nowrap; overflow: hidden; }
.sc-api i{ margin-right: 8px; color: var(--th-gold-400); }
.sc-api em{ font-style: normal; font-weight: 700; color: var(--th-green); }

/* Why visual. */
.sv-pad{ padding-bottom: 26px; }
.sv-kpi-plain{ padding-bottom: 10px; }
.sv-avatar-ok{ background: rgba(34, 197, 94, 0.2); color: var(--th-green); }
.sv-avatar-run{ background: rgba(245, 158, 11, 0.2); color: var(--th-orange); }
.sv-pill-red{ background: rgba(239, 68, 68, 0.15); color: #EF4444; }
.wy-doc{ width: calc(62% - 6px); padding: 14px; border-radius: 8px; background: #FAF7F0; color: #1F2430; box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.5); }
.wy-doc-head{ margin-bottom: 8px; padding-bottom: 8px; border-bottom: 2px solid #D4AF37; text-align: center; }
.wy-doc-head b{ display: block; font-size: 12px; font-weight: 800; letter-spacing: 0.04em; }
.wy-doc-head small{ font-size: 9px; color: #6B7280; }
.wy-doc-p{ margin-bottom: 8px; font-size: 9px; line-height: 1.5; color: #374151; }
.wy-table{ width: 100%; margin-bottom: 10px; border-collapse: collapse; font-size: 9px; }
.wy-table th{ padding: 4px 6px; background: #F1E7C8; text-align: left; font-weight: 700; color: #5B4510; }
.wy-table td{ padding: 4px 6px; border-bottom: 1px solid #ECE6D6; color: #374151; }
.wy-table .wy-ok{ font-weight: 800; color: #15803D; }
.wy-sign{ position: relative; padding-top: 4px; }
.wy-sign small{ display: block; font-size: 8px; color: #6B7280; }
.wy-sign svg{ display: block; width: 70px; height: 24px; fill: none; stroke: #1E3A8A; stroke-width: 1.6; stroke-linecap: round; }
.wy-stamp{ position: absolute; top: 4px; left: 50%; margin-left: -28px; padding: 2px 8px; border: 2px solid #B91C1C; border-radius: 4px; font-size: 10px; font-weight: 900; color: #B91C1C; transform: rotate(-12deg); }
.wy-side{ width: calc(38% - 6px); }
.wy-ring-card{ margin-bottom: 10px; text-align: center; }
.wy-ring-card small{ display: block; font-size: 9px; line-height: 1.4; color: var(--th-text-2); }
.sv-ring{ position: relative; width: 92px; height: 92px; margin: 0px auto 8px; }
.sv-ring svg{ display: block; width: 100%; height: 100%; }
.sv-ring-bg{ fill: none; stroke: var(--th-border); stroke-width: 9; }
.sv-ring-fill{ fill: none; stroke: url(#whyGrad2); stroke-width: 9; stroke-linecap: round; }
.sv-ring strong{ position: absolute; top: 50%; left: 0px; width: 100%; margin-top: -10px; font-size: 18px; font-weight: 900; line-height: 20px; text-align: center; }
.wy-guarantee{ margin-bottom: 0px; text-align: center; }
.wy-guarantee i{ display: block; margin-bottom: 4px; font-size: 18px; color: var(--th-gold-400); }
.wy-guarantee b{ display: block; font-size: 11px; color: #fff; }
.wy-guarantee small{ font-size: 9px; color: var(--th-muted); }
.wy-members .wy-member{ position: relative; margin-bottom: 8px; padding: 10px 12px; border-radius: 10px; background: var(--th-card); border: 1px solid var(--th-border); overflow: hidden; }
.wy-photo{ float: left; width: 42px; height: 42px; margin-right: 12px; border-radius: 50%; font-size: 13px; font-weight: 800; line-height: 42px; text-align: center; color: #000; }
.wy-photo-1{ background: linear-gradient(135deg, #FCE082, #D4AF37); }
.wy-photo-2{ background: linear-gradient(135deg, #7DD3FC, #38BDF8); }
.wy-photo-3{ background: linear-gradient(135deg, #D8B4FE, #A855F7); }
.wy-member-info{ margin-left: 54px; }
.wy-member-info b{ display: block; font-size: 12px; color: #fff; }
.wy-member-info small{ display: block; margin: 1px 0px 5px; font-size: 10px; color: var(--th-muted); }
.wy-tags em{ display: inline-block; margin-right: 5px; padding: 0px 7px; border-radius: 4px; background: rgba(250, 204, 21, 0.12); font-size: 9px; font-style: normal; font-weight: 700; line-height: 16px; color: var(--th-gold-400); }
.wy-rating{ position: absolute; top: 10px; right: 12px; font-size: 11px; font-weight: 800; color: #fff; }
.wy-rating i{ margin-right: 4px; color: var(--th-yellow); }
.wy-live{ margin-bottom: 12px; padding: 8px 12px; border-radius: 10px; background: rgba(34, 197, 94, 0.1); border: 1px solid rgba(34, 197, 94, 0.3); overflow: hidden; line-height: 28px; }
.wy-live b{ margin-left: 8px; font-size: 12px; color: var(--th-green); }
.sv-dot-live{ display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--th-green); box-shadow: 0px 0px 0px 4px rgba(34, 197, 94, 0.2); }
.wy-ticket{ margin-bottom: 6px; padding: 9px 12px; border-radius: 8px; background: var(--th-card); border: 1px solid var(--th-border); overflow: hidden; }
.wy-tid{ float: left; width: 52px; margin-right: 10px; font-family: monospace; font-size: 10px; line-height: 30px; color: var(--th-gold-400); }
.wy-ticket .sv-pill{ margin-top: 7px; }
.wy-ticket-info{ overflow: hidden; }
.wy-ticket-info b{ display: block; font-size: 11px; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wy-ticket-info small{ font-size: 9px; color: var(--th-muted); }.service-btn{ position: relative; z-index: 1; min-width: 200px; padding: 13px 28px; border-radius: 12px; background: rgba(250, 204, 21, 0.06); border: 1px solid var(--th-gold-bd-30); color: var(--th-gold-400); font-size: 13px; font-weight: 700; transition: all 0.3s; }
.wy-chat{ width: calc(62% - 6px); padding: 12px; border-radius: 12px; background: var(--th-card); border: 1px solid var(--th-border); }
.wy-chat-head{ margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--th-border); overflow: hidden; }
.wy-chat-head .wy-photo{ width: 34px; height: 34px; margin-right: 10px; line-height: 34px; font-size: 11px; }
.wy-chat-who{ margin-left: 44px; }
.wy-chat-who b{ display: block; font-size: 11px; color: #fff; }
.wy-chat-who small{ font-size: 9px; color: var(--th-green); }
.wy-chat-who .sv-dot-live{ width: 6px; height: 6px; margin-right: 6px; box-shadow: none; }
.wy-event{ clear: both; margin: 0px 0px 8px; padding: 0px 10px; border-radius: 6px; background: rgba(245, 158, 11, 0.12); border: 1px dashed rgba(245, 158, 11, 0.4); font-size: 10px; line-height: 24px; color: var(--th-orange); text-align: center; }
.wy-event i{ margin-right: 6px; }
.wy-sla{ width: calc(38% - 6px); }
.wy-sla-card{ text-align: center; }
.wy-sla-card small{ display: block; font-size: 9px; line-height: 1.5; color: var(--th-text-2); }
.sv-ring-green .sv-ring-fill{ stroke: var(--th-green); }
.sv-ring-green strong{ margin-top: -9px; font-size: 16px; color: #fff; }
.wy-timeline{ position: relative; padding: 4px 4px 0px 14px; }
.wy-timeline:before{ content: ""; position: absolute; top: 12px; bottom: 10px; left: 8px; width: 2px; background: var(--th-green); opacity: 0.5; }
.wy-timeline li{ position: relative; margin-bottom: 12px; font-size: 10px; color: var(--th-text-2); }
.wy-timeline li:last-child{ margin-bottom: 0px; }
.wy-timeline span{ position: absolute; top: 2px; left: -10px; width: 10px; height: 10px; border-radius: 50%; background: var(--th-green); border: 2px solid #0D0F15; }
.wy-timeline b{ margin-right: 8px; font-family: monospace; color: var(--th-gold-400); }.service-btn i{ margin-left: 6px; transition: margin 0.3s; }
.service-btn:hover{ background: var(--th-gold-500); border-color: var(--th-gold-500); color: #000; }
.service-btn:hover i{ margin-left: 12px; }
.service-btn-gold{ background: linear-gradient(135deg, #FCE082 0%, #D4AF37 50%, #B8860B 100%); border: 0px; color: #000; font-weight: 800; }
.service-btn-gold:hover{ box-shadow: var(--th-shadow-glow); }
.service-detail-data{ display: none; }

/* Service modal. */
.service-modal{ display: none; position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 100; padding: 16px; background: rgba(0, 0, 0, 0.8); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); overflow-y: auto; }
.service-modal-box{ position: relative; max-width: 672px; margin: 10vh auto 0px; padding: 32px; border-radius: 24px; background: var(--th-card); border: 1px solid rgba(212, 175, 55, 0.4); }
.service-modal-x{ position: absolute; top: 20px; right: 20px; background: none; border: 0px; color: var(--th-muted); font-size: 26px; }
.service-modal-x:hover{ color: var(--th-gold-400); }
.service-modal-head{ margin-bottom: 24px; }
.service-modal-head .icon-box{ width: 48px; height: 48px; border-radius: 12px; border: 0px; background: rgba(212, 175, 55, 0.2); font-size: 22px; line-height: 48px; }
.service-modal-head-text{ margin-left: 64px; padding-right: 32px; }
.service-modal-head-text h3{ font-size: 22px; font-weight: 700; color: #fff; }
.service-modal-head-text span{ font-size: 13px; font-weight: 600; color: var(--th-gold-400); }
.service-modal-desc{ margin-bottom: 24px; font-size: 15px; line-height: 1.625; color: var(--th-text-2); }
.service-modal-sub{ margin-bottom: 12px; font-size: 13px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: #fff; }
.service-modal-list{ margin-bottom: 32px; }
.service-modal-list li{ margin-bottom: 10px; font-size: 13px; color: var(--th-text-2); }
.service-modal-list i{ margin-right: 8px; color: var(--th-gold-500); }
.service-modal-action{ text-align: right; }
.service-modal-action .btn-outline,
.service-modal-action .btn-gold{ margin-left: 12px; padding: 0px 20px; font-size: 13px; vertical-align: top; }
.service-modal-action .btn-outline{ background: transparent; color: var(--th-text-2); }
.service-modal-action .btn-outline:hover{ color: #fff; }

/*
* BLOCK WHY.
*/
.block-why .block-item-head{ max-width: 760px; margin-bottom: 56px; }
.why-left{ width: calc(40% - 20px); }
.why-right{ width: calc(60% - 20px); display: flex; flex-wrap: wrap; justify-content: space-between; align-content: stretch; gap: 20px; }
.why-left .why-card{ height: 100%; }
.why-card{ position: relative; padding: 36px 32px; border-radius: 24px; background: linear-gradient(160deg, rgba(48, 38, 12, 0.6) 0%, var(--th-card) 55%); border: 1px solid rgba(212, 175, 55, 0.45); overflow: hidden; }
.why-card-head{ position: relative; margin-bottom: 28px; text-align: center; }
.why-ring{ position: relative; width: 190px; height: 190px; margin: 0px auto 16px; }
.why-ring svg{ display: block; width: 100%; height: 100%; }
.why-ring-bg{ fill: none; stroke: var(--th-border); stroke-width: 9; }
.why-ring-fill{ fill: none; stroke: url(#whyGrad); stroke-width: 9; stroke-linecap: round; }
.why-ring-text{ position: absolute; top: 50%; left: 0px; width: 100%; margin-top: -26px; }
.why-card-number{ display: block; font-size: 46px; font-weight: 900; line-height: 1.1; letter-spacing: -0.02em; }
.why-card-text{ display: block; max-width: 280px; margin: 0px auto; font-size: 14px; line-height: 1.5; color: var(--th-text-2); }
.why-bar{ position: relative; margin-bottom: 18px; }
.why-bar-head{ margin-bottom: 8px; font-size: 13px; font-weight: 600; color: var(--th-text-2); }
.why-bar-head .fright{ color: var(--th-gold-400); font-weight: 800; }
.why-bar-track{ height: 8px; border-radius: 999px; background: var(--th-border); overflow: hidden; }
.why-bar-fill{ height: 100%; border-radius: 999px; background: linear-gradient(90deg, #B8860B, #FACC15); }
.why-card-action{ position: relative; margin-top: 28px; }
.why-card-action .btn-gold{ display: block; }
.why-item{ position: relative; width: calc(50% - 10px); padding: 32px 28px; border-radius: 20px; background: linear-gradient(180deg, rgba(26, 29, 39, 0.9) 0%, var(--th-card) 70%); border: 1px solid var(--th-border); overflow: hidden; transition: all 0.4s; }
.why-item:before{ content: ""; position: absolute; top: 0px; left: 0px; width: 100%; height: 3px; background: linear-gradient(90deg, var(--th-gold-400), transparent); transform: scaleX(0); transform-origin: left; transition: transform 0.4s; }
.why-item:hover{ border-color: rgba(212, 175, 55, 0.5); transform: translateY(-6px); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.4); }
.why-item:hover:before{ transform: scaleX(1); }
.why-item-num{ position: absolute; top: 18px; right: 20px; font-size: 43px; font-weight: 900; line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(250, 204, 21, 0.45); transition: all 0.4s; }
.why-item:hover .why-item-num{ color: rgba(250, 204, 21, 0.9); -webkit-text-stroke: 0px; }
.why-item .icon-box{ width: 64px; height: 64px; margin-bottom: 24px; border-radius: 18px; font-size: 28px; line-height: 62px; background: linear-gradient(135deg, rgba(250, 204, 21, 0.18), rgba(212, 175, 55, 0.05)); }
.why-item:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; box-shadow: var(--th-shadow-glow); }
.why-item-title{ margin-bottom: 10px; font-size: 21px; font-weight: 800; line-height: 1.35; color: #fff; transition: color 0.3s; }
.why-item:hover .why-item-title{ color: var(--th-gold-400); }
.why-item-desc{ font-size: 15px; line-height: 1.7; color: var(--th-muted); }

/*
* BLOCK PROCESS.
*/
.block-process,
.block-sw-why{ overflow-x: hidden; overflow-x: clip; }
.process-list{ position: relative; padding: 10px 0px 0px; }
.process-line{ z-index: 0; position: absolute; top: 0px; bottom: 0px; left: 50%; width: 2px; margin-left: -1px; background: var(--th-border); }
.process-line-fill{ display: block; width: 100%; height: 0px; background: linear-gradient(180deg, #FCE082, #D4AF37); }
.process-item{ position: relative; z-index: 1; clear: both; float: left; width: calc(50% - 64px); margin-bottom: 48px; padding: 28px 28px 26px; border-radius: 20px; background: linear-gradient(180deg, rgba(26, 29, 39, 0.9) 0%, var(--th-card) 70%); border: 1px solid var(--th-border); transition: opacity 0.8s ease, transform 0.8s ease, border-color 0.3s, box-shadow 0.3s; }
.process-item:nth-child(2n){ float: right; }
.process-item:last-child{ margin-bottom: 0px; }
.process-item:hover{ border-color: rgba(212, 175, 55, 0.55); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.4); }
.process-item-last{ border-color: rgba(212, 175, 55, 0.5); background: linear-gradient(180deg, rgba(60, 48, 14, 0.55) 0%, var(--th-card) 70%); }
.process-item:after{ content: ""; position: absolute; top: 34px; right: -64px; width: 64px; height: 2px; background: linear-gradient(90deg, rgba(212, 175, 55, 0.5), transparent); }
.process-item:nth-child(2n):after{ right: auto; left: -64px; background: linear-gradient(270deg, rgba(212, 175, 55, 0.5), transparent); }
.process-item-dot{ position: absolute; top: 14px; right: -85px; width: 40px; height: 40px; border-radius: 50%; background: var(--th-base); border: 2px solid var(--th-border); color: #fff; font-size: 18px; font-weight: 800; line-height: 36px; text-align: center; z-index: 2; transition: all 0.5s; }
.process-item:nth-child(2n) .process-item-dot{ right: auto; left: -85px; }
.process-item.is-show .process-item-dot{ background: linear-gradient(135deg, #FCE082, #D4AF37); border-color: #FACC15; color: #000; }
.process-item .icon-box{ float: left; width: 52px; height: 52px; margin-right: 16px; border-radius: 16px; font-size: 22px; line-height: 50px; background: linear-gradient(135deg, rgba(250, 204, 21, 0.18), rgba(212, 175, 55, 0.05)); transition: all 0.3s; }
.process-item:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; box-shadow: var(--th-shadow-glow); }
.process-item-info{ margin-left: 68px; }
.process-item-step{ display: block; margin-bottom: 2px; font-size: 12px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--th-gold-400); }
.process-item-title{ font-size: 22px; font-weight: 800; line-height: 1.3; color: #fff; }
.process-item-desc{ margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--th-border); font-size: 15px; line-height: 1.7; color: var(--th-muted); }
.process-item-num{ position: absolute; right: 22px; bottom: 6px; font-size: 58px; font-weight: 900; line-height: 1; color: rgba(255, 255, 255, 0.04); pointer-events: none; }
.process-list.is-js .process-item{ opacity: 0; transform: translateX(-70px); }
.process-list.is-js .process-item:nth-child(2n){ transform: translateX(70px); }
.process-list.is-js .process-item.is-show{ opacity: 1; transform: translateX(0px); }

/*
* BLOCK PRICING.
*/
.pricing-tabs{ display: inline-block; margin-top: 32px; padding: 6px; border-radius: 12px; background: var(--th-card); border: 1px solid var(--th-border); }
.pricing-tab{ display: inline-block; padding: 10px 20px; border: 0px; border-radius: 8px; background: transparent; color: var(--th-muted); font-size: 13px; font-weight: 700; transition: all 0.3s; }
.pricing-tab:hover{ color: #fff; }
.pricing-tab.active{ background: var(--th-gold-500); color: #000; }
.pricing-pane{ display: none; }
.pricing-pane.active{ display: block; }
.pricing-item{ position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 32px; border-radius: 24px; background: var(--th-card); border: 1px solid var(--th-border); transition: all 0.3s; }
.pricing-item:hover{ border-color: rgba(212, 175, 55, 0.4); }
.pricing-item-popular{ z-index: 2; border: 2px solid var(--th-gold-500); background: linear-gradient(180deg, rgba(60, 48, 14, 0.5) 0%, var(--th-card) 55%); transform: scale(1.06); animation: float-pricing 4s ease-in-out infinite; }
.pricing-item-popular:hover{ border-color: var(--th-gold-400); }
.pricing-item-badge{ position: absolute; top: -14px; right: 24px; padding: 4px 12px; border-radius: 999px; color: #000; font-size: 11px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.pricing-item-sub{ margin-bottom: 8px; font-size: 15px; font-weight: 700; color: var(--th-gold-400); }
.pricing-item-title{ margin-bottom: 16px; font-size: 26px; font-weight: 700; color: #fff; }
.pricing-item-price{ margin-bottom: 24px; }
.pricing-item-amount{ font-size: 32px; font-weight: 800; color: #fff; }
.pricing-item-amount.gold-text{ color: transparent; }
.pricing-item-unit{ margin-left: 4px; font-size: 13px; color: var(--th-muted); }
.pricing-item-desc{ margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--th-border); font-size: 13px; color: var(--th-muted); }
.pricing-item-list{ margin-bottom: 32px; }
.pricing-item-list li{ margin-bottom: 12px; font-size: 13px; color: var(--th-text-2); }
.pricing-item-list i{ margin-right: 8px; color: var(--th-gold-500); }
.pricing-item-btn{ display: block; padding: 12px 0px; border-radius: 12px; border: 1px solid rgba(212, 175, 55, 0.4); color: var(--th-gold-400); font-size: 13px; font-weight: 700; text-align: center; }
.pricing-item-btn:hover{ background: var(--th-gold-500); color: #000; }
.pricing-item-btn-gold{ background: linear-gradient(135deg, #FCE082 0%, #D4AF37 50%, #B8860B 100%); border: 0px; color: #000; font-weight: 800; }
.pricing-item-btn-gold:hover{ box-shadow: var(--th-shadow-glow); }

/*
* BLOCK TEAM.
*/
.team-item{ position: relative; padding: 36px 24px 28px; border-radius: 22px; background: linear-gradient(180deg, var(--th-lighter) 0%, var(--th-card) 60%); border: 1px solid var(--th-border); text-align: center; overflow: hidden; transition: all 0.4s; }
.team-item:hover{ border-color: rgba(212, 175, 55, 0.5); transform: translateY(-8px); box-shadow: 0px 24px 50px rgba(0, 0, 0, 0.45); }
.team-item-avatar{ position: relative; width: 140px; height: 140px; margin: 0px auto 22px; padding: 4px; border-radius: 50%; background: var(--th-base); border: 2px solid rgba(212, 175, 55, 0.35); box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.4); transition: all 0.4s; }
.team-item:hover .team-item-avatar{ border-color: var(--th-gold-400); }
.team-item-avatar img{ display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.team-item-exp{ position: absolute; bottom: -6px; left: 50%; padding: 3px 12px; border-radius: 999px; background: var(--th-lighter); border: 1px solid var(--th-border); font-size: 11px; font-weight: 700; line-height: 18px; white-space: nowrap; color: var(--th-text); -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.team-item-name{ margin-bottom: 8px; font-size: 24px; font-weight: 700; color: #fff; }
.team-item-role{ margin-bottom: 16px; font-size: 14px; font-weight: 600; color: var(--th-gold-400); }
.team-item-desc{ margin-bottom: 20px; font-size: 15px; line-height: 1.7; color: var(--th-muted); }
.team-item-social{ padding-top: 18px; border-top: 1px solid var(--th-border); }
.team-item-social a{ display: inline-block; width: 36px; height: 36px; margin: 0px 5px; border-radius: 50%; background: var(--th-base); border: 1px solid var(--th-border); font-size: 16px; line-height: 34px; color: var(--th-text-2); transition: all 0.3s; }
.team-item-social a:hover{ background: var(--th-gold-400); border-color: var(--th-gold-400); color: #000; }
.team-card{ position: relative; overflow: hidden; padding: 56px 56px 0px; border-radius: 28px; border: 1px solid rgba(212, 175, 55, 0.55); background: radial-gradient(circle at 80% 30%, rgba(212, 175, 55, 0.14) 0%, transparent 45%), linear-gradient(135deg, #0b0d14 0%, #0f1220 100%); box-shadow: 0px 24px 60px rgba(0, 0, 0, 0.45); }
.team-card-left{ width: 55%; padding-bottom: 56px; }
.team-card-role{ display: block; margin-bottom: 14px; font-size: 17px; font-weight: 600; line-height: 1.5; letter-spacing: 0.02em; color: var(--th-gold-400); }
.team-card-role:before{ content: ""; display: inline-block; width: 36px; height: 2px; margin-right: 14px; vertical-align: middle; background: var(--th-gold-400); }
.team-card-name{ margin-bottom: 18px; font-size: 60px; font-weight: 800; line-height: 1.1; color: #fff; }
.team-card-quote{ margin-bottom: 18px; padding-left: 16px; border-left: 3px solid var(--th-gold-400); font-size: 18px; font-weight: 600; line-height: 1.6; color: #fff; }
.team-card-desc{ margin-bottom: 20px; font-size: 16px; font-weight: 500; line-height: 1.7; color: rgba(255, 255, 255, 0.88); }
.team-card-tags{ margin-bottom: 26px; }
.team-card-tags li{ float: left; margin: 0px 10px 10px 0px; padding: 6px 14px; border-radius: 8px; border: 1px solid var(--th-border); background: rgba(255, 255, 255, 0.04); font-size: 14px; font-weight: 700; line-height: 22px; color: #fff; }
.team-card-tags li:before{ content: "\f00c"; margin-right: 8px; font-family: "Font Awesome 6 Free"; font-size: 11px; font-weight: 900; color: var(--th-gold-400); }
.team-card-tags li.cboth{ float: none; margin: 0px; padding: 0px; border: 0px; background: none; }
.team-card-tags li.cboth:before{ display: none; }
.team-card-btn a{ display: inline-block; margin: 0px 12px 10px 0px; padding: 12px 24px; border-radius: 10px; font-size: 15px; font-weight: 700; line-height: 22px; transition: all 0.3s; }
.team-card-phone{ background: var(--th-gold-400); border: 1px solid var(--th-gold-400); color: #000; }
.team-card-email{ background: var(--th-base); border: 1px solid var(--th-border); color: #fff; }
.team-card-btn a:hover{ opacity: 0.85; }
.team-card-right{ width: 45%; padding-top: 10px; }
.team-card-photo{ position: relative; text-align: center; }
.team-card-photo:before{ content: ""; position: absolute; top: 5%; left: 10%; width: 80%; height: 80%; border-radius: 50%; background: radial-gradient(circle, rgba(212, 175, 55, 0.45) 0%, transparent 70%); }
.team-card-photo img{ position: relative; display: block; width: 100%; height: 620px; object-fit: contain; object-position: center bottom; -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent 100%); mask-image: linear-gradient(180deg, #000 70%, transparent 100%); }
.team-orbit{ position: absolute; top: 45%; left: 50%; width: 0px; height: 0px; }
.team-orbit-ring{ position: absolute; border-radius: 50%; border: 1px dashed rgba(212, 175, 55, 0.35); -webkit-animation: team-spin 40s linear infinite; animation: team-spin 40s linear infinite; }
.team-orbit-ring-out{ top: -230px; left: -230px; width: 460px; height: 460px; }
.team-orbit-ring-in{ top: -150px; left: -150px; width: 300px; height: 300px; border-color: rgba(212, 175, 55, 0.2); -webkit-animation-duration: 28s; animation-duration: 28s; -webkit-animation-direction: reverse; animation-direction: reverse; }
.team-orbit-ring li{ position: absolute; top: 50%; left: 50%; width: 46px; height: 46px; margin: -23px 0px 0px -23px; -webkit-transform: rotate(var(--a)) translateX(230px) rotate(calc(var(--a) * -1)); transform: rotate(var(--a)) translateX(230px) rotate(calc(var(--a) * -1)); }
.team-orbit-ring-in li{ width: 38px; height: 38px; margin: -19px 0px 0px -19px; -webkit-transform: rotate(var(--a)) translateX(150px) rotate(calc(var(--a) * -1)); transform: rotate(var(--a)) translateX(150px) rotate(calc(var(--a) * -1)); }
.team-orbit-ring li span{ display: block; width: 100%; height: 100%; border-radius: 50%; border: 1px solid rgba(212, 175, 55, 0.5); background: #14151C; box-shadow: 0px 0px 18px rgba(212, 175, 55, 0.25); color: var(--th-gold-400); font-size: 20px; line-height: 44px; text-align: center; -webkit-animation: team-spin 40s linear infinite reverse; animation: team-spin 40s linear infinite reverse; }
.team-orbit-ring-in li span{ font-size: 16px; line-height: 36px; -webkit-animation-duration: 28s; animation-duration: 28s; -webkit-animation-direction: normal; animation-direction: normal; }
@-webkit-keyframes team-spin{ to{ -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes team-spin{ to{ -webkit-transform: rotate(360deg); transform: rotate(360deg); } }/*
* BLOCK TESTIMONIAL.
*/
.testi-wrap{ position: relative; max-width: 1700px; margin: 0px auto; padding: 0px 0px 10px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%); }
.testi-slide{ padding: 0px 14px; outline: none; }
.testi-slider .slick-list{ padding-top: 36px !important; padding-bottom: 36px !important; }
.testi-slider .slick-track{ display: flex; align-items: stretch; }
.testi-slider .slick-slide{ height: auto; float: none; position: relative; z-index: 1; }
.testi-slider .slick-center{ z-index: 5; }
.testi-slider .slick-slide > div{ height: 100%; }
.testi-slider .testi-item{ height: 100%; opacity: 0.45; transform: scale(0.9); }
.testi-slider .slick-center .testi-item{ opacity: 1; transform: scale(1.1); padding: 36px 34px; border-color: rgba(212, 175, 55, 0.55); background: linear-gradient(180deg, rgba(60, 48, 14, 0.4) 0%, var(--th-card) 60%); }
.testi-slider .slick-dots{ margin-top: 28px; text-align: center; }
.testi-slider .slick-dots li{ display: inline-block; margin: 0px 5px; }
.testi-slider .slick-dots button{ display: block; width: 8px; height: 8px; padding: 0px; border: 0px; border-radius: 999px; background: var(--th-border); font-size: 0px; transition: all 0.3s; }
.testi-slider .slick-dots .slick-active button{ width: 28px; background: var(--th-gold-400); }
.testi-item{ position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 32px; border-radius: 24px; background: var(--th-card); border: 1px solid var(--th-border); transition: all 0.5s; }
.testi-item:hover{ border-color: rgba(212, 175, 55, 0.4); }
.testi-item-featured{ border-color: rgba(212, 175, 55, 0.4); }
.testi-item-stars{ margin-bottom: 16px; font-size: 15px; color: var(--th-gold-400); }
.testi-item-stars i{ margin-right: 4px; }
.testi-item-text{ margin-bottom: 24px; font-size: 15px; font-style: italic; line-height: 1.625; color: var(--th-text-2); }
.testi-item-author{ padding-top: 16px; border-top: 1px solid var(--th-border); }
.testi-item-avatar{ width: 48px; height: 48px; border-radius: 50%; background: rgba(212, 175, 55, 0.2); color: var(--th-gold-400); font-size: 20px; font-weight: 700; line-height: 48px; text-align: center; }
.testi-item-info{ margin-left: 64px; }
.testi-item-info h3{ font-size: 15px; font-weight: 700; color: #fff; }
.testi-item-info p{ font-size: 13px; color: var(--th-muted); }

/*
* BLOCK FAQ.
*/
.faq-left{ width: calc(38% - 24px); }
.faq-right{ width: calc(62% - 24px); }
.faq-left-inner{ position: sticky; top: 110px; }
.faq-left .block-item-title{ margin-bottom: 16px; font-size: 43px; }
.faq-desc{ margin-bottom: 32px; font-size: 17px; line-height: 1.7; color: var(--th-muted); }
.faq-help{ position: relative; padding: 28px; border-radius: 20px; background: linear-gradient(160deg, rgba(60, 48, 14, 0.55) 0%, var(--th-card) 70%); border: 1px solid rgba(212, 175, 55, 0.45); overflow: hidden; }
.faq-help-icon{ position: relative; margin-bottom: 16px; }
.faq-help-title{ position: relative; margin-bottom: 6px; font-size: 20px; font-weight: 800; color: #fff; }
.faq-help-desc{ position: relative; margin-bottom: 20px; font-size: 14px; line-height: 1.6; color: var(--th-text-2); }
.faq-help .btn-sm{ position: relative; }
.faq-help .btn-sm i{ margin-left: 8px; }
.faq-item{ position: relative; margin-bottom: 16px; border-radius: 18px; background: var(--th-card); border: 1px solid var(--th-border); overflow: hidden; transition: all 0.4s; }
.faq-item:before{ content: ""; position: absolute; top: 0px; left: 0px; width: 4px; height: 100%; background: linear-gradient(180deg, #FCE082, #B8860B); transform: scaleY(0); transform-origin: top; transition: transform 0.4s; }
.faq-item:hover{ border-color: rgba(212, 175, 55, 0.4); }
.faq-item.open{ border-color: rgba(212, 175, 55, 0.6); background: linear-gradient(180deg, rgba(60, 48, 14, 0.35) 0%, var(--th-card) 70%); }
.faq-item.open:before{ transform: scaleY(1); }
.faq-item-question{ position: relative; display: block; width: 100%; padding: 26px 76px 26px 28px; background: none; border: 0px; color: #fff; font-size: 19px; font-weight: 700; line-height: 1.5; text-align: left; }
.faq-item-num{ width: 44px; font-size: 24px; font-weight: 900; line-height: 1.3; color: transparent; -webkit-text-stroke: 1px rgba(250, 204, 21, 0.6); transition: all 0.3s; }
.faq-item.open .faq-item-num{ color: var(--th-gold-400); -webkit-text-stroke: 0px; }
.faq-item-text{ display: block; margin-left: 44px; transition: color 0.3s; }
.faq-item:hover .faq-item-text,
.faq-item.open .faq-item-text{ color: var(--th-gold-400); }
.faq-item-toggle{ position: absolute; top: 50%; right: 24px; width: 36px; height: 36px; margin-top: -18px; border-radius: 50%; border: 1px solid var(--th-gold-bd-30); color: var(--th-gold-400); font-size: 14px; line-height: 34px; text-align: center; transition: all 0.3s; }
.faq-item.open .faq-item-toggle{ background: var(--th-gold-400); border-color: var(--th-gold-400); color: #000; transform: rotate(135deg); }
.faq-item-answer{ display: none; margin: 0px 28px 0px 72px; padding: 0px 0px 26px; font-size: 17px; line-height: 1.75; color: var(--th-text-2); }

/*
* BLOCK CONTACT.
*/
.contact-left{ width: calc(41.6667% - 24px); }
.contact-right{ width: calc(58.3333% - 24px); }
.contact-left .block-item-title{ margin-bottom: 24px; }
.contact-desc{ margin-bottom: 32px; font-size: 15px; line-height: 1.625; color: var(--th-muted); }
.contact-info-item{ margin-bottom: 24px; }
.contact-info-text{ margin-left: 64px; }
.contact-info-text h3{ margin-bottom: 4px; font-size: 15px; font-weight: 700; color: #fff; }
.contact-info-text p{ font-size: 13px; line-height: 1.625; color: var(--th-muted); }
.contact-hours{ margin-top: 32px; padding: 16px; border-radius: 16px; background: var(--th-card); border: 1px solid var(--th-border); }
.contact-hours i{ margin: 4px 12px 0px 0px; font-size: 22px; color: var(--th-gold-400); }
.contact-hours-text{ margin-left: 36px; font-size: 13px; }
.contact-hours-text strong{ display: block; color: #fff; }
.contact-hours-text span{ color: var(--th-muted); }
.contact-form-card{ padding: 32px; border-radius: 24px; background: var(--th-card); border: 1px solid var(--th-gold-bd-30); }
.contact-form-title{ margin-bottom: 8px; font-size: 26px; font-weight: 700; color: #fff; }
.contact-form-desc{ margin-bottom: 32px; font-size: 13px; color: var(--th-muted); }
.form-toast{ display: none; margin-bottom: 24px; padding: 16px; border-radius: 12px; background: rgba(34, 197, 94, 0.2); border: 1px solid rgba(34, 197, 94, 0.5); color: #86EFAC; font-size: 13px; font-weight: 600; }
.form-toast i{ margin-right: 12px; font-size: 18px; }
.form-toast.error{ background: rgba(239, 68, 68, 0.2); border-color: rgba(239, 68, 68, 0.5); color: #FCA5A5; }
.form-row{ margin-bottom: 20px; }
.form-half{ width: calc(50% - 10px); }
.contact-form label{ display: block; margin-bottom: 8px; font-size: 13px; font-weight: 700; color: var(--th-text-2); }
.contact-form input[type="text"],
.contact-form input[type="tel"],
.contact-form input[type="email"],
.contact-form select,
.contact-form textarea{ display: block; width: 100%; padding: 12px 16px; border-radius: 12px; background: var(--th-base); border: 1px solid var(--th-border); color: #fff; font-size: 13px; outline: none; transition: border-color 0.3s; }
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{ border-color: var(--th-gold-500); }
.contact-form textarea{ resize: vertical; }
.form-hp{ position: absolute; left: -9999px; }
.form-submit{ display: block; width: 100%; padding: 16px 0px; border: 0px; border-radius: 12px; color: #000; font-size: 15px; font-weight: 800; transition: all 0.3s; }
.form-submit:hover{ box-shadow: var(--th-shadow-glow); }
.form-submit i{ margin-right: 8px; }
.form-submit.loading{ opacity: 0.6; pointer-events: none; }
.contact-form .wpcf7-form:after{ content: ""; display: block; clear: both; }
.contact-form .wpcf7-form > label{ margin-bottom: 20px; }
.contact-form .wpcf7-form > label:nth-of-type(-n+4){ float: left; width: calc(50% - 10px); }
.contact-form .wpcf7-form > label:nth-of-type(odd):nth-of-type(-n+4){ margin-right: 20px; }
.contact-form .wpcf7-form > label:nth-of-type(5){ clear: both; }
.contact-form .wpcf7-form > p{ margin-bottom: 20px; }
.contact-form .wpcf7-form br{ display: none; }
.contact-form .wpcf7-form-control-wrap{ display: block; }
.contact-form label{ margin-bottom: 0px; font-size: 15px; letter-spacing: 0.02em; color: #fff; }
.contact-form label .wpcf7-form-control-wrap{ margin-top: 8px; }
.contact-form input[type="text"],
.contact-form input[type="tel"],
.contact-form input[type="email"],
.contact-form select,
.contact-form textarea{ padding: 14px 18px; border-radius: 12px; background-color: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.1); font-family: inherit; font-size: 14px; }
.contact-form input::-webkit-input-placeholder,
.contact-form textarea::-webkit-input-placeholder{ color: rgba(255, 255, 255, 0.35); }
.contact-form input::placeholder,
.contact-form textarea::placeholder{ color: rgba(255, 255, 255, 0.35); }
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{ background-color: rgba(212, 175, 55, 0.06); box-shadow: 0px 0px 0px 3px rgba(212, 175, 55, 0.15); }
.contact-form select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; padding-right: 44px; cursor: pointer; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>"); background-repeat: no-repeat; background-position: right 18px center; }
.contact-form select option{ background: #14151C; color: #fff; }
.contact-form textarea{ height: 120px; }
.contact-form input[type="submit"]{ margin-top: 4px; }
.contact-form input[type="submit"]:hover{ -webkit-transform: translateY(-2px); transform: translateY(-2px); }
.contact-form input[type="submit"],
.footer-newsletter input[type="submit"]{ display: block; width: 100%; padding: 16px 0px; border: 0px; border-radius: 12px; background: linear-gradient(135deg, var(--th-gold-400), var(--th-gold-500)); color: #000; font-size: 15px; font-weight: 800; cursor: pointer; transition: all 0.3s; }
.contact-form input[type="submit"]:hover,
.footer-newsletter input[type="submit"]:hover{ box-shadow: var(--th-shadow-glow); }
.footer-newsletter input[type="submit"]{ padding: 0px; line-height: 40px; border-radius: 8px; font-size: 13px; font-weight: 700; }
.footer-newsletter .wpcf7-form p{ margin-bottom: 8px; }
.footer-newsletter label{ display: block; margin-bottom: 6px; font-size: 12px; font-weight: 700; color: var(--th-text-2); }
.footer-newsletter select,
.footer-newsletter textarea{ display: block; width: 100%; padding: 10px 14px; border-radius: 8px; background: var(--th-card); border: 1px solid var(--th-border); color: #fff; font-size: 13px; outline: none; }
.wpcf7 form .wpcf7-response-output{ margin: 16px 0px 0px; padding: 12px 16px; border-radius: 12px; font-size: 13px; color: var(--th-text-2); }
.wpcf7-not-valid-tip{ margin-top: 6px; font-size: 12px; color: #FCA5A5; }
.wpcf7-spinner{ display: none; }

/*
* FOOTER.
*/
.footer{ padding: 64px 0px 48px; background: var(--th-base); border-top: 1px solid var(--th-border); }
.footer-top{ padding-bottom: 48px; border-bottom: 1px solid var(--th-border); }
.footer-col{ float: left; width: calc((100% - 160px) / 5); margin-right: 40px; }
.footer-col-brand{ width: calc((100% - 160px) * 2 / 5 + 40px); }
.footer-col:nth-child(4){ margin-right: 0px; }
.footer-logo{ display: block; margin-bottom: 16px; }
.footer-logo img{ display: block; width: auto; height: 44px; }
.footer-about{ padding-right: 24px; margin-bottom: 16px; font-size: 13px; line-height: 1.625; color: var(--th-muted); }
.footer-social a{ display: inline-block; width: 36px; height: 36px; margin-right: 16px; border-radius: 8px; background: var(--th-card); border: 1px solid var(--th-border); color: var(--th-muted); line-height: 34px; text-align: center; }
.footer-social a:hover{ color: var(--th-gold-400); border-color: rgba(212, 175, 55, 0.5); }
.footer-title{ margin-bottom: 16px; font-size: 15px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: #fff; }
.footer-menu li{ margin-bottom: 10px; font-size: 13px; }
.footer-menu a{ color: var(--th-muted); }
.footer-menu a:hover{ color: var(--th-gold-400); }
.footer-newsletter-desc{ margin-bottom: 16px; font-size: 13px; color: var(--th-muted); }
.footer-newsletter input{ display: block; width: 100%; margin-bottom: 8px; padding: 10px 14px; border-radius: 8px; background: var(--th-card); border: 1px solid var(--th-border); color: #fff; font-size: 13px; outline: none; }
.footer-newsletter input:focus{ border-color: var(--th-gold-500); }
.footer-newsletter .btn-gold{ display: block; width: 100%; padding: 0px; line-height: 40px; border-radius: 8px; font-size: 13px; font-weight: 700; }
.footer-bottom{ padding-top: 32px; font-size: 13px; color: var(--th-muted); }
.footer-policy a{ margin-left: 24px; }
.footer-policy a:hover{ color: var(--th-gold-400); }

/*
* PAGE BANNER.
*/
.page-banner{ padding: 160px 0px 64px; text-align: center; background: var(--th-lighter); border-bottom: 1px solid var(--th-border); background-size: cover; background-position: center; }
.page-banner-title{ margin-bottom: 12px; font-size: 43px; font-weight: 800; line-height: 1.2; color: #fff; }
.page-banner-breadcrumb{ font-size: 14px; color: var(--th-muted); }
.page-banner-breadcrumb a:hover{ color: var(--th-gold-400); }
.page-banner-breadcrumb i{ margin: 0px 10px; font-size: 11px; color: var(--th-gold-500); }

/*
* TAXONOMY / POST ITEM.
*/
.post-item{ border-radius: 16px; background: var(--th-card); border: 1px solid var(--th-border); overflow: hidden; transition: all 0.3s; }
.post-item:hover{ border-color: rgba(212, 175, 55, 0.5); transform: translateY(-4px); }
.post-item-thumb{ position: relative; padding-top: 62%; background-color: var(--th-base); transition: all 0.4s; }
.post-item-thumb i{ position: absolute; top: 50%; left: 50%; margin: -16px 0px 0px -16px; font-size: 34px; color: var(--th-border); }
.post-item-info{ padding: 24px; }
.post-item-meta{ margin-bottom: 8px; font-size: 13px; color: var(--th-muted); }
.post-item-meta i{ margin-right: 6px; color: var(--th-gold-500); }
.post-item-title{ margin-bottom: 8px; font-size: 20px; font-weight: 700; line-height: 1.4; color: #fff; }
.post-item-title a:hover{ color: var(--th-gold-400); }
.post-item-excerpt{ margin-bottom: 16px; font-size: 14px; line-height: 1.625; color: var(--th-muted); }
.post-item-more{ font-size: 13px; font-weight: 700; color: var(--th-gold-400); }
.post-item-more i{ margin-left: 6px; font-size: 11px; transition: margin 0.3s; }
.post-item-more:hover i{ margin-left: 10px; }
.block-news-more{ margin-top: 48px; }
.block-news-more .btn-gold{ display: inline-block; min-width: 240px; text-align: center; }
.block-news-more .btn-gold i{ margin-left: 8px; transition: margin 0.3s; }
.block-news-more .btn-gold:hover i{ margin-left: 14px; }
.pagination{ margin-top: 56px; }
.pagination .page-numbers{ display: inline-block; min-width: 40px; height: 40px; margin: 0px 4px; padding: 0px 12px; border-radius: 10px; background: var(--th-card); border: 1px solid var(--th-border); color: var(--th-text-2); font-size: 15px; line-height: 38px; text-align: center; }
.pagination a.page-numbers:hover,
.pagination .page-numbers.current{ background: var(--th-gold-500); border-color: var(--th-gold-500); color: #000; font-weight: 700; }

/*
* SINGLE.
*/
.single-left{ width: calc(70% - 24px); }
.single-right{ width: calc(30% - 24px); }
.single-meta{ margin-bottom: 24px; font-size: 14px; color: var(--th-muted); }
.single-meta span{ margin-right: 20px; }
.single-meta i{ margin-right: 6px; color: var(--th-gold-500); }
.single-meta a:hover{ color: var(--th-gold-400); }
.single-content{ font-size: 18px; line-height: 1.8; color: var(--th-text-2); }
.single-content p{ margin-bottom: 20px; }
.single-content h2,
.single-content h3,
.single-content h4{ margin: 32px 0px 16px; font-weight: 700; line-height: 1.3; color: #fff; }
.single-content h2{ font-size: 30px; }
.single-content h3{ font-size: 24px; }
.single-content h4{ font-size: 20px; }
.single-content a{ color: var(--th-gold-400); text-decoration: underline; }
.single-content ul,
.single-content ol{ margin: 0px 0px 20px 24px; }
.single-content ul{ list-style: disc; }
.single-content ol{ list-style: decimal; }
.single-content li{ margin-bottom: 6px; }
.single-content img{ border-radius: 12px; }
.single-content blockquote{ margin: 24px 0px; padding: 16px 24px; border-left: 3px solid var(--th-gold-500); background: var(--th-card); border-radius: 0px 12px 12px 0px; font-style: italic; }
.single-content table{ width: 100%; margin-bottom: 20px; border-collapse: collapse; }
.single-content th,
.single-content td{ padding: 10px 14px; border: 1px solid var(--th-border); }
.single-content th{ background: var(--th-card); color: #fff; }
.single-content .alignleft{ float: left; margin: 0px 20px 12px 0px; }
.single-content .alignright{ float: right; margin: 0px 0px 12px 20px; }
.single-content .aligncenter{ display: block; margin: 0px auto 20px; }
.single-content .wp-caption{ max-width: 100%; }
.single-content .wp-caption-text{ font-size: 13px; color: var(--th-muted); text-align: center; }
.single-related{ margin-top: 64px; }
.single-related-title{ margin-bottom: 28px; font-size: 26px; font-weight: 700; color: #fff; }

/*
* SIDEBAR / SEARCH FORM.
*/
.sidebar-widget{ margin-bottom: 24px; padding: 24px; border-radius: 16px; background: var(--th-card); border: 1px solid var(--th-border); }
.sidebar-title{ margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--th-border); font-size: 18px; font-weight: 700; color: #fff; }
.sidebar-list li{ margin-bottom: 12px; font-size: 15px; line-height: 1.5; color: var(--th-text-2); }
.sidebar-list li a:hover{ color: var(--th-gold-400); }
.sidebar-list li span{ display: block; font-size: 13px; color: var(--th-muted); }
.sidebar-cat li{ color: var(--th-muted); }
.search-form{ position: relative; max-width: 480px; }
.sidebar .search-form{ max-width: none; }
.search-form input[type="search"]{ display: block; width: 100%; padding: 12px 48px 12px 16px; border-radius: 12px; background: var(--th-base); border: 1px solid var(--th-border); color: #fff; font-size: 15px; outline: none; }
.search-form input[type="search"]:focus{ border-color: var(--th-gold-500); }
.search-form button{ position: absolute; top: 0px; right: 0px; width: 48px; height: 100%; background: none; border: 0px; color: var(--th-gold-400); font-size: 15px; }

/*
* PAGE 404.
*/
.page-404{ padding-top: 80px; }
.page-404-code{ display: inline-block; font-size: 146px; font-weight: 900; line-height: 1.1; }
.page-404-title{ margin-bottom: 12px; font-size: 34px; font-weight: 800; color: #fff; }
.page-404-desc{ max-width: 520px; margin: 0px auto 28px; color: var(--th-muted); }
.page-404 .search-form{ margin: 0px auto 28px; }

/*
* BLOCK AUDIT / GROWTH / FORECAST / CTA.
*/
:root{ --th-red: #EF4444; }
.block-item-badge-left:before,
.block-item-badge-left:after{ display: none; }
.audit-left,
.growth-left,
.forecast-left{ width: calc(40% - 30px); padding-top: 20px; }
.audit-right{ width: calc(60% - 30px); }
.growth-right{ width: calc(60% - 30px); }
.forecast-right{ width: calc(60% - 30px); }
.audit-left .block-item-title,
.growth-left .block-item-title,
.forecast-left .block-item-title{ margin-bottom: 16px; font-size: 41px; }
.audit-desc{ margin-bottom: 28px; font-size: 17px; line-height: 1.7; color: var(--th-muted); }
.audit-note{ margin-top: 14px; font-size: 12px; color: var(--th-muted); }
.audit-left .hero-form{ max-width: 560px; }
.audit-left .hero-form input,
.audit-proof{ margin-top: 22px; }
.audit-proof-avatar span{ display: inline-block; width: 34px; height: 34px; margin-right: -8px; border-radius: 50%; background: #2A2514; border: 2px solid var(--th-base); color: var(--th-gold-400); font-size: 13px; font-weight: 800; line-height: 30px; text-align: center; }
.audit-proof-text{ margin-left: 150px; font-size: 14px; line-height: 34px; color: var(--th-text-2); }
.audit-proof-text strong{ color: var(--th-gold-400); }
.audit-card{ padding: 32px; border-radius: 24px; background: linear-gradient(160deg, rgba(48, 38, 12, 0.5) 0%, var(--th-card) 55%); border: 1px solid rgba(212, 175, 55, 0.4); }
.audit-card-top{ margin-bottom: 24px; }
.audit-score{ width: 180px; text-align: center; }
.audit-score-ring{ position: relative; width: 170px; height: 170px; margin: 0px auto 10px; }
.audit-score-ring svg{ display: block; width: 100%; height: 100%; }
.audit-ring-bg{ fill: none; stroke: var(--th-border); stroke-width: 10; }
.audit-ring-fill{ fill: none; stroke: url(#auditGrad); stroke-width: 10; stroke-linecap: round; }
.audit-score-text{ position: absolute; top: 50%; left: 0px; width: 100%; margin-top: -30px; }
.audit-score-text strong{ display: block; font-size: 54px; font-weight: 800; line-height: 1.1; color: #fff; }
.audit-score-text span{ display: block; font-size: 14px; color: var(--th-muted); }
.audit-score-label{ font-size: 13px; font-weight: 800; letter-spacing: 0.1em; color: var(--th-gold-400); }
.audit-issues{ margin-left: 210px; padding-top: 6px; }
.audit-issues-title{ margin-bottom: 18px; font-size: 15px; font-weight: 700; color: #fff; }
.audit-issue{ margin-bottom: 16px; }
.audit-issue-head{ overflow: hidden; margin-bottom: 6px; font-size: 14px; font-weight: 600; color: var(--th-text-2); }
.audit-issue-head .fright{ font-weight: 800; color: #fff; }
.audit-issue-bar{ height: 6px; border-radius: 999px; background: var(--th-border); overflow: hidden; }
.audit-issue-bar span{ display: block; height: 100%; border-radius: 999px; background: var(--th-green); }
.issue-yellow .audit-issue-bar span{ background: var(--th-yellow); }
.issue-orange .audit-issue-bar span{ background: var(--th-orange); }
.issue-red .audit-issue-bar span{ background: var(--th-red); }
.audit-alert{ padding: 16px 18px; border-radius: 14px; background: rgba(250, 204, 21, 0.08); border: 1px solid rgba(250, 204, 21, 0.3); }
.audit-alert .icon-box{ border: 0px; }
.audit-alert-info{ margin-left: 56px; }
.audit-alert-info strong{ display: block; font-size: 15px; color: var(--th-gold-400); }
.audit-alert-info span{ font-size: 13px; color: var(--th-muted); }
.growth-chart{ width: calc(62% - 10px); padding: 24px; border-radius: 20px; background: var(--th-card); border: 1px solid var(--th-border); }
.growth-keyword{ width: calc(38% - 10px); padding: 24px; border-radius: 20px; background: var(--th-card); border: 1px solid var(--th-border); }
.growth-stat{ margin-right: 40px; margin-bottom: 14px; }
.growth-stat-label{ display: block; font-size: 13px; color: var(--th-muted); }
.growth-stat-number{ display: inline-block; font-size: 34px; font-weight: 800; line-height: 1.2; color: #fff; }
.growth-stat-number em{ margin-left: 4px; font-size: 13px; font-style: normal; font-weight: 500; color: var(--th-muted); }
.growth-stat-up{ margin-left: 8px; font-size: 14px; font-weight: 800; color: var(--th-green); }
.growth-stat-up i{ margin-right: 4px; }
.growth-chart-svg svg{ display: block; width: 100%; height: 190px; }
.growth-chart-svg polyline{ fill: none; stroke-width: 2.5; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.growth-chart-svg .grid line{ stroke: var(--th-border); stroke-width: 1; vector-effect: non-scaling-stroke; }
.growth-line-now{ stroke: var(--th-muted); stroke-dasharray: 5 5; }
.growth-line-pot{ stroke: var(--th-gold-400); stroke-width: 3; }
.growth-chart-x{ margin-top: 8px; display: flex; justify-content: space-between; font-size: 12px; color: var(--th-muted); }
.growth-keyword-title{ margin-bottom: 16px; font-size: 18px; font-weight: 700; color: #fff; }
.growth-keyword li{ padding: 12px 0px; border-bottom: 1px dashed var(--th-border); font-size: 14px; color: var(--th-text-2); }
.growth-keyword li:last-child{ border-bottom: 0px; }
.growth-keyword li i{ margin: 3px 10px 0px 0px; color: var(--th-green); }
.growth-keyword li .fright{ font-weight: 800; color: var(--th-gold-400); }
.forecast-tabs{ margin-bottom: 24px; padding: 5px; display: inline-block; border-radius: 12px; background: var(--th-card); border: 1px solid var(--th-border); }
.forecast-tab{ padding: 10px 20px; border: 0px; border-radius: 8px; background: transparent; color: var(--th-muted); font-size: 14px; font-weight: 700; transition: all 0.3s; }
.forecast-tab:hover{ color: #fff; }
.forecast-tab.active{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; }
.forecast-left .btn-sm{ display: block; width: 240px; }
.forecast-left .btn-sm i{ margin-left: 8px; }
.forecast-card{ position: relative; padding: 28px; border-radius: 22px; background: var(--th-card); border: 1px solid var(--th-border); }
.forecast-now{ width: calc(50% - 10px); border-width: 2px; }
.forecast-future{ width: calc(50% - 10px); border: 2px solid var(--th-gold-500); background: linear-gradient(160deg, rgba(60, 48, 14, 0.5) 0%, var(--th-card) 60%); }
.forecast-badge{ position: absolute; top: -13px; right: 22px; padding: 3px 14px; border-radius: 999px; background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.forecast-card-title{ margin-bottom: 22px; font-size: 20px; font-weight: 700; color: #fff; }
.forecast-card-title span{ color: var(--th-gold-400); }
.forecast-row{ margin-bottom: 20px; }
.forecast-row:last-child{ margin-bottom: 0px; }
.forecast-row:after{ content: ""; display: block; clear: both; }
.forecast-row-info{ margin-left: 54px; }
.forecast-row-info span{ display: block; font-size: 13px; color: var(--th-muted); }
.forecast-row-info strong{ font-size: 28px; font-weight: 800; line-height: 1.2; color: #fff; }
.forecast-row-info strong b{ font-weight: 800; }
.forecast-row-info em{ margin-left: 4px; font-size: 13px; font-style: normal; font-weight: 500; color: var(--th-muted); }
.forecast-up{ margin-top: 20px; font-size: 15px; font-weight: 800; color: var(--th-green); }

/*
* BLOCK SCAN.
*/
.block-scan{ padding: 0px 0px 70px; }
.scan-wrap{ padding: 44px 48px; border-radius: 24px; background: linear-gradient(135deg, rgba(40, 32, 10, 0.55) 0%, rgba(11, 12, 16, 0.95) 55%); border: 1px solid var(--th-border); overflow: hidden; }
.scan-left{ width: calc(44% - 20px); }
.scan-right{ width: calc(56% - 20px); }
.scan-eyebrow{ margin-bottom: 18px; font-size: 14px; }
.scan-eyebrow strong{ margin-right: 16px; font-weight: 800; letter-spacing: 0.1em; color: var(--th-gold-400); }
.scan-eyebrow span{ color: var(--th-text-2); }
.scan-eyebrow em{ font-style: normal; }
.scan-dot{ display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--th-gold-400); animation: ping 1.4s cubic-bezier(0, 0, 0.2, 1) infinite; }
.scan-title{ margin-bottom: 14px; font-size: 43px; font-weight: 800; line-height: 1.2; color: #fff; }
.scan-title span{ display: block; }
.scan-desc{ margin-bottom: 26px; font-size: 15px; line-height: 1.7; color: var(--th-text-2); }
.scan-progress{ margin-bottom: 26px; }
.scan-progress-bar{ height: 10px; border-radius: 999px; background: var(--th-border); overflow: hidden; }
.scan-progress-bar span{ display: block; width: 0%; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #B8860B, #FACC15); }
.scan-progress-text{ margin-top: 8px; text-align: right; font-size: 13px; font-weight: 700; color: var(--th-text-2); }
.scan-step{ float: left; width: 25%; padding-right: 10px; font-size: 13px; line-height: 1.4; color: var(--th-muted); transition: color 0.4s; }
.scan-step strong{ display: block; margin-top: 8px; font-weight: 600; color: inherit; }
.scan-step em{ display: block; font-style: normal; }
.scan-step-icon{ display: block; width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--th-border); color: transparent; font-size: 13px; line-height: 26px; text-align: center; transition: all 0.4s; }
.scan-step.done{ color: var(--th-text-2); }
.scan-step.done .scan-step-icon{ border-color: var(--th-gold-400); color: var(--th-gold-400); }
.scan-step.active{ color: #fff; }
.scan-step.active .scan-step-icon{ border-color: var(--th-gold-400); background: radial-gradient(circle, var(--th-gold-400) 0 5px, transparent 6px); }
.scan-radar{ position: relative; width: 44%; height: 320px; }
.scan-radar-ring{ position: absolute; top: 50%; left: 50%; border-radius: 50%; }
.ring-1{ width: 250px; height: 250px; margin: -125px 0px 0px -125px; border: 1px solid rgba(212, 175, 55, 0.25); border-top-color: var(--th-gold-400); border-right-color: rgba(250, 204, 21, 0.6); animation: spin 4s linear infinite; }
.ring-2{ width: 196px; height: 196px; margin: -98px 0px 0px -98px; border: 1px dashed rgba(212, 175, 55, 0.3); animation: spin 9s linear infinite reverse; }
.scan-radar-core{ position: absolute; top: 50%; left: 50%; width: 150px; margin: -62px 0px 0px -75px; text-align: center; }
.scan-radar-core i{ display: block; width: 62px; height: 62px; margin: 0px auto 10px; border-radius: 50%; background: rgba(11, 12, 16, 0.8); border: 1px solid var(--th-gold-bd-30); color: var(--th-gold-400); font-size: 26px; line-height: 60px; }
.scan-radar-core strong{ display: block; font-size: 13px; letter-spacing: 0.08em; color: #fff; }
.scan-radar-core span{ display: block; font-size: 11px; color: var(--th-muted); }
.scan-card{ width: 56%; padding: 18px 20px; border-radius: 16px; background: rgba(18, 20, 28, 0.9); border: 1px solid var(--th-border); }
.scan-card-head{ margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--th-border); font-size: 15px; font-weight: 600; color: #fff; }
.scan-card-head i{ margin-right: 10px; color: var(--th-green); }
.scan-row{ margin-bottom: 14px; }
.scan-row:last-child{ margin-bottom: 0px; }
.scan-row:after{ content: ""; display: block; clear: both; }
.scan-row-icon{ width: 34px; height: 34px; border-radius: 50%; background: #1E2230; color: var(--th-muted); font-size: 14px; line-height: 34px; text-align: center; transition: all 0.4s; }
.scan-row-state{ width: 22px; height: 22px; margin-top: 6px; border-radius: 50%; border: 1.5px solid var(--th-border); color: transparent; font-size: 12px; line-height: 19px; text-align: center; transition: all 0.4s; }
.scan-row-info{ margin: 0px 34px 0px 46px; }
.scan-row-info > span{ display: block; margin-bottom: 6px; font-size: 13px; color: var(--th-text-2); }
.scan-row-bar{ height: 4px; border-radius: 999px; background: var(--th-border); overflow: hidden; }
.scan-row-bar span{ display: block; width: 0%; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #B8860B, #FACC15); }
.scan-row.done .scan-row-icon{ background: rgba(34, 197, 94, 0.2); color: var(--th-green); }
.scan-row.done .scan-row-state{ border-color: transparent; color: var(--th-green); }
.scan-row.active .scan-row-icon{ background: rgba(250, 204, 21, 0.18); color: var(--th-gold-400); }
.scan-row.active .scan-row-state{ border-color: var(--th-border); border-top-color: var(--th-gold-400); animation: spin 0.9s linear infinite; }

/* Scan form and result. */
.scan-form{ max-width: 460px; margin-bottom: 8px; }
.scan-form input{ width: calc(100% - 140px); }
.scan-form .hero-form-icon{ top: 30px; }
.scan-form .btn-gold{ padding: 0px 18px; }
.scan-keyword{ position: relative; margin-top: 6px; border-top: 1px solid var(--th-border); }
.scan-keyword i{ position: absolute; top: 50%; left: 20px; margin-top: -7px; font-size: 14px; color: var(--th-muted); }
.scan-keyword input{ float: none; display: block; width: 100%; height: 42px; padding: 0px 16px 0px 44px; background: transparent; border: 0px; color: #fff; font-size: 14px; outline: none; }
.scan-form .btn-gold:disabled{ opacity: 0.6; cursor: wait; transform: none; }
.scan-msg{ display: none; margin-bottom: 14px; font-size: 13px; font-weight: 600; color: #FCA5A5; }
.scan-left .scan-progress{ margin-top: 18px; }
.scan-row-score{ float: right; margin-left: 10px; font-size: 13px; font-weight: 800; color: #fff; }
.scan-row.level-good .scan-row-icon{ background: rgba(34, 197, 94, 0.2); color: var(--th-green); }
.scan-row.level-good .scan-row-bar span{ background: var(--th-green); }
.scan-row.level-good .scan-row-state{ color: var(--th-green); }
.scan-row.level-mid .scan-row-icon{ background: rgba(245, 158, 11, 0.2); color: var(--th-orange); }
.scan-row.level-mid .scan-row-bar span{ background: var(--th-orange); }
.scan-row.level-mid .scan-row-state{ color: var(--th-orange); }
.scan-row.level-bad .scan-row-icon{ background: rgba(239, 68, 68, 0.2); color: var(--th-red); }
.scan-row.level-bad .scan-row-bar span{ background: var(--th-red); }
.scan-row.level-bad .scan-row-state{ color: var(--th-red); }
.scan-result{ display: none; margin-top: 36px; padding: 30px 32px; border-radius: 20px; background: rgba(18, 20, 28, 0.85); border: 1px solid rgba(212, 175, 55, 0.35); }
.scan-result.is-open{ display: flex; align-items: center; gap: 36px; animation: fade-up 0.5s ease; }
.scan-result-score{ flex: 0 0 150px; text-align: center; }
.scan-result-number{ position: relative; width: 138px; height: 138px; margin: 0px auto 12px; border-radius: 50%; border: 7px solid var(--th-green); }
.scan-result-number.level-mid{ border-color: var(--th-orange); }
.scan-result-number.level-bad{ border-color: var(--th-red); }
.scan-result-number strong{ position: absolute; top: 50%; left: 0px; width: 100%; margin-top: -30px; font-size: 48px; font-weight: 800; line-height: 1.1; color: #fff; }
.scan-result-number span{ position: absolute; top: 50%; left: 0px; width: 100%; margin-top: 20px; font-size: 14px; color: var(--th-muted); }
.scan-result-score em{ display: inline-block; padding: 3px 16px; border-radius: 999px; font-size: 13px; font-weight: 800; font-style: normal; color: #000; background: var(--th-green); }
.scan-result-score em.level-mid{ background: var(--th-orange); }
.scan-result-score em.level-bad{ background: var(--th-red); color: #fff; }
.scan-result-info{ flex: 1 1 auto; min-width: 0px; }
.scan-result-title{ margin-bottom: 14px; font-size: 22px; font-weight: 700; color: #fff; }
.scan-result-issues li{ display: block; margin-bottom: 10px; padding: 10px 14px; border-radius: 10px; background: rgba(11, 12, 16, 0.6); border: 1px solid var(--th-border); font-size: 14px; line-height: 1.5; color: var(--th-text-2); }
.scan-result-issues li b{ display: inline-block; min-width: 78px; margin-right: 12px; padding: 2px 10px; border-radius: 6px; background: var(--th-gold-bg-10); color: var(--th-gold-400); font-size: 12px; font-weight: 800; text-align: center; }
.scan-result-meta{ margin-top: 12px; font-size: 12px; line-height: 1.6; color: var(--th-muted); }
.scan-result-cta{ flex: 0 0 auto; white-space: nowrap; }
.scan-result-cta i{ margin-left: 8px; }

/*
* ANIMATION.
*/
@keyframes pulse-gold{
    0%, 100%{ opacity: 0.3; transform: scale(1); }
    50%{ opacity: 0.6; transform: scale(1.05); }
}
@keyframes float-pricing{
    0%, 100%{ transform: scale(1.06) translateY(0px); }
    50%{ transform: scale(1.06) translateY(-14px); }
}
@keyframes float-shadow{
    0%, 100%{ opacity: 1; transform: scaleX(1); }
    50%{ opacity: 0.4; transform: scaleX(0.8); }
}
@keyframes float-y{
    0%, 100%{ transform: translateY(0px); }
    50%{ transform: translateY(-8px); }
}
@keyframes fade-up{
    from{ opacity: 0; transform: translateY(16px); }
    to{ opacity: 1; transform: translateY(0px); }
}
@keyframes spin{
    from{ transform: rotate(0deg); }
    to{ transform: rotate(360deg); }
}
@keyframes ping{
    75%, 100%{ transform: scale(2); opacity: 0; }
}

/*
* BLOCK SHOWCASE.
*/
.block-showcase{ overflow: hidden; background: repeating-radial-gradient(circle at 50% 60%, transparent 0px, transparent 30px, rgba(212, 175, 55, 0.05) 31px, transparent 32px); }
.block-showcase .block-item-head{ margin-bottom: 48px; }
.block-showcase-sub{ margin-top: 12px; font-size: 16px; line-height: 1.7; color: var(--th-text-2); }
.showcase-stage{ position: relative; overflow: hidden; height: 660px; -webkit-perspective: 2000px; perspective: 2000px; }
.showcase-stage:after{ content: ""; position: absolute; left: 0px; right: 0px; bottom: 0px; height: 50%; background: linear-gradient(180deg, transparent, var(--th-base) 95%); pointer-events: none; z-index: 20; }
.showcase-card{ position: absolute; top: 30px; left: 50%; width: 360px; height: 640px; margin-left: -180px; border-radius: 6px; background: #fff; box-shadow: 0px 24px 70px rgba(0, 0, 0, 0.6); overflow: hidden; cursor: pointer; opacity: 0; -webkit-transform-origin: center bottom; transform-origin: center bottom; transition: transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.7s; }
.showcase-card.no-anim{ transition: none; }
.showcase-card[data-pos="0"]{ opacity: 1; z-index: 10; cursor: default; -webkit-transform: translateZ(60px) scale(1.04); transform: translateZ(60px) scale(1.04); }
.showcase-card[data-pos="-1"]{ opacity: 1; z-index: 8; -webkit-transform: translateX(-320px) translateY(18px) rotateY(-24deg) scale(0.94); transform: translateX(-320px) translateY(18px) rotateY(-24deg) scale(0.94); }
.showcase-card[data-pos="1"]{ opacity: 1; z-index: 8; -webkit-transform: translateX(320px) translateY(18px) rotateY(24deg) scale(0.94); transform: translateX(320px) translateY(18px) rotateY(24deg) scale(0.94); }
.showcase-card[data-pos="-2"]{ opacity: 1; z-index: 6; -webkit-transform: translateX(-560px) translateY(40px) rotateY(-38deg) scale(0.86); transform: translateX(-560px) translateY(40px) rotateY(-38deg) scale(0.86); }
.showcase-card[data-pos="2"]{ opacity: 1; z-index: 6; -webkit-transform: translateX(560px) translateY(40px) rotateY(38deg) scale(0.86); transform: translateX(560px) translateY(40px) rotateY(38deg) scale(0.86); }
.showcase-card[data-pos="-3"]{ opacity: 1; z-index: 4; -webkit-transform: translateX(-760px) translateY(70px) rotateY(-46deg) scale(0.78); transform: translateX(-760px) translateY(70px) rotateY(-46deg) scale(0.78); }
.showcase-card[data-pos="3"]{ opacity: 1; z-index: 4; -webkit-transform: translateX(760px) translateY(70px) rotateY(46deg) scale(0.78); transform: translateX(760px) translateY(70px) rotateY(46deg) scale(0.78); }
.showcase-card[data-pos="4"],
.showcase-card[data-pos="5"]{ opacity: 0; pointer-events: none; -webkit-transform: translateX(900px) translateY(90px) rotateY(50deg) scale(0.7); transform: translateX(900px) translateY(90px) rotateY(50deg) scale(0.7); }
.showcase-card[data-pos="-4"],
.showcase-card[data-pos="-5"]{ opacity: 0; pointer-events: none; -webkit-transform: translateX(-900px) translateY(90px) rotateY(-50deg) scale(0.7); transform: translateX(-900px) translateY(90px) rotateY(-50deg) scale(0.7); }
.showcase-card-img{ display: block; width: 100%; height: auto; -webkit-transform: translateY(0px); transform: translateY(0px); transition: transform 1.5s ease-out; }
.showcase-card[data-pos="0"]:hover .showcase-card-img{ -webkit-transform: translateY(calc(-100% + 640px)); transform: translateY(calc(-100% + 640px)); transition: transform 30s linear; }
.showcase-arrow{ position: absolute; top: 280px; z-index: 30; width: 48px; height: 48px; border-radius: 50%; background: rgba(18, 20, 28, 0.85); border: 1px solid var(--th-gold-bd-30); font-size: 16px; color: var(--th-gold-400); cursor: pointer; transition: all 0.3s; }
.showcase-arrow:hover{ background: var(--th-gold-400); border-color: var(--th-gold-400); color: #000; }
.showcase-prev{ left: 4%; }
.showcase-next{ right: 4%; }
.showcase-dots{ position: relative; z-index: 30; margin-top: -10px; font-size: 0px; }
.showcase-dots span{ display: inline-block; width: 10px; height: 10px; margin: 0px 5px; border-radius: 50%; background: var(--th-border); cursor: pointer; transition: all 0.3s; }
.showcase-dots span.active{ width: 28px; border-radius: 999px; background: var(--th-gold-400); }.sh-site{ white-space: normal; font-size: 12px; color: var(--sh-ink); text-align: left; }
.sh-nav{ padding: 12px 16px; overflow: hidden; line-height: 22px; }
.sh-brand{ float: left; font-size: 13px; font-weight: 800; color: var(--sh-ink); }
.sh-logo{ display: inline-block; vertical-align: middle; width: 18px; height: 18px; margin-right: 8px; border-radius: 6px; background: linear-gradient(135deg, var(--sh-a), var(--sh-b)); }
.sh-nav ul{ float: left; margin-left: 20px; }
.sh-nav li{ float: left; margin-right: 12px; font-size: 10px; opacity: 0.65; }
.sh-btn{ display: inline-block; padding: 0px 10px; border-radius: 5px; background: linear-gradient(135deg, var(--sh-a), var(--sh-b)); font-size: 10px; font-weight: 700; line-height: 20px; color: #fff; }
.sh-nav .sh-btn{ float: right; }
.sh-hero{ position: relative; height: 230px; background: linear-gradient(90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.1)), var(--sh-img) center / cover no-repeat, linear-gradient(135deg, var(--sh-a), var(--sh-b)); }
.sh-hero-in{ position: absolute; left: 20px; bottom: 28px; max-width: 70%; }
.sh-hero h5{ margin-bottom: 8px; font-family: var(--th-font-tf); font-size: 26px; font-weight: 800; line-height: 1.15; color: #fff; text-shadow: 0px 2px 10px rgba(0, 0, 0, 0.4); }
.sh-hero p{ margin-bottom: 14px; font-size: 11px; line-height: 1.5; color: rgba(255, 255, 255, 0.85); }
.sh-btn-lg{ padding: 0px 16px; line-height: 28px; font-size: 11px; border-radius: 6px; }
.sh-title-line{ margin: 20px 16px 12px; font-size: 14px; font-weight: 800; text-align: center; color: var(--sh-ink); }
.sh-tiles{ margin: 0px 12px 14px; }
.sh-tiles div{ float: left; width: calc(50% - 8px); margin: 0px 4px 8px; padding: 6px; border-radius: 8px; background: #fff; border: 1px solid rgba(0, 0, 0, 0.08); }
.sh-dark .sh-tiles div{ background: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.12); }
.sh-tiles div.cboth{ float: none; width: auto; margin: 0px; padding: 0px; border: 0px; background: none; }
.sh-thumb{ display: block; height: 62px; margin-bottom: 6px; border-radius: 5px; background: var(--sh-img) 30% 50% / 260% auto no-repeat, linear-gradient(135deg, var(--sh-a), var(--sh-b)); }
.sh-tiles b{ display: block; margin-bottom: 4px; font-size: 11px; color: var(--sh-ink); }
.sh-dark .sh-tiles b{ color: #fff; }
.sh-tiles p{ width: 70%; height: 4px; border-radius: 2px; background: var(--sh-ink); opacity: 0.2; }
.sh-banner{ margin: 0px 12px 14px; padding: 18px 16px; border-radius: 8px; background: linear-gradient(135deg, var(--sh-b), var(--sh-a)); overflow: hidden; }
.sh-banner b{ float: left; font-family: var(--th-font-tf); font-size: 16px; line-height: 26px; color: #fff; }
.sh-banner .sh-btn{ float: right; background: #fff; color: #111; }
.sh-foot{ padding: 14px 16px; background: rgba(0, 0, 0, 0.08); }
.sh-dark .sh-foot{ background: rgba(255, 255, 255, 0.06); }
.sh-foot span{ display: inline-block; width: 28%; height: 5px; margin-right: 4%; border-radius: 3px; background: var(--sh-ink); opacity: 0.25; }
.block-showcase-action{ position: relative; z-index: 30; margin-top: 32px; }
.block-showcase-action .btn-gold{ display: inline-block; min-width: 240px; padding: 0px 32px; line-height: 52px; border-radius: 14px; font-size: 16px; text-align: center; }
.block-showcase-action .btn-gold i{ margin-left: 10px; transition: margin 0.3s; }
.block-showcase-action .btn-gold:hover i{ margin-left: 16px; }
/*
* PAGE WEB DESIGN.
*/
.main-web-design .block-item{ padding: 88px 0px; }
.main-web-design .block-item-head{ margin-bottom: 56px; }
.main-web-design .block-item-alt{ background: linear-gradient(180deg, rgba(26, 29, 39, 0.75) 0%, rgba(18, 20, 28, 0.55) 100%); border-top: 1px solid var(--th-border); border-bottom: 1px solid var(--th-border); }
.main-web-design .block-item-desc{ font-size: 17px; line-height: 1.7; }
.block-wd-hero .hero-title{ font-size: 52px; }
.wd-hero-btns{ margin-bottom: 36px; }
.wd-hero-btns .btn-gold,
.wd-hero-btns .btn-outline{ margin-right: 14px; padding: 0px 28px; line-height: 52px; border-radius: 14px; font-size: 16px; }
.wd-hero-btns i{ margin: 0px 0px 0px 10px; transition: margin 0.3s; }
.wd-hero-btns .btn-outline i{ margin: 0px 10px 0px 0px; color: var(--th-gold-400); }
.wd-hero-btns .btn-gold:hover i{ margin-left: 16px; }
.wd-hero-features{ max-width: 600px; padding-top: 24px; border-top: 1px dashed var(--th-border); }
.wd-hero-feature{ float: left; width: 25%; padding-right: 10px; }
.wd-hero-feature > i{ width: 36px; height: 36px; margin-right: 10px; border-radius: 10px; background: var(--th-gold-bg-10); border: 1px solid var(--th-gold-bd-30); color: var(--th-gold-400); font-size: 15px; line-height: 34px; text-align: center; }
.wd-hero-feature-text{ overflow: hidden; }
.wd-hero-feature-text b{ display: block; font-size: 13px; line-height: 1.3; color: #fff; }
.wd-hero-feature-text span{ display: block; margin-top: 2px; font-size: 12px; line-height: 1.3; color: var(--th-muted); }
.wd-visual{ padding: 30px 0px 40px 30px; }
.wd-browser{ border-radius: 18px; background: var(--th-card); border: 1px solid rgba(250, 204, 21, 0.45); box-shadow: var(--th-shadow-glow); overflow: hidden; }
.wd-browser-bar{ padding: 12px 16px; background: var(--th-lighter); border-bottom: 1px solid var(--th-border); }
.wd-browser-bar span{ display: inline-block; width: 10px; height: 10px; margin-right: 6px; border-radius: 50%; background: #EF4444; }
.wd-browser-bar span:nth-child(2){ background: #F59E0B; }
.wd-browser-bar span:nth-child(3){ background: #22C55E; }
.wd-browser-bar em{ display: inline-block; width: 60%; margin-left: 12px; padding: 0px 12px; border-radius: 6px; background: var(--th-base); font-style: normal; font-size: 12px; line-height: 22px; color: var(--th-muted); vertical-align: middle; }
.wd-browser-bar em i{ margin-right: 6px; color: var(--th-green); font-size: 10px; }
.wd-browser-body{ padding: 18px 20px 22px; }
.block-wd-hero .hero-left{ width: calc(42% - 20px); }
.block-wd-hero .hero-right{ width: calc(58% - 20px); }
.block-wd-hero .wd-visual{ max-width: 760px; padding: 30px 0px 40px 0px; }
.block-wd-hero .wd-browser{ border: 2px solid rgba(250, 204, 21, 0.7); background: #fff; }
.block-wd-hero .wd-browser-bar{ background: #1A1D27; }
.wd-browser-shot{ position: relative; height: 460px; padding: 0px; background: #fff; overflow: hidden; }
.wd-browser-shot img{ display: block; width: 100%; height: auto; max-width: none; transition: transform 6s ease-in-out; }
.wd-browser:hover .wd-browser-shot img{ transform: translateY(calc(-100% + 460px)); }
.wd-site-nav{ margin-bottom: 16px; }
.wd-site-nav b{ width: 56px; height: 14px; border-radius: 4px; }
.wd-site-nav i{ width: 30px; height: 6px; margin: 4px 0px 0px 12px; border-radius: 3px; background: var(--th-border); }
.wd-site-nav u{ margin-left: 14px; padding: 0px 10px; border-radius: 5px; color: #000; font-size: 10px; font-weight: 800; line-height: 20px; text-decoration: none; }
.wd-site-hero{ padding: 20px; border-radius: 12px; background: linear-gradient(135deg, rgba(60, 48, 14, 0.7), rgba(26, 29, 39, 0.9)); border: 1px solid var(--th-gold-bd-30); }
.wd-site-hero-text{ width: 52%; }
.wd-site-hero-text h5{ margin-bottom: 10px; font-size: 19px; font-weight: 800; line-height: 1.25; color: #fff; }
.wd-site-hero-text p{ height: 5px; margin-bottom: 6px; border-radius: 3px; background: var(--th-border); }
.wd-site-hero-text p + p{ width: 70%; }
.wd-site-hero-text span{ display: inline-block; margin-top: 8px; padding: 0px 12px; border-radius: 6px; color: #000; font-size: 11px; font-weight: 800; line-height: 26px; }
.wd-site-hero-img{ width: 40%; height: 110px; border-radius: 10px; background: linear-gradient(135deg, rgba(250, 204, 21, 0.25), rgba(212, 175, 55, 0.05)); font-size: 46px; line-height: 110px; text-align: center; color: var(--th-gold-400); }
.wd-site-tiles{ margin: 16px -6px 0px; }
.wd-site-tile{ float: left; width: calc(33.3333% - 12px); margin: 0px 6px; padding: 14px 12px; border-radius: 10px; background: var(--th-lighter); border: 1px solid var(--th-border); }
.wd-site-tile i{ display: block; margin-bottom: 10px; font-size: 18px; color: var(--th-gold-400); }
.wd-site-tile b{ display: block; width: 70%; height: 6px; margin-bottom: 6px; border-radius: 3px; background: var(--th-text-2); opacity: 0.5; }
.wd-site-tile p{ width: 90%; height: 4px; border-radius: 2px; background: var(--th-border); }
.wd-phone{ position: absolute; right: -10px; bottom: 30px; width: 120px; padding: 6px; border-radius: 20px; background: var(--th-base); border: 2px solid var(--th-gold-500); box-shadow: 0px 14px 30px rgba(0, 0, 0, 0.6); animation: float-y 5s ease-in-out infinite; }
.wd-phone-screen{ padding-bottom: 12px; border-radius: 14px; background: var(--th-card); overflow: hidden; }
.wd-phone-top{ height: 14px; }
.wd-phone-img{ margin: 8px; height: 62px; border-radius: 8px; background: linear-gradient(135deg, rgba(250, 204, 21, 0.25), rgba(212, 175, 55, 0.05)); font-size: 28px; line-height: 62px; text-align: center; color: var(--th-gold-400); }
.wd-phone-screen p{ height: 4px; margin: 0px 10px 5px; border-radius: 2px; background: var(--th-border); }
.wd-phone-screen span{ display: block; height: 14px; margin: 8px 10px 0px; border-radius: 4px; }
.block-wd-hero .chip-top{ top: 0px; right: auto; left: 0px; }
.block-wd-hero .chip-ai{ left: auto; right: 90px; bottom: 0px; }
.block-wd-hero .chip-lead{ bottom: 120px; left: 0px; right: auto; }
.block-wd-hero .chip-ai i{ color: var(--th-gold-400); }
.block-wd-hero .chip-lead i{ color: var(--th-green); }
.block-wd-template .block-item-head{ max-width: 1000px; }
.wd-filter{ max-width: 100%; white-space: nowrap; }
.wd-filter-btn{ display: inline-block; padding: 10px 16px; border: 0px; border-radius: 8px; background: transparent; color: var(--th-muted); font-size: 13px; font-weight: 700; transition: all 0.3s; }
.wd-filter-btn:hover{ color: #fff; }
.wd-filter-btn.active{ background: var(--th-gold-500); color: #000; }
.wd-tpl-item{ display: block; border-radius: 20px; background: var(--th-card); border: 1px solid var(--th-border); overflow: hidden; transition: all 0.4s; }
.wd-tpl-item:hover{ transform: translateY(-6px); border-color: rgba(212, 175, 55, 0.5); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.4); }
.wd-tpl-thumb{ position: relative; height: 340px; padding: 0px; background: linear-gradient(135deg, var(--wd-a), var(--wd-b)); border-bottom: 1px solid var(--th-border); overflow: hidden; }
.wd-tpl-browser{ height: 100%; background: var(--th-card); overflow: hidden; }
.wd-tpl-bar{ padding: 9px 14px; background: var(--th-lighter); border-bottom: 1px solid var(--th-border); white-space: nowrap; }
.wd-tpl-bar span{ display: inline-block; width: 9px; height: 9px; margin-right: 6px; border-radius: 50%; background: #EF4444; }
.wd-tpl-bar span:nth-child(2){ background: #F59E0B; }
.wd-tpl-bar span:nth-child(3){ background: #22C55E; }
.wd-tpl-bar em{ display: inline-block; width: calc(100% - 80px); margin-left: 8px; padding: 0px 10px; border-radius: 6px; background: var(--th-base); font-style: normal; font-size: 11px; line-height: 20px; color: var(--th-muted); vertical-align: middle; overflow: hidden; text-overflow: ellipsis; }
.wd-tpl-bar em i{ margin-right: 6px; color: var(--th-green); font-size: 9px; }
.wd-tpl-body{ position: relative; height: calc(100% - 38px); background: rgba(11, 12, 16, 0.55); overflow: hidden; }
.wd-tpl-img{ display: block; width: 100%; height: auto; max-width: none; transition: transform 5s ease-in-out; }
.wd-tpl-item:hover .wd-tpl-img{ transform: translateY(-40%); }
.wd-tpl-shot{ position: absolute; top: 22px; left: 22px; right: 22px; bottom: 0px; padding: 20px 18px; border-radius: 10px 10px 0px 0px; background: rgba(11, 12, 16, 0.6); border: 1px solid rgba(255, 255, 255, 0.12); border-bottom: 0px; }
.wd-tpl-shot i{ position: absolute; top: 18px; right: 18px; font-size: 46px; color: var(--th-gold-400); opacity: 0.9; transition: transform 0.4s; }
.wd-tpl-item:hover .wd-tpl-shot i{ transform: scale(1.15) rotate(-6deg); }
.wd-tpl-shot b{ display: block; width: 50%; height: 8px; margin-bottom: 10px; border-radius: 4px; background: #fff; opacity: 0.85; }
.wd-tpl-shot p{ width: 40%; height: 5px; margin-bottom: 6px; border-radius: 3px; background: rgba(255, 255, 255, 0.35); }
.wd-tpl-shot span{ display: block; width: 62px; height: 20px; margin-top: 14px; border-radius: 5px; }
.wd-tpl-info{ height: 156px; padding: 20px 22px 0px; overflow: hidden; }
.wd-tpl-tag{ display: block; margin-bottom: 6px; color: var(--th-gold-400); font-size: 11px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.wd-tpl-title{ margin-bottom: 6px; font-size: 19px; font-weight: 800; line-height: 1.35; color: #fff; transition: color 0.3s; }
.wd-tpl-item:hover .wd-tpl-title{ color: var(--th-gold-400); }
.wd-tpl-desc{ display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; line-height: 1.6; color: var(--th-muted); }
.block-item-more-wrap{ margin-top: 48px; }
.block-item-more-wrap .block-item-more{ display: inline-block; margin-top: 0px; font-size: 15px; }
.wd-card{ position: relative; padding: 36px 32px; border-radius: 20px; background: linear-gradient(180deg, rgba(26, 29, 39, 0.9) 0%, var(--th-card) 70%); border: 1px solid var(--th-border); overflow: hidden; transition: all 0.4s; }
.wd-card:before{ content: ""; position: absolute; top: 0px; left: 0px; width: 100%; height: 3px; background: linear-gradient(90deg, var(--th-gold-400), transparent); transform: scaleX(0); transform-origin: left; transition: transform 0.4s; }
.wd-card:hover{ border-color: rgba(212, 175, 55, 0.5); transform: translateY(-6px); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.4); }
.wd-card:hover:before{ transform: scaleX(1); }
.wd-card-num{ position: absolute; top: 18px; right: 22px; font-size: 43px; font-weight: 900; line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(250, 204, 21, 0.45); transition: all 0.4s; }
.wd-card:hover .wd-card-num{ color: rgba(250, 204, 21, 0.9); -webkit-text-stroke: 0px; }
.wd-card .icon-box{ width: 64px; height: 64px; margin-bottom: 24px; border-radius: 18px; font-size: 28px; line-height: 62px; background: linear-gradient(135deg, rgba(250, 204, 21, 0.18), rgba(212, 175, 55, 0.05)); }
.wd-card:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; box-shadow: var(--th-shadow-glow); }
.wd-card-title{ margin-bottom: 10px; font-size: 22px; font-weight: 800; line-height: 1.35; color: #fff; }
.wd-card-desc{ font-size: 15px; line-height: 1.7; color: var(--th-muted); }
.wd-problem-item{ padding: 26px 24px; border-radius: 18px; background: var(--th-card); border: 1px solid var(--th-border); transition: all 0.3s; }
.wd-problem-item:hover{ border-color: rgba(212, 175, 55, 0.5); transform: translateY(-4px); box-shadow: 0px 16px 32px rgba(0, 0, 0, 0.35); }
.wd-problem-item .icon-box{ margin-right: 16px; }
.wd-problem-item:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; }
.wd-problem-info{ overflow: hidden; }
.wd-problem-title{ margin-bottom: 6px; font-size: 18px; font-weight: 800; line-height: 1.35; color: #fff; }
.wd-problem-desc{ font-size: 14px; line-height: 1.6; color: var(--th-muted); }
.wd-step-list{ position: relative; padding: 10px 0px 110px; }
.wd-step-list:before{ content: ""; position: absolute; top: 0px; bottom: 0px; left: 50%; width: 2px; margin-left: -1px; background: linear-gradient(180deg, transparent, rgba(184, 134, 11, 0.7) 8%, rgba(184, 134, 11, 0.7) 92%, transparent); }
.wd-step-item{ position: relative; z-index: 3; width: calc(50% - 56px); min-height: 150px; margin-bottom: 150px; padding: 28px 30px; border-radius: 18px; background: var(--th-card); border: 1px solid var(--th-border); box-shadow: 0px 10px 30px rgba(120, 90, 20, 0.08); transition: all 0.3s; }
.wd-step-item:nth-child(odd){ float: left; clear: left; text-align: right; }
.wd-step-item:nth-child(even){ float: right; clear: right; top: 150px; text-align: left; }
.wd-step-item:hover{ transform: translateY(-4px); border-color: rgba(184, 134, 11, 0.5); }
.wd-step-item:after{ content: ""; position: absolute; top: 53px; width: 32px; height: 2px; background: rgba(184, 134, 11, 0.6); }
.wd-step-item:nth-child(odd):after{ right: -33px; }
.wd-step-item:nth-child(even):after{ left: -33px; }
.wd-step-dot{ position: absolute; top: 30px; z-index: 3; display: block; width: 48px; height: 48px; border-radius: 50%; border: 4px solid var(--th-base); color: #000; font-size: 16px; font-weight: 900; line-height: 40px; text-align: center; box-shadow: var(--th-shadow-sm); }
.wd-step-item:nth-child(odd) .wd-step-dot{ right: -81px; }
.wd-step-item:nth-child(even) .wd-step-dot{ left: -81px; }
.wd-step-progress{ position: absolute; top: 0px; left: 50%; z-index: 2; width: 3px; height: 0px; margin-left: -1.5px; border-radius: 3px; background: linear-gradient(180deg, rgba(250, 204, 21, 0.2), var(--th-gold-400) 40%, #FFF3B0); box-shadow: 0px 0px 12px 2px rgba(250, 204, 21, 0.7); transition: height 0.15s linear; }
.wd-step-progress:after{ content: ""; position: absolute; left: 50%; bottom: -6px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #FFF8D0; box-shadow: 0px 0px 16px 6px rgba(250, 204, 21, 0.85); }
.wd-step-item.is-lit .wd-step-dot{ box-shadow: 0px 0px 0px 6px rgba(250, 204, 21, 0.28), 0px 0px 22px 6px rgba(250, 204, 21, 0.7); }
.wd-step-item.is-lit{ border-color: rgba(212, 175, 55, 0.8); box-shadow: 0px 16px 40px rgba(212, 175, 55, 0.22); }
.wd-step-item.is-lit:after{ background: var(--th-gold-400); box-shadow: 0px 0px 10px rgba(250, 204, 21, 0.8); }
.wd-step-item .icon-box{ transition: all 0.3s; }
.wd-step-item:nth-child(odd) .icon-box{ float: right; margin: 0px 0px 0px 18px; }
.wd-step-item:nth-child(even) .icon-box{ float: left; margin: 0px 18px 0px 0px; }
.wd-step-item:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; box-shadow: var(--th-shadow-glow); }
.wd-step-item .wd-step-title{ overflow: hidden; margin-bottom: 6px; padding-top: 4px; }
.wd-step-item .wd-step-desc{ overflow: hidden; font-size: 15px; line-height: 1.7; }.wd-step-title{ margin-bottom: 8px; font-size: 17px; font-weight: 800; line-height: 1.35; color: #fff; }
.wd-step-desc{ font-size: 14px; line-height: 1.6; color: var(--th-muted); }
.wd-addon-item{ float: left; width: calc((100% - 80px) / 5); margin-right: 20px; padding: 24px 18px; border-radius: 18px; background: var(--th-card); border: 1px solid var(--th-border); text-align: center; transition: all 0.3s; }
.wd-addon-item:nth-child(5){ margin-right: 0px; }
.wd-addon-item:hover{ border-color: rgba(212, 175, 55, 0.5); transform: translateY(-4px); }
.wd-addon-item .icon-box{ margin: 0px auto 14px; }
.wd-addon-title{ margin-bottom: 4px; font-size: 17px; font-weight: 800; color: #fff; }
.wd-addon-desc{ font-size: 13px; line-height: 1.5; color: var(--th-muted); }

/* Problem block with center hub. */
.wd-pb-col{ width: 33%; }
.wd-pb-hub{ width: 34%; padding: 0px 10px; }
.main-web-design #wd-problem{ background: #FFFFFF; }
.wd-pb{ display: flex; align-items: center; }
.wd-pb > .cboth{ display: none; }
.wd-pb-col{ padding-top: 0px; }
.wd-pb-item{ padding: 26px 28px; border-radius: 18px; box-shadow: 0px 10px 30px rgba(120, 90, 20, 0.08); }
.wd-pb-item + .wd-pb-item{ margin-top: 20px; }
.wd-pb-item:hover{ transform: translateY(-4px); border-color: rgba(184, 134, 11, 0.5); }
body.seostack .wd-pb-item .wd-problem-title,
body.seostack .wd-card-title,
body.seostack .wd-step-title,
body.seostack .wd-addon-title,
body.seostack .wd-tpl-title,
body.seostack .sp-result-title{ font-weight: 800; }
.wd-pb-item .wd-problem-title{ margin-bottom: 8px; font-size: 19px; color: #0F0C03; }
.wd-light .wd-problem-desc,
.wd-light .wd-card-title{ color: #0F0C03; }
.wd-light .wd-card-desc,
.wd-light .wd-step-desc,
.wd-light .wd-addon-desc{ font-size: 16px; font-weight: 500; color: #2B2515; }
.wd-light .wd-problem-desc{ font-size: 16px; font-weight: 500; line-height: 1.65; color: #1B1608; }
.block-seo-why .wd-problem-title{ margin-bottom: 8px; font-size: 21px; color: #1B1608; }
.wd-light .block-item-desc{ font-weight: 500; color: #4A4433; }
.wd-hub{ width: 100%; padding: 0px; }
.wd-hub-circle{ position: relative; width: 300px; height: 300px; max-width: 100%; margin: 0px auto; border-radius: 50%; background: radial-gradient(circle, #FFFFFF 0%, #FBF3DC 70%, #F3E6BF 100%); border: 1px solid rgba(184, 134, 11, 0.4); box-shadow: 0px 24px 60px rgba(184, 134, 11, 0.28), 0px 0px 0px 14px rgba(251, 243, 220, 0.6), inset 0px 0px 40px rgba(212, 175, 55, 0.15); }
.wd-hub-circle:before{ content: ""; position: absolute; top: 12%; left: 12%; width: 76%; height: 76%; border-radius: 50%; border: 1px dashed rgba(184, 134, 11, 0.45); }
.wd-hub-img{ position: absolute; top: 18%; left: 18%; width: 64%; height: 64%; object-fit: contain; }
.wd-hub-screen{ position: absolute; top: 28%; left: 25%; width: 50%; height: 33%; padding: 8px; border-radius: 6px; background: #14151C; border: 3px solid #2A2D38; box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.25); overflow: hidden; }
.wd-hub-screen span{ display: block; width: 100%; height: 10px; margin-bottom: 6px; border-radius: 2px; }
.wd-hub-screen b{ display: block; width: 60%; height: 4px; margin-bottom: 5px; border-radius: 2px; background: rgba(255, 255, 255, 0.35); }
.wd-hub-screen i{ position: absolute; left: 12px; bottom: 8px; color: var(--th-gold-400); font-size: 26px; }
.wd-hub-stand{ position: absolute; top: 61%; left: 43%; width: 14%; height: 12%; background: linear-gradient(180deg, #8C8F98, #C9CBD1); border-radius: 0px 0px 4px 4px; }
.wd-hub-stand:after{ content: ""; position: absolute; bottom: -4px; left: -30%; width: 160%; height: 5px; border-radius: 3px; background: #B5B8C0; }
.wd-hub-phone{ position: absolute; top: 42%; left: 63%; width: 17%; height: 30%; padding: 3px; border-radius: 8px; background: #14151C; border: 2px solid #2A2D38; box-shadow: 0px 6px 14px rgba(0, 0, 0, 0.3); }
.wd-hub-phone span{ display: block; width: 100%; height: 100%; border-radius: 5px; opacity: 0.85; }
.wd-hub-medal{ position: absolute; width: 46px; height: 46px; margin: -23px 0px 0px -23px; border-radius: 50%; background: #FFFFFF; border: 2px solid #D4AF37; box-shadow: 0px 6px 16px rgba(120, 90, 20, 0.25); color: #A87912; font-size: 18px; line-height: 42px; text-align: center; transition: all 0.3s; }
.wd-hub-medal:hover{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; transform: scale(1.12); }
.wd-hub-medal:nth-of-type(1){ left: 30.5%; top: 16%; }
.wd-hub-medal:nth-of-type(2){ left: 69.5%; top: 16%; }
.wd-hub-medal:nth-of-type(3){ left: 90%; top: 50%; }
.wd-hub-medal:nth-of-type(4){ left: 69.5%; top: 84%; }
.wd-hub-medal:nth-of-type(5){ left: 30.5%; top: 84%; }
.wd-hub-medal:nth-of-type(6){ left: 10%; top: 50%; }
/* Light sections (cream) alternate with dark sections. */
.main-web-design .wd-light{ --th-card: #FFFFFF; --th-base: #FBF7EC; --th-lighter: #F4EDDA; --th-border: #EADFC8; --th-muted: #4A4433; --th-text-2: #33302A; background: #FBF7EC; border-top: 1px solid #EADFC8; border-bottom: 0px; }
.main-web-design #wd-addon{ background: #FFFFFF; }
.main-web-design #wd-addon .wd-addon-item{ background: #FBF7EC; border-color: #E6D8B4; }
.main-web-design #wd-addon .wd-addon-title{ font-size: 18px; color: #0A0802; }
.main-web-design #wd-addon .wd-addon-desc{ font-weight: 600; color: #2A261A; }
.main-web-design #wd-addon .block-item-desc{ color: #2A261A; }
.wd-light .block-item-badge{ color: #7A5600; }
.wd-light .block-item-badge:before{ background: linear-gradient(90deg, transparent, #B8860B); }
.wd-light .block-item-badge:after{ background: linear-gradient(270deg, transparent, #B8860B); }
.wd-light .block-item-title,
.wd-light .wd-card-title,
.wd-light .wd-problem-title,
.wd-light .wd-step-title,
.wd-light .wd-addon-title,
.wd-light .faq-item-question{ color: #1B1608; }
.wd-light .gold-text{ background: linear-gradient(135deg, #B8860B 0%, #94680A 50%, #6F4A05 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.wd-light .icon-box{ background: rgba(184, 134, 11, 0.14); border-color: rgba(150, 105, 10, 0.55); color: #8A5E0C; }
.wd-light .wd-card{ background: #FFFFFF; box-shadow: 0px 6px 20px rgba(120, 90, 20, 0.06); }
.wd-light .wd-card:hover,
.wd-light .wd-problem-item:hover,
.wd-light .wd-addon-item:hover,
.wd-light .wd-tpl-item:hover{ box-shadow: 0px 16px 36px rgba(120, 90, 20, 0.16); }
.wd-light .wd-card:hover .icon-box,
.wd-light .wd-problem-item:hover .icon-box,
.wd-light .wd-step-item:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; }
.wd-light .wd-card-num{ -webkit-text-stroke: 1.5px rgba(150, 105, 10, 0.75); }
.wd-light .wd-step-dot{ border-color: #FBF7EC; }
.wd-light .faq-item{ box-shadow: 0px 4px 14px rgba(120, 90, 20, 0.05); }
.wd-light .faq-item.open{ background: linear-gradient(180deg, #FFF6DA 0%, #FFFFFF 70%); }
.wd-light .faq-item:hover .faq-item-text,
.wd-light .faq-item.open .faq-item-text{ color: #8A5E0C; }
.wd-light .faq-item.open .faq-item-num{ color: #B8860B; }
.wd-light .faq-item-num{ -webkit-text-stroke: 1px rgba(184, 134, 11, 0.6); }
.wd-light .faq-item-toggle{ color: #A87912; border-color: rgba(184, 134, 11, 0.4); }
.wd-light .faq-help{ background: linear-gradient(160deg, #2A2210 0%, #14151C 75%); }
.wd-light .faq-help-title{ color: #fff; }
.wd-light .faq-help-desc{ color: #D1D5DB; }
.block-sp-hero .hero-title{ font-size: 52px; }
.block-sp-hero .hero-desc{ max-width: 480px; }
.sp-result-item{ padding: 36px 24px; border-radius: 20px; background: var(--th-card); border: 1px solid var(--th-border); text-align: center; transition: all 0.4s; }
.sp-result-item:hover{ transform: translateY(-6px); border-color: rgba(212, 175, 55, 0.5); box-shadow: var(--th-shadow-sm); }
.sp-result-number{ display: inline-block; margin-bottom: 10px; font-size: 48px; font-weight: 900; line-height: 1.15; letter-spacing: -0.02em; }
.sp-result-title{ margin-bottom: 4px; font-size: 18px; font-weight: 800; color: #fff; }
.sp-result-desc{ font-size: 14px; color: var(--th-muted); }
.faq-image{ position: relative; height: 560px; border-radius: 20px; background: #FFFFFF; border: 2px solid #D9C48A; box-shadow: 0px 20px 50px rgba(120, 90, 20, 0.22); overflow: hidden; }
.faq-image-bar{ height: 40px; padding: 0px 16px; background: #14151C; white-space: nowrap; }
.faq-image-bar span{ display: inline-block; width: 10px; height: 10px; margin: 15px 6px 0px 0px; border-radius: 50%; background: #EF4444; }
.faq-image-bar span:nth-child(2){ background: #F59E0B; }
.faq-image-bar span:nth-child(3){ background: #22C55E; }
.faq-image-bar em{ display: inline-block; vertical-align: top; width: calc(100% - 90px); margin: 9px 0px 0px 10px; padding: 0px 12px; border-radius: 6px; background: #0B0C10; font-style: normal; font-size: 12px; line-height: 22px; color: #9CA3AF; }
.faq-image-bar em i{ margin-right: 6px; color: #22C55E; font-size: 10px; }
.faq-image-body{ height: calc(100% - 40px); overflow: hidden; }
.faq-image-body img{ display: block; width: 100%; height: auto; max-width: none; }.wd-light .faq-help{ background: linear-gradient(160deg, #2A2210 0%, #14151C 75%); }
.wd-light .faq-help-title{ color: #fff; }
.wd-light .faq-help-desc{ color: #D1D5DB; }
.block-sp-hero .hero-title{ font-size: 52px; }
.block-sp-hero .hero-desc{ max-width: 480px; }
.sp-result-item{ padding: 36px 24px; border-radius: 20px; background: var(--th-card); border: 1px solid var(--th-border); text-align: center; transition: all 0.4s; }
.sp-result-item:hover{ transform: translateY(-6px); border-color: rgba(212, 175, 55, 0.5); box-shadow: var(--th-shadow-sm); }
.sp-result-number{ display: inline-block; margin-bottom: 10px; font-size: 48px; font-weight: 900; line-height: 1.15; letter-spacing: -0.02em; }
.sp-result-title{ margin-bottom: 4px; font-size: 18px; font-weight: 800; color: #fff; }
.sp-result-desc{ font-size: 14px; color: var(--th-muted); }
.faq-image{ position: relative; height: 560px; border-radius: 20px; border: 1px solid #E6D8B4; box-shadow: 0px 16px 40px rgba(120, 90, 20, 0.18); overflow: hidden; }
.faq-image img{ display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center center; }
.wd-light .faq-help{ position: relative; z-index: 2; margin: -60px 20px 0px; padding: 24px 26px; border: 1px solid rgba(250, 204, 21, 0.4); box-shadow: 0px 16px 36px rgba(0, 0, 0, 0.25); }
.wd-light .faq-item{ margin-bottom: 14px; border-radius: 16px; background: #FFFFFF; border: 1px solid #E6D8B4; box-shadow: 0px 4px 14px rgba(120, 90, 20, 0.06); }
.wd-light .faq-item-question,
.wd-light .faq-item:hover .faq-item-text,
.wd-light .faq-item.open .faq-item-text{ color: #1B1608; }
.wd-light .faq-item:hover{ border-color: #B8860B; }
.wd-light .faq-item.open{ background: #FFFFFF; border-color: #B8860B; box-shadow: 0px 12px 30px rgba(120, 90, 20, 0.16); }
.wd-light .faq-item-num,
.wd-light .faq-item.open .faq-item-num{ color: #A87912; -webkit-text-stroke: 0px; font-size: 22px; }
.wd-light .faq-item-toggle{ border-color: #D9C48A; background: #FBF7EC; color: #8A5E0C; }
.wd-light .faq-item.open .faq-item-toggle{ background: #B8860B; border-color: #B8860B; color: #FFFFFF; }
.wd-light .faq-item-answer{ font-size: 16px; line-height: 1.75; color: #2A261A; }.wd-light .faq-help .icon-box{ background: rgba(250, 204, 21, 0.1); border-color: rgba(250, 204, 21, 0.35); color: var(--th-gold-400); }

/* SEO page. */
.main-sw .block-sp-hero .hero-title{ font-size: 44px; line-height: 1.2; }
.main-sw .block-sp-hero .hero-left{ width: calc(46% - 20px); }
.main-sw .block-sp-hero .hero-right{ width: calc(54% - 20px); }
.main-sw .sp-hero-features .wd-hero-feature{ width: 25%; }
.sw-code{ border-radius: 18px; background: #0E1118; border: 1px solid rgba(250, 204, 21, 0.45); box-shadow: var(--th-shadow-lg); overflow: hidden; }
.sw-code-bar{ padding: 12px 16px; background: #171A24; border-bottom: 1px solid var(--th-border); white-space: nowrap; }
.sw-code-bar span{ display: inline-block; width: 10px; height: 10px; margin-right: 6px; border-radius: 50%; background: #EF4444; vertical-align: middle; }
.sw-code-bar span:nth-child(2){ background: #F59E0B; }
.sw-code-bar span:nth-child(3){ background: #22C55E; }
.sw-code-bar em{ margin-left: 10px; font-style: normal; font-size: 12px; color: #9CA3AF; vertical-align: middle; }
.sw-code-body{ padding: 22px 22px 90px; font-family: Consolas, "Courier New", monospace; font-size: 14px; }
.sw-code-tree{ width: 36%; padding-right: 14px; margin-right: 14px; border-right: 1px solid var(--th-border); }
.sw-code-tree li{ margin-bottom: 8px; font-size: 13px; color: #D1D5DB; }
.sw-code-tree li i{ margin-right: 8px; color: var(--th-gold-400); font-size: 12px; }
.sw-code-lines{ overflow: hidden; }
.sw-code-lines p{ margin-bottom: 6px; white-space: nowrap; line-height: 1.5; color: #E5E7EB; }
.c-k{ color: #C084FC; }
.c-f{ color: #60A5FA; }
.c-v{ color: #FACC15; }
.sw-code-card{ position: absolute; left: -10px; bottom: 6px; width: 190px; padding: 16px 18px; border-radius: 16px; background: rgba(18, 20, 28, 0.95); border: 1px solid rgba(34, 197, 94, 0.5); box-shadow: 0px 14px 30px rgba(0, 0, 0, 0.55); }
.sw-code-card small{ display: block; font-size: 13px; color: #D1D5DB; }
.sw-code-card b{ display: block; font-size: 34px; font-weight: 900; line-height: 1.2; }
.sw-code-card svg{ position: absolute; right: 14px; bottom: 16px; width: 60px; height: 24px; }
.main-sw .hero-visual:has(.sw-code){ padding-bottom: 50px; }
.sw-dash{ margin-top: 12px; border-radius: 12px; background: #FFFFFF; border: 1px solid #D9C48A; box-shadow: 0px 14px 30px rgba(120, 90, 20, 0.25); overflow: hidden; }
.sw-dash-bar{ padding: 8px 12px; background: #14151C; }
.sw-dash-bar span{ display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: #EF4444; }
.sw-dash-bar span:nth-child(2){ background: #F59E0B; }
.sw-dash-bar span:nth-child(3){ background: #22C55E; }
.sw-dash-body{ padding: 10px; }
.sw-dash-side{ width: 18%; padding-right: 8px; }
.sw-dash-side i{ display: block; width: 100%; height: 14px; margin-bottom: 10px; border-radius: 4px; }
.sw-dash-side b{ display: block; height: 6px; margin-bottom: 8px; border-radius: 3px; background: #E6D8B4; }
.sw-dash-main{ overflow: hidden; }
.sw-dash-kpis span{ float: left; width: calc(33.3333% - 6px); margin-right: 9px; padding: 6px 6px; border-radius: 6px; background: #FBF7EC; border: 1px solid #EADFC8; }
.sw-dash-kpis span:nth-child(3){ margin-right: 0px; }
.sw-dash-kpis em{ display: block; font-style: normal; font-size: 8px; color: #6B6350; }
.sw-dash-kpis b{ font-size: 12px; font-weight: 800; color: #8A5E0C; }
.sw-dash-chart{ height: 80px; margin-top: 10px; font-size: 0px; }
.sw-dash-chart i{ display: inline-block; vertical-align: bottom; width: calc(14.2857% - 6px); margin: 0px 3px; border-radius: 4px 4px 0px 0px; background: #E6D8B4; }
.sw-dash-chart i.sw-on{ background: #D4AF37; }
.sw-phone{ position: absolute; right: 16px; bottom: 28px; width: 70px; height: 128px; padding: 4px; border-radius: 14px; background: #14151C; border: 2px solid #2A2D38; box-shadow: 0px 12px 28px rgba(0, 0, 0, 0.4); overflow: hidden; }
.sw-phone-top{ height: 12px; border-radius: 8px 8px 0px 0px; }
.sw-phone b{ display: block; height: 14px; margin: 6px 4px 0px; border-radius: 4px; background: #2A2D38; }
.sw-phone-chart{ margin: 8px 4px 0px; height: 34px; font-size: 0px; }
.sw-phone-chart i{ display: inline-block; vertical-align: bottom; width: calc(25% - 4px); margin: 0px 2px; border-radius: 3px 3px 0px 0px; background: #D4AF37; }
.sw-phone-chart i:nth-child(1){ height: 40%; }
.sw-phone-chart i:nth-child(2){ height: 65%; }
.sw-phone-chart i:nth-child(3){ height: 50%; }
.sw-phone-chart i:nth-child(4){ height: 95%; }
.faq-list{ max-width: 1000px; margin: 0px auto; }
.wd-light .faq-item{ margin-bottom: 16px; border: 1px solid #E0CF9C; box-shadow: 0px 8px 24px rgba(120, 90, 20, 0.1); }
.wd-light .faq-item:hover{ transform: translateY(-2px); box-shadow: 0px 14px 32px rgba(120, 90, 20, 0.18); }
.wd-light .faq-item-question{ padding: 28px 84px 28px 28px; font-size: 20px; font-weight: 800; }
.wd-light .faq-item-num,
.wd-light .faq-item.open .faq-item-num{ width: 42px; height: 42px; border-radius: 50%; background: #F6EBC8; color: #6F4A05; font-size: 16px; font-weight: 800; line-height: 42px; text-align: center; }
.wd-light .faq-item-text{ margin-left: 60px; line-height: 42px; }
.wd-light .faq-item-answer{ margin: 0px 28px 0px 88px; padding-bottom: 28px; font-size: 17px; }
.wd-light .faq-item.open{ background: linear-gradient(135deg, #2A2210 0%, #12141C 70%); border: 2px solid #D4AF37; box-shadow: 0px 20px 44px rgba(120, 90, 20, 0.35); }
.wd-light .faq-item.open:before{ display: none; }
.wd-light .faq-item.open .faq-item-question,
.wd-light .faq-item.open .faq-item-text{ color: #FFFFFF; }
.wd-light .faq-item.open .faq-item-num{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; }
.wd-light .faq-item.open .faq-item-answer{ color: #E5E7EB; }
.wd-light .faq-item-toggle{ top: 50%; width: 38px; height: 38px; margin-top: -19px; line-height: 36px; }
.wd-light .faq-item.open .faq-item-toggle{ background: var(--th-gold-400); border-color: var(--th-gold-400); color: #000; }
.sp-hero-shot{ position: relative; border-radius: 18px; background: #FFFFFF; border: 2px solid rgba(250, 204, 21, 0.7); box-shadow: var(--th-shadow-lg); overflow: hidden; }
.sp-shot-bar{ padding: 11px 16px; background: #14151C; white-space: nowrap; }
.sp-shot-bar span{ display: inline-block; width: 10px; height: 10px; margin-right: 6px; border-radius: 50%; background: #EF4444; vertical-align: middle; }
.sp-shot-bar span:nth-child(2){ background: #F59E0B; }
.sp-shot-bar span:nth-child(3){ background: #22C55E; }
.sp-shot-bar em{ display: inline-block; width: calc(100% - 80px); margin-left: 10px; padding: 0px 12px; border-radius: 6px; background: #0B0C10; font-style: normal; font-size: 12px; line-height: 22px; color: #9CA3AF; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; }
.sp-shot-bar em i{ margin-right: 6px; color: #22C55E; font-size: 10px; }
.sp-hero-shot img{ display: block; width: 100%; height: 420px; max-width: none; object-fit: cover; object-position: 20% top; }
.sp-hero-visual-img{ max-width: 760px; padding-right: 0px; }
.sp-hero-shot-plain{ overflow: visible; border: 0px; border-radius: 0px; background: none; box-shadow: none; }
.sp-hero-plain .sp-hero-row{ display: -webkit-box; display: flex; align-items: center; padding: 0px 0px 140px; }
.sp-hero-plain{ padding-top: 110px; }
.sp-hero-plain .sp-hero-row:after{ display: none; }
.sp-hero-plain .hero-visual{ margin: 0px auto; padding: 0px; }
.sp-hero-plain .hero-left{ width: calc(56% - 20px); padding-top: 0px; }
.sp-hero-plain .hero-right{ width: calc(44% - 20px); }
.sp-hero-plain .hero-title{ font-size: 60px; }
@media (min-width: 1101px){
    .main-st.main-seo .block-sp-hero .hero-title{ font-size: 42px; }
}
.main-st .hero-title-line{ display: block; width: -webkit-max-content; width: max-content; max-width: 100%; }
@media (min-width: 577px){
    .main-st .hero-title-line{ white-space: nowrap; }
}
.sp-hero-plain .hero-desc{ max-width: 620px; font-size: 21px; }
.sp-hero-shot-plain{ margin-top: 0px; }
.sp-hero-shot-plain img{ position: relative; z-index: 1; }
.sp-orbit{ position: absolute; top: 50%; left: 50%; z-index: 0; width: 0px; height: 0px; pointer-events: none; }
.sp-orbit:before{ content: ""; position: absolute; top: -330px; left: -330px; width: 660px; height: 660px; border-radius: 50%; background: radial-gradient(circle, rgba(250, 204, 21, 0.2) 0%, rgba(250, 204, 21, 0) 65%); }
.sp-orbit-ring{ position: absolute; border-radius: 50%; border: 1px dashed rgba(250, 204, 21, 0.35); animation: sp-orbit-spin 28s linear infinite; }
.sp-orbit-ring-1{ top: -170px; left: -170px; width: 340px; height: 340px; }
.sp-orbit-ring-2{ top: -235px; left: -235px; width: 470px; height: 470px; border-style: solid; border-color: rgba(250, 204, 21, 0.18); animation-duration: 40s; animation-direction: reverse; }
.sp-orbit-ring-3{ top: -300px; left: -300px; width: 600px; height: 600px; animation-duration: 56s; }
.sp-orbit-ring i{ position: absolute; width: 14px; height: 14px; margin: -7px 0px 0px -7px; color: var(--th-gold-400); font-size: 16px; font-style: normal; line-height: 14px; text-align: center; text-shadow: 0px 0px 10px rgba(250, 204, 21, 0.95); }
.sp-orbit-ring i:before{ content: "\2726"; }
.sp-orbit-ring i:nth-child(1){ top: 0px; left: 50%; }
.sp-orbit-ring i:nth-child(2){ top: 50%; left: 100%; }
.sp-orbit-ring i:nth-child(3){ top: 85%; left: 15%; }
.sp-star{ position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #FFF3B0; box-shadow: 0px 0px 8px 2px rgba(250, 204, 21, 0.8); opacity: 0.2; animation: sp-star-twinkle 3.2s ease-in-out infinite; }
@keyframes sp-orbit-spin{ from{ transform: rotate(0deg); } to{ transform: rotate(360deg); } }
@keyframes sp-star-twinkle{ 0%, 100%{ opacity: 0.15; transform: scale(0.7); } 50%{ opacity: 1; transform: scale(1.6); } }
@keyframes sp-hero-float{ 0%, 100%{ transform: translateY(0px); } 50%{ transform: translateY(-18px); } }
.sp-hero-shot-plain img{ width: 74%; height: auto; margin: 0px auto; animation: sp-hero-float 4s ease-in-out infinite; object-fit: contain; -webkit-filter: drop-shadow(0px 30px 40px rgba(0, 0, 0, 0.5)); filter: drop-shadow(0px 30px 40px rgba(0, 0, 0, 0.5)); }
.main-seo .block-sp-hero .hero-left{ width: calc(40% - 20px); }
.main-seo .block-sp-hero .hero-right{ width: calc(60% - 20px); }
.faq-image-auto{ height: auto; }
.faq-image-auto .faq-image-body{ height: auto; }
.faq-image-auto .faq-image-body img{ width: 100%; height: auto; }
.faq-traffic{ position: relative; min-height: 560px; padding: 30px 28px; border-radius: 22px; background: linear-gradient(160deg, #2A2210 0%, #12141C 55%, #0B0C10 100%); border: 1px solid rgba(250, 204, 21, 0.5); box-shadow: 0px 20px 50px rgba(120, 90, 20, 0.3), 0px 0px 30px rgba(212, 175, 55, 0.18); overflow: hidden; }
.faq-traffic-head{ font-size: 15px; font-weight: 700; color: #E5E7EB; }
.faq-traffic-head em{ font-style: normal; font-size: 12px; color: #9CA3AF; }
.faq-traffic-head em i{ margin-right: 6px; color: #22C55E; font-size: 7px; vertical-align: middle; }
.faq-traffic-number{ margin-top: 8px; font-size: 64px; font-weight: 900; line-height: 1.1; letter-spacing: -0.03em; }
.faq-traffic-sub{ font-size: 14px; color: #9CA3AF; }
.faq-traffic-chart{ display: block; width: 100%; height: 170px; margin: 16px 0px 18px; overflow: visible; }
.faq-traffic-grid{ stroke: rgba(255, 255, 255, 0.08); stroke-width: 1; vector-effect: non-scaling-stroke; stroke-dasharray: 4 4; }
.faq-traffic-kpis{ margin: 0px -6px 16px; }
.faq-traffic-kpi{ float: left; width: calc(33.3333% - 12px); margin: 0px 6px; padding: 14px 12px; border-radius: 12px; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(250, 204, 21, 0.25); text-align: center; }
.faq-traffic-kpi b{ display: block; font-size: 22px; font-weight: 800; color: var(--th-gold-400); }
.faq-traffic-kpi span{ font-size: 12px; color: #D1D5DB; }
.faq-traffic .hero-vrank li{ background: rgba(11, 12, 16, 0.7); }
.main-seo .block-sp-hero{ border-radius: 0px 0px 56px 56px; }
.main-seo .block-sp-hero .hero-title{ font-size: 56px; }
.block-sp-hero .hero-title,
.block-wd-hero .hero-title,
.main-sw .block-sp-hero .hero-title{ line-height: 1.3; }
.sp-hero-features{ max-width: 520px; margin-top: 8px; }
.sp-hero-features .wd-hero-feature{ width: 33.3333%; }
.block-seo-solution{ background: radial-gradient(ellipse at 50% 0%, rgba(212, 175, 55, 0.14) 0%, rgba(11, 12, 16, 0) 62%), var(--th-base); }
.seo-sol-item{ position: relative; height: 250px; padding: 34px 30px; border-radius: 20px; background: linear-gradient(160deg, #181C28 0%, #0F1219 100%); border: 1px solid var(--th-border); transition: all 0.4s; }
.seo-sol-item:hover{ transform: translateY(-6px); border-color: rgba(212, 175, 55, 0.6); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.45); }
.seo-sol-featured{ border: 2px solid var(--th-gold-400); background: linear-gradient(160deg, rgba(70, 54, 12, 0.7) 0%, #12141C 75%); box-shadow: var(--th-shadow-lg); }
.seo-sol-num{ position: absolute; top: 24px; right: 28px; font-size: 40px; font-weight: 800; line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(250, 204, 21, 0.55); transition: all 0.3s; }
.seo-sol-item:hover .seo-sol-num,
.seo-sol-featured .seo-sol-num{ color: var(--th-gold-400); -webkit-text-stroke: 0px; }
.seo-sol-item .icon-box{ margin-bottom: 22px; width: 60px; height: 60px; border-radius: 16px; font-size: 26px; line-height: 58px; }
.seo-sol-featured .icon-box,
.seo-sol-item:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; }
body.seostack .seo-sol-title{ margin-bottom: 8px; font-size: 20px; font-weight: 800; line-height: 1.35; color: #fff; }
.seo-sol-desc{ font-size: 15px; line-height: 1.7; color: var(--th-text-2); }
.main-web-design .block-seo-result{ background: #FFFFFF; }
.seo-res-item{ padding: 26px 22px; border-radius: 18px; background: #FFFFFF; border: 1px solid #E6D8B4; box-shadow: 0px 10px 30px rgba(120, 90, 20, 0.1); transition: all 0.3s; }
.seo-res-item:hover{ transform: translateY(-4px); border-color: #B8860B; }
.seo-res-item .icon-box{ width: 56px; height: 56px; margin-right: 16px; }
.seo-res-info{ overflow: hidden; }
.seo-res-number{ display: inline-block; font-size: 34px; font-weight: 900; line-height: 1.15; letter-spacing: -0.02em; }
body.seostack .seo-res-title{ font-size: 16px; font-weight: 800; color: #0F0C03; }
.seo-res-desc{ margin-top: 2px; font-size: 14px; font-weight: 500; line-height: 1.5; color: #3F3A2A; }
/*
* SEO RESULT HIGHLIGHT.
*/
.block-seo-result{ background: linear-gradient(180deg, #FFF6DA 0%, #FFFFFF 55%); }
.block-seo-result .col-grid.sr-vt{ position: relative; max-width: 860px; margin: 0px auto; }
.block-seo-result .col-grid.sr-vt:before{ content: ""; position: absolute; top: var(--sr-top, 0px); bottom: var(--sr-bottom, 0px); left: 38px; width: 3px; margin-left: -1.5px; border-radius: 3px; background: rgba(184, 134, 11, 0.28); }
.sr-vt-progress{ position: absolute; top: var(--sr-top, 0px); left: 38px; z-index: 2; width: 3px; height: 0px; margin-left: -1.5px; border-radius: 3px; background: linear-gradient(180deg, #D4AF37, #FACC15 60%, #FFF3B0); box-shadow: 0px 0px 12px 2px rgba(250, 204, 21, 0.7); transition: height 0.15s linear; }
.sr-vt-progress:after{ content: ""; position: absolute; left: 50%; bottom: -6px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #FFF8D0; box-shadow: 0px 0px 16px 6px rgba(250, 204, 21, 0.85); }
.sr-vt .seo-res-item,
.sr-vt .seo-res-item:nth-child(n){ position: relative; float: none; width: auto; margin: 0px 0px 28px 96px; padding: 26px 110px 26px 32px; border-radius: 22px; background: #FFFFFF; border: 1px solid #E0CF9C; box-shadow: 0px 8px 24px rgba(120, 90, 20, 0.1); transition: all 0.4s; }
.sr-vt .seo-res-item:nth-last-child(2){ margin-bottom: 0px; }
.sr-vt .seo-res-item:before{ content: ""; position: absolute; top: 50%; left: -20px; width: 20px; height: 2px; margin-top: -1px; background: rgba(184, 134, 11, 0.35); }
.sr-vt .seo-res-item .icon-box{ position: absolute; top: 50%; left: -96px; z-index: 3; float: none; width: 76px; height: 76px; margin: -38px 0px 0px 0px; border: 4px solid #FFF9E6; border-radius: 50%; background: linear-gradient(135deg, #FCE082, #D4AF37); color: #3A2600; font-size: 30px; line-height: 68px; filter: grayscale(1); opacity: 0.55; transition: all 0.4s; box-shadow: none; }
.sr-vt .seo-res-item.is-lit{ border-color: rgba(212, 175, 55, 0.9); box-shadow: 0px 14px 36px rgba(184, 134, 11, 0.28); }
.sr-vt .seo-res-item.is-lit:before{ background: #FACC15; box-shadow: 0px 0px 8px rgba(250, 204, 21, 0.8); }
.sr-vt .seo-res-item.is-lit .icon-box{ filter: none; opacity: 1; box-shadow: 0px 0px 0px 6px rgba(250, 204, 21, 0.3), 0px 0px 26px 6px rgba(250, 204, 21, 0.6); }
.sr-vt .seo-res-item:hover{ -webkit-transform: translateX(6px); transform: translateX(6px); border-color: #B8860B; }
.sr-vt .seo-res-info{ overflow: visible; }
.sr-vt .seo-res-number{ position: absolute; top: 50%; right: 28px; margin-top: -30px; font-size: 56px; font-weight: 900; opacity: 0.35; transition: opacity 0.4s; }
.sr-vt .seo-res-item.is-lit .seo-res-number{ opacity: 1; }
.block-seo-result .seo-res-number.gold-text{ background: linear-gradient(135deg, #8A5E0C 0%, #6F4A05 100%); -webkit-background-clip: text; background-clip: text; }
body.seostack .seo-res-title{ font-family: var(--th-font) !important; font-size: 19px; font-weight: 800; line-height: 1.4; color: #000000; }
.seo-res-desc{ font-size: 15px; font-weight: 600; color: #1B1608; }.seo-step-item{ position: relative; float: left; width: calc((100% - (var(--n, 6) - 1) * 40px) / var(--n, 6)); margin-right: 40px; text-align: center; }
.seo-step-item:nth-last-child(2){ margin-right: 0px; }
.seo-step-item:not(:nth-last-child(2)):after{ content: "\f061"; position: absolute; top: 26px; right: -34px; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 16px; color: #B8860B; }
.seo-step-icon{ width: 72px; height: 72px; margin: 0px auto 16px; border-radius: 50%; border: 4px solid #FFFFFF; box-shadow: 0px 8px 20px rgba(184, 134, 11, 0.35); color: #3A2A00; font-size: 28px; line-height: 64px; transition: transform 0.3s; }
.seo-step-item:hover .seo-step-icon{ transform: translateY(-5px) scale(1.05); }
.seo-step-num{ display: block; margin-bottom: 4px; font-size: 14px; font-weight: 800; color: #8A5E0C; }
body.seostack .seo-step-title{ margin-bottom: 4px; font-size: 17px; font-weight: 800; line-height: 1.35; color: #0F0C03; }
.seo-step-desc{ font-size: 14px; font-weight: 500; line-height: 1.5; color: #3F3A2A; }
/*
* FOOTER CONTACT.
*/
.footer-contact{ margin-bottom: 20px; padding-right: 24px; }
.footer-contact li{ margin-bottom: 10px; font-size: 13px; line-height: 1.6; color: var(--th-muted); }
.footer-contact li i{ float: left; width: 28px; height: 28px; margin-right: 10px; border-radius: 8px; background: var(--th-gold-bg-10); border: 1px solid var(--th-gold-bd-30); color: var(--th-gold-400); font-size: 12px; line-height: 26px; text-align: center; }
.footer-contact-text{ display: block; overflow: hidden; padding-top: 4px; }
.footer-contact a:hover{ color: var(--th-gold-400); }

/*
* GROWTH STAT GOLD.
*/
.growth-stat-gold .growth-stat-number{ background: linear-gradient(135deg, #FFF1B0 0%, #D4AF37 50%, #996515 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }

/*
* COMMENTS.
*/
.single-comments{ margin-top: 64px; padding-top: 40px; border-top: 1px solid var(--th-border); }
.comments-title,
.comment-reply-title{ margin-bottom: 28px; font-size: 26px; font-weight: 700; color: #fff; }
.comment-list li{ margin-bottom: 24px; padding: 24px; border-radius: 16px; background: var(--th-card); border: 1px solid var(--th-border); }
.comment-list li .children{ margin: 24px 0px 0px 40px; }
.comment-list li .children li{ margin-bottom: 0px; background: var(--th-lighter); }
.comment-item-head{ margin-bottom: 12px; }
.comment-item-avatar{ width: 44px; height: 44px; margin-right: 14px; border-radius: 50%; overflow: hidden; }
.comment-item-avatar img{ display: block; width: 100%; height: 100%; border-radius: 50%; }
.comment-item-info{ overflow: hidden; padding-top: 2px; }
.comment-item-author{ display: block; font-size: 16px; font-weight: 700; color: #fff; }
.comment-item-date{ display: block; font-size: 13px; color: var(--th-muted); }
.comment-item-text{ font-size: 15px; line-height: 1.7; color: var(--th-text-2); }
.comment-item-text p{ margin-bottom: 12px; }
.comment-item-reply{ margin-top: 10px; font-size: 13px; font-weight: 700; }
.comment-item-reply a{ color: var(--th-gold-400); }
.comment-awaiting-moderation{ display: block; margin-bottom: 8px; font-size: 13px; font-style: italic; color: var(--th-orange); }
.comment-respond{ margin-top: 40px; padding: 28px; border-radius: 16px; background: var(--th-card); border: 1px solid var(--th-border); }
.comment-respond .comment-reply-title{ margin-bottom: 20px; font-size: 22px; }
.comment-respond .comment-reply-title small{ margin-left: 12px; font-size: 13px; font-weight: 400; }
.comment-respond .comment-reply-title small a{ color: var(--th-gold-400); }
.comment-notes,
.comment-form-cookies-consent{ margin-bottom: 16px; font-size: 13px; color: var(--th-muted); }
.comment-form-cookies-consent input{ margin-right: 8px; vertical-align: middle; }
.comment-form p.comment-form-author,
.comment-form p.comment-form-email{ float: left; width: calc(50% - 10px); margin-right: 20px; }
.comment-form p.comment-form-email{ margin-right: 0px; }
.comment-form p{ margin-bottom: 16px; }
.comment-form label{ display: block; margin-bottom: 6px; font-size: 13px; font-weight: 700; color: var(--th-text-2); }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{ display: block; width: 100%; padding: 12px 16px; border-radius: 12px; background: var(--th-base); border: 1px solid var(--th-border); color: #fff; font-size: 15px; outline: none; }
.comment-form input:focus,
.comment-form textarea:focus{ border-color: var(--th-gold-500); }
.comment-form textarea{ height: 140px; resize: vertical; }
.comment-form .form-submit{ margin-bottom: 0px; }
.comment-form .submit{ display: inline-block; min-width: 200px; padding: 0px 28px; line-height: 48px; border-radius: 12px; background: linear-gradient(135deg, #FCE082 0%, #D4AF37 50%, #B8860B 100%); border: 0px; color: #000; font-size: 15px; font-weight: 800; transition: all 0.3s; }
.comment-form .submit:hover{ box-shadow: var(--th-shadow-glow); transform: translateY(-2px); }
.comment-pagination{ margin-bottom: 32px; }
.no-comments{ color: var(--th-muted); }

/*
* BLOCK SW WHY.
*/
.block-sw-why .wd-pb-col{ width: 31%; }
.block-sw-why .wd-pb-hub{ width: 38%; padding: 0px 36px; }
.sw-why-item{ position: relative; padding: 22px 26px; border-radius: 16px; background: #fff; border: 1px solid rgba(184, 134, 11, 0.16); box-shadow: 0px 2px 4px rgba(60, 45, 10, 0.04), 0px 12px 28px rgba(120, 90, 20, 0.08); transition: all 0.3s; }
.sw-why-item + .sw-why-item{ margin-top: 34px; }
.sw-why-item:hover{ transform: translateY(-3px); border-color: rgba(184, 134, 11, 0.5); box-shadow: 0px 2px 4px rgba(60, 45, 10, 0.04), 0px 20px 40px rgba(120, 90, 20, 0.16); }
.wd-pb-left .sw-why-item{ text-align: right; }
.sw-why-item:nth-child(1){ top: -30px; }
.sw-why-item:nth-child(3){ top: 30px; }
.wd-pb-left .sw-why-item:nth-child(2){ left: -28px; }
.wd-pb-right .sw-why-item:nth-child(2){ left: 28px; }
.wd-pb-left .sw-why-item:nth-child(2):after,
.wd-pb-right .sw-why-item:nth-child(2):before{ width: 64px; }
.sw-why-icon{ width: 52px; height: 52px; border-radius: 14px; background: linear-gradient(135deg, #FFF6D6, #F6E3A1); border: 1px solid rgba(184, 134, 11, 0.35); color: #8A5E0C; font-size: 21px; line-height: 50px; text-align: center; transition: all 0.3s; }
.wd-pb-left .sw-why-icon{ margin-left: 18px; }
.wd-pb-right .sw-why-icon{ margin-right: 18px; }
.sw-why-item:hover .sw-why-icon{ background: linear-gradient(135deg, #2A2210, #14151C); border-color: #14151C; color: var(--th-gold-400); }
body.seostack .sw-why-title{ margin-bottom: 4px; font-size: 18px; font-weight: 800; line-height: 1.3; color: #14151C; }
.sw-why-desc{ font-size: 15px; line-height: 1.55; color: #5A5444; }
.wd-pb-left .sw-why-item:after,
.wd-pb-right .sw-why-item:before{ content: ""; position: absolute; top: 50%; width: 36px; height: 1px; background: linear-gradient(90deg, rgba(184, 134, 11, 0.6), rgba(184, 134, 11, 0)); }
.wd-pb-left .sw-why-item:after{ left: 100%; }
.wd-pb-right .sw-why-item:before{ right: 100%; transform: scaleX(-1); }
.sw-why-visual{ position: relative; }
.sw-why-visual:before{ content: ""; position: absolute; top: 50%; left: 50%; width: 130%; padding-top: 130%; margin: -65% 0px 0px -65%; border-radius: 50%; background: radial-gradient(circle, rgba(250, 204, 21, 0.28) 0%, rgba(250, 204, 21, 0) 62%); }
.sw-why-shot{ position: relative; overflow: hidden; border-radius: 14px; background: #14151C; border: 1px solid rgba(20, 21, 28, 0.9); box-shadow: 0px 40px 70px rgba(80, 60, 10, 0.3), 0px 8px 20px rgba(20, 21, 28, 0.25); }
.sw-why-bar{ padding: 9px 14px; background: #1A1B24; border-bottom: 1px solid rgba(255, 255, 255, 0.06); }
.sw-why-bar span{ display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; background: #3A3D4A; }
.sw-why-bar span:first-child{ background: var(--th-gold-400); }
.sw-why-shot img{ display: block; width: 100%; }
.block-sw-why.sw-why-white.wd-light{ background: #FFFFFF; }
.sw-why-plain:before{ display: none; }
.sw-why-plain .sw-why-shot{ overflow: visible; border: 0px; border-radius: 0px; background: none; box-shadow: none; }
.main-web-design .block-sw-projects.wd-light,
.block-sw-projects.block-item{ background: #FFFFFF; }
.sw-pj-item{ display: block; float: left; width: calc((100% - 60px) / 3); margin-right: 30px; overflow: hidden; border-radius: 22px; background: #FFFFFF; border: 1px solid rgba(184, 134, 11, 0.18); box-shadow: 0px 12px 30px rgba(120, 90, 20, 0.1); transition: all 0.35s; }
.sw-pj-item:nth-child(3n+3){ margin-right: 0px; }
.sw-pj-item:hover{ transform: translateY(-8px); border-color: rgba(184, 134, 11, 0.55); box-shadow: 0px 26px 50px rgba(120, 90, 20, 0.22); }
.sw-pj-thumb{ position: relative; display: block; height: 260px; overflow: hidden; background: #14151C; }
.sw-pj-thumb img{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform 0.5s; }
.sw-pj-item:hover .sw-pj-thumb img{ transform: scale(1.06); }
.sw-pj-info{ display: block; padding: 30px 32px 32px; }
body.seostack .sw-pj-item-title{ margin-bottom: 8px; font-size: 23px; font-weight: 800; line-height: 1.35; color: #14151C; }
body.seostack .sw-pj-item-title{ transition: color 0.3s; }
body.seostack .sw-pj-item:hover .sw-pj-item-title{ color: #B8860B; }
.sw-pj-item-desc{ display: block; min-height: 26px; margin-bottom: 20px; font-size: 16px; line-height: 1.55; color: #5A4F38; }
.sw-pj-more{ display: block; padding-top: 14px; border-top: 1px solid rgba(184, 134, 11, 0.2); font-size: 14px; font-weight: 800; color: #8A5E0C; }
.sw-pj-more i{ margin-left: 8px; transition: margin 0.3s; }
.sw-pj-item:hover .sw-pj-more i{ margin-left: 14px; }
.block-sp-solution .col-grid{ display: -webkit-box; display: flex; flex-wrap: wrap; }
.block-sp-solution .col-grid > .cboth{ display: none; }
body.seostack .block-sp-solution .wd-card-title{ color: #000000; font-weight: 800; }
.block-sp-solution .wd-card-desc{ font-size: 16px; font-weight: 500; color: #1B1608; }

/*
* PAGE SEO TONG THE.
*/
.st-check-list li{ margin-bottom: 10px; font-size: 15px; line-height: 1.55; color: var(--th-text-2); }
.st-check-list i{ margin-right: 8px; color: var(--th-gold-500); }
.wd-light .st-check-list li{ font-weight: 500; color: #3F3A2A; }
.wd-light .st-check-list i{ color: #B8860B; }
.st-scope-item .wd-card-title{ margin-bottom: 16px; }
.block-st-scope .col-grid{ display: -webkit-box; display: flex; flex-wrap: wrap; }
.block-st-scope .col-grid > .cboth{ display: none; }
.st-road-item{ padding: 30px 26px; border-radius: 20px; background: linear-gradient(160deg, #181C28 0%, #0F1219 100%); border: 1px solid var(--th-border); transition: all 0.4s; }
.st-road-item:hover{ transform: translateY(-6px); border-color: rgba(212, 175, 55, 0.6); box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.45); }
.st-road-head{ margin-bottom: 16px; }
.st-road-num{ display: inline-block; width: 40px; height: 40px; margin-right: 10px; border-radius: 50%; color: #000; font-size: 15px; font-weight: 800; line-height: 40px; text-align: center; }
.st-road-phase{ font-size: 13px; font-weight: 700; color: var(--th-gold-400); }
body.seostack .st-road-title{ margin-bottom: 18px; font-size: 20px; font-weight: 800; line-height: 1.35; color: #fff; }
.st-road-title i{ margin-right: 10px; color: var(--th-gold-400); }
.st-road-label{ margin-bottom: 8px; font-size: 12px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; color: var(--th-gold-400); }
.st-road-item .st-check-list{ margin-bottom: 16px; }
.st-road-text{ margin-bottom: 16px; font-size: 15px; line-height: 1.6; color: var(--th-text-2); }
.st-road-text:last-child{ margin-bottom: 0px; }
.block-st-roadmap .col-grid{ display: -webkit-box; display: flex; flex-wrap: wrap; }
.block-st-roadmap .col-grid > .cboth{ display: none; }
.st-case-item{ padding: 30px 28px; border-radius: 20px; background: #FFFFFF; border: 1px solid #EADFC8; box-shadow: 0px 6px 20px rgba(120, 90, 20, 0.06); transition: all 0.3s; }
.st-case-item:hover{ transform: translateY(-4px); border-color: rgba(212, 175, 55, 0.6); box-shadow: 0px 16px 36px rgba(120, 90, 20, 0.16); }
.st-case-has-wide > .st-case-item{ width: calc(50% - 30px); }
.st-case-has-wide > .st-case-wide{ width: calc(100% - 30px); padding: 28px; }
.st-case-wide{ display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; }
.st-case-wide > .cboth{ display: none; }
.st-case-media{ width: 50%; padding-right: 36px; }
.st-case-media a{ display: block; overflow: hidden; border-radius: 14px; border: 1px solid #D9E1EC; box-shadow: 0px 10px 28px rgba(60, 70, 90, 0.18); background: #F0F4F9; }
.st-case-media img{ display: block; width: 100%; height: auto; max-width: none; image-rendering: -webkit-optimize-contrast; transition: transform 0.4s; }
.st-case-media a:hover img{ transform: scale(1.02); }
.st-case-info{ width: 50%; }
.st-case-one > .st-case-item:not(.st-case-wide){ width: calc(100% - 30px); }
.st-case-flip .st-case-media{ float: right; padding: 0px 0px 0px 36px; }
.st-case-flip .st-case-info{ float: left; }
.st-case-flip .st-case-media{ -webkit-box-ordinal-group: 3; order: 2; }
.st-case-head{ margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid #EADFC8; }
body.seostack .st-case-title{ margin-bottom: 6px; font-size: 24px; font-weight: 800; line-height: 1.35; color: #1B1608; }
.st-case-time{ font-size: 15px; font-weight: 700; color: #7A5200; }
.st-case-time i{ margin-right: 6px; }
.st-case-row{ margin-bottom: 16px; }
.st-case-row p{ font-size: 17px; font-weight: 600; line-height: 1.7; color: #1B1608; }
.st-case-label{ margin-bottom: 8px; font-size: 13px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; color: #6B4A00; }
.st-case-result{ margin-top: 20px; padding-top: 18px; border-top: 1px solid #EADFC8; }
.st-case-result{ display: -webkit-box; display: flex; }
.st-case-result > .cboth{ display: none; }
.st-case-result-item{ -webkit-box-flex: 1; flex: 1 1 0; min-width: 0; padding-right: 12px; }
.st-case-result-item b{ display: block; font-size: 32px; font-weight: 800; line-height: 1.2; }
.st-case-result-item span{ font-size: 15px; font-weight: 600; color: #1B1608; }
.block-st-case .col-grid{ display: -webkit-box; display: flex; flex-wrap: wrap; }
.block-st-case .col-grid > .cboth{ display: none; }
.st-sub-title{ margin-bottom: 26px; font-size: 22px; font-weight: 800; text-align: center; color: #1B1608; }
.st-sub-title-quote{ margin-top: 20px; }
.st-cost-btn{ margin-top: 20px; }
.block-st-cost .seo-step-list{ margin-bottom: 20px; }
.block-st-trust .seo-sol-item{ height: auto; min-height: 230px; }
.block-st-trust .col-grid{ display: -webkit-box; display: flex; flex-wrap: wrap; }
.block-st-trust .col-grid > .cboth{ display: none; }
.st-cta{ margin-top: 20px; padding: 36px 40px; border-radius: 24px; background: linear-gradient(135deg, rgba(70, 54, 12, 0.7) 0%, #12141C 75%); border: 2px solid var(--th-gold-400); box-shadow: var(--th-shadow-lg); }
.st-cta-text{ width: calc(100% - 300px); }
.st-cta-title{ margin-bottom: 8px; font-size: 26px; font-weight: 800; line-height: 1.35; color: #fff; }
.st-cta-desc{ font-size: 16px; line-height: 1.6; color: var(--th-text-2); }
.st-cta .btn-gold{ margin-top: 6px; }

/*
* PAGE ABOUT AND CONTACT.
*/
.ab-intro-left{ width: calc(50% - 20px); }
.ab-intro-right{ width: calc(50% - 20px); }
.ab-intro-desc{ margin-bottom: 18px; font-size: 16px; line-height: 1.8; color: var(--th-text-2); }
.ab-intro-item{ padding: 24px; border-radius: 18px; background: var(--th-card); border: 1px solid var(--th-border); transition: all 0.3s; }
.ab-intro-item:hover{ border-color: rgba(212, 175, 55, 0.5); transform: translateY(-4px); }
.ab-intro-item:nth-child(n+2){ margin-top: 20px; }
.ab-intro-item .icon-box{ margin-right: 16px; }
.ab-intro-item-info{ overflow: hidden; }
.ab-intro-item-title{ margin-bottom: 6px; font-size: 19px; font-weight: 800; color: #fff; }
.ab-intro-item-desc{ font-size: 15px; line-height: 1.65; color: var(--th-muted); }
.ct-map-frame{ overflow: hidden; border-top: 1px solid var(--th-border); border-bottom: 1px solid var(--th-border); }
.ct-map-frame iframe{ display: block; }

/*
* PAGE SINGLE LIGHT.
*/
.main-single{ --th-card: #FFFFFF; --th-base: #FBF7EC; --th-lighter: #F4EDDA; --th-border: #EADFC8; --th-muted: #5A4F38; --th-text-2: #2A261A; background: #FFFFFF; }
.single-breadcrumb{ padding: 130px 0px 0px; background: #FFFFFF; }
.main-single .page-banner-breadcrumb{ font-size: 14px; color: #5A4F38; }
.main-single .page-banner-breadcrumb a:hover{ color: #8A5E0C; }
.main-single .page-banner-breadcrumb i{ color: #B8860B; }
.single-title{ margin-bottom: 18px; font-size: 36px; font-weight: 800; line-height: 1.3; color: #1B1608; }
.single-thumb{ position: relative; margin-bottom: 32px; border-radius: 16px; border: 1px solid #D4AF37; background: #F4EDDA; box-shadow: 0px 16px 36px rgba(120, 90, 20, 0.22); overflow: hidden; }
.single-thumb img{ display: block; width: 100%; height: auto; }
.main-single .page-banner-breadcrumb a:hover{ color: #8A5E0C; }
.main-single .page-banner-breadcrumb i{ color: #B8860B; }
.main-single .block-single{ padding-top: 20px; background: #FFFFFF; }
.main-single .single-left{ padding: 40px 44px; border-radius: 20px; background: #FFFFFF; border: 1px solid #EADFC8; box-shadow: 0px 8px 28px rgba(120, 90, 20, 0.08); }
.main-single .single-meta{ margin-bottom: 28px; padding-bottom: 20px; border-bottom: 1px solid #EADFC8; color: #5A4F38; }
.main-single .single-meta i{ color: #B8860B; }
.main-single .single-meta a:hover{ color: #8A5E0C; }
.main-single .single-content{ font-size: 17px; color: #2A261A; }
.main-single .single-content h2,
.main-single .single-content h3,
.main-single .single-content h4{ color: #1B1608; }
.main-single .single-content h2{ padding-left: 14px; border-left: 4px solid #D4AF37; }
.main-single .single-content a{ color: #8A5E0C; }
.main-single .single-content a:hover{ color: #B8860B; }
.main-single .single-content strong{ color: #1B1608; }
.main-single .single-thumb img{ box-shadow: none; }
.main-single .single-content h1{ margin: 32px 0px 16px; font-size: 32px; font-weight: 800; line-height: 1.3; color: #1B1608; }
.main-single .single-content h1 a,
.main-single .single-content h2 a,
.main-single .single-content h3 a{ color: inherit; text-decoration: none; }
.main-single .single-content h1 a:hover,
.main-single .single-content h2 a:hover,
.main-single .single-content h3 a:hover{ color: #8A5E0C; }
body.admin-bar .single-breadcrumb{ padding-top: 150px; }
.main-single .single-content ul{ margin-left: 0px; list-style: none; }
.main-single .single-content ul li{ position: relative; padding-left: 24px; }
.main-single .single-content ul li:before{ content: "\f00c"; position: absolute; top: 0px; left: 0px; color: #B8860B; font-family: "Font Awesome 6 Free"; font-size: 15px; font-weight: 900; line-height: inherit; }
.main-single .page-banner-breadcrumb,
.main-single .page-banner-breadcrumb a,
.main-single .single-meta,
.main-single .single-meta a,
.main-single .single-content,
.main-single .single-content p,
.main-single .single-content li,
.main-single .single-content h1,
.main-single .single-content h2,
.main-single .single-content h3,
.main-single .single-content h4,
.main-single .single-title,
.main-single .sidebar-list li,
.main-single .sidebar-list li a,
.main-single .sidebar-list li span,
.main-single .sidebar-title,
.main-single .post-item-meta,
.main-single .post-item-excerpt{ color: #000000; }
body.seostack .main-single h1,
body.seostack .main-single h2,
body.seostack .main-single h3,
body.seostack .main-single h4,
body.seostack .main-single .single-content,
body.seostack .main-single .single-content *{ font-family: var(--th-font) !important; }
.main-single .single-title{ font-weight: 800; }
.main-single .single-content{ font-weight: 500; }
.main-single .single-content h2,
.main-single .single-content h3,
.main-single .single-content h4{ font-weight: 800; }
.main-single .single-content strong,
.main-single .single-content b{ font-weight: 800; }
.single-toc{ margin-bottom: 32px; border-radius: 16px; background: #FFF9E6; border: 1px solid #E6D8B4; overflow: hidden; }
.single-toc-head{ padding: 16px 24px; font-size: 18px; font-weight: 800; color: #1B1608; cursor: pointer; }
.single-toc-head > i{ margin-right: 10px; color: #B8860B; }
.single-toc-toggle{ color: #8A5E0C; }
.single-toc-list{ display: none; margin: 0px; padding: 4px 24px 20px 48px; list-style: decimal; counter-reset: toc; }
.single-toc-list li{ margin-bottom: 8px; font-size: 16px; line-height: 1.5; color: #8A5E0C; }
.single-toc-list li a{ color: #2A261A; font-weight: 600; }
.single-toc-list li a:hover{ color: #8A5E0C; text-decoration: underline; }
.single-toc-list .toc-level-3{ margin-left: 22px; list-style: circle; }
.single-toc-list .toc-level-3 a{ font-weight: 500; }
.main-single .single-content h2,
.main-single .single-content h3{ scroll-margin-top: 100px; }
.main-single .single-content img{ max-width: 100%; height: auto; box-shadow: 0px 8px 24px rgba(120, 90, 20, 0.12); }
.main-single .single-content blockquote{ background: #FFF6DA; border-left-color: #B8860B; color: #3F3A2A; }
.main-single .single-content th{ background: #F4EDDA; color: #1B1608; }
.main-single .single-content pre,
.main-single .single-content code{ background: #F4EDDA; color: #3A2A00; border-radius: 8px; }
.main-single .single-content pre{ padding: 16px 20px; overflow-x: auto; }
.main-single .single-content code{ padding: 2px 6px; }
.main-single .single-content pre code{ padding: 0px; }
.main-single .single-related-title{ color: #1B1608; }
.main-single .post-item{ box-shadow: 0px 6px 20px rgba(120, 90, 20, 0.06); }
.main-single .post-item:hover{ box-shadow: 0px 14px 32px rgba(120, 90, 20, 0.16); }
.main-single .post-item-title,
.main-single .post-item-title a{ color: #1B1608; }
.main-single .post-item-title a:hover{ color: #8A5E0C; }
.main-single .post-item-more{ color: #8A5E0C; }
.main-single .post-item-thumb i{ color: #D9C48A; }
.main-single .sidebar-widget{ box-shadow: 0px 6px 20px rgba(120, 90, 20, 0.06); }
.main-single .sidebar-title{ color: #1B1608; }
.main-single .sidebar-list li a:hover{ color: #8A5E0C; }
.main-single .search-form input[type="search"]{ color: #1B1608; }
.main-single .search-form button{ color: #8A5E0C; }
.main-single .single-comments{ border-top-color: #EADFC8; }
.main-single .comments-title,
.main-single .comment-reply-title,
.main-single .comment-item-author{ color: #1B1608; }
.main-single .comment-item-reply a,
.main-single .comment-respond .comment-reply-title small a{ color: #8A5E0C; }
.main-single .comment-respond{ background: #FBF7EC; }
.main-single .comment-form input[type="text"],
.main-single .comment-form input[type="email"],
.main-single .comment-form input[type="url"],
.main-single .comment-form textarea{ background: #FFFFFF; color: #1B1608; }
.main-single .pagination a.page-numbers:hover,
.main-single .pagination .page-numbers.current{ background: #D4AF37; border-color: #D4AF37; }



















/*
* SEO TONG THE (layout riêng).
*/

.block-st-solution{ overflow: hidden; }
.block-st-solution .container{ position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: justify; justify-content: space-between; }
.block-st-solution .cboth{ display: none; }
.block-st-solution .container:before{ content: ""; position: absolute; top: 50%; left: 50%; width: 520px; height: 520px; margin: -260px 0px 0px -260px; border-radius: 50%; background: radial-gradient(circle, rgba(212, 175, 55, 0.16) 0%, transparent 70%); pointer-events: none; }
.st-sol-center{ position: relative; width: 40%; padding: 0px 48px; text-align: center; }
.st-sol-center .block-item-badge{ margin-bottom: 16px; }
.st-sol-center .block-item-title{ margin-bottom: 18px; font-size: 36px; }
.st-sol-desc{ margin-bottom: 30px; font-size: 16px; line-height: 1.75; color: var(--th-text-2); }
.st-sol-side{ position: relative; width: 30%; }
.st-sol-card{ position: relative; margin-bottom: 22px; padding: 24px 24px 22px; border-radius: 20px; background: linear-gradient(160deg, rgba(30, 34, 46, 0.95) 0%, var(--th-card) 80%); border: 1px solid var(--th-border); box-shadow: 0px 18px 40px rgba(0, 0, 0, 0.45); -webkit-animation: st-float 5s ease-in-out infinite alternate; animation: st-float 5s ease-in-out infinite alternate; -webkit-animation-delay: var(--d); animation-delay: var(--d); transition: border-color 0.35s, box-shadow 0.35s; }
.st-sol-card:last-child{ margin-bottom: 0px; }
.st-sol-card:hover{ border-color: rgba(212, 175, 55, 0.7); box-shadow: 0px 22px 50px rgba(212, 175, 55, 0.18); }
.st-sol-card .icon-box{ width: 52px; height: 52px; margin-bottom: 16px; border-radius: 15px; font-size: 22px; line-height: 50px; }
.st-sol-card:hover .icon-box{ background: linear-gradient(135deg, #FCE082, #D4AF37); color: #000; }
.st-sol-title{ margin-bottom: 6px; font-size: 19px; font-weight: 800; line-height: 1.35; color: #fff; }
.st-sol-text{ font-size: 14px; line-height: 1.65; color: var(--th-text-2); }
@-webkit-keyframes st-float{ from{ -webkit-transform: translateY(-9px); transform: translateY(-9px); } to{ -webkit-transform: translateY(9px); transform: translateY(9px); } }
@keyframes st-float{ from{ -webkit-transform: translateY(-9px); transform: translateY(-9px); } to{ -webkit-transform: translateY(9px); transform: translateY(9px); } }

.st-scope-item{ padding: 30px 28px; border-radius: 22px; background: #FFFFFF; border: 1px solid #EADFC8; box-shadow: 0px 6px 20px rgba(120, 90, 20, 0.06); transition: all 0.35s; }
.st-scope-item:hover{ -webkit-transform: translateY(-5px); transform: translateY(-5px); border-color: #B8860B; box-shadow: 0px 18px 40px rgba(120, 90, 20, 0.18); }
.st-scope-side{ width: 84px; text-align: center; }
.st-scope-icon{ width: 64px; height: 64px; margin: 0px auto 12px; border-radius: 20px; background: linear-gradient(135deg, #2A2210 0%, #14151C 100%); color: var(--th-gold-400); font-size: 28px; line-height: 64px; box-shadow: 0px 8px 18px rgba(20, 15, 5, 0.25); }
.st-scope-num{ display: block; font-size: 22px; font-weight: 900; line-height: 1; color: #B8860B; }
.st-scope-body{ overflow: hidden; }
.st-scope-title{ margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px dashed #D9C48A; font-size: 22px; font-weight: 800; line-height: 1.3; color: #1B1608; }
.st-scope-item .st-check-list li:last-child{ margin-bottom: 0px; }

.st-tl{ position: relative; padding: 10px 0px 210px; }
.st-tl:before{ content: ""; position: absolute; top: var(--st-top, 0px); bottom: var(--st-bottom, 0px); left: 50%; width: 2px; margin-left: -1px; background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0.14) 100%, transparent); }
.st-tl:after{ content: ""; display: block; clear: both; }
.st-tl-item{ position: relative; z-index: 3; width: calc(50% - 56px); margin-bottom: 40px; padding: 28px 30px; border-radius: 20px; background: linear-gradient(160deg, #181C28 0%, #0F1219 100%); border: 1px solid var(--th-border); transition: all 0.35s; }
.st-tl-item:nth-of-type(odd){ float: left; clear: left; }
.st-tl-item:nth-of-type(even){ float: right; clear: right; top: 190px; }
.st-tl-item:after{ content: ""; position: absolute; top: 50%; margin-top: -1px; width: 32px; height: 2px; background: rgba(255, 255, 255, 0.14); transition: all 0.35s; }
.st-tl-item:nth-of-type(odd):after{ right: -33px; }
.st-tl-item:nth-of-type(even):after{ left: -33px; }
.st-tl-dot{ position: absolute; top: 50%; margin-top: -24px; z-index: 3; width: 48px; height: 48px; border: 4px solid var(--th-base); border-radius: 50%; background: #232838; color: var(--th-muted); font-size: 18px; line-height: 40px; text-align: center; transition: all 0.35s; }
.st-tl-item:nth-of-type(odd) .st-tl-dot{ right: -81px; }
.st-tl-item:nth-of-type(even) .st-tl-dot{ left: -81px; }
.st-tl-progress{ position: absolute; top: var(--st-top, 0px); left: 50%; z-index: 2; width: 3px; height: 0px; margin-left: -1.5px; border-radius: 3px; background: linear-gradient(180deg, rgba(250, 204, 21, 0.2), var(--th-gold-400) 40%, #FFF3B0); box-shadow: 0px 0px 12px 2px rgba(250, 204, 21, 0.7); transition: height 0.15s linear; }
.st-tl-progress:after{ content: ""; position: absolute; left: 50%; bottom: -6px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #FFF8D0; box-shadow: 0px 0px 16px 6px rgba(250, 204, 21, 0.85); }
.st-tl-item.is-lit{ border-color: rgba(212, 175, 55, 0.8); box-shadow: 0px 16px 40px rgba(212, 175, 55, 0.18); }
.st-tl-item.is-lit:after{ background: var(--th-gold-400); box-shadow: 0px 0px 10px rgba(250, 204, 21, 0.8); }
.st-tl-item.is-lit .st-tl-dot{ background: linear-gradient(135deg, #FCE082 0%, #D4AF37 50%, #B8860B 100%); color: #000; box-shadow: 0px 0px 0px 6px rgba(250, 204, 21, 0.28), 0px 0px 22px 6px rgba(250, 204, 21, 0.7); }
.st-tl-top{ margin-bottom: 6px; }
.st-tl-phase{ font-size: 13px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--th-gold-400); }
.st-tl-time{ float: right; padding: 4px 14px; border-radius: 999px; background: var(--th-gold-bg-10); border: 1px solid var(--th-gold-bd-30); font-size: 13px; font-weight: 700; color: var(--th-gold-400); }
.st-tl-time i{ margin-right: 6px; }
.st-tl-title{ margin-bottom: 20px; font-size: 24px; font-weight: 800; line-height: 1.3; color: #fff; }
.st-tl-col{ width: 50%; padding: 18px 16px 0px 0px; border-top: 1px solid var(--th-border); }
.st-tl-col-main{ width: 100%; padding: 0px 0px 18px; border-top: 0px; }
.st-tl-col .st-check-list{ margin-bottom: 0px; }
.st-tl-col .st-road-text{ margin-bottom: 0px; font-size: 14px; }


.st-trust-list{ width: 58%; }
.st-trust-row{ position: relative; padding: 24px 0px 24px 76px; border-bottom: 1px solid var(--th-border); }
.st-trust-row:first-child{ padding-top: 0px; }
.st-trust-num{ position: absolute; top: 20px; left: 0px; font-size: 38px; font-weight: 900; line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(250, 204, 21, 0.5); }
.st-trust-row:first-child .st-trust-num{ top: -4px; }
.st-trust-title{ margin-bottom: 8px; font-size: 20px; font-weight: 800; line-height: 1.35; color: #fff; }
.st-trust-title i{ margin-right: 10px; font-size: 18px; color: var(--th-gold-400); }
.st-trust-text{ font-size: 15px; line-height: 1.7; color: var(--th-text-2); }
.st-trust-side{ position: -webkit-sticky; position: sticky; top: 120px; width: 36%; }
.st-cta{ margin-top: 0px; padding: 40px 34px; text-align: center; }
.st-cta-icon{ width: 68px; height: 68px; margin: 0px auto 22px; border-radius: 20px; color: #000; font-size: 28px; line-height: 68px; text-align: center; }
.st-cta-title{ margin-bottom: 12px; font-size: 25px; }
.st-cta-desc{ margin-bottom: 8px; }
.st-cta .btn-gold{ margin-top: 20px; }

/* Chi phí SEO tổng thể: chữ rõ hơn. */
.block-st-cost .wd-problem-title{ margin-bottom: 8px; font-size: 21px; color: #1B1608; }
.block-st-cost .wd-problem-desc{ font-size: 16px; font-weight: 600; line-height: 1.6; color: #1B1608; }
.block-st-cost .st-sub-title{ font-size: 28px; }
.block-st-cost .seo-step-num{ font-size: 16px; color: #6B4A00; }
body.seostack .block-st-cost .seo-step-title{ margin-bottom: 6px; font-size: 21px; color: #1B1608; }
.block-st-cost .seo-step-desc{ font-size: 16px; font-weight: 600; line-height: 1.55; color: #1B1608; }
.block-st-cost .st-sub-title-quote{ margin-top: 80px; margin-bottom: 40px; }
.block-st-cost .seo-step-list{ margin-bottom: 0px; }
.block-st-cost .st-cost-btn{ margin-top: 56px; }
.block-st-cost .seo-step-title{ margin-top: 4px; }
.block-st-cost .seo-step-num{ margin-top: 6px; margin-bottom: 8px; }
.block-st-cost .seo-step-icon{ margin-bottom: 22px; }
.block-st-cost .seo-step-desc{ margin-top: 2px; }

/* Chi phí: các bước báo giá dạng thẻ tối nổi bật. */
.block-st-cost .seo-step-list{ margin-bottom: 0px; padding: 40px 36px 16px; border-radius: 28px; background: linear-gradient(135deg, #2A2210 0%, #12141C 75%); border: 2px solid #D4AF37; box-shadow: 0px 24px 60px rgba(120, 90, 20, 0.35); }
.block-st-cost .seo-step-item{ width: calc((100% - (var(--n, 4) - 1) * 28px) / var(--n, 4)); margin: 0px 28px 24px 0px; padding: 34px 20px 26px; border-radius: 22px; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(250, 204, 21, 0.28); transition: all 0.35s; }
.block-st-cost .seo-step-item:nth-child(4n){ margin-right: 0px; }
.block-st-cost .seo-step-item:hover{ -webkit-transform: translateY(-8px); transform: translateY(-8px); background: rgba(250, 204, 21, 0.1); border-color: #FACC15; box-shadow: 0px 18px 40px rgba(250, 204, 21, 0.22); }
.block-st-cost .seo-step-item:not(:nth-last-child(2)):after{ top: 62px; right: -25px; z-index: 2; width: 22px; height: 22px; border-radius: 50%; background: #FACC15; color: #1B1608; font-size: 11px; line-height: 22px; text-align: center; box-shadow: 0px 0px 14px rgba(250, 204, 21, 0.7); }
.block-st-cost .seo-step-icon{ width: 76px; height: 76px; margin-bottom: 18px; border: 0px; font-size: 30px; line-height: 76px; box-shadow: 0px 0px 0px 7px rgba(250, 204, 21, 0.18), 0px 0px 28px rgba(250, 204, 21, 0.55); }
.block-st-cost .seo-step-item:hover .seo-step-icon{ -webkit-transform: scale(1.08); transform: scale(1.08); }
.block-st-cost .seo-step-num{ position: absolute; top: 10px; right: 16px; margin: 0px; font-size: 40px; font-weight: 900; line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(250, 204, 21, 0.45); }
body.seostack .block-st-cost .seo-step-title{ margin: 0px 0px 8px; font-size: 21px; color: #FFFFFF; }
.block-st-cost .seo-step-desc{ margin-top: 0px; font-size: 16px; font-weight: 500; line-height: 1.55; color: #E5E7EB; }
.block-st-cost .st-cost-btn{ margin-top: 48px; }

/* Chi phí: các bước báo giá dạng timeline dọc. */
.block-st-cost .seo-step-list.st-vt{ position: relative; max-width: 860px; margin: 0px auto; padding: 0px; border: 0px; border-radius: 0px; background: none; box-shadow: none; }
.block-st-cost .seo-step-list.st-vt:before{ content: ""; position: absolute; top: var(--st-top, 0px); bottom: var(--st-bottom, 0px); left: 38px; width: 3px; margin-left: -1.5px; border-radius: 3px; background: rgba(184, 134, 11, 0.28); }
.st-vt-progress{ position: absolute; top: var(--st-top, 0px); left: 38px; z-index: 2; width: 3px; height: 0px; margin-left: -1.5px; border-radius: 3px; background: linear-gradient(180deg, #D4AF37, #FACC15 60%, #FFF3B0); box-shadow: 0px 0px 12px 2px rgba(250, 204, 21, 0.7); transition: height 0.15s linear; }
.st-vt-progress:after{ content: ""; position: absolute; left: 50%; bottom: -6px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #FFF8D0; box-shadow: 0px 0px 16px 6px rgba(250, 204, 21, 0.85); }
.block-st-cost .st-vt .seo-step-item,
.block-st-cost .st-vt .seo-step-item:nth-child(n){ float: none; width: auto; margin: 0px 0px 28px 96px; padding: 26px 110px 26px 36px; border-radius: 22px; background: linear-gradient(135deg, #2A2210 0%, #14151C 80%); border: 1px solid rgba(250, 204, 21, 0.25); text-align: left; box-shadow: 0px 10px 28px rgba(60, 40, 5, 0.18); }
.block-st-cost .st-vt .seo-step-item:nth-last-child(2){ margin-bottom: 0px; }
.block-st-cost .st-vt .seo-step-item:not(:nth-last-child(2)):after{ display: none; }
.block-st-cost .st-vt .seo-step-item:before{ content: ""; position: absolute; top: 50%; left: -20px; width: 20px; height: 2px; margin-top: -1px; background: rgba(184, 134, 11, 0.35); }
.block-st-cost .st-vt .seo-step-item:hover{ -webkit-transform: translateX(6px); transform: translateX(6px); border-color: #FACC15; box-shadow: 0px 16px 38px rgba(250, 204, 21, 0.25); }
.block-st-cost .st-vt .seo-step-icon{ position: absolute; top: 50%; left: -96px; z-index: 3; width: 76px; height: 76px; margin: -38px 0px 0px 0px; border: 4px solid #FBF7EC; font-size: 30px; line-height: 68px; text-align: center; filter: grayscale(1); opacity: 0.55; transition: all 0.4s; box-shadow: none; }
.block-st-cost .st-vt .seo-step-item.is-lit .seo-step-icon{ filter: none; opacity: 1; box-shadow: 0px 0px 0px 6px rgba(250, 204, 21, 0.3), 0px 0px 26px 6px rgba(250, 204, 21, 0.6); }
.block-st-cost .st-vt .seo-step-item.is-lit{ border-color: rgba(250, 204, 21, 0.7); }
.block-st-cost .st-vt .seo-step-item.is-lit:before{ background: #FACC15; box-shadow: 0px 0px 8px rgba(250, 204, 21, 0.8); }
.block-st-cost .st-vt .seo-step-item:hover .seo-step-icon{ -webkit-transform: none; transform: none; }
.block-st-cost .st-vt .seo-step-num{ top: 50%; right: 28px; margin-top: -22px; font-size: 48px; }
body.seostack .block-st-cost .st-vt .seo-step-title{ margin-bottom: 6px; font-size: 22px; }

/* Nút nhận báo giá nổi bật. */
.block-st-cost .st-cost-btn{ text-align: center; }
.block-st-cost .st-cost-btn .btn-gold{ position: relative; display: inline-block; overflow: hidden; padding: 20px 28px 20px 40px; border-radius: 999px; border: 2px solid #FFF3B0; background: linear-gradient(135deg, #FCE082 0%, #FACC15 45%, #D4AF37 100%); box-shadow: 0px 0px 0px 8px rgba(250, 204, 21, 0.2), 0px 16px 36px rgba(184, 134, 11, 0.45); color: #1B1608; font-size: 19px; font-weight: 800; letter-spacing: 0.01em; line-height: 1.2; -webkit-animation: st-cta-pulse 2.4s ease-in-out infinite; animation: st-cta-pulse 2.4s ease-in-out infinite; }
.block-st-cost .st-cost-btn .btn-gold:before{ content: ""; position: absolute; top: 0px; left: -80px; width: 50px; height: 100%; background: rgba(255, 255, 255, 0.6); -webkit-transform: skewX(-22deg); transform: skewX(-22deg); -webkit-animation: st-cta-shine 3.2s ease-in-out infinite; animation: st-cta-shine 3.2s ease-in-out infinite; }
.block-st-cost .st-cost-btn .btn-gold i{ display: inline-block; width: 36px; height: 36px; margin-left: 16px; border-radius: 50%; background: #1B1608; color: #FACC15; font-size: 14px; line-height: 36px; text-align: center; vertical-align: middle; transition: -webkit-transform 0.3s; transition: transform 0.3s; }
.block-st-cost .st-cost-btn .btn-gold:hover{ -webkit-transform: translateY(-3px) scale(1.03); transform: translateY(-3px) scale(1.03); box-shadow: 0px 0px 0px 10px rgba(250, 204, 21, 0.28), 0px 22px 44px rgba(184, 134, 11, 0.55); }
.block-st-cost .st-cost-btn .btn-gold:hover i{ -webkit-transform: translateX(4px); transform: translateX(4px); }
@-webkit-keyframes st-cta-pulse{ 0%, 100%{ box-shadow: 0px 0px 0px 6px rgba(250, 204, 21, 0.2), 0px 16px 36px rgba(184, 134, 11, 0.45); } 50%{ box-shadow: 0px 0px 0px 14px rgba(250, 204, 21, 0), 0px 16px 36px rgba(184, 134, 11, 0.45); } }
@keyframes st-cta-pulse{ 0%, 100%{ box-shadow: 0px 0px 0px 6px rgba(250, 204, 21, 0.2), 0px 16px 36px rgba(184, 134, 11, 0.45); } 50%{ box-shadow: 0px 0px 0px 14px rgba(250, 204, 21, 0), 0px 16px 36px rgba(184, 134, 11, 0.45); } }
@-webkit-keyframes st-cta-shine{ 0%{ left: -80px; } 55%, 100%{ left: 120%; } }
@keyframes st-cta-shine{ 0%{ left: -80px; } 55%, 100%{ left: 120%; } }

/* Team: bỏ viền, sắp xếp lại bố cục. */
.team-card{ display: -webkit-box; display: flex; -webkit-box-align: end; align-items: flex-end; border: 0px; padding: 0px 56px 0px 64px; }
.team-card > .cboth{ display: none; }
.team-card-left{ -ms-flex-item-align: center; align-self: center; width: 56%; padding: 64px 48px 64px 0px; }
.team-card-right{ width: 44%; padding-top: 0px; }
.team-card-name{ margin-bottom: 16px; font-size: 54px; }
.team-card-role{ margin-bottom: 12px; font-size: 16px; }
.team-card-desc{ margin-bottom: 22px; }
.team-card-tags{ margin-bottom: 18px; }
.team-card-tags li{ margin: 0px 8px 8px 0px; padding: 6px 12px; font-size: 13px; }
.team-card-btn a{ padding: 13px 26px; }
.team-orbit-ring{ border-color: rgba(212, 175, 55, 0.18); }
.team-orbit-ring-in{ border-color: rgba(212, 175, 55, 0.1); }

/* Hero form: input và nút luôn nằm cùng một hàng. */
#heroForm{ display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding: 7px; border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.35); box-shadow: 0px 12px 36px rgba(0, 0, 0, 0.35); }
#heroForm > .cboth{ display: none; }
#heroForm input{ float: none; -webkit-box-flex: 1; flex: 1 1 auto; width: auto; min-width: 0; height: 52px; font-size: 15px; }
#heroForm .btn-gold{ float: none; -ms-flex-negative: 0; flex-shrink: 0; margin-left: 8px; padding: 0px 26px; border-radius: 12px; font-size: 15px; line-height: 52px; white-space: nowrap; }
#heroForm .btn-gold i{ margin-right: 8px; }
/*
* BLOCK CARE INCLUDE.
*/
.care-inc-list{ max-width: 960px; margin: 0px auto; }
.care-inc-item{ float: left; width: calc((100% - 20px) / 2); margin-bottom: 14px; padding: 18px 22px; border-radius: 14px; background: var(--th-card); border: 1px solid var(--th-border); color: var(--th-text); font-size: 16px; font-weight: 600; }
.care-inc-item:nth-child(2n+2){ float: right; }
.care-inc-item i{ margin-right: 12px; color: var(--th-gold-500); }
.care-inc-item-off{ color: #8F949D; text-decoration: line-through; }
.care-inc-item-off i{ color: var(--th-muted); }
/*
* SPEED HERO IMAGE.
*/
.main-speed .sp-hero-shot-plain img{ width: 100%; max-width: 640px; border-radius: 16px; }
.main-speed .sp-hero-plain .hero-visual{ max-width: none; }

/*
* MALWARE HERO.
*/
.main-malware .block-sp-hero .hero-left{ width: calc(60% - 20px); }
.main-malware .block-sp-hero .hero-right{ width: calc(40% - 20px); }
.main-malware .block-sp-hero .hero-chip{ display: none; }
.main-malware .sp-hero-shot-plain img{ width: 100%; max-width: none; border-radius: 16px; }
.main-malware .sp-hero-plain .hero-visual{ max-width: none; }

/*
* PAGE PRICING.
*/
.main-pricing .page-banner{ padding: 130px 0px 48px; }
.price-tabs-wrap{ position: relative; z-index: 5; padding: 18px 0px; background: rgba(18, 20, 28, 0.9); border-bottom: 1px solid var(--th-border); }
.price-tabs{ text-align: center; font-size: 0px; }
.price-tab{ display: inline-block; margin: 4px 5px; padding: 10px 22px; border-radius: 999px; border: 1px solid var(--th-border); background: var(--th-card); color: var(--th-text-2); font-family: var(--th-font); font-size: 15px; font-weight: 700; cursor: pointer; transition: all 0.3s; }
.price-tab:hover{ border-color: rgba(212, 175, 55, 0.5); color: var(--th-gold-400); }
.price-tab.active{ border-color: transparent; background: linear-gradient(135deg, #FCE082 0%, #D4AF37 50%, #B8860B 100%); color: #000; box-shadow: var(--th-shadow-glow); }
.price-panel{ display: none; }
.price-panel.active{ display: block; animation: price-fade 0.4s ease; }
@keyframes price-fade{ from{ opacity: 0; transform: translateY(10px); } to{ opacity: 1; transform: translateY(0px); } }
.price-panel .col-grid{ margin-top: 10px; }
.main-pricing .pricing-item-title{ margin-bottom: 8px; }
.main-pricing .pricing-item-desc{ margin-bottom: 18px; }
.main-pricing .pricing-item-price{ margin-bottom: 20px; }
.main-pricing .pricing-item-list li{ font-size: 14px; }
.pricing-item-off{ color: #8F949D; text-decoration: line-through; }
.pricing-item-off i{ color: var(--th-muted); }
.price-panel-note{ margin-top: 48px; font-size: 14px; color: var(--th-muted); text-align: center; }
.price-panel-note i{ margin-right: 8px; color: var(--th-gold-400); }
.price-panel-more{ margin-top: 16px; text-align: center; }
.price-panel-more a{ font-size: 16px; font-weight: 800; color: var(--th-gold-400); }
.price-panel-more a i{ margin-left: 8px; transition: margin 0.3s; }
.price-panel-more a:hover i{ margin-left: 14px; }
.price-cta{ margin-top: 56px; padding: 28px 36px; border-radius: 20px; background: linear-gradient(135deg, rgba(60, 48, 14, 0.6) 0%, var(--th-card) 80%); border: 1px solid rgba(212, 175, 55, 0.4); }
.price-cta-text h3{ margin-bottom: 4px; font-size: 22px; font-weight: 800; color: #fff; }
.price-cta-text p{ font-size: 15px; color: var(--th-muted); }
.price-cta .btn-gold{ margin-top: 6px; }
.price-why-box{ max-width: 760px; margin: 0px auto; }
.price-why-title{ margin-bottom: 16px; font-size: 30px; font-weight: 800; color: #fff; }
.price-why-box p{ font-size: 16px; line-height: 1.8; color: var(--th-text-2); }
.main-pricing .pricing-item{ padding: 34px 30px; }
body.seostack .main-pricing .pricing-item-title{ font-family: var(--th-font) !important; font-size: 24px; font-weight: 800; }
.main-pricing .pricing-item-desc{ min-height: 44px; font-size: 14px; line-height: 1.6; color: var(--th-text-2); }
.main-pricing .pricing-item-amount{ font-size: 34px; }
.main-pricing .pricing-item-unit{ font-size: 14px; }
.main-pricing .pricing-item-list li{ margin-bottom: 13px; font-size: 15px; font-weight: 500; color: #E5E7EB; }
.main-pricing .pricing-item-off{ color: var(--th-muted); }
.main-pricing .pricing-item-btn{ padding: 14px 0px; font-size: 15px; }
body.seostack .price-cta-text h3{ font-family: var(--th-font) !important; }
.price-why-box{ max-width: 860px; text-align: center; }
body.seostack .price-why-title{ font-family: var(--th-font) !important; }
.price-why-points{ display: -webkit-box; display: flex; margin: 32px -8px 0px; }
.price-why-point{ -webkit-box-flex: 1; flex: 1; margin: 0px 8px; padding: 24px 18px; border-radius: 18px; background: var(--th-card); border: 1px solid var(--th-border); }
.price-why-point i{ display: block; margin-bottom: 10px; font-size: 26px; color: var(--th-gold-400); }
.price-why-point b{ display: block; margin-bottom: 4px; font-size: 16px; font-weight: 800; color: #fff; }
.price-why-point span{ font-size: 14px; color: var(--th-muted); }

/*
* HEADER ACTIVE UNDERLINE.
*/
.header-nav > ul > li.current > a{ position: relative; box-shadow: none; }
.header-nav > ul > li.current > a:after{ content: ""; position: absolute; left: 0px; right: 0px; bottom: 6px; height: 2px; border-radius: 2px; background: var(--th-gold-400); }

/*
* MISSING WRAPPERS.
*/
.st-sol-side-right{ text-align: left; }
.st-trust-info{ overflow: hidden; }
.sw-why-info{ overflow: hidden; }
.st-tl-cols{ margin-top: 14px; }
.st-tl-cols:after{ content: ""; display: block; clear: both; }
.privacy-content{ max-width: 900px; margin: 0px auto; }
.block-ct-map{ padding: 0px; line-height: 0px; }
.block-ct-map iframe{ display: block; width: 100%; height: 420px; border: 0px; }
.block-price-panels .pricing-pane{ display: none; }
.block-price-panels .pricing-pane.active{ display: block; }
.block-price-why .col-item{ text-align: left; }
.comment-form-comment{ margin-bottom: 16px; }
.dash-bottom:after,
.dash-chart-body:after,
.scan-steps:after,
.wd-tpl-list:after,
.wd-addon-list:after{ content: ""; display: block; clear: both; }
.pricing-item-body{ display: block; }
.testi-item-body{ display: block; }
.dash-legend .lg-green:before{ background: var(--th-green); }

}