@import url("/assets/fonts/fonts.css?v=genup1");
:root{
  --bg:#05070a;
  --sidebar:#0b1016;
  --top:#0a111a;
  --band:#0c1724;
  --card:#03070b;
  --line:#21344a;
  --line-soft:#142231;
  --text:#f5f7fa;
  --muted:#9aa7b7;
  --red:#f0333a;
  --red-dark:#db1920;
  --blue:#4da6ff;
  --side-w:222px;
  --font-body:"Plus Jakarta Sans",Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-display:"Oswald","Arial Narrow",Impact,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,a{font:inherit;color:inherit}button{cursor:pointer}a{text-decoration:none}
.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--side-w) minmax(0,1fr);background:#05070a}
.sidebar{height:100vh;position:sticky;top:0;z-index:20;display:flex;flex-direction:column;overflow:hidden;background:var(--sidebar);border-right:1px solid #121a24}
.brand-block{height:132px;padding:15px 20px 8px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.brand-logo{width:154px;height:66px;object-fit:contain;filter:drop-shadow(0 3px 11px rgba(240,51,58,.14))}
.brand-sub{margin-top:0;color:#8592a1;font-size:15px;font-weight:700;letter-spacing:3.9px;line-height:1}
.side-nav{padding:7px 11px 154px;overflow-y:auto;scrollbar-width:none}.side-nav::-webkit-scrollbar{display:none}
.nav-item{min-height:37px;display:flex;align-items:center;gap:11px;padding:8px 11px;border-radius:9px;color:#e0e5eb;font-size:15px;font-weight:600;transition:background .16s,color .16s}
.nav-item:hover{background:#121923;color:#fff}.nav-item svg{width:16px;height:16px;flex:none;fill:none;stroke:#8b98a8;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.nav-item.active{background:transparent;color:#fff}.nav-item.active svg{stroke:#35a7ff;filter:drop-shadow(0 0 5px rgba(53,167,255,.32))}
.nav-item .chevron{margin-left:auto;color:#a7b0ba;font-size:20px;font-weight:300;line-height:1}
.nav-section{padding:19px 11px 7px;color:#7e8a9a;font-size:15px;font-weight:800;letter-spacing:1.8px}.nav-section.two-line{line-height:1.55}
.sidebar-bottom{position:absolute;left:10px;right:10px;bottom:10px;display:grid;gap:10px;padding-top:21px;background:linear-gradient(180deg,rgba(11,16,22,0),#0b1016 18%,#0b1016)}
.plan-card,.profile-card{width:100%;min-height:58px;border:1px solid #1a2330;border-radius:12px;background:#121820;display:flex;align-items:center;gap:11px;text-align:left;padding:10px 12px}
.plan-card{background:linear-gradient(90deg,rgba(87,11,22,.48),rgba(54,16,25,.38));border-color:#35151e}.plan-card:hover,.profile-card:hover{border-color:#2a394b}
.plan-icon{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;border:1px solid rgba(240,51,58,.35);color:#ff4650}.avatar{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,#ff3037,#c4111b);font-weight:800}
.plan-card b,.profile-card b{display:block;font-size:15px}.plan-card small,.profile-card small{display:block;margin-top:3px;color:#7f8b9b;font-size:15px}
.workspace{min-width:0;background:#06080c}.topbar{height:58px;position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 28px;background:rgba(10,17,26,.97);backdrop-filter:blur(14px);border-bottom:1px solid #111b27}
.topbar-left,.topbar-right{display:flex;align-items:center;gap:9px;min-width:0}.top-chip,.icon-chip{height:34px;border:1px solid #192534;border-radius:9px;background:#121c28;color:#dce3eb;font-size:15px;font-weight:650;white-space:nowrap}.top-chip{padding:0 13px}.icon-chip{width:34px;padding:0;position:relative}.top-chip:hover,.icon-chip:hover{background:#182433;border-color:#26384d}
.activation{height:34px;display:flex;align-items:center;overflow:hidden;border:1px solid #192534;border-radius:9px;background:#101823;color:#8390a0;font-size:15px;white-space:nowrap}.activation>span:not(.status-dot){padding:0 12px}.activation .status-dot{width:6px;height:6px;border-radius:50%;background:#68788c;margin-left:13px}.activation button{height:100%;border:0;padding:0 18px;background:var(--red);color:#fff;font-weight:750}.badge{position:absolute;top:-8px;right:-5px;width:18px;height:18px;display:grid;place-items:center;border:2px solid #0a1019;border-radius:50%;background:#e8232e;color:#fff;font-size:15px}.language{min-width:80px}
.content{min-height:calc(100vh - 58px);background:#06080c}
.hero{padding:30px 72px 14px;text-align:center;display:flex;flex-direction:column;align-items:center;background:radial-gradient(ellipse at 50% 54%,rgba(219,25,32,.15),rgba(77,166,255,.035) 36%,transparent 67%);position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse at 50% 33%,#000 22%,transparent 72%);mask-image:radial-gradient(ellipse at 50% 33%,#000 22%,transparent 72%)}.hero>*{position:relative;z-index:1}
.meta-pill{height:28px;display:inline-flex;align-items:center;gap:8px;padding:0 15px;border:1px solid rgba(255,255,255,.045);border-radius:18px;background:rgba(34,35,49,.86);color:#dce2e9;font-size:15px;font-weight:750;letter-spacing:.65px;box-shadow:0 7px 24px rgba(0,0,0,.2)}.meta-pill b{color:#4db7ff}.blue-dot{width:6px;height:6px;border-radius:50%;background:#4da6ff;box-shadow:0 0 10px rgba(77,166,255,.55)}
.hero-title-panel{width:min(100%,1058px);height:65px;margin-top:11px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.025);border-radius:16px;background:linear-gradient(90deg,#0b1119,#0c131d 48%,#0a1119);box-shadow:0 16px 48px rgba(0,0,0,.25)}
h1{margin:0;font-family:var(--font-display);font-size:clamp(42px,4.05vw,56px);font-weight:400;line-height:1;letter-spacing:.015em;text-transform:uppercase;color:#fff;white-space:nowrap}h1 em,h1 strong{font-style:normal;font-weight:500;color:var(--red);text-shadow:0 0 46px rgba(240,51,58,.28)}
.brand-promise{height:38px;margin-top:9px;padding:0 17px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.11);border-radius:9px;background:linear-gradient(180deg,rgba(45,32,40,.72),rgba(27,24,31,.7));font-family:var(--font-display);font-size:clamp(15px,1.35vw,19px);font-weight:400;line-height:1;letter-spacing:.02em;color:#f4f2f4}
.hero-kicker{height:24px;margin-top:9px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;background:rgba(92,12,22,.24);font-family:var(--font-display);font-size:15px;font-weight:400;letter-spacing:.02em;color:#fff}
.quick-tools{height:126px;padding:14px 60px 16px;background:#0c1724;border-top:1px solid #102031;border-bottom:1px solid #112334;display:flex;align-items:center}.quick-grid{width:min(100%,970px);margin:0 auto;display:grid;gap:10px}.quick-row{display:flex;align-items:center;justify-content:center;gap:27px;min-height:16px}.quick-link{padding:0;border:0;background:transparent;color:#fff;font-family:var(--font-display);font-size:15px;font-weight:400;line-height:1;text-transform:uppercase;letter-spacing:.01em;position:relative}.quick-link:hover{color:#55b8ff}.quick-link::after{content:"";position:absolute;left:50%;right:50%;bottom:-4px;height:1px;background:#4da6ff;transition:.16s}.quick-link:hover::after{left:0;right:0}
.tool-section{padding:31px 72px 48px;background:#05080c}.tool-grid{width:min(100%,1020px);margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:18px;row-gap:18px}
.tool-card{height:90px;min-width:0;display:grid;grid-template-columns:120px minmax(0,1fr);overflow:hidden;position:relative;border:1px solid #22364c;border-radius:10px;background:#020508;box-shadow:0 8px 22px rgba(0,0,0,.27);transition:transform .16s,border-color .16s,box-shadow .16s}.tool-card:hover{transform:translateY(-2px);border-color:#3b5d7f;box-shadow:0 14px 28px rgba(0,0,0,.36)}.tool-card.integration{border-color:#244564}
.tool-visual{position:relative;overflow:hidden;background:#08111c}.tool-visual img{width:100%;height:100%;display:block;object-fit:cover;object-position:center center}.tool-visual::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 58%,rgba(2,5,8,.3) 82%,#020508 100%)}
.tool-copy{min-width:0;position:relative;display:flex;flex-direction:column;justify-content:center;padding:11px 31px 10px 12px;background:#020508}.tool-card.integration .tool-copy{background:linear-gradient(135deg,#030609,#07111d)}.tool-title{color:#f6f7f8;font-size:15px;font-weight:700;line-height:1.17}.tool-desc{max-width:132px;margin-top:6px;color:#a7b2c0;font-size:15px;font-weight:400;line-height:1.37}
.tool-arrow{position:absolute;right:8px;bottom:8px;width:25px;height:25px;display:grid;place-items:center;border:1px solid #31506f;border-radius:50%;background:#1d3550;color:#fff;transition:background .16s,transform .16s}.tool-arrow svg{display:block;width:10px;height:10px;overflow:visible}.tool-arrow path{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.tool-card:hover .tool-arrow{background:#28577f;transform:translateX(1px)}
.site-footer{min-height:78px;display:flex;align-items:center;justify-content:center;gap:18px;padding:22px 28px 28px;color:#77879a;font-size:15px}.site-footer nav{display:flex;gap:18px}.site-footer a{color:#f1f3f5}.site-footer a:hover{color:#55b8ff}
.toast{position:fixed;right:24px;bottom:24px;z-index:100;max-width:360px;padding:12px 15px;border:1px solid #284059;border-radius:10px;background:#101927;color:#f3f6f8;font-size:15px;box-shadow:0 16px 48px rgba(0,0,0,.45);opacity:0;transform:translateY(12px);pointer-events:none;transition:.22s}.toast.show{opacity:1;transform:translateY(0)}
@media(max-width:1280px){:root{--side-w:210px}.topbar{padding:0 18px}.activation>span:not(.status-dot){display:none}.hero{padding-left:42px;padding-right:42px}.hero-title-panel{width:min(100%,990px)}.quick-tools{padding-left:30px;padding-right:30px}.tool-section{padding-left:48px;padding-right:48px}.tool-grid{width:min(100%,930px);column-gap:16px;row-gap:16px}.tool-card{height:86px;grid-template-columns:115px minmax(0,1fr)}.tool-title{font-size:15px}.tool-desc{font-size:15px}}
@media(max-width:1050px){.app-shell{grid-template-columns:76px 1fr}.brand-block{padding:14px 7px}.brand-logo{width:66px;object-fit:cover;object-position:left}.brand-sub,.nav-item span:not(.chevron),.nav-section,.sidebar-bottom b,.sidebar-bottom small{display:none}.nav-item{justify-content:center}.nav-item .chevron{display:none}.sidebar-bottom{left:8px;right:8px}.plan-card,.profile-card{justify-content:center;padding:10px}.topbar-left .top-chip:nth-child(n+2){display:none}.quick-tools{height:auto;min-height:126px}.quick-row{flex-wrap:wrap}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px;column-gap:16px;row-gap:16px}.tool-card{height:104px;grid-template-columns:139px minmax(0,1fr)}h1{font-size:42px}.site-footer{flex-direction:column;gap:10px}}
@media(max-width:680px){.app-shell{display:block}.sidebar{display:none}.topbar{position:static;overflow-x:auto}.topbar-right{display:none}.hero{padding:24px 16px 14px}.hero-title-panel{height:auto;min-height:62px;padding:8px}.hero-title-panel h1{font-size:32px;white-space:normal}.brand-promise{height:auto;min-height:38px;padding:9px 14px;font-size:15px}.quick-tools{padding:14px 16px}.quick-grid{gap:13px}.quick-row{gap:12px 18px}.quick-link{font-size:15px}.tool-section{padding:20px 16px}.tool-grid{grid-template-columns:1fr;gap:16px}.tool-card{height:116px;grid-template-columns:155px minmax(0,1fr)}.tool-title{font-size:15px}.tool-desc{font-size:15px}.site-footer nav{flex-wrap:wrap;justify-content:center}}


/* ACCESSIBILITY RELEASE GUARD */
button:focus-visible,a:focus-visible,.tool-card:focus-visible{outline:2px solid #5eb5ff;outline-offset:3px}.tool-card:focus-visible{border-color:#5eb5ff;box-shadow:0 0 0 3px rgba(94,181,255,.12),0 14px 28px rgba(0,0,0,.36)}.quick-link:focus-visible{color:#7bc8ff}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Live release QA: keep tool forms within intermediate and mobile viewports. */
@media (min-width:1101px) and (max-width:1250px){
 body[class*="-page"] [class$="-layout"]{grid-template-columns:minmax(0,1fr) 300px}
}
@media (max-width:900px){
 body[class*="-page"] [class$="-heading"]{flex-wrap:wrap}
 body[class*="-page"] [class$="-heading"]>div:first-child{min-width:0;max-width:100%}
}
@media (max-width:940px){
 body.unit-page .unit-layout{grid-template-columns:minmax(0,1fr)}
 body.unit-page .converter-card{min-width:0}
}
@media (max-width:640px){
 body.margin-page .m-heading h1 em,body.discount-page .d-heading h1 em{display:block}
}

/* Shared GENUP typography: readable controls without browser zoom. */
body{font-size:16px;line-height:1.6}input,select,textarea,button{font-family:var(--font-body);font-size:16px}button{white-space:normal;height:auto;min-height:40px;line-height:1.35}input,select{min-height:44px}label{line-height:1.5}p,small{line-height:1.6}.tool-side{overflow-y:auto}.privacy-note{position:static;margin-top:24px}.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1200px;width:100%}.tool-card{height:auto;min-height:154px;grid-template-columns:100px minmax(0,1fr)}.tool-desc{max-width:none}.tool-title{font-size:17px}.tool-section{padding-left:32px;padding-right:32px}.topbar,.tool-topbar{height:auto;min-height:64px;padding-top:10px;padding-bottom:10px}.section-head{flex-wrap:wrap;align-items:flex-start}.section-head small{max-width:100%;text-align:left}.quick-tools{height:auto;min-height:126px}.quick-row{flex-wrap:wrap;gap:18px}.hero-title-panel{height:auto;min-height:72px}.hero h1{white-space:normal}.qr-layout{grid-template-columns:minmax(0,1fr) 380px}.qr-heading{flex-wrap:wrap}.form-field input,.form-field select,.form-field textarea{font-size:16px}.tool-top-actions{flex-wrap:wrap}.type-tabs button{height:auto;min-height:40px}.topbar-left,.topbar-right{flex-wrap:wrap}.site-footer{flex-wrap:wrap}
@media(max-width:1250px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.qr-layout{grid-template-columns:minmax(0,1fr)}.tool-card{min-height:148px}.tool-topbar{flex-wrap:wrap;gap:12px}.qr-heading h1{white-space:normal}}
@media(max-width:680px){.tool-grid{grid-template-columns:1fr}.tool-card{grid-template-columns:120px minmax(0,1fr)}.topbar{overflow-x:visible}.tool-section{padding:20px 16px}.tool-top-actions{width:100%}.breadcrumb{flex-wrap:wrap}.primary-btn,.ghost-btn{font-size:16px}.form-grid{min-width:0}.setting-card{min-width:0}.qr-heading p{font-size:16px}.privacy-note{display:none}}

/* Match the GENUP main brand size and sidebar spacing. */
@media(min-width:1051px){:root{--side-w:300px}.tool-page-shell{grid-template-columns:300px minmax(0,1fr)}.brand-block,.tool-brand{height:148px;padding:12px 20px 8px;align-items:center}.brand-logo,.tool-brand img{width:220px;height:90px;object-fit:contain}.brand-sub,.tool-brand span{font-family:var(--font-display);font-size:13px;letter-spacing:.22em;margin-top:7px}}

.gu-gate__anh{display:none}.gu-gate__hop{font-family:var(--font-body);padding:32px;max-width:min(560px,calc(100vw - 32px))}.gu-gate__mo-ta{font-size:16px}.gu-gate__tieu-de{font-size:32px}.gu-gate__nut a{font-size:16px;padding:12px 20px}.gu-gate__nut{flex-wrap:wrap}[hidden]{display:none!important}

@media(min-width:1051px){.brand-block,.tool-brand{height:auto;min-height:156px;padding:22px 20px 18px;gap:12px}.brand-logo,.tool-brand img{height:76px;width:auto;max-width:100%}.brand-sub,.tool-brand span{margin:0}}

/* Keep shared sizing above per-tool styles in the cascade. */
body[class*="-page"] input,body[class*="-page"] select,body[class*="-page"] textarea,body[class*="-page"] button{font-family:var(--font-body);font-size:16px}
@media(min-width:1051px){body .tool-page-shell{grid-template-columns:300px minmax(0,1fr)}body .tool-brand{height:auto;min-height:156px;padding:22px 20px 18px;gap:12px;align-items:center}body .tool-brand img{height:76px;width:auto;max-width:100%}body .tool-brand span{font-family:var(--font-display);font-size:13px;letter-spacing:.22em;margin:0}}

body[class*="-page"] input,body[class*="-page"] select,body[class*="-page"] textarea,body[class*="-page"] button{font-family:var(--font-body)!important;font-size:16px!important}
body .tool-side{padding-top:0}
body[class*="-page"] :is(.qr-layout,.barcode-layout,.sku-layout,.serial-layout,.coupon-layout,.image-layout,.utm-layout,.short-layout,.file-layout,.unit-layout,.cbm-layout,.packaging-layout,.vat-layout,.margin-layout,.discount-layout,.expiry-layout){grid-template-columns:minmax(0,1fr) 380px}
@media(max-width:1450px){body[class*="-page"] :is(.qr-layout,.barcode-layout,.sku-layout,.serial-layout,.coupon-layout,.image-layout,.utm-layout,.short-layout,.file-layout,.unit-layout,.cbm-layout,.packaging-layout,.vat-layout,.margin-layout,.discount-layout,.expiry-layout){grid-template-columns:minmax(0,1fr) 300px}}
@media(max-width:1050px){body[class*="-page"] :is(.qr-layout,.barcode-layout,.sku-layout,.serial-layout,.coupon-layout,.image-layout,.utm-layout,.short-layout,.file-layout,.unit-layout,.cbm-layout,.packaging-layout,.vat-layout,.margin-layout,.discount-layout,.expiry-layout){grid-template-columns:minmax(0,1fr)}}

body[class*="-page"] :is(.barcode-layout,.cbm-layout,.cp-layout,.d-layout,.e-layout,.fc-layout,.img-layout,.m-layout,.pack-layout,.qr-layout,.sl-layout,.short-layout,.sku-layout,.unit-layout,.utm-layout,.vat-layout){grid-template-columns:minmax(0,1fr) 380px}
@media(max-width:1450px){body[class*="-page"] :is(.barcode-layout,.cbm-layout,.cp-layout,.d-layout,.e-layout,.fc-layout,.img-layout,.m-layout,.pack-layout,.qr-layout,.sl-layout,.short-layout,.sku-layout,.unit-layout,.utm-layout,.vat-layout){grid-template-columns:minmax(0,1fr) 300px}}
@media(max-width:1050px){body[class*="-page"] :is(.barcode-layout,.cbm-layout,.cp-layout,.d-layout,.e-layout,.fc-layout,.img-layout,.m-layout,.pack-layout,.qr-layout,.sl-layout,.short-layout,.sku-layout,.unit-layout,.utm-layout,.vat-layout){grid-template-columns:minmax(0,1fr)}}

body .privacy-note{position:static;margin-top:24px}

/* Native menus must remain readable on Windows Chromium as well as dark themes. */
select{color-scheme:dark}
select option,select optgroup{background-color:#f1f5f9!important;color:#111827!important}
select option:disabled{color:#596579!important}
input[type="date"],input[type="checkbox"],input[type="radio"]{color-scheme:dark}
/* Two stable navigation rows and full-size tool illustrations. */
.quick-tools{height:auto;min-height:126px;padding:18px 32px;overflow-x:auto}
.quick-grid{width:100%;max-width:1440px;gap:12px}
.quick-row{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:14px;align-items:center}
.quick-link{white-space:normal;font-size:15px;line-height:1.4;min-height:42px;text-align:center}
.tool-grid{max-width:1440px;grid-template-columns:repeat(3,minmax(0,1fr))}
.tool-card{height:auto;min-height:0;grid-template-columns:minmax(0,46%) minmax(0,1fr);align-items:center}
.tool-visual{width:100%;height:auto;aspect-ratio:4/3;align-self:center}
.tool-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.tool-visual::after{display:none}
.tool-copy{min-width:0;padding:18px 36px 30px 16px}
.tool-title{font-size:19px;line-height:1.35;overflow-wrap:break-word}
.tool-desc{max-width:none;font-size:16px;line-height:1.5;overflow-wrap:break-word}
@media(max-width:1450px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1050px){.quick-grid{min-width:950px}.quick-tools{justify-content:flex-start}.tool-section{padding-left:24px;padding-right:24px}}
@media(max-width:760px){.tool-grid{grid-template-columns:1fr}.tool-card{grid-template-columns:minmax(0,44%) minmax(0,1fr)}.tool-visual{aspect-ratio:1/1}.tool-copy{padding:16px 32px 30px 14px}.tool-title{font-size:18px}.tool-section{padding:20px 16px}}

.sidebar .nav-item[href="#tools"],.sidebar .nav-item[href="/gWKhSbXJXNuscqPA1jybZrZpnw5PNQqbWkYdohIlR5EroFYddOEbiSROW4MxcVohtiR1/"]{text-transform:uppercase;font-weight:800}

input[type="checkbox"],input[type="radio"]{width:20px!important;height:20px!important;min-height:20px!important;flex:0 0 20px;accent-color:#246cff;padding:0!important}
html[dir="rtl"] .app-shell{direction:ltr}html[dir="rtl"] :is(.workspace,.tool-work,.side-nav){direction:rtl}html[dir="rtl"] :is(input,textarea,canvas,svg,.barcode-history){direction:ltr}
html:is([lang="zh"],[lang="ja"],[lang="ko"],[lang="hi"],[lang="ar"]) :is(h1,h2,.quick-link,.brand-promise,.hero-tagline){font-family:var(--font-body);font-weight:700;line-height:1.5}
html:not([lang="en"]) h1{white-space:normal} .genup-language{max-width:165px;width:auto;padding:0 12px;min-height:40px;background:#121c28;color:#f5f7fa}

/* Home composition follows the shared GENUP UI typography. */
.quick-tools{margin:24px 60px 12px;padding:20px 38px;min-height:100px;border:1px solid #263647;border-radius:28px;overflow-x:auto}
.quick-grid{width:100%;max-width:1380px;gap:6px}
.quick-row{display:flex;flex-wrap:nowrap;justify-content:space-between;gap:18px;min-width:max-content}
.quick-link{font-family:var(--font-body);font-size:14px;font-weight:700;text-transform:none;letter-spacing:0;white-space:nowrap;line-height:1.4;min-height:24px}
.tool-section{padding:30px 64px 48px}
.tool-grid{max-width:1256px;column-gap:16px;row-gap:16px}
.tool-copy{align-self:stretch;justify-content:center;padding:20px 44px 28px 14px}
.tool-up-mark{position:absolute;top:16px;right:8px;width:30px;height:30px;object-fit:contain}
.tool-title{font-size:17px;line-height:1.4}
.tool-desc{font-size:14px;line-height:1.5}
@media(max-width:1450px){.quick-tools{margin:20px 32px 12px;padding:16px 24px}.tool-section{padding-left:48px;padding-right:48px}}
@media(max-width:760px){.quick-tools{margin:12px 16px;padding:12px 16px}.quick-link{font-size:14px}.tool-section{padding:20px 16px}.tool-copy{padding:16px 40px 28px 12px}.tool-up-mark{width:26px;height:26px;top:12px;right:7px}}

.integration-main{max-width:1000px;padding:48px 32px;margin:auto;display:grid;grid-template-columns:40% minmax(0,1fr);gap:32px}.integration-art{width:100%;aspect-ratio:4/3;object-fit:contain}.integration-main h1{font-size:32px}.integration-note{color:var(--muted);font-size:14px}.integration-main .primary-btn{display:inline-flex;align-items:center;padding:12px 20px;text-decoration:none}@media(max-width:760px){.integration-main{grid-template-columns:1fr;padding:24px 16px}}

/* Localized tool names wrap into centered rows without horizontal scrolling. */
.quick-tools{overflow:visible;justify-content:center}
.quick-grid{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 20px;min-width:0;width:100%;max-width:1380px}
.quick-row{display:contents;min-width:0}
.quick-link{flex:0 0 auto;min-height:24px;font-size:14px;white-space:nowrap}
@media(max-width:1450px){.quick-grid{gap:8px 12px}.quick-link{font-size:12px}}
@media(max-width:760px){.quick-grid{gap:8px 14px}.quick-link{font-size:12px;max-width:100%;white-space:normal;text-align:center}.quick-tools{overflow:visible}}

@media(min-width:761px) and (max-width:1450px){html:is([lang="fr"],[lang="es"]) .quick-link{font-size:11px}html:is([lang="fr"],[lang="es"]) .quick-grid{column-gap:10px}}

.quick-grid.quick-balanced{display:flex;flex-direction:column;gap:8px;min-width:0}.quick-balanced .quick-row{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:var(--quick-gap,18px);min-width:0;width:100%}.quick-balanced .quick-link{font-size:var(--quick-font,14px)!important;white-space:nowrap;flex:0 0 auto}
@media(max-width:760px){.quick-balanced .quick-row{flex-wrap:wrap}.quick-balanced .quick-link{max-width:100%;white-space:normal}}

/* Canonical GENUP typography: brand remains Latin across UI locales. */
html body .hero-title-panel h1,html body .hero-title-panel h1 :is(span,em,strong){font-family:var(--font-display);font-weight:400;font-style:normal;line-height:1.1;font-synthesis:none}
html body .quick-grid .quick-link{font-family:var(--gu-font-body,var(--font-body));font-weight:var(--gu-fw-body,500);letter-spacing:0;line-height:1.4;font-synthesis:none}