:root {
    --col1: #1F3A5F;
    --col1Chiaro: #2C5282;
    --col2: #F5F7FA;
    --card: #FFFFFF;
    --testo: #1A1F2C;
    --testoChiaro: #6B7280;

    --radius: 10px;
    --shadow: 0 8px 24px rgba(0,0,0,0.08);
    --transition: all 0.25s ease;
		
	--larghezzaContenuti:1200px;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

.gx-language-picker {
	display: inline-flex;
	align-items: center;
}

.gx-language-picker select {
	appearance: none;
	-webkit-appearance: none;
	border: 1px solid rgba(31,58,95,.18);
	border-radius: 999px;
	background: #fff;
	color: var(--col1);
	font: inherit;
	font-size: 12px;
	font-weight: 700;
	padding: 8px 28px 8px 11px;
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 14px) 12px, calc(100% - 10px) 12px;
	background-size: 4px 4px, 4px 4px;
	background-repeat: no-repeat;
	cursor: pointer;
}

.gx-language-picker select,
.gx-language-picker select option {
	font-family: "Segoe UI Emoji", "Noto Color Emoji", system-ui, sans-serif;
}

.gx-language-picker select:focus-visible {
	outline: 3px solid rgba(44,82,130,.25);
	outline-offset: 2px;
}

.gx-language-picker {
	position: relative;
	z-index: 30;
}

.gx-language-trigger {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 36px;
	padding: 7px 10px;
	border: 1px solid rgba(31,58,95,.18);
	border-radius: 999px;
	background: #fff;
	color: var(--col1);
	font: inherit;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
}

.gx-language-trigger:hover,
.gx-language-trigger:focus-visible {
	border-color: var(--col1Chiaro);
	outline: 3px solid rgba(44,82,130,.18);
	outline-offset: 2px;
}

.gx-language-trigger-flag {
	width: 24px !important;
	height: 16px !important;
	object-fit: cover;
	border-radius: 3px;
	display: block;
}

.gx-language-trigger i {
	font-size: 10px;
	opacity: .65;
}

.gx-language-menu {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	width: 210px;
	max-height: min(420px, 70vh);
	overflow: auto;
	padding: 6px;
	border: 1px solid rgba(31,58,95,.14);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(17,24,39,.18);
}

.gx-language-menu[hidden] {
	display: none;
}

.gx-language-option {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 9px 10px;
	border: 0;
	border-radius: 9px;
	background: transparent;
	color: var(--testo);
	font: inherit;
	font-size: 13px;
	text-align: left;
	cursor: pointer;
}

.gx-language-option:hover,
.gx-language-option:focus-visible,
.gx-language-option.is-selected {
	background: #f1f5f9;
	outline: none;
}

.gx-language-option img {
	width: 28px !important;
	height: 18px !important;
	object-fit: cover;
	border-radius: 3px;
	flex: 0 0 28px;
}

.gx-language-native {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.gx-public-legal-footer {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	padding: 22px 24px 30px;
	color: var(--testoChiaro);
	font-size: 12px;
	text-align: center;
}

.gx-public-legal-footer a {
	color: inherit;
	text-decoration: none;
}

.gx-public-legal-footer a:hover,
.gx-public-legal-footer a:focus-visible {
	color: var(--col1);
	text-decoration: underline;
	text-underline-offset: 3px;
}



html {
	overflow-x: hidden;
}

body {
    font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    background: var(--col2);
    color: var(--testo);
	overflow-x: hidden;
}



/* MENU */

.menu {
	display: flex;
	gap: 25px;
}

.menu a {
	color: white;
	text-decoration: none;
	font-size: 14px;
	opacity: 0.85;
	transition: var(--transition);
}

.menu a:hover {
	opacity: 1;
}


/* TESTATA */


.dropdownLogin {
	display: none;
	position: absolute;
	top: 30px;
	left: -50px;
	background: white;
	padding: 20px;
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	width: 280px;
}

.dropdownLogin.active {
	display: block;
}


@media (max-width: 1430px) {
	.dropdownLogin {
		top:53px;
        position: fixed;
		left: unset;
		right:0px;	
	}
}

.dropdownLogin input {
	width: 100%;
	padding: 10px;
	margin-bottom: 10px;
	border-radius: 6px;
	border: 1px solid #ddd;
}

.dropdownLogin button {
    width: 100%;
    padding: 10px;
    background: var(--col1);
    color: white;
    border: none;
    border-radius: 6px;
}

.hamburger {
	display: none;
	font-size: 22px;
	cursor: pointer;
	color: white;
}

@media (max-width: 768px) {
	.menu {
		display: none;
		flex-direction: column;
		background: var(--col1);
		position: absolute;
		top: 65px;
		right: 0px;
		width: 220px;
		padding: 20px;
		border-radius: var(--radius);
		box-shadow: var(--shadow);
	}

	.menu.active {
		display: flex;
	}

	.hamburger {
		display: block;
	}
}

/* HOME */

.grigliaHome {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 colonne */
    gap: 20px; /* Spazio tra le card */
    margin: auto;
    padding: 40px 20px;
}

@media (max-width: 768px) {
    .grigliaHome {
        grid-template-columns: 1fr; /* 1 colonna su mobile */
    }
}


.image-box img {
    height: 180px;
}


.image-box {
    background: var(--card);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
    transition: var(--transition);
    cursor: pointer;
}

.image-box:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.12);
}

.image-box a {
    text-decoration: none;
    color: inherit;
    display: block;
}

.image-box img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.card-content {
    padding: 20px;
}

.card-title {
    font-size: 20px;
    font-weight: 600;
    color: var(--col1);
    margin-bottom: 8px;
}

.card-action {
    display: inline-block;
    margin-top: 10px;
    padding: 6px 12px;
    background: var(--col1Chiaro);
    color: white;
    border-radius: 6px;
    font-size: 13px;
    transition: var(--transition);
}

.image-box:hover .card-action {
    background: var(--col1);
}


/* Registrazione - stile base */
.registration-page {
    max-width: 600px;
    margin: 0 auto;
    padding: 40px 20px;
    background: white;
    border-radius: 12px;
    box-shadow: var(--shadow);
    margin-top: 40px;
}

.page-title {
    text-align: center;
    font-size: 24px;
    color: var(--col1);
    margin-bottom: 20px;
}

.page-description {
    text-align: center;
    color: var(--testoChiaro);
    margin-bottom: 30px;
}

.registration-form .form-group {
    margin-bottom: 20px;
}

.registration-form label {
    display: block;
    font-size: 14px;
    color: var(--testo);
    margin-bottom: 8px;
}

.registration-form input,
.registration-form select {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 14px;
    margin-bottom: 10px;
}

.registration-form button {
    width: 100%;
    padding: 12px;
    background: var(--col1);
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    cursor: pointer;
}

.registration-form button:hover {
    background: var(--col1Chiaro);
}

.login-footer {
    text-align: center;
    font-size: 14px;
    color: var(--testoChiaro);
    margin-top: 15px;
}

.login-footer a {
    color: var(--col1);
    text-decoration: none;
    font-weight: 600;
}

/* Allineamento checkbox e testo con margine corretto */
.checkbox-wrapper {
    display: flex;
    align-items: center;
    gap: 10px; /* Aumentato per dare più spazio tra la checkbox e il testo */
}

/* Impostiamo l'allineamento verticale della checkbox */
.checkbox-wrapper input[type="checkbox"] {
    vertical-align: middle; /* Allineamento verticale della checkbox */
    margin: 0;
    width: auto; /* Rimuove la larghezza predefinita della checkbox */
    height: auto; /* Mantiene l'altezza della checkbox proporzionata */
}

/* Impostazioni per il testo */
.checkbox-wrapper label {
    font-size: 14px;
    color: var(--testo); /* Colore del testo */
}

/* Stile per il pulsante "Registrati" */
.registration-form button {
    margin-top: 20px; /* Distanza tra il bottone e il campo di accettazione */
    padding: 12px;
    background: var(--col1);
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    cursor: pointer;
    width: 100%;
    text-align: center;
}

.registration-form button:hover {
    background: var(--col1Chiaro);
}


/* =========================================================
   GIANO DESIGN SYSTEM — APP FOUNDATION
========================================================= */

:root {
    --g-bg: #F5F7FA;
    --g-surface: #FFFFFF;
    --g-surface-soft: #F9FAFB;
    --g-muted: #F3F4F6;

    --g-text: #111827;
    --g-text-soft: #374151;
    --g-text-muted: #6B7280;
    --g-text-faint: #9CA3AF;

    --g-border: #E5E7EB;

    --g-primary: #111827;
    --g-primary-hover: #1F2937;

    --g-success-bg: #DCFCE7;
    --g-success-text: #166534;

    --g-warning-bg: #FEF3C7;
    --g-warning-text: #92400E;

    --g-danger-bg: #FEE2E2;
    --g-danger-text: #991B1B;

    --g-info-bg: #DBEAFE;
    --g-info-text: #1D4ED8;

    --r-sm: 12px;
    --r-md: 16px;
    --r-lg: 24px;
    --r-xl: 32px;

    --shadow-soft: 0 2px 8px rgba(17, 24, 39, .04);
    --shadow-drawer: -16px 0 48px rgba(17, 24, 39, .16);

    --sidebar-width: 284px;
    --topbar-height: 78px;
    --drawer-width: 560px;
}


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

button {
    cursor: pointer;
}

a {
    color: inherit;
}

/* =========================================================
   APP SHELL
========================================================= */

.app-shell {
    min-height: 100vh;
    display: flex;
}

.app-sidebar {
    width: var(--sidebar-width);
    background: var(--g-surface);
    border-right: 1px solid var(--g-border);
    height: 100vh;
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    padding: 22px;
    gap: 24px;
    z-index: 80;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 56px;
}

.brand-mark {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: var(--g-primary);
    color: white;
    text-decoration: none;
    display: grid;
    place-items: center;
    font-size: 21px;
    font-weight: 900;
}

.brand-text strong {
    display: block;
    font-size: 16px;
}

.brand-text span {
    display: block;
    margin-top: 3px;
    color: var(--g-text-muted);
    font-size: 12px;
    font-weight: 600;
}

.sidebar-nav {
    flex: 1;
    overflow-y: auto;
    padding-right: 2px;
}

.nav-group {
    margin-bottom: 24px;
}

.nav-group-title {
    color: var(--g-text-faint);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0 0 10px 12px;
}

.nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    padding: 13px 14px;
    border-radius: 14px;
    color: var(--g-text-soft);
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 4px;
    transition: background .18s ease, color .18s ease, transform .18s ease;
}

.nav-link i {
    width: 18px;
    text-align: center;
    color: var(--g-text-muted);
}

.nav-link:hover,
.nav-link.active {
    background: var(--g-muted);
    color: var(--g-text);
}

.nav-link:hover {
    transform: translateX(2px);
}

.nav-link em {
    margin-left: auto;
    font-style: normal;
    font-size: 11px;
    padding: 4px 8px;
    border-radius: 999px;
    background: var(--g-warning-bg);
    color: var(--g-warning-text);
}

.sidebar-footer {
    border-top: 1px solid var(--g-border);
    padding-top: 14px;
}

.app-main {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.app-topbar {
    height: var(--topbar-height);
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--g-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 28px;
    position: sticky;
    top: 0;
    z-index: 60;
}

.topbar-left,
.topbar-right {
    display: flex;
    align-items: center;
    gap: 14px;
}

.mobile-menu-button {
    display: none;
}

.global-search {
    width: min(420px, 38vw);
    background: var(--g-muted);
    border-radius: 16px;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--g-text-muted);
}

.global-search input {
    border: none;
    outline: none;
    background: transparent;
    width: 100%;
    color: var(--g-text);
}

.icon-button {
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 14px;
    background: var(--g-muted);
    color: var(--g-text);
    display: grid;
    place-items: center;
}

.context-chip,
.profile-chip {
    border: none;
    background: var(--g-surface-soft);
    border: 1px solid var(--g-border);
    border-radius: 14px;
    padding: 11px 14px;
    font-weight: 800;
    color: var(--g-text);
}

.user-chip {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 18px;
    background: var(--g-surface-soft);
    border: 1px solid var(--g-border);
}

.user-avatar {
    width: 36px;
    height: 36px;
    border-radius: 13px;
    background: var(--g-primary);
    color: white;
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 900;
}

.user-chip strong {
    display: block;
    font-size: 13px;
}

.user-chip span {
    display: block;
    color: var(--g-text-muted);
    font-size: 11px;
    margin-top: 2px;
}

.page-head {
    padding: 28px 32px 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.page-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--g-text-muted);
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 8px;
}

.page-breadcrumb i {
    font-size: 9px;
    color: var(--g-text-faint);
}

.page-head h1 {
    margin: 0;
    font-size: 30px;
    letter-spacing: -.03em;
}

.page-head p {
    margin: 8px 0 0;
    color: var(--g-text-muted);
    line-height: 1.5;
}

.page-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.app-content {
    padding: 28px 32px 40px;
    min-width: 0;
    overflow-x: auto;
}
.branch-table-card,
.employee-table-card {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
/* =========================================================
   DRAWER SYSTEM
========================================================= */

.drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(17, 24, 39, .42);
    opacity: 0;
    visibility: hidden;
    z-index: 180;
    transition: .2s ease;
}

.drawer-overlay.open {
    opacity: 1;
    visibility: visible;
}

.app-drawer {
    position: fixed;
    right: calc(var(--drawer-width) * -1);
    top: 0;
    width: var(--drawer-width);
    max-width: calc(100vw - 24px);
    height: 100vh;
    background: var(--g-surface);
    z-index: 200;
    box-shadow: var(--shadow-drawer);
    transition: right .24s ease;
    display: flex;
    flex-direction: column;
}

.app-drawer.open {
    right: 0;
}

.drawer-header {
    min-height: 82px;
    padding: 18px 22px;
    border-bottom: 1px solid var(--g-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.drawer-kicker {
    display: block;
    color: var(--g-text-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 4px;
}

.drawer-header h3 {
    margin: 0;
    font-size: 22px;
    letter-spacing: -.02em;
}

.drawer-tabs {
    display: flex;
    gap: 8px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--g-border);
    overflow-x: auto;
}

.drawer-tab {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    background: var(--g-muted);
    color: var(--g-text-soft);
    font-weight: 800;
    white-space: nowrap;
}

.drawer-tab.active {
    background: var(--g-primary);
    color: white;
}

.drawer-body {
    padding: 22px;
    overflow-y: auto;
    flex: 1;
}

.drawer-footer {
    border-top: 1px solid var(--g-border);
    padding: 16px 22px;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    background: var(--g-surface);
}

.drawer-section {
    background: var(--g-surface-soft);
    border: 1px solid var(--g-border);
    border-radius: 22px;
    padding: 18px;
    margin-bottom: 16px;
}

.drawer-section h4 {
    margin: 0 0 14px;
    font-size: 16px;
}

.drawer-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.drawer-list-row {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 12px;
    border-radius: 14px;
    background: white;
}

.drawer-list-row span {
    color: var(--g-text-muted);
    font-size: 13px;
}

.drawer-list-row strong {
    text-align: right;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 980px) {
    .app-sidebar {
        position: fixed;
        left: -290px;
        transition: left .22s ease;
    }

    .app-sidebar.open {
        left: 0;
    }

    .mobile-menu-button {
        display: grid;
    }

    .global-search {
        width: min(320px, 48vw);
    }

    .page-head {
        flex-direction: column;
    }
}

@media (max-width: 720px) {
    .app-topbar {
        padding: 0 16px;
    }

    .global-search {
        display: none;
    }

    .user-chip div:not(.user-avatar),
    .context-chip {
        display: none;
    }

    .page-head,
    .app-content {
        padding-left: 18px;
        padding-right: 18px;
    }

    .page-actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .app-drawer {
        max-width: 100vw;
        width: 100vw;
        right: -100vw;
    }
}


/* =========================================================
   PHASE 1 REAL FIX — STABLE SHELL
========================================================= */
.logo-mark{
    background:transparent;
    border:none;
    width:auto;
    height:auto;
    border-radius:0;
    display:flex;
    align-items:center;
    justify-content:center;
}

.logo-mark img{
    height:42px;
    width:auto;
    display:block;
}
.brand-logo {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: #FFFFFF;
    border: 1px solid var(--g-border);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    text-decoration: none;
    flex: 0 0 auto;
}

.brand-logo img {
    max-width: 44px;
    max-height: 44px;
    width: auto;
    height: auto;
    display: block;
}

.app-topbar .topbar-left {
    flex: 0 0 auto;
}

.app-topbar .topbar-right {
    margin-left: auto;
}

.app-footer {
    margin: 32px 28px;
    padding: 18px 22px;
    border: 1px solid var(--g-border);
    border-radius: 22px;
    background: white;
    color: var(--g-text-muted);
    font-size: 13px;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    box-shadow: var(--shadow-soft);
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-responsive > table {
    min-width: 900px;
}

.g-table-card,
.table-card,
.delivery-table-card,
.employee-table-card,
.replacement-table-card,
.procurement-table-card,
stock-table-card {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.g-table-card table,
.table-card table,
.delivery-table-card table,
.employee-table-card table,
.replacement-table-card table,
.procurement-table-card table,
.stock-table-card table {
    min-width: 900px;
}

.sidebar-mobile-backdrop {
    display: none;
}

.mobile-menu-button {
    display: none !important;
}

@media (max-width: 980px) {

    .mobile-menu-button {
        display: grid !important;
    }

    .app-sidebar {
        position: fixed;
        left: -290px;
        top: 0;
        height: 100vh;
        z-index: 300;
        transition: left .22s ease;
    }

    .app-sidebar.open {
        left: 0;
    }

    body.sidebar-open {
        overflow: hidden;
    }

    body.sidebar-open .sidebar-mobile-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(17,24,39,.42);
        z-index: 250;
    }

    .app-topbar {
        padding: 0 16px;
    }

    .app-topbar .topbar-right {
        margin-left: auto;
    }
}

@media (max-width: 720px) {
    .global-search {
        display: none;
    }

    .app-footer {
        margin: 0 18px 18px;
        flex-direction: column;
    }
}


/* Gianus logo restore */
.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 14px;
}

.brand-logo {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    background: #FFFFFF;
    border: 1px solid var(--g-border);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    text-decoration: none;
    flex: 0 0 auto;
}

.brand-logo img {
    max-width: 48px;
    max-height: 48px;
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
}

.brand-text strong {
    display: block;
}


/* =========================================================
   GIANUS UX 4.0 — DEFINITIVE UI PASS
   Simple first. One main CTA. Lists + powerful drawer.
========================================================= */

.ux4-shell{max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:24px}
.ux4-narrow{max-width:980px;margin:0 auto;display:flex;flex-direction:column;gap:24px}
.ux4-hero{background:#fff;border:1px solid rgba(229,231,235,.86);box-shadow:var(--shadow-soft);border-radius:40px;padding:clamp(30px,5vw,56px)}
.ux4-hero h1{margin:0;font-size:clamp(36px,5vw,64px);line-height:.98;letter-spacing:-.06em}
.ux4-hero p{margin:18px 0 0;color:var(--g-text-muted);font-size:18px;line-height:1.55;max-width:720px}
.ux4-hero .focus{font-size:clamp(22px,3vw,36px);font-weight:900;letter-spacing:-.04em;color:var(--g-text);margin-top:18px}
.ux4-cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.ux4-primary{border:0;border-radius:22px;padding:17px 24px;background:var(--g-primary);color:#fff;font-weight:950;text-decoration:none;display:inline-flex;gap:10px;align-items:center}
.ux4-secondary{border:1px solid var(--g-border);border-radius:22px;padding:17px 24px;background:#fff;color:var(--g-text);font-weight:900;text-decoration:none;display:inline-flex;gap:10px;align-items:center}
.ux4-soft-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px;padding-top:22px;border-top:1px solid var(--g-border)}
.ux4-soft{border-radius:999px;background:var(--g-surface-soft);padding:10px 14px;color:var(--g-text-muted);font-size:13px;font-weight:850}
.ux4-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.ux4-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ux4-card{background:#fff;border:1px solid rgba(229,231,235,.86);border-radius:28px;padding:22px;box-shadow:var(--shadow-soft)}
.ux4-card h3{margin:0 0 16px;font-size:22px;letter-spacing:-.03em}
.ux4-card p{color:var(--g-text-muted);line-height:1.55}
.ux4-master{display:grid;grid-template-columns:minmax(330px,440px) minmax(0,1fr);gap:22px;align-items:start}
.ux4-list{display:flex;flex-direction:column;gap:10px}
.ux4-row{border:1px solid var(--g-border);background:#fff;border-radius:21px;padding:16px;display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:13px;align-items:center;cursor:pointer;transition:.16s}
.ux4-row:hover,.ux4-row.active{background:var(--g-surface-soft);border-color:#d1d5db;transform:translateY(-1px)}
.ux4-avatar{width:46px;height:46px;border-radius:17px;background:var(--g-primary);color:#fff;display:grid;place-items:center;font-weight:950;letter-spacing:-.03em}
.ux4-icon{width:46px;height:46px;border-radius:17px;background:var(--g-muted);display:grid;place-items:center;color:var(--g-text)}
.ux4-row strong{display:block;margin-bottom:4px}.ux4-row small{color:var(--g-text-muted);font-weight:750}
.ux4-pill{display:inline-flex;align-items:center;border-radius:999px;padding:7px 11px;background:var(--g-muted);color:var(--g-text-soft);font-size:12px;font-weight:950;white-space:nowrap}
.ux4-pill.ok{background:var(--g-success-bg);color:var(--g-success-text)}
.ux4-pill.warn{background:var(--g-warning-bg);color:var(--g-warning-text)}
.ux4-pill.danger{background:var(--g-danger-bg);color:var(--g-danger-text)}
.ux4-pill.info{background:var(--g-info-bg);color:var(--g-info-text)}
.ux4-detail{position:sticky;top:calc(var(--topbar-height) + 20px);min-height:560px}
.ux4-person{text-align:center;padding:10px 0 18px}
.ux4-person .photo{width:90px;height:90px;margin:0 auto 16px;border-radius:32px;background:var(--g-primary);color:#fff;display:grid;place-items:center;font-weight:950;font-size:30px}
.ux4-person h2{margin:0;font-size:30px;letter-spacing:-.04em}.ux4-person p{margin:7px 0 0;color:var(--g-text-muted);font-weight:750}
.ux4-state{margin:16px auto 0;display:inline-flex;border-radius:999px;padding:9px 14px;background:var(--g-success-bg);color:var(--g-success-text);font-weight:950;font-size:13px}
.ux4-state.warn{background:var(--g-warning-bg);color:var(--g-warning-text)}.ux4-state.danger{background:var(--g-danger-bg);color:var(--g-danger-text)}
.ux4-tabs{display:flex;gap:8px;padding:6px;border-radius:18px;background:var(--g-muted);overflow-x:auto;margin-bottom:18px}
.ux4-tabs button{border:0;border-radius:14px;padding:10px 13px;background:transparent;color:var(--g-text-soft);font-weight:950;white-space:nowrap}
.ux4-tabs button.active{background:#fff;color:var(--g-text);box-shadow:var(--shadow-soft)}
.ux4-panel{display:none}.ux4-panel.active{display:block}
.ux4-info{display:flex;flex-direction:column;gap:10px}
.ux4-info-row{display:flex;justify-content:space-between;gap:14px;padding:13px;border-radius:16px;background:var(--g-surface-soft)}
.ux4-info-row span{color:var(--g-text-muted)}.ux4-info-row strong{text-align:right}
.ux4-items{display:flex;flex-direction:column;gap:12px}
.ux4-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px;border-radius:18px;background:var(--g-surface-soft)}
.ux4-item .emoji{font-size:26px}.ux4-item strong{display:block}.ux4-item small{color:var(--g-text-muted);font-weight:750}
.ux4-flow{display:flex;flex-direction:column;gap:12px}
.ux4-flow-step{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start}
.ux4-flow-step .dot{width:34px;height:34px;border-radius:13px;background:var(--g-primary);color:#fff;display:grid;place-items:center;font-weight:900}
.ux4-flow-step .box{background:var(--g-surface-soft);border-radius:16px;padding:13px}
.ux4-flow-step .box strong{display:block}.ux4-flow-step .box span{color:var(--g-text-muted);font-size:13px}
.ux4-scan{background:#fff;border:1px solid rgba(229,231,235,.86);border-radius:42px;padding:clamp(34px,7vw,72px);text-align:center;box-shadow:var(--shadow-soft)}
.ux4-scan h1{font-size:clamp(36px,5vw,64px);letter-spacing:-.06em;margin:0 0 14px}
.ux4-scan p{color:var(--g-text-muted);font-size:18px;line-height:1.55;margin:0}
.ux4-scan button{margin-top:32px;border:none;border-radius:32px;background:var(--g-primary);color:#fff;padding:24px 34px;font-size:22px;font-weight:950;display:inline-flex;gap:14px;align-items:center}
.ux4-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.ux4-table{width:100%;min-width:720px;border-collapse:collapse}
.ux4-table th{text-align:left;color:var(--g-text-muted);font-size:12px;text-transform:uppercase;padding:12px;border-bottom:1px solid var(--g-border)}
.ux4-table td{padding:14px 12px;border-bottom:1px solid var(--g-border)}
.ux4-policy{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;border:1px solid var(--g-border);border-radius:20px;padding:16px;background:#fff}
.ux4-toggle{display:inline-flex;align-items:center;gap:8px;font-weight:900;color:var(--g-text-muted)}
.ux4-toggle input{width:18px;height:18px}
@media(max-width:1100px){.ux4-master,.ux4-grid-2,.ux4-grid-3{grid-template-columns:1fr}.ux4-detail{position:static;min-height:auto}}
@media(max-width:720px){.ux4-row{grid-template-columns:46px minmax(0,1fr)}.ux4-row .ux4-pill{grid-column:1/-1;justify-self:start}.ux4-policy{grid-template-columns:1fr}.ux4-hero,.ux4-scan{border-radius:28px;padding:26px}}



/* Customization Library */
.ux4-preview-tile{width:46px;height:46px;border-radius:17px;background:linear-gradient(135deg,#111827,#6b7280);color:#fff;display:grid;place-items:center;font-weight:950;font-size:12px}
.ux4-preview-tile.light{background:linear-gradient(135deg,#f9fafb,#d1d5db);color:#111827}
.ux4-lock-note{border-radius:18px;background:var(--g-warning-bg);color:var(--g-warning-text);padding:14px;font-weight:850;line-height:1.45}
.ux4-upload-box{border:2px dashed var(--g-border);border-radius:22px;padding:22px;text-align:center;background:var(--g-surface-soft)}
.ux4-upload-box strong{display:block;margin-bottom:6px}
.ux4-permission-row{display:grid;grid-template-columns:minmax(0,1fr) 150px 150px 150px;gap:10px;align-items:center;background:#fff;border:1px solid var(--g-border);border-radius:18px;padding:14px}
@media(max-width:900px){.ux4-permission-row{grid-template-columns:1fr}}



/* GIANUS CART */
.cart-topbar-button{position:relative}
.cart-badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;border-radius:999px;background:var(--g-danger-text);color:#fff;font-size:11px;font-weight:900;display:grid;place-items:center;padding:0 5px}
.gx-cart-section{display:flex;flex-direction:column;gap:12px}
.gx-cart-group{border:1px solid var(--g-border);border-radius:22px;background:#fff;padding:16px}
.gx-cart-group h4{margin:0 0 12px;font-size:16px}
.gx-cart-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:11px 0;border-top:1px solid var(--g-border)}
.gx-cart-line:first-of-type{border-top:0}
.gx-cart-line strong{display:block}.gx-cart-line small{display:block;color:var(--g-text-muted);font-weight:750;margin-top:3px}
.gx-cart-warning{border-radius:18px;background:var(--g-warning-bg);color:var(--g-warning-text);padding:14px;font-weight:850;line-height:1.45}
.gx-cart-page-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:start}
@media(max-width:1000px){.gx-cart-page-grid{grid-template-columns:1fr}}



/* GIANUS CUSTOMIZATION PAGES FIX */
.gx-assets-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.gx-asset-tile{border:1px solid var(--g-border);border-radius:28px;padding:16px;background:#fff;box-shadow:var(--shadow-soft);cursor:pointer}
.gx-asset-preview{height:170px;border-radius:24px;background:linear-gradient(135deg,#f9fafb,#e5e7eb);display:grid;place-items:center;overflow:hidden;margin-bottom:14px}
.gx-asset-preview img{max-width:86%;max-height:145px;object-fit:contain}
.gx-preview-placeholder{width:96px;height:96px;border-radius:32px;background:var(--g-primary);color:#fff;display:grid;place-items:center;font-weight:950;font-size:22px;letter-spacing:-.05em}
.gx-preview-placeholder.patch{border-radius:999px}.gx-preview-placeholder.shield{border-radius:26px 26px 38px 38px}.gx-preview-placeholder.flag{border-radius:18px}
.gx-asset-tile h4{margin:0 0 6px;font-size:18px;letter-spacing:-.03em}.gx-asset-tile p{margin:0 0 12px;color:var(--g-text-muted);font-weight:750;line-height:1.45}
.gx-upload-zone{border:2px dashed var(--g-border);background:var(--g-surface-soft);border-radius:28px;padding:28px;display:block;text-align:center}
.gx-upload-zone i{font-size:30px;margin-bottom:10px;color:var(--g-text-muted)}.gx-upload-zone strong{display:block;font-size:19px;margin-bottom:6px}.gx-upload-zone p{margin:0;color:var(--g-text-muted);line-height:1.5}.gx-upload-zone input[type=file]{display:none}
.gx-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.gx-field label{display:block;margin-bottom:8px;color:var(--g-text-muted);font-size:13px;font-weight:850}
.gx-input,.gx-select{width:100%;border:1px solid var(--g-border);background:#fff;border-radius:16px;padding:14px 15px;font-size:15px;color:var(--g-text);outline:none}
.gx-format-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.gx-format{border:1px solid var(--g-border);background:#fff;border-radius:16px;padding:12px;font-weight:900;display:flex;justify-content:space-between}.gx-format.present{background:var(--g-success-bg);color:var(--g-success-text)}.gx-format.missing{background:var(--g-muted);color:var(--g-text-muted)}
.gx-quality-box{border-radius:24px;padding:18px;background:var(--g-surface-soft);border:1px solid var(--g-border)}.gx-quality-box.good{background:var(--g-success-bg);color:var(--g-success-text)}.gx-quality-box.warn{background:var(--g-warning-bg);color:var(--g-warning-text)}.gx-quality-box.bad{background:var(--g-danger-bg);color:var(--g-danger-text)}
@media(max-width:1000px){.gx-assets-grid,.gx-form-grid,.gx-format-grid{grid-template-columns:1fr}}



/* =========================================================
   GIANUS UX4 FRONTEND CONSOLIDATION
   Single family: ux4-* with gx-* aliases for old pages.
========================================================= */

/* Tabs */
.ux4-tabs,
.gx-tabs{
    display:flex;
    gap:8px;
    padding:6px;
    border-radius:20px;
    background:var(--g-muted);
    width:max-content;
    max-width:100%;
    overflow:auto;
}
.ux4-tabs a,
.gx-tabs a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:12px 16px;
    border-radius:16px;
    text-decoration:none;
    color:var(--g-text-soft);
    font-weight:900;
    white-space:nowrap;
}
.ux4-tabs a.active,
.gx-tabs a.active{
    background:#fff;
    color:var(--g-text);
    box-shadow:var(--shadow-soft);
}

/* Library / cards */
.ux4-library,
.gx-library-tabs{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
}
.ux4-library-card,
.gx-library-tab{
    background:#fff;
    border:1px solid var(--g-border);
    border-radius:28px;
    padding:22px;
    text-decoration:none;
    box-shadow:var(--shadow-soft);
    display:flex;
    flex-direction:column;
    gap:12px;
    color:var(--g-text);
}
.ux4-library-card i,
.gx-library-tab i{
    width:48px;
    height:48px;
    border-radius:18px;
    background:var(--g-muted);
    display:grid;
    place-items:center;
    font-size:18px;
}
.ux4-library-card strong,
.gx-library-tab strong{
    display:block;
    font-size:20px;
    letter-spacing:-.03em;
}
.ux4-library-card span,
.gx-library-tab span{
    color:var(--g-text-muted);
    font-size:13px;
    font-weight:750;
    line-height:1.45;
}

/* Forms */
.ux4-form-grid,
.gx-form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.ux4-field label,
.gx-field label{
    display:block;
    margin-bottom:8px;
    color:var(--g-text-muted);
    font-size:13px;
    font-weight:850;
}
.ux4-input,
.ux4-select,
.gx-input,
.gx-select{
    width:100%;
    border:1px solid var(--g-border);
    background:#fff;
    border-radius:16px;
    padding:14px 15px;
    font-size:15px;
    color:var(--g-text);
    outline:none;
}
.ux4-input:focus,
.ux4-select:focus,
.gx-input:focus,
.gx-select:focus{
    border-color:#9ca3af;
    box-shadow:0 0 0 4px rgba(17,24,39,.06);
}
.ux4-section-title,
.gx-section-title{
    margin:0 0 16px;
    font-size:24px;
    letter-spacing:-.04em;
}

/* Upload and previews */
.ux4-upload-zone,
.gx-upload-zone{
    border:2px dashed var(--g-border);
    background:var(--g-surface-soft);
    border-radius:28px;
    padding:28px;
    display:block;
    text-align:center;
    transition:.18s ease;
}
.ux4-upload-zone:hover,
.gx-upload-zone:hover{
    background:#fff;
    border-color:#9ca3af;
}
.ux4-upload-zone i,
.gx-upload-zone i{
    font-size:30px;
    margin-bottom:10px;
    color:var(--g-text-muted);
}
.ux4-upload-zone strong,
.gx-upload-zone strong{
    display:block;
    font-size:19px;
    margin-bottom:6px;
}
.ux4-upload-zone p,
.gx-upload-zone p{
    margin:0;
    color:var(--g-text-muted);
    line-height:1.5;
}
.ux4-upload-zone input[type=file],
.gx-upload-zone input[type=file]{
    display:none;
}
.ux4-preview,
.gx-asset-preview{
    height:170px;
    border-radius:24px;
    background:linear-gradient(135deg,#f9fafb,#e5e7eb);
    display:grid;
    place-items:center;
    overflow:hidden;
    margin-bottom:14px;
}
.ux4-preview img,
.gx-asset-preview img{
    max-width:86%;
    max-height:145px;
    object-fit:contain;
}
.ux4-preview-mark,
.gx-preview-placeholder{
    width:96px;
    height:96px;
    border-radius:32px;
    background:var(--g-primary);
    color:#fff;
    display:grid;
    place-items:center;
    font-weight:950;
    font-size:22px;
    letter-spacing:-.05em;
}
.ux4-preview-mark.patch,
.gx-preview-placeholder.patch{border-radius:999px}
.ux4-preview-mark.shield,
.gx-preview-placeholder.shield{border-radius:26px 26px 38px 38px}
.ux4-preview-mark.flag,
.gx-preview-placeholder.flag{border-radius:18px}

/* Asset grid */
.ux4-asset-grid,
.gx-assets-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.ux4-asset-card,
.gx-asset-tile{
    border:1px solid var(--g-border);
    border-radius:28px;
    padding:16px;
    background:#fff;
    box-shadow:var(--shadow-soft);
    cursor:pointer;
    color:var(--g-text);
}
.ux4-asset-card h4,
.gx-asset-tile h4{
    margin:0 0 6px;
    font-size:18px;
    letter-spacing:-.03em;
}
.ux4-asset-card p,
.gx-asset-tile p{
    margin:0 0 12px;
    color:var(--g-text-muted);
    font-weight:750;
    line-height:1.45;
}

/* Quality */
.ux4-format-grid,
.gx-format-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}
.ux4-format,
.gx-format{
    border:1px solid var(--g-border);
    background:#fff;
    border-radius:16px;
    padding:12px;
    font-weight:900;
    display:flex;
    justify-content:space-between;
}
.ux4-format.present,
.gx-format.present{background:var(--g-success-bg);color:var(--g-success-text)}
.ux4-format.missing,
.gx-format.missing{background:var(--g-muted);color:var(--g-text-muted)}
.ux4-quality,
.gx-quality-box{
    border-radius:24px;
    padding:18px;
    background:var(--g-surface-soft);
    border:1px solid var(--g-border);
}
.ux4-quality.good,
.gx-quality-box.good{background:var(--g-success-bg);color:var(--g-success-text)}
.ux4-quality.warn,
.gx-quality-box.warn{background:var(--g-warning-bg);color:var(--g-warning-text)}
.ux4-quality.bad,
.gx-quality-box.bad{background:var(--g-danger-bg);color:var(--g-danger-text)}

.ux4-profile-avatar,
.gx-profile-avatar{
    width:96px;
    height:96px;
    border-radius:34px;
    background:var(--g-primary);
    color:#fff;
    display:grid;
    place-items:center;
    font-size:32px;
    font-weight:950;
}

@media(max-width:1000px){
    .ux4-library,
    .gx-library-tabs,
    .ux4-asset-grid,
    .gx-assets-grid,
    .ux4-form-grid,
    .gx-form-grid,
    .ux4-format-grid,
    .gx-format-grid{
        grid-template-columns:1fr;
    }
    .ux4-tabs,
    .gx-tabs{width:100%}
}


/* GIANUS ATELIER / SERVIZIO ASSISTITO */
.ux4-concierge-hero{background:#fff;border:1px solid var(--g-border);border-radius:42px;padding:clamp(32px,5vw,62px);box-shadow:var(--shadow-soft)}
.ux4-concierge-hero h1{margin:0;font-size:clamp(38px,5.2vw,72px);line-height:.96;letter-spacing:-.065em}
.ux4-concierge-hero .focus{margin-top:18px;max-width:780px;font-size:clamp(21px,2.4vw,34px);font-weight:950;letter-spacing:-.045em;color:var(--g-text)}
.ux4-concierge-hero p{margin:18px 0 0;max-width:720px;color:var(--g-text-muted);font-size:18px;line-height:1.55}
.ux4-status-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:26px;max-width:920px}
.ux4-status-chip{background:var(--g-surface-soft);border:1px solid var(--g-border);border-radius:20px;padding:15px 16px;display:flex;gap:12px;align-items:flex-start}
.ux4-status-chip i{width:28px;height:28px;border-radius:999px;display:grid;place-items:center;background:#fff}
.ux4-status-chip strong{display:block;font-size:14px}.ux4-status-chip span{display:block;margin-top:4px;color:var(--g-text-muted);font-size:13px;font-weight:750;line-height:1.35}
.ux4-action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ux4-action-card{background:#fff;border:1px solid var(--g-border);border-radius:32px;padding:24px;text-decoration:none;color:var(--g-text);box-shadow:var(--shadow-soft);min-height:210px;display:flex;flex-direction:column;justify-content:space-between;text-align:left}
.ux4-action-icon{width:58px;height:58px;border-radius:22px;background:var(--g-primary);color:#fff;display:grid;place-items:center;font-size:22px}
.ux4-action-card h3{margin:22px 0 8px;font-size:22px;letter-spacing:-.04em}.ux4-action-card p{margin:0;color:var(--g-text-muted);line-height:1.45;font-weight:750}
.ux4-human-card{display:grid;grid-template-columns:86px minmax(0,1fr);gap:18px;align-items:center}.ux4-human-avatar{width:86px;height:86px;border-radius:30px;background:linear-gradient(135deg,#111827,#374151);color:#fff;display:grid;place-items:center;font-size:26px;font-weight:950}
.ux4-atelier-row{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:18px;align-items:center;border:1px solid var(--g-border);background:#fff;border-radius:28px;padding:16px;box-shadow:var(--shadow-soft)}
.ux4-atelier-preview{height:92px;border-radius:24px;background:linear-gradient(135deg,#f9fafb,#e5e7eb);display:grid;place-items:center}.ux4-atelier-preview strong{width:58px;height:58px;border-radius:20px;background:var(--g-primary);color:#fff;display:grid;place-items:center}
.ux4-quiet-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.ux4-quiet-metric{border:1px solid var(--g-border);border-radius:24px;background:#fff;padding:18px}.ux4-quiet-metric span{display:block;color:var(--g-text-muted);font-size:13px;font-weight:850}.ux4-quiet-metric strong{display:block;margin-top:8px;font-size:26px;letter-spacing:-.05em}
@media(max-width:1150px){.ux4-action-grid,.ux4-status-strip,.ux4-quiet-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.ux4-action-grid,.ux4-status-strip,.ux4-quiet-metrics,.ux4-human-card,.ux4-atelier-row{grid-template-columns:1fr}}



/* GIANUS UX 2.0 CSS */
.ux20-shell{max-width:1160px;margin:0 auto}
.ux20-hero{background:linear-gradient(135deg,#fff,#f9fafb);border:1px solid rgba(229,231,235,.8);box-shadow:var(--shadow-soft);border-radius:34px;padding:34px;margin-bottom:24px}
.ux20-hero h1{margin:0 0 8px;font-size:clamp(30px,4vw,48px);line-height:1.05;letter-spacing:-.04em}
.ux20-hero p{margin:0;color:var(--g-text-muted);font-size:17px;line-height:1.55}
.ux20-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:24px 0 0}
.ux20-metric{background:#fff;border:1px solid var(--g-border);border-radius:22px;padding:18px}
.ux20-metric strong{display:block;font-size:30px;letter-spacing:-.03em}
.ux20-metric span{display:block;margin-top:4px;color:var(--g-text-muted);font-size:13px;font-weight:800}
.ux20-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}
.ux20-action{background:#fff;border:1px solid rgba(229,231,235,.85);border-radius:24px;padding:20px;text-decoration:none;box-shadow:var(--shadow-soft);transition:transform .18s ease,box-shadow .18s ease}
.ux20-action:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(17,24,39,.07)}
.ux20-action i{width:44px;height:44px;border-radius:16px;background:var(--g-muted);display:grid;place-items:center;margin-bottom:14px}
.ux20-action strong{display:block;font-size:16px;margin-bottom:5px}
.ux20-action span{color:var(--g-text-muted);font-size:13px;line-height:1.4}
.ux20-card{background:#fff;border:1px solid rgba(229,231,235,.85);border-radius:28px;padding:22px;box-shadow:var(--shadow-soft)}
.ux20-card h3{margin:0 0 16px;font-size:22px;letter-spacing:-.02em}
.ux20-master-detail{display:grid;grid-template-columns:minmax(320px,440px) minmax(0,1fr);gap:22px;align-items:start}
.ux20-list{display:flex;flex-direction:column;gap:10px}
.ux20-row{border:1px solid var(--g-border);background:#fff;border-radius:20px;padding:16px;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:13px;align-items:center;cursor:pointer;transition:background .16s ease,border-color .16s ease,transform .16s ease}
.ux20-row:hover,.ux20-row.active{background:var(--g-surface-soft);border-color:#d1d5db;transform:translateY(-1px)}
.ux20-avatar{width:44px;height:44px;border-radius:16px;background:var(--g-primary);color:#fff;display:grid;place-items:center;font-weight:900}
.ux20-row strong{display:block;margin-bottom:4px}.ux20-row small{color:var(--g-text-muted);font-weight:700}
.ux20-pill{display:inline-flex;align-items:center;border-radius:999px;padding:7px 11px;background:var(--g-muted);color:var(--g-text-soft);font-size:12px;font-weight:900;white-space:nowrap}
.ux20-pill.ok{background:var(--g-success-bg);color:var(--g-success-text)}.ux20-pill.warn{background:var(--g-warning-bg);color:var(--g-warning-text)}.ux20-pill.danger{background:var(--g-danger-bg);color:var(--g-danger-text)}
.ux20-detail{position:sticky;top:calc(var(--topbar-height) + 20px);min-height:560px}
.ux20-detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px}
.ux20-detail-header h2{margin:0;font-size:28px;letter-spacing:-.03em}.ux20-detail-header p{margin:6px 0 0;color:var(--g-text-muted)}
.ux20-tabs{display:flex;gap:8px;padding:6px;border-radius:18px;background:var(--g-muted);overflow-x:auto;margin-bottom:18px}
.ux20-tabs button{border:0;border-radius:14px;padding:10px 13px;background:transparent;color:var(--g-text-soft);font-weight:900;white-space:nowrap}
.ux20-tabs button.active{background:#fff;color:var(--g-text);box-shadow:var(--shadow-soft)}
.ux20-panel{display:none}.ux20-panel.active{display:block}
.ux20-info-list{display:flex;flex-direction:column;gap:10px}
.ux20-info-row{display:flex;justify-content:space-between;gap:14px;padding:13px;border-radius:16px;background:var(--g-surface-soft)}
.ux20-info-row span{color:var(--g-text-muted)}.ux20-info-row strong{text-align:right}
.ux20-simple-table{width:100%;border-collapse:collapse}.ux20-simple-table th{text-align:left;color:var(--g-text-muted);font-size:12px;text-transform:uppercase;padding:12px}.ux20-simple-table td{padding:13px 12px;border-top:1px solid var(--g-border)}
.ux20-scan-card{text-align:center;padding:42px 24px}
.ux20-scan-button{border:none;border-radius:28px;padding:22px 30px;background:var(--g-primary);color:#fff;font-size:20px;font-weight:900;display:inline-flex;align-items:center;gap:12px;margin-top:18px}
@media(max-width:1100px){.ux20-master-detail{grid-template-columns:1fr}.ux20-detail{position:static;min-height:auto}.ux20-actions,.ux20-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.ux20-hero{padding:24px;border-radius:26px}.ux20-actions,.ux20-metrics{grid-template-columns:1fr}.ux20-row{grid-template-columns:42px minmax(0,1fr)}.ux20-row .ux20-pill{grid-column:1/-1;justify-self:start}}

/* =========================================================
   GIANUS PUBLIC HOME — FREE PRODUCT LANDING
   Mantiene il login esistente e sostituisce la vecchia logica catalogo.
========================================================= */

.gx-public-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .78fr);
    gap: 34px;
    align-items: center;
    padding: 72px 0 38px;
}

.gx-public-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #FFFFFF;
    border: 1px solid rgba(31, 58, 95, .12);
    color: var(--col1);
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 10px 30px rgba(31, 58, 95, .06);
    margin-bottom: 22px;
}

.gx-public-hero h1 {
    max-width: 820px;
    font-size: clamp(40px, 6vw, 78px);
    line-height: .95;
    letter-spacing: -.065em;
    color: #101827;
    margin: 0;
}

.gx-public-hero p {
    max-width: 700px;
    margin: 24px 0 0;
    color: var(--testoChiaro);
    font-size: 18px;
    line-height: 1.65;
}

.gx-public-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.gx-public-actions.center {
    justify-content: center;
}

.gx-public-btn {
    border: none;
    min-height: 48px;
    padding: 0 20px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 900;
    font-size: 14px;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.gx-public-btn:hover {
    transform: translateY(-2px);
}

.gx-public-btn.primary {
    background: #111827;
    color: #FFFFFF;
    box-shadow: 0 16px 34px rgba(17, 24, 39, .18);
}

.gx-public-btn.secondary {
    background: #FFFFFF;
    color: #111827;
    border: 1px solid rgba(17, 24, 39, .10);
}

.gx-public-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin-top: 22px;
    color: var(--testoChiaro);
    font-size: 13px;
    font-weight: 700;
}

.gx-public-trust span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.gx-public-trust i {
    color: #166534;
}

.gx-public-hero-panel {
    background: rgba(255, 255, 255, .84);
    border: 1px solid rgba(31, 58, 95, .10);
    border-radius: 34px;
    padding: 22px;
    box-shadow: 0 30px 80px rgba(31, 58, 95, .14);
    backdrop-filter: blur(18px);
}

.gx-public-panel-top {
    padding: 4px 4px 16px;
}

.gx-public-panel-top span {
    display: block;
    color: var(--testoChiaro);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 4px;
}

.gx-public-panel-top strong {
    font-size: 22px;
    letter-spacing: -.03em;
}

.gx-public-flow-card {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    background: #F9FAFB;
    border: 1px solid #E5E7EB;
    border-radius: 22px;
    padding: 16px;
    margin-bottom: 12px;
}

.gx-public-flow-card.active {
    background: #111827;
    color: #FFFFFF;
    border-color: #111827;
}

.gx-public-flow-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    border-radius: 15px;
    display: grid;
    place-items: center;
    background: #FFFFFF;
    color: #111827;
}

.gx-public-flow-card strong,
.gx-public-flow-card small {
    display: block;
}

.gx-public-flow-card strong {
    font-size: 15px;
    margin-bottom: 5px;
}

.gx-public-flow-card small {
    color: inherit;
    opacity: .72;
    line-height: 1.45;
}

.gx-public-suggestion {
    margin-top: 16px;
    padding: 16px;
    border-radius: 22px;
    background: #FEF3C7;
    color: #92400E;
}

.gx-public-suggestion strong,
.gx-public-suggestion p {
    display: block;
    margin: 0;
}

.gx-public-suggestion p {
    margin-top: 6px;
    line-height: 1.45;
    font-size: 13px;
}

.gx-public-strip {
    background: #FFFFFF;
    border: 1px solid rgba(17, 24, 39, .08);
    border-radius: 26px;
    padding: 22px 26px;
    margin: 26px 0 46px;
    box-shadow: 0 14px 40px rgba(17, 24, 39, .06);
}

.gx-public-strip div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
}

.gx-public-strip strong {
    font-size: 18px;
}

.gx-public-strip span {
    color: var(--testoChiaro);
    font-weight: 700;
}

.gx-public-section {
    padding: 58px 0;
}

.gx-public-section-head {
    max-width: 760px;
    margin-bottom: 28px;
}

.gx-public-section-head span {
    display: inline-block;
    color: var(--col1);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 10px;
}

.gx-public-section-head h2 {
    font-size: clamp(30px, 4vw, 50px);
    letter-spacing: -.055em;
    line-height: 1.02;
    margin: 0;
}

.gx-public-section-head p {
    margin: 14px 0 0;
    color: var(--testoChiaro);
    line-height: 1.65;
    font-size: 17px;
}

.gx-public-steps,
.gx-public-proof-grid,
.gx-public-service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.gx-public-steps article,
.gx-public-proof-grid div,
.gx-public-service-grid article {
    background: #FFFFFF;
    border: 1px solid rgba(17, 24, 39, .08);
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 16px 40px rgba(17, 24, 39, .06);
}

.gx-public-steps em,
.gx-public-proof-grid i,
.gx-public-service-grid i {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: #F3F4F6;
    color: #111827;
    font-style: normal;
    font-weight: 900;
    margin-bottom: 18px;
}

.gx-public-steps h3,
.gx-public-service-grid h3 {
    margin: 0 0 10px;
    font-size: 20px;
    letter-spacing: -.03em;
}

.gx-public-steps p,
.gx-public-proof-grid p,
.gx-public-service-grid p {
    margin: 0;
    color: var(--testoChiaro);
    line-height: 1.55;
}

.gx-public-proof-grid strong {
    display: block;
    font-size: 18px;
    margin-bottom: 10px;
}

.gx-public-dark {
    background: #111827;
    color: #FFFFFF;
    padding: 44px;
    border-radius: 34px;
    margin: 38px 0;
}

.gx-public-dark .gx-public-section-head span,
.gx-public-dark .gx-public-section-head p {
    color: rgba(255, 255, 255, .70);
}

.gx-public-dark .gx-public-proof-grid div {
    background: rgba(255, 255, 255, .07);
    border-color: rgba(255, 255, 255, .10);
    box-shadow: none;
}

.gx-public-dark .gx-public-proof-grid i {
    background: rgba(255, 255, 255, .12);
    color: #FFFFFF;
}

.gx-public-dark .gx-public-proof-grid p {
    color: rgba(255, 255, 255, .70);
}

.gx-public-final {
    text-align: center;
    background: #FFFFFF;
    border: 1px solid rgba(17, 24, 39, .08);
    border-radius: 36px;
    padding: 54px 24px;
    margin: 34px 0 64px;
    box-shadow: 0 22px 60px rgba(17, 24, 39, .08);
}

.gx-public-final h2 {
    margin: 0;
    font-size: clamp(30px, 4vw, 52px);
    letter-spacing: -.055em;
    line-height: 1.04;
}

.gx-public-final p {
    max-width: 640px;
    margin: 16px auto 0;
    color: var(--testoChiaro);
    line-height: 1.6;
    font-size: 17px;
}

@media (max-width: 980px) {
    .gx-public-hero {
        grid-template-columns: 1fr;
        padding-top: 46px;
    }

    .gx-public-steps,
    .gx-public-proof-grid,
    .gx-public-service-grid {
        grid-template-columns: 1fr;
    }

    .gx-public-dark {
        padding: 28px;
    }

    .gx-public-strip div {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 640px) {
    .gx-public-hero h1 {
        font-size: 42px;
    }

    .gx-public-hero p,
    .gx-public-section-head p,
    .gx-public-final p {
        font-size: 15px;
    }

    .gx-public-actions,
    .gx-public-actions.center {
        align-items: stretch;
        flex-direction: column;
    }

    .gx-public-btn {
        width: 100%;
    }

    .gx-public-hero-panel,
    .gx-public-dark,
    .gx-public-final {
        border-radius: 26px;
    }
}

/* Public header refinements */
.dropdownLogin {
    z-index: 5000;
}

.menu a {
    font-weight: 700;
}

/* =========================================================
   FREEZE1_10 — PUBLIC HOME REFINEMENT
   Home pubblica: promessa chiara, catalogo esplorabile, login preservato.
========================================================= */

.gx-public-header {
    position: sticky;
    top: 0;
    z-index: 1200;
    background: rgba(255, 255, 255, .88);
    border-bottom: 1px solid rgba(17, 24, 39, .08);
    backdrop-filter: blur(18px);
}

.gx-public-header-inner {
    max-width: var(--larghezzaContenuti);
    margin: auto;
    padding: 14px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.gx-public-main {
    background:
        radial-gradient(circle at 8% 6%, rgba(31, 58, 95, .10), transparent 34%),
        radial-gradient(circle at 92% 0%, rgba(17, 24, 39, .08), transparent 36%),
        var(--col2);
}

.gx-public-container {
    max-width: var(--larghezzaContenuti);
    margin: auto;
    padding: 15px;
}

.gx-public-header .menu a {
    color: #111827;
    opacity: .70;
}

.gx-public-header .menu a:hover {
    opacity: 1;
    transform: translateY(-1px);
}

.gx-public-header .hamburger {
    color: #111827;
}

.gx-public-header .dropdownLogin {
    top: 56px;
    border: 1px solid rgba(17, 24, 39, .08);
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(17, 24, 39, .16);
}

.gx-public-hero {
    min-height: calc(100vh - 92px);
    padding: 84px 0 54px;
}

.gx-public-kicker {
    background: rgba(255,255,255,.78);
    border-color: rgba(17, 24, 39, .10);
    color: #111827;
}

.gx-public-hero h1 {
    max-width: 780px;
    color: #0B1220;
}

.gx-public-hero p {
    max-width: 720px;
}

.gx-public-btn.ghost {
    background: transparent;
    color: #111827;
    border: 1px solid rgba(17, 24, 39, .12);
}

.gx-public-btn.primary:hover {
    box-shadow: 0 22px 42px rgba(17, 24, 39, .24);
}

.gx-public-btn.secondary:hover,
.gx-public-btn.ghost:hover {
    box-shadow: 0 12px 28px rgba(17, 24, 39, .10);
    background: #FFFFFF;
}

.gx-public-hero-panel,
.gx-public-steps article,
.gx-public-proof-grid div,
.gx-public-service-grid article,
.gx-public-category,
.gx-public-final {
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.gx-public-hero-panel:hover,
.gx-public-steps article:hover,
.gx-public-proof-grid div:hover,
.gx-public-service-grid article:hover,
.gx-public-category:hover {
    transform: translateY(-5px);
    box-shadow: 0 28px 70px rgba(17, 24, 39, .12);
    border-color: rgba(17, 24, 39, .16);
}

.gx-public-flow-card {
    transition: transform .18s ease, background .18s ease, border-color .18s ease;
}

.gx-public-flow-card:hover {
    transform: translateX(4px);
}

.gx-public-catalog-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.gx-public-category {
    display: block;
    text-decoration: none;
    background: #FFFFFF;
    border: 1px solid rgba(17, 24, 39, .08);
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 16px 40px rgba(17, 24, 39, .06);
}

.gx-public-category img {
    width: 100%;
    height: 155px;
    object-fit: cover;
    display: block;
    transition: transform .35s ease;
}

.gx-public-category:hover img {
    transform: scale(1.045);
}

.gx-public-category div {
    padding: 18px;
}

.gx-public-category strong,
.gx-public-category span {
    display: block;
}

.gx-public-category strong {
    font-size: 17px;
    letter-spacing: -.02em;
    color: #111827;
    margin-bottom: 8px;
}

.gx-public-category span {
    color: var(--testoChiaro);
    line-height: 1.45;
    font-size: 14px;
}

.gx-public-services {
    padding-top: 34px;
}

.gx-public-footer {
    margin: 20px 0 42px;
    padding: 28px;
    border-radius: 32px;
    background: #FFFFFF;
    border: 1px solid rgba(17, 24, 39, .08);
    box-shadow: 0 18px 48px rgba(17, 24, 39, .07);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 180px 180px;
    gap: 28px;
}

.gx-public-footer-brand img {
    height: 42px;
    display: block;
    margin-bottom: 14px;
}

.gx-public-footer p {
    margin: 0;
    color: var(--testoChiaro);
    line-height: 1.55;
    max-width: 420px;
}

.gx-public-footer nav {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.gx-public-footer nav strong {
    margin-bottom: 4px;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #111827;
}

.gx-public-footer nav a {
    color: var(--testoChiaro);
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    transition: color .18s ease, transform .18s ease;
}

.gx-public-footer nav a:hover {
    color: #111827;
    transform: translateX(2px);
}

[data-reveal] {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .62s ease, transform .62s ease;
}

[data-reveal].is-visible {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    [data-reveal],
    [data-reveal].is-visible,
    .gx-public-hero-panel,
    .gx-public-steps article,
    .gx-public-proof-grid div,
    .gx-public-service-grid article,
    .gx-public-category,
    .gx-public-flow-card,
    .gx-public-btn,
    .gx-public-category img {
        transition: none !important;
        transform: none !important;
        opacity: 1 !important;
    }
}

@media (max-width: 980px) {
    .gx-public-hero {
        min-height: auto;
        padding-top: 52px;
    }

    .gx-public-catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gx-public-footer {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .gx-public-header .menu {
        background: #FFFFFF;
        border: 1px solid rgba(17, 24, 39, .08);
        box-shadow: 0 24px 70px rgba(17, 24, 39, .16);
    }

    .gx-public-header .menu a {
        color: #111827;
    }
}

@media (max-width: 640px) {
    .gx-public-catalog-grid {
        grid-template-columns: 1fr;
    }

    .gx-public-category img {
        height: 190px;
    }
}

/* GIANUS CART -> ERPNext */
#gxCartCheckoutButton{justify-content:center}
#gxCartCheckoutButton:disabled{opacity:.55;cursor:not-allowed;filter:saturate(.6)}
#gxCartCheckoutButton.is-loading{pointer-events:none}
.gx-cart-order-note{display:flex;gap:8px;align-items:flex-start;margin:12px 2px 0;color:var(--g-text-muted);font-size:13px;font-weight:750;line-height:1.45}
.gx-cart-order-note i{margin-top:2px}

/* =========================================================
   QUESTIONARIO INIZIALE CLIENTE
========================================================= */
.gx-questionario-wrap{
    width:100%;
    display:flex;
    justify-content:center;
    padding:42px 18px 54px;
}
.gx-questionario-wrap.gx-questionario-app{
    padding:34px 0 44px;
}
.gx-questionario-card{
    width:min(720px,100%);
    background:var(--g-surface,#fff);
    border:1px solid var(--g-border,#E5E7EB);
    border-radius:24px;
    padding:34px;
    box-shadow:0 18px 55px rgba(17,24,39,.10);
}
.gx-questionario-progress-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:12px;
}
.gx-questionario-kicker{
    color:var(--g-text-muted,#6B7280);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.06em;
}
.gx-questionario-progress-row strong{
    color:var(--g-text-muted,#6B7280);
    font-size:12px;
}
.gx-questionario-progress{
    height:7px;
    overflow:hidden;
    border-radius:999px;
    background:var(--g-muted,#F3F4F6);
    margin-bottom:28px;
}
.gx-questionario-progress span{
    display:block;
    height:100%;
    border-radius:inherit;
    background:var(--g-primary,#111827);
    transition:width .25s ease;
}
.gx-questionario-card h2{
    margin:0;
    max-width:650px;
    color:var(--g-text,#111827);
    font-size:28px;
    line-height:1.22;
    letter-spacing:-.025em;
}
.gx-questionario-card > p{
    margin:14px 0 0;
    color:var(--g-text-muted,#6B7280);
    line-height:1.65;
    font-size:15px;
}
.gx-questionario-form{
    margin-top:28px;
}
.gx-questionario-choices{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}
.gx-questionario-choice{
    min-height:92px;
    border:1px solid var(--g-border,#E5E7EB);
    border-radius:18px;
    background:var(--g-surface-soft,#F9FAFB);
    padding:18px;
    display:flex;
    align-items:center;
    gap:14px;
    text-align:left;
    color:var(--g-text,#111827);
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.gx-questionario-choice:hover{
    transform:translateY(-1px);
    border-color:#C9CDD4;
    background:#fff;
    box-shadow:var(--shadow-soft,0 2px 8px rgba(17,24,39,.04));
}
.gx-questionario-choice-icon{
    width:44px;
    height:44px;
    flex:0 0 44px;
    border-radius:14px;
    background:var(--g-primary,#111827);
    color:#fff;
    display:grid;
    place-items:center;
}
.gx-questionario-choice strong,
.gx-questionario-choice small{
    display:block;
}
.gx-questionario-choice strong{
    font-size:16px;
}
.gx-questionario-choice small{
    margin-top:4px;
    color:var(--g-text-muted,#6B7280);
    font-size:12px;
}
.gx-questionario-form label{
    display:block;
    margin-bottom:9px;
    color:var(--g-text-soft,#374151);
    font-size:13px;
    font-weight:800;
}
.gx-questionario-form input[type="number"]{
    width:100%;
    box-sizing:border-box;
    border:1px solid var(--g-border,#E5E7EB);
    border-radius:16px;
    background:#fff;
    color:var(--g-text,#111827);
    padding:15px 16px;
    font-size:18px;
    outline:none;
}
.gx-questionario-form input[type="number"]:focus{
    border-color:#9CA3AF;
    box-shadow:0 0 0 4px rgba(17,24,39,.06);
}
.gx-questionario-primary{
    width:100%;
    margin-top:14px;
    border:0;
    border-radius:16px;
    padding:15px 18px;
    background:var(--g-primary,#111827);
    color:#fff;
    font-weight:900;
    font-size:14px;
}
.gx-questionario-primary:hover{
    background:var(--g-primary-hover,#1F2937);
}
.gx-questionario-note{
    margin-top:24px;
    padding-top:18px;
    border-top:1px solid var(--g-border,#E5E7EB);
    display:flex;
    gap:10px;
    align-items:flex-start;
    color:var(--g-text-muted,#6B7280);
    font-size:12px;
    line-height:1.5;
}
@media(max-width:700px){
    .gx-questionario-card{padding:24px 20px;border-radius:20px}
    .gx-questionario-card h2{font-size:23px}
    .gx-questionario-choices{grid-template-columns:1fr}
}