/*
 * Vaspero — Site 1 : vaspero.com (marché Espagne, interface ES).
 * CSS scopé blog 1 (chargé uniquement sur ce site ; classe body .vaspero-blog-1).
 */

/* ---------- Lot E — Header : logo plus grand, tagline lisible ---------- */
.elementor-location-header .elementor-widget-theme-site-logo img{
	width: 300px !important;
	max-width: 60vw;
	height: auto;
}
@media (max-width:1024px){
	.elementor-location-header .elementor-widget-theme-site-logo img{ width: 240px !important; }
}
@media (max-width:767px){
	/* Logo mobile aligné sur /ad : plus compact pour ne PAS recouvrir le
	   bouton menu (burger), centré dans la colonne du milieu de l'en-tête.
	   Avant : 210px/58vw -> le logo débordait de sa colonne (24%) et passait
	   par-dessus le burger. /ad = 150px/42vw ne l'atteint pas. */
	.elementor-location-header .elementor-widget-theme-site-logo img{ width: 150px !important; max-width: 42vw; }
}

/* ---------- Lot F — Icon Box : icône + titre sur la même ligne ---------- */
.elementor-widget-icon-box .elementor-icon-box-wrapper{
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	text-align: left !important;
	gap: 14px;
}
.elementor-widget-icon-box .elementor-icon-box-icon{
	margin: 0 !important;
	width: auto !important;
	flex: 0 0 auto !important;
}
.elementor-widget-icon-box .elementor-icon-box-content{ text-align: left !important; }
.elementor-widget-icon-box .elementor-icon-box-title{ margin-bottom: 4px; }
.elementor-widget-icon-box .elementor-icon-box-description{ margin-top: 0; }

/* ---------- Lot G — Footer : symbole « V » au lieu du logo complet ---------- */
.elementor-location-footer .elementor-widget-theme-site-logo{
	background: url(vaspero-v.png) left center / 64px 64px no-repeat;
	min-height: 64px;
}
.elementor-location-footer .elementor-widget-theme-site-logo img{
	opacity: 0;
	width: 64px !important;
	height: 64px;
	display: block;
}
/* Tagline unique, lisible sur le fond bleu foncé */
.elementor-location-footer .elementor-widget-text-editor,
.elementor-location-footer .elementor-widget-text-editor p{
	color: #e8ecf5 !important;
}

/* ------------------------------------------------------------------ */
/* Lot 2 — Pré-footer de réassurance (bandeau global au-dessus du footer) */
/* ------------------------------------------------------------------ */
.vsp-prefooter{
	background:#f6f8fa;
	padding:40px 24px;
}
.vsp-prefooter__inner{
	max-width:1140px;
	margin:0 auto;
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:32px;
}
.vsp-prefooter__col{
	text-align:center;
}
.vsp-prefooter__icon{
	display:inline-flex;
	color:#54C4D4;
}
.vsp-prefooter__icon svg{
	width:36px;
	height:36px;
}
.vsp-prefooter__title{
	margin:12px 0 4px;
	color:#1B2653;
	font-weight:700;
	font-size:17px;
	line-height:1.3;
}
.vsp-prefooter__sub{
	margin:0;
	color:#6b7280;
	font-size:14px;
	line-height:1.4;
}
@media (max-width:781px){
	.vsp-prefooter__inner{
		grid-template-columns:repeat(2,1fr);
		gap:24px 16px;
	}
}

/* ================================================================== */
/* Lot C — corrections mobile (panier, confirmation) comme sur /ad    */
/* ================================================================== */
@media (max-width:767px){
	/* Panier ET checkout : neutraliser l'extension « alignwide » des blocs
	   (débordaient à droite -> scroll horizontal + champs du checkout hors écran) */
	.woocommerce-cart .wp-block-woocommerce-cart.alignwide,
	.woocommerce-cart .entry-content .alignwide,
	.woocommerce-cart .wc-block-grid,
	.woocommerce-checkout .wp-block-woocommerce-checkout.alignwide,
	.woocommerce-checkout .entry-content .alignwide{
		max-width:100% !important;
		margin-left:auto !important;
		margin-right:auto !important;
	}
	/* Garde-fou : pas de défilement horizontal accueil / panier / checkout / confirmation.
	   (L'accueil était décalé par le débordement du mini-panier ; voir règle mini-panier.) */
	body.home,
	body.woocommerce-cart,
	body.woocommerce-checkout,
	body.woocommerce-order-received{
		overflow-x:clip;
	}
	/* Mini-panier (dropdown Elementor « menu cart ») : le conteneur, ancré par
	   défaut au bord GAUCHE du bouton panier (placé à droite de l'en-tête), avec
	   min-width 300/330px, débordait hors de l'écran à droite à l'ouverture.
	   On l'ancre au bord DROIT et on plafonne sa largeur pour qu'il tienne. */
	.elementor-widget-woocommerce-menu-cart.elementor-menu-cart--cart-type-mini-cart .elementor-menu-cart__container{
		inset-inline:auto 0 !important;
		min-width:0 !important;
		width:min(90vw,360px) !important;
	}
	/* Confirmation de commande : titre plus petit, sans casse moche */
	.woocommerce-order-received .woocommerce-thankyou-order-received,
	.woocommerce-order-received .woocommerce-notice--success,
	.woocommerce-order-received .entry-title,
	.woocommerce-order-received h1{
		font-size:22px !important;
		line-height:1.25 !important;
		font-weight:700;
		overflow-wrap:anywhere;
	}
	/* Grille récap (classique) : une colonne empilée */
	.woocommerce-order-received ul.woocommerce-order-overview{
		display:flex !important;
		flex-direction:column !important;
		gap:12px;
		padding:0;
		border:0;
	}
	.woocommerce-order-received ul.woocommerce-order-overview li{
		width:auto !important;
		float:none !important;
		border:0 !important;
		padding:0 0 8px !important;
	}
	/* Grille récap (blocs) : une colonne */
	.woocommerce-order-received .wc-block-order-confirmation-summary,
	.wc-block-order-confirmation-summary{
		display:grid !important;
		grid-template-columns:1fr !important;
	}
}

/* ================================================================== */
/* Lot C — Home v2 (répliquée de 1084) : hero, matières, grilles      */
/* ================================================================== */
/* Section masquée (vidéos tant qu'aucune fournie) */
.vsp-hidden,
#impres-amb-vaspero{ display:none !important; }

/* Hero : image paysage, coins arrondis, cadrage cover */
#vsp-hero-visual img{
	width:100%;
	aspect-ratio:4 / 3;
	object-fit:cover;
	border-radius:16px;
	display:block;
}

/* Matières — grille de cartes compactes */
.vsp-materias-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
	gap:20px;
	max-width:1140px;
	margin:0 auto;
}
.vsp-mat-card{
	display:flex;flex-direction:column;background:#fff;border:1px solid #eef0f4;
	border-radius:12px;overflow:hidden;text-decoration:none;
	transition:box-shadow .2s ease, transform .2s ease;
}
.vsp-mat-card:hover{ box-shadow:0 8px 24px rgba(27,38,83,.12); transform:translateY(-2px); }
.vsp-mat-card__media{ display:block;aspect-ratio:4 / 3;background:#f6f8fa;overflow:hidden; }
.vsp-mat-card__img{ width:100% !important;height:100% !important;object-fit:cover !important;object-position:center !important;display:block; }
.vsp-mat-card__body{ padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px; }
.vsp-mat-card__title{ color:#1B2653;font-weight:700;font-size:18px;line-height:1.2; }
.vsp-mat-card__desc{ color:#4a5160;font-size:14px;line-height:1.45; }
.vsp-mat-card__price{ color:#1B2653;font-weight:600;font-size:14px;margin-top:2px; }
.vsp-materias-note{ margin:10px 0 0;font-size:12.5px;font-style:italic;color:#8A90A0;text-align:center; }
@media (max-width:600px){
	.vsp-materias-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
	.vsp-mat-card__body{ padding:10px 12px 12px; }
	.vsp-mat-card__title{ font-size:16px; }
	.vsp-mat-card__desc{ font-size:13px; }
}

/* Imprescindibles — 4 colonnes desktop / 2 mobile, bouton orange */
#imprescindibles-grid ul.products{
	display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:0;padding:0;
}
#imprescindibles-grid ul.products::before,
#imprescindibles-grid ul.products::after{ content:none;display:none; }
#imprescindibles-grid ul.products li.product{ width:auto !important;margin:0 !important;float:none !important; }
#imprescindibles-grid ul.products li.product .price{ color:#1B2653;font-weight:700;font-size:18px; }
#imprescindibles-grid ul.products li.product .button,
#imprescindibles-grid ul.products li.product .added_to_cart{ background:#F7941D;border-color:#F7941D;color:#fff;border-radius:8px; }
#imprescindibles-grid ul.products li.product .button:hover,
#imprescindibles-grid ul.products li.product .added_to_cart:hover{ background:#e0850f;border-color:#e0850f; }
@media (max-width:600px){ #imprescindibles-grid ul.products{ grid-template-columns:repeat(2,1fr);gap:12px; } }

/* Home v2 : grilles ciblées sur les CONTENEURS INTERNES par ID d'élément
   Elementor (identiques à la 1084 de /ad : JSON répliqué). On NE cible PAS
   l'inner du conteneur externe #per-que-vaspero (qui enveloppe le titre + la
   rangée) sinon titre et rangée deviennent 2 cellules de grille. */
/* « Por qué imprimir con Vaspero » — 4 blocs en grille régulière */
.elementor-element-3sebyru > .e-con-inner{ display:grid !important;grid-template-columns:repeat(4,1fr) !important;gap:28px !important;align-items:stretch !important; }
.elementor-element-3sebyru > .e-con-inner > .e-con{ width:auto !important;max-width:none !important; }
.elementor-element-3sebyru .elementor-icon-box-title{ min-height:2.5em !important; }
/* « Entrega y pago » — 3 colonnes égales */
.elementor-element-zv9qd1p > .e-con-inner{ display:grid !important;grid-template-columns:repeat(3,1fr) !important;gap:28px !important;align-items:stretch !important; }
.elementor-element-zv9qd1p > .e-con-inner > .e-con{ width:auto !important;max-width:none !important; }
.elementor-element-zv9qd1p .elementor-widget-heading .elementor-heading-title{ min-height:2.4em !important;display:flex;align-items:center;justify-content:center; }
@media (max-width:767px){
	/* « Por qué imprimir » : 2 colonnes étroites. minmax(0,1fr) empêche les pistes
	   de s'élargir au contenu. Surtout : on repasse l'icône AU-DESSUS du titre
	   (colonne) — en ligne, l'icône ne laisse ~80px au texte et les mots longs
	   (« fabricante », « materiales ») débordaient la cellule (coupés à droite,
	   masqués par overflow-x:clip). En colonne, le texte prend toute la cellule. */
	.elementor-element-3sebyru > .e-con-inner{ grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:18px 12px !important; }
	.elementor-element-3sebyru .elementor-icon-box-wrapper{ flex-direction:column !important;align-items:flex-start !important;text-align:left !important;gap:8px !important; }
	.elementor-element-3sebyru .elementor-icon-box-icon{ margin:0 !important; }
	.elementor-element-3sebyru .elementor-icon-box-content{ text-align:left !important; }
	.elementor-element-3sebyru .elementor-icon-box-title{ min-height:0 !important;font-size:17px !important;line-height:1.2 !important;overflow-wrap:break-word; }
	.elementor-element-3sebyru .elementor-icon-box-description{ overflow-wrap:break-word; }
	.elementor-element-zv9qd1p > .e-con-inner{ grid-template-columns:1fr !important;gap:24px !important; }
}

/* Alignement des cartes produit — home, boutique, catégories (ES) */
.vaspero-blog-1 ul.products li.product{ display:flex;flex-direction:column;height:100%;gap:0 !important; }
.vaspero-blog-1 ul.products li.product a.woocommerce-loop-product__link{ display:flex;flex-direction:column;margin-bottom:0 !important; }
.vaspero-blog-1 ul.products li.product a.woocommerce-loop-product__link img,
.vaspero-blog-1 ul.products li.product img.attachment-woocommerce_thumbnail,
.vaspero-blog-1 ul.products li.product img.wp-post-image{
	width:100% !important;height:240px !important;object-fit:contain !important;object-position:center !important;background:#fff;margin:0 auto 10px;
}
.vaspero-blog-1 ul.products li.product .woocommerce-loop-product__title{ line-height:1.3;min-height:calc(2 * 1.3em); }
.vaspero-blog-1 ul.products li.product .vaspero-formatos{ min-height:28px;margin-top:7px;align-content:flex-start; }
.vaspero-blog-1 ul.products li.product .price{ min-height:1.7em;display:block; }
.vaspero-blog-1 ul.products li.product .button,
.vaspero-blog-1 ul.products li.product .added_to_cart{ margin-top:auto; }
@media (max-width:767px){
	.vaspero-blog-1 ul.products.elementor-grid{ grid-template-columns:repeat(2,1fr) !important; }
	.vaspero-blog-1 ul.products li.product a.woocommerce-loop-product__link img,
	.vaspero-blog-1 ul.products li.product img.attachment-woocommerce_thumbnail,
	.vaspero-blog-1 ul.products li.product img.wp-post-image{ height:150px !important; }
	.vaspero-blog-1 ul.products li.product .woocommerce-loop-product__title{ font-size:15px;min-height:2.7em; }
	.vaspero-blog-1 ul.products li.product .price{ min-height:2.9em; }
}

/* Boutons produit : pas de majuscule forcée */
.woocommerce ul.products li.product .button,
.woocommerce a.button.add_to_cart_button,
.woocommerce a.button.product_type_variable,
.woocommerce a.button.product_type_simple,
#imprescindibles-grid ul.products li.product .button,
.wc-block-grid__product .wp-block-button__link{ text-transform:none; }

/* Liens : aucun soulignement (repos/survol/focus), couleur conservée */
.vaspero-blog-1 a,
.vaspero-blog-1 a:link,
.vaspero-blog-1 a:visited,
.vaspero-blog-1 a:hover,
.vaspero-blog-1 a:focus,
.vaspero-blog-1 a:active,
.vaspero-blog-1 a *,
.vaspero-blog-1 .wc-block-components-product-name,
.vaspero-blog-1 .wp-block-woocommerce-cart a,
.vaspero-blog-1 .wp-block-woocommerce-checkout a,
.vaspero-blog-1 .wc-block-components-totals-coupon a,
.vaspero-blog-1 .wc-block-order-confirmation-summary a{ text-decoration:none !important; }
