/* Office rental landing page — follows the light design language of prodex-about.css */

.prodex-offices-page{--po-green:#00a879;--po-green-bright:#12c997;--po-navy:#0b2948;--po-ink:#13283d;--po-muted:#708193;--po-line:#e1e9e7;background:#f7faf9;color:var(--po-ink)}
.prodex-offices-page .loader-mask{display:none!important}
.prodex-offices-main{clear:both;width:100%;overflow:hidden;background:#f7faf9}
.prodex-offices-main .container{max-width:1200px}

.offices-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--po-green);font-size:13px;font-weight:800}
.offices-kicker i{font-size:7px}
.prodex-offices-page h2{margin:18px 0 16px;color:var(--po-ink);font-size:34px;font-weight:900;line-height:1.6}
.prodex-offices-page h2 span{color:var(--po-green)}
.offices-lead{max-width:720px;margin:0 0 38px;color:var(--po-muted);font-size:14.5px;line-height:2.1}
.offices-empty{color:var(--po-muted);font-size:14px}

/* GALLERY */
.offices-gallery{padding:90px 0 40px}
.offices-gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.offices-gallery-item{position:relative;margin:0;overflow:hidden;border-radius:22px;aspect-ratio:4/3;box-shadow:0 16px 38px rgba(11,41,72,.12)}
.offices-gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.offices-gallery-item:hover img{transform:scale(1.06)}
.offices-gallery-item figcaption{position:absolute;inset:auto 0 0 0;display:flex;align-items:baseline;gap:12px;padding:46px 20px 18px;background:linear-gradient(0deg,rgba(5,25,43,.85),transparent)}
.offices-gallery-item figcaption strong{color:#fff;font-size:15px;font-weight:800}
.offices-gallery-item figcaption span{color:#b8cbc9;font-size:12px}
@media(max-width:900px){.offices-gallery-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.offices-gallery-grid{grid-template-columns:1fr}}

/* HOW IT WORKS */
.offices-howto{padding:70px 0 30px}
.offices-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:0;margin:0;list-style:none}
.offices-steps li{display:flex;flex-direction:column;gap:10px;padding:28px 24px;border:1px solid var(--po-line);border-radius:20px;background:#fff;box-shadow:0 10px 30px rgba(11,41,72,.05);transition:.2s}
.offices-steps li:hover{transform:translateY(-4px);border-color:#a9dacf;box-shadow:0 18px 36px rgba(11,41,72,.09)}
.offices-steps b{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#e3f8f1;color:var(--po-green);font-size:16px;font-weight:900}
.offices-steps strong{color:var(--po-ink);font-size:16px;font-weight:800}
.offices-steps span{color:var(--po-muted);font-size:13px;line-height:2}
@media(max-width:900px){.offices-steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.offices-steps{grid-template-columns:1fr}}

/* ROOM DETAILS */
.offices-rooms{padding:70px 0 40px}
.offices-room-list{display:grid;gap:22px}
.offices-room-card{display:grid;grid-template-columns:340px 1fr;overflow:hidden;border:1px solid var(--po-line);border-radius:24px;background:#fff;box-shadow:0 12px 34px rgba(11,41,72,.06);transition:.2s}
.offices-room-card:hover{transform:translateY(-4px);border-color:#a9dacf;box-shadow:0 20px 44px rgba(11,41,72,.1)}
.offices-room-media img{width:100%;height:100%;min-height:250px;object-fit:cover}
.offices-room-body{padding:32px 34px}
.offices-room-body h3{margin:0 0 12px;color:var(--po-ink);font-size:22px;font-weight:900}
.offices-room-body p{max-width:640px;margin:0 0 20px;color:var(--po-muted);font-size:13.5px;line-height:2.1}
.offices-room-meta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.offices-room-meta span{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:1px solid var(--po-line);border-radius:30px;color:var(--po-ink);font-size:12px;font-weight:700}
.offices-room-meta i{color:var(--po-green);font-size:12px}
.offices-room-price{border-color:#a9dacf!important;background:#e3f8f1;color:var(--po-green)!important}
.offices-room-cta{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:12px;background:linear-gradient(110deg,var(--po-green-bright),var(--po-green));color:#052c21;font-size:13px;font-weight:900;text-decoration:none;box-shadow:0 11px 25px rgba(0,168,121,.22);transition:.2s}
.offices-room-cta:hover{transform:translateY(-2px);color:#052c21;box-shadow:0 15px 30px rgba(0,168,121,.3)}
.offices-room-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.offices-room-call{display:inline-flex;align-items:center;gap:7px;padding:12px 17px;border:1px solid rgba(0,168,121,.38);border-radius:12px;color:var(--po-green);font-weight:800;font-size:12px;text-decoration:none}.offices-room-call:hover{color:var(--po-green-bright);border-color:var(--po-green-bright)}
@media(max-width:820px){.offices-room-card{grid-template-columns:1fr}.offices-room-media img{min-height:220px}.offices-room-body{padding:26px 24px}}

/* VISIT BOOKING */
.offices-visit{padding:50px 0 100px}
.offices-visit-shell{display:grid;grid-template-columns:.85fr 1.15fr;gap:26px;align-items:start}
.offices-visit-intro{position:relative;overflow:hidden;padding:44px 38px;border-radius:26px;background:linear-gradient(135deg,#062a22,#0b2948 60%,#071f37 150%);color:#fff;box-shadow:0 20px 45px rgba(11,41,72,.15)}
.offices-visit-intro .offices-kicker{color:var(--po-green-bright)}
.offices-visit-intro h2{margin:16px 0 16px;color:#fff;font-size:28px}
.offices-visit-intro h2 span{color:var(--po-green-bright)}
.offices-visit-intro p{margin:0;color:#c3d4d1;font-size:13.5px;line-height:2.1}
.offices-visit-notes{display:grid;gap:14px;padding:0;margin:26px 0 0;list-style:none}
.offices-visit-notes li{display:flex;align-items:center;gap:12px;color:#dbe7e5;font-size:13px}
.offices-visit-notes i{color:var(--po-green-bright);font-size:13px}
.offices-visit-form-wrap{min-width:0;padding:36px 34px;border:1px solid var(--po-line);border-radius:26px;background:#fff;box-shadow:0 16px 40px rgba(11,41,72,.07)}
@media(max-width:900px){.offices-visit-shell{grid-template-columns:1fr}}

.offices-field{margin-bottom:22px}
.offices-field>label{display:block;margin-bottom:11px;color:var(--po-ink);font-size:13px;font-weight:800}
.offices-field>label small{color:var(--po-muted);font-weight:400}
.offices-field input[type=text],.offices-field input[type=tel],.offices-field input[type=email],.offices-field textarea{width:100%;padding:15px 17px;border:1px solid var(--po-line);border-radius:14px;background:#f7faf9;color:var(--po-ink);font-size:13.5px;outline:0;transition:.2s}
.offices-field input:focus,.offices-field textarea:focus{border-color:var(--po-green);background:#fff}
.offices-field textarea{resize:vertical;line-height:2}
.offices-field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:520px){.offices-field-row{grid-template-columns:1fr}}

.offices-day-strip{display:flex;gap:12px;overflow-x:auto;padding-bottom:8px}
.offices-day{position:relative;flex:0 0 auto;margin:0}
.offices-day input,.offices-slot input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.offices-day span{display:flex;flex-direction:column;gap:6px;min-width:148px;padding:15px 17px;border:1px solid var(--po-line);border-radius:16px;background:#f7faf9;color:var(--po-ink);font-size:13px;font-weight:700;cursor:pointer;transition:.2s}
.offices-day span em{color:var(--po-muted);font-size:11px;font-style:normal;font-weight:400}
.offices-day input:checked+span{border-color:var(--po-green);background:#e3f8f1;color:var(--po-green)}
.offices-day input:checked+span em{color:var(--po-green)}
.offices-day input:focus-visible+span{outline:2px solid var(--po-green);outline-offset:2px}

.offices-slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:12px}
.offices-slot{position:relative;margin:0}
.offices-slot span{display:block;padding:13px 8px;border:1px solid var(--po-line);border-radius:13px;background:#f7faf9;color:var(--po-ink);font-size:14px;font-weight:700;text-align:center;cursor:pointer;direction:ltr;transition:.2s}
.offices-slot input:checked+span{border-color:var(--po-green);background:linear-gradient(110deg,var(--po-green-bright),var(--po-green));color:#052c21;font-weight:900}
.offices-slot input:focus-visible+span{outline:2px solid var(--po-green);outline-offset:2px}

.offices-submit{width:100%;margin-top:8px;padding:17px;border:0;border-radius:14px;background:linear-gradient(110deg,var(--po-green-bright),var(--po-green));color:#052c21;font-size:14px;font-weight:900;cursor:pointer;box-shadow:0 11px 25px rgba(0,168,121,.22);transition:.2s}
.offices-submit:hover{transform:translateY(-2px);box-shadow:0 15px 30px rgba(0,168,121,.3)}

/* Confirmation dialog */
.offices-confirm{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px}
.offices-confirm[hidden]{display:none}
.offices-confirm-backdrop{position:absolute;inset:0;background:rgba(5,25,43,.55);backdrop-filter:blur(3px)}
.offices-confirm-box{position:relative;width:100%;max-width:440px;max-height:90vh;overflow-y:auto;padding:32px 30px;border-radius:24px;background:#fff;box-shadow:0 30px 70px rgba(11,41,72,.3);animation:officesConfirmIn .22s ease}
@keyframes officesConfirmIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.offices-confirm-icon{display:grid;place-items:center;width:54px;height:54px;margin-bottom:18px;border-radius:17px;background:#e3f8f1;color:var(--po-green);font-size:20px}
.offices-confirm-box h3{margin:0 0 10px;color:var(--po-ink);font-size:20px;font-weight:900}
.offices-confirm-box>p{margin:0 0 20px;color:var(--po-muted);font-size:13px;line-height:2}
.offices-confirm-list{margin:0 0 24px;padding:6px 0;border-top:1px solid var(--po-line);border-bottom:1px solid var(--po-line)}
.offices-confirm-list>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 0}
.offices-confirm-list dt{color:var(--po-muted);font-size:12.5px;font-weight:400}
.offices-confirm-list dd{margin:0;color:var(--po-ink);font-size:13.5px;font-weight:800}
.offices-confirm-actions{display:grid;gap:10px}
.offices-confirm-accept{padding:15px;border:0;border-radius:13px;background:linear-gradient(110deg,var(--po-green-bright),var(--po-green));color:#052c21;font-size:13.5px;font-weight:900;cursor:pointer;box-shadow:0 11px 25px rgba(0,168,121,.22)}
.offices-confirm-cancel{padding:14px;border:1px solid var(--po-line);border-radius:13px;background:#fff;color:var(--po-muted);font-size:13px;font-weight:700;cursor:pointer}
.offices-confirm-cancel:hover{border-color:#c9d4d2;color:var(--po-ink)}

.offices-field.has-error>label{color:#a92b2b}
.offices-field.has-error input,.offices-field.has-error textarea{border-color:#e08585;background:#fdeeee}
.offices-field.has-error .offices-slot-grid{padding:10px;border:1px solid #e08585;border-radius:14px;background:#fdeeee}

.offices-alert{display:flex;align-items:flex-start;gap:11px;margin-bottom:24px;padding:16px 18px;border-radius:14px;font-size:13px;line-height:2}
.offices-alert.info{border:1px solid #cddced;background:#eef4fb;color:#2c4f77}
