/* KVCHN Showroom 1.0.0 – khuvuichoihuongnghiep.com */
.sr-home{--ink:#1d1b4f;--ink2:#555a7a;--indigo:#3d32d6;--indigo2:#2c23a8;--lime:#b7f34a;--lime2:#9fdc2c;--sky:#eef1ff;--line:#e3e6f5;--pink:#ff7aa8;
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:#fff;overflow-x:hidden}
.sr-home *{box-sizing:border-box}
.sr-home h1,.sr-home h2,.sr-home h3{font-family:"Lexend","Inter",system-ui,sans-serif;color:var(--ink);margin:0;line-height:1.18;letter-spacing:-.01em}
.sr-home a{color:inherit;text-decoration:none}
.sr-home a:focus-visible,.sr-home summary:focus-visible{outline:3px solid var(--pink);outline-offset:3px;border-radius:10px}
.sr-home img{display:block;width:100%;max-width:100%;height:100%;object-fit:cover}
.sr-wrap{width:min(calc(100% - 32px),1200px);margin-inline:auto}
.sr-wrap>*,.sr-hero__grid>*,.sr-cats>*,.sr-products>*,.sr-models>*,.sr-sols>*,.sr-two>*{min-width:0}
.sr-noimg{display:block;width:100%;height:100%;background:linear-gradient(135deg,#e3e6ff,#e9fbd0)}
.sr-kicker{display:inline-flex;align-items:center;gap:8px;margin:0 0 8px;font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--indigo)}
.sr-dot{width:8px;height:8px;border-radius:50%;background:var(--lime2);box-shadow:0 0 0 4px rgba(183,243,74,.35)}

/* Buttons */
.sr-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:14px;background:var(--indigo);color:#fff!important;font-weight:700;border:2px solid var(--indigo);transition:transform .15s,background .15s}
.sr-btn:hover{transform:translateY(-2px);background:var(--indigo2)}
.sr-btn--line{background:#fff;color:var(--indigo)!important}
.sr-btn--line:hover{background:var(--sky)}
.sr-btn--lime{background:var(--lime);border-color:var(--lime);color:var(--ink)!important}
.sr-btn--lime:hover{background:var(--lime2)}
.sr-btn--ghost{background:transparent;border-color:rgba(255,255,255,.5)}
.sr-btn--ghost:hover{background:rgba(255,255,255,.1)}

/* Hero */
.sr-hero{padding:56px 0 60px;background:linear-gradient(180deg,#f4f5ff 0,#fff 100%);position:relative;overflow:hidden}
.sr-hero::before{content:"";position:absolute;right:-140px;top:-160px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(183,243,74,.45),rgba(183,243,74,0) 70%)}
.sr-hero__grid{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.sr-hero h1{font-size:clamp(2rem,4vw,3.2rem);font-weight:800}
.sr-lead{margin:16px 0 0;font-size:1.08rem;line-height:1.7;color:var(--ink2);max-width:36em}
.sr-actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 0}
.sr-stats{list-style:none;display:flex;flex-wrap:wrap;gap:12px 28px;margin:28px 0 0;padding:0}
.sr-stats li{display:flex;flex-direction:column}
.sr-stats strong{font-family:"Lexend",sans-serif;font-size:1.9rem;line-height:1;color:var(--indigo)}
.sr-stats span{font-size:.9rem;color:var(--ink2);margin-top:4px}
.sr-hero__tiles{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sr-tile{position:relative;display:block;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 16px 34px rgba(29,27,79,.12);transition:transform .2s}
.sr-tile:hover{transform:translateY(-4px)}
.sr-tile__img{display:block;aspect-ratio:1/1;background:#f2f3fb}
.sr-tile__img img{object-fit:contain;padding:10px}
.sr-tile__t{position:absolute;left:10px;right:10px;bottom:10px;padding:8px 12px;border-radius:12px;background:rgba(29,27,79,.88);color:#fff;font-weight:700;font-size:.9rem;line-height:1.3}
.sr-tile--2,.sr-tile--4{transform:translateY(22px)}
.sr-tile--2:hover,.sr-tile--4:hover{transform:translateY(18px)}

/* Sections */
.sr-sec{padding:64px 0}
.sr-sec--sky{background:var(--sky)}
.sr-sec--ink{background:var(--ink);color:#d9dbf5}
.sr-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;margin-bottom:24px}
.sr-head h2{font-size:clamp(1.6rem,3vw,2.3rem);font-weight:800}
.sr-head>a{font-weight:700;color:var(--indigo)}
.sr-head--light h2{color:#fff}.sr-head--light .sr-kicker{color:var(--lime)}

/* Categories */
.sr-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sr-cat{display:grid;grid-template-columns:92px 1fr;grid-template-rows:auto auto;column-gap:14px;align-content:center;padding:10px;border-radius:18px;border:1.5px solid var(--line);background:#fff;transition:border-color .2s,box-shadow .2s,transform .2s}
.sr-cat:hover{border-color:var(--indigo);box-shadow:0 12px 26px rgba(61,50,214,.12);transform:translateY(-3px)}
.sr-cat__img{grid-row:span 2;display:block;aspect-ratio:1/1;border-radius:12px;overflow:hidden;background:#f6f7fc}
.sr-cat__img img{object-fit:contain}
.sr-cat__t{align-self:end;font-family:"Lexend",sans-serif;font-weight:700;line-height:1.3}
.sr-cat__n{align-self:start;font-size:.86rem;color:var(--ink2);margin-top:2px}

/* Products */
.sr-products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.sr-prod{display:flex;flex-direction:column;background:#fff;border-radius:18px;padding:12px;border:1px solid var(--line);transition:box-shadow .2s,transform .2s}
.sr-prod:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(29,27,79,.12)}
.sr-prod__img{display:block;aspect-ratio:1/1;border-radius:12px;overflow:hidden;background:#f6f7fc}
.sr-prod__img img{object-fit:contain}
.sr-prod__cat{margin:10px 0 2px;font-size:.78rem;font-weight:600;color:var(--indigo)}
.sr-prod h3{font-family:"Inter",sans-serif!important;font-size:.98rem;font-weight:700;line-height:1.38;margin:0 0 8px}
.sr-prod h3 a:hover{color:var(--indigo)}
.sr-quote{margin-top:auto;font-weight:700;font-size:.9rem;color:var(--indigo)!important}
.sr-quote:hover{text-decoration:underline}

/* Models */
.sr-pills{display:flex;flex-wrap:wrap;gap:8px;margin:-8px 0 20px}
.sr-pills a{padding:7px 14px;border-radius:999px;background:var(--sky);font-weight:600;font-size:.9rem;color:var(--indigo2)}
.sr-pills a:hover{background:var(--indigo);color:#fff}
.sr-pills small{opacity:.7}
.sr-models{display:grid;grid-template-columns:1.5fr 1fr 1fr;grid-template-rows:auto auto;gap:18px}
.sr-model{position:relative;border-radius:20px;overflow:hidden;background:#111;min-height:220px}
.sr-model--big{grid-row:span 2}
.sr-model__img{position:absolute;inset:0;display:block}
.sr-model__img img{transition:transform .5s;opacity:.92}
.sr-model:hover .sr-model__img img{transform:scale(1.05)}
.sr-model__txt{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 16px;background:linear-gradient(180deg,rgba(17,16,48,0),rgba(17,16,48,.88))}
.sr-model h3{color:#fff;font-size:1.05rem;line-height:1.35}
.sr-model--big h3{font-size:1.45rem}
.sr-model p{margin:8px 0 0;color:#e2e3f7;line-height:1.55;font-size:.95rem}

/* Solutions */
.sr-sols{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sr-sol{display:flex;flex-direction:column;padding:24px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);transition:background .2s,transform .2s}
.sr-sol:hover{background:rgba(255,255,255,.1);transform:translateY(-3px)}
.sr-sol__ic{font-size:1.8rem;margin-bottom:10px}
.sr-sol h3{color:#fff;font-size:1.25rem;margin-bottom:8px}
.sr-sol p{margin:0 0 14px;line-height:1.6}
.sr-more{margin-top:auto;font-weight:700;color:var(--lime)}
.sr-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:26px;padding:26px 30px;border-radius:22px;background:linear-gradient(120deg,var(--indigo),#5b4bff)}
.sr-cta h3{color:#fff;font-size:1.45rem;margin-bottom:6px}
.sr-cta p{margin:0;color:#e3e1ff;line-height:1.6}
.sr-cta__btns{display:flex!important;flex-wrap:wrap;gap:10px;flex-shrink:0}

/* Blog + FAQ */
.sr-two{display:grid;grid-template-columns:1.35fr 1fr;gap:44px}
.sr-blog{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sr-post{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:start}
.sr-post__img{display:block;aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:#f2f3fb}
.sr-post h3{font-family:"Inter",sans-serif!important;font-size:.98rem;font-weight:700;line-height:1.4;margin-bottom:4px}
.sr-post h3 a:hover{color:var(--indigo)}
.sr-post time{font-size:.84rem;color:var(--ink2)}
.sr-faq details{border:1.5px solid var(--line);border-radius:14px;padding:4px 18px;margin-bottom:10px;background:#fff}
.sr-faq details[open]{border-color:var(--indigo);background:var(--sky)}
.sr-faq summary{cursor:pointer;font-weight:700;padding:12px 0;list-style:none}
.sr-faq summary::-webkit-details-marker{display:none}
.sr-faq summary::after{content:"+";float:right;font-size:1.3rem;line-height:1;color:var(--indigo)}
.sr-faq details[open] summary::after{content:"–"}
.sr-faq p{margin:0 0 14px;line-height:1.65;color:var(--ink2)}

@media (max-width:980px){.sr-hero__grid,.sr-two{grid-template-columns:1fr}.sr-cats{grid-template-columns:1fr 1fr}.sr-products{grid-template-columns:repeat(3,1fr)}.sr-models{grid-template-columns:1fr 1fr}.sr-model--big{grid-column:span 2;grid-row:auto;min-height:300px}.sr-sols{grid-template-columns:1fr}.sr-cta{flex-direction:column;align-items:flex-start}}
@media (max-width:600px){.sr-hero{padding:34px 0 46px}.sr-sec{padding:44px 0}.sr-products{grid-template-columns:1fr 1fr;gap:12px}.sr-cats{grid-template-columns:1fr;gap:10px}.sr-blog{grid-template-columns:1fr}.sr-models{grid-template-columns:1fr}.sr-model--big{grid-column:auto}.sr-cta{padding:22px}.sr-actions .sr-btn{flex:1 1 100%}}
@media (prefers-reduced-motion:reduce){.sr-home *{transition:none!important}}

/* Brand logo (SVG wordmark) */
.skynext-brand-logo img{height:48px;width:auto;max-width:250px}
.skynext-brand-logo--footer img{height:54px;background:#fff;border-radius:12px;padding:6px 10px}

/* Single post extras */
.sr-toc{margin:22px 0 26px;padding:16px 20px;background:#eef1ff;border:1px solid #e3e6f5;border-left:4px solid #3d32d6;border-radius:12px}
.sr-toc p{margin:0 0 6px!important;font-weight:800}
.sr-toc ol{margin:0;padding-left:1.2em}.sr-toc li{margin:3px 0}
.sr-toc a{color:#2c23a8}
.content-prose h2[id],.entry-content h2[id]{scroll-margin-top:110px}

/* Header: keep sub-menus of the last items on screen */
html,body{overflow-x:clip}
.primary-navigation .menu>li:nth-last-child(-n+2)>.sub-menu{left:auto;right:0}
.primary-navigation .menu>li:nth-last-child(-n+2) .sub-menu .sub-menu{left:auto;right:calc(100% + 7px)}
