/*
 * Alin Digital V2.8 — Ultra Premium enhancement layer
 * Additive only: preserves V2.6 content, imagery and responsive structure.
 */
:root{
  --premium-ease:cubic-bezier(.16,1,.3,1);
  --premium-fast:cubic-bezier(.22,1,.36,1);
  --premium-orange:#f58212;
  --premium-glow:rgba(245,130,18,.22);
}

/* A restrained progress line gives the long homepage a polished sense of position. */
.premium-scroll-progress{position:fixed;left:0;right:0;top:0;height:2px;z-index:10000;pointer-events:none;background:rgba(255,255,255,.03)}
.premium-scroll-progress span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,var(--orange),var(--orange),#ffad56,#b84b1a);box-shadow:0 0 14px rgba(245,130,18,.32);will-change:transform}
.admin-bar .premium-scroll-progress{top:32px}

/* Homepage rhythm — more breathing room without changing the content hierarchy. */
@media(min-width:1101px){
  .services,.showcase,.process,.about,.insights{padding-top:124px;padding-bottom:124px}
  .creative-lab,.ai-section{padding-top:126px;padding-bottom:126px}
  .digital-shift{padding-top:118px;padding-bottom:118px}
  .contact{padding-top:118px;padding-bottom:118px}
  .section-head{margin-bottom:60px;gap:84px}
  .service-grid,.lab-grid{gap:22px}
  .showcase>.site-shell,.ai-grid,.about-grid,.contact-grid,.digital-shift-grid{gap:64px}
  .process-grid{gap:14px}
}

/* Header refinement */
.site-header{transition:background .45s var(--premium-ease),box-shadow .45s var(--premium-ease),border-color .45s var(--premium-ease)}
.site-header.scrolled{box-shadow:0 18px 55px rgba(0,0,0,.24);border-bottom-color:rgba(245,130,18,.12)}
.brand img{transition:transform .55s var(--premium-ease),box-shadow .55s var(--premium-ease)}
@media(hover:hover){.brand:hover img{transform:translateY(-2px) rotate(-2deg) scale(1.035);box-shadow:0 14px 34px rgba(245,130,18,.29)}}
.primary-nav a{transition:color .25s ease,opacity .25s ease}
.primary-nav a:after{height:1px;bottom:-10px;background:linear-gradient(90deg,var(--orange),var(--orange),#ffad56,#b84b1a);box-shadow:0 0 9px rgba(245,130,18,.28)}
.header-cta,.btn,.text-link,.service-body a,.services-landing-card a{transition:transform .4s var(--premium-ease),box-shadow .4s var(--premium-ease),border-color .35s ease,background .35s ease,color .3s ease}
.header-cta{box-shadow:inset 0 0 0 1px rgba(245,130,18,.05)}
@media(hover:hover){.header-cta:hover{box-shadow:0 12px 34px rgba(245,130,18,.13),inset 0 0 0 1px rgba(245,130,18,.16)}}

/* Editorial typography details */
.section-head h2,.showcase h2,.ai-copy h2,.about h2,.contact h2{letter-spacing:-.045em;text-wrap:balance}
.section-head>p,.showcase-copy>p,.ai-copy>p,.about-copy>p,.contact-copy>p{line-height:1.75}
.eyebrow{transition:letter-spacing .45s var(--premium-ease)}
@media(hover:hover){section:hover .eyebrow{letter-spacing:.025em}}

/* Premium pointer spotlight is inserted by premium.js. */
.premium-card{position:relative!important;isolation:isolate;overflow:hidden}
.premium-card>.premium-spotlight{position:absolute!important;z-index:0!important;inset:-1px!important;pointer-events:none!important;opacity:0;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(245,130,18,.14),rgba(255,154,46,.055) 28%,transparent 62%);transition:opacity .38s ease}
.premium-card>*:not(.premium-spotlight){position:relative;z-index:1}
@media(hover:hover){.premium-card:hover>.premium-spotlight{opacity:1}}

/* Service cards — lift, border sheen and image depth. */
.service-card{transition:transform .55s var(--premium-ease),box-shadow .55s var(--premium-ease),border-color .45s ease;background-clip:padding-box}
.service-shot img{transition:transform .85s var(--premium-ease),filter .65s ease}
.service-number{transition:transform .5s var(--premium-ease),background .4s ease,box-shadow .4s ease}
.service-body a span,.text-link span,.services-landing-card a span{display:inline-block;transition:transform .42s var(--premium-ease)}
@media(hover:hover){
  .service-card:hover{transform:translateY(-8px);box-shadow:0 34px 85px rgba(77,42,13,.13);border-color:rgba(245,130,18,.44)!important}
  .service-card:hover .service-shot img{transform:scale(1.065) translateY(-2px);filter:saturate(1.04) contrast(1.025)}
  .service-card:hover .service-number{transform:translateY(-2px) scale(1.04);background:rgba(245,130,18,.9);box-shadow:0 10px 28px rgba(245,130,18,.24)}
  .service-body a:hover span,.text-link:hover span,.services-landing-card a:hover span{transform:translate(4px,-3px)}
}

/* Creative Lab: smooth glass response instead of aggressive movement. */
.lab-card{transition:transform .6s var(--premium-ease),border-color .45s ease,box-shadow .6s var(--premium-ease),background .45s ease}
.lab-card:after{content:"";position:absolute;left:9%;right:9%;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--orange),var(--green2),transparent);opacity:.22;transform:scaleX(.35);transition:transform .7s var(--premium-ease),opacity .5s ease}
@media(hover:hover){
  .lab-card:hover{transform:translateY(-6px);border-color:rgba(245,130,18,.27);box-shadow:0 34px 80px rgba(0,0,0,.25);background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.03))}
  .lab-card:hover:after{transform:scaleX(1);opacity:.75}
}
.motion-word{animation-timing-function:var(--premium-ease)}
.phone,.about-logo{animation-timing-function:ease-in-out}
.cube{animation-duration:16s}

/* Digital transformation visual feels like a feature story. */
.digital-shift-image{transition:transform .7s var(--premium-ease),box-shadow .7s var(--premium-ease),border-color .5s ease}
.digital-shift-image img{transition:transform 1s var(--premium-ease),filter .7s ease}
.digital-shift-block{transition:transform .5s var(--premium-ease),box-shadow .5s var(--premium-ease),border-color .4s ease}
@media(hover:hover){
  .digital-shift-image:hover{box-shadow:0 36px 90px rgba(95,55,18,.12);border-color:rgba(245,130,18,.42)!important}
  .digital-shift-image:hover img{transform:scale(1.015);filter:saturate(1.025)}
  .digital-shift-block:hover{transform:translateX(6px);box-shadow:0 22px 54px rgba(92,51,13,.085);border-color:rgba(245,130,18,.38)!important}
}

/* Showcase cards */
.reel-card{transition:transform .55s var(--premium-ease),box-shadow .55s var(--premium-ease),border-color .4s ease;transform-origin:50% 90%}
@media(hover:hover){
  .reel-card:hover{transform:translateY(-7px) rotateX(1deg);box-shadow:0 24px 55px rgba(0,0,0,.14);border-color:rgba(245,130,18,.35)}
  .reel-card:hover .mini-play{transform:scale(1.08)}
}
.mini-play{transition:transform .45s var(--premium-ease)}

/* AI — subtle living network. */
.ai-core{box-shadow:0 0 0 1px rgba(255,255,255,.07),0 0 55px rgba(255,154,46,.17);transition:box-shadow .5s ease,transform .5s var(--premium-ease)}
.node{transition:transform .45s var(--premium-ease),border-color .35s ease,background .35s ease,box-shadow .45s ease}
.ai-list>div{transition:transform .45s var(--premium-ease),background .4s ease,border-color .4s ease}
@media(hover:hover){
  .ai-visual:hover .ai-core{transform:scale(1.025);box-shadow:0 0 0 1px rgba(255,255,255,.1),0 0 75px rgba(255,154,46,.24),0 0 115px rgba(245,130,18,.06)}
  .node:hover{transform:translateY(-4px) scale(1.03);border-color:rgba(245,130,18,.38);background:rgba(245,130,18,.08);box-shadow:0 12px 34px rgba(0,0,0,.2)}
  .ai-list>div:hover{transform:translateX(6px);border-color:rgba(245,130,18,.22)}
}

/* Process interaction */
.process-grid article{transition:transform .5s var(--premium-ease),box-shadow .5s var(--premium-ease),border-color .4s ease}
.process-grid article:before{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:linear-gradient(90deg,var(--orange),var(--orange),#ffad56,#b84b1a);transform:scaleX(0);transform-origin:left;transition:transform .7s var(--premium-ease);z-index:3}
@media(hover:hover){.process-grid article:hover{transform:translateY(-7px);box-shadow:0 28px 62px rgba(89,48,11,.1);border-color:rgba(245,130,18,.34)!important}.process-grid article:hover:before{transform:scaleX(1)}}

/* About + capability pills */
.about-pills span,.footer-badges span,.footer-feature{transition:transform .4s var(--premium-ease),background .35s ease,border-color .35s ease}
@media(hover:hover){.about-pills span:hover{transform:translateY(-3px);background:#ffe5ca!important;border-color:rgba(245,130,18,.38)!important}.footer-badges span:hover,.footer-feature:hover{transform:translateY(-2px);background:rgba(245,130,18,.1);border-color:rgba(245,130,18,.22)}}

/* Blog cards */
.post-card{transition:transform .55s var(--premium-ease),box-shadow .55s var(--premium-ease),border-color .4s ease}
.post-thumb:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(5,9,8,.2));opacity:0;transition:opacity .5s ease;pointer-events:none}
@media(hover:hover){.post-card:hover{transform:translateY(-7px);box-shadow:0 30px 70px rgba(83,45,12,.105);border-color:rgba(245,130,18,.36)!important}.post-card:hover .post-thumb:after{opacity:1}}

/* Contact form — premium focus feedback. */
.contact-form input,.contact-form textarea,.contact-form select{transition:border-color .3s ease,box-shadow .35s ease,background .35s ease,transform .35s var(--premium-ease)}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{outline:none;border-color:rgba(245,130,18,.58)!important;box-shadow:0 0 0 4px rgba(245,130,18,.08),0 14px 34px rgba(105,62,20,.05);background:#101713;transform:translateY(-1px)}

/* Footer */
.footer-grid a{position:relative;transition:color .3s ease,transform .35s var(--premium-ease)}
@media(hover:hover){.footer-grid a:hover{transform:translateX(3px);color:#fff}.footer-grid a:hover:before{opacity:1;transform:scale(1)}}

/* Buttons get a quiet light sweep and a click ripple. */
.btn,.header-cta,.whatsapp-float{position:relative;overflow:hidden;isolation:isolate}
.btn:before,.header-cta:before{content:"";position:absolute;z-index:-1;top:-60%;bottom:-60%;left:-45%;width:32%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);transition:left .75s var(--premium-ease)}
@media(hover:hover){.btn:hover:before,.header-cta:hover:before{left:120%}.btn:hover{transform:translateY(-3px);box-shadow:0 16px 38px rgba(75,42,12,.12)}}
.premium-ripple{position:absolute;z-index:5;width:10px;height:10px;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.42);transform:translate(-50%,-50%) scale(0);animation:premiumRipple .7s ease-out forwards}
@keyframes premiumRipple{to{opacity:0;transform:translate(-50%,-50%) scale(14)}}

/* Scroll reveal is staggered by JS but content remains safe if JS fails. */
html.motion-ready .reveal{transition-duration:.9s;transition-timing-function:var(--premium-ease);transition-delay:var(--reveal-delay,0ms)}

/* Ambient background parallax uses a CSS variable written by JS. */
.hero{background-position:center calc(50% + var(--premium-bg-y,0px))}
.services:before,.process:before,.about:before{background-position:center calc(50% + var(--premium-bg-y,0px))}
.creative-lab,.ai-section{background-position:center calc(50% + var(--premium-bg-y,0px))}

/* Accessibility and touch: no hover tricks are required to understand or use anything. */
@media(hover:none),(pointer:coarse){
  .premium-card>.premium-spotlight{display:none}
  .service-card,.lab-card,.reel-card,.process-grid article,.post-card,.digital-shift-block{transform:none!important}
}
@media(max-width:767px){
  .premium-scroll-progress{height:2px}
  .admin-bar .premium-scroll-progress{top:46px}
  .services,.showcase,.process,.about,.insights,.creative-lab,.ai-section,.digital-shift,.contact{padding-top:74px;padding-bottom:74px}
  .section-head{margin-bottom:32px}
  .service-grid,.lab-grid{gap:16px}
  .premium-card>.premium-spotlight{display:none}
}
@media(max-width:479px){
  .services,.showcase,.process,.about,.insights,.creative-lab,.ai-section,.digital-shift,.contact{padding-top:66px;padding-bottom:66px}
}
@media(prefers-reduced-motion:reduce){
  .premium-scroll-progress{display:none}
  .premium-ripple{display:none}
  html.motion-ready .reveal{transition:none!important;transition-delay:0ms!important}
}

/* Tiny section-entry signature: visible only while a section is in view. */
.premium-active .eyebrow span{animation:premiumDot 2.8s ease-in-out infinite}
@keyframes premiumDot{0%,100%{box-shadow:0 0 0 5px rgba(255,154,46,.08),0 0 0 rgba(245,130,18,0)}50%{box-shadow:0 0 0 6px rgba(255,154,46,.055),0 0 24px rgba(245,130,18,.22)}}
@media(prefers-reduced-motion:reduce){.premium-active .eyebrow span{animation:none}}


/* V2.8 — Orange Signature + richer motion, additive only */
:root{
  --premium-orange:#f58212;
  --premium-orange-2:#ff9a2e;
  --premium-copper:#b84b1a;
  --premium-cream:#fff3e6;
  --premium-espresso:#0d0a07;
}
body{font-family:Outfit,system-ui,sans-serif;background:var(--premium-cream)}
h1,h2,h3,h4,.brand-copy strong,.eyebrow,.service-number,.lab-top,.motion-word,.cube>div,.about-tag{font-family:Syne,Outfit,sans-serif}
.site-header{background:rgba(13,10,7,.78)}
.site-header.scrolled{background:rgba(13,10,7,.96)}
.trust-bar{background:linear-gradient(90deg,#2a1408,#5b2d0c 52%,#2d170d)!important}
.primary-nav a:after,.process-grid article:before{background:linear-gradient(90deg,#f58212,#ffb45f,#b84b1a)!important}
.btn-red{background:linear-gradient(135deg,#f58212,#dc6904)!important;border-color:#f58212!important;color:#fff!important}
.btn-red:hover{background:linear-gradient(135deg,#ff9d33,#e86f05)!important}
.eyebrow span,.trust-bar-inner i{background:#f58212!important;box-shadow:0 0 0 5px rgba(245,130,18,.1)!important}
.hero-ambient .ambient-orb{opacity:.56!important;filter:blur(6px)!important}
.hero-ambient .ambient-line{opacity:.34!important;background:linear-gradient(90deg,transparent,#f58212,#ffb45f,transparent)!important}
.hero-ambient .ambient-grid{opacity:.12!important}
.hero-ambient .ambient-bar{opacity:.48!important;background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(245,130,18,.28))!important;box-shadow:0 0 28px rgba(245,130,18,.19)!important}
.page-glow-a,.page-glow-b{background:#f58212!important;opacity:.12!important}
.hero-frame{animation:premiumFrameGlow 5.5s ease-in-out infinite alternate;box-shadow:0 34px 90px rgba(0,0,0,.42),0 0 0 1px rgba(245,130,18,.11)}
@keyframes premiumFrameGlow{0%{box-shadow:0 34px 90px rgba(0,0,0,.42),0 0 0 1px rgba(245,130,18,.10)}100%{box-shadow:0 42px 110px rgba(0,0,0,.50),0 0 0 1px rgba(245,130,18,.28),0 0 55px rgba(245,130,18,.11)}}
.floating-chip{animation-duration:3.3s!important;box-shadow:0 12px 34px rgba(0,0,0,.22),0 0 20px rgba(245,130,18,.08)}
.hero-ticker>div{animation-duration:24s!important}
.service-shot:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 25%,rgba(255,180,94,.14) 46%,transparent 66%);transform:translateX(-120%);animation:serviceLens 7.5s ease-in-out infinite;pointer-events:none}
.service-card:nth-child(2n) .service-shot:after{animation-delay:-2.2s}.service-card:nth-child(3n) .service-shot:after{animation-delay:-4.1s}
@keyframes serviceLens{0%,58%{transform:translateX(-125%)}80%,100%{transform:translateX(125%)}}
.service-number{animation:serviceBadge 3.7s ease-in-out infinite}
@keyframes serviceBadge{0%,100%{box-shadow:0 8px 24px rgba(0,0,0,.18)}50%{box-shadow:0 12px 32px rgba(245,130,18,.22)}}
.lab-card{background:linear-gradient(145deg,rgba(255,144,46,.08),rgba(255,255,255,.025))!important}
.motion-stage{background:linear-gradient(135deg,rgba(245,130,18,.16),rgba(13,10,7,.72))!important}
.motion-orb.orb1{background:linear-gradient(135deg,#ff9a2e,#8e3a0a)!important;animation-duration:4.4s!important}
.motion-orb.orb2{background:linear-gradient(135deg,#ffd09a,#b84b1a)!important;animation-duration:3.8s!important}
.cube{animation-duration:9s!important}
.phone{animation-duration:3.1s!important}
.about-logo{animation-duration:3.2s!important}
.ai-core{animation:premiumAIPulse 3.8s ease-in-out infinite;box-shadow:0 0 0 1px rgba(255,255,255,.07),0 0 60px rgba(245,130,18,.20)!important}
@keyframes premiumAIPulse{0%,100%{box-shadow:0 0 0 1px rgba(255,255,255,.07),0 0 52px rgba(245,130,18,.16)}50%{box-shadow:0 0 0 1px rgba(255,255,255,.10),0 0 82px rgba(245,130,18,.28),0 0 130px rgba(184,75,26,.08)}}
.node{animation:premiumNodeFloat 4.6s ease-in-out infinite}.node:nth-of-type(2n){animation-delay:-1.5s}.node:nth-of-type(3n){animation-delay:-2.8s}
@keyframes premiumNodeFloat{0%,100%{translate:0 0}50%{translate:0 -6px}}
.digital-shift-image{box-shadow:0 34px 90px rgba(88,48,15,.12)!important}
.digital-shift-image:after{content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;background:linear-gradient(110deg,transparent 30%,rgba(245,130,18,.08),transparent 68%);background-size:220% 100%;animation:premiumPhotoSweep 8s linear infinite}
@keyframes premiumPhotoSweep{from{background-position:220% 0}to{background-position:-120% 0}}
.post-card,.service-card,.digital-shift-block,.services-landing-card{border-color:#ead4bf!important}
.contact-form{background:linear-gradient(180deg,#1a120c,#0f0b08)!important;border-color:rgba(245,130,18,.18)!important}
.contact-form input,.contact-form textarea,.contact-form select{background:#17100b!important;border-color:rgba(245,130,18,.16)!important}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{background:#1d130c!important}
.whatsapp-float{background:linear-gradient(135deg,#2b170c,#67330e)!important;border-color:rgba(245,130,18,.24)!important}
@media(hover:hover){
 .service-card:hover,.post-card:hover,.digital-shift-block:hover,.services-landing-card:hover{border-color:rgba(245,130,18,.50)!important}
 .lab-card:hover{box-shadow:0 36px 90px rgba(0,0,0,.31),0 0 45px rgba(245,130,18,.07)!important}
}
@media(hover:none),(pointer:coarse){.service-shot:after,.node{animation:none!important}}
@media(prefers-reduced-motion:reduce){.hero-frame,.service-shot:after,.service-number,.ai-core,.node{animation:none!important}}

.premium-cursor-glow{position:fixed;left:0;top:0;width:320px;height:320px;border-radius:50%;pointer-events:none;z-index:60;opacity:.10;background:radial-gradient(circle,rgba(245,130,18,.35),rgba(245,130,18,.08) 34%,transparent 69%);filter:blur(9px);mix-blend-mode:screen;will-change:transform}
@media(hover:none),(pointer:coarse),(max-width:900px){.premium-cursor-glow{display:none}}
@media(prefers-reduced-motion:reduce){.premium-cursor-glow{display:none}}
