.ob-pose3d{margin:36px 0;padding:28px;border:1px solid #e3e3e0;border-radius:16px;background:#fafaf8;scroll-margin-top:100px;color:#111}.ob-pose3d-intro{max-width:620px}.ob-pose3d-kicker{font-size:11px!important;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#b81d22!important;margin:0 0 8px!important}.ob-pose3d h3{font-size:27px!important;letter-spacing:-.035em;line-height:1.2!important;margin:0 0 12px!important}.ob-pose3d-intro>p:last-child{font-size:15px;line-height:1.55;color:#555}.ob-pose3d-choices{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 14px}.ob-pose3d-choices button{border:1px solid #d6d6d2;border-radius:8px;padding:10px 17px;background:#fff;color:#333;font-family:inherit;font-weight:600;font-size:13px;cursor:pointer}.ob-pose3d-choices button[aria-pressed=true]{background:#111;border-color:#111;color:#fff}.ob-pose3d button:focus-visible{outline:3px solid #d81f26;outline-offset:3px}.ob-pose3d-stage{position:relative;height:470px;background:#fff;border:1px solid #e9e9e5;border-radius:12px;overflow:hidden}.ob-pose3d-poster{display:block;width:100%!important;height:100%!important;object-fit:contain;margin:0!important}.ob-pose3d-launch{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);border:0;background:#111;color:#fff;padding:14px 22px;border-radius:8px;box-shadow:0 5px 20px #0002;font-family:inherit;font-weight:700;font-size:14px;white-space:nowrap;cursor:pointer}.ob-pose3d-launch span{font-size:21px;margin-right:8px}.ob-pose3d-stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff}.ob-pose3d.is-active .ob-pose3d-launch{display:none}.ob-pose3d-note{font-size:12px!important;color:#666!important;line-height:1.5;margin:12px 0 0!important}.cs-pose-3d-link{font:inherit;color:#b91c22;background:transparent;border:0;text-decoration:underline;cursor:pointer}@media(max-width:600px){.ob-pose3d{padding:17px;margin:24px 0;border-radius:12px}.ob-pose3d h3{font-size:23px!important}.ob-pose3d-choices{display:grid;grid-template-columns:1fr 1fr;gap:6px}.ob-pose3d-choices button{padding:10px 6px}.ob-pose3d-stage{height:380px}.ob-pose3d-launch{bottom:16px}}
.ob-pose3d-teaser{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:24px;background:#f7f7f4;border:1px solid #e5e5e0;border-radius:16px;padding:26px;margin:30px 0}.ob-pose3d-teaser h3{font-size:28px!important;letter-spacing:-.035em;line-height:1.18!important;margin:0 0 15px!important}.ob-pose3d-teaser-body>p:not(.ob-pose3d-kicker){font-size:15px;color:#555;line-height:1.6}.ob-pose3d-teaser img{display:block;width:100%;height:340px;object-fit:contain;mix-blend-mode:multiply}.ob-pose3d-teaser button{background:#111;border:0;border-radius:8px;color:white;font:700 14px Arial,sans-serif;padding:14px 18px;margin-top:10px;cursor:pointer}.ob-pose3d-teaser button span{margin-left:14px}.ob-pose3d-teaser button:focus-visible{outline:3px solid #d81f26;outline-offset:3px}@media(max-width:650px){.ob-pose3d-teaser{grid-template-columns:1fr;padding:20px;gap:5px}.ob-pose3d-teaser h3{font-size:25px!important}.ob-pose3d-teaser img{height:260px}}
:is(#pvc-description-produit,#alu-description-produit,#porte-entree-description) .ob-pose3d-teaser button,:is(#pvc-description-produit,#alu-description-produit,#porte-entree-description) .ob-pose3d-launch,:is(#pvc-description-produit,#alu-description-produit,#porte-entree-description) .ob-pose3d-choices button[aria-pressed=true]{color:#fff;background:#111}
:is(#pvc-description-produit,#alu-description-produit,#porte-entree-description) .ob-pose3d-teaser img,:is(#pvc-description-produit,#alu-description-produit,#porte-entree-description) .ob-pose3d-poster{object-fit:contain}

/* Une même structure de carte, quelle que soit la longueur du descriptif. */
#pvc-parcours .cs-pose-directe .cs-card-pose3d{display:flex;flex-direction:column;border-width:1px}
#pvc-parcours .cs-pose-directe .cs-card-pose3d.is-selected{box-shadow:inset 0 0 0 1px #d81f26}
#pvc-parcours .cs-pose-directe .cs-card-pose3d>.cs-choice{flex:1;height:auto;padding:7px}
#pvc-parcours .cs-pose-directe .cs-card-pose3d .cs-picture{height:125px;flex:0 0 125px}
#pvc-parcours .cs-pose-directe .cs-card-pose3d .cs-picture img{display:block;width:100%;height:100%;object-fit:contain}
#pvc-parcours .cs-pose-directe .cs-card-pose3d>.cs-zoom{flex-shrink:0;margin-top:auto;min-height:36px}
@media(max-width:650px){
  #pvc-parcours .cs-pose-directe .cs-card-pose3d .cs-picture{height:110px;flex-basis:110px}
  #pvc-parcours .cs-pose-directe .cs-card-pose3d>.cs-zoom{min-height:44px}
}

/* Le premier clic ouvre uniquement l’image, la 3D reste un choix explicite. */
:is(#onlybaie-perspective,body) dialog.ob-pose-image{box-sizing:border-box;width:min(1120px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:20px;border:0;border-radius:0;background:#fff;color:#111;box-shadow:none;font-family:inherit;overflow:auto}
:is(#onlybaie-perspective,body) dialog.ob-pose-image::backdrop{background:#111a;backdrop-filter:blur(3px)}
:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
:is(#onlybaie-perspective,body) dialog.ob-pose-image h2{margin:0;font-size:22px;line-height:1.3;color:#111}
:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-close{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid #ddd;border-radius:0;background:#fff;color:#111;font:28px/1 Arial,sans-serif;cursor:pointer}

:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #eee;padding-top:16px}
:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-footer p{margin:0;max-width:340px;color:#555;font-size:14px;line-height:1.5}
:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-explore{flex-shrink:0;border:0;border-radius:0;background:#111;color:#fff;padding:14px 18px;font-family:inherit;font-size:14px;font-weight:700;line-height:1.4;cursor:pointer}
:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-explore span{margin-left:8px}
:is(#onlybaie-perspective,body) dialog.ob-pose-image button:focus-visible{outline:3px solid #d81f26;outline-offset:3px}
@media(max-width:650px){:is(#onlybaie-perspective,body) dialog.ob-pose-image{padding:16px}:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-footer{flex-direction:column;align-items:stretch;gap:12px}}

.ob-pose3d-experience{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr);gap:24px;align-items:start}
.ob-pose3d-experience .ob-pose3d-stage{height:520px}
:is(#onlybaie-perspective,body) .ob-pose-explanation{min-width:0;color:#333;font-size:14px;line-height:1.5;text-align:left}
:is(#onlybaie-perspective,body) .ob-pose-explanation :is(h3,h4){margin:0 0 10px;font-size:20px;line-height:1.3;color:#111;letter-spacing:-.025em}
:is(#onlybaie-perspective,body) .ob-pose-explanation p{margin:0;font-size:14px;line-height:1.5;color:#555}
:is(#onlybaie-perspective,body) .ob-pose-explanation .ob-pose-explanation-intro{margin-bottom:20px;color:#333}
:is(#onlybaie-perspective,body) .ob-pose-explanation ol{margin:0;padding:0;list-style:none;counter-reset:pose-step}
:is(#onlybaie-perspective,body) .ob-pose-explanation li{position:relative;margin:0 0 17px;padding:0 0 0 38px;counter-increment:pose-step}
:is(#onlybaie-perspective,body) .ob-pose-explanation li::before{content:counter(pose-step);position:absolute;top:0;left:0;display:grid;place-items:center;width:26px;height:26px;border:1px solid #e7d6d5;border-radius:50%;background:#fff;color:#b81d22;font-size:12px;font-weight:800}
:is(#onlybaie-perspective,body) .ob-pose-explanation li strong{display:block;margin-bottom:4px;color:#111;font-size:14px;line-height:1.4}
:is(#onlybaie-perspective,body) .ob-pose-explanation details{margin:18px 0 14px;padding:14px 0;border-top:1px solid #deded9;border-bottom:1px solid #deded9}
:is(#onlybaie-perspective,body) .ob-pose-explanation summary{font-size:13px;font-weight:700;line-height:1.5;cursor:pointer;color:#333}
:is(#onlybaie-perspective,body) .ob-pose-explanation dl{margin:14px 0}
:is(#onlybaie-perspective,body) .ob-pose-explanation dl>div{margin:0 0 9px}
:is(#onlybaie-perspective,body) .ob-pose-explanation dt{font-weight:700;color:#333}
:is(#onlybaie-perspective,body) .ob-pose-explanation dd{margin:0;font-size:13px;color:#555}
:is(#onlybaie-perspective,body) .ob-pose-explanation .ob-pose-guide{color:#b81d22;font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
:is(#onlybaie-perspective,body) dialog.ob-pose-image[open]{display:flex;flex-direction:column;gap:16px}
:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-head,
:is(#onlybaie-perspective,body) dialog.ob-pose-image .ob-pose-image-footer{flex-shrink:0}
:is(#onlybaie-perspective,body) .ob-pose-image-body{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:28px;min-height:0;overflow-y:auto;overscroll-behavior:contain}
:is(#onlybaie-perspective,body) .ob-pose-image-body>img{display:block;position:sticky;top:0;align-self:start;width:100%;height:min(58dvh,560px);max-height:none;object-fit:contain;margin:0}
@media(max-width:900px){
 .ob-pose3d-experience{grid-template-columns:minmax(0,1fr);gap:24px}
 .ob-pose3d-experience .ob-pose3d-stage{height:420px}
 :is(#onlybaie-perspective,body) .ob-pose-image-body{grid-template-columns:minmax(0,1fr);gap:20px}
 :is(#onlybaie-perspective,body) .ob-pose-image-body>img{position:static;height:min(44dvh,400px)}
}
@media(max-width:600px){.ob-pose3d-experience .ob-pose3d-stage{height:360px}}

/* Les cartes ALU et portes gardent le même pied d’agrandissement que le PVC. */
#alu-parcours .oa-choice-pose3d{border-width:1px}
#alu-parcours .oa-choice-pose3d.selected{box-shadow:inset 0 0 0 1px #d81f26}
#alu-parcours .oa-choice-pose3d .oa-card{padding:9px}
#alu-parcours .oa-choice-pose3d .oa-picture{height:125px;flex:0 0 125px;background:#fff}
#alu-parcours .oa-choice-pose3d .oa-option-zoom{flex-shrink:0;margin-top:auto;min-height:36px}
#onlybaie-perspective .pe-pose-card{display:flex;flex-direction:column;min-width:0}
#onlybaie-perspective .pe-pose-card>.pe-card{flex:1;width:100%;border-bottom-left-radius:0;border-bottom-right-radius:0}
#onlybaie-perspective .pe-pose-card .pe-card-image{flex-shrink:0}
#onlybaie-perspective .pe-pose-card>.pe-pose-image{display:flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0;width:100%;min-height:44px;margin-top:-1px;border:1px solid #d5d9dc;border-radius:0 0 6px 6px;background:#fff;color:#444;font:inherit;font-size:12px;padding:8px;cursor:pointer}
#onlybaie-perspective .pe-pose-card:has(>.pe-card.selected)>.pe-pose-image{border-color:#d81f26}
:is(#onlybaie-perspective,body) .ob-pose3d-image-button{display:block;width:100%;min-height:44px;padding:10px;border:1px solid #ddd;border-radius:0 0 6px 6px;background:#fff;color:#444;font:inherit;font-size:13px;cursor:pointer}
:is(#onlybaie-perspective,body) :is(.pe-pose-image,.ob-pose3d-image-button,.oa-option-zoom):focus-visible{outline:3px solid #d81f26;outline-offset:3px}
@media(max-width:650px){
 #alu-parcours .oa-choice-pose3d .oa-picture{height:110px;flex-basis:110px}
 #alu-parcours .oa-choice-pose3d .oa-option-zoom{min-height:44px}
}

/* Agrandissement commun à toutes les vignettes de pose (29/09/2026), y compris les familles
   sans vue 3D : image seule, ou schéma dessiné (portes de garage battantes). */
:is(#onlybaie-perspective,body) .ob-pose-image-body.ob-image-seule{grid-template-columns:minmax(0,1fr)}
:is(#onlybaie-perspective,body) .ob-image-agrandie-svg{display:flex;align-items:center;justify-content:center;padding:16px;background:#f4f3f1;min-height:min(44dvh,400px)}
:is(#onlybaie-perspective,body) .ob-image-agrandie-svg svg{display:block;width:100%!important;max-width:760px!important;height:auto!important;max-height:min(58dvh,560px)}
:is(#onlybaie-perspective,body) dialog.ob-image-agrandie .ob-pose-explanation-intro{font-size:15px;line-height:1.55;color:#333}