/* No Look Agency, simulateur de prix (10/10/2026). DA du site : noir, Electric Blue, Archivo étendu. */
.simu-grille { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) { .simu-grille { grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.9fr); gap: 2rem; align-items: start; } }
.simu-choix { display: grid; gap: 1.25rem; min-width: 0; }
.simu-bloc { border: 1px solid rgba(255,255,255,0.08); border-radius: 1.5rem; padding: 1.25rem; margin: 0; background: rgba(10,10,10,0.7); min-width: 0; }
@media (min-width: 768px) { .simu-bloc { padding: 1.5rem 1.75rem; } }
.simu-legende { padding: 0 0.4rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase; color: #0047FF; font-weight: 700; }
.simu-legende span { color: #6B7280; letter-spacing: 0.08em; text-transform: none; font-weight: 400; }

.simu-packs { display: grid; gap: 0.75rem; grid-template-columns: minmax(0, 1fr); margin-top: 0.5rem; }
@media (min-width: 640px) { .simu-packs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.simu-pack { position: relative; display: flex; flex-direction: column; gap: 0.25rem; padding: 1rem 1.1rem; border-radius: 1rem; border: 1px solid rgba(255,255,255,0.1); background: #030303; cursor: pointer; transition: border-color .3s var(--ease-no-look, ease), box-shadow .3s var(--ease-no-look, ease), background .3s var(--ease-no-look, ease); }
.simu-pack input { position: absolute; opacity: 0; pointer-events: none; }
.simu-pack:hover { border-color: rgba(0,71,255,0.45); }
.simu-pack.is-on { border-color: #0047FF; background: rgba(0,71,255,0.1); box-shadow: 0 0 30px -8px rgba(0,71,255,0.6); }
.simu-pack:has(input:focus-visible) { outline: 2px solid #60A5FA; outline-offset: 2px; }
.simu-pack-nom { font-family: 'Archivo', 'Inter', sans-serif; font-stretch: 125%; font-weight: 900; font-style: italic; text-transform: uppercase; font-size: 1rem; line-height: 1.1; color: #fff; }
.simu-pack-prix { font-weight: 900; font-style: italic; font-size: 1.5rem; color: #fff; }
.simu-pack.is-on .simu-pack-prix { color: #fff; text-shadow: 0 0 18px rgba(0,71,255,0.8); }
.simu-pack-acompte { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: #9CA3AF; }
.simu-pack-contenu { font-size: 0.8125rem; line-height: 1.5; color: #9CA3AF; font-weight: 300; margin-top: 0.25rem; }

.simu-options { display: grid; gap: 0.5rem; margin-top: 0.5rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .simu-options { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.simu-opt { display: flex; align-items: center; gap: 0.75rem; padding: 0.7rem 0.9rem; border-radius: 0.85rem; border: 1px solid rgba(255,255,255,0.08); background: rgba(255,255,255,0.02); cursor: pointer; min-height: 48px; transition: border-color .25s, background .25s; }
.simu-opt:hover { border-color: rgba(0,71,255,0.4); }
.simu-opt input[type=checkbox] { appearance: none; -webkit-appearance: none; flex: 0 0 20px; width: 20px; height: 20px; border-radius: 6px; border: 2px solid rgba(255,255,255,0.3); background: #030303; display: grid; place-content: center; margin: 0; cursor: pointer; }
.simu-opt input[type=checkbox]::after { content: ''; width: 10px; height: 6px; border-left: 2.5px solid #fff; border-bottom: 2.5px solid #fff; transform: rotate(-45deg) translate(1px, -1px); opacity: 0; }
.simu-opt input[type=checkbox]:checked { background: #0047FF; border-color: #0047FF; box-shadow: 0 0 12px rgba(0,71,255,0.6); }
.simu-opt input[type=checkbox]:checked::after { opacity: 1; }
.simu-opt input[type=checkbox]:focus-visible { outline: 2px solid #60A5FA; outline-offset: 2px; }
.simu-opt-nom { flex: 1; min-width: 0; font-size: 0.875rem; color: #E5E7EB; line-height: 1.35; }
.simu-opt-nom small { display: block; font-size: 0.75rem; color: #9CA3AF; margin-top: 0.15rem; }
.simu-opt-prix { font-size: 0.8125rem; font-weight: 800; color: #fff; white-space: nowrap; }
.simu-opt.is-inclus { cursor: default; border-color: rgba(0,71,255,0.25); background: rgba(0,71,255,0.06); }
.simu-opt.is-inclus input[type=checkbox] { opacity: 0.55; cursor: default; }
.simu-opt.is-inclus .simu-opt-prix { color: #60A5FA; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; }
.simu-opt-qte { cursor: default; }
.simu-qte { display: inline-flex; align-items: center; gap: 0.35rem; }
.simu-qte button { width: 36px; height: 36px; border-radius: 9999px; border: 1px solid rgba(255,255,255,0.18); background: #030303; color: #fff; font-weight: 900; font-size: 1.1rem; line-height: 1; cursor: pointer; transition: border-color .2s, background .2s; }
.simu-qte button:hover, .simu-qte button:focus-visible { border-color: #0047FF; background: rgba(0,71,255,0.15); }
.simu-qte output { min-width: 1.6rem; text-align: center; font-weight: 900; color: #fff; }

.simu-recap { position: relative; border: 1px solid rgba(0,71,255,0.4); border-radius: 1.5rem; padding: 1.5rem; background: linear-gradient(160deg, rgba(0,71,255,0.12), rgba(10,10,10,0.95) 45%); box-shadow: 0 0 50px -15px rgba(0,71,255,0.45); min-width: 0; }
@media (min-width: 1024px) { .simu-recap { position: sticky; top: 6.5rem; padding: 1.75rem; } }
.simu-ligne { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.875rem; color: #D1D5DB; padding: 0.4rem 0; }
.simu-ligne span:last-child { white-space: nowrap; color: #fff; font-weight: 700; }
[data-lignes] .simu-ligne { border-bottom: 1px solid rgba(255,255,255,0.06); }
.simu-total { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin: 1rem 0 0.5rem; }
.simu-total span { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: #9CA3AF; }
.simu-total strong { font-family: 'Archivo', 'Inter', sans-serif; font-stretch: 125%; font-weight: 900; font-style: italic; font-size: clamp(1.9rem, 4vw, 2.6rem); line-height: 1; color: #fff; text-shadow: 0 0 24px rgba(0,71,255,0.6); white-space: nowrap; }
.simu-fort span:first-child { color: #fff; font-weight: 700; }
.simu-mieux { margin-top: 1rem; padding: 0.85rem 1rem; border-radius: 1rem; border: 1px solid rgba(0,71,255,0.45); background: rgba(0,71,255,0.1); font-size: 0.8125rem; line-height: 1.5; color: #E5E7EB; }
.simu-mieux strong { color: #fff; }
.simu-mieux button { display: inline-block; margin-top: 0.5rem; border: 0; background: none; padding: 0; color: #60A5FA; font-weight: 900; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.simu-note { margin-top: 1rem; font-size: 0.75rem; line-height: 1.6; color: #9CA3AF; }
.simu-cta { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.25rem; }
.simu-btn { flex: 1 1 10rem; display: inline-flex; align-items: center; justify-content: center; text-align: center; padding: 0.95rem 1.25rem; border-radius: 9999px; font-weight: 900; font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; border: 1px solid rgba(255,255,255,0.2); color: #fff; transition: border-color .3s, background .3s, transform .3s var(--ease-no-look, ease); }
.simu-btn:hover { border-color: #0047FF; background: rgba(255,255,255,0.04); }
.simu-btn-plein { background: #0047FF; border-color: rgba(96,165,250,0.5); box-shadow: 0 0 25px rgba(0,71,255,0.5); }
.simu-btn-plein:hover { background: #0047FF; transform: scale(1.03); }
@media (prefers-reduced-motion: reduce) { .simu-btn-plein:hover { transform: none; } }