/* 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; } Berlin Poster - Paint by numbers Give yourself a sensory journey to the heart of Berlin with the Berlin Poster from Steloria. Designed to reveal urban beauty step by step, this paint by numbers kit transforms a simple afternoon into a creative and soothing experience. The elegant shapes and chosen shades highlight the soul of the city: its architectural lines, its night lights, and its suspended moments. What your kit contains 1 high-quality printed canvas, numbered areas for precise application Palette of acrylic paints selected for their coverage and bright colors Brushes of different sizes for details and flat areas Clear step-by-step guide and number matching diagrams Why choose this poster Easy to use, even for a beginner, the Berlin Poster invites you to slow down and savor each stroke. The number method guarantees a harmonious and professional result without stress. The final rendering, rich in visual textures, adds a sophisticated touch to your interior: living room, office, or bedroom take on a new and sensual dimension. Practical advantages and user guide Steloria designed this kit to combine creative pleasure and simplicity. The colors blend smoothly, the brushes glide effortlessly, and each numbered area guides you towards a balanced composition. In just a few steps, you will achieve a work ready to be framed and admired. Tips for a perfect result Paint the areas of the same shade from the inside out for clean edges. Let each layer dry for a few minutes before adding another color. Rinse the brushes in warm water and lay the poster flat to dry evenly. For lasting protection, apply a matte or satin varnish once the paint is dry. Embrace Steloria and let the Berlin Poster reveal your talent with elegance. A perfect gift, a creative break, a unique decoration: rediscover the pleasure of painting and the magic of the result. Description Model : Berlin PosterMethod : Paint by numbersDifficulty level : IntermediateDimensions : 50x40cmFrame options : Sold with no frameSupport : Treated and printed cotton/linen canvasPaint type : Acrylic (24 colors)Packaging : rolled or folded in secure packaging // 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]);