/* Royal Interior Builder theme extras | Author: Abdullah (https://abdullahofficial.com) */

/* Skip link + screen reader */
.rib-skip{position:fixed;left:16px;top:-80px;z-index:2000;background:var(--rib-brass);color:var(--rib-ink)!important;font-family:var(--rib-head);font-weight:600;padding:12px 20px;border-radius:40px;transition:top .3s}
.rib-skip:focus{top:calc(env(safe-area-inset-top,0px) + 16px)}
main:focus{outline:none}
.admin-bar .rib-nav{top:32px}
@media (max-width:782px){.admin-bar .rib-nav{top:46px}}

/* Footer headings (h2 for correct outline) */
.rib-foot-h{font-family:var(--rib-head);font-size:13px;font-weight:600;color:var(--rib-brass);margin-bottom:22px}

/* Lists reset */
.rib-steps{list-style:none;margin:0;padding:0}
.rib-site-track{list-style:none;margin:0;padding:0}
.rib-site-li{flex:none;display:flex;align-items:center}
.rib-site-li:nth-child(even) figure{aspect-ratio:1}
.rib-site figure{margin:0}
.rib-site.rib-paused .rib-site-track{animation-play-state:paused}
.rib-site-btn{display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-in}
.rib-site-btn:focus-visible{outline:3px solid var(--rib-brass);outline-offset:-3px}
.rib-site:focus-within .rib-site-track{animation-play-state:paused}
.rib-gal-ctrl{margin-top:18px;display:flex;justify-content:flex-end}
.rib-gpause{font-family:var(--rib-head);font-size:13px;font-weight:600;padding:10px 18px;border-radius:40px;border:1px solid rgba(15,22,38,.25);background:transparent;color:var(--rib-ink);cursor:pointer}
.rib-gpause:hover,.rib-gpause[aria-pressed="true"]{background:var(--rib-ink);color:var(--rib-plaster)}
.rib-quote figure{margin:0}

/* Hero slider controls */
.rib-slide-ctrl{display:flex;align-items:center;gap:12px}
.rib-pause{width:36px;height:36px;border-radius:50%;border:1px solid rgba(246,242,235,.35);background:rgba(15,22,38,.35);color:var(--rib-plaster);font-size:11px;cursor:pointer;display:grid;place-items:center;transition:background .3s,color .3s}
.rib-pause:hover,.rib-pause[aria-pressed="true"]{background:var(--rib-brass);color:var(--rib-ink);border-color:var(--rib-brass)}

/* Better contrast for small muted text (WCAG AA) */
.rib-sub,.rib-foot-bot,.rib-foot-brand p,.rib-statement p{color:#a9a294}
.rib-about .rib-stat span,.rib-form-note{color:#6d675e}
.rib-form .rib-form-note,.rib-field label{color:#b3ab9d}

/* Lightbox */
.rib-lb{position:fixed;inset:0;z-index:1500;background:rgba(10,15,27,.94);display:flex;align-items:center;justify-content:center;gap:16px;padding:calc(env(safe-area-inset-top,0px) + 60px) 16px calc(env(safe-area-inset-bottom,0px) + 30px)}
.rib-lb[hidden]{display:none}
.rib-lb-fig{margin:0;max-width:min(1200px,100%);display:flex;flex-direction:column;align-items:center;gap:14px}
.rib-lb-fig img{max-height:76vh;max-height:76svh;width:auto;max-width:100%;border-radius:6px;object-fit:contain}
.rib-lb-fig figcaption{display:flex;gap:18px;font-family:var(--rib-head);font-size:14px;color:var(--rib-sand)}
.rib-lb-count{color:var(--rib-brass)}
.rib-lb button{width:52px;height:52px;border-radius:50%;border:1px solid var(--rib-line);background:rgba(246,242,235,.06);color:var(--rib-plaster);font-size:20px;cursor:pointer;flex:none;transition:background .3s,color .3s}
.rib-lb button:hover,.rib-lb button:focus-visible{background:var(--rib-brass);color:var(--rib-ink)}
.rib-lb-close{position:absolute;top:calc(env(safe-area-inset-top,0px) + 14px);right:14px}
@media (max-width:600px){
  .rib-lb{flex-wrap:wrap;align-content:center}
  .rib-lb-fig{order:1;width:100%}
  .rib-lb-prev{order:2}.rib-lb-next{order:3}
}

/* Inner pages (blog, pages, 404) */
.rib-inner .rib-nav{background:rgba(15,22,38,.92)}
.rib-page{padding:calc(140px + env(safe-area-inset-top,0px)) var(--rib-pad) var(--rib-sec);max-width:900px;margin:0 auto}
.rib-page-title{font-family:var(--rib-head);font-weight:800;font-size:clamp(38px,6vw,84px);line-height:.95;letter-spacing:-.04em;color:var(--rib-plaster);margin-bottom:30px}
.rib-page-meta{font-family:var(--rib-head);font-size:13px;color:var(--rib-brass);margin-bottom:16px}
.rib-prose{font-size:18px;color:var(--rib-sand)}
.rib-prose > * + *{margin-top:1.1em}
.rib-prose h2,.rib-prose h3{font-family:var(--rib-head);color:var(--rib-plaster);letter-spacing:-.02em;line-height:1.15;margin-top:1.6em}
.rib-prose a{color:var(--rib-brass-lt);text-decoration:underline;text-underline-offset:3px}
.rib-prose img{border-radius:6px;height:auto}
.rib-prose ul,.rib-prose ol{padding-left:1.4em}
.rib-prose blockquote{border-left:3px solid var(--rib-brass);padding-left:20px;font-style:italic}
.rib-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--rib-line)}
.rib-list li{padding:28px 0;border-bottom:1px solid var(--rib-line)}
.rib-list h2{font-family:var(--rib-head);font-weight:700;font-size:clamp(24px,3vw,36px);letter-spacing:-.02em;margin-bottom:8px}
.rib-list h2 a{color:var(--rib-plaster)}
.rib-list h2 a:hover{color:var(--rib-brass)}
.rib-pagi{margin-top:40px;display:flex;gap:10px;flex-wrap:wrap;font-family:var(--rib-head)}
.rib-pagi .page-numbers{padding:10px 16px;border:1px solid var(--rib-line);border-radius:40px}
.rib-pagi .current{background:var(--rib-brass);color:var(--rib-ink);border-color:var(--rib-brass)}
.alignwide{max-width:1200px}
.alignfull{width:100vw;margin-left:calc(50% - 50vw)}
.wp-caption-text,.wp-element-caption{font-size:14px;color:#a9a294;text-align:center}

/* ===== Video gallery ===== */
.rib-videos{background:var(--rib-ink)}
.rib-vid-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,22px)}
.rib-vid-li[hidden]{display:none}
.rib-vid-card{position:relative;display:block;width:100%;aspect-ratio:9/14;border:0;padding:0;border-radius:10px;overflow:hidden;background:var(--rib-royal);cursor:pointer;text-align:left;color:var(--rib-plaster);isolation:isolate}
.rib-vid-media,.rib-vid-media img,.rib-vid-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rib-vid-media img,.rib-vid-media video{transition:transform 1.2s var(--rib-out),opacity .4s}
.rib-vid-over{opacity:0}
.rib-vid-on .rib-vid-over{opacity:1}
.rib-vid-blank{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,var(--rib-royal),var(--rib-ink))}
.rib-vid-blank img{position:static;width:38%;height:auto;opacity:.6}
.rib-vid-card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(15,22,38,.92) 0%,rgba(15,22,38,0) 50%)}
.rib-vid-badge{position:absolute;top:12px;left:12px;z-index:2;font-family:var(--rib-head);font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:30px;background:rgba(15,22,38,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.rib-vid-play{position:absolute;top:50%;left:50%;z-index:2;width:clamp(54px,5vw,70px);aspect-ratio:1;border-radius:50%;background:var(--rib-brass);display:grid;place-items:center;transform:translate(-50%,-50%);transition:transform .5s var(--rib-out),background .3s}
.rib-vid-play::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--rib-brass);animation:rib-ping 2.4s ease-out infinite;z-index:-1}
.rib-vid-play svg{width:40%;height:40%;fill:var(--rib-ink);margin-left:6%}
.rib-vid-title{position:absolute;left:14px;right:14px;bottom:14px;z-index:2;font-family:var(--rib-head);font-weight:600;font-size:clamp(14px,1.1vw,17px);line-height:1.25}
.rib-vid-card:focus-visible{outline:3px solid var(--rib-brass);outline-offset:3px}
@media (hover:hover){
  .rib-vid-card:hover .rib-vid-media img,.rib-vid-card:hover .rib-vid-media video{transform:scale(1.06)}
  .rib-vid-card:hover .rib-vid-play{transform:translate(-50%,-50%) scale(1.12);background:var(--rib-plaster)}
  .rib-vid-on .rib-vid-play{opacity:0}
}
.rib-vid-more-wrap{display:flex;justify-content:center;margin-top:clamp(30px,4vw,50px)}
.rib-vid-follow{display:flex;justify-content:center;margin-top:24px}
.rib-vid-follow a{display:inline-flex;align-items:center;gap:10px;font-family:var(--rib-head);font-weight:600;color:var(--rib-brass-lt)}
.rib-vid-follow svg{width:20px;height:20px;fill:currentColor}
.rib-vid-follow a:hover{color:var(--rib-plaster)}
.rib-vid-empty{border:2px dashed var(--rib-line);border-radius:10px;padding:30px;text-align:center;color:var(--rib-sand)}
.rib-vid-empty a{color:var(--rib-brass-lt);text-decoration:underline}

/* Video player modal */
.rib-vm{position:fixed;inset:0;z-index:1500;background:rgba(10,15,27,.95);display:flex;align-items:center;justify-content:center;padding:calc(env(safe-area-inset-top,0px) + 16px) 16px calc(env(safe-area-inset-bottom,0px) + 16px)}
.rib-vm[hidden]{display:none}
.rib-vm-box{display:flex;flex-direction:column;gap:12px;max-width:100%}
.rib-vm-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.rib-vm-title{font-family:var(--rib-head);font-weight:600;font-size:16px;color:var(--rib-plaster);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rib-vm-close{flex:none;width:46px;height:46px;border-radius:50%;border:1px solid var(--rib-line);background:rgba(246,242,235,.06);color:var(--rib-plaster);font-size:18px;cursor:pointer}
.rib-vm-close:hover,.rib-vm-close:focus-visible{background:var(--rib-brass);color:var(--rib-ink)}
.rib-vm-stage{background:#000;border-radius:10px;overflow:hidden}
.rib-vm-stage iframe,.rib-vm-stage video{display:block;width:100%;height:100%;border:0;background:#000}
.rib-vm-vert{height:min(82vh,82svh,900px);aspect-ratio:9/16;max-width:calc(100vw - 32px)}
.rib-vm-wide{width:min(1100px,calc(100vw - 32px));aspect-ratio:16/9;max-height:80vh}

@media (max-width:1024px){.rib-vid-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){
  .rib-vid-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rib-vid-badge{top:8px;left:8px;font-size:10.5px;padding:5px 10px}
  .rib-vm-vert{height:auto;width:100%;max-height:calc(100svh - 110px)}
}

/* ===== Full logo + banner video ===== */
.rib-logo-main{height:clamp(52px,5vw,72px);width:auto;display:block;transition:height .4s var(--rib-ease),transform .6s var(--rib-out)}
.rib-nav.rib-scrolled .rib-logo-main{height:clamp(44px,3.8vw,56px)}
.rib-logo:hover .rib-logo-main{transform:scale(1.04)}
.rib-logo-foot{height:clamp(90px,9vw,130px)!important}
.rib-loader-main{width:clamp(180px,26vw,380px)!important}
.rib-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.02)}
.rib-vpause{width:44px;height:44px}
@media (max-width:600px){.rib-logo-main{height:46px}.rib-nav.rib-scrolled .rib-logo-main{height:40px}}

/* ===== Somaliland flag ===== */
.rib-flag{display:inline-block;flex:none;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.25),0 2px 6px rgba(0,0,0,.25);vertical-align:middle}
.rib-flag-xs{width:22px;height:11px;margin-right:8px}
.rib-flag-sm{width:30px;height:15px}
.rib-hero-tag .rib-flag{margin-right:2px}
.rib-map-card h3 .rib-flag{width:30px;height:15px}
.rib-loc{display:inline-flex;align-items:center;justify-content:flex-end}
.rib-loader-loc{display:inline-flex;align-items:center}
.rib-proud{display:inline-flex;align-items:center;gap:12px;font-family:var(--rib-head);font-weight:600;color:var(--rib-sand)}
.rib-flag-wave{width:42px;height:21px;transform-origin:left center;animation:rib-wave 3.2s ease-in-out infinite}
@keyframes rib-wave{0%,100%{transform:perspective(120px) rotateY(0) skewY(0)}50%{transform:perspective(120px) rotateY(-14deg) skewY(-2deg)}}
@media (max-width:600px){.rib-loc{justify-content:flex-start}}

/* ===== Hero video (fixed) ===== */
.rib-hero-fallback{position:absolute;inset:0;background-size:cover;background-position:center}
.rib-hero-vframe{position:absolute;inset:0;opacity:0;transition:opacity 1s ease}
.rib-vplaying .rib-hero-vframe{opacity:1}
.rib-vfail .rib-hero-vframe{display:none}
.rib-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:none}
.rib-hero:has(.rib-hero-video) .rib-hero-media::after{background:linear-gradient(180deg,rgba(15,22,38,.6) 0%,rgba(15,22,38,0) 28%,rgba(15,22,38,.15) 55%,rgba(15,22,38,.9) 100%),linear-gradient(90deg,rgba(15,22,38,.55),transparent 65%)}
/* Portrait (phone) video on a wide screen: blurred backdrop + framed reel on the right */
.rib-vframe .rib-hero-fallback{filter:blur(28px) brightness(.45) saturate(1.2);transform:scale(1.15)}
.rib-vframe .rib-hero-vframe{inset:auto;top:50%;right:var(--rib-pad);height:min(74vh,74svh,760px);aspect-ratio:9/16;transform:translateY(-50%);border-radius:18px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(224,189,127,.45)}
.rib-vframe .rib-hero-media::after{background:linear-gradient(90deg,rgba(15,22,38,.75),rgba(15,22,38,.2) 70%),linear-gradient(0deg,rgba(15,22,38,.8),transparent 45%)!important}
.rib-vframe .rib-hero-in{max-width:calc(100% - min(74vh,760px) * .5625 - 60px)}
.rib-vframe .rib-hero-title{font-size:clamp(42px,7.4vw,150px)}
.rib-vframe .rib-hero-title .rib-row:nth-child(2){padding-left:0}
.rib-vframe .rib-hero-grid,.rib-vframe .rib-scroll-hint{display:none}
