:root{--bg:#031416;--card:#0b2528;--mint:#25efc3;--pink:#ff3ea5;--gold:#ffd36b}.cci-body{margin:0;background:radial-gradient(circle at 10% 0,#123b3c 0,transparent 38%),linear-gradient(180deg,#020b12,#041a1c);color:#fff;font-family:Inter,Arial,sans-serif;min-height:100vh}.cci-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:rgba(2,11,18,.9);backdrop-filter:blur(16px);border-bottom:1px solid rgba(37,239,195,.2)}.cci-header a,.cci-header span{color:#fff;text-decoration:none;background:#102b2e;border:1px solid #28575a;border-radius:999px;padding:10px 14px}.cci-header h1{margin:2px 0;font-size:20px}.cci-header small,.cci-title small{color:var(--mint);font-weight:800;letter-spacing:.12em}.cci-tabs{display:flex;gap:10px;overflow:auto;padding:14px 18px;background:#07171a;position:sticky;top:76px;z-index:19}.cci-tabs a{white-space:nowrap;color:#fff;text-decoration:none;background:#10272a;border:1px solid #24494c;border-radius:14px;padding:11px 14px;font-weight:800}.cci-main{max-width:1180px;margin:auto;padding:20px}.cci-section{scroll-margin-top:145px;margin:0 0 30px;padding:22px;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:rgba(5,28,31,.82);box-shadow:0 20px 50px rgba(0,0,0,.24)}.cci-title{display:flex;gap:14px;align-items:center;margin-bottom:18px}.cci-title>span{font-size:38px}.cci-title h2{margin:2px 0}.cci-grid,.cci-people,.cci-selfies{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.cci-card,.cci-wall article,.cci-people article,.cci-empty{background:linear-gradient(145deg,#0d3033,#091d25);border:1px solid rgba(37,239,195,.14);border-radius:18px;padding:16px}.cci-card .cci-icon{font-size:32px}.cci-card h3{margin:8px 0}.cci-card p,.cci-note{opacity:.78}.cci-card strong{color:var(--gold)}button,.cci-main-btn{border:0;border-radius:13px;padding:12px 16px;background:linear-gradient(90deg,var(--mint),#13b7ff);color:#041418;font-weight:900;cursor:pointer;text-decoration:none;display:inline-block}.cci-card button{width:100%;margin-top:12px}.cci-form{max-width:700px;background:#081f22;border-radius:18px;padding:16px;margin-bottom:18px}.cci-row{display:grid;grid-template-columns:1fr 110px;gap:10px}.cci-form select,.cci-form textarea{box-sizing:border-box;width:100%;background:#041416;border:1px solid #31575b;color:#fff;border-radius:12px;padding:12px;margin-bottom:10px}.cci-form textarea{min-height:100px;resize:vertical}.cci-form button{width:100%}.cci-form small{display:block;text-align:center;opacity:.6;margin-top:8px}.cci-wall{display:grid;gap:10px}.cci-wall article{display:flex;gap:12px;align-items:center}.cci-wall p{margin:0}.cci-selfies figure{margin:0;overflow:hidden;border-radius:18px;background:#0a2528}.cci-selfies img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}.cci-selfies figcaption{padding:10px}.cci-selfies small{display:block;opacity:.7}.cci-people article{text-align:center}.cci-avatar{width:74px;height:74px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#183c40;margin:0 auto 10px;font-size:34px}.cci-avatar img{width:100%;height:100%;object-fit:cover}.cci-people small{display:block;opacity:.7;margin:5px}.cci-people form{display:flex;justify-content:center;gap:5px}.cci-people button{padding:8px;background:#17363a;color:#fff}.cci-alert{max-width:1100px;margin:15px auto;padding:13px 18px;border-radius:14px}.cci-alert.ok{background:#0d493b}.cci-alert.bad{background:#5a1f30}@media(max-width:780px){.cci-grid,.cci-people,.cci-selfies{grid-template-columns:repeat(2,minmax(0,1fr))}.cci-main{padding:12px}.cci-section{padding:15px}.cci-header span{display:none}}@media(max-width:480px){.cci-grid,.cci-people{grid-template-columns:1fr}.cci-selfies{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Cartes d'interaction sur l'accueil Costa Club */
.club-interaction-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  margin:18px 0 24px!important;
  padding:0!important;
}
.club-interaction-grid>a{
  position:relative!important;
  display:flex!important;
  min-height:138px!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:7px!important;
  padding:20px!important;
  border:1px solid rgba(37,239,195,.48)!important;
  border-radius:22px!important;
  background:linear-gradient(145deg,rgba(10,42,45,.96),rgba(6,20,29,.96))!important;
  box-shadow:0 12px 35px rgba(0,0,0,.28),0 0 22px rgba(37,239,195,.12)!important;
  color:#fff!important;
  text-decoration:none!important;
  overflow:hidden!important;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important;
}
.club-interaction-grid>a:before{
  content:''!important;
  position:absolute!important;
  inset:-35% 45% 45% -20%!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(37,239,195,.22),transparent 70%)!important;
  pointer-events:none!important;
}
.club-interaction-grid>a:nth-child(2){border-color:rgba(255,183,61,.58)!important;box-shadow:0 12px 35px rgba(0,0,0,.28),0 0 22px rgba(255,183,61,.12)!important}
.club-interaction-grid>a:nth-child(3){border-color:rgba(55,224,255,.58)!important}
.club-interaction-grid>a:nth-child(4){border-color:rgba(206,80,255,.60)!important;box-shadow:0 12px 35px rgba(0,0,0,.28),0 0 22px rgba(206,80,255,.13)!important}
.club-interaction-grid>a:hover{transform:translateY(-3px)!important;box-shadow:0 16px 42px rgba(0,0,0,.38),0 0 30px rgba(37,239,195,.22)!important}
.club-interaction-grid>a>span{position:relative!important;z-index:1!important;display:block!important;font-size:34px!important;line-height:1!important;margin:0 0 5px!important}
.club-interaction-grid>a>strong{position:relative!important;z-index:1!important;display:block!important;color:#fff!important;font-size:18px!important;line-height:1.15!important;font-weight:900!important;text-decoration:none!important}
.club-interaction-grid>a>small{position:relative!important;z-index:1!important;display:block!important;color:rgba(255,255,255,.72)!important;font-size:13px!important;line-height:1.35!important;text-decoration:none!important}
@media(max-width:900px){.club-interaction-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:520px){.club-interaction-grid{grid-template-columns:1fr!important;gap:10px!important}.club-interaction-grid>a{min-height:112px!important;padding:16px 18px!important}.club-interaction-grid>a>span{font-size:30px!important}}