/**
 * Campy Yallaa — finitions SaaS du site public (12/10/2026)
 * Même grammaire que admin-polish.css du Command Center : fond dégradé + trame de points,
 * cartes qui se soulèvent avec barre dégradée, icônes animées, boutons brillants, entrées en cascade.
 * Pages : accueil, catalogue, fiche produit, espace client. Purement visuel, additif,
 * chargé après motion.css ; désactivé si l'utilisateur demande moins d'animations.
 */
:root{
	--cyp-green:#1F7A4D;--cyp-forest:#0D3A29;--cyp-lime:#7CC45E;--cyp-orange:#FF7A2F;
	--cyp-line:#DCE6E0;--cyp-ease:cubic-bezier(.2,.7,.2,1);--cyp-spring:cubic-bezier(.3,1.5,.5,1);
	--cyp-shadow:0 18px 40px -18px rgba(13,58,41,.28);
}
@keyframes cypFadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes cypPulse{0%{box-shadow:0 0 0 0 rgba(31,122,77,.45)}70%{box-shadow:0 0 0 8px rgba(31,122,77,0)}100%{box-shadow:0 0 0 0 rgba(31,122,77,0)}}
@keyframes cypFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes cypShine{from{transform:translateX(-120%) skewX(-18deg)}to{transform:translateX(220%) skewX(-18deg)}}

/* ---------- Fond commun : dégradé doux + trame de points sous les en-têtes de page ---------- */
.cy-v9-catalog,.cy-v9-product,.cy-portal-welcome,.cy-customer{position:relative}
.cy-v9-catalog::before,.cy-v9-product::before,.cy-customer::before{
	content:"";position:absolute;inset:0 0 auto 0;height:360px;z-index:-1;pointer-events:none;
	background:
		radial-gradient(820px 340px at 90% -10%,rgba(31,122,77,.10),transparent 62%),
		radial-gradient(640px 300px at -6% 4%,rgba(124,196,94,.10),transparent 58%),
		radial-gradient(rgba(31,122,77,.16) 1px,transparent 1.2px) 0 0/22px 22px;
	-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent);mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent);
}

/* ---------- Cartes : soulèvement + barre dégradée en haut ---------- */
.cy-product-card,.cyb-cat,.campy-v8-how__grid article,.cy-home-seo__card,.cy-v9-product__facts>div,
.cy-acct-app .cy-acct-kpis article,.cy-acct-app .cy-acct-card,.cy-journey-card,.cy-pack-card{
	position:relative;transition:transform .22s var(--cyp-ease),box-shadow .22s var(--cyp-ease),border-color .22s var(--cyp-ease);
}
.cy-v9-product__facts>div,.cy-acct-app .cy-acct-kpis article,.campy-v8-how__grid article{overflow:hidden}
.cy-v9-product__facts>div::before,.cy-acct-app .cy-acct-kpis article::before,.campy-v8-how__grid article::before{
	content:"";position:absolute;left:0;right:0;top:0;height:3px;border-radius:0 0 3px 3px;
	background:linear-gradient(90deg,var(--cyp-green),var(--cyp-lime));transform:scaleX(.3);transform-origin:left;transition:transform .4s var(--cyp-ease);opacity:.9;
}
@media (hover:hover) and (pointer:fine){
	.cy-product-card:not(.cy-tilt):hover,.cyb-cat:hover,.campy-v8-how__grid article:hover,.cy-home-seo__card:hover,
	.cy-v9-product__facts>div:hover,.cy-acct-app .cy-acct-kpis article:hover,.cy-acct-app .cy-acct-card:hover,.cy-journey-card:hover,.cy-pack-card:not(.cy-tilt):hover{
		transform:translateY(-4px)!important;box-shadow:var(--cyp-shadow)!important;border-color:rgba(31,122,77,.35)!important;
	}
	.cy-v9-product__facts>div:hover::before,.cy-acct-app .cy-acct-kpis article:hover::before,.campy-v8-how__grid article:hover::before{transform:scaleX(1)}
	.cy-product-card .cy-product-image img{transition:transform .6s var(--cyp-ease)}
	.cy-product-card:hover .cy-product-image img{transform:scale(1.06)}
	.cyb-cat:hover i{transform:translateX(4px);background:var(--cyp-green);color:#fff}
	.campy-v8-how__grid article b,.cy-v9-detail-section__head>span,.cy-acct-app .cy-cc-nav a svg,.cy-acct-app .cy-acct-kpis article svg{transition:transform .25s var(--cyp-spring)}
	.campy-v8-how__grid article:hover b,.cy-v9-detail-section:hover .cy-v9-detail-section__head>span,.cy-acct-app .cy-cc-nav a:hover svg,.cy-acct-app .cy-acct-kpis article:hover svg{transform:scale(1.15) rotate(-6deg)}
}

/* ---------- Entrées en cascade (fiche produit, espace client) ---------- */
.cy-v9-product__facts>div,.cy-acct-app .cy-acct-kpis article{animation:cypFadeUp .5s var(--cyp-ease) both}
.cy-v9-product__facts>div:nth-child(2),.cy-acct-app .cy-acct-kpis article:nth-child(2){animation-delay:.07s}
.cy-v9-product__facts>div:nth-child(3),.cy-acct-app .cy-acct-kpis article:nth-child(3){animation-delay:.14s}
.cy-v9-product__facts>div:nth-child(n+4),.cy-acct-app .cy-acct-kpis article:nth-child(n+4){animation-delay:.21s}

/* ---------- Catalogue : barre de recherche en verre, puces de filtre ---------- */
.cy-v9-search-surface{backdrop-filter:blur(10px);background:rgba(255,255,255,.92)!important;box-shadow:0 20px 44px -22px rgba(13,58,41,.35)!important;transition:box-shadow .25s var(--cyp-ease)}
.cy-v9-search-surface:focus-within{box-shadow:0 24px 52px -20px rgba(31,122,77,.45),0 0 0 3px rgba(31,122,77,.14)!important}
.cy-filter-bar label,.cy-filter-toggle,.cy-sort-label{transition:transform .15s var(--cyp-ease)}
.cy-filter-toggle:hover{transform:translateY(-1px)}
.cy-v9-availability-chip{animation:cypPulse 2.4s ease-out 1s infinite;border-radius:999px}

/* ---------- Fiche produit : panneau de réservation et galerie ---------- */
.cy-v9-booking-panel{box-shadow:0 24px 60px -26px rgba(13,58,41,.4),0 0 0 1px rgba(31,122,77,.06)!important;overflow:hidden}
.cy-v9-booking-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--cyp-green),var(--cyp-lime),var(--cyp-orange))}
.cy-v9-product__gallery{transition:box-shadow .25s var(--cyp-ease)}
.cy-v9-product__gallery:hover{box-shadow:var(--cyp-shadow)}
.cy-v9-product__head .cy-v9-kicker{display:inline-flex;align-items:center;gap:8px}
.cy-v9-product__head .cy-v9-kicker::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cyp-lime);animation:cypPulse 2.2s ease-out infinite}
.cy-reservation-timeline .cy-timeline-icon,.cy-journey-dot{transition:transform .25s var(--cyp-spring)}
.cy-reservation-timeline li:hover .cy-timeline-icon,.cy-journey-list li:hover .cy-journey-dot{transform:scale(1.2)}

/* ---------- Boutons : reflet au survol, enfoncement au clic ---------- */
.cy-v9-btn--primary,.campy-v8-btn--primary,.cy-v9-booking-panel .cy-btn,.cy-acct-app .cy-acct-btn,.cy-customer .cy-btn{position:relative;overflow:hidden;transition:transform .15s var(--cyp-ease),box-shadow .2s var(--cyp-ease),background .2s}
.cy-v9-btn--primary::after,.campy-v8-btn--primary::after,.cy-v9-booking-panel .cy-btn::after,.cy-acct-app .cy-acct-btn::after{
	content:"";position:absolute;top:0;bottom:0;width:40%;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:translateX(-120%) skewX(-18deg);pointer-events:none;
}
@media (hover:hover){
	.cy-v9-btn--primary:hover::after,.campy-v8-btn--primary:hover::after,.cy-v9-booking-panel .cy-btn:hover::after,.cy-acct-app .cy-acct-btn:hover::after{animation:cypShine .8s var(--cyp-ease) forwards}
	.cy-v9-booking-panel .cy-btn:hover,.cy-acct-app .cy-acct-btn:hover{transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(13,58,41,.55)}
}
.cy-v9-btn:active,.campy-v8-btn:active,.cy-acct-app .cy-acct-btn:active{transform:translateY(0) scale(.97)!important}

/* ---------- Accueil : badge de confiance flottant, titres de section ---------- */
.campy-v8-hero__content .cy-v9-kicker,.campy-v8-hero__content>small,.cy-v72-hero__content .cy-v9-kicker{animation:cypFloat 5s ease-in-out infinite}
.campy-v8-section h2::after,.cy-home-seo h2::after{transform-origin:left;transition:transform .5s var(--cyp-ease)}
.cyb-cat .cyb-cat__media::after{transition:opacity .3s}
.cyb-cat:hover .cyb-cat__media::after{opacity:.6}

/* ---------- Espace client : fond, navigation ---------- */
body.cy-acct-app .cy-cc-main{
	background:
		radial-gradient(820px 340px at 92% -10%,rgba(31,122,77,.10),transparent 62%) no-repeat,
		linear-gradient(to bottom,rgba(31,122,77,.05),transparent 320px) no-repeat,
		var(--cs-bg,#F6F8F6);
}
body.cy-acct-app .cy-cc-nav a{transition:background .15s,color .15s,transform .15s var(--cyp-ease);position:relative}
body.cy-acct-app .cy-cc-nav a:hover{transform:translateX(2px)}
body.cy-acct-app .cy-cc-nav a.is-active::before{content:"";position:absolute;left:-14px;top:22%;bottom:22%;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--cyp-green),var(--cyp-lime))}
body.cy-acct-app .cy-acct-pill{transition:transform .15s var(--cyp-ease)}
body.cy-acct-app .cy-acct-pill:hover{transform:scale(1.04)}

/* ---------- Mobile : pas de soulèvement, fond plus léger ---------- */
@media (max-width:760px){
	.cy-v9-catalog::before,.cy-v9-product::before,.cy-customer::before{height:220px}
	.cy-v9-booking-panel::before{display:none}
}
/* ---------- Accessibilité ---------- */
@media (prefers-reduced-motion:reduce){
	.cy-v9-product__facts>div,.cy-acct-app .cy-acct-kpis article,.cy-v9-availability-chip,.cy-v9-product__head .cy-v9-kicker::before,.campy-v8-hero__content .cy-v9-kicker,.campy-v8-hero__content>small{animation:none!important}
	.cy-v9-btn--primary::after,.campy-v8-btn--primary::after{display:none}
}

/* =====================================================================
   12/10/2026 — Lots P1 / P2 / P3 (suite de l'audit design)
   ===================================================================== */

/* P1 — Fiche produit : journal « Panier consulté… » retiré de la vue client (le markup reste, cf. CustomerViews) */
.cy-booking .cy-mini-journey{display:none!important}

/* P1 — Catalogue : titres sur 2 lignes maximum, hauteur constante → prix alignés d'une carte à l'autre */
.cy-product-card .cy-product-title h3{line-height:1.3;min-height:2.6em;margin:0}
.cy-product-card .cy-product-title h3 a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* P2 — Catalogue : CTA « Voir et réserver » au survol de la photo, pastille de disponibilité */
.cy-product-card .cy-product-image{position:relative}
.cy-product-card .cy-product-image::after{
	content:"Voir et réserver →";position:absolute;right:12px;bottom:12px;z-index:2;pointer-events:none;
	padding:8px 13px;border-radius:999px;background:var(--cyp-forest);color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.01em;
	box-shadow:0 10px 24px -10px rgba(13,58,41,.6);opacity:0;transform:translateY(6px);transition:opacity .2s var(--cyp-ease),transform .2s var(--cyp-ease);
}
@media (hover:hover) and (pointer:fine){.cy-product-card:hover .cy-product-image::after{opacity:1;transform:none}}
.cy-product-caption.is-available{
	display:inline-flex;align-items:center;gap:7px;margin:6px 0 2px;padding:4px 11px 4px 9px;border-radius:999px;
	background:#EEF7F1;color:#18663F;font-size:12px;font-weight:700;
}
.cy-product-caption.is-available::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--cyp-lime);animation:cypPulse 2.2s ease-out infinite}

/* P2 — Catalogue (page Elementor /materiel/) : hero compact, barre de recherche qui chevauche le hero → produits visibles plus tôt */
.cy-el-hero{min-height:280px!important;padding-bottom:88px!important}
.cy-el-hero .elementor-heading-title,.cy-el-hero h1{font-size:clamp(2.2rem,4vw,3.4rem)!important;line-height:1!important}
.cy-el-search{position:relative;z-index:3;margin-top:-66px!important}
.cy-el-search .cy-v9-search-surface,.cy-el-search .cy-search-form{box-shadow:0 24px 54px -22px rgba(13,58,41,.45)!important}
@media (max-width:760px){.cy-el-hero{min-height:220px!important;padding-bottom:70px!important}.cy-el-search{margin-top:-48px!important}}

/* P2 — Fiche produit : cartes « faits » compactes avec icône (markup : template-parts/product.php) */
.cy-v9-product__facts>div{min-height:0;padding:14px 16px;display:grid;grid-template-columns:36px minmax(0,1fr);gap:1px 12px;align-content:center}
.cy-v9-product__facts .cy-fact-ico{grid-row:1/span 3;align-self:start;width:36px;height:36px;border-radius:11px;background:#EEF7F1;color:var(--cyp-green);display:grid;place-items:center;transition:transform .25s var(--cyp-spring),background .2s}
.cy-v9-product__facts .cy-fact-ico svg{width:19px;height:19px}
.cy-v9-product__facts>div:hover .cy-fact-ico{transform:scale(1.12) rotate(-6deg);background:#DDF0E4}
.cy-v9-product__facts>div>span,.cy-v9-product__facts>div>strong,.cy-v9-product__facts>div>small{grid-column:2}
.cy-v9-product__facts>div>strong{font-size:1.02rem;line-height:1.2}
.cy-v9-product__facts>div>small{margin-top:3px;line-height:1.35}
@media (max-width:760px){.cy-v9-product__facts{grid-template-columns:repeat(2,1fr)}}

/* P2 — Accueil : un seul CTA orange dans le hero (« Voir les disponibilités ») ; « Voir le matériel » passe en style verre */
.campy-v8-hero .campy-v8-actions .campy-v8-btn--primary{
	background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.55)!important;
	backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:none!important;
}
.campy-v8-hero .campy-v8-actions .campy-v8-btn--primary:hover{background:rgba(255,255,255,.22)!important}
