eclat_italy_rycycling
<!--
ECLAT GmbH - Etichetta ambientale (pagina Shopify)
USO: Admin Shopify > Pagine > Aggiungi pagina > nell'editor apri "Mostra HTML" (icona <>) e incolla tutto questo.
Tutto e' racchiuso in #eclat-eco: non tocca il tema.
DA CONFERMARE (ora ci sono valori tipici come bozza):
- tipo di plastica del vasetto crema e dei tappi (PP? PET? acrilico?)
- composizione del tappo magnetico (plastica + magnete)
- materiale del feltro (cartuccia auto / bastoncini)
Ricordati di aggiornare la data in fondo alla pagina.
-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500&family=Inter:wght@400;500&display=swap" rel="stylesheet">
<div id="eclat-eco">
<style>
#eclat-eco{
--ink:#141414;
--ink-2:#6c6c6c;
--paper:#ffffff;
--line:#e6e5e1;
--line-strong:#c9c8c3;
/* colori raccolta differenziata: unica nota di colore della pagina */
--carta:#1f5c8b; --plastica:#d0a200; --vetro:#2f7d4f; --metallo:#6f7b83; --resto:#6b6f6a;
all:initial; display:block;
background:var(--paper); color:var(--ink);
font-family:"Inter", ui-sans-serif, system-ui, sans-serif;
font-size:16px; line-height:1.65;
-webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
#eclat-eco *{box-sizing:border-box; margin:0; padding:0;}
#eclat-eco .wrap{max-width:1040px; margin:0 auto; padding:clamp(30px,6vw,84px) clamp(20px,5vw,52px) 80px;}
/* HERO */
#eclat-eco .hero{text-align:center; padding-bottom:clamp(30px,5vw,52px);}
#eclat-eco .logo{height:34px; width:auto; max-width:200px; margin:0 auto 40px; display:block;}
#eclat-eco .logo-foot{height:18px; width:auto; max-width:140px; margin:0 auto 16px; display:block; opacity:.7;}
#eclat-eco h1{
font-family:"Jost", sans-serif; font-weight:300;
font-size:clamp(28px,6vw,54px); line-height:1.08;
text-transform:uppercase; letter-spacing:.16em; margin-bottom:22px;
}
#eclat-eco .lede{max-width:520px; margin:0 auto; color:var(--ink-2); font-size:15.5px;}
#eclat-eco .legalref{
font-family:"Jost", sans-serif; font-size:11px; font-weight:400;
text-transform:uppercase; letter-spacing:.2em; color:var(--ink-2); margin-top:22px;
}
/* DIVISORE + LEGENDA */
#eclat-eco .band{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:26px 0; margin-bottom:clamp(30px,5vw,52px);}
#eclat-eco .band-title{font-family:"Jost",sans-serif; font-size:11px; font-weight:500; text-transform:uppercase; letter-spacing:.28em; color:var(--ink-2); text-align:center; margin-bottom:18px;}
#eclat-eco .legend{display:flex; flex-wrap:wrap; justify-content:center; gap:12px 26px;}
#eclat-eco .legend span{display:inline-flex; align-items:center; gap:9px; font-family:"Jost",sans-serif; font-size:12px; font-weight:400; text-transform:uppercase; letter-spacing:.12em;}
#eclat-eco .sw{width:11px; height:11px; flex:0 0 auto;}
/* SEZIONI */
#eclat-eco .section{margin-bottom:clamp(34px,5vw,54px);}
#eclat-eco .section-head{display:flex; align-items:baseline; gap:16px; border-bottom:1px solid var(--ink); padding-bottom:12px; margin-bottom:22px;}
#eclat-eco .section-head h2{font-family:"Jost",sans-serif; font-weight:500; font-size:clamp(15px,2.4vw,18px); text-transform:uppercase; letter-spacing:.2em;}
#eclat-eco .section-head .tag{margin-left:auto; font-family:"Jost",sans-serif; font-size:11px; font-weight:400; text-transform:uppercase; letter-spacing:.16em; color:var(--ink-2);}
/* CARD */
#eclat-eco .grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
#eclat-eco .card{border:1px solid var(--line); background:var(--paper); padding:22px 20px 20px; display:flex; flex-direction:column; min-height:150px; transition:border-color .2s ease;}
#eclat-eco .card:hover{border-color:var(--line-strong);}
#eclat-eco .card h3{font-family:"Jost",sans-serif; font-weight:500; font-size:13px; text-transform:uppercase; letter-spacing:.12em; margin-bottom:6px;}
#eclat-eco .material{color:var(--ink-2); font-size:14px; line-height:1.5; margin-bottom:auto; padding-bottom:16px;}
#eclat-eco .foot{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; padding-top:14px; border-top:1px solid var(--line);}
#eclat-eco .code{font-family:"Jost",sans-serif; font-size:11.5px; font-weight:500; text-transform:uppercase; letter-spacing:.12em; padding:4px 9px; border:1px solid var(--line-strong); white-space:nowrap;}
#eclat-eco .bin{display:inline-flex; align-items:center; gap:7px; font-family:"Jost",sans-serif; font-size:11.5px; font-weight:400; text-transform:uppercase; letter-spacing:.08em; color:var(--ink);}
/* NOTA + FOOTER */
#eclat-eco .note{border:1px solid var(--line); padding:22px 24px; text-align:center; color:var(--ink-2); font-size:14px; margin-bottom:44px;}
#eclat-eco .note strong{color:var(--ink); font-weight:600;}
#eclat-eco footer{text-align:center; font-family:"Jost",sans-serif; font-size:10.5px; font-weight:400; text-transform:uppercase; letter-spacing:.16em; color:var(--ink-2); line-height:2.1;}
@media (max-width:820px){#eclat-eco .grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){
#eclat-eco .grid{grid-template-columns:1fr;}
#eclat-eco .section-head{flex-wrap:wrap; gap:6px;}
#eclat-eco .section-head .tag{margin-left:0; width:100%;}
}
#eclat-eco .card:focus-visible{outline:2px solid var(--ink); outline-offset:2px;}
</style>
<div class="wrap">
<div class="hero">
<img class="logo" src="https://eclat.de/cdn/shop/files/logo_ddaeb541-ca63-4a2f-b59b-2cc9e943efc4.png?v=1703963209" alt="Éclat">
<h1>Etichetta ambientale</h1>
<p class="lede">Come conferire correttamente ogni parte delle nostre confezioni nella raccolta differenziata.</p>
<p class="legalref">Art. 219, comma 5 — D.Lgs. 152/2006</p>
</div>
<div class="band">
<p class="band-title">Dove si conferisce</p>
<div class="legend">
<span><i class="sw" style="background:var(--carta)"></i>Carta</span>
<span><i class="sw" style="background:var(--plastica)"></i>Plastica</span>
<span><i class="sw" style="background:var(--vetro)"></i>Vetro</span>
<span><i class="sw" style="background:var(--metallo)"></i>Metallo</span>
<span><i class="sw" style="background:var(--resto)"></i>Indifferenziato</span>
</div>
</div>
<!-- PROFUMO -->
<div class="section">
<div class="section-head"><h2>Profumo</h2><span class="tag">Eau de Parfum</span></div>
<div class="grid">
<div class="card"><h3>Flacone</h3><p class="material">Vetro</p><div class="foot"><span class="code">GL 70</span><span class="bin"><i class="sw" style="background:var(--vetro)"></i>Vetro</span></div></div>
<!-- CONFERMARE: composizione del tappo magnetico -->
<div class="card"><h3>Tappo magnetico</h3><p class="material">Plastica con magnete (materiale misto)</p><div class="foot"><span class="code">C misto</span><span class="bin"><i class="sw" style="background:var(--resto)"></i>Indifferenziato</span></div></div>
<div class="card"><h3>Astuccio</h3><p class="material">Cartoncino</p><div class="foot"><span class="code">PAP 21</span><span class="bin"><i class="sw" style="background:var(--carta)"></i>Carta</span></div></div>
<div class="card"><h3>Inlay interno</h3><p class="material">Cartone ondulato</p><div class="foot"><span class="code">PAP 20</span><span class="bin"><i class="sw" style="background:var(--carta)"></i>Carta</span></div></div>
</div>
</div>
<!-- CREMA CORPO -->
<div class="section">
<div class="section-head"><h2>Crema corpo</h2><span class="tag">Body cream</span></div>
<div class="grid">
<!-- CONFERMARE: tipo di plastica del vasetto -->
<div class="card"><h3>Vasetto</h3><p class="material">Plastica</p><div class="foot"><span class="code">05 PP</span><span class="bin"><i class="sw" style="background:var(--plastica)"></i>Plastica</span></div></div>
<div class="card"><h3>Confezione</h3><p class="material">Cartoncino</p><div class="foot"><span class="code">PAP 21</span><span class="bin"><i class="sw" style="background:var(--carta)"></i>Carta</span></div></div>
</div>
</div>
<!-- CANDELA -->
<div class="section">
<div class="section-head"><h2>Candela</h2><span class="tag">Candle</span></div>
<div class="grid">
<div class="card"><h3>Contenitore</h3><p class="material">Vetro</p><div class="foot"><span class="code">GL 70</span><span class="bin"><i class="sw" style="background:var(--vetro)"></i>Vetro</span></div></div>
<div class="card"><h3>Confezione</h3><p class="material">Cartoncino</p><div class="foot"><span class="code">PAP 21</span><span class="bin"><i class="sw" style="background:var(--carta)"></i>Carta</span></div></div>
</div>
</div>
<!-- DIFFUSORE PER AUTO -->
<div class="section">
<div class="section-head"><h2>Diffusore per auto</h2><span class="tag">Supporto</span></div>
<div class="grid">
<div class="card"><h3>Supporto</h3><p class="material">Carta / cartoncino</p><div class="foot"><span class="code">PAP 21</span><span class="bin"><i class="sw" style="background:var(--carta)"></i>Carta</span></div></div>
<div class="card"><h3>Elemento in alluminio</h3><p class="material">Alluminio</p><div class="foot"><span class="code">ALU 41</span><span class="bin"><i class="sw" style="background:var(--metallo)"></i>Metallo</span></div></div>
</div>
</div>
<!-- RICARICA PER AUTO -->
<div class="section">
<div class="section-head"><h2>Ricarica per auto</h2><span class="tag">Refill</span></div>
<div class="grid">
<!-- CONFERMARE: materiale del feltro (di norma poliestere): non e' imballaggio riciclabile -->
<div class="card"><h3>Cartuccia in feltro</h3><p class="material">Feltro imbevuto di fragranza</p><div class="foot"><span class="code">non riciclabile</span><span class="bin"><i class="sw" style="background:var(--resto)"></i>Indifferenziato</span></div></div>
<div class="card"><h3>Confezione</h3><p class="material">Carta / cartoncino</p><div class="foot"><span class="code">PAP 21</span><span class="bin"><i class="sw" style="background:var(--carta)"></i>Carta</span></div></div>
</div>
</div>
<!-- DIFFUSORE D'AMBIENTE -->
<div class="section">
<div class="section-head"><h2>Diffusore d'ambiente</h2><span class="tag">Room diffuser</span></div>
<div class="grid">
<div class="card"><h3>Bottiglia</h3><p class="material">Vetro</p><div class="foot"><span class="code">GL 70</span><span class="bin"><i class="sw" style="background:var(--vetro)"></i>Vetro</span></div></div>
<!-- CONFERMARE: tipo di plastica del tappo -->
<div class="card"><h3>Tappo</h3><p class="material">Plastica</p><div class="foot"><span class="code">05 PP</span><span class="bin"><i class="sw" style="background:var(--plastica)"></i>Plastica</span></div></div>
<div class="card"><h3>Bastoncini in feltro</h3><p class="material">Feltro imbevuto di fragranza</p><div class="foot"><span class="code">non riciclabile</span><span class="bin"><i class="sw" style="background:var(--resto)"></i>Indifferenziato</span></div></div>
</div>
</div>
<p class="note">La raccolta differenziata può variare da Comune a Comune. <strong>Verifica sempre le disposizioni del tuo Comune.</strong></p>
<footer>
<img class="logo-foot" src="https://eclat.de/cdn/shop/files/logo_ddaeb541-ca63-4a2f-b59b-2cc9e943efc4.png?v=1703963209" alt="Éclat">
ÉCLAT GmbH · Soggetto responsabile dell'imballaggio<br>
Etichetta ambientale · D.Lgs. 152/2006 — Decisione 97/129/CE<br>
Ultimo aggiornamento: 07/2026
</footer>
</div>
</div>
