/* Cells v3 — full-bleed viewers, floating chrome, tablet-friendly proportions. */

/* 1. The model fills the whole cell; titles and controls float over it. */
.cell .viewer,#cellA .viewer,#cellC .viewer,#cellD .viewer,.cellExpanded .viewer{inset:0!important;height:auto!important}
#intelligence #cellD .architecture,.twinDemo .architecture,#demonstration .architecture{inset:0!important}
.architecture #scene{top:0!important;height:100%!important}

/* Legibility without hiding the model: soft scrims only where text sits. */
.cellOverlay{background:linear-gradient(180deg,#0b0d0ed9 0,#0b0d0e66 15%,#0b0d0e00 34%,#0b0d0e00 62%,#0b0d0e66 85%,#0b0d0ed9 100%)}
.cell:before{content:'';position:absolute;inset:auto 0 0;height:150px;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0b0d0e00,#0b0d0ed9)}
.cell:after{content:'';position:absolute;inset:0 0 auto;height:150px;z-index:1;pointer-events:none;background:linear-gradient(180deg,#0b0d0ed9,#0b0d0e00)}
#cellD{background:#111416}
/* The architectural viewer brings its own dark backdrop and controls. */
#cellD:before,#cellD:after{display:none}
#intelligence #cellD .architecture{z-index:2}

/* 2. Floating chrome: no solid strip at the bottom of the cell. */
.qualityNotice{border-top:0!important;padding-top:0!important;z-index:6;text-shadow:0 1px 6px #000}
.viewerNote,.cellInfo,.heightLegend{text-shadow:0 1px 6px #000}
.legend button,.cloudColors button{background:#12151ab3;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.legend button.active,.cloudColors button.active{background:var(--orange)}
.cloudColors{background:none}
.architecture .floor-toggle,.architecture .explode,.architecture .icon{backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
/* Keep the architecture controls clear of the quality notice line. */
#intelligence #cellD .architecture .controls,#intelligence #cellD .architecture .market-controls,
#demonstration .architecture .controls,#demonstration .architecture .market-controls{bottom:58px!important}
@media(max-width:720px){
 #intelligence #cellD .architecture .controls,#intelligence #cellD .architecture .market-controls,
 #demonstration .architecture .controls,#demonstration .architecture .market-controls{bottom:76px!important}
 #cellD .qualityNotice,#demonstration .qualityNotice{font-size:9px;line-height:1.5}
}

/* 3. An unmistakable full-screen control, top right of every viewer. */
.expandBtn{width:auto;min-width:50px;height:50px;padding:0 14px;border-radius:999px;gap:9px;grid-auto-flow:column;align-items:center;border:1.5px solid #ffffff6b;background:#10131699;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 8px 22px #0007;font:600 12px/1 Manrope,Arial;letter-spacing:.02em}
.expandBtn:after{content:'Plein écran';white-space:nowrap}
.cellExpanded .expandBtn:after{content:'Réduire'}
.expandBtn svg{width:21px;height:21px;stroke-width:2.1}
.expandBtn:hover,.expandBtn:focus-visible{background:var(--orange);border-color:var(--orange)}
.viewerReset{top:78px;width:50px;height:50px;border:1.5px solid #ffffff5c;background:#10131699;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 8px 22px #0007;font-size:22px}
.architecture .utilities{top:78px}
.architecture .icon{width:46px;height:46px;border-color:#ffffff5c;background:#10131699}
@media(max-width:560px){.expandBtn:after{display:none}.expandBtn{min-width:46px;height:46px;padding:0}.viewerReset{width:46px;height:46px;top:72px}}

/* 4. Tablets: one column, proportions that keep the whole model in frame. */
@media(min-width:721px) and (max-width:1399px){
 #intelligence .cells{grid-template-columns:1fr;gap:18px}
 #intelligence .cells .cell,
 #intelligence .cells:has(#cellD) #cellC,
 #intelligence .cells #cellD{grid-column:1/-1!important;height:clamp(520px,66vh,780px)!important}
 .wrap{width:min(1320px,calc(100% - clamp(56px,8vw,120px)))}
 .cellInfo{right:190px}
 .cell.cellExpanded{width:calc(100vw - 40px);height:calc(100vh - 40px)}
}
@media(max-width:720px){
 #intelligence .cells .cell,#cellC,#cellD{height:clamp(440px,62vh,640px)!important}
 .cellInfo{right:86px}
 .cell:before{height:150px}
}

/* Agrandissement : occuper réellement tout l'écran, au format de l'appareil.
   La cellule agrandie est déplacée hors de #intelligence : chaque règle est donc
   déclarée deux fois, avec et sans cet ancêtre. */
#intelligence .cell.cellExpanded,.cell.cellExpanded{position:fixed!important;inset:0!important;width:auto!important;height:auto!important;max-width:none!important;max-height:none!important;min-height:0!important;transform:none!important;margin:0!important;border-radius:0!important;border:0!important}
#cellA.cellExpanded,#cellB.cellExpanded,#cellC.cellExpanded,#cellD.cellExpanded{position:fixed!important;inset:0!important;width:auto!important;height:auto!important;max-width:none!important;max-height:none!important;min-height:0!important;transform:none!important;margin:0!important;border-radius:0!important;border:0!important}
#intelligence .cell.cellExpanded .cellInfo,.cell.cellExpanded .cellInfo{top:16px;left:18px;right:150px}
#intelligence .cell.cellExpanded .qualityNotice,.cell.cellExpanded .qualityNotice{display:none}
#intelligence .cell.cellExpanded .viewer,.cell.cellExpanded .viewer{inset:0!important}
#intelligence .cell .viewer,.cell .viewer{inset:0!important}

@media(max-width:720px){
 /* Le texte descriptif masquerait le modèle : il est retiré sur petit écran. */
 #intelligence #cellA .viewerNote,#cellA .viewerNote,
 #intelligence #cellC .viewerNote,#cellC .viewerNote,
 #intelligence #cellB .viewerNote,#cellB .viewerNote{display:none}

 #intelligence .cell .legend,.cell .legend{left:16px;right:16px;bottom:70px;max-width:none;gap:6px;flex-wrap:nowrap;justify-content:flex-end}
 #intelligence .cell .cloudColors,.cell .cloudColors{left:16px;right:16px;bottom:120px;justify-content:flex-end;gap:5px;font-size:11px}
 #intelligence .cell .qualityNotice,.cell .qualityNotice{left:16px;right:16px;bottom:12px}

 #intelligence .cell.cellExpanded .cellInfo h3,.cell.cellExpanded .cellInfo h3{font-size:20px}
 #intelligence .cell.cellExpanded .cellInfo p,.cell.cellExpanded .cellInfo p{display:none}
}
