*{box-sizing:border-box}
:root{--blue:#0867ff;--navy:#06194e;--line:#dcecff;--shadow:0 8px 24px rgba(20,92,190,.06)}
html,body{margin:0;background:#fff;font-family:Arial,Helvetica,sans-serif;color:var(--navy)}
.blueprints-section{width:min(1320px,calc(100% - 40px));margin:42px auto;padding:28px 24px;border:1px solid var(--line);border-radius:22px}
.blueprints-row{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px;align-items:center}
.blueprints-intro{padding:14px 0}.kicker{font-size:13px;font-weight:800;color:var(--blue);margin-bottom:20px}
.blueprints-intro h1{font-size:27px;line-height:1.14;margin:0 0 34px;font-weight:800;letter-spacing:-.7px}
.all,.cta{color:var(--blue);text-decoration:none;font-weight:800;white-space:nowrap}.all{font-size:14px}.cta{font-size:12px;margin-top:auto}.all span,.cta span{padding-left:8px}
.blueprint-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;min-width:0}
.blueprint-card{height:270px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow);padding:22px 10px 18px;display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.blueprint-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(20,92,190,.10)}
.icon{height:78px;width:78px;margin:0 auto 18px;object-fit:contain}
.title{font-weight:800;font-size:16px;line-height:1.22;min-height:60px;display:flex;align-items:center;justify-content:center}
@media(max-width:1050px){.blueprints-section{width:calc(100% - 24px);padding:22px 16px}.blueprints-row{grid-template-columns:240px minmax(0,1fr);gap:14px}.blueprint-cards{gap:8px}.blueprint-card{padding-left:6px;padding-right:6px}.title{font-size:13px}.cta{font-size:10px}.blueprints-intro h1{font-size:23px}}
@media(max-width:820px){.blueprints-row{display:block}.blueprints-intro{margin-bottom:22px}.blueprint-cards{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.blueprint-cards{grid-template-columns:repeat(2,1fr)}}

/* ===== ION DIGITAL — ELEGANT HOVER SYSTEM ===== */
.blueprint-card{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  cursor:pointer;
  transition:
    transform .34s cubic-bezier(.2,.75,.25,1),
    box-shadow .34s ease,
    border-color .34s ease,
    background-color .34s ease;
}

/* soft internal blue wash */
.blueprint-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:0;
  background:
    radial-gradient(circle at 50% 22%, rgba(8,103,255,.09), transparent 40%),
    linear-gradient(180deg, rgba(246,250,255,.85), rgba(255,255,255,1));
  transition:opacity .34s ease;
}

/* fine blue accent at bottom */
.blueprint-card::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:0;
  height:3px;
  border-radius:999px 999px 0 0;
  background:#0867ff;
  transform:translateX(-50%);
  transition:width .34s cubic-bezier(.2,.75,.25,1);
}

.blueprint-card:hover{
  transform:translateY(-7px);
  border-color:#bcd6ff;
  box-shadow:
    0 18px 42px rgba(17,76,170,.12),
    0 4px 12px rgba(17,76,170,.06);
}

.blueprint-card:hover::before{opacity:1}
.blueprint-card:hover::after{width:52%}

.blueprint-card .icon{
  transition:
    transform .38s cubic-bezier(.2,.75,.25,1),
    filter .38s ease;
}

.blueprint-card:hover .icon{
  transform:translateY(-3px) scale(1.065);
  filter:drop-shadow(0 7px 10px rgba(8,103,255,.13));
}

.blueprint-card .title{
  transition:color .28s ease, transform .34s cubic-bezier(.2,.75,.25,1);
}

.blueprint-card:hover .title{
  color:#08245f;
  transform:translateY(-1px);
}

.blueprint-card .cta{
  position:relative;
  transition:color .25s ease, transform .28s ease;
}

.blueprint-card .cta span{
  display:inline-block;
  transition:transform .28s cubic-bezier(.2,.75,.25,1);
}

.blueprint-card:hover .cta{
  color:#005cff;
  transform:translateY(-1px);
}

.blueprint-card:hover .cta span{
  transform:translateX(5px);
}

.blueprint-card:active{
  transform:translateY(-3px) scale(.992);
}

.blueprint-card:focus-within{
  outline:2px solid rgba(8,103,255,.38);
  outline-offset:3px;
}

/* Intro CTA */
.all{
  position:relative;
  transition:color .25s ease;
}
.all::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-7px;
  width:0;
  height:2px;
  background:#0867ff;
  transition:width .3s ease;
}
.all span{
  display:inline-block;
  transition:transform .28s ease;
}
.all:hover::after{width:100%}
.all:hover span{transform:translateX(6px)}

/* Respect accessibility settings */
@media (prefers-reduced-motion: reduce){
  .blueprint-card,
  .blueprint-card::before,
  .blueprint-card::after,
  .blueprint-card .icon,
  .blueprint-card .title,
  .blueprint-card .cta,
  .blueprint-card .cta span,
  .all,
  .all::after,
  .all span{
    transition:none !important;
  }
  .blueprint-card:hover,
  .blueprint-card:hover .icon,
  .blueprint-card:hover .title,
  .blueprint-card:hover .cta,
  .blueprint-card:hover .cta span,
  .all:hover span{
    transform:none !important;
  }
}
