/* ============================================================
  OMEXA DIGITAL — Design system
  Display: Space Grotesk · Body: Inter · Label/mono: IBM Plex Mono
   ============================================================ */

:root{
  --white:#ffffff;
  --bg-soft:#F3F9F6;
  --bg-soft-2:#EAF5EE;
  --ink:#0E1512;
  --ink-2:#4B5A54;
  --ink-3:#8B968F;
  --line:#E3EAE6;
  --accent:#3D9970;
  --accent-2:#2C7355;
  --accent-light:#DCEEE5;
  --accent-rgb:61,153,112;

  --font-display:'Bricolage Grotesque', sans-serif;
  --font-body:'Plus Jakarta Sans', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;

  --radius-sm:10px;
  --radius-md:16px;
  --radius-lg:26px;
  --shadow-sm:0 2px 10px rgba(14,21,18,0.06);
  --shadow-md:0 14px 40px rgba(14,21,18,0.10);
  --shadow-lg:0 24px 70px rgba(14,21,18,0.16);

  --ease:cubic-bezier(.22,.9,.32,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}

body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

h1,h2,h3,h4,h5,h6{
  font-family:var(--font-display);
  font-weight:600;
  letter-spacing:-0.02em;
  color:var(--ink);
  margin:0;
}

p{color:var(--ink-2); line-height:1.7; margin:0;}

a{color:inherit; text-decoration:none;}

::selection{background:var(--accent); color:#fff;}

:focus-visible{
  outline:2px solid var(--accent-2);
  outline-offset:3px;
  border-radius:4px;
}

img{max-width:100%; display:block;}

.container-narrow{max-width:1120px; margin:0 auto; padding:0 1.5rem;}
.container-wide{max-width:1320px; margin:0 auto; padding:0 1.5rem;}

section{position:relative;}

.section-pad{padding:6.5rem 0;}
@media (max-width:767.98px){ .section-pad{padding:4rem 0;} }

.bg-soft{background:var(--bg-soft);}
.bg-ink{background:var(--ink); color:#fff;}
.bg-ink p{color:rgba(255,255,255,.66);}
.bg-ink h1,.bg-ink h2,.bg-ink h3,.bg-ink h4{color:#fff;}

/* ---------- Eyebrow / labels ---------- */
.eyebrow{
  font-family:var(--font-display);
  font-weight:700;
  font-size:.8rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--accent-2);
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  margin-bottom:1rem;
}
.eyebrow::before{
  content:"";
  width:22px;
  height:1px;
  background:var(--accent);
  display:inline-block;
}
.bg-ink .eyebrow{color:var(--accent);}

.display-1,.display-2,.display-3{font-family:var(--font-display);}

.text-accent{color:var(--accent-2);}
.bg-ink .text-accent{color:var(--accent);}

/* ---------- Buttons ---------- */
.btn{
  font-family:var(--font-body);
  font-weight:600;
  font-size:.95rem;
  padding:.85rem 1.6rem;
  border-radius:999px;
  border:1px solid transparent;
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background-color .3s, color .3s, border-color .3s;
  white-space:nowrap;
}
.btn svg{transition:transform .3s var(--ease);}
.btn:hover svg{transform:translateX(4px);}

.btn-accent{
  background:var(--accent);
  color:#fff;
  box-shadow:0 10px 24px -8px rgba(var(--accent-rgb),.65);
}
.btn-accent:hover{
  background:var(--accent-2);
  color:#fff;
  transform:translateY(-2px);
  box-shadow:0 16px 30px -10px rgba(var(--accent-rgb),.75);
}

.btn-outline{
  background:honeydew;
  border-color:rgba(14,21,18,.16);
  color:var(--ink);
}
.btn-outline:hover{
  border-color:var(--accent);
  color:var(--accent-2);
  transform:translateY(-2px);
}
.bg-ink .btn-outline{border-color:rgba(255,255,255,.28); color:#fff;}
.bg-ink .btn-outline:hover{border-color:var(--accent); color:var(--accent);}

.btn-dark{
  background:var(--ink);
  color:#fff;
}
.btn-dark:hover{
  background:#000;
  transform:translateY(-2px);
}

.btn-sm{padding:.6rem 1.15rem; font-size:.85rem;}

/* ============================================================
   NAVBAR
   ============================================================ */
.navbar-omexa{
  position:fixed;
  top:0; left:0; right:0;
  z-index:1000;
  padding:1.15rem 0;
  transition:padding .35s var(--ease), background-color .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
}
.navbar-omexa.is-scrolled{
  padding:.7rem 0;
  background:rgba(255,255,255,.92);
  box-shadow:0 4px 24px rgba(14,21,18,.06);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.nav-brand{display:flex; align-items:center; gap:.6rem;}
.nav-logo-img{height:2rem; width:auto; transition:height .35s var(--ease);}
.navbar-omexa.is-scrolled .nav-logo-img{height:29px;}
.nav-brand-word{font-family:var(--font-display); font-weight:700; font-size:1.18rem; letter-spacing:-.01em; color:var(--ink);}
.nav-brand-word span{color:var(--accent);}

.nav-links{
  display:flex;
  align-items:center;
  gap:2rem;
  list-style:none;
  margin:0; padding:0;
}
.nav-links a{
  position:relative;
  font-size:.94rem;
  font-weight:700;
  color:var(--ink-2);
  padding:.3rem 0;
  transition:color .25s;
}
.nav-links a::after{
  content:"";
  position:absolute;
  left:50%; right:50%;
  bottom:-2px;
  height:2px;
  background:var(--accent);
  border-radius:2px;
  transition:left .32s var(--ease), right .32s var(--ease);
}
.nav-links a:hover,.nav-links a.active{color:var(--ink);}
.nav-links a:hover::after,.nav-links a.active::after{left:0; right:0;}

.nav-cta{display:flex; align-items:center; gap:1.1rem;}

/* Hamburger */
.hamburger{
  width:42px; height:42px;
  display:none;
  align-items:center;
  justify-content:center;
  background:none;
  background-color:transparent;
  border:none;
  outline:none;
  padding:0;
  border-radius:50%;
  cursor:pointer;
  position:relative;
  z-index:1201;
  flex-shrink:0;
  -webkit-tap-highlight-color:transparent;
  transition:background-color .3s;
}
.hamburger:hover{background-color:var(--accent-light);}
.hamburger.is-open{background-color:var(--accent);}
.hamburger.is-open:hover{background-color:var(--accent-2);}
.hamburger .hb-box{width:18px; height:12px; position:relative; display:block; background:none;}
.hamburger .hb-box > span{
  position:absolute; left:0; right:0;
  height:2px;
  background:var(--ink);
  border-radius:2px;
  transition:transform .38s var(--ease), opacity .25s var(--ease), top .38s var(--ease), background-color .3s;
}
.hamburger .hb-box > span:nth-child(1){top:0;}
.hamburger .hb-box > span:nth-child(2){top:5px;}
.hamburger .hb-box > span:nth-child(3){top:10px;}
.hamburger.is-open .hb-box > span{background:#fff;}
.hamburger.is-open .hb-box > span:nth-child(1){top:5px; transform:rotate(45deg);}
.hamburger.is-open .hb-box > span:nth-child(2){opacity:0;}
.hamburger.is-open .hb-box > span:nth-child(3){top:5px; transform:rotate(-45deg);}

/* Mobile menu overlay */
.mobile-menu{
  position:fixed; inset:0;
  background:var(--ink);
  z-index:1190;
  display:flex; flex-direction:column;
  justify-content:center;
  padding:2rem 2rem;
  clip-path:circle(0px at calc(100% - 38px) 40px);
  transition:clip-path .6s var(--ease);
  pointer-events:none;
}
.mobile-menu.is-open{
  clip-path:circle(160% at calc(100% - 38px) 40px);
  pointer-events:auto;
}
.mobile-menu-links{list-style:none; margin:0; padding:0;}
.mobile-menu-links li{
  overflow:hidden;
}
.mobile-menu-links a{
  display:block;
  font-family:var(--font-display);
  font-size:2.5rem;
  font-weight:600;
  color:#fff;
  padding:.5rem 0;
  transform:translateY(110%);
  opacity:0;
  transition:transform .55s var(--ease), opacity .5s var(--ease);
  transition-delay:calc(var(--i, 0) * 60ms);
}
.mobile-menu.is-open .mobile-menu-links a{transform:translateY(0); opacity:1;}
.mobile-menu-links a:hover{color:var(--accent);}
.mobile-menu-foot{
  margin-top:2.5rem;
  display:flex; flex-direction:column; gap:.9rem;
  opacity:0; transform:translateY(20px);
  transition:opacity .5s var(--ease) .4s, transform .5s var(--ease) .4s;
}
.mobile-menu.is-open .mobile-menu-foot{opacity:1; transform:translateY(0);}
.mobile-menu-foot a{color:rgba(255,255,255,.6); font-size:.95rem;}
.mobile-menu-foot a:hover{color:var(--accent);}

@media (max-width:991.98px){
  .nav-links{display:none;}
  .hamburger{display:flex;}
  .nav-cta .btn-accent-desktop{display:none;}
}

/* ============================================================
   HERO / BROWSER MOCKUP (signature element)
   ============================================================ */
.hero{
  padding:9.5rem 0 4rem;
  position:relative;
  overflow:hidden;
}
.hero-grid{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:3rem;
  align-items:center;
}
@media (max-width:991.98px){
  .hero-grid{grid-template-columns:1fr; text-align:left;}
}
.hero-kicker{
  font-family:var(--font-display);
  font-weight: 800;
  font-size:.8rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent-2);
  display:flex; align-items:center; gap:.6rem;
  margin-bottom:1.3rem;
}
.hero-kicker .dot{width:7px; height:7px; border-radius:50%; background:var(--accent); animation:pulse-dot 1.8s ease-in-out infinite;}
@keyframes pulse-dot{0%,100%{transform:scale(1); opacity:1;} 50%{transform:scale(1.7); opacity:.4;}}

.hero h1{
  font-size:clamp(2.3rem, 4.4vw, 3.65rem);
  line-height:1.06;
  margin-bottom:1.3rem;
}
.hero h1 .underline{
  position:relative;
  color:var(--accent-2);
  white-space:nowrap;
}
.hero h1 .underline svg{
  position:absolute;
  left:0; bottom:-.14em;
  width:100%; height:.3em;
}
.hero-lead{font-size:1.1rem; max-width:34rem; margin-bottom:2rem;}
.hero-actions{display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-bottom:2rem;}
.hero-trust{display:flex; flex-wrap:wrap; gap:1.4rem;}
.hero-trust span{
  font-size:.85rem; font-weight:500; color:var(--ink-2);
  display:flex; align-items:center; gap:.45rem;
}
.hero-trust svg{color:var(--accent); flex-shrink:0;}

/* Browser mockup */
.browser-mock{
  background:#fff;
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
  border:1px solid var(--line);
  overflow:hidden;
  transform:rotate(1.2deg);
  animation:float-mock 6s ease-in-out infinite;
}
@keyframes float-mock{
  0%,100%{transform:rotate(1.2deg) translateY(0);}
  50%{transform:rotate(1.2deg) translateY(-10px);}
}
.browser-chrome{
  background:var(--bg-soft);
  border-bottom:1px solid var(--line);
  padding:.7rem 1rem;
  display:flex; align-items:center; gap:.9rem;
}
.browser-dots{display:flex; gap:6px;}
.browser-dots span{width:9px; height:9px; border-radius:50%; background:#DEE6E2;}
.browser-dots span:nth-child(1){background:#ED6A5E;}
.browser-dots span:nth-child(2){background:#F4BF4F;}
.browser-dots span:nth-child(3){background:#61C454;}
.browser-address{
  flex:1;
  background:#fff;
  border:1px solid var(--line);
  border-radius:8px;
  padding:.4rem .7rem;
  font-family:var(--font-mono);
  font-size:.78rem;
  color:var(--ink-2);
  display:flex; align-items:center; gap:.4rem;
  overflow:hidden;
  white-space:nowrap;
}
.browser-address svg{color:var(--accent); flex-shrink:0;}
.type-caret{
  display:inline-block; width:1px; height:1em; background:var(--accent-2);
  animation:blink-caret 1s step-end infinite;
  vertical-align:-2px;
}
@keyframes blink-caret{50%{opacity:0;}}

.browser-body{padding:1.5rem; background:linear-gradient(180deg,#fff,var(--bg-soft));}
.mock-skel{border-radius:8px; background:var(--line); position:relative; overflow:hidden; opacity:0; transform:translateY(14px); animation:mock-in .6s var(--ease) forwards;}
.mock-skel::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.7), transparent);
  transform:translateX(-100%);
  animation:mock-shine 2.6s ease-in-out infinite;
  animation-delay:1.4s;
}
@keyframes mock-shine{ 60%{transform:translateX(120%);} 100%{transform:translateX(120%);} }
@keyframes mock-in{to{opacity:1; transform:translateY(0);}}
.mock-row{display:flex; gap:.9rem; margin-bottom:.9rem;}
.mock-nav{height:14px; width:70%; margin-bottom:1.4rem;}
.mock-nav span{display:inline-block; height:10px; width:30px; background:var(--accent); border-radius:5px; opacity:0; animation:mock-in .5s var(--ease) forwards; animation-delay:.15s;}
.mock-hero{height:64px; margin-bottom:1rem; animation-delay:.35s;}
.mock-line{height:10px; animation-delay:.55s;}
.mock-line.w-80{width:80%;}
.mock-line.w-60{width:60%; margin-bottom:1.2rem;}
.mock-card{height:70px; flex:1; animation-delay:.75s;}
.mock-card:nth-child(2){animation-delay:.85s;}
.mock-card:nth-child(3){animation-delay:.95s;}

.hero-badge{
  position:absolute;
  left:-1.2rem; bottom:-1.2rem;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:var(--shadow-md);
  padding:.8rem 1.05rem;
  display:flex; align-items:center; gap:.7rem;
  animation:float-badge 5s ease-in-out infinite;
}
@keyframes float-badge{0%,100%{transform:translateY(0);} 50%{transform:translateY(-8px);}}
.hero-badge .star-row{color:var(--accent); font-size:.75rem; letter-spacing:1px;}
.hero-badge strong{display:block; font-size:.85rem; font-family:var(--font-display);}
.hero-badge small{color:var(--ink-3); font-size:.72rem;}
.hero-mock-wrap{position:relative;}

/* faint globe/grid watermark used sparingly on dark sections */
.globe-watermark{
  position:absolute;
  pointer-events:none;
  opacity:.08;
  animation:spin-slow 60s linear infinite;
}
@keyframes spin-slow{to{transform:rotate(360deg);}}

/* Ticker */
.ticker-wrap{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  overflow:hidden;
  padding:1.1rem 0;
  background:var(--bg-soft);
}
.ticker-track{
  display:flex;
  gap:2.5rem;
  width:max-content;
  animation:ticker 32s linear infinite;
}
.ticker-track span{
  font-family:var(--font-mono);
  font-size:.82rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--ink-2);
  display:flex; align-items:center; gap:2.5rem;
  white-space:nowrap;
}
.ticker-track span::after{content:"◆"; color:var(--accent); font-size:.6rem; margin-left:2.5rem;}
@keyframes ticker{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* ============================================================
   REVEAL ANIMATIONS
   ============================================================ */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
.reveal.in-view{opacity:1; transform:translateY(0);}
.reveal-stagger > *{
  opacity:0; transform:translateY(24px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.reveal-stagger.in-view > *{opacity:1; transform:translateY(0);}
.reveal-stagger.in-view > *:nth-child(1){transition-delay:.02s;}
.reveal-stagger.in-view > *:nth-child(2){transition-delay:.10s;}
.reveal-stagger.in-view > *:nth-child(3){transition-delay:.18s;}
.reveal-stagger.in-view > *:nth-child(4){transition-delay:.26s;}
.reveal-stagger.in-view > *:nth-child(5){transition-delay:.34s;}
.reveal-stagger.in-view > *:nth-child(6){transition-delay:.42s;}

/* ============================================================
   SECTION HEADERS / CARDS
   ============================================================ */
.section-head{max-width:640px; margin-bottom:3.2rem;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.section-head h2{font-size:clamp(1.7rem,2.8vw,2.5rem); margin-bottom:1rem;}
.section-head p{font-size:1.04rem;}

.card{
  background:#fff;
  border:1px solid #D3DEDA;
  border-radius:var(--radius-md);
  padding:2rem 1.8rem;
  box-shadow:0 2px 8px rgba(14,21,18,.05);
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.card:hover{transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:var(--accent);}
.card-icon{
  width:52px; height:52px;
  border-radius:14px;
  background:var(--accent-light);
  color:var(--accent-2);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.4rem;
  transition:background .35s, color .35s, transform .35s var(--ease);
}
.card:hover .card-icon{background:var(--accent); color:#fff; transform:rotate(-6deg) scale(1.06);}
.card h3{font-size:1.14rem; margin-bottom:.6rem;}
.card p{font-size:.94rem;}

.check-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem;}
@media (max-width:575.98px){.check-grid{grid-template-columns:1fr;}}
.check-item{
  display:flex; align-items:center; gap:.7rem;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  padding:.85rem 1.05rem;
  font-weight:500;
  font-size:.94rem;
  transition:border-color .3s, background-color .3s, transform .3s var(--ease);
}
.check-item:hover{border-color:var(--accent); background:rgba(var(--accent-rgb),.09); transform:translateX(4px);}
.check-item svg{color:var(--accent); flex-shrink:0;}

/* Service detail rows */
.service-detail{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:3rem;
  align-items:center;
  padding:4rem 0;
  border-bottom:1px solid var(--line);
}
.service-detail:last-child{border-bottom:none;}
.service-detail:nth-child(even){grid-template-columns:1.1fr .9fr;}
.service-detail:nth-child(even) .service-detail-visual{order:2;}
@media (max-width:900px){
  .service-detail,.service-detail:nth-child(even){grid-template-columns:1fr;}
  .service-detail:nth-child(even) .service-detail-visual{order:0;}
}
.service-num{
  font-family:var(--font-mono);
  color:var(--accent);
  font-size:.85rem;
  margin-bottom:.9rem;
  display:block;
}
.service-detail h3{font-size:1.8rem; margin-bottom:1rem;}
.service-list{list-style:none; margin:1.4rem 0 0; padding:0; display:grid; gap:.7rem;}
.service-list li{display:flex; gap:.7rem; font-size:.96rem; color:var(--ink-2); align-items:flex-start;}
.service-list li svg{color:var(--accent); flex-shrink:0; margin-top:.2rem;}
.service-detail-visual{
  background:var(--bg-soft);
  border-radius:var(--radius-lg);
  border:1px solid var(--line);
  aspect-ratio:4/3;
  display:flex; align-items:center; justify-content:center;
  position:relative;
  overflow:hidden;
}
.service-detail-visual svg{width:46%; height:46%; color:var(--accent); opacity:.9;}

/* Process timeline */
.process-line{
  position:relative;
  max-width:900px;
  margin:0 auto;
}
.process-line::before{
  content:"";
  position:absolute;
  left:29px; top:14px; bottom:14px;
  width:2px;
  background:var(--line);
}
@media (max-width:700px){.process-line::before{left:23px;}}
.process-step{
  position:relative;
  display:flex; gap:1.6rem;
  padding-bottom:2.6rem;
}
.process-step:last-child{padding-bottom:0;}
.process-marker{
  flex-shrink:0;
  width:60px; height:60px;
  border-radius:50%;
  background:#fff;
  border:2px solid var(--accent);
  color:var(--accent-2);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono);
  font-weight:600;
  font-size:1rem;
  position:relative; z-index:1;
  transition:background-color .35s, color .35s;
}
@media (max-width:700px){.process-marker{width:48px; height:48px; font-size:.85rem;}}
.process-step:hover .process-marker{background:var(--accent); color:#fff;}
.process-copy h3{font-size:1.28rem; margin-bottom:.5rem;}
.process-copy p{max-width:32rem;}

/* Portfolio */
.portfolio-card{
  border-radius:var(--radius-lg);
  overflow:hidden;
  border:1px solid #D3DEDA;
  background:#fff;
  box-shadow:0 2px 8px rgba(14,21,18,.05);
  transition:box-shadow .4s var(--ease), transform .4s var(--ease), border-color .4s var(--ease);
}
.portfolio-card:hover{box-shadow:var(--shadow-lg); transform:translateY(-6px);}
.portfolio-thumb{
  aspect-ratio:16/10;
  overflow:hidden;
  position:relative;
  background:var(--bg-soft);
}
.portfolio-thumb img{width:100%; height:100%; object-fit:cover; object-position:top; transition:transform .6s var(--ease);}
.portfolio-card:hover .portfolio-thumb img{transform:scale(1.06);}
.portfolio-tag{
  position:absolute; top:1rem; left:1rem;
  background:rgba(14,21,18,.72);
  color:#fff; backdrop-filter:blur(6px);
  font-size:.72rem; font-family:var(--font-mono); letter-spacing:.06em; text-transform:uppercase;
  padding:.35rem .7rem; border-radius:999px;
}
.portfolio-body{padding:1.6rem 1.7rem 1.8rem;}
.portfolio-body h3{font-size:1.25rem; margin-bottom:.55rem;}
.tech-pills{display:flex; flex-wrap:wrap; gap:.5rem; margin:1.1rem 0 1.3rem;}
.tech-pills span{
  font-family:var(--font-mono); font-size:.72rem;
  border:1px solid var(--line); border-radius:999px;
  padding:.28rem .7rem; color:var(--ink-2);
}
.portfolio-link{
  display:inline-flex; align-items:center; gap:.5rem;
  font-weight:600; color:var(--accent-2); font-size:.92rem;
}
.portfolio-link svg{transition:transform .3s var(--ease);}
.portfolio-link:hover svg{transform:translate(3px,-3px);}

/* Testimonials */
.rating-badge{
  display:inline-flex; align-items:center; gap:.8rem;
  background:#fff; border:1px solid var(--line); border-radius:999px;
  padding:.6rem 1.2rem .6rem .6rem;
  box-shadow:var(--shadow-sm);
}
.rating-badge img{width:34px; height:34px; border-radius:50%;}
.rating-badge .stars{color:var(--accent); letter-spacing:1px; font-size:.85rem;}
.testi-card{
  background:#fff; border:1px solid #D3DEDA; border-radius:var(--radius-md);
  padding:2rem; height:100%;
  box-shadow:0 2px 8px rgba(14,21,18,.05);
  display:flex; flex-direction:column; gap:1.2rem;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);
}
.testi-card:hover{transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:var(--accent);}
.testi-stars{color:var(--accent); letter-spacing:2px;}
.testi-card p{color:var(--ink); font-size:1rem;}
.testi-person{display:flex; align-items:center; gap:.8rem; margin-top:auto;}
.testi-avatar{
  width:44px; height:44px; border-radius:50%;
  background:var(--accent-light); color:var(--accent-2);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700;
  flex-shrink:0;
}
.testi-person strong{display:block; font-size:.92rem;}
.testi-person span{font-size:.8rem; color:var(--ink-3);}

/* FAQ */
.accordion-omexa .accordion-item{
  border:none; border-bottom:1px solid var(--line);
  background:transparent;
}
.accordion-omexa .accordion-item:first-child{border-top:1px solid var(--line);}
.accordion-omexa .accordion-button{
  font-family:var(--font-display);
  font-weight:600;
  font-size:1.08rem;
  padding:1.5rem .2rem;
  background:transparent;
  box-shadow:none;
  color:var(--ink);
}
.accordion-omexa .accordion-button:not(.collapsed){color:var(--accent-2);}
.accordion-omexa .accordion-button::after{
  background-image:none;
  content:"+";
  font-family:var(--font-body);
  font-size:1.6rem;
  font-weight:300;
  color:var(--accent);
  transition:transform .35s var(--ease);
  width:auto; height:auto;
}
.accordion-omexa .accordion-button:not(.collapsed)::after{content:"+"; transform:rotate(135deg);}
.accordion-omexa .accordion-body{padding:0 .2rem 1.6rem; font-size:.98rem; color:var(--ink-2); max-width:38rem;}

/* Contact page */
.contact-info-item{
  display:flex; gap:1.1rem; align-items:flex-start;
  padding:1.3rem 0; border-bottom:1px solid var(--line);
}
.contact-info-item:last-child{border-bottom:none;}
.contact-info-icon{
  width:44px; height:44px; border-radius:12px; flex-shrink:0;
  background:var(--accent-light); color:var(--accent-2);
  display:flex; align-items:center; justify-content:center;
}
.contact-info-item strong{display:block; font-size:.98rem; margin-bottom:.15rem;}
.contact-info-item a,.contact-info-item span{font-size:.92rem; color:var(--ink-2);}
.contact-info-item a:hover{color:var(--accent-2);}
.map-embed{border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--line); filter:grayscale(.25) contrast(1.02);}
.map-embed iframe{width:100%; height:100%; min-height:280px; border:0; display:block;}

/* Form */
.form-omexa label{font-size:.86rem; font-weight:600; margin-bottom:.4rem; display:block; color:var(--ink);}
.form-omexa .form-control,.form-omexa .form-select{
  border:1px solid var(--line);
  border-radius:12px;
  padding:.8rem 1rem;
  font-size:.95rem;
  background:#fff;
  transition:border-color .25s, box-shadow .25s;
}
.form-omexa .form-control:focus,.form-omexa .form-select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 4px rgba(var(--accent-rgb),.14);
}
.form-omexa textarea.form-control{resize:vertical; min-height:120px;}
.form-hp{position:absolute; left:-9999px; top:-9999px; opacity:0;}

/* Modal */
.modal-omexa .modal-content{
  border:none; border-radius:22px; overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.modal-omexa .modal-header{border-bottom:1px solid var(--line); padding:1.5rem 1.8rem;}
.modal-omexa .modal-title{font-size:1.3rem;}
.modal-omexa .modal-body{padding:1.8rem;}
.modal-omexa .btn-close{
  background-size:.9rem;
  opacity:.5;
  transition:transform .3s var(--ease);
}
.modal-omexa .btn-close:hover{opacity:1; transform:rotate(90deg);}

.success-panel{
  text-align:center;
  padding:2.5rem 1rem 1.5rem;
}
.success-check{
  width:78px; height:78px; border-radius:50%;
  background:var(--accent-light);
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 1.4rem;
}
.success-check svg{color:var(--accent-2);}
.success-check .tick-path{
  stroke-dasharray:40; stroke-dashoffset:40;
  animation:draw-tick .5s var(--ease) .2s forwards;
}
@keyframes draw-tick{to{stroke-dashoffset:0;}}
.success-panel h4{margin-bottom:.6rem;}
.success-panel p{max-width:24rem; margin:0 auto;}

/* CTA banner */
.cta-band{
  background:var(--ink);
  color:#fff;
  border-radius:var(--radius-lg);
  padding:4rem 2rem;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.cta-band::before{
  content:"";
  position:absolute; inset:-40%;
  background:radial-gradient(circle at 30% 30%, rgba(var(--accent-rgb),.35), transparent 60%);
  animation:cta-glow 8s ease-in-out infinite alternate;
}
@keyframes cta-glow{from{transform:translate(-4%,-2%) scale(1);} to{transform:translate(4%,3%) scale(1.15);}}
.cta-band h2{font-size:clamp(1.9rem,3.4vw,2.7rem); position:relative; margin-bottom:1rem;}
.cta-band p{color:rgba(255,255,255,.68); position:relative; max-width:34rem; margin:0 auto 1.9rem;}
.cta-band .cta-actions{position:relative; display:flex; gap:1rem; justify-content:center; flex-wrap:wrap;}

/* ============================================================
   FOOTER
   ============================================================ */
.footer-omexa{background:var(--ink); color:rgba(255,255,255,.7); padding-top:5rem;}
.footer-top{display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:2.5rem; padding-bottom:3.2rem;}
@media (max-width:900px){.footer-top{grid-template-columns:1fr 1fr;}}
@media (max-width:575.98px){.footer-top{grid-template-columns:1fr;}}
.footer-brand img{height:34px; margin-bottom:1.1rem;}
.footer-logo-lockup{display:inline-flex; align-items:center; gap:.6rem; margin-bottom:1.1rem;}
.footer-logo-lockup img{height:7rem; margin-bottom:0;}
.footer-logo-lockup span{font-family:var(--font-display); font-weight:700; font-size:1.15rem; color:#fff;}
.footer-omexa p{color:rgba(255,255,255,.55); font-size:.92rem; max-width:22rem;}
.footer-col h5{
  font-family:var(--font-display); font-weight:700; font-size:.82rem; letter-spacing:.08em; text-transform:uppercase;
  color:#fff; margin-bottom:1.2rem;
}
.footer-col ul{list-style:none; margin:0; padding:0; display:grid; gap:.7rem;}
.footer-col a{font-size:.92rem; color:rgba(255,255,255,.6); transition:color .25s, padding-left .25s;}
.footer-col a:hover{color:var(--accent); padding-left:4px;}
.footer-col li{display:flex; align-items:flex-start; gap:.6rem;}
.footer-col li svg{flex-shrink:0; margin-top:.2rem; color:var(--accent);}
.social-row{display:flex; gap:.7rem; margin-top:1.4rem;}
.social-row a{
  width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(255,255,255,.16);
  display:flex; align-items:center; justify-content:center;
  transition:background-color .3s, border-color .3s, transform .3s var(--ease);
}
.social-row a:hover{background:var(--accent); border-color:var(--accent); transform:translateY(-3px);}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  padding:1.4rem 0;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.7rem;
  font-size:.83rem; color:rgba(255,255,255,.45);
}
.footer-bottom a{color:rgba(255,255,255,.45);}
.footer-bottom a:hover{color:var(--accent);}

/* Page hero (inner pages) */
.page-hero{
  padding:9.5rem 0 4.5rem;
  background:var(--bg-soft);
  position:relative;
  overflow:hidden;
}
.page-hero h1{font-size:clamp(2rem,3.6vw,3rem); max-width:44rem;}
.page-hero p.lead-p{font-size:1.06rem; max-width:36rem; margin-top:1.1rem;}
.page-hero-visual{
  position:absolute; right:-60px; top:50%; transform:translateY(-50%);
  opacity:.5;
}

/* generic legal page */
.legal-content h2{font-size:1.3rem; margin:2.2rem 0 .8rem;}
.legal-content p, .legal-content li{color:var(--ink-2); font-size:.98rem; margin-bottom:.7rem;}
.legal-content ul{padding-left:1.2rem;}

/* misc */
.divider-dot{color:var(--accent); margin:0 .5rem;}
.back-to-top{
  position:fixed; right:1.6rem; bottom:1.6rem;
  width:46px; height:46px; border-radius:50%;
  background:var(--ink); color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-md);
  opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity .3s, transform .3s, visibility .3s, background-color .3s;
  z-index:900;
}
.back-to-top.show{opacity:1; visibility:visible; transform:translateY(0);}
.back-to-top:hover{background:var(--accent-2);}

.h2-banner {
  color:  lightgray !important;
}