/*
Theme Name:  Klikage — boutique de démonstration
Template:    storefront
Description: Thème de la démo publique de Klikage (klikage.dev.pikali.fr), aux couleurs de la fiche pikali.fr/produits/klikage. Ne fait pas partie de l'extension vendue.
Author:      Pikali
Version:     1.0.0
Text Domain: klikage-demo
*/

@font-face { font-family: "Inter"; src: url("fonts/inter.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Syne"; src: url("fonts/syne.woff2") format("woff2"); font-weight: 400 800; font-display: swap; }

:root {
	--klk-primary: #d81818;
	--klk-light: #e85555;
	--klk-accent: #a01010;
	--klk-soft: #fbe8e8;
	--klk-cream: #fef7f7;
	--klk-border: #fadfdf;
	--klk-text: #2f1c21;
	--klk-muted: #6c5965;
	--klk-footer: #410707;
}

body, button, input, select, textarea, .button {
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	color: var(--klk-text);
}
body { background: #fff; }
h1, h2, h3, .site-title, .product_title, .woocommerce-products-header__title, .entry-title {
	font-family: "Syne", "Inter", sans-serif;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--klk-text);
}
a { color: var(--klk-primary); }
a:hover, a:focus { color: var(--klk-accent); }

/* ---------- En-tête ---------- */
.site-header {
	background: #fff;
	border-bottom: 1px solid var(--klk-border);
	padding-top: 1.1em;
	margin-bottom: 0;
}
.site-header > .col-full { display: flex; flex-wrap: wrap; align-items: center; gap: .8em 1.5em; padding-bottom: .9em; }
.site-header .klk-brand { flex: 0 0 auto; width: auto !important; margin: 0 auto 0 0 !important; float: none !important; }
.klk-brand a { display: flex; align-items: center; gap: .7em; text-decoration: none; color: var(--klk-text); }
.klk-brand img { width: 48px; height: 48px; border-radius: 12px; }
.klk-brand strong { display: block; font-family: "Syne", sans-serif; font-weight: 800; font-size: 1.45rem; line-height: 1.1; }
.klk-brand em { display: block; font-style: normal; font-size: .85rem; color: var(--klk-muted); }
.site-header .site-search { flex: 0 1 320px; width: auto !important; float: none !important; margin: 0 !important; }
.site-header .site-search .widget_product_search form { margin: 0; }
.storefront-primary-navigation { background: transparent; border-top: 1px solid var(--klk-border); }
.storefront-primary-navigation .col-full { display: flex; align-items: center; justify-content: space-between; }
.storefront-primary-navigation .main-navigation { flex: 1 1 auto; width: auto !important; float: none !important; margin: 0 !important; }
.storefront-primary-navigation .site-header-cart { flex: 0 0 auto; width: auto !important; float: none !important; margin: 0 !important; }
.klk-lang { display: flex; gap: .3em; }
.klk-lang a { padding: .25em .6em; border-radius: 999px; font-size: .8rem; font-weight: 700; text-decoration: none; color: var(--klk-muted); border: 1px solid var(--klk-border); }
.klk-lang a[aria-current] { background: var(--klk-primary); border-color: var(--klk-primary); color: #fff; }
.main-navigation ul.menu > li > a, .main-navigation ul.nav-menu > li > a { color: var(--klk-text); font-weight: 600; }
.site-header-cart .cart-contents, .site-header-cart .cart-contents .amount { color: var(--klk-text); }
.site-header-cart .cart-contents .count { background: var(--klk-soft); color: var(--klk-accent); border-radius: 999px; opacity: 1; padding: .1em .6em; font-weight: 700; }

/* ---------- Boutons WooCommerce ---------- */
button, input[type="button"], input[type="reset"], input[type="submit"], .button, .added_to_cart,
.woocommerce a.button, .woocommerce button.button, .wc-block-components-button:not(.is-link) {
	background: var(--klk-primary);
	border-color: var(--klk-primary);
	color: #fff;
	border-radius: 999px;
	font-weight: 600;
}
button:hover, .button:hover, .added_to_cart:hover, .woocommerce a.button:hover {
	background: var(--klk-accent);
	border-color: var(--klk-accent);
	color: #fff;
}
.button.alt, button.alt, .single-product div.product form.cart .button { background: var(--klk-primary); border-color: var(--klk-primary); }
.price, .woocommerce-Price-amount, ul.products li.product .price { color: var(--klk-accent); font-weight: 700; }
ul.products li.product .woocommerce-loop-product__title { font-family: "Inter", sans-serif; font-weight: 600; font-size: 1rem; color: var(--klk-text); }
ul.products li.product img { border-radius: 16px; background: var(--klk-cream); }
.onsale { border-color: var(--klk-primary); color: var(--klk-primary); }
.woocommerce-info, .woocommerce-message, .woocommerce-noreviews, p.no-comments { background: var(--klk-soft); color: var(--klk-text); border-left: 4px solid var(--klk-primary); }
.woocommerce-info a, .woocommerce-message a { color: var(--klk-accent); }

/* ---------- Accueil ---------- */
.home .site-content { padding-top: 0; }
.home .entry-header, .home .hentry .entry-header { display: none; }
.klk-home { margin: 0 auto 3em; }
.klk-hero {
	margin: 0 calc(50% - 50vw) 0;
	padding: 3.2em calc(50vw - 50% + 1em) 2.6em;
	background: radial-gradient(1200px 400px at 85% -10%, #fbe8e8 0, transparent 60%), var(--klk-cream);
	border-bottom: 1px solid var(--klk-border);
	text-align: center;
}
.klk-badge {
	display: inline-block;
	margin: 0 0 1em;
	padding: .35em 1em;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--klk-border);
	color: var(--klk-accent);
	font-weight: 700;
	font-size: .8rem;
	letter-spacing: .06em;
	text-transform: uppercase;
}
.klk-hero h1 { font-size: clamp(1.7rem, 3.4vw, 2.6rem); line-height: 1.12; margin: 0 auto .5em; max-width: 22em; }
.klk-hero h1 span { color: var(--klk-primary); }
.klk-lead { max-width: 44em; margin: 0 auto; font-size: 1.12rem; color: var(--klk-muted); }

.klk-try { padding: 2.6em 0 1em; }
.klk-try h2, .klk-shop h2 { text-align: center; font-size: clamp(1.6rem, 3vw, 2.2rem); margin-bottom: 1em; }
.klk-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2em; }
.klk-card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 1.6em 1.5em 1.5em;
	background: #fff;
	border: 1px solid var(--klk-border);
	border-radius: 20px;
	box-shadow: 0 10px 30px -18px rgba(160, 16, 16, .35);
}
.klk-num {
	display: grid;
	place-items: center;
	width: 2.2em;
	height: 2.2em;
	border-radius: 50%;
	background: var(--klk-primary);
	color: #fff;
	font-family: "Syne", sans-serif;
	font-weight: 800;
	margin-bottom: .8em;
}
.klk-card h3 { font-size: 1.2rem; margin: 0 0 .5em; }
.klk-card p { color: var(--klk-muted); font-size: .97rem; flex: 1; }
.klk-btn {
	align-self: flex-start;
	display: inline-block;
	padding: .7em 1.3em;
	border-radius: 999px;
	background: var(--klk-primary);
	color: #fff !important;
	font-weight: 700;
	text-decoration: none !important;
}
.klk-btn:hover { background: var(--klk-accent); }
.klk-settings {
	margin: 1.6em auto 0;
	max-width: 60em;
	padding: 1em 1.3em;
	border-radius: 14px;
	background: var(--klk-soft);
	font-size: .92rem;
	text-align: center;
}
.klk-shop { padding-top: 2em; }
.klk-more { text-align: center; font-weight: 700; }

/* ---------- Pied de page ---------- */
.site-footer { background: var(--klk-footer); color: #f5e9e9; padding: 2.2em 0; }
.site-footer a { color: #ffb4b4; }
.klk-footer { text-align: center; font-size: .9rem; }
.klk-footer p { margin: .3em 0; }
.site-footer .footer-widgets { display: none; }

/* ---------- Téléphone ---------- */
@media (max-width: 767px) {
	.site-header { padding-top: .8em; }
	.site-header .col-full { gap: .6em; }
	.klk-brand strong { font-size: 1.2rem; }
	.klk-lang { order: 2; margin-left: auto; }
	.site-header .site-search { flex: 1 0 100%; display: block; }
	.klk-hero { padding-top: 2em; padding-bottom: 1.8em; text-align: left; }
	.klk-cards { grid-template-columns: 1fr; }
	.klk-settings { text-align: left; }
	ul.products li.product { width: 48% !important; margin-right: 4% !important; float: left; clear: none !important; }
	ul.products li.product:nth-child(2n) { margin-right: 0 !important; }
	ul.products li.product:nth-child(2n+1) { clear: both !important; }
}

/* Ajustements après contrôle visuel (09/10/2026) */
.home .site-content > .col-full > .content-area, .home .site-main, .home .hentry, .home .site-main > article { margin: 0 !important; padding: 0 !important; }
.home .site-header { margin-bottom: 0 !important; }
.klk-num { font-family: "Inter", sans-serif; }
.klk-card h3 { font-family: "Inter", sans-serif; font-weight: 700; letter-spacing: 0; }
@media (max-width: 767px) {
	.site-header .klk-brand { order: 1; }
	.klk-lang { order: 2; }
	.site-header .site-search { order: 3; }
	.site-header > .col-full { padding-bottom: .4em; }
}