/*
Theme Name: OMG Group
Theme URI: https://omg-group.com
Author: WebVue
Author URI: https://webvue.com.lb
Description: Bold outdoor-advertising brand theme for OMG Group — built by WebVue. Auto-creates all pages on activation and sends contact submissions to the site admin via wp_mail (FluentSMTP-ready).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: omg-group
*/

/* ============================================================
   BASE
   ============================================================ */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Manrope',sans-serif;
  color:#0D0B14;
  background:#FFFFFF;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{background:#7B2BE8;color:#fff;}
img{max-width:100%;}
a{color:inherit;}
button{font-family:inherit;}
input,textarea{font-family:inherit;}
.omg-sora{font-family:'Sora',sans-serif;}

/* gradient ink helpers */
.omg-grad-text{
  background:linear-gradient(100deg,#F2384F,#C61FBE,#7B2BE8,#4838DD);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* ============================================================
   KEYFRAMES
   ============================================================ */
@keyframes omgBlobA{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(60px,-50px) scale(1.18);}}
@keyframes omgBlobB{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(-70px,40px) scale(1.22);}}
@keyframes omgBlobC{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(40px,60px) scale(0.85);}}
@keyframes omgMarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes omgFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-16px);}}
@keyframes omgCue{0%{opacity:0;transform:translateY(-8px);}40%{opacity:1;}100%{opacity:0;transform:translateY(10px);}}
@keyframes omgGrad{0%{background-position:0% 50%;}100%{background-position:100% 50%;}}
@keyframes omgMenuItem{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:translateY(0);}}
@keyframes omgPreFade{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}

/* ============================================================
   REVEAL (driven by omg.js)
   ============================================================ */
[data-reveal]{opacity:0;will-change:opacity,transform;transition:opacity 1s cubic-bezier(.22,1,.36,1),transform 1.05s cubic-bezier(.22,1,.36,1);}
[data-reveal="up"]{transform:translateY(46px);}
[data-reveal="left"]{transform:translateX(48px);}
[data-reveal="right"]{transform:translateX(-48px);}
[data-reveal="scale"]{transform:scale(0.92);}
[data-reveal].is-visible{opacity:1 !important;transform:none !important;}
.no-js [data-reveal]{opacity:1;transform:none;}

/* ============================================================
   INTERACTIVE / HOVER CLASSES
   ============================================================ */
.omg-btn-primary{
  display:inline-flex;align-items:center;gap:11px;border:none;cursor:pointer;text-decoration:none;
  background:linear-gradient(100deg,#F2384F,#C61FBE,#7B2BE8,#4838DD);background-size:135% auto;
  color:#fff;font-family:'Sora',sans-serif;font-weight:600;border-radius:999px;
  box-shadow:0 16px 40px rgba(123,43,232,0.28);
  transition:background-position .6s,transform .3s,box-shadow .3s;
}
.omg-btn-primary:hover{background-position:100% 50%;transform:translateY(-3px);box-shadow:0 22px 50px rgba(123,43,232,0.4);}
.omg-btn-primary span.arr{font-size:18px;}

.omg-btn-outline{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;text-decoration:none;
  background:transparent;color:#0D0B14;font-family:'Sora',sans-serif;font-weight:600;
  border:1.5px solid rgba(13,11,20,0.16);border-radius:999px;
  transition:gap .3s,background .3s,border-color .3s,color .3s;
}
.omg-btn-outline:hover{gap:16px;background:#0D0B14;border-color:#0D0B14;color:#fff;}

.omg-btn-white{
  display:inline-flex;align-items:center;gap:11px;cursor:pointer;text-decoration:none;
  background:#fff;color:#0D0B14;font-family:'Sora',sans-serif;font-weight:600;border:none;border-radius:999px;
  transition:transform .3s,box-shadow .3s;
}
.omg-btn-white:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 24px 60px rgba(0,0,0,0.3);}

.omg-btn-dark{
  display:inline-flex;align-items:center;gap:9px;cursor:pointer;text-decoration:none;
  background:#0D0B14;color:#fff;font-family:'Sora',sans-serif;font-weight:600;border:none;border-radius:999px;
  transition:transform .3s,box-shadow .3s;
}
.omg-btn-dark:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(13,11,20,0.25);}

/* ghost button on dark / image hero */
.omg-btn-ghost-light{
  display:inline-flex;align-items:center;gap:10px;cursor:pointer;text-decoration:none;
  background:rgba(255,255,255,0.08);color:#fff;font-family:'Sora',sans-serif;font-weight:600;
  border:1.5px solid rgba(255,255,255,0.5);border-radius:999px;
  transition:background .3s,border-color .3s;
}
.omg-btn-ghost-light:hover{background:rgba(255,255,255,0.16);border-color:#fff;}

/* home "what we do" rows */
.wwd-row{transition:background .35s;}
.wwd-row:hover{background:#FBFAFC;}
.wwd-row .wwd-arrow{transition:transform .35s;}
.wwd-row:hover .wwd-arrow{transform:translateX(8px);}

/* about capability cards */
.omg-cap-card{transition:transform .5s cubic-bezier(.4,0,.2,1),box-shadow .5s,border-color .5s;}
.omg-cap-card:hover{transform:translateY(-8px);box-shadow:0 34px 64px rgba(13,11,20,0.11);border-color:rgba(123,43,232,0.22);}

/* about partner cards */
.omg-partner-card{transition:transform .4s cubic-bezier(0.4,0,0.2,1),box-shadow .4s;}
.omg-partner-card:hover{transform:translateY(-6px);box-shadow:0 26px 54px rgba(13,11,20,0.12);}

.omg-card{transition:transform .4s,box-shadow .4s,border-color .4s;}
.omg-card:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(13,11,20,0.08);}
.omg-card-lg:hover{transform:translateY(-8px);box-shadow:0 30px 60px rgba(13,11,20,0.10);border-color:transparent;}
.omg-card-dark:hover{transform:translateY(-8px);box-shadow:0 30px 60px rgba(13,11,20,0.18);}

.omg-link-soft{text-decoration:none;transition:color .3s;}
.omg-link-soft:hover{color:#fff;}

.work-tile img,.work-tile image-slot{transition:transform .7s cubic-bezier(0.22,1,0.36,1);display:block;}
.work-tile:hover img,.work-tile:hover image-slot{transform:scale(1.05);}

.client-logo img{opacity:0.92;transition:opacity .35s ease,transform .35s ease;}
.client-logo:hover img{opacity:1;transform:scale(1.04);}

/* nav */
.omg-nav-link{
  padding:11px 18px;border-radius:999px;background:none;border:none;cursor:pointer;text-decoration:none;
  font-family:'Sora',sans-serif;font-weight:500;font-size:15px;letter-spacing:-0.01em;white-space:nowrap;
  color:#3A3742;transition:background .3s,color .3s;
}
.omg-nav-link:hover{background:rgba(13,11,20,0.045);}
.omg-nav-link.active{font-weight:600;background:linear-gradient(100deg,#F2384F,#C61FBE,#7B2BE8,#4838DD);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* nav over a dark image hero (Home / About / Services) */
.omg-nav-transparent .omg-nav-link{color:rgba(255,255,255,0.82);}
.omg-nav-transparent .omg-nav-link:hover{background:rgba(255,255,255,0.12);}
.omg-nav-transparent .omg-nav-link.active{color:#fff;-webkit-text-fill-color:#fff;background:none;}

.omg-menu-link{
  display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:none;border:none;
  border-bottom:1px solid rgba(255,255,255,0.12);cursor:pointer;text-decoration:none;
  color:rgba(255,255,255,0.6);font-family:'Sora',sans-serif;font-weight:600;
  font-size:clamp(27px,7.6vw,50px);letter-spacing:-0.03em;line-height:1.1;padding:clamp(13px,2.8vw,20px) 0;
  transition:color .3s,padding-left .35s,border-color .3s;
}
.omg-menu-link:hover{color:#fff;padding-left:10px;}
.omg-menu-link.active{color:#fff;}
.omg-menu-link.active .lbl{background:linear-gradient(100deg,#F2384F,#C61FBE,#7B2BE8,#4838DD);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* form field focus */
.omg-field:focus{border-color:#7B2BE8 !important;box-shadow:0 0 0 4px rgba(123,43,232,0.12);}

/* fixed action buttons */
.omg-fab-wa:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 18px 42px rgba(37,211,102,0.6);}
.omg-fab-top:hover{box-shadow:0 18px 42px rgba(13,11,20,0.46);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .omg-desktop-nav{display:none !important;}
}
@media (min-width:1025px){
  .omg-mobile-actions{display:none !important;}
}
@media (max-width:768px){
  [data-r="work-top"]{grid-template-columns:1fr !important;grid-template-rows:none !important;height:auto !important;}
  [data-r="work-top"] > *{grid-column:auto !important;grid-row:auto !important;aspect-ratio:4/3;}
  [data-r="work-bottom"]{grid-template-columns:1fr !important;}
}
@media (max-width:640px){
  [data-r="svc-gallery"]{grid-template-columns:1fr !important;}
  [data-r="svc-gallery"] > *{grid-column:auto !important;aspect-ratio:4/3 !important;}
  [data-r="timeline-row"]{grid-template-columns:1fr !important;gap:6px !important;}
}
@media (max-width:480px){
  [data-r="home-stats"] > *{padding:24px 18px !important;}
}
@media (max-width:760px){
  .wwd-row{grid-template-columns:48px 1fr 32px !important;column-gap:16px !important;}
  .wwd-row .wwd-desc{display:none !important;}
}

/* FOOTER — responsive */
@media (max-width:720px){
  [data-r="footer-cols"]{grid-template-columns:1fr 1fr !important;gap:36px !important;}
  [data-r="footer-cols"] > *:first-child{grid-column:1 / -1 !important;}
}
@media (max-width:600px){
  [data-r="footer-cta"]{flex-direction:column !important;align-items:flex-start !important;gap:24px !important;}
  [data-r="footer-cta"] .omg-btn-primary{width:100% !important;justify-content:center !important;}
  [data-r="footer-bottom"]{flex-direction:column !important;gap:8px !important;}
}
@media (max-width:440px){
  [data-r="footer-cols"]{grid-template-columns:1fr !important;}
  [data-r="footer-cols"] > *:first-child{grid-column:auto !important;}
}