/* CONTENEUR EN FLEX */ .accordion { display:flex; flex-direction:column; gap:0; /* lignes séparatrices gérées par border */ max-width: 880px; margin: 0 auto; } /* ITEM EN FLEX COLONNE */ .accordion-item { display:flex; flex-direction:column; } /* En-tête : H2 + bouton (ligne en flex) */ .accordion h2 { margin:0; } .accordion button{ all: unset; display:flex; /* FLEX ICI */ align-items:center; justify-content:space-between; gap:14px; width:100%; cursor:pointer; padding:10px 6px; } .accordion .label { flex:1; font-size: clamp(16px, 1.8vw, 22px); font-weight:700; color: #464746; } .accordion button:focus-visible { outline: 3px solid #1a73e8; outline-offset: 3px; border-radius:6px; } /* Icônes en ligne (flex child) */ .icona { width:22px; height:22px; opacity:.85; margin-right:6px; color: #464746; } .title-left { display:flex; align-items:center; gap:14px; } /* Chevron */ .chevrona { width:22px; height:22px; flex:0 0 22px; transition: transform .2s ease; color: #464746; } [aria-expanded="true"] .chevrona{ transform: rotate(-180deg); } /* PANNEAU EN FLEX COLONNE + TRANSITION hauteur */ .panel { display:flex; /* FLEX ICI */ flex-direction:column; overflow:hidden; max-height:0; /* fermé */ transition:max-height .28s ease; } .panel[data-open="true"] { max-height: 600px; /* valeur assez grande pour contenir le contenu */ } .panel > div { padding: 0 6px 18px 6px; color: var(--muted); line-height: 1.6; font-size: 16px; } Cerf Pop Art - Peinture par numéros Plongez dans une expérience créative sensuelle et moderne avec le kit Cerf Pop Art de Steloria. Conçu pour révéler un portrait lumineux et contemporain, ce tableau par numéros transforme vos moments calmes en une œuvre vibrante. Les formes stylisées du cerf et les couleurs pop s’unissent pour offrir une décoration unique et un cheminement artistique apaisant. Une création accessible et raffinée Chaque détail du kit a été pensé pour être simple à utiliser, même si vous débutez. Les zones numérotées claires, les teintes intenses et les pinceaux de qualité rendent l’application fluide. Vous retrouvez rapidement la sensation gratifiante de voir le motif émerger sous vos gestes, comme une caresse de couleur sur la toile. Ce que comprend votre kit Toile pré-imprimée haute qualité, prête à être encadrée Palette de peintures acryliques aux couleurs vives et couvrantes Ensemble de pinceaux adaptés aux détails et aux surfaces larges Guide pas à pas avec numéros et conseils de finition Support client Steloria pour toute question ou conseil Pourquoi choisir le Cerf Pop Art ? Ce kit allie esthétique pop et douceur sensorielle. Le motif du cerf, symbole de grâce et de force, se prête à une interprétation moderne qui capte le regard. Que vous cherchiez un cadeau original, une activité détente ou un élément déco fort, ce tableau s’impose naturellement. Avantages clés Facile à suivre : idéal pour débutants et confirmés Résultat professionnel : couleurs intenses et rendu net Instant bien-être : activité relaxante à votre rythme Parfait pour décorer salon, bureau ou chambre Emballage soigné, prêt à offrir Caractéristiques techniques Peinture : acrylique, séchage rapide, sans odeur forte Matériaux durables et faciles à entretenir Temps estimé : 4 à 12 heures selon la taille et le niveau Offrez-vous l’élégance colorée du Cerf Pop Art Steloria. Laissez vos mains dessiner la lumière et transformez un simple tableau en une présence vibrante. Commandez dès maintenant et révélez votre talent, un numéro à la fois. Description Modèle : Cerf Pop ArtMéthode : Peinture par numérosNiveaux de difficulté : IntermédiaireDimensions : 50x40cmOptions de cadre : Vendu sans cadre ou toile montée sur cadreSupport : Toile de lin/coton traitée et impriméeType de peinture : AcryliqueEmballage : roulé dans un emballage sécurisé // Accordéon : un seul panneau ouvert à la fois const accordion = document.getElementById('accordion'); const buttons = accordion.querySelectorAll('.accordion-item h2 > button'); function closeItem(btn){ btn.setAttribute('aria-expanded', 'false'); const panel = document.getElementById(btn.getAttribute('aria-controls')); panel.dataset.open = "false"; panel.style.maxHeight = null; } function openItem(btn){ btn.setAttribute('aria-expanded', 'true'); const panel = document.getElementById(btn.getAttribute('aria-controls')); panel.dataset.open = "true"; // ajuste la hauteur pour la transition panel.style.maxHeight = panel.scrollHeight + "px"; } buttons.forEach(btn => { btn.addEventListener('click', () => { const wasOpen = btn.getAttribute('aria-expanded') === 'true'; // ferme tous les items buttons.forEach(closeItem); // ouvre seulement celui cliqué s'il n'était pas déjà ouvert if (!wasOpen) openItem(btn); }); // touche Entrée/Espace pour accessibilité btn.addEventListener('keydown', (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); btn.click(); } }); }); // (Optionnel) ouvrir le premier par défaut : // if (buttons.length) openItem(buttons[0]);
