/*
Theme Name: Dalinx Technologies
Theme URI: https://dalinxtechnologies.com
Author: Dalinx Technologies
Author URI: https://dalinxtechnologies.com
Description: Dark, distinctive theme for the Dalinx Technologies web, ecommerce, marketing & AI engineering studio site. Includes a signature animated terminal hero, scroll reveals, animated stat counters and a working contact form.
Version: 1.0.0
Requires at least: 6.0
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: dalinx
*/

:root{
  --bg:#0C0714; --bg-elevated:#150F22; --surface:#1B1329; --surface-hover:#241A35;
  --border:#332A47; --border-soft:#221935;
  --text:#EDEFF4; --text-muted:#98A0B3; --text-faint:#5C6478;
  --indigo:#7B2FF7; --indigo-soft:rgba(123,47,247,0.14);
  --teal:#F72FC0; --teal-soft:rgba(247,47,192,0.14);
  --amber:#FFB84D;
  --mint:#37F7B2; --mint-soft:rgba(55,247,178,0.13); --mint-dim:#1FA37A;
  --shadow-sm:0 2px 10px -4px rgba(0,0,0,0.4);
  --shadow-md:0 16px 40px -16px rgba(0,0,0,0.55);
  --shadow-glow:0 0 0 1px rgba(123,47,247,0.25), 0 20px 48px -20px rgba(123,47,247,0.45);
  --ease:cubic-bezier(.16,.84,.44,1);
  --radius:14px; --maxw:1180px;
  --ff-display:'Space Grotesk', sans-serif; --ff-body:'Inter', sans-serif; --ff-mono:'JetBrains Mono', monospace;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg); color:var(--text); font-family:var(--ff-body); line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; position:relative;}
.grain{position:fixed; inset:0; z-index:9999; pointer-events:none; opacity:0.035; mix-blend-mode:overlay; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
button{font-family:inherit; cursor:pointer;}
:focus-visible{outline:2px solid var(--teal); outline-offset:3px; border-radius:4px;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
.eyebrow{font-family:var(--ff-mono); font-size:12.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--teal); display:inline-flex; align-items:center; gap:10px;}
.eyebrow::before{content:""; width:6px; height:6px; background:var(--teal); border-radius:50%; box-shadow:0 0 0 3px var(--teal-soft);}
h1,h2,h3,h4{font-family:var(--ff-display); font-weight:600; line-height:1.15; letter-spacing:-0.01em;}
.btn{position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 26px; border-radius:10px; font-weight:600; font-size:14.5px; border:1px solid transparent; transition:transform .22s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease), border-color .22s var(--ease), color .22s var(--ease); white-space:nowrap;}
.btn-primary{background:linear-gradient(135deg, var(--indigo), #5B3FE0); color:#fff; box-shadow:0 8px 24px -8px rgba(124,111,240,0.55), inset 0 1px 0 rgba(255,255,255,0.14);}
.btn-primary:hover{transform:translateY(-2px); box-shadow:0 4px 16px -4px rgba(55,247,178,0.35), 0 16px 34px -10px rgba(124,111,240,0.65), inset 0 1px 0 rgba(255,255,255,0.18);}
.btn-primary:active{transform:translateY(0);}
.btn-ghost{background:transparent; color:var(--text); border-color:var(--border);}
.btn-ghost:hover{border-color:var(--mint); color:var(--mint); box-shadow:0 0 0 3px var(--mint-soft);}
.btn-sm{padding:10px 18px; font-size:13.5px;}

header{position:sticky; top:0; z-index:100; background:rgba(10,12,16,0.82); backdrop-filter:blur(14px); border-bottom:1px solid var(--border-soft);}
.nav{display:flex; align-items:center; justify-content:space-between; padding:18px 32px; max-width:var(--maxw); margin:0 auto;}
.logo{display:flex; align-items:center; gap:10px; font-family:var(--ff-display); font-weight:700; font-size:19px; letter-spacing:-0.01em;}
.logo-mark{width:32px; height:32px; border-radius:9px; background:linear-gradient(135deg, var(--indigo), var(--teal)); display:flex; align-items:center; justify-content:center; font-family:var(--ff-mono); font-weight:600; font-size:14px; color:#0A0C10;}
.logo span{color:var(--text-muted); font-weight:500;}
.nav-links{display:flex; align-items:center; gap:30px;}
.nav-links a{font-size:14px; color:var(--text-muted); font-weight:500; transition:color .15s ease; padding-bottom:4px; border-bottom:2px solid transparent;}
.nav-links a:hover{color:var(--text);}
.nav-links a.active{color:var(--text); border-bottom-color:var(--teal);}
.nav-cta{display:flex; align-items:center; gap:14px;}
.menu-toggle{display:none; background:none; border:1px solid var(--border); width:40px; height:40px; border-radius:8px; align-items:center; justify-content:center; color:var(--text); font-size:16px;}

.page-hero{position:relative; padding:76px 32px 68px; overflow:hidden; border-bottom:1px solid var(--border-soft);}
.page-hero::before{content:""; position:absolute; inset:0; background:radial-gradient(600px 360px at 85% 0%, rgba(124,111,240,0.14), transparent 60%), radial-gradient(500px 340px at 100% 70%, rgba(47,217,194,0.09), transparent 65%); pointer-events:none;}
.page-hero-inner{max-width:var(--maxw); margin:0 auto; position:relative; z-index:2;}
.page-hero h1{font-size:clamp(32px,4.2vw,52px); margin:18px 0 16px;}
.page-hero p.lead{font-size:16.5px; color:var(--text-muted); max-width:620px;}
.breadcrumb{font-family:var(--ff-mono); font-size:12px; color:var(--text-faint); margin-bottom:14px;}
.breadcrumb a:hover{color:var(--teal);}

section{padding:96px 32px;}
.section-head{max-width:640px; margin-bottom:52px;}
.section-head h2{font-size:clamp(26px,3vw,38px); margin-top:16px;}
.section-head p{color:var(--text-muted); font-size:15.5px; margin-top:14px;}
.section-alt{background:var(--bg-elevated); border-top:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft);}

.card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:30px 26px; transition:transform .3s var(--ease), border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);}
.card:hover{transform:translateY(-5px); border-color:var(--indigo); background:var(--surface-hover); box-shadow:var(--shadow-glow);}
.icon-box{width:44px; height:44px; border-radius:11px; background:var(--indigo-soft); display:flex; align-items:center; justify-content:center; color:var(--mint); margin-bottom:20px; transition:background .3s var(--ease), transform .3s var(--ease);}
.card:hover .icon-box{background:var(--mint-soft); transform:scale(1.06) rotate(-4deg);}

.services-grid{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.service-tag{display:inline-block; margin-top:16px; font-family:var(--ff-mono); font-size:11px; color:var(--text-faint); border-top:1px dashed var(--border); padding-top:14px; width:100%;}

.process-grid{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr);}
.process-step{position:relative; padding-right:24px;}
.process-step:not(:last-child)::after{content:""; position:absolute; top:22px; left:calc(100% - 12px); width:24px; height:1px; background:repeating-linear-gradient(90deg, var(--border) 0 6px, transparent 6px 10px);}
.process-num{font-family:var(--ff-mono); color:var(--teal); font-size:13px; margin-bottom:18px;}
.process-step h3{font-size:17px; margin-bottom:10px;}
.process-step p{color:var(--text-muted); font-size:14px;}

.about-inner{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}
.about-copy p{color:var(--text-muted); font-size:15.5px; margin-bottom:16px;}
.about-points{margin-top:22px; display:grid; gap:14px;}
.about-point{display:flex; gap:12px; align-items:flex-start; font-size:14.5px;}
.about-point .dot{width:6px; height:6px; margin-top:8px; border-radius:50%; background:var(--teal); flex-shrink:0;}
.stat-row{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:40px;}
.stat{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:22px;}
.stat .num{font-family:var(--ff-display); font-size:26px; color:var(--teal);}
.stat .label{font-family:var(--ff-mono); font-size:11.5px; color:var(--text-faint); margin-top:6px; text-transform:uppercase; letter-spacing:0.06em;}

.offices{display:grid; gap:20px;}
.office-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:26px;}
.office-card .flag{font-family:var(--ff-mono); font-size:11px; color:var(--teal); letter-spacing:0.1em; text-transform:uppercase; margin-bottom:10px;}
.office-card h4{font-size:19px; margin-bottom:8px;}
.office-card p{color:var(--text-muted); font-size:14px; margin-bottom:4px;}
.office-card .phone{font-family:var(--ff-mono); font-size:13.5px; color:var(--text); margin-top:10px; display:inline-block;}

.team-grid{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.team-card{text-align:center;}
.avatar{width:72px; height:72px; border-radius:50%; margin:0 auto 16px; background:linear-gradient(135deg, var(--indigo), var(--teal)); display:flex; align-items:center; justify-content:center; font-family:var(--ff-mono); font-weight:600; color:#0A0C10;}
.team-card h4{font-size:15.5px;}
.team-card .role{font-family:var(--ff-mono); font-size:11.5px; color:var(--text-faint); margin-top:4px;}

.blog-grid{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.blog-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:transform .2s ease, border-color .2s ease;}
.blog-card:hover{transform:translateY(-4px); border-color:var(--indigo);}
.blog-thumb{height:160px; background:linear-gradient(135deg, rgba(124,111,240,0.28), rgba(47,217,194,0.2)); position:relative; display:flex; align-items:flex-end; padding:16px;}
.blog-cat{font-family:var(--ff-mono); font-size:10.5px; background:rgba(10,12,16,0.55); border:1px solid rgba(255,255,255,0.15); padding:5px 10px; border-radius:100px; text-transform:uppercase; letter-spacing:0.06em;}
.blog-body{padding:22px;}
.blog-meta{font-family:var(--ff-mono); font-size:11px; color:var(--text-faint); margin-bottom:10px;}
.blog-body h3{font-size:17px; margin-bottom:10px;}
.blog-body p{color:var(--text-muted); font-size:13.8px;}
.blog-read{display:inline-block; margin-top:14px; font-size:13px; color:var(--teal); font-weight:600;}
.blog-featured{max-width:var(--maxw); margin:0 auto 56px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); display:grid; grid-template-columns:1fr 1fr; overflow:hidden;}
.blog-featured .blog-thumb{height:100%;}
.blog-featured .blog-body{padding:40px;}

.testi-grid{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.testi-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:28px;}
.testi-stars{color:var(--amber); font-size:13px; letter-spacing:2px; margin-bottom:16px;}
.testi-quote{font-size:14.5px; color:var(--text); margin-bottom:22px;}
.testi-person{display:flex; align-items:center; gap:12px;}
.testi-avatar{width:38px; height:38px; border-radius:50%; background:var(--indigo-soft); color:var(--teal); display:flex; align-items:center; justify-content:center; font-family:var(--ff-mono); font-size:12px; font-weight:600;}
.testi-name{font-size:13.5px; font-weight:600;}
.testi-role{font-family:var(--ff-mono); font-size:11px; color:var(--text-faint);}
.testi-note{max-width:var(--maxw); margin:40px auto 0; font-size:12.5px; color:var(--text-faint); border-top:1px dashed var(--border); padding-top:20px;}

.cta-banner{max-width:var(--maxw); margin:0 auto; background:linear-gradient(120deg, rgba(124,111,240,0.14), rgba(47,217,194,0.09)); border:1px solid var(--border); border-radius:20px; padding:56px 48px; display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;}
.cta-banner h2{font-size:clamp(24px,2.8vw,32px); max-width:480px;}
.cta-banner p{color:var(--text-muted); margin-top:10px;}

.contact-grid{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px;}
.contact-info-item{margin-bottom:28px;}
.contact-info-item .label{font-family:var(--ff-mono); font-size:11.5px; color:var(--text-faint); text-transform:uppercase; letter-spacing:0.08em; margin-bottom:8px;}
.contact-info-item .value{font-size:16px;}
.contact-info-item .value a:hover{color:var(--teal);}
form{display:grid; gap:18px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.field label{display:block; font-size:13px; color:var(--text-muted); margin-bottom:8px;}
.field input, .field textarea, .field select{width:100%; background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:13px 14px; color:var(--text); font-family:var(--ff-body); font-size:14.5px; transition:border-color .15s ease;}
.field input:focus, .field textarea:focus, .field select:focus{outline:none; border-color:var(--teal);}
.field textarea{resize:vertical; min-height:110px;}
.form-note{font-size:12.5px; color:var(--text-faint);}
.map-box{margin-top:32px; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; height:260px;}
.map-box iframe{width:100%; height:100%; border:0; filter:grayscale(1) invert(0.9) contrast(0.85);}

.faq-item{max-width:var(--maxw); margin:0 auto 14px; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:22px 26px;}
.faq-item h4{font-size:15.5px; margin-bottom:8px;}
.faq-item p{color:var(--text-muted); font-size:14px;}

footer{border-top:1px solid var(--border-soft); padding:56px 32px 32px;}
.footer-inner{max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px;}
.footer-brand p{color:var(--text-muted); font-size:14px; margin-top:14px; max-width:280px;}
.footer-col h5{font-family:var(--ff-mono); font-size:12px; text-transform:uppercase; letter-spacing:0.08em; color:var(--text-faint); margin-bottom:16px;}
.footer-col a, .footer-col p{display:block; color:var(--text-muted); font-size:14px; margin-bottom:10px;}
.footer-col a:hover{color:var(--teal);}
.footer-bottom{max-width:var(--maxw); margin:48px auto 0; padding-top:24px; border-top:1px solid var(--border-soft); display:flex; justify-content:space-between; align-items:center; font-size:12.5px; color:var(--text-faint); font-family:var(--ff-mono); flex-wrap:wrap; gap:12px;}

/* ---- Signature terminal widget ---- */
.term-window{background:linear-gradient(180deg, #14101F, #0F0B18); border:1px solid var(--border); border-radius:14px; box-shadow:var(--shadow-md), 0 0 80px -30px rgba(123,47,247,0.5); overflow:hidden; font-family:var(--ff-mono);}
.term-head{display:flex; align-items:center; gap:8px; padding:13px 16px; border-bottom:1px solid var(--border-soft); background:rgba(255,255,255,0.02);}
.term-dot{width:10px; height:10px; border-radius:50%;}
.term-dot.r{background:#FF5F57;} .term-dot.y{background:#FEBC2E;} .term-dot.g{background:#28C840;}
.term-title{margin-left:8px; font-size:11.5px; color:var(--text-faint); letter-spacing:0.02em;}
.term-body{padding:22px 20px 26px; font-size:13px; min-height:230px;}
.term-line{color:var(--text-muted); margin-bottom:10px; opacity:0; transform:translateY(4px); animation:termIn .4s var(--ease) forwards;}
.term-line .prompt{color:var(--teal);}
.term-line .ok{color:var(--mint);}
.term-line.cmd{color:var(--text);}
.term-cursor{display:inline-block; width:7px; height:14px; background:var(--mint); vertical-align:middle; margin-left:2px; animation:blink 1s step-end infinite;}
@keyframes termIn{to{opacity:1; transform:translateY(0);}}
@keyframes blink{0%,49%{opacity:1;} 50%,100%{opacity:0;}}

/* ---- Trusted-by marquee ---- */
.marquee-wrap{max-width:var(--maxw); margin:0 auto; overflow:hidden; -webkit-mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image:linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);}
.marquee-track{display:flex; gap:44px; width:max-content; animation:scrollLeft 28s linear infinite;}
.marquee-wrap:hover .marquee-track{animation-play-state:paused;}
.marquee-item{display:flex; align-items:center; gap:10px; font-family:var(--ff-mono); font-size:13px; color:var(--text-faint); white-space:nowrap;}
.marquee-item .dot{width:4px; height:4px; border-radius:50%; background:var(--mint);}
@keyframes scrollLeft{from{transform:translateX(0);} to{transform:translateX(-50%);}}

/* ---- Scroll reveal ---- */
.reveal-el{opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.reveal-el.in-view{opacity:1; transform:translateY(0);}
.card.reveal-el:nth-child(2){transition-delay:.06s;}
.card.reveal-el:nth-child(3){transition-delay:.12s;}
.card.reveal-el:nth-child(4){transition-delay:.18s;}
.card.reveal-el:nth-child(5){transition-delay:.24s;}
.card.reveal-el:nth-child(6){transition-delay:.3s;}
@media (prefers-reduced-motion: reduce){
  .reveal-el{opacity:1; transform:none; transition:none;}
  .term-line{opacity:1; transform:none; animation:none;}
  .marquee-track{animation:none;}
}

@media (max-width:980px){
  .services-grid{grid-template-columns:repeat(2,1fr);}
  .process-grid{grid-template-columns:repeat(2,1fr); row-gap:40px;}
  .process-step:nth-child(2)::after{display:none;}
  .about-inner{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .footer-inner{grid-template-columns:1fr 1fr;}
  .team-grid{grid-template-columns:repeat(2,1fr);}
  .blog-grid{grid-template-columns:repeat(2,1fr);}
  .testi-grid{grid-template-columns:repeat(2,1fr);}
  .blog-featured{grid-template-columns:1fr;}
  .stat-row{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
  .nav-links{display:none;}
  .menu-toggle{display:flex;}
  section{padding:64px 20px;}
  .page-hero{padding:48px 20px 56px;}
  .services-grid, .process-grid, .team-grid, .blog-grid, .testi-grid{grid-template-columns:1fr;}
  .process-step::after{display:none !important;}
  .form-row{grid-template-columns:1fr;}
  .cta-banner{padding:34px 24px; flex-direction:column; align-items:flex-start;}
  .footer-inner{grid-template-columns:1fr 1fr; gap:28px;}
  .footer-bottom{flex-direction:column; align-items:flex-start;}
  .blog-featured{grid-template-columns:1fr;}
  .stat-row{grid-template-columns:1fr;}
  .term-body{min-height:0;}
  .marquee-track{animation-duration:18s;}
}
@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}

.nav-links a.active{color:var(--text); border-bottom-color:var(--teal);}