/* Hero sub-heading */
.oh-hero-subtext{
  font-family:'Kumbh Sans',sans-serif !important; font-weight:600; font-size:15px;
  color:var(--accent) !important; letter-spacing:0.5px; text-align:center;
  margin:0 auto 6px !important;
}

/* ===== SERVICES DARK SECTION ===== */
.oh-services-wrap{
  background:#0A0A14 !important;
  position:relative; overflow:visible !important; padding-bottom:220px !important;
}
.oh-services-wrap::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(50% 60% at 50% 30%, rgba(41,38,114,0.35), transparent 70%),
    radial-gradient(30% 40% at 80% 70%, rgba(27,197,189,0.1), transparent 60%);
}
/* Curved bottom edge — concave arc flowing into the next section */
.oh-services-wrap::after{
  content:""; position:absolute; left:-5%; right:-5%; bottom:-1px; height:120px; z-index:2;
  background:var(--bg);
  border-radius:50% 50% 0 0 / 100% 100% 0 0;
}
.oh-services-wrap > *{ position:relative; z-index:3; }
.oh-services-wrap h2{ color:#fff !important; font-family:'Kumbh Sans',sans-serif !important; }

/* Glass cards on dark */
.oh-services-wrap .oh-card{
  background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.1);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  height:auto !important;
}
.oh-services-wrap .oh-card h3{ color:#fff !important; font-family:'Kumbh Sans',sans-serif !important; }
.oh-services-wrap .oh-card p{ color:rgba(255,255,255,0.62) !important; }
.oh-services-wrap .oh-card:hover{
  background:rgba(255,255,255,0.1); border-color:rgba(27,197,189,0.5);
  box-shadow:0 20px 50px rgba(27,197,189,0.2), 0 0 80px rgba(27,197,189,0.08);
}
.oh-services-wrap .oh-card-link{ color:var(--accent) !important; }

/* Featured 2-col (SEO + Web Design) */
.oh-hero-services{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:20px; }
@media (max-width:700px){ .oh-hero-services{ grid-template-columns:1fr; } }
.oh-hero-services .oh-card{
  padding:30px 28px !important;
  background:rgba(27,197,189,0.1) !important; border-color:rgba(27,197,189,0.35) !important;
  box-shadow:0 8px 30px rgba(27,197,189,0.15) !important;
}
.oh-hero-services .oh-card h3{ font-size:20px !important; margin-bottom:8px; font-family:'Kumbh Sans',sans-serif !important; }
.oh-hero-services .oh-card p{ font-size:14px !important; line-height:1.6; }
.oh-hero-services .oh-card:hover{
  box-shadow:0 20px 50px rgba(27,197,189,0.3), 0 0 80px rgba(27,197,189,0.12) !important;
  border-color:rgba(27,197,189,0.6) !important;
}

/* Compact 5-col grid */
.oh-services-grid{ display:grid; grid-template-columns:repeat(5, 1fr); gap:16px; }
@media (max-width:1000px){ .oh-services-grid{ grid-template-columns:repeat(3, 1fr); } }
@media (max-width:600px){ .oh-services-grid{ grid-template-columns:repeat(2, 1fr); } }
.oh-services-grid .oh-card{ padding:20px 18px !important; }
.oh-services-grid .oh-card h3{ font-size:15px !important; font-family:'Kumbh Sans',sans-serif !important; }
.oh-services-grid .oh-card p{ font-size:12.5px !important; }

/* ===== 3-STAGE PROCESS (Audit / Opportunity / Action) ===== */
.oh-promise-top{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:end; max-width:1200px; margin:0 auto 50px; }
.oh-promise-label{ margin-bottom:18px; font-family:'Kumbh Sans',sans-serif !important; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--accent-2); }
.oh-promise-top h2{ font-family:'Kumbh Sans',sans-serif !important; font-size:clamp(34px,4vw,52px); font-weight:800; line-height:1.08; color:var(--ink); margin:0; letter-spacing:-0.5px; }
.oh-promise-top h2 span{ color:var(--accent-2); }
.oh-promise-top p{ color:#5b5b70; font-size:16.5px; line-height:1.7; margin:0; }
@media (max-width:820px){ .oh-promise-top{ grid-template-columns:1fr; gap:20px; } }

.oh-promise-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; max-width:1200px; margin:0 auto; }
@media (max-width:820px){ .oh-promise-cards{ grid-template-columns:1fr; } }
.oh-promise-card{
  background:#fff; border:1px solid rgba(20,20,43,0.08); border-radius:22px; padding:34px 30px;
  display:flex; flex-direction:column; position:relative; overflow:hidden;
  transition:transform .35s ease, box-shadow .35s ease; cursor:default;
}
.oh-promise-card::after{
  content:""; position:absolute; bottom:-40px; right:-40px; width:180px; height:180px;
  border-radius:50%; background:rgba(41,38,114,0.04);
}
.oh-promise-card:hover{ transform:translateY(-6px); box-shadow:0 20px 50px rgba(20,20,43,0.1); }
.oh-promise-card > *{ position:relative; z-index:1; }
.oh-promise-num{ font-family:'Kumbh Sans',sans-serif !important; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--accent-2); margin-bottom:22px; }
.oh-promise-icon{
  width:44px; height:44px; border-radius:12px; background:rgba(41,38,114,0.07);
  display:flex; align-items:center; justify-content:center; margin-bottom:22px;
  color:var(--accent-2);
}
.oh-promise-icon svg{ width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.oh-promise-card h3{ font-family:'Kumbh Sans',sans-serif !important; font-size:28px; font-weight:800; color:var(--ink); margin:0 0 14px; letter-spacing:-0.3px; }
.oh-promise-card p{ color:#5b5b70; font-size:14.5px; line-height:1.6; margin:0; }


/* ===== FEATURED SERVICES: SEO hero + Web Design ===== */
.oh-featured-services{ display:grid; grid-template-columns:1.6fr 1fr; gap:20px; margin-bottom:20px; }
@media (max-width:700px){ .oh-featured-services{ grid-template-columns:1fr; } }

.oh-seo-hero-card{
  position:relative; display:block; text-decoration:none !important; cursor:pointer;
  background:#0A0A14;
  border:1px solid rgba(27,197,189,0.25); border-radius:20px; overflow:hidden;
  padding:36px 32px; min-height:220px;
  transition:transform .35s ease, box-shadow .35s ease;
}
.oh-seo-hero-card::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(50% 60% at 70% 20%, rgba(41,38,114,0.4), transparent 65%),
    radial-gradient(30% 40% at 15% 80%, rgba(27,197,189,0.12), transparent 55%);
}
.oh-seo-hero-card:hover{ transform:translateY(-6px); box-shadow:0 24px 60px rgba(27,197,189,0.25), 0 0 80px rgba(27,197,189,0.1); }
.oh-seo-hero-inner{ position:relative; z-index:1; }
.oh-seo-hero-card h3{ font-family:'Kumbh Sans',sans-serif !important; font-size:26px; font-weight:800; color:#fff; margin:0 0 14px; }
.oh-seo-hero-card p{ color:rgba(255,255,255,0.7); font-size:15px; line-height:1.65; margin:0; max-width:520px; }
.oh-seo-hero-arrow{
  position:absolute; bottom:28px; right:28px; width:44px; height:44px; border-radius:50%;
  background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.15);
  display:flex; align-items:center; justify-content:center; color:#fff;
  transition:background .3s ease, transform .3s ease;
}
.oh-seo-hero-card:hover .oh-seo-hero-arrow{ background:var(--accent); color:#06231F; transform:rotate(45deg); }

.oh-wd-card{
  padding:30px 28px !important;
  background:rgba(27,197,189,0.1) !important; border-color:rgba(27,197,189,0.35) !important;
  box-shadow:0 8px 30px rgba(27,197,189,0.15) !important; height:auto !important;
}
.oh-wd-card h3{ font-size:20px !important; margin-bottom:8px; font-family:'Kumbh Sans',sans-serif !important; color:#fff !important; }
.oh-wd-card p{ font-size:14px !important; line-height:1.6; color:rgba(255,255,255,0.62) !important; }
.oh-wd-card:hover{
  box-shadow:0 20px 50px rgba(27,197,189,0.3), 0 0 80px rgba(27,197,189,0.12) !important;
  border-color:rgba(27,197,189,0.6) !important;
}
.oh-wd-card .oh-card-link{ color:var(--accent) !important; }


/* ===== INTERACTIVE QUIZ ===== */
.oh-quiz{ max-width:860px; margin:0 auto; }
.oh-quiz-progress{ text-align:center; margin-bottom:36px; }
.oh-quiz-step-label{ font-family:'Kumbh Sans',sans-serif; font-size:14px; font-weight:600; color:var(--accent); display:block; margin-bottom:12px; }
.oh-quiz-bar{ height:4px; background:rgba(20,20,43,0.08); border-radius:99px; display:flex; gap:8px; overflow:hidden; }
.oh-quiz-bar-fill{ height:100%; background:var(--accent); border-radius:99px; transition:width .4s ease; }

.oh-quiz-step{ display:none; }
.oh-quiz-step.active{ display:block; animation:ohFadeIn .35s ease; }
@keyframes ohFadeIn{ from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
.oh-quiz-step h2{ font-family:'Kumbh Sans',sans-serif; font-size:clamp(24px,3vw,32px); font-weight:800; color:var(--ink); text-align:center; margin:0 0 8px; }
.oh-quiz-sub{ text-align:center; color:#5b5b70; font-size:15px; margin:0 0 32px; }
.oh-quiz-almost{ text-align:center; font-family:'Kumbh Sans',sans-serif; font-size:14px; font-weight:600; color:var(--accent); margin:0 0 8px; }

.oh-quiz-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:30px; }
@media (max-width:600px){ .oh-quiz-grid{ grid-template-columns:1fr 1fr; } }
.oh-quiz-grid-budget{ grid-template-columns:repeat(4,1fr); }
@media (max-width:700px){ .oh-quiz-grid-budget{ grid-template-columns:1fr 1fr; } }

.oh-quiz-card{
  display:flex; flex-direction:column; align-items:flex-start; gap:6px;
  padding:22px 20px; border-radius:16px; border:1.5px solid rgba(20,20,43,0.06);
  background:rgba(20,20,43,0.04); cursor:pointer; text-align:left; font-family:'Figtree',sans-serif;
  transition:border-color .3s ease, background .3s ease, box-shadow .3s ease, transform .25s ease;
  position:relative; overflow:hidden;
}
.oh-quiz-card:hover{ border-color:rgba(20,20,43,0.15); transform:translateY(-2px); box-shadow:0 8px 24px rgba(20,20,43,0.06); }
.oh-quiz-card.selected{
  border-color:rgba(27,197,189,0.4) !important; background:#0A0A14 !important;
  box-shadow:0 8px 30px rgba(10,10,20,0.2);
}
.oh-quiz-card.selected strong{ color:#fff !important; }
.oh-quiz-card.selected .oh-qc-desc{ color:rgba(255,255,255,0.5) !important; }

/* Glow flash animation on click */
@keyframes ohCardGlow{
  0%{ opacity:0.8; transform:scale(0.3); }
  50%{ opacity:0.4; }
  100%{ opacity:0; transform:scale(3); }
}
.oh-quiz-card.oh-quiz-glow::after{
  content:''; position:absolute; top:50%; left:50%; width:120px; height:120px;
  margin:-60px 0 0 -60px; border-radius:50%;
  background:radial-gradient(circle, rgba(27,197,189,0.5), transparent 65%);
  animation:ohCardGlow 0.7s ease-out forwards; pointer-events:none;
}

.oh-qc-icon{ color:var(--accent-2); margin-bottom:4px; transition:color .3s; }
.oh-quiz-card.selected .oh-qc-icon{ color:var(--accent) !important; }
.oh-quiz-card strong{ font-family:'Kumbh Sans',sans-serif; font-size:16px; font-weight:700; color:var(--ink); transition:color .3s; }
.oh-qc-desc{ font-size:13px; color:#5b5b70; line-height:1.4; }

.oh-quiz-nav{ display:flex; justify-content:center; gap:14px; margin-top:10px; }
.oh-quiz-btn{
  font-family:'Kumbh Sans',sans-serif; font-weight:700; font-size:14px; padding:14px 32px;
  border-radius:999px; border:none; cursor:pointer; transition:transform .25s, box-shadow .25s;
}
.oh-quiz-next{ background:var(--accent); color:#06231F; }
.oh-quiz-next:hover{ transform:translateY(-2px); box-shadow:0 8px 24px rgba(27,197,189,0.3); }
.oh-quiz-back{ background:transparent; color:var(--ink); border:1.5px solid rgba(20,20,43,0.15) !important; }
.oh-quiz-back:hover{ border-color:var(--ink) !important; }

.oh-quiz-form{ max-width:500px; margin:0 auto; display:flex; flex-direction:column; gap:14px; }
.oh-quiz-form input, .oh-quiz-form textarea{
  width:100%; padding:14px 18px; border-radius:12px; border:1.5px solid rgba(20,20,43,0.12);
  font-family:'Figtree',sans-serif; font-size:15px; background:#fff; outline:none;
  transition:border-color .2s; box-sizing:border-box;
}
.oh-quiz-form input:focus, .oh-quiz-form textarea:focus{ border-color:var(--accent); }
.oh-quiz-form textarea{ min-height:120px; resize:vertical; }
.oh-quiz-form button{
  width:100%; background:var(--accent); color:#06231F; font-family:'Kumbh Sans',sans-serif;
  font-weight:700; font-size:15px; padding:16px; border:none; border-radius:12px;
  cursor:pointer; transition:box-shadow .25s ease, transform .25s ease; margin-top:4px;
}
.oh-quiz-form button:hover{ box-shadow:0 0 24px 4px rgba(27,197,189,0.4); transform:translateY(-2px); }

/* Latest insights section spacing */
.oh-latest-insights{ padding:80px 6vw 90px; }

/* Tighten gap between split section and quiz on mobile */
@media(max-width:781px){
  .oh-quiz-wrap{ padding-top:40px !important; padding-bottom:50px !important; }
}
