/* simulation-page-specific styles */

/* HERO */
.sim-hero{padding:130px 48px 0;text-align:center;background:var(--black);}
.sim-badge{display:inline-block;font-size:0.6rem;font-weight:600;letter-spacing:0.32em;text-transform:uppercase;color:var(--gold-dark);border:1px solid var(--gold-border);padding:7px 18px;margin-bottom:24px;}
.sim-title{font-family:var(--serif);font-size:clamp(2.2rem,4vw,3.2rem);font-weight:400;color:var(--white);line-height:1.15;margin-bottom:14px;}
.sim-title em{font-style:italic;color:var(--gold);}
.sim-sub{font-size:0.92rem;color:var(--gray-2);max-width:500px;margin:0 auto;line-height:1.9;}

/* MAIN LAYOUT */
.sim-wrap{max-width:1120px;margin:0 auto;padding:56px 48px;display:grid;grid-template-columns:1fr 300px;gap:48px;align-items:start;}

/* CAMERA BOX */
.cam-box{position:relative;background:#111;border:1px solid var(--gold-border);overflow:hidden;aspect-ratio:16/9;}
.cam-box video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;z-index:1;}
.cam-box canvas#output{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:5;}
.cam-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:10;background:rgba(10,10,10,0.85);transition:opacity var(--tr);}
.cam-overlay.hidden{opacity:0;pointer-events:none;}
.cam-icon{font-size:3rem;color:var(--gold);opacity:0.5;}
.cam-msg{font-size:0.78rem;letter-spacing:0.1em;color:rgba(250,248,245,0.6);text-align:center;max-width:240px;line-height:1.7;}
.btn-cam{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:#0d0a08;font-size:0.68rem;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;padding:14px 28px;cursor:pointer;border:none;font-family:var(--sans);transition:background var(--tr);}
.btn-cam:hover{background:var(--gold-light);}
.cam-loading{position:absolute;inset:0;background:rgba(10,10,10,0.75);display:none;align-items:center;justify-content:center;flex-direction:column;gap:16px;z-index:20;}
.cam-loading.show{display:flex;}
.spinner{width:36px;height:36px;border:2px solid rgba(201,168,76,0.3);border-top-color:var(--gold);border-radius:50%;animation:spin 0.8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.cam-loading-txt{font-size:0.65rem;letter-spacing:0.18em;text-transform:uppercase;color:rgba(250,248,245,0.5);}

/* CONTROLS */
.cam-actions{display:flex;gap:10px;margin-top:14px;}
.btn-capture{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;background:var(--gold);color:#0d0a08;font-size:0.65rem;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;padding:13px;cursor:pointer;border:none;font-family:var(--sans);transition:background var(--tr);}
.btn-capture:hover{background:var(--gold-light);}
.btn-capture:disabled{opacity:0.35;cursor:not-allowed;}
.btn-stop{display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--gold-border);color:var(--gray-2);font-size:0.65rem;font-weight:500;letter-spacing:0.15em;text-transform:uppercase;padding:13px 18px;cursor:pointer;font-family:var(--sans);transition:all var(--tr);}
.btn-stop:hover{border-color:var(--gold);color:var(--gold);}

/* PANEL */
.sim-panel{display:flex;flex-direction:column;gap:28px;}
.panel-label{font-size:0.58rem;font-weight:600;letter-spacing:0.3em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:14px;display:block;}
input[type=range]{width:100%;-webkit-appearance:none;height:2px;background:var(--gold-border);outline:none;border-radius:2px;margin:8px 0;}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--gold);cursor:pointer;}
.opacity-row{display:flex;align-items:center;gap:10px;}
.opacity-row span{font-size:0.68rem;color:var(--gray-2);white-space:nowrap;}
.opacity-val{font-size:0.72rem;color:var(--gold-dark);font-weight:500;min-width:32px;text-align:right;}

/* COLOR GRID */
.color-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.color-swatch{cursor:pointer;border:2px solid transparent;transition:border-color var(--tr),transform var(--tr);border-radius:4px;padding:5px;}
.color-swatch:hover{transform:scale(1.08);}
.color-swatch:hover .swatch-eye{border-color:var(--gold);box-shadow:0 0 18px rgba(201,168,76,0.22);}
.color-swatch.active{border-color:var(--gold);}
.swatch-eye{width:100%;aspect-ratio:1;border-radius:50%;border:2.5px solid var(--dark-3);box-shadow:inset 0 0 0 2px rgba(0,0,0,0.55),0 2px 12px rgba(0,0,0,0.18);position:relative;overflow:hidden;transition:all var(--tr);}
.swatch-eye::after{content:'';position:absolute;inset:0;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(0,0,0,0.95) 0%,rgba(0,0,0,0.90) 17%,rgba(0,0,0,0.0) 20%),repeating-conic-gradient(rgba(0,0,0,0.0) 0deg 1.5deg,rgba(0,0,0,0.20) 1.5deg 2.8deg,rgba(0,0,0,0.0) 2.8deg 9deg),radial-gradient(circle,transparent 42%,var(--iris-dark) 62%,var(--iris-dark) 70%,transparent 72%);}
.swatch-name{font-size:0.5rem;letter-spacing:0.06em;text-align:center;color:var(--gray-3);margin-top:4px;line-height:1.3;}

/* TIPS */
.tips{background:var(--gold-pale-dark);border:1px solid var(--gold-border);border-left:2px solid var(--gold);padding:16px 18px;}
.tips p{font-size:0.78rem;color:var(--gray-2);line-height:1.8;}
.tips strong{color:var(--gold-dark);font-weight:500;}

/* CTA */
.sim-cta{background:var(--dark-1);border-top:1px solid var(--gold-line);border-bottom:1px solid var(--gold-line);padding:72px 48px;text-align:center;}
.sim-cta .section-label{display:inline-flex;align-items:center;gap:10px;font-size:0.6rem;font-weight:600;letter-spacing:0.32em;text-transform:uppercase;color:var(--gold-dark);border:1px solid var(--gold-border);padding:6px 18px;margin-bottom:24px;}
.sim-cta .section-label::before,.sim-cta .section-label::after{content:'◈';font-size:0.5rem;}
.sim-cta h2{font-family:var(--serif);font-size:clamp(1.8rem,3vw,2.4rem);font-weight:400;color:var(--white);margin-bottom:12px;}
.sim-cta p{font-size:0.9rem;color:var(--gray-2);max-width:460px;margin:0 auto 32px;line-height:1.9;}
.btn-rdv{display:inline-flex;align-items:center;gap:10px;background:var(--gold);color:#0d0a08;font-size:0.7rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;padding:18px 46px;transition:background var(--tr);}
.btn-rdv:hover{background:var(--gold-light);}
.btn-wa{display:inline-flex;align-items:center;gap:10px;border:1.5px solid var(--gold-border);color:var(--gold-dark);font-size:0.7rem;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;padding:16px 36px;transition:all var(--tr);margin-left:16px;}
.btn-wa:hover{background:rgba(125,88,16,0.08);border-color:var(--gold-dark);transform:translateY(-2px);}

/* RESPONSIVE */
@media(max-width:900px){
  .sim-hero{padding:100px 20px 40px;}
  .sim-wrap{grid-template-columns:1fr;padding:32px 20px;}
  .color-grid{grid-template-columns:repeat(6,1fr);}
  .sim-cta{padding:56px 24px;}
  .btn-rdv,.btn-wa{display:flex;justify-content:center;width:100%;box-sizing:border-box;padding-left:20px;padding-right:20px;margin-left:0;}
  .btn-wa{margin-top:12px;}
}
@media(max-width:480px){.color-grid{grid-template-columns:repeat(4,1fr);}}
.cam-icon-err { color: #e74c3c; }