/* 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; } Poster Californie - Peinture par numéros Plongez dans une atmosphère douce et lumineuse avec le "Poster Californie", un kit de peinture par numéros signé Steloria. Conçu pour éveiller vos sens et apaiser l'esprit, ce poster transforme un mur ordinaire en une fenêtre ouverte sur la côte californienne. Ses teintes chaleureuses et ses formes harmonieuses invitent à la détente et à la création, même si vous n'êtes pas peintre. Une expérience créative et sensuelle Chaque coup de pinceau devient une caresse : les couleurs glissent, se mêlent, et révèlent progressivement un paysage de palmiers, d'océans et de couchers de soleil. L'expérience est simple et gratifiante, idéale pour un moment personnel de relaxation, une activité partagée en couple ou un atelier créatif en famille. Le geste est intuitif, le résultat élégant. Design inspiré et évocateur Le motif évoque l'air salin, le sable chaud et la lumière rasante du soir. Les nuances ont été choisies pour créer des transitions délicates et une profondeur visuelle qui habille vos murs sans les envahir. Ce poster devient un point focal discret mais puissant, capable d'apporter une touche de voyage et de rêverie dans votre intérieur. Caractéristiques pratiques et bénéfices Contenu du kit et qualité Toile numérotée facile à peindre et à encadrer Peintures acryliques non toxiques aux pigments lumineux Un ou plusieurs pinceaux adaptés aux détails et aux aplats Guide clair pas à pas pour un rendu professionnel Facile à réaliser, beau à exposer Idéal pour se détendre après une journée chargée Parfait comme cadeau élégant et personnel Se prête à toutes les pièces : salon, chambre, bureau Peu d'expérience nécessaire : résultat harmonieux garanti Conseils d'encadrement et d'entretien fournis pour sublimer votre œuvre Offrez-vous un instant de création et de douceur avec le Poster Californie Steloria. Transformez un mur en paysage, un après-midi en voyage, et faites naître chez vous une ambiance chaleureuse et raffinée. Description Modèle : Poster CalifornieMéthode : Peinture par numérosNiveaux de difficulté : IntermédiaireDimensions : 50x40cmOptions de cadre : Vendu sans cadreSupport : Toile de lin/coton traitée et impriméeType de peinture : Acrylique (24 couleurs)Emballage : roulé ou plié 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]);
