/* Nguồn: S2ND */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#f7f5ff;--muted:#d2c9ff;--line:rgba(255,255,255,.14);--primary:#a855f7;--primary-2:#7c3aed;--primary-3:#c084fc;--bg:#12051f;--soft:rgba(255,255,255,.05);--card:rgba(255,255,255,.08);--card-strong:rgba(255,255,255,.12);--radius:20px;--glow:0 0 0 1px rgba(196,132,252,.18),0 12px 50px rgba(155,89,255,.18),0 0 60px rgba(168,85,247,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}html,body{min-height:100%}body{margin:0;color:var(--ink);background:radial-gradient(circle at 15% 15%,rgba(236,72,153,.22),transparent 25%),radial-gradient(circle at 85% 12%,rgba(168,85,247,.25),transparent 22%),radial-gradient(circle at 50% 55%,rgba(124,58,237,.16),transparent 35%),linear-gradient(180deg,#12051f 0%,#1b0830 38%,#220c3f 100%);font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;background-attachment:fixed}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:26px 26px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.95),rgba(0,0,0,.4) 70%,transparent)}a{color:inherit;text-decoration:none}button,input{font:inherit}.container{width:min(1160px,calc(100% - 48px));margin-inline:auto;position:relative;z-index:1}
.site-header{position:sticky;top:0;z-index:20;background:rgba(22,8,38,.68);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 10px 35px rgba(7,2,17,.18)}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;align-items:center;gap:10px;font-family:Manrope,sans-serif;font-size:20px;font-weight:800;letter-spacing:-.6px;white-space:nowrap}.brand b{color:#d8b4fe}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#ec4899,#8b5cf6 55%,#4f46e5);color:#fff;font-size:20px;box-shadow:0 8px 25px rgba(168,85,247,.35),0 0 30px rgba(236,72,153,.25)}.desktop-nav{display:flex;align-items:center;gap:30px;color:#efe9ff;font-size:17px;font-weight:600}.desktop-nav a,.footer-links a{opacity:.88;transition:opacity .2s,color .2s}.desktop-nav a:hover,.footer-links a:hover{opacity:1;color:#f5d0fe}.nav-cta{background:linear-gradient(135deg,rgba(236,72,153,.24),rgba(139,92,246,.27));color:#fff;padding:10px 16px;border-radius:12px;font-size:16px;font-weight:700;border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 24px rgba(168,85,247,.12)}.nav-cta span{margin-left:8px}.menu-toggle,.mobile-nav{display:none}
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(17,4,31,.72),rgba(33,8,60,.75));color:#fff;text-align:center;padding:88px 0 60px;border-bottom:1px solid rgba(255,255,255,.06)}.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(to bottom,#000,transparent 90%);pointer-events:none}.hero-glow{position:absolute;width:780px;height:440px;left:50%;top:-210px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,#f472b6 0%,#8b5cf6 45%,rgba(99,102,241,.15) 72%,transparent 80%);filter:blur(90px);opacity:.72}.hero-inner{position:relative;z-index:1}.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 13px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);border-radius:999px;color:#f5d0fe;font-size:15px;font-weight:600;letter-spacing:.2px;box-shadow:var(--glow)}.status-dot{width:7px;height:7px;border-radius:50%;background:#f5d0fe;box-shadow:0 0 0 4px rgba(245,208,254,.15)}.hero h1{font-family:Manrope,sans-serif;font-size:clamp(38px,6vw,66px);line-height:1.13;letter-spacing:-2.5px;margin:25px 0 18px;font-weight:800;text-shadow:0 0 24px rgba(192,132,252,.18)}.hero h1 span{background:linear-gradient(90deg,#f5d0fe,#c084fc,#a78bfa);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy{max-width:650px;margin:0 auto;color:#ebe3ff;font-size:18px;line-height:1.8}.search-box{width:min(650px,100%);display:flex;align-items:center;gap:12px;margin:32px auto 0;padding:7px 8px 7px 18px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(14px);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.06)}.search-icon{font-size:26px;color:#f5d0fe;line-height:1}.search-box input{min-width:0;flex:1;border:0;outline:0;color:#fff;background:transparent;font-size:17px}.search-box input::placeholder{color:#d8cbff}.search-box button{border:0;border-radius:12px;background:linear-gradient(135deg,#ec4899,#8b5cf6 52%,#6366f1);color:#fff;padding:12px 17px;font-weight:700;font-size:16px;cursor:pointer;transition:transform .2s,filter .2s;box-shadow:0 10px 25px rgba(167,79,255,.28)}.search-box button:hover{filter:brightness(1.06);transform:translateY(-1px)}.search-box button span{margin-left:8px}.hero-tags{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px;color:#d8cbff;font-size:15px}.hero-tags a{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);border-radius:99px;padding:5px 11px;color:#fff;transition:background .2s,transform .2s}.hero-tags a:hover{background:rgba(255,255,255,.13);transform:translateY(-1px)}.hero-stats{display:flex;align-items:center;justify-content:center;gap:35px;margin-top:48px}.hero-stats div{display:flex;flex-direction:column;gap:1px}.hero-stats strong{font-family:Manrope,sans-serif;font-size:20px;color:#fff}.hero-stats span{font-size:14px;color:#d7c9ff}.hero-stats i{height:30px;width:1px;background:rgba(255,255,255,.16)}
.featured,.why-section,.faq-section{margin-top:34px;margin-bottom:10px;padding:44px 34px;border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.1);box-shadow:var(--glow);backdrop-filter:blur(12px)}.featured{padding-top:52px;padding-bottom:56px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:27px}.section-kicker{display:block;color:#f5b9ff;font-size:13px;letter-spacing:1.5px;font-weight:800;margin-bottom:8px}.section-heading h2,.why-panel h2{font-family:Manrope,sans-serif;font-size:clamp(26px,3vw,34px);letter-spacing:-1.1px;line-height:1.25;margin:0;font-weight:800;color:#fff}.section-heading p{margin:9px 0 0;color:#e6ddff;font-size:17px}.text-link{font-size:16px;font-weight:700;color:#f5d0fe;white-space:nowrap}.text-link span{margin-left:7px}.tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.tool-card{position:relative;min-width:0;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);padding:20px 19px 22px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.08));transition:transform .22s,border-color .22s,box-shadow .22s;overflow:hidden;backdrop-filter:blur(10px)}.tool-card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.22);box-shadow:0 14px 35px rgba(8,3,20,.28),0 0 35px rgba(168,85,247,.16)}.tool-card:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#ec4899,#8b5cf6,#60a5fa)}.tool-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px}.tool-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:13px;font-weight:800;font-size:20px;box-shadow:0 10px 24px rgba(0,0,0,.12)}.tool-icon.pink{background:linear-gradient(135deg,#ffd1ea,#ff6db0);color:#7a174d}.tool-icon.blue{background:linear-gradient(135deg,#d6e7ff,#74a7ff);color:#163a84}.tool-icon.red{background:linear-gradient(135deg,#ffd8d2,#ff8d80);color:#8a2218}.tool-icon.purple{background:linear-gradient(135deg,#f1ddff,#b089ff);color:#51228b}.tool-icon.green{background:linear-gradient(135deg,#d8ffe8,#74e4b1);color:#146848}.tool-icon.orange{background:linear-gradient(135deg,#ffe7c8,#ffb66c);color:#87460f}.tool-icon.teal{background:linear-gradient(135deg,#d9fffa,#67e0d1);color:#0b6f66}.tool-icon.gray{background:linear-gradient(135deg,#f5f5ff,#cbd5e1);color:#334155}.tool-tag{padding:4px 9px;border-radius:99px;background:rgba(255,255,255,.1);color:#efe9ff;font-size:13px;font-weight:700;border:1px solid rgba(255,255,255,.07)}.tool-card h3{margin:0 0 7px;font-family:Manrope,sans-serif;font-size:18px;letter-spacing:-.2px;color:#fff}.tool-card p{margin:0;color:#e5dbff;font-size:15px;line-height:1.7;max-width:250px}.card-arrow{position:absolute;right:17px;bottom:16px;color:#e9ddff;font-size:19px;transition:color .2s,transform .2s}.tool-card:hover .card-arrow{color:#fff;transform:translate(2px,-2px)}.no-results{padding:22px;text-align:center;color:#e6ddff}
.category-section{background:transparent;padding:10px 0 10px;border-block:0}.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.category-card{border:1px solid rgba(255,255,255,.12);border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.07));padding:21px 20px;backdrop-filter:blur(10px);box-shadow:0 10px 34px rgba(8,3,20,.18)}.category-top{display:flex;align-items:center;justify-content:space-between}.category-symbol{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#ec4899,#8b5cf6);color:#fff;font-size:20px;font-weight:800;box-shadow:0 10px 24px rgba(168,85,247,.25)}.category-count{font-size:13px;color:#eadfff;font-weight:700}.category-card h3{font-family:Manrope,sans-serif;font-size:18px;margin:17px 0 3px;letter-spacing:-.3px;color:#fff}.category-card>p{margin:0 0 15px;color:#e7deff;font-size:15px}.category-card ul{list-style:none;padding:0;margin:0}.category-card li+li{border-top:1px solid rgba(255,255,255,.08)}.category-card li a{display:flex;justify-content:space-between;gap:10px;padding:9px 0;color:#fff;font-size:15px;transition:color .2s,transform .2s}.category-card li a span{color:#eadfff}.category-card li a:hover{color:#f5d0fe;transform:translateX(2px)}
.why-section{padding-top:0;padding-bottom:0;background:transparent;border:0;box-shadow:none;backdrop-filter:none}.why-panel{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:42px 48px;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.11);box-shadow:var(--glow)}.why-panel h2{font-size:34px}.why-panel>div:first-child>p{max-width:400px;color:#e7deff;font-size:17px;line-height:1.8;margin:15px 0 0}.benefits{display:grid;gap:20px}.benefits>div{display:flex;align-items:flex-start;gap:14px}.benefits>div>span{display:grid;place-items:center;flex:0 0 38px;height:38px;border-radius:11px;background:linear-gradient(135deg,rgba(236,72,153,.28),rgba(139,92,246,.32));color:#fff;font-size:19px;box-shadow:0 6px 18px rgba(168,85,247,.18)}.benefits b{font-size:16px;color:#fff}.benefits p{margin:3px 0 0;color:#e7deff;font-size:15px}
.faq-section{max-width:850px;padding-bottom:48px}.faq-section .section-heading{margin-bottom:20px}.faq-section details{border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:17px 19px;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.08));backdrop-filter:blur(8px)}.faq-section details+details{margin-top:10px}.faq-section summary{cursor:pointer;list-style:none;font-size:16px;font-weight:700;display:flex;justify-content:space-between;gap:15px;color:#fff}.faq-section summary::-webkit-details-marker{display:none}.faq-section summary:after{content:"+";color:#f5d0fe;font-size:20px;line-height:1}.faq-section details[open] summary:after{content:"−"}.faq-section details p{font-size:15px;color:#e7deff;margin:12px 0 0;line-height:1.8}
.site-footer{background:rgba(12,4,24,.78);color:#fff;padding:36px 0;border-top:1px solid rgba(255,255,255,.08);margin-top:30px}.footer-inner{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.footer-inner .brand{font-size:18px}.footer-inner .brand-mark{width:30px;height:30px;font-size:18px}.footer-inner>p{margin:0;color:#d9ccff;font-size:14px;flex:1}.footer-links{display:flex;gap:18px;font-size:14px;color:#f1e9ff}.footer-inner small{width:100%;padding-top:20px;border-top:1px solid rgba(255,255,255,.08);color:#cbbdff;font-size:13px}
@media(max-width:1000px){.tool-grid,.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.why-panel{gap:35px;padding:35px}.desktop-nav{gap:18px}}
@media(max-width:700px){.container{width:min(100% - 32px,560px)}.nav{height:65px}.desktop-nav,.nav-cta{display:none}.menu-toggle{display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);border-radius:10px;width:39px;height:39px;color:#fff;font-size:19px;cursor:pointer}.mobile-nav{display:none;padding:0 0 13px;gap:8px;flex-wrap:wrap}.mobile-nav.open{display:flex}.mobile-nav a{padding:7px 11px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);border-radius:8px;color:#fff;font-size:15px;font-weight:600}.hero{padding:62px 0 44px}.hero h1{font-size:clamp(36px,10vw,49px);letter-spacing:-1.8px;margin-top:22px}.hero-copy{font-size:17px;max-width:470px}.search-box{margin-top:25px;padding:6px 6px 6px 13px;gap:8px;border-radius:12px}.search-box input{font-size:15px}.search-box button{padding:11px 12px;font-size:15px}.search-box button span{display:none}.hero-tags{gap:7px;font-size:14px}.hero-tags a{padding:4px 9px}.hero-stats{gap:17px;margin-top:35px}.hero-stats strong{font-size:18px}.hero-stats span{font-size:12px}.hero-stats i{height:25px}.featured,.why-section,.faq-section{padding:24px 18px;margin-top:20px;border-radius:22px}.featured{padding-top:30px;padding-bottom:30px}.section-heading{align-items:flex-start;margin-bottom:21px}.section-heading h2{font-size:27px}.section-heading p{font-size:15px}.text-link{font-size:14px;margin-top:22px}.tool-grid,.category-grid{gap:11px}.tool-card{padding:15px 14px 20px;border-radius:15px}.tool-card-top{margin-bottom:14px}.tool-icon{width:37px;height:37px;border-radius:11px;font-size:19px}.tool-tag{font-size:12px;padding:3px 7px}.tool-card h3{font-size:16px;line-height:1.4}.tool-card p{font-size:14px;line-height:1.6}.card-arrow{right:12px;bottom:12px}.category-section{padding:10px 0}.category-card{padding:16px 14px;border-radius:15px}.category-card h3{font-size:17px;margin-top:13px}.category-card>p{font-size:14px}.category-card li a{font-size:14px}.category-count{font-size:12px}.why-panel{grid-template-columns:1fr;gap:28px;padding:25px 22px;border-radius:18px}.why-panel h2{font-size:29px}.why-panel>div:first-child>p{font-size:15px}.benefits{gap:16px}.faq-section{padding-bottom:30px}.faq-section details{padding:15px}.faq-section summary{font-size:15px}.footer-inner{gap:14px}.footer-inner>p{flex-basis:100%;order:2}.footer-links{order:3;width:100%;flex-wrap:wrap}.footer-inner small{order:4}.site-footer{padding:28px 0}}
@media(max-width:360px){.container{width:calc(100% - 24px)}.hero-stats{gap:11px}.hero-stats span{font-size:12px}.tool-grid,.category-grid{grid-template-columns:1fr}.tool-card{padding:18px}.section-heading{gap:10px}.text-link{white-space:normal}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
html{font-size:16px}body{font-size:16px}button,input,textarea,select{font-size:inherit}a,button{touch-action:manipulation}
@media(max-width:520px){.tool-grid,.category-grid{grid-template-columns:1fr}.tool-card,.category-card{padding:20px}.tool-card h3,.category-card h3{font-size:18px}.tool-card p,.category-card>p,.category-card li a{font-size:15px}.hero-tags{font-size:14px}.section-heading{flex-wrap:wrap}.text-link{margin-top:0}}

/* === S2ND PASTEL PINK / WHITE - theme 04 === */
:root{color-scheme:light;--ink:#36156b;--muted:#71658a;--line:#f0dff5;--primary:#ec2995;--primary-2:#bf3bdd;--primary-3:#ff65bd;--bg:#fffafc;--soft:#fff3fa;--card:#ffffff;--card-strong:#ffffff;--glow:0 18px 54px rgba(153,51,133,.09);--radius:20px}
html{background:#fff7fb}body{color:var(--ink);background:radial-gradient(ellipse 50% 33% at 0% 12%,rgba(255,173,220,.45),transparent 90%),radial-gradient(ellipse 38% 36% at 100% 20%,rgba(238,190,255,.5),transparent 90%),linear-gradient(180deg,#fff5fc,#fffafd 55%,#fff8fc);background-attachment:fixed}
body:before{display:none}
.site-header{background:rgba(255,250,254,.90);border-bottom:1px solid #f4e2f2;box-shadow:0 6px 30px rgba(120,51,138,.045)}
.brand{color:#38126c}.brand b{color:#df2493}.brand-mark{background:linear-gradient(135deg,#fb3ba9,#b93bf2 65%,#8248ee);box-shadow:0 6px 24px rgba(215,61,175,.25)}
.desktop-nav{color:#57456e}.desktop-nav a:hover,.footer-links a:hover{color:#e92393}
.nav-cta{color:#fff;background:linear-gradient(110deg,#ff40a7,#e92c9b);border:1px solid rgba(240,72,179,.1);box-shadow:0 8px 22px rgba(234,45,149,.20)}
.hero{background:radial-gradient(ellipse at 9% 30%,rgba(255,192,228,.6),transparent 48%),radial-gradient(ellipse at 91% 15%,rgba(229,181,255,.7),transparent 48%),linear-gradient(135deg,#fff5fd 0%,#f5f1ff 50%,#fff0f9 100%);color:#35116c;border-bottom:1px solid #f0d7ec;padding:84px 0 70px}
.hero:before{background-image:radial-gradient(rgba(214,113,199,.11) 1px,transparent 1px);mask-image:linear-gradient(to bottom,black,transparent 86%)}
.hero-glow{width:850px;height:380px;top:-260px;background:radial-gradient(ellipse,#ff9edf,#d5b9ff 48%,transparent 72%);filter:blur(95px);opacity:.35}
.eyebrow{background:rgba(255,255,255,.74);color:#b82e89;border-color:#ecd3f2;box-shadow:0 5px 20px rgba(193,85,172,.1)}.status-dot{background:#ec279b;box-shadow:0 0 0 4px #fce1f2}
.hero h1{color:#381268;text-shadow:none}.hero h1 span{background:linear-gradient(95deg,#e42a92,#fa4cb5,#af44ed);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-copy{color:#66567e}.search-box{background:#fff;border:1px solid #f1d7ef;box-shadow:0 14px 44px rgba(150,72,151,.12)}.search-icon{color:#cb55b6}.search-box input{color:#381268}.search-box input::placeholder{color:#9484a9}.search-box button{background:linear-gradient(115deg,#ff4bad,#e72a96);box-shadow:0 8px 19px rgba(238,53,150,.22)}
.hero-tags{color:#78668e}.hero-tags a{background:#fff9fe;border:1px solid #efd7ef;color:#684e80}.hero-tags a:hover{background:#ffe7f6}.hero-stats strong{color:#36146b}.hero-stats span{color:#7a658e}.hero-stats i{background:#dec7e5}
.featured,.why-section,.faq-section{background:rgba(255,255,255,.88);border:1px solid #f4e2f2;box-shadow:0 18px 48px rgba(156,64,140,.065)}
.section-kicker{color:#e6289b}.section-heading h2,.why-panel h2{color:#34136c}.section-heading p{color:#71658a}.text-link{color:#e62998}
.tool-card{background:linear-gradient(180deg,#fff,#fff9fd);border:1px solid #f0e0f2;box-shadow:0 5px 16px rgba(116,49,115,.035)}.tool-card:before{background:linear-gradient(90deg,#ff5cbb,#d46aff,#9c7dff)}.tool-card:hover{border-color:#f1b8df;box-shadow:0 16px 32px rgba(184,57,149,.14)}.tool-card h3{color:#30145e}.tool-card p{color:#756887}.tool-tag{color:#bd3691;background:#fff0f9;border:1px solid #f7dfee}.card-arrow{color:#d951a6}.tool-card:hover .card-arrow{color:#ef299a}.no-results{color:#76638a}
.category-section{background:transparent}.category-card{background:linear-gradient(180deg,#fff,#fffafd);border:1px solid #f0e0f2;box-shadow:0 8px 25px rgba(152,71,140,.055)}.category-symbol{background:linear-gradient(135deg,#ff56ae,#b84ff4)}.category-count{color:#aa86b3}.category-card h3{color:#35176b}.category-card>p{color:#857494}.category-card li+li{border-top:1px solid #f6eaf5}.category-card li a{color:#5c4678}.category-card li a span{color:#df5daf}.category-card li a:hover{color:#e42b96}
.why-panel{background:linear-gradient(115deg,#fff0fa,#f9efff);border:1px solid #f3d7ef;box-shadow:0 15px 34px rgba(151,56,137,.07)}.why-panel>div:first-child>p,.benefits p{color:#746489}.benefits b{color:#36156b}.benefits>div>span{background:#fff;color:#ef329f;box-shadow:0 6px 17px rgba(151,56,137,.12)}
.faq-section details{background:#fff;border:1px solid #f1e3f2}.faq-section summary{color:#411c6b}.faq-section summary:after{color:#e42b96}.faq-section details p{color:#776a89}
.site-footer{background:linear-gradient(110deg,#35145e,#4e206e);border-top:1px solid #6b3e88}.site-footer .brand{color:#fff}.site-footer .brand b{color:#ffc6eb}.footer-inner>p{color:#f1dff5}.footer-links{color:#f9e8ff}.footer-inner small{color:#dcc1e7;border-top-color:rgba(255,255,255,.15)}
@media(max-width:700px){.menu-toggle{color:#5b2c7d;background:#fff;border:1px solid #efd9f1}.mobile-nav a{background:#fff;border:1px solid #f0dff3;color:#6a3987}}

/* Full-width, aligned layout — v2 */
:root{--page-gutter:clamp(18px,3vw,64px)}
html,body{max-width:100%;overflow-x:clip}
.container{width:calc(100% - 2 * var(--page-gutter));max-width:none;margin-left:auto;margin-right:auto}
.nav{width:calc(100% - 2 * var(--page-gutter));max-width:none}
.hero-inner{width:calc(100% - 2 * var(--page-gutter));max-width:none}
.featured,.why-section,.faq-section{width:calc(100% - 2 * var(--page-gutter));max-width:none;margin-left:auto;margin-right:auto}
.featured,.faq-section{padding:clamp(24px,2.8vw,52px)}
.category-section>.container{width:calc(100% - 2 * var(--page-gutter));max-width:none}
.tool-grid,.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.5vw,24px)}
.tool-card{height:100%;min-height:180px;padding:clamp(20px,1.7vw,30px)}
.tool-card p{max-width:none}
.category-card{height:100%;padding:clamp(20px,1.7vw,30px)}
.why-section{padding:0}.why-panel{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,80px)}
.section-heading{align-items:end}
@media(min-width:1750px){.tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.tool-card{min-height:205px}.tool-card h3{font-size:20px}.tool-card p{font-size:16px}}
@media(max-width:1100px){.tool-grid,.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){:root{--page-gutter:16px}.container,.nav,.hero-inner,.featured,.why-section,.faq-section,.category-section>.container{width:calc(100% - 2 * var(--page-gutter));max-width:none}.featured,.faq-section{padding:22px 17px}.tool-grid,.category-grid{gap:13px}.why-panel{grid-template-columns:1fr}.tool-card{min-height:165px}}
@media(max-width:520px){.tool-grid,.category-grid{grid-template-columns:1fr}.tool-card{min-height:0}.section-heading{align-items:flex-start}}

/* S2ND · Thanh cuộn cầu vồng 7 màu, mảnh và bo tròn.
   Chrome / Edge / Safari: gradient 7 màu. Firefox: màu hồng (fallback). */
/* Chromium hỗ trợ scrollbar-color và sẽ ưu tiên nó hơn pseudo-element.
   Vì vậy tuyệt đối không khai báo scrollbar-color trên Chrome/Edge. */
@supports (-moz-appearance: none) {
  html { scrollbar-width: thin; scrollbar-color: #8b5cf6 #fff0fa; }
}
html::-webkit-scrollbar, body::-webkit-scrollbar { width: 9px; height: 9px; }
html::-webkit-scrollbar-track, body::-webkit-scrollbar-track { background: #fff0fa; border-radius: 999px; }
html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb {
  border: 2px solid #fff0fa;
  border-radius: 999px;
  background: linear-gradient(180deg, #ff3b30 0%, #ff9500 16%, #ffcc00 32%, #34c759 48%, #00c7ff 64%, #5856d6 82%, #bf5af2 100%);
}
html::-webkit-scrollbar-thumb:hover, body::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #f3241d 0%, #f77a00 16%, #e3ae00 32%, #1dab49 48%, #009bdf 64%, #4341bc 82%, #a43ada 100%);
}
/* Thanh cuộn ngang ở các tab trên trang công cụ. */
.tool-main .tabs::-webkit-scrollbar { height: 6px; }
.tool-main .tabs::-webkit-scrollbar-track { background: #fff0fa; border-radius: 999px; }
.tool-main .tabs::-webkit-scrollbar-thumb {
  background: linear-gradient(90deg, #ff3b30, #ff9500, #ffcc00, #34c759, #00c7ff, #5856d6, #bf5af2);
  border-radius: 999px;
}

/* Global compact language selector (Vietnamese / English) */
.language-switcher{display:flex;align-items:center;gap:5px;margin-left:auto;padding:4px;border-radius:100px;border:1px solid rgba(219,107,167,.2);background:rgba(255,255,255,.74);box-shadow:0 3px 14px rgba(130,50,90,.07);flex-shrink:0}
.language-switcher a{white-space:nowrap;border-radius:100px;padding:6px 10px;font-size:14px;font-weight:750;color:#80375f;line-height:1.35;transition:background .15s,color .15s}
.language-switcher a[aria-current=page]{background:linear-gradient(125deg,#ff70b7,#ba61e8);color:white;box-shadow:0 4px 12px #d7539a33}
.language-switcher a:hover:not([aria-current=page]){background:#ffe8f4}
@media(max-width:700px){.language-switcher{margin-left:auto}.language-switcher a{font-size:13px;padding:5px 7px}.site-header .nav{gap:8px}.site-header .nav .brand{margin-right:auto}}
@media(max-width:380px){.language-switcher a{padding:4px 6px;font-size:12px}}

/* Language selector, desktop and mobile: visible in the main header. */
.site-header .container.nav > .language-switcher {display:flex!important;position:relative;z-index:2;order:8;margin-left:12px}
.site-header .container.nav > .nav-cta {order:7}
.site-header .container.nav > .menu-toggle {order:9}
@media(max-width:700px){.site-header .container.nav > .language-switcher {order:8;margin-left:auto}.site-header .container.nav > .nav-cta{display:none}}

/* Nguồn: S2ND — mobile heading exactly two lines */
@media (max-width: 600px) {
  .hero h1 {
    font-size: clamp(19px, 5.8vw, 30px) !important;
    letter-spacing: -0.7px !important;
    line-height: 1.28 !important;
    white-space: nowrap;
  }
  .hero h1 > span {
    display: block;
    white-space: nowrap;
  }
}

/* S2ND Mobile Menu Pro — isolated from desktop navigation */
.mobile-nav-backdrop{display:none}
@media(max-width:700px){
  .site-header{z-index:100!important}
  .site-header .nav{position:relative;z-index:104}
  .site-header .menu-toggle{display:flex!important;align-items:center;justify-content:center;position:relative;z-index:105;width:43px;height:43px;min-width:43px;padding:0;border:1px solid #efd4ec;border-radius:14px;background:linear-gradient(145deg,#fff,#fff0fa);box-shadow:0 5px 15px rgba(192,57,144,.14);color:#7b238b;cursor:pointer;transition:transform .2s,box-shadow .2s}
  .site-header .menu-toggle:active{transform:scale(.95)}
  .menu-toggle-lines{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
  .menu-toggle-lines i{display:block;width:19px;height:2px;border-radius:5px;background:linear-gradient(90deg,#ed3da8,#9a49de);transition:transform .22s,opacity .2s}
  .menu-toggle.is-open .menu-toggle-lines i:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-toggle.is-open .menu-toggle-lines i:nth-child(2){opacity:0}
  .menu-toggle.is-open .menu-toggle-lines i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .mobile-nav-backdrop{display:block;position:fixed;inset:0;z-index:101;background:rgba(35,12,49,.34);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s,visibility .28s;backdrop-filter:blur(0)}
  .mobile-nav-backdrop.open{opacity:1;visibility:visible;pointer-events:auto;backdrop-filter:blur(5px)}
  .mobile-nav,.mobile-nav.open{display:flex!important;flex-direction:column;flex-wrap:nowrap;gap:0;box-sizing:border-box;position:fixed;z-index:103;right:0;top:0;bottom:0;width:min(365px,89vw);height:100dvh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;margin:0;padding:26px 20px max(22px,env(safe-area-inset-bottom));border-radius:25px 0 0 25px;background:linear-gradient(154deg,#fff 10%,#fff5fc 57%,#f8efff 100%);box-shadow:-20px 0 65px rgba(49,11,64,.18);transform:translateX(110%);visibility:hidden;pointer-events:none;transition:transform .3s cubic-bezier(.2,.8,.2,1),visibility .3s}
  .mobile-nav.open{transform:translateX(0);visibility:visible;pointer-events:auto}
  .mobile-nav-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 0 24px;border-bottom:1px solid #f3e2f1}
  .mobile-nav-brand{display:flex;align-items:center;gap:11px}
  .mobile-nav-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#f840a7,#a346e4);box-shadow:0 8px 18px #d73e9b44;color:white;font-size:24px;font-weight:800}
  .mobile-nav-brand strong{display:block;font-size:20px;line-height:1.2;font-weight:800;color:#38155f;letter-spacing:-.5px}
  .mobile-nav-brand em{font-style:normal;color:#e72eaa}
  .mobile-nav-brand small{display:block;margin-top:3px;color:#9f74a4;font-size:10px;letter-spacing:1.1px;font-weight:800}
  .mobile-nav-close{display:grid;place-items:center;flex:0 0 37px;height:37px;border:1px solid #f1dced;border-radius:12px;background:#fff;color:#803e87;font-size:27px;line-height:1;cursor:pointer}
  .mobile-nav-caption{margin:27px 3px 12px;color:#ad6a9f;font-size:11px;font-weight:850;letter-spacing:1.5px}
  .mobile-nav-links{display:flex;flex-direction:column;gap:10px}
  .mobile-nav .mobile-nav-links a{display:flex!important;align-items:center;gap:13px;min-height:76px;padding:13px;border:1px solid #f1dcef;border-radius:18px;background:rgba(255,255,255,.92);box-shadow:0 5px 20px rgba(123,37,111,.045);color:#4d2868;transition:transform .2s,box-shadow .2s}
  .mobile-nav .mobile-nav-links a:active{transform:scale(.98)}
  .mobile-nav-icon{display:grid;place-items:center;flex:0 0 45px;width:45px;height:45px;border-radius:14px;background:linear-gradient(135deg,#ffebf6,#f3e8ff);color:#c03fb2;font-size:22px;font-weight:800}
  .mobile-nav .mobile-nav-links a:nth-child(2) .mobile-nav-icon{background:linear-gradient(135deg,#ffe9f7,#ebe6ff);color:#a453da}
  .mobile-nav .mobile-nav-links a:nth-child(3) .mobile-nav-icon{background:linear-gradient(135deg,#e6f6ff,#efedff);color:#5185d5}
  .mobile-nav .mobile-nav-links a:nth-child(4) .mobile-nav-icon{background:linear-gradient(135deg,#fff2de,#ffe5f2);color:#df8a53}
  .mobile-nav-links a>span:nth-child(2){flex:1;min-width:0}
  .mobile-nav-links strong{display:block;color:#462064;font-size:15px;font-weight:800}
  .mobile-nav-links small{display:block;margin-top:4px;color:#947a9e;font-size:11px;font-weight:500}
  .mobile-nav-chevron{font-size:25px;color:#bd8eba;line-height:1}
  .mobile-nav .mobile-nav-all{display:flex!important;align-items:center;justify-content:center;gap:8px;margin-top:23px;min-height:51px;padding:12px 16px;border:0;border-radius:15px;background:linear-gradient(105deg,#f73e9d,#a24ce5);box-shadow:0 11px 23px rgba(206,52,154,.23);color:#fff;font-size:14px;font-weight:800;text-align:center}
  .mobile-nav-foot{margin:auto 0 0;padding-top:29px;color:#a78aa9;font-size:11px;text-align:center}
  body.mobile-menu-is-open{overflow:hidden}
}
@media(min-width:701px){.mobile-nav,.mobile-nav-backdrop{display:none!important}}
@media(prefers-reduced-motion:reduce){.mobile-nav,.mobile-nav-backdrop,.menu-toggle-lines i{transition:none!important}}