/*
Theme Name: neurozen
Theme URI: http://themexriver.com/wp/neurozen/
Author: Oxhey AI
Author URI: http://themexriver.com/
Description: Oxhey AI
Version: 1.0
Tested up to: 8.2
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: neurozen
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

.txt-oxhey{
	color:#035199;
}
.av-hr3-card2{
	display:none !important;
}

#av-hero3{
	padding-bottom:30px;
}

.prthalign{
	text-align:center;
}

/*DARK
/* FAQ Main Card 
.e-n-accordion-item {
    background: #101010;
    border: 1px solid #1a1a1a;
    border-radius: 16px;
    margin-bottom: 18px;
    overflow: hidden;
}

/* Question Title 
.e-n-accordion-item summary.e-n-accordion-item-title {
    padding: 22px 26px;
    display: flex;
    
    align-items: center;
    cursor: pointer;
    font-size: 17px;
    font-weight: 500;
    color: #ffffff;

    list-style: none;
}

/* Remove default arrow of <details> 
.e-n-accordion-item summary::-webkit-details-marker {
    display: none;
}

/* Hover effect (very light like screenshot) 
.e-n-accordion-item summary:hover {
    background: #111111;
}

/* Question text alignment fix 
.e-n-accordion-item-title-text {
    margin: 0 !important;
    padding: 0 !important;
}

/* Icons size/color 
.e-n-accordion-item-title-icon i {
    font-size: 14px;
    color: #ffffff;
}

/* Hide minus when closed 
.e-n-accordion-item:not([open]) .e-opened {
    display: none;
}

/* Hide plus when opened 
.e-n-accordion-item[open] .e-closed {
    display: none;
}

/* ANSWER TEXT 
.e-n-accordion-item[open] .elementor-widget-text-editor,
.e-n-accordion-item[open] .e-con-inner,
.e-n-accordion-item[open] .e-con {
    padding: 0 0 5px 26px !important;

    font-size: 15px;
    color: #c1c1c1;
    line-height: 1.6;
}

/* Remove default margin on paragraphs 
.e-n-accordion-item p {
    margin: 0 !important;
}

/* Open state border color 
.e-n-accordion-item[open] {
    border-color: #2a2a2a;
}

.e-n-accordion-item:not([open]) .e-opened {
    display: none;
}

/* When expanded → only show minus 
.e-n-accordion-item[open] .e-closed {
    display: none;
}

/* Open state background 
.e-n-accordion-item[open] {
    border-color: #333333;
    background: #111111;
}

/* Smooth animation 
details.e-n-accordion-item summary {
    transition: background 0.3s ease;
}

details.e-n-accordion-item[open] .e-n-accordion-item-title {
    background: #111111;
}
*/

/* FAQ Main Card */
.e-n-accordion-item {
    background: #101010;
    border: 1px solid #1a1a1a;
    border-radius: 16px;
    margin-bottom: 18px;
    overflow: hidden;
}

/* Question Title */
.e-n-accordion-item summary.e-n-accordion-item-title {
    padding: 22px 26px;
    display: flex;
    
    align-items: center;
    cursor: pointer;
    font-size: 17px;
    font-weight: 500;
    color: #ffffff;

    list-style: none;
}

/* Remove default arrow of <details> */
.e-n-accordion-item summary::-webkit-details-marker {
    display: none;
}

/* Hover effect (very light like screenshot) */
.e-n-accordion-item summary:hover {
    background: #111111;
}

/* Question text alignment fix */
.e-n-accordion-item-title-text {
    margin: 0 !important;
    padding: 0 !important;
}

/* Icons size/color */
.e-n-accordion-item-title-icon i {
    font-size: 14px;
    color: #ffffff;
}

/* Hide minus when closed */
.e-n-accordion-item:not([open]) .e-opened {
    display: none;
}

/* Hide plus when opened */
.e-n-accordion-item[open] .e-closed {
    display: none;
}

/* ANSWER TEXT */
.e-n-accordion-item[open] .elementor-widget-text-editor,
.e-n-accordion-item[open] .e-con-inner,
.e-n-accordion-item[open] .e-con {
    padding: 0 0 5px 26px !important;

    font-size: 15px;
    color: #c1c1c1;
    line-height: 1.6;
}

/* Remove default margin on paragraphs */
.e-n-accordion-item p {
    margin: 0 !important;
}

/* Open state border color */
.e-n-accordion-item[open] {
    border-color: #2a2a2a;
}

.e-n-accordion-item:not([open]) .e-opened {
    display: none;
}

/* When expanded → only show minus */
.e-n-accordion-item[open] .e-closed {
    display: none;
}

/* Open state background */
.e-n-accordion-item[open] {
    border-color: #333333;
    background: #111111;
}

/* Smooth animation */
details.e-n-accordion-item summary {
    transition: background 0.3s ease;
}

details.e-n-accordion-item[open] .e-n-accordion-item-title {
    background: #111111;
}

.outcomes{
	color: #0d6efd;
    background: #111d2b;
    border: 1px solid #143453;
    border-radius: 20px;
    padding: 5px 10px 5px 10px;
    margin: 5px;
    font-weight: 500;
}
.bdb{
	border-bottom:1px solid #21242c;
	padding-bottom:5px;
}

.custom-list li::before {
  content: ''; /* Required for pseudo-elements to render */
  position: absolute; /* Positions the icon independently of the text flow */
  left: 0;
  top: 50%; /* Helps with vertical alignment */
  transform: translateY(-50%); /* Fine-tunes vertical centering */
  width: 1em; /* Controls the icon's size (adjust as needed) */
  height: 1em; /* Controls the icon's size */
  background-image: url('https://oxhey.ai/wp-content/uploads/2025/11/ic4.svg'); /* Links to the SVG file */
  background-repeat: no-repeat;
  background-size: contain; /* Ensures the icon fits within the specified width/height */
}

.av-ser1-img-text .pum-trigger{
	    background: var(--av-prime-c1);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.av-ser1-img-text .pum-trigger:hover{
	    color:#C6C7C8;
	text-decoration:underline;
}

.sn-blog-list-feed .blog-item-meta{
	display:none !important;
}

.av-btn1 a,
.av-btn1 button {
  z-index: 1 !important;
  color: #fff !important;
  line-height: 1 !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  overflow: hidden !important;
  padding: 20px 24px !important;
  border-radius: 50px !important;
  white-space: nowrap !important;
  position: relative !important;
  border: 1px solid transparent !important;

  /* Default: GRADIENT BACKGROUND */
  background: linear-gradient(
      var(--av-prime-c1),
      var(--av-prime-c1)
    ) padding-box,
    var(--av-black1) border-box !important;
}

.av-btn1 a:before,
.av-btn1 button:before {
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%; /* FULL width by default = gradient visible */
  height: 100%;
  content: "";
  position: absolute;
  border-radius: 50px;
  background-image: var(--av-prime-c1);
  transition: all 500ms ease-in-out !important;
}

/* Hover: SINGLE COLOR */
.av-btn1 a:hover:before,
.av-btn1 button:hover:before {
  width: 0% !important; /* Hides gradient layer */
}

.av-btn1 a:hover,
.av-btn1 button:hover {
  background: var(--av-black1) !important;
}




/* ================================================================
   OXHEY AI — ELEMENTOR GLOBAL CSS
   Paste this into: Elementor → Site Settings → Custom CSS

   ALL classes prefixed "oxh-" — zero conflicts with your theme.
   Font: Sora (loaded via @import below)
   Last updated: 2025
================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@300;400;500;600;700;800&family=DM+Mono:wght@400;500&display=swap');

/* ────────────────────────────────────────────
   DESIGN TOKENS
──────────────────────────────────────────── */
:root {
  --oxh-bg:           #050d1a;
  --oxh-bg2:          #071224;
  --oxh-bg3:          #0a1830;
  --oxh-card:         #0c1e38;
  --oxh-accent:       #00d4ff;
  --oxh-accent-dim:   rgba(0,212,255,.10);
  --oxh-accent-glow:  rgba(0,212,255,.25);
  --oxh-gold:         #f5a623;
  --oxh-gold-dim:     rgba(245,166,35,.10);
  --oxh-green:        #22d98a;
  --oxh-green-dim:    rgba(34,217,138,.10);
  --oxh-red:          #ff5c5c;
  --oxh-red-dim:      rgba(255,92,92,.10);
  --oxh-border:       rgba(0,212,255,.15);
  --oxh-border2:      rgba(255,255,255,.08);
  --oxh-t1:           #ffffff;
  --oxh-t2:           #cad9f0;
  --oxh-t3:           #8aadd4;
  --oxh-t4:           #abd3ff;
  --oxh-sans:         'Sora', sans-serif;
  --oxh-mono:         'DM Mono', monospace;
  --oxh-ease:         cubic-bezier(.22,.61,.36,1);
  --oxh-spring:       cubic-bezier(.34,1.56,.64,1);
}

/* ────────────────────────────────────────────
   SHARED UTILITIES
──────────────────────────────────────────── */
.oxh-hero-sec{
    margin-top:30px;
}
.oxh-wrap {
  max-width: 90%;
  margin: 0 auto;
  padding: 0 36px;
}

/* Scroll reveal — starts hidden, JS adds .oxh-in */
.oxh-reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .65s var(--oxh-ease), transform .65s var(--oxh-ease);
}
.oxh-reveal.oxh-in {
  opacity: 1;
  transform: none;
}
.oxh-d1 { transition-delay: .08s; }
.oxh-d2 { transition-delay: .18s; }
.oxh-d3 { transition-delay: .28s; }
.oxh-d4 { transition-delay: .38s; }
.oxh-d5 { transition-delay: .48s; }
.oxh-d6 { transition-delay: .58s; }

/* Section spacing */
.oxh-section {
  padding: 110px 0;
  position: relative;
  overflow: hidden;
}
.oxh-section-sm { padding: 80px 0; }

/* Section divider */
.oxh-divide {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--oxh-border), transparent);
  margin: 0;
}

/* Eyebrow label */
.oxh-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.oxh-eyebrow-line {
  display: block;
  width: 28px;
  height: 2px;
  background: var(--oxh-accent);
  border-radius: 2px;
  flex-shrink: 0;
}
.oxh-eyebrow-text {
  font-family: var(--oxh-mono);
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--oxh-accent);
}

/* Section title */
.oxh-sec-title {
  font-family: var(--oxh-sans);
  font-size: clamp(2rem, 3.5vw, 2.9rem);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -.8px;
  color: var(--oxh-t1);
  margin-bottom: 18px;
}
.oxh-sec-title .oxh-c  { color: var(--oxh-accent); }
.oxh-sec-title .oxh-g  { color: var(--oxh-green); }
.oxh-sec-title .oxh-go { color: var(--oxh-gold); }
.oxh-sec-title .oxh-r  { color: var(--oxh-red); }

/* Body text */
.oxh-body {
  font-family: var(--oxh-sans);
  font-size: clamp(1.1rem, 1.8vw, 1.2rem);
  font-weight: 400;
  line-height: 1.8;
  color: var(--oxh-t3);
}
.oxh-body strong, .oxh-body b {
  color: var(--oxh-t1);
  font-weight: 700;
}
.oxh-body-lg {
  font-size: clamp(1.2rem, 2vw, 1.35rem);
  color: var(--oxh-t2);
  line-height: 1.75;
}

/* Two column grid */
.oxh-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
}
.oxh-two-col.oxh-center { align-items: center; }

/* Card base */
.oxh-card {
  background: var(--oxh-card);
  border: 1px solid var(--oxh-border2);
  border-radius: 18px;
  padding: 28px;
  position: relative;
  overflow: hidden;
  transition: border-color .3s, transform .4s var(--oxh-spring), box-shadow .3s;
}
.oxh-card:hover {
  border-color: rgba(0,212,255,.22);
  transform: translateY(-5px);
  box-shadow: 0 24px 56px rgba(0,0,0,.35);
}

/* Accent top bar on cards */
.oxh-card-t::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
}
.oxh-card-t-cyan::before   { background: linear-gradient(90deg, var(--oxh-accent), transparent); }
.oxh-card-t-green::before  { background: linear-gradient(90deg, var(--oxh-green),  transparent); }
.oxh-card-t-gold::before   { background: linear-gradient(90deg, var(--oxh-gold),   transparent); }
.oxh-card-t-red::before    { background: linear-gradient(90deg, var(--oxh-red),    transparent); }

/* 2 col card grid */
.oxh-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
/* 3 col card grid */
.oxh-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* Card icon */
.oxh-card-icon {
  font-size: 24px;
  margin-bottom: 14px;
}
.oxh-card-title {
  font-family: var(--oxh-sans);
  font-size: clamp(1.1rem, 1.8vw, 1.25rem);
  font-weight: 700;
  color: var(--oxh-t1);
  margin-bottom: 9px;
  line-height: 1.3;
}
.oxh-card-desc {
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
  color: var(--oxh-t3);
  line-height: 1.7;
}
.oxh-card-desc strong {
  color: var(--oxh-t1);
  font-weight: 700;
}

/* Checklist */
.oxh-check-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.oxh-check-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: var(--oxh-card);
  border: 1px solid var(--oxh-border2);
  border-radius: 12px;
  padding: 18px 20px;
  transition: border-color .25s, transform .3s var(--oxh-ease);
}
.oxh-check-item:hover {
  border-color: rgba(34,217,138,.3);
  transform: translateX(5px);
}
.oxh-check-icon {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--oxh-green-dim);
  border: 1px solid rgba(34,217,138,.25);
  display: grid;
  place-items: center;
  font-size: 11px;
  color: var(--oxh-green);
  flex-shrink: 0;
  margin-top: 1px;
}
.oxh-check-text {
  font-size: clamp(1.05rem, 1.8vw, 1.15rem);
  font-weight: 500;
  color: var(--oxh-t1);
  line-height: 1.6;
}
.oxh-check-text strong { color: #fff; font-weight: 700; }

/* Step list */
.oxh-step-list { display: flex; flex-direction: column; }
.oxh-step-item {
  display: flex;
  gap: 20px;
  padding: 22px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.oxh-step-item:last-child { border-bottom: none; }
.oxh-step-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}
.oxh-step-circle {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: var(--oxh-accent-dim);
  border: 1px solid rgba(0,212,255,.28);
  display: grid;
  place-items: center;
  font-family: var(--oxh-sans);
  font-size: .88rem;
  font-weight: 800;
  color: var(--oxh-accent);
  flex-shrink: 0;
}
.oxh-step-line {
  width: 1px;
  flex: 1;
  min-height: 18px;
  background: linear-gradient(to bottom, rgba(0,212,255,.28), transparent);
  margin: 5px 0;
}
.oxh-step-item:last-child .oxh-step-line { display: none; }
.oxh-step-body { padding-top: 8px; flex: 1; }
.oxh-step-title {
  font-size: clamp(1.15rem, 2vw, 1.35rem);
  font-weight: 700;
  color: var(--oxh-t1);
  margin-bottom: 6px;
}
.oxh-step-desc {
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
  color: var(--oxh-t3);
  line-height: 1.7;
}
.oxh-step-desc strong { color: var(--oxh-t1); font-weight: 700; }

/* Quote block */
.oxh-quote {
  background: rgba(255,92,92,.07);
  border: 1px solid rgba(255,92,92,.22);
  border-left: 4px solid var(--oxh-red);
  border-radius: 0 14px 14px 0;
  padding: 22px 26px;
  margin-top: 24px;
}
.oxh-quote-text {
  font-size: clamp(1.15rem, 2vw, 1.3rem);
  font-weight: 600;
  font-style: italic;
  color: #ffb8b8;
  line-height: 1.65;
}
.oxh-quote-text strong { color: #ffd4d4; }

/* Info callout */
.oxh-callout {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: rgba(0,212,255,.07);
  border: 1px solid rgba(0,212,255,.22);
  border-radius: 14px;
  padding: 20px 22px;
  margin-top: 22px;
}
.oxh-callout-icon { font-size: 20px; flex-shrink: 0; margin-top: 1px; }
.oxh-callout-text {
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
  font-weight: 600;
  color: #a8e6ff;
  line-height: 1.65;
}
.oxh-callout-text strong { color: #fff; }

/* Panel (right side info panel) */
.oxh-panel {
  background: var(--oxh-bg3);
  border: 1px solid var(--oxh-border2);
  border-radius: 20px;
  padding: 30px;
  position: relative;
  overflow: hidden;
}
.oxh-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0,212,255,.05) 0%, transparent 55%);
  pointer-events: none;
}
.oxh-panel-label {
  font-family: var(--oxh-mono);
  font-size: .85rem;
  font-weight: 500;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--oxh-t4);
  margin-bottom: 16px;
}
.oxh-panel-row {
  display: flex;
  align-items: center;
  gap: 13px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 11px;
  padding: 13px 16px;
  margin-bottom: 8px;
  transition: border-color .2s;
}
.oxh-panel-row:last-child { margin-bottom: 0; }
.oxh-panel-row:hover { border-color: rgba(0,212,255,.18); }
.oxh-panel-row-icon {
  width: 36px; height: 36px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  font-size: 16px;
  flex-shrink: 0;
}
.oxh-panel-row-label {
  font-size: clamp(1rem, 1.6vw, 1.1rem);
  font-weight: 600;
  color: var(--oxh-t1);
}
.oxh-panel-row-sub {
  font-size: clamp(.95rem, 1.4vw, .95rem);
  color: var(--oxh-t4);
  margin-top: 1px;
}
.oxh-panel-divider {
  height: 1px;
  background: rgba(255,255,255,.07);
  margin: 18px 0;
}

/* Status badges */
.oxh-badge {
  font-family: var(--oxh-mono);
  font-size: .65rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .8px;
  padding: 4px 11px;
  border-radius: 100px;
  flex-shrink: 0;
}
.oxh-badge-red   { background: var(--oxh-red-dim);   color: #ff9090; border: 1px solid rgba(255,92,92,.22); }
.oxh-badge-gold  { background: var(--oxh-gold-dim);  color: #ffc96a; border: 1px solid rgba(245,166,35,.22); }
.oxh-badge-cyan  { background: var(--oxh-accent-dim);color: #7ee8ff; border: 1px solid rgba(0,212,255,.22); }
.oxh-badge-green { background: var(--oxh-green-dim); color: #6fffba; border: 1px solid rgba(34,217,138,.22); }

/* Stat row */
.oxh-stat-row {
  display: flex;
  justify-content: space-around;
  gap: 12px;
  padding: 20px 0 4px;
}
.oxh-stat { text-align: center; }
.oxh-stat-num {
  font-family: var(--oxh-sans);
  font-size: 2rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: -1px;
  line-height: 1;
  margin-bottom: 5px;
}
.oxh-stat-num .oxh-c { color: var(--oxh-accent); }
.oxh-stat-label {
  font-family: var(--oxh-mono);
  font-size: .82rem;
  font-weight: 500;
  color: var(--oxh-t4);
  text-transform: uppercase;
  letter-spacing: .6px;
}

/* Panel note */
.oxh-panel-note {
  background: rgba(245,166,35,.07);
  border: 1px solid rgba(245,166,35,.18);
  border-radius: 11px;
  padding: 14px 18px;
  margin-top: 16px;
  font-size: clamp(1.05rem, 1.6vw, 1.1rem);
  font-weight: 500;
  font-style: italic;
  color: #ffd080;
  line-height: 1.6;
}

/* ================================================================
   HERO BREADCRUMB SECTION
   (Exact match to uploaded template structure)
================================================================ */
.oxh-hero-sec { position: relative; overflow: hidden; }

.oxh-hero-wrap {
  position: relative;
  min-height: 560px;
  display: flex;
  align-items: center;
  padding: 120px 0 110px;
  background:
    radial-gradient(ellipse 70% 80% at 80% 50%, rgba(0,100,200,.22) 0%, transparent 65%),
    radial-gradient(ellipse 50% 60% at 15% 80%, rgba(0,212,255,.12) 0%, transparent 55%),
    linear-gradient(160deg, #060f22 0%, #0a1628 60%, #0d1e38 100%);
}
/* animated grid */
.oxh-hero-wrap::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--oxh-border) 1px, transparent 1px),
    linear-gradient(90deg, var(--oxh-border) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.5) 40%, rgba(0,0,0,.5) 70%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,.5) 40%, rgba(0,0,0,.5) 70%, transparent 100%);
  animation: oxh-grid 18s linear infinite;
  z-index: 0;
}
/* glowing orb */
.oxh-hero-wrap::after {
  content: '';
  position: absolute;
  width: 520px; height: 520px;
  border-radius: 50%;
  right: -110px; top: -130px;
  background: radial-gradient(circle, rgba(0,212,255,.13) 0%, transparent 65%);
  pointer-events: none;
  z-index: 0;
}
@keyframes oxh-grid {
  from { background-position: 0 0; }
  to   { background-position: 60px 60px; }
}
.oxh-hero-wrap .oxh-wrap { position: relative; z-index: 2; }

.oxh-hero-content { text-align: center; animation: oxh-up .7s ease both; }
@keyframes oxh-up {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: none; }
}

/* Tag pill */
.oxh-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(0,212,255,.08);
  border: 1px solid var(--oxh-border);
  border-radius: 100px;
  padding: 6px 18px 6px 12px;
  font-family: var(--oxh-mono);
  font-size: .88rem;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--oxh-accent);
  margin-bottom: 26px;
  animation: oxh-up .7s .1s ease both;
}
.oxh-pill-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--oxh-accent);
  box-shadow: 0 0 8px var(--oxh-accent);
  animation: oxh-pulse 2s infinite;
  flex-shrink: 0;
}
@keyframes oxh-pulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .4; transform: scale(.65); }
}

/* Hero title */
.oxh-hero-title {
  font-family: var(--oxh-sans);
  font-size: clamp(2.4rem, 5.5vw, 4.2rem);
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  letter-spacing: -1.5px;
  margin-bottom: 0;
  text-shadow: 0 0 60px rgba(0,212,255,.18);
  animation: oxh-up .7s .15s ease both;
}
.oxh-hero-title .oxh-hl {
  background: linear-gradient(90deg, var(--oxh-accent), #60a5fa);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.oxh-hero-title .oxh-hl-red {
  background: linear-gradient(90deg, #ff7070, #ff3f3f);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.oxh-hero-title .oxh-hl-gold {
  background: linear-gradient(90deg, var(--oxh-gold), #ffd080);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Diamond divider */
.oxh-diamond-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 24px auto 22px;
  animation: oxh-up .7s .25s ease both;
}
.oxh-diamond-divider .oxh-dd-line {
  width: 64px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--oxh-accent));
}
.oxh-diamond-divider .oxh-dd-line:last-child {
  background: linear-gradient(90deg, var(--oxh-accent), transparent);
}
.oxh-diamond-divider .oxh-dd-gem {
  width: 9px; height: 9px;
  background: var(--oxh-accent);
  transform: rotate(45deg);
  box-shadow: 0 0 14px var(--oxh-accent);
}

/* Hero subtitle */
.oxh-hero-sub {
  font-family: var(--oxh-sans);
  font-size: clamp(1.15rem, 2vw, 1.3rem);
  font-weight: 400;
  color: var(--oxh-t2);
  max-width: 620px;
  margin: 0 auto 14px;
  line-height: 1.75;
  animation: oxh-up .7s .3s ease both;
}
.oxh-hero-sub2 {
  font-size: clamp(1.05rem, 1.8vw, 1.2rem);
  color: var(--oxh-t3);
  max-width: 600px;
  margin: 0 auto 36px;
  line-height: 1.75;
  animation: oxh-up .7s .36s ease both;
  font-family: var(--oxh-sans);
}

/* Hero CTA button */
.oxh-cta-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  animation: oxh-up .7s .44s ease both;
}
.oxh-btn {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  background: var(--oxh-accent);
  color: #050d1a;
  font-family: var(--oxh-sans);
  font-size: 1.05rem;
  font-weight: 700;
  padding: 18px 40px;
  border-radius: 100px;
  text-decoration: none;
  transition: transform .25s var(--oxh-spring), box-shadow .25s;
  border: none;
  cursor: pointer;
}
.oxh-btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 40px var(--oxh-accent-glow);
  color: #050d1a;
}
.oxh-btn-arr {
  width: 28px; height: 28px;
  background: rgba(5,13,26,.15);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 13px;
  transition: transform .25s var(--oxh-spring);
}
.oxh-btn:hover .oxh-btn-arr { transform: translateX(4px); }

.oxh-btn-ghost {
  background: transparent;
  color: var(--oxh-accent);
  border: 1px solid rgba(0,212,255,.35);
  font-size: 1.05rem;
  padding: 18px 40px;
}
.oxh-btn-ghost:hover {
  background: var(--oxh-accent-dim);
  color: var(--oxh-accent);
}

.oxh-cta-hint {
  font-size: 1rem;
  color: var(--oxh-t3);
}

/* Hero bottom fade */
.oxh-hero-fade {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 80px;
  background: linear-gradient(to bottom, transparent, #050d1a);
  pointer-events: none;
  z-index: 1;
}

/* ================================================================
   CHOOSE YOUR PERSPECTIVE — HOMEPAGE SECTION
================================================================ */
.oxh-persp {
  position: relative;
  padding: 120px 0 140px;
  overflow: hidden;
  background: var(--oxh-bg);
}

/* ambient glow background */
.oxh-persp-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.oxh-persp-bg::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 65% 55% at 50% 0%,   rgba(0,212,255,.09) 0%, transparent 65%),
    radial-gradient(ellipse 40% 50% at 8%  80%,  rgba(34,217,138,.06) 0%, transparent 55%),
    radial-gradient(ellipse 40% 50% at 92% 80%,  rgba(245,166,35,.05) 0%, transparent 55%);
}
.oxh-persp-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(0,212,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,212,255,.035) 1px, transparent 1px);
  background-size: 66px 66px;
  mask-image: radial-gradient(ellipse 90% 70% at 50% 30%, black 0%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 30%, black 0%, transparent 75%);
}

/* centre headline block */
.oxh-persp-center {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 760px;
  margin: 0 auto 80px;
}
.oxh-persp-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--oxh-mono);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--oxh-accent);
  margin-bottom: 26px;
  opacity: 0;
  animation: oxh-up .6s .1s var(--oxh-ease) forwards;
}
.oxh-persp-eyebrow::before, .oxh-persp-eyebrow::after {
  content: '';
  display: block;
  width: 26px; height: 1px;
  background: var(--oxh-accent);
  opacity: .5;
}
.oxh-persp-headline {
  font-family: var(--oxh-sans);
  font-size: clamp(2.6rem, 5.5vw, 4.4rem);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -2px;
  color: #fff;
  margin-bottom: 22px;
  opacity: 0;
  animation: oxh-up .6s .18s var(--oxh-ease) forwards;
}
.oxh-persp-headline em {
  font-style: normal;
  background: linear-gradient(90deg, var(--oxh-accent) 0%, #6dd5ff 50%, var(--oxh-accent) 100%);
  background-size: 200%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: oxh-shimmer 4s linear 1.5s infinite;
}
@keyframes oxh-shimmer {
  0%   { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}
.oxh-persp-sub {
  font-family: var(--oxh-sans);
  font-size: 1.1rem;
  font-weight: 400;
  line-height: 1.75;
  color: var(--oxh-t2);
  max-width: 560px;
  margin: 0 auto;
  opacity: 0;
  animation: oxh-up .6s .26s var(--oxh-ease) forwards;
}

/* cards grid */
.oxh-persp-cards {
  position: relative;
  z-index: 2;
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  padding: 0 36px;
}

/* individual perspective card */
.oxh-pc {
  position: relative;
  border-radius: 24px;
  background: var(--oxh-card);
  border: 1px solid var(--oxh-border2);
  padding: 46px 36px 42px;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  cursor: pointer;
  transition:
    transform .45s var(--oxh-spring),
    border-color .3s,
    box-shadow .3s;
  opacity: 0;
  animation: oxh-card-in .7s var(--oxh-spring) forwards;
}
.oxh-pc:nth-child(1) { animation-delay: .35s; }
.oxh-pc:nth-child(2) { animation-delay: .48s; }
.oxh-pc:nth-child(3) { animation-delay: .61s; }
@keyframes oxh-card-in {
  from { opacity: 0; transform: translateY(55px) scale(.94); }
  to   { opacity: 1; transform: none; }
}

/* colour tokens per card */
.oxh-pc-1 { --pc: #00d4ff; --pc-dim: rgba(0,212,255,.08);  --pc-glow: rgba(0,212,255,.22); }
.oxh-pc-2 { --pc: #22d98a; --pc-dim: rgba(34,217,138,.08); --pc-glow: rgba(34,217,138,.20); }
.oxh-pc-3 { --pc: #f5a623; --pc-dim: rgba(245,166,35,.08); --pc-glow: rgba(245,166,35,.18); }

/* ambient glow inside card */
.oxh-pc::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 55% at 50% -10%, var(--pc-dim) 0%, transparent 65%);
  pointer-events: none;
  z-index: 0;
  transition: opacity .3s;
}
/* glowing top edge */
.oxh-pc::after {
  content: '';
  position: absolute;
  top: 0; left: 18%; right: 18%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--pc), transparent);
  opacity: .5;
  transition: opacity .3s, left .35s var(--oxh-spring), right .35s var(--oxh-spring);
  z-index: 1;
}
.oxh-pc:hover {
  transform: translateY(-12px) scale(1.018);
  border-color: rgba(255,255,255,.13);
  box-shadow: 0 30px 70px rgba(0,0,0,.5), 0 0 0 1px var(--pc-glow);
}
.oxh-pc:hover::before { opacity: 1.6; }
.oxh-pc:hover::after  { left: 8%; right: 8%; opacity: .9; }

/* ghost number */
.oxh-pc-num {
  position: absolute;
  top: 26px; right: 28px;
  font-family: var(--oxh-mono);
  font-size: 5rem;
  font-weight: 500;
  color: var(--pc);
  opacity: .06;
  line-height: 1;
  pointer-events: none;
  z-index: 0;
  transition: opacity .3s;
  user-select: none;
}
.oxh-pc:hover .oxh-pc-num { opacity: .14; }

/* role badge */
.oxh-pc-badge {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--pc-dim);
  border: 1px solid color-mix(in srgb, var(--pc) 28%, transparent);
  border-radius: 100px;
  padding: 6px 14px 6px 10px;
  font-family: var(--oxh-mono);
  font-size: .68rem;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--pc);
  margin-bottom: 30px;
  width: fit-content;
}
.oxh-pc-badge-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--pc);
  box-shadow: 0 0 8px var(--pc);
  animation: oxh-blink 2.5s ease-in-out infinite;
}
@keyframes oxh-blink {
  0%,100% { opacity: 1; }
  50%      { opacity: .3; }
}

/* card role label */
.oxh-pc-role {
  position: relative;
  z-index: 1;
  font-family: var(--oxh-mono);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--oxh-t4);
  margin-bottom: 10px;
}
/* card main heading */
.oxh-pc-title {
  position: relative;
  z-index: 1;
  font-family: var(--oxh-sans);
  font-size: 1.95rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -.7px;
  color: #fff;
  margin-bottom: 22px;
}
/* animated divider under title */
.oxh-pc-divider {
  position: relative;
  z-index: 1;
  width: 36px;
  height: 3px;
  background: var(--pc);
  border-radius: 2px;
  margin-bottom: 22px;
  transition: width .4s var(--oxh-spring);
}
.oxh-pc:hover .oxh-pc-divider { width: 76px; }

/* descriptor */
.oxh-pc-desc {
  position: relative;
  z-index: 1;
  font-family: var(--oxh-sans);
  font-size: .95rem;
  font-weight: 400;
  line-height: 1.72;
  color: var(--oxh-t3);
  margin-bottom: 28px;
  flex: 1;
  transition: color .25s;
}
.oxh-pc:hover .oxh-pc-desc { color: var(--oxh-t2); }

/* bullet points */
.oxh-pc-points {
  position: relative;
  z-index: 1;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 36px;
  padding: 0;
}
.oxh-pc-points li {
  display: flex;
  align-items: center;
  gap: 11px;
  font-family: var(--oxh-sans);
  font-size: .9rem;
  font-weight: 500;
  color: var(--oxh-t2);
  transition: color .2s, transform .25s var(--oxh-ease);
}
.oxh-pc:hover .oxh-pc-points li:nth-child(1) { transition-delay: .02s; transform: translateX(3px); color: #fff; }
.oxh-pc:hover .oxh-pc-points li:nth-child(2) { transition-delay: .06s; transform: translateX(3px); color: #fff; }
.oxh-pc:hover .oxh-pc-points li:nth-child(3) { transition-delay: .10s; transform: translateX(3px); color: #fff; }
.oxh-pc-check {
  width: 20px; height: 20px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--pc-dim);
  border: 1px solid color-mix(in srgb, var(--pc) 28%, transparent);
  display: grid;
  place-items: center;
  font-size: 10px;
  color: var(--pc);
}

/* CTA inside card */
.oxh-pc-cta {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: transparent;
  border: 1px solid color-mix(in srgb, var(--pc) 40%, transparent);
  border-radius: 100px;
  padding: 13px 22px;
  font-family: var(--oxh-sans);
  font-size: .9rem;
  font-weight: 700;
  color: var(--pc);
  text-decoration: none;
  transition:
    background .3s,
    border-color .3s,
    color .3s,
    padding .3s var(--oxh-spring),
    box-shadow .3s,
    transform .3s var(--oxh-spring);
  width: fit-content;
  margin-top: auto;
}
.oxh-pc:hover .oxh-pc-cta {
  background: var(--pc);
  color: #050d1a;
  border-color: var(--pc);
  box-shadow: 0 8px 28px var(--pc-glow);
  padding: 13px 28px;
}
.oxh-pc-cta-arr {
  width: 22px; height: 22px;
  background: color-mix(in srgb, var(--pc) 16%, transparent);
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 11px;
  transition: transform .3s var(--oxh-spring), background .3s;
}
.oxh-pc:hover .oxh-pc-cta .oxh-pc-cta-arr {
  transform: translateX(5px);
  background: rgba(5,13,26,.15);
}

/* bottom bar */
.oxh-persp-footer {
  position: relative;
  z-index: 2;
  max-width: 1180px;
  margin: 44px auto 0;
  padding: 0 36px;
}
.oxh-persp-footer-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 20px 30px;
  background: rgba(255,255,255,.025);
  border: 1px solid var(--oxh-border2);
  border-radius: 14px;
  backdrop-filter: blur(10px);
  flex-wrap: wrap;
}
.oxh-persp-footer-text {
  font-family: var(--oxh-sans);
  font-size: .92rem;
  color: var(--oxh-t3);
}
.oxh-persp-footer-text strong {
  color: var(--oxh-t2);
  font-weight: 600;
}
.oxh-persp-footer-divider {
  width: 1px; height: 20px;
  background: var(--oxh-border2);
  flex-shrink: 0;
}
.oxh-persp-footer-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--oxh-sans);
  font-size: .85rem;
  font-weight: 600;
  color: var(--oxh-accent);
  text-decoration: none;
  opacity: .85;
  transition: opacity .2s;
}
.oxh-persp-footer-link:hover { opacity: 1; }

/* ================================================================
   CTA SECTION (used at bottom of all pages)
================================================================ */
.oxh-cta-section {
  padding: 130px 0;
  background: var(--oxh-bg2);
  position: relative;
  overflow: hidden;
}
.oxh-cta-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 80% at 50% 50%, rgba(0,212,255,.08) 0%, transparent 65%);
}
.oxh-cta-section::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(0,212,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,212,255,.035) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse 75% 75% at 50% 50%, black 0%, transparent 70%);
  -webkit-mask-image: radial-gradient(ellipse 75% 75% at 50% 50%, black 0%, transparent 70%);
}
.oxh-cta-inner {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 660px;
  margin: 0 auto;
}
.oxh-cta-title {
  font-family: var(--oxh-sans);
  font-size: clamp(2.1rem, 4vw, 3.3rem);
  font-weight: 800;
  letter-spacing: -1px;
  line-height: 1.1;
  color: #fff;
  margin-bottom: 20px;
}
.oxh-cta-title .oxh-c { color: var(--oxh-accent); }
.oxh-cta-body {
  font-family: var(--oxh-sans);
  font-size: clamp(1.15rem, 2vw, 1.3rem);
  color: var(--oxh-t3);
  line-height: 1.8;
  margin-bottom: 40px;
}
.oxh-cta-body strong { color: var(--oxh-t1); font-weight: 700; }
.oxh-cta-note {
  margin-top: 20px;
  font-size: 1rem;
  color: var(--oxh-t4);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.oxh-cta-note::before {
  content: '';
  display: inline-block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--oxh-green);
  box-shadow: 0 0 8px var(--oxh-green);
  animation: oxh-pulse 2s infinite;
}

/* ================================================================
   FOOTER
================================================================ */
.oxh-footer {
  padding: 32px 0;
  border-top: 1px solid rgba(255,255,255,.06);
  background: var(--oxh-bg);
}
.oxh-footer-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
}
.oxh-footer-logo {
  font-family: var(--oxh-sans);
  font-size: 1.15rem;
  font-weight: 800;
  color: rgba(255,255,255,.35);
}
.oxh-footer-logo .oxh-c { color: var(--oxh-accent); opacity: .65; }
.oxh-footer-copy { font-size: .8rem; color: var(--oxh-t4); font-family: var(--oxh-sans); }
.oxh-footer-links { display: flex; gap: 22px; }
.oxh-footer-links a {
  font-size: .8rem;
  color: var(--oxh-t4);
  text-decoration: none;
  font-family: var(--oxh-sans);
  transition: color .2s;
}
.oxh-footer-links a:hover { color: var(--oxh-accent); }

/* ================================================================
   RESPONSIVE
================================================================ */
@media (max-width: 1024px) {
  .oxh-two-col      { grid-template-columns: 1fr; gap: 52px; }
  .oxh-grid-2       { grid-template-columns: 1fr 1fr; }
  .oxh-grid-3       { grid-template-columns: 1fr 1fr; }
  .oxh-persp-cards  { grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
  .oxh-persp-footer-inner { flex-direction: column; text-align: center; gap: 10px; }
  .oxh-persp-footer-divider { display: none; }
}
@media (max-width: 768px) {
  .oxh-section      { padding: 72px 0; }
  .oxh-hero-wrap    { padding: 100px 0 90px; }
  .oxh-grid-2       { grid-template-columns: 1fr; }
  .oxh-grid-3       { grid-template-columns: 1fr; }
  .oxh-wrap         { padding: 0 20px; }
  .oxh-persp        { padding: 80px 0 100px; }
  .oxh-persp-cards  { padding: 0 20px; }
  .oxh-persp-footer { padding: 0 20px; }
  .oxh-hero-title   { letter-spacing: -.8px; }
  .oxh-persp-headline { letter-spacing: -1px; }
  .oxh-footer-inner { padding: 0 20px; flex-direction: column; text-align: center; }
}
@media (max-width: 480px) {
  .oxh-btn { width: 100%; justify-content: center; }
  .oxh-pc  { padding: 32px 24px 30px; }
  .oxh-pc-title { font-size: 1.65rem; }
}

  /* ================================================
   OXHEY — PUNCHY QUOTE BLOCK
================================================ */
.oxhq-wrap {
  position: relative;
  background: linear-gradient(135deg, rgba(255,60,60,.12) 0%, rgba(255,30,30,.04) 100%);
  border: 1px solid rgba(255,92,92,.4);
  border-left: 5px solid #ff5c5c;
  border-radius: 0 18px 18px 0;
  padding: 32px 36px 32px 40px;
  margin-top: 28px;
  overflow: hidden;
}

/* giant faded quotation mark behind text */


/* top shimmer line */
.oxhq-wrap::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, #ff5c5c, transparent 70%);
  opacity: .5;
}

.oxhq-mark {
  display: none; /* decorative mark handled by ::before */
}

.oxhq-text {
  font-family: 'Sora', sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
  font-style: italic;
  color: #ffffff;
  line-height: 1.65;
  position: relative;
  z-index: 1;
  margin: 0;
}

.oxhq-text strong {
  font-style: normal;
  font-weight: 800;
  background: linear-gradient(90deg, #ff8080, #ff3030);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}


/* ================================================
   OXHEY — PUNCHY CALLOUT BLOCK
================================================ */
.oxhc-wrap {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  background: linear-gradient(135deg, rgba(0,212,255,.12) 0%, rgba(0,180,220,.04) 100%);
  border: 1px solid rgba(0,212,255,.4);
  border-radius: 18px;
  padding: 28px 30px;
  margin-top: 20px;
  overflow: hidden;
}

/* shimmer line across top */
.oxhc-wrap::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, rgba(0,212,255,.8) 40%, transparent 100%);
}

/* subtle glow bottom-right */
.oxhc-wrap::after {
  content: '';
  position: absolute;
  bottom: -30px; right: -30px;
  width: 160px; height: 160px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,212,255,.08) 0%, transparent 70%);
  pointer-events: none;
}

.oxhc-icon {
  font-size: 32px;
  flex-shrink: 0;
  margin-top: 2px;
  filter: drop-shadow(0 0 10px rgba(0,212,255,.6));
  position: relative;
  z-index: 1;
}

.oxhc-body {
  flex: 1;
  position: relative;
  z-index: 1;
}

.oxhc-heading {
  font-family: 'Sora', sans-serif;
  font-size: 1.35rem;
  font-weight: 800;
  color: #ffffff;
  line-height: 1.3;
  margin-bottom: 8px;
  letter-spacing: -.3px;
}

.oxhc-sub {
  font-family: 'Sora', sans-serif;
  font-size: 1.05rem;
  font-weight: 400;
  color: #a8ddf5;
  line-height: 1.7;
}


.oxhs1 {
  padding: 80px 0;
  background: var(--oxh-bg2);
  position: relative;
  overflow: hidden;
}

/* ambient glow */
.oxhs1::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 80% at 50% 50%, rgba(0,212,255,.07) 0%, transparent 65%),
    radial-gradient(ellipse 50% 60% at 0%  50%, rgba(34,217,138,.05) 0%, transparent 55%),
    radial-gradient(ellipse 50% 60% at 100% 50%, rgba(0,212,255,.04) 0%, transparent 55%);
  pointer-events: none;
}

/* top + bottom border lines */
.oxhs1::after {
  content: "";
  position: absolute;
  inset: 0;
  border-top: 1px solid rgba(0,212,255,.14);
  border-bottom: 1px solid rgba(0,212,255,.14);
  pointer-events: none;
}

.oxhs1-inner {
  position: relative;
  z-index: 2;
  max-width: 90%;
  margin: 0 auto;
  padding: 0 36px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 28px;
}

/* top eyebrow tag */
.oxhs1-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(0,212,255,.08);
  border: 1px solid rgba(0,212,255,.22);
  border-radius: 100px;
  padding: 6px 18px 6px 12px;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--oxh-accent);
}
.oxhs1-tag-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--oxh-accent);
  box-shadow: 0 0 8px var(--oxh-accent);
  animation: oxhs1-pulse 2.2s ease-in-out infinite;
}
@keyframes oxhs1-pulse {
  0%,100% { opacity: 1; }
  50%      { opacity: .3; }
}

/* main statement */
.oxhs1-text {
  font-family: var(--oxh-sans);
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 400;
  color: var(--oxh-t3);
      margin: 0 auto;
}

/* plain emphasis — white */
.oxhs1-text strong {
  color: var(--oxh-t1);
  font-weight: 700;
}

/* financial terms — cyan-to-green gradient */
.oxhs1-fin {
  font-weight: 800;
  background: linear-gradient(90deg, #00d4ff, #22d98a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* bottom accent bar */
.oxhs1-bar {
  width: 56px;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--oxh-accent), var(--oxh-green));
}

@media (max-width: 768px) {
  .oxhs1 { padding: 60px 0; }
  .oxhs1-inner { padding: 0 20px; }
  .oxhs1-text { font-size: 1.35rem; }
}


/* ── STRIP 2 — WHAT BOARDS TRACK ── */
.oxhs2 {
  padding: 80px 0;
  background: var(--oxh-bg);
  position: relative;
  overflow: hidden;
}
.oxhs2::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 60% at 50% 0%, rgba(0,212,255,.06) 0%, transparent 60%);
  pointer-events: none;
}

.oxhs2-inner {
  position: relative;
  z-index: 2;
}

/* header row */
.oxhs2-header {
  margin-bottom: 40px;
}
.oxhs2-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.oxhs2-eyebrow-line {
  width: 26px; height: 2px;
  background: var(--oxh-accent);
  border-radius: 2px;
  flex-shrink: 0;
}
.oxhs2-eyebrow-text {
  font-family: var(--oxh-mono);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--oxh-accent);
}
.oxhs2-title {
  font-family: var(--oxh-sans);
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight: 800;
  color: var(--oxh-t1);
  letter-spacing: -.7px;
  line-height: 1.1;
}

/* two-col layout: metrics left, cadence right */
.oxhs2-layout {
  display: grid;
  grid-template-columns: 1fr 540px;
  gap: 32px;
  align-items: start;
}

/* metric rows */
.oxhs2-metrics {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--oxh-border2);
  border-radius: 16px;
  overflow: hidden;
  background: var(--oxh-card);
}
.oxhs2-metric-row {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 20px 24px;
  border-bottom: 1px solid rgba(255,255,255,.05);
  transition: background .2s;
}
.oxhs2-metric-row:last-child { border-bottom: none; }
.oxhs2-metric-row:hover { background: rgba(255,255,255,.03); }

.oxhs2-metric-dot {
  width: 18px; height: 18px;
  border-radius: 50%;
  flex-shrink: 0;
}
.oxhs2-metric-row:nth-child(1) .oxhs2-metric-dot { background: var(--oxh-green); box-shadow: 0 0 8px rgba(34,217,138,.5); }
.oxhs2-metric-row:nth-child(2) .oxhs2-metric-dot { background: var(--oxh-gold);  box-shadow: 0 0 8px rgba(245,166,35,.5); }
.oxhs2-metric-row:nth-child(3) .oxhs2-metric-dot { background: var(--oxh-accent);box-shadow: 0 0 8px rgba(0,212,255,.5); }
.oxhs2-metric-row:nth-child(4) .oxhs2-metric-dot { background: var(--oxh-red);   box-shadow: 0 0 8px rgba(255,92,92,.5); }

.oxhs2-metric-text {
  font-family: var(--oxh-sans);
  font-size: 1.2rem;
  font-weight: 500;
  color: var(--oxh-t2);
  line-height: 1.5;
}

/* right panel — reporting cadence */
.oxhs2-cadence {
  background: var(--oxh-bg3);
  border: 1px solid var(--oxh-border2);
  border-radius: 16px;
  padding: 28px 26px;
  position: relative;
  overflow: hidden;
}
.oxhs2-cadence::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--oxh-accent), transparent);
}
.oxhs2-cadence-label {
  font-family: var(--oxh-mono);
  font-size: .65rem;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--oxh-t4);
  margin-bottom: 20px;
}
.oxhs2-cadence-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.oxhs2-cadence-row:last-child { border-bottom: none; padding-bottom: 0; }
.oxhs2-cadence-freq {
  font-family: var(--oxh-sans);
  font-size: .92rem;
  font-weight: 600;
  color: var(--oxh-t1);
}
.oxhs2-cadence-what {
  font-family: var(--oxh-sans);
  font-size: .88rem;
  font-weight: 400;
  color: var(--oxh-t4);
  text-align: right;
}

@media (max-width: 860px) {
  .oxhs2-layout { grid-template-columns: 1fr; }
  .oxhs2 { padding: 72px 0; }
}

/* ── STRIP 3 — HOW AI LANDS ── */
.oxhs3 {
  padding: 80px 0;
  background: var(--oxh-bg2);
  position: relative;
  overflow: hidden;
}
.oxhs3::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 65% 80% at 100% 50%, rgba(34,217,138,.05) 0%, transparent 60%);
  pointer-events: none;
}

.oxhs3-inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 600px 1fr;
  gap: 72px;
  align-items: center;
}

/* left — heading block */
.oxhs3-left {}
.oxhs3-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.oxhs3-eyebrow-line {
  width: 26px; height: 2px;
  background: var(--oxh-green);
  border-radius: 2px;
  flex-shrink: 0;
}
.oxhs3-eyebrow-text {
  font-family: var(--oxh-mono);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--oxh-green);
}
.oxhs3-title {
  font-family: var(--oxh-sans);
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  font-weight: 800;
  color: var(--oxh-t1);
  letter-spacing: -.7px;
  line-height: 1.15;
}

/* right — five adoption steps */
.oxhs3-steps {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.oxhs3-step {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 18px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
  transition: padding-left .25s var(--oxh-ease);
}
.oxhs3-step:first-child { padding-top: 0; }
.oxhs3-step:last-child  { border-bottom: none; padding-bottom: 0; }
.oxhs3-step:hover { padding-left: 6px; }

.oxhs3-step-num {
  font-family: var(--oxh-mono);
  font-size: .72rem;
  font-weight: 500;
  color: var(--oxh-t4);
  width: 28px;
  flex-shrink: 0;
  letter-spacing: .5px;
}
.oxhs3-step-line {
  width: 1px;
  height: 22px;
  background: rgba(34,217,138,.25);
  flex-shrink: 0;
}
.oxhs3-step-text {
  font-family: var(--oxh-sans);
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--oxh-t2);
  line-height: 1.5;
  transition: color .2s;
}
.oxhs3-step:hover .oxhs3-step-text { color: var(--oxh-t1); }

@media (max-width: 860px) {
  .oxhs3-inner { grid-template-columns: 1fr; gap: 40px; }
  .oxhs3 { padding: 72px 0; }
}

/* ── Page-specific additions — fcaio- prefix ── */

/* Problem numbered cards */
.fcaio-problems {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 48px;
}
@media(max-width:720px){ .fcaio-problems { grid-template-columns: 1fr; } }

.fcaio-prob {
  background: var(--oxh-card);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px;
  padding: 28px 26px;
  position: relative;
  overflow: hidden;
  transition: border-color .25s, transform .3s var(--oxh-spring);
}
.fcaio-prob:hover { border-color: rgba(255,92,92,.25); transform: translateY(-4px); }
.fcaio-prob-num {
  font-family: var(--oxh-mono);
  font-size: 3.5rem;
  font-weight: 800;
  line-height: 1;
  color: var(--oxh-red);
  opacity: .12;
  position: absolute;
  top: 12px; right: 18px;
  pointer-events: none;
  user-select: none;
}
.fcaio-prob-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--oxh-t1);
  margin-bottom: 8px;
  line-height: 1.35;
}
.fcaio-prob-desc {
  font-size: .95rem;
  color: var(--oxh-t3);
  line-height: 1.7;
}

/* Full-width highlight box */
.fcaio-highlight {
  background: rgba(0,212,255,.05);
  border: 1px solid rgba(0,212,255,.18);
  border-left: 4px solid var(--oxh-accent);
  border-radius: 0 16px 16px 0;
  padding: 28px 32px;
  margin-top: 40px;
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.fcaio-highlight-icon { font-size: 22px; flex-shrink: 0; margin-top: 2px; }
.fcaio-highlight-text {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--oxh-t2);
  line-height: 1.6;
}
.fcaio-highlight-text strong { color: var(--oxh-accent); }

/* Who this is for — roles vs situations */
.fcaio-who-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 48px;
}
@media(max-width:720px){ .fcaio-who-grid { grid-template-columns: 1fr; } }

.fcaio-who-col {
  border-radius: 18px;
  padding: 36px 32px;
}
.fcaio-who-roles {
  background: rgba(0,212,255,.05);
  border: 1px solid rgba(0,212,255,.15);
}
.fcaio-who-situations {
  background: rgba(245,166,35,.05);
  border: 1px solid rgba(245,166,35,.15);
}
.fcaio-who-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
}
.fcaio-who-label {
  font-family: var(--oxh-mono);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.fcaio-who-roles .fcaio-who-label { color: var(--oxh-accent); }
.fcaio-who-situations .fcaio-who-label { color: var(--oxh-gold); }
.fcaio-who-list { display: flex; flex-direction: column; gap: 12px; }
.fcaio-who-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 1rem;
  font-weight: 500;
  color: var(--oxh-t2);
  line-height: 1.45;
}
.fcaio-who-dot { flex-shrink: 0; margin-top: 2px; font-size: 14px; }

/* Service 5-area grid */
.fcaio-areas {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 52px;
}
@media(max-width:860px){ .fcaio-areas { grid-template-columns: repeat(2,1fr); } }
@media(max-width:520px){ .fcaio-areas { grid-template-columns: 1fr; } }

/* Engagement model rows */
.fcaio-eng-rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 48px;
}
.fcaio-eng-row {
  display: flex;
  align-items: center;
  gap: 20px;
  background: var(--oxh-card);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  padding: 20px 24px;
  transition: border-color .25s, transform .25s var(--oxh-ease);
}
.fcaio-eng-row:hover { border-color: rgba(0,212,255,.22); transform: translateX(5px); }
.fcaio-eng-label {
  font-family: var(--oxh-mono);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--oxh-t4);
  min-width: 160px;
  flex-shrink: 0;
}
.fcaio-eng-val {
  font-size: 1rem;
  font-weight: 600;
  color: var(--oxh-t1);
}

/* What you receive — icon rows */
.fcaio-receive {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 48px;
}
.fcaio-receive-item {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  background: var(--oxh-card);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  padding: 22px 24px;
  transition: border-color .25s, transform .25s var(--oxh-ease);
}
.fcaio-receive-item:hover { border-color: rgba(34,217,138,.22); transform: translateX(5px); }
.fcaio-receive-icon {
  width: 42px; height: 42px;
  border-radius: 11px;
  background: rgba(34,217,138,.09);
  border: 1px solid rgba(34,217,138,.18);
  display: grid; place-items: center;
  font-size: 18px; flex-shrink: 0;
}
.fcaio-receive-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--oxh-t1);
  margin-bottom: 5px;
  line-height: 1.3;
}
.fcaio-receive-desc {
  font-size: .95rem;
  color: var(--oxh-t3);
  line-height: 1.65;
}

/* Journey / where it fits — timeline row */
.fcaio-journey {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 20px;
  overflow: hidden;
  margin-top: 52px;
}
@media(max-width:860px){ .fcaio-journey { grid-template-columns: repeat(2,1fr); } }
@media(max-width:480px){ .fcaio-journey { grid-template-columns: 1fr; } }

.fcaio-jstep {
  padding: 36px 28px;
  background: var(--oxh-bg2);
  border-right: 1px solid rgba(255,255,255,.07);
  transition: background .25s;
  position: relative;
}
.fcaio-jstep:last-child { border-right: none; }
.fcaio-jstep:hover { background: var(--oxh-bg3); }
.fcaio-jstep.fcaio-jstep-active {
  background: rgba(0,212,255,.06);
  border-color: rgba(0,212,255,.15);
}
.fcaio-jstep-num {
  font-family: var(--oxh-mono);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--oxh-t4);
  margin-bottom: 10px;
}
.fcaio-jstep.fcaio-jstep-active .fcaio-jstep-num { color: var(--oxh-accent); }
.fcaio-jstep-icon { font-size: 24px; margin-bottom: 12px; display: block; }
.fcaio-jstep-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--oxh-t1);
  line-height: 1.35;
}
.fcaio-jstep.fcaio-jstep-active .fcaio-jstep-title { color: var(--oxh-accent); }
.fcaio-jstep-active-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--oxh-mono);
  font-size: .62rem;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--oxh-accent);
  background: rgba(0,212,255,.08);
  border: 1px solid rgba(0,212,255,.2);
  border-radius: 100px;
  padding: 4px 12px;
  margin-top: 10px;
}

/* Why oxhey — 4 col reasons */
.fcaio-why {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 52px;
}
@media(max-width:860px){ .fcaio-why { grid-template-columns: repeat(2,1fr); } }
@media(max-width:480px){ .fcaio-why { grid-template-columns: 1fr; } }

.fcaio-why-item {
  background: var(--oxh-card);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px;
  padding: 28px 22px;
  transition: border-color .25s, transform .3s var(--oxh-spring);
}
.fcaio-why-item:hover { border-color: rgba(0,212,255,.2); transform: translateY(-4px); }
.fcaio-why-icon { font-size: 26px; margin-bottom: 14px; display: block; }
.fcaio-why-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--oxh-t1);
  margin-bottom: 8px;
  line-height: 1.3;
}
.fcaio-why-desc {
  font-size: .92rem;
  color: var(--oxh-t3);
  line-height: 1.68;
}

/* Section backgrounds */
.fcaio-bg1 { background: var(--oxh-bg); }
.fcaio-bg2 { background: var(--oxh-bg2); }




/* =============================================================
   1. GLOBAL RESETS — prevent horizontal overflow everywhere
   ============================================================= */
 
*,
*::before,
*::after {
  box-sizing: border-box;
}
 
html,
body {
  overflow-x: hidden;
  max-width: 100%;
}
 
img,
video,
iframe {
  max-width: 100%;
  height: auto;
}
 
 
/* =============================================================
   2. ELEMENTOR GLOBAL — sections, containers, columns
   ============================================================= */
 
@media (max-width: 1024px) {
 
  /* Reduce default section padding on tablet */
  .elementor-section.elementor-section-boxed > .elementor-container,
  .e-con-inner {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
 
  .elementor-section > .elementor-container {
    flex-wrap: wrap;
  }
 
  /* Stack columns early on tablet for narrow layouts */
  .elementor-column.elementor-col-50,
  .elementor-column.elementor-col-33,
  .elementor-column.elementor-col-25 {
    width: 50% !important;
  }
}
 
@media (max-width: 767px) {
 
  /* Full-width all columns on mobile */
  .elementor-column,
  .elementor-col-50,
  .elementor-col-33,
  .elementor-col-25,
  .elementor-col-66,
  .elementor-col-75 {
    width: 100% !important;
  }
 
  /* Tighten section vertical padding */
  .elementor-section {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
 
  .elementor-section.elementor-section-boxed > .elementor-container,
  .e-con-inner {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
 
  /* Stack flex children */
  .elementor-section > .elementor-container,
  .elementor-row {
    flex-direction: column !important;
  }
}
 
 
/* =============================================================
   3. NAVIGATION
   ============================================================= */
 
@media (max-width: 1024px) {
 
  /* Shrink nav logo on tablet */
  .elementor-nav-menu .elementor-nav-menu--main {
    gap: 20px;
  }
}
 
@media (max-width: 767px) {
 
  /* Logo sizing on mobile */
  .elementor-widget-site-logo img,
  .site-logo img,
  header .elementor-widget-image img {
    max-width: 140px !important;
    height: auto !important;
  }
 
  /* Nav bar height */
  header.elementor-section,
  .oxh-header,
  #masthead {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }
 
  /* Hide desktop nav links, show hamburger */
  .elementor-nav-menu--layout-horizontal .elementor-nav-menu {
    display: none !important;
  }
 
  .elementor-menu-toggle {
    display: flex !important;
  }
 
  /* "Let's Collaborate" header CTA button — mobile */
  header .elementor-button,
  header .elementor-widget-button .elementor-button {
    padding: 10px 18px !important;
    font-size: 13px !important;
    white-space: nowrap;
  }
}
 
 
/* =============================================================
   4. BUTTONS — the main fix
   All .elementor-button + any oxh- custom button classes
   ============================================================= */
 
/* Base button polish (all screens) */
.elementor-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: normal !important;
  word-break: break-word;
  line-height: 1.35 !important;
  text-align: center !important;
}
 
@media (max-width: 767px) {
 
  /* Full-width buttons inside widget wrapper on mobile */
  .elementor-widget-button .elementor-widget-container,
  .elementor-widget-button {
    width: 100% !important;
  }
 
  .elementor-widget-button .elementor-button-wrapper {
    width: 100% !important;
  }
 
  .elementor-widget-button .elementor-button {
    width: 100% !important;
    justify-content: center !important;
    padding: 14px 20px !important;
    font-size: 14px !important;
    border-radius: 8px !important;
  }
 
  /* Hero primary CTA  */
  .elementor-button.elementor-size-xl,
  .elementor-button.elementor-size-lg {
    padding: 14px 22px !important;
    font-size: 14px !important;
  }
 
  /* "Book a Board Level Value & Risk Review (20 mins)" — long text button */
  .elementor-button[href*="outlook"],
  .elementor-button[href*="book"] {
    font-size: 13px !important;
    padding: 12px 18px !important;
    white-space: normal !important;
    line-height: 1.4 !important;
  }
 
  /* Side-by-side button groups → stack vertically */
  .elementor-button-wrapper + .elementor-button-wrapper,
  .elementor-widget-button + .elementor-widget-button {
    margin-top: 12px !important;
  }
}
 
@media (max-width: 480px) {
 
  .elementor-widget-button .elementor-button {
    font-size: 13px !important;
    padding: 12px 16px !important;
  }
}
 
 
/* =============================================================
   5. HERO SECTION
   ============================================================= */
 
@media (max-width: 1024px) {
 
  /* Reduce hero heading size on tablet */
  .elementor-widget-heading h1.elementor-heading-title {
    font-size: clamp(32px, 5vw, 52px) !important;
    line-height: 1.12 !important;
  }
}
 
@media (max-width: 767px) {
 
  /* Hero section top padding — account for fixed nav */
  section.elementor-section:first-of-type,
  .oxh-hero-section {
    padding-top: 100px !important;
  }
 
  /* Hero heading */
  .elementor-widget-heading h1.elementor-heading-title,
  .elementor-widget-heading .elementor-heading-title[tag="h1"] {
    font-size: clamp(28px, 8vw, 40px) !important;
    line-height: 1.1 !important;
    text-align: left !important;
  }
 
  /* Hero subtext */
  .elementor-widget-text-editor p,
  .elementor-widget-text-editor {
    font-size: 15px !important;
    line-height: 1.7 !important;
  }
 
  /* Hero image — scale down and center */
  .elementor-widget-image img {
    max-width: 100% !important;
    margin: 0 auto !important;
  }
 
  /* Stats row (5K / 25 Years) — side by side, smaller */
  .elementor-widget-counter .elementor-counter-number-wrapper,
  .elementor-counter-number {
    font-size: 36px !important;
  }
 
  .elementor-counter-title {
    font-size: 13px !important;
  }
}
 
 
/* =============================================================
   6. PERSPECTIVE CARDS (Boards / CIO / IT Leaders)
   ============================================================= */
 
@media (max-width: 1024px) {
 
  /* 3-col → 2-col on tablet */
  .elementor-grid.elementor-grid-3 {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
  }
}
 
@media (max-width: 767px) {
 
  /* 2-col → 1-col on mobile */
  .elementor-grid,
  .elementor-grid.elementor-grid-3,
  .elementor-grid.elementor-grid-2 {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
 
  /* Perspective card inner */
  .elementor-posts-container article,
  .elementor-post {
    width: 100% !important;
  }
}
 
 
/* =============================================================
   7. FINANCIAL OUTCOMES / IMAGE + TEXT SPLIT SECTIONS
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Reverse stacking: image goes below text on mobile */
  .elementor-reverse-mobile > .elementor-container > .elementor-row {
    flex-direction: column-reverse !important;
  }
 
  /* Outcome items list */
  .elementor-widget-text-editor ul,
  .elementor-widget-text-editor ol {
    padding-left: 18px !important;
    font-size: 14px !important;
  }
 
  .elementor-widget-text-editor li {
    margin-bottom: 8px !important;
    line-height: 1.65 !important;
  }
}
 
 
/* =============================================================
   8. SIX CAPABILITY BLOCKS (icon boxes / repeater)
   ============================================================= */
 
@media (max-width: 1024px) {
 
  /* 3-col → 2-col */
  .elementor-widget-icon-box .elementor-widget-wrap,
  .elementor-icon-box-wrapper {
    text-align: left !important;
  }
}
 
@media (max-width: 767px) {
 
  /* Icon box full width */
  .elementor-icon-box-wrapper {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 14px !important;
  }
 
  .elementor-icon-box-icon {
    flex-shrink: 0 !important;
  }
 
  .elementor-icon-box-content {
    flex: 1 !important;
  }
 
  .elementor-icon-box-title {
    font-size: 16px !important;
    margin-bottom: 6px !important;
  }
 
  .elementor-icon-box-description {
    font-size: 14px !important;
    line-height: 1.65 !important;
  }
}
 
 
/* =============================================================
   9. AI AGENT SERVICES SECTION
   (alternating image + text blocks)
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Each service block: full width, image above text */
  .elementor-section[id*="service"] > .elementor-container > .elementor-row,
  .elementor-section[id*="aiagent"] > .elementor-container > .elementor-row {
    flex-direction: column !important;
  }
 
  /* Service heading */
  .elementor-widget-heading h2.elementor-heading-title {
    font-size: clamp(22px, 6vw, 32px) !important;
    line-height: 1.2 !important;
  }
 
  h3.elementor-heading-title {
    font-size: clamp(18px, 5vw, 24px) !important;
  }
 
  /* List items inside service sections */
  ul li, ol li {
    font-size: 14px !important;
    line-height: 1.7 !important;
    margin-bottom: 6px !important;
  }
}
 
 
/* =============================================================
   10. BUSINESS BENEFITS SECTION
   (numbered cards with icons)
   ============================================================= */
 
@media (max-width: 1024px) {
 
  /* 3-col → 2-col on tablet — let Elementor handle via custom class if needed */
  .elementor-section[id*="benefit"] .elementor-column {
    width: 50% !important;
  }
}
 
@media (max-width: 767px) {
 
  .elementor-section[id*="benefit"] .elementor-column {
    width: 100% !important;
  }
 
  /* Benefit card padding */
  .elementor-section[id*="benefit"] .elementor-widget-wrap {
    padding: 24px 20px !important;
  }
}
 
 
/* =============================================================
   11. WHY CHOOSE / ACCORDION / TABS
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Accordion titles */
  .elementor-accordion-title {
    font-size: 15px !important;
    line-height: 1.4 !important;
    padding: 14px 16px !important;
  }
 
  .elementor-accordion-content {
    padding: 0 16px 16px !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
  }
 
  /* Tab titles */
  .elementor-tab-title {
    font-size: 13px !important;
    padding: 10px 14px !important;
  }
}
 
 
/* =============================================================
   12. EVENTS SECTION
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Event cards side by side → stacked */
  .elementor-section[id*="event"] .elementor-column,
  .elementor-section[id*="upcoming"] .elementor-column {
    width: 100% !important;
  }
 
  /* Date badge */
  .elementor-section[id*="event"] .elementor-widget-heading .elementor-heading-title {
    font-size: 14px !important;
  }
}
 
 
/* =============================================================
   13. INSIGHTS / BLOG POSTS GRID
   ============================================================= */
 
@media (max-width: 1024px) {
 
  /* 3-col posts → 2-col */
  .elementor-posts-container.elementor-posts--skin-classic {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
 
@media (max-width: 767px) {
 
  /* 2-col → 1-col */
  .elementor-posts-container,
  .elementor-posts-container.elementor-posts--skin-classic,
  .elementor-posts-container.elementor-posts--skin-cards {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
 
  .elementor-post__thumbnail img {
    width: 100% !important;
    height: 220px !important;
    object-fit: cover !important;
  }
 
  .elementor-post__title a {
    font-size: 16px !important;
    line-height: 1.4 !important;
  }
 
  .elementor-post__excerpt p {
    font-size: 13px !important;
  }
}
 
 
/* =============================================================
   14. FAQ SECTION
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Toggle / FAQ accordion */
  .elementor-toggle-title {
    font-size: 14px !important;
    line-height: 1.5 !important;
    padding: 14px 16px !important;
  }
 
  .elementor-toggle-content {
    font-size: 14px !important;
    line-height: 1.7 !important;
    padding: 0 16px 16px !important;
  }
 
  /* FAQ two-column → one column */
  .elementor-section[id*="faq"] .elementor-column {
    width: 100% !important;
  }
}
 
 
/* =============================================================
   15. CONTACT SECTION
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Stack contact info + form */
  .elementor-section[id*="cta"] .elementor-column,
  .elementor-section[id*="contact"] .elementor-column,
  #oxheycta .elementor-column {
    width: 100% !important;
  }
 
  /* Form inputs */
  .elementor-field-group input,
  .elementor-field-group textarea,
  .elementor-field-group select,
  .elementor-form .elementor-field {
    font-size: 15px !important;
    padding: 13px 14px !important;
    width: 100% !important;
  }
 
  /* Form submit button */
  .elementor-form .elementor-button,
  .elementor-field-type-submit .elementor-button {
    width: 100% !important;
    padding: 14px 20px !important;
    font-size: 15px !important;
    justify-content: center !important;
  }
 
  /* Contact details spacing */
  .elementor-icon-list-item {
    margin-bottom: 12px !important;
  }
 
  .elementor-icon-list-text {
    font-size: 14px !important;
  }
}
 
 
/* =============================================================
   16. FOOTER
   ============================================================= */
 
@media (max-width: 1024px) {
 
  /* Footer 4-col → 2-col */
  footer .elementor-column.elementor-col-25 {
    width: 50% !important;
    margin-bottom: 32px !important;
  }
}
 
@media (max-width: 767px) {
 
  /* Footer all columns → full width */
  footer .elementor-column,
  footer .elementor-col-25,
  footer .elementor-col-33,
  footer .elementor-col-50 {
    width: 100% !important;
    margin-bottom: 28px !important;
  }
 
  footer .elementor-section {
    padding-top: 48px !important;
    padding-bottom: 32px !important;
  }
 
  /* Footer logo */
  footer .elementor-widget-image img {
    max-width: 130px !important;
  }
 
  /* Footer nav links */
  footer .elementor-nav-menu .elementor-nav-menu--main {
    flex-direction: column !important;
    gap: 10px !important;
  }
 
  /* Footer bottom bar */
  footer .elementor-widget-text-editor {
    text-align: center !important;
    font-size: 12px !important;
  }
 
  /* Brand logos row — wrap and center */
  footer .elementor-widget-image-gallery .gallery,
  footer .elementor-widget-image .elementor-image {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    justify-content: flex-start !important;
  }
}
 
 
/* =============================================================
   17. POPUP / MODAL (Let's Collaborate)
   ============================================================= */
 
@media (max-width: 767px) {
 
  .dialog-widget-content,
  .elementor-popup-modal .dialog-widget-content {
    width: 92vw !important;
    max-width: 92vw !important;
    padding: 28px 20px !important;
    border-radius: 12px !important;
  }
 
  .elementor-popup-modal .elementor-button {
    width: 100% !important;
    justify-content: center !important;
  }
 
  .dialog-close-button {
    top: 12px !important;
    right: 12px !important;
  }
}
 
 
/* =============================================================
   18. TYPOGRAPHY — global scaling on mobile
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Headings */
  .elementor-widget-heading h2.elementor-heading-title {
    font-size: clamp(22px, 6vw, 34px) !important;
    line-height: 1.2 !important;
  }
 
  .elementor-widget-heading h3.elementor-heading-title {
    font-size: clamp(18px, 5vw, 26px) !important;
    line-height: 1.25 !important;
  }
 
  .elementor-widget-heading h4.elementor-heading-title {
    font-size: clamp(16px, 4.5vw, 20px) !important;
  }
 
  /* Body text */
  p, .elementor-widget-text-editor p {
    font-size: 15px !important;
    line-height: 1.72 !important;
  }
 
  /* Small label / eyebrow text */
  .elementor-widget-heading .elementor-heading-title[class*="eyebrow"],
  .elementor-widget-heading .elementor-heading-title[style*="letter-spacing"] {
    font-size: 11px !important;
    letter-spacing: 0.12em !important;
  }
}
 
@media (max-width: 480px) {
 
  .elementor-widget-heading h2.elementor-heading-title {
    font-size: 22px !important;
  }
 
  .elementor-widget-heading h3.elementor-heading-title {
    font-size: 19px !important;
  }
 
  p, .elementor-widget-text-editor p {
    font-size: 14px !important;
  }
}
 
 
/* =============================================================
   19. SPACING HELPERS — fix collapsed margins on mobile
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Remove excessive top/bottom margins that blow up on mobile */
  .elementor-widget-wrap {
    padding: 20px 16px !important;
  }
 
  /* But don't collapse the hero section widget wrap */
  section:first-of-type .elementor-widget-wrap {
    padding: 0 !important;
  }
 
  /* Spacing between stacked columns */
  .elementor-column + .elementor-column {
    margin-top: 24px !important;
  }
 
  /* Dividers */
  .elementor-divider {
    margin-top: 32px !important;
    margin-bottom: 32px !important;
  }
 
  /* Counter widgets side by side — keep them in a row */
  .elementor-widget-counter {
    display: inline-block !important;
    width: auto !important;
    min-width: 80px !important;
    text-align: center !important;
  }
}
 
 
/* =============================================================
   20. PRELOADER
   ============================================================= */
 
@media (max-width: 767px) {
 
  #preloader img,
  .oxh-preloader img {
    max-width: 80px !important;
  }
}
 
 
/* =============================================================
   21. SCROLL TO TOP BUTTON
   ============================================================= */
 
#scrollTop,
.scrollTop,
a[href="#"] {
  /* prevent the bare # link from overlapping content on mobile */
}
 
@media (max-width: 767px) {
 
  #scrollTop {
    bottom: 20px !important;
    right: 16px !important;
    width: 40px !important;
    height: 40px !important;
    font-size: 16px !important;
  }
}
 
 
/* =============================================================
   22. SHAPE / DECORATIVE IMAGES
   ============================================================= */
 
@media (max-width: 767px) {
 
  /* Hide decorative shapes that cause overflow on mobile */
  .elementor-widget-image img[alt="List"],
  .elementor-widget-image img[src*="shape"],
  .elementor-widget-image img[src*="Shape"] {
    display: none !important;
  }
}

#page-loader {
  position: fixed;
  width: 100%;
  height: 100%;
  background: #f5f5f5;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.loader-text span {
  font-size: 48px;
  font-weight: 700;
  color: #ccc;
  opacity: 0;
  display: inline-block;
  animation: letterAnim 1.5s ease forwards;
}

.loader-text span:nth-child(1) { animation-delay: 0.1s; }
.loader-text span:nth-child(2) { animation-delay: 0.2s; }
.loader-text span:nth-child(3) { animation-delay: 0.3s; }
.loader-text span:nth-child(4) { animation-delay: 0.4s; }
.loader-text span:nth-child(5) { animation-delay: 0.5s; }
.loader-text span:nth-child(6) { animation-delay: 0.6s; }

@keyframes letterAnim {
  0% {
    opacity: 0;
    transform: translateY(20px);
    color: #ccc;
  }
  50% {
    opacity: 1;
    transform: translateY(0);
    color: #6a0dad;
  }
  100% {
    opacity: 1;
    color: #6a0dad;
  }
}