/* 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; } Portail du crépuscule - Peinture par numéros Steloria vous invite à pénétrer dans un univers où la lumière douce du soir se transforme en œuvre d’art sous vos doigts. « Portail du crépuscule » est une peinture par numéros conçue pour offrir une expérience créative à la fois sensuelle et accessible. Chaque nuance a été pensée pour capturer l’émotion d’un ciel tombant, des reflets dorés aux ombres délicates, afin de composer une scène apaisante et profondément décorative. Pourquoi choisir ce kit ? Simple et raffinée, cette création Steloria convient aux débutants comme aux passionnés. Le point fort : un résultat professionnel sans effort complexe. Peindre devient une parenthèse relaxante, un geste qui renouvelle votre intérieur et nourrit votre bien-être. Offrez-vous ou offrez à un proche un cadeau qui allie détente, fierté et beauté durable. Expérience relaxante : réduit le stress et recentre l’esprit. Résultat soigné : palette harmonieuse et dégradés étudiés. Accessible : instructions claires pour tous les niveaux. Décoratif : pièce finale prête à encadrer pour sublimer un mur. Ce que contient votre kit Tout est inclus pour peindre dès la réception, sans besoin d’accessoires supplémentaires. Les matériaux sélectionnés garantissent une application fluide et une tenue des couleurs dans le temps. Toile pré-imprimée numérotée, de haute qualité et tendue. Peintures acryliques non toxiques, couleurs pré-mélangées. Jeu de pinceaux précis pour détails et remplissage. Guide pas à pas illustré avec astuces de réalisation. Conseils pour une finition parfaite Travaillez par zones et respectez le séchage entre les couches pour des couleurs profondes. Utilisez le pinceau fin pour les contours du portail et le plus large pour les surfaces lumineuses. Une finition vernie (optionnelle) protégera et intensifiera les couleurs pour un rendu digne d’une galerie. « Portail du crépuscule » par Steloria est l’expérience artistique qui transforme un instant en chef-d’œuvre. Laissez-vous guider, peignez en confiance et révélez une pièce qui évoque la poésie du soir dans votre intérieur. Description Modèle : Portail du crépusculeMéthode : Peinture par numérosNiveaux de difficulté : IntermédiaireDimensions : 30x40cm, 40x50cm et 50x65cmOptions de cadre : Vendu sans cadre ou avec cadre en kit à monter soi-mêmeSupport : Toile de lin/coton traitée et impriméeType de peinture : AcryliqueEmballage : 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]);
