/* xw-xwroi.css — 2 page(s): en/xwroi.html, xwroi.html */

.xw-head{border-top:1px solid #E4DCCF;margin-top:30px;padding-top:34px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.xw-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,3.5vw,52px);margin-top:52px;align-items:start}
.xw-car{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/3;background:#F1EBDF;border:1px solid #EBE3D4}
.xw-slide{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .55s ease;pointer-events:none}
.xw-slide.on{opacity:1;pointer-events:auto}
.xw-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:999px;border:0;background:rgba(255,255,255,0.82);color:#1A1A1A;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px -6px rgba(0,0,0,0.4);transition:background .2s;z-index:3}
.xw-arrow:hover{background:#fff}
.xw-prev{left:14px}.xw-next{right:14px}
.xw-dots{position:absolute;left:0;right:0;bottom:14px;display:flex;gap:6px;justify-content:center;z-index:3}
.xw-dot{width:7px;height:7px;border-radius:999px;border:0;padding:0;background:rgba(255,255,255,0.6);box-shadow:0 0 0 1px rgba(0,0,0,0.14);cursor:pointer;transition:width .25s,background .25s}
.xw-dot.on{width:20px;background:#fff}
@media (max-width:900px){.xw-grid{grid-template-columns:1fr !important;gap:44px}.xw-head{grid-template-columns:1fr !important;justify-items:center;text-align:center}}

/* Detail gallery. These 17 frames are close-ups — equipment, plaster, tiles —
   which read as texture in a grid and as filler in a full-bleed carousel, so
   they get their own section rather than another twelve carousel dots.
   Cells are 3:4 and the images are encoded at exactly 3:4, so object-fit has
   nothing left to crop. gal-06 is the one native landscape and spans two
   columns at its own 3:2. */
.xw-gal-sec{margin-top:clamp(56px,6vw,88px);padding-top:42px;border-top:1px solid #D1C9BD}
.xw-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.2vw,18px);margin-top:30px}
.xw-gal figure{margin:0;position:relative;overflow:hidden;border-radius:18px;
background:#F1EBDF;border:1px solid #EBE3D4;aspect-ratio:3/4}
.xw-gal figure.xw-gal-wide{grid-column:span 2;aspect-ratio:3/2}
.xw-gal img{width:100%;height:100%;object-fit:cover;display:block;
transition:transform .6s cubic-bezier(0.16,1,0.3,1)}
@media (hover:hover){.xw-gal figure:hover img{transform:scale(1.045)}}
@media (max-width:900px){.xw-gal{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){.xw-gal img{transition:none}
.xw-gal figure:hover img{transform:none}}