:root{
  --bg:#0b0f14;
  --text:#e9eef6;
  --muted:#b7c2d3;
  --ember1:#ff6a00;
  --ember2:#ff8a00;
  --ember3:#ffb42a;
  --steel:#c8d0d9;
  --border:rgba(255,255,255,.10);
  --radius:16px;
  --max:1200px;
  --shadow:0 10px 24px rgba(0,0,0,.35);
}

*{box-sizing:border-box}

html,body{
  margin:0;
  padding:0;
  background:var(--bg);
  color:var(--text);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,Arial,"Noto Sans","Helvetica Neue",sans-serif;
  line-height:1.55;
}

a{
  color:var(--ember3);
  text-decoration:none;
}

a:hover{opacity:.92}

img{
  max-width:100%;
  height:auto;
  border-radius:12px;
}

.container{
  max-width:var(--max);
  margin-inline:auto;
  padding:clamp(16px,4vw,32px);
}

header.site{
  position:sticky;
  top:0;
  z-index:40;
  background:rgba(11,15,20,.72);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--border);
}

nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  letter-spacing:.6px;
}

.brand .dot{
  width:14px;
  height:14px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%, var(--ember3), var(--ember1) 55%, #b64200 100%);
  box-shadow:0 0 12px rgba(255,106,0,.8);
}

.menu{
  display:flex;
  gap:clamp(10px,2vw,28px);
}

.menu a{
  padding:10px 10px;
  border-radius:10px;
}

.menu a[aria-current="page"]{
  background:rgba(255,255,255,.06);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}

.menu a:hover{background:rgba(255,255,255,.06)}

.hero-slider{
  position:relative;
  height:clamp(460px,74vh,860px);
  overflow:hidden;
  border-bottom:1px solid var(--border);
}

.hero-slide{
  position:absolute;
  inset:0;
  opacity:0;
  transform:scale(1.08);
  animation:slideFade 36s infinite;
  background-position:center;
  background-size:cover;
  filter:saturate(1.1) contrast(1.05);
  background-image:linear-gradient(180deg, rgba(255,106,0,.25), rgba(255,180,42,.18)), var(--img);
  background-blend-mode:screen, normal;
}

.hero-slide:nth-child(1){animation-delay:0s}
.hero-slide:nth-child(2){animation-delay:7.2s}
.hero-slide:nth-child(3){animation-delay:14.4s}
.hero-slide:nth-child(4){animation-delay:21.6s}
.hero-slide:nth-child(5){animation-delay:28.8s}

@keyframes slideFade{
  0%{opacity:0; transform:scale(1.08)}
  6%{opacity:1}
  24%{opacity:1; transform:scale(1)}
  28%{opacity:0}
  100%{opacity:0}
}

.hero-slider::after{
  content:"";
  position:absolute;
  inset:-10% -10% -10% -10%;
  pointer-events:none;
  z-index:2;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,183,77,.25), transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(255,140,0,.20), transparent 46%),
    radial-gradient(circle at 60% 80%, rgba(255,110,0,.18), transparent 50%),
    repeating-radial-gradient(circle at 30% 70%, rgba(255,120,0,.60), rgba(255,120,0,.60) 1px, transparent 2px, transparent 6px),
    repeating-radial-gradient(circle at 70% 40%, rgba(255,180,42,.55), rgba(255,180,42,.55) 1px, transparent 3px, transparent 7px);
  mix-blend-mode:screen;
  opacity:.75;
  filter:blur(.2px);
  animation:drift 20s linear infinite;
}

@keyframes drift{
  0%{transform:translateY(0) rotate(0)}
  100%{transform:translateY(-6%) rotate(0.5deg)}
}

.hero-content{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  text-align:center;
  padding:clamp(12px,4vw,32px);
  z-index:3;
}

.hero-box{
  max-width:980px;
  background:linear-gradient(180deg, rgba(11,15,20,.55), rgba(11,15,20,.35));
  border:1px solid rgba(255,255,255,.14);
  border-radius:22px;
  padding:clamp(16px,3.6vw,30px);
  box-shadow:var(--shadow);
}

.kpis{
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap:wrap;
  color:#ffe8cc;
}

.kpis span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(255,170,80,.14);
  padding:8px 12px;
  border-radius:999px;
  font-weight:700;
}

.cta{
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:12px;
}

.btn{
  display:inline-block;
  padding:12px 18px;
  border-radius:12px;
  box-shadow:var(--shadow);
  font-weight:800;
}

.btn-primary{
  background:linear-gradient(135deg,var(--ember1),var(--ember3));
  color:#1b1006;
  border:none;
}

.btn-ghost{
  border:1px solid rgba(255,200,150,.4);
  color:#ffe8cc;
  background:transparent;
}

section{scroll-margin-top:90px}

h1{
  font-size:clamp(30px,4.6vw,54px);
  margin:.2em 0 .3em 0;
}

h2{
  font-size:clamp(22px,3.2vw,32px);
  margin:0 0 10px;
}

.sub{
  color:#ffd9a8;
  margin:0 0 22px;
}

.card{
  background:linear-gradient(180deg, rgba(255,170,80,.06), rgba(255,140,0,.03));
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:clamp(14px,2.8vw,22px);
}

.grid-3{
  display:grid;
  gap:clamp(14px,2vw,20px);
  grid-template-columns:repeat(3,1fr);
}

.grid-4{
  display:grid;
  gap:clamp(10px,1.6vw,16px);
  grid-template-columns:repeat(4,1fr);
}

@media (max-width:980px){
  .grid-3{grid-template-columns:1fr 1fr}
  .grid-4{grid-template-columns:1fr 1fr}
}

@media (max-width:620px){
  .grid-3,
  .grid-4,
  .form-grid{
    grid-template-columns:1fr;
  }

  nav{
    flex-direction:column;
    align-items:flex-start;
  }

  .menu{flex-wrap:wrap}
}

ul.clean{
  list-style:none;
  padding:0;
  margin:0;
}

ul.clean li{
  padding-left:28px;
  position:relative;
  margin:8px 0;
}

ul.clean li::before{
  content:"✦";
  position:absolute;
  left:0;
  top:0;
  color:var(--ember3);
}

footer{
  border-top:1px solid var(--border);
  color:#9fb0c8;
}

.footer-grid{
  display:grid;
  gap:14px;
  grid-template-columns:2fr 1fr 1fr;
}

@media (max-width:880px){
  .footer-grid{grid-template-columns:1fr}
}

small{color:#9fb0c8}

.form-grid{
  display:grid;
  gap:12px;
  grid-template-columns:1fr 1fr;
}

input,
textarea{
  width:100%;
  padding:10px;
  border-radius:10px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.05);
  color:var(--text);
}

.logos-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
  gap:34px;
  margin-top:4rem;
  padding-top:44px;
  align-items:center;
  justify-items:center;
}

@keyframes fadeUp{
  0%{
    opacity:0;
    transform:translateY(20px) scale(.9);
  }

  100%{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes blinkSoft{
  0%{
    opacity:1;
    filter:brightness(1);
  }

  40%{
    opacity:.55;
    filter:brightness(.85);
  }

  70%{
    opacity:1;
    filter:brightness(1);
  }

  100%{
    opacity:1;
    filter:brightness(1);
  }
}

@keyframes floatSlow{
  0%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
  100%{transform:translateY(0)}
}

.logo-item{
  display:block;
  width:100%;
  max-width:150px;
  opacity:0;
  transform:translateY(20px) scale(.9);
  animation:fadeUp .8s ease-out forwards, blinkSoft 4s ease-in-out infinite, floatSlow 6s ease-in-out infinite;
  filter:grayscale(100%) brightness(1.15);
  transition:.3s ease;
}

.logo-item:hover{
  filter:grayscale(0%) brightness(1);
  transform:scale(1.08);
}

.logo-item:nth-child(1){animation-delay:.1s, .5s, 0s}
.logo-item:nth-child(2){animation-delay:.2s, .8s, .4s}
.logo-item:nth-child(3){animation-delay:.3s, 1.2s, .8s}
.logo-item:nth-child(4){animation-delay:.4s, 1.6s, 1.2s}
.logo-item:nth-child(5){animation-delay:.5s, 2s, 1.6s}
.logo-item:nth-child(6){animation-delay:.6s, 2.4s, 2s}
.logo-item:nth-child(7){animation-delay:.7s, 2.8s, 2.4s}
.logo-item:nth-child(8){animation-delay:.8s, 3.2s, 2.8s}
.logo-item:nth-child(9){animation-delay:.9s, 3.6s, 3.2s}

.project-image{
  aspect-ratio:16/9;
  object-fit:cover;
  width:100%;
}

.home-intro,
.home-highlights,
.home-capability-grid,
.home-about-grid{
  margin-bottom:28px;
}

.home-intro-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:20px;
  align-items:start;
}

.home-intro-grid p{
  color:var(--muted);
}

.home-intro-panel{
  padding:18px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,180,42,.12), rgba(255,106,0,.04));
  border:1px solid rgba(255,255,255,.08);
}

.home-intro-panel h3{
  margin-top:0;
}

.home-pill-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.home-pill-list span{
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,170,80,.12);
  border:1px solid rgba(255,255,255,.08);
  color:#ffe9cc;
  font-size:.95rem;
}

.home-highlights-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:14px;
}

.home-highlight{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.home-highlight strong{
  color:#ffe9cc;
}

.home-highlight span{
  color:var(--muted);
}

.home-service-card p,
.home-capability-card p,
.home-quote-card p{
  color:var(--muted);
}

.home-service-image{
  width:100%;
  height:200px;
  object-fit:cover;
  margin-bottom:14px;
}

.home-capability-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:16px;
}

.home-capability-card h3,
.home-quote-card h3{
  margin-bottom:8px;
}

.home-about-grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:16px;
}

.home-quote-card{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.about-header p:not(.sub),
.contact-header p:not(.sub){
  max-width:980px;
  color:var(--muted);
  margin:0 0 16px;
}

.about-strip{
  margin-bottom:28px;
}

.about-strip-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}

.about-strip-item,
.contact-highlight-item{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:16px;
  border-radius:14px;
  background:linear-gradient(180deg, rgba(255,180,42,.12), rgba(255,106,0,.04));
  border:1px solid rgba(255,255,255,.08);
}

.about-strip-item strong,
.contact-highlight-item strong{
  color:#ffe9cc;
}

.about-strip-item span,
.contact-highlight-item span{
  color:var(--muted);
}

.about-story-grid,
.about-clients-grid{
  display:grid;
  gap:20px;
  margin-bottom:28px;
}

.about-feature-card{
  display:grid;
  grid-template-columns:minmax(240px, 360px) 1fr;
  gap:20px;
  align-items:stretch;
}

.about-clients-grid .card h2{
  margin-bottom:4rem;
}

.about-clients-grid .card{
  padding-top:30px;
}

.about-feature-image{
  width:100%;
  min-height:260px;
  height:100%;
  object-fit:cover;
  border-radius:14px;
}

.about-feature-image-short{
  min-height:180px;
  max-height:220px;
}

.about-feature-copy p,
.about-clients-copy p,
.contact-copy,
.contact-visual p,
.contact-detail-card p{
  color:var(--muted);
}

.about-values h3,
.contact-detail-card h3{
  margin:0 0 8px;
}

.about-values p{
  margin:0;
  color:var(--muted);
}

.contact-highlights{
  margin-bottom:28px;
}

.contact-highlights-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:14px;
}

.contact-layout{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:20px;
}

.contact-panel,
.contact-visual{
  height:100%;
}

.contact-visual-image{
  width:100%;
  height:250px;
  object-fit:cover;
  margin-bottom:14px;
}

.contact-mini-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}

.contact-mini-list span{
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,170,80,.12);
  border:1px solid rgba(255,255,255,.08);
  color:#ffe9cc;
  font-size:.95rem;
}

.contact-details-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:16px;
}

.map-card{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:18px;
  align-items:stretch;
}

.map-card-copy p{
  color:var(--muted);
}

.map-frame-wrap{
  min-height:360px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:#121821;
}

.map-frame{
  width:100%;
  height:100%;
  min-height:360px;
  border:0;
}

.whatsapp-float{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:80;
  width:64px;
  height:64px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(180deg, #32d951, #1fae44);
  box-shadow:0 14px 28px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.14) inset;
  color:#fff;
  transition:transform .2s ease, box-shadow .2s ease;
}

.whatsapp-float:hover{
  opacity:1;
  transform:translateY(-3px) scale(1.03);
  box-shadow:0 18px 34px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.18) inset;
}

.whatsapp-float svg{
  width:32px;
  height:32px;
  fill:currentColor;
}

.whatsapp-float-label{
  position:absolute;
  right:78px;
  white-space:nowrap;
  padding:10px 12px;
  border-radius:999px;
  background:rgba(11,15,20,.92);
  border:1px solid rgba(255,255,255,.1);
  color:#e9eef6;
  font-size:.92rem;
  box-shadow:var(--shadow);
  opacity:0;
  transform:translateX(8px);
  pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
}

.whatsapp-float:hover .whatsapp-float-label,
.whatsapp-float:focus-visible .whatsapp-float-label{
  opacity:1;
  transform:translateX(0);
}

@media (max-width:620px){
  .whatsapp-float{
    width:58px;
    height:58px;
    right:16px;
    bottom:16px;
  }

  .whatsapp-float-label{
    display:none;
  }
}

.services-header p:not(.sub){
  max-width:980px;
  color:var(--muted);
  margin:0 0 16px;
}

.services-strip{
  overflow:hidden;
  margin-bottom:28px;
}

.services-strip-track{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:14px;
}

.services-strip-item{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:16px;
  border-radius:14px;
  background:linear-gradient(180deg, rgba(255,180,42,.12), rgba(255,106,0,.04));
  border:1px solid rgba(255,255,255,.08);
}

.services-strip-item strong{
  color:#ffe9cc;
}

.services-strip-item span{
  color:var(--muted);
  font-size:.96rem;
}

.services-grid{
  display:grid;
  gap:20px;
  margin-bottom:28px;
}

.service-card{
  display:grid;
  grid-template-columns:minmax(240px, 340px) 1fr;
  gap:20px;
  align-items:stretch;
}

.service-image{
  width:100%;
  height:100%;
  min-height:260px;
  object-fit:cover;
  border-radius:14px;
}

.service-content p{
  color:var(--muted);
  margin-top:0;
}

.service-points h3{
  margin:0 0 8px;
}

.service-points p{
  margin:0;
  color:var(--muted);
}

.services-gallery{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:16px;
  margin-bottom:28px;
}

.services-gallery-item{
  margin:0;
}

.services-gallery-item img{
  width:100%;
  height:240px;
  object-fit:cover;
  margin-bottom:12px;
}

.services-gallery-item figcaption{
  color:var(--muted);
}

.services-gallery-item-large{
  grid-row:span 2;
}

.services-gallery-item-large img{
  height:100%;
  min-height:100%;
}

.section-spaced{
  margin-top:36px;
}

.projects-header{
  margin:8px 0 18px;
}

.projects-header p:not(.sub){
  max-width:980px;
  color:var(--muted);
  margin:0 0 16px;
}

.projects-section-heading{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:end;
  margin-bottom:18px;
}

.projects-section-copy,
.projects-gallery-note{
  color:var(--muted);
}

.projects-gallery-note{
  margin:0;
  padding:14px 16px;
  border:1px solid var(--border);
  border-radius:14px;
  background:rgba(255,255,255,.03);
}

.project-gallery{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:16px;
}

.project-card{
  padding:12px;
}

.project-card-button{
  width:100%;
  border:1px solid var(--border);
  color:var(--text);
  text-align:left;
  cursor:pointer;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.project-card-button:hover,
.project-card-button:focus-visible{
  transform:translateY(-3px);
  border-color:rgba(255,180,42,.45);
  box-shadow:0 14px 28px rgba(0,0,0,.28);
}

.project-card-button:focus-visible{
  outline:2px solid rgba(255,180,42,.55);
  outline-offset:2px;
}

.project-card .project-image{
  display:block;
  border-radius:12px;
  margin-bottom:14px;
}

.project-card-caption{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.project-card-caption strong{
  font-size:1rem;
}

.project-card-caption span{
  color:var(--muted);
  font-size:.96rem;
}

body.lightbox-open{
  overflow:hidden;
}

.project-lightbox[hidden]{
  display:none;
}

.project-lightbox{
  position:fixed;
  inset:0;
  z-index:90;
  display:grid;
  place-items:center;
  padding:24px;
}

.project-lightbox-backdrop{
  position:absolute;
  inset:0;
  background:rgba(4, 7, 10, .82);
  backdrop-filter:blur(6px);
}

.project-lightbox-figure{
  position:relative;
  z-index:1;
  width:min(100%, 1100px);
  margin:0;
  padding:18px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:20px;
  background:#10161d;
  box-shadow:0 18px 40px rgba(0,0,0,.45);
}

.project-lightbox-figure img{
  display:block;
  width:100%;
  max-height:78vh;
  object-fit:contain;
  border-radius:14px;
  background:#0b0f14;
}

.project-lightbox-figure figcaption{
  margin-top:12px;
  color:var(--steel);
  font-weight:600;
}

.project-lightbox-close{
  position:absolute;
  top:18px;
  right:18px;
  z-index:2;
  width:48px;
  height:48px;
  border:none;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:var(--text);
  font-size:1.8rem;
  line-height:1;
  cursor:pointer;
}

.project-lightbox-close:hover,
.project-lightbox-close:focus-visible{
  background:rgba(255,180,42,.22);
}

.project-ribbon{
  position:relative;
  overflow:hidden;
  padding:18px 0;
  margin-bottom:28px;
}

.project-ribbon::before,
.project-ribbon::after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:72px;
  z-index:2;
  pointer-events:none;
}

.project-ribbon::before{
  left:0;
  background:linear-gradient(90deg, rgba(11,15,20,.96), rgba(11,15,20,0));
}

.project-ribbon::after{
  right:0;
  background:linear-gradient(270deg, rgba(11,15,20,.96), rgba(11,15,20,0));
}

.project-ribbon-track{
  display:flex;
  width:max-content;
  gap:16px;
  animation:projectRibbonScroll 34s linear infinite;
}

.project-ribbon-item{
  margin:0;
  width:min(28vw, 300px);
  min-width:220px;
  aspect-ratio:4/3;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:var(--shadow);
  background:#121821;
  transform:translateY(0);
  animation:projectRibbonFloat 6s ease-in-out infinite;
}

.project-ribbon-item:nth-child(2n){
  animation-delay:-2s;
}

.project-ribbon-item:nth-child(3n){
  animation-delay:-4s;
}

.project-ribbon-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(1.08) contrast(1.04);
}

@keyframes projectRibbonScroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(calc(-50% - 8px))}
}

@keyframes projectRibbonFloat{
  0%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
  100%{transform:translateY(0)}
}

@media (max-width:620px){
  .project-ribbon-item{
    width:68vw;
    min-width:68vw;
  }

  .project-lightbox{
    padding:14px;
  }

  .project-lightbox-figure{
    padding:12px;
  }

  .project-lightbox-close{
    top:10px;
    right:10px;
  }
}

.projects-contact-cta{
  margin-top:8px;
}

.projects-contact-quote{
  margin-top:12px;
  color:#ffdebc;
}

@media (max-width:980px){
  .home-highlights-grid,
  .home-capability-grid,
  .about-strip-grid,
  .contact-highlights-grid,
  .services-strip-track{
    grid-template-columns:1fr 1fr;
  }

  .home-intro-grid,
  .home-about-grid,
  .projects-section-heading,
  .about-feature-card,
  .contact-layout,
  .map-card,
  .service-card{
    grid-template-columns:1fr;
  }

  .contact-details-grid,
  .project-gallery,
  .services-gallery{
    grid-template-columns:1fr 1fr;
  }

  .services-gallery-item-large{
    grid-row:auto;
    grid-column:1 / -1;
  }

  .services-gallery-item-large img{
    height:280px;
  }

  .section-spaced{
    margin-top:30px;
  }
}

@media (max-width:620px){
  .home-highlights-grid,
  .home-capability-grid,
  .about-strip-grid,
  .contact-highlights-grid,
  .project-gallery,
  .services-strip-track,
  .services-gallery{
    grid-template-columns:1fr;
  }

  .contact-details-grid{
    grid-template-columns:1fr;
  }

  .services-gallery-item-large{
    grid-column:auto;
  }

  .services-gallery-item img,
  .services-gallery-item-large img{
    height:220px;
  }
}