*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:#0f0f0f;color:#f0f0f0;line-height:1.5;min-height:100vh}
.welcome-banner{background:#14110e;padding:28px 20px 8px;text-align:center}
.logo{display:block;margin:0 auto;width:min(560px,92vw);height:auto;border-radius:10px;box-shadow:0 10px 28px rgba(0,0,0,.55);border:1px solid #3a2a1a}
header{text-align:center;padding:12px 20px 28px;border-bottom:1px solid #222}
.location{color:#666;font-size:.85rem;margin-bottom:16px}
.nav a{color:#ccc;text-decoration:none;margin:0 12px;font-size:.95rem;border-bottom:1px solid #444;padding-bottom:2px}
.langs{position:fixed;top:12px;right:14px;z-index:60;margin:0;background:rgba(15,15,15,.82);padding:6px 8px;border-radius:8px;border:1px solid #2a2a2a}
.langs button{background:#1a1a1a;color:#aaa;border:1px solid #333;border-radius:6px;padding:4px 9px;margin:0 2px;cursor:pointer;font-size:.78rem}
.langs button.on{background:#fff;color:#111;border-color:#fff}
.container{max-width:980px;margin:0 auto;padding:40px 20px 60px}
.products{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.card{background:#161616;border:1px solid #2a2a2a;border-radius:12px;padding:0 0 20px;display:flex;flex-direction:column;overflow:hidden}
.card .thumb{background:#0f0f0f;height:170px;display:flex;align-items:center;justify-content:center;padding:12px}
.card .thumb img{max-width:100%;max-height:146px;object-fit:contain}
.card-body{padding:18px 20px 0;display:flex;flex-direction:column;flex-grow:1}
.card h2{font-size:1.08rem;margin-bottom:8px}
.card p{color:#999;font-size:.9rem;flex-grow:1;margin-bottom:16px}
.price{font-size:1.25rem;font-weight:600;margin-bottom:14px}
.btn{display:inline-block;background:#fff;color:#111;text-decoration:none;text-align:center;padding:12px 18px;border-radius:8px;font-weight:600;border:0;cursor:pointer;font-size:1rem;width:100%}
.btn.secondary{background:transparent;border:1px solid #444;color:#ccc}
.note{margin-top:40px;text-align:center;color:#666;font-size:.85rem}
footer{text-align:center;padding:30px 20px;border-top:1px solid #222}
footer a{color:#888;text-decoration:none;margin:0 10px}
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:40;align-items:center;justify-content:center;padding:20px}
.overlay.open{display:flex}
.modal{background:#161616;border:1px solid #333;border-radius:14px;max-width:460px;width:100%;padding:24px;max-height:92vh;overflow:auto}
.modal h3{margin-bottom:6px;font-size:1.15rem}
.modal .sub{color:#888;font-size:.88rem;margin-bottom:18px}
label{display:block;font-size:.85rem;color:#bbb;margin:12px 0 6px}
select,textarea,input[type=text]{width:100%;background:#111;color:#f0f0f0;border:1px solid #333;border-radius:8px;padding:10px 12px;font:inherit}
textarea{min-height:90px;resize:vertical}
.row{display:flex;gap:10px;margin-top:18px}
.row .btn{width:auto;flex:1}
.hint{color:#666;font-size:.8rem;margin-top:8px}
.preview-wrap{margin-top:14px;background:#1a1510;border:1px dashed #3a3228;border-radius:10px;padding:12px}
.preview-label{font-size:.72rem;color:#8a8074;letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px}
.preview-board{position:relative;background-color:#c4a07a;background-image:url("https://pub-4bf7dcdcddf74de88d568e3746f0fba4.r2.dev/png/brut_vide.png");background-repeat:no-repeat;background-size:420% auto;background-position:46% 38%;color:#2a1810;text-shadow:0 1px 0 rgba(255,240,220,.18);min-height:110px;padding:16px 14px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;word-break:break-word;filter:sepia(.18) saturate(.85) brightness(.92) contrast(1.08)}
.preview-board::before{content:"";position:absolute;inset:0;background:none;z-index:0;pointer-events:none}
.preview-board.brut-wood{filter:none;background-size:400% auto;background-position:46% 38%}
.preview-board span{position:relative;z-index:1;display:block;width:100%;line-height:1.02}
.preview-board.s-rectangle{clip-path:inset(0);border-radius:3px;min-height:118px}
.preview-board.s-fleche-droite{clip-path:polygon(0% 0%, 88% 0%, 100% 50%, 88% 100%, 0% 100%);border-radius:0;min-height:92px;padding:12px 44px 12px 12px}
.preview-board.s-fleche-gauche{clip-path:polygon(12% 0%, 100% 0%, 100% 100%, 12% 100%, 0% 50%);border-radius:0;min-height:92px;padding:12px 12px 12px 44px}
.preview-board.s-double-fleche{clip-path:polygon(12% 0%, 88% 0%, 100% 50%, 88% 100%, 12% 100%, 0% 50%);border-radius:0;min-height:92px;padding:12px 48px}
.preview-board.s-trapeze{clip-path:polygon(18% 0%, 82% 0%, 100% 100%, 0% 100%);border-radius:0;min-height:110px;padding:20px 24px 14px}
.preview-board.s-trapeze-inverse{clip-path:polygon(0% 0%, 100% 0%, 82% 100%, 18% 100%);border-radius:0;min-height:110px;padding:14px 24px 20px}
.preview-board.s-autre{clip-path:inset(0);border-radius:4px;opacity:.85}
.preview-board.t-petit span{font-size:2.85rem}
.preview-board.t-moyen span{font-size:4rem}
.preview-board.t-grand span{font-size:7.2rem}
.preview-note{margin-top:8px;color:#9a8f82;font-size:.78rem;line-height:1.4}
.f-FreeSerif{font-family:"Times New Roman","Liberation Serif",Georgia,serif}
.f-FreeSans{font-family:"Liberation Sans",Arial,Helvetica,sans-serif}
.f-Karumbi{font-family:Karumbi,cursive}
.f-Oswald{font-family:Oswald,sans-serif;letter-spacing:.02em;text-transform:uppercase}
.f-Cinzel{font-family:Cinzel,serif}
.f-DancingScript{font-family:"Dancing Script",cursive}
.f-Lobster{font-family:Lobster,cursive}
.f-Pacifico{font-family:Pacifico,cursive}
.f-BebasNeue{font-family:"Bebas Neue",sans-serif;letter-spacing:.04em;text-transform:uppercase}
.f-AlfaSlabOne{font-family:"Alfa Slab One",serif}
.f-LuckiestGuy{font-family:"Luckiest Guy",cursive}
.f-PermanentMarker{font-family:"Permanent Marker",cursive}
.f-AbrilFatface{font-family:"Abril Fatface",serif}
.f-BlackOpsOne{font-family:"Black Ops One",sans-serif}
.f-GreatVibes{font-family:"Great Vibes",cursive}
.f-Righteous{font-family:Righteous,sans-serif}
