/* ============================================================
   UNIWEBAPPS — Section-specific styles (premium editorial)
   ============================================================ */

/* ===================== NAVBAR ===================== */
.uwa-nav {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--uwa-nav-h);
  z-index: 100;
  display: flex;
  align-items: center;
  transition: background var(--uwa-duration) var(--uwa-ease),
              box-shadow var(--uwa-duration) var(--uwa-ease),
              backdrop-filter var(--uwa-duration) var(--uwa-ease),
              height var(--uwa-duration) var(--uwa-ease);
}
.uwa-nav.is-scrolled {
  height: 78px;
  background: rgba(245, 244, 239, 0.82);
  backdrop-filter: saturate(180%) blur(16px);
  box-shadow: 0 1px 0 var(--uwa-border);
}
.uwa-nav__inner { display: flex; align-items: center; justify-content: space-between; width: 100%; }
.uwa-nav__logo { width: 100px; height: auto; }
.uwa-nav__menu { display: flex; align-items: center; gap: 2.4rem; }
.uwa-nav__link {
  position: relative;
  font-size: var(--uwa-fs-body);
  font-weight: 500;
  color: var(--uwa-t1);
  padding: 0.35rem 0;
  transition: color var(--uwa-duration) var(--uwa-ease);
}
.uwa-nav__link::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 0; height: 2px;
  background: var(--uwa-grad);
  border-radius: 2px;
  transition: width var(--uwa-duration) var(--uwa-ease);
}
.uwa-nav__link:hover, .uwa-nav__link.is-active { color: var(--uwa-blue); }
.uwa-nav__link:hover::after, .uwa-nav__link.is-active::after { width: 100%; }
.uwa-nav__cta-mobile { display: none; }

/* nav submenu (Services dropdown) */
.uwa-nav__has-sub { position: relative; display: inline-flex; align-items: center; gap: 0.1rem; }
.uwa-nav__has-sub::before { content: ""; position: absolute; top: 100%; left: 0; right: 0; height: 0.7rem; }
.uwa-nav__caret { display: inline-grid; place-items: center; padding: 0.4rem; color: var(--uwa-t1); font-size: 0.66rem; transition: transform var(--uwa-duration) var(--uwa-ease); }
.uwa-nav__sub {
  position: absolute; top: calc(100% + 0.7rem); left: 50%; transform: translateX(-50%) translateY(8px);
  min-width: 316px; display: flex; flex-direction: column;
  background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-md);
  box-shadow: var(--uwa-shadow-lg); padding: 0.5rem;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease), visibility var(--uwa-duration);
  z-index: 60;
}
.uwa-nav__has-sub:hover .uwa-nav__sub,
.uwa-nav__has-sub.is-open .uwa-nav__sub { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.uwa-nav__has-sub:hover .uwa-nav__caret { transform: rotate(180deg); }
.uwa-nav__sub a { padding: 0.7rem 1rem; border-radius: var(--uwa-r-sm); font-size: 15px; font-weight: 500; color: var(--uwa-t1); white-space: nowrap; transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease); }
.uwa-nav__sub a:hover { background: var(--uwa-surface-warm); color: var(--uwa-blue); }

.uwa-nav__toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  width: 44px; height: 44px;
  align-items: center; justify-content: center;
}
.uwa-nav__toggle span { width: 24px; height: 2px; background: var(--uwa-t1); border-radius: 2px; transition: transform var(--uwa-duration) var(--uwa-ease), opacity var(--uwa-duration) var(--uwa-ease); }
.uwa-nav__toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.uwa-nav__toggle.is-open span:nth-child(2) { opacity: 0; }
.uwa-nav__toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ===================== HERO (editorial, full height) ===================== */
.uwa-hero {
  position: relative;
  min-height: calc(100vh - var(--uwa-marquee-h));
  min-height: calc(100svh - var(--uwa-marquee-h));
  display: flex;
  align-items: stretch;
  padding-top: calc(var(--uwa-nav-h) + 1.5rem);
  padding-bottom: 2.5rem;
  overflow: hidden;
}
.uwa-hero__inner { position: relative; z-index: 1; width: 100%; display: flex; flex-direction: column; justify-content: space-evenly; }

/* top bar */
.uwa-hero__topbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1.5rem; flex-wrap: wrap; margin-bottom: 0.5rem;
}
.uwa-hero__lead-group { display: block; }
.uwa-hero__status {
  display: inline-flex; align-items: center; gap: 0.6rem;
  font-size: var(--uwa-fs-small); font-weight: 500; color: var(--uwa-t1);
  padding: 0.5rem 1.05rem; background: var(--uwa-surface);
  border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-full);
}
.uwa-hero__dot { width: 9px; height: 9px; border-radius: 50%; background: #22C55E; position: relative; }
.uwa-hero__dot::after {
  content: ""; position: absolute; inset: -5px; border-radius: 50%;
  border: 2px solid rgba(34,197,94,0.4); animation: uwa-ping 1.8s var(--uwa-ease) infinite;
}
@keyframes uwa-ping { 0% { transform: scale(0.6); opacity: 1; } 100% { transform: scale(1.6); opacity: 0; } }

/* head row: big title + rotating badge */
.uwa-hero__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; }
.uwa-hero__title { flex: 1; letter-spacing: -0.03em; }
.uwa-hero__badge {
  position: relative; flex-shrink: 0; width: 128px; height: 128px;
  display: grid; place-items: center; margin-top: 0.5rem;
}
.uwa-hero__badge-svg { position: absolute; inset: 0; width: 100%; height: 100%; animation: uwa-spin 18s linear infinite; }
.uwa-hero__badge-svg text { font-family: var(--uwa-fh); font-size: 9.4px; font-weight: 600; letter-spacing: 0.14em; fill: var(--uwa-t1); text-transform: uppercase; }
.uwa-hero__badge-ico {
  width: 52px; height: 52px; display: grid; place-items: center; border-radius: 50%;
  background: var(--uwa-grad); color: #fff; font-size: 1.05rem; box-shadow: var(--uwa-shadow-glow);
}
@keyframes uwa-spin { to { transform: rotate(360deg); } }

/* divider line below heading */
.uwa-hero__divider { height: 1px; background: var(--uwa-border-ink); margin: 1.25rem 0; }

/* body: lead + actions */
.uwa-hero__body { display: grid; grid-template-columns: 1fr auto; gap: 2.5rem; align-items: center; }
.uwa-hero__lead { max-width: 40rem; }
.uwa-hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; }

/* metrics band */
.uwa-hero__metrics {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem;
  margin-top: 1rem; padding-top: 1.6rem; border-top: 1px solid var(--uwa-border);
}
.uwa-hero__metric { display: flex; align-items: center; gap: 0.8rem; }
.uwa-hero__metric-ico {
  flex-shrink: 0; width: 46px; height: 46px; display: grid; place-items: center;
  border-radius: 13px; background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1.05rem;
}
.uwa-hero__metric-label { font-size: var(--uwa-fs-body); font-weight: 500; color: var(--uwa-t1); line-height: 1.25; }

/* ===================== MARQUEE ===================== */
.uwa-marquee {
  height: var(--uwa-marquee-h);
  display: flex;
  align-items: center;
  overflow: hidden;
  border-top: 1px solid var(--uwa-border);
  border-bottom: 1px solid var(--uwa-border);
  background: var(--uwa-bg-alt);
}
.uwa-marquee__track { display: flex; flex-shrink: 0; width: max-content; animation: uwa-scroll 34s linear infinite; }
.uwa-marquee__track span {
  display: inline-flex; align-items: center; gap: 1.4rem;
  flex-shrink: 0; white-space: nowrap;
  font-family: var(--uwa-fh);
  font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem);
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--uwa-t1);
  padding-right: 1.4rem;
}
.uwa-marquee__track i { flex-shrink: 0; }
.uwa-marquee__track i { font-size: 0.6em; color: var(--uwa-blue); }
@keyframes uwa-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.uwa-marquee:hover .uwa-marquee__track { animation-play-state: paused; }

/* ===================== SECTION TOPLINE ===================== */
.uwa-section-topline__title { margin-top: 1rem; }
.uwa-section-topline__desc { max-width: 22rem; }

/* ===================== SERVICES (premium cards) ===================== */
.uwa-services { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
.uwa-service {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; align-items: flex-start; gap: 0.8rem;
  padding: 2.2rem 1.9rem 2rem;
  background: var(--uwa-surface);
  border: 1px solid var(--uwa-border);
  border-radius: var(--uwa-r-lg);
  box-shadow: var(--uwa-shadow-sm);
  transition: transform var(--uwa-duration) var(--uwa-ease),
              box-shadow var(--uwa-duration) var(--uwa-ease),
              border-color var(--uwa-duration) var(--uwa-ease);
}
/* gradient wash appears on hover */
.uwa-service::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background: var(--uwa-grad); opacity: 0;
  transition: opacity var(--uwa-duration) var(--uwa-ease);
}
.uwa-service > * { position: relative; z-index: 1; }
.uwa-service:hover { transform: translateY(-8px); box-shadow: var(--uwa-shadow-lg); border-color: transparent; }
.uwa-service:hover::before { opacity: 1; }
.uwa-service:hover .uwa-service__title,
.uwa-service:hover .uwa-service__num,
.uwa-service:hover .uwa-link { color: #fff; }
.uwa-service:hover .uwa-body { color: rgba(255,255,255,0.9); }
.uwa-service:hover .uwa-service__icon { background: rgba(255,255,255,0.18); color: #fff; transform: rotate(-6deg); }
.uwa-service:hover .uwa-link i { transform: translate(2px,-2px); }

.uwa-service__num {
  position: absolute; top: 1.5rem; right: 1.75rem;
  font-family: var(--uwa-fh); font-style: normal; font-weight: 600; font-size: 1.6rem;
  color: var(--uwa-t3); transition: color var(--uwa-duration) var(--uwa-ease);
}
.uwa-service__icon {
  width: 58px; height: 58px; display: grid; place-items: center; border-radius: 16px;
  background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1.4rem;
  transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease);
}
.uwa-service__title { margin-top: 0.3rem; transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-service .uwa-body { transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-service__link { margin-top: auto; padding-top: 0.6rem; }

/* feature CTA card — always gradient */
.uwa-service--cta { background: var(--uwa-grad); border-color: transparent; justify-content: center; box-shadow: var(--uwa-shadow-md); }
.uwa-service--cta::before { display: none; }
.uwa-service--cta:hover { transform: translateY(-8px); box-shadow: var(--uwa-shadow-lg); }
.uwa-service--cta .uwa-service__title { color: #fff; }
.uwa-service--cta .uwa-body { color: rgba(255,255,255,0.9); }
.uwa-service__cta-btn { margin-top: 1rem; }

/* ===================== SELECTED WORK (rich cards + browser mockup) ===================== */
.uwa-rich {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 2rem; margin-top: var(--uwa-sp-xl);
}
.uwa-rich__card {
  position: relative; display: block;
  transition: transform var(--uwa-duration) var(--uwa-ease);
}
.uwa-rich__card:hover { transform: translateY(-6px); }

/* browser device mockup */
.uwa-rich__mock {
  border-radius: 14px; overflow: hidden;
  border: 1px solid var(--uwa-border); box-shadow: var(--uwa-shadow-md);
  transition: box-shadow var(--uwa-duration) var(--uwa-ease);
}
.uwa-rich__card:hover .uwa-rich__mock { box-shadow: var(--uwa-shadow-lg); }
.uwa-rich__bar {
  display: flex; align-items: center; gap: 0.9rem;
  padding: 0.7rem 1rem; background: var(--uwa-surface-warm);
  border-bottom: 1px solid var(--uwa-border);
}
.uwa-rich__dots { display: flex; gap: 6px; flex-shrink: 0; }
.uwa-rich__dots span { width: 10px; height: 10px; border-radius: 50%; background: var(--uwa-border-ink); }
.uwa-rich__dots span:nth-child(1) { background: #FF5F57; }
.uwa-rich__dots span:nth-child(2) { background: #FEBC2E; }
.uwa-rich__dots span:nth-child(3) { background: #28C840; }
.uwa-rich__url {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font-size: var(--uwa-fs-small); color: var(--uwa-t3);
  background: var(--uwa-bg); border: 1px solid var(--uwa-border);
  border-radius: var(--uwa-r-full); padding: 0.3rem 0.9rem;
  max-width: 68%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.uwa-rich__url i { font-size: 0.72em; }
.uwa-rich__screen { overflow: hidden; aspect-ratio: 16 / 10; background: var(--uwa-surface-warm); }
.uwa-rich__screen img {
  width: 100%; height: 100%; object-fit: cover; object-position: top center;
  transition: transform 0.9s var(--uwa-ease);
}
.uwa-rich__card:hover .uwa-rich__screen img { transform: scale(1.04); }

/* body */
.uwa-rich__body { padding: 1.3rem 0.25rem 0; }
.uwa-rich__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.uwa-rich__name { transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-rich__card:hover .uwa-rich__name { color: var(--uwa-blue); }
.uwa-rich__cat { display: block; margin-top: 0.25rem; font-size: var(--uwa-fs-small); color: var(--uwa-t3); }
.uwa-rich__arrow {
  flex-shrink: 0; width: 44px; height: 44px; display: grid; place-items: center;
  border-radius: 50%; border: 1px solid var(--uwa-border-ink); color: var(--uwa-t1);
  transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease);
}
.uwa-rich__card:hover .uwa-rich__arrow { background: var(--uwa-grad); color: #fff; border-color: transparent; transform: rotate(45deg); }
.uwa-rich__desc { margin-top: 0.9rem; font-size: var(--uwa-fs-body); color: var(--uwa-t2); }

/* results strip */
.uwa-rich__stats {
  display: flex; margin-top: 1.3rem; padding: 1rem 0.5rem;
  background: var(--uwa-surface-warm); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-md);
}
.uwa-rich__stat { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; text-align: center; position: relative; }
.uwa-rich__stat:not(:last-child)::after {
  content: ""; position: absolute; right: 0; top: 12%; height: 76%; width: 1px; background: var(--uwa-border);
}
.uwa-rich__stat-ico {
  width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px;
  background: var(--uwa-grad); color: #fff; font-size: 0.9rem;
}
.uwa-rich__stat-lab { display: block; font-size: var(--uwa-fs-small); font-weight: 500; color: var(--uwa-t1); line-height: 1.25; }

/* ===================== ABOUT + STATS (bento grid) ===================== */
.uwa-bento-about {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-areas:
    "intro intro intro brand"
    "val1  val2  val3  brand";
  gap: 1.5rem;
}
.uwa-bento-about > :nth-child(1) { grid-area: intro; }
.uwa-bento-about > :nth-child(2) { grid-area: brand; }
.uwa-bento-about > :nth-child(3) { grid-area: val1; }
.uwa-bento-about > :nth-child(4) { grid-area: val2; }
.uwa-bento-about > :nth-child(5) { grid-area: val3; }
.uwa-bento-about > :nth-child(6) { grid-area: stats; }

/* intro tile */
.uwa-ba-intro {
  display: flex; flex-direction: column; justify-content: center;
  background: var(--uwa-surface); border: 1px solid var(--uwa-border);
  border-radius: var(--uwa-r-lg); padding: 2.6rem 2.4rem;
}
.uwa-ba-intro__title { margin: 1rem 0; }

/* brand gradient panel (tall, spans 2 rows) */
.uwa-ba-brand {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; justify-content: space-between; gap: 2rem;
  background: var(--uwa-grad); border-radius: var(--uwa-r-lg);
  padding: 2.4rem; color: #fff; box-shadow: var(--uwa-shadow-md);
  min-height: 260px;
}
.uwa-ba-brand::after {
  content: ""; position: absolute; top: -25%; right: -20%;
  width: 240px; height: 240px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.22), transparent 65%);
}
.uwa-ba-brand__badge {
  position: relative; z-index: 1;
  width: 56px; height: 56px; display: grid; place-items: center;
  border-radius: 16px; background: rgba(255,255,255,0.18); font-size: 1.4rem;
}
.uwa-ba-brand__title { position: relative; z-index: 1; display: block; font-family: var(--uwa-fh); font-size: 1.9rem; font-weight: 600; line-height: 1.1; letter-spacing: -0.02em; }
.uwa-ba-brand__text { position: relative; z-index: 1; margin-top: 0.7rem; color: rgba(255,255,255,0.9); font-size: var(--uwa-fs-body); }

/* value tiles */
.uwa-ba-value {
  background: var(--uwa-surface); border: 1px solid var(--uwa-border);
  border-radius: var(--uwa-r-lg); padding: 1.8rem;
  transition: transform var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease);
}
.uwa-ba-value:hover { transform: translateY(-6px); box-shadow: var(--uwa-shadow-md); border-color: transparent; }
.uwa-ba-value__icon {
  width: 48px; height: 48px; display: grid; place-items: center; border-radius: 12px;
  background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1.15rem; margin-bottom: 1.1rem;
}
.uwa-ba-value h4 { margin-bottom: 0.4rem; }

/* dark stats strip (bottom of the bento) */
.uwa-ba-stats {
  position: relative; overflow: hidden;
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; align-items: center;
  background: var(--uwa-grad-navy); border-radius: var(--uwa-r-lg);
  padding: 2.4rem 2.6rem; box-shadow: var(--uwa-shadow-lg);
}
.uwa-ba-stats__glow {
  position: absolute; top: -60%; left: 32%; width: 420px; height: 420px; pointer-events: none;
  background: radial-gradient(circle, rgba(39,192,240,0.25), transparent 65%);
}
.uwa-ba-stat { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 0.85rem; text-align: center; }
.uwa-ba-stat:not(:last-child)::after {
  content: ""; position: absolute; right: 0; top: 12%; height: 76%; width: 1px; background: rgba(255,255,255,0.12);
}
.uwa-ba-stat__ico {
  width: 54px; height: 54px; display: grid; place-items: center; border-radius: 15px;
  background: rgba(39,192,240,0.16); color: var(--uwa-cyan); font-size: 1.3rem;
}
.uwa-ba-stat__label { display: block; color: #fff; font-weight: 500; font-size: var(--uwa-fs-body); line-height: 1.35; max-width: 12rem; }

/* ===================== PROCESS (vertical timeline) ===================== */
.uwa-process { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 4rem; align-items: start; }
.uwa-process__intro { position: sticky; top: 110px; }
.uwa-process__intro-title { margin: 1rem 0; }
.uwa-process__cta { margin-top: 1.9rem; }

.uwa-process__timeline { display: flex; flex-direction: column; }
.uwa-process__step {
  position: relative;
  display: grid; grid-template-columns: 56px 1fr; gap: 1.6rem;
  padding-bottom: 2.75rem;
}
.uwa-process__step:last-child { padding-bottom: 0; }
/* connecting line to next node */
.uwa-process__step:not(:last-child)::before {
  content: ""; position: absolute; left: 27px; top: 62px; bottom: 0; width: 2px;
  background: linear-gradient(180deg, rgba(36,86,230,0.4), rgba(39,192,240,0.4));
}
.uwa-process__node {
  position: relative; z-index: 1;
  width: 56px; height: 56px; display: grid; place-items: center; border-radius: 50%;
  background: var(--uwa-surface); border: 1.5px solid var(--uwa-border-ink);
  font-family: var(--uwa-fh); font-weight: 700; font-size: 1.15rem; color: var(--uwa-t1);
  transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease);
}
.uwa-process__step:hover .uwa-process__node { background: var(--uwa-grad); color: #fff; border-color: transparent; transform: scale(1.08); }
.uwa-process__content { padding-top: 0.4rem; }
.uwa-process__head { display: flex; align-items: center; gap: 0.85rem; margin-bottom: 0.55rem; }
.uwa-process__ico {
  width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px;
  background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1rem;
  transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease);
}
.uwa-process__step:hover .uwa-process__ico { background: var(--uwa-grad); color: #fff; }

/* process on dark navy */
#process { position: relative; overflow: hidden; background: linear-gradient(165deg, #16295C 0%, #0C1836 100%); }
#process::before {
  content: ""; position: absolute; top: -12%; right: -6%;
  width: 560px; height: 560px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(39,192,240,0.16), transparent 62%);
}
#process::after {
  content: ""; position: absolute; bottom: -20%; left: -8%;
  width: 460px; height: 460px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(36,86,230,0.16), transparent 62%);
}
#process .uwa-process { position: relative; z-index: 1; }
#process .uwa-overline--muted { color: var(--uwa-cyan); }
#process .uwa-lead { color: var(--uwa-tw-soft); }
#process .uwa-accent-text { background: linear-gradient(100deg, #8FB8FF 0%, #34D0FF 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
#process .uwa-process__head h3 { color: #fff; }
#process .uwa-process__content .uwa-body { color: var(--uwa-tw-soft); }
#process .uwa-process__node {
  background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.2); color: #fff;
}
#process .uwa-process__step:hover .uwa-process__node { box-shadow: 0 0 0 6px rgba(39,192,240,0.14); }
#process .uwa-process__ico { background: rgba(39,192,240,0.16); color: var(--uwa-cyan); }
#process .uwa-process__step:not(:last-child)::before {
  background: linear-gradient(180deg, rgba(76,123,243,0.7), rgba(39,192,240,0.55));
}

/* ===================== BLOG ===================== */
/* category filter */
.uwa-blogfilter { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: var(--uwa-sp-lg); }
.uwa-blogfilter__btn {
  padding: 0.6rem 1.2rem; border-radius: var(--uwa-r-full);
  background: var(--uwa-surface); border: 1px solid var(--uwa-border);
  font-size: var(--uwa-fs-body); font-weight: 500; color: var(--uwa-t2); white-space: nowrap;
  transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease);
}
.uwa-blogfilter__btn:hover { border-color: var(--uwa-blue); color: var(--uwa-blue); }
.uwa-blogfilter__btn.is-active { background: var(--uwa-grad); border-color: transparent; color: #fff; box-shadow: var(--uwa-shadow-glow); }
.uwa-blogfilter__empty { margin-top: var(--uwa-sp-xl); font-size: var(--uwa-fs-body); color: var(--uwa-t2); }
.uwa-blog__card.is-hidden { display: none; }

.uwa-blog__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.75rem; margin-top: var(--uwa-sp-xl); }
.uwa-blog__card {
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--uwa-surface); border: 1px solid var(--uwa-border);
  border-radius: var(--uwa-r-lg); box-shadow: var(--uwa-shadow-sm);
  transition: transform var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease);
}
.uwa-blog__card:hover { transform: translateY(-8px); box-shadow: var(--uwa-shadow-lg); border-color: transparent; }
.uwa-blog__media {
  position: relative; display: block; overflow: hidden;
  aspect-ratio: 16 / 9; background: var(--uwa-grad);
}
.uwa-blog__ico {
  position: absolute; right: -12px; bottom: -18px;
  font-size: 6rem; color: rgba(255,255,255,0.16);
  transition: transform var(--uwa-duration) var(--uwa-ease);
}
.uwa-blog__card:hover .uwa-blog__ico { transform: scale(1.08) rotate(-6deg); }
.uwa-blog__cat {
  position: absolute; top: 1rem; left: 1rem; z-index: 2;
  font-size: var(--uwa-fs-small); font-weight: 500; color: var(--uwa-ink);
  background: rgba(255,255,255,0.94); backdrop-filter: blur(6px);
  padding: 0.35rem 0.9rem; border-radius: var(--uwa-r-full);
}
.uwa-blog__body { display: flex; flex-direction: column; flex: 1; padding: 1.5rem 1.6rem 1.7rem; }
.uwa-blog__meta { display: inline-flex; align-items: center; gap: 0.5rem; font-size: var(--uwa-fs-small); color: var(--uwa-t3); }
.uwa-blog__meta i { color: var(--uwa-blue); font-size: 0.9em; }
.uwa-blog__title { margin: 0.7rem 0 0.55rem; }
.uwa-blog__title a { transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-blog__card:hover .uwa-blog__title a { color: var(--uwa-blue); }
.uwa-blog__link { margin-top: auto; padding-top: 1rem; }

/* ===================== TESTIMONIALS ===================== */
.uwa-testimonials { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: var(--uwa-sp-xl); }
.uwa-testimonial { display: flex; flex-direction: column; gap: 1.1rem; }
.uwa-testimonial__stars { color: #F5A524; display: flex; gap: 3px; }
.uwa-testimonial__quote { font-size: 1.1rem; line-height: 1.6; color: var(--uwa-t1); }
.uwa-testimonial__author { display: flex; align-items: center; gap: 0.85rem; margin-top: auto; }
.uwa-testimonial__author strong { display: block; color: var(--uwa-t1); font-size: var(--uwa-fs-body); }
.uwa-testimonial__author .uwa-small { color: var(--uwa-t3); }
.uwa-testimonial__avatar {
  width: 46px; height: 46px; flex-shrink: 0; display: grid; place-items: center;
  border-radius: 50%; background: var(--uwa-grad); color: #fff;
  font-family: var(--uwa-fh); font-weight: 600; font-size: 1rem;
}

/* ===================== FAQ (accordion) ===================== */
.uwa-faq { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 4rem; align-items: start; }
.uwa-faq__intro { position: sticky; top: 110px; }
.uwa-faq__title { margin: 1rem 0; }
.uwa-faq__cta { margin-top: 1.9rem; }

.uwa-faq__list { display: flex; flex-direction: column; }
.uwa-faq__item { border-bottom: 1px solid var(--uwa-border); }
.uwa-faq__item:first-child { border-top: 1px solid var(--uwa-border); }
.uwa-faq__q {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  padding: 1.6rem 0.25rem; text-align: left;
  font-family: var(--uwa-fh); font-size: 1.15rem; font-weight: 600; color: var(--uwa-t1);
  transition: color var(--uwa-duration) var(--uwa-ease);
}
.uwa-faq__q:hover, .uwa-faq__item.is-open .uwa-faq__q { color: var(--uwa-blue); }
.uwa-faq__icon {
  flex-shrink: 0; width: 42px; height: 42px; display: grid; place-items: center;
  border-radius: 50%; background: var(--uwa-surface); border: 1px solid var(--uwa-border-ink);
  color: var(--uwa-t1); font-size: 0.9rem;
  transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease);
}
.uwa-faq__icon i { transition: transform var(--uwa-duration) var(--uwa-ease); }
.uwa-faq__item.is-open .uwa-faq__icon { background: var(--uwa-grad); color: #fff; border-color: transparent; }
.uwa-faq__item.is-open .uwa-faq__icon i { transform: rotate(45deg); }
.uwa-faq__a { overflow: hidden; max-height: 0; transition: max-height 0.42s var(--uwa-ease); }
.uwa-faq__a p { padding: 0 0.25rem 1.6rem; color: var(--uwa-t2); max-width: 46rem; }

/* ===================== CTA ===================== */
/* sections keep their symmetric 88px padding-block; this wrapper adds equal paper
   space above AND below the dark card so it floats evenly */
.uwa-cta-wrap { padding-block: var(--uwa-sp-xl); }
.uwa-cta {
  position: relative;
  border-radius: var(--uwa-r-xl);
  background: var(--uwa-grad-navy);
  overflow: hidden;
  text-align: center;
  padding: 5rem 1.5rem;
}
.uwa-cta__glow { position: absolute; top: -40%; right: -5%; width: 500px; height: 500px; background: radial-gradient(circle, rgba(39,192,240,0.32), transparent 65%); }
.uwa-cta__eyebrow { position: relative; z-index: 1; justify-content: center; color: #7fd7f6; }
.uwa-cta__eyebrow::before { background: var(--uwa-cyan); }
.uwa-cta__title { position: relative; z-index: 1; color: #fff; margin: 1.2rem 0; }
.uwa-cta__title .uwa-serif { color: #7fd7f6; }
.uwa-cta__text { position: relative; z-index: 1; color: var(--uwa-tw-soft); font-size: var(--uwa-fs-lead); max-width: 34rem; margin: 0 auto 2.2rem; }
.uwa-cta__actions { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }

/* ===================== ABOUT PAGE ===================== */
/* premium centered page hero */
.uwa-phero { position: relative; overflow: hidden; padding-top: calc(var(--uwa-nav-h) + 5rem); padding-bottom: 5rem; background: var(--uwa-bg); }
.uwa-phero__orb { position: absolute; z-index: 0; border-radius: 50%; pointer-events: none; filter: blur(10px); }
.uwa-phero__orb--a { top: -10%; left: -5%; width: 440px; height: 440px; background: radial-gradient(circle, rgba(39,192,240,0.18), transparent 62%); }
.uwa-phero__orb--b { bottom: -25%; right: -5%; width: 480px; height: 480px; background: radial-gradient(circle, rgba(36,86,230,0.16), transparent 62%); }
.uwa-phero__inner { position: relative; z-index: 1; }
.uwa-phero--center { text-align: center; }
.uwa-phero--center .uwa-phero__inner { max-width: 880px; margin-inline: auto; }
.uwa-breadcrumb { display: flex; align-items: center; gap: 0.6rem; font-size: var(--uwa-fs-small); color: var(--uwa-t3); margin-bottom: 1.5rem; }
.uwa-phero--center .uwa-breadcrumb { justify-content: center; }
.uwa-breadcrumb a { color: var(--uwa-t2); transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-breadcrumb a:hover { color: var(--uwa-blue); }
.uwa-breadcrumb i { font-size: 0.7em; color: var(--uwa-t3); }
.uwa-phero__eyebrow {
  display: inline-flex; align-items: center; gap: 0.6rem;
  font-size: var(--uwa-fs-small); font-weight: 500; color: var(--uwa-t1);
  background: var(--uwa-surface); border: 1px solid var(--uwa-border);
  border-radius: var(--uwa-r-full); padding: 0.5rem 1.15rem;
}
.uwa-phero__dot { width: 9px; height: 9px; border-radius: 50%; background: #22C55E; position: relative; }
.uwa-phero__dot::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2px solid rgba(34,197,94,0.4); animation: uwa-ping 1.8s var(--uwa-ease) infinite; }
.uwa-phero__title { margin: 1.6rem 0 1.3rem; letter-spacing: -0.03em; }
.uwa-phero__lead { max-width: 42rem; margin-inline: auto; }
.uwa-phero__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.2rem; justify-content: center; }
.uwa-phero__chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; margin-top: 2.75rem; }
.uwa-phero__chip {
  display: inline-flex; align-items: center; gap: 0.55rem;
  padding: 0.6rem 1.15rem; font-size: var(--uwa-fs-small); font-weight: 500; color: var(--uwa-t1);
  background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-full);
  transition: border-color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease);
}
.uwa-phero__chip i { color: var(--uwa-blue); }
.uwa-phero__chip:hover { border-color: var(--uwa-blue); transform: translateY(-2px); }

/* wide variant (About hero) — fills width, 2-line heading, ~80vh */
.uwa-phero--wide { min-height: 80vh; display: flex; align-items: center; padding-top: calc(var(--uwa-nav-h) + 0.25rem); padding-bottom: 1rem; }
.uwa-phero--wide .uwa-phero__inner { max-width: 1120px; }
.uwa-phero--wide .uwa-phero__title { max-width: none; font-size: clamp(2.3rem, 1.4rem + 2.8vw, 3.7rem); margin: 0.9rem 0 0.8rem; }
.uwa-phero--wide .uwa-phero__lead { font-size: 1.0625rem; max-width: 46rem; }
.uwa-phero--wide .uwa-phero__actions { margin-top: 1.4rem; }
.uwa-phero--wide .uwa-phero__chips { margin-top: 1.4rem; }

/* story split */
.uwa-story { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 4rem; align-items: stretch; }
.uwa-story__title { margin: 1rem 0 1.4rem; }
.uwa-story__content .uwa-body + .uwa-body { margin-top: 1rem; }
.uwa-checklist { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.9rem 1.5rem; margin: 1.9rem 0; }
.uwa-checklist li { display: flex; align-items: center; gap: 0.7rem; font-size: var(--uwa-fs-body); color: var(--uwa-t1); font-weight: 500; }
.uwa-checklist li i { color: var(--uwa-blue); font-size: 1.05rem; }
.uwa-story__cta { margin-top: 0.5rem; }
.uwa-story__panel { position: relative; background: var(--uwa-grad); border-radius: var(--uwa-r-xl); padding: 3rem 2.5rem; color: #fff; box-shadow: var(--uwa-shadow-lg); min-height: 340px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; }
.uwa-story__panel::after { content: ""; position: absolute; top: -25%; right: -20%; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,0.22), transparent 65%); }
.uwa-story__badge { position: absolute; top: 2.2rem; left: 2.5rem; width: 58px; height: 58px; display: grid; place-items: center; border-radius: 16px; background: rgba(255,255,255,0.18); font-size: 1.4rem; }
.uwa-story__panel-title { position: relative; z-index: 1; font-family: var(--uwa-fh); font-size: 1.95rem; font-weight: 600; line-height: 1.15; letter-spacing: -0.02em; }
.uwa-story__panel-text { position: relative; z-index: 1; margin-top: 0.9rem; color: rgba(255,255,255,0.9); font-size: var(--uwa-fs-body); max-width: 20rem; }
.uwa-story__dots { position: absolute; right: -22px; bottom: -22px; width: 130px; height: 130px; background-image: radial-gradient(rgba(255,255,255,0.25) 2px, transparent 2px); background-size: 16px 16px; }

/* premium statement band */
.uwa-statement { position: relative; overflow: hidden; background: var(--uwa-grad-navy); padding-block: var(--uwa-sp-2xl); }
.uwa-statement__glow { position: absolute; top: -30%; left: 50%; transform: translateX(-50%); width: 640px; height: 640px; border-radius: 50%; background: radial-gradient(circle, rgba(39,192,240,0.18), transparent 62%); pointer-events: none; }
.uwa-statement__inner { position: relative; z-index: 1; text-align: center; }
.uwa-statement__mark { display: block; font-family: var(--uwa-fh); font-weight: 700; font-size: 5rem; line-height: 0.5; color: var(--uwa-cyan); margin-bottom: 1.25rem; }
.uwa-statement__text { font-family: var(--uwa-fh); font-weight: 600; font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.5rem); line-height: 1.35; letter-spacing: -0.02em; color: #fff; }
.uwa-statement__text .uwa-accent-text { background: linear-gradient(100deg, #8FB8FF, #34D0FF); -webkit-background-clip: text; background-clip: text; color: transparent; }
.uwa-statement__by { display: block; margin-top: 1.75rem; font-size: var(--uwa-fs-body); font-weight: 500; color: var(--uwa-tw-soft); }

/* vision / mission / why-choose-us */
.uwa-vm { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: stretch; margin-top: var(--uwa-sp-xl); }

/* refined labels (replace the floating glow pills) */
.uwa-vpanel__label, .uwa-mpanel__label, .uwa-why__label {
  display: inline-flex; align-items: center; gap: 0.5rem; align-self: flex-start;
  padding: 0.5rem 1.05rem; border-radius: var(--uwa-r-full);
  font-family: var(--uwa-fh); font-weight: 600; font-size: var(--uwa-fs-small); letter-spacing: -0.01em;
  margin-bottom: 1.5rem;
}
.uwa-mpanel__label, .uwa-why__label { background: rgba(36,86,230,0.08); color: var(--uwa-blue); }
.uwa-vpanel__label { background: rgba(255,255,255,0.2); color: #fff; }

.uwa-vpanel { position: relative; overflow: hidden; background: var(--uwa-grad); border-radius: var(--uwa-r-xl); padding: 2.75rem; color: #fff; box-shadow: var(--uwa-shadow-lg); }
.uwa-vpanel::after { content: ""; position: absolute; top: -30%; right: -20%; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,0.2), transparent 65%); }
.uwa-vpanel > * { position: relative; z-index: 1; }
.uwa-vpanel__title { color: #fff; margin: 0 0 1rem; }
.uwa-vpanel__text { color: rgba(255,255,255,0.92); font-size: var(--uwa-fs-body); }

.uwa-mpanel { flex: 1; display: flex; flex-direction: column; background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-xl); padding: 2.75rem; box-shadow: var(--uwa-shadow-md); }
.uwa-mlist { display: flex; flex-direction: column; flex: 1; justify-content: space-between; gap: 1.15rem; }
.uwa-mlist li { display: flex; gap: 0.8rem; align-items: flex-start; font-size: var(--uwa-fs-body); color: var(--uwa-t2); }
.uwa-mlist li i { color: var(--uwa-blue); font-size: 1.15rem; margin-top: 0.1rem; flex-shrink: 0; }

/* why-choose-us: centered header + card grid */
.uwa-why-head { text-align: center; max-width: 640px; margin: var(--uwa-sp-2xl) auto var(--uwa-sp-xl); }
.uwa-why-head__title { margin-top: 1rem; }
.uwa-why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: var(--uwa-sp-xl); }
.uwa-wcard {
  position: relative; overflow: hidden;
  background: var(--uwa-surface); border: 1px solid var(--uwa-border);
  border-radius: var(--uwa-r-lg); padding: 2.1rem; box-shadow: var(--uwa-shadow-sm);
  transition: transform var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease);
}
.uwa-wcard::before { content: ""; position: absolute; inset: 0; z-index: 0; background: var(--uwa-grad); opacity: 0; transition: opacity var(--uwa-duration) var(--uwa-ease); }
.uwa-wcard > * { position: relative; z-index: 1; }
.uwa-wcard:hover { transform: translateY(-8px); box-shadow: var(--uwa-shadow-lg); border-color: transparent; }
.uwa-wcard:hover::before { opacity: 1; }
.uwa-wcard:hover h4, .uwa-wcard:hover .uwa-wcard__sub { color: #fff; }
.uwa-wcard:hover .uwa-body { color: rgba(255,255,255,0.9); }
.uwa-wcard__ico {
  width: 54px; height: 54px; display: grid; place-items: center; border-radius: 15px;
  background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1.25rem; margin-bottom: 1.2rem;
  transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease);
}
.uwa-wcard:hover .uwa-wcard__ico { background: rgba(255,255,255,0.18); color: #fff; transform: rotate(-6deg); }
.uwa-wcard h4 { transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-wcard__sub { display: block; margin: 0.35rem 0 0.7rem; font-size: var(--uwa-fs-small); font-weight: 500; color: var(--uwa-blue); transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-wcard .uwa-body { transition: color var(--uwa-duration) var(--uwa-ease); }

/* value cards — gradient-fill on hover */
.uwa-vgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: var(--uwa-sp-xl); }
.uwa-vcard {
  position: relative; overflow: hidden;
  background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-lg);
  padding: 2.1rem; box-shadow: var(--uwa-shadow-sm);
  transition: transform var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease);
}
.uwa-vcard::before { content: ""; position: absolute; inset: 0; z-index: 0; background: var(--uwa-grad); opacity: 0; transition: opacity var(--uwa-duration) var(--uwa-ease); }
.uwa-vcard > * { position: relative; z-index: 1; }
.uwa-vcard:hover { transform: translateY(-8px); box-shadow: var(--uwa-shadow-lg); border-color: transparent; }
.uwa-vcard:hover::before { opacity: 1; }
.uwa-vcard:hover h3 { color: #fff; }
.uwa-vcard:hover .uwa-body { color: rgba(255,255,255,0.9); }
.uwa-vcard__ico { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 15px; background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1.25rem; margin-bottom: 1.2rem; transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease); }
.uwa-vcard:hover .uwa-vcard__ico { background: rgba(255,255,255,0.18); color: #fff; transform: rotate(-6deg); }
.uwa-vcard h3 { margin-bottom: 0.5rem; transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-vcard .uwa-body { transition: color var(--uwa-duration) var(--uwa-ease); }

/* team */
.uwa-team { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-top: var(--uwa-sp-xl); }
.uwa-tcard { text-align: center; background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-lg); padding: 2.25rem 1.5rem; box-shadow: var(--uwa-shadow-sm); transition: transform var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease); }
.uwa-tcard:hover { transform: translateY(-8px); box-shadow: var(--uwa-shadow-lg); border-color: transparent; }
.uwa-tcard__avatar { width: 84px; height: 84px; margin: 0 auto 1.1rem; display: grid; place-items: center; border-radius: 50%; background: var(--uwa-grad); color: #fff; font-family: var(--uwa-fh); font-weight: 700; font-size: 1.6rem; letter-spacing: -0.02em; }
.uwa-tcard__name { font-family: var(--uwa-fh); font-weight: 600; font-size: 1.15rem; color: var(--uwa-t1); }
.uwa-tcard__role { margin-top: 0.2rem; font-size: var(--uwa-fs-small); color: var(--uwa-t3); }
.uwa-tcard__social { display: flex; justify-content: center; gap: 0.5rem; margin-top: 1.1rem; }
.uwa-tcard__social a { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: var(--uwa-surface-warm); border: 1px solid var(--uwa-border); color: var(--uwa-t2); transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease); }
.uwa-tcard__social a:hover { background: var(--uwa-grad); color: #fff; border-color: transparent; transform: translateY(-2px); }

/* steps */
.uwa-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; margin-top: var(--uwa-sp-xl); }
.uwa-step { position: relative; background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-lg); padding: 2rem 1.8rem; box-shadow: var(--uwa-shadow-sm); transition: transform var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease); }
.uwa-step:hover { transform: translateY(-6px); box-shadow: var(--uwa-shadow-md); }
.uwa-step__ico { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 14px; background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1.2rem; transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease); }
.uwa-step:hover .uwa-step__ico { background: var(--uwa-grad); color: #fff; transform: rotate(-6deg); }
.uwa-step__num { position: absolute; top: 1.5rem; right: 1.8rem; font-family: var(--uwa-fh); font-weight: 700; font-size: 1.8rem; letter-spacing: -0.02em; background: var(--uwa-grad); -webkit-background-clip: text; background-clip: text; color: transparent; opacity: 0.85; }
.uwa-step h3 { margin: 1.1rem 0 0.5rem; }

/* ===================== SERVICE DETAIL ===================== */
/* premium banner — dotted mesh masked toward the panel, softer vertical rhythm */
.uwa-phero:has(.uwa-sdhero) { padding-top: calc(var(--uwa-nav-h) + 4rem); padding-bottom: 4rem; }
.uwa-phero:has(.uwa-sdhero)::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: radial-gradient(rgba(36,86,230,0.07) 1.1px, transparent 1.1px);
  background-size: 24px 24px;
  -webkit-mask-image: radial-gradient(120% 90% at 88% 18%, #000 0%, transparent 60%);
  mask-image: radial-gradient(120% 90% at 88% 18%, #000 0%, transparent 60%);
}
.uwa-sdhero { position: relative; z-index: 1; display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 4rem; align-items: center; }
.uwa-sdhero__title { margin: 1.5rem 0 1.3rem; }
.uwa-sdhero__content .uwa-lead { max-width: 36rem; }
.uwa-sdhero__content .uwa-phero__actions { justify-content: flex-start; margin-top: 2.2rem; }

/* service banner = a creative, logo-forward composition (one brand per service) */
.uwa-sdhero__card { position: relative; background: none; border: none; box-shadow: none; padding: 0; }
.uwa-sdhero__card-ico { display: none; }
.uwa-sdhero__list { display: none; }

.uwa-sdcreative {
  --brand: #2456E6; --brand-grad: linear-gradient(145deg, #4E7BF0, #1E3FB0);
  position: relative; z-index: 1; width: 100%; min-height: 470px; overflow: hidden;
  display: grid; place-items: center; padding: 2.5rem;
  border-radius: var(--uwa-r-xl); border: 1px solid var(--uwa-border);
  background: linear-gradient(160deg, #fff, var(--uwa-surface-warm));
  box-shadow: 0 42px 95px -42px rgba(23,49,166,0.34);
}
/* dotted grid */
.uwa-sdcreative::before {
  content: ""; position: absolute; inset: 0; z-index: 0;
  background-image: radial-gradient(var(--uwa-border-ink) 1.2px, transparent 1.2px);
  background-size: 24px 24px; opacity: 0.55;
  -webkit-mask-image: radial-gradient(70% 70% at 50% 48%, #000 26%, transparent 74%);
  mask-image: radial-gradient(70% 70% at 50% 48%, #000 26%, transparent 74%);
}
/* brand-tinted glow blob */
.uwa-sdcreative::after {
  content: ""; position: absolute; z-index: 0; width: 300px; height: 300px; border-radius: 50%;
  top: -12%; right: -10%; background: var(--brand-grad); opacity: 0.16; filter: blur(34px);
}
/* dashed orbit ring */
.uwa-sdcreative__ring { position: absolute; z-index: 1; width: 264px; height: 264px; border-radius: 50%; border: 1.5px dashed var(--brand); opacity: 0.28; }
.uwa-sdcreative__ring::after { content: ""; position: absolute; inset: 34px; border-radius: 50%; border: 1.5px dashed var(--brand); opacity: 0.6; }
/* central brand logo tile */
.uwa-sdcreative__main {
  position: relative; z-index: 2; width: 132px; height: 132px; border-radius: 34px;
  display: grid; place-items: center; background: var(--brand-grad); color: #fff;
  box-shadow: 0 28px 58px -18px var(--brand), inset 0 2px 0 rgba(255,255,255,0.4);
  font-size: 3.6rem; font-weight: 700;
}
.uwa-sdcreative__main .uwa-sdcreative__wordmark { font-size: 2rem; letter-spacing: -0.02em; }
/* floating tool chips */
.uwa-sdcreative__chip {
  position: absolute; z-index: 3; width: 54px; height: 54px; border-radius: 16px;
  display: grid; place-items: center; background: #fff; border: 1px solid var(--uwa-border);
  box-shadow: var(--uwa-shadow-lg); color: var(--brand); font-size: 1.35rem;
}
.uwa-sdcreative__chip--1 { top: 13%; right: 15%; }
.uwa-sdcreative__chip--2 { bottom: 22%; left: 11%; }
.uwa-sdcreative__chip--3 { bottom: 15%; right: 20%; }
/* per-service brand palette */
.uwa-sdcreative--graphic   { --brand: #7C3AED; --brand-grad: linear-gradient(145deg, #A970FF, #6D28D9); }
.uwa-sdcreative--wordpress { --brand: #1E6A8E; --brand-grad: linear-gradient(145deg, #3AA0C9, #1B5E7E); }
.uwa-sdcreative--woo       { --brand: #7F54B3; --brand-grad: linear-gradient(145deg, #9B6FCB, #6D3FA3); }
.uwa-sdcreative--shopify   { --brand: #5E8E3E; --brand-grad: linear-gradient(145deg, #9BCB59, #557E37); }
.uwa-sdcreative--seo       { --brand: #3B76E0; --brand-grad: linear-gradient(145deg, #6BA0F7, #2F63C6); }
.uwa-sdcreative--content   { --brand: #0E8F8A; --brand-grad: linear-gradient(145deg, #23C3BD, #0C7D78); }
.uwa-sdcreative--ppc       { --brand: #0757DB; --brand-grad: linear-gradient(145deg, #3B87FF, #0546BC); }

/* floating status badge overlapping the panel */
.uwa-sdbadge {
  position: absolute; z-index: 4; left: -1.4rem; bottom: 2rem;
  display: inline-flex; align-items: center; gap: 0.55rem;
  padding: 0.7rem 1.1rem; border-radius: var(--uwa-r-full);
  background: #fff; border: 1px solid var(--uwa-border);
  box-shadow: var(--uwa-shadow-lg); font-size: 0.85rem; font-weight: 600; color: var(--uwa-t1);
}
.uwa-sdbadge i { color: #28c840; }

/* tech pills */
.uwa-techwrap { display: flex; flex-wrap: wrap; gap: 0.85rem; justify-content: center; max-width: 920px; margin: var(--uwa-sp-xl) auto 0; }
.uwa-techwrap .uwa-pill { font-size: var(--uwa-fs-body); padding: 0.7rem 1.35rem; }
.uwa-techwrap .uwa-pill i { color: var(--uwa-blue); }

/* industries */
.uwa-ind-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; margin-top: var(--uwa-sp-xl); }
.uwa-ind { display: flex; align-items: center; gap: 1rem; background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-md); padding: 1.4rem 1.5rem; box-shadow: var(--uwa-shadow-sm); transition: transform var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease); }
.uwa-ind:hover { transform: translateY(-4px); box-shadow: var(--uwa-shadow-md); border-color: transparent; }
.uwa-ind__ico { flex-shrink: 0; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1.1rem; transition: background var(--uwa-duration) var(--uwa-ease), color var(--uwa-duration) var(--uwa-ease); }
.uwa-ind:hover .uwa-ind__ico { background: var(--uwa-grad); color: #fff; }
.uwa-ind__label { font-family: var(--uwa-fh); font-weight: 600; font-size: var(--uwa-fs-body); color: var(--uwa-t1); }

/* ===================== BLOG FEATURED ===================== */
.uwa-feat { display: grid; grid-template-columns: 1fr 1.1fr; align-items: stretch; background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-lg); overflow: hidden; box-shadow: var(--uwa-shadow-sm); transition: transform var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease); }
.uwa-feat:hover { transform: translateY(-6px); box-shadow: var(--uwa-shadow-lg); border-color: transparent; }
.uwa-feat__media { position: relative; overflow: hidden; min-height: 340px; background: var(--uwa-grad); }
.uwa-feat__ico { position: absolute; right: -14px; bottom: -22px; font-size: 8rem; color: rgba(255,255,255,0.16); }
.uwa-feat__cat { position: absolute; top: 1.2rem; left: 1.2rem; z-index: 2; font-size: var(--uwa-fs-small); font-weight: 500; color: var(--uwa-ink); background: rgba(255,255,255,0.94); padding: 0.4rem 1rem; border-radius: var(--uwa-r-full); }
.uwa-feat__body { padding: 2.75rem; display: flex; flex-direction: column; justify-content: center; }
.uwa-feat__title { margin: 0.8rem 0 0.9rem; transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-feat:hover .uwa-feat__title { color: var(--uwa-blue); }
.uwa-feat__link { margin-top: 1.3rem; }

/* ===================== ARTICLE (blog detail) ===================== */
.uwa-arthero { position: relative; z-index: 1; text-align: center; max-width: 800px; margin-inline: auto; }
.uwa-arthero__title { margin: 1.3rem 0 1.5rem; }
.uwa-artmeta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.9rem; font-size: var(--uwa-fs-small); color: var(--uwa-t2); }
.uwa-artmeta i { color: var(--uwa-blue); margin-right: 0.3rem; }
.uwa-artmeta__author { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: 500; color: var(--uwa-t1); }
.uwa-artmeta__avatar { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--uwa-grad); color: #fff; font-size: 0.8rem; font-weight: 600; }
.uwa-artmeta__dot { width: 4px; height: 4px; border-radius: 50%; background: var(--uwa-border-ink); }

.uwa-article { display: grid; grid-template-columns: 250px 1fr; gap: 3.5rem; align-items: start; }
.uwa-toc { position: sticky; top: 110px; }
.uwa-toc__title { font-size: var(--uwa-fs-label); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--uwa-t3); margin-bottom: 1rem; }
.uwa-toc__nav { display: flex; flex-direction: column; border-left: 2px solid var(--uwa-border); }
.uwa-toc__link { padding: 0.5rem 0 0.5rem 1.1rem; margin-left: -2px; border-left: 2px solid transparent; font-size: var(--uwa-fs-small); color: var(--uwa-t2); transition: color var(--uwa-duration) var(--uwa-ease), border-color var(--uwa-duration) var(--uwa-ease); }
.uwa-toc__link:hover { color: var(--uwa-blue); }
.uwa-toc__link.is-active { color: var(--uwa-blue); border-left-color: var(--uwa-blue); font-weight: 500; }
.uwa-toc__cta { margin-top: 1.75rem; }

.uwa-prose { max-width: 720px; }
.uwa-prose__lead { font-size: var(--uwa-fs-lead); color: var(--uwa-t1); line-height: 1.6; margin-bottom: 1.5rem; }
.uwa-prose h2 { font-size: var(--uwa-fs-h3); margin: 2.6rem 0 1rem; scroll-margin-top: 100px; }
.uwa-prose p { font-size: var(--uwa-fs-body); color: var(--uwa-t2); line-height: 1.8; margin-bottom: 1.2rem; }
.uwa-prose ul { display: flex; flex-direction: column; gap: 0.6rem; margin-bottom: 1.4rem; }
.uwa-prose ul li { position: relative; padding-left: 1.6rem; font-size: var(--uwa-fs-body); color: var(--uwa-t2); line-height: 1.7; }
.uwa-prose ul li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 7px; height: 7px; border-radius: 50%; background: var(--uwa-grad); }
.uwa-prose blockquote { margin: 1.9rem 0; padding: 1.3rem 1.6rem; border-left: 3px solid var(--uwa-blue); background: var(--uwa-surface-warm); border-radius: 0 var(--uwa-r-md) var(--uwa-r-md) 0; font-size: 1.15rem; line-height: 1.55; color: var(--uwa-t1); font-weight: 500; }
.uwa-prose em { font-style: italic; }
.uwa-prose strong { color: var(--uwa-t1); font-weight: 600; }
.uwa-prose__end { margin-top: 2.75rem; padding: 2rem 2.2rem; background: var(--uwa-surface-warm); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-lg); }
.uwa-prose__end p { margin-bottom: 1.3rem; }

/* ===================== CONTACT ===================== */
.uwa-contact { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 3.5rem; align-items: start; }
.uwa-contact__title { margin: 1rem 0; }
.uwa-cinfo { display: flex; flex-direction: column; gap: 1.25rem; margin: 1.9rem 0; }
.uwa-cinfo li { display: flex; gap: 1rem; align-items: center; }
.uwa-cinfo__ico { flex-shrink: 0; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; background: rgba(36,86,230,0.08); color: var(--uwa-blue); font-size: 1.1rem; }
.uwa-cinfo__label { display: block; font-size: var(--uwa-fs-small); color: var(--uwa-t3); }
.uwa-cinfo__val { display: block; font-family: var(--uwa-fh); font-weight: 600; color: var(--uwa-t1); }
a.uwa-cinfo__val { transition: color var(--uwa-duration) var(--uwa-ease); }
a.uwa-cinfo__val:hover { color: var(--uwa-blue); }
.uwa-contact__social { margin-top: 0.5rem; }
.uwa-contact__social a { background: var(--uwa-surface-warm); border: 1px solid var(--uwa-border); color: var(--uwa-t2); }
.uwa-contact__formwrap { background: var(--uwa-surface); border: 1px solid var(--uwa-border); border-radius: var(--uwa-r-xl); padding: 2.75rem; box-shadow: var(--uwa-shadow-md); }
.uwa-contact__formsub { color: var(--uwa-t3); margin: 0.3rem 0 1.75rem; }
.uwa-form { display: flex; flex-direction: column; gap: 1.25rem; }
.uwa-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.uwa-form__field { display: flex; flex-direction: column; gap: 0.5rem; }
.uwa-form__field label { font-size: var(--uwa-fs-small); font-weight: 500; color: var(--uwa-t1); }
.uwa-input { width: 100%; padding: 0.85rem 1.1rem; font-size: var(--uwa-fs-body); font-family: var(--uwa-fb); color: var(--uwa-t1); background: var(--uwa-surface-warm); border: 1px solid var(--uwa-border-ink); border-radius: var(--uwa-r-md); transition: border-color var(--uwa-duration) var(--uwa-ease), box-shadow var(--uwa-duration) var(--uwa-ease); }
.uwa-input::placeholder { color: var(--uwa-t3); }
.uwa-input:focus { outline: none; border-color: var(--uwa-blue); box-shadow: 0 0 0 3px rgba(36,86,230,0.12); }
textarea.uwa-input { resize: vertical; min-height: 110px; }
.uwa-form__submit { align-self: flex-start; margin-top: 0.5rem; }

/* ===================== FOOTER ===================== */
.uwa-footer { background: var(--uwa-bg-dark); color: var(--uwa-tw-soft); padding-top: var(--uwa-sp-2xl); }
.uwa-footer__top { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.4fr; gap: 2.5rem; padding-bottom: 3rem; border-bottom: 1px solid var(--uwa-border-dark); }
.uwa-footer__logo { height: 36px; width: auto; margin-bottom: 1.2rem; filter: brightness(0) invert(1); }
.uwa-footer__tagline { color: var(--uwa-tw-soft); max-width: 20rem; }
.uwa-footer__social { display: flex; gap: 0.75rem; margin-top: 1.6rem; }
.uwa-footer__social a {
  width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%;
  background: rgba(255,255,255,0.08); color: #fff;
  transition: background var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease);
}
.uwa-footer__social a:hover { background: var(--uwa-grad); transform: translateY(-3px); }
.uwa-footer__heading { color: #fff; font-family: var(--uwa-fh); font-size: 1.05rem; font-weight: 600; margin-bottom: 1.2rem; }
.uwa-footer__col { display: flex; flex-direction: column; gap: 0.8rem; }
.uwa-footer__col a, .uwa-footer__addr {
  font-size: var(--uwa-fs-body); color: var(--uwa-tw-soft);
  display: flex; align-items: center; gap: 0.6rem;
  transition: color var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease);
}
.uwa-footer__col a:hover { color: #fff; transform: translateX(4px); }
.uwa-footer__col--contact a i, .uwa-footer__addr i { color: var(--uwa-cyan); width: 18px; }
.uwa-footer__bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding: 1.75rem 0; }
.uwa-footer__bottom .uwa-small { color: var(--uwa-tw-soft); }
.uwa-footer__legal { display: flex; gap: 1.5rem; }
.uwa-footer__legal a { font-size: var(--uwa-fs-small); color: var(--uwa-tw-soft); transition: color var(--uwa-duration) var(--uwa-ease); }
.uwa-footer__legal a:hover { color: #fff; }

/* ===================== BACK TO TOP ===================== */
.uwa-totop {
  position: fixed; right: 1.5rem; bottom: 1.5rem;
  width: 50px; height: 50px; display: grid; place-items: center;
  border-radius: 50%; background: var(--uwa-grad); color: #fff; font-size: 1rem;
  box-shadow: var(--uwa-shadow-glow);
  opacity: 0; visibility: hidden; transform: translateY(12px);
  transition: opacity var(--uwa-duration) var(--uwa-ease), transform var(--uwa-duration) var(--uwa-ease), visibility var(--uwa-duration);
  z-index: 90;
}
.uwa-totop.is-visible { opacity: 1; visibility: visible; transform: none; }
.uwa-totop:hover { transform: translateY(-3px); }

/* ===================== UTILITY PAGES (404 / thank-you / legal) ===================== */
/* big status icon medallion (thank-you / 404) */
.uwa-util__ico {
  width: 96px; height: 96px; display: grid; place-items: center; margin: 0 auto 2rem;
  border-radius: 28px; background: var(--uwa-grad); color: #fff; font-size: 2.6rem;
  box-shadow: var(--uwa-shadow-glow);
}
/* oversized 404 numerals */
.uwa-errnum {
  font-size: clamp(6rem, 3rem + 16vw, 12rem); line-height: 0.95; font-weight: 600;
  letter-spacing: -0.05em; margin: 0.5rem 0 1rem;
}
/* the headline under the numerals is a plain .uwa-h2 (not .uwa-phero__title),
   so it carries no margin of its own — give it room before the lead paragraph */
.uwa-errnum + .uwa-h2 { margin-bottom: var(--uwa-sp-lg); }
/* legal document column */
.uwa-legal { max-width: 760px; margin-inline: auto; }
.uwa-legal__meta { display: block; margin-bottom: 2.4rem; padding-bottom: 1.6rem; border-bottom: 1px solid var(--uwa-border); font-size: var(--uwa-fs-small); color: var(--uwa-t3); }
.uwa-legal .uwa-prose { max-width: none; }
.uwa-legal .uwa-prose h2:first-of-type { margin-top: 0; }