/*
Theme Name: Nexora Digital
Theme URI: https://nexoradigital.com
Author: Nexora Digital
Author URI: https://nexoradigital.com
Description: A performance-first digital agency WordPress theme for Nexora Digital. Full-page design with hero, services, testimonials, case studies, and contact sections.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nexora
Tags: one-column, two-columns, custom-header, custom-menu, featured-images, footer-widgets, full-width-template, rtl-language-support, threaded-comments, translation-ready
*/

/* ================================================
   NEXORA DIGITAL - MAIN STYLESHEET
   ================================================ */

:root{
  --bg: #0b0f19;
  --surface: #0f1525;
  --muted: #9aa3b2;
  --text: #e6e9ef;
  --primary: #6ee7ff;
  --primary-2: #a78bfa;
  --accent: #22d3ee;
  --card: #101828;
  --ring: rgba(110,231,255,.25);
  --success: #34d399;
  --warning: #f59e0b;
  --danger: #f87171;
  --radius: 16px;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  background: radial-gradient(1200px 600px at 10% -10%, rgba(110,231,255,.06), transparent),
              radial-gradient(800px 600px at 90% 110%, rgba(167,139,250,.06), transparent),
              var(--bg);
  color: var(--text);
  line-height: 1.6;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{width:min(1100px, 92%);margin-inline:auto}
.section-head{margin-bottom: 1.2rem}
.section-head h2{font-size: clamp(1.6rem, 3vw, 2rem);margin:0 0 .2rem}
.section-head p{margin:0}

/* ---- HEADER / NAV ---- */
.site-header{
  position: sticky; top:0; z-index: 20;
  backdrop-filter: blur(10px);
  background: rgba(11,15,25,.6); border-bottom: 1px solid rgba(255,255,255,.06);
}
.site-header .nav{display:flex;align-items:center;gap:1rem; padding: .75rem 0;}
.brand {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-weight: 700;
  font-size: 1.5rem;
}
.brand .logo{width:40px;height:40px}
.main-nav{display:flex;gap:1rem;margin-left:auto}
.main-nav a{opacity:.9}
.cta{margin-left:.5rem}
.nav-toggle{display:none;background:none;border:none;color:var(--text);font-size:1.4rem}
@media (max-width: 860px){
  .main-nav{display:none}
  .nav-toggle{display:block;margin-left:auto}
}

/* ---- BUTTONS ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.8rem 1rem;border-radius: var(--radius); border:1px solid rgba(255,255,255,.1);
  box-shadow: var(--shadow); font-weight:600; cursor:pointer
}
.btn.small{padding:.55rem .8rem;font-size:.9rem}
.btn.block{display:flex;width:100%}
.btn-primary{background: linear-gradient(90deg, var(--primary), var(--primary-2)); color:#0b0f19; border-color: transparent}
.btn-pr{background: linear-gradient(90deg, var(--primary), var(--primary-2)); color:#0b0f19; border-color: transparent}
.btn-outline{background: transparent; border-color: rgba(255,255,255,.25)}
.btn-ghost{background: rgba(255,255,255,.06)}
.form-btn {
  text-align: center;
  margin-top: 15px;
}

/* ---- UTILITY ---- */
.muted{color: var(--muted)}
.tiny{font-size:.85rem}
.eyebrow{font-size:.9rem;color:var(--accent);font-weight:700;letter-spacing:.04em;text-transform:uppercase}

/* ---- HERO ---- */
.hero{padding: 3rem 0 1rem;border-bottom:1px solid rgba(255,255,255,.06)}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr; gap:2rem; align-items:center}
.hero h1{font-size: clamp(2rem, 5vw, 3rem); line-height:1.15; margin: .3rem 0 1rem}
.hero .gradient{background: linear-gradient(90deg, var(--primary), var(--primary-2)); -webkit-background-clip:text; background-clip:text; color: transparent}
.hero-card .card{padding:1.2rem;border-radius: var(--radius); background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.1)}
.checklist{list-style:none;margin:.8rem 0 1rem;padding-left:0}
.checklist li{position:relative;padding-left:1.4rem;margin:.2rem 0}
.checklist li:before{content:"✓";position:absolute;left:0;top:0;color:var(--success);font-weight:800}

.trust{display:flex;gap:.6rem;opacity:.85;margin-top:1rem;flex-wrap:wrap }
.media-section {
  padding: 1.2rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, .06);
}
.media-section .container {
  display: flex;
  gap: 20px;
}
.media-item {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.media-item img,
.media-item video {
  width: 100%;
  height: 300px;
  object-fit: cover;
  border-radius: 8px;
}

/* ---- HIGHLIGHTS / TICKER ---- */
.highlights {
  padding: 2rem 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.news-ticker {
  overflow: hidden;
  white-space: nowrap;
  background: rgba(110,231,255,.1);
  border: 1px solid rgba(21, 21, 21, 0.3);
  border-radius: 8px;
  color: var(--primary);
  font-weight: 600;
  padding: 0.6rem 0;
  margin-bottom: 1rem;
  position: relative;
}
.news-ticker span {
  display: inline-block;
  padding-right: 2rem;
  animation: ticker 25s linear infinite;
}
@keyframes ticker {
  0%   { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}

/* ---- ABOUT HIGHLIGHT ---- */
.about-highlight {
  padding: 2rem 0;
  background: rgba(255, 255, 255, 0.03);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.about-highlight h2 {
  font-size: clamp(1.8rem, 4vw, 2.2rem);
  background: linear-gradient(90deg, var(--primary), var(--primary-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin-bottom: 1rem;
  line-height: 1.3;
}
.about-highlight p {
  font-size: 1rem;
  color: var(--text);
  line-height: 1.6;
}

/* ---- IMAGE TEXT SECTION ---- */
.image-text-section {
  padding: 2rem 0;
  background-color: rgba(255, 255, 255, 0.03);
  border-radius: 8px;
}
.image-text-section .container {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  align-items: center;
}
.image-column {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.image-column .top-img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  border-radius: 8px;
}
.bottom-images {
  display: flex;
  gap: 1rem;
}
.bottom-images img {
  flex: 1;
  width:50%;
  height: 190px;
  object-fit: cover;
  border-radius: 8px;
}
.text-column {
  flex: 1;
}
.text-column h2 {
  font-size: clamp(1.8rem, 4vw, 2.2rem);
  background: linear-gradient(90deg, var(--primary), var(--primary-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin-bottom: 1rem;
}
.text-column p {
  font-size: 1rem;
  color: var(--text);
  line-height: 1.6;
}
.center-button {
  text-align: center;
  margin: 2rem 0;
}
.center-button .btn{background: linear-gradient(90deg, var(--primary), var(--primary-2)); color:#0b0f19; border-color: transparent}
.center-button .btn:hover {
  background-color: #062047;
}

/* ---- ABOUT NEXORA ---- */
.about-nexora {
  background-color: rgba(255, 255, 255, 0.03);
  color: #fff;
  padding: 3rem 1rem;
}
.about-nexora h2 {
  text-align: center;
  color: var(--primary);
  font-size: 2rem;
  margin-bottom: 1rem;
}
.about-item h3 {
  font-size: 1.25rem;
  color: var(--primary);
  margin-bottom: 0.5rem;
  transition: transform 0.3s ease, color 0.3s ease;
  display: inline-block;
}
.about-nexora .about-item h3:hover {
  transform: translateY(-5px) scale(1.05);
  color: #fff;
}

/* ---- MEDIA SHOWCASE ---- */
.media-showcase {
  background-color: rgba(255, 255, 255, 0.03);
  padding: 3rem 1rem;
  color: #fff;
}
.media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: 2rem;
  align-items: center;
}
.media-video video {
  width: 100%;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}
.media-images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 1rem;
}
.media-images img:first-child {
  grid-column: span 2;
}
.media-images img {
  width: 100%;
  border-radius: 8px;
  object-fit: cover;
  box-shadow: 0 4px 8px rgba(0,0,0,0.3);
  transition: transform 0.3s ease;
}
.media-images img:hover {
  transform: scale(1.05);
}

/* ---- LAYOUT HELPERS ---- */
.row{display:flex;gap:2.2rem}
.wrap{flex-wrap:wrap}
.center{justify-content:center;align-items:center}
.card-img {
  width: 20%;
  height: 60px;
  object-fit: cover;
  border-radius: 8px;
  margin-bottom: 1rem;
}
.link-arrow {
  display: inline-block;
  margin-top: 1rem;
  margin-left: 5rem;
  padding: 0.6rem 1.8rem;
  background: linear-gradient(90deg, #0a2463, #5c67f2);
  color: #fff;
  border-radius: 999px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  transition: 0.3s ease, transform 0.3s ease;
}
.link-arrow:hover {
  background: linear-gradient(90deg, #5c67f2, #0a2463);
  transform: scale(1.05);
}

/* ---- CARDS ---- */
.cards{gap:1rem}
.card{padding:1rem;border-radius:var(--radius);background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); border:1px solid rgba(255,255,255,.08)}
.card.link{transition: transform .2s ease, border-color .2s ease}
.card.link:hover{transform: translateY(-2px); border-color: rgba(110,231,255,.5)}
.tag{display:inline-block;font-size:.75rem;padding:.22rem .48rem;border-radius:999px;background:rgba(110,231,255,.15);border:1px solid rgba(110,231,255,.4); margin-bottom:.6rem; color: var(--primary)}

/* ---- SERVICES ---- */
.services{padding:2.5rem 0;background:rgba(255, 255, 255, 0.03)}
.services p{
  font-size: 1rem;
  color: var(--text);
  line-height: 1.6;
}
.services h2 {
  font-size: clamp(1.8rem, 4vw, 2.2rem);
  background: linear-gradient(90deg, var(--primary), var(--primary-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin-bottom: 1rem;
  text-align: center;
}
.services .card {
  position: relative;
  padding-top: 60px;
}
.services .card i {
  position: absolute;
  top: 20px;
  left: 20px;
  font-size: 2rem;
  color: #2196F3;
  background: #e3f2fd;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}
.services .card:hover i {
  background: #2196F3;
  color: white;
  transform: scale(1.1);
}

/* ---- GRIDS ---- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem}
@media (max-width: 860px){
  .hero-grid{grid-template-columns:1fr}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:1fr}
  .grid-2{grid-template-columns:1fr}
}

/* ---- PROCESS ---- */
.link{color: var(--text)}
.process{padding:2.5rem 0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}
.steps .step{padding:1rem;border-radius:var(--radius);background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.steps .num{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:999px;background:rgba(167,139,250,.2);border:1px solid rgba(167,139,250,.5); color:#fff; font-weight:800; margin-bottom:.4rem}

/* ---- CASE STUDIES ---- */
.case-studies{padding:2.5rem 0}
.slider{display:grid;grid-auto-flow:column;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory}
.slide{scroll-snap-align:start;min-width:300px;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:1rem;background:rgba(255,255,255,.04)}
.quote{font-size:1.05rem;font-weight:600}

/* ---- TESTIMONIALS ---- */
.testimonials {
  background-color:rgba(255, 255, 255, 0.03);
  padding: 4rem 1rem;
  overflow: hidden;
}
.section-head h2 {
  font-size: clamp(1.8rem, 4vw, 2.2rem);
  background: linear-gradient(90deg, var(--primary), var(--primary-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin-bottom: 1rem;
  line-height: 1.3;
}
.section-head {
  text-align: center;
  margin-bottom: 2rem;
}
.reviews-marquee {
  width: 100%;
  overflow: hidden;
  position: relative;
}
.marquee-track {
  display: flex;
  gap: 2rem;
  animation: scroll 30s linear infinite;
  align-items: flex-start;
}
.review-card {
  width: 280px;
  background:rgba(255, 255, 255, 0.03);
  padding: 1rem;
  border-radius: 12px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  text-align: center;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.review-card p {
  font-style: italic;
  color: white;
  line-height: 1.4;
}
.review-card span {
  display: block;
  margin-top: 0.8rem;
  font-weight: bold;
  color: #555;
}
@keyframes scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* ---- CTA ---- */
.cta{padding:2.4rem 0}
.cta-inner{display:grid;place-items:center;text-align:center;gap:.6rem;border-radius:var(--radius);
  background: radial-gradient(900px 400px at 10% 10%, rgba(110,231,255,.08), transparent),
              radial-gradient(800px 400px at 90% 90%, rgba(167,139,250,.08), transparent),
              linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08); padding:2rem
}

/* ---- PAGE HERO (inner pages) ---- */
.page-hero{padding:2rem 0;border-bottom:1px solid rgba(255,255,255,.06)}
.service-sections{padding:1.8rem 0}
.service-block{padding:1rem;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);background:rgba(255,255,255,.03);margin: 0 0 1rem}
.bullets{padding-left:1.1rem}

/* ---- TWO COLUMN / ACCORDION ---- */
.two-col{display:grid;grid-template-columns:1.2fr .8fr; gap:1rem; align-items:start; margin:2rem auto}
.accordion details{border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:.8rem;background:rgba(255,255,255,.03);margin:.6rem 0}
.accordion summary{cursor:pointer}

/* ---- CONTACT ---- */
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr; gap:1rem; margin:2rem auto}
.field{display:grid;gap:.25rem}
input, textarea, select{
  background:#0b1324;color:var(--text);border:1px solid rgba(255,255,255,.12);
  border-radius:12px;padding:.8rem; outline:none; box-shadow: 0 0 0 0 var(--ring);
}
input:focus, textarea:focus, select:focus{border-color:var(--accent); box-shadow: 0 0 0 6px var(--ring)}
.map-placeholder .map{height:200px;border-radius:12px;border:1px dashed rgba(255,255,255,.2);display:grid;place-items:center;color:var(--muted)}

/* ---- FOOTER ---- */
.site-footer{padding:2rem 0;border-top:1px solid rgba(255,255,255,.06); margin-top:2rem; background: rgba(255,255,255,.02)}
.site-footer .grid-3{display:grid;grid-template-columns:1.1fr .9fr .9fr; gap:1rem}
.brand-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem}
.brand-text{font-size:1.1rem;font-weight:800}
.socials{display:flex;gap:.6rem;margin:.6rem 0}
.socials a{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;border:1px solid rgba(255,255,255,.2)}
.list{list-style:none;padding-left:0;margin:.2rem 0}
.list li{margin:.2rem 0}

/* ---- READY SECTION ---- */
.ready-section {
  background: rgba(255, 255, 255, 0.01);
  color: #fff;
  padding: 60px 20px;
}
.ready-section .container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
}
.left-content h2 {
  font-size: 32px;
  margin-bottom: 15px;
  color: var(--primary);
}
.left-content p {
  color: #d1d5db;
  margin-bottom: 20px;
}
.images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 20px;
}
.images img {
  width: 100%;
  border-radius: 10px;
}
.faqs .faq {
  background: #374151;
  padding: 15px;
  border-radius: 8px;
  margin-bottom: 10px;
  cursor: pointer;
}
.faqs .faq h4 {
  margin: 0;
  font-size: 18px;
}
.faqs .faq p {
  margin-top: 10px;
  display: none;
  color: #d1d5db;
}
.form-container {
  background: #fff;
  color: #111;
  padding: 30px;
  border-radius: 10px;
}
.form-container h3 {
  margin-bottom: 20px;
  font-size: 24px;
}
.form-container input,
.form-container textarea {
  width: 100%;
  padding: 12px;
  margin-bottom: 15px;
  border-radius: 6px;
  border: 1px solid #ccc;
  background: #fff;
  color: #111;
}
.form-container button {
  width: 100%;
  padding: 12px;
  background:linear-gradient(90deg, var(--primary), var(--primary-2));
  color: white;
  font-weight: bold;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}
.form-container button:hover {
  background: #4338ca;
}
.hidden {
  display: none;
}

/* ---- OUR TEAM ---- */
.our-team {
  margin-top: 25px;
  padding: 15px;
  background:rgba(255, 255, 255, 0.03);
  border-radius: 10px;
  font-size: 16px;
  line-height: 1.6;
  color: #444;
}
.our-team h3 {
  margin-bottom: 10px;
  font-size: 40px;
  color: #0a2463;
}
.about-btn {
  display: inline-block;
  margin-top: 15px;
  padding: 10px 20px;
  background: linear-gradient(90deg, #0a2463, #3f72af);
  color: #fff;
  text-decoration: none;
  border-radius: 25px;
  font-size: 14px;
  transition: all 0.3s ease;
}
.about-btn:hover {
  background: linear-gradient(90deg, #3f72af, #0a2463);
  transform: translateY(-2px);
}
.our-team .team-image {
  margin-top: 20px;
}
.our-team .team-image img {
  width: 100%;
  max-height: 250px;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
}

/* ---- DROPDOWN NAV ---- */
.nav-item-with-dropdown {
  position: relative;
}
.nav-item-with-dropdown > a {
  display: flex;
  align-items: center;
  gap: 4px;
}
.dropdown-arrow {
  font-size: 12px;
  transition: transform 0.3s ease;
}
.nav-item-with-dropdown:hover .dropdown-arrow {
  transform: rotate(180deg);
}
.nav-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: white;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  border-radius: 8px;
  padding: 1rem;
  min-width: 220px;
  z-index: 1000;
  margin-top: 10px;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.nav-item-with-dropdown:hover .nav-dropdown {
  display: block;
  opacity: 1;
  transform: translateY(0);
}
.nav-dropdown a {
  display: block;
  padding: 0.6rem 1rem;
  color: #333;
  text-decoration: none;
  border-radius: 4px;
  transition: background 0.2s ease;
  font-size: 1rem;
}
.nav-dropdown a:hover {
  background: #f5f5f5;
}

/* ---- MOBILE NAV DROPDOWN ---- */
@media (max-width: 768px) {
  .nav-item-with-dropdown {
    width: 100%;
  }
  .nav-dropdown {
    position: static;
    box-shadow: none;
    margin-top: 0;
    padding: 0.5rem 0 0.5rem 2rem;
    display: none;
    opacity: 1;
    transform: none;
  }
  .nav-item-with-dropdown.active .nav-dropdown {
    display: block;
  }
  .nav-item-with-dropdown.active .dropdown-arrow {
    transform: rotate(180deg);
  }
  .ready-section .container {
    grid-template-columns: 1fr;
  }
  .media-section .container {
    flex-direction: column;
  }
}

/* ---- WORDPRESS SPECIFIC ---- */
.wp-caption {
  max-width: 100%;
}
.wp-caption-text {
  font-size: 0.85rem;
  color: var(--muted);
  text-align: center;
  margin-top: 0.3rem;
}
.alignleft { float: left; margin: 0 1rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1rem; }
.aligncenter { display: block; margin: 0 auto 1rem; }
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  word-wrap: normal !important;
}