/* 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(18px, 2.2vw, 28px); font-weight:700; } .accordion button:focus-visible { outline: 3px solid #1a73e8; outline-offset: 3px; border-radius:6px; } /* Icônes en ligne (flex child) */ .icon { width:22px; height:22px; opacity:.85; margin-right:6px } .title-left { display:flex; align-items:center; gap:14px; } /* Chevron */ .chevron { width:22px; height:22px; flex:0 0 22px; transition: transform .2s ease; color: var(--chev); } [aria-expanded="true"] .chevron{ 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; } Kit de démarrage - Peintures par Numéros Offrez-vous un voyage créatif, doux et accessible. Le kit de démarrage Steloria transforme chaque moment en une expérience sensuelle et apaisante : la toile numérotée invite, les couleurs veloutées enveloppent, et le pinceau glisse avec délicatesse. Conçu pour les débutants comme pour les amateurs en quête d'une pause raffinée, ce kit rassemble l’essentiel pour peindre sans contrainte et révéler une œuvre sublime, même sans expérience préalable. Ce que contient votre kit Toile pré-imprimée et numérotée, tendue et prête à peindre Palette de peintures acryliques riches et opaques, code couleur clair Trois pinceaux de qualité (fin, moyen, large) qui glissent et tiennent la forme Notice simple pas à pas et conseils d’entretien Les atouts Steloria Simplicité : instructions limpides, pas de préparation compliquée Qualité : peintures opaques, séchage rapide et rendu soyeux Relaxation : activité méditative qui apaise l’esprit et stimule la concentration Esthétique : motifs élégants, harmonies de couleurs pensées pour sublimer votre intérieur Comment commencer ? En quelques gestes, transformez la toile en tableau élégant. Installez votre espace, ouvrez le kit et suivez les numéros. La méthode Steloria privilégie la fluidité : peignez zone par zone, laissez sécher, et admirez la progression. Chaque coup de pinceau devient un rituel plaisant, presque sensuel, où la couleur réchauffe et restaure. Guide rapide en 5 étapes Posez la toile sur une surface stable et protégez votre plan de travail. Commencez par les grandes zones avec le pinceau large, puis détaillez avec les plus fins. Mélangez légèrement les teintes sur la palette pour adoucir les transitions. Laissez sécher entre les couches si nécessaire pour un rendu net. Nettoyez les pinceaux et conservez vos restes de peinture pour retouches futures. Idée cadeau Offrez le kit Steloria pour un anniversaire, une pause bien-être ou un moment partagé. C’est un présent élégant, facile à vivre, qui invite à la détente et laisse un souvenir durable - une œuvre personnelle à exposer avec fierté. Description Modèles : 1.Cinque Terre - Italie, 2.Île de Santorini - Grèce, 3.Chat Pop Art, 4.Girafe Pop ArteMéthode : Peinture par numérosNiveaux de difficulté : 1.Intermédiaire, 2.Intermédiaire, 3.Facile,4. FacileDimensions : 40x50cm Support : 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]);
