/* =========================================================
   ARCADATA WEB
   Sección independiente para diseño y desarrollo de websites
   ========================================================= */

.aw-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 18%,rgba(37,99,235,.18),transparent 30%),
    radial-gradient(circle at 88% 38%,rgba(14,165,233,.12),transparent 28%),
    linear-gradient(180deg,#020817 0%,#06101f 48%,#020817 100%);
  color:#f8fafc;
  padding:100px 24px 110px;
  font-family:inherit;
}

.aw-section *,
.aw-section *::before,
.aw-section *::after{
  box-sizing:border-box;
}

.aw-section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.20;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:44px 44px;
}

.aw-container{
  position:relative;
  z-index:1;
  width:100%;
  max-width:1280px;
  margin:0 auto;
}

/* HERO */

.aw-hero{
  max-width:900px;
  margin:0 auto 76px;
  text-align:center;
}

.aw-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:8px 16px;
  border:1px solid rgba(56,189,248,.38);
  border-radius:999px;
  background:rgba(14,165,233,.08);
  color:#7dd3fc;
  font-size:12px;
  line-height:1;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin-bottom:22px;
}

.aw-hero h2{
  margin:0;
  color:#fff;
  font-size:clamp(38px,5vw,68px);
  line-height:1.02;
  letter-spacing:-.045em;
  font-weight:950;
}

.aw-hero h2 span{
  color:#38bdf8;
}

.aw-hero p{
  max-width:760px;
  margin:24px auto 0;
  color:#aebed1;
  font-size:18px;
  line-height:1.75;
}

.aw-trust{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:12px 26px;
  margin-top:30px;
  color:#d7e2ef;
  font-size:13px;
  font-weight:750;
}

.aw-trust span{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.aw-trust i{
  display:inline-block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#38bdf8;
  box-shadow:0 0 14px rgba(56,189,248,.7);
}

/* PORTFOLIO */

.aw-heading{
  text-align:center;
  margin-bottom:32px;
}

.aw-heading small{
  display:block;
  margin-bottom:10px;
  color:#38bdf8;
  font-size:11px;
  font-weight:900;
  letter-spacing:.2em;
  text-transform:uppercase;
}

.aw-heading h3{
  margin:0;
  color:#fff;
  font-size:clamp(28px,3vw,42px);
  line-height:1.12;
  letter-spacing:-.025em;
}

.aw-heading p{
  max-width:680px;
  margin:14px auto 0;
  color:#94a3b8;
  line-height:1.7;
}

.aw-projects{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  margin-bottom:24px;
}

.aw-project{
  min-width:0;
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:300px;
  padding:28px;
  border:1px solid rgba(148,163,184,.16);
  border-radius:24px;
  background:linear-gradient(145deg,rgba(15,23,42,.88),rgba(7,15,29,.92));
  box-shadow:0 24px 60px rgba(0,0,0,.22);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}

.aw-project:hover{
  transform:translateY(-5px);
  border-color:rgba(56,189,248,.34);
  box-shadow:0 28px 70px rgba(0,0,0,.34);
}

.aw-logo-box{
  height:160px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  margin-bottom:20px;
  border-radius:18px;
  background:
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.08),transparent 68%),
    rgba(255,255,255,.035);
  overflow:hidden;
}

.aw-logo-box img{
  display:block;
  max-width:100%;
  max-height:120px;
  width:auto;
  height:auto;
  object-fit:contain;
}

.aw-project h4{
  margin:0;
  color:#fff;
  font-size:19px;
  font-weight:900;
  line-height:1.3;
}

.aw-project p{
  margin:8px 0 0;
  color:#8fa1b5;
  font-size:14px;
  line-height:1.6;
}

/* PASION - PROYECTO DESTACADO */

.aw-featured{
  position:relative;
  display:grid;
  grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);
  gap:42px;
  align-items:center;
  margin-top:20px;
  padding:44px;
  border:1px solid rgba(56,189,248,.34);
  border-radius:30px;
  background:
    radial-gradient(circle at 12% 50%,rgba(37,99,235,.22),transparent 38%),
    linear-gradient(135deg,rgba(10,23,43,.97),rgba(3,10,22,.98));
  box-shadow:0 32px 90px rgba(0,0,0,.34);
  overflow:hidden;
}

.aw-featured::after{
  content:"";
  position:absolute;
  width:280px;
  height:280px;
  right:-100px;
  top:-110px;
  border-radius:50%;
  background:rgba(56,189,248,.08);
  filter:blur(10px);
}

.aw-featured-logo{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:270px;
  padding:28px;
  border-radius:24px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
}

.aw-featured-logo a:first-child{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
}

.aw-featured-logo img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:170px;
  object-fit:contain;
  transition:transform .25s ease;
}

.aw-featured-logo a:hover img{
  transform:scale(1.035);
}

.aw-project-url{
  margin-top:18px;
  color:#7dd3fc;
  font-size:14px;
  font-weight:800;
  text-decoration:none;
  word-break:break-word;
}

.aw-project-url:hover{
  color:#fff;
}

.aw-featured-copy{
  position:relative;
  z-index:1;
}

.aw-model{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(56,189,248,.11);
  color:#7dd3fc;
  border:1px solid rgba(56,189,248,.25);
  font-size:11px;
  font-weight:950;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.aw-featured h4{
  margin:0;
  color:#fff;
  font-size:clamp(28px,3vw,42px);
  line-height:1.1;
  letter-spacing:-.025em;
}

.aw-featured-copy > p{
  margin:16px 0 0;
  max-width:660px;
  color:#aebed1;
  font-size:16px;
  line-height:1.75;
}

.aw-feature-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:24px 0 28px;
}

.aw-feature{
  display:flex;
  align-items:flex-start;
  gap:10px;
  color:#d8e3ef;
  font-size:14px;
  line-height:1.45;
}

.aw-feature b{
  flex:0 0 auto;
  color:#38bdf8;
}

.aw-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 22px;
  border-radius:12px;
  text-decoration:none;
  font-size:14px;
  font-weight:900;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}

.aw-btn:hover{
  transform:translateY(-2px);
}

.aw-btn-primary{
  color:#03111f;
  background:linear-gradient(135deg,#7dd3fc,#38bdf8);
  box-shadow:0 12px 32px rgba(14,165,233,.22);
}

.aw-btn-primary:hover{
  box-shadow:0 16px 40px rgba(14,165,233,.34);
}

/* CONTROL DEL CLIENTE */

.aw-control{
  margin-top:86px;
  padding:52px;
  border-radius:30px;
  border:1px solid rgba(148,163,184,.14);
  background:rgba(5,13,26,.72);
  box-shadow:0 30px 80px rgba(0,0,0,.22);
}

.aw-control-head{
  max-width:760px;
  margin:0 auto 40px;
  text-align:center;
}

.aw-control-head small{
  display:block;
  margin-bottom:10px;
  color:#38bdf8;
  font-size:11px;
  font-weight:950;
  letter-spacing:.18em;
}

.aw-control-head h3{
  margin:0;
  color:#fff;
  font-size:clamp(30px,4vw,48px);
  letter-spacing:-.035em;
  line-height:1.08;
}

.aw-control-head p{
  margin:16px auto 0;
  color:#9badc0;
  font-size:16px;
  line-height:1.7;
}

.aw-flow{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  align-items:center;
  gap:14px;
}

.aw-step{
  min-height:150px;
  padding:24px 18px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-radius:20px;
  background:linear-gradient(145deg,rgba(15,23,42,.92),rgba(8,17,31,.92));
  border:1px solid rgba(148,163,184,.14);
}

.aw-step-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin-bottom:14px;
  border-radius:14px;
  background:rgba(56,189,248,.10);
  border:1px solid rgba(56,189,248,.18);
  color:#7dd3fc;
  font-size:21px;
  font-weight:900;
}

.aw-step strong{
  display:block;
  color:#fff;
  font-size:14px;
  line-height:1.35;
}

.aw-step span{
  display:block;
  margin-top:6px;
  color:#7f91a6;
  font-size:12px;
  line-height:1.45;
}

.aw-arrow{
  color:#38bdf8;
  font-size:24px;
  font-weight:900;
  opacity:.75;
}

.aw-admin-note{
  display:flex;
  align-items:flex-start;
  gap:16px;
  max-width:840px;
  margin:32px auto 0;
  padding:20px 22px;
  border-radius:18px;
  background:rgba(37,99,235,.08);
  border:1px solid rgba(96,165,250,.18);
}

.aw-admin-note-icon{
  flex:0 0 auto;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(56,189,248,.12);
  color:#7dd3fc;
  font-weight:950;
}

.aw-admin-note strong{
  display:block;
  color:#fff;
  margin-bottom:4px;
}

.aw-admin-note p{
  margin:0;
  color:#9badc0;
  font-size:14px;
  line-height:1.6;
}

/* CTA */

.aw-cta{
  position:relative;
  overflow:hidden;
  margin-top:76px;
  padding:58px 32px;
  text-align:center;
  border-radius:30px;
  border:1px solid rgba(56,189,248,.24);
  background:
    radial-gradient(circle at 50% 130%,rgba(14,165,233,.30),transparent 46%),
    linear-gradient(135deg,#071427,#030a15);
}

.aw-cta small{
  color:#7dd3fc;
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
}

.aw-cta h3{
  margin:12px 0 0;
  color:#fff;
  font-size:clamp(32px,4vw,52px);
  line-height:1.05;
  letter-spacing:-.035em;
}

.aw-cta p{
  margin:14px 0 28px;
  color:#a7b7c9;
  font-size:16px;
}

.aw-cta .aw-btn{
  min-height:52px;
  padding:0 28px;
}

/* RESPONSIVE */

@media(max-width:900px){
  .aw-section{
    padding:78px 18px 84px;
  }

  .aw-projects{
    grid-template-columns:1fr;
  }

  .aw-project{
    min-height:auto;
  }

  .aw-featured{
    grid-template-columns:1fr;
    gap:28px;
    padding:30px;
  }

  .aw-featured-logo{
    min-height:230px;
  }

  .aw-control{
    padding:38px 24px;
  }

  .aw-flow{
    grid-template-columns:1fr;
    gap:10px;
  }

  .aw-arrow{
    transform:rotate(90deg);
    justify-self:center;
  }
}

@media(max-width:600px){
  .aw-section{
    padding:64px 14px 70px;
  }

  .aw-hero{
    margin-bottom:58px;
  }

  .aw-hero h2{
    font-size:38px;
  }

  .aw-hero p{
    font-size:16px;
  }

  .aw-trust{
    gap:10px 18px;
    font-size:12px;
  }

  .aw-project{
    padding:20px;
    border-radius:20px;
  }

  .aw-logo-box{
    height:145px;
  }

  .aw-featured{
    padding:20px;
    border-radius:22px;
  }

  .aw-featured-logo{
    min-height:205px;
    padding:20px;
  }

  .aw-feature-list{
    grid-template-columns:1fr;
  }

  .aw-control{
    margin-top:60px;
    padding:30px 18px;
    border-radius:22px;
  }

  .aw-step{
    min-height:125px;
  }

  .aw-admin-note{
    padding:18px;
  }

  .aw-cta{
    margin-top:60px;
    padding:44px 20px;
    border-radius:22px;
  }

  .aw-btn{
    width:100%;
  }
}

/* PASION IGLESIA - TITULO + LOGO */
.aw-pasion-title{
  display:flex;
  align-items:center;
  gap:18px;
  margin:0 0 4px;
}

.aw-pasion-title h4{
  margin:0;
  flex:0 0 auto;
}

.aw-pasion-title img{
  display:block;
  width:auto;
  height:72px;
  max-width:180px;
  object-fit:contain;
}

@media(max-width:600px){
  .aw-pasion-title{
    gap:12px;
    flex-wrap:wrap;
  }

  .aw-pasion-title img{
    height:58px;
    max-width:145px;
  }
}

/* PORTAFOLIO - NORMALIZAR LOGOS BUFFALOS Y DISENADAS */
.aw-projects .aw-project:nth-child(1) .aw-logo-box img,
.aw-projects .aw-project:nth-child(2) .aw-logo-box img{
  width:150px;
  height:150px;
  max-width:150px;
  max-height:150px;
  object-fit:contain;
  object-position:center;
}

/* PORTAFOLIO - TAMANO UNIFORME FINAL PARA LOS 3 LOGOS */
.aw-projects .aw-project .aw-logo-box{
  display:flex;
  align-items:center;
  justify-content:center;
}

.aw-projects .aw-project .aw-logo-box img,
.aw-projects .aw-project:nth-child(1) .aw-logo-box img,
.aw-projects .aw-project:nth-child(2) .aw-logo-box img,
.aw-projects .aw-project:nth-child(3) .aw-logo-box img{
  display:block;
  width:180px;
  height:160px;
  max-width:180px;
  max-height:160px;
  object-fit:contain;
  object-position:center;
  margin:0 auto;
}

/* DISENADAS OKLAHOMA - AJUSTE FINAL DE TAMANO */
.aw-projects .aw-project:nth-child(2) .aw-logo-box img{
  width:220px;
  height:190px;
  max-width:220px;
  max-height:190px;
  object-fit:contain;
  object-position:center;
}

/* DISENADAS OKLAHOMA - IGUALAR AREA VISIBLE CON BUFFALOS */
.aw-projects .aw-project:nth-child(2) .aw-logo-box img{
  transform:scale(1.66);
  transform-origin:center center;
}

/* BUFFALOS + DISENADAS - TAMANO FINAL DENTRO DE LA TARJETA */
.aw-projects .aw-project:nth-child(1) .aw-logo-box img{
  width:153px;
  height:136px;
  max-width:153px;
  max-height:136px;
  transform:none;
}

.aw-projects .aw-project:nth-child(2) .aw-logo-box img{
  width:187px;
  height:162px;
  max-width:187px;
  max-height:162px;
  transform:scale(1.66);
  transform-origin:center center;
}