/* ==========================================================================
   Kubeitalia Builder - Frontend output
   Grid Bootstrap-like (xs/sm/md/lg/xl) + stili blocchi
   Breakpoints: xs <576 / sm ≥576 / md ≥768 / lg ≥992 / xl ≥1200
   ========================================================================== */

.kb-layout { width: 100%; }

/* ---- Grid ---- */
.kb-row {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -15px;
	position: relative;
}
.kb-row-full { margin: 0; max-width: none; }
.kb-row-parallax {
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
}
@media (max-width: 767px) {
	.kb-row-parallax { background-attachment: scroll; }
}

.kb-col {
	padding: 0 15px;
	width: 100%;
	flex: 0 0 100%;
	max-width: 100%;
	box-sizing: border-box;
}

/* xs (default, no media query) */
.col-1  { flex: 0 0 8.3333%;  max-width: 8.3333%; }
.col-2  { flex: 0 0 16.6667%; max-width: 16.6667%; }
.col-3  { flex: 0 0 25%;      max-width: 25%; }
.col-4  { flex: 0 0 33.3333%; max-width: 33.3333%; }
.col-5  { flex: 0 0 41.6667%; max-width: 41.6667%; }
.col-6  { flex: 0 0 50%;      max-width: 50%; }
.col-7  { flex: 0 0 58.3333%; max-width: 58.3333%; }
.col-8  { flex: 0 0 66.6667%; max-width: 66.6667%; }
.col-9  { flex: 0 0 75%;      max-width: 75%; }
.col-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.col-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.col-12 { flex: 0 0 100%;     max-width: 100%; }

@media (min-width: 576px) {
	.col-sm-1  { flex: 0 0 8.3333%;  max-width: 8.3333%; }
	.col-sm-2  { flex: 0 0 16.6667%; max-width: 16.6667%; }
	.col-sm-3  { flex: 0 0 25%;      max-width: 25%; }
	.col-sm-4  { flex: 0 0 33.3333%; max-width: 33.3333%; }
	.col-sm-5  { flex: 0 0 41.6667%; max-width: 41.6667%; }
	.col-sm-6  { flex: 0 0 50%;      max-width: 50%; }
	.col-sm-7  { flex: 0 0 58.3333%; max-width: 58.3333%; }
	.col-sm-8  { flex: 0 0 66.6667%; max-width: 66.6667%; }
	.col-sm-9  { flex: 0 0 75%;      max-width: 75%; }
	.col-sm-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
	.col-sm-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
	.col-sm-12 { flex: 0 0 100%;     max-width: 100%; }
}
@media (min-width: 768px) {
	.col-md-1  { flex: 0 0 8.3333%;  max-width: 8.3333%; }
	.col-md-2  { flex: 0 0 16.6667%; max-width: 16.6667%; }
	.col-md-3  { flex: 0 0 25%;      max-width: 25%; }
	.col-md-4  { flex: 0 0 33.3333%; max-width: 33.3333%; }
	.col-md-5  { flex: 0 0 41.6667%; max-width: 41.6667%; }
	.col-md-6  { flex: 0 0 50%;      max-width: 50%; }
	.col-md-7  { flex: 0 0 58.3333%; max-width: 58.3333%; }
	.col-md-8  { flex: 0 0 66.6667%; max-width: 66.6667%; }
	.col-md-9  { flex: 0 0 75%;      max-width: 75%; }
	.col-md-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
	.col-md-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
	.col-md-12 { flex: 0 0 100%;     max-width: 100%; }
}
@media (min-width: 992px) {
	.col-lg-1  { flex: 0 0 8.3333%;  max-width: 8.3333%; }
	.col-lg-2  { flex: 0 0 16.6667%; max-width: 16.6667%; }
	.col-lg-3  { flex: 0 0 25%;      max-width: 25%; }
	.col-lg-4  { flex: 0 0 33.3333%; max-width: 33.3333%; }
	.col-lg-5  { flex: 0 0 41.6667%; max-width: 41.6667%; }
	.col-lg-6  { flex: 0 0 50%;      max-width: 50%; }
	.col-lg-7  { flex: 0 0 58.3333%; max-width: 58.3333%; }
	.col-lg-8  { flex: 0 0 66.6667%; max-width: 66.6667%; }
	.col-lg-9  { flex: 0 0 75%;      max-width: 75%; }
	.col-lg-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
	.col-lg-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
	.col-lg-12 { flex: 0 0 100%;     max-width: 100%; }
}
@media (min-width: 1200px) {
	.col-xl-1  { flex: 0 0 8.3333%;  max-width: 8.3333%; }
	.col-xl-2  { flex: 0 0 16.6667%; max-width: 16.6667%; }
	.col-xl-3  { flex: 0 0 25%;      max-width: 25%; }
	.col-xl-4  { flex: 0 0 33.3333%; max-width: 33.3333%; }
	.col-xl-5  { flex: 0 0 41.6667%; max-width: 41.6667%; }
	.col-xl-6  { flex: 0 0 50%;      max-width: 50%; }
	.col-xl-7  { flex: 0 0 58.3333%; max-width: 58.3333%; }
	.col-xl-8  { flex: 0 0 66.6667%; max-width: 66.6667%; }
	.col-xl-9  { flex: 0 0 75%;      max-width: 75%; }
	.col-xl-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
	.col-xl-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
	.col-xl-12 { flex: 0 0 100%;     max-width: 100%; }
}

/* ---- Block wrappers ---- */
.kb-block { margin-bottom: 1.25rem; }
.kb-block:last-child { margin-bottom: 0; }

.kb-align-left   { text-align: left; }
.kb-align-center { text-align: center; }
.kb-align-right  { text-align: right; }

/* Heading */
.kb-heading { margin: 0 0 .5rem; }

/* Text */
.kb-text p:last-child { margin-bottom: 0; }

/* Image */
.kb-image { max-width: 100%; height: auto; display: inline-block; }
.kb-image-rounded { border-radius: 12px; }
.kb-align-center .kb-image { margin: 0 auto; display: block; }
.kb-align-right .kb-image { margin-left: auto; display: block; }

/* Button */
.kb-btn {
	display: inline-block;
	padding: .625rem 1.5rem;
	border-radius: 4px;
	font-weight: 600;
	text-decoration: none;
	transition: all .2s;
	border: 2px solid transparent;
	line-height: 1.2;
	cursor: pointer;
}
.kb-btn-primary   { background: var(--k-primary, #0066cc); color: #fff; }
.kb-btn-primary:hover   { background: color-mix(in srgb, var(--k-primary, #0066cc) 85%, #000); color: #fff; text-decoration: none; }
.kb-btn-secondary { background: var(--k-accent, #ff6600); color: #fff; }
.kb-btn-secondary:hover { background: color-mix(in srgb, var(--k-accent, #ff6600) 85%, #000); color: #fff; text-decoration: none; }
.kb-btn-outline   { background: transparent; border-color: var(--k-primary, #0066cc); color: var(--k-primary, #0066cc); }
.kb-btn-outline:hover { background: var(--k-primary, #0066cc); color: #fff; text-decoration: none; }
.kb-btn-ghost     { background: transparent; color: var(--k-primary, #0066cc); }
.kb-btn-ghost:hover { background: rgba(0,0,0,.05); text-decoration: none; }
.kb-btn-sm { padding: .375rem 1rem; font-size: .875rem; }
.kb-btn-lg { padding: .875rem 2rem; font-size: 1.125rem; }

/* Video */
.kb-video { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.kb-video iframe, .kb-video embed, .kb-video object { position: absolute; inset: 0; width: 100%; height: 100%; }

/* Spacer */
.kb-spacer { height: var(--h, 40px); }
@media (max-width: 767px) { .kb-spacer { height: var(--mh, 20px); } }

/* Separator */
.kb-separator { border: 0; }

/* Icon Box */
.kb-icon-box {
	display: block;
	padding: 1.5rem;
	border-radius: 8px;
	background: #fafafa;
	transition: transform .2s, box-shadow .2s;
	text-decoration: none;
	color: inherit;
}
a.kb-icon-box:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 24px rgba(0,0,0,.08);
	text-decoration: none;
}
.kb-icon-box-icon { font-size: 2.5rem; line-height: 1; margin-bottom: .75rem; }
.kb-icon-box-title { margin: 0 0 .5rem; font-size: 1.15rem; }
.kb-icon-box-text { color: #555; font-size: .95rem; }

/* Map */
.kb-map iframe { display: block; border-radius: 6px; }

/* Widget area inside builder */
.kb-widget-area .widget { margin-bottom: 1rem; }