/* === IMPROVEMENT 10/10: Kassiope Agency Design Sublimation === */
/* Boutons avec glow pulse animation */
@keyframes glowPulse {
0% { box-shadow: 0 0 5px rgba(108, 99, 255, 0.4), 0 0 10px rgba(108, 99, 255, 0.2); }
50% { box-shadow: 0 0 20px rgba(108, 99, 255, 0.6), 0 0 40px rgba(108, 99, 255, 0.3); }
100% { box-shadow: 0 0 5px rgba(108, 99, 255, 0.4), 0 0 10px rgba(108, 99, 255, 0.2); }
}
@keyframes glowPulseCyan {
0% { box-shadow: 0 0 5px rgba(0, 212, 255, 0.4), 0 0 10px rgba(0, 212, 255, 0.2); }
50% { box-shadow: 0 0 20px rgba(0, 212, 255, 0.6), 0 0 40px rgba(0, 212, 255, 0.3); }
100% { box-shadow: 0 0 5px rgba(0, 212, 255, 0.4), 0 0 10px rgba(0, 212, 255, 0.2); }
}
.btn-ka,
.btn-primary,
.btn[class*="primary"],
section .btn:not(.btn-link):not(.o_we_force_no_glow) {
animation: glowPulse 2.5s ease-in-out infinite;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.btn-ka:hover,
.btn-primary:hover,
.btn[class*="primary"]:hover,
section .btn:not(.btn-link):hover {
animation-play-state: paused;
transform: translateY(-3px) scale(1.03);
box-shadow: 0 8px 30px rgba(108, 99, 255, 0.5);
}
.btn-ka-secondary,
.btn-secondary {
animation: glowPulseCyan 2.5s ease-in-out infinite;
}
/* Grile services avec hover scale + gradient overlay */
.o_we_service_card,
.service-card,
.card.o_we_service,
.col-lg-4 .oe_structure > div,
section .col-lg-4 > div {
position: relative;
overflow: hidden;
transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275),
box-shadow 0.4s ease;
}
.o_we_service_card:hover,
.service-card:hover,
.card.o_we_service:hover,
.col-lg-4 .oe_structure > div:hover,
section .col-lg-4 > div:hover {
transform: scale(1.05);
box-shadow: 0 15px 45px rgba(108, 99, 255, 0.25),
0 5px 15px rgba(0, 0, 0, 0.2);
}
.o_we_service_card::after,
.service-card::after,
.card.o_we_service::after {
content: '';
position: absolute;
top: 0; left: 0; right: 0; bottom: 0;
background: linear-gradient(135deg, rgba(108, 99, 255, 0.2) 0%, transparent 50%, rgba(0, 212, 255, 0.1) 100%);
opacity: 0;
transition: opacity 0.5s ease;
pointer-events: none;
z-index: 1;
}
.o_we_service_card:hover::after,
.service-card:hover::after,
.card.o_we_service:hover::after {
opacity: 1;
}
.o_we_service_card:hover img,
.service-card:hover img,
.card.o_we_service:hover img {
transform: scale(1.1);
}
.o_we_service_card img,
.service-card img,
.card.o_we_service img {
transition: transform 0.6s ease;
}
/* Animations entrance au scroll (stagger) */
@keyframes fadeUpKA {
from { opacity: 0; transform: translateY(60px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInScale {
from { opacity: 0; transform: scale(0.9); }
to { opacity: 1; transform: scale(1); }
}
.ka-fade-up {
animation: fadeUpKA 0.7s ease forwards;
}
.ka-fade-scale {
animation: fadeInScale 0.6s ease forwards;
}
/* Stagger on cards grid */
.row > .col-lg-4,
.row > .col-md-6,
.row > .col-sm-6 {
animation: fadeUpKA 0.7s ease forwards;
opacity: 0;
}
.row > .col-lg-4:nth-child(1),
.row > .col-md-6:nth-child(1),
.row > .col-sm-6:nth-child(1) { animation-delay: 0.05s; }
.row > .col-lg-4:nth-child(2),
.row > .col-md-6:nth-child(2),
.row > .col-sm-6:nth-child(2) { animation-delay: 0.15s; }
.row > .col-lg-4:nth-child(3),
.row > .col-md-6:nth-child(3),
.row > .col-sm-6:nth-child(3) { animation-delay: 0.25s; }
.row > .col-lg-4:nth-child(4),
.row > .col-md-6:nth-child(4),
.row > .col-sm-6:nth-child(4) { animation-delay: 0.35s; }
.row > .col-lg-4:nth-child(5),
.row > .col-md-6:nth-child(5),
.row > .col-sm-6:nth-child(5) { animation-delay: 0.45s; }
.row > .col-lg-4:nth-child(6),
.row > .col-md-6:nth-child(6),
.row > .col-sm-6:nth-child(6) { animation-delay: 0.55s; }
.row > .col-lg-4:nth-child(7),
.row > .col-md-6:nth-child(7),
.row > .col-sm-6:nth-child(7) { animation-delay: 0.65s; }
.row > .col-lg-4:nth-child(8),
.row > .col-md-6:nth-child(8),
.row > .col-sm-6:nth-child(8) { animation-delay: 0.75s; }
.row > .col-lg-4:nth-child(9),
.row > .col-md-6:nth-child(9),
.row > .col-sm-6:nth-child(9) { animation-delay: 0.85s; }
/* Stats section with animated counter suggestion */
.counter-stat,
.stat-box,
.o_counter {
position: relative;
padding: 30px 20px;
text-align: center;
}
.counter-stat .stat-number,
.stat-box .number,
.o_counter .o_counter_number {
font-size: 3.5rem;
font-weight: 800;
background: linear-gradient(135deg, #6C63FF, #00D4FF);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.counter-stat .stat-label,
.stat-box .label,
.o_counter .o_counter_label {
font-size: 1rem;
text-transform: uppercase;
letter-spacing: 2px;
color: rgba(255, 255, 255, 0.7);
margin-top: 8px;
}
/* Kassiope palette utilities */
.text-ka-violet { color: #6C63FF; }
.text-ka-cyan { color: #00D4FF; }
.bg-ka-dark { background-color: #0A1628; }
.bg-ka-card { background-color: #0F1D35; }
/* Dark theme polish for Kassiope sections */
section:not(.o_we_force_no_dark) {
background-color: #0A1628;
}
section:not(.o_we_force_no_dark) h1,
section:not(.o_we_force_no_dark) h2,
section:not(.o_we_force_no_dark) h3 {
color: #ffffff;
}
section:not(.o_we_force_no_dark) p,
section:not(.o_we_force_no_dark) .lead {
color: rgba(255, 255, 255, 0.85);
}
/* Sticky nav with blur for Kassiope */
header.o_header_affix,
nav.navbar.fixed-top {
backdrop-filter: blur(14px) saturate(200%);
-webkit-backdrop-filter: blur(14px) saturate(200%);
background-color: rgba(10, 22, 40, 0.9) !important;
border-bottom: 1px solid rgba(108, 99, 255, 0.15);
}
/* Card background on dark */
.card, .o_we_service_card, .service-card {
background: #0F1D35;
border: 1px solid rgba(108, 99, 255, 0.1);
border-radius: 12px;
}
Skip to Content
The goal of this site is create a relevant knowledge base that would answer questions related to Odoo.
Therefore questions and answers can be edited like wiki pages by experienced users of this site in order to improve the overall quality of the knowledge base content. Such privileges are granted based on user karma level: you will be able to do the same once your karma gets high enough.
If this approach is not for you, please respect the community.
5
upvote, add comments
30
insert text link, upload files
50
downvote
50
delete own comment
100
flag offensive, close own questions
300
edit any post, view offensive flags
500
accept any answer
500
delete any comment
500
close any posts
750
your biography can be seen as tooltip
1,000
delete any question or answer