/* TechStack — parité React TechStackSection : onglets + bandeau + cartes */
.essik-tech-section { padding: 5rem 1.25rem; background: #fff; }
.essik-tech-inner { max-width: 80rem; margin: 0 auto; }
.essik-tech-header { text-align: center; max-width: 48rem; margin: 0 auto 3.5rem; }
.essik-tech-eyebrow { display: inline-flex; align-items: center; gap: .5rem; padding: .25rem .75rem; border-radius: 9999px; background: #FFF2EB; color: #FF5500; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.essik-tech-title { margin: .75rem 0 0; font-size: 1.875rem; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; color: #0f172a; }
@media (min-width: 640px) { .essik-tech-title { font-size: 2.25rem; } }
.essik-tech-description { margin: .75rem auto 0; font-size: 1rem; line-height: 1.7; color: #475569; max-width: 44rem; }
@media (min-width: 640px) { .essik-tech-description { font-size: 1.125rem; } }
.essik-tech-tabs { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .625rem; margin-bottom: 2.5rem; }
.essik-tech-tab { display: inline-flex; align-items: center; gap: .5rem; padding: .625rem 1rem; border-radius: .75rem; font-size: .8rem; font-weight: 800; background: #f8fafc; color: #334155; border: 1px solid #e2e8f0; cursor: pointer; transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease; font-family: inherit; }
.essik-tech-tab-dot { width: .9rem; height: .9rem; border: 1.5px solid currentColor; border-radius: .3rem; opacity: .7; }
.essik-tech-tab:hover:not(.is-active) { border-color: #cbd5e1; }
.essik-tech-tab.is-active { background: #FF5500; border-color: #FF5500; color: #fff; box-shadow: 0 10px 25px rgba(255,85,0,.25); }
.essik-tech-banner { padding: 1rem 1.25rem; border-radius: 1rem; background: #FFF7ED; border: 1px solid #fed7aa; margin-bottom: 2rem; display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 640px) { .essik-tech-banner { flex-direction: row; align-items: center; justify-content: space-between; padding: 1.25rem; } }
.essik-tech-banner-kicker { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: #FF5500; }
.essik-tech-banner-desc { margin: .15rem 0 0; font-size: .875rem; font-weight: 500; color: #1e293b; }
.essik-tech-banner-note { display: inline-flex; align-items: center; gap: .5rem; font-size: .75rem; color: #64748b; flex-shrink: 0; }
.essik-tech-banner-shield { color: #10b981; font-size: 1rem; }
.essik-tech-grid { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .essik-tech-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .essik-tech-grid { grid-template-columns: repeat(3, 1fr); } }
.essik-tech-card { padding: 1.25rem; border-radius: 1rem; background: rgba(248,250,252,.7); border: 1px solid rgba(226,232,240,.8); box-shadow: 0 1px 2px rgba(0,0,0,.04); transition: background-color .15s ease, border-color .15s ease; }
.essik-tech-card:hover { border-color: rgba(255,85,0,.5); background: #fff; }
.essik-tech-card-top { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .75rem; }
.essik-tech-card-title { margin: 0; font-size: 1rem; font-weight: 800; color: #0f172a; transition: color .15s ease; }
.essik-tech-card:hover .essik-tech-card-title { color: #FF5500; }
.essik-tech-level { padding: .15rem .5rem; font-size: .625rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; border-radius: .375rem; background: #ffedd5; color: #FF5500; white-space: nowrap; }
.essik-tech-card-desc { margin: 0; font-size: .75rem; line-height: 1.7; color: #475569; }