/* =========================================================
   HAYAT DIGITAL — HOME PAGE ONLY
   Loaded after style.css, only on index.html.
   Purpose: (1) restyle the shared header chrome for the home
   page per the client's reference recording, (2) add the new
   v2 home sections. Nothing here is referenced by any other
   page, so about/services/portfolio/etc. are unaffected.
   ========================================================= */

/* ---------- Header: bigger logo, persistent light bar ---------- */
body.home #site-header{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 1px 0 rgba(21,14,61,.06);
  padding:16px 0;
}
body.home #site-header.scrolled{
  background:rgba(255,255,255,.97);
  box-shadow:0 10px 30px -18px rgba(21,14,61,.18);
  padding:10px 0;
}
body.home .brand-mark{
  background:transparent;
  padding:0;
  box-shadow:none;
  border-radius:0;
}
body.home .brand-mark img{
  height:58px;
  transition:height .4s var(--ease);
}
body.home #site-header.scrolled .brand-mark img{height:46px;}
body.home .main-nav a{color:var(--deep);}
body.home .main-nav a:hover,
body.home .main-nav li.active>a{background:var(--lav);color:var(--violet);}
body.home .dropdown{box-shadow:0 26px 50px -20px rgba(21,14,61,.22);}
body.home .header-actions .social-inline{display:none;}
body.home .hamburger{border-color:rgba(21,14,61,.18);}
body.home .hamburger span{background:var(--deep);}
@media (max-width:1080px){
  body.home .header-actions .btn{display:none;}
}

/* ---------- Hero v2 ---------- */
.home-hero{
  position:relative;
  min-height:100vh;
  display:flex;align-items:center;
  padding:150px 0 70px;
  background:linear-gradient(150deg,#1B1240 0%,#241653 45%,#1A1140 100%);
  overflow:hidden;
  color:#fff;
}
.home-hero .hh-media{
  position:absolute;inset:0;z-index:0;opacity:.16;
  background-image:url('images/working-laptop.jpg');
  background-size:cover;background-position:center;
  filter:saturate(60%);
}
.home-hero .hh-media video{
  width:100%;height:100%;object-fit:cover;display:block;
}
.home-hero .hh-dots{
  position:absolute;inset:0;z-index:1;
  background-image:radial-gradient(rgba(255,255,255,.22) 1.4px,transparent 1.4px);
  background-size:46px 46px;
  mask-image:radial-gradient(ellipse 70% 60% at 30% 40%,#000 20%,transparent 75%);
}
.home-hero .hh-orb{
  position:absolute;border-radius:50%;filter:blur(60px);z-index:0;pointer-events:none;
}
.home-hero .hh-orb.o1{width:520px;height:520px;background:radial-gradient(circle,rgba(108,60,232,.55),transparent 70%);top:-140px;left:-120px;}
.home-hero .hh-orb.o2{width:420px;height:420px;background:radial-gradient(circle,rgba(47,107,255,.4),transparent 70%);bottom:-160px;right:10%;}
.home-hero .container{position:relative;z-index:2;}
.home-hero .hh-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;}
@media (max-width:980px){.home-hero .hh-grid{grid-template-columns:1fr;}}

.hh-eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  padding:8px 16px;border-radius:100px;
  font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(255,255,255,.85);
}
.hh-eyebrow .dot{width:7px;height:7px;border-radius:50%;background:#3CDA8C;box-shadow:0 0 10px #3CDA8C;}

.home-hero h1{
  font-size:clamp(3rem,7vw,5.2rem);
  font-weight:700;
  margin:22px 0 20px;
  line-height:.98;
  letter-spacing:-0.015em;
}
.home-hero h1 .line2{
  display:block;
  background:linear-gradient(100deg,#8B7CF6,#4FD6FF);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.home-hero .hh-lead{
  color:rgba(255,255,255,.72);
  font-size:1.08rem;max-width:46ch;line-height:1.75;
}
.hh-stats-row{display:flex;gap:44px;margin:36px 0 34px;flex-wrap:wrap;}
.hh-stats-row .s b{
  font-family:'Space Grotesk',sans-serif;font-size:2.1rem;display:block;color:#fff;
}
.hh-stats-row .s span{font-size:.85rem;color:rgba(255,255,255,.55);}
.hh-cta-row{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:34px;}
.hh-social{display:flex;gap:10px;}
.hh-social a{
  width:42px;height:42px;border-radius:50%;
  border:1px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;color:#fff;
  transition:all .3s ease;
}
.hh-social a:hover{background:linear-gradient(135deg,var(--violet),var(--blue));border-color:transparent;transform:translateY(-3px);}
.hh-social svg{width:16px;height:16px;fill:currentColor;}

/* photo + gradient ring + floating badges */
.hh-portrait{position:relative;width:100%;max-width:430px;margin:0 auto;aspect-ratio:1/1;}
.hh-ring{
  position:absolute;inset:0;border-radius:50%;z-index:1;
  background:conic-gradient(from 180deg,#4FD6FF,#6C3CE8,#2F6BFF,#3CDA8C,#4FD6FF);
  animation:ringspin 12s linear infinite;
}
@keyframes ringspin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
@media (prefers-reduced-motion: reduce){.hh-ring{animation:none;}}
.hh-photo{
  position:absolute;inset:10px;z-index:2;border-radius:50%;overflow:hidden;
  border:6px solid #1B1240;
  background:#e88a2f;
}
.hh-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.hh-badge{
  position:absolute;
  background:rgba(24,16,58,.92);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px);
  border-radius:14px;padding:14px 18px;
  box-shadow:0 20px 40px -16px rgba(0,0,0,.5);
  z-index:3;
}
.hh-badge b{display:block;font-family:'Space Grotesk',sans-serif;font-size:1.05rem;color:#fff;}
.hh-badge span{font-size:.78rem;color:rgba(255,255,255,.6);}
.hh-badge.b-top{top:6%;right:-6%;}
.hh-badge.b-left{bottom:6%;left:-10%;}
.hh-badge.b-right{bottom:-4%;right:-8%;}
@media (max-width:640px){
  .hh-badge{padding:10px 14px;}
  .hh-badge.b-top{right:-2%;}
  .hh-badge.b-left{left:-4%;}
  .hh-badge.b-right{right:-2%;}
}

.hh-scroll{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:10px;
  font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.2em;
  color:rgba(255,255,255,.45);z-index:2;
}
.hh-scroll .line{width:1px;height:34px;background:linear-gradient(180deg,rgba(255,255,255,.6),transparent);animation:scrolldrop 2.2s ease-in-out infinite;}
@keyframes scrolldrop{0%{opacity:0;transform:scaleY(.3);transform-origin:top;}50%{opacity:1;transform:scaleY(1);}100%{opacity:0;transform:scaleY(.3);transform-origin:bottom;}}

/* ---------- CEO statement band ---------- */
.ceo-band{
  position:relative;padding:120px 0;overflow:hidden;
  background:#12102b;color:#fff;text-align:center;
}
.ceo-band .cb-media{position:absolute;inset:0;z-index:0;}
.ceo-band .cb-media img,.ceo-band .cb-media video{width:100%;height:100%;object-fit:cover;opacity:.28;}
.ceo-band .cb-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,16,43,.75),rgba(18,16,43,.92));}
.ceo-band .container{position:relative;z-index:1;max-width:820px;}
.cb-pill{
  display:inline-flex;padding:8px 18px;border-radius:100px;
  border:1px solid rgba(255,255,255,.22);
  font-family:'JetBrains Mono',monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.75);margin-bottom:22px;
}
.ceo-band h2{color:#fff;font-size:clamp(2rem,4.4vw,3rem);line-height:1.15;}
.ceo-band h2 .accent{background:linear-gradient(100deg,#8B7CF6,#4FD6FF);-webkit-background-clip:text;background-clip:text;color:transparent;}
.ceo-band p{color:rgba(255,255,255,.7);margin-top:22px;font-size:1.08rem;max-width:60ch;margin-left:auto;margin-right:auto;}

/* ---------- section eyebrow (dash style) ---------- */
.dash-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:'JetBrains Mono',monospace;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--violet);font-weight:600;
}
.dash-eyebrow::before{content:"";width:26px;height:2px;background:var(--violet);display:inline-block;}
.bg-deep .dash-eyebrow{color:#B9A9FF;}
.bg-deep .dash-eyebrow::before{background:#B9A9FF;}

/* ---------- Marquee (client / partner logos) ---------- */
.marquee-wrap{width:100%;overflow:hidden;position:relative;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.marquee-track{display:flex;gap:22px;width:max-content;animation:marquee 32s linear infinite;}
.marquee-track.slow{animation-duration:44s;}
@media (prefers-reduced-motion: reduce){.marquee-track{animation:none;}}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.marquee-chip{
  flex:none;width:170px;height:96px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
}
.marquee-chip img{max-height:44px;max-width:120px;object-fit:contain;filter:grayscale(100%) brightness(1.5);opacity:.85;transition:filter .35s ease,opacity .35s ease;}
.marquee-chip:hover img{filter:none;opacity:1;}
.marquee-chip.light{background:#fff;border:1px solid var(--line);}
.marquee-chip.light img{filter:grayscale(100%);opacity:.75;}
.marquee-chip.light:hover img{filter:none;opacity:1;}
.marquee-chip.round{border-radius:50%;width:110px;height:110px;padding:14px;}
.marquee-chip.round img{max-height:70px;max-width:70px;}

/* ---------- Resume timeline v2 ---------- */
.resume-band{background:#150E30;color:#fff;padding:120px 0;}
.rv2-list{max-width:820px;display:flex;flex-direction:column;gap:0;position:relative;}
.rv2-item{display:grid;grid-template-columns:56px 1fr;gap:20px;position:relative;padding-bottom:34px;}
.rv2-item::before{
  content:"";position:absolute;left:27px;top:56px;bottom:0;width:1px;
  background:rgba(255,255,255,.14);
}
.rv2-item:last-child::before{display:none;}
.rv2-num{
  width:56px;height:56px;border-radius:50%;
  border:1px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;
  font-family:'Space Grotesk',sans-serif;font-weight:600;color:rgba(255,255,255,.6);
  transition:all .5s var(--ease);z-index:1;background:#150E30;
}
.rv2-item.active .rv2-num{
  background:linear-gradient(135deg,var(--violet),var(--blue));
  border-color:transparent;color:#fff;
  box-shadow:0 0 0 6px rgba(108,60,232,.18);
}
.rv2-card{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);
  border-radius:16px;padding:22px 26px;
  transition:border-color .4s ease,background .4s ease;
}
.rv2-item.active .rv2-card{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.22);}
.rv2-card h3{color:#fff;font-size:1.12rem;margin-bottom:10px;font-weight:600;}
.rv2-card .meta{font-size:.9rem;color:rgba(255,255,255,.55);display:flex;gap:18px;flex-wrap:wrap;}

/* ---------- Testimonial ---------- */
.testi-card{
  max-width:760px;margin:0 auto;text-align:center;
  background:#fff;border:1px solid var(--line);border-radius:22px;
  padding:52px 46px;box-shadow:0 40px 90px -50px rgba(21,14,61,.3);
}
.testi-stars{color:#F5A623;font-size:1.2rem;letter-spacing:4px;margin-bottom:22px;}
.testi-quote{font-size:1.2rem;color:var(--deep);line-height:1.6;font-family:'Space Grotesk',sans-serif;font-weight:500;}
.testi-person{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:26px;}
.testi-avatar{
  width:48px;height:48px;border-radius:50%;
  background:linear-gradient(135deg,var(--violet),var(--blue));
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-family:'Space Grotesk',sans-serif;font-weight:600;
}
.testi-person .who{text-align:left;}
.testi-person .who b{display:block;color:var(--deep);font-size:.98rem;}
.testi-person .who span{font-size:.85rem;color:var(--ink-soft);}

/* ---------- Get in touch v2 ---------- */
.git-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:stretch;}
@media (max-width:900px){.git-grid{grid-template-columns:1fr;}}
.git-form{background:#fff;border:1px solid var(--line);border-radius:22px;padding:40px;}
.git-info{
  background:linear-gradient(160deg,#1D1354,#150E3D);
  border-radius:22px;padding:40px;color:#fff;
  display:flex;flex-direction:column;gap:26px;
  position:relative;overflow:hidden;
}
.git-info::after{content:"";position:absolute;top:-30%;right:-20%;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(108,60,232,.4),transparent 70%);filter:blur(10px);}
.git-row{display:flex;gap:16px;align-items:flex-start;position:relative;z-index:1;}
.git-row .gi{
  width:44px;height:44px;border-radius:12px;flex:none;
  background:rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;color:#fff;
}
.git-row .gi svg{width:19px;height:19px;stroke:#fff;fill:none;}
.git-row b{display:block;color:#fff;font-size:.98rem;}
.git-row span,.git-row div{color:rgba(255,255,255,.62);font-size:.92rem;}
.git-info .hh-social{margin-top:auto;position:relative;z-index:1;}

/* ---------- Footer v2 ---------- */
.foot-v2{background:#150E30;color:rgba(255,255,255,.65);padding:76px 0 30px;}
.fv2-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.08);}
@media (max-width:900px){.fv2-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.fv2-grid{grid-template-columns:1fr;}}
.fv2-grid h4{color:#fff;font-size:.82rem;font-family:'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px;}
.fv2-grid ul{display:flex;flex-direction:column;gap:11px;}
.fv2-grid a{font-size:.92rem;color:rgba(255,255,255,.65);transition:color .3s ease;}
.fv2-grid a:hover{color:#4FD6FF;}
.fv2-brand p{margin-top:14px;max-width:30ch;color:rgba(255,255,255,.55);}
.fv2-brand .hh-social{margin-top:20px;}
.fv2-form{display:flex;gap:10px;margin-top:8px;}
.fv2-form input{
  flex:1;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);color:#fff;font-size:.85rem;
}
.fv2-form input::placeholder{color:rgba(255,255,255,.4);}
.fv2-form button{
  padding:12px 20px;border-radius:10px;border:none;
  background:linear-gradient(135deg,var(--violet),var(--blue));color:#fff;font-weight:600;font-size:.85rem;
}
.fv2-bottom{display:flex;justify-content:space-between;padding-top:24px;font-size:.82rem;flex-wrap:wrap;gap:10px;}
